@clowder-ai/companion 0.1.0-alpha.2 → 0.1.0-alpha.20

package/renderer/pet-motion.mjs

@@ -0,0 +1,343 @@
+import { isLivingClip } from './living-body.mjs';
+import { MotionFacts } from './motion-facts.mjs';
+import { additional, atlas, signals, staticSkins, validId, visualAlias, workAction } from './pet-motion-assets.mjs';
+/** Select one truthful body from Host facts and local, user-controlled gestures. */
+export class PetMotion {
+  constructor(element, options = {}) {
+    this.element = element;
+    const setTimer = options.setTimer ?? globalThis.setTimeout;
+    const clearTimer = options.clearTimer ?? globalThis.clearTimeout;
+    this.setTimer = (callback, delay) => setTimer.call(globalThis, callback, delay);
+    this.clearTimer = id => clearTimer.call(globalThis, id);
+    this.now = options.now ?? Date.now;
+    this.livingBody = options.livingBody;
+    this.reducedMotion = options.reducedMotion ?? globalThis.matchMedia?.('(prefers-reduced-motion: reduce)').matches ?? false;
+    this.autoPlay = options.autoPlay === true;
+    this.autoPlayIdleMs = Math.max(90_000, options.autoPlayIdleMs ?? 90_000);
+    this.autoPlayCooldownMs = Math.max(180_000, options.autoPlayCooldownMs ?? 180_000);
+    this.lastPlayAt = Number.NEGATIVE_INFINITY;
+    this.skin = 'xianxian-codex';
+    this.phase = 'idle';
+    this.base = 'idle';
+    this.action = '';
+    this.frame = 0;
+    this.dragging = false;
+    this.oneShot = false;
+    this.pendingDecision = false;
+    this.dockedEdge = null;
+    this.dockZone = null;
+    this.resting = false;
+    this.transient = null;
+    this.facts = new MotionFacts({ now: this.now, setTimer: this.setTimer, clearTimer: this.clearTimer,
+      changed: () => this.refresh() });
+    this.seenEvents = new Map();
+  }
+
+  setContext({ skin, phase, nativeActivity, muted }) {
+    const selectedSkin = ['xianxian-codex', 'yanyan-codex', ...Object.keys(staticSkins)].includes(skin)
+      ? skin : 'xianxian-codex';
+    const wasSleeping = this.action === 'sleeping' || this.resting;
+    this.context = { skin: selectedSkin, phase, nativeActivity, muted };
+    const changedSkin = selectedSkin !== this.skin;
+    this.skin = selectedSkin;
+    this.phase = phase;
+    if (phase !== 'idle' || nativeActivity !== 'none') {
+      this.resting = false;
+      this.cancelIdleTimers();
+    }
+    if (nativeActivity !== 'none' && this.transient?.action !== 'failed') this.transient = null;
+    else if (wasSleeping && ['talking', 'connecting'].includes(phase) && !muted)
+      this.transient = { action: 'waking' };
+    this.refresh(changedSkin);
+  }
+  setBehaviorEnabled(enabled) {
+    const next = enabled === true;
+    if (this.autoPlay === next) return;
+    this.autoPlay = next;
+    if (!next) {
+      if (this.autoTimer !== undefined) this.clearTimer(this.autoTimer);
+      this.autoTimer = undefined;
+      if (this.transient?.automatic) {
+        this.transient = null;
+        this.refresh();
+      }
+      return;
+    }
+    this.refresh();
+  }
+  syncSnapshot(value) {
+    this.syncFacts(value, false);
+  }
+  syncNativeSnapshot(value) {
+    this.syncFacts(value, true);
+  }
+  syncFacts(value, nativeOnly) {
+    const now = this.now();
+    this.hasNativeWork = value !== null && value !== undefined;
+    for (const [id, expiresAt] of this.seenEvents) if (expiresAt <= now) this.seenEvents.delete(id);
+    if (nativeOnly) this.facts.syncNative(value);
+    else this.facts.sync(value, this.dragging);
+    if (this.snapshot.work) {
+      this.resting = false;
+      this.cancelIdleTimers();
+      if (this.transient?.action !== 'failed') this.transient = null;
+    } else if (this.resting && (this.snapshot.delivery || this.snapshot.travel)) {
+      this.resting = false;
+      this.cancelRest();
+      this.transient = { action: 'waking' };
+    }
+    this.refresh();
+  }
+  syncTravel(value) {
+    this.facts.syncTravel(value, this.dragging);
+    if (this.resting && this.snapshot.travel) {
+      this.resting = false;
+      this.cancelRest();
+      this.transient = { action: 'waking' };
+    }
+    this.refresh();
+  }
+  setPendingDecision(value) {
+    const pending = value === true;
+    if (this.pendingDecision === pending) return;
+    this.pendingDecision = pending;
+    if (pending) {
+      this.resting = false;
+      this.transient = null;
+      this.cancelIdleTimers();
+    }
+    this.refresh();
+  }
+  setDockedEdge(value) {
+    const candidate = typeof value === 'string' ? { edge: value, zone: 'corner' } : value;
+    const edge = ['left', 'right'].includes(candidate?.edge) ? candidate.edge : null;
+    const zone = edge && ['corner', 'mid'].includes(candidate?.zone) ? candidate.zone : edge ? 'corner' : null;
+    if (this.dockedEdge === edge && this.dockZone === zone) return;
+    this.dockedEdge = edge;
+    this.dockZone = zone;
+    if (edge) this.cancelIdleTimers();
+    this.refresh(this.action === 'peek');
+  }
+  signal(kind, eventId) {
+    if (kind === 'answered') return;
+    if (kind === 'connected' && this.living()) return;
+    if (kind === 'play') {
+      if (!this.canPlay()) return;
+      this.lastPlayAt = this.now();
+      this.resting = false;
+      this.cancelIdleTimers();
+      this.transient = { action: 'play', automatic: false };
+      this.refresh();
+      return;
+    }
+    let requested = signals[kind];
+    if (kind === 'received' && (this.action === 'sleeping' || this.resting)) requested = 'waking';
+    if (!requested || this.dragging || staticSkins[this.skin]) return;
+    const now = this.now();
+    if (validId(eventId)) {
+      if (this.seenEvents.has(eventId)) return;
+      this.seenEvents.set(eventId, now + 3_600_000);
+    }
+    this.resting = false;
+    this.cancelIdleTimers();
+    this.transient = { action: requested };
+    this.refresh();
+  }
+  move(dx, dy) {
+    if (!Number.isFinite(dx) || !Number.isFinite(dy) || Math.hypot(dx, dy) < 6) return;
+    if (this.dragging) return;
+    this.dragging = true;
+    this.element.classList?.add('dragging');
+    this.element.dataset.interaction = 'held-candidate';
+    this.facts.suppressTravel();
+    this.resting = false;
+    this.transient = null;
+    this.cancelIdleTimers();
+    this.refresh();
+  }
+  stopMove() {
+    if (!this.dragging) return;
+    this.dragging = false;
+    this.element.classList?.remove('dragging');
+    delete this.element.dataset.interaction;
+    this.refresh();
+  }
+  close() {
+    this.cancelFrame();
+    this.cancelIdleTimers();
+    this.facts.close();
+    this.livingBody?.close();
+  }
+  living() { return this.skin === 'xianxian-codex' && Boolean(this.livingBody); }
+  resolve(action) {
+    if (action === 'pending_decision' && !this.living()) return 'waiting';
+    if (action === 'peek' && !this.living()) return 'idle';
+    if (staticSkins[this.skin]) return 'idle';
+    const visual = visualAlias[action] ?? action;
+    if (this.skin !== 'xianxian-codex' && visual in additional)
+      return visual === 'sleeping' ? 'idle' : 'review';
+    return action;
+  }
+  refresh(force = false) {
+    this.element.dataset.listening = String(this.listening());
+    const selection = this.select();
+    this.base = this.baseAction();
+    const action = this.resolve(selection.action);
+    const changed = action !== this.action;
+    if (changed || force || selection.oneShot !== this.oneShot) {
+      this.oneShot = selection.oneShot;
+      this.play(action, force);
+    }
+    if (action === 'idle') this.armRest();
+    else if (action !== 'sleeping') this.cancelRest();
+  }
+  select() {
+    if (this.dragging) return { action: 'held', oneShot: false };
+    if (this.transient?.action === 'failed') return { action: 'failed', oneShot: true };
+    if (this.pendingDecision) return { action: 'pending_decision', oneShot: false };
+    const work = this.activeWorkAction();
+    if (work) return { action: work, oneShot: false };
+    if (this.transient && this.transient.action !== 'play')
+      return { action: this.transient.action, oneShot: true };
+    const delivery = this.facts.consumeDelivery();
+    if (delivery) {
+      this.transient = { action: 'delivering', resultId: delivery.resultId };
+      return { action: 'delivering', oneShot: true };
+    }
+    if (!this.reducedMotion && this.snapshot.travel) {
+      const { dx, dy } = this.snapshot.travel;
+      return { action: Math.abs(dx) >= Math.abs(dy) ? dx < 0 ? 'running-left' : 'running-right' : 'running', oneShot: false };
+    }
+    if (this.transient?.action === 'play') return { action: 'play', oneShot: true };
+    if (this.dockedEdge) return { action: 'peek', oneShot: false };
+    if (this.listening()) return { action: 'waiting', oneShot: false };
+    if (this.resting) return { action: 'sleeping', oneShot: false };
+    return { action: 'idle', oneShot: false };
+  }
+  baseAction() {
+    if (this.pendingDecision) return 'pending_decision';
+    const work = this.activeWorkAction();
+    if (work) return work;
+    if (this.dockedEdge) return 'peek';
+    if (this.listening()) return 'waiting';
+    return 'idle';
+  }
+
+  listening() { return ['talking', 'connecting'].includes(this.phase) && !this.context?.muted; }
+  activeWorkAction() {
+    if (this.snapshot.work) return workAction[this.snapshot.work.kind];
+    if (!this.hasNativeWork && this.context?.nativeActivity === 'tool_running') return 'working';
+    if (!this.hasNativeWork && this.context?.nativeActivity === 'reasoning') return 'staged_thought';
+    return null;
+  }
+  play(action, force = false) {
+    if (this.action === action && !force) return;
+    this.cancelFrame();
+    this.action = action;
+    this.frame = 0;
+    this.paint();
+    this.scheduleFrame();
+  }
+  paint() {
+    const { style, dataset } = this.element;
+    dataset.skin = this.skin;
+    dataset.action = this.action;
+    dataset.dockEdge = this.dockedEdge ?? 'none';
+    dataset.dockZone = this.dockZone ?? 'none';
+    if (this.living()) {
+      style.backgroundImage = 'none';
+      this.livingBody.show(this.action, { reducedMotion: this.reducedMotion, onEnded: () => this.completeOneShot() });
+      return;
+    }
+    this.livingBody?.hide();
+    const staticFile = staticSkins[this.skin];
+    if (staticFile) {
+      style.backgroundImage = `url("./skins/${staticFile}")`;
+      style.backgroundSize = 'contain';
+      style.backgroundPosition = 'center';
+      return;
+    }
+    const visual = visualAlias[this.action] ?? this.action;
+    const extra = this.skin === 'xianxian-codex' ? additional[visual] : undefined;
+    style.backgroundImage = `url("./skins/${extra?.file ?? `${this.skin}.webp`}")`;
+    style.backgroundSize = extra ? '960px 130px' : '960px 1170px';
+    style.backgroundPosition = `${-120 * this.frame}px ${-130 * (atlas[visual]?.row ?? 0)}px`;
+  }
+  scheduleFrame() {
+    if (this.reducedMotion) {
+      if (this.oneShot) this.frameTimer = this.setTimer(() => { this.frameTimer = undefined; this.completeOneShot(); }, 1_000);
+      return;
+    }
+    if (staticSkins[this.skin]) return;
+    if (this.living()) {
+      if (isLivingClip(this.action) || !this.oneShot) return;
+      this.frameTimer = this.setTimer(() => { this.frameTimer = undefined; this.completeOneShot(); }, 700);
+      return;
+    }
+    const visual = visualAlias[this.action] ?? this.action;
+    const frames = additional[visual]?.frames ?? atlas[visual]?.frames;
+    if (!frames) return;
+    this.frameTimer = this.setTimer(() => {
+      this.frameTimer = undefined;
+      if (this.frame + 1 === frames.length && this.oneShot) {
+        this.completeOneShot();
+        return;
+      }
+      this.frame = (this.frame + 1) % frames.length;
+      this.paint();
+      this.scheduleFrame();
+    }, frames[this.frame]);
+  }
+  cancelFrame() {
+    if (this.frameTimer !== undefined) this.clearTimer(this.frameTimer);
+    this.frameTimer = undefined;
+  }
+  completeOneShot() {
+    if (!this.oneShot) return;
+    this.oneShot = false;
+    this.transient = null;
+    this.action = '';
+    this.refresh();
+  }
+  canPlay() {
+    return !this.reducedMotion && !this.dragging && !this.pendingDecision && this.phase === 'idle'
+      && !this.activeWorkAction() && !this.snapshot.delivery && !this.snapshot.travel && !this.dockedEdge
+      && !staticSkins[this.skin];
+  }
+
+  armRest() {
+    if (this.restTimer === undefined && !this.resting && !this.pendingDecision && !this.dockedEdge) {
+      this.restTimer = this.setTimer(() => {
+        this.restTimer = undefined;
+        if (this.action === 'idle' && !this.dragging && !this.transient) {
+          this.resting = true;
+          this.refresh();
+        }
+      }, 45_000);
+    }
+    if (this.autoPlay && !this.reducedMotion && this.autoTimer === undefined) {
+      const delay = Math.max(this.autoPlayIdleMs, this.lastPlayAt + this.autoPlayCooldownMs - this.now());
+      this.autoTimer = this.setTimer(() => {
+        this.autoTimer = undefined;
+        if (!this.canPlay()) return;
+        this.lastPlayAt = this.now();
+        this.resting = false;
+        this.transient = { action: 'play', automatic: true };
+        this.refresh();
+      }, delay);
+    }
+  }
+
+  cancelRest() {
+    if (this.restTimer !== undefined) this.clearTimer(this.restTimer);
+    this.restTimer = undefined;
+  }
+
+  cancelIdleTimers() {
+    this.cancelRest();
+    if (this.autoTimer !== undefined) this.clearTimer(this.autoTimer);
+    this.autoTimer = undefined;
+  }
+
+  get snapshot() { return this.facts.snapshot; }
+}

