@klarkxy/dsh-zhihu 0.2.6 → 0.2.8

package/lib/client.js

@@ -353,6 +353,17 @@ ${scope} {
 /* --- Layout scaffolding. --- */
 & .dsh-ui-stack { display: flex; flex-direction: column; gap: 12px; }
 & .dsh-ui-stack-lg { display: flex; flex-direction: column; gap: 20px; }
+/* Plugin detail pages share one reading column. These are layout recipes;
+ * controls keep their own primitive styles. Form spacing follows the host's
+ * settings-form/fields.module.css and SettingsForm.module.css. */
+& .dsh-ui-page { display: flex; flex-direction: column; gap: 16px; width: 100%; max-width: 760px; min-width: 0; }
+& .dsh-ui-form { display: flex; flex-direction: column; gap: 0; min-width: 0; }
+&.dsh-ui-form > .dsh-ui-field, & .dsh-ui-form > .dsh-ui-field { padding: 12px 0; }
+& .dsh-ui-form-footer { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding-top: 16px; min-width: 0; }
+& .dsh-ui-fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; min-width: 0; margin: 0; padding: 0; border: 0; }
+@media (max-width: 560px) {
+  & .dsh-ui-fields-grid { grid-template-columns: minmax(0, 1fr); }
+}
 & .dsh-ui-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
 & .dsh-ui-row-wrap { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
 & .dsh-ui-spacer { flex: 1; min-width: 0; }
@@ -380,6 +391,9 @@ ${scope} {
  * official primitive, so this only owns the vertical rhythm. --- */
 & .dsh-ui-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
 & .dsh-ui-field + .dsh-ui-field { border-top: 0.5px solid var(--dsw-alias-border-l2); padding-top: 12px; }
+/* Grid fields share a row, so the stacked-field divider must not win later in
+ * the cascade. Reset it here, after the field recipe. */
+& .dsh-ui-fields-grid > .dsh-ui-field { padding: 0; border: 0; }
 & .dsh-ui-label { display: flex; align-items: center; gap: 6px; font-size: 13px; line-height: 20px; font-weight: 500; color: var(--dsw-alias-label-primary); }
 & .dsh-ui-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
 & .dsh-ui-help { font-size: 12px; line-height: 1.6; color: var(--dsw-alias-label-secondary); }
@@ -570,7 +584,7 @@ ${scope} {
   & *, & *::before, & *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
 }
 }
-`.replace(/^& (\.dsh-ui-[a-z0-9-]+)(?![+>~])/gm, (_match, className) => `&${className}, & ${className}`);
+`.replace(/^& (\.dsh-ui-[a-z0-9-]+)(?=\s*\{)/gm, (_match, className) => `&${className}, & ${className}`);
 }
 //#endregion
 //#region src/client-styles.ts
@@ -592,16 +606,6 @@ ${scope} {
 */
 const zhihuClientStyles = `${officialUiCss("zhihu-panel")}
 .zhihu-panel {
-/* --- Plugin page. The contract's rules nest under the scope selector, so the
- * root's own column and reading width are the one part it cannot reach. --- */
-&.zhihu-settings-embed {
-  display: flex;
-  flex-direction: column;
-  gap: 12px;
-  width: 100%;
-  max-width: 760px;
-  min-width: 0;
-}
 /* The tab strip is a primitive; this only places it in the page column. */
 .zhihu-tabs { margin: 0; }
 
@@ -618,9 +622,8 @@ const zhihuClientStyles = `${officialUiCss("zhihu-panel")}
   background: var(--dsw-alias-interactive-bg-hover-danger);
 }
 
-/* --- Disclosures. The capability and fine-print blocks use the host
- * DisclosureRow; only the reasoning block is still a native <summary>. --- */
-.zhihu-ask-reasoning > summary { cursor: pointer; width: fit-content; }
+/* --- Disclosures. Capability, fine print and the reasoning block all use the
+ * host DisclosureRow; only its detail list needs layout here. --- */
 .zhihu-guide-list { margin: 4px 0 0; padding-inline-start: 20px; display: grid; gap: 6px; }
 
 /* --- Result rows. The card, the row and the name all come from the contract; a
@@ -634,10 +637,9 @@ const zhihuClientStyles = `${officialUiCss("zhihu-panel")}
 .zhihu-ask-content { white-space: pre-wrap; }
 
 /* --- Open platform. The section is the last block of its tab, so it keeps a
- * trailing hairline; the raw response scrolls instead of growing the page. --- */
+ * trailing hairline; the response is the official JsonTree inspector. --- */
 .zhihu-open-platform { padding-bottom: 16px; border-bottom: 0.5px solid var(--dsw-alias-border-l2); }
 .zhihu-open-platform-quota > legend { padding: 0 8px 0 0; }
-.zhihu-open-platform-data { max-height: 480px; overflow: auto; margin: 8px 0 0; }
 
 /* --- Usage. The stat tiles are a grid and the day list is a table, neither of
  * which the contract has a recipe for; figures align in the columns they sit
@@ -661,7 +663,7 @@ const zhihuClientStyles = `${officialUiCss("zhihu-panel")}
 .zhihu-chart-bar-ok { fill: var(--dsw-alias-state-business-primary); }
 .zhihu-chart-bar-fail { fill: var(--dsw-alias-state-error-primary); }
 .zhihu-chart-hit { fill: transparent; }
-.zhihu-chart-grid { stroke: var(--dsw-alias-border-l2); stroke-width: 1; }
+.zhihu-chart-grid { stroke: var(--dsw-alias-border-l2); stroke-width: 0.5; }
 .zhihu-chart-axis,
 .zhihu-chart-tick,
 .zhihu-chart-value { fill: var(--dsw-alias-label-secondary); font-size: var(--dsh-content-font-size-secondary); font-family: var(--ds-font-family-code); }
@@ -695,9 +697,9 @@ const zhihuClientStyles = `${officialUiCss("zhihu-panel")}
   .zhihu-quota-table td { padding: 5px 6px; }
 }
 
-/* --- File field. The input is visually hidden but stays focusable and in the
- * accessibility tree; its <label> is the visible trigger, so a click on the
- * label opens the file dialog natively and keyboard focus rings the label. --- */
+/* --- File field. The input is visually hidden but stays in the accessibility
+ * tree; the official Button beside it is the visible trigger and forwards the
+ * click, so its own focus ring and disabled state apply. --- */
 .zhihu-file {
   position: absolute;
   width: 1px;
@@ -709,30 +711,6 @@ const zhihuClientStyles = `${officialUiCss("zhihu-panel")}
   white-space: nowrap;
   border: 0;
 }
-.zhihu-file-trigger {
-  display: inline-flex;
-  align-items: center;
-  padding: 4px 12px;
-  border: 0.5px solid var(--dsw-alias-border-l2);
-  border-radius: var(--dsw-radius-md);
-  color: var(--dsw-alias-label-primary);
-  cursor: pointer;
-  flex: none;
-}
-.zhihu-file-trigger:hover { background: var(--dsw-alias-interactive-bg-hover); }
-.zhihu-file-trigger[aria-disabled="true"] { opacity: .5; pointer-events: none; }
-.zhihu-file:focus-visible + .dsh-ui-row .zhihu-file-trigger { outline: 2px solid var(--dsw-alias-brand-primary); outline-offset: 2px; }
-
-/* 活动反馈:三点呼吸(pulse-dots),参数改写自 Amicro(MIT License,
-   Copyright (c) 2026 Syed Subhan Uddin);装饰元素 aria-hidden。 */
-.zhihu-dots { display: inline-flex; align-items: center; gap: 3px; margin-inline-end: .4em; vertical-align: middle; color: var(--dsw-alias-state-business-primary); }
-.zhihu-dots i { width: .32em; height: .32em; min-width: 3px; min-height: 3px; border-radius: 50%; background: currentColor; animation: zhihu-activity-pulse 1.4s ease infinite; }
-.zhihu-dots i:nth-child(2) { animation-delay: .2s; }
-.zhihu-dots i:nth-child(3) { animation-delay: .4s; }
-@media (prefers-reduced-motion: reduce) {
-  /* Stop the loop outright so the three dots stay lit instead of flickering. */
-  .zhihu-dots i { animation: none; }
-}
 }
 
 /* --- Links. Ordinary DSH paints a light fill on a bare <a>, so plugin links
@@ -744,9 +722,6 @@ const zhihuClientStyles = `${officialUiCss("zhihu-panel")}
   color: var(--dsw-alias-brand-primary);
   background: none;
 }
-
-/* Keyframes cannot nest inside a style rule; the name is plugin-prefixed. */
-@keyframes zhihu-activity-pulse { 0%, 100% { opacity: .2; } 50% { opacity: 1; } }
 `;
 //#endregion
 //#region src/client-host-ui.tsx
@@ -891,6 +866,21 @@ const createOpenPlatformForm = () => ({
 	apiIds: []
 });
 const isRecord = (value) => !!value && typeof value === "object" && !Array.isArray(value);
+/** Localized copy for the official JSON inspector (the package is cordis-free). */
+function jsonTreeLabels(t) {
+	return {
+		copyValue: t("复制值", "Copy value"),
+		copyJson: t("复制 JSON", "Copy JSON"),
+		copyPath: t("复制路径", "Copy path"),
+		copyPrettyJson: t("复制格式化 JSON", "Copy pretty JSON"),
+		copyCompactJson: t("复制紧凑 JSON", "Copy compact JSON"),
+		copied: t("已复制", "Copied"),
+		copyFailed: t("复制失败", "Copy failed"),
+		collapseNode: t("折叠节点", "Collapse node"),
+		expandNode: t("展开节点", "Expand node"),
+		copyButtonTitle: (action) => t(`${action}：点击复制`, `${action}: click to copy`)
+	};
+}
 /** Int64 stays decimal text throughout the browser; never round-trip through Number. */
 function openPlatformOffset(value) {
 	if (typeof value !== "string" || !/^\d+$/.test(value)) return null;
@@ -1294,9 +1284,15 @@ function ZhihuOpenPlatformSection({ rpc, quotaOnly = false, selectedOperation })
 						className: "dsh-ui-banner dsh-ui-banner--danger",
 						children: t("响应缺少正文（Body），未取得全文。", "The response has no body (Body); full text was not retrieved.")
 					}),
-					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("pre", {
-						className: "zhihu-open-platform-data dsh-ui-code",
-						children: JSON.stringify(result.data, null, 2)
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+						className: "dsh-ui-scroll",
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.JsonTree, {
+							data: result.data,
+							label: t("返回数据", "Response data"),
+							copyable: true,
+							expandTopLevel: true,
+							labels: jsonTreeLabels(t)
+						})
 					})
 				]
 			})
@@ -1727,6 +1723,358 @@ function ZhihuQuotaSection({ rpc }) {
 	});
 }
 //#endregion
+//#region src/client-sync-credentials.tsx
+/**
+* 知乎发布助手的应用凭据设置。
+*
+* 只有插件设置页（plugins.bundle.config）里才有这段表单：右侧栏工作台不发凭据，
+* 也不重复提供入口。凭据本身由宿主管理（remote.credentials），插件只读写引用。
+*/
+const ZHIHU_APP_KEY_REF = "ZHIHU_OPENAPI_APP_KEY";
+const ZHIHU_APP_SECRET_REF = "ZHIHU_OPENAPI_APP_SECRET";
+/** 申请发布助手应用凭据的官方入口。 */
+const ZHIHU_PUBLISHER_URL = "https://www.zhihu.com/playground/zhihu-publisher";
+/** 成对保存时的挂起标记；它与凭据引用名不同，不会撞上字段的「保存中…」。 */
+const PAIR_PENDING = "pair";
+const GRANT_KEY = /ZHIHU_OPENAPI_APP_KEY\s*[:=]\s*"([^"\r\n]+)"/;
+const GRANT_SECRET = /ZHIHU_OPENAPI_APP_SECRET\s*[:=]\s*"([^"\r\n]+)"/;
+const GRANT_MARKER = /ZHIHU_OPENAPI_APP_(?:KEY|SECRET)/;
+/**
+* 知乎发布助手把授权说明和两项凭据放在同一段文字里。只在两项都用引号写出时拆开；
+* 单独粘贴的 Key 或 Secret 保持原样，避免把普通文本误存成另一项。
+*/
+function parseZhihuPublisherGrant(value) {
+	const key = GRANT_KEY.exec(value);
+	const secret = GRANT_SECRET.exec(value);
+	if (!key || !secret) return null;
+	const appKey = key[1].trim();
+	const appSecret = secret[1].trim();
+	if (!appKey || !appSecret || appKey === appSecret) return null;
+	return {
+		appKey,
+		appSecret
+	};
+}
+/**
+* 文字里出现了凭据标记，但没能按受支持的格式读出两项凭据。这样的文本不能当凭据存：
+* 整段授权说明一旦落进密钥框，格式稍有出入就会变成一个坏凭据，而且要到发布时才报错。
+*/
+function looksLikeZhihuPublisherGrant(value) {
+	return GRANT_MARKER.test(value);
+}
+const FIELD_COPY = [{
+	ref: ZHIHU_APP_SECRET_REF,
+	label: "App Secret",
+	zh: "知乎发布助手的应用密钥",
+	en: "Publisher app secret",
+	hintZh: "知乎发布助手签发的应用密钥。整段授权说明粘贴在这里时，下面会自动填入用户名。",
+	hintEn: "The app secret issued by the Zhihu publisher. Pasting the authorization text here fills in the username below."
+}, {
+	ref: ZHIHU_APP_KEY_REF,
+	label: "App Key",
+	zh: "知乎主页用户名",
+	en: "Profile username",
+	hintZh: "知乎个人主页地址里的用户名，例如 www.zhihu.com/people/<你的用户名>。这不是密钥，以明文显示。",
+	hintEn: "The username in your Zhihu profile URL, e.g. www.zhihu.com/people/<your username>. This is not a secret and is shown in plain text.",
+	plain: true
+}];
+/** 只有 http(s) 可以成为链接；其余一律降级为文本。 */
+function safeUrl$1(url) {
+	return /^https?:\/\//i.test(url) ? url : null;
+}
+function PublisherLink(props) {
+	const url = safeUrl$1(props.url);
+	if (!url) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: props.children });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
+		className: "zhihu-link",
+		href: url,
+		target: "_blank",
+		rel: "noreferrer noopener",
+		children: props.children
+	});
+}
+function ZhihuSyncCredentials(props) {
+	const t = useT();
+	const { credentials } = props;
+	const alive = (0, react.useRef)(false);
+	const [state, setState] = (0, react.useState)({ status: "loading" });
+	const [drafts, setDrafts] = (0, react.useState)({});
+	const [paired, setPaired] = (0, react.useState)(false);
+	const [pending, setPending] = (0, react.useState)(null);
+	const [confirmRef, setConfirmRef] = (0, react.useState)(null);
+	const [failure, setFailure] = (0, react.useState)("");
+	const [note, setNote] = (0, react.useState)("");
+	const views = state.status === "ready" ? state.credentials : {};
+	const writable = (ref) => views[ref]?.writable !== false;
+	(0, react.useEffect)(() => {
+		alive.current = true;
+		return () => {
+			alive.current = false;
+		};
+	}, []);
+	const load = (0, react.useCallback)(async () => {
+		setState((current) => current.status === "ready" ? current : { status: "loading" });
+		try {
+			const result = await credentials.describe({ refs: FIELD_COPY.map((field) => field.ref) });
+			if (!alive.current) return;
+			if (!result.ok) {
+				setState({
+					status: "error",
+					error: result.error.message
+				});
+				return;
+			}
+			setState({
+				status: "ready",
+				credentials: result.value.credentials
+			});
+		} catch (cause) {
+			if (!alive.current) return;
+			setState({
+				status: "error",
+				error: cause instanceof Error ? cause.message : String(cause)
+			});
+		}
+	}, [credentials]);
+	(0, react.useEffect)(() => {
+		load();
+	}, [load]);
+	const save = async (refs) => {
+		if (pending !== null) return;
+		const writes = refs.map((ref) => ({
+			ref,
+			value: (drafts[ref] ?? "").trim()
+		})).filter((item) => item.value && writable(item.ref));
+		if (!writes.length) return;
+		setPending(refs.length > 1 ? PAIR_PENDING : refs[0]);
+		setFailure("");
+		setNote("");
+		try {
+			for (const write of writes) {
+				const result = await credentials.set(write);
+				if (!alive.current) return;
+				if (!result.ok) {
+					setFailure(result.error.message);
+					return;
+				}
+			}
+			setDrafts((current) => {
+				const next = { ...current };
+				for (const write of writes) delete next[write.ref];
+				return next;
+			});
+			setPaired(false);
+			setNote(writes.length > 1 ? ["已保存用户名与密钥。", "Saved the username and the secret."] : ["已保存。", "Saved."]);
+			await load();
+		} catch (cause) {
+			if (!alive.current) return;
+			setFailure(cause instanceof Error ? cause.message : String(cause));
+		} finally {
+			if (alive.current) setPending(null);
+		}
+	};
+	const clear = async (ref) => {
+		setConfirmRef(null);
+		if (pending !== null) return;
+		setPending(ref);
+		setFailure("");
+		setNote("");
+		try {
+			const result = await credentials.unset({ ref });
+			if (!alive.current) return;
+			if (!result.ok) {
+				setFailure(result.error.message);
+				return;
+			}
+			setDrafts((current) => ({
+				...current,
+				[ref]: ""
+			}));
+			setPaired(false);
+			setNote(["已清除。", "Cleared."]);
+			await load();
+		} catch (cause) {
+			if (!alive.current) return;
+			setFailure(cause instanceof Error ? cause.message : String(cause));
+		} finally {
+			if (alive.current) setPending(null);
+		}
+	};
+	if (state.status === "loading") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
+		className: "dsh-ui-stack",
+		"aria-label": t("知乎发布助手凭据", "Zhihu publisher credentials"),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			className: "dsh-ui-loading",
+			role: "status",
+			children: t("正在读取凭据状态…", "Loading credential status…")
+		})
+	});
+	if (state.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+		className: "dsh-ui-stack",
+		"aria-label": t("知乎发布助手凭据", "Zhihu publisher credentials"),
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+			className: "dsh-ui-error",
+			role: "alert",
+			children: clientText(state.error, t)
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "dsh-ui-actions",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
+				onClick: () => void load(),
+				children: t("重试", "Retry")
+			})
+		})]
+	});
+	const confirmed = confirmRef ? FIELD_COPY.find((field) => field.ref === confirmRef) : void 0;
+	const pairReady = paired && (drafts["ZHIHU_OPENAPI_APP_KEY"] ?? "").trim() !== "" && (drafts["ZHIHU_OPENAPI_APP_SECRET"] ?? "").trim() !== "";
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+		className: "dsh-ui-stack",
+		"aria-label": t("知乎发布助手凭据", "Zhihu publisher credentials"),
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h4", {
+				className: "dsh-ui-heading",
+				children: t("知乎发布助手", "Zhihu publisher")
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+				className: "dsh-ui-help",
+				children: [
+					t("发布助手使用另一组应用凭据，与搜索用的 Access Secret 无关。把知乎给出的授权说明粘贴到上面的密钥框即可，两项凭据要写成 ZHIHU_OPENAPI_APP_KEY:\"…\" 与 ZHIHU_OPENAPI_APP_SECRET:\"…\" 的形式，用户名会自动填到下面。", "The publisher uses its own app credentials, separate from the search Access Secret. Paste Zhihu’s authorization text into the secret field above — both credentials must be written as ZHIHU_OPENAPI_APP_KEY:\"…\" and ZHIHU_OPENAPI_APP_SECRET:\"…\" — and the username fills in below."),
+					" ",
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(PublisherLink, {
+						url: ZHIHU_PUBLISHER_URL,
+						children: t("申请凭据", "Get credentials")
+					})
+				]
+			}),
+			paired ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "dsh-ui-hint",
+				children: t("这两项来自同一段授权说明，可以一起保存。", "These two came from the same authorization text and can be saved together.")
+			}) : null,
+			FIELD_COPY.map((field) => {
+				const view = state.credentials[field.ref];
+				const locked = view?.writable === false;
+				const configured = view?.configured === true;
+				const draft = drafts[field.ref] ?? "";
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "dsh-ui-field",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "dsh-ui-label-row",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "dsh-ui-label",
+								id: `zhihu-sync-cred-${field.ref}`,
+								children: field.label
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+								className: "dsh-ui-row",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.StateDot, { state: locked ? "warning" : configured ? "done" : "idle" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "dsh-ui-meta",
+									children: locked ? t("由环境变量提供（只读）", "Provided by an environment variable (read-only)") : configured ? t("已保存", "Saved") : t("未配置", "Not set")
+								})]
+							})]
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: "dsh-ui-hint",
+							children: t(field.hintZh, field.hintEn)
+						}),
+						renderInput({
+							type: field.plain ? "text" : "password",
+							value: draft,
+							disabled: locked || pending !== null,
+							"aria-label": field.label,
+							"aria-describedby": `zhihu-sync-cred-${field.ref}`,
+							placeholder: locked ? t("由环境变量提供", "Set by an environment variable") : t("粘贴凭据", "Paste the credential"),
+							onChange: (value) => {
+								const grant = parseZhihuPublisherGrant(value);
+								if (grant) {
+									const next = {};
+									if (writable("ZHIHU_OPENAPI_APP_KEY")) next[ZHIHU_APP_KEY_REF] = grant.appKey;
+									if (writable("ZHIHU_OPENAPI_APP_SECRET")) next[ZHIHU_APP_SECRET_REF] = grant.appSecret;
+									setDrafts((current) => ({
+										...current,
+										...next
+									}));
+									setPaired(true);
+									setFailure("");
+									setNote(Object.keys(next).length === 2 ? ["已从授权说明读出用户名与密钥。", "Read the username and the secret from the authorization text."] : ["已从授权说明读出一项凭据；另一项当前是只读的，不会被改动。", "Read one credential from the authorization text; the other is read-only and is left alone."]);
+									return;
+								}
+								if (looksLikeZhihuPublisherGrant(value)) {
+									setFailure(["这段文字里有知乎凭据标记，但没能读出 App Key 与 App Secret。请确认两项都写成 ZHIHU_OPENAPI_APP_KEY:\"…\" 与 ZHIHU_OPENAPI_APP_SECRET:\"…\" 的形式。", "This text contains Zhihu credential markers, but no App Key and App Secret could be read from it. Both must be written as ZHIHU_OPENAPI_APP_KEY:\"…\" and ZHIHU_OPENAPI_APP_SECRET:\"…\"."]);
+									setNote("");
+									return;
+								}
+								setDrafts((current) => ({
+									...current,
+									[field.ref]: value
+								}));
+								if (!value.trim()) setPaired(false);
+								setFailure("");
+								setNote("");
+							}
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "dsh-ui-actions",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
+								variant: "primary",
+								disabled: locked || pending !== null || draft.trim() === "",
+								onClick: () => void save([field.ref]),
+								children: pending === field.ref ? t("保存中…", "Saving…") : t("保存", "Save")
+							}), locked ? null : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
+								variant: "danger",
+								disabled: pending !== null || !configured,
+								onClick: () => setConfirmRef(field.ref),
+								children: pending === field.ref ? t("清除中…", "Clearing…") : t("清除", "Clear")
+							})]
+						})
+					]
+				}, field.ref);
+			}),
+			pairReady ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				className: "dsh-ui-actions",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
+					variant: "primary",
+					disabled: pending !== null,
+					onClick: () => void save([ZHIHU_APP_KEY_REF, ZHIHU_APP_SECRET_REF]),
+					children: pending === PAIR_PENDING ? t("保存中…", "Saving…") : t("保存两项", "Save both")
+				})
+			}) : null,
+			note ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "dsh-ui-notice",
+				role: "status",
+				children: clientText(note, t)
+			}) : null,
+			failure ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "dsh-ui-error",
+				role: "alert",
+				children: clientText(failure, t)
+			}) : null,
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Modal, {
+				open: confirmed !== void 0,
+				onClose: () => setConfirmRef(null),
+				title: t("清除发布助手凭据？", "Clear the publisher credentials?"),
+				closeLabel: t("关闭", "Close"),
+				className: "zhihu-panel",
+				footer: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "dsh-ui-actions",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
+						onClick: () => setConfirmRef(null),
+						children: t("取消", "Cancel")
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
+						variant: "danger",
+						onClick: () => {
+							if (confirmed) clear(confirmed.ref);
+						},
+						children: t("清除", "Clear")
+					})]
+				}),
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+					className: "dsh-ui-help",
+					children: t("清除后，发布与预览会失败，直到重新填写凭据。", "Publishing and previewing fail until you enter the credentials again.")
+				})
+			})
+		]
+	});
+}
+//#endregion
 //#region src/client.tsx
 const name = "dsh-zhihu-client";
 const inject = [
@@ -1738,14 +2086,9 @@ const inject = [
 ];
 const PACKAGE_NAME = "@klarkxy/dsh-zhihu";
 const SLOT_ORDER = 120;
-const activityDots = () => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-	className: "zhihu-dots",
-	"aria-hidden": "true",
-	children: [
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", {}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", {}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("i", {})
-	]
+const activityText = (children) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.TextShimmer, {
+	active: true,
+	children
 });
 function wrapCredentials(remote) {
 	return {
@@ -1961,6 +2304,27 @@ function LinkOrText(props) {
 		children: props.label
 	});
 }
+/** 直答的思考过程：官方 DisclosureRow 承载折叠，卡面用契约的 flat 卡片。 */
+function ReasoningDisclosure(props) {
+	const t = useT();
+	const [open, setOpen] = (0, react.useState)(false);
+	const toggle = (0, react.useCallback)(() => setOpen((value) => !value), []);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: "zhihu-ask-reasoning dsh-ui-card dsh-ui-card--flat",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.DisclosureRow, {
+			icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.IconThinkOutlineRegular, {}),
+			title: t("思考过程", "Reasoning"),
+			open,
+			expandable: true,
+			expandOnRowClick: true,
+			onToggle: toggle,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+				className: "dsh-ui-help",
+				children: props.reasoning
+			})
+		})
+	});
+}
 function OutcomeView(props) {
 	const { outcome, stale } = props;
 	const t = useT();
@@ -1973,16 +2337,7 @@ function OutcomeView(props) {
 	let summary = "";
 	if (outcome.mode === "ask") {
 		summary = t(`直答（${outcome.answer.model || "默认模型"}）`, `Direct answer (${outcome.answer.model || "default model"})`);
-		body = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [outcome.answer.reasoning ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("details", {
-			className: "zhihu-ask-reasoning dsh-ui-card dsh-ui-card--flat",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("summary", {
-				className: "dsh-ui-heading",
-				children: t("思考过程", "Reasoning")
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "dsh-ui-help",
-				children: outcome.answer.reasoning
-			})]
-		}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+		body = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [outcome.answer.reasoning ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ReasoningDisclosure, { reasoning: outcome.answer.reasoning }) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 			className: "zhihu-ask-content dsh-ui-wrap",
 			children: outcome.answer.content
 		})] });
@@ -2125,7 +2480,7 @@ function CapabilitiesNote(props) {
 function SettingsShell(props) {
 	const t = useT();
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-		className: "dsh-ui-stack",
+		className: "dsh-ui-form",
 		"data-testid": "zhihu-settings",
 		"aria-label": t("知乎凭证设置", "Zhihu credential settings"),
 		children: [props.children, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CapabilitiesNote, {})]
@@ -2173,10 +2528,10 @@ function SettingsSection(props) {
 	(0, react.useEffect)(() => {
 		load();
 	}, [load]);
-	if (state.status === "loading") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingsShell, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+	if (state.status === "loading") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingsShell, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 		className: "dsh-ui-loading",
 		role: "status",
-		children: [activityDots(), t("正在读取凭证状态…", "Loading credential status…")]
+		children: activityText(t("正在读取凭证状态…", "Loading credential status…"))
 	}) });
 	if (state.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(SettingsShell, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 		className: "dsh-ui-error",
@@ -2294,18 +2649,18 @@ function SettingsSection(props) {
 			children: clientText(note, t)
 		}) : null,
 		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: "dsh-ui-actions",
+			className: "dsh-ui-form-footer",
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
 				variant: "danger",
 				className: "zhihu-button-danger",
 				disabled: busy || keyLocked || !configured,
 				onClick: () => setConfirmClear(true),
-				children: pending === "clear" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [activityDots(), t("清除中…", "Clearing…")] }) : t("清除", "Clear")
+				children: pending === "clear" ? activityText(t("清除中…", "Clearing…")) : t("清除", "Clear")
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
 				variant: "primary",
 				disabled: busy || keyLocked || keyValue.length === 0 || draftFailure !== void 0,
 				onClick: () => void save(),
-				children: pending === "save" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [activityDots(), t("保存中…", "Saving…")] }) : t("保存", "Save")
+				children: pending === "save" ? activityText(t("保存中…", "Saving…")) : t("保存", "Save")
 			})]
 		}),
 		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_deepseek_ai_dsh_client_ui_primitives.Modal, {
@@ -2578,10 +2933,10 @@ function UsageSection(props) {
 	if (state.status === "loading") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("section", {
 		"data-testid": "zhihu-usage",
 		"aria-label": sectionLabel,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 			className: "dsh-ui-loading",
 			role: "status",
-			children: [activityDots(), t("正在读取用量…", "Loading usage…")]
+			children: activityText(t("正在读取用量…", "Loading usage…"))
 		})
 	});
 	if (state.status === "error") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
@@ -2761,6 +3116,7 @@ function KnowledgeSection(props) {
 	const [baseId, setBaseId] = (0, react.useState)("");
 	const [file, setFile] = (0, react.useState)(void 0);
 	const [fileKey, setFileKey] = (0, react.useState)(0);
+	const fileInputRef = (0, react.useRef)(null);
 	const [busy, setBusy] = (0, react.useState)(false);
 	const [note, setNote] = (0, react.useState)(void 0);
 	const [failure, setFailure] = (0, react.useState)(void 0);
@@ -2856,10 +3212,10 @@ function KnowledgeSection(props) {
 					})
 				]
 			}),
-			list.status === "loading" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+			list.status === "loading" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 				className: "dsh-ui-loading",
 				role: "status",
-				children: [activityDots(), t("正在读取知识库列表…", "Loading knowledge bases…")]
+				children: activityText(t("正在读取知识库列表…", "Loading knowledge bases…"))
 			}) : null,
 			list.status === "error" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 				className: "dsh-ui-error",
@@ -2916,6 +3272,8 @@ function KnowledgeSection(props) {
 						children: t("参考资料", "Reference file")
 					}),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+						ref: fileInputRef,
+						tabIndex: -1,
 						id: "zhihu-kb-file",
 						type: "file",
 						accept: KB_ACCEPT,
@@ -2926,10 +3284,9 @@ function KnowledgeSection(props) {
 					}, fileKey),
 					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: "dsh-ui-row",
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("label", {
-							htmlFor: "zhihu-kb-file",
-							className: "zhihu-file-trigger",
-							"aria-disabled": busy || void 0,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuButton, {
+							disabled: busy,
+							onClick: () => fileInputRef.current?.click(),
 							children: t("选择文件", "Choose file")
 						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
 							className: "dsh-ui-meta dsh-ui-wrap",
@@ -2948,7 +3305,7 @@ function KnowledgeSection(props) {
 					variant: "primary",
 					disabled: busy || !file,
 					onClick: () => void upload(),
-					children: busy ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [activityDots(), t("上传中…", "Uploading…")] }) : t("确认上传", "Upload")
+					children: busy ? activityText(t("上传中…", "Uploading…")) : t("确认上传", "Upload")
 				})
 			}) : null,
 			note ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
@@ -3199,7 +3556,7 @@ function ZhihuSettings(props) {
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: phase === "loading" ? "dsh-ui-loading" : "dsh-ui-hint",
 				role: "status",
-				children: phase === "loading" ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [activityDots(), t("正在请求知乎…", "Requesting Zhihu…")] }) : phase === "idle" && mode !== "hot" && !query.trim() ? t("输入关键词后搜索。", "Enter keywords to search.") : null
+				children: phase === "loading" ? activityText(t("正在请求知乎…", "Requesting Zhihu…")) : phase === "idle" && mode !== "hot" && !query.trim() ? t("输入关键词后搜索。", "Enter keywords to search.") : null
 			}),
 			phase === "error" && failure ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 				className: "dsh-ui-error",
@@ -3216,12 +3573,16 @@ function ZhihuSettings(props) {
 		}, testOperation)]
 	});
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
-		className: "zhihu-panel zhihu-settings-embed",
+		className: "zhihu-panel zhihu-settings-embed dsh-ui-page",
 		"data-testid": "zhihu-settings-embed",
 		"aria-label": t("知乎", "Zhihu"),
 		children: [
 			tablist,
-			panel("settings", /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingsSection, { credentials }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuCallPolicySection, { rpc })] })),
+			panel("settings", /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SettingsSection, { credentials }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuSyncCredentials, { credentials }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuCallPolicySection, { rpc })
+			] })),
 			panel("usage", /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UsageSection, { rpc })),
 			panel("quota", /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ZhihuQuotaSection, { rpc })),
 			panel("knowledge", /* @__PURE__ */ (0, react_jsx_runtime.jsx)(KnowledgeSection, { rpc })),