@lmzhen/dsh-evolution-settings-ui 0.6.1 → 0.8.0

package/lib/client.js

@@ -13,62 +13,122 @@ window.__ModuleLoader__.load({
 					{
 						id: "curatorIntervalHours",
 						group: "curator",
-						doc: "Minimum hours between deterministic curation passes."
+						doc: "Minimum hours between deterministic curation passes.",
+						label: "策展间隔",
+						hint: "两次确定性策展之间至少间隔多少小时。",
+						control: "number",
+						unit: "小时",
+						values: []
 					},
 					{
 						id: "staleAfterDays",
 						group: "curator",
-						doc: "Inactive days before a skill counts as stale."
+						doc: "Inactive days before a skill counts as stale.",
+						label: "判为陈旧的天数",
+						hint: "技能多少天没被使用即算陈旧。",
+						control: "number",
+						unit: "天",
+						values: []
 					},
 					{
 						id: "archiveAfterDays",
 						group: "curator",
-						doc: "Inactive days before a stale skill is archived (must be >= staleAfterDays)."
+						doc: "Inactive days before a stale skill is archived (must be >= staleAfterDays).",
+						label: "归档天数",
+						hint: "陈旧技能再过多少天归档（须 ≥ 判为陈旧的天数）。",
+						control: "number",
+						unit: "天",
+						values: []
 					},
 					{
 						id: "qualityWarnStaleAfterDays",
 						group: "curator",
-						doc: "Age at which a low quality score starts warning."
+						doc: "Age at which a low quality score starts warning.",
+						label: "低质量告警天数",
+						hint: "质量分偏低时从多少天开始告警。",
+						control: "number",
+						unit: "天",
+						values: []
 					},
 					{
 						id: "minIdleHours",
 						group: "curator",
-						doc: "Idle hours required before an automatic curation pass runs."
+						doc: "Idle hours required before an automatic curation pass runs.",
+						label: "空闲门槛",
+						hint: "至少空闲多少小时才跑自动策展。",
+						control: "number",
+						unit: "小时",
+						values: []
 					},
 					{
 						id: "minIdleFailOpen",
 						group: "curator",
-						doc: "Let the idle gate open when the activity probe is unavailable."
+						doc: "Let the idle gate open when the activity probe is unavailable.",
+						label: "空闲探针失败时放行",
+						hint: "活动探针不可用时，是否让空闲门槛直接放行。",
+						control: "switch",
+						unit: "",
+						values: []
 					},
 					{
 						id: "llmReview",
 						group: "curator",
-						doc: "Enable the LLM nomination pass on top of the deterministic lifecycle."
+						doc: "Enable the LLM nomination pass on top of the deterministic lifecycle.",
+						label: "启用 LLM 提名",
+						hint: "在确定性生命周期之上再跑一遍 LLM 提名。",
+						control: "switch",
+						unit: "",
+						values: []
 					},
 					{
 						id: "curatorReviewMaxTokens",
 						group: "curator",
-						doc: "Token budget of the curator LLM review."
+						doc: "Token budget of the curator LLM review.",
+						label: "策展 LLM token 预算",
+						hint: "策展 LLM 审查可用的 token 预算。",
+						control: "number",
+						unit: "token",
+						values: []
 					},
 					{
 						id: "curatorReviewTimeoutMs",
 						group: "curator",
-						doc: "Wall-clock bound of the curator LLM review."
+						doc: "Wall-clock bound of the curator LLM review.",
+						label: "策展 LLM 超时",
+						hint: "策展 LLM 审查的墙钟上限。",
+						control: "number",
+						unit: "毫秒",
+						values: []
 					},
 					{
 						id: "healthSoftBodyChars",
 						group: "curator",
-						doc: "Body character line the health view judges against."
+						doc: "Body character line the health view judges against.",
+						label: "正文软带",
+						hint: "健康视图判定正文长度的软带。",
+						control: "number",
+						unit: "字符",
+						values: []
 					},
 					{
 						id: "healthStampDensityPerKb",
 						group: "curator",
-						doc: "Stamp density per KB that flags log-like content in a body."
+						doc: "Stamp density per KB that flags log-like content in a body.",
+						label: "标记密度阈值",
+						hint: "每 KB 出现多少个时间标记就算「像日志」。",
+						control: "number",
+						unit: "处/KB",
+						values: []
 					},
 					{
 						id: "healthChurnMinPatches",
 						group: "curator",
-						doc: "Patches without a read that flag a write-ghost skill."
+						doc: "Patches without a read that flag a write-ghost skill.",
+						label: "空写判定补丁数",
+						hint: "多少次改动都没有任何读取，即判为「写幽灵」。",
+						control: "number",
+						unit: "处",
+						values: []
 					}
 				]
 			},
