@dxos/plugin-automation 0.7.5-labs.e27f9b9 → 0.7.5-labs.ea4b4c2

package/dist/lib/node/{chunk-6VMSH4P6.cjs → chunk-CJGJXNY3.cjs}

@@ -26,8 +26,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var chunk_6VMSH4P6_exports = {};
-__export(chunk_6VMSH4P6_exports, {
+var chunk_CJGJXNY3_exports = {};
+__export(chunk_CJGJXNY3_exports, {
   AiClient: () => AiClient,
   AppGraphBuilder: () => AppGraphBuilder,
   ChatContainer: () => ChatContainer,
@@ -36,88 +36,92 @@ __export(chunk_6VMSH4P6_exports, {
   MarkdownViewer: () => MarkdownViewer,
   ReactSurface: () => ReactSurface,
   Thread: () => Thread,
-  useServiceRegistry: () => useServiceRegistry
+  useServices: () => useServices
 });
-module.exports = __toCommonJS(chunk_6VMSH4P6_exports);
-var import_chunk_ZS5RZ7RM = require("./chunk-ZS5RZ7RM.cjs");
-var import_chunk_LU4HQWJD = require("./chunk-LU4HQWJD.cjs");
-var import_chunk_5VF5JKUN = require("./chunk-5VF5JKUN.cjs");
+module.exports = __toCommonJS(chunk_CJGJXNY3_exports);
+var import_chunk_U5Z7LFWB = require("./chunk-U5Z7LFWB.cjs");
+var import_chunk_GB7245FH = require("./chunk-GB7245FH.cjs");
+var import_chunk_EQYHOTGG = require("./chunk-EQYHOTGG.cjs");
 var import_react = __toESM(require("react"));
-var import_app_framework = require("@dxos/app-framework");
-var import_artifact = require("@dxos/artifact");
-var import_functions = require("@dxos/functions");
 var import_invariant = require("@dxos/invariant");
-var import_keys = require("@dxos/keys");
-var import_react_client = require("@dxos/react-client");
-var import_echo = require("@dxos/react-client/echo");
-var import_react_edge_client = require("@dxos/react-edge-client");
 var import_react_ui_stack = require("@dxos/react-ui-stack");
-var import_util = require("@dxos/util");
-var import_app_framework2 = require("@dxos/app-framework");
 var import_signals_core = require("@preact/signals-core");
-var import_artifact2 = require("@dxos/artifact");
+var import_artifact = require("@dxos/artifact");
 var import_assistant = require("@dxos/assistant");
 var import_echo_schema = require("@dxos/echo-schema");
 var import_invariant2 = require("@dxos/invariant");
 var import_log = require("@dxos/log");
 var import_react2 = require("react");
+var import_app_framework = require("@dxos/app-framework");
+var import_artifact2 = require("@dxos/artifact");
+var import_functions = require("@dxos/functions");
+var import_react_client = require("@dxos/react-client");
+var import_echo = require("@dxos/react-client/echo");
+var import_util = require("@dxos/util");
+var import_app_framework2 = require("@dxos/app-framework");
+var import_artifact3 = require("@dxos/artifact");
+var import_echo_schema2 = require("@dxos/echo-schema");
+var import_functions2 = require("@dxos/functions");
+var import_log2 = require("@dxos/log");
+var import_echo2 = require("@dxos/react-client/echo");
+var import_jsonpointer = __toESM(require("jsonpointer"));
+var import_artifact4 = require("@dxos/artifact");
+var import_echo_schema3 = require("@dxos/echo-schema");
+var import_invariant3 = require("@dxos/invariant");
+var import_log3 = require("@dxos/log");
+var import_util2 = require("@dxos/util");
 var import_react3 = require("react");
 var import_async = require("@dxos/async");
 var import_context = require("@dxos/context");
-var import_functions2 = require("@dxos/functions");
 var import_functions3 = require("@dxos/functions");
-var import_invariant3 = require("@dxos/invariant");
-var import_log2 = require("@dxos/log");
-var import_react_client2 = require("@dxos/react-client");
-var import_echo2 = require("@dxos/react-client/echo");
-var import_async2 = require("@dxos/async");
-var import_echo_db = require("@dxos/echo-db");
 var import_functions4 = require("@dxos/functions");
 var import_invariant4 = require("@dxos/invariant");
-var import_keys2 = require("@dxos/keys");
-var import_log3 = require("@dxos/log");
-var import_artifact3 = require("@dxos/artifact");
-var import_echo_schema2 = require("@dxos/echo-schema");
-var import_functions5 = require("@dxos/functions");
 var import_log4 = require("@dxos/log");
+var import_react_client2 = require("@dxos/react-client");
 var import_echo3 = require("@dxos/react-client/echo");
-var import_jsonpointer = __toESM(require("jsonpointer"));
-var import_artifact4 = require("@dxos/artifact");
-var import_echo_schema3 = require("@dxos/echo-schema");
+var import_async2 = require("@dxos/async");
+var import_echo_db = require("@dxos/echo-db");
+var import_functions5 = require("@dxos/functions");
 var import_invariant5 = require("@dxos/invariant");
+var import_keys = require("@dxos/keys");
 var import_log5 = require("@dxos/log");
-var import_util2 = require("@dxos/util");
-var import_react4 = __toESM(require("react"));
+var import_react4 = require("react");
+var import_keys2 = require("@dxos/keys");
+var import_echo4 = require("@dxos/react-client/echo");
+var import_react_edge_client = require("@dxos/react-edge-client");
+var import_react5 = require("react");
+var import_artifact5 = require("@dxos/artifact");
+var import_echo_schema4 = require("@dxos/echo-schema");
+var import_echo_schema5 = require("@dxos/echo-schema");
+var import_react6 = __toESM(require("react"));
 var import_react_ui = require("@dxos/react-ui");
+var import_react_ui_components = require("@dxos/react-ui-components");
 var import_react_ui_sfx = require("@dxos/react-ui-sfx");
 var import_react_ui_theme = require("@dxos/react-ui-theme");
-var import_react5 = __toESM(require("react"));
+var import_react7 = __toESM(require("react"));
 var import_invariant6 = require("@dxos/invariant");
-var import_react_ui_theme2 = require("@dxos/react-ui-theme");
-var import_react6 = __toESM(require("react"));
-var import_invariant7 = require("@dxos/invariant");
+var import_log6 = require("@dxos/log");
 var import_react_ui2 = require("@dxos/react-ui");
 var import_react_ui_syntax_highlighter = require("@dxos/react-ui-syntax-highlighter");
-var import_react_ui_theme3 = require("@dxos/react-ui-theme");
+var import_react_ui_theme2 = require("@dxos/react-ui-theme");
 var import_util3 = require("@dxos/util");
-var import_react7 = __toESM(require("react"));
-var import_react_ui_theme4 = require("@dxos/react-ui-theme");
 var import_react8 = __toESM(require("react"));
+var import_react_ui_theme3 = require("@dxos/react-ui-theme");
+var import_react9 = __toESM(require("react"));
 var import_react_ui3 = require("@dxos/react-ui");
+var import_react_ui_theme4 = require("@dxos/react-ui-theme");
+var import_react10 = __toESM(require("react"));
+var import_react_ui4 = require("@dxos/react-ui");
 var import_react_ui_theme5 = require("@dxos/react-ui-theme");
-var import_react9 = __toESM(require("react"));
+var import_react11 = __toESM(require("react"));
 var import_react_markdown = __toESM(require("react-markdown"));
 var import_react_ui_syntax_highlighter2 = require("@dxos/react-ui-syntax-highlighter");
 var import_react_ui_theme6 = require("@dxos/react-ui-theme");
 var import_util4 = require("@dxos/util");
-var AiClient = (0, import_app_framework2.lazy)(() => import("./ai-client-SA35GN5Q.cjs"));
-var AppGraphBuilder = (0, import_app_framework2.lazy)(() => import("./app-graph-builder-ENVDOPS4.cjs"));
-var IntentResolver = (0, import_app_framework2.lazy)(() => import("./intent-resolver-CNVBSG4E.cjs"));
-var ReactSurface = (0, import_app_framework2.lazy)(() => import("./react-surface-5HYLBDC3.cjs"));
 var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/hooks/processor.ts";
 var defaultOptions = {
   model: "@anthropic/claude-3-5-sonnet-20241022",
-  systemPrompt: ""
+  systemPrompt: "you are a helpful assistant"
 };
 var ChatProcessor = class {
   constructor(_client, _tools, _extensions, _options = defaultOptions) {
@@ -138,7 +142,7 @@ var ChatProcessor = class {
         const current = messages.pop();
         (0, import_invariant2.invariant)(current, void 0, {
           F: __dxlog_file,
-          L: 76,
+          L: 78,
           S: this,
           A: [
             "current",
@@ -173,13 +177,19 @@ var ChatProcessor = class {
     });
   }
   /**
+  * Update tools.
+  */
+  setTools(tools) {
+    this._tools = tools;
+  }
+  /**
   * Make GPT request.
   */
   async request(message, options = {}) {
     (0, import_signals_core.batch)(() => {
       this._history = options.history ?? [];
       this._pending.value = [
-        (0, import_echo_schema.createStatic)(import_artifact2.Message, {
+        (0, import_echo_schema.createStatic)(import_artifact.Message, {
           role: "user",
           content: [
             {
@@ -202,7 +212,7 @@ var ChatProcessor = class {
   async cancel() {
     import_log.log.info("cancelling...", void 0, {
       F: __dxlog_file,
-      L: 132,
+      L: 141,
       S: this,
       C: (f, a) => f(...a)
     });
@@ -231,7 +241,7 @@ var ChatProcessor = class {
           messages: this._pending.value.length
         }, {
           F: __dxlog_file,
-          L: 156,
+          L: 165,
           S: this,
           C: (f, a) => f(...a)
         });
@@ -250,7 +260,7 @@ var ChatProcessor = class {
           messages: this._pending.value
         }, {
           F: __dxlog_file,
-          L: 169,
+          L: 178,
           S: this,
           C: (f, a) => f(...a)
         });
@@ -258,7 +268,7 @@ var ChatProcessor = class {
         const message = this._pending.value.at(-1);
         (0, import_invariant2.invariant)(message, void 0, {
           F: __dxlog_file,
-          L: 174,
+          L: 183,
           S: this,
           A: [
             "message",
@@ -268,7 +278,7 @@ var ChatProcessor = class {
         if ((0, import_assistant.isToolUse)(message)) {
           import_log.log.info("tool request...", void 0, {
             F: __dxlog_file,
-            L: 176,
+            L: 185,
             S: this,
             C: (f, a) => f(...a)
           });
@@ -281,7 +291,7 @@ var ChatProcessor = class {
             response
           }, {
             F: __dxlog_file,
-            L: 183,
+            L: 192,
             S: this,
             C: (f, a) => f(...a)
           });
@@ -302,14 +312,14 @@ var ChatProcessor = class {
         err
       }, {
         F: __dxlog_file,
-        L: 195,
+        L: 204,
         S: this,
         C: (f, a) => f(...a)
       });
     } finally {
       import_log.log.info("done", void 0, {
         F: __dxlog_file,
-        L: 197,
+        L: 206,
         S: this,
         C: (f, a) => f(...a)
       });
@@ -317,32 +327,20 @@ var ChatProcessor = class {
     }
   }
 };
-var useServiceRegistry = (query) => {
-  const registry = (0, import_react2.useMemo)(() => new import_chunk_LU4HQWJD.MockServiceRegistry(), []);
-  const [services, setServices] = (0, import_react2.useState)([]);
-  (0, import_react2.useEffect)(() => {
-    const t = setTimeout(async () => {
-      const services2 = await registry.queryServices(query);
-      setServices(services2);
-    });
-    return () => clearTimeout(t);
-  }, [
-    query,
-    registry
-  ]);
-  return services;
-};
-var registerTriggersMutex = new import_async.Mutex();
+var AiClient = (0, import_app_framework2.lazy)(() => import("./ai-client-FKLPDELV.cjs"));
+var AppGraphBuilder = (0, import_app_framework2.lazy)(() => import("./app-graph-builder-T76NYV42.cjs"));
+var IntentResolver = (0, import_app_framework2.lazy)(() => import("./intent-resolver-C6OKFVEW.cjs"));
+var ReactSurface = (0, import_app_framework2.lazy)(() => import("./react-surface-LWDY7SQG.cjs"));
 var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/tools/function.ts";
 var covertFunctionToTool = (fn, edgeUrl, spaceId) => {
   if (!fn.description || !fn.inputSchema) {
     return void 0;
   }
-  const existingFunctionUrl = (0, import_functions5.getUserFunctionUrlInMetadata)((0, import_echo3.getMeta)(fn));
+  const existingFunctionUrl = (0, import_functions2.getUserFunctionUrlInMetadata)((0, import_echo2.getMeta)(fn));
   if (!existingFunctionUrl) {
     return void 0;
   }
-  const url = (0, import_functions5.getInvocationUrl)(existingFunctionUrl, edgeUrl, {
+  const url = (0, import_functions2.getInvocationUrl)(existingFunctionUrl, edgeUrl, {
     spaceId
   });
   return (0, import_artifact3.defineTool)({
@@ -350,7 +348,7 @@ var covertFunctionToTool = (fn, edgeUrl, spaceId) => {
     description: fn.description,
     schema: (0, import_echo_schema2.toEffectSchema)(fn.inputSchema),
     execute: async (input) => {
-      import_log4.log.info("execute function tool", {
+      import_log2.log.info("execute function tool", {
         name: fn.name,
         url,
         input
@@ -373,7 +371,7 @@ var covertFunctionToTool = (fn, edgeUrl, spaceId) => {
 };
 var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/tools/openapi.ts";
 var createToolsFromService = async (service) => {
-  (0, import_invariant5.invariant)(service.interfaces?.length === 1 && service.interfaces[0].kind === "api", void 0, {
+  (0, import_invariant3.invariant)(service.interfaces?.length === 1 && service.interfaces[0].kind === "api", void 0, {
     F: __dxlog_file3,
     L: 22,
     S: void 0,
@@ -383,7 +381,7 @@ var createToolsFromService = async (service) => {
     ]
   });
   const iface = service.interfaces[0];
-  (0, import_invariant5.invariant)(iface.schemaUrl, void 0, {
+  (0, import_invariant3.invariant)(iface.schemaUrl, void 0, {
     F: __dxlog_file3,
     L: 24,
     S: void 0,
@@ -392,7 +390,7 @@ var createToolsFromService = async (service) => {
       ""
     ]
   });
-  (0, import_invariant5.invariant)(iface.schemaUrl, void 0, {
+  (0, import_invariant3.invariant)(iface.schemaUrl, void 0, {
     F: __dxlog_file3,
     L: 25,
     S: void 0,
@@ -408,7 +406,7 @@ var createToolsFromService = async (service) => {
 var createToolsFromApi = async (url, options) => {
   const res = await fetch(url);
   const spec = await res.json();
-  (0, import_log5.log)("spec", {
+  (0, import_log3.log)("spec", {
     spec
   }, {
     F: __dxlog_file3,
@@ -424,7 +422,7 @@ var createToolsFromApi = async (url, options) => {
     const { ...methods } = pathItem;
     for (const [method, m] of Object.entries(methods)) {
       const methodItem = m;
-      (0, import_log5.log)("methodItem", {
+      (0, import_log3.log)("methodItem", {
         path,
         method,
         methodItem
@@ -444,7 +442,7 @@ var createToolsFromApi = async (url, options) => {
       };
       const endpointParameters = [];
       for (const parameter of parametersResolved) {
-        (0, import_log5.log)("parameter", {
+        (0, import_log3.log)("parameter", {
           parameter
         }, {
           F: __dxlog_file3,
@@ -467,7 +465,7 @@ var createToolsFromApi = async (url, options) => {
           }
         }
       }
-      (0, import_log5.log)("inputSchema", {
+      (0, import_log3.log)("inputSchema", {
         inputSchema
       }, {
         F: __dxlog_file3,
@@ -478,7 +476,7 @@ var createToolsFromApi = async (url, options) => {
       import_echo_schema3.S.validateSync(import_echo_schema3.JsonSchemaType)(inputSchema);
       const description = methodItem.description ?? methodItem.summary;
       if (!description) {
-        import_log5.log.warn("no description", {
+        import_log3.log.warn("no description", {
           path,
           method
         }, {
@@ -553,7 +551,7 @@ var GENERIC_WORDS = [
   "endpoint"
 ];
 var callApiEndpoint = async (endpoint, input) => {
-  import_log5.log.info("endpoint", {
+  import_log3.log.info("endpoint", {
     method: endpoint.method,
     name: endpoint.path,
     input
@@ -613,7 +611,7 @@ var callApiEndpoint = async (endpoint, input) => {
     request.body = JSON.stringify(body);
     request.headers["Content-Type"] = "application/json";
   }
-  import_log5.log.info("request", {
+  import_log3.log.info("request", {
     url,
     request
   }, {
@@ -623,7 +621,7 @@ var callApiEndpoint = async (endpoint, input) => {
     C: (f, a) => f(...a)
   });
   const response = await fetch(url, request);
-  import_log5.log.info("response", {
+  import_log3.log.info("response", {
     ok: response.ok,
     status: response.status,
     statusText: response.statusText
@@ -649,7 +647,7 @@ var callApiEndpoint = async (endpoint, input) => {
       } catch {
         error = responseBody;
       }
-      import_log5.log.error("error", {
+      import_log3.log.error("error", {
         error
       }, {
         F: __dxlog_file3,
@@ -660,7 +658,7 @@ var callApiEndpoint = async (endpoint, input) => {
       throw new Error(error.message);
     } else {
       const error = await response.text();
-      import_log5.log.error("error", {
+      import_log3.log.error("error", {
         error
       }, {
         F: __dxlog_file3,
@@ -677,7 +675,7 @@ var getEndpointUrl = (endpoint) => {
   if (isV3_1(endpoint.document) && endpoint.document.servers && endpoint.document.servers.length > 0) {
     url = endpoint.document.servers[0].url;
   } else {
-    (0, import_invariant5.invariant)(!isV3_1(endpoint.document), void 0, {
+    (0, import_invariant3.invariant)(!isV3_1(endpoint.document), void 0, {
       F: __dxlog_file3,
       L: 272,
       S: void 0,
@@ -697,7 +695,7 @@ var getEndpointUrl = (endpoint) => {
 var resolveAuthorization = async (authorization) => {
   switch (authorization.type) {
     case "api-key": {
-      (0, import_invariant5.invariant)(authorization.placement.type === "authorization-header", void 0, {
+      (0, import_invariant3.invariant)(authorization.placement.type === "authorization-header", void 0, {
         F: __dxlog_file3,
         L: 288,
         S: void 0,
@@ -732,7 +730,7 @@ var resolveJsonSchema = (schema, base) => {
         if (resolved) {
           return recurse(resolved);
         } else {
-          import_log5.log.warn("unresolved", {
+          import_log3.log.warn("unresolved", {
             ref: value.$ref,
             base
           }, {
@@ -750,87 +748,215 @@ var resolveJsonSchema = (schema, base) => {
 var isV3_1 = (document) => {
   return document.openapi === "3.0.1";
 };
-var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/components/Thread/ScrollContainer.tsx";
-var ScrollContainer = /* @__PURE__ */ (0, import_react5.forwardRef)(({ children, classNames }, forwardedRef) => {
-  const containerRef = (0, import_react5.useRef)(null);
-  const autoScrollRef = (0, import_react5.useRef)(false);
-  (0, import_react5.useImperativeHandle)(forwardedRef, () => ({
-    scrollToBottom: () => {
-      (0, import_invariant6.invariant)(containerRef.current, void 0, {
-        F: __dxlog_file4,
-        L: 41,
-        S: void 0,
-        A: [
-          "containerRef.current",
-          ""
-        ]
-      });
-      containerRef.current.scrollTo({
-        top: containerRef.current.scrollHeight,
-        behavior: "smooth"
-      });
-      autoScrollRef.current = false;
-    }
-  }), []);
-  const [sticky, setSticky] = (0, import_react5.useState)(true);
-  (0, import_react5.useEffect)(() => {
-    if (!sticky || !containerRef.current) {
-      return;
-    }
-    autoScrollRef.current = true;
-    containerRef.current.scrollTo({
-      top: containerRef.current.scrollHeight,
-      behavior: "smooth"
+var useChatProcessor = (chat) => {
+  const aiClient = (0, import_app_framework.useCapability)(import_chunk_U5Z7LFWB.AutomationCapabilities.AiClient);
+  const globalTools = (0, import_app_framework.useCapabilities)(import_app_framework.Capabilities.Tools);
+  const artifactDefinitions = (0, import_app_framework.useCapabilities)(import_app_framework.Capabilities.ArtifactDefinition);
+  const { dispatchPromise: dispatch } = (0, import_app_framework.useIntentDispatcher)();
+  const space = (0, import_echo.getSpace)(chat);
+  const services = (0, import_echo.useQuery)(space, import_echo.Filter.schema(import_chunk_GB7245FH.ServiceType));
+  const [serviceTools, setServiceTools] = (0, import_react2.useState)([]);
+  (0, import_react2.useEffect)(() => {
+    queueMicrotask(async () => {
+      const tools2 = await Promise.all(services.map((service) => createToolsFromService(service)));
+      setServiceTools(tools2.flat());
     });
   }, [
-    children
+    services
   ]);
+  const config = (0, import_react_client.useConfig)();
+  const functions2 = (0, import_echo.useQuery)(space, import_echo.Filter.schema(import_functions.FunctionType));
+  const tools = (0, import_react2.useMemo)(() => [
+    ...globalTools.flat(),
+    ...artifactDefinitions.flatMap((definition) => definition.tools),
+    ...serviceTools,
+    ...functions2.map((fn) => covertFunctionToTool(fn, config.values.runtime?.services?.edge?.url ?? "", space?.id)).filter(import_util.isNotNullOrUndefined)
+  ], [
+    globalTools,
+    artifactDefinitions,
+    serviceTools,
+    functions2,
+    space?.id
+  ]);
+  const systemPrompt = (0, import_react2.useMemo)(() => (0, import_artifact2.createSystemPrompt)({
+    artifacts: artifactDefinitions.map((definition) => definition.instructions)
+  }), [
+    artifactDefinitions
+  ]);
+  const processor = (0, import_react2.useMemo)(() => new ChatProcessor(aiClient, tools, {
+    space,
+    dispatch
+  }, {
+    model: "@anthropic/claude-3-5-sonnet-20241022",
+    systemPrompt
+  }), [
+    aiClient,
+    tools,
+    space,
+    dispatch,
+    systemPrompt
+  ]);
+  return processor;
+};
+var registerTriggersMutex = new import_async.Mutex();
+var useMessageQueue = (chat) => {
+  const edgeClient = (0, import_react_edge_client.useEdgeClient)();
+  const space = (0, import_echo4.getSpace)(chat);
+  const queueDxn = (0, import_react4.useMemo)(() => new import_keys2.DXN(import_keys2.DXN.kind.QUEUE, [
+    import_keys2.QueueSubspaceTags.DATA,
+    space.id,
+    chat.queue.dxn.parts.at(-1)
+  ]), [
+    chat.queue.dxn
+  ]);
+  return (0, import_react_edge_client.useQueue)(edgeClient, queueDxn);
+};
+var functions = [
+  {
+    name: "example.com/function/chess",
+    version: "0.1.0",
+    inputSchema: (0, import_echo_schema4.toJsonSchema)(import_echo_schema4.S.Struct({
+      level: import_echo_schema4.S.Number.annotations({
+        [import_echo_schema4.AST.TitleAnnotationId]: "Level"
+      })
+    }))
+  },
+  {
+    name: "example.com/function/forex",
+    version: "0.1.0",
+    binding: "FOREX",
+    inputSchema: (0, import_echo_schema4.toJsonSchema)(import_echo_schema4.S.Struct({
+      from: import_echo_schema4.S.String.annotations({
+        [import_echo_schema4.AST.TitleAnnotationId]: "Currency from"
+      }),
+      to: import_echo_schema4.S.String.annotations({
+        [import_echo_schema4.AST.TitleAnnotationId]: "Currency to"
+      })
+    }))
+  }
+];
+var MockServiceRegistry = class {
+  async queryServices(query) {
+    return TEST_SERVICES;
+  }
+};
+var AMADEUS_AUTH = {
+  type: "oauth",
+  clientId: "BOEnpLd1sMyKjAPGKYeAPFFy60u53QEG",
+  clientSecret: "n4qldSN7usvD57gm",
+  tokenUrl: "https://test.api.amadeus.com/v1/security/oauth2/token",
+  grantType: "client_credentials"
+};
+var VISUAL_CROSSING_CREDENTIALS = {
+  type: "api-key",
+  key: "FDPRVS953KB4GQQLD25GRT975",
+  placement: {
+    type: "query",
+    name: "key"
+  }
+};
+var TEST_SERVICES = [
+  (0, import_echo_schema5.createStatic)(import_chunk_GB7245FH.ServiceType, {
+    serviceId: "amadeus.com/service/FlightSearch",
+    name: "Amadeus Flight Search",
+    description: "Search for local and international flights.",
+    category: "travel",
+    interfaces: [
+      {
+        kind: "api",
+        schemaUrl: "https://api.apis.guru/v2/specs/amadeus.com/amadeus-flight-availabilities-search/1.0.2/swagger.json",
+        authorization: AMADEUS_AUTH
+      }
+    ]
+  }),
+  (0, import_echo_schema5.createStatic)(import_chunk_GB7245FH.ServiceType, {
+    serviceId: "amadeus.com/service/HotelSearch",
+    name: "Amadeus Hotel Search",
+    description: "Search for local and international hotels.",
+    category: "travel",
+    interfaces: [
+      {
+        kind: "api",
+        schemaUrl: "https://api.apis.guru/v2/specs/amadeus.com/amadeus-hotel-search/3.0.8/swagger.json",
+        authorization: AMADEUS_AUTH
+      }
+    ]
+  }),
+  (0, import_echo_schema5.createStatic)(import_chunk_GB7245FH.ServiceType, {
+    serviceId: "visualcrossing.com/service/Weather",
+    name: "Visual Crossing Weather",
+    description: "Search for global weather forecasts.",
+    category: "weather",
+    interfaces: [
+      {
+        kind: "api",
+        schemaUrl: "https://api.apis.guru/v2/specs/visualcrossing.com/weather/4.6/openapi.json",
+        authorization: VISUAL_CROSSING_CREDENTIALS
+      }
+    ]
+  }),
+  // TODO(burdon): Needs auth.
+  (0, import_echo_schema5.createStatic)(import_chunk_GB7245FH.ServiceType, {
+    serviceId: "abstractapi.com/service/GeoLocation",
+    name: "Abstract GeoLocation",
+    description: "Get the location of any IP address.",
+    category: "geolocation",
+    interfaces: [
+      {
+        kind: "api",
+        schemaUrl: "https://api.apis.guru/v2/specs/abstractapi.com/geolocation/1.0.0/openapi.json"
+      }
+    ]
+  }),
+  //
+  // Testing
+  //
+  ...Array.from({
+    length: 20
+  }, (_, i) => (0, import_echo_schema5.createStatic)(import_chunk_GB7245FH.ServiceType, {
+    serviceId: `example.com/service/test-${i}`,
+    name: `Test ${i}`,
+    description: `Test ${i}`,
+    category: Object.keys(import_chunk_GB7245FH.categoryIcons)[Math.floor(Math.random() * Object.keys(import_chunk_GB7245FH.categoryIcons).length)],
+    interfaces: [
+      {
+        kind: "api",
+        schemaUrl: "https://petstore.swagger.io/v2/swagger.json"
+      }
+    ]
+  }))
+];
+var useServices = (space, query) => {
+  const registry = (0, import_react5.useMemo)(() => new MockServiceRegistry(), []);
+  const [services, setServices] = (0, import_react5.useState)([]);
   (0, import_react5.useEffect)(() => {
-    (0, import_invariant6.invariant)(containerRef.current, void 0, {
-      F: __dxlog_file4,
-      L: 62,
-      S: void 0,
-      A: [
-        "containerRef.current",
-        ""
-      ]
+    const t = setTimeout(async () => {
+      const services2 = await registry.queryServices(query);
+      setServices(services2);
     });
-    const handleScrollEnd = () => {
-      autoScrollRef.current = false;
-    };
-    containerRef.current.addEventListener("scrollend", handleScrollEnd);
-    return () => containerRef.current?.removeEventListener("scrollend", handleScrollEnd);
-  }, []);
-  const handleScroll = (0, import_react5.useCallback)((ev) => {
-    if (autoScrollRef.current) {
-      return;
-    }
-    const { scrollTop, clientHeight, scrollHeight } = ev.currentTarget;
-    const sticky2 = scrollTop + clientHeight >= scrollHeight;
-    setSticky(sticky2);
-  }, []);
-  return /* @__PURE__ */ import_react5.default.createElement("div", {
-    ref: containerRef,
-    onScroll: handleScroll,
-    className: (0, import_react_ui_theme2.mx)("flex flex-col grow overflow-y-scroll scrollbar-none", classNames)
-  }, children);
-});
+    return () => clearTimeout(t);
+  }, [
+    query,
+    registry
+  ]);
+  return services;
+};
 var emptyLines = [];
 var StatusLine = ({ classNames, line = -1, lines = emptyLines, transition = 300, advance = 1e3, autoAdvance }) => {
-  const containerRef = (0, import_react7.useRef)(null);
-  const [currentLine, setCurrentLine] = (0, import_react7.useState)(line);
-  (0, import_react7.useEffect)(() => {
+  const containerRef = (0, import_react8.useRef)(null);
+  const [currentLine, setCurrentLine] = (0, import_react8.useState)(line);
+  (0, import_react8.useEffect)(() => {
     setCurrentLine(line);
   }, [
     line
   ]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (!autoAdvance) {
       return;
     }
     const next = () => {
       setCurrentLine((prev) => {
-        if (prev === lines.length - 1) {
+        if (prev >= lines.length - 1) {
           clearInterval(interval);
           return prev;
         }
@@ -845,7 +971,7 @@ var StatusLine = ({ classNames, line = -1, lines = emptyLines, transition = 300,
     autoAdvance,
     advance
   ]);
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     if (containerRef.current) {
       containerRef.current.style.transition = `transform ${transition}ms ease-in-out`;
       containerRef.current.style.transform = `translateY(-${currentLine * 24}px)`;
@@ -853,27 +979,118 @@ var StatusLine = ({ classNames, line = -1, lines = emptyLines, transition = 300,
   }, [
     currentLine
   ]);
-  return /* @__PURE__ */ import_react7.default.createElement("div", {
-    className: (0, import_react_ui_theme4.mx)("relative h-[24px] overflow-hidden", classNames)
-  }, /* @__PURE__ */ import_react7.default.createElement("div", {
+  return /* @__PURE__ */ import_react8.default.createElement("div", {
+    className: (0, import_react_ui_theme3.mx)("relative h-[24px] overflow-hidden", classNames)
+  }, /* @__PURE__ */ import_react8.default.createElement("div", {
     ref: containerRef,
     className: "h-[24px]"
-  }, /* @__PURE__ */ import_react7.default.createElement("div", {
+  }, /* @__PURE__ */ import_react8.default.createElement("div", {
     className: "flex flex-col"
-  }, lines.map((line2, i) => /* @__PURE__ */ import_react7.default.createElement("div", {
+  }, lines.map((line2, i) => /* @__PURE__ */ import_react8.default.createElement("div", {
     key: i,
-    className: (0, import_react_ui_theme4.mx)("flex h-[24px] items-center")
-  }, /* @__PURE__ */ import_react7.default.createElement("span", {
+    className: (0, import_react_ui_theme3.mx)("flex h-[24px] items-center")
+  }, /* @__PURE__ */ import_react8.default.createElement("span", {
     className: "truncate"
   }, line2))))));
 };
-var ToggleContainer = ({ title, icon, toggle, defaultOpen, duration = 400, shrinkX = false, children, classNames }) => {
-  const [expand, setExpand] = (0, import_react8.useState)(defaultOpen || !toggle);
-  const [expandX, setExpandX] = (0, import_react8.useState)(shrinkX ? expand : true);
-  const [expandY, setExpandY] = (0, import_react8.useState)(expand);
-  (0, import_react8.useEffect)(() => {
+var numbers = [
+  {
+    regular: "ph--number-circle-zero--thin",
+    active: "ph--number-circle-zero--duotone"
+  },
+  {
+    regular: "ph--number-circle-one--thin",
+    active: "ph--number-circle-one--duotone"
+  },
+  {
+    regular: "ph--number-circle-two--thin",
+    active: "ph--number-circle-two--duotone"
+  },
+  {
+    regular: "ph--number-circle-three--thin",
+    active: "ph--number-circle-three--duotone"
+  },
+  {
+    regular: "ph--number-circle-four--thin",
+    active: "ph--number-circle-four--duotone"
+  },
+  {
+    regular: "ph--number-circle-five--thin",
+    active: "ph--number-circle-five--duotone"
+  },
+  {
+    regular: "ph--number-circle-six--thin",
+    active: "ph--number-circle-six--duotone"
+  },
+  {
+    regular: "ph--number-circle-seven--thin",
+    active: "ph--number-circle-seven--duotone"
+  },
+  {
+    regular: "ph--number-circle-eight--thin",
+    active: "ph--number-circle-eight--duotone"
+  },
+  {
+    regular: "ph--number-circle-nine--thin",
+    active: "ph--number-circle-nine--duotone"
+  }
+];
+var Tabs = /* @__PURE__ */ (0, import_react9.forwardRef)(({ classNames, length, selected = 0, onSelect }, forwardedRef) => {
+  return /* @__PURE__ */ import_react9.default.createElement("div", {
+    ref: forwardedRef,
+    className: (0, import_react_ui_theme4.mx)("flex flex-col overflow-hidden outline-none", classNames),
+    tabIndex: -1,
+    onKeyDown: (ev) => {
+      switch (ev.key) {
+        case "ArrowDown":
+        case "ArrowRight": {
+          ev.preventDefault();
+          ev.stopPropagation();
+          if (selected < length - 1) {
+            onSelect?.(selected + 1);
+          }
+          break;
+        }
+        case "ArrowUp":
+        case "ArrowLeft": {
+          ev.preventDefault();
+          ev.stopPropagation();
+          if (selected > 0) {
+            onSelect?.(selected - 1);
+          }
+          break;
+        }
+        case "Enter": {
+          ev.preventDefault();
+          ev.stopPropagation();
+          onSelect?.(selected);
+          break;
+        }
+      }
+    }
+  }, Array.from({
+    length
+  }).map((_, i) => {
+    const icon = numbers[i + 1];
+    return /* @__PURE__ */ import_react9.default.createElement("div", {
+      key: i,
+      className: (0, import_react_ui_theme4.mx)("relative flex w-[24px] h-[28px] justify-center cursor-pointer text-subdued", selected === i && "!text-cyan-550 !dark:text-cyan-300")
+    }, i < length - 1 && /* @__PURE__ */ import_react9.default.createElement("div", {
+      className: "absolute left-[11.5px] top-[21px] w-[1px] h-[10px] bg-neutral-400"
+    }), /* @__PURE__ */ import_react9.default.createElement(import_react_ui3.Icon, {
+      icon: selected === i ? icon.regular : icon.regular,
+      classNames: "z-10 !p-0 !w-[24px] !h-[24px] outline-none",
+      onClick: () => onSelect?.(i)
+    }));
+  }));
+});
+var ToggleContainer = ({ classNames, title, icon, open: _open, duration = 400, shrinkX = false, children, onChangeOpen }) => {
+  const [open, setOpen] = (0, import_react_ui4.useControlledState)(_open);
+  const [expandX, setExpandX] = (0, import_react10.useState)(shrinkX ? open : true);
+  const [expandY, setExpandY] = (0, import_react10.useState)(open);
+  (0, import_react10.useEffect)(() => {
     let t;
-    if (expand) {
+    if (open) {
       if (shrinkX) {
         setExpandX(true);
       }
@@ -890,16 +1107,23 @@ var ToggleContainer = ({ title, icon, toggle, defaultOpen, duration = 400, shrin
     }
     return () => clearTimeout(t);
   }, [
-    expand
+    open
   ]);
-  return /* @__PURE__ */ import_react8.default.createElement("div", {
+  const handleToggle = () => {
+    if (onChangeOpen) {
+      onChangeOpen(!open);
+    } else {
+      setOpen((open2) => !open2);
+    }
+  };
+  return /* @__PURE__ */ import_react10.default.createElement("div", {
     className: (0, import_react_ui_theme5.mx)("overflow-hidden", classNames)
-  }, title && /* @__PURE__ */ import_react8.default.createElement("div", {
+  }, title && /* @__PURE__ */ import_react10.default.createElement("div", {
     className: "flex gap-1 py-1 items-center text-sm text-subdued cursor-pointer select-none",
-    onClick: toggle ? () => setExpand((open) => !open) : void 0
-  }, toggle && /* @__PURE__ */ import_react8.default.createElement("div", {
+    onClick: handleToggle
+  }, /* @__PURE__ */ import_react10.default.createElement("div", {
     className: "flex w-[24px] h-[24px] items-center justify-center"
-  }, /* @__PURE__ */ import_react8.default.createElement(import_react_ui3.Icon, {
+  }, /* @__PURE__ */ import_react10.default.createElement(import_react_ui4.Icon, {
     size: 4,
     icon: "ph--caret-right--regular",
     style: {
@@ -907,63 +1131,63 @@ var ToggleContainer = ({ title, icon, toggle, defaultOpen, duration = 400, shrin
     },
     classNames: [
       "transition transition-transform ease-in-out",
-      expand ? "rotate-90" : "transform-none"
+      open ? "rotate-90" : "transform-none"
     ]
-  })), /* @__PURE__ */ import_react8.default.createElement("div", {
+  })), /* @__PURE__ */ import_react10.default.createElement("div", {
     className: "flex-1 pis-1 pie-1 truncate"
-  }, title), icon), /* @__PURE__ */ import_react8.default.createElement("div", {
+  }, title), icon), /* @__PURE__ */ import_react10.default.createElement("div", {
     style: {
       transitionDuration: `${duration}ms`
     },
     className: (0, import_react_ui_theme5.mx)("grid transition-[grid-template-columns] ease-in-out", expandX ? "grid-cols-[1fr]" : "grid-cols-[0fr]")
-  }, /* @__PURE__ */ import_react8.default.createElement("div", {
+  }, /* @__PURE__ */ import_react10.default.createElement("div", {
     className: "overflow-hidden"
-  }, /* @__PURE__ */ import_react8.default.createElement("div", {
+  }, /* @__PURE__ */ import_react10.default.createElement("div", {
     style: {
       transitionDuration: `${duration}ms`
     },
     className: (0, import_react_ui_theme5.mx)("grid transition-[grid-template-rows] ease-in-out", expandY ? "grid-rows-[1fr]" : "grid-rows-[0fr]")
-  }, /* @__PURE__ */ import_react8.default.createElement("div", {
+  }, /* @__PURE__ */ import_react10.default.createElement("div", {
     className: (0, import_react_ui_theme5.mx)("flex overflow-hidden transition-opacity")
   }, children)))));
 };
 var MarkdownViewer = ({ classNames, content = "" }) => {
-  return /* @__PURE__ */ import_react9.default.createElement("div", {
+  return /* @__PURE__ */ import_react11.default.createElement("div", {
     className: (0, import_react_ui_theme6.mx)("space-y-2", classNames)
-  }, /* @__PURE__ */ import_react9.default.createElement(import_react_markdown.default, {
+  }, /* @__PURE__ */ import_react11.default.createElement(import_react_markdown.default, {
     components: {
-      a: ({ node, children, href, ...props }) => /* @__PURE__ */ import_react9.default.createElement("a", {
+      a: ({ node, children, href, ...props }) => /* @__PURE__ */ import_react11.default.createElement("a", {
         href,
         className: "text-primary-500 hover:text-primary-500",
         target: "_blank",
         rel: "noopener noreferrer",
         ...props
       }, children),
-      ol: ({ node, children, ...props }) => /* @__PURE__ */ import_react9.default.createElement("ol", {
+      ol: ({ node, children, ...props }) => /* @__PURE__ */ import_react11.default.createElement("ol", {
         className: "leading-tight list-decimal pl-6",
         ...(0, import_util4.omit)(props, [
           "ordered"
         ])
       }, children),
-      ul: ({ node, children, ...props }) => /* @__PURE__ */ import_react9.default.createElement("ul", {
+      ul: ({ node, children, ...props }) => /* @__PURE__ */ import_react11.default.createElement("ul", {
         className: "leading-tight list-disc pl-6",
         ...(0, import_util4.omit)(props, [
           "ordered"
         ])
       }, children),
-      li: ({ node, children, ...props }) => /* @__PURE__ */ import_react9.default.createElement("li", {
+      li: ({ node, children, ...props }) => /* @__PURE__ */ import_react11.default.createElement("li", {
         className: "",
         ...(0, import_util4.omit)(props, [
           "ordered"
         ])
       }, children),
-      blockquote: ({ node, children, ...props }) => /* @__PURE__ */ import_react9.default.createElement("blockquote", {
+      blockquote: ({ node, children, ...props }) => /* @__PURE__ */ import_react11.default.createElement("blockquote", {
         className: "border-l-4 border-primary-500 pl-4 my-4 text-primary-500",
         ...props
       }, children),
       code: ({ children, className }) => {
         const [_, language] = /language-(\w+)/.exec(className || "") || [];
-        return /* @__PURE__ */ import_react9.default.createElement(import_react_ui_syntax_highlighter2.SyntaxHighlighter, {
+        return /* @__PURE__ */ import_react11.default.createElement(import_react_ui_syntax_highlighter2.SyntaxHighlighter, {
           PreTag: "div",
           language,
           className: "p-0"
@@ -972,59 +1196,74 @@ var MarkdownViewer = ({ classNames, content = "" }) => {
     }
   }, content));
 };
-var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/components/Thread/ThreadMessage.tsx";
+var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/components/Thread/ThreadMessage.tsx";
 var ThreadMessage = ({ classNames, message, collapse, debug, onSuggest, onDelete }) => {
   if (typeof message !== "object") {
-    return /* @__PURE__ */ import_react6.default.createElement("div", {
-      className: (0, import_react_ui_theme3.mx)(classNames)
+    return /* @__PURE__ */ import_react7.default.createElement("div", {
+      className: (0, import_react_ui_theme2.mx)(classNames)
     }, message);
   }
   const { role, content = [] } = message;
-  const tools = content.filter((block) => block.type === "tool_use" || block.type === "tool_result");
-  if (collapse && tools.length > 0) {
+  const toolBlocks = content.filter((block) => block.type === "tool_use" || block.type === "tool_result");
+  if (collapse && toolBlocks.length > 0) {
     let request;
-    const lines = tools.map((tool) => {
-      switch (tool.type) {
+    const items = toolBlocks.map((block) => {
+      switch (block.type) {
         case "tool_use": {
-          request = tool;
-          return `Calling ${tool.name}...`;
+          request = block;
+          return {
+            title: `Calling ${block.name}...`,
+            block
+          };
         }
         case "tool_result": {
           if (!request) {
-            return "Error";
+            import_log6.log.warn("unexpected message", {
+              block
+            }, {
+              F: __dxlog_file4,
+              L: 54,
+              S: void 0,
+              C: (f, a) => f(...a)
+            });
+            return {
+              title: "Error",
+              block
+            };
           }
-          return `Processed ${request.name}`;
+          return {
+            title: `Processed ${request.name}`,
+            block
+          };
+        }
+        default: {
+          request = void 0;
+          return {
+            title: "Error",
+            block
+          };
         }
-        default:
-          return "Error";
       }
     });
-    return /* @__PURE__ */ import_react6.default.createElement("div", {
-      className: (0, import_react_ui_theme3.mx)("flex", classNames)
-    }, /* @__PURE__ */ import_react6.default.createElement("div", {
-      className: "w-full p-1 px-2 overflow-hidden rounded-md bg-base"
-    }, /* @__PURE__ */ import_react6.default.createElement(ToggleContainer, {
-      title: /* @__PURE__ */ import_react6.default.createElement(StatusLine, {
-        lines,
-        autoAdvance: true
-      }),
-      toggle: true
-    }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui_syntax_highlighter.Json, {
-      data: content[content.length - 1],
-      classNames: "!p-1 text-xs"
-    }))));
+    return /* @__PURE__ */ import_react7.default.createElement("div", {
+      className: (0, import_react_ui_theme2.mx)("flex", classNames)
+    }, /* @__PURE__ */ import_react7.default.createElement("div", {
+      className: "w-full p-1 px-2 overflow-hidden rounded-md bg-baseSurface"
+    }, /* @__PURE__ */ import_react7.default.createElement(TabbedContainer, {
+      items
+    })));
   }
-  return /* @__PURE__ */ import_react6.default.createElement("div", {
-    className: (0, import_react_ui_theme3.mx)("flex flex-col shrink-0 gap-2")
-  }, debug && /* @__PURE__ */ import_react6.default.createElement("div", {
+  return /* @__PURE__ */ import_react7.default.createElement("div", {
+    className: (0, import_react_ui_theme2.mx)("flex flex-col shrink-0 gap-2")
+  }, debug && /* @__PURE__ */ import_react7.default.createElement("div", {
     className: "text-xs text-subdued"
-  }, message.id, " ", onDelete && /* @__PURE__ */ import_react6.default.createElement("span", {
+  }, message.id, " ", onDelete && /* @__PURE__ */ import_react7.default.createElement("span", {
     className: "cursor-pointer underline",
     onClick: () => onDelete(message.id)
-  }, "delete")), content.map((block, idx) => /* @__PURE__ */ import_react6.default.createElement("div", {
+  }, "delete")), content.map((block, idx) => /* @__PURE__ */ import_react7.default.createElement("div", {
     key: idx,
-    className: (0, import_react_ui_theme3.mx)("flex", classNames, block.type === "text" && role === "user" && "justify-end")
-  }, /* @__PURE__ */ import_react6.default.createElement(Block, {
+    className: (0, import_react_ui_theme2.mx)("flex", classNames, block.type === "text" && role === "user" && "justify-end")
+  }, /* @__PURE__ */ import_react7.default.createElement(Block, {
     role,
     block,
     onSuggest: onSuggest ?? (() => {
@@ -1033,24 +1272,23 @@ var ThreadMessage = ({ classNames, message, collapse, debug, onSuggest, onDelete
 };
 var Block = ({ block, role, onSuggest }) => {
   const Component = componentMap[block.type] ?? componentMap.default;
-  return /* @__PURE__ */ import_react6.default.createElement("div", {
-    className: (0, import_react_ui_theme3.mx)("p-1 px-2 overflow-hidden rounded-md", (block.type !== "text" || block.disposition) && "w-full bg-base", block.type === "text" && role === "user" && "bg-blue-200 dark:bg-blue-800")
-  }, /* @__PURE__ */ import_react6.default.createElement(Component, {
+  return /* @__PURE__ */ import_react7.default.createElement("div", {
+    className: (0, import_react_ui_theme2.mx)("p-1 px-2 overflow-hidden rounded-md", (block.type !== "text" || block.disposition) && "w-full bg-baseSurface", block.type === "text" && role === "user" && "bg-primary-200 dark:bg-primary-500")
+  }, /* @__PURE__ */ import_react7.default.createElement(Component, {
     block,
     onSuggest
   }));
 };
 var titles = {
   ["cot"]: "Chain of thought",
-  // TODO(burdon): Only show if debugging.
+  ["artifact"]: "Artifact",
   ["tool_use"]: "Tool request",
-  ["tool_result"]: "Tool result",
-  ["artifact"]: "Artifact"
+  ["tool_result"]: "Tool result"
 };
 var componentMap = {
   text: ({ block }) => {
-    (0, import_invariant7.invariant)(block.type === "text", void 0, {
-      F: __dxlog_file5,
+    (0, import_invariant6.invariant)(block.type === "text", void 0, {
+      F: __dxlog_file4,
       L: 128,
       S: void 0,
       A: [
@@ -1060,23 +1298,22 @@ var componentMap = {
     });
     const title = block.disposition ? titles[block.disposition] : void 0;
     if (!title) {
-      return /* @__PURE__ */ import_react6.default.createElement(MarkdownViewer, {
+      return /* @__PURE__ */ import_react7.default.createElement(MarkdownViewer, {
         content: block.text,
         classNames: [
           block.disposition === "cot" && "text-sm text-subdued"
         ]
       });
     }
-    return /* @__PURE__ */ import_react6.default.createElement(ToggleContainer, {
+    return /* @__PURE__ */ import_react7.default.createElement(ToggleContainer, {
       title,
-      icon: block.pending ? /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Icon, {
+      icon: block.pending ? /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Icon, {
         icon: "ph--circle-notch--regular",
         classNames: "text-subdued ml-2 animate-spin",
         size: 4
       }) : void 0,
-      defaultOpen: block.disposition === "cot",
-      toggle: true
-    }, /* @__PURE__ */ import_react6.default.createElement(MarkdownViewer, {
+      open: block.disposition === "cot"
+    }, /* @__PURE__ */ import_react7.default.createElement(MarkdownViewer, {
       content: block.text,
       classNames: [
         block.disposition === "cot" && "text-sm text-subdued"
@@ -1084,9 +1321,9 @@ var componentMap = {
     }));
   },
   json: ({ block, onSuggest }) => {
-    (0, import_invariant7.invariant)(block.type === "json", void 0, {
-      F: __dxlog_file5,
-      L: 153,
+    (0, import_invariant6.invariant)(block.type === "json", void 0, {
+      F: __dxlog_file4,
+      L: 152,
       S: void 0,
       A: [
         "block.type === 'json'",
@@ -1096,23 +1333,22 @@ var componentMap = {
     switch (block.disposition) {
       case "suggest": {
         const { text = "" } = (0, import_util3.safeParseJson)(block.json ?? "{}") ?? {};
-        return /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Button, {
+        return /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Button, {
           onClick: () => onSuggest(text)
         }, text);
       }
       case "select": {
         const { options = [] } = (0, import_util3.safeParseJson)(block.json ?? "{}") ?? {};
-        return /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.ButtonGroup, null, options.map((option) => /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Button, {
+        return /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.ButtonGroup, null, options.map((option) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Button, {
           key: option,
           onClick: () => onSuggest(option)
         }, option)));
       }
       default: {
         const title = block.disposition ? titles[block.disposition] : void 0;
-        return /* @__PURE__ */ import_react6.default.createElement(ToggleContainer, {
-          title: title ?? "JSON",
-          toggle: true
-        }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui_syntax_highlighter.Json, {
+        return /* @__PURE__ */ import_react7.default.createElement(ToggleContainer, {
+          title: title ?? "JSON"
+        }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_syntax_highlighter.Json, {
           data: (0, import_util3.safeParseJson)(block.json ?? block),
           classNames: "!p-1 text-xs"
         }));
@@ -1124,20 +1360,57 @@ var componentMap = {
     if (block.type === "tool_use") {
       title = `Tool [${block.name}]`;
     }
-    return /* @__PURE__ */ import_react6.default.createElement(ToggleContainer, {
-      title: title ?? "JSON",
-      toggle: true
-    }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui_syntax_highlighter.Json, {
+    return /* @__PURE__ */ import_react7.default.createElement(ToggleContainer, {
+      title: title ?? "JSON"
+    }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_syntax_highlighter.Json, {
       data: block,
       classNames: "!p-1 text-xs"
     }));
   }
 };
+var TabbedContainer = ({ items }) => {
+  const lines = items.map((item) => item.title);
+  const tabsRef = (0, import_react7.useRef)(null);
+  const [selected, setSelected] = (0, import_react7.useState)(0);
+  const [open, setOpen] = (0, import_react7.useState)(false);
+  (0, import_react7.useEffect)(() => {
+    if (open) {
+      tabsRef.current?.focus();
+    }
+  }, [
+    open
+  ]);
+  const handleSelect = (index) => {
+    if (index === selected) {
+      setOpen(false);
+    } else {
+      setSelected(index);
+    }
+  };
+  return /* @__PURE__ */ import_react7.default.createElement(ToggleContainer, {
+    title: /* @__PURE__ */ import_react7.default.createElement(StatusLine, {
+      lines,
+      autoAdvance: true
+    }),
+    open,
+    onChangeOpen: setOpen
+  }, /* @__PURE__ */ import_react7.default.createElement("div", {
+    className: "flex gap-2 w-full"
+  }, /* @__PURE__ */ import_react7.default.createElement(Tabs, {
+    ref: tabsRef,
+    length: items.length,
+    selected,
+    onSelect: handleSelect
+  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_syntax_highlighter.Json, {
+    data: items[selected].block,
+    classNames: "!p-1 text-xs"
+  })));
+};
 var Thread = ({ messages, streaming, collapse, debug, onSubmit, onStop, onSuggest, onDelete }) => {
-  const { t } = (0, import_react_ui.useTranslation)(import_chunk_5VF5JKUN.AUTOMATION_PLUGIN);
-  const scroller = (0, import_react4.useRef)(null);
-  const [text, setText] = (0, import_react4.useState)("");
-  const handleKeyDown = (0, import_react4.useCallback)((ev) => {
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_EQYHOTGG.AUTOMATION_PLUGIN);
+  const scroller = (0, import_react6.useRef)(null);
+  const [text, setText] = (0, import_react6.useState)("");
+  const handleKeyDown = (0, import_react6.useCallback)((ev) => {
     switch (ev.key) {
       case "Escape": {
         setText("");
@@ -1156,7 +1429,7 @@ var Thread = ({ messages, streaming, collapse, debug, onSubmit, onStop, onSugges
   }, [
     text
   ]);
-  const { messages: lines = [] } = (0, import_react4.useMemo)(() => {
+  const { messages: lines = [] } = (0, import_react6.useMemo)(() => {
     if (!collapse) {
       return {
         messages: messages ?? []
@@ -1214,12 +1487,12 @@ var Thread = ({ messages, streaming, collapse, debug, onSubmit, onStop, onSugges
     messages,
     collapse
   ]);
-  return /* @__PURE__ */ import_react4.default.createElement("div", {
+  return /* @__PURE__ */ import_react6.default.createElement("div", {
     className: "flex flex-col grow overflow-hidden"
-  }, /* @__PURE__ */ import_react4.default.createElement(ScrollContainer, {
+  }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui_components.ScrollContainer, {
     ref: scroller,
     classNames: "py-2 gap-2 overflow-x-hidden"
-  }, lines.map((message) => /* @__PURE__ */ import_react4.default.createElement(ThreadMessage, {
+  }, lines.map((message) => /* @__PURE__ */ import_react6.default.createElement(ThreadMessage, {
     key: message.id,
     classNames: "px-4",
     message,
@@ -1227,18 +1500,18 @@ var Thread = ({ messages, streaming, collapse, debug, onSubmit, onStop, onSugges
     debug,
     onSuggest,
     onDelete
-  }))), onSubmit && /* @__PURE__ */ import_react4.default.createElement("div", {
+  }))), onSubmit && /* @__PURE__ */ import_react6.default.createElement("div", {
     className: "flex p-4 gap-3 items-center"
-  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui_sfx.Spinner, {
+  }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui_sfx.Spinner, {
     active: streaming
-  }), /* @__PURE__ */ import_react4.default.createElement(import_react_ui.Input.Root, null, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.Input.TextInput, {
+  }), /* @__PURE__ */ import_react6.default.createElement(import_react_ui.Input.Root, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui.Input.TextInput, {
     autoFocus: true,
-    classNames: "px-2 bg-base rounded",
+    classNames: "px-2 baseSurface rounded",
     placeholder: t("chat input placeholder"),
     value: text,
     onChange: (ev) => setText(ev.target.value),
     onKeyDown: handleKeyDown
-  })), onStop && /* @__PURE__ */ import_react4.default.createElement(import_react_ui.IconButton, {
+  })), onStop && /* @__PURE__ */ import_react6.default.createElement(import_react_ui.IconButton, {
     disabled: !streaming,
     classNames: (0, import_react_ui_theme.mx)("!p-1 !opacity-20 transition", streaming && "!opacity-80"),
     variant: "ghost",
@@ -1249,81 +1522,28 @@ var Thread = ({ messages, streaming, collapse, debug, onSubmit, onStop, onSugges
     iconOnly: true
   })));
 };
-var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/components/ChatContainer/ChatContainer.tsx";
+var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/plugins/experimental/plugin-automation/src/components/ChatContainer/ChatContainer.tsx";
 var ChatContainer = ({ chat, role }) => {
-  const config = (0, import_react_client.useConfig)();
-  const space = (0, import_echo.getSpace)(chat);
-  const aiClient = (0, import_app_framework.useCapability)(import_chunk_ZS5RZ7RM.AutomationCapabilities.AiClient);
-  const artifactDefinitions = (0, import_app_framework.useCapabilities)(import_app_framework.Capabilities.ArtifactDefinition);
-  const globalTools = (0, import_app_framework.useCapabilities)(import_app_framework.Capabilities.Tools);
-  const functions = (0, import_echo.useQuery)(space, import_echo.Filter.schema(import_functions.FunctionType));
-  const serviceRegistry = (0, import_react.useMemo)(() => new import_chunk_LU4HQWJD.MockServiceRegistry(), []);
-  const [serviceTools, setServiceTools] = (0, import_react.useState)([]);
-  (0, import_react.useEffect)(() => {
-    queueMicrotask(async () => {
-      const services = await serviceRegistry.queryServices({});
-      const tools2 = await Promise.all(services.map((service) => createToolsFromService(service)));
-      setServiceTools(tools2.flat());
-    });
-  }, []);
-  const tools = (0, import_react.useMemo)(() => [
-    ...globalTools.flat(),
-    ...artifactDefinitions.flatMap((definition) => definition.tools),
-    ...functions.map((fn) => covertFunctionToTool(fn, config.values.runtime?.services?.edge?.url ?? "", space?.id)).filter(import_util.isNotNullOrUndefined),
-    ...serviceTools
-  ], [
-    globalTools,
-    artifactDefinitions,
-    functions,
-    serviceTools,
-    space?.id
-  ]);
-  const systemPrompt = (0, import_react.useMemo)(() => (0, import_artifact.createSystemPrompt)({
-    artifacts: artifactDefinitions.map((definition) => definition.instructions)
-  }), [
-    artifactDefinitions
-  ]);
-  const { dispatchPromise: dispatch } = (0, import_app_framework.useIntentDispatcher)();
-  const processor = (0, import_react.useMemo)(() => new ChatProcessor(aiClient, tools, {
-    space,
-    dispatch
-  }, {
-    model: "@anthropic/claude-3-5-sonnet-20241022",
-    systemPrompt
-  }), [
-    aiClient,
-    tools,
-    space,
-    dispatch,
-    systemPrompt
-  ]);
-  const queueDxn = (0, import_react.useMemo)(() => new import_keys.DXN(import_keys.DXN.kind.QUEUE, [
-    import_keys.QueueSubspaceTags.DATA,
-    space.id,
-    chat.queue.dxn.parts.at(-1)
-  ]), [
-    chat.queue.dxn
-  ]);
-  const edgeClient = (0, import_react_edge_client.useEdgeClient)();
-  const messageQueue = (0, import_react_edge_client.useQueue)(edgeClient, queueDxn);
+  const processor = useChatProcessor(chat);
+  const messageQueue = useMessageQueue(chat);
   const messages = [
     ...messageQueue?.items ?? [],
     ...processor.messages.value
   ];
-  const handleSubmit = (0, import_react.useCallback)(async (message) => {
+  const handleSubmit = (0, import_react.useCallback)(async (text) => {
     if (processor.streaming.value) {
       await processor.cancel();
     }
     (0, import_invariant.invariant)(messageQueue, void 0, {
-      F: __dxlog_file6,
-      L: 95,
+      F: __dxlog_file5,
+      L: 25,
       S: void 0,
       A: [
         "messageQueue",
         ""
       ]
     });
-    await processor.request(message, {
+    await processor.request(text, {
       history: messageQueue.items,
       onComplete: (messages2) => messageQueue.append(messages2)
     });
@@ -1344,7 +1564,9 @@ var ChatContainer = ({ chat, role }) => {
   }, /* @__PURE__ */ import_react.default.createElement(Thread, {
     messages,
     streaming: processor.streaming.value,
+    collapse: true,
     onSubmit: handleSubmit,
+    onSuggest: handleSubmit,
     onStop: handleStop
   }));
 };
@@ -1359,6 +1581,6 @@ var ChatContainer_default = ChatContainer;
   MarkdownViewer,
   ReactSurface,
   Thread,
-  useServiceRegistry
+  useServices
 });
-//# sourceMappingURL=chunk-6VMSH4P6.cjs.map
+//# sourceMappingURL=chunk-CJGJXNY3.cjs.map