mixdog 0.9.151 → 0.9.152

package/src/standalone/session-service.mjs

@@ -97,6 +97,7 @@ export function createSessionService({
   createSessionRuntime = null,
   sessionExists = null,
   readStoredSession = null,
+  subscribeExternalSessionStates = null,
   listSessions = null,
   getRemoteSessionState = null,
   desktopRuntime = null,
@@ -138,7 +139,7 @@ export function createSessionService({
   // destroying anything, this sweep is the ONLY reclaim path besides shutdown.
   const IDLE_EVICT_MS = Number(idleEvictMs) > 0
     ? Number(idleEvictMs)
-    : Math.max(60_000, Number(process.env.MIXDOG_SESSION_IDLE_EVICT_MS) || 2 * 60_000);
+    : Math.max(60_000, Number(process.env.MIXDOG_SESSION_IDLE_EVICT_MS) || 5 * 60_000);
   const EVICT_SWEEP_MS = Number(evictSweepMs) > 0 ? Number(evictSweepMs) : 30_000;
   let evictTimer = null;
 
@@ -170,6 +171,7 @@ export function createSessionService({
   // the entry the moment one materializes, so its live frames start flowing
   // without a second subscribe round-trip.
   const pendingViewers = new Map(); // sessionId -> Set<clientToken>
+  const externalViewEntries = new Map(); // sessionId -> ordinary projected entry
 
   function trackPendingViewer(sessionId, ctx) {
     const token = subscriberToken(ctx);
@@ -216,6 +218,10 @@ export function createSessionService({
       startEvictionSweep();
       log(`session ${currentSessionId(entry) || '(creating)'} unwatched (client ${token} gone) — retained`);
     }
+    for (const [sessionId, entry] of [...externalViewEntries]) {
+      entry.subscribers?.delete(token);
+      if ((entry.subscribers?.size || 0) === 0) externalViewEntries.delete(sessionId);
+    }
     for (const service of desktopServicesById.values()) {
       service.subscribers.delete(token);
     }
@@ -428,11 +434,22 @@ export function createSessionService({
       if (entry) entry.indexedSessionId = '';
       return '';
     }
+    // External agent projections use the same frame machinery but are not a
+    // daemon execution owner. Keeping them out of sessionsById lets a later
+    // ordinary session materialization adopt the viewers and take authority.
+    if (entry.externalView === true) return nextId;
     const existing = sessionsById.get(nextId);
     if (existing && existing !== entry && !existing.disposed) {
       // Do not redirect an established address to a second session runtime. The load
       throw new Error(`duplicate session address: ${nextId}`);
     }
+    const external = externalViewEntries.get(nextId);
+    if (external) {
+      externalViewEntries.delete(nextId);
+      for (const token of external.subscribers || []) {
+        addSubscriber(entry, { clientToken: token });
+      }
+    }
     sessionsById.set(nextId, entry);
     entry.indexedSessionId = nextId;
     return nextId;
@@ -460,6 +477,54 @@ export function createSessionService({
     }, entry.subscribers);
   }
 
+  function externalEntryForView(sessionId) {
+    return externalViewEntries.get(String(sessionId || '')) || null;
+  }
+
+  function publishExternalSessionState(update) {
+    const sessionId = String(update?.sessionId || '');
+    const snapshot = update?.snapshot;
+    if (!sessionId || !snapshot || typeof snapshot !== 'object') return;
+    // A daemon-owned runtime is the canonical owner if this address was
+    // materialized. External agent projection frames can arrive one tick late
+    // after that promotion and must not overwrite it.
+    if (sessionOwner(sessionId)) return;
+    let entry = externalViewEntries.get(sessionId);
+    if (!entry) {
+      if (!pendingViewers.has(sessionId)) return;
+      let state = { ...snapshot, sessionId };
+      const runtime = {
+        isWireSafe: true,
+        getState: () => state,
+        setState: (next) => { state = next; },
+      };
+      entry = {
+        runtime,
+        subscribers: new Set(),
+        disposed: false,
+        timer: null,
+        lastPublishedAt: 0,
+        publishedSessionId: '',
+        indexedSessionId: '',
+        addressedSessionId: sessionId,
+        revision: revisionEpoch,
+        busy: null,
+        externalView: true,
+      };
+      externalViewEntries.set(sessionId, entry);
+      adoptPendingViewers(entry, sessionId);
+    } else {
+      entry.runtime.setState({ ...snapshot, sessionId });
+    }
+    const step = advance(entry);
+    if (step.changed) publishStep(entry, step);
+  }
+
+  const unsubscribeExternalSessionStates =
+    typeof subscribeExternalSessionStates === 'function'
+      ? subscribeExternalSessionStates(publishExternalSessionState)
+      : () => {};
+
   /** Response body for the CALLER, which announced the revision it holds. */
   function bodyForClient(step, baseRevision) {
     if (!step.changed && baseRevision === step.revision) return { revision: step.revision };
@@ -911,7 +976,7 @@ export function createSessionService({
     }
     const id = String(sessionId || '');
     if (!id) throw new TypeError('sessionId is required');
-    const live = await liveEntryForView(id);
+    const live = await liveEntryForView(id) || externalEntryForView(id);
     if (live) {
       const step = advance(live);
       retainUnwatched(live, 'headless session read');
@@ -922,7 +987,7 @@ export function createSessionService({
     }
     if (typeof readStoredSession === 'function') {
       const projection = await storedSessionProjection(id, openHints);
-      const lateOwner = sessionOwner(id);
+      const lateOwner = sessionOwner(id) || externalEntryForView(id);
       if (lateOwner) {
         const step = advance(lateOwner);
         retainUnwatched(lateOwner, 'headless session read');
@@ -952,7 +1017,7 @@ export function createSessionService({
   ) {
     const id = String(sessionId || '');
     if (!id) throw new TypeError('sessionId is required');
-    const live = await liveEntryForView(id);
+    const live = await liveEntryForView(id) || externalEntryForView(id);
     if (live) {
       addSubscriber(live, ctx);
       const step = advance(live);
@@ -964,7 +1029,7 @@ export function createSessionService({
       // guarantees either adoption or the live re-check below.
       trackPendingViewer(id, ctx);
       const projection = await storedSessionProjection(id, openHints);
-      const lateOwner = sessionOwner(id);
+      const lateOwner = sessionOwner(id) || externalEntryForView(id);
       if (lateOwner) {
         dropPendingViewer(id, ctx);
         addSubscriber(lateOwner, ctx);
@@ -988,7 +1053,15 @@ export function createSessionService({
     if (!id) throw new TypeError('sessionId is required');
     dropPendingViewer(id, ctx);
     const owner = sessionOwner(id);
-    if (!owner) return { sessionId: id, unsubscribed: true };
+    if (!owner) {
+      const external = externalEntryForView(id);
+      if (external) {
+        const token = subscriberToken(ctx);
+        if (token) external.subscribers?.delete(token);
+        if ((external.subscribers?.size || 0) === 0) externalViewEntries.delete(id);
+      }
+      return { sessionId: id, unsubscribed: true };
+    }
     const entry = owner;
     const token = subscriberToken(ctx);
     if (token) entry.subscribers?.delete(token);
@@ -1280,6 +1353,8 @@ export function createSessionService({
 
   async function stop(reason = 'service stop') {
     closed = true;
+    try { unsubscribeExternalSessionStates(); } catch {}
+    externalViewEntries.clear();
     if (evictTimer) { clearInterval(evictTimer); evictTimer = null; }
     const services = [...new Set(desktopServicesById.values())];
     desktopServicesById.clear();

package/src/tui/app/app-view.jsx

@@ -301,6 +301,7 @@ export function renderAppView(ctx) {
                 indexMode={picker.indexMode}
                 visibleCount={pickerVisibleRows}
                 fillHeight={expandedOptionPanel}
+                loading={picker.loading === true}
                 themeEpoch={state.themeEpoch || 0}
                 confirmBar={picker.confirmBar}
               />

package/src/tui/app/core-memory-picker.mjs

@@ -39,6 +39,7 @@ export function createCoreMemoryPicker({
       // Loading state lives in the header description row, not as a fake
       // selectable menu item.
       description: 'Loading memories…',
+      loading: true,
       items: [],
       onSelect: () => {},
       onCancel: closeMemoryCorePicker,
@@ -113,6 +114,7 @@ export function createCoreMemoryPicker({
     paintPanel({
       title: 'Memory · List',
       description: 'Loading memories…',
+      loading: true,
       items: [],
       onSelect: () => {},
       onCancel: () => openMemoryCorePicker(),

package/src/tui/app/extension-pickers.mjs

@@ -121,7 +121,7 @@ export function createExtensionPickers({
   };
 
   const openMcpPicker = () => {
-    openMcpServersPicker();
+    return openMcpServersPicker();
   };
 
   const skillsStatus = async () => {

package/src/tui/app/maintenance-pickers.mjs

@@ -158,7 +158,7 @@ export function createMaintenancePickers({
     // binds it to the previous owner's epoch, which the open transition (a
     // panel identity change) supersedes — leaving "Latest version" stuck on
     // "checking…". Esc after the paint still closes the panel for good.
-    void Promise.resolve(render({ checking: true }))
+    return Promise.resolve(render({ checking: true }))
       .catch((e) => {
         store.pushNotice(`update panel failed: ${e?.message || e}`, 'error');
         return false;
@@ -308,8 +308,8 @@ export function createMaintenancePickers({
     setSettingsPrompt(null);
     own.context(null);
     closeUsagePanel();
-    if (options.advanced === true) renderAdvanced();
-    else render();
+    return Promise.resolve(options.advanced === true ? renderAdvanced() : render())
+      .catch((e) => store.pushNotice(`auto-clear panel failed: ${e?.message || e}`, 'error'));
   };
 
   const openProfilePicker = async (options = {}) => {

package/src/tui/app/model-options.mjs

@@ -166,6 +166,7 @@ export const providerDisplayName = (provider) => {
   if (key === 'xai' || key === 'xai-api') return 'xAI API';
   if (key === 'deepseek' || key === 'deepseek-api') return 'DeepSeek API';
   if (key === 'opencode-go') return 'OpenCode Go API';
+  if (key === 'openrouter') return 'OpenRouter';
   if (key === 'ollama') return 'Ollama';
   if (key === 'lmstudio') return 'LM Studio';
   if (key === 'default') return 'Default';
@@ -182,6 +183,7 @@ export const providerDisplayRank = (provider) => {
     'antigravity-oauth': 31,
     'cursor-oauth': 32,
     'opencode-go': 35,
+    openrouter: 36,
     openai: 40,
     'openai-api': 40,
     anthropic: 50,

package/src/tui/app/model-picker.mjs

@@ -59,6 +59,9 @@ export function createModelPicker({
     const returnTo = typeof options.returnTo === 'function' ? options.returnTo : null;
     const returnLabel = String(options.returnLabel || 'Agents');
     const returnOnNestedCancel = options.returnOnNestedCancel === true;
+    const handoffPanel = options.handoffPanel && typeof options.handoffPanel === 'object'
+      ? options.handoffPanel
+      : null;
     const cancelModelPicker = () => {
       modelPickerClosed = true;
       if (returnTo) returnTo();
@@ -77,6 +80,7 @@ export function createModelPicker({
         title: options.title || 'Model',
         description: options.loadingDescription || 'Loading models...',
         help: returnTo ? `↑/↓ Select · Enter Open · Esc ${returnLabel}` : '↑/↓ Select · Enter Open · Esc Back',
+        loading: true,
         items: [],
         onCancel: cancelModelPicker,
       });
@@ -382,7 +386,7 @@ export function createModelPicker({
             if (typeof options.onImmediateSelect === 'function') {
               options.onImmediateSelect(routeInput, selected, effort);
             } else {
-              own.paint(null);
+              own.paint(handoffPanel);
             }
             // Post-ack delegation (return to the caller's panel), bound to the
             // claim AFTER this keypress's own navigation: an Esc between the
@@ -397,10 +401,13 @@ export function createModelPicker({
                 afterSelect();
                 return result;
               })
-              .catch((e) => store.pushNotice(`Couldn’t save model: ${e?.message || e}`, 'error'));
+              .catch((e) => {
+                store.pushNotice(`Couldn’t save model: ${e?.message || e}`, 'error');
+                if (handoffPanel) afterSelect();
+              });
             return;
           }
-          own.paint(null);
+          own.paint(handoffPanel);
           const afterSelect = own.defer(() => {
             if (typeof options.onAfterSelect === 'function') options.onAfterSelect();
           });
@@ -415,7 +422,10 @@ export function createModelPicker({
               );
               if (ok) afterSelect();
             })
-            .catch((e) => store.pushNotice(`Couldn’t switch model: ${e?.message || e}`, 'error'));
+            .catch((e) => {
+              store.pushNotice(`Couldn’t switch model: ${e?.message || e}`, 'error');
+              if (handoffPanel) afterSelect();
+            });
         };
         const renderProviderModels = () => {
           const providerModelItems = buildProviderModelItems(models, provider, activeRoute);

package/src/tui/app/panel-handoff.test.mjs

@@ -0,0 +1,311 @@
+import assert from 'node:assert/strict';
+import test from 'node:test';
+
+import { createModelPicker } from './model-picker.mjs';
+import { shouldSupersedePanelEpoch, supersedePanelEpoch } from './panel-epoch.mjs';
+import { createPanelSurface } from './panel-surface.mjs';
+import { createRoutePickers } from './route-pickers.mjs';
+import { createSettingsPicker } from './settings-picker.mjs';
+import { createSlashDispatch } from './slash-dispatch.mjs';
+import { createThemeEffortPickers } from './theme-effort-pickers.mjs';
+
+function deferred() {
+  let resolve;
+  let reject;
+  const promise = new Promise((res, rej) => { resolve = res; reject = rej; });
+  return { promise, resolve, reject };
+}
+
+const flush = async () => {
+  await new Promise((resolve) => setTimeout(resolve, 0));
+  await new Promise((resolve) => setImmediate(resolve));
+};
+
+function createPanelHost() {
+  let current = null;
+  const painted = [];
+  const setPicker = (next) => {
+    const previous = current;
+    current = typeof next === 'function' ? next(previous) : next;
+    if (shouldSupersedePanelEpoch(previous, current)) supersedePanelEpoch();
+    painted.push(current);
+  };
+  const surface = createPanelSurface({
+    setPicker,
+    setContextPanel: () => {},
+    setUsagePanel: () => {},
+  });
+  return { current: () => current, painted, setPicker, surface };
+}
+
+const HANDOFF = {
+  title: 'Settings',
+  description: 'Applying selection...',
+  help: 'Esc Close',
+  indexMode: 'never',
+  pickerKey: 'settings-handoff',
+  loading: true,
+  items: [],
+};
+
+function settingsDeps(host, store, opened = {}) {
+  const noop = () => {};
+  return {
+    store: { pushNotice: noop, ...store },
+    state: { model: 'gpt-5', provider: 'openai', workflow: { id: 'default' } },
+    surface: host.surface,
+    setProviderPrompt: noop,
+    setSettingsPrompt: noop,
+    settingsHeavyCacheRef: { current: null },
+    settingsRequestRef: { current: 0 },
+    formatDuration: (ms) => `${ms}ms`,
+    displayModelName: () => 'GPT-5',
+    routeModelLabel: () => '(unset)',
+    workflowDisplayName: () => 'Default',
+    workflowSwitchNotice: () => 'workflow switched',
+    themeNotice: () => 'theme set',
+    openModelPicker: (options) => { opened.model = options; },
+    openWebSearchPicker: noop,
+    openAgentsPicker: noop,
+    openWorkflowPicker: (options) => { opened.workflow = options; },
+    openOutputStylePicker: (options) => { opened.outputStyle = options; },
+    openProviderSetupPicker: noop,
+    openThemePicker: (options) => { opened.theme = options; },
+    openAutoClearPicker: noop,
+    openProfilePicker: noop,
+    openMcpPicker: noop,
+    openPluginsPicker: noop,
+    openHooksPicker: noop,
+    openSkillsPicker: noop,
+    openMemoryCorePicker: noop,
+    openUpdatePicker: noop,
+  };
+}
+
+test('Settings paints its loading destination before the daemon snapshot settles', async () => {
+  supersedePanelEpoch();
+  const host = createPanelHost();
+  host.setPicker({ title: 'Theme' });
+  const snapshotGate = deferred();
+  const opened = {};
+  const { openSettingsPicker } = createSettingsPicker(settingsDeps(
+    host,
+    { getSettingsSnapshot: () => snapshotGate.promise },
+    opened,
+  ));
+
+  const opening = openSettingsPicker();
+  assert.equal(host.current()?.title, 'Settings');
+  assert.match(host.current()?.description || '', /Loading settings/i);
+  assert.notEqual(host.current(), null);
+
+  snapshotGate.resolve({});
+  await opening;
+  const settings = host.current();
+  assert.equal(settings?.title, 'Settings');
+  assert.ok(settings.items.length > 0);
+
+  for (const action of ['model', 'workflow', 'output-style', 'theme']) {
+    const item = settings.items.find((entry) => entry._action === action);
+    settings.onSelect(item.value, item);
+  }
+  for (const options of [opened.model, opened.workflow, opened.outputStyle, opened.theme]) {
+    assert.equal(options?.handoffPanel?.title, 'Settings');
+    assert.equal(options?.handoffPanel?.pickerKey, 'settings-handoff');
+    assert.equal(options?.handoffPanel?.loading, true);
+  }
+});
+
+test('Model save keeps a Settings handoff panel visible until the write settles', async () => {
+  supersedePanelEpoch();
+  const host = createPanelHost();
+  const saveGate = deferred();
+  const { openModelPicker } = createModelPicker({
+    store: {
+      pushNotice: () => {},
+      listProviderModels: async () => [],
+      setRoute: () => saveGate.promise,
+    },
+    getState: () => ({ provider: 'openai', model: 'gpt-5', effort: null, fast: false }),
+    surface: host.surface,
+    setProviderPrompt: () => {},
+    setSettingsPrompt: () => {},
+    providerModelsCacheRef: {
+      current: {
+        at: Date.now(),
+        models: [{ provider: 'openai', id: 'gpt-5', display: 'GPT-5' }],
+      },
+    },
+    webSearchModelsCacheRef: { current: { models: [], at: 0 } },
+    modelPickerRequestRef: { current: 0 },
+    clearModelCaches: () => {},
+    modelSwitchNotice: () => 'switched',
+    openProviderSetupPicker: () => {},
+  });
+
+  await openModelPicker({
+    handoffPanel: HANDOFF,
+    onAfterSelect: () => host.setPicker({ title: 'Settings', items: [{ value: 'done' }] }),
+  });
+  const providers = host.current();
+  providers.onSelect(providers.items[0].value, providers.items[0]);
+  const models = host.current();
+  models.onSelect(models.items[0].value, models.items[0]);
+
+  assert.equal(host.current(), HANDOFF);
+  assert.equal(host.painted.at(-1), HANDOFF);
+
+  saveGate.resolve(true);
+  await flush();
+  assert.equal(host.current()?.title, 'Settings');
+  assert.notEqual(host.current(), HANDOFF);
+});
+
+function routePicker(host, store) {
+  return createRoutePickers({
+    store: { pushNotice: () => {}, ...store },
+    state: {},
+    surface: host.surface,
+    setProviderPrompt: () => {},
+    setSettingsPrompt: () => {},
+    closeUsagePanel: () => {},
+    clean: (value) => value,
+    routeLabel: () => 'route',
+    agentModelParts: () => [],
+    agentModelProfile: () => 'profile',
+    workflowSwitchNotice: () => 'workflow switched',
+    openModelPicker: () => {},
+  });
+}
+
+test('Workflow and output-style saves keep the Settings handoff visible until their writes settle', async () => {
+  supersedePanelEpoch();
+  const workflowHost = createPanelHost();
+  const workflowGate = deferred();
+  const workflow = routePicker(workflowHost, {
+    listWorkflows: async () => [{ id: 'solo', name: 'Solo', active: true }],
+    setWorkflow: () => workflowGate.promise,
+  });
+  await workflow.openWorkflowPicker({
+    returnTo: () => workflowHost.setPicker({ title: 'Settings', items: [{ value: 'done' }] }),
+    handoffPanel: HANDOFF,
+  });
+  const workflowPanel = workflowHost.current();
+  workflowPanel.onSelect(workflowPanel.items[0].value, workflowPanel.items[0]);
+  assert.equal(workflowHost.current(), HANDOFF);
+
+  workflowGate.resolve({ id: 'solo' });
+  await flush();
+  assert.equal(workflowHost.current()?.title, 'Settings');
+
+  const styleHost = createPanelHost();
+  const styleGate = deferred();
+  const outputStyle = routePicker(styleHost, {
+    listOutputStyles: async () => ({
+      current: { id: 'simple' },
+      styles: [{ id: 'simple', label: 'Simple' }],
+    }),
+    setOutputStyle: () => styleGate.promise,
+  });
+  await outputStyle.openOutputStylePicker({
+    returnTo: () => styleHost.setPicker({ title: 'Settings', items: [{ value: 'done' }] }),
+    handoffPanel: HANDOFF,
+  });
+  const stylePanel = styleHost.current();
+  stylePanel.onSelect(stylePanel.items[0].value, stylePanel.items[0]);
+  assert.equal(styleHost.current(), HANDOFF);
+
+  styleGate.resolve({ current: { id: 'simple', label: 'Simple' } });
+  await flush();
+  assert.equal(styleHost.current()?.title, 'Settings');
+});
+
+test('Theme selection hands directly to Settings without a null panel', () => {
+  supersedePanelEpoch();
+  const host = createPanelHost();
+  const { openThemePicker } = createThemeEffortPickers({
+    state: {},
+    store: {
+      listThemes: () => [{ id: 'basic', label: 'Basic' }],
+      getTheme: () => 'basic',
+      setTheme: (id) => ({ id, label: 'Basic' }),
+      pushNotice: () => {},
+    },
+    surface: host.surface,
+    setProviderPrompt: () => {},
+    setSettingsPrompt: () => {},
+    closeUsagePanel: () => {},
+    clean: (value) => value,
+  });
+
+  openThemePicker({
+    returnTo: () => host.setPicker({ title: 'Settings', items: [{ value: 'done' }] }),
+    handoffPanel: HANDOFF,
+  });
+  const theme = host.current();
+  const paintedBefore = host.painted.length;
+  theme.onSelect(theme.items[0].value, theme.items[0]);
+
+  const transitionPaints = host.painted.slice(paintedBefore);
+  assert.deepEqual(transitionPaints.map((panel) => panel?.title), ['Settings', 'Settings']);
+  assert.ok(transitionPaints.every(Boolean));
+});
+
+function workflowSlashDispatch(host, openWorkflowPicker, notices = []) {
+  return createSlashDispatch({
+    state: { busy: false, commandBusy: false },
+    store: { pushNotice: (message, tone) => notices.push([message, tone]) },
+    normalizeSlashCommandName: (value) => value,
+    surface: host.surface,
+    closeUsagePanel: () => {},
+    openWorkflowPicker,
+  });
+}
+
+test('slash option entry keeps a loading panel until the async picker paints', async () => {
+  supersedePanelEpoch();
+  const host = createPanelHost();
+  const openGate = deferred();
+  const { runSlashCommand } = workflowSlashDispatch(host, () => {
+    const own = host.surface.claim();
+    return openGate.promise.then(() => own.paint({
+      title: 'Workflow',
+      description: 'Select active workflow.',
+      items: [{ value: 'solo', label: 'Solo' }],
+    }));
+  });
+
+  assert.equal(runSlashCommand('workflow'), true);
+  assert.equal(host.current()?._kind, 'slash-loading:workflow');
+  assert.equal(host.current()?.title, 'Workflow');
+  assert.equal(host.current()?.loading, true);
+
+  openGate.resolve();
+  await flush();
+  assert.equal(host.current()?.title, 'Workflow');
+  assert.equal(host.current()?._kind, undefined);
+  assert.ok(host.current()?.items.length > 0);
+});
+
+test('Esc on slash loading prevents the pending picker from appearing later', async () => {
+  supersedePanelEpoch();
+  const host = createPanelHost();
+  const openGate = deferred();
+  const { runSlashCommand } = workflowSlashDispatch(host, () => {
+    const own = host.surface.claim();
+    return openGate.promise.then(() => own.paint({
+      title: 'Workflow',
+      items: [{ value: 'solo', label: 'Solo' }],
+    }));
+  });
+
+  runSlashCommand('workflow');
+  const loading = host.current();
+  assert.equal(loading?._kind, 'slash-loading:workflow');
+  loading.onCancel();
+  assert.equal(host.current(), null);
+
+  openGate.resolve();
+  await flush();
+  assert.equal(host.current(), null);
+});

package/src/tui/app/project-picker.mjs

@@ -134,6 +134,7 @@ export function createProjectPicker({
       description: 'Opening folder picker… choose a folder in the dialog window.',
       help: 'Waiting for the system folder dialog…',
       indexMode: 'never',
+      loading: true,
       items: [],
       onSelect: () => {},
       onCancel: () => {},