package/renderer/recent-bubble.mjs

@@ -0,0 +1,74 @@
+/** A compact projection of Host history plus the current unsaved voice caption. */
+export class RecentBubble {
+  constructor(rows) {
+    this.rows = rows;
+    this.history = [];
+    this.live = new Map();
+  }
+  load(messages) {
+    this.history = messages.slice(-2);
+    this.render();
+  }
+  loadTranscript(rows, companionName = '猫猫') {
+    this.load(rows.map(row => ({
+      role: row.role,
+      text: row.text,
+      name: row.source?.kind === 'typed' ? '你' : row.role === 'assistant' ? companionName : '语音',
+    })));
+  }
+  append(role, text, name = role === 'user' ? '你' : '猫猫') {
+    if (!['user', 'assistant'].includes(role) || typeof text !== 'string') return;
+    const previous = this.live.get(role);
+    this.live.set(role, { name, text: `${previous?.text ?? ''}${text}`.slice(-240) });
+    this.render();
+  }
+  finish(role) {
+    this.live.delete(role);
+    this.render();
+  }
+  reset() {
+    this.live.clear();
+    this.render();
+  }
+  clear() {
+    this.history = [];
+    this.live.clear();
+    this.render();
+  }
+  hasContent() {
+    return this.history.length > 0 || this.live.size > 0;
+  }
+  render() {
+    const live = [...this.live].map(([role, value]) => ({ role, ...value }));
+    const entries = [...this.history.slice(-Math.max(0, 2 - live.length)), ...live].slice(-2);
+    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 message = entry ? String(entry.text).slice(-120) : '';
+      row.textContent = `${speaker}${message}`;
+      if (entry && row.ownerDocument?.createElement && typeof row.replaceChildren === 'function') {
+        const speakerNode = row.ownerDocument.createElement('span');
+        const messageNode = row.ownerDocument.createElement('span');
+        const messageText = row.ownerDocument.createElement('bdi');
+        speakerNode.className = 'recent-speaker';
+        messageNode.className = 'recent-message';
+        messageText.className = 'recent-message-text';
+        messageText.dir = 'auto';
+        speakerNode.textContent = speaker;
+        // dir=auto resolves the first strong character. Reversing code points for
+        // this hidden-in-the-same-tick probe therefore resolves the latest strong
+        // character, which is the edge this compact tail projection must retain.
+        messageText.textContent = Array.from(message).reverse().join('');
+        messageNode.append(messageText);
+        row.replaceChildren(speakerNode, messageNode);
+        const direction = row.ownerDocument.defaultView?.getComputedStyle(messageText).direction;
+        messageText.dir = direction === 'rtl' ? 'rtl' : 'ltr';
+        messageText.textContent = message;
+        messageNode.dataset.direction = direction === 'rtl' ? 'rtl' : 'ltr';
+      }
+      row.dataset ??= {};
+      row.dataset.role = entry?.role ?? '';
+    }
+  }
+}

