@dsh-plus/llm-pi 0.1.40 → 0.1.41

package/lib/client.js

@@ -12,9 +12,72 @@ window.__ModuleLoader__.load({
 			kind: "idle",
 			text: ""
 		};
+		/** 状态行 + 动作按钮（两种形态共用，类名随形态切换度量）。 */
+		function CardFoot(props) {
+			const p = props.prefix;
+			const section = props.variant === "section";
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: section ? `${p}-sectionFooter` : `${p}-footer`,
+				children: [props.status !== void 0 && props.status.kind !== "idle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: `${p}-status${props.status.kind === "error" ? ` ${p}-statusError` : ""}`,
+					role: "status",
+					children: props.status.text
+				}) : null, props.actions.map((action) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+					type: "button",
+					className: `${p}-btn ${action.variant === "primary" ? `${p}-btnPrimary` : `${p}-btnGhost`}`,
+					disabled: action.disabled === true,
+					onClick: action.onClick,
+					children: action.label
+				}, action.key))]
+			});
+		}
+		/** 只读提示 + 字段区 + 页脚（两种形态共用）。 */
+		function CardBody(props) {
+			const p = props.prefix;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				props.readOnlyNotice !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: `${p}-readOnly`,
+					role: "status",
+					children: props.readOnlyNotice
+				}) : null,
+				props.children,
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CardFoot, { ...props })
+			] });
+		}
 		function CardChrome(props) {
 			const p = props.prefix;
 			const badge = props.statusBadge;
+			if (props.variant === "section") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				className: `${p}-section`,
+				"aria-label": props.title,
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: `${p}-sectionHead`,
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h3", {
+								className: `${p}-sectionTitle`,
+								children: props.title
+							}),
+							badge !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: `${p}-sectionBadge ${badge.on ? `${p}-statusOn` : `${p}-statusOff`}`,
+								children: badge.text
+							}) : null,
+							props.dirty ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: `${p}-pending`,
+								children: props.dirtyLabel
+							}) : null
+						]
+					}),
+					props.description === "" ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+						className: `${p}-sectionDesc`,
+						children: props.description
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: `${p}-sectionBody`,
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CardBody, { ...props })
+					})
+				]
+			});
 			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("li", {
 				className: `${p}-card${props.open ? ` ${p}-cardOpen` : ""}`,
 				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
@@ -44,38 +107,44 @@ window.__ModuleLoader__.load({
 						}) : null,
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconChevronDownOutlineRegular, { className: `${p}-chevron${props.open ? ` ${p}-chevronOpen` : ""}` })
 					]
-				}), props.open ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				}), props.open ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 					className: `${p}-body`,
-					children: [
-						props.readOnlyNotice !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-							className: `${p}-readOnly`,
-							role: "status",
-							children: props.readOnlyNotice
-						}) : null,
-						props.children,
-						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-							className: `${p}-footer`,
-							children: [props.status !== void 0 && props.status.kind !== "idle" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-								className: `${p}-status${props.status.kind === "error" ? ` ${p}-statusError` : ""}`,
-								role: "status",
-								children: props.status.text
-							}) : null, props.actions.map((action) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-								type: "button",
-								className: `${p}-btn ${action.variant === "primary" ? `${p}-btnPrimary` : `${p}-btnGhost`}`,
-								disabled: action.disabled === true,
-								onClick: action.onClick,
-								children: action.label
-							}, action.key))]
-						})
-					]
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CardBody, { ...props })
 				}) : null]
 			});
 		}
+		/** 取值未到达时的占位：与 CardChrome 同形态，避免宿主页里闪一次卡片外壳。 */
+		function CardLoading(props) {
+			if (props.variant === "section") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
+				className: `${props.prefix}-section`,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: `${props.prefix}-readOnly`,
+					role: "status",
+					children: props.text
+				})
+			});
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
+				className: `${props.prefix}-card`,
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: `${props.prefix}-readOnly`,
+					role: "status",
+					children: props.text
+				})
+			});
+		}
 		//#endregion
 		//#region ../shared/src/client/config-slots.ts
 		/** dsh-plus 聚合 bundle 的包名（各插件 row 均经其补丁层插入 profile）。 */
 		const DSH_PLUS_BUNDLE = "@dsh-plus/bundle-main";
 		/**
+		* 视图 → 外壳形态：插件页 page 视图渲染在官方页面容器内（宿主已画标题、图标、
+		* 面包屑与页面级内边距），再套卡片会形成卡片套卡片并压缩移动端可用宽度，
+		* 故用无边框分节；summary 与 legacy 槽位保持卡片形态。
+		*/
+		function cardVariantFor(view) {
+			return view === "page" ? "section" : "card";
+		}
+		/**
 		* 把一张配置卡片同时注册进 legacy 与新版三个槽位。
 		* 任一槽位在当前 dsh 版本未声明时对应 inject 挂起等待，版本不命中即 no-op。
 		*/
@@ -101,6 +170,17 @@ window.__ModuleLoader__.load({
 			}, reg.component));
 		}
 		//#endregion
