contactsheet 0.1.5 → 0.1.7

package/dist/canvas/style-pins.css

@@ -48,6 +48,7 @@
 .cs-ref-strip:empty { display: none; }   /* 没图就当它不存在,别留一条空隙 */
 
 .cs-ref-thumb {
+  position: relative;   /* 删除钮的锚 */
   width: 56px;
   padding: 2px;
   border: 1px solid var(--cs-line-2);
@@ -56,6 +57,26 @@
   cursor: zoom-in;
 }
 .cs-ref-thumb:hover { border-color: var(--cs-accent); }
+/* 删除钮:悬停才现身,压在缩略图右上角。命中区 18px,比字形大一圈 */
+.cs-ref-rm {
+  position: absolute;
+  top: -6px;
+  right: -6px;
+  width: 18px;
+  height: 18px;
+  padding: 0;
+  border: 1px solid var(--cs-line-2);
+  border-radius: var(--cs-r-full);
+  background: var(--cs-s1);
+  color: var(--cs-fg-2);
+  font: var(--cs-fs-micro)/1 var(--cs-ff-sans);
+  cursor: pointer;
+  opacity: 0;
+  transition: opacity var(--cs-dur-1) var(--cs-ease), color var(--cs-dur-1) var(--cs-ease);
+}
+.cs-ref-thumb:hover .cs-ref-rm,
+.cs-ref-rm:focus-visible { opacity: 1; }
+.cs-ref-rm:hover { color: var(--cs-danger); border-color: var(--cs-danger); }
 /* 固定比例 + 等比裁切:贴进来的截图长宽不可控,只给宽高会把竖图压扁;
    槽位尺寸先定死,图到位时也不会把气泡撑得跳一下 */
 .cs-ref-thumb img {
@@ -102,3 +123,36 @@
   text-align: center;
   cursor: help;
 }
+
+/* ============================================================
+   气泡编辑框的滚动卫生(RESP-015:滚动条定制;滚轮事件由 view.ts 放行)
+   ============================================================ */
+.cs-pin-edit {
+  resize: none;                    /* UA 的拉伸角在暗色气泡上是块白斑,气泡宽度也不该被拉走 */
+  overscroll-behavior: contain;    /* 滚到头别把手势漏给画布 */
+  scrollbar-width: thin;
+  scrollbar-color: var(--cs-s4) transparent;
+}
+.cs-pin-edit::-webkit-scrollbar { width: 8px; }
+.cs-pin-edit::-webkit-scrollbar-thumb {
+  border-radius: var(--cs-r-full);
+  background: var(--cs-s4);
+  border: 2px solid transparent;
+  background-clip: content-box;
+}
+.cs-pin-edit::-webkit-scrollbar-track { background: transparent; }
+/* 气泡正文长文同样能滚(展示态) */
+.cs-pin-text {
+  max-height: 220px;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  scrollbar-width: thin;
+  scrollbar-color: var(--cs-s4) transparent;
+}
+.cs-pin-text::-webkit-scrollbar { width: 8px; }
+.cs-pin-text::-webkit-scrollbar-thumb {
+  border-radius: var(--cs-r-full);
+  background: var(--cs-s4);
+  border: 2px solid transparent;
+  background-clip: content-box;
+}

package/dist/cli.js

@@ -1,5 +1,11 @@
 #!/usr/bin/env node
 import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined") return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
 
 // src/cli.ts
 import { parseArgs } from "node:util";
@@ -29,7 +35,6 @@ function loadConfig(cwd, flags) {
     // 末尾斜杠去掉,后面一律靠 `${target}/xxx` 拼
     target: String(pick("target") ?? DEFAULT_TARGET).replace(/\/+$/, ""),
     port,
-    portExplicit: flags.port !== void 0,
     appDir: pick("appDir") ?? detectAppDir(projectRoot),
     designDir: pick("designDir") ?? DEFAULT_DESIGN_DIR
   };
@@ -1734,15 +1739,27 @@ function downPage(target) {
 function escapeHtml(s) {
   return s.replace(/[&<>"]/g, (c) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" })[c]);
 }