@@ -78,22 +138,42 @@ window.__ModuleLoader__.load({
 					{
 						id: "memoryChars",
 						group: "memory",
-						doc: "Character budget the memory store enforces for MEMORY.md."
+						doc: "Character budget the memory store enforces for MEMORY.md.",
+						label: "MEMORY.md 字符预算",
+						hint: "memory 存储对 MEMORY.md 的字符上限。",
+						control: "number",
+						unit: "字符",
+						values: []
 					},
 					{
 						id: "userChars",
 						group: "memory",
-						doc: "Character budget the memory store enforces for USER.md."
+						doc: "Character budget the memory store enforces for USER.md.",
+						label: "USER.md 字符预算",
+						hint: "memory 存储对 USER.md 的字符上限。",
+						control: "number",
+						unit: "字符",
+						values: []
 					},
 					{
 						id: "addDatePrefix",
 						group: "memory",
-						doc: "Prefix stored memory entries with their date heading."
+						doc: "Prefix stored memory entries with their date heading.",
+						label: "记忆条目加日期前缀",
+						hint: "写入记忆时为条目加上日期标题。",
+						control: "switch",
+						unit: "",
+						values: []
 					},
 					{
 						id: "maxConsolidationFailures",
 						group: "memory",
-						doc: "Consolidation failures one turn tolerates before the tool gives up."
+						doc: "Consolidation failures one turn tolerates before the tool gives up.",
+						label: "合并失败容忍次数",
+						hint: "一轮内合并失败多少次后工具放弃。",
+						control: "number",
+						unit: "次",
+						values: []
 					}
 				]
 			},
@@ -103,37 +183,76 @@ window.__ModuleLoader__.load({
 					{
 						id: "reviewSkillInterval",
 						group: "review",
-						doc: "Activity units between skill-review injections."
+						doc: "Activity units between skill-review injections.",
+						label: "技能审查间隔",
+						hint: "每多少活动单位触发一次技能审查注入。",
+						control: "number",
+						unit: "次",
+						values: []
 					},
 					{
 						id: "reviewMemoryInterval",
 						group: "review",
-						doc: "Activity units between memory-review injections."
+						doc: "Activity units between memory-review injections.",
+						label: "记忆审查间隔",
+						hint: "每多少活动单位触发一次记忆审查注入。",
+						control: "number",
+						unit: "次",
+						values: []
 					},
 					{
 						id: "skillReviewTrigger",
 						group: "review",
-						doc: "Which channel may inject a skill review (cadence, completion, both)."
+						doc: "Which channel may inject a skill review (cadence, completion, both).",
+						label: "审查触发通道",
+						hint: "哪个通道可以注入技能审查：cadence＝按间隔、completion＝按完成、both＝两者。",
+						control: "select",
+						unit: "",
+						values: [
+							"cadence",
+							"completion",
+							"both"
+						]
 					},
 					{
 						id: "skillReviewCompletionMinToolCalls",
 						group: "review",
-						doc: "Tool calls a task needs before the completion channel injects."
+						doc: "Tool calls a task needs before the completion channel injects.",
+						label: "完成通道最少工具调用",
+						hint: "走完成通道时，任务至少经过多少次工具调用才注入。",
+						control: "number",
+						unit: "次",
+						values: []
 					},
 					{
 						id: "reviewEnabled",
 						group: "review",
-						doc: "Master switch for the review plugin."
+						doc: "Master switch for the review plugin.",
+						label: "启用审查插件",
+						hint: "审查插件的总开关。",
+						control: "switch",
+						unit: "",
+						values: []
 					},
 					{
 						id: "reviewMode",
 						group: "review",
-						doc: "Run the review in the parent session (inject) or on a subagent."
+						doc: "Run the review in the parent session (inject) or on a subagent.",
+						label: "审查运行方式",
+						hint: "inject＝在父会话内注入，subagent＝交给子代理运行。",
+						control: "select",
+						unit: "",
+						values: ["subagent", "inject"]
 					},
 					{
 						id: "reviewWakeInject",
 						group: "review",
-						doc: "Deliver the deferred review as a waking follow-up message."
+						doc: "Deliver the deferred review as a waking follow-up message.",
+						label: "审查后续唤醒注入",
+						hint: "把延后的审查作为唤醒消息投递。",
+						control: "switch",
+						unit: "",
+						values: []
 					}
 				]
 			},
