@tangleai/assistant 0.21.1

package/CHANGELOG.md

@@ -0,0 +1,35 @@
+# @tangleai/assistant
+
+## 0.21.1
+
+### Patch Changes
+
+- Update the exact Jaren foundation dependencies and source pin to the published
+  0.84.3 release after verifying its AI-free archives against source-built bytes.
+  Retain Tangle's model, context and agent ownership and align the development
+  Node pin with 24.20.0. Tangle publication remains a manual author action.
+  Allow release preparation after an already committed local release while
+  preserving its record and rejecting unprepared version edits.
+- Updated dependencies
+  - @tangleai/models@0.21.1
+  - @tangleai/context@0.21.1
+  - @tangleai/agents@0.21.1
+
+## 0.21.0
+
+### Minor Changes
+
+- Receive the reusable assistant and injected slot ledger storage, preserving
+  streaming, transcript and evidenced-memory behavior with owned cleanup.
+
+### Patch Changes
+
+- Updated dependencies
+- Updated dependencies
+  - @tangleai/models@0.21.0
+  - @tangleai/context@0.21.0
+  - @tangleai/agents@0.21.0
+
+## Unreleased
+
+Received the existing assistant with injected host services and owned lifecycle.

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Joham (jklarenbeek@gmail.com)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,41 @@
+# @tangleai/assistant
+
+Reusable assistant state, actions and request lifecycle. The headless root imports
+no renderer or DOM. Hosts inject their toolbox, system instructions, state access,
+settings/transcript stores and ledger. Dispose aborts requests and releases the
+optional owned storage; cancel prevents late stream results from reappearing.
+
+```js
+import { mountAssistant } from '@tangleai/assistant/component';
+import '@tangleai/assistant/styles/assistant.css';
+const assistant = mountAssistant(document.querySelector('#assistant'), {
+  title: 'My workspace', capabilities: ['Inspect a document'], toolbox,
+  system: 'Help with the tools this workspace provides.',
+  aiStorage: settingsSlot, aiChat: transcriptSlot, ledger,
+  onDispose: () => ownedLedgerStorage.close(),
+});
+assistant.update({ title: 'Review workspace' }); // retains the draft and request
+await assistant.dispose();
+```
+
+`mountAssistant(node, options)` returns `read`, `dispatch`, `subscribe`,
+`update` and asynchronous, idempotent `dispose`, plus its headless controller.
+`createAssistantWidget(options)` supplies app widget mount/update/unmount hooks.
+Presentation options include title, launcher text, intro, capabilities and
+settings hint. The host supplies its toolbox, system prompt, provider fetch and
+settings/transcript slots; omitted slots and ledger are in memory. Slot writes
+must throw or return false on failure. An injected ledger remains host-owned
+unless `onDispose` explicitly closes it. Never put provider settings in a data
+export. See [browser data transfer](../../docs/migrations/jaren-ai/BROWSER_DATA.md).
+
+The root exports state/actions/controller without rendering dependencies.
+`/component` imports the Jaren app, Markdown and Mermaid renderers. CSS selectors
+are scoped to `.tangle-assistant`; host tokens have fallbacks. Each mount owns
+its datalist IDs, draft, stream and fragment links. Cancelling or disposing
+aborts current requests and ignores late results from non-cooperating providers.
+Disposed controls cannot dispatch into the host. Presentation updates retain
+input nodes and do not reset selection or the active request.
+
+The controller exposes its current request `signal`. Hosts can combine it with
+their own lifetime signal for child authoring requests. Cancellation fences
+later tool calls and Pages refuses late authoring results before publication.

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "@tangleai/assistant",
+  "version": "0.21.1",
+  "description": "Reusable assistant state, streaming lifecycle and optional Jaren visual component.",
+  "license": "MIT",
+  "type": "module",
+  "main": "./src/index.js",
+  "types": "./src/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./src/index.d.ts",
+      "import": "./src/index.js",
+      "default": "./src/index.js"
+    },
+    "./package.json": "./package.json",
+    "./component": {
+      "types": "./src/component.d.ts",
+      "import": "./src/component.js",
+      "default": "./src/component.js"
+    },
+    "./styles/assistant.css": "./styles/assistant.css"
+  },
+  "engines": {
+    "node": ">=24"
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "dependencies": {
+    "@tangleai/models": "^0.21.1",
+    "@tangleai/context": "^0.21.1",
+    "@tangleai/agents": "^0.21.1",
+    "@jarenjs/json": "0.84.3",
+    "@jarenjs/app": "0.84.3",
+    "@jarenjs/md": "0.84.3",
+    "@jarenjs/mermaid": "0.84.3"
+  },
+  "private": false,
+  "files": [
+    "src/**/*.js",
+    "src/**/*.d.ts",
+    "README.md",
+    "LICENSE",
+    "CHANGELOG.md",
+    "styles/**/*.css"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/jklarenbeek/tangleai.git",
+    "directory": "components/assistant"
+  }
+}

