dsh-per-message-model 0.1.5 → 0.1.7

package/lib/client.js

@@ -67,48 +67,6 @@ window.__ModuleLoader__.load({
 				})
 			]);
 		}
-		/**
-		* Per-message model badge as a small icon button. Missing projections
-		* degrade to the same icon with an unknown title (fail-soft, verifiable).
-		* @param value - a wire projection entry ({ provider, model, reasoningEffort, reasoningSource }).
-		* @param t - locale seat bound to this plugin's namespace.
-		*/
-		function modelBadge(value, t) {
-			const known = value !== null && typeof value === "object";
-			const provider = known && typeof value.provider === "string" ? value.provider : null;
-			const model = known && typeof value.model === "string" ? value.model : null;
-			const hasModel = provider !== null && model !== null;
-			const label = hasModel
-				? `${provider} / ${model}${t("badge.separator")}${t("badge.effort")} ${known && typeof value.reasoningEffort === "string" && value.reasoningEffort.length > 0 ? value.reasoningEffort : t("badge.effort.default")}`
-				: t("badge.unknown");
-			const title = hasModel && known && value.reasoningSource === "adapter-default"
-				? `${label}（${t("badge.effort.adapterDefault")}）`
-				: hasModel ? label : t("badge.unknown.title");
-			return createElement("span", {
-				className: BADGE_PREFIX + "icon",
-				"data-dsh-per-message-model": "true",
-				"aria-label": label,
-				title
-			}, chipIcon());
-		}
-		/** Session-header occupant: current model badge (latest folded assistant message). */
-		function SessionModelBadge({ useProjection, t }) {
-			const value = useProjection("perMessageModel");
-			const current = value === void 0 || value === null || typeof value !== "object" || value.current === void 0
-				? void 0
-				: value.current;
-			return modelBadge(current, t);
-		}
-		/** Assistant-actions occupant: per-message model icon, keyed by messageId
-		* (renders inside the official per-message action row, reordered after the
-		* branch button and before the time clock via CSS flex order). */
-		function PerMessageModelBadge({ messageId, useProjection, t }) {
-			const value = useProjection("perMessageModel");
-			const entry = value === void 0 || value === null || typeof value !== "object" || value.messages === void 0
-				? void 0
-				: value.messages[messageId];
-			return modelBadge(entry, t);
-		}
 		//#endregion
 		//#region client footer
 		/**
@@ -118,26 +76,37 @@ window.__ModuleLoader__.load({
 		* existing chip behavior (color change + title); a single click rolls the
 		* model name out from left to right like a scroll (icon rotates by a random
 		* angle); clicking again rolls it back (icon rotates back).
+		*
+		* Implemented WITHOUT React state on purpose: the DSH slot renderer mounts
+		* registrants through an error boundary and some hosts do not tolerate
+		* hook-based state in dock seats; the unfold/collapse is a pure DOM class
+		* toggle plus an inline transform on the icon, so it works in any host.
 		*/
 		function FooterModelBadge({ useProjection, t }) {
-			const [open, setOpen] = React.useState(false);
-			const [rot, setRot] = React.useState(0);
-			const value = useProjection("perMessageModel");
-			const current = value === void 0 || value === null || typeof value !== "object" || value.current === void 0
-				? void 0
-				: value.current;
-			const known = current !== void 0 && typeof current === "object";
-			const provider = known && typeof current.provider === "string" ? current.provider : null;
-			const model = known && typeof current.model === "string" ? current.model : null;
-			const label = provider !== null && model !== null
-				? provider + " / " + model
-				: t("badge.unknown");
-			const toggle = () => {
-				if (open) {
-					setOpen(false);
+			let value = null;
+			try { value = useProjection("perMessageModel"); } catch (err) { value = null; }
+			const hasValue = value !== null && value !== void 0 && typeof value === "object";
+			const current = hasValue && typeof value.current === "object" && value.current !== null ? value.current : null;
+			const provider = current !== null && typeof current.provider === "string" ? current.provider : null;
+			const model = current !== null && typeof current.model === "string" ? current.model : null;
+			let label;
+			try { label = provider !== null && model !== null ? provider + " / " + model : (typeof t === "function" ? t("badge.unknown") : "model unknown"); }
+			catch (err) { label = provider !== null && model !== null ? provider + " / " + model : "model unknown"; }
+			const toggle = (event) => {
+				const btn = event && event.currentTarget ? event.currentTarget : null;
+				if (btn === null) return;
+				const labelEl = btn.querySelector('[class*="footer-label"]');
+				const iconEl = btn.querySelector('[class*="footer-icon"]');
+				const isOpen = btn.getAttribute("aria-expanded") === "true";
+				if (isOpen) {
+					btn.setAttribute("aria-expanded", "false");
+					if (labelEl !== null) labelEl.setAttribute("data-open", "false");
+					if (iconEl !== null) iconEl.style.transform = "rotate(0deg)";
 				} else {
-					setRot(Math.round(90 + Math.random() * 180));
-					setOpen(true);
+					const deg = Math.round(90 + Math.random() * 180);
+					btn.setAttribute("aria-expanded", "true");
+					if (labelEl !== null) labelEl.setAttribute("data-open", "true");
+					if (iconEl !== null) iconEl.style.transform = "rotate(" + deg + "deg)";
 				}
 			};
 			return createElement("button", {
@@ -146,22 +115,22 @@ window.__ModuleLoader__.load({
 				"data-dsh-per-message-model-footer": "true",
 				"aria-label": label,
 				title: label,
-				"aria-expanded": open ? "true" : "false",
+				"aria-expanded": "false",
 				onClick: toggle
 			}, [
 				createElement("span", {
 					key: "icon",
 					className: BADGE_PREFIX + "footer-icon",
-					style: { transform: open ? "rotate(" + rot + "deg)" : "rotate(0deg)" }
+					style: { transform: "rotate(0deg)" }
 				}, chipIcon()),
 				createElement("span", {
 					key: "label",
 					className: BADGE_PREFIX + "footer-label",
-					"data-open": open ? "true" : "false"
+					"data-open": "false"
 				}, label)
 			]);
 		}
-		//#endregion
+		//#endregion		//#endregion
 		//#region client divider
 		/** Fixed Chinese copy for the model-switch divider (user-required). */
 		const SWITCH_COPY = "模型切换：";
@@ -293,12 +262,7 @@ window.__ModuleLoader__.load({
 			const badgeStyle = document.createElement("style");
 			badgeStyle.dataset.dshPerMessageModel = BADGE_PREFIX;
 			badgeStyle.textContent = [
-				// Per-message icon: small chip, full value in title/aria.
-				`[data-dsh-per-message-model]{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin:0 2px;color:var(--dsw-alias-label-tertiary);border-radius:5px;cursor:default}`,
-				`[data-dsh-per-message-model]:hover{color:var(--dsw-alias-label-primary);background:var(--dsw-alias-bg-base-2, var(--dsw-alias-bg-hover, rgba(128,128,128,.12)))}`,
-				// Reorder inside the official action row: copy(0) branch(0) icon(3) clock(4)
-				`[data-dsh-per-message-model]{order:3}`,
-				`div[class*="actions"]:has([data-slot="conversation.chat.assistant-actions"]) [class*="timeEnd"]{order:4}`,
+
 				// In-stream divider: full-width block, embeds in the message flow.
 				// Label (模型切换：) and arrow are gray; model names are darker/bolder.
 				`[data-dsh-model-switch]{display:flex;align-items:center;gap:8px;margin:10px 0 16px;padding:10px 14px;border:1.5px solid var(--dsw-alias-state-business-primary, #4f8cff);border-radius:10px;background:var(--dsw-alias-state-business-tertiary, rgba(79,140,255,.12));box-shadow:0 1px 3px rgba(0,0,0,.10);color:var(--dsw-alias-label-secondary);font-size:12px;line-height:18px;user-select:none}`,
@@ -315,18 +279,6 @@ window.__ModuleLoader__.load({
 			document.head.appendChild(badgeStyle);
 			ctx.effect(() => () => badgeStyle.remove(), "per-message-model: css");
 			ctx.effect(() => ctx.locale.register(NS, { zh, en }), "per-message-model: dictionaries");
-			ctx.slots.inject("conversation.session.header.actions", () => ctx.slots.register({
-				name: "conversation.session.header.actions",
-				id: "dsh-per-message-model-header",
-				locale: NS,
-				order: 80
-			}, SessionModelBadge));
-			ctx.slots.inject("conversation.chat.assistant-actions", () => ctx.slots.register({
-				name: "conversation.chat.assistant-actions",
-				id: "dsh-per-message-model-badge",
-				locale: NS,
-				order: 40
-			}, PerMessageModelBadge));
 			ctx.slots.inject("conversation.session.header.actions", () => ctx.slots.register({
 				name: "conversation.session.header.actions",
 				id: "dsh-per-message-model-switch",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-per-message-model",
-  "version": "0.1.5",
+  "version": "0.1.7",
   "description": "在 DSH 主对话每条 assistant 回复旁展示该条回复实际使用的 provider / model 徽章（可选附带 reasoning effort）",
   "type": "module",
   "main": "./lib/index.js",