+		//#region ../shared/src/client/draft.ts
+		/**
+		* 单命名空间 staged 草稿（简单配置卡片共用）：读 scope 快照、播种草稿、
+		* 脏判定、保存（revision fencing + 重新装载）与状态行。
+		*
+		* 语义与官方 staged 表单一致：Host 更新不覆盖在途编辑，只有保存才写回；
+		* 保存成功后按 Host 解析值重置草稿。`from`/`patch` 参与 effect 与 useMemo
+		* 依赖，必须是模块级稳定函数（不要内联箭头函数）。
+		* @module @dsh-plus/shared/client/draft
+		*/
+		//#endregion
 		//#region ../shared/src/client/fields.tsx
 		function TextField$1(props) {
 			const p = props.prefix ?? "dshp";
@@ -304,6 +384,9 @@ window.__ModuleLoader__.load({
 		* - 窄屏 input/textarea 16px（防 iOS 聚焦缩放）、可点目标 ≥44px；
 		* - footer 按钮等宽换行、状态文字独占一行；
 		* - 展开态 body 底部 sticky 保存栏（长表单滚动中始终可达）。
+		* - 分节形态（-section，插件页 page 视图内嵌宿主页面）：无边框/背景、横向零
+		*   内边距，页脚不 sticky——官方插件页已提供页面级内边距，再叠一层卡片会
+		*   缩窄移动端可用宽度（卡片套卡片）。
 		* 沿用官方 data-plugin / data-plugin-css 约定（HMR 据此卸载），不覆盖上游选择器。
 		* @module @dsh-plus/shared/client/styles
 		*/
@@ -350,6 +433,15 @@ window.__ModuleLoader__.load({
 .${prefix}-checkRow input:checked::after{left:16px;background:var(--dsw-alias-bg-base)}
 .${prefix}-checkRow input:disabled{opacity:.4;cursor:default}
 .${prefix}-checkRow input:focus-visible{outline:2px solid var(--dsw-alias-brand-primary);outline-offset:2px}
+/* 宿主内嵌分节形态（插件页 page 视图）：官方设置页同构——无边框/背景，
+   横向零内边距（宽度交给宿主页面容器），小节标题 13px/600，页脚非 sticky。 */
+.${prefix}-section{box-sizing:border-box;flex-direction:column;width:100%;min-width:0;padding:16px 0;display:flex}
+.${prefix}-sectionHead{align-items:center;gap:8px;min-width:0;display:flex}
+.${prefix}-sectionTitle{min-width:0;color:var(--dsw-alias-label-primary);flex:1;margin:0;font-size:13px;font-weight:600;line-height:1.5}
+.${prefix}-sectionBadge{white-space:nowrap;border-radius:999px;flex:none;padding:1px 8px;font-size:11px;font-weight:500;line-height:17px}
+.${prefix}-sectionDesc{color:var(--dsw-alias-label-tertiary);margin:4px 0 0;font-size:12px;line-height:1.5}
+.${prefix}-sectionBody{flex-direction:column;min-width:0;display:flex}
+.${prefix}-sectionFooter{align-items:center;gap:8px;padding-top:16px;display:flex;flex-wrap:wrap}
 .${prefix}-groupLabel{color:var(--dsw-alias-label-secondary);font-size:12px;font-weight:600;padding:12px 0 2px;margin:0}
 .${prefix}-readOnly{color:var(--dsw-alias-label-tertiary);margin:12px 0 0;font-size:12px;line-height:1.5}
 .${prefix}-warn{color:var(--dsw-alias-label-error);margin:12px 0 0;font-size:12px;line-height:1.5}
@@ -371,6 +463,8 @@ window.__ModuleLoader__.load({
 .${prefix}-status{flex-basis:100%;flex:none}
 .${prefix}-btn{min-height:44px;flex:1;min-width:96px}
 .${prefix}-statusBadge{display:none}
+.${prefix}-sectionBadge{display:inline-block}
+.${prefix}-sectionFooter{position:static}
 }
 @media (pointer:coarse){
 .${prefix}-btn{min-height:44px}
@@ -621,6 +715,17 @@ ${extra}
 			for (const [key, value] of Object.entries(wire)) if (!known.has(key) && value !== void 0) out[key] = value;
 			return out;
 		}
+		/**
+		* JSON 文本框值 → extra 映射。
+		* `undefined`（空文本）表示清空为 `{}`；合法但非对象的 JSON（数组/标量/null）
+		* 返回 undefined，调用方据此忽略这次编辑——extra 是「其余 wire 字段」的映射，
+		* 静默丢弃已配置字段比拒绝一次编辑更糟。
+		*/
+		function extraOfJson(value) {
+			if (value === void 0) return {};
+			if (typeof value !== "object" || value === null || Array.isArray(value)) return void 0;
+			return { ...value };
+		}
 		function modelDraftFromWire(model) {
 			return {
 				id: model.id,
@@ -775,6 +880,79 @@ ${extra}
 			};
 		}
 		//#endregion
+		//#region src/client/root-fields.tsx
+		/**
+		* 「LLM 路由」卡片的根字段组：总开关、目录端点/刷新间隔/代理，以及运行期诊断行
+		* （kitSource 与 models-dev 快照状态，来自模型目录端点而非配置数据）。
+		* @module llm-pi/client/root-fields
+		*/
+		/** models-dev 状态行文案（缺席/错误/未拉取/正常四态）。 */
+		function modelsDevText(status, t) {
+			if (status === null) return t("modelsDevEmpty");
+			if (status.error !== null) return `${t("modelsDevError")}${status.error}`;
+			if (status.fetchedAt === null) return t("modelsDevEmpty");
+			return `${t("modelsDevStatusLine")}：${status.providers} 个 provider，快照 ${status.fetchedAt}`;
+		}
+		function RootFields(props) {
+			const { t, draft, disabled, onEdit } = props;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckRow, {
+					prefix: "lpc",
+					id: "lpc-enabled",
+					label: t("enabled"),
+					checked: draft.enabled,
+					disabled,
+					onEdit: (value) => onEdit({ enabled: value })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextField$1, {
+					prefix: "lpc",
+					id: "lpc-catalogUrl",
+					label: t("catalogUrl"),
+					hint: t("catalogUrlHint"),
+					value: draft.catalogUrl,
+					disabled,
+					onEdit: (value) => onEdit({ catalogUrl: value })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextField$1, {
+					prefix: "lpc",
+					id: "lpc-catalogRefresh",
+					label: t("catalogRefreshHours"),
+					hint: t("catalogRefreshHoursHint"),
+					value: draft.catalogRefreshHours,
+					numeric: true,
+					disabled,
+					invalid: !numTextOk(draft.catalogRefreshHours),
+					invalidLabel: t("invalidNumber"),
+					onEdit: (value) => onEdit({ catalogRefreshHours: value })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextField$1, {
+					prefix: "lpc",
+					id: "lpc-catalogProxy",
+					label: t("catalogProxy"),
+					hint: t("catalogProxyHint"),
+					value: draft.catalogProxy,
+					disabled,
+					onEdit: (value) => onEdit({ catalogProxy: value })
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+					className: "lpc-statusRow",
+					children: [
+						t("kitSource"),
+						"：",
+						props.kitSource ?? ""
+					]
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "lpc-statusRow",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
+						t("modelsDevStatus"),
+						"：",
+						modelsDevText(props.modelsDevStatus, t)
+					] })
+				})
+			] });
+		}
+		//#endregion
 		//#region src/client/fields.tsx
 		/**
 		* llm-pi 特有卡片控件：可折叠小节、键值对编辑、JSON 文本框、带 datalist 的
@@ -1354,6 +1532,20 @@ ${extra}
 						wide: true,
 						t,
 						onEdit: (compat) => props.onPatch({ compat })
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(JsonField, {
+						id: `${id}-extra`,
+						label: t("extraFields"),
+						hint: t("extraFieldsHint"),
+						invalidText: t("invalidJson"),
+						value: Object.keys(model.extra).length === 0 ? void 0 : model.extra,
+						epoch: props.epoch,
+						disabled: props.disabled === true,
+						wide: true,
+						onEdit: (extra) => {
+							const next = extraOfJson(extra);
+							if (next !== void 0) props.onPatch({ extra: next });
+						}
 					})
 				]
 			});
@@ -1716,26 +1908,43 @@ ${extra}
 							id: `${id}-advanced`,
 							title: t("advancedGroup"),
 							defaultOpen: false,
-							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(JsonField, {
-								id: `${id}-retry`,
-								label: t("retryPolicy"),
-								hint: t("retryPolicyHint"),
-								invalidText: t("invalidJson"),
-								value: draft.retryPolicy,
-								epoch: props.epoch,
-								disabled: props.disabled === true,
-								wide: true,
-								onEdit: (retryPolicy) => props.onPatch({ retryPolicy })
-							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CompatEditor, {
-								idPrefix: `${id}-compat`,
-								api: draft.api,
-								compat: draft.compat,
-								epoch: props.epoch,
-								disabled: props.disabled === true,
-								wide: true,
-								t,
-								onEdit: (compat) => props.onPatch({ compat })
-							})]
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(JsonField, {
+									id: `${id}-extra`,
+									label: t("extraFields"),
+									hint: t("extraFieldsHint"),
+									invalidText: t("invalidJson"),
+									value: Object.keys(draft.extra).length === 0 ? void 0 : draft.extra,
+									epoch: props.epoch,
+									disabled: props.disabled === true,
+									wide: true,
+									onEdit: (extra) => {
+										const next = extraOfJson(extra);
+										if (next !== void 0) props.onPatch({ extra: next });
+									}
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(JsonField, {
+									id: `${id}-retry`,
+									label: t("retryPolicy"),
+									hint: t("retryPolicyHint"),
+									invalidText: t("invalidJson"),
+									value: draft.retryPolicy,
+									epoch: props.epoch,
+									disabled: props.disabled === true,
+									wide: true,
+									onEdit: (retryPolicy) => props.onPatch({ retryPolicy })
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CompatEditor, {
+									idPrefix: `${id}-compat`,
+									api: draft.api,
+									compat: draft.compat,
+									epoch: props.epoch,
+									disabled: props.disabled === true,
+									wide: true,
+									t,
+									onEdit: (compat) => props.onPatch({ compat })
+								})
+							]
 						}),
 						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ModelsTable, {
 							route,
@@ -1763,11 +1972,83 @@ ${extra}
 		* 目录，见 views/）。外壳与基础控件走 @dsh-plus/shared/client 套件。
 		* @module llm-pi/client/card
 		*/
-		function modelsDevText(status, t) {
-			if (status === null) return t("modelsDevEmpty");
-			if (status.error !== null) return `${t("modelsDevError")}${status.error}`;
-			if (status.fetchedAt === null) return t("modelsDevEmpty");
-			return `${t("modelsDevStatusLine")}：${status.providers} 个 provider，快照 ${status.fetchedAt}`;
+		/** 运行期诊断行数据来源：模型目录端点（compat 字段表同批安装）。 */
+		function useRuntimeDiagnostics() {
+			const [kitSource, setKitSource] = (0, react.useState)(null);
+			const [modelsDevStatus, setModelsDevStatus] = (0, react.useState)(null);
+			(0, react.useEffect)(() => {
+				let alive = true;
+				fetchCatalog("", "models-dev").then((result) => {
+					if (!alive) return;
+					setKitSource(result.kitSource ?? null);
+					setModelsDevStatus(result.status ?? null);
+					if (result.compat !== void 0) installCompatFields(result.compat.fields);
+				}).catch(() => {});
+				return () => {
+					alive = false;
+				};
+			}, []);
+			return {
+				kitSource,
+				modelsDevStatus,
+				setModelsDevStatus
+			};
+		}
+		/** 路由级草稿改写：改字段 / 新增 route / 删除 route（返回新草稿，不改入参）。 */
+		function withProviderPatch(draft, route, patch) {
+			const current = draft.providers[route] ?? emptyProviderDraft();
+			return {
+				...draft,
+				providers: {
+					...draft.providers,
+					[route]: {
+						...current,
+						...patch
+					}
+				}
+			};
+		}
+		function withNewRoute(draft, key) {
+			return {
+				...draft,
+				providers: {
+					...draft.providers,
+					[key]: emptyProviderDraft()
+				}
+			};
+		}
+		function withoutRoute(draft, route) {
+			const next = { ...draft.providers };
+			delete next[route];
+			return {
+				...draft,
+				providers: next
+			};
+		}
+		/** 卡片动作：手动拉取目录、放弃、保存。 */
+		function cardActions(options) {
+			const { t } = options;
+			return [
+				{
+					key: "refresh",
+					label: t(options.refreshing ? "refreshingCatalog" : "refreshCatalog"),
+					disabled: options.disabled || options.refreshing,
+					onClick: options.onRefresh
+				},
+				{
+					key: "discard",
+					label: t("discard"),
+					disabled: !options.dirty || options.saving,
+					onClick: options.onDiscard
+				},
+				{
+					key: "save",
+					label: t(options.saving ? "saving" : "save"),
+					variant: "primary",
+					disabled: !options.dirty || options.invalid || options.saving || options.disabled,
+					onClick: options.onSave
+				}
+			];
 		}
 		function LlmPiCard(props) {
 			const { t, scope, api } = props;
@@ -1776,71 +2057,36 @@ ${extra}
 			const [open, setOpen] = (0, react.useState)(props.view === "page");
 			const [draft, setDraft] = (0, react.useState)(null);
 			const [epoch, setEpoch] = (0, react.useState)(0);
-			const [kitSource, setKitSource] = (0, react.useState)(null);
-			const [modelsDevStatus, setModelsDevStatus] = (0, react.useState)(null);
 			const [saving, setSaving] = (0, react.useState)(false);
 			const [refreshing, setRefreshing] = (0, react.useState)(false);
 			const [status, setStatus] = (0, react.useState)(IDLE_STATUS);
+			const { kitSource, modelsDevStatus, setModelsDevStatus } = useRuntimeDiagnostics();
 			(0, react.useEffect)(() => {
 				if (value === void 0 || draft !== null) return;
 				setDraft(draftFromValue(value));
 			}, [value, draft]);
-			(0, react.useEffect)(() => {
-				let alive = true;
-				fetchCatalog("", "models-dev").then((result) => {
-					if (!alive) return;
-					setKitSource(result.kitSource ?? null);
-					setModelsDevStatus(result.status ?? null);
-					if (result.compat !== void 0) installCompatFields(result.compat.fields);
-				}).catch(() => {});
-				return () => {
-					alive = false;
-				};
-			}, []);
 			const dirty = (0, react.useMemo)(() => value !== void 0 && draft !== null && JSON.stringify(toPatch(draft)) !== JSON.stringify(toPatch(draftFromValue(value))), [value, draft]);
 			const invalid = (0, react.useMemo)(() => {
 				if (draft === null) return false;
 				return !numTextOk(draft.catalogRefreshHours) || Object.values(draft.providers).some((provider) => provider.models.some((model) => model.id.trim() === ""));
 			}, [draft]);
 			if (props.view === "summary") return t("summaryLine");
-			if (value === void 0 || draft === null) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("li", {
-				className: "lpc-card",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-					className: "lpc-readOnly",
-					children: t("loading")
-				})
+			const variant = cardVariantFor(props.view);
+			if (value === void 0 || draft === null) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CardLoading, {
+				prefix: "lpc",
+				variant,
+				text: t("loading")
 			});
 			const setProvider = (route, patch) => {
-				const current = draft.providers[route] ?? emptyProviderDraft();
-				setDraft({
-					...draft,
-					providers: {
-						...draft.providers,
-						[route]: {
-							...current,
-							...patch
-						}
-					}
-				});
+				setDraft(withProviderPatch(draft, route, patch));
 				setStatus(IDLE_STATUS);
 			};
 			const onAddRoute = (key) => {
-				setDraft({
-					...draft,
-					providers: {
-						...draft.providers,
-						[key]: emptyProviderDraft()
-					}
-				});
+				setDraft(withNewRoute(draft, key));
 				setStatus(IDLE_STATUS);
 			};
 			const onRemoveRoute = (route) => {
-				const next = { ...draft.providers };
-				delete next[route];
-				setDraft({
-					...draft,
-					providers: next
-				});
+				setDraft(withoutRoute(draft, route));
 				setStatus(IDLE_STATUS);
 			};
 			const onSave = () => {
@@ -1891,6 +2137,7 @@ ${extra}
 				description: t("description"),
 				open,
 				onToggle: setOpen,
+				variant,
 				statusBadge: {
 					text: t(draft.enabled ? "enabledOn" : "enabledOff"),
 					on: draft.enabled
@@ -1899,116 +2146,39 @@ ${extra}
 				dirtyLabel: t("unsaved"),
 				readOnlyNotice: disabled ? t("readOnly") : void 0,
 				status,
-				actions: [
-					{
-						key: "refresh",
-						label: t(refreshing ? "refreshingCatalog" : "refreshCatalog"),
-						disabled: disabled || refreshing,
-						onClick: onRefreshCatalog
-					},
-					{
-						key: "discard",
-						label: t("discard"),
-						disabled: !dirty || saving,
-						onClick: onDiscard
-					},
-					{
-						key: "save",
-						label: t(saving ? "saving" : "save"),
-						variant: "primary",
-						disabled: !dirty || invalid || saving || disabled,
-						onClick: onSave
+				actions: cardActions({
+					t,
+					dirty,
+					invalid,
+					saving,
+					refreshing,
+					disabled,
+					onRefresh: onRefreshCatalog,
+					onDiscard,
+					onSave
+				}),
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(RootFields, {
+					t,
+					draft,
+					disabled,
+					kitSource,
+					modelsDevStatus,
+					onEdit: (patch) => {
+						setDraft({
+							...draft,
+							...patch
+						});
+						setStatus(IDLE_STATUS);
 					}
-				],
-				children: [
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(CheckRow, {
-						prefix: "lpc",
-						id: "lpc-enabled",
-						label: t("enabled"),
-						checked: draft.enabled,
-						disabled,
-						onEdit: (value) => {
-							setDraft({
-								...draft,
-								enabled: value
-							});
-							setStatus(IDLE_STATUS);
-						}
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextField$1, {
-						prefix: "lpc",
-						id: "lpc-catalogUrl",
-						label: t("catalogUrl"),
-						hint: t("catalogUrlHint"),
-						value: draft.catalogUrl,
-						disabled,
-						onEdit: (value) => {
-							setDraft({
-								...draft,
-								catalogUrl: value
-							});
-							setStatus(IDLE_STATUS);
-						}
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextField$1, {
-						prefix: "lpc",
-						id: "lpc-catalogRefresh",
-						label: t("catalogRefreshHours"),
-						hint: t("catalogRefreshHoursHint"),
-						value: draft.catalogRefreshHours,
-						numeric: true,
-						disabled,
-						invalid: !numTextOk(draft.catalogRefreshHours),
-						invalidLabel: t("invalidNumber"),
-						onEdit: (value) => {
-							setDraft({
-								...draft,
-								catalogRefreshHours: value
-							});
-							setStatus(IDLE_STATUS);
-						}
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(TextField$1, {
-						prefix: "lpc",
-						id: "lpc-catalogProxy",
-						label: t("catalogProxy"),
-						hint: t("catalogProxyHint"),
-						value: draft.catalogProxy,
-						disabled,
-						onEdit: (value) => {
-							setDraft({
-								...draft,
-								catalogProxy: value
-							});
-							setStatus(IDLE_STATUS);
-						}
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
-						className: "lpc-statusRow",
-						children: [
-							t("kitSource"),
-							"：",
-							kitSource ?? ""
-						]
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: "lpc-statusRow",
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", { children: [
-							t("modelsDevStatus"),
-							"：",
-							modelsDevText(modelsDevStatus, t)
-						] })
-					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProvidersSection, {
-						providers: draft.providers,
-						epoch,
-						disabled,
-						t,
-						onAddRoute,
-						onRemoveRoute,
-						onPatchProvider: setProvider
-					})
-				]
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProvidersSection, {
+					providers: draft.providers,
+					epoch,
+					disabled,
+					t,
+					onAddRoute,
+					onRemoveRoute,
+					onPatchProvider: setProvider
+				})]
 			});
 		}
 		//#endregion
@@ -2040,6 +2210,8 @@ ${extra}
 			refreshOk: "目录已拉取。",
 			refreshFailed: "拉取失败：",
 			advancedGroup: "高级设置（retryPolicy / compat）",
+			extraFields: "其余字段（JSON）",
+			extraFieldsHint: "表单未覆盖的 wire 字段原样往返：如 adapter=deepseek 的 thinking / reasoningEffort、Files API 与图片配额等。对象整体合并进该 route（模型级同 key 覆盖 route 级），非法 JSON 不会提交。",
 			providersGroup: "Provider 路由",
 			addRoute: "新增 route",
 			addRoutePlaceholder: "新 route 键名（如 my-llm）",
@@ -2122,6 +2294,8 @@ ${extra}
 			refreshOk: "Catalog refreshed.",
 			refreshFailed: "Refresh failed: ",
 			advancedGroup: "Advanced (retryPolicy / compat)",
+			extraFields: "Other fields (JSON)",
+			extraFieldsHint: "Wire fields the form does not cover, round-tripped verbatim: e.g. thinking / reasoningEffort and the Files API & image quotas for adapter=deepseek. The object merges into this route (model-level keys win); invalid JSON is not submitted.",
 			providersGroup: "Provider routes",
 			addRoute: "Add route",
 			addRoutePlaceholder: "New route key (e.g. my-llm)",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dsh-plus/llm-pi",
-  "version": "0.1.40",
+  "version": "0.1.41",
   "description": "dsh-plus service+ui plugin: 基于 PiAiAdapter 的自定义 LLM 路由（全量 compat、模型继承、models.dev 目录兜底）",
   "type": "module",
   "main": "lib/index.js",
@@ -32,7 +32,7 @@
   },
   "dependencies": {
     "https-proxy-agent": "^9.1.0",
-    "@dsh-plus/shared": "0.1.30"
+    "@dsh-plus/shared": "0.1.31"
   },
   "peerDependencies": {
     "@deepseek-ai/cordis": "^4.0.4",

package/src/client/card.tsx

@@ -10,14 +10,15 @@
  */
 
 import {
+  type CardAction,
   CardChrome,
+  CardLoading,
   type CardStatusState,
-  CheckRow,
+  cardVariantFor,
   IDLE_STATUS,
   type NamespaceSettingsApi,
   type PluginConfigViewProps,
   type Scope,
-  TextField,
 } from '@dsh-plus/shared/client'
 import { type ReactElement, useEffect, useMemo, useState, useSyncExternalStore } from 'react'
 import { type ConfigValue, fetchCatalog, refreshCatalog, type WireModelsDevStatus } from './api.ts'
@@ -31,6 +32,7 @@ import {
   toPatch,
 } from './draft.ts'
 import type { Translate } from './i18n.ts'
+import { RootFields } from './root-fields.tsx'
 import { ProvidersSection } from './views/providers.tsx'
 
 export interface CardProps extends PluginConfigViewProps {
@@ -39,11 +41,81 @@ export interface CardProps extends PluginConfigViewProps {
   api: NamespaceSettingsApi
 }
 
-function modelsDevText(status: WireModelsDevStatus | null, t: Translate): string {
-  if (status === null) return t('modelsDevEmpty')
-  if (status.error !== null) return `${t('modelsDevError')}${status.error}`
-  if (status.fetchedAt === null) return t('modelsDevEmpty')
-  return `${t('modelsDevStatusLine')}：${status.providers} 个 provider，快照 ${status.fetchedAt}`
+/** 运行期诊断行数据来源：模型目录端点（compat 字段表同批安装）。 */
+function useRuntimeDiagnostics(): {
+  kitSource: string | null
+  modelsDevStatus: WireModelsDevStatus | null
+  setModelsDevStatus(next: WireModelsDevStatus): void
+} {
+  const [kitSource, setKitSource] = useState<string | null>(null)
+  const [modelsDevStatus, setModelsDevStatus] = useState<WireModelsDevStatus | null>(null)
+  useEffect(() => {
+    let alive = true
+    fetchCatalog('', 'models-dev')
+      .then((result) => {
+        if (!alive) return
+        setKitSource(result.kitSource ?? null)
+        setModelsDevStatus(result.status ?? null)
+        if (result.compat !== undefined) installCompatFields(result.compat.fields)
+      })
+      .catch(() => {})
+    return () => {
+      alive = false
+    }
+  }, [])
+  return { kitSource, modelsDevStatus, setModelsDevStatus }
+}
+
+/** 路由级草稿改写：改字段 / 新增 route / 删除 route（返回新草稿，不改入参）。 */
+function withProviderPatch(draft: Draft, route: string, patch: Partial<ProviderDraft>): Draft {
+  const current = draft.providers[route] ?? emptyProviderDraft()
+  return { ...draft, providers: { ...draft.providers, [route]: { ...current, ...patch } } }
+}
+
+function withNewRoute(draft: Draft, key: string): Draft {
+  return { ...draft, providers: { ...draft.providers, [key]: emptyProviderDraft() } }
+}
+
+function withoutRoute(draft: Draft, route: string): Draft {
+  const next = { ...draft.providers }
+  delete next[route]
+  return { ...draft, providers: next }
+}
+
+/** 卡片动作：手动拉取目录、放弃、保存。 */
+function cardActions(options: {
+  t: Translate
+  dirty: boolean
+  invalid: boolean
+  saving: boolean
+  refreshing: boolean
+  disabled: boolean
+  onRefresh(): void
+  onDiscard(): void
+  onSave(): void
+}): CardAction[] {
+  const { t } = options
+  return [
+    {
+      key: 'refresh',
+      label: t(options.refreshing ? 'refreshingCatalog' : 'refreshCatalog'),
+      disabled: options.disabled || options.refreshing,
+      onClick: options.onRefresh,
+    },
+    {
+      key: 'discard',
+      label: t('discard'),
+      disabled: !options.dirty || options.saving,
+      onClick: options.onDiscard,
+    },
+    {
+      key: 'save',
+      label: t(options.saving ? 'saving' : 'save'),
+      variant: 'primary',
+      disabled: !options.dirty || options.invalid || options.saving || options.disabled,
+      onClick: options.onSave,
+    },
+  ]
 }
 
 export function LlmPiCard(props: CardProps): ReactElement | string | null {
@@ -57,11 +129,10 @@ export function LlmPiCard(props: CardProps): ReactElement | string | null {
   const [open, setOpen] = useState(props.view === 'page')
   const [draft, setDraft] = useState<Draft | null>(null)
   const [epoch, setEpoch] = useState(0)
-  const [kitSource, setKitSource] = useState<string | null>(null)
-  const [modelsDevStatus, setModelsDevStatus] = useState<WireModelsDevStatus | null>(null)
   const [saving, setSaving] = useState(false)
   const [refreshing, setRefreshing] = useState(false)
   const [status, setStatus] = useState<CardStatusState>(IDLE_STATUS)
+  const { kitSource, modelsDevStatus, setModelsDevStatus } = useRuntimeDiagnostics()
 
   // 首次拿到解析值后播种草稿；后续 Host 更新不覆盖在途编辑（与官方 staged 表单一致）。
   useEffect(() => {
@@ -69,23 +140,6 @@ export function LlmPiCard(props: CardProps): ReactElement | string | null {
     setDraft(draftFromValue(value))
   }, [value, draft])
 
-  // 运行期诊断行（kitSource / models-dev 状态）来自模型目录端点，非配置数据。
-  // compat 字段表同批下发：安装后 UI 渲染与服务端校验同源（不再手抄镜像表）。
-  useEffect(() => {
-    let alive = true
-    fetchCatalog('', 'models-dev')
-      .then((result) => {
-        if (!alive) return
-        setKitSource(result.kitSource ?? null)
-        setModelsDevStatus(result.status ?? null)
-        if (result.compat !== undefined) installCompatFields(result.compat.fields)
-      })
-      .catch(() => {})
-    return () => {
-      alive = false
-    }
-  }, [])
-
   const dirty = useMemo(
     () =>
       value !== undefined &&
@@ -106,33 +160,23 @@ export function LlmPiCard(props: CardProps): ReactElement | string | null {
   // 插件页 summary 视图只出一行简介（hooks 已全部落定，可安全提前返回）。
   if (props.view === 'summary') return t('summaryLine')
 
+  // 插件页 page 视图内嵌宿主页面容器（已带页面级内边距与标题），用无边框分节。
+  const variant = cardVariantFor(props.view)
+
   if (value === undefined || draft === null) {
-    return (
-      <li className="lpc-card">
-        <p className="lpc-readOnly">{t('loading')}</p>
-      </li>
-    )
+    return <CardLoading prefix="lpc" variant={variant} text={t('loading')} />
   }
 
   const setProvider = (route: string, patch: Partial<ProviderDraft>): void => {
-    const current = draft.providers[route] ?? emptyProviderDraft()
-    setDraft({
-      ...draft,
-      providers: { ...draft.providers, [route]: { ...current, ...patch } },
-    })
+    setDraft(withProviderPatch(draft, route, patch))
     setStatus(IDLE_STATUS)
   }
   const onAddRoute = (key: string): void => {
-    setDraft({
-      ...draft,
-      providers: { ...draft.providers, [key]: emptyProviderDraft() },
-    })
+    setDraft(withNewRoute(draft, key))
     setStatus(IDLE_STATUS)
   }
   const onRemoveRoute = (route: string): void => {
-    const next = { ...draft.providers }
-    delete next[route]
-    setDraft({ ...draft, providers: next })
+    setDraft(withoutRoute(draft, route))
     setStatus(IDLE_STATUS)
   }
   const onSave = (): void => {
@@ -180,91 +224,35 @@ export function LlmPiCard(props: CardProps): ReactElement | string | null {
       description={t('description')}
       open={open}
       onToggle={setOpen}
+      variant={variant}
       statusBadge={{ text: t(draft.enabled ? 'enabledOn' : 'enabledOff'), on: draft.enabled }}
       dirty={dirty}
       dirtyLabel={t('unsaved')}
       readOnlyNotice={disabled ? t('readOnly') : undefined}
       status={status}
-      actions={[
-        {
-          key: 'refresh',
-          label: t(refreshing ? 'refreshingCatalog' : 'refreshCatalog'),
-          disabled: disabled || refreshing,
-          onClick: onRefreshCatalog,
-        },
-        {
-          key: 'discard',
-          label: t('discard'),
-          disabled: !dirty || saving,
-          onClick: onDiscard,
-        },
-        {
-          key: 'save',
-          label: t(saving ? 'saving' : 'save'),
-          variant: 'primary',
-          disabled: !dirty || invalid || saving || disabled,
-          onClick: onSave,
-        },
-      ]}
+      actions={cardActions({
+        t,
+        dirty,
+        invalid,
+        saving,
+        refreshing,
+        disabled,
+        onRefresh: onRefreshCatalog,
+        onDiscard,
+        onSave,
+      })}
     >
-      <CheckRow
-        prefix="lpc"
-        id="lpc-enabled"
-        label={t('enabled')}
-        checked={draft.enabled}
-        disabled={disabled}
-        onEdit={(value) => {
-          setDraft({ ...draft, enabled: value })
-          setStatus(IDLE_STATUS)
-        }}
-      />
-      <TextField
-        prefix="lpc"
-        id="lpc-catalogUrl"
-        label={t('catalogUrl')}
-        hint={t('catalogUrlHint')}
-        value={draft.catalogUrl}
-        disabled={disabled}
-        onEdit={(value) => {
-          setDraft({ ...draft, catalogUrl: value })
-          setStatus(IDLE_STATUS)
-        }}
-      />
-      <TextField
-        prefix="lpc"
-        id="lpc-catalogRefresh"
-        label={t('catalogRefreshHours')}
-        hint={t('catalogRefreshHoursHint')}
-        value={draft.catalogRefreshHours}
-        numeric
-        disabled={disabled}
-        invalid={!numTextOk(draft.catalogRefreshHours)}
-        invalidLabel={t('invalidNumber')}
-        onEdit={(value) => {
-          setDraft({ ...draft, catalogRefreshHours: value })
-          setStatus(IDLE_STATUS)
-        }}
-      />
-      <TextField
-        prefix="lpc"
-        id="lpc-catalogProxy"
-        label={t('catalogProxy')}
-        hint={t('catalogProxyHint')}
-        value={draft.catalogProxy}
+      <RootFields
+        t={t}
+        draft={draft}
         disabled={disabled}
-        onEdit={(value) => {
-          setDraft({ ...draft, catalogProxy: value })
+        kitSource={kitSource}
+        modelsDevStatus={modelsDevStatus}
+        onEdit={(patch) => {
+          setDraft({ ...draft, ...patch })
           setStatus(IDLE_STATUS)
         }}
       />
-      <p className="lpc-statusRow">
-        {t('kitSource')}：{kitSource ?? ''}
-      </p>
-      <div className="lpc-statusRow">
-        <span>
-          {t('modelsDevStatus')}：{modelsDevText(modelsDevStatus, t)}
-        </span>
-      </div>
       <ProvidersSection
         providers={draft.providers}
         epoch={epoch}

package/src/client/draft.ts

@@ -215,6 +215,18 @@ function extraOf(wire: object, known: Set<string>): Record<string, unknown> {
   return out
 }
 
+/**
+ * JSON 文本框值 → extra 映射。
+ * `undefined`（空文本）表示清空为 `{}`；合法但非对象的 JSON（数组/标量/null）
+ * 返回 undefined，调用方据此忽略这次编辑——extra 是「其余 wire 字段」的映射，
+ * 静默丢弃已配置字段比拒绝一次编辑更糟。
+ */
+export function extraOfJson(value: unknown): Record<string, unknown> | undefined {
+  if (value === undefined) return {}
+  if (typeof value !== 'object' || value === null || Array.isArray(value)) return undefined
+  return { ...(value as Record<string, unknown>) }
+}
+
 function modelDraftFromWire(model: WireModel): ModelDraft {
   return {
     id: model.id,

package/src/client/i18n.ts

@@ -28,6 +28,9 @@ const ownZh = {
   refreshOk: '目录已拉取。',
   refreshFailed: '拉取失败：',
   advancedGroup: '高级设置（retryPolicy / compat）',
+  extraFields: '其余字段（JSON）',
+  extraFieldsHint:
+    '表单未覆盖的 wire 字段原样往返：如 adapter=deepseek 的 thinking / reasoningEffort、Files API 与图片配额等。对象整体合并进该 route（模型级同 key 覆盖 route 级），非法 JSON 不会提交。',
   providersGroup: 'Provider 路由',
   addRoute: '新增 route',
   addRoutePlaceholder: '新 route 键名（如 my-llm）',
@@ -112,6 +115,9 @@ const ownEn = {
   refreshOk: 'Catalog refreshed.',
   refreshFailed: 'Refresh failed: ',
   advancedGroup: 'Advanced (retryPolicy / compat)',
+  extraFields: 'Other fields (JSON)',
+  extraFieldsHint:
+    'Wire fields the form does not cover, round-tripped verbatim: e.g. thinking / reasoningEffort and the Files API & image quotas for adapter=deepseek. The object merges into this route (model-level keys win); invalid JSON is not submitted.',
   providersGroup: 'Provider routes',
   addRoute: 'Add route',
   addRoutePlaceholder: 'New route key (e.g. my-llm)',

package/src/client/root-fields.tsx

@@ -0,0 +1,84 @@
+/**
+ * 「LLM 路由」卡片的根字段组：总开关、目录端点/刷新间隔/代理，以及运行期诊断行
+ * （kitSource 与 models-dev 快照状态，来自模型目录端点而非配置数据）。
+ * @module llm-pi/client/root-fields
+ */
+
+import { CheckRow, TextField } from '@dsh-plus/shared/client'
+import type { ReactElement } from 'react'
+
+import type { WireModelsDevStatus } from './api.ts'
+import { type Draft, numTextOk } from './draft.ts'
+import type { Translate } from './i18n.ts'
+
+/** models-dev 状态行文案（缺席/错误/未拉取/正常四态）。 */
+function modelsDevText(status: WireModelsDevStatus | null, t: Translate): string {
+  if (status === null) return t('modelsDevEmpty')
+  if (status.error !== null) return `${t('modelsDevError')}${status.error}`
+  if (status.fetchedAt === null) return t('modelsDevEmpty')
+  return `${t('modelsDevStatusLine')}：${status.providers} 个 provider，快照 ${status.fetchedAt}`
+}
+
+export interface RootFieldsProps {
+  t: Translate
+  draft: Draft
+  disabled: boolean
+  kitSource: string | null
+  modelsDevStatus: WireModelsDevStatus | null
+  /** 根字段编辑（合并式写入并清空状态行）。 */
+  onEdit(patch: Partial<Draft>): void
+}
+
+export function RootFields(props: RootFieldsProps): ReactElement {
+  const { t, draft, disabled, onEdit } = props
+  return (
+    <>
+      <CheckRow
+        prefix="lpc"
+        id="lpc-enabled"
+        label={t('enabled')}
+        checked={draft.enabled}
+        disabled={disabled}
+        onEdit={(value) => onEdit({ enabled: value })}
+      />
+      <TextField
+        prefix="lpc"
+        id="lpc-catalogUrl"
+        label={t('catalogUrl')}
+        hint={t('catalogUrlHint')}
+        value={draft.catalogUrl}
+        disabled={disabled}
+        onEdit={(value) => onEdit({ catalogUrl: value })}
+      />
+      <TextField
+        prefix="lpc"
+        id="lpc-catalogRefresh"
+        label={t('catalogRefreshHours')}
+        hint={t('catalogRefreshHoursHint')}
+        value={draft.catalogRefreshHours}
+        numeric
+        disabled={disabled}
+        invalid={!numTextOk(draft.catalogRefreshHours)}
+        invalidLabel={t('invalidNumber')}
+        onEdit={(value) => onEdit({ catalogRefreshHours: value })}
+      />
+      <TextField
+        prefix="lpc"
+        id="lpc-catalogProxy"
+        label={t('catalogProxy')}
+        hint={t('catalogProxyHint')}
+        value={draft.catalogProxy}
+        disabled={disabled}
+        onEdit={(value) => onEdit({ catalogProxy: value })}
+      />
+      <p className="lpc-statusRow">
+        {t('kitSource')}：{props.kitSource ?? ''}
+      </p>
+      <div className="lpc-statusRow">
+        <span>
+          {t('modelsDevStatus')}：{modelsDevText(props.modelsDevStatus, t)}
+        </span>
+      </div>
+    </>
+  )
+}

package/src/client/views/models.tsx

@@ -9,8 +9,8 @@ import { CheckRow } from '@dsh-plus/shared/client'
 import { type ReactElement, useEffect, useState } from 'react'
 import { fetchCatalog, type WireModelsDevStatus } from '../api.ts'
 import { MODALITIES, THINKING_LEVELS } from '../constants.ts'
-import { emptyModelDraft, type ModelDraft, type ReasoningDraft } from '../draft.ts'
-import { TextField } from '../fields.tsx'
+import { emptyModelDraft, extraOfJson, type ModelDraft, type ReasoningDraft } from '../draft.ts'
+import { JsonField, TextField } from '../fields.tsx'
 import type { Translate } from '../i18n.ts'
 import { CompatEditor } from './compat.tsx'
 
@@ -261,6 +261,21 @@ export function ModelRow(props: ModelRowProps): ReactElement {
         t={t}
         onEdit={(compat) => props.onPatch({ compat })}
       />
+      <JsonField
+        id={`${id}-extra`}
+        label={t('extraFields')}
+        hint={t('extraFieldsHint')}
+        invalidText={t('invalidJson')}
+        value={Object.keys(model.extra).length === 0 ? undefined : model.extra}
+        epoch={props.epoch}
+        disabled={props.disabled === true}
+        wide
+        onEdit={(extra) => {
+          const next = extraOfJson(extra)
+          // 合法但非对象的 JSON（数组/标量）忽略这次编辑，不静默清空已配置字段。
+          if (next !== undefined) props.onPatch({ extra: next })
+        }}
+      />
     </div>
   )
 }

package/src/client/views/providers.tsx

@@ -9,6 +9,7 @@ import { ChevronDownIcon } from '@dsh-plus/shared/client'
 import { type ReactElement, useState } from 'react'
 
 import type { ProviderDraft } from '../draft.ts'
+import { extraOfJson } from '../draft.ts'
 import { CollapseSection, JsonField, KeyValueEditor } from '../fields.tsx'
 import type { Translate } from '../i18n.ts'
 import { CompatEditor } from './compat.tsx'
@@ -145,6 +146,21 @@ export function ProviderSection(props: ProviderSectionProps): ReactElement {
             onEdit={(headers) => props.onPatch({ headers })}
           />
           <CollapseSection id={`${id}-advanced`} title={t('advancedGroup')} defaultOpen={false}>
+            <JsonField
+              id={`${id}-extra`}
+              label={t('extraFields')}
+              hint={t('extraFieldsHint')}
+              invalidText={t('invalidJson')}
+              value={Object.keys(draft.extra).length === 0 ? undefined : draft.extra}
+              epoch={props.epoch}
+              disabled={props.disabled === true}
+              wide
+              onEdit={(extra) => {
+                const next = extraOfJson(extra)
+                // 合法但非对象的 JSON（数组/标量）忽略这次编辑，不静默清空已配置字段。
+                if (next !== undefined) props.onPatch({ extra: next })
+              }}
+            />
             <JsonField
               id={`${id}-retry`}
               label={t('retryPolicy')}