package/src/actions.d.ts

@@ -0,0 +1,237 @@
+/** Assistant transitions received from the existing panel. */
+export const ASSISTANT_ACTIONS: {
+    'ai/cancel': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/toggle': {
+        patch: {
+            op: string;
+            path: string;
+            value: {
+                $not: string;
+            };
+        }[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/settings-toggle': {
+        patch: {
+            op: string;
+            path: string;
+            value: {
+                $not: string;
+            };
+        }[];
+    };
+    'ai/settings-open': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/setting': {
+        patch: ({
+            op: string;
+            path: {
+                $concat: string[];
+            };
+            value: string;
+        } | {
+            op: string;
+            path: string;
+            value: {
+                status: string;
+                detail: any;
+                models: any[];
+            };
+        })[];
+    };
+    'ai/probe': {
+        patch: {
+            op: string;
+            path: string;
+            value: {
+                status: string;
+                detail: any;
+                models: any[];
+            };
+        }[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/probe-result': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/save-settings': {
+        patch: {
+            op: string;
+            path: string;
+            value: boolean;
+        }[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/draft': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/send': {
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/user': {
+        patch: ({
+            op: string;
+            path: string;
+            value: {
+                role: string;
+                content: string;
+            };
+        } | {
+            op: string;
+            path: string;
+            value: string;
+        } | {
+            op: string;
+            path: string;
+            value: number;
+        })[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/delta': {
+        patch: {
+            op: string;
+            path: string;
+            value: {
+                $concat: string[];
+            };
+        }[];
+    };
+    'ai/reasoning': {
+        patch: {
+            op: string;
+            path: string;
+            value: {
+                $add: string[];
+            };
+        }[];
+    };
+    'ai/activity': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/reply': {
+        patch: ({
+            op: string;
+            path: string;
+            value: {
+                role: string;
+                content: string;
+            };
+        } | {
+            op: string;
+            path: string;
+            value: string;
+        })[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/failed': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/clear': {
+        patch: ({
+            op: string;
+            path: string;
+            value: any[];
+        } | {
+            op: string;
+            path: string;
+            value: string;
+        })[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/ledger': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/goal-draft': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/goal-set': {
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/goal-committed': {
+        patch: {
+            op: string;
+            path: string;
+            value: string;
+        }[];
+    };
+    'ai/goal-clear': {
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/remember': {
+        patch: {
+            op: string;
+            path: string;
+            value: boolean;
+        }[];
+        effects: {
+            run: string;
+        }[];
+    };
+    'ai/remembered': {
+        patch: ({
+            op: string;
+            path: string;
+            value: boolean;
+        } | {
+            op: string;
+            path: string;
+            value: string;
+        })[];
+    };
+};

package/src/actions.js

@@ -0,0 +1,145 @@
+//@ts-check
+/** Assistant transitions received from the existing panel. */
+export const ASSISTANT_ACTIONS = {
+'ai/cancel': {
+  patch: [
+    { op: 'replace', path: '/ai/status', value: 'idle' },
+    { op: 'replace', path: '/ai/pending', value: '' },
+    { op: 'replace', path: '/ai/activity', value: null },
+  ],
+  effects: [{ run: 'ai-cancel' }],
+},
+'ai/toggle': {
+    patch: [{ op: 'replace', path: '/ai/open', value: { $not: '$.ai.open' } }],
+    // opening while unconfigured pins the settings form open (see
+    // ai-ensure-settings), so it cannot vanish mid-edit as typing
+    // makes the configuration valid. The ledger read is what makes a
+    // reloaded page show the objective it was left with — the goal
+    // lives in storage, not in this tab.
+    effects: [{ run: 'ai-ensure-settings' }, { run: 'ai-ledger-read' }],
+  },
+'ai/settings-toggle': {
+    patch: [{ op: 'replace', path: '/ai/settingsOpen', value: { $not: '$.ai.settingsOpen' } }],
+  },
+'ai/settings-open': {
+    patch: [{ op: 'replace', path: '/ai/settingsOpen', value: '$payload' }],
+  },
+'ai/setting': {
+    patch: [
+      {
+        op: 'add',
+        path: { $concat: ['/ai/settings/', '$payload.key'] },
+        value: '$event.value',
+      },
+      // an edited connection voids the last probe verdict
+      { op: 'replace', path: '/ai/probe', value: { status: 'idle', detail: null, models: [] } },
+    ],
+  },
+'ai/probe': {
+    patch: [{
+      op: 'replace',
+      path: '/ai/probe',
+      value: { status: 'busy', detail: null, models: [] },
+    }],
+    effects: [{ run: 'ai-probe' }],
+  },
+'ai/probe-result': {
+    patch: [{ op: 'replace', path: '/ai/probe', value: '$payload' }],
+  },
+'ai/save-settings': {
+    patch: [{ op: 'replace', path: '/ai/settingsOpen', value: false }],
+    effects: [{ run: 'ai-save-settings' }],
+  },
+'ai/draft': {
+    patch: [{ op: 'replace', path: '/ai/draft', value: '$event.value' }],
+  },
+'ai/send': { effects: [{ run: 'ai-send' }] },
+'ai/user': {
+    patch: [
+      { op: 'add', path: '/ai/messages/-', value: { role: 'user', content: '$payload' } },
+      { op: 'replace', path: '/ai/draft', value: '' },
+      { op: 'replace', path: '/ai/pending', value: '' },
+      { op: 'replace', path: '/ai/status', value: 'streaming' },
+      { op: 'replace', path: '/ai/activity', value: null },
+      { op: 'replace', path: '/ai/error', value: null },
+      { op: 'replace', path: '/ai/reasoningChars', value: 0 },
+    ],
+    effects: [{ run: 'ai-persist' }],
+  },
+'ai/delta': {
+    patch: [{ op: 'replace', path: '/ai/pending', value: { $concat: ['$.ai.pending', '$payload'] } }],
+  },
+'ai/reasoning': {
+    patch: [{ op: 'replace', path: '/ai/reasoningChars', value: { $add: ['$.ai.reasoningChars', '$payload'] } }],
+  },
+'ai/activity': {
+    patch: [{ op: 'replace', path: '/ai/activity', value: '$payload' }],
+  },
+'ai/reply': {
+    patch: [
+      { op: 'add', path: '/ai/messages/-', value: { role: 'assistant', content: '$payload' } },
+      { op: 'replace', path: '/ai/pending', value: '' },
+      { op: 'replace', path: '/ai/status', value: 'idle' },
+      { op: 'replace', path: '/ai/activity', value: null },
+    ],
+    effects: [{ run: 'ai-persist' }],
+  },
+'ai/failed': {
+    patch: [
+      { op: 'replace', path: '/ai/status', value: 'error' },
+      { op: 'replace', path: '/ai/error', value: '$payload' },
+      { op: 'replace', path: '/ai/pending', value: '' },
+      { op: 'replace', path: '/ai/activity', value: null },
+    ],
+  },
+'ai/clear': {
+    patch: [
+      { op: 'replace', path: '/ai/messages', value: [] },
+      { op: 'replace', path: '/ai/pending', value: '' },
+      { op: 'replace', path: '/ai/status', value: 'idle' },
+      { op: 'replace', path: '/ai/activity', value: null },
+      { op: 'replace', path: '/ai/error', value: null },
+      { op: 'replace', path: '/ai/remembered', value: null },
+    ],
+    // the archived rounds go with the transcript they were cut from:
+    // their addresses only ever existed in its synopsis
+    effects: [{ run: 'ai-clear-run' }, { run: 'ai-persist' }, { run: 'ai-clear-archive' }],
+  },
+'ai/ledger': {
+    patch: [
+      { op: 'replace', path: '/ai/goal', value: '$payload.goal' },
+      { op: 'replace', path: '/ai/memories', value: '$payload.memories' },
+      { op: 'replace', path: '/ai/archived', value: '$payload.archived' },
+      { op: 'replace', path: '/ai/persistence', value: '$payload.persistence' },
+      { op: 'replace', path: '/ai/retention', value: '$payload.retention' },
+    ],
+  },
+'ai/goal-draft': {
+    patch: [{ op: 'replace', path: '/ai/goalDraft', value: '$event.value' }],
+  },
+'ai/goal-set': { effects: [{ run: 'ai-goal-set' }] },
+'ai/goal-committed': {
+    patch: [
+      { op: 'replace', path: '/ai/goal', value: '$payload.goal' },
+      { op: 'replace', path: '/ai/memories', value: '$payload.memories' },
+      { op: 'replace', path: '/ai/archived', value: '$payload.archived' },
+      { op: 'replace', path: '/ai/persistence', value: '$payload.persistence' },
+      { op: 'replace', path: '/ai/retention', value: '$payload.retention' },
+      { op: 'replace', path: '/ai/goalDraft', value: '' },
+    ],
+  },
+'ai/goal-clear': { effects: [{ run: 'ai-goal-clear' }] },
+'ai/remember': {
+    patch: [
+      { op: 'replace', path: '/ai/remembering', value: true },
+      { op: 'replace', path: '/ai/remembered', value: null },
+    ],
+    effects: [{ run: 'ai-remember' }],
+  },
+'ai/remembered': {
+    patch: [
+      { op: 'replace', path: '/ai/remembering', value: false },
+      { op: 'replace', path: '/ai/remembered', value: '$payload.note' },
+    ],
+  },
+};

package/src/component.d.ts

@@ -0,0 +1,55 @@
+/** @param {HTMLElement | null} node @param {AssistantOptions} [options] */
+export function mountAssistant(node: HTMLElement | null, options?: AssistantOptions): {
+    controller: {
+        effects: {
+            [k: string]: (props: any, dispatch: any) => void | Promise<any>;
+        };
+        cancel: () => void;
+        dispose: () => any;
+        readonly signal: AbortSignal;
+    };
+    read: () => any;
+    dispatch(action: any, payload?: any, event?: any): void;
+    subscribe(listener: any): () => void;
+    /** Presentation updates retain the transcript, request and input node. */
+    update(next: AssistantPresentation): void;
+    dispose(): any;
+};
+/** @param {AssistantOptions} [options] */
+export function createAssistantWidget(options?: AssistantOptions): {
+    mount: (host: any, props: any) => {
+        controller: {
+            effects: {
+                [k: string]: (props: any, dispatch: any) => void | Promise<any>;
+            };
+            cancel: () => void;
+            dispose: () => any;
+            readonly signal: AbortSignal;
+        };
+        read: () => any;
+        dispatch(action: any, payload?: any, event?: any): void;
+        subscribe(listener: any): () => void;
+        /** Presentation updates retain the transcript, request and input node. */
+        update(next: AssistantPresentation): void;
+        dispose(): any;
+    };
+    update: (handle: any, props: any) => any;
+    unmount: (handle: any) => any;
+};
+export type AssistantPresentation = {
+    title?: string;
+    launchLabel?: string;
+    launchTitle?: string;
+    intro?: string;
+    capabilities?: string[];
+    settingsHint?: string;
+};
+export type AssistantOptions = AssistantPresentation & Partial<Omit<Parameters<typeof createAssistantController>[0], "getApp">> & {
+    settings?: any;
+    transcript?: any;
+    open?: boolean;
+    schedule?: (flush: () => void) => void;
+    onError?: (error: Error) => void;
+    renderMarkdown?: (source: string) => any;
+};
+import { createAssistantController } from './index.js';

package/src/component.js

@@ -0,0 +1,93 @@
+//@ts-check
+/** The visual assistant owns one app, its request lifecycle and its DOM listeners. */
+import { createApp, formEventFields } from '@jarenjs/app';
+import { createMdComponent } from '@jarenjs/md/component';
+import { highlightPlugin } from '@jarenjs/md/plugins';
+import { mermaidPlugin } from '@jarenjs/mermaid/plugin';
+import { createLedger } from '@tangleai/context';
+import { createToolbox } from '@tangleai/agents';
+import { createAssistantState, createAssistantController, ASSISTANT_ACTIONS } from './index.js';
+import { createAssistantRules } from './views.js';
+import { assistantView } from './viewmodel.js';
+
+/**
+ * @typedef {{ title?: string, launchLabel?: string, launchTitle?: string,
+ *   intro?: string, capabilities?: string[], settingsHint?: string }} AssistantPresentation
+ * @typedef {AssistantPresentation & Partial<Omit<Parameters<typeof createAssistantController>[0], 'getApp'>> & {
+ *   settings?: any, transcript?: any, open?: boolean,
+ *   schedule?: (flush: () => void) => void, onError?: (error: Error) => void,
+ *   renderMarkdown?: (source: string) => any }} AssistantOptions
+ */
+const DEFAULT_PRESENTATION = {
+  title: 'Assistant', launchLabel: ' Assistant', launchTitle: 'Open assistant',
+  intro: 'Describe what you want to get done. The assistant can use the tools this host provides.',
+  capabilities: [],
+  settingsHint: 'Provider requests use your settings. This host controls local persistence.',
+};
+let nextInstance = 0;
+/** @param {AssistantPresentation} value */
+function presentation(value) {
+  return Object.fromEntries(Object.entries(value).filter(([key]) => Object.hasOwn(DEFAULT_PRESENTATION, key)));
+}
+/** @param {HTMLElement | null} node @param {AssistantOptions} [options] */
+export function mountAssistant(node, options = {}) {
+  let app, disposed = false, closing;
+  const id = `tangle-assistant-${++nextInstance}`;
+  let settings = options.settings ?? null, transcript = options.transcript ?? null;
+  const aiStorage = options.aiStorage ?? { read: () => settings, write: value => { settings = structuredClone(value); } };
+  const aiChat = options.aiChat ?? { read: () => transcript, write: value => { transcript = structuredClone(value); } };
+  const md = createMdComponent({ plugins: [highlightPlugin(), mermaidPlugin({ theme: 'host' })], headingIds: true, headingAnchors: true });
+  const renderMarkdown = options.renderMarkdown ?? (source => md.view(source, { slugPrefix: `user-content-${id}-` }));
+  const controller = createAssistantController({ ...options, aiStorage, aiChat,
+    ledger: options.ledger ?? createLedger(), toolbox: options.toolbox ?? createToolbox(), getApp: () => app });
+  app = createApp({
+    state: { ai: { ...createAssistantState(aiStorage.read(), aiChat.read()), open: options.open ?? false }, presentation: { ...DEFAULT_PRESENTATION, ...presentation(options) } },
+    actions: { ...ASSISTANT_ACTIONS, 'assistant/presentation': { patch: [{ op: 'replace', path: '/presentation', value: '$payload' }] } },
+    view: { $jslt: '0.1', modes: { assistant: { unmatched: 'error' } }, rules: [
+      { match: '$', body: ['section', { class: 'tangle-assistant', 'data-assistant-instance': id }, { $apply: ['$.ui.assistant', 'assistant'] }] },
+      ...createAssistantRules(`${id}-models`),
+    ] },
+  }, {
+    node, document: node?.ownerDocument, schedule: options.schedule, onError: options.onError,
+    eventFields: formEventFields(), effects: controller.effects,
+    afterRender: () => { if (node?.querySelectorAll) md.hydrate(node); },
+    viewModel: state => ({ ui: { assistant: { ...assistantView(state.ai, renderMarkdown), ...state.presentation,
+      capabilities: state.presentation.capabilities.map(text => ({ text })) } } }),
+  });
+  // A Markdown fragment belongs to this component, not to its host's hash router.
+  function click(event) {
+    const anchor = event.target.closest?.('a[href^="#"]');
+    const href = anchor?.getAttribute('href');
+    if (!href || href.startsWith('#/')) return;
+    event.preventDefault();
+    let fragment; try { fragment = decodeURIComponent(href.slice(1)); } catch { return; }
+    for (const target of node?.querySelectorAll('[id]') ?? []) {
+      if (target.id === fragment) { target.scrollIntoView?.({ block: 'nearest' }); break; }
+    }
+  }
+  node?.addEventListener('click', click);
+  if (options.open) {
+    controller.effects['ai-ensure-settings']({}, app.dispatch);
+    controller.effects['ai-ledger-read']({}, app.dispatch);
+  }
+  return {
+    controller,
+    read: () => structuredClone(app.getState().ai),
+    dispatch(action, payload = null, event = null) { if (!disposed) app.dispatch(action, payload, event); },
+    subscribe(listener) { return app.subscribe(state => listener(structuredClone(state.ai))); },
+    /** Presentation updates retain the transcript, request and input node. */
+    update(/** @type {AssistantPresentation} */ next) {
+      if (!disposed) app.dispatch('assistant/presentation', { ...app.getState().presentation, ...presentation(next) });
+    },
+    dispose() {
+      if (disposed) return closing;
+      disposed = true; node?.removeEventListener('click', click);
+      closing = controller.dispose(); app.destroy(); return closing;
+    },
+  };
+}
+/** @param {AssistantOptions} [options] */
+export function createAssistantWidget(options = {}) {
+  return { mount: (host, props) => mountAssistant(host, { ...options, ...props }),
+    update: (handle, props) => handle.update(props), unmount: handle => handle.dispose() };
+}