@@ -143,42 +262,82 @@ window.__ModuleLoader__.load({
 					{
 						id: "skillContentChars",
 						group: "write-caps",
-						doc: "Character cap on a SKILL.md body (tighten-only)."
+						doc: "Character cap on a SKILL.md body (tighten-only).",
+						label: "SKILL.md 正文字符上限",
+						hint: "SKILL.md 正文的字符上限（只许收紧）。",
+						control: "number",
+						unit: "字符",
+						values: []
 					},
 					{
 						id: "maxSkillFileBytes",
 						group: "write-caps",
-						doc: "Byte cap on one support file (tighten-only)."
+						doc: "Byte cap on one support file (tighten-only).",
+						label: "支持文件字节上限",
+						hint: "单个支持文件的字节上限（只许收紧）。",
+						control: "number",
+						unit: "字节",
+						values: []
 					},
 					{
 						id: "maxSkillNameLength",
 						group: "write-caps",
-						doc: "Character cap on a skill name (tighten-only)."
+						doc: "Character cap on a skill name (tighten-only).",
+						label: "技能名字符上限",
+						hint: "技能名的字符上限（只许收紧）。",
+						control: "number",
+						unit: "字符",
+						values: []
 					},
 					{
 						id: "maxDescriptionLength",
 						group: "write-caps",
-						doc: "Character cap on a skill description (tighten-only)."
+						doc: "Character cap on a skill description (tighten-only).",
+						label: "技能描述字符上限",
+						hint: "技能描述的字符上限（只许收紧）。",
+						control: "number",
+						unit: "字符",
+						values: []
 					},
 					{
 						id: "descriptionStrict",
 						group: "write-caps",
-						doc: "Refuse a description over the authoring bar instead of advising."
+						doc: "Refuse a description over the authoring bar instead of advising.",
+						label: "描述严格档",
+						hint: "描述超过写作门槛时拒绝写入，而不是只提示。",
+						control: "switch",
+						unit: "",
+						values: []
 					},
 					{
 						id: "strictCrossSource",
 						group: "write-caps",
-						doc: "Refuse writes whose catalog entry resolves outside the family."
+						doc: "Refuse writes whose catalog entry resolves outside the family.",
+						label: "跨源严格档",
+						hint: "目录项解析到家族之外时拒绝写入。",
+						control: "switch",
+						unit: "",
+						values: []
 					},
 					{
 						id: "citationPolicy",
 						group: "write-caps",
-						doc: "Refuse a move that would leave a dangling reference, or verify it."
+						doc: "Refuse a move that would leave a dangling reference, or verify it.",
+						label: "引用校验档",
+						hint: "移动或合并时对引用的处置：verify＝校验、refuse＝直接拒绝。",
+						control: "select",
+						unit: "",
+						values: ["verify", "refuse"]
 					},
 					{
 						id: "supportFileCharPolicy",
 						group: "write-caps",
-						doc: "Warn about an oversize support file, or refuse the write."
+						doc: "Warn about an oversize support file, or refuse the write.",
+						label: "支持文件超限档",
+						hint: "支持文件超出字符上限时：report＝只报告、enforce＝拒写。",
+						control: "select",
+						unit: "",
+						values: ["report", "enforce"]
 					}
 				]
 			},
@@ -187,11 +346,118 @@ window.__ModuleLoader__.load({
 				fields: [{
 					id: "entryPreviewChars",
 					group: "memory",
-					doc: "Characters of one memory entry shown in a tool result preview."
+					doc: "Characters of one memory entry shown in a tool result preview.",
+					label: "条目预览字符数",
+					hint: "单条记忆预览保留多少字符。",
+					control: "number",
+					unit: "字符",
+					values: []
 				}]
 			}
 		];
 		//#endregion
