synabun 2.0.10 → 2.2.0

package/neural-interface/public/shared/ui-scroll-follow.js

@@ -129,24 +129,34 @@ export function createStickyScrollController(container, options = {}) {
 
   const ResizeObserverCtor = view.ResizeObserver || globalThis.ResizeObserver;
   const MutationObserverCtor = view.MutationObserver || globalThis.MutationObserver;
-  const observedChildren = new WeakSet();
+  // ResizeObserver retains its targets, even after they leave the transcript.
+  // Keep only current rows: OpenCode replaces a row on every streaming update.
+  const observedChildren = new Set();
   const resizeObserver = ResizeObserverCtor
     ? new ResizeObserverCtor(() => scrollToBottom())
     : null;
   const observeChildren = () => {
     if (!resizeObserver) return;
-    resizeObserver.observe(container);
-    for (const child of container.children) {
+    const current = new Set(container.children);
+    for (const child of observedChildren) {
+      if (current.has(child)) continue;
+      resizeObserver.unobserve(child);
+      observedChildren.delete(child);
+    }
+    for (const child of current) {
       if (observedChildren.has(child)) continue;
       observedChildren.add(child);
       resizeObserver.observe(child);
     }
   };
+  resizeObserver?.observe(container);
   observeChildren();
 
   const mutationObserver = MutationObserverCtor
-    ? new MutationObserverCtor(() => {
-      observeChildren();
+    ? new MutationObserverCtor((records) => {
+      if (disposed) return;
+      // Nested text/class changes need scrolling, but cannot change row ownership.
+      if (records.some(record => record.type === 'childList' && record.target === container)) observeChildren();
       scrollToBottom();
     })
     : null;
@@ -173,6 +183,7 @@ export function createStickyScrollController(container, options = {}) {
       disposed = true;
       cancelScheduled();
       resizeObserver?.disconnect();
+      observedChildren.clear();
       mutationObserver?.disconnect();
       container.removeEventListener('scroll', onScroll);
       container.removeEventListener('wheel', onWheel);

package/neural-interface/public/shared/ui-sessions.js

@@ -16,7 +16,10 @@ import { getProviderMeta } from './provider-icons.js';
 import { sendToPanel as sendToClaudePanel, isClaudePanelOpen } from './ui-claude-panel.js';
 import { toggleCodexPanel, isCodexPanelOpen } from './cdx/cdx-panel.js';
 import { openOpencodeWithPrompt } from './ui-opencode-panel-v2.js';
+import { openAntigravityWithPrompt } from './ui-antigravity-panel.js';
+import { dropdownHTML, wireDropdowns } from './cc-dropdown.js';
 import { fetchRulesStatus, installAllRules, ackRulesNotice } from './api.js';
+import { centeredInFrame } from './app-frame.js';
 
 // ── State ──
 let ws = null;
@@ -33,7 +36,8 @@ let isVisible = false;
 let _stalledTickerTimer = null;
 
 // ── Pending-Remember picker state ──
-const PROVIDER_LABELS = { claude: 'Claude Code', codex: 'Codex', opencode: 'OpenCode' };
+const PROVIDER_LABELS = { claude: 'Claude Code', codex: 'Codex', opencode: 'OpenCode', antigravity: 'Antigravity' };
+const PR_PROVIDERS = Object.keys(PROVIDER_LABELS);
 let _prPicker = { open: false, provider: 'claude', model: '', modelsByProvider: {}, loading: null };
 
 // ── Notifications state ──
@@ -44,7 +48,7 @@ const RULES_HOSTS = {
   claude:   { label: 'Claude Code', provider: 'claude-code', section: 'setup-claude' },
   codex:    { label: 'Codex',       provider: 'codex',       section: 'setup-codex' },
   opencode: { label: 'OpenCode',    provider: 'opencode',    section: 'setup-opencode' },
-  gemini:   { label: 'Gemini',      provider: 'gemini',      section: 'setup-gemini' },
+  antigravity: { label: 'Antigravity', provider: 'antigravity', section: 'setup-antigravity' },
 };
 // The host states that need the user: each one opens Settings > Setup.
 const RULES_ATTENTION = { outdated: 'Update available', modified: 'Edited copy', conflict: 'Needs repair' };
@@ -975,20 +979,18 @@ function renderPendingRememberPicker() {
   const models = _prPicker.modelsByProvider[provider] || [];
   const loading = _prPicker.loading === provider;
 
-  const providerBtns = ['claude', 'codex', 'opencode'].map(p => `
+  const providerBtns = PR_PROVIDERS.map(p => `
     <button class="sm-btn sm-pr-prov${p === provider ? ' active' : ''}" data-pr-provider="${p}">
       ${esc(PROVIDER_LABELS[p])}
     </button>
   `).join('');
 
-  let modelOptions = '<option value="">— select model —</option>';
-  if (loading) modelOptions = '<option value="">Loading…</option>';
-  else if (models.length === 0) modelOptions = '<option value="">No models found</option>';
-  else {
-    modelOptions += models.map(m =>
-      `<option value="${esc(m.id)}"${m.id === _prPicker.model ? ' selected' : ''}>${esc(m.label || m.id)}</option>`
-    ).join('');
-  }
+  // The app's styled dropdown (cc-dropdown.js), wired once on the drawer's body (openPanel).
+  let modelEntries = [{ value: '', label: '— select model —', selected: !_prPicker.model }];
+  if (loading) modelEntries = [{ value: '', label: 'Loading…', selected: true }];
+  else if (models.length === 0) modelEntries = [{ value: '', label: 'No models found', selected: true }];
+  else modelEntries = modelEntries.concat(models.map(m => ({ value: m.id, label: m.label || m.id, selected: m.id === _prPicker.model })));
+  const modelPicker = dropdownHTML('sm-pr-model', modelEntries, { label: 'Model', classes: 'sm-pr-dropdown', disabled: loading || models.length === 0 });
 
   return `<div class="sm-cleanup-bar sm-pr-picker">
     <div class="sm-pr-row">
@@ -997,7 +999,7 @@ function renderPendingRememberPicker() {
     </div>
     <div class="sm-pr-row">
       <span class="sm-pr-label">Model</span>
-      <select id="sm-pr-model" class="sm-pr-select"${loading || models.length === 0 ? ' disabled' : ''}>${modelOptions}</select>
+      ${modelPicker}
     </div>
     <div class="sm-pr-row sm-pr-actions">
       <button class="sm-btn" id="sm-pr-cancel">Cancel</button>
@@ -1032,6 +1034,10 @@ async function loadProviderModels(provider) {
         }
       }
       models = flat;
+    } else if (provider === 'antigravity') {
+      // What an Antigravity session offers (lib/antigravity/catalog.js: one row per model, its thinking levels apart).
+      const r = await fetch('/api/antigravity/models').then(r => r.json()).catch(() => null);
+      models = (Array.isArray(r?.models) ? r.models : []).filter(m => m && m.id).map(m => ({ id: String(m.id), label: String(m.label || m.id) }));
     } else if (provider === 'codex') {
       // Codex models come from the running CLI (WebSocket). Provide a sensible static list.
       models = [
@@ -1100,6 +1106,9 @@ async function runPendingRemembers() {
     } else if (provider === 'opencode') {
       try { localStorage.setItem('ocp:lastModel', model); } catch {}
       await openOpencodeWithPrompt(res.prompt, { autoSend: true });
+    } else if (provider === 'antigravity') {
+      // A tab of its own, on the chosen model when its session offers it, sent at once.
+      await openAntigravityWithPrompt(res.prompt, { newTab: true, send: true, model });
     } else if (provider === 'codex') {
       try { localStorage.setItem('cxp:model', model); } catch {}
       if (!isCodexPanelOpen()) await toggleCodexPanel();
@@ -1171,9 +1180,10 @@ function openPanel() {
   _panel.innerHTML = buildPanelHTML();
   document.body.appendChild(_panel);
 
-  // Center at default size
-  _panel.style.left = Math.max(20, (window.innerWidth - 680) / 2) + 'px';
-  _panel.style.top = Math.max(48, (window.innerHeight - 520) / 2) + 'px';
+  // Center at default size, in the app frame
+  const at = centeredInFrame(680, 520);
+  _panel.style.left = at.left + 'px';
+  _panel.style.top = at.top + 'px';
 
   wirePanel();
   isVisible = true;
@@ -1185,6 +1195,8 @@ function openPanel() {
   // ESC key to close (removed with the panel, however it closes)
   _panelLife?.abort();
   _panelLife = new AbortController();
+  // The styled dropdowns of whatever the body draws (the Pending-Remember model picker), once for the panel's life.
+  wireDropdowns(_panel.querySelector('#sm-body'), { signal: _panelLife.signal });
   const onEsc = (e) => {
     if (e.key === 'Escape' && _panel) closePanel();
   };