package/renderer/settings-controller.mjs

@@ -0,0 +1,171 @@
+const sameValue = (left, right) => Object.is(left, right);
+const canStopCall = field => ['dutyCatProfileId', 'householdReadsAllowed'].includes(field);
+
+/**
+ * Renderer-side settings state only. The Host remains the single source of
+ * persisted values, roster truth, media stopping and plugin lifecycle.
+ */
+export class SettingsController {
+  constructor({ client, changed = () => {} }) {
+    this.client = client;
+    this.changed = changed;
+    this.readOperation = 0;
+    this.writeOperation = 0;
+    this.state = { phase: 'idle', page: 'main', saving: false, notice: null, confirmation: null, retry: null };
+  }
+
+  publish(patch = {}) {
+    this.state = { ...this.state, ...patch };
+    this.changed(this.state);
+  }
+
+  applySettings(reply, patch = {}) {
+    if (reply?.kind !== 'settings' || reply.status !== 'available') return false;
+    this.publish({
+      phase: this.state.saving ? 'saving' : 'ready',
+      values: reply.values,
+      companions: reply.companions,
+      selectedCompanionStatus: reply.selectedCompanionStatus,
+      ...patch,
+    });
+    return true;
+  }
+
+  async load({ preserveSettlement = false } = {}) {
+    // A panel reopen is presentation work, not authority to cancel an in-flight
+    // write. The write performs its own canonical readback before settlement.
+    if (this.state.saving) return false;
+    const operation = ++this.readOperation;
+    this.publish({ phase: 'loading', ...(preserveSettlement ? {} : { notice: null, retry: null }) });
+    try {
+      const reply = await this.client.readSettings();
+      if (operation !== this.readOperation) return false;
+      const clearsUnknown = preserveSettlement && this.state.notice?.kind === 'unconfirmed';
+      if (this.applySettings(reply, clearsUnknown ? { notice: null, retry: null } : {})) return true;
+      this.publish({ phase: 'unavailable', reason: reply.reason, saving: false });
+    } catch (error) {
+      if (operation !== this.readOperation) return false;
+      this.publish({ phase: 'unavailable', saving: false,
+        reason: error?.code === 'invalid_request' ? 'host_upgrade_required' : 'temporarily_unavailable' });
+    }
+    return false;
+  }
+
+  navigate(page) {
+    this.publish({ page, confirmation: null });
+  }
+
+  async requestUpdate(field, value, { confirm = false } = {}) {
+    if (this.state.saving || sameValue(this.state.values?.[field], value)) return false;
+    if (confirm) {
+      this.publish({ page: 'confirm',
+        confirmation: { kind: 'setting', field, value, returnPage: this.state.page },
+        notice: null, retry: null });
+      return true;
+    }
+    await this.commitUpdate(field, value, this.state.page);
+    return true;
+  }
+
+  async readCanonical(operation) {
+    try {
+      const reply = await this.client.readSettings();
+      if (operation !== this.writeOperation || reply?.kind !== 'settings' || reply.status !== 'available') return null;
+      return reply;
+    } catch { return null; }
+  }
+
+  async commitUpdate(field, value, returnPage = this.state.page) {
+    if (this.state.saving) return { callStopped: null };
+    const operation = ++this.writeOperation;
+    this.publish({ phase: 'saving', saving: true, notice: null, retry: null });
+    let receipt;
+    try {
+      receipt = await this.client.updateSetting(field, value);
+    } catch {
+      if (operation !== this.writeOperation) return { callStopped: null };
+      const canonical = await this.readCanonical(operation);
+      if (operation !== this.writeOperation) return { callStopped: null };
+      if (canonical) this.applySettings(canonical);
+      const saved = canonical && sameValue(canonical.values[field], value);
+      const callStopped = canStopCall(field) ? null : false;
+      this.publish({ phase: canonical ? 'ready' : this.state.values ? 'ready' : 'unavailable', saving: false,
+        page: returnPage, confirmation: null,
+        retry: canonical && !saved ? { field, value } : null,
+        notice: canonical
+          ? { kind: saved ? 'reconciled_saved' : 'reconciled_not_saved', field, callStopped }
+          : { kind: 'unconfirmed', field, callStopped } });
+      return { callStopped };
+    }
+    if (operation !== this.writeOperation) return { callStopped: null };
+    const canonical = await this.readCanonical(operation);
+    if (operation !== this.writeOperation) return { callStopped: null };
+    if (canonical) this.applySettings(canonical);
+    const callStopped = receipt.callStatus === 'stopped';
+    let notice;
+    if (receipt.outcome === 'saved') {
+      notice = { kind: 'saved', field, callStopped, applies: receipt.applies };
+    } else if (receipt.outcome === 'rejected') {
+      notice = { kind: 'rejected', field, callStopped, reason: receipt.reason };
+    } else if (!canonical) {
+      notice = { kind: 'unconfirmed', field, callStopped };
+    } else {
+      notice = {
+        kind: sameValue(canonical.values[field], value) ? 'reconciled_saved' : 'reconciled_not_saved',
+        field,
+        callStopped,
+      };
+    }
+    const retry = (receipt.outcome === 'rejected' && ['save_failed', 'call_stop_failed'].includes(receipt.reason))
+      || (receipt.outcome === 'unconfirmed' && canonical && !sameValue(canonical.values[field], value))
+      ? { field, value } : null;
+    this.publish({ phase: canonical ? 'ready' : this.state.values ? 'ready' : 'unavailable', saving: false,
+      page: returnPage, confirmation: null, notice, retry });
+    return { callStopped };
+  }
+
+  async confirm() {
+    const confirmation = this.state.confirmation;
+    if (!confirmation || this.state.saving) return { callStopped: null };
+    if (confirmation.kind === 'setting') {
+      return this.commitUpdate(confirmation.field, confirmation.value, confirmation.returnPage);
+    }
+    const operation = ++this.writeOperation;
+    this.publish({ phase: 'saving', saving: true, notice: null });
+    try {
+      await this.client.disableCompanion();
+      if (operation !== this.writeOperation) return { callStopped: null };
+      this.publish({ phase: 'disabled', saving: false, confirmation: null });
+      return { callStopped: true };
+    } catch {
+      if (operation !== this.writeOperation) return { callStopped: null };
+      this.publish({ phase: this.state.values ? 'ready' : 'unavailable', saving: false,
+        page: confirmation.returnPage, confirmation: null, notice: { kind: 'disable_failed' } });
+      return { callStopped: null };
+    }
+  }
+
+  requestDisable() {
+    if (this.state.saving) return;
+    this.publish({ page: 'disable', confirmation: { kind: 'disable', returnPage: this.state.page }, notice: null });
+  }
+
+  async retry({ confirm = false } = {}) {
+    const retry = this.state.retry;
+    if (!retry || this.state.saving) return;
+    if (confirm && canStopCall(retry.field)) {
+      this.publish({ page: 'confirm',
+        confirmation: { kind: 'setting', field: retry.field, value: retry.value, returnPage: this.state.page } });
+      return;
+    }
+    await this.commitUpdate(retry.field, retry.value, this.state.page);
+  }
+
+  async resetPosition() {
+    if (this.state.saving) return;
+    try {
+      await this.client.resetPosition();
+      this.publish({ notice: { kind: 'position_reset' } });
+    } catch { this.publish({ notice: { kind: 'position_reset_failed' } }); }
+  }
+}