-async function occupiedBySameProject(cfg, port) {
+async function probeSameProject(cfg, port) {
+  for (let i = 0; i < 2; i++) {
+    try {
+      const r = await fetch(`http://127.0.0.1:${port}/__cs/api/state`, {
+        signal: AbortSignal.timeout(2500)
+      });
+      if (!r.ok) return null;
+      const data = await r.json();
+      return data?.projectRoot === cfg.projectRoot ? { version: data.version } : null;
+    } catch {
+    }
+  }
+  return null;
+}
+function occupierPid(port) {
   try {
-    const ctl = AbortSignal.timeout(800);
-    const r = await fetch(`http://127.0.0.1:${port}/__cs/api/state`, { signal: ctl });
-    if (!r.ok) return false;
-    const data = await r.json();
-    return data?.projectRoot === cfg.projectRoot;
+    const { execSync } = __require("node:child_process");
+    const out = execSync(`lsof -t -nP -iTCP:${port} -sTCP:LISTEN`, { timeout: 3e3 }).toString().trim();
+    return out.split("\n")[0] || null;
   } catch {
-    return false;
+    return null;
   }
 }
 async function listenWithFallback(server, cfg, host, onTwin) {
@@ -1774,27 +1791,27 @@ async function listenWithFallback(server, cfg, host, onTwin) {
     return false;
   };
   if (await tryListen(cfg.port)) return cfg.port;
-  if (await occupiedBySameProject(cfg, cfg.port)) {
+  const running = await probeSameProject(cfg, cfg.port);
+  if (running) {
+    if (running.version && running.version !== pkgVersion()) {
+      const pid2 = occupierPid(cfg.port);
+      console.error(
+        warn(`\u672C\u9879\u76EE\u5DF2\u6709\u4E00\u4E2A contactsheet \u5728 ${cfg.port} \u4E0A,\u4F46\u5B83\u662F v${running.version},\u5F53\u524D\u662F v${pkgVersion()}\u3002`) + `
+  \u65E7\u5B9E\u4F8B\u4E0D\u4F1A\u81EA\u52A8\u5347\u7EA7 \u2014\u2014 \u5148\u505C\u6389\u5B83\u518D\u8D77:kill ${pid2 ?? "<lsof -t -iTCP:" + cfg.port + ">"}`
+      );
+      process.exit(1);
+    }
     console.log(
       `${cyan("\u25CF")} \u672C\u9879\u76EE\u5DF2\u7ECF\u6709\u4E00\u4E2A contactsheet \u5728\u8DD1\u4E86,\u76F4\u63A5\u7528\u5B83:${link(`http://localhost:${cfg.port}/__cs`)}`
     );
     process.exit(0);
   }
-  if (cfg.portExplicit) {
-    throw new Error(
-      `\u7AEF\u53E3 ${cfg.port} \u88AB\u5176\u4ED6\u8FDB\u7A0B\u5360\u7528\u3002\u6362\u4E00\u4E2A --port,\u6216\u627E\u51FA\u5360\u7528\u8005:lsof -nP -iTCP:${cfg.port} -sTCP:LISTEN`
-    );
-  }
-  for (let p = cfg.port + 1; p <= cfg.port + 20; p++) {
-    if (await tryListen(p)) {
-      console.warn(
-        warn(`\u7AEF\u53E3 ${cfg.port} \u88AB\u5360,\u5DF2\u987A\u5EF6\u5230 ${p} \u2192 `) + link(`http://localhost:${p}/__cs`) + "\n" + dim(`   \u6CE8\u610F:\u6362\u7AEF\u53E3 = \u6362\u6D4F\u89C8\u5668\u6E90\u3002\u753B\u677F\u4F4D\u7F6E/\u6298\u53E0/\u5E95\u8272\u8FD9\u4E9B\u672C\u673A\u8BB0\u5FC6\u6309\u6E90\u9694\u79BB,\u8FD9\u4E2A\u7AEF\u53E3\u4E0B\u662F\u5168\u65B0\u7684;
-`) + dim(`   .mcp.json \u4E0E hook \u4ECD\u6307\u5411 ${cfg.port}\u3002\u60F3\u8981\u7A33\u5B9A,\u8BF7\u91CA\u653E ${cfg.port},\u6216\u6539 config \u7684 port \u540E\u91CD\u8DD1 npx contactsheet init\u3002`)
-      );
-      return p;
-    }
-  }
-  throw new Error(`\u4ECE ${cfg.port} \u5F80\u4E0A\u8FDE\u8BD5 20 \u4E2A\u7AEF\u53E3\u90FD\u88AB\u5360,\u7528 --port \u6307\u5B9A\u4E00\u4E2A\u7A7A\u95F2\u7AEF\u53E3`);
+  const pid = occupierPid(cfg.port);
+  throw new Error(
+    `\u7AEF\u53E3 ${cfg.port} \u88AB\u5176\u4ED6\u8FDB\u7A0B\u5360\u7528${pid ? `(PID ${pid})` : ""}\u3002.mcp.json/hook/config \u90FD\u6307\u5411 ${cfg.port},\u6362\u7AEF\u53E3\u5B83\u4EEC\u4F1A\u5168\u90E8\u5931\u8054,\u6240\u4EE5\u4E0D\u81EA\u52A8\u987A\u5EF6 \u2014\u2014
+  \u91CA\u653E\u5B83:kill ${pid ?? `$(lsof -t -nP -iTCP:${cfg.port} -sTCP:LISTEN)`}
+  \u6216\u6362\u7AEF\u53E3:\u6539 contactsheet.config.json \u7684 port \u540E\u91CD\u8DD1 npx contactsheet init(MCP/hook \u4F1A\u8DDF\u7740\u6362)`
+  );
 }
 
 // src/watch/index.ts