@jingyi0605/codingns4dsh 0.2.1-beta.7 → 0.2.1-beta.9

package/data/build/dist/client/client.assistant-workbench.js

@@ -1245,6 +1245,28 @@ window.__ModuleLoader__.load({
 			});
 			return parts;
 		}
+		/** 将同一正文位置连续发生的工具归入一个 DSH 风格 step；正文仍保持原有穿插位置。 */
+		function assistantMessageStepTimeline(text, calls = []) {
+			const parts = assistantMessageTimeline(text, calls);
+			const grouped = [];
+			for (const part of parts) {
+				if (part.kind === "text") {
+					grouped.push(part);
+					continue;
+				}
+				const previous = grouped.at(-1);
+				if (previous?.kind === "tool-step") grouped[grouped.length - 1] = {
+					...previous,
+					calls: [...previous.calls, part.call]
+				};
+				else grouped.push({
+					kind: "tool-step",
+					key: `tool-step-${part.call.id}`,
+					calls: [part.call]
+				});
+			}
+			return grouped;
+		}
 		//#endregion
 		//#region src/client/features/assistant-record-style.ts
 		/** 工具记录和通话记录共享交互反馈，选择器只作用于这两类组件。 */
@@ -1270,14 +1292,21 @@ window.__ModuleLoader__.load({
 			}, (0, react.createElement)("path", { d: "m9 5 7 7-7 7" }));
 		}
 		const recordCss = `
-.codingns-assistant-tool-summary{list-style:none;cursor:pointer;border-radius:9px}
+.codingns-assistant-tool-summary{list-style:none;cursor:pointer}
 .codingns-assistant-tool-summary::-webkit-details-marker{display:none}
-.codingns-assistant-tool-summary:hover,.codingns-assistant-record-button:hover{background:${require_theme.dshThemeColor.hoverBackground}!important}
-.codingns-assistant-tool-summary:active,.codingns-assistant-record-button:active{background:${require_theme.dshThemeColor.activeBackground}!important}
+.codingns-assistant-tool-summary:hover,.codingns-assistant-record-button:hover{color:${require_theme.dshThemeColor.labelPrimary}!important}
+.codingns-assistant-tool-summary:active,.codingns-assistant-record-button:active{color:${require_theme.dshThemeColor.labelPrimary}!important}
 .codingns-assistant-tool-summary:focus-visible,.codingns-assistant-record-button:focus-visible{outline:2px solid ${require_theme.dshThemeColor.accent};outline-offset:2px}
-.codingns-assistant-tool-details[open]>.codingns-assistant-tool-summary{border-radius:9px 9px 0 0}
 .codingns-assistant-tool-details[open] .codingns-assistant-tool-name{white-space:normal!important;overflow-wrap:anywhere}
 .codingns-assistant-tool-details[open]>.codingns-assistant-tool-summary .codingns-assistant-record-chevron{transform:rotate(90deg)}
+.codingns-assistant-tool-step-summary{list-style:none;cursor:pointer}
+.codingns-assistant-tool-step-summary::-webkit-details-marker{display:none}
+.codingns-assistant-tool-step-summary:hover{color:${require_theme.dshThemeColor.labelPrimary}!important}
+.codingns-assistant-tool-step-summary:active{color:${require_theme.dshThemeColor.labelPrimary}!important}
+.codingns-assistant-tool-step-summary:focus-visible{outline:2px solid ${require_theme.dshThemeColor.accent};outline-offset:2px}
+.codingns-assistant-tool-step-details[open]>.codingns-assistant-tool-step-summary .codingns-assistant-step-chevron{transform:rotate(180deg)}
+.codingns-assistant-tool-step-details[open] .codingns-assistant-tool-step-body{padding-inline:4px}
+.codingns-assistant-tool-step-details[open] .codingns-assistant-tool-step-preview{white-space:normal;overflow-wrap:anywhere}
 .codingns-assistant-voice-dialog[open]{display:flex;flex-direction:column}
 .codingns-assistant-voice-dialog::backdrop{background:${require_theme.dshThemeColor.overlay}}
 `;
