@clowder-ai/companion 0.1.0-alpha.29 → 0.1.0-alpha.30

package/README.md

@@ -26,9 +26,9 @@ borrowing today's selected companion.
 
 ## Host integration
 
-This surface requires the additive desktop bridge **1.5.0**. The Host computes
+This surface requires the additive desktop bridge **1.6.0**. The Host computes
 placement within the display work area, keeps the cat as its stable anchor, and
-owns bounded drag gestures and transparent-area hit testing. Hosts below 1.5
+owns bounded drag gestures and transparent-area hit testing. Hosts below 1.6
 reject this manifest before installation. Media admission and capture
 remain in the trusted Host; this package receives neither streams nor provider
 SDP. Hiding releases media; the existing Clowder **聊聊** entry restores the cat.
@@ -55,6 +55,11 @@ revision and route. If the canonical thread changes, the old unconfirmed input
 stays visible as invalidated local text and is never replayed into the new scope.
 The legacy text and conversation methods remain unchanged for older pairs.
 
+Bridge 1.6 separates passive call speech from the bounded nameplate and control
+panel, and adds an optional application-assistance projection. Assistance is
+off by default; settling a prompt only opens the ordinary menu and grants no
+media, screen-selection or call authority.
+
 Xianxian uses one layered sitting body or one VP9 clip at a time. Expiring Host
 facts with task, result and event identities select tool work, workspace fetch,
 screen reading and applied-result delivery. Native travel is independent: the

package/manifest.json

