@my-life-buddies/cli 0.11.0 → 0.13.0

package/dist/web/app.css

@@ -517,3 +517,37 @@
 .message-avatar img { width: 100%; height: 100%; object-fit: contain; border-radius: inherit; }
 #buddy-profile-avatar { width: 32px; height: 32px; object-fit: contain; border-radius: 50%; }
 #buddy-profile-avatar[hidden] { display: none; }
+
+/* The hosted console keeps debugger and simulator side by side, including narrow panels. */
+body[data-hosted-preview] { min-width:700px; height:100dvh; min-height:0; display:flex; flex-direction:column; overflow-x:auto; overflow-y:hidden; }
+body[data-hosted-preview] .brand { display:none; }
+body[data-hosted-preview] .app-shell { flex:1; min-height:0; display:flex; flex-direction:column; }
+body[data-hosted-preview] .sidebar { position:static; flex:none; width:auto; padding:8px 16px; border-inline-end:0; border-bottom:1px solid var(--color-rule); }
+body[data-hosted-preview] .sidebar-section { margin:0; }
+body[data-hosted-preview] .sidebar-label { display:none; }
+body[data-hosted-preview] .debug-tabs { display:flex; flex-wrap:wrap; gap:8px; }
+body[data-hosted-preview] .debug-tabs button { width:auto; }
+body[data-hosted-preview] .application { margin-inline-start:0; flex:1; min-height:0; display:flex; flex-direction:column; }
+body[data-hosted-preview] .topbar { display:contents; }
+body[data-hosted-preview] .project-heading { display:none; }
+body[data-hosted-preview] .debugger > .sidebar { position:sticky; top:0; z-index:var(--z-sticky); }
+body[data-hosted-preview] .workspace { flex:1; min-height:0; grid-template-columns:minmax(340px,1fr) clamp(340px,40%,520px); overflow:hidden; }
+body[data-hosted-preview] .debugger { overflow-y:auto; overscroll-behavior:contain; }
+body[data-hosted-preview] .simulator-area { position:relative; inset:auto; height:100%; min-height:0; max-height:none; border-block-start:0; border-inline-start:1px solid var(--color-rule); }
+body[data-hosted-preview] .run-strip { padding:20px 24px 0; }
+body[data-hosted-preview] .run-metrics { margin-top:20px; }
+body[data-hosted-preview] .debug-panel { padding:24px; }
+body[data-hosted-preview] #dev-control[data-action="stop"] { background:var(--color-paper-raised); color:var(--color-ink); border:1px solid var(--color-rule); }
+.local-connection { flex:none; padding:10px 20px; border-bottom:1px solid var(--color-rule); background:var(--color-paper-raised); font-size:13px; }
+.local-connection-heading { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px 12px; }
+.local-connection-heading strong { grid-column:1 / -1; min-width:0; overflow-wrap:anywhere; font-size:12px; font-weight:500; }
+.local-connection pre { padding:14px; border-radius:8px; background:var(--color-paper); white-space:pre-wrap; overflow-wrap:anywhere; user-select:all; }
+.local-connection p { line-height:1.7; }
+#connect-instructions { max-height:250px; overflow-y:auto; }
+@media (max-width:900px) {
+  body[data-hosted-preview] .workspace { grid-template-columns:minmax(340px,1fr) 320px; }
+  body[data-hosted-preview] .run-heading { flex-direction:column; gap:12px; }
+  body[data-hosted-preview] .run-identity, body[data-hosted-preview] .run-controls { flex:auto; width:100%; }
+  body[data-hosted-preview] .run-strip, body[data-hosted-preview] .debug-panel { padding-inline:16px; }
+  body[data-hosted-preview] .run-metrics { gap:8px; }
+}

package/dist/web/app.js