@@ -1336,9 +1365,9 @@ window.__ModuleLoader__.load({
 		}
 		/** 文字聊天、实时字幕与通话历史共用同一时间线，不额外生成工具汇总区。 */
 		function AssistantMessageContentView({ text, calls, t }) {
-			return (0, react.createElement)(react.Fragment, null, ...assistantMessageTimeline(text, calls).map((part) => part.kind === "tool" ? (0, react.createElement)(AssistantToolCallsView, {
+			return (0, react.createElement)(react.Fragment, null, ...assistantMessageStepTimeline(text, calls).map((part) => part.kind === "tool-step" ? (0, react.createElement)(AssistantToolStepView, {
 				key: part.key,
-				calls: [part.call],
+				calls: part.calls,
 				t
 			}) : (0, react.createElement)("div", {
 				key: part.key,
@@ -1350,14 +1379,15 @@ window.__ModuleLoader__.load({
 			}, part.text)));
 		}
 		/** 工具信息单独展示，不拼入消息正文，字幕与语音合成都只使用原始 text。 */
-		function AssistantToolCallsView({ calls, t }) {
+		function AssistantToolCallsView({ calls, t, compact = false }) {
 			if (!calls?.length) return null;
 			return (0, react.createElement)("div", {
 				"data-codingns-assistant-tools": true,
+				"data-codingns-assistant-tools-compact": compact,
 				style: {
 					display: "grid",
-					gap: 6,
-					marginBlock: 6,
+					gap: 2,
+					marginBlock: compact ? 0 : 6,
 					textAlign: "left",
 					whiteSpace: "normal",
 					minWidth: 0
@@ -1365,26 +1395,113 @@ window.__ModuleLoader__.load({
 			}, (0, react.createElement)(AssistantRecordStyle), ...calls.map((call) => (0, react.createElement)(AssistantToolCallView, {
 				key: call.id,
 				call,
-				t
+				t,
+				compact
 			})));
 		}
+		/** 一个 step 只显示摘要；展开后才加载其中的工具调用明细。 */
+		function AssistantToolStepView({ calls, t }) {
+			if (calls.length === 0) return null;
+			const running = calls.some((call) => call.state === "running");
+			const failed = calls.some((call) => call.state === "failed");
+			const status = running ? "running" : failed ? "failed" : calls.every((call) => call.state === "cancelled") ? "cancelled" : "completed";
+			const latestCall = calls[calls.length - 1];
+			const latestArguments = assistantToolArgumentPreview(latestCall, t);
+			const summary = calls.map((call) => assistantToolStepPreview(call, t)).filter((value, index, all) => all.indexOf(value) === index).join(t("awb.call.separator"));
+			return (0, react.createElement)("div", {
+				"data-codingns-assistant-tool-step": true,
+				style: {
+					marginBlock: 6,
+					textAlign: "left",
+					whiteSpace: "normal",
+					minWidth: 0,
+					color: require_theme.dshThemeColor.labelSecondary,
+					fontSize: require_theme.uiFontSize(13),
+					lineHeight: 1.6
+				}
+			}, (0, react.createElement)(AssistantRecordStyle), (0, react.createElement)("details", { className: "codingns-assistant-tool-step-details" }, (0, react.createElement)("summary", {
+				className: "codingns-assistant-tool-step-summary",
+				title: t("awb.call.stepDetails"),
+				"aria-label": `${t("awb.call.step")} · ${summary} · ${t(`awb.call.tool.${status}`)}`,
+				style: {
+					display: "flex",
+					alignItems: "center",
+					gap: 8,
+					minWidth: 0,
+					padding: "2px 0",
+					color: require_theme.dshThemeColor.labelSecondary
+				}
+			}, (0, react.createElement)(AssistantStepChevron), (0, react.createElement)("span", {
+				className: "codingns-assistant-tool-step-preview",
+				"data-latest-tool": latestCall.name,
+				title: latestCall.name,
+				style: {
+					minWidth: 0,
+					overflow: "hidden",
+					textOverflow: "ellipsis",
+					whiteSpace: "nowrap"
+				}
+			}, summary, " · ", (0, react.createElement)("code", { style: {
+				color: require_theme.dshThemeColor.labelPrimary,
+				fontFamily: require_theme.dshThemeColor.codeFont,
+				fontSize: "0.92em"
+			} }, latestCall.name), latestArguments ? ` · ${latestArguments}` : "")), (0, react.createElement)("div", {
+				className: "codingns-assistant-tool-step-body",
+				style: {
+					display: "grid",
+					gap: 1,
+					padding: "4px 0 5px 21px"
+				}
+			}, (0, react.createElement)(AssistantToolCallsView, {
+				calls,
+				t,
+				compact: true
+			}))));
+		}
+		function assistantToolStepPreview(call, t) {
+			if (call.name.includes("read") || call.kind === "attachment") return t("awb.call.stepRead");
+			if (call.name.includes("search") || call.kind === "web-search") return t("awb.call.stepSearch");
+			if (call.name.includes("workspace") || call.kind === "workspace") return t("awb.call.stepWorkspace");
+			return t("awb.call.stepTool");
+		}
+		function assistantToolArgumentPreview(call, t) {
+			try {
+				const args = JSON.parse(call.arguments);
+				if (args === null || typeof args !== "object" || Array.isArray(args)) return "";
+				const record = args;
+				for (const key of [
+					"query",
+					"queries",
+					"text",
+					"url",
+					"fileName",
+					"filename",
+					"file",
+					"title",
+					"message"
+				]) {
+					const value = record[key];
+					const preview = typeof value === "string" ? value : Array.isArray(value) ? value.filter((item) => typeof item === "string").join(t("awb.call.separator")) : "";
+					if (preview.trim()) return preview.trim().slice(0, 120);
+				}
+			} catch {}
+			return "";
+		}
 		/** 整个标题栏就是展开入口；实时状态更新不替换 details，保留用户的展开状态。 */
-		function AssistantToolCallView({ call, t }) {
+		function AssistantToolCallView({ call, t, compact = false }) {
 			const label = t(call.kind === "web-search" ? "awb.call.webSearch" : call.kind === "attachment" ? "awb.call.attachment" : "awb.call.workspace");
 			const status = t(`awb.call.tool.${call.state}`);
-			const color = call.state === "failed" ? require_theme.dshThemeColor.error : call.state === "completed" ? require_theme.dshThemeColor.success : call.state === "running" ? require_theme.dshThemeColor.accent : require_theme.dshThemeColor.labelSecondary;
-			const startedAt = new Date(call.startedAt);
-			return (0, react.createElement)("article", {
+			const argumentPreview = compact ? assistantToolArgumentPreview(call, t) : "";
+			const rowColor = call.state === "failed" ? require_theme.dshThemeColor.error : require_theme.dshThemeColor.labelSecondary;
+			return (0, react.createElement)("div", {
+				"data-codingns-assistant-tool-row": call.name,
 				"data-codingns-assistant-tool": call.name,
 				"data-state": call.state,
 				style: {
-					borderRadius: 10,
-					border: `1px solid ${require_theme.dshThemeColor.border}`,
-					background: require_theme.dshThemeColor.surfaceSubtle,
-					color: require_theme.dshThemeColor.labelPrimary,
-					fontSize: require_theme.uiFontSize(12),
-					lineHeight: 1.4,
-					minWidth: 0
+					minWidth: 0,
+					color: rowColor,
+					fontSize: require_theme.uiFontSize(13),
+					lineHeight: 1.65
 				}
 			}, (0, react.createElement)("details", { className: "codingns-assistant-tool-details" }, (0, react.createElement)("summary", {
 				className: "codingns-assistant-tool-summary",
@@ -1394,98 +1511,53 @@ window.__ModuleLoader__.load({
 					display: "flex",
 					alignItems: "center",
 					gap: 8,
-					padding: "8px 10px",
-					minWidth: 0
+					minWidth: 0,
+					padding: "1px 0"
 				}
-			}, (0, react.createElement)("span", { style: {
-				display: "grid",
-				placeItems: "center",
-				flexShrink: 0,
-				width: 28,
-				height: 28,
-				borderRadius: 8,
-				color,
-				background: `color-mix(in srgb, ${color} 9%, transparent)`
-			} }, (0, react.createElement)(AssistantToolIcon, { kind: call.kind })), (0, react.createElement)("span", { style: {
-				flex: "1 1 auto",
-				minWidth: 0,
-				display: "grid",
-				gap: 1
-			} }, (0, react.createElement)("strong", { style: {
-				fontSize: require_theme.uiFontSize(12),
-				fontWeight: 600
-			} }, label), (0, react.createElement)("span", {
-				className: "codingns-assistant-tool-name",
+			}, (0, react.createElement)(AssistantRecordChevron), (0, react.createElement)("span", { style: { flexShrink: 0 } }, label), (0, react.createElement)("span", { style: {
+				color: require_theme.dshThemeColor.labelTertiary,
+				flexShrink: 0
+			} }, "·"), (0, react.createElement)("span", {
 				title: call.name,
 				style: {
-					color: require_theme.dshThemeColor.labelSecondary,
-					fontFamily: require_theme.dshThemeColor.codeFont,
-					fontSize: require_theme.uiFontSize(11),
+					minWidth: 0,
 					overflow: "hidden",
 					textOverflow: "ellipsis",
-					whiteSpace: "nowrap"
-				}
-			}, call.name)), (0, react.createElement)("span", { style: {
-				display: "grid",
-				justifyItems: "end",
-				gap: 3,
-				flexShrink: 0
-			} }, (0, react.createElement)("span", {
-				role: "status",
-				style: {
-					display: "inline-flex",
-					alignItems: "center",
-					gap: 4,
-					color,
-					padding: "1px 6px",
-					borderRadius: 5,
-					background: `color-mix(in srgb, ${color} 9%, transparent)`,
-					fontSize: require_theme.uiFontSize(11),
-					whiteSpace: "nowrap"
+					whiteSpace: "nowrap",
+					fontFamily: require_theme.dshThemeColor.codeFont
 				}
-			}, (0, react.createElement)("span", {
-				"aria-hidden": true,
+			}, call.name, argumentPreview ? ` · ${argumentPreview}` : "")), (0, react.createElement)("div", {
+				className: "codingns-assistant-tool-body",
 				style: {
-					width: 4,
-					height: 4,
-					borderRadius: "50%",
-					background: "currentColor"
+					display: "grid",
+					gap: 0,
+					margin: "2px 0 4px 22px",
+					border: `0.5px solid ${require_theme.dshThemeColor.border}`,
+					borderRadius: 6,
+					overflow: "hidden",
+					minWidth: 0
 				}
-			}), status), (0, react.createElement)("time", {
-				dateTime: Number.isNaN(startedAt.valueOf()) ? void 0 : startedAt.toISOString(),
-				title: startedAt.toLocaleString(),
+			}, ...[[t("awb.call.arguments"), call.arguments], [t("awb.call.result"), call.result]].map(([heading, value], index) => (0, react.createElement)("div", {
+				key: heading,
 				style: {
-					color: require_theme.dshThemeColor.labelTertiary,
-					fontSize: require_theme.uiFontSize(10),
-					fontVariantNumeric: "tabular-nums",
-					whiteSpace: "nowrap"
+					display: "grid",
+					gridTemplateColumns: "max-content minmax(0, 1fr)",
+					gap: 12,
+					alignItems: "baseline",
+					padding: "7px 10px",
+					minWidth: 0,
+					...index === 0 ? {} : { borderTop: `0.5px solid ${require_theme.dshThemeColor.border}` }
 				}
-			}, startedAt.toLocaleTimeString([], {
-				hour: "2-digit",
-				minute: "2-digit",
-				second: "2-digit",
-				hour12: false
-			}))), (0, react.createElement)(AssistantRecordChevron)), (0, react.createElement)("div", { style: {
-				display: "grid",
-				gap: 8,
-				padding: "9px 10px 10px",
-				borderTop: `1px solid ${require_theme.dshThemeColor.border}`,
-				minWidth: 0
-			} }, ...[[t("awb.call.arguments"), call.arguments], [t("awb.call.result"), call.result]].map(([heading, value]) => (0, react.createElement)("div", {
-				key: heading,
-				style: { minWidth: 0 }
 			}, (0, react.createElement)("small", { style: {
-				color: require_theme.dshThemeColor.labelSecondary,
+				color: require_theme.dshThemeColor.labelTertiary,
 				fontSize: require_theme.uiFontSize(11),
-				fontWeight: 500
+				whiteSpace: "nowrap"
 			} }, heading), (0, react.createElement)("pre", {
 				tabIndex: 0,
 				"aria-label": heading,
 				style: {
-					margin: "4px 0 0",
-					padding: "6px 8px",
-					borderRadius: 6,
-					background: require_theme.dshThemeColor.cardBackground,
+					margin: 0,
+					color: require_theme.dshThemeColor.labelSecondary,
 					maxHeight: 160,
 					overflowY: "auto",
 					overscrollBehavior: "contain",
@@ -1498,18 +1570,23 @@ window.__ModuleLoader__.load({
 				}
 			}, value || "—"))))));
 		}
-		function AssistantToolIcon({ kind }) {
+		function AssistantStepChevron() {
 			return (0, react.createElement)("svg", {
-				width: 16,
-				height: 16,
+				className: "codingns-assistant-step-chevron",
+				width: 14,
+				height: 14,
 				viewBox: "0 0 24 24",
 				fill: "none",
 				stroke: "currentColor",
-				strokeWidth: 1.7,
+				strokeWidth: 1.8,
 				strokeLinecap: "round",
 				strokeLinejoin: "round",
-				"aria-hidden": true
-			}, (0, react.createElement)("path", { d: kind === "web-search" ? "M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0ZM3 12h18M12 3a17 17 0 0 1 0 18 17 17 0 0 1 0-18Z" : kind === "attachment" ? "M14 3H6v18h12V7l-4-4Zm0 0v5h4M9 12h6m-6 4h6" : "M3 6h7l2 2h9v12H3V6Zm0 4h18" }));
+				"aria-hidden": true,
+				style: {
+					flexShrink: 0,
+					color: require_theme.dshThemeColor.labelTertiary
+				}
+			}, (0, react.createElement)("path", { d: "m6 9 6 6 6-6" }));
 		}
 		//#endregion
 		//#region src/client/features/assistant-realtime-call.ts
@@ -2644,12 +2721,7 @@ window.__ModuleLoader__.load({
 					flexDirection: "column",
 					gap: configuring ? 11 : 16
 				}
-			}, !loaded ? (0, react.createElement)("div", {
-				role: "status",
-				style: require_theme.dshSettingsHelpStyle
-			}, t("awb.loading"), " ", button(t("awb.retry"), () => {
-				refresh().catch((cause) => setError(message(cause)));
-			})) : null, noticeText ? (0, react.createElement)("div", {
+			}, !loaded ? (0, react.createElement)(AssistantLoadingView, { t }) : null, noticeText ? (0, react.createElement)("div", {
 				role: "alert",
 				style: {
 					color: require_theme.dshThemeColor.error,
@@ -2852,6 +2924,19 @@ window.__ModuleLoader__.load({
 				model
 			}));
 		}
+		/** 首次读取期间使用居中的动态状态，避免把正常等待误显示成失败或重试入口。 */
+		function AssistantLoadingView({ t }) {
+			return (0, react.createElement)("div", {
+				"data-codingns-assistant-loading": true,
+				role: "status",
+				"aria-live": "polite",
+				"aria-label": t("awb.loading"),
+				style: assistantLoadingStyle
+			}, (0, react.createElement)("style", null, assistantLoadingCss), (0, react.createElement)("div", {
+				"aria-hidden": true,
+				style: assistantLoadingOrbStyle
+			}, (0, react.createElement)("span", { className: "codingns-assistant-loading-ring" }), (0, react.createElement)("span", { className: "codingns-assistant-loading-core" }), (0, react.createElement)("span", { className: "codingns-assistant-loading-dot codingns-assistant-loading-dot-one" }), (0, react.createElement)("span", { className: "codingns-assistant-loading-dot codingns-assistant-loading-dot-two" }), (0, react.createElement)("span", { className: "codingns-assistant-loading-dot codingns-assistant-loading-dot-three" })), (0, react.createElement)("div", { style: assistantLoadingLabelStyle }, t("awb.loadingHint")));
+		}
 		/** 内层菜单先消费 Escape，外层窗口只处理尚未消费的关闭按键。 */
 		function handleAssistantWorkbenchEscape(event, onClose) {
 			if (event.key !== "Escape" || event.defaultPrevented) return;
@@ -2886,6 +2971,47 @@ window.__ModuleLoader__.load({
 			gap: 8,
 			justifyItems: "center"
 		};
+		const assistantLoadingStyle = {
+			flex: "1 1 auto",
+			minHeight: "min(420px, 45vh)",
+			display: "flex",
+			flexDirection: "column",
+			alignItems: "center",
+			justifyContent: "center",
+			gap: 18,
+			color: require_theme.dshThemeColor.labelSecondary
+		};
+		const assistantLoadingOrbStyle = {
+			position: "relative",
+			width: 76,
+			height: 76,
+			borderRadius: "50%",
+			background: `radial-gradient(circle at 35% 28%, ${require_theme.dshThemeColor.accent}33, transparent 58%)`,
+			boxShadow: `0 0 0 1px ${require_theme.dshThemeColor.border}, 0 0 42px ${require_theme.dshThemeColor.accent}24`
+		};
+		const assistantLoadingLabelStyle = {
+			fontSize: require_theme.uiFontSize(13),
+			letterSpacing: "0.04em"
+		};
+		const assistantLoadingCss = `
+  [data-codingns-assistant-loading] .codingns-assistant-loading-ring,
+  [data-codingns-assistant-loading] .codingns-assistant-loading-core,
+  [data-codingns-assistant-loading] .codingns-assistant-loading-dot{position:absolute;display:block;border-radius:50%}
+  [data-codingns-assistant-loading] .codingns-assistant-loading-ring{inset:7px;border:1px solid ${require_theme.dshThemeColor.accent}88;border-top-color:transparent;border-left-color:${require_theme.dshThemeColor.accent};animation:codingns-assistant-loading-spin 2.8s linear infinite}
+  [data-codingns-assistant-loading] .codingns-assistant-loading-core{inset:22px;background:${require_theme.dshThemeColor.accent};box-shadow:0 0 18px ${require_theme.dshThemeColor.accent}aa;animation:codingns-assistant-loading-breathe 1.8s ease-in-out infinite}
+  [data-codingns-assistant-loading] .codingns-assistant-loading-dot{width:6px;height:6px;background:${require_theme.dshThemeColor.labelPrimary};box-shadow:0 0 10px ${require_theme.dshThemeColor.accent};animation:codingns-assistant-loading-pulse 1.8s ease-in-out infinite}
+  [data-codingns-assistant-loading] .codingns-assistant-loading-dot-one{top:4px;left:35px}
+  [data-codingns-assistant-loading] .codingns-assistant-loading-dot-two{right:7px;bottom:20px;animation-delay:.22s}
+  [data-codingns-assistant-loading] .codingns-assistant-loading-dot-three{left:7px;bottom:20px;animation-delay:.44s}
+  @keyframes codingns-assistant-loading-spin{to{transform:rotate(360deg)}}
+  @keyframes codingns-assistant-loading-breathe{0%,100%{transform:scale(.82);opacity:.72}50%{transform:scale(1.08);opacity:1}}
+  @keyframes codingns-assistant-loading-pulse{0%,100%{transform:scale(.65);opacity:.36}50%{transform:scale(1.15);opacity:1}}
+  @media (prefers-reduced-motion:reduce){
+    [data-codingns-assistant-loading] .codingns-assistant-loading-ring,
+    [data-codingns-assistant-loading] .codingns-assistant-loading-core,
+    [data-codingns-assistant-loading] .codingns-assistant-loading-dot{animation:none}
+  }
+`;
 		const backdrop = {
 			position: "fixed",
 			inset: 0,