+		//#region src/client/messages.ts
+		/**
+		* Copy for the evolution settings section and its parameter cards.
+		*
+		* The section is registered through the platform's locale seat (`ctx.locale`),
+		* which is the same route the other out-of-repo client plugins take. The earlier
+		* note in this package's README — that an outside package cannot bind the locale
+		* seat — is wrong: `locale.register(namespace, { zh, en })` is the documented
+		* call, and it is what makes the section title and its copy follow the UI
+		* language instead of shipping one hard-coded dictionary.
+		*/
+		/** Locale namespace this bundle registers. */
+		const NS = "evolution-settings";
+		/** Chinese copy (the family's primary language). */
+		const zh = {
+			title: "自进化",
+			subtitle: "审查／记忆／策展／技能四个命名空间的参数可在用户层覆盖；此处只列可改项，其余仍由部署面决定。",
+			overridden: "用户",
+			deployment: "部署",
+			loading: "正在读取设置文档…",
+			unavailable: "这个命名空间没有宿主提供服务（对应插件行未挂载）",
+			readonly: "本次会话的设置文档是只读的（内存模式）",
+			apply: "保存",
+			reset: "恢复部署默认",
+			empty: "这个命名空间没有可改项",
+			changed: "{n} 项已改",
+			discard: "放弃修改",
+			saving: "保存中…",
+			refused: "写入未被接受——宿主的校验拒绝了它（值保持原样）。原因见 /evolution params 或 /evolution doctor。",
+			cardReview: "审查",
+			cardMemory: "记忆",
+			cardToolMemory: "记忆工具",
+			cardCurator: "策展",
+			cardSkills: "技能"
+		};
+		/** English copy, key for key with {@link zh}. */
+		const en = {
+			title: "Self-evolution",
+			subtitle: "Parameters of the review, memory, curation and skill namespaces may be overridden per user; only the writable ones are listed here, everything else still comes from the deployment.",
+			overridden: "user",
+			deployment: "deployment",
+			loading: "reading the settings document…",
+			unavailable: "this namespace is not served by the Host (its owning plugin row is not mounted)",
+			readonly: "the settings document is read-only in this session (memory mode)",
+			apply: "Save",
+			reset: "Reset to deployment",
+			empty: "no writable field in this namespace",
+			changed: "{n} changed",
+			discard: "Discard",
+			saving: "Saving…",
+			refused: "The write was not accepted — the Host refused it and the value is unchanged. See /evolution params or /evolution doctor for the reason.",
+			cardReview: "Review",
+			cardMemory: "Memory",
+			cardToolMemory: "Memory tools",
+			cardCurator: "Curation",
+			cardSkills: "Skills"
+		};
+		/**
+		* Card titles per settings namespace. A namespace without an entry falls back to
+		* its raw name, so a Host that registers a new namespace still renders — the
+		* title is presentation, the namespace is the join key.
+		*/
+		const NAMESPACE_TITLES = Object.freeze({
+			"evolution-review": "cardReview",
+			"evolution-memory": "cardMemory",
+			"evolution-tool-memory": "cardToolMemory",
+			"evolution-curator": "cardCurator",
+			"evolution-skills": "cardSkills"
+		});
+		/**
+		* Resolve one message without the locale seat (tests and the fallback path).
+		* @param key - the message key.
+		* @param language - which dictionary to read; defaults to Chinese.
+		* @returns the copy this bundle carries.
+		*/
+		function message(key, language = "zh") {
+			return language === "zh" ? zh[key] : en[key];
+		}
+		//#endregion
+		//#region src/client/settle.ts
+		/**
+		* Structural equality for the values a parameter can hold.
+		* @param a - one side of the comparison.
+		* @param b - the other side.
+		* @returns true when the two are the same value.
+		*/
+		function sameValue(a, b) {
+			if (Object.is(a, b)) return true;
+			if (typeof a !== typeof b || a === null || b === null) return false;
+			return JSON.stringify(a) === JSON.stringify(b);
+		}
+		/**
+		* Whether every staged write is visible in the user layer.
+		* @param pending - the writes awaiting a verdict.
+		* @param user - the user layer of the post-write snapshot; a non-section reads as empty.
+		* @returns true when each staged id now holds the value that was requested.
+		*/
+		function landedWrites(pending, user) {
+			const section = typeof user === "object" && user !== null && !Array.isArray(user) ? user : {};
+			return pending.every((entry) => sameValue(section[entry.id], entry.want));
+		}
+		//#endregion
 		//#region src/client/ParamCard.ts
 		/**
 		* One namespace's parameter card.
@@ -199,48 +465,100 @@ window.__ModuleLoader__.load({
 		* Structural local types on purpose: this package is distributed outside the
 		* platform repository and a value import of another plugin is forbidden, so the
 		* settings scope and its snapshot are declared by the shape the renderer hands
-		* over (`getSnapshot`/`subscribe`, status/value/user/writable).
+		* over (\`getSnapshot\`/\`subscribe\`, status/value/user/writable).
+		*
+		* Layout and behaviour follow the platform's own settings fields: a collapsed card
+		* header (namespace title, change count, chevron), then one block per field —
+		* label with its unit and source chip, a control HOLDING THE CURRENT VALUE, the
+		* Chinese hint — and one 放弃修改/保存 pair at the card's foot. The control is
+		* typed from the registry (\`control\`), so booleans are switches, enums are
+		* selects and numbers are numeric inputs with the unit shown beside the label.
 		*/
-		/** One cell's text: absent reads as a dash, containers as JSON. */
+		/** One cell's text: absent reads as an empty control, containers as JSON. */
 		function format(value) {
-			if (value === void 0) return "—";
+			if (value === void 0) return "";
 			if (typeof value === "string") return value;
 			return JSON.stringify(value);
 		}