@@ -1,6 +1,17 @@
 (() => {
   "use strict";
 
+  const hosted = document.body?.hasAttribute?.("data-hosted-preview") === true;
+  const hostedBuddyId = hosted ? new URL(location.href).searchParams.get("buddyId") : "";
+  const connectionUrl = hosted ? new URL(`../api/buddies/${encodeURIComponent(hostedBuddyId)}/preview`, location.href) : undefined;
+  let connectionInstance = "", connectionReady = !hosted, connectionBusy = false, devPollBusy = false;
+  function previewApiUrl(path) {
+    if (!hosted) return path;
+    const url = new URL(connectionUrl.href + path);
+    url.searchParams.set("instance", connectionInstance);
+    return url.href;
+  }
+  window.previewApiUrl = previewApiUrl;
   const $ = (selector) => document.querySelector(selector);
   const elements = {
     projectName: $("#project-name"),
@@ -88,7 +99,8 @@
   }
 
   async function api(path, options = {}) {
-    const response = await fetch(path, {
+    const instance = connectionInstance;
+    const response = await fetch(previewApiUrl(path), {
       ...options,
       headers: {
         Accept: "application/json",
@@ -97,8 +109,9 @@
       },
     });
     const value = await response.json().catch(() => ({}));
+    if (hosted && (!connectionReady || instance !== connectionInstance)) throw new Error("本地连接已改变，请等待重新连接");
     if (!response.ok) {
-      const error = new Error(value?.error?.message || `请求失败（HTTP ${response.status}）`);
+      const error = new Error((typeof value?.error === "string" ? value.error : value?.error?.message) || `请求失败（HTTP ${response.status}）`);
       error.code = value?.error?.code || "PREVIEW_REQUEST_FAILED";
       error.status = response.status;
       throw error;
@@ -172,9 +185,10 @@
 
   function phaseCopy(phase) {
     return {
-      idle: "未启动",
+      idle: hosted ? "已连接但 DEV 未启动" : "未启动",
+      disconnected: "未连接本地工程",
       starting: "正在启动",
-      ready: "DEV 在线",
+      ready: "DEV 运行中",
       stopping: "正在停止",
       failed: "启动失败",
     }[phase] || phase;
@@ -230,11 +244,11 @@
   let pairingRequest = 0;
 
   function renderDev() {
-    const phase = state.dev.phase;
+    const phase = connectionReady ? state.dev.phase : "disconnected";
     if (!elements.pairingPanel.hidden && pairingRevision !== state.dev.revision) void togglePairing(true);
     elements.connectionState.dataset.phase = phase;
-    elements.connectionLabel.textContent = phaseCopy(phase);
-    elements.devControl.disabled = phase === "starting" || phase === "stopping";
+    elements.connectionLabel.textContent = phase === "disconnected" ? "未连接本地工程" : phaseCopy(phase);
+    elements.devControl.disabled = !connectionReady || phase === "starting" || phase === "stopping";
     elements.devControl.dataset.action = phase === "ready" ? "stop" : "start";
     elements.devControl.textContent = phase === "ready" ? "停止 DEV" : phase === "starting" ? "正在启动…" : phase === "stopping" ? "正在停止…" : "启动 DEV";
     elements.environmentAgent.textContent = phase === "ready"
@@ -538,17 +552,17 @@
   }
 
   function syncPolling() {
-    if (state.dev.phase === "ready" && state.polling === undefined) {
+    if (connectionReady && state.dev.phase === "ready" && state.polling === undefined) {
       void refreshSimulator();
       state.polling = window.setInterval(() => void refreshSimulator(), 1200);
-    } else if (state.dev.phase !== "ready" && state.polling !== undefined) {
+    } else if ((!connectionReady || state.dev.phase !== "ready") && state.polling !== undefined) {
       window.clearInterval(state.polling);
       state.polling = undefined;
     }
   }
 
   async function controlDev() {
-    if (state.dev.phase === "starting" || state.dev.phase === "stopping") return;
+    if (!connectionReady || state.dev.phase === "starting" || state.dev.phase === "stopping") return;
     elements.devControl.disabled = true;
     try {
       const path = state.dev.phase === "ready" ? "/api/dev/stop" : "/api/dev/start";
@@ -738,6 +752,7 @@
   }
 
   async function boot() {
+    if (hosted && !connectionReady) { void refreshConnection(); return; }
     try {
       const [project, dev, debug] = await Promise.all([
         api("/api/project"),
@@ -748,7 +763,7 @@
       state.dev = dev.state;
       state.debug = debug.debug;
       renderAll();
-      connectEvents();
+      if (!hosted) connectEvents();
       // Load the cloud profile independently of Agent startup. If it fails,
       // the local project and DEV controls remain usable and show the error.
       const { buddy } = await api("/api/buddy");
@@ -759,6 +774,69 @@
     }
   }
 
+  function disconnected(message = "未连接本地工程") {
+    connectionReady = false;
+    state.dev = { phase: "idle", revision: -1 };
+    state.simulatorRequest++;
+    widgets?.reset();
+    void togglePairing(false);
+    renderDev(); syncPolling();
+    $("#local-status").textContent = message;
+  }
+
+  async function refreshConnection() {
+    if (connectionBusy) return;
+    connectionBusy = true;
+    try {
+      const response = await fetch(connectionUrl, { signal: AbortSignal.timeout(5000) });
+      const value = await response.json();
+      if (!response.ok) throw new Error(value.error || "连接状态读取失败");
+      $("#connect-command").textContent = value.command;
+      $("#copy-connect-command").disabled = false;
+      if (!value.connected) { disconnected(); return; }
+      const changed = connectionInstance !== value.instanceId;
+      const newlyConnected = !connectionReady || changed;
+      connectionInstance = value.instanceId;
+      connectionReady = true;
+      $("#local-status").textContent = ["已连接本地工程", value.machineName, value.projectRoot].filter(Boolean).join(" · ");
+      if (newlyConnected) {
+        state.dev = { phase: "idle", revision: -1 };
+        if (changed) {
+          state.simulator = { messages: [] }; state.debug = { runs: [], events: [], messages: [] };
+          state.selectedRunId = ""; pendingSend = undefined; state.buddy = undefined;
+        }
+        elements.errorBanner.hidden = true;
+        await boot();
+      }
+    } catch (cause) { disconnected(cause.message || "连接已中断，正在重试…"); }
+    finally { connectionBusy = false; }
+  }
+
+  async function pollHostedDev() {
+    if (!connectionReady || devPollBusy) return;
+    devPollBusy = true;
+    try {
+      const [dev, debug] = await Promise.all([api("/api/dev"), api("/api/debug")]);
+      applyDevState(dev.state); state.debug = debug.debug; renderAll();
+    } catch (cause) { showError(cause); }
+    finally { devPollBusy = false; }
+  }
+
+  if (hosted) {
+    renderDev();
+    $("#get-connect-command").addEventListener("click", () => {
+      $("#connect-instructions").hidden = !$("#connect-instructions").hidden;
+      void refreshConnection();
+    });
+    $("#copy-connect-command").addEventListener("click", async () => {
+      try { await navigator.clipboard.writeText($("#connect-command").textContent); toast("连接指令已复制，请在当前搭子的工程目录执行"); }
+      catch { showError(new Error("请手动复制下方的完整连接指令")); }
+    });
+    const statusTimer = window.setInterval(() => void refreshConnection(), 2000);
+    const devTimer = window.setInterval(() => void pollHostedDev(), 1200);
+    window.addEventListener("pagehide", () => { window.clearInterval(statusTimer); window.clearInterval(devTimer); window.clearInterval(state.polling); });
+  }
+
   elements.resetConversation.addEventListener("click", () => void resetConversation());
   elements.latestMessages.addEventListener("click", followLatestMessages);
   elements.chatMessages.addEventListener("scroll", () => {

package/dist/web/widgets.js

@@ -1,5 +1,6 @@
 /* Client reference: my-life-buddies-ios dev 547818d, DadaConversationWidgets / DadaHostedWidgetPage. */
 (() => {
+  const previewUrl = path => window.previewApiUrl?.(path) ?? path;
   const el = (tag, className, text) => { const n = document.createElement(tag); n.className = className; if (text !== undefined) n.textContent = text; return n; };
   window.createSimulatorWidgets = ({ api, avatar }) => {
     const shortcut = document.querySelector('#widget-shortcut');
@@ -77,7 +78,7 @@
       for (const child of phone.children) if (child !== overlay) child.inert = true;
       dismiss.focus();
       try {
-        const url = `/api/simulator/widgets/${encodeURIComponent(item.id)}`;
+        const url = previewUrl(`/api/simulator/widgets/${encodeURIComponent(item.id)}`);
         // Probe errors in the parent; actual HTML executes only inside the opaque sandbox document.
         const response = await fetch(url, { credentials: 'same-origin' });
         if (!response.ok) { const error = await response.json(); throw new Error(error.error?.message || error.error || '小挂件暂时无法打开'); }
@@ -117,7 +118,7 @@
       card(item) {
         const card = el('div', 'widget-entry'); card.append(el('h4', '', item.title));
         const details = el('div', 'widget-entry-details');
-        if (item.type && item.imageMediaId) { const image = el('img', 'widget-entry-photo'); image.alt = `${item.title}的照片`; image.src = `/api/simulator/widgets/${encodeURIComponent(item.id)}/image?mediaId=${encodeURIComponent(item.imageMediaId)}`; image.addEventListener('error', () => { image.hidden = true; }); details.append(image); }
+        if (item.type && item.imageMediaId) { const image = el('img', 'widget-entry-photo'); image.alt = `${item.title}的照片`; image.src = previewUrl(`/api/simulator/widgets/${encodeURIComponent(item.id)}/image?mediaId=${encodeURIComponent(item.imageMediaId)}`); image.addEventListener('error', () => { image.hidden = true; }); details.append(image); }
         details.append(el('p', '', item.type ? item.summary?.trim() || '打开查看最新内容' : '此小挂件已删除或不可用')); card.append(details);
         if (item.type) card.append(button('去查看', () => open(item), 'widget-entry-open'));
         return card;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@my-life-buddies/cli",
-  "version": "0.11.0",
+  "version": "0.13.0",
   "type": "module",
   "description": "搭搭 Developer Platform 命令行工具",
   "publishConfig": {
@@ -39,7 +39,7 @@
     "ws": "8.21.3"
   },
   "devDependencies": {
-    "@buddy/cli-core": "0.11.0",
-    "@buddy/preview": "0.11.0"
+    "@buddy/cli-core": "0.13.0",
+    "@buddy/preview": "0.13.0"
   }
 }