@artenx/dshb 0.1.9 → 0.1.11

package/lib/client.js

@@ -445,7 +445,7 @@ window.__ModuleLoader__.load({
 				get: () => true
 			});
 			ctx.plugin({
-				inject: ["slots", "settingsScope"],
+				inject: ["slots"],
 				apply: (sub) => {
 					sub.slots.inject("settings.section", () => sub.slots.register({
 						name: "settings.section",
@@ -539,7 +539,7 @@ window.__ModuleLoader__.load({
 						const res = await fetch("/api/dshb/nodes");
 						if (!res.ok) return;
 						const data = await res.json();
-						setNodes((data.nodes ?? []).filter((n) => n.type === "local-host" || n.status?.reachable === true));
+						setNodes(data.nodes ?? []);
 					} catch {}
 				})();
 			}, [props.open]);
@@ -1555,72 +1555,36 @@ window.__ModuleLoader__.load({
 			"overflow-y",
 			"box-sizing"
 		];
-		/**
-		* 把挂在 composer 内部的绝对定位浮层统一改造成 position:fixed 视口级浮层：
-		* 水平居中（左右各留 8px，绝不贴边/溢出），高度按视口比例封顶并内容滚动，
-		* 触发元素上方空间足够则向上展开、否则向下展开，四边都约束在视口内。
-		* fixed 不受祖先 overflow 裁剪（祖先带 transform 时失效）。
-		*/
-		function positionFixedSheet(el, rootRect, maxWidth, maxHeightRatio) {
+		/** Keep the model menu anchored to its trigger while fitting it in the viewport. */
+		function positionAnchoredMenu(el, triggerRect, maxWidth, maxHeight) {
 			const margin = 8;
 			const vw = window.innerWidth;
 			const vh = window.innerHeight;
-			const width = Math.max(0, Math.min(maxWidth, vw - 16));
-			const left = Math.round((vw - width) / 2);
-			const maxH = Math.round(vh * maxHeightRatio);
-			const spaceAbove = rootRect.top - margin;
-			const spaceBelow = vh - rootRect.bottom - margin;
-			const expandUp = spaceAbove >= 140 && spaceAbove >= spaceBelow;
-			let top;
-			if (expandUp) {
-				const h = Math.min(maxH, Math.max(spaceAbove, 140));
-				top = rootRect.top - margin - h;
-			} else top = rootRect.bottom + margin;
-			top = Math.max(margin, top);
-			el.style.setProperty("position", "fixed", "important");
-			el.style.setProperty("box-sizing", "border-box", "important");
-			el.style.setProperty("width", `${width}px`, "important");
-			el.style.setProperty("left", `${left}px`, "important");
-			el.style.setProperty("right", "auto", "important");
-			el.style.setProperty("top", `${top}px`, "important");
-			el.style.setProperty("bottom", "auto", "important");
-			el.style.setProperty("min-width", "0", "important");
-			el.style.setProperty("max-width", "none", "important");
-			el.style.setProperty("max-height", `${maxH}px`, "important");
-			el.style.setProperty("overflow-y", "auto", "important");
-		}
-		/**
-		* 一级 pane（Model/Effort 单元格小菜单）紧凑浮层：右缘对齐触发按钮右缘
-		* （面板右缘 x = 按钮右缘 x，钳制在视口内 8px 起，避免宽面板超出屏幕左缘时
-		* 被甩到左边贴边），向上展开、空间不足向下展开；宽度跟随内容
-		* （max-content，封顶 min(420, vw-16)），避免小菜单被全宽 sheet 拉远到
-		* 屏幕中间。测量与定位在同一任务内同步完成，无闪烁。
-		*/
-		function positionCompactPanel(el, root, rootRect) {
-			const margin = 8;
-			const vw = window.innerWidth;
-			const trigger = root.querySelector("[class*=\"7KE1Ra_trigger\"], [class*=\"_trigger\"]") ?? root;
-			const anchorRect = trigger === root ? rootRect : trigger.getBoundingClientRect();
 			el.style.setProperty("position", "fixed", "important");
 			el.style.setProperty("box-sizing", "border-box", "important");
 			el.style.setProperty("left", "0", "important");
-			el.style.setProperty("top", "0", "important");
 			el.style.setProperty("right", "auto", "important");
+			el.style.setProperty("top", "0", "important");
 			el.style.setProperty("bottom", "auto", "important");
-			el.style.setProperty("width", "max-content", "important");
 			el.style.setProperty("min-width", "0", "important");
-			el.style.setProperty("max-width", `${Math.min(420, vw - 16)}px`, "important");
-			el.style.setProperty("max-height", "none", "important");
-			el.style.setProperty("overflow-y", "visible", "important");
-			const w = el.offsetWidth;
-			const h = el.offsetHeight;
-			const panelRightX = Math.min(anchorRect.right, vw - margin);
-			const expandUp = anchorRect.top - margin - h >= margin;
-			const top = Math.max(margin, expandUp ? anchorRect.top - margin - h : anchorRect.bottom + margin);
-			const left = Math.max(margin, panelRightX - w);
+			el.style.setProperty("max-width", `${Math.max(0, Math.min(maxWidth, vw - 16))}px`, "important");
+			el.style.setProperty("max-height", `${Math.max(0, Math.min(maxHeight, vh - 16))}px`, "important");
+			el.style.setProperty("overflow-y", "auto", "important");
+			let width = el.offsetWidth;
+			let height = el.offsetHeight;
+			const spaceAbove = Math.max(0, triggerRect.top - 16);
+			const spaceBelow = Math.max(0, vh - triggerRect.bottom - 16);
+			const expandUp = height <= spaceAbove || spaceAbove >= spaceBelow;
+			const available = expandUp ? spaceAbove : spaceBelow;
+			if (height > available) {
+				el.style.setProperty("max-height", `${Math.max(0, available - margin)}px`, "important");
+				height = el.offsetHeight;
+				width = el.offsetWidth;
+			}
+			const top = expandUp ? triggerRect.top - margin - height : triggerRect.bottom + margin;
+			const left = Math.max(margin, Math.min(triggerRect.right - width, vw - width - margin));
 			el.style.setProperty("left", `${left}px`, "important");
-			el.style.setProperty("top", `${top}px`, "important");
-			el.style.setProperty("width", `${w}px`, "important");
+			el.style.setProperty("top", `${Math.max(margin, Math.min(top, vh - height - margin))}px`, "important");
 		}
 		/**
 		* 模型名多为纯连字符词（DeepSeek-V4-Flash-Vision-Exp）；white-space:normal 下
@@ -1673,7 +1637,7 @@ window.__ModuleLoader__.load({
 				n.style.removeProperty("font-size");
 			}
 		}
-		/** 清除 positionFixedSheet 写入的内联样式，交还上游/移动端 CSS 兜底。 */
+		/** 清除 anchored menu 写入的内联样式，交还上游 CSS。 */
 		function clearFixedSheet(el) {
 			if (el === null || el === void 0) return;
 			for (const key of SHEET_PROPS) el.style.removeProperty(key);
@@ -1683,10 +1647,8 @@ window.__ModuleLoader__.load({
 		* 元素：一级 Model/Effort 单元格列表（cellLabel），点击后切到模型列表（modelName）
 		* 或档位列表。上游默认 `position:absolute;right:0` 贴触发按钮右缘，触发按钮在
 		* 可横向滚动的 stats 行内时菜单会整体出屏。两级 pane 都必须接管（不能只按
-		* modelName 匹配，否则一级 pane 漏掉）。窄屏下：一级小菜单走紧凑浮层
-		* （右缘贴按钮、向上展开，避免全宽 sheet 把小菜单拉到屏幕中间离按钮太远）；
-		* 二级列表走视口级居中 fixed sheet（左右各 8px、高度 45% 视口封顶、
-		* 内容滚动、上方空间不足时向下展开）。
+		* modelName 匹配，否则一级 pane 漏掉）。所有视口都把菜单锚定到触发按钮，
+		* 在上方/下方可用空间中选择更合适的一侧，避免上游空间不足时把菜单钳到屏幕顶端。
 		*/
 		function installModelMenuPosition(ctx) {
 			ctx.effect(() => {
@@ -1706,37 +1668,41 @@ window.__ModuleLoader__.load({
 				let fittedVw = 0;
 				let fittedSig = -1;
 				let fittedMenus = [];
+				let positionedMenus = [];
 				const sync = () => {
 					const menus = findMenus();
-					if (!narrow.matches) {
-						if (fittedMenus.length > 0) {
-							for (const menu of fittedMenus) {
-								clearFixedSheet(menu);
-								clearModelNameFit(menu);
-							}
-							fittedVw = 0;
-							fittedSig = -1;
-							fittedMenus = [];
-							window.dispatchEvent(new Event("resize"));
-						}
-						return;
-					}
 					let vw = 0;
 					let sig = 0;
 					const modelMenus = [];
+					const visibleMenus = [];
 					for (const menu of menus) {
 						const trigger = findTrigger(menu);
-						if (trigger === null) continue;
+						if (trigger === null || trigger.getAttribute("aria-expanded") !== "true") continue;
 						const rect = menu.getBoundingClientRect();
 						if (rect.width === 0 && rect.height === 0) continue;
-						const triggerRect = trigger.getBoundingClientRect();
+						positionAnchoredMenu(menu, trigger.getBoundingClientRect(), Math.min(420, window.innerWidth - 16), 360);
+						visibleMenus.push(menu);
 						if (menu.querySelector("[class*=\"modelName\"]")) {
-							positionFixedSheet(menu, triggerRect, Number.POSITIVE_INFINITY, .45);
-							applyNonBreakingHyphens(menu);
 							modelMenus.push(menu);
-							vw = window.innerWidth;
-							for (const n of menu.querySelectorAll("[class*=\"modelName\"]")) sig += n.textContent?.length ?? 0;
-						} else positionCompactPanel(menu, trigger, triggerRect);
+							if (narrow.matches) {
+								applyNonBreakingHyphens(menu);
+								vw = window.innerWidth;
+								for (const n of menu.querySelectorAll("[class*=\"modelName\"]")) sig += n.textContent?.length ?? 0;
+							}
+						}
+					}
+					for (const previous of positionedMenus) {
+						if (visibleMenus.includes(previous)) continue;
+						clearFixedSheet(previous);
+						clearModelNameFit(previous);
+					}
+					positionedMenus = visibleMenus;
+					if (!narrow.matches) {
+						for (const menu of modelMenus) clearModelNameFit(menu);
+						fittedVw = 0;
+						fittedSig = -1;
+						fittedMenus = [];
+						return;
 					}
 					const needFit = modelMenus.some((m) => !fittedMenus.includes(m));
 					if (vw > 0 && (needFit || vw !== fittedVw || sig !== fittedSig)) {
@@ -2350,11 +2316,9 @@ window.__ModuleLoader__.load({
 				if (selectedId === "new") return;
 				setBusy(true);
 				try {
-					const node = nodes.find((n) => n.id === selectedId);
-					if (node && (node.type === "local-docker" || node.type === "remote-docker") && node.docker?.containerId) try {
-						await fetch(`/api/dshb/docker/${selectedId}/delete`, { method: "POST" });
-					} catch {}
-					if ((await fetch(`/api/dshb/nodes/${selectedId}`, { method: "DELETE" })).ok) {
+					const res = await fetch(`/api/dshb/nodes/${selectedId}`, { method: "DELETE" });
+					const data = await res.json();
+					if (res.ok && data.ok) {
 						flash({
 							kind: "ok",
 							text: "节点已删除"
@@ -2362,7 +2326,10 @@ window.__ModuleLoader__.load({
 						setSelectedId("new");
 						setForm(EMPTY_FORM);
 						reload();
-					}
+					} else flash({
+						kind: "error",
+						text: data.error ?? "删除失败"
+					});
 				} catch {
 					flash({
 						kind: "error",
@@ -2373,7 +2340,6 @@ window.__ModuleLoader__.load({
 				}
 			}, [
 				selectedId,
-				nodes,
 				flash,
 				reload
 			]);