@dxos/react-ui-canvas-compute 0.7.5-labs.5f04cf6

package/dist/lib/node/index.cjs

@@ -0,0 +1,2591 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var node_exports = {};
+__export(node_exports, {
+  AndShape: () => AndShape,
+  AppendComponent: () => AppendComponent,
+  AppendShape: () => AppendShape,
+  AudioComponent: () => AudioComponent,
+  AudioShape: () => AudioShape,
+  BeaconComponent: () => BeaconComponent,
+  BeaconShape: () => BeaconShape,
+  Box: () => Box,
+  ChatShape: () => ChatShape,
+  ComputeContext: () => ComputeContext,
+  ComputeGraphController: () => ComputeGraphController,
+  ComputeShape: () => ComputeShape,
+  ComputeShapeLayout: () => ComputeShapeLayout,
+  ConstantComponent: () => ConstantComponent,
+  ConstantShape: () => ConstantShape,
+  DatabaseComponent: () => DatabaseComponent,
+  DatabaseShape: () => DatabaseShape,
+  FunctionBody: () => FunctionBody,
+  FunctionComponent: () => FunctionComponent,
+  FunctionShape: () => FunctionShape,
+  GptComponent: () => GptComponent,
+  GptRealtimeComponent: () => GptRealtimeComponent,
+  GptRealtimeShape: () => GptRealtimeShape,
+  GptShape: () => GptShape,
+  IfComponent: () => IfComponent,
+  IfElseComponent: () => IfElseComponent,
+  IfElseShape: () => IfElseShape,
+  IfShape: () => IfShape,
+  InvalidStateError: () => InvalidStateError,
+  JsonComponent: () => JsonComponent,
+  JsonShape: () => JsonShape,
+  JsonTransformComponent: () => JsonTransformComponent,
+  JsonTransformShape: () => JsonTransformShape,
+  NotShape: () => NotShape,
+  OrShape: () => OrShape,
+  QueueComponent: () => QueueComponent,
+  QueueItem: () => QueueItem,
+  QueueShape: () => QueueShape,
+  RandomComponent: () => RandomComponent,
+  RandomShape: () => RandomShape,
+  ReducerComponent: () => ReducerComponent,
+  ReducerShape: () => ReducerShape,
+  ScopeComponent: () => ScopeComponent,
+  ScopeShape: () => ScopeShape,
+  SurfaceComponent: () => SurfaceComponent,
+  SurfaceShape: () => SurfaceShape,
+  SwitchComponent: () => SwitchComponent,
+  SwitchShape: () => SwitchShape,
+  TableComponent: () => TableComponent,
+  TableShape: () => TableShape,
+  TemplateShape: () => TemplateShape,
+  TextComponent: () => TextComponent,
+  TextInputComponent: () => TextInputComponent,
+  TextShape: () => TextShape,
+  TextToImageComponent: () => TextToImageComponent,
+  TextToImageShape: () => TextToImageShape,
+  ThreadComponent: () => ThreadComponent,
+  ThreadItem: () => ThreadItem,
+  ThreadShape: () => ThreadShape,
+  TriggerComponent: () => TriggerComponent,
+  TriggerShape: () => TriggerShape,
+  TypeSelect: () => TypeSelect,
+  andShape: () => andShape,
+  appendShape: () => appendShape,
+  audioShape: () => audioShape,
+  beaconShape: () => beaconShape,
+  chatShape: () => chatShape,
+  computeShapes: () => computeShapes,
+  constantShape: () => constantShape,
+  createAnchorId: () => createAnchorId,
+  createAnd: () => createAnd,
+  createAppend: () => createAppend,
+  createAudio: () => createAudio,
+  createBeacon: () => createBeacon,
+  createChat: () => createChat,
+  createComputeGraph: () => createComputeGraph,
+  createComputeGraphController: () => createComputeGraphController,
+  createComputeNode: () => createComputeNode,
+  createConstant: () => createConstant,
+  createDatabase: () => createDatabase,
+  createFunction: () => createFunction,
+  createFunctionAnchors: () => createFunctionAnchors,
+  createGpt: () => createGpt,
+  createGptRealtime: () => createGptRealtime,
+  createIf: () => createIf,
+  createIfElse: () => createIfElse,
+  createJson: () => createJson,
+  createJsonTransform: () => createJsonTransform,
+  createNot: () => createNot,
+  createOr: () => createOr,
+  createQueue: () => createQueue,
+  createRandom: () => createRandom,
+  createReducer: () => createReducer,
+  createScope: () => createScope,
+  createShape: () => createShape,
+  createSurface: () => createSurface,
+  createSwitch: () => createSwitch,
+  createTable: () => createTable,
+  createTemplate: () => createTemplate,
+  createText: () => createText,
+  createTextToImage: () => createTextToImage,
+  createThread: () => createThread,
+  createTrigger: () => createTrigger,
+  databaseShape: () => databaseShape,
+  footerHeight: () => footerHeight,
+  functionShape: () => functionShape,
+  getHeight: () => getHeight,
+  getProperties: () => getProperties,
+  gptRealtimeShape: () => gptRealtimeShape,
+  gptShape: () => gptShape,
+  headerHeight: () => headerHeight,
+  ifElseShape: () => ifElseShape,
+  ifShape: () => ifShape,
+  isValidComputeNode: () => isValidComputeNode,
+  jsonShape: () => jsonShape,
+  jsonTransformShape: () => jsonTransformShape,
+  mapEdge: () => mapEdge,
+  notShape: () => notShape,
+  orShape: () => orShape,
+  parseAnchorId: () => parseAnchorId,
+  queueShape: () => queueShape,
+  randomShape: () => randomShape,
+  reducerShape: () => reducerShape,
+  resolveComputeNode: () => resolveComputeNode,
+  scopeShape: () => scopeShape,
+  surfaceShape: () => surfaceShape,
+  switchShape: () => switchShape,
+  tableShape: () => tableShape,
+  templateShape: () => templateShape,
+  textShape: () => textShape,
+  textToImageShape: () => textToImageShape,
+  threadShape: () => threadShape,
+  triggerShape: () => triggerShape,
+  useComputeContext: () => useComputeContext,
+  useComputeNodeState: () => useComputeNodeState,
+  useGraphMonitor: () => useGraphMonitor
+});
+module.exports = __toCommonJS(node_exports);
+var import_effect = require("effect");
+var import_async = require("@dxos/async");
+var import_conductor = require("@dxos/conductor");
+var import_context = require("@dxos/context");
+var import_log = require("@dxos/log");
+var import_conductor2 = require("@dxos/conductor");
+var import_debug = require("@dxos/debug");
+var import_echo_schema = require("@dxos/echo-schema");
+var import_invariant = require("@dxos/invariant");
+var import_react = require("react");
+var import_debug2 = require("@dxos/debug");
+var import_react2 = require("react");
+var import_echo_schema2 = require("@dxos/echo-schema");
+var import_invariant2 = require("@dxos/invariant");
+var import_react3 = require("react");
+var import_conductor3 = require("@dxos/conductor");
+var import_echo_schema3 = require("@dxos/echo-schema");
+var import_invariant3 = require("@dxos/invariant");
+var import_keys = require("@dxos/keys");
+var import_echo = require("@dxos/react-client/echo");
+var import_util = require("@dxos/util");
+var import_react_ui_canvas_editor = require("@dxos/react-ui-canvas-editor");
+var import_react4 = __toESM(require("react"));
+var import_invariant4 = require("@dxos/invariant");
+var import_react_ui = require("@dxos/react-ui");
+var import_react_ui_canvas_editor2 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_theme = require("@dxos/react-ui-theme");
+var import_react5 = __toESM(require("react"));
+var import_conductor4 = require("@dxos/conductor");
+var import_echo_schema4 = require("@dxos/echo-schema");
+var import_react_ui_canvas = require("@dxos/react-ui-canvas");
+var import_react_ui_canvas_editor3 = require("@dxos/react-ui-canvas-editor");
+var import_schema = require("@effect/schema");
+var import_conductor5 = require("@dxos/conductor");
+var import_echo_schema5 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor4 = require("@dxos/react-ui-canvas-editor");
+var import_react6 = __toESM(require("react"));
+var import_react_ui2 = require("@dxos/react-ui");
+var import_conductor6 = require("@dxos/conductor");
+var import_react7 = __toESM(require("react"));
+var import_conductor7 = require("@dxos/conductor");
+var import_echo_schema6 = require("@dxos/echo-schema");
+var import_react8 = __toESM(require("react"));
+var import_conductor8 = require("@dxos/conductor");
+var import_echo_schema7 = require("@dxos/echo-schema");
+var import_react9 = __toESM(require("react"));
+var import_echo_schema8 = require("@dxos/echo-schema");
+var import_react_ui3 = require("@dxos/react-ui");
+var import_react_ui_canvas_editor5 = require("@dxos/react-ui-canvas-editor");
+var import_react10 = __toESM(require("react"));
+var import_conductor9 = require("@dxos/conductor");
+var import_echo_schema9 = require("@dxos/echo-schema");
+var import_react_ui4 = require("@dxos/react-ui");
+var import_react_ui_canvas_editor6 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_theme2 = require("@dxos/react-ui-theme");
+var import_react11 = __toESM(require("react"));
+var import_echo_schema10 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor7 = require("@dxos/react-ui-canvas-editor");
+var import_react12 = __toESM(require("react"));
+var import_conductor10 = require("@dxos/conductor");
+var import_echo_schema11 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor8 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_canvas_editor9 = require("@dxos/react-ui-canvas-editor");
+var import_react13 = __toESM(require("react"));
+var import_conductor11 = require("@dxos/conductor");
+var import_echo_schema12 = require("@dxos/echo-schema");
+var import_react_ui5 = require("@dxos/react-ui");
+var import_react_ui_canvas_editor10 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_canvas_editor11 = require("@dxos/react-ui-canvas-editor");
+var import_util2 = require("@dxos/util");
+var import_react14 = __toESM(require("react"));
+var import_echo_schema13 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor12 = require("@dxos/react-ui-canvas-editor");
+var import_react15 = __toESM(require("react"));
+var import_conductor12 = require("@dxos/conductor");
+var import_echo_schema14 = require("@dxos/echo-schema");
+var import_react16 = __toESM(require("react"));
+var import_conductor13 = require("@dxos/conductor");
+var import_echo_schema15 = require("@dxos/echo-schema");
+var import_react17 = __toESM(require("react"));
+var import_conductor14 = require("@dxos/conductor");
+var import_echo_schema16 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor13 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_syntax_highlighter = require("@dxos/react-ui-syntax-highlighter");
+var import_react18 = __toESM(require("react"));
+var import_conductor15 = require("@dxos/conductor");
+var import_echo_schema17 = require("@dxos/echo-schema");
+var import_react19 = __toESM(require("react"));
+var import_conductor16 = require("@dxos/conductor");
+var import_echo_schema18 = require("@dxos/echo-schema");
+var import_react_ui_theme3 = require("@dxos/react-ui-theme");
+var import_react20 = __toESM(require("react"));
+var import_conductor17 = require("@dxos/conductor");
+var import_echo_schema19 = require("@dxos/echo-schema");
+var import_react_ui6 = require("@dxos/react-ui");
+var import_react_ui_canvas_editor14 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_theme4 = require("@dxos/react-ui-theme");
+var import_react21 = __toESM(require("react"));
+var import_conductor18 = require("@dxos/conductor");
+var import_echo_schema20 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor15 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_sfx = require("@dxos/react-ui-sfx");
+var import_react22 = __toESM(require("react"));
+var import_app_framework = require("@dxos/app-framework");
+var import_conductor19 = require("@dxos/conductor");
+var import_echo_schema21 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor16 = require("@dxos/react-ui-canvas-editor");
+var import_react23 = __toESM(require("react"));
+var import_conductor20 = require("@dxos/conductor");
+var import_echo_schema22 = require("@dxos/echo-schema");
+var import_react_ui7 = require("@dxos/react-ui");
+var import_react_ui_canvas_editor17 = require("@dxos/react-ui-canvas-editor");
+var import_react24 = __toESM(require("react"));
+var import_conductor21 = require("@dxos/conductor");
+var import_echo_schema23 = require("@dxos/echo-schema");
+var import_react25 = __toESM(require("react"));
+var import_conductor22 = require("@dxos/conductor");
+var import_echo_schema24 = require("@dxos/echo-schema");
+var import_invariant5 = require("@dxos/invariant");
+var import_react_ui_canvas_editor18 = require("@dxos/react-ui-canvas-editor");
+var import_react26 = __toESM(require("react"));
+var import_conductor23 = require("@dxos/conductor");
+var import_echo_schema25 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor19 = require("@dxos/react-ui-canvas-editor");
+var import_react_ui_canvas_editor20 = require("@dxos/react-ui-canvas-editor");
+var import_react27 = __toESM(require("react"));
+var import_conductor24 = require("@dxos/conductor");
+var import_echo_schema26 = require("@dxos/echo-schema");
+var import_react_ui_theme5 = require("@dxos/react-ui-theme");
+var import_react28 = __toESM(require("react"));
+var import_echo_schema27 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor21 = require("@dxos/react-ui-canvas-editor");
+var import_react29 = __toESM(require("react"));
+var import_conductor25 = require("@dxos/conductor");
+var import_echo_schema28 = require("@dxos/echo-schema");
+var import_functions = require("@dxos/functions");
+var import_echo2 = require("@dxos/react-client/echo");
+var import_react_ui8 = require("@dxos/react-ui");
+var import_react30 = __toESM(require("react"));
+var import_echo_schema29 = require("@dxos/echo-schema");
+var import_react_ui9 = require("@dxos/react-ui");
+var import_conductor26 = require("@dxos/conductor");
+var import_echo_schema30 = require("@dxos/echo-schema");
+var import_react_ui_canvas_editor22 = require("@dxos/react-ui-canvas-editor");
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-compute/src/graph/node-defs.ts";
+var resolveComputeNode = async (node) => {
+  const impl = import_conductor2.registry[node.type];
+  (0, import_invariant.invariant)(impl, `Unknown node type: ${node.type}`, {
+    F: __dxlog_file,
+    L: 22,
+    S: void 0,
+    A: [
+      "impl",
+      "`Unknown node type: ${node.type}`"
+    ]
+  });
+  return impl;
+};
+var isValidComputeNode = (type) => {
+  return nodeFactory[type] !== void 0;
+};
+var createComputeNode = (shape) => {
+  const type = shape.type ?? (0, import_debug.raise)(new Error("Type not specified"));
+  const factory = nodeFactory[type] ?? (0, import_debug.raise)(new Error(`Unknown shape type: ${type}`));
+  return factory(shape);
+};
+var nodeFactory = {
+  // System.
+  [import_conductor2.NODE_INPUT]: () => createNode(import_conductor2.NODE_INPUT),
+  [import_conductor2.NODE_OUTPUT]: () => createNode(import_conductor2.NODE_OUTPUT),
+  // Extensions.
+  ["text-to-image"]: () => createNode("text-to-image"),
+  ["and"]: () => createNode("and"),
+  ["append"]: () => createNode("append"),
+  ["audio"]: () => createNode("audio"),
+  ["beacon"]: () => createNode("beacon"),
+  ["chat"]: () => createNode("chat"),
+  ["constant"]: (shape) => createNode("constant", {
+    value: shape.value
+  }),
+  ["database"]: () => createNode("database"),
+  ["gpt"]: () => createNode("gpt"),
+  ["gpt-realtime"]: () => createNode("gpt-realtime"),
+  ["if"]: () => createNode("if"),
+  ["if-else"]: () => createNode("if-else"),
+  ["function"]: () => createNode("function"),
+  ["json"]: () => createNode("json"),
+  ["json-transform"]: () => createNode("json-transform"),
+  ["not"]: () => createNode("not"),
+  ["or"]: () => createNode("or"),
+  ["queue"]: () => createNode("queue"),
+  ["rng"]: () => createNode("rng"),
+  ["reducer"]: () => createNode("reducer"),
+  ["scope"]: () => createNode("scope"),
+  ["surface"]: () => createNode("surface"),
+  ["switch"]: () => createNode("switch"),
+  ["template"]: (shape) => {
+    const node = createNode("template", {
+      valueType: shape.valueType,
+      value: shape.text
+    });
+    node.inputSchema = (0, import_echo_schema.toJsonSchema)((0, import_conductor2.getTemplateInputSchema)(node));
+    return node;
+  },
+  ["text"]: () => createNode("text"),
+  ["thread"]: () => createNode("thread"),
+  ["trigger"]: () => createNode(import_conductor2.NODE_INPUT)
+};
+var createNode = (type, props) => ({
+  id: import_echo_schema.ObjectId.random(),
+  type,
+  ...props
+});
+var ComputeContext = (0, import_react.createContext)(null);
+var useComputeContext = () => {
+  return (0, import_react.useContext)(ComputeContext) ?? (0, import_debug2.raise)(new Error("Missing ComputeContext"));
+};
+var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-compute/src/hooks/useComputeNodeState.ts";
+var useComputeNodeState = (shape) => {
+  const { controller } = useComputeContext();
+  (0, import_invariant2.invariant)(controller, void 0, {
+    F: __dxlog_file2,
+    L: 32,
+    S: void 0,
+    A: [
+      "controller",
+      ""
+    ]
+  });
+  const [meta, setMeta] = (0, import_react2.useState)();
+  (0, import_react2.useEffect)(() => {
+    let disposed = false;
+    queueMicrotask(async () => {
+      (0, import_invariant2.invariant)(shape.node, "Node not specified", {
+        F: __dxlog_file2,
+        L: 38,
+        S: void 0,
+        A: [
+          "shape.node",
+          "'Node not specified'"
+        ]
+      });
+      const node = controller.getComputeNode(shape.node);
+      const meta2 = await controller.getMeta(node);
+      if (disposed) {
+        return;
+      }
+      setMeta(meta2);
+    });
+    return () => {
+      disposed = true;
+    };
+  }, [
+    shape.node
+  ]);
+  const evalNode = (0, import_react2.useCallback)(() => {
+    return controller.evalNode(shape.node);
+  }, [
+    shape.node
+  ]);
+  const subscribeToEventLog = (0, import_react2.useCallback)((cb) => {
+    return controller.events.on((ev) => {
+      if (ev.nodeId === shape.node) {
+        cb(ev);
+      }
+    });
+  }, [
+    shape.node
+  ]);
+  return {
+    node: controller.getComputeNode(shape.node),
+    meta: meta ?? {
+      input: import_echo_schema2.S.Struct({}),
+      output: import_echo_schema2.S.Struct({})
+    },
+    runtime: {
+      inputs: controller.getInputs(shape.node),
+      outputs: controller.getOutputs(shape.node),
+      setOutput: (property, value) => {
+        controller.setOutput(shape.node, property, value);
+      },
+      evalNode,
+      subscribeToEventLog
+    }
+  };
+};
+var __dxlog_file3 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-compute/src/hooks/useGraphMonitor.ts";
+var mapEdge = (graph, { source, target, output = import_conductor3.DEFAULT_OUTPUT, input = import_conductor3.DEFAULT_INPUT }) => {
+  const sourceNode = graph.findNode(source);
+  const targetNode = graph.findNode(target);
+  (0, import_invariant3.invariant)(sourceNode?.node, void 0, {
+    F: __dxlog_file3,
+    L: 27,
+    S: void 0,
+    A: [
+      "sourceNode?.node",
+      ""
+    ]
+  });
+  (0, import_invariant3.invariant)(targetNode?.node, void 0, {
+    F: __dxlog_file3,
+    L: 28,
+    S: void 0,
+    A: [
+      "targetNode?.node",
+      ""
+    ]
+  });
+  return {
+    id: import_echo_schema3.ObjectId.random(),
+    source: sourceNode.node,
+    target: targetNode.node,
+    output,
+    input
+  };
+};
+var useGraphMonitor = (model) => {
+  return (0, import_react3.useMemo)(() => {
+    return {
+      onCreate: ({ node }) => {
+        if (!model) {
+          return;
+        }
+        (0, import_invariant3.invariant)(node.type, void 0, {
+          F: __dxlog_file3,
+          L: 53,
+          S: void 0,
+          A: [
+            "node.type",
+            ""
+          ]
+        });
+        if (!isValidComputeNode(node.type)) {
+          return;
+        }
+        const computeNode = createComputeNode(node);
+        if (node.type === "trigger") {
+          linkTriggerToCompute(model, computeNode, node);
+        }
+        model.addNode(computeNode);
+        node.node = computeNode.id;
+      },
+      onLink: ({ graph, edge }) => {
+        if (model) {
+          model.addEdge(mapEdge(graph, edge));
+        }
+      },
+      onDelete: ({ subgraph }) => {
+        if (model) {
+          const nodeIds = subgraph.nodes.map((shape) => shape.node);
+          const edgeIds = subgraph.edges.map(({ source, target, output = import_conductor3.DEFAULT_OUTPUT, input = import_conductor3.DEFAULT_INPUT }) => {
+            return model.edges.find((computeEdge) => computeEdge.input === input && computeEdge.output === output)?.id;
+          }).filter(import_util.nonNullable);
+          model.removeNodes(nodeIds);
+          model.removeEdges(edgeIds);
+          deleteTriggerObjects(model, subgraph);
+        }
+      }
+    };
+  }, [
+    model
+  ]);
+};
+var createComputeGraph = (graph) => {
+  const computeGraph = import_conductor3.ComputeGraphModel.create();
+  if (graph) {
+    for (const shape of graph.nodes) {
+      if (isValidComputeNode(shape.type)) {
+        const node = createComputeNode(shape);
+        computeGraph.addNode(node);
+        shape.node = node.id;
+      }
+    }
+    for (const edge of graph.edges) {
+      computeGraph.addEdge(mapEdge(graph, edge));
+    }
+  }
+  return computeGraph;
+};
+var linkTriggerToCompute = (graph, computeNode, triggerData) => {
+  const functionTrigger = triggerData.functionTrigger?.target;
+  (0, import_invariant3.invariant)(functionTrigger, void 0, {
+    F: __dxlog_file3,
+    L: 116,
+    S: void 0,
+    A: [
+      "functionTrigger",
+      ""
+    ]
+  });
+  functionTrigger.function = import_keys.DXN.fromLocalObjectId(graph.root.id).toString();
+  functionTrigger.meta ??= {};
+  functionTrigger.meta.computeNodeId = computeNode.id;
+};
+var deleteTriggerObjects = (computeGraph, deleted) => {
+  const space = (0, import_echo.getSpace)(computeGraph.root);
+  if (!space) {
+    return;
+  }
+  for (const node of deleted.nodes) {
+    if (node.type === "trigger") {
+      const trigger = node;
+      space.db.remove(trigger.functionTrigger.target);
+    }
+  }
+};
+function _ts_decorate(decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+var __dxlog_file4 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-compute/src/graph/controller.ts";
+var InvalidStateError = Error;
+var AUTO_TRIGGER_NODES = [
+  "chat",
+  "switch",
+  "constant"
+];
+var createComputeGraphController = (graph, services) => {
+  const computeGraph = createComputeGraph(graph);
+  const controller = new ComputeGraphController(computeGraph);
+  controller.setServices(services ?? {});
+  return {
+    controller,
+    graph
+  };
+};
+var ComputeGraphController = class extends import_context.Resource {
+  constructor(_graph) {
+    super();
+    this._graph = _graph;
+    this._executor = new import_conductor.GraphExecutor({
+      computeNodeResolver: (node) => resolveComputeNode(node)
+    });
+    this._services = {};
+    this._forcedOutputs = {};
+    this._runtimeStateInputs = {};
+    this._runtimeStateOutputs = {};
+    this.update = new import_async.Event();
+    this.output = new import_async.Event();
+    this.events = new import_async.Event();
+  }
+  toJSON() {
+    return {
+      graph: this._graph,
+      state: {
+        inputs: this._runtimeStateInputs,
+        outputs: this._runtimeStateOutputs
+      },
+      forcedOutputs: this._forcedOutputs
+    };
+  }
+  setServices(services) {
+    Object.assign(this._services, services);
+  }
+  get graph() {
+    return this._graph;
+  }
+  get userState() {
+    return this._forcedOutputs;
+  }
+  get inputStates() {
+    return this._runtimeStateInputs;
+  }
+  get outputStates() {
+    return this._runtimeStateOutputs;
+  }
+  /**
+  * Inputs and outputs for all nodes.
+  */
+  get state() {
+    const ids = [
+      .../* @__PURE__ */ new Set([
+        ...Object.keys(this._runtimeStateInputs),
+        ...Object.keys(this._runtimeStateOutputs)
+      ])
+    ];
+    return Object.fromEntries(ids.map((id) => [
+      id,
+      {
+        node: this._graph.getNode(id),
+        input: this._runtimeStateInputs[id],
+        output: this._runtimeStateOutputs[id]
+      }
+    ]));
+  }
+  addNode(node) {
+    this._graph.addNode(node);
+  }
+  addEdge(edge) {
+    this._graph.addEdge(edge);
+  }
+  getComputeNode(nodeId) {
+    return this._graph.getNode(nodeId);
+  }
+  getInputs(nodeId) {
+    return this._runtimeStateInputs[nodeId] ?? {};
+  }
+  getOutputs(nodeId) {
+    return this._runtimeStateOutputs[nodeId] ?? {};
+  }
+  setOutput(nodeId, property, value) {
+    this._forcedOutputs[nodeId] ??= {};
+    this._forcedOutputs[nodeId][property] = value;
+    queueMicrotask(async () => {
+      try {
+        await this.exec(nodeId);
+      } catch (err) {
+        import_log.log.catch(err, void 0, {
+          F: __dxlog_file4,
+          L: 208,
+          S: this,
+          C: (f, a) => f(...a)
+        });
+      }
+    });
+  }
+  async getMeta(node) {
+    const { meta } = await resolveComputeNode(node);
+    return meta;
+  }
+  async evalNode(nodeId) {
+    const executor = this._executor.clone();
+    await executor.load(this._graph);
+    for (const [nodeId2, outputs] of Object.entries(this._forcedOutputs)) {
+      executor.setOutputs(nodeId2, import_effect.Effect.succeed((0, import_conductor.makeValueBag)(outputs)));
+    }
+    const services = this._createServiceLayer();
+    await import_effect.Effect.runPromise(import_effect.Effect.gen(this, function* () {
+      const scope = yield* import_effect.Scope.make();
+      const executable = yield* import_effect.Effect.promise(() => resolveComputeNode(this._graph.getNode(nodeId)));
+      const computingOutputs = executable.exec != null;
+      const effect = (computingOutputs ? executor.computeOutputs(nodeId) : executor.computeInputs(nodeId)).pipe(import_effect.Effect.withSpan("runGraph"), import_effect.Effect.provide(services), import_effect.Scope.extend(scope), import_effect.Effect.flatMap(computeValueBag), import_effect.Effect.withSpan("test"), import_effect.Effect.tap((values) => {
+        for (const [key, value] of Object.entries(values)) {
+          if (computingOutputs) {
+            this._onOutputComputed(nodeId, key, value);
+          } else {
+            this._onInputComputed(nodeId, key, value);
+          }
+        }
+      }));
+      yield* effect;
+      yield* import_effect.Scope.close(scope, import_effect.Exit.void);
+    }));
+    this.update.emit();
+  }
+  /**
+  * Executes the graph.
+  * @param startFromNode - Node to start from, otherwise all {@link AUTO_TRIGGER_NODES} are executed.
+  */
+  async exec(startFromNode) {
+    this._runtimeStateInputs = {};
+    this._runtimeStateOutputs = {};
+    const executor = this._executor.clone();
+    await executor.load(this._graph);
+    for (const [nodeId, outputs] of Object.entries(this._forcedOutputs)) {
+      executor.setOutputs(nodeId, import_effect.Effect.succeed((0, import_conductor.makeValueBag)(outputs)));
+    }
+    const triggerNodes = startFromNode != null ? [
+      this._graph.getNode(startFromNode)
+    ] : this._graph.nodes.filter((node) => node.type != null && AUTO_TRIGGER_NODES.includes(node.type));
+    const allAffectedNodes = [
+      ...new Set(triggerNodes.flatMap((node) => executor.getAllDependantNodes(node.id)))
+    ];
+    const services = this._createServiceLayer();
+    await import_effect.Effect.runPromise(import_effect.Effect.gen(this, function* () {
+      const scope = yield* import_effect.Scope.make();
+      const tasks = [];
+      for (const node of allAffectedNodes) {
+        const executable = yield* import_effect.Effect.promise(() => resolveComputeNode(this._graph.getNode(node)));
+        const computingOutputs = executable.exec != null;
+        const effect = (computingOutputs ? executor.computeOutputs(node) : executor.computeInputs(node)).pipe(import_effect.Effect.withSpan("runGraph"), import_effect.Effect.provide(services), import_effect.Scope.extend(scope), import_effect.Effect.flatMap(computeValueBag), import_effect.Effect.withSpan("test"), import_effect.Effect.tap((values) => {
+          for (const [key, value] of Object.entries(values)) {
+            if (computingOutputs) {
+              this._onOutputComputed(node, key, value);
+            } else {
+              this._onInputComputed(node, key, value);
+            }
+          }
+        }));
+        tasks.push(effect);
+      }
+      yield* import_effect.Effect.all(tasks);
+      yield* import_effect.Scope.close(scope, import_effect.Exit.void);
+    }));
+    this.update.emit();
+  }
+  _createServiceLayer() {
+    const services = {
+      ...DEFAULT_SERVICES,
+      ...this._services
+    };
+    const logLayer = import_effect.Layer.succeed(import_conductor.EventLogger, this._createLogger());
+    const gptLayer = import_effect.Layer.succeed(import_conductor.GptService, services.gpt);
+    const queueLayer = services.edgeHttpClient != null ? import_conductor.QueueService.fromClient(services.edgeHttpClient) : import_conductor.QueueService.notAvailable;
+    const spaceLayer = services.spaceService != null ? import_effect.Layer.succeed(import_conductor.SpaceService, services.spaceService) : import_conductor.SpaceService.empty;
+    return import_effect.Layer.mergeAll(logLayer, gptLayer, queueLayer, spaceLayer);
+  }
+  _createLogger() {
+    return {
+      log: (event) => {
+        this._handleEvent(event);
+      },
+      nodeId: void 0
+    };
+  }
+  _handleEvent(event) {
+    (0, import_log.log)("handleEvent", {
+      event
+    }, {
+      F: __dxlog_file4,
+      L: 351,
+      S: this,
+      C: (f, a) => f(...a)
+    });
+    switch (event.type) {
+      case "compute-input": {
+        this._onInputComputed(event.nodeId, event.property, {
+          type: "executed",
+          value: event.value
+        });
+        break;
+      }
+      case "compute-output": {
+        this._onOutputComputed(event.nodeId, event.property, {
+          type: "executed",
+          value: event.value
+        });
+        break;
+      }
+    }
+    this.events.emit(event);
+  }
+  _onInputComputed(nodeId, property, value) {
+    this._runtimeStateInputs[nodeId] ??= {};
+    this._runtimeStateInputs[nodeId][property] = value;
+  }
+  _onOutputComputed(nodeId, property, value) {
+    this._runtimeStateOutputs[nodeId] ??= {};
+    this._runtimeStateOutputs[nodeId][property] = value;
+    this.output.emit({
+      nodeId,
+      property,
+      value
+    });
+  }
+};
+_ts_decorate([
+  import_async.synchronized
+], ComputeGraphController.prototype, "exec", null);
+var DEFAULT_SERVICES = {
+  gpt: new import_conductor.MockGpt()
+};
+var computeValueBag = (bag) => {
+  return import_effect.Effect.all(Object.entries(bag.values).map(([key, eff]) => import_effect.Effect.either(eff).pipe(import_effect.Effect.map((value) => {
+    if (import_effect.Either.isLeft(value)) {
+      if ((0, import_conductor.isNotExecuted)(value.left)) {
+        return [
+          key,
+          {
+            type: "not-executed"
+          }
+        ];
+      } else {
+        return [
+          key,
+          {
+            type: "error",
+            error: value.left
+          }
+        ];
+      }
+    } else {
+      return [
+        key,
+        {
+          type: "executed",
+          value: value.right
+        }
+      ];
+    }
+  })))).pipe(import_effect.Effect.map((entries) => Object.fromEntries(entries)));
+};
+var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-compute/src/shapes/common/Box.tsx";
+var headerHeight = 32;
+var footerHeight = 32;
+var Box = /* @__PURE__ */ (0, import_react4.forwardRef)(({ children, classNames, shape, title, status, open, onAction }, forwardedRef) => {
+  (0, import_invariant4.invariant)(shape.type, void 0, {
+    F: __dxlog_file5,
+    L: 30,
+    S: void 0,
+    A: [
+      "shape.type",
+      ""
+    ]
+  });
+  const { icon, name, openable } = (0, import_react_ui_canvas_editor2.useShapeDef)(shape.type) ?? {
+    icon: "ph--placeholder--regular"
+  };
+  const { debug } = (0, import_react_ui_canvas_editor2.useEditorContext)();
+  return /* @__PURE__ */ import_react4.default.createElement("div", {
+    ref: forwardedRef,
+    className: "flex flex-col h-full w-full justify-between"
+  }, /* @__PURE__ */ import_react4.default.createElement("div", {
+    className: "flex shrink-0 w-full justify-between items-center h-[32px] bg-hoverSurface"
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.Icon, {
+    icon,
+    classNames: "mx-2"
+  }), /* @__PURE__ */ import_react4.default.createElement("div", {
+    className: "grow text-sm truncate"
+  }, debug ? shape.type : name ?? shape.text ?? title), /* @__PURE__ */ import_react4.default.createElement(import_react_ui.IconButton, {
+    classNames: "p-1 text-green-500",
+    variant: "ghost",
+    icon: "ph--play--regular",
+    size: 4,
+    label: "run",
+    iconOnly: true,
+    onDoubleClick: (ev) => ev.stopPropagation(),
+    onClick: (ev) => {
+      ev.stopPropagation();
+      onAction?.("run");
+    }
+  })), /* @__PURE__ */ import_react4.default.createElement("div", {
+    className: (0, import_react_ui_theme.mx)("flex flex-col h-full grow overflow-hidden", classNames)
+  }, children), /* @__PURE__ */ import_react4.default.createElement("div", {
+    className: "flex shrink-0 w-full justify-between items-center h-[32px] bg-hoverSurface"
+  }, /* @__PURE__ */ import_react4.default.createElement("div", {
+    className: "grow px-2 text-sm truncate"
+  }, debug ? shape.id : status), openable && /* @__PURE__ */ import_react4.default.createElement(import_react_ui.IconButton, {
+    classNames: "p-1",
+    variant: "ghost",
+    icon: open ? "ph--caret-up--regular" : "ph--caret-down--regular",
+    size: 4,
+    label: open ? "close" : "open",
+    iconOnly: true,
+    onClick: (ev) => {
+      ev.stopPropagation();
+      onAction?.(open ? "close" : "open");
+    }
+  })));
+});
+var getProperties = (ast) => import_schema.AST.getPropertySignatures(ast).map(({ name }) => ({
+  name: name.toString()
+}));
+var createAnchorId = (kind, property = kind === "input" ? import_conductor5.DEFAULT_INPUT : import_conductor5.DEFAULT_OUTPUT) => [
+  kind,
+  property
+].join(".");
+var parseAnchorId = (id) => {
+  const parts = id.match(/(input|output)\.(.+)/);
+  return parts ? parts.slice(1) : [
+    void 0,
+    id
+  ];
+};
+var ComputeShape = import_echo_schema5.S.extend(import_react_ui_canvas_editor4.Polygon, import_echo_schema5.S.Struct({
+  // TODO(burdon): Rename computeNode?
+  node: import_echo_schema5.S.optional(import_echo_schema5.ObjectId.annotations({
+    [import_schema.AST.DescriptionAnnotationId]: "Compute node id"
+  }))
+}).pipe(import_echo_schema5.S.mutable));
+var createShape = ({ id, ...rest }) => {
+  return {
+    id: id ?? import_echo_schema5.ObjectId.random(),
+    ...rest
+  };
+};
+var bodyPadding = 8;
+var expandedHeight = 200;
+var FunctionBody = ({ shape, name, content, inputSchema = import_conductor4.VoidInput, outputSchema = import_conductor4.VoidOutput, ...props }) => {
+  const { scale } = (0, import_react_ui_canvas.useCanvasContext)();
+  const rootRef = (0, import_react5.useRef)(null);
+  const [open, setOpen] = (0, import_react5.useState)(false);
+  const handleAction = (action) => {
+    if (!rootRef.current) {
+      return;
+    }
+    switch (action) {
+      case "open": {
+        const el = (0, import_react_ui_canvas_editor3.getParentShapeElement)(rootRef.current, shape.id);
+        const { height } = el.getBoundingClientRect();
+        el.style.height = `${height / scale + expandedHeight}px`;
+        setOpen(true);
+        break;
+      }
+      case "close": {
+        const el = (0, import_react_ui_canvas_editor3.getParentShapeElement)(rootRef.current, shape.id);
+        el.style.height = "";
+        setOpen(false);
+        break;
+      }
+    }
+  };
+  const inputs = getProperties(inputSchema.ast);
+  const outputs = getProperties(outputSchema.ast);
+  const columnCount = inputs.length && outputs.length ? 2 : 1;
+  return /* @__PURE__ */ import_react5.default.createElement(Box, {
+    ref: rootRef,
+    shape,
+    title: name,
+    classNames: "divide-y divide-separator",
+    open,
+    onAction: handleAction,
+    ...props
+  }, /* @__PURE__ */ import_react5.default.createElement("div", {
+    className: `grid grid-cols-${columnCount} items-center`,
+    style: {
+      paddingTop: bodyPadding,
+      paddingBottom: bodyPadding
+    }
+  }, (inputs?.length ?? 0) > 0 && /* @__PURE__ */ import_react5.default.createElement("div", {
+    className: "flex flex-col"
+  }, inputs?.map(({ name: name2 }) => /* @__PURE__ */ import_react5.default.createElement("div", {
+    key: name2,
+    className: "px-2 truncate text-sm font-mono items-center",
+    style: {
+      height: import_react_ui_canvas_editor3.rowHeight
+    }
+  }, name2))), (outputs?.length ?? 0) > 0 && /* @__PURE__ */ import_react5.default.createElement("div", {
+    className: "flex flex-col"
+  }, outputs?.map(({ name: name2 }) => /* @__PURE__ */ import_react5.default.createElement("div", {
+    key: name2,
+    className: "px-2 truncate text-sm font-mono items-center text-right",
+    style: {
+      height: import_react_ui_canvas_editor3.rowHeight
+    }
+  }, name2)))), open && /* @__PURE__ */ import_react5.default.createElement("div", {
+    className: "flex flex-col grow overflow-hidden"
+  }, content));
+};
+var getHeight = (input) => {
+  const properties = import_echo_schema4.AST.getPropertySignatures(input.ast);
+  return headerHeight + footerHeight + bodyPadding * 2 + properties.length * import_react_ui_canvas_editor3.rowHeight + 2;
+};
+var createFunctionAnchors = (shape, input = import_conductor4.VoidInput, output = import_conductor4.VoidOutput) => {
+  const inputs = import_echo_schema4.AST.getPropertySignatures(input.ast).map(({ name }) => createAnchorId("input", name.toString()));
+  const outputs = import_echo_schema4.AST.getPropertySignatures(output.ast).map(({ name }) => createAnchorId("output", name.toString()));
+  return (0, import_react_ui_canvas_editor3.createAnchors)({
+    shape,
+    inputs,
+    outputs,
+    center: {
+      x: 0,
+      y: (headerHeight - footerHeight) / 2 + 1
+    }
+  });
+};
+var TypeSelect = ({ value, onValueChange }) => {
+  return /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.Root, {
+    value,
+    onValueChange
+  }, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.TriggerButton, {
+    variant: "ghost",
+    classNames: "w-full !px-0"
+  }), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.Portal, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.Content, null, /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.ScrollUpButton, null), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.Viewport, null, import_conductor6.ComputeValueType.literals.map((type) => /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.Option, {
+    key: type,
+    value: type
+  }, type))), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.ScrollDownButton, null), /* @__PURE__ */ import_react6.default.createElement(import_react_ui2.Select.Arrow, null))));
+};
+var ReducerShape = import_echo_schema6.S.extend(ComputeShape, import_echo_schema6.S.Struct({
+  type: import_echo_schema6.S.Literal("reducer")
+}));
+var ReducerComponent = ({ shape }) => {
+  return /* @__PURE__ */ import_react7.default.createElement(FunctionBody, {
+    shape,
+    inputSchema: import_conductor7.ReducerInput,
+    outputSchema: import_conductor7.ReducerOutput
+  });
+};
+var createReducer = ({ id, size = {
+  width: 192,
+  height: getHeight(import_conductor7.ReducerInput)
+}, ...rest }) => createShape({
+  type: "reducer",
+  size,
+  ...rest
+});
+var reducerShape = {
+  type: "reducer",
+  name: "Reducer",
+  icon: "ph--repeat--regular",
+  component: (props) => /* @__PURE__ */ import_react7.default.createElement(ReducerComponent, props),
+  createShape: createReducer,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor7.ReducerInput, import_conductor7.ReducerOutput)
+};
+var AppendShape = import_echo_schema7.S.extend(ComputeShape, import_echo_schema7.S.Struct({
+  type: import_echo_schema7.S.Literal("append")
+}));
+var createAppend = (props) => createShape({
+  type: "append",
+  size: {
+    width: 128,
+    height: getHeight(import_conductor8.AppendInput)
+  },
+  ...props
+});
+var AppendComponent = ({ shape }) => {
+  return /* @__PURE__ */ import_react8.default.createElement(FunctionBody, {
+    shape,
+    inputSchema: import_conductor8.AppendInput
+  });
+};
+var appendShape = {
+  type: "append",
+  name: "Append",
+  icon: "ph--list-plus--regular",
+  component: AppendComponent,
+  createShape: createAppend,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor8.AppendInput)
+};
+var AudioShape = import_echo_schema8.S.extend(ComputeShape, import_echo_schema8.S.Struct({
+  type: import_echo_schema8.S.Literal("audio")
+}));
+var createAudio = (props) => createShape({
+  type: "audio",
+  size: {
+    width: 64,
+    height: 64
+  },
+  ...props
+});
+var AudioComponent = ({ shape }) => {
+  const { node } = useComputeNodeState(shape);
+  const [active, setActive] = (0, import_react9.useState)(false);
+  (0, import_react9.useEffect)(() => {
+    node.value = active;
+  }, [
+    active
+  ]);
+  return /* @__PURE__ */ import_react9.default.createElement("div", {
+    className: "flex w-full justify-center items-center"
+  }, /* @__PURE__ */ import_react9.default.createElement(import_react_ui3.Icon, {
+    icon: active ? "ph--microphone--regular" : "ph--microphone-slash--regular",
+    classNames: [
+      "transition opacity-20 duration-1000",
+      active && "opacity-100 text-red-500"
+    ],
+    size: 8,
+    onClick: () => setActive(!active)
+  }));
+};
+var audioShape = {
+  type: "audio",
+  name: "Audio",
+  icon: "ph--microphone--regular",
+  component: AudioComponent,
+  createShape: createAudio,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor5.createAnchorMap)(shape, {
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  })
+};
+var BeaconShape = import_echo_schema9.S.extend(ComputeShape, import_echo_schema9.S.Struct({
+  type: import_echo_schema9.S.Literal("beacon")
+}));
+var createBeacon = (props) => createShape({
+  type: "beacon",
+  size: {
+    width: 64,
+    height: 64
+  },
+  ...props
+});
+var BeaconComponent = ({ shape }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const input = runtime.inputs[import_conductor9.DEFAULT_INPUT];
+  const value = input?.type === "executed" ? input.value : false;
+  return /* @__PURE__ */ import_react10.default.createElement("div", {
+    className: "flex w-full justify-center items-center"
+  }, /* @__PURE__ */ import_react10.default.createElement(import_react_ui4.Icon, {
+    icon: "ph--sun--regular",
+    classNames: (0, import_react_ui_theme2.mx)("transition opacity-20 duration-1000", (0, import_conductor9.isTruthy)(value) && "opacity-100 text-yellow-500"),
+    size: 8
+  }));
+};
+var beaconShape = {
+  type: "beacon",
+  name: "Beacon",
+  icon: "ph--sun--regular",
+  component: BeaconComponent,
+  createShape: createBeacon,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor6.createAnchorMap)(shape, {
+    [createAnchorId("input")]: {
+      x: -1,
+      y: 0
+    }
+  })
+};
+var GateShape = import_echo_schema10.S.extend(ComputeShape, import_echo_schema10.S.Struct({
+  type: import_echo_schema10.S.String
+}));
+var createGate = (props) => createShape({
+  size: {
+    width: 64,
+    height: 64
+  },
+  ...props
+});
+var GateComponent = (Symbol22) => () => {
+  return /* @__PURE__ */ import_react11.default.createElement("div", {
+    className: "flex w-full justify-center items-center"
+  }, /* @__PURE__ */ import_react11.default.createElement(Symbol22, null));
+};
+var defineShape = ({ type, name, icon, Symbol: Symbol22, createShape: createShape2, inputs, outputs = [
+  createAnchorId("output")
+] }) => ({
+  type,
+  name,
+  icon,
+  component: GateComponent(Symbol22),
+  createShape: createShape2,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor7.createAnchors)({
+    shape,
+    inputs,
+    outputs
+  })
+});
+var Symbol2 = (pathConstructor, inputs) => ({
+  width = 64,
+  height = 32,
+  // TODO(burdon): Same as line color.
+  className = "fill-neutral-200 dark:fill-neutral-800 stroke-neutral-500",
+  strokeWidth = 1
+}) => {
+  const startX = width * 0.25;
+  const endX = width * 0.75;
+  const centerY = height / 2;
+  const paths = pathConstructor({
+    startX,
+    endX,
+    height
+  });
+  return /* @__PURE__ */ import_react11.default.createElement("svg", {
+    viewBox: `0 0 ${width} ${height}`,
+    className: "w-full h-full"
+  }, (0, import_react_ui_canvas_editor7.getAnchorPoints)({
+    x: 0,
+    y: centerY
+  }, inputs).map(({ x, y }, i) => /* @__PURE__ */ import_react11.default.createElement("line", {
+    key: i,
+    x1: x,
+    y1: y,
+    x2: startX * 1.3,
+    y2: y,
+    strokeWidth,
+    className
+  })), /* @__PURE__ */ import_react11.default.createElement("line", {
+    x1: endX,
+    y1: centerY,
+    x2: width,
+    y2: centerY,
+    strokeWidth,
+    className
+  }), paths.map((path, i) => /* @__PURE__ */ import_react11.default.createElement("path", {
+    key: i,
+    d: path,
+    strokeWidth,
+    className
+  })));
+};
+var AndSymbol = Symbol2(({ startX, endX, height }) => {
+  const arcRadius = (endX - startX) / 2;
+  return [
+    `
+    M ${startX},${height * 0.1}
+    L ${endX - arcRadius},${height * 0.1}
+    A ${arcRadius},${height * 0.4} 0 0 1 ${endX - arcRadius},${height * 0.9}
+    L ${startX},${height * 0.9}
+    Z
+  `
+  ];
+}, 2);
+var AndShape = GateShape;
+var createAnd = (props) => {
+  return createGate({
+    ...props,
+    type: "and"
+  });
+};
+var andShape = defineShape({
+  type: "and",
+  name: "AND",
+  icon: "ph--intersection--regular",
+  Symbol: AndSymbol,
+  createShape: createAnd,
+  inputs: [
+    "input.a",
+    "input.b"
+  ]
+});
+var OrSymbol = Symbol2(({ startX, endX, height }) => {
+  const arcRadius = (endX - startX) / 2;
+  return [
+    `
+    M ${startX},${height * 0.1}
+    L ${endX - arcRadius},${height * 0.1}
+    A ${arcRadius},${height * 0.4} 0 0 1 ${endX - arcRadius},${height * 0.9}
+    L ${startX},${height * 0.9}
+    C ${startX * 1.4},${height * 0.5} ${startX * 1.4},${height * 0.5} ${startX},${height * 0.1}
+    Z
+  `
+  ];
+}, 2);
+var OrShape = GateShape;
+var createOr = (props) => {
+  return createGate({
+    ...props,
+    type: "or"
+  });
+};
+var orShape = defineShape({
+  type: "or",
+  name: "OR",
+  icon: "ph--union--regular",
+  Symbol: OrSymbol,
+  createShape: createOr,
+  inputs: [
+    "input.a",
+    "input.b"
+  ]
+});
+var NotSymbol = Symbol2(({ startX, endX, height }) => {
+  return [
+    `
+    M ${startX},${height * 0.1}
+    L ${endX * 0.9},${height * 0.5}
+    L ${startX},${height * 0.9}
+    Z
+    `,
+    `
+    M ${endX - height * 0.2},${height * 0.5}
+    A ${height * 0.1} ${height * 0.1} 0 0 1 ${endX},${height * 0.5}
+    A ${height * 0.1} ${height * 0.1} 0 0 1 ${endX - height * 0.2},${height * 0.5}
+    Z
+  `
+  ];
+}, 1);
+var NotShape = GateShape;
+var createNot = (props) => {
+  return createGate({
+    ...props,
+    type: "not"
+  });
+};
+var notShape = defineShape({
+  type: "not",
+  name: "NOT",
+  icon: "ph--x--regular",
+  Symbol: NotSymbol,
+  createShape: createNot,
+  inputs: [
+    createAnchorId("input")
+  ]
+});
+var ChatShape = import_echo_schema11.S.extend(ComputeShape, import_echo_schema11.S.Struct({
+  type: import_echo_schema11.S.Literal("chat")
+}));
+var TextInputComponent = ({ shape, title, ...props }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const inputRef = (0, import_react12.useRef)(null);
+  const handleEnter = (text) => {
+    const value = text.trim();
+    if (value.length) {
+      runtime.setOutput(import_conductor10.DEFAULT_OUTPUT, value);
+      inputRef.current?.setText("");
+    }
+  };
+  return /* @__PURE__ */ import_react12.default.createElement(Box, {
+    shape,
+    title
+  }, /* @__PURE__ */ import_react12.default.createElement(import_react_ui_canvas_editor8.TextBox, {
+    ref: inputRef,
+    onEnter: handleEnter,
+    ...props
+  }));
+};
+var createChat = (props) => createShape({
+  type: "chat",
+  size: {
+    width: 256,
+    height: 128
+  },
+  ...props
+});
+var chatShape = {
+  type: "chat",
+  name: "Chat",
+  icon: "ph--textbox--regular",
+  component: (props) => /* @__PURE__ */ import_react12.default.createElement(TextInputComponent, {
+    ...props,
+    title: "Prompt",
+    placeholder: "Message"
+  }),
+  createShape: createChat,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor9.createAnchorMap)(shape, {
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  }),
+  resizable: true
+};
+var ConstantShape = import_echo_schema12.S.extend(ComputeShape, import_echo_schema12.S.Struct({
+  type: import_echo_schema12.S.Literal("constant"),
+  value: import_echo_schema12.S.optional(import_echo_schema12.S.Any)
+}));
+var inferType = (value) => {
+  if (typeof value === "string") {
+    return "string";
+  } else if (typeof value === "number") {
+    return "number";
+  } else if (typeof value === "boolean") {
+    return "boolean";
+  } else if (typeof value === "object") {
+    return "object";
+  }
+};
+var ConstantComponent = ({ shape, title, chat, ...props }) => {
+  const { node } = useComputeNodeState(shape);
+  const [type, setType] = (0, import_react13.useState)(inferType(node.value) ?? import_conductor11.ComputeValueType.literals[0]);
+  const inputRef = (0, import_react13.useRef)(null);
+  const handleEnter = (0, import_react13.useCallback)((text) => {
+    const value = text.trim();
+    if (value.length) {
+      if (type === "number") {
+        const floatValue = parseFloat(value);
+        if (!isNaN(floatValue)) {
+          node.value = floatValue;
+        }
+      } else if (type === "object") {
+        node.value = (0, import_util2.safeParseJson)(value, {});
+      } else {
+        node.value = value;
+      }
+      inputRef.current?.focus();
+    }
+  }, [
+    type
+  ]);
+  return /* @__PURE__ */ import_react13.default.createElement(Box, {
+    shape,
+    title,
+    status: /* @__PURE__ */ import_react13.default.createElement(TypeSelect, {
+      value: type,
+      onValueChange: setType
+    })
+  }, (type === "string" || type === "number") && /* @__PURE__ */ import_react13.default.createElement(import_react_ui_canvas_editor10.TextBox, {
+    ...props,
+    ref: inputRef,
+    value: node.value,
+    onEnter: handleEnter
+  }), type === "object" && /* @__PURE__ */ import_react13.default.createElement(import_react_ui_canvas_editor10.TextBox, {
+    ...props,
+    ref: inputRef,
+    value: JSON.stringify(node.value, null, 2),
+    language: "json"
+  }), type === "boolean" && /* @__PURE__ */ import_react13.default.createElement("div", {
+    className: "flex grow justify-center items-center"
+  }, /* @__PURE__ */ import_react13.default.createElement(import_react_ui5.Input.Root, null, /* @__PURE__ */ import_react13.default.createElement(import_react_ui5.Input.Switch, {
+    checked: node.value,
+    onCheckedChange: (value) => {
+      node.value = value;
+    }
+  }))));
+};
+var createConstant = (props) => createShape({
+  type: "constant",
+  size: {
+    width: 192,
+    height: 128
+  },
+  ...props
+});
+var constantShape = {
+  type: "constant",
+  name: "Value",
+  icon: "ph--dots-three-circle--regular",
+  component: (props) => /* @__PURE__ */ import_react13.default.createElement(ConstantComponent, {
+    ...props,
+    placeholder: "Constant"
+  }),
+  createShape: createConstant,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor11.createAnchorMap)(shape, {
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  }),
+  resizable: true
+};
+var DatabaseShape = import_echo_schema13.S.extend(ComputeShape, import_echo_schema13.S.Struct({
+  type: import_echo_schema13.S.Literal("database")
+}));
+var createDatabase = (props) => createShape({
+  type: "database",
+  size: {
+    width: 128,
+    height: 64
+  },
+  ...props
+});
+var DatabaseComponent = ({ shape }) => {
+  return /* @__PURE__ */ import_react14.default.createElement(Box, {
+    shape
+  });
+};
+var databaseShape = {
+  type: "database",
+  name: "ECHO",
+  icon: "ph--database--regular",
+  component: DatabaseComponent,
+  createShape: createDatabase,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor12.createAnchorMap)(shape, {
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  })
+};
+var FunctionShape = import_echo_schema14.S.extend(ComputeShape, import_echo_schema14.S.Struct({
+  type: import_echo_schema14.S.Literal("function")
+}));
+var createFunction = (props) => createShape({
+  type: "function",
+  size: {
+    width: 192,
+    height: getHeight(import_conductor12.FunctionInput)
+  },
+  ...props
+});
+var FunctionComponent = ({ shape }) => {
+  return /* @__PURE__ */ import_react15.default.createElement(FunctionBody, {
+    shape,
+    inputSchema: import_conductor12.FunctionInput,
+    outputSchema: import_conductor12.AnyOutput
+  });
+};
+var functionShape = {
+  type: "function",
+  name: "Function",
+  icon: "ph--function--regular",
+  component: FunctionComponent,
+  createShape: createFunction,
+  // TODO(burdon): Get dynamic schema.
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor12.FunctionInput, import_conductor12.AnyOutput)
+};
+var GptShape = import_echo_schema15.S.extend(ComputeShape, import_echo_schema15.S.Struct({
+  type: import_echo_schema15.S.Literal("gpt")
+}));
+var createGpt = (props) => createShape({
+  type: "gpt",
+  size: {
+    width: 256,
+    height: Math.max(getHeight(import_conductor13.GptInput), getHeight(import_conductor13.GptOutput))
+  },
+  ...props
+});
+var GptComponent = ({ shape }) => {
+  const { meta, runtime } = useComputeNodeState(shape);
+  const [text, setText] = (0, import_react16.useState)("");
+  const [tokens, setTokens] = (0, import_react16.useState)(0);
+  (0, import_react16.useEffect)(() => {
+    return runtime.subscribeToEventLog((ev) => {
+      switch (ev.type) {
+        case "begin-compute": {
+          setText("");
+          break;
+        }
+        case "custom": {
+          const token = ev.event;
+          switch (token.type) {
+            case "content_block_delta":
+              switch (token.delta.type) {
+                case "text_delta": {
+                  const delta = token.delta.text;
+                  setText((prev) => {
+                    const text2 = prev + delta;
+                    setTokens(text2.split(" ").length);
+                    return text2;
+                  });
+                  break;
+                }
+              }
+              break;
+          }
+          break;
+        }
+      }
+    });
+  }, [
+    runtime?.subscribeToEventLog
+  ]);
+  return /* @__PURE__ */ import_react16.default.createElement(FunctionBody, {
+    shape,
+    content: /* @__PURE__ */ import_react16.default.createElement("div", {
+      className: "px-2 py-1 overflow-y-scroll"
+    }, text),
+    status: `${tokens} tokens`,
+    inputSchema: meta.input,
+    outputSchema: meta.output
+  });
+};
+var gptShape = {
+  type: "gpt",
+  name: "GPT",
+  icon: "ph--brain--regular",
+  component: GptComponent,
+  createShape: createGpt,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor13.GptInput, import_conductor13.GptOutput),
+  openable: true
+};
+var JsonShape = import_echo_schema16.S.extend(ComputeShape, import_echo_schema16.S.Struct({
+  type: import_echo_schema16.S.Literal("json")
+}));
+var JsonTransformShape = import_echo_schema16.S.extend(ComputeShape, import_echo_schema16.S.Struct({
+  type: import_echo_schema16.S.Literal("json-transform")
+}));
+var JsonComponent = ({ shape, ...props }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const input = runtime.inputs[import_conductor14.DEFAULT_INPUT];
+  const value = input?.type === "executed" ? input.value : void 0;
+  return /* @__PURE__ */ import_react17.default.createElement(Box, {
+    shape
+  }, /* @__PURE__ */ import_react17.default.createElement(import_react_ui_syntax_highlighter.JsonFilter, {
+    data: value,
+    classNames: "text-xs"
+  }));
+};
+var JsonTransformComponent = ({ shape, ...props }) => {
+  return /* @__PURE__ */ import_react17.default.createElement(Box, {
+    shape
+  });
+};
+var createJson = (props) => createShape({
+  type: "json",
+  size: {
+    width: 256,
+    height: 256
+  },
+  ...props
+});
+var jsonShape = {
+  type: "json",
+  name: "JSON",
+  icon: "ph--code--regular",
+  component: (props) => /* @__PURE__ */ import_react17.default.createElement(JsonComponent, props),
+  createShape: createJson,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor13.createAnchorMap)(shape, {
+    [createAnchorId("input")]: {
+      x: -1,
+      y: 0
+    },
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  }),
+  resizable: true
+};
+var createJsonTransform = (props) => createShape({
+  type: "json-transform",
+  size: {
+    width: 128,
+    height: getHeight(import_conductor14.JsonTransformInput)
+  },
+  ...props
+});
+var jsonTransformShape = {
+  type: "json-transform",
+  name: "Transform",
+  icon: "ph--shuffle-simple--regular",
+  component: (props) => /* @__PURE__ */ import_react17.default.createElement(JsonTransformComponent, props),
+  createShape: createJsonTransform,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor14.JsonTransformInput, import_conductor14.DefaultOutput),
+  resizable: true
+};
+var IfShape = import_echo_schema17.S.extend(ComputeShape, import_echo_schema17.S.Struct({
+  type: import_echo_schema17.S.Literal("if")
+}));
+var IfElseShape = import_echo_schema17.S.extend(ComputeShape, import_echo_schema17.S.Struct({
+  type: import_echo_schema17.S.Literal("if-else")
+}));
+var IfComponent = ({ shape, ...props }) => {
+  return /* @__PURE__ */ import_react18.default.createElement(FunctionBody, {
+    shape,
+    inputSchema: import_conductor15.IfInput,
+    outputSchema: import_conductor15.IfOutput
+  });
+};
+var IfElseComponent = ({ shape, ...props }) => {
+  return /* @__PURE__ */ import_react18.default.createElement(FunctionBody, {
+    shape,
+    inputSchema: import_conductor15.IfElseInput,
+    outputSchema: import_conductor15.IfElseOutput
+  });
+};
+var createIf = (props) => createShape({
+  type: "if",
+  size: {
+    width: 192,
+    height: getHeight(import_conductor15.IfInput)
+  },
+  ...props
+});
+var ifShape = {
+  type: "if",
+  name: "IF",
+  icon: "ph--arrows-split--regular",
+  component: (props) => /* @__PURE__ */ import_react18.default.createElement(IfComponent, props),
+  createShape: createIf,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor15.IfInput, import_conductor15.IfOutput)
+};
+var createIfElse = (props) => createShape({
+  type: "if-else",
+  size: {
+    width: 192,
+    height: getHeight(import_conductor15.IfElseInput)
+  },
+  ...props
+});
+var ifElseShape = {
+  type: "if-else",
+  name: "IF/ELSE",
+  icon: "ph--arrows-merge--regular",
+  component: (props) => /* @__PURE__ */ import_react18.default.createElement(IfElseComponent, props),
+  createShape: createIfElse,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor15.IfElseInput, import_conductor15.IfElseOutput)
+};
+var QueueShape = import_echo_schema18.S.extend(ComputeShape, import_echo_schema18.S.Struct({
+  type: import_echo_schema18.S.Literal("queue")
+}));
+var createQueue = (props) => createShape({
+  type: "queue",
+  size: {
+    width: 256,
+    height: 512
+  },
+  ...props
+});
+var QueueComponent = ({ shape }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const items = runtime.outputs[import_conductor16.DEFAULT_OUTPUT]?.type === "executed" ? runtime.outputs[import_conductor16.DEFAULT_OUTPUT].value : [];
+  const handleAction = (action) => {
+    if (action === "run") {
+      runtime.evalNode();
+    }
+  };
+  return /* @__PURE__ */ import_react19.default.createElement(Box, {
+    shape,
+    status: `${items.length} items`,
+    onAction: handleAction
+  }, /* @__PURE__ */ import_react19.default.createElement("div", {
+    className: "flex flex-col w-full overflow-y-scroll divide-y divide-separator"
+  }, [
+    ...items
+  ].map((item, i) => /* @__PURE__ */ import_react19.default.createElement(QueueItem, {
+    key: i,
+    classNames: "p-1 px-2",
+    item
+  }))));
+};
+var QueueItem = ({ classNames, item }) => {
+  if (typeof item !== "object") {
+    return /* @__PURE__ */ import_react19.default.createElement("div", {
+      className: (0, import_react_ui_theme3.mx)(classNames, "whitespace-pre-wrap")
+    }, item);
+  }
+  return /* @__PURE__ */ import_react19.default.createElement("div", {
+    className: (0, import_react_ui_theme3.mx)("grid grid-cols-[80px,1fr]", classNames)
+  }, Object.entries(item).map(([key, value]) => /* @__PURE__ */ import_react19.default.createElement(import_react19.Fragment, {
+    key
+  }, /* @__PURE__ */ import_react19.default.createElement("div", {
+    className: "p-1 text-xs text-subdued"
+  }, key), /* @__PURE__ */ import_react19.default.createElement("div", null, typeof value === "string" ? value : JSON.stringify(value)))));
+};
+var queueShape = {
+  type: "queue",
+  name: "Queue",
+  icon: "ph--queue--regular",
+  component: QueueComponent,
+  createShape: createQueue,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor16.QueueInput, import_conductor16.QueueOutput),
+  resizable: true
+};
+var RandomShape = import_echo_schema19.S.extend(ComputeShape, import_echo_schema19.S.Struct({
+  type: import_echo_schema19.S.Literal("rng"),
+  min: import_echo_schema19.S.optional(import_echo_schema19.S.Number),
+  max: import_echo_schema19.S.optional(import_echo_schema19.S.Number)
+}));
+var createRandom = (props) => createShape({
+  type: "rng",
+  size: {
+    width: 64,
+    height: 64
+  },
+  ...props
+});
+var icons = [
+  "ph--dice-one--regular",
+  "ph--dice-two--regular",
+  "ph--dice-three--regular",
+  "ph--dice-four--regular",
+  "ph--dice-five--regular",
+  "ph--dice-six--regular"
+];
+var pickIcon = () => icons[Math.floor(Math.random() * icons.length)];
+var RandomComponent = ({ shape }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const [spin, setSpin] = (0, import_react20.useState)(false);
+  const [icon, setIcon] = (0, import_react20.useState)(pickIcon());
+  (0, import_react20.useEffect)(() => {
+    if (!spin) {
+      return;
+    }
+    const i = setInterval(() => setIcon(pickIcon()), 250);
+    const t1 = setTimeout(() => clearInterval(i), 900);
+    const t2 = setTimeout(() => setSpin(false), 1100);
+    return () => {
+      clearInterval(i);
+      clearTimeout(t1);
+      clearTimeout(t2);
+    };
+  }, [
+    spin
+  ]);
+  const handleClick = (ev) => {
+    ev.stopPropagation();
+    runtime.setOutput(import_conductor17.DEFAULT_OUTPUT, Math.random());
+    setSpin(true);
+  };
+  return /* @__PURE__ */ import_react20.default.createElement("div", {
+    className: "flex grow items-center justify-center"
+  }, /* @__PURE__ */ import_react20.default.createElement(import_react_ui6.Icon, {
+    icon,
+    classNames: (0, import_react_ui_theme4.mx)(spin && "animate-[spin_1s]"),
+    size: 10,
+    onClick: handleClick
+  }));
+};
+var randomShape = {
+  type: "rng",
+  name: "Random",
+  icon: "ph--dice-six--regular",
+  component: RandomComponent,
+  createShape: createRandom,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor14.createAnchorMap)(shape, {
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  })
+};
+var ScopeShape = import_echo_schema20.S.extend(ComputeShape, import_echo_schema20.S.Struct({
+  type: import_echo_schema20.S.Literal("scope")
+}));
+var createScope = (props) => createShape({
+  type: "scope",
+  size: {
+    width: 128,
+    height: 128
+  },
+  classNames: "rounded-full border-primary-800",
+  ...props
+});
+var ScopeComponent = ({ shape }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const input = runtime.inputs[import_conductor18.DEFAULT_INPUT];
+  const active = input?.type === "executed" ? input.value : false;
+  const { getAverage } = (0, import_react_ui_sfx.useAudioStream)(active);
+  return /* @__PURE__ */ import_react21.default.createElement("div", {
+    className: "flex w-full justify-center items-center bg-black"
+  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui_sfx.Chaos, {
+    active,
+    getValue: getAverage,
+    options: {
+      ...import_react_ui_sfx.shaderPresets.heptapod,
+      zoom: 1.2
+    }
+  }));
+};
+var scopeShape = {
+  type: "scope",
+  name: "Scope",
+  icon: "ph--waveform--regular",
+  component: ScopeComponent,
+  createShape: createScope,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor15.createAnchorMap)(shape, {
+    [createAnchorId("input")]: {
+      x: -1,
+      y: 0
+    }
+  })
+};
+var SurfaceShape = import_echo_schema21.S.extend(ComputeShape, import_echo_schema21.S.Struct({
+  type: import_echo_schema21.S.Literal("surface")
+}));
+var createSurface = (props) => createShape({
+  type: "surface",
+  size: {
+    width: 384,
+    height: 384
+  },
+  ...props
+});
+var SurfaceComponent = ({ shape }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const input = runtime.inputs[import_conductor19.DEFAULT_INPUT];
+  const value = input?.type === "executed" ? input.value : null;
+  const handleAction = (action) => {
+    if (action === "run") {
+      runtime.evalNode();
+    }
+  };
+  return /* @__PURE__ */ import_react22.default.createElement(Box, {
+    shape,
+    onAction: handleAction
+  }, value !== null && /* @__PURE__ */ import_react22.default.createElement(import_app_framework.Surface, {
+    role: "canvas-node",
+    data: {
+      value
+    },
+    limit: 1
+  }));
+};
+var surfaceShape = {
+  type: "surface",
+  name: "Surface",
+  icon: "ph--frame-corners--regular",
+  component: SurfaceComponent,
+  createShape: createSurface,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor16.createAnchorMap)(shape, {
+    [createAnchorId("input")]: {
+      x: -1,
+      y: 0
+    }
+  }),
+  resizable: true
+};
+var SwitchShape = import_echo_schema22.S.extend(ComputeShape, import_echo_schema22.S.Struct({
+  type: import_echo_schema22.S.Literal("switch")
+}));
+var createSwitch = (props) => createShape({
+  type: "switch",
+  size: {
+    width: 64,
+    height: 64
+  },
+  ...props
+});
+var SwitchComponent = ({ shape }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const [value, setValue] = (0, import_react23.useState)(false);
+  (0, import_react23.useEffect)(() => {
+    runtime.setOutput(import_conductor20.DEFAULT_OUTPUT, value);
+  }, [
+    value
+  ]);
+  return /* @__PURE__ */ import_react23.default.createElement("div", {
+    className: "flex w-full justify-center items-center",
+    onClick: (ev) => ev.stopPropagation()
+  }, /* @__PURE__ */ import_react23.default.createElement(import_react_ui7.Input.Root, null, /* @__PURE__ */ import_react23.default.createElement(import_react_ui7.Input.Switch, {
+    checked: value,
+    onCheckedChange: (value2) => setValue(value2)
+  })));
+};
+var switchShape = {
+  type: "switch",
+  name: "Switch",
+  icon: "ph--toggle-left--regular",
+  component: SwitchComponent,
+  createShape: createSwitch,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor17.createAnchorMap)(shape, {
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  })
+};
+var InputSchema = (0, import_conductor21.createInputSchema)(import_conductor21.GptMessage);
+var OutputSchema = (0, import_conductor21.createOutputSchema)(import_echo_schema23.S.mutable(import_echo_schema23.S.Array(import_conductor21.GptMessage)));
+var TableShape = import_echo_schema23.S.extend(ComputeShape, import_echo_schema23.S.Struct({
+  type: import_echo_schema23.S.Literal("table")
+}));
+var createTable = (props) => createShape({
+  type: "table",
+  size: {
+    width: 320,
+    height: 512
+  },
+  ...props
+});
+var TableComponent = ({ shape }) => {
+  return /* @__PURE__ */ import_react24.default.createElement(Box, {
+    shape
+  });
+};
+var tableShape = {
+  type: "table",
+  name: "Table",
+  icon: "ph--table--regular",
+  component: TableComponent,
+  createShape: createTable,
+  getAnchors: (shape) => createFunctionAnchors(shape, InputSchema, OutputSchema),
+  resizable: true
+};
+var __dxlog_file6 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-compute/src/shapes/Template.tsx";
+var TemplateShape = import_echo_schema24.S.extend(ComputeShape, import_echo_schema24.S.Struct({
+  type: import_echo_schema24.S.Literal("template"),
+  valueType: import_echo_schema24.S.optional(import_conductor22.ComputeValueType)
+}));
+var TextInputComponent2 = ({ shape, title, ...props }) => {
+  const { node } = useComputeNodeState(shape);
+  const inputRef = (0, import_react25.useRef)(null);
+  const handleEnter = (text) => {
+    const value = text.trim();
+    if (value.length) {
+      const schema = (0, import_conductor22.getTemplateInputSchema)(node);
+      node.value = value;
+      node.inputSchema = (0, import_echo_schema24.toJsonSchema)(schema);
+    }
+  };
+  const handleTypeChange = (newType) => {
+    (0, import_invariant5.invariant)(import_echo_schema24.S.is(import_conductor22.ComputeValueType)(newType), "Invalid type", {
+      F: __dxlog_file6,
+      L: 57,
+      S: void 0,
+      A: [
+        "S.is(ComputeValueType)(newType)",
+        "'Invalid type'"
+      ]
+    });
+    node.valueType = newType;
+    node.inputSchema = (0, import_echo_schema24.toJsonSchema)((0, import_conductor22.getTemplateInputSchema)(node));
+  };
+  return /* @__PURE__ */ import_react25.default.createElement(Box, {
+    shape,
+    title: "Template",
+    status: /* @__PURE__ */ import_react25.default.createElement(TypeSelect, {
+      value: node.valueType ?? "string",
+      onValueChange: handleTypeChange
+    })
+  }, /* @__PURE__ */ import_react25.default.createElement(import_react_ui_canvas_editor18.TextBox, {
+    ...props,
+    ref: inputRef,
+    value: node.value,
+    language: node.valueType === "object" ? "json" : void 0,
+    onBlur: handleEnter,
+    onEnter: handleEnter
+  }));
+};
+var createTemplate = (props) => createShape({
+  type: "template",
+  size: {
+    width: 256,
+    height: 384
+  },
+  ...props
+});
+var templateShape = {
+  type: "template",
+  name: "Template",
+  icon: "ph--article--regular",
+  component: (props) => /* @__PURE__ */ import_react25.default.createElement(TextInputComponent2, {
+    ...props,
+    placeholder: "Prompt"
+  }),
+  createShape: createTemplate,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor22.VoidInput, import_conductor22.TemplateOutput),
+  resizable: true
+};
+var TextShape = import_echo_schema25.S.extend(ComputeShape, import_echo_schema25.S.Struct({
+  type: import_echo_schema25.S.Literal("text")
+}));
+var createText = (props) => createShape({
+  type: "text",
+  size: {
+    width: 384,
+    height: 384
+  },
+  ...props
+});
+var TextComponent = ({ shape }) => {
+  const { runtime } = useComputeNodeState(shape);
+  const input = runtime.inputs[import_conductor23.DEFAULT_INPUT];
+  const value = input?.type === "executed" ? input.value : 0;
+  const handleAction = (action) => {
+    if (action === "run") {
+      runtime.evalNode();
+    }
+  };
+  return /* @__PURE__ */ import_react26.default.createElement(Box, {
+    shape,
+    onAction: handleAction
+  }, /* @__PURE__ */ import_react26.default.createElement(import_react_ui_canvas_editor19.TextBox, {
+    value
+  }));
+};
+var textShape = {
+  type: "text",
+  name: "Text",
+  icon: "ph--article--regular",
+  component: TextComponent,
+  createShape: createText,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor20.createAnchorMap)(shape, {
+    [createAnchorId("input")]: {
+      x: -1,
+      y: 0
+    }
+  }),
+  resizable: true
+};
+var InputSchema2 = (0, import_conductor24.createInputSchema)(import_conductor24.GptMessage);
+var OutputSchema2 = (0, import_conductor24.createOutputSchema)(import_echo_schema26.S.mutable(import_echo_schema26.S.Array(import_conductor24.GptMessage)));
+var ThreadShape = import_echo_schema26.S.extend(ComputeShape, import_echo_schema26.S.Struct({
+  type: import_echo_schema26.S.Literal("thread")
+}));
+var createThread = (props) => createShape({
+  type: "thread",
+  size: {
+    width: 384,
+    height: 384
+  },
+  ...props
+});
+var ThreadComponent = ({ shape }) => {
+  const items = [];
+  const scrollRef = (0, import_react27.useRef)(null);
+  (0, import_react27.useEffect)(() => {
+    if (scrollRef.current) {
+      scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
+    }
+  }, [
+    items
+  ]);
+  return /* @__PURE__ */ import_react27.default.createElement(Box, {
+    shape
+  }, /* @__PURE__ */ import_react27.default.createElement("div", {
+    ref: scrollRef,
+    className: "flex flex-col w-full overflow-y-scroll gap-2 p-2"
+  }, [
+    ...items
+  ].map((item, i) => /* @__PURE__ */ import_react27.default.createElement(ThreadItem, {
+    key: i,
+    item
+  }))));
+};
+var ThreadItem = ({ classNames, item }) => {
+  if (typeof item !== "object") {
+    return /* @__PURE__ */ import_react27.default.createElement("div", {
+      className: (0, import_react_ui_theme5.mx)(classNames)
+    }, item);
+  }
+  const { role, message } = item;
+  return /* @__PURE__ */ import_react27.default.createElement("div", {
+    className: (0, import_react_ui_theme5.mx)("flex", classNames, role === "user" && "justify-end")
+  }, /* @__PURE__ */ import_react27.default.createElement("div", {
+    className: (0, import_react_ui_theme5.mx)("block rounded-md p-1 px-2 text-sm", role === "user" ? "bg-blue-100 dark:bg-blue-800" : role === "system" ? "bg-red-100, dark:bg-red-800" : "whitespace-pre-wrap bg-neutral-50 dark:bg-neutral-800")
+  }, message));
+};
+var threadShape = {
+  type: "thread",
+  name: "Thread",
+  icon: "ph--chats-circle--regular",
+  component: ThreadComponent,
+  createShape: createThread,
+  getAnchors: (shape) => createFunctionAnchors(shape, InputSchema2, OutputSchema2),
+  resizable: true
+};
+var TextToImageShape = import_echo_schema27.S.extend(ComputeShape, import_echo_schema27.S.Struct({
+  type: import_echo_schema27.S.Literal("text-to-image")
+}));
+var createTextToImage = (props) => createShape({
+  type: "text-to-image",
+  size: {
+    width: 128,
+    height: 64
+  },
+  ...props
+});
+var TextToImageComponent = ({ shape }) => {
+  return /* @__PURE__ */ import_react28.default.createElement(Box, {
+    shape
+  });
+};
+var textToImageShape = {
+  type: "text-to-image",
+  name: "Image",
+  icon: "ph--image--regular",
+  component: TextToImageComponent,
+  createShape: createTextToImage,
+  getAnchors: (shape) => (0, import_react_ui_canvas_editor21.createAnchorMap)(shape, {
+    [createAnchorId("output")]: {
+      x: 1,
+      y: 0
+    }
+  })
+};
+var TriggerShape = import_echo_schema28.S.extend(ComputeShape, import_echo_schema28.S.Struct({
+  type: import_echo_schema28.S.Literal("trigger"),
+  functionTrigger: import_echo_schema28.S.optional((0, import_echo_schema28.Ref)(import_functions.FunctionTrigger))
+}));
+var createTrigger = (props) => {
+  const functionTrigger = (0, import_echo2.create)(import_functions.FunctionTrigger, {
+    enabled: true,
+    spec: createTriggerSpec(props.triggerKind ?? import_functions.TriggerKind.Email)
+  });
+  return createShape({
+    type: "trigger",
+    functionTrigger: (0, import_echo2.makeRef)(functionTrigger),
+    size: {
+      width: 192,
+      height: getHeight(import_conductor25.EmailTriggerOutput)
+    },
+    ...props
+  });
+};
+var TriggerComponent = ({ shape }) => {
+  const functionTrigger = shape.functionTrigger?.target;
+  (0, import_react29.useEffect)(() => {
+    if (functionTrigger && !functionTrigger.spec) {
+      functionTrigger.spec = createTriggerSpec(import_functions.TriggerKind.Email);
+    }
+  }, [
+    functionTrigger,
+    functionTrigger?.spec
+  ]);
+  (0, import_react29.useEffect)(() => {
+    shape.size.height = getHeight(getOutputSchema(functionTrigger?.spec?.type ?? import_functions.TriggerKind.Email));
+  }, [
+    functionTrigger?.spec?.type
+  ]);
+  const setKind = (kind) => {
+    if (functionTrigger?.spec?.type !== kind) {
+      functionTrigger.spec = createTriggerSpec(kind);
+    }
+  };
+  if (!functionTrigger?.spec) {
+    return;
+  }
+  return /* @__PURE__ */ import_react29.default.createElement(FunctionBody, {
+    shape,
+    status: /* @__PURE__ */ import_react29.default.createElement(TriggerKindSelect, {
+      value: functionTrigger.spec?.type,
+      onValueChange: (kind) => setKind(kind)
+    }),
+    inputSchema: import_conductor25.VoidInput,
+    outputSchema: getOutputSchema(functionTrigger.spec.type)
+  });
+};
+var TriggerKindSelect = ({ value, onValueChange }) => {
+  return /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.Root, {
+    value,
+    onValueChange
+  }, /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.TriggerButton, {
+    variant: "ghost",
+    classNames: "w-full !px-0"
+  }), /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.Portal, null, /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.Content, null, /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.ScrollUpButton, null), /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.Viewport, null, Object.values(import_functions.TriggerKind).map((type) => /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.Option, {
+    key: type,
+    value: type
+  }, type))), /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.ScrollDownButton, null), /* @__PURE__ */ import_react29.default.createElement(import_react_ui8.Select.Arrow, null))));
+};
+var createTriggerSpec = (kind) => {
+  switch (kind) {
+    case import_functions.TriggerKind.Timer:
+      return {
+        type: import_functions.TriggerKind.Timer,
+        cron: "0 0 * * *"
+      };
+    case import_functions.TriggerKind.Webhook:
+      return {
+        type: import_functions.TriggerKind.Webhook,
+        method: "POST"
+      };
+    case import_functions.TriggerKind.Subscription:
+      return {
+        type: import_functions.TriggerKind.Subscription,
+        filter: {}
+      };
+    case import_functions.TriggerKind.Email:
+      return {
+        type: import_functions.TriggerKind.Email
+      };
+  }
+};
+var getOutputSchema = (kind) => {
+  const kindToSchema = {
+    [import_functions.TriggerKind.Email]: import_conductor25.EmailTriggerOutput,
+    [import_functions.TriggerKind.Subscription]: import_conductor25.SubscriptionTriggerOutput,
+    [import_functions.TriggerKind.Timer]: import_conductor25.TimerTriggerOutput,
+    [import_functions.TriggerKind.Webhook]: import_conductor25.WebhookTriggerOutput
+  };
+  return kindToSchema[kind];
+};
+var triggerShape = {
+  type: "trigger",
+  name: "Trigger",
+  icon: "ph--lightning--regular",
+  component: TriggerComponent,
+  createShape: createTrigger,
+  getAnchors: (shape) => createFunctionAnchors(shape, import_conductor25.VoidInput, getOutputSchema(shape.functionTrigger?.target?.spec?.type ?? import_functions.TriggerKind.Email))
+};
+var GptRealtimeShape = import_echo_schema29.S.extend(ComputeShape, import_echo_schema29.S.Struct({
+  type: import_echo_schema29.S.Literal("gpt-realtime")
+}));
+var createGptRealtime = (props) => createShape({
+  type: "gpt-realtime",
+  size: {
+    width: 256,
+    height: 256
+  },
+  ...props
+});
+var GptRealtimeComponent = ({ shape }) => {
+  const [isLive, setIsLive] = (0, import_react30.useState)(false);
+  const [isReady, setIsReady] = (0, import_react30.useState)(false);
+  const start = async () => {
+    setIsLive(true);
+    try {
+      const peerConnection = new RTCPeerConnection();
+      peerConnection.ontrack = (event) => {
+        const audioElement = document.createElement("audio");
+        audioElement.srcObject = event.streams[0];
+        audioElement.autoplay = true;
+        audioElement.controls = false;
+        audioElement.style.display = "none";
+        document.body.appendChild(audioElement);
+        setIsReady(true);
+      };
+      const stream = await navigator.mediaDevices.getUserMedia({
+        audio: true
+      });
+      stream.getTracks().forEach((track) => peerConnection.addTransceiver(track, {
+        direction: "sendrecv"
+      }));
+      const offer = await peerConnection.createOffer();
+      await peerConnection.setLocalDescription(offer);
+      const response = await fetch(`${AI_SERVICE_URL}/rtc-connect`, {
+        method: "POST",
+        body: offer.sdp,
+        headers: {
+          "Content-Type": "application/sdp"
+        }
+      });
+      const answer = await response.text();
+      await peerConnection.setRemoteDescription({
+        sdp: answer,
+        type: "answer"
+      });
+      const dataChannel = peerConnection.createDataChannel("response");
+      const configureData = () => {
+        console.log("Configuring data channel");
+        const event = {
+          type: "session.update",
+          session: {
+            modalities: [
+              "text",
+              "audio"
+            ],
+            // Provide the tools. Note they match the keys in the `fns` object above
+            tools: []
+          }
+        };
+        dataChannel.send(JSON.stringify(event));
+      };
+      dataChannel.addEventListener("open", (ev) => {
+        console.log("Opening data channel", ev);
+        configureData();
+      });
+      dataChannel.addEventListener("message", async (ev) => {
+        const msg = JSON.parse(ev.data);
+        if (msg.type === "response.function_call_arguments.done") {
+        }
+      });
+    } catch (error) {
+      console.error("Error in realtime session:", error);
+      throw error;
+    }
+  };
+  return /* @__PURE__ */ import_react30.default.createElement("div", {
+    className: "flex w-full justify-center items-center"
+  }, /* @__PURE__ */ import_react30.default.createElement(import_react_ui9.Icon, {
+    icon: isReady ? "ph--waveform--regular" : isLive ? "ph--pulse--regular" : "ph--play--regular",
+    size: 16,
+    classNames: !isLive && "cursor-pointer",
+    onClick: start
+  }));
+};
+var gptRealtimeShape = {
+  type: "gpt-realtime",
+  name: "GPT Realtime",
+  icon: "ph--pulse--regular",
+  component: GptRealtimeComponent,
+  createShape: createGptRealtime,
+  // TODO(dmaretskyi): Can we fetch the schema dynamically?
+  getAnchors: (shape) => createFunctionAnchors(shape, import_echo_schema29.S.Struct({
+    audio: import_echo_schema29.S.Any
+  }), import_echo_schema29.S.Struct({})),
+  resizable: true
+};
+var AI_SERVICE_URL = "http://localhost:8788";
+var computeShapes = [
+  {
+    title: "Inputs",
+    shapes: [
+      //
+      constantShape,
+      templateShape,
+      chatShape,
+      switchShape,
+      audioShape,
+      triggerShape,
+      randomShape
+    ]
+  },
+  {
+    title: "Transform",
+    shapes: [
+      //
+      gptShape,
+      gptRealtimeShape,
+      functionShape,
+      databaseShape,
+      textToImageShape,
+      appendShape
+    ]
+  },
+  {
+    title: "Operations",
+    shapes: [
+      //
+      ifShape,
+      ifElseShape,
+      andShape,
+      orShape,
+      notShape,
+      reducerShape,
+      jsonTransformShape
+    ]
+  },
+  {
+    title: "Outputs",
+    shapes: [
+      //
+      jsonShape,
+      queueShape,
+      threadShape,
+      textShape,
+      surfaceShape,
+      beaconShape,
+      scopeShape
+    ]
+  },
+  {
+    title: "Misc",
+    shapes: [
+      //
+      import_react_ui_canvas_editor.noteShape
+    ]
+  }
+];
+var ComputeShapeLayout = class extends import_react_ui_canvas_editor22.ShapeLayout {
+  constructor(_controller, registry2) {
+    super(registry2);
+    this._controller = _controller;
+  }
+  // TODO(burdon): Doesn't update.
+  getAnchors(shape) {
+    const shapeDef = this._registry.getShapeDef(shape.type);
+    let anchors = shapeDef?.getAnchors?.(shape) ?? {};
+    if (shape.node) {
+      const node = this._controller.graph.getNode(shape.node);
+      if (node.inputSchema || node.outputSchema) {
+        const inputSchema = node.inputSchema ? (0, import_echo_schema30.toEffectSchema)(node.inputSchema) : import_conductor26.DefaultInput;
+        const outputSchema = node.outputSchema ? (0, import_echo_schema30.toEffectSchema)(node.outputSchema) : import_conductor26.DefaultOutput;
+        anchors = createFunctionAnchors(shape, inputSchema, outputSchema);
+      }
+    }
+    return anchors;
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AndShape,
+  AppendComponent,
+  AppendShape,
+  AudioComponent,
+  AudioShape,
+  BeaconComponent,
+  BeaconShape,
+  Box,
+  ChatShape,
+  ComputeContext,
+  ComputeGraphController,
+  ComputeShape,
+  ComputeShapeLayout,
+  ConstantComponent,
+  ConstantShape,
+  DatabaseComponent,
+  DatabaseShape,
+  FunctionBody,
+  FunctionComponent,
+  FunctionShape,
+  GptComponent,
+  GptRealtimeComponent,
+  GptRealtimeShape,
+  GptShape,
+  IfComponent,
+  IfElseComponent,
+  IfElseShape,
+  IfShape,
+  InvalidStateError,
+  JsonComponent,
+  JsonShape,
+  JsonTransformComponent,
+  JsonTransformShape,
+  NotShape,
+  OrShape,
+  QueueComponent,
+  QueueItem,
+  QueueShape,
+  RandomComponent,
+  RandomShape,
+  ReducerComponent,
+  ReducerShape,
+  ScopeComponent,
+  ScopeShape,
+  SurfaceComponent,
+  SurfaceShape,
+  SwitchComponent,
+  SwitchShape,
+  TableComponent,
+  TableShape,
+  TemplateShape,
+  TextComponent,
+  TextInputComponent,
+  TextShape,
+  TextToImageComponent,
+  TextToImageShape,
+  ThreadComponent,
+  ThreadItem,
+  ThreadShape,
+  TriggerComponent,
+  TriggerShape,
+  TypeSelect,
+  andShape,
+  appendShape,
+  audioShape,
+  beaconShape,
+  chatShape,
+  computeShapes,
+  constantShape,
+  createAnchorId,
+  createAnd,
+  createAppend,
+  createAudio,
+  createBeacon,
+  createChat,
+  createComputeGraph,
+  createComputeGraphController,
+  createComputeNode,
+  createConstant,
+  createDatabase,
+  createFunction,
+  createFunctionAnchors,
+  createGpt,
+  createGptRealtime,
+  createIf,
+  createIfElse,
+  createJson,
+  createJsonTransform,
+  createNot,
+  createOr,
+  createQueue,
+  createRandom,
+  createReducer,
+  createScope,
+  createShape,
+  createSurface,
+  createSwitch,
+  createTable,
+  createTemplate,
+  createText,
+  createTextToImage,
+  createThread,
+  createTrigger,
+  databaseShape,
+  footerHeight,
+  functionShape,
+  getHeight,
+  getProperties,
+  gptRealtimeShape,
+  gptShape,
+  headerHeight,
+  ifElseShape,
+  ifShape,
+  isValidComputeNode,
+  jsonShape,
+  jsonTransformShape,
+  mapEdge,
+  notShape,
+  orShape,
+  parseAnchorId,
+  queueShape,
+  randomShape,
+  reducerShape,
+  resolveComputeNode,
+  scopeShape,
+  surfaceShape,
+  switchShape,
+  tableShape,
+  templateShape,
+  textShape,
+  textToImageShape,
+  threadShape,
+  triggerShape,
+  useComputeContext,
+  useComputeNodeState,
+  useGraphMonitor
+});
+//# sourceMappingURL=index.cjs.map