@@ -1,6 +1,6 @@
 {
   "pluginId": "official.companion",
-  "version": "0.1.0-alpha.29",
+  "version": "0.1.0-alpha.30",
   "contractVersion": "0.1.0",
   "name": "猫猫球",
   "icon": {
@@ -37,10 +37,10 @@
       "type": "desktop-window",
       "id": "companion",
       "role": "companion",
-      "bridgeVersion": "1.5.0",
+      "bridgeVersion": "1.6.0",
       "surface": {
         "entrypoint": "renderer/index.html",
-        "integrity": "sha256-NnvxPxATjH/A07F1gPzojizh05+046z4melKWHh0K7c="
+        "integrity": "sha256-dR1cqLYEPsY28TJ6ureljiV5CP23wubn70G7pePPkNg="
       },
       "presentation": {
         "width": 300,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clowder-ai/companion",
-  "version": "0.1.0-alpha.29",
+  "version": "0.1.0-alpha.30",
   "description": "The desktop voice body for your Clowder companion",
   "license": "MIT",
   "type": "module",
@@ -27,8 +27,8 @@
     "prepack": "pnpm build"
   },
   "devDependencies": {
-    "@clowder-ai/plugin-contract": "0.1.0-beta.28",
-    "@clowder-ai/plugin-sdk": "0.1.0-beta.24",
+    "@clowder-ai/plugin-contract": "0.1.0-beta.29",
+    "@clowder-ai/plugin-sdk": "0.1.0-beta.25",
     "playwright": "1.61.1"
   },
   "repository": {

package/plugin.yaml

@@ -1,6 +1,6 @@
 {
   "pluginId": "official.companion",
-  "version": "0.1.0-alpha.29",
+  "version": "0.1.0-alpha.30",
   "contractVersion": "0.1.0",
   "name": "猫猫球",
   "icon": {
@@ -37,10 +37,10 @@
       "type": "desktop-window",
       "id": "companion",
       "role": "companion",
-      "bridgeVersion": "1.5.0",
+      "bridgeVersion": "1.6.0",
       "surface": {
         "entrypoint": "renderer/index.html",
-        "integrity": "sha256-NnvxPxATjH/A07F1gPzojizh05+046z4melKWHh0K7c="
+        "integrity": "sha256-dR1cqLYEPsY28TJ6ureljiV5CP23wubn70G7pePPkNg="
       },
       "presentation": {
         "width": 300,

package/renderer/app-assist-controller.mjs

@@ -0,0 +1,125 @@
+const ACTIONS = new Set(['dismiss', 'timeout', 'accept']);
+
+/**
+ * Renderer projection only. The Host owns offer creation, expiry and clearing;
+ * this controller merely keeps stale reads and replies from reviving UI or
+ * turning an old accept into a new action.
+ */
+export class AppAssistController {
+  constructor({
+    client,
+    changed = () => {},
+    accepted = () => {},
+    scheduleTimeout = setTimeout,
+    cancelTimeout = clearTimeout,
+    timeoutMs = 15_000,
+  }) {
+    this.client = client;
+    this.changed = changed;
+    this.accepted = accepted;
+    this.scheduleTimeout = scheduleTimeout;
+    this.cancelTimeout = cancelTimeout;
+    this.timeoutMs = timeoutMs;
+    this.operation = 0;
+    this.timer = null;
+    this.timerOfferRef = null;
+    this.state = {
+      scopeRef: null,
+      revision: -1,
+      status: null,
+      offer: null,
+      hiddenRef: null,
+      pending: null,
+    };
+  }
+
+  publish(patch) {
+    this.state = { ...this.state, ...patch };
+    this.changed(this.state);
+  }
+
+  clearTimer() {
+    if (this.timer !== null) this.cancelTimeout(this.timer);
+    this.timer = null;
+    this.timerOfferRef = null;
+  }
+
+  armTimer(offerRef) {
+    if (this.timer !== null && this.timerOfferRef === offerRef) return;
+    this.clearTimer();
+    this.timerOfferRef = offerRef;
+    this.timer = this.scheduleTimeout(() => {
+      this.timer = null;
+      this.timerOfferRef = null;
+      if (this.state.offer?.offerRef === offerRef) void this.settle('timeout');
+    }, this.timeoutMs);
+    this.timer?.unref?.();
+  }
+
+  consume(snapshot) {
+    if (!snapshot || typeof snapshot.scopeRef !== 'string' || !Number.isSafeInteger(snapshot.revision)) return false;
+    if (this.state.scopeRef !== null && snapshot.scopeRef !== this.state.scopeRef) return false;
+    if (snapshot.revision <= this.state.revision) return false;
+
+    const scopeRef = this.state.scopeRef ?? snapshot.scopeRef;
+    const incomingRef = snapshot.offer?.offerRef ?? null;
+    const sameHiddenOffer = incomingRef !== null && incomingRef === this.state.hiddenRef;
+    const hiddenRef = incomingRef === null || (this.state.hiddenRef && incomingRef !== this.state.hiddenRef)
+      ? null
+      : this.state.hiddenRef;
+    const offer = sameHiddenOffer ? null : snapshot.offer;
+    const pending = incomingRef && this.state.pending?.offerRef !== incomingRef ? null : this.state.pending;
+    this.publish({ scopeRef, revision: snapshot.revision, status: snapshot.status, offer, hiddenRef, pending });
+    if (offer) this.armTimer(offer.offerRef);
+    else this.clearTimer();
+    return true;
+  }
+
+  async settle(action) {
+    if (!ACTIONS.has(action) || !this.state.offer || !this.state.scopeRef) return false;
+    const pending = {
+      id: ++this.operation,
+      scopeRef: this.state.scopeRef,
+      revision: this.state.revision,
+      offerRef: this.state.offer.offerRef,
+      action,
+    };
+    this.clearTimer();
+    this.publish({ offer: null, hiddenRef: pending.offerRef, pending });
+
+    let reply;
+    try {
+      reply = await this.client.settleAppAssist(pending.scopeRef, pending.offerRef, action);
+    } catch {
+      if (this.state.pending?.id === pending.id) this.publish({ pending: null });
+      return false;
+    }
+    if (this.state.pending?.id !== pending.id) return false;
+    const matching = reply?.kind === 'app-assist-settlement'
+      && reply.scopeRef === pending.scopeRef
+      && reply.offerRef === pending.offerRef
+      && reply.action === pending.action
+      && Number.isSafeInteger(reply.revision)
+      && reply.revision > pending.revision
+      && reply.revision >= this.state.revision
+      && this.state.status === 'ready';
+    if (!matching || reply.outcome !== 'settled') {
+      this.publish({ pending: null });
+      return false;
+    }
+
+    this.publish({ revision: reply.revision, hiddenRef: null, pending: null });
+    if (action === 'accept') this.accepted({
+      scopeRef: reply.scopeRef,
+      revision: reply.revision,
+      offerRef: reply.offerRef,
+    });
+    return true;
+  }
+
+  close() {
+    this.operation++;
+    this.clearTimer();
+    this.state = { ...this.state, offer: null, pending: null };
+  }
+}

package/renderer/call-duration.mjs

@@ -0,0 +1,59 @@
+function formatDuration(elapsedMs) {
+  const seconds = Math.max(0, Math.floor(elapsedMs / 1000));
+  const hours = Math.floor(seconds / 3600);
+  const minutes = Math.floor((seconds % 3600) / 60);
+  const remainder = seconds % 60;
+  const clock = `${String(minutes).padStart(2, '0')}:${String(remainder).padStart(2, '0')}`;
+  return hours ? `${hours}:${clock}` : clock;
+}
+
+/** Presentation clock anchored only after the current media connection is confirmed. */
+export class CallDuration {
+  constructor(node, {
+    now = Date.now,
+    schedule = callback => {
+      const handle = setInterval(callback, 1000);
+      handle.unref?.();
+      return handle;
+    },
+    cancel = handle => clearInterval(handle),
+  } = {}) {
+    Object.assign(this, { node, now, schedule, cancel });
+    this.startedAt = null;
+    this.timer = undefined;
+  }
+
+  set(startedAt) {
+    startedAt = Number.isFinite(startedAt) ? startedAt : null;
+    if (startedAt === this.startedAt) {
+      if (startedAt !== null) this.render();
+      return;
+    }
+    this.clear();
+    this.startedAt = startedAt;
+    this.node.hidden = startedAt === null;
+    if (startedAt === null) {
+      this.node.textContent = '';
+      return;
+    }
+    this.render();
+    this.timer = this.schedule(() => this.render());
+  }
+
+  render() {
+    if (this.startedAt === null) return;
+    this.node.textContent = formatDuration(this.now() - this.startedAt);
+  }
+
+  clear() {
+    if (this.timer === undefined) return;
+    this.cancel(this.timer);
+    this.timer = undefined;
+  }
+
+  close() {
+    this.clear();
+  }
+}
+
+export { formatDuration };

package/renderer/client.mjs

@@ -95,12 +95,15 @@ export function createCompanionClient(bridge) {
         openDecision: (variantRef, target) => invoke({ kind: 'decision.open', variantRef, target }, 'navigation'),
         inspectF221: (proposalId) => invoke({ kind: 'f221.inspect', proposalId }, 'decision-trial'),
         resize: (expanded) => invoke({ kind: 'view.resize', expanded }, 'ok'),
-        layout: (panel, width, height) => invoke({ kind: 'view.layout', panel, width, height }, 'layout'),
+        layout: (panel, width, height, call) => invoke(call === undefined
+            ? { kind: 'view.layout', panel, width, height }
+            : { kind: 'view.layout', panel, width, height, call }, 'layout'),
         drag: (phase) => invoke({ kind: 'view.drag', phase }, 'ok'),
         hide: () => invoke({ kind: 'view.hide' }, 'ok'),
         resetPosition: () => invoke({ kind: 'view.reset' }, 'ok'),
         readSettings: () => invoke({ kind: 'settings.read' }, 'settings'),
         updateSetting: (field, value) => invoke({ kind: 'settings.update', field, value }, 'settings-update'),
+        settleAppAssist: (scopeRef, offerRef, action) => invoke({ kind: 'app-assist.settle', scopeRef, offerRef, action }, 'app-assist-settlement'),
         disableCompanion: () => invoke({ kind: 'companion.disable' }, 'companion-lifecycle'),
         readConversation,
         readConversationPage,

package/renderer/conversation.mjs

@@ -3,8 +3,8 @@ import { explainError } from './errors.mjs';
 /** Local controls only. Durable messages, identity and preferences belong to the Host. */
 export class CompanionConversation {
   constructor({ client, createPeer, render, transcript, delivery = () => {}, stopScreen,
-    uuid = () => crypto.randomUUID() }) {
-    Object.assign(this, { client, createPeer, render, transcript, delivery, stopScreen, uuid });
+    uuid = () => crypto.randomUUID(), now = Date.now }) {
+    Object.assign(this, { client, createPeer, render, transcript, delivery, stopScreen, uuid, now });
     this.active = false;
     this.generation = 0;
     this.phase = 'idle';
@@ -20,7 +20,7 @@ export class CompanionConversation {
     this.message = message;
     this.render({ phase: this.phase, identity: this.identity, audioMode: this.audioMode, retryMode: this.retryMode,
       muted: this.muted, silent: this.silent, failed: this.failed, recovering: this.recovering,
-      callId: this.callId, message });
+      callId: this.callId, connectedAt: this.connectedAt ?? null, message });
   }
   current(generation) { return this.active && generation === this.generation; }
   listening() {
@@ -69,6 +69,7 @@ export class CompanionConversation {
     this.recovering = false;
     this.phase = 'connecting';
     this.callId = null;
+    this.connectedAt = null;
     this.expectedHostStop = undefined;
     const generation = ++this.generation;
     // Must reach the isolated preload while the click still has user activation.
@@ -82,6 +83,7 @@ export class CompanionConversation {
         if (event.type === 'connected') {
           if (this.callId && this.callId !== event.callId) return;
           this.callId = event.callId;
+          this.connectedAt ??= this.now();
           this.recovering = false;
           clearTimeout(this.deadline); this.phase = 'talking'; this.show(this.listening());
         }
@@ -130,6 +132,7 @@ export class CompanionConversation {
     this.phase = 'idle';
     this.recovering = false;
     this.callId = null;
+    this.connectedAt = null;
     this.show(message);
     await Promise.allSettled([peer?.close(), this.stopScreen()]);
   }

package/renderer/index.html

@@ -17,7 +17,7 @@
   </svg>
   <main id="desktop" aria-label="猫猫球">
     <div id="anchor">
-      <button id="pet" aria-label="猫猫：点击或右键打开名片，拖动移动" aria-expanded="false" aria-controls="actions menu chat transcript settings decisions">
+      <button id="pet" aria-label="猫猫：点击或右键打开名片，拖动移动" aria-expanded="false" aria-controls="actions menu chat transcript settings decisions app-assist">
         <svg id="living-sit" viewBox="0 0 600 600" aria-hidden="true" hidden>
           <defs>
             <mask id="living-eye-left" maskUnits="userSpaceOnUse" x="0" y="0" width="600" height="600"><image href="./skins/xianxian-living/layers/whiteL.webp" width="600" height="600"/></mask>
@@ -47,15 +47,21 @@
     <section id="bubble" class="floating" aria-label="最新消息" hidden>
       <p id="bubble-first" hidden></p><p id="bubble-second" hidden></p>
     </section>
+    <section id="app-assist" class="floating app-assist" aria-label="应用旁的轻提示" data-candidate="true" hidden>
+      <p>你打开了 <strong id="app-assist-name"></strong>。要我一起看吗？</p>
+      <div><button id="app-assist-dismiss" type="button">暂不</button><button id="app-assist-start" class="primary" type="button">打开通话控制</button></div>
+    </section>
+    <section id="call-bubble" class="floating call-recent" aria-label="通话中的最新话语" hidden>
+      <p id="call-bubble-first" hidden></p><p id="call-bubble-second" hidden></p>
+    </section>
     <section id="actions" class="floating call-bar" aria-label="当前通话" hidden>
-      <div class="call-status-line"><span class="status-dot" aria-hidden="true"></span><strong id="call-state">通话中</strong><span id="call-mic-state">麦克风已开启</span></div>
-      <p id="call-meeting" class="call-meeting" hidden><span class="meeting-status-dot" aria-hidden="true"></span><span id="call-meeting-label" class="meeting-label"></span><span id="call-meeting-source" class="meeting-source" hidden></span></p>
-      <p id="call-work" class="call-work" hidden></p>
-      <div id="call-share-context" class="call-share-context" hidden><svg class="icon" aria-hidden="true"><use href="#i-screen"/></svg><span><strong id="call-share-target"></strong><small>仅共享此窗口</small></span></div>
-      <div class="call-recent" aria-label="最新消息">
-        <small class="call-recent-label">最新消息</small>
-        <p id="call-bubble-first" hidden></p><p id="call-bubble-second" hidden></p>
+      <div class="call-header">
+        <div class="call-status-line"><span class="status-dot" aria-hidden="true"></span><strong id="call-state">通话中</strong><span id="call-mic-state">麦克风已开启</span></div>
+        <p id="call-meeting" class="call-meeting" hidden><span class="meeting-status-dot" aria-hidden="true"></span><span id="call-meeting-label" class="meeting-label"></span><span id="call-meeting-source" class="meeting-source" hidden></span></p>
+        <p id="call-work" class="call-work" hidden></p>
+        <time id="call-duration" class="call-duration" aria-label="通话时长" hidden></time>
       </div>
+      <div id="call-share-context" class="call-share-context" hidden><svg class="icon" aria-hidden="true"><use href="#i-screen"/></svg><strong id="call-share-target"></strong><small> · 仅此窗口</small></div>
       <div id="active-actions" class="action-row call-actions">
         <button id="mic" data-action="mute"><svg class="icon" aria-hidden="true"><use id="mic-icon" href="#i-mic"/></svg><span class="label">静音</span></button>
         <button data-action="share" id="share"><svg class="icon" aria-hidden="true"><use href="#i-screen"/></svg><span class="label">共享画面</span></button>
@@ -185,6 +191,7 @@
         <button id="settings-look-open" class="settings-row" type="button" data-setting-control data-drilldown><span>外观</span><span id="settings-look-value" class="settings-value">—</span></button>
         <button id="settings-behavior" class="settings-row setting-switch" type="button" role="switch" aria-checked="false" data-setting-control><span><strong>自主活动</strong><small>空闲时自行走动</small></span><i aria-hidden="true"></i></button>
         <button id="settings-proactive" class="settings-row setting-switch" type="button" role="switch" aria-checked="false" data-setting-control><span><strong>主动提示</strong><small>有待办时在猫旁显示数量</small></span><i aria-hidden="true"></i></button>
+        <button id="settings-app-assist" class="settings-row setting-switch" type="button" role="switch" aria-checked="false" data-setting-control><span><strong>应用旁问一句</strong><small>只看应用名字；每个应用每天最多一次</small></span><i aria-hidden="true"></i></button>
         <button id="settings-documents" class="settings-row setting-switch" type="button" role="switch" aria-checked="false" data-setting-control><span><strong>资料查询</strong><small>允许陪伴者在通话中查询家里的资料</small></span><i aria-hidden="true"></i></button>
         <footer class="settings-footer"><button id="settings-reset" type="button" data-setting-control>重置位置</button><button id="settings-disable-open" type="button" data-setting-control>停用桌面猫猫球…</button></footer>
       </div>

package/renderer/pet-controls.mjs

@@ -4,7 +4,9 @@ export function bindPetControls(client, {
 }) {
   const $ = id => document.getElementById(id);
   const body = $('pet');
-  const panelIds = ['actions', 'menu', 'chat', 'bubble', 'decisions', 'transcript', 'settings'];
+  const panelIds = ['actions', 'menu', 'chat', 'bubble', 'app-assist', 'decisions', 'transcript', 'settings'];
+  const callBubble = $('call-bubble');
+  const managedIds = [...panelIds, 'call-bubble'];
   const desiredSizes = new WeakMap();
   let panel = 'none', ambientPanel = 'none', layoutRevision = 0, layoutScheduled = false, drag, suppressClick = false;
   const measure = node => {
@@ -21,6 +23,24 @@ export function bindPetControls(client, {
     node.style.maxHeight = appliedMaxHeight;
     return desired;
   };
+  const hasCallBubble = () => callBubble?.querySelector('p:not([hidden])') !== null;
+  const callLayout = next => {
+    if (next !== 'actions') {
+      if (callBubble) callBubble.hidden = true;
+      return undefined;
+    }
+    const presentation = $('actions').dataset.presentation === 'controls' ? 'controls' : 'lite';
+    const call = { presentation };
+    if (callBubble && hasCallBubble()) {
+      callBubble.hidden = false;
+      call.bubble = measure(callBubble);
+    } else if (callBubble) callBubble.hidden = true;
+    return call;
+  };
+  const sizeKey = (desired, call) => [
+    desired.width, desired.height, call?.presentation ?? '',
+    call?.bubble?.width ?? '', call?.bubble?.height ?? '',
+  ].join(':');
   async function show(next) {
     if (next === 'none' && ambientPanel !== 'none') next = ambientPanel;
     const previousPanel = panel;
@@ -28,14 +48,24 @@ export function bindPetControls(client, {
     panel = next;
     for (const id of panelIds) $(id).hidden = id !== next;
     body.setAttribute('aria-expanded', String(!['none', 'bubble'].includes(next)));
+    const call = callLayout(next);
     const desired = measure(node);
-    if (node) desiredSizes.set(node, `${desired.width}:${desired.height}`);
+    if (node) desiredSizes.set(node, sizeKey(desired, call));
     const revision = ++layoutRevision;
     try {
-      const placed = await client.layout(next, desired.width, desired.height);
+      const placed = await client.layout(next, desired.width, desired.height, call);
       if (revision !== layoutRevision) return;
       $('anchor').style.left = `${placed.pet.x}px`; $('anchor').style.top = `${placed.pet.y}px`;
       if (node) { node.style.left = `${placed.panel.x}px`; node.style.top = `${placed.panel.y}px`; node.style.maxHeight = `${placed.panel.height}px`; }
+      if (callBubble) {
+        const visible = next === 'actions' && call?.bubble && placed.bubble;
+        callBubble.hidden = !visible;
+        if (visible) {
+          callBubble.style.left = `${placed.bubble.x}px`;
+          callBubble.style.top = `${placed.bubble.y}px`;
+          callBubble.style.maxHeight = `${placed.bubble.height}px`;
+        }
+      }
       if (previousPanel !== next) {
         if (next === 'chat') {
           const mode = $('chat').dataset.replyMode;
@@ -54,6 +84,7 @@ export function bindPetControls(client, {
       if (revision !== layoutRevision) return;
       panel = previousPanel;
       for (const id of panelIds) $(id).hidden = id !== panel;
+      if (callBubble) callBubble.hidden = panel !== 'actions' || !hasCallBubble();
       body.setAttribute('aria-expanded', String(!['none', 'bubble'].includes(panel)));
       error(cause, { panel: next });
     }
@@ -65,8 +96,9 @@ export function bindPetControls(client, {
       layoutScheduled = false;
       const node = $(panel);
       if (!node || node.hidden) return;
+      const call = callLayout(panel);
       const desired = measure(node);
-      const key = `${desired.width}:${desired.height}`;
+      const key = sizeKey(desired, call);
       if (desiredSizes.get(node) === key) return;
       void show(panel);
     });
@@ -123,20 +155,24 @@ export function bindPetControls(client, {
     if (!current || current.hidden) return;
     // Root visibility is already handled by show(). Descendant visibility and
     // text/row mutations are content demand and may require a larger surface.
-    if (records.some(record => record.type !== 'attributes' || !panelIds.includes(record.target.id))) remeasure();
+    if (records.some(record => record.type !== 'attributes' || !managedIds.includes(record.target.id))) remeasure();
   });
   for (const id of panelIds) observer.observe($(id), {
     subtree: true, childList: true, characterData: true, attributes: true, attributeFilter: ['hidden'],
   });
+  if (callBubble) observer.observe(callBubble, {
+    subtree: true, childList: true, characterData: true, attributes: true, attributeFilter: ['hidden'],
+  });
   window.addEventListener('beforeunload', () => observer.disconnect());
   return {
     get panel() { return panel; }, show, remeasure,
     setAmbient(value) {
       const next = value === true ? 'bubble' : value === false ? 'none' : value;
-      if (!['none', 'bubble', 'actions'].includes(next)) return Promise.resolve();
+      const ambientPanels = ['none', 'bubble', 'actions', 'app-assist'];
+      if (!ambientPanels.includes(next)) return Promise.resolve();
       if (ambientPanel === next) return Promise.resolve();
       ambientPanel = next;
-      return ['none', 'bubble', 'actions'].includes(panel) ? show('none') : Promise.resolve();
+      return ambientPanels.includes(panel) ? show('none') : Promise.resolve();
     },
     dismiss() { if (drag) suppressClick = true; void show('none'); },
   };

package/renderer/recent-bubble.mjs

@@ -6,8 +6,9 @@ function referenceKey(reference) {
 }
 
 export class RecentBubble {
-  constructor(rows) {
+  constructor(rows, { showSpeaker = true } = {}) {
     this.rows = rows;
+    this.showSpeaker = showSpeaker;
     this.history = [];
     this.live = new Map();
     this.rowReferences = new WeakMap();
@@ -58,7 +59,7 @@ export class RecentBubble {
     for (const [index, row] of this.rows.entries()) {
       const entry = entries[index];
       row.hidden = !entry;
-      const speaker = entry ? `${String(entry.name).slice(0, 28)}：` : '';
+      const speaker = entry && this.showSpeaker ? `${String(entry.name).slice(0, 28)}：` : '';
       const message = entry ? String(entry.text).slice(-120) : '';
       row.textContent = `${speaker}${message}`;
       if (entry && row.ownerDocument?.createElement && typeof row.replaceChildren === 'function') {
@@ -66,6 +67,7 @@ export class RecentBubble {
         const messageNode = row.ownerDocument.createElement('span');
         const messageText = row.ownerDocument.createElement('bdi');
         speakerNode.className = 'recent-speaker';
+        speakerNode.hidden = !speaker;
         messageNode.className = 'recent-message';
         messageText.className = 'recent-message-text';
         messageText.dir = 'auto';

package/renderer/settings-view.mjs

@@ -14,6 +14,7 @@ const fieldLabels = {
   proactivePolicy: '主动提示',
   personaTone: '人设基调',
   householdReadsAllowed: '资料查询',
+  appAssistEnabled: '应用旁问一句',
 };
 
 export class SettingsView {
@@ -44,6 +45,9 @@ export class SettingsView {
     this.$('settings-proactive').onclick = () => void this.controller.requestUpdate(
       'proactivePolicy', this.controller.state.values?.proactivePolicy === 'quiet-badge' ? 'ambient' : 'quiet-badge',
     );
+    this.$('settings-app-assist').onclick = () => void this.controller.requestUpdate(
+      'appAssistEnabled', !this.controller.state.values?.appAssistEnabled,
+    );
     this.$('settings-documents').onclick = () => {
       const value = !this.controller.state.values?.householdReadsAllowed;
       void this.controller.requestUpdate('householdReadsAllowed', value, { confirm: this.callActive() });
@@ -123,6 +127,7 @@ export class SettingsView {
     this.$('settings-look-value').textContent = skinLabels[values.skin] ?? values.skin;
     this.setToggle('settings-behavior', values.behaviorEnabled);
     this.setToggle('settings-proactive', values.proactivePolicy === 'quiet-badge');
+    this.setToggle('settings-app-assist', values.appAssistEnabled);
     this.setToggle('settings-documents', values.householdReadsAllowed);
     this.$('settings-size').value = String(values.ballSize);
     this.$('settings-tone').value = values.personaTone;
@@ -139,7 +144,8 @@ export class SettingsView {
     if (field === 'skin') return skinLabels[value] ?? value;
     if (field === 'dutyCatProfileId')
       return state.companions?.find(item => item.catProfileId === value)?.displayName ?? '已保存的陪伴者';
-    if (field === 'behaviorEnabled' || field === 'householdReadsAllowed') return value ? '开启' : '关闭';
+    if (field === 'behaviorEnabled' || field === 'householdReadsAllowed' || field === 'appAssistEnabled')
+      return value ? '开启' : '关闭';
     if (field === 'proactivePolicy') return value === 'quiet-badge' ? '开启' : '关闭';
     if (field === 'ballSize') return `${value}`;
     return value;
@@ -169,12 +175,13 @@ export class SettingsView {
 
   renderSettlement(state) {
     for (const id of ['settings-partner-open', 'settings-look-open', 'settings-behavior',
-      'settings-proactive', 'settings-documents', 'settings-tone-field', 'settings-size-field'])
+      'settings-proactive', 'settings-app-assist', 'settings-documents', 'settings-tone-field', 'settings-size-field'])
       delete this.$(id).dataset.settlement;
     if (state.notice?.kind !== 'unconfirmed') return;
     const ids = {
       dutyCatProfileId: 'settings-partner-open', skin: 'settings-look-open',
       behaviorEnabled: 'settings-behavior', proactivePolicy: 'settings-proactive',
+      appAssistEnabled: 'settings-app-assist',
       householdReadsAllowed: 'settings-documents', personaTone: 'settings-tone-field',
       ballSize: 'settings-size-field',
     };

package/renderer/style.css

@@ -78,6 +78,16 @@ button:disabled { opacity: .45; cursor: default; }
 #bubble p { margin: 0; display: flex; min-width: 0; font-size: 11px; line-height: 1.45; overflow: hidden; white-space: nowrap; }
 #bubble p + p { margin-top: 4px; }
 #bubble [data-role="user"] { color: var(--cafe-text-secondary); }
+.app-assist { width: 320px; padding: 12px; }
+.app-assist p { margin: 0; color: var(--desktop-body); font-size: 13px; line-height: 1.5; }
+.app-assist p strong { color: var(--desktop-ink); font-weight: 600; }
+.app-assist > div { display: flex; justify-content: flex-end; gap: 6px; margin-top: 9px; }
+.app-assist > div button { min-height: 30px; padding: 5px 10px; font-size: 12px; }
+#call-bubble { width: 320px; max-height: 80px; overflow: hidden; padding: 9px 11px; pointer-events: none; }
+#call-bubble:not(:has(p:not([hidden]))) { display: none; }
+#call-bubble p { margin: 0; display: flex; min-width: 0; overflow: hidden; white-space: nowrap; font-size: 12px; line-height: 1.45; }
+#call-bubble p + p { margin-top: 3px; }
+#call-bubble p[data-role="user"] { color: var(--desktop-muted); }
 .floating button { border: 0; background: transparent; border-radius: 7px; padding: 8px 11px; font-weight: 400; }
 .floating button:hover:not(:disabled) { background: var(--cafe-surface); }
 .floating .primary { background: var(--desktop-primary); color: white; }
@@ -85,24 +95,22 @@ button:disabled { opacity: .45; cursor: default; }
 .floating .destructive { background: var(--desktop-danger); color: white; font-weight: 500; }
 .floating .destructive:hover:not(:disabled) { background: #942c24; }
 .floating .destructive.compact { min-width: 72px; padding: 6px 12px; }
-#actions { padding: 12px; width: 412px; overflow: hidden; }
-#actions[data-presentation="lite"] { width: 320px; display: flex; flex-direction: column; align-items: flex-end; border: 0; background: transparent; box-shadow: none; padding: 0; overflow: visible; }
-#actions[data-presentation="lite"] > :not(.call-status-line, .call-recent) { display: none !important; }
-#actions[data-presentation="lite"] .call-status-line { order: 2; min-height: 29px; width: fit-content; border: 1px solid #fff3; border-radius: 8px; background: var(--desktop-ink); box-shadow: 0 3px 8px #1817152e; color: var(--desktop-paper); padding: 5px 10px; }
+#actions { width: 412px; overflow: hidden; padding: 10px; }
+#actions[data-presentation="lite"] { width: max-content; max-width: 320px; border: 0; background: transparent; box-shadow: none; padding: 0; overflow: visible; }
+#actions[data-presentation="lite"] > :not(.call-header) { display: none !important; }
+#actions[data-presentation="lite"] .call-header { min-height: 29px; width: fit-content; border: 1px solid #fff3; border-radius: 8px; background: var(--desktop-ink); box-shadow: 0 3px 8px #1817152e; color: var(--desktop-paper); padding: 5px 10px; }
+#actions[data-presentation="lite"] .call-header > :not(.call-status-line) { display: none !important; }
 #actions[data-presentation="lite"] .call-status-line strong { color: inherit; font-size: 12px; }
 #actions[data-presentation="lite"] .call-status-line span:not(.status-dot) { color: #d8d1c6; font-size: 11px; }
-#actions[data-presentation="lite"] .call-recent { order: 1; align-self: stretch; display: none; margin: 0 0 8px; border: 1px solid var(--desktop-line-strong); border-radius: 12px; background: var(--desktop-paper); box-shadow: 0 8px 18px #1817151f; padding: 9px 11px; }
-#actions[data-presentation="lite"] .call-recent:has(p:not([hidden])) { display: block; }
-#actions[data-presentation="lite"] .call-recent-label { display: none; }
-#actions[data-presentation="lite"] .call-recent p { margin-top: 0; }
+.call-header { min-width: 0; min-height: 24px; display: flex; align-items: center; gap: 7px; }
 .action-row { display: flex; align-items: center; gap: 4px; }
-.action-row button { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 35px; font-size: 12px; white-space: nowrap; }
+.action-row button { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 28px; height: 28px; padding: 4px 8px; font-size: 12px; white-space: nowrap; }
 .action-row button .icon { width: 16px; height: 16px; }
-#active-actions { border-top: 1px solid var(--desktop-line); margin-top: 9px; padding-top: 9px; }
-#lite-call-compose { display: none; align-items: center; gap: 8px; border-top: 1px solid var(--desktop-line); margin-top: 9px; padding-top: 9px; }
+#active-actions { margin-top: 6px; }
+#lite-call-compose { display: none; align-items: center; gap: 7px; margin-top: 6px; }
 #actions[data-presentation="controls"] #lite-call-compose { display: flex; }
-#lite-call-message { min-width: 0; height: 34px; flex: 1; border: 1px solid var(--desktop-line-strong); border-radius: 8px; background: var(--desktop-paper); color: var(--desktop-ink); padding: 6px 9px; }
-#lite-call-compose button { height: 34px; padding: 6px 12px; }
+#lite-call-message { min-width: 0; height: 30px; flex: 1; border: 1px solid var(--desktop-line-strong); border-radius: 7px; background: var(--desktop-paper); color: var(--desktop-ink); padding: 5px 9px; }
+#lite-call-compose button { height: 30px; min-height: 30px; padding: 5px 11px; }
 #status { font-size: 12px; line-height: 1.45; margin: 8px 0 0; color: var(--desktop-muted); }
 .call-status-line { min-height: 24px; display: flex; align-items: center; gap: 7px; white-space: nowrap; }
 .call-status-line strong { font-size: 13px; font-weight: 600; }
@@ -139,6 +147,10 @@ button:disabled { opacity: .45; cursor: default; }
   to { opacity: 0; transform: scale(3); }
 }
 .call-meeting { min-width: 0; margin: 3px 0 0 15px; display: flex; align-items: center; gap: 5px; color: var(--desktop-muted); font-size: 12px; line-height: 1.35; }
+#actions .call-meeting { margin: 0; overflow: hidden; flex: 0 1 auto; }
+#actions .call-work { min-width: 0; margin: 0; overflow: hidden; flex: 0 1 auto; text-overflow: ellipsis; white-space: nowrap; }
+#actions .call-work::before { content: "· "; }
+.call-duration { margin-left: auto; flex: none; color: var(--desktop-muted); font-size: 11px; font-variant-numeric: tabular-nums; }
 .call-context > .call-meeting { grid-column: 1 / -1; margin: 0; }
 .meeting-status-dot { width: 7px; height: 7px; flex: none; border-radius: 999px; background: var(--desktop-success); }
 .call-meeting[data-tone="quiet"] .meeting-status-dot { background: var(--desktop-muted); }
@@ -146,21 +158,19 @@ button:disabled { opacity: .45; cursor: default; }
 .meeting-label { flex: none; white-space: nowrap; }
 .meeting-source { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .call-work { margin: 3px 0 0 15px; color: var(--desktop-muted); font-size: 12px; }
-.call-share-context { display: flex; align-items: center; gap: 7px; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--desktop-line); }
+.call-share-context { min-width: 0; display: flex; align-items: center; gap: 5px; margin-top: 4px; color: var(--desktop-muted); white-space: nowrap; }
+.call-share-context .icon { width: 14px; height: 14px; }
+.call-share-context strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.call-share-context small { flex: none; }
 .call-share-context > span, .call-share-line > span { display: grid; gap: 1px; min-width: 0; }
 .call-share-context strong, .call-share-line strong { overflow: hidden; color: var(--desktop-body); font-size: 12px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
 .call-share-context small, .call-share-line small { color: var(--desktop-muted); font-size: 11px; }
-.call-recent { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--desktop-line); }
-.call-recent-label { color: var(--desktop-muted); font-size: 11px; letter-spacing: .05em; }
-.call-recent p { margin: 4px 0 0; display: flex; min-width: 0; overflow: hidden; white-space: nowrap; font-size: 12px; line-height: 1.45; }
 .recent-speaker { flex: none; }
 .recent-message { min-width: 0; flex: 1 1 auto; overflow: hidden; direction: rtl; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
 .recent-message[data-direction="rtl"] { direction: ltr; }
 .recent-message-text { unicode-bidi: isolate; }
-.call-recent p[data-role="user"] { color: var(--desktop-muted); }
 .call-actions { justify-content: flex-end; }
-.call-actions #mic .label, .call-actions [data-action="transcript"] > span { display: none; }
-.call-actions #end { min-width: 88px; margin-left: auto; }
+.call-actions #end { min-width: 60px; margin-left: auto; }
 .action-unread { min-width: 17px; height: 17px; display: inline-grid; place-items: center; border-radius: 999px; padding: 0 5px; background: #f2dcc8; color: #7a3f2e; font-size: 10px; font-weight: 700; line-height: 1; }
 #menu { width: 340px; max-height: 500px; display: flex; flex-direction: column; overflow: hidden; padding: 8px; }
 .menu-scroll { min-height: 0; flex: 1 1 auto; overflow-x: hidden; overflow-y: auto; }

package/renderer/surface.mjs

@@ -22,6 +22,8 @@ import { MeetingStatus, renderMeetingStatus } from './meeting-state.mjs';
 import { VisibleTextPresentation } from './visible-text-receipt.mjs';
 import { ConversationSurface } from './conversation-surface.mjs';
 import { CallControlsPresentation } from './call-controls-presentation.mjs';
+import { CallDuration } from './call-duration.mjs';
+import { AppAssistController } from './app-assist-controller.mjs';
 const $ = id => document.getElementById(id);
 const label = (id, text) => { $(id).querySelector('.label').textContent = text; };
 const status = text => {
@@ -37,7 +39,8 @@ const callTranscript = new CallTranscriptView($('call-transcript-log'), {
   },
 });
 const bubble = new RecentBubble([$('bubble-first'), $('bubble-second')]);
-const callBubble = new RecentBubble([$('call-bubble-first'), $('call-bubble-second')]);
+const callBubble = new RecentBubble([$('call-bubble-first'), $('call-bubble-second')], { showSpeaker: false });
+const callDuration = new CallDuration($('call-duration'));
 const meetingStatus = new MeetingStatus();
 const foldedChatUnread = new FoldedChatUnread(count => {
   $('call-chat-unread').hidden = count === 0;
@@ -51,10 +54,11 @@ const nativeTravel = new NativeWindowTravel({
   changed: value => motion.syncTravel(value),
 });
 let sharing = false, pendingScreen = false, transcriptLoading = false, previousPhase = 'idle';
+let appAssistOffer = null;
 let didMove = false, settingsView, settingsValues, decisionPanel, workView, callControlsPresentation;
 let previousControlPanel = 'none';
 // F229 stays quiet: a history ID change has no provenance for proactive text.
-const ambientPanel = active => active ? 'actions' : 'none';
+const ambientPanel = active => active ? 'actions' : appAssistOffer ? 'app-assist' : 'none';
 const setTexts = (ids, text) => { for (const id of ids) $(id).textContent = text; };
 const setHidden = (ids, hidden) => { for (const id of ids) $(id).hidden = hidden; };
 if (!window.clowderCompanion) {
@@ -135,6 +139,19 @@ if (!window.clowderCompanion) {
     accepted: () => { motion.signal('received'); void conversationSurface.readHistory(); },
     changed: () => controls.remeasure(),
   });
+  const appAssist = new AppAssistController({
+    client,
+    changed: value => {
+      appAssistOffer = value.offer;
+      $('app-assist-name').textContent = appAssistOffer?.appName ?? '';
+      void controls.setAmbient(ambientPanel(previousPhase !== 'idle'));
+    },
+    accepted: () => {
+      status('提示已收起。请先点“语音通话”，连上后再点“共享画面”。');
+      $('menu-status').hidden = false;
+      void controls.show('menu');
+    },
+  });
   const screen = new ScreenShare({
     screenRequest: () => client.screenPick(), screenStart: (selectionId, name) => client.screenOpen(selectionId, name),
     screenFrame: (selectionId, frame) => client.screenFrame(selectionId, {
@@ -193,7 +210,9 @@ if (!window.clowderCompanion) {
       const canReceiveOnly = value.identity?.audio?.supportedModes?.includes('receive_only') === true;
       const retryReceiveOnly = value.failed && value.retryMode === 'receive_only' && canReceiveOnly;
       visibleText.setCall(value.callId);
+      callDuration.set(value.connectedAt);
       callControlsPresentation.setActive(active);
+      if (value.identity?.appAssist) appAssist.consume(value.identity.appAssist);
       void controls.setAmbient(ambientPanel(active));
       $('begin').hidden = active; $('begin').disabled = !value.identity;
       $('listen').hidden = active || !canReceiveOnly; $('listen').disabled = !value.identity;
@@ -212,7 +231,7 @@ if (!window.clowderCompanion) {
       $('compose').querySelector('button').disabled = !value.identity || value.phase === 'connecting';
       callControlsPresentation.setComposerState(value.identity, value.phase === 'connecting');
       status(value.message ?? '');
-      $('status').hidden = !value.message || /^(点击|正在听|只听模式|只听已结束|语音通话已结束|已发送)/.test(value.message);
+      $('status').hidden = !value.message || /^(点击|正在听|麦克风已静音|只听模式|只听已结束|语音通话已结束|已发送)/.test(value.message);
       $('menu-status').hidden = !value.message;
       const callState = value.recovering ? '连接不稳定' : value.phase === 'connecting' ? '正在连接'
         : receiveOnly ? '只听中' : active ? '通话中' : '';
@@ -278,6 +297,8 @@ if (!window.clowderCompanion) {
       if (showFailure) void controls.show('menu');
     },
   });
+  $('app-assist-dismiss').onclick = () => { void appAssist.settle('dismiss'); };
+  $('app-assist-start').onclick = () => { void appAssist.settle('accept'); };
   conversationSurface = new ConversationSurface({
     document, client, controls, bubble, transcript,
     getCallPhase: () => conversation.phase,
@@ -344,7 +365,7 @@ if (!window.clowderCompanion) {
   const decisionMonitor = setInterval(() => { if (controls.panel !== 'decisions') void decisionPanel.read(); }, 15000), workMonitor = setInterval(() => { if (controls.panel === 'menu') void workView.load(); }, 15000);
   void conversation.refresh(); conversationSurface.start(); void decisionPanel.read(); void settingsView.controller.load(); void controls.show('none');
   window.addEventListener('beforeunload', () => {
-    clearInterval(statusMonitor); clearInterval(transcriptMonitor); clearInterval(decisionMonitor); clearInterval(workMonitor); conversationSurface.close(); callControlsPresentation.close();
-    unsubscribe(); visibleText.close(); nativeTravel.close(); motion.close(); void conversation.end();
+    clearInterval(statusMonitor); clearInterval(transcriptMonitor); clearInterval(decisionMonitor); clearInterval(workMonitor); conversationSurface.close(); callControlsPresentation.close(); callDuration.close();
+    unsubscribe(); appAssist.close(); visibleText.close(); nativeTravel.close(); motion.close(); void conversation.end();
   });
 }