-		/** Parse one typed value the way the command surface does: JSON, else raw text. */
-		function parse(draft) {
-			const text = draft.trim();
+		/**
+		* Parse one edited value into what the scope should receive.
+		* @param control - the registry's control kind for the field.
+		* @param text - the text the operator left in the control.
+		* @returns the value handed to \`set\`; a string stays raw so the Host's own
+		*   validation produces the error message the operator reads.
+		*/
+		function parseFor(control, text) {
+			const trimmed = text.trim();
+			if (control === "switch") return trimmed === "true";
+			if (control === "number") {
+				const parsed = Number(trimmed);
+				return trimmed !== "" && Number.isFinite(parsed) ? parsed : trimmed;
+			}
 			try {
-				return JSON.parse(text);
+				return JSON.parse(trimmed);
 			} catch {
-				return text;
+				return trimmed;
 			}
 		}
 		/** Whether a value is a plain section object. */
 		function isSection(value) {
 			return typeof value === "object" && value !== null && !Array.isArray(value);
 		}
-		/** One parameter row: current value, source badge, write and reset controls. */
-		function FieldRow(props) {
-			const [draft, setDraft] = (0, react.useState)("");
-			return (0, react.createElement)("div", { className: "evolution-param-row" }, (0, react.createElement)("code", null, props.field.id), (0, react.createElement)("span", { className: "evolution-param-value" }, format(props.value)), (0, react.createElement)("span", { className: "evolution-param-source" }, props.overridden ? props.t("overridden") : props.t("deployment")), (0, react.createElement)("input", {
-				value: draft,
+		/** One field's control, typed from the registry. */
+		function FieldControl(props) {
+			const { field, text } = props;
+			const common = {
+				id: "evolution-param-" + field.id,
 				disabled: props.disabled,
-				placeholder: props.field.doc,
+				className: "evolution-param-input"
+			};
+			if (field.control === "switch") return (0, react.createElement)("input", {
+				...common,
+				className: "evolution-param-check",
+				type: "checkbox",
+				checked: text === "true",
 				onChange: (event) => {
-					setDraft(event.target.value);
+					props.onChange(field.id, String(event.target.checked));
 				}
-			}), (0, react.createElement)("button", {
-				disabled: props.disabled || draft.trim() === "",
-				onClick: () => {
-					props.write(props.field.id, parse(draft));
+			});
+			if (field.control === "select") return (0, react.createElement)("select", {
+				...common,
+				className: "evolution-param-select",
+				value: text,
+				onChange: (event) => {
+					props.onChange(field.id, event.target.value);
+				}
+			}, [field.values.includes(text) || text === "" ? null : (0, react.createElement)("option", {
+				key: text,
+				value: text
+			}, text), ...field.values.map((value) => (0, react.createElement)("option", {
+				key: value,
+				value
+			}, value))]);
+			return (0, react.createElement)("input", {
+				...common,
+				type: field.control === "number" ? "number" : "text",
+				value: text,
+				onChange: (event) => {
+					props.onChange(field.id, event.target.value);
 				}
-			}, props.t("apply")), props.overridden ? (0, react.createElement)("button", {
+			});
+		}
+		/** One parameter field: label, control, hint, and its reset-to-deployment action. */
+		function FieldBlock(props) {
+			const { field, t } = props;
+			const unit = field.unit === "" ? null : (0, react.createElement)("span", { className: "evolution-param-unit" }, "（" + field.unit + "）");
+			return (0, react.createElement)("div", { className: "evolution-param-field" }, (0, react.createElement)("div", { className: "evolution-param-label" }, (0, react.createElement)("label", { htmlFor: "evolution-param-" + field.id }, field.label === "" ? field.id : field.label), unit, (0, react.createElement)("span", {
+				className: "evolution-param-source",
+				"data-user": props.overridden ? "true" : "false"
+			}, props.overridden ? t("overridden") : t("deployment"))), FieldControl(props), (0, react.createElement)("p", { className: "evolution-param-hint" }, field.hint === "" ? field.doc : field.hint), props.overridden ? (0, react.createElement)("div", { className: "evolution-param-actions" }, (0, react.createElement)("button", {
+				type: "button",
+				className: "evolution-param-button",
 				disabled: props.disabled,
 				onClick: () => {
-					props.clear(props.field.id);
+					props.clear(field.id);
 				}
-			}, props.t("reset")) : null);
+			}, t("reset"))) : null);
 		}
 		/**
 		* Render one namespace's card.
@@ -248,78 +566,264 @@ window.__ModuleLoader__.load({
 		* @returns the card.
 		*/
 		function ParamCard(props) {
-			const { t, fields, write, clear } = props;
+			const { t, fields, write, clear, namespace } = props;
+			const [open, setOpen] = (0, react.useState)(false);
+			const [draft, setDraft] = (0, react.useState)({});
+			const [busy, setBusy] = (0, react.useState)(false);
+			const [error, setError] = (0, react.useState)("");
+			const [pending, setPending] = (0, react.useState)(null);
 			const snapshot = props.useParamSection((state) => state);
-			if (snapshot.status === "loading") return (0, react.createElement)("p", null, t("loading"));
-			if (snapshot.status === "unavailable") return (0, react.createElement)("p", null, t("unavailable"));
+			if (snapshot.status === "loading") return (0, react.createElement)("p", { className: "evolution-param-note" }, t("loading"));
+			if (snapshot.status === "unavailable") return (0, react.createElement)("p", { className: "evolution-param-note" }, t("unavailable"));
 			const user = isSection(snapshot.user) ? snapshot.user : {};
 			const value = isSection(snapshot.value) ? snapshot.value : {};
 			const disabled = !snapshot.writable;
-			return (0, react.createElement)("section", { className: "evolution-params" }, (0, react.createElement)("h4", null, t("title") + " — " + props.namespace), disabled ? (0, react.createElement)("p", null, t("readonly")) : null, fields.length === 0 ? (0, react.createElement)("p", null, t("empty")) : fields.map((field) => (0, react.createElement)(FieldRow, {
+			const locked = disabled || busy;
+			const titleKey = NAMESPACE_TITLES[namespace];
+			const title = titleKey === void 0 ? namespace : t(titleKey);
+			const changed = fields.filter((field) => Object.hasOwn(user, field.id)).length;
+			const textOf = (field) => draft[field.id] ?? format(value[field.id]);
+			const dirty = fields.filter((field) => draft[field.id] !== void 0 && draft[field.id] !== format(value[field.id]));
+			const change = (id, next) => {
+				setDraft({
+					...draft,
+					[id]: next
+				});
+			};
+			/**
+			* Settle a staged write against the Host's answer.
+			*
+			* A resolved write promise is not the verdict: both settings scopes this bundle runs
+			* on (the shell's own controller and the bridge variant) finish their recovery read
+			* BEFORE it resolves, so a value the Host refused is simply still the previous one.
+			* Presence in the user layer therefore cannot answer the question — on a field the
+			* operator had already overridden, a refused value's key is present as well. The
+			* verdict asks whether each staged id now holds the value this card requested.
+			* The check lives in an effect, not in the save callback, because the raw snapshot is
+			* reachable only through the render-time seat — the face's `hooks` compartment never
+			* reaches the component.
+			*/
+			(0, react.useEffect)(() => {
+				if (pending === null) return;
+				setPending(null);
+				setBusy(false);
+				if (landedWrites(pending, snapshot.user)) setDraft({});
+				else setError(t("refused"));
+			}, [
+				pending,
+				snapshot.user,
+				t
+			]);
+			const save = () => {
+				setBusy(true);
+				setError("");
+				(async () => {
+					try {
+						for (const field of dirty) await write(field.id, parseFor(field.control, textOf(field)));
+						setPending(dirty.map((field) => ({
+							id: field.id,
+							want: parseFor(field.control, textOf(field))
+						})));
+					} catch (caught) {
+						setBusy(false);
+						setError(caught instanceof Error && caught.message !== "" ? caught.message : t("refused"));
+					}
+				})();
+			};
+			return (0, react.createElement)("section", { className: "evolution-param-card" }, (0, react.createElement)("button", {
+				type: "button",
+				className: "evolution-param-head",
+				"aria-expanded": open ? "true" : "false",
+				onClick: () => {
+					setOpen(!open);
+				}
+			}, (0, react.createElement)("span", { className: "evolution-param-card-title" }, title), changed === 0 ? null : (0, react.createElement)("span", { className: "evolution-param-count" }, t("changed").replace("{n}", String(changed))), (0, react.createElement)("span", { className: "evolution-param-chevron" }, open ? "▲" : "▼")), open ? (0, react.createElement)("div", { className: "evolution-param-body" }, disabled ? (0, react.createElement)("p", { className: "evolution-param-note" }, t("readonly")) : null, fields.length === 0 ? (0, react.createElement)("p", { className: "evolution-param-note" }, t("empty")) : fields.map((field) => (0, react.createElement)(FieldBlock, {
 				key: field.id,
 				field,
-				value: value[field.id],
+				text: textOf(field),
 				overridden: Object.hasOwn(user, field.id),
-				disabled,
+				disabled: locked,
 				t,
-				write,
+				onChange: change,
 				clear
-			})));
+			})), error === "" ? null : (0, react.createElement)("p", { className: "evolution-param-error" }, error), fields.length === 0 ? null : (0, react.createElement)("div", { className: "evolution-param-footer" }, (0, react.createElement)("button", {
+				type: "button",
+				className: "evolution-param-button",
+				disabled: busy || dirty.length === 0,
+				onClick: () => {
+					setDraft({});
+					setError("");
+				}
+			}, t("discard")), (0, react.createElement)("button", {
+				type: "button",
+				className: "evolution-param-button",
+				"data-primary": "true",
+				disabled: disabled || busy || dirty.length === 0,
+				onClick: save
+			}, busy ? t("saving") : t("apply")))) : null);
 		}
 		//#endregion
-		//#region src/client/messages.ts
+		//#region src/client/seam.ts
+		/** Our card slot, hosted by the section this bundle registers. */
+		const CARD_SLOT = "evolution.namespace.card";
+		//#endregion
+		//#region src/client/SettingsSection.ts
 		/**
-		* Copy for the evolution parameter cards.
+		* The section shell: title, one-line explanation, then one card per namespace.
 		*
-		* The bundle carries its own dictionary: this package is distributed outside the
-		* platform repository, whose typed locale seats are declared per in-repo
-		* namespace. Components never inline a string — the card receives `t` through its
-		* inject face, which is where a locale-service binding would plug in later.
+		* This is the shape the platform's own settings sections use — a heading plus the
+		* child slots it declared in its registration. The cards themselves are separate
+		* registrations keyed by namespace, so a namespace the Host does not serve simply
+		* renders nothing and a deployment that drops this row loses the whole section.
+		* @module @lmzhen/dsh-evolution-settings-ui/client
 		*/
-		/** Message keys the cards render. */
-		const MESSAGES = {
-			title: "Evolution parameters",
-			overridden: "user override",
-			deployment: "deployment value",
-			loading: "reading the settings document…",
-			unavailable: "this namespace is not served by the Host (its owning plugin row is not mounted)",
-			readonly: "the settings document is read-only in this session (memory mode)",
-			apply: "Apply",
-			reset: "Reset to deployment",
-			empty: "no writable field in this namespace"
-		};
 		/**
-		* Resolve one message.
-		* @param key - the message key.
-		* @returns the copy this bundle carries.
+		* Render the section.
+		* @param face - the shell's inject face: translator and child-slot renderer.
+		* @returns the section element.
 		*/
-		function message(key) {
-			return MESSAGES[key];
+		function SettingsSection(face) {
+			return (0, react.createElement)("div", { className: "evolution-params" }, (0, react.createElement)("h2", { className: "evolution-params-title" }, face.t("title")), (0, react.createElement)("p", { className: "evolution-params-subtitle" }, face.t("subtitle")), ...CLIENT_PARAM_SECTIONS.map((section_) => (0, react.createElement)("div", {
+				key: section_.namespace,
+				className: "evolution-params-group"
+			}, face.renderSlot(CARD_SLOT, {}, { entryKey: section_.namespace }))));
+		}
+		//#endregion
+		//#region src/client/styles.ts
+		/**
+		* The section's stylesheet.
+		*
+		* The platform's own client bundles compile CSS Modules into a string and inject
+		* it once behind a \`<style data-plugin-css="<pkg>/<file>">\` tag; this bundle is
+		* built outside that pipeline, so it carries its own string and injects it the
+		* same way. Every rule reads the platform's design tokens (\`--dsw-alias-*\`), so
+		* the section follows the light and dark themes without owning a colour, and the
+		* field metrics (12px/6px padding-gap, 13px label, 12px hint) match the ones the
+		* platform's own settings fields use.
+		* @module @lmzhen/dsh-evolution-settings-ui/client
+		*/
+		/** Tag id that makes the injection idempotent. */
+		const CSS_TAG_ID = "@lmzhen/dsh-evolution-settings-ui/settings.css";
+		/** The stylesheet the section injects once. */
+		const CSS = [
+			".evolution-params{display:flex;flex-direction:column}",
+			".evolution-params-title{margin:0 0 4px;color:var(--dsw-alias-label-primary);font-size:16px;font-weight:600;line-height:1.5}",
+			".evolution-params-subtitle{margin:0 0 16px;color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:1.5}",
+			".evolution-param-card{border:.5px solid var(--dsw-alias-border-l2);border-radius:8px;background:var(--dsw-alias-bg-layer-1);margin-bottom:12px}",
+			".evolution-param-head{display:flex;align-items:center;gap:8px;width:100%;padding:12px 14px;background:none;border:0;text-align:left;cursor:pointer;color:inherit;font:inherit}",
+			".evolution-param-head:hover{background:var(--dsw-alias-interactive-bg-hover)}",
+			".evolution-param-card-title{flex:1;min-width:0;color:var(--dsw-alias-label-primary);font-size:13px;font-weight:500;line-height:1.5}",
+			".evolution-param-count{color:var(--dsw-alias-brand-primary);font-size:12px;line-height:1.5}",
+			".evolution-param-chevron{color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:1.5}",
+			".evolution-param-body{padding:0 14px 12px;border-top:.5px solid var(--dsw-alias-border-l3)}",
+			".evolution-param-field{display:flex;flex-direction:column;gap:6px;padding:12px 0}",
+			".evolution-param-field+.evolution-param-field{border-top:.5px solid var(--dsw-alias-border-l4)}",
+			".evolution-param-label{display:flex;align-items:center;gap:6px;color:var(--dsw-alias-label-primary);font-size:13px;font-weight:500;line-height:1.5}",
+			".evolution-param-unit{color:var(--dsw-alias-label-tertiary);font-weight:400}",
+			".evolution-param-hint{margin:0;color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:1.5}",
+			".evolution-param-value{color:var(--dsw-alias-label-secondary);font-size:12px;line-height:1.5}",
+			".evolution-param-input{width:100%;box-sizing:border-box;padding:8px 10px;border:.5px solid var(--dsw-alias-border-l2);border-radius:6px;background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-primary);font-size:13px;line-height:1.5}",
+			".evolution-param-input:focus{outline:none;border-color:var(--dsw-alias-brand-primary)}",
+			".evolution-param-input:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}",
+			".evolution-param-source{display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:4px;background:var(--dsw-alias-bg-layer-3);color:var(--dsw-alias-label-secondary);font-size:12px;line-height:20px}",
+			".evolution-param-source[data-user=\"true\"]{background:var(--dsw-alias-brand-primary);color:var(--dsw-alias-label-primary-foreground)}",
+			".evolution-param-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:12px}",
+			".evolution-param-button{padding:6px 12px;border:.5px solid var(--dsw-alias-border-l2);border-radius:6px;background:var(--dsw-alias-bg-layer-1);color:var(--dsw-alias-label-primary);font-size:13px;line-height:1.5;cursor:pointer}",
+			".evolution-param-button:hover:not(:disabled){background:var(--dsw-alias-interactive-bg-hover)}",
+			".evolution-param-button[data-primary=\"true\"]{background:var(--dsw-alias-button-primary-fill);color:var(--dsw-alias-label-primary-foreground);border-color:transparent}",
+			".evolution-param-button[data-primary=\"true\"]:hover:not(:disabled){background:var(--dsw-alias-button-primary-hover)}",
+			".evolution-param-button:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}",
+			".evolution-param-select{width:100%;box-sizing:border-box;padding:8px 10px;border:.5px solid var(--dsw-alias-border-l2);border-radius:6px;background:var(--dsw-alias-bg-layer-2);color:var(--dsw-alias-label-primary);font-size:13px;line-height:1.5}",
+			".evolution-param-select:focus{outline:none;border-color:var(--dsw-alias-brand-primary)}",
+			".evolution-param-select:disabled{color:var(--dsw-alias-label-dimmed);cursor:default}",
+			".evolution-param-check{width:16px;height:16px;margin:0;accent-color:var(--dsw-alias-brand-primary);cursor:pointer}",
+			".evolution-param-check:disabled{cursor:default;opacity:.5}",
+			".evolution-param-footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 0 0;border-top:.5px solid var(--dsw-alias-border-l3)}",
+			".evolution-param-note{margin:0;color:var(--dsw-alias-label-tertiary);font-size:12px;line-height:1.5}",
+			".evolution-param-error{margin:0;color:var(--dsw-alias-state-error-primary);font-size:12px;line-height:1.5}"
+		].join("");
+		/**
+		* Inject the stylesheet once per document.
+		* @param host - the document to inject into; defaults to the global one.
+		*/
+		function injectStyles(host) {
+			const doc = host ?? globalThis.document;
+			if (doc === void 0) return;
+			if (doc.querySelector("style[data-plugin-css=\"@lmzhen/dsh-evolution-settings-ui/settings.css\"]") !== null) return;
+			const tag = doc.createElement("style");
+			tag.dataset.plugin = "@lmzhen/dsh-evolution-settings-ui";
+			tag.dataset.pluginCss = CSS_TAG_ID;
+			tag.textContent = CSS;
+			doc.head.appendChild(tag);
 		}
 		//#endregion
 		//#region src/client/index.ts
-		/** Required client services: the slot registry and the settings transport. */
-		const inject = ["slots", "settingsScope"];
+		/** Required client services: the slot registry, the settings transport, the locale seat. */
+		const inject = [
+			"slots",
+			"settingsScope",
+			"locale"
+		];
+		/** Section id and nav order (the platform's own sections sit at 0/10/15/20). */
+		const SECTION_ID = "evolution";
+		const SECTION_ORDER = 25;
 		/**
-		* Register one card per generated namespace section.
+		* Register the locale namespace, the section and its cards.
 		* @param ctx - client cordis context.
 		*/
 		function apply(ctx) {
+			injectStyles();
 			const seam = ctx;
-			seam.slots.inject("settings.plugin.item", function* () {
+			let registered = false;
+			ctx.effect(() => {
+				try {
+					const dispose = seam.locale.register(NS, {
+						zh,
+						en
+					});
+					registered = true;
+					return dispose;
+				} catch {
+					return () => {};
+				}
+			}, "evolution-settings: dictionaries");
+			let bound = null;
+			const t = (key) => {
+				if (!registered) return message(key);
+				if (bound === null) try {
+					bound = seam.locale.bind(NS);
+				} catch {
+					return message(key);
+				}
+				return bound(key);
+			};
+			seam.slots.inject("settings.section", function* () {
+				yield seam.slots.register({
+					name: "settings.section",
+					id: SECTION_ID,
+					order: 25,
+					label: () => t("title"),
+					locale: NS,
+					children: { [CARD_SLOT]: {
+						kind: "keyed",
+						scope: "root"
+					} }
+				}, SettingsSection);
+			});
+			seam.slots.inject(CARD_SLOT, function* () {
 				for (const section of CLIENT_PARAM_SECTIONS) {
 					const scope = seam.settingsScope.bind({ namespace: section.namespace });
 					const source = scope;
 					const face = () => ({
 						namespace: section.namespace,
 						fields: section.fields,
-						t: (key) => message(key),
+						t,
 						write: (field, value) => scope.set(field, value),
 						clear: (field) => scope.unset(field),
 						hooks: { paramSection: source }
 					});
 					yield seam.slots.register({
-						name: "settings.plugin.item",
+						name: CARD_SLOT,
 						key: section.namespace,
 						inject: face
 					}, ParamCard);
@@ -327,6 +831,8 @@ window.__ModuleLoader__.load({
 			});
 		}
 		//#endregion
+		exports.SECTION_ID = SECTION_ID;
+		exports.SECTION_ORDER = SECTION_ORDER;
 		exports.apply = apply;
 		exports.inject = inject;