@dxos/react-ui-canvas-compute 0.8.2-main.fbd8ed0 → 0.8.2-staging.4d6ad0f

package/dist/lib/node/index.cjs

@@ -189,11 +189,13 @@ var import_invariant3 = require("@dxos/invariant");
 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_tracking = require("@preact-signals/safe-react/tracking");
 var import_react5 = __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_tracking2 = require("@preact-signals/safe-react/tracking");
 var import_effect3 = require("effect");
 var import_react6 = __toESM(require("react"));
 var import_conductor4 = require("@dxos/conductor");
@@ -203,33 +205,41 @@ var import_effect4 = require("effect");
 var import_conductor5 = require("@dxos/conductor");
 var import_echo_schema3 = require("@dxos/echo-schema");
 var import_react_ui_canvas_editor4 = require("@dxos/react-ui-canvas-editor");
+var import_tracking3 = require("@preact-signals/safe-react/tracking");
 var import_react7 = __toESM(require("react"));
 var import_conductor6 = require("@dxos/conductor");
 var import_react_ui2 = require("@dxos/react-ui");
+var import_tracking4 = require("@preact-signals/safe-react/tracking");
 var import_effect5 = require("effect");
 var import_react8 = __toESM(require("react"));
 var import_conductor7 = require("@dxos/conductor");
+var import_tracking5 = require("@preact-signals/safe-react/tracking");
 var import_effect6 = require("effect");
 var import_react9 = __toESM(require("react"));
 var import_conductor8 = require("@dxos/conductor");
+var import_tracking6 = require("@preact-signals/safe-react/tracking");
 var import_effect7 = require("effect");
 var import_react10 = __toESM(require("react"));
 var import_react_ui3 = require("@dxos/react-ui");
 var import_react_ui_canvas_editor5 = require("@dxos/react-ui-canvas-editor");
+var import_tracking7 = require("@preact-signals/safe-react/tracking");
 var import_effect8 = require("effect");
 var import_react11 = __toESM(require("react"));
 var import_conductor9 = require("@dxos/conductor");
 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_tracking8 = require("@preact-signals/safe-react/tracking");
 var import_effect9 = require("effect");
 var import_react12 = __toESM(require("react"));
 var import_react_ui_canvas_editor7 = require("@dxos/react-ui-canvas-editor");
+var import_tracking9 = require("@preact-signals/safe-react/tracking");
 var import_effect10 = require("effect");
 var import_react13 = __toESM(require("react"));
 var import_conductor10 = require("@dxos/conductor");
 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_tracking10 = require("@preact-signals/safe-react/tracking");
 var import_effect11 = require("effect");
 var import_react14 = __toESM(require("react"));
 var import_conductor11 = require("@dxos/conductor");
@@ -237,9 +247,11 @@ 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_tracking11 = require("@preact-signals/safe-react/tracking");
 var import_effect12 = require("effect");
 var import_react15 = __toESM(require("react"));
 var import_react_ui_canvas_editor12 = require("@dxos/react-ui-canvas-editor");
+var import_tracking12 = require("@preact-signals/safe-react/tracking");
 var import_effect13 = require("effect");
 var import_react16 = __toESM(require("react"));
 var import_conductor12 = require("@dxos/conductor");
@@ -248,63 +260,77 @@ var import_functions = require("@dxos/functions");
 var import_react_client = require("@dxos/react-client");
 var import_echo2 = require("@dxos/react-client/echo");
 var import_react_ui_canvas_editor13 = require("@dxos/react-ui-canvas-editor");
+var import_tracking13 = require("@preact-signals/safe-react/tracking");
 var import_effect14 = require("effect");
 var import_react17 = __toESM(require("react"));
 var import_conductor13 = require("@dxos/conductor");
+var import_tracking14 = require("@preact-signals/safe-react/tracking");
 var import_effect15 = require("effect");
 var import_react18 = __toESM(require("react"));
 var import_conductor14 = require("@dxos/conductor");
 var import_react_ui_canvas_editor14 = require("@dxos/react-ui-canvas-editor");
 var import_react_ui_syntax_highlighter = require("@dxos/react-ui-syntax-highlighter");
+var import_tracking15 = require("@preact-signals/safe-react/tracking");
 var import_effect16 = require("effect");
 var import_react19 = __toESM(require("react"));
 var import_conductor15 = require("@dxos/conductor");
+var import_tracking16 = require("@preact-signals/safe-react/tracking");
 var import_effect17 = require("effect");
 var import_react20 = __toESM(require("react"));
 var import_conductor16 = require("@dxos/conductor");
 var import_react_ui_theme3 = require("@dxos/react-ui-theme");
+var import_tracking17 = require("@preact-signals/safe-react/tracking");
 var import_effect18 = require("effect");
 var import_react21 = __toESM(require("react"));
 var import_conductor17 = require("@dxos/conductor");
 var import_react_ui6 = require("@dxos/react-ui");
 var import_react_ui_canvas_editor15 = require("@dxos/react-ui-canvas-editor");
 var import_react_ui_theme4 = require("@dxos/react-ui-theme");
+var import_tracking18 = require("@preact-signals/safe-react/tracking");
 var import_effect19 = require("effect");
 var import_react22 = __toESM(require("react"));
 var import_conductor18 = require("@dxos/conductor");
 var import_react_ui_canvas_editor16 = require("@dxos/react-ui-canvas-editor");
 var import_react_ui_sfx = require("@dxos/react-ui-sfx");
+var import_tracking19 = require("@preact-signals/safe-react/tracking");
 var import_effect20 = require("effect");
 var import_react23 = __toESM(require("react"));
 var import_app_framework = require("@dxos/app-framework");
 var import_conductor19 = require("@dxos/conductor");
 var import_react_ui_canvas_editor17 = require("@dxos/react-ui-canvas-editor");
+var import_tracking20 = require("@preact-signals/safe-react/tracking");
 var import_effect21 = require("effect");
 var import_react24 = __toESM(require("react"));
 var import_conductor20 = require("@dxos/conductor");
 var import_react_ui7 = require("@dxos/react-ui");
 var import_react_ui_canvas_editor18 = require("@dxos/react-ui-canvas-editor");
+var import_tracking21 = require("@preact-signals/safe-react/tracking");
 var import_effect22 = require("effect");
 var import_react25 = __toESM(require("react"));
 var import_conductor21 = require("@dxos/conductor");
+var import_tracking22 = require("@preact-signals/safe-react/tracking");
 var import_effect23 = require("effect");
 var import_react26 = __toESM(require("react"));
 var import_conductor22 = require("@dxos/conductor");
 var import_echo_schema5 = require("@dxos/echo-schema");
 var import_invariant5 = require("@dxos/invariant");
 var import_react_ui_canvas_editor19 = require("@dxos/react-ui-canvas-editor");
+var import_tracking23 = require("@preact-signals/safe-react/tracking");
 var import_effect24 = require("effect");
 var import_react27 = __toESM(require("react"));
 var import_conductor23 = require("@dxos/conductor");
 var import_react_ui_canvas_editor20 = require("@dxos/react-ui-canvas-editor");
 var import_react_ui_canvas_editor21 = require("@dxos/react-ui-canvas-editor");
+var import_tracking24 = require("@preact-signals/safe-react/tracking");
 var import_effect25 = require("effect");
 var import_react28 = __toESM(require("react"));
 var import_conductor24 = require("@dxos/conductor");
 var import_react_ui_theme5 = require("@dxos/react-ui-theme");
+var import_tracking25 = require("@preact-signals/safe-react/tracking");
 var import_effect26 = require("effect");
 var import_react29 = __toESM(require("react"));
 var import_react_ui_canvas_editor22 = require("@dxos/react-ui-canvas-editor");
+var import_tracking26 = require("@preact-signals/safe-react/tracking");
 var import_effect27 = require("effect");
 var import_react30 = __toESM(require("react"));
 var import_conductor25 = require("@dxos/conductor");
@@ -313,6 +339,7 @@ var import_functions2 = require("@dxos/functions");
 var import_keys = require("@dxos/keys");
 var import_echo3 = require("@dxos/react-client/echo");
 var import_react_ui8 = require("@dxos/react-ui");
+var import_tracking27 = require("@preact-signals/safe-react/tracking");
 var import_effect28 = require("effect");
 var import_react31 = __toESM(require("react"));
 var import_log2 = require("@dxos/log");
@@ -653,19 +680,9 @@ var createComputeGraphController = (graph, services) => {
 };
 var ComputeGraphController = class extends import_context.Resource {
   constructor(_graph) {
-    super();
-    this._graph = _graph;
-    this._executor = new import_conductor.GraphExecutor({
+    super(), this._graph = _graph, this._executor = new import_conductor.GraphExecutor({
       computeNodeResolver: (node) => resolveComputeNode(node)
-    });
-    this._diagnostics = [];
-    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();
+    }), this._diagnostics = [], 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 {
@@ -932,59 +949,64 @@ var __dxlog_file5 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-com
 var headerHeight = 32;
 var footerHeight = 32;
 var Box = /* @__PURE__ */ (0, import_react5.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_react5.default.createElement("div", {
-    ref: forwardedRef,
-    className: "flex flex-col h-full w-full justify-between"
-  }, /* @__PURE__ */ import_react5.default.createElement("div", {
-    className: "flex shrink-0 w-full justify-between items-center h-[32px] bg-hoverSurface"
-  }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui.Icon, {
-    icon,
-    classNames: "mx-2"
-  }), /* @__PURE__ */ import_react5.default.createElement("div", {
-    className: "grow text-sm truncate"
-  }, debug ? shape.type : name ?? shape.text ?? title), /* @__PURE__ */ import_react5.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_react5.default.createElement("div", {
-    className: (0, import_react_ui_theme.mx)("flex flex-col h-full grow overflow-hidden", classNames)
-  }, children), /* @__PURE__ */ import_react5.default.createElement("div", {
-    className: "flex shrink-0 w-full justify-between items-center h-[32px] bg-hoverSurface"
-  }, /* @__PURE__ */ import_react5.default.createElement("div", {
-    className: "grow px-2 text-sm truncate"
-  }, debug ? shape.id : status), openable && /* @__PURE__ */ import_react5.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 _effect = (0, import_tracking.useSignals)();
+  try {
+    (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_react5.default.createElement("div", {
+      ref: forwardedRef,
+      className: "flex flex-col h-full w-full justify-between"
+    }, /* @__PURE__ */ import_react5.default.createElement("div", {
+      className: "flex shrink-0 w-full justify-between items-center h-[32px] bg-hoverSurface"
+    }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui.Icon, {
+      icon,
+      classNames: "mx-2"
+    }), /* @__PURE__ */ import_react5.default.createElement("div", {
+      className: "grow text-sm truncate"
+    }, debug ? shape.type : name ?? shape.text ?? title), /* @__PURE__ */ import_react5.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_react5.default.createElement("div", {
+      className: (0, import_react_ui_theme.mx)("flex flex-col h-full grow overflow-hidden", classNames)
+    }, children), /* @__PURE__ */ import_react5.default.createElement("div", {
+      className: "flex shrink-0 w-full justify-between items-center h-[32px] bg-hoverSurface"
+    }, /* @__PURE__ */ import_react5.default.createElement("div", {
+      className: "grow px-2 text-sm truncate"
+    }, debug ? shape.id : status), openable && /* @__PURE__ */ import_react5.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");
+      }
+    })));
+  } finally {
+    _effect.f();
+  }
 });
 var getProperties = (ast) => import_effect4.SchemaAST.getPropertySignatures(ast).map(({ name }) => ({
   name: name.toString()
@@ -1003,7 +1025,7 @@ var parseAnchorId = (id) => {
 var ComputeShape = import_effect4.Schema.extend(import_react_ui_canvas_editor4.Polygon, import_effect4.Schema.Struct({
   // TODO(burdon): Rename computeNode?
   node: import_effect4.Schema.optional(import_echo_schema3.ObjectId.annotations({
-    [import_effect4.SchemaAST.DescriptionAnnotationId]: "Compute node id"
+    description: "Compute node id"
   }))
 }).pipe(import_effect4.Schema.mutable));
 var createShape = ({ id, ...rest }) => {
@@ -1015,65 +1037,70 @@ var createShape = ({ id, ...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_react6.useRef)(null);
-  const [open, setOpen] = (0, import_react6.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;
+  var _effect = (0, import_tracking2.useSignals)();
+  try {
+    const { scale } = (0, import_react_ui_canvas.useCanvasContext)();
+    const rootRef = (0, import_react6.useRef)(null);
+    const [open, setOpen] = (0, import_react6.useState)(false);
+    const handleAction = (action) => {
+      if (!rootRef.current) {
+        return;
       }
-      case "close": {
-        const el = (0, import_react_ui_canvas_editor3.getParentShapeElement)(rootRef.current, shape.id);
-        el.style.height = "";
-        setOpen(false);
-        break;
+      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_react6.default.createElement(Box, {
-    ref: rootRef,
-    shape,
-    title: name,
-    classNames: "divide-y divide-separator",
-    open,
-    onAction: handleAction,
-    ...props
-  }, /* @__PURE__ */ import_react6.default.createElement("div", {
-    className: `grid grid-cols-${columnCount} items-center`,
-    style: {
-      paddingTop: bodyPadding,
-      paddingBottom: bodyPadding
-    }
-  }, (inputs?.length ?? 0) > 0 && /* @__PURE__ */ import_react6.default.createElement("div", {
-    className: "flex flex-col"
-  }, inputs?.map(({ name: name2 }) => /* @__PURE__ */ import_react6.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_react6.default.createElement("div", {
-    className: "flex flex-col"
-  }, outputs?.map(({ name: name2 }) => /* @__PURE__ */ import_react6.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_react6.default.createElement("div", {
-    className: "flex flex-col grow overflow-hidden"
-  }, content));
+    };
+    const inputs = getProperties(inputSchema.ast);
+    const outputs = getProperties(outputSchema.ast);
+    const columnCount = inputs.length && outputs.length ? 2 : 1;
+    return /* @__PURE__ */ import_react6.default.createElement(Box, {
+      ref: rootRef,
+      shape,
+      title: name,
+      classNames: "divide-y divide-separator",
+      open,
+      onAction: handleAction,
+      ...props
+    }, /* @__PURE__ */ import_react6.default.createElement("div", {
+      className: `grid grid-cols-${columnCount} items-center`,
+      style: {
+        paddingTop: bodyPadding,
+        paddingBottom: bodyPadding
+      }
+    }, (inputs?.length ?? 0) > 0 && /* @__PURE__ */ import_react6.default.createElement("div", {
+      className: "flex flex-col"
+    }, inputs?.map(({ name: name2 }) => /* @__PURE__ */ import_react6.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_react6.default.createElement("div", {
+      className: "flex flex-col"
+    }, outputs?.map(({ name: name2 }) => /* @__PURE__ */ import_react6.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_react6.default.createElement("div", {
+      className: "flex flex-col grow overflow-hidden"
+    }, content));
+  } finally {
+    _effect.f();
+  }
 };
 var getHeight = (input) => {
   const properties = import_effect3.SchemaAST.getPropertySignatures(input.ast);
@@ -1093,26 +1120,36 @@ var createFunctionAnchors = (shape, input = import_conductor4.VoidInput, output
   });
 };
 var TypeSelect = ({ value, onValueChange }) => {
-  return /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Root, {
-    value,
-    onValueChange
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.TriggerButton, {
-    variant: "ghost",
-    classNames: "w-full !px-0"
-  }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Portal, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Content, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.ScrollUpButton, null), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Viewport, null, import_conductor6.ComputeValueType.literals.map((type) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Option, {
-    key: type,
-    value: type
-  }, type))), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.ScrollDownButton, null), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Arrow, null))));
+  var _effect = (0, import_tracking3.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Root, {
+      value,
+      onValueChange
+    }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.TriggerButton, {
+      variant: "ghost",
+      classNames: "w-full !px-0"
+    }), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Portal, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Content, null, /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.ScrollUpButton, null), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Viewport, null, import_conductor6.ComputeValueType.literals.map((type) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Option, {
+      key: type,
+      value: type
+    }, type))), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.ScrollDownButton, null), /* @__PURE__ */ import_react7.default.createElement(import_react_ui2.Select.Arrow, null))));
+  } finally {
+    _effect.f();
+  }
 };
 var ReducerShape = import_effect5.Schema.extend(ComputeShape, import_effect5.Schema.Struct({
   type: import_effect5.Schema.Literal("reducer")
 }));
 var ReducerComponent = ({ shape }) => {
-  return /* @__PURE__ */ import_react8.default.createElement(FunctionBody, {
-    shape,
-    inputSchema: import_conductor7.ReducerInput,
-    outputSchema: import_conductor7.ReducerOutput
-  });
+  var _effect = (0, import_tracking4.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react8.default.createElement(FunctionBody, {
+      shape,
+      inputSchema: import_conductor7.ReducerInput,
+      outputSchema: import_conductor7.ReducerOutput
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var createReducer = ({ id, size = {
   width: 192,
@@ -1142,10 +1179,15 @@ var createAppend = (props) => createShape({
   ...props
 });
 var AppendComponent = ({ shape }) => {
-  return /* @__PURE__ */ import_react9.default.createElement(FunctionBody, {
-    shape,
-    inputSchema: import_conductor8.AppendInput
-  });
+  var _effect = (0, import_tracking5.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react9.default.createElement(FunctionBody, {
+      shape,
+      inputSchema: import_conductor8.AppendInput
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var appendShape = {
   type: "append",
@@ -1167,24 +1209,29 @@ var createAudio = (props) => createShape({
   ...props
 });
 var AudioComponent = ({ shape }) => {
-  const { node } = useComputeNodeState(shape);
-  const [active, setActive] = (0, import_react10.useState)(false);
-  (0, import_react10.useEffect)(() => {
-    node.value = active;
-  }, [
-    active
-  ]);
-  return /* @__PURE__ */ import_react10.default.createElement("div", {
-    className: "flex w-full justify-center items-center"
-  }, /* @__PURE__ */ import_react10.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 _effect = (0, import_tracking6.useSignals)();
+  try {
+    const { node } = useComputeNodeState(shape);
+    const [active, setActive] = (0, import_react10.useState)(false);
+    (0, import_react10.useEffect)(() => {
+      node.value = active;
+    }, [
+      active
+    ]);
+    return /* @__PURE__ */ import_react10.default.createElement("div", {
+      className: "flex w-full justify-center items-center"
+    }, /* @__PURE__ */ import_react10.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)
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var audioShape = {
   type: "audio",
@@ -1211,16 +1258,21 @@ var createBeacon = (props) => createShape({
   ...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_react11.default.createElement("div", {
-    className: "flex w-full justify-center items-center"
-  }, /* @__PURE__ */ import_react11.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 _effect = (0, import_tracking7.useSignals)();
+  try {
+    const { runtime } = useComputeNodeState(shape);
+    const input = runtime.inputs[import_conductor9.DEFAULT_INPUT];
+    const value = input?.type === "executed" ? input.value : false;
+    return /* @__PURE__ */ import_react11.default.createElement("div", {
+      className: "flex w-full justify-center items-center"
+    }, /* @__PURE__ */ import_react11.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
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var beaconShape = {
   type: "beacon",
@@ -1245,10 +1297,17 @@ var createGate = (props) => createShape({
   },
   ...props
 });
-var GateComponent = (Symbol22) => () => {
-  return /* @__PURE__ */ import_react12.default.createElement("div", {
-    className: "flex w-full justify-center items-center"
-  }, /* @__PURE__ */ import_react12.default.createElement(Symbol22, null));
+var GateComponent = (Symbol22) => {
+  var _effect = (0, import_tracking8.useSignals)();
+  try {
+    return () => {
+      return /* @__PURE__ */ import_react12.default.createElement("div", {
+        className: "flex w-full justify-center items-center"
+      }, /* @__PURE__ */ import_react12.default.createElement(Symbol22, null));
+    };
+  } finally {
+    _effect.f();
+  }
 };
 var defineShape = ({ type, name, icon, Symbol: Symbol22, createShape: createShape2, inputs, outputs = [
   createAnchorId("output")
@@ -1264,48 +1323,55 @@ var defineShape = ({ type, name, icon, Symbol: Symbol22, createShape: createShap
     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_react12.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_react12.default.createElement("line", {
-    key: i,
-    x1: x,
-    y1: y,
-    x2: startX * 1.3,
-    y2: y,
-    strokeWidth,
-    className
-  })), /* @__PURE__ */ import_react12.default.createElement("line", {
-    x1: endX,
-    y1: centerY,
-    x2: width,
-    y2: centerY,
-    strokeWidth,
-    className
-  }), paths.map((path, i) => /* @__PURE__ */ import_react12.default.createElement("path", {
-    key: i,
-    d: path,
-    strokeWidth,
-    className
-  })));
+var Symbol2 = (pathConstructor, inputs) => {
+  var _effect = (0, import_tracking8.useSignals)();
+  try {
+    return ({
+      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_react12.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_react12.default.createElement("line", {
+        key: i,
+        x1: x,
+        y1: y,
+        x2: startX * 1.3,
+        y2: y,
+        strokeWidth,
+        className
+      })), /* @__PURE__ */ import_react12.default.createElement("line", {
+        x1: endX,
+        y1: centerY,
+        x2: width,
+        y2: centerY,
+        strokeWidth,
+        className
+      }), paths.map((path, i) => /* @__PURE__ */ import_react12.default.createElement("path", {
+        key: i,
+        d: path,
+        strokeWidth,
+        className
+      })));
+    };
+  } finally {
+    _effect.f();
+  }
 };
 var AndSymbol = Symbol2(({ startX, endX, height }) => {
   const arcRadius = (endX - startX) / 2;
@@ -1405,23 +1471,28 @@ var ChatShape = import_effect10.Schema.extend(ComputeShape, import_effect10.Sche
   type: import_effect10.Schema.Literal("chat")
 }));
 var TextInputComponent = ({ shape, title, ...props }) => {
-  const { runtime } = useComputeNodeState(shape);
-  const inputRef = (0, import_react13.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_react13.default.createElement(Box, {
-    shape,
-    title
-  }, /* @__PURE__ */ import_react13.default.createElement(import_react_ui_canvas_editor8.TextBox, {
-    ref: inputRef,
-    onEnter: handleEnter,
-    ...props
-  }));
+  var _effect = (0, import_tracking9.useSignals)();
+  try {
+    const { runtime } = useComputeNodeState(shape);
+    const inputRef = (0, import_react13.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_react13.default.createElement(Box, {
+      shape,
+      title
+    }, /* @__PURE__ */ import_react13.default.createElement(import_react_ui_canvas_editor8.TextBox, {
+      ref: inputRef,
+      onEnter: handleEnter,
+      ...props
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var createChat = (props) => createShape({
   type: "chat",
@@ -1465,52 +1536,57 @@ var inferType = (value) => {
   }
 };
 var ConstantComponent = ({ shape, title, chat, ...props }) => {
-  const { node } = useComputeNodeState(shape);
-  const [type, setType] = (0, import_react14.useState)(inferType(node.value) ?? import_conductor11.ComputeValueType.literals[0]);
-  const inputRef = (0, import_react14.useRef)(null);
-  const handleEnter = (0, import_react14.useCallback)((text) => {
-    const value = text.trim();
-    if (value.length) {
-      if (type === "number") {
-        const floatValue = parseFloat(value);
-        if (!isNaN(floatValue)) {
-          node.value = floatValue;
+  var _effect = (0, import_tracking10.useSignals)();
+  try {
+    const { node } = useComputeNodeState(shape);
+    const [type, setType] = (0, import_react14.useState)(inferType(node.value) ?? import_conductor11.ComputeValueType.literals[0]);
+    const inputRef = (0, import_react14.useRef)(null);
+    const handleEnter = (0, import_react14.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;
         }
-      } else if (type === "object") {
-        node.value = (0, import_util2.safeParseJson)(value, {});
-      } else {
+        inputRef.current?.focus();
+      }
+    }, [
+      type
+    ]);
+    return /* @__PURE__ */ import_react14.default.createElement(Box, {
+      shape,
+      title,
+      status: /* @__PURE__ */ import_react14.default.createElement(TypeSelect, {
+        value: type,
+        onValueChange: setType
+      })
+    }, (type === "string" || type === "number") && /* @__PURE__ */ import_react14.default.createElement(import_react_ui_canvas_editor10.TextBox, {
+      ...props,
+      ref: inputRef,
+      value: node.value,
+      onEnter: handleEnter
+    }), type === "object" && /* @__PURE__ */ import_react14.default.createElement(import_react_ui_canvas_editor10.TextBox, {
+      ...props,
+      ref: inputRef,
+      value: JSON.stringify(node.value, null, 2),
+      language: "json"
+    }), type === "boolean" && /* @__PURE__ */ import_react14.default.createElement("div", {
+      className: "flex grow justify-center items-center"
+    }, /* @__PURE__ */ import_react14.default.createElement(import_react_ui5.Input.Root, null, /* @__PURE__ */ import_react14.default.createElement(import_react_ui5.Input.Switch, {
+      checked: node.value,
+      onCheckedChange: (value) => {
         node.value = value;
       }
-      inputRef.current?.focus();
-    }
-  }, [
-    type
-  ]);
-  return /* @__PURE__ */ import_react14.default.createElement(Box, {
-    shape,
-    title,
-    status: /* @__PURE__ */ import_react14.default.createElement(TypeSelect, {
-      value: type,
-      onValueChange: setType
-    })
-  }, (type === "string" || type === "number") && /* @__PURE__ */ import_react14.default.createElement(import_react_ui_canvas_editor10.TextBox, {
-    ...props,
-    ref: inputRef,
-    value: node.value,
-    onEnter: handleEnter
-  }), type === "object" && /* @__PURE__ */ import_react14.default.createElement(import_react_ui_canvas_editor10.TextBox, {
-    ...props,
-    ref: inputRef,
-    value: JSON.stringify(node.value, null, 2),
-    language: "json"
-  }), type === "boolean" && /* @__PURE__ */ import_react14.default.createElement("div", {
-    className: "flex grow justify-center items-center"
-  }, /* @__PURE__ */ import_react14.default.createElement(import_react_ui5.Input.Root, null, /* @__PURE__ */ import_react14.default.createElement(import_react_ui5.Input.Switch, {
-    checked: node.value,
-    onCheckedChange: (value) => {
-      node.value = value;
-    }
-  }))));
+    }))));
+  } finally {
+    _effect.f();
+  }
 };
 var createConstant = (props) => createShape({
   type: "constant",
@@ -1549,9 +1625,14 @@ var createDatabase = (props) => createShape({
   ...props
 });
 var DatabaseComponent = ({ shape }) => {
-  return /* @__PURE__ */ import_react15.default.createElement(Box, {
-    shape
-  });
+  var _effect = (0, import_tracking11.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react15.default.createElement(Box, {
+      shape
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var databaseShape = {
   type: "database",
@@ -1578,54 +1659,59 @@ var createFunction = (props) => createShape({
   ...props
 });
 var TextInputComponent2 = ({ shape, title, ...props }) => {
-  const client = (0, import_react_client.useClient)();
-  const { node, runtime } = useComputeNodeState(shape);
-  const inputRef = (0, import_react16.useRef)(null);
-  const handleEnter = (0, import_react16.useCallback)(async (text) => {
-    const value = text.trim();
-    const { spaceId, objectId } = (0, import_echo2.parseId)(value);
-    if (!spaceId || !objectId) {
-      return;
-    }
-    const space = client.spaces.get(spaceId);
-    const object = space?.db.getObjectById(objectId);
-    if (!space || !(0, import_echo_schema4.isInstanceOf)(import_functions.ScriptType, object)) {
-      return;
-    }
-    const { objects: [fn] } = await space.db.query(import_echo2.Filter.type(import_functions.FunctionType, {
-      source: import_echo_schema4.Ref.make(object)
-    })).run();
-    if (!fn) {
-      return;
-    }
-    node.value = value;
-    node.function = (0, import_echo2.makeRef)(fn);
-    node.inputSchema = (0, import_echo_schema4.getSnapshot)(fn.inputSchema);
-    node.outputSchema = (0, import_echo_schema4.getSnapshot)(fn.outputSchema);
-  }, [
-    client,
-    node
-  ]);
-  const handleAction = (0, import_react16.useCallback)((action) => {
-    if (action !== "run") {
-      return;
-    }
-    runtime.evalNode();
-  }, [
-    runtime
-  ]);
-  return /* @__PURE__ */ import_react16.default.createElement(Box, {
-    shape,
-    title: "Function",
-    onAction: handleAction
-  }, /* @__PURE__ */ import_react16.default.createElement(import_react_ui_canvas_editor13.TextBox, {
-    ...props,
-    ref: inputRef,
-    value: node.value,
-    language: node.valueType === "object" ? "json" : void 0,
-    onBlur: handleEnter,
-    onEnter: handleEnter
-  }));
+  var _effect = (0, import_tracking12.useSignals)();
+  try {
+    const client = (0, import_react_client.useClient)();
+    const { node, runtime } = useComputeNodeState(shape);
+    const inputRef = (0, import_react16.useRef)(null);
+    const handleEnter = (0, import_react16.useCallback)(async (text) => {
+      const value = text.trim();
+      const { spaceId, objectId } = (0, import_echo2.parseId)(value);
+      if (!spaceId || !objectId) {
+        return;
+      }
+      const space = client.spaces.get(spaceId);
+      const object = space?.db.getObjectById(objectId);
+      if (!space || !(0, import_echo_schema4.isInstanceOf)(import_functions.ScriptType, object)) {
+        return;
+      }
+      const { objects: [fn] } = await space.db.query(import_echo2.Filter.type(import_functions.FunctionType, {
+        source: import_echo_schema4.Ref.make(object)
+      })).run();
+      if (!fn) {
+        return;
+      }
+      node.value = value;
+      node.function = (0, import_echo2.makeRef)(fn);
+      node.inputSchema = (0, import_echo_schema4.getSnapshot)(fn.inputSchema);
+      node.outputSchema = (0, import_echo_schema4.getSnapshot)(fn.outputSchema);
+    }, [
+      client,
+      node
+    ]);
+    const handleAction = (0, import_react16.useCallback)((action) => {
+      if (action !== "run") {
+        return;
+      }
+      runtime.evalNode();
+    }, [
+      runtime
+    ]);
+    return /* @__PURE__ */ import_react16.default.createElement(Box, {
+      shape,
+      title: "Function",
+      onAction: handleAction
+    }, /* @__PURE__ */ import_react16.default.createElement(import_react_ui_canvas_editor13.TextBox, {
+      ...props,
+      ref: inputRef,
+      value: node.value,
+      language: node.valueType === "object" ? "json" : void 0,
+      onBlur: handleEnter,
+      onEnter: handleEnter
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var functionShape = {
   type: "function",
@@ -1647,49 +1733,54 @@ var createGpt = (props) => createShape({
   ...props
 });
 var GptComponent = ({ shape }) => {
-  const { meta, runtime } = useComputeNodeState(shape);
-  const [text, setText] = (0, import_react17.useState)("");
-  const [tokens, setTokens] = (0, import_react17.useState)(0);
-  (0, import_react17.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;
+  var _effect = (0, import_tracking13.useSignals)();
+  try {
+    const { meta, runtime } = useComputeNodeState(shape);
+    const [text, setText] = (0, import_react17.useState)("");
+    const [tokens, setTokens] = (0, import_react17.useState)(0);
+    (0, import_react17.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;
+            }
+            break;
           }
-          break;
         }
-      }
+      });
+    }, [
+      runtime?.subscribeToEventLog
+    ]);
+    return /* @__PURE__ */ import_react17.default.createElement(FunctionBody, {
+      shape,
+      content: /* @__PURE__ */ import_react17.default.createElement("div", {
+        className: "px-2 py-1 overflow-y-scroll"
+      }, text),
+      status: `${tokens} tokens`,
+      inputSchema: meta.input,
+      outputSchema: meta.output
     });
-  }, [
-    runtime?.subscribeToEventLog
-  ]);
-  return /* @__PURE__ */ import_react17.default.createElement(FunctionBody, {
-    shape,
-    content: /* @__PURE__ */ import_react17.default.createElement("div", {
-      className: "px-2 py-1 overflow-y-scroll"
-    }, text),
-    status: `${tokens} tokens`,
-    inputSchema: meta.input,
-    outputSchema: meta.output
-  });
+  } finally {
+    _effect.f();
+  }
 };
 var gptShape = {
   type: "gpt",
@@ -1707,20 +1798,30 @@ var JsonTransformShape = import_effect15.Schema.extend(ComputeShape, import_effe
   type: import_effect15.Schema.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_react18.default.createElement(Box, {
-    shape
-  }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui_syntax_highlighter.JsonFilter, {
-    data: value,
-    classNames: "text-xs"
-  }));
+  var _effect = (0, import_tracking14.useSignals)();
+  try {
+    const { runtime } = useComputeNodeState(shape);
+    const input = runtime.inputs[import_conductor14.DEFAULT_INPUT];
+    const value = input?.type === "executed" ? input.value : void 0;
+    return /* @__PURE__ */ import_react18.default.createElement(Box, {
+      shape
+    }, /* @__PURE__ */ import_react18.default.createElement(import_react_ui_syntax_highlighter.JsonFilter, {
+      data: value,
+      classNames: "text-xs"
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var JsonTransformComponent = ({ shape, ...props }) => {
-  return /* @__PURE__ */ import_react18.default.createElement(Box, {
-    shape
-  });
+  var _effect = (0, import_tracking14.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react18.default.createElement(Box, {
+      shape
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var createJson = (props) => createShape({
   type: "json",
@@ -1772,18 +1873,28 @@ var IfElseShape = import_effect16.Schema.extend(ComputeShape, import_effect16.Sc
   type: import_effect16.Schema.Literal("if-else")
 }));
 var IfComponent = ({ shape, ...props }) => {
-  return /* @__PURE__ */ import_react19.default.createElement(FunctionBody, {
-    shape,
-    inputSchema: import_conductor15.IfInput,
-    outputSchema: import_conductor15.IfOutput
-  });
+  var _effect = (0, import_tracking15.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react19.default.createElement(FunctionBody, {
+      shape,
+      inputSchema: import_conductor15.IfInput,
+      outputSchema: import_conductor15.IfOutput
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var IfElseComponent = ({ shape, ...props }) => {
-  return /* @__PURE__ */ import_react19.default.createElement(FunctionBody, {
-    shape,
-    inputSchema: import_conductor15.IfElseInput,
-    outputSchema: import_conductor15.IfElseOutput
-  });
+  var _effect = (0, import_tracking15.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react19.default.createElement(FunctionBody, {
+      shape,
+      inputSchema: import_conductor15.IfElseInput,
+      outputSchema: import_conductor15.IfElseOutput
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var createIf = (props) => createShape({
   type: "if",
@@ -1829,40 +1940,50 @@ var createQueue = (props) => createShape({
   ...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_react20.default.createElement(Box, {
-    shape,
-    status: `${items.length} items`,
-    onAction: handleAction
-  }, /* @__PURE__ */ import_react20.default.createElement("div", {
-    className: "flex flex-col w-full overflow-y-scroll divide-y divide-separator"
-  }, [
-    ...items
-  ].map((item, i) => /* @__PURE__ */ import_react20.default.createElement(QueueItem, {
-    key: i,
-    classNames: "p-1 px-2",
-    item
-  }))));
+  var _effect = (0, import_tracking16.useSignals)();
+  try {
+    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_react20.default.createElement(Box, {
+      shape,
+      status: `${items.length} items`,
+      onAction: handleAction
+    }, /* @__PURE__ */ import_react20.default.createElement("div", {
+      className: "flex flex-col w-full overflow-y-scroll divide-y divide-separator"
+    }, [
+      ...items
+    ].map((item, i) => /* @__PURE__ */ import_react20.default.createElement(QueueItem, {
+      key: i,
+      classNames: "p-1 px-2",
+      item
+    }))));
+  } finally {
+    _effect.f();
+  }
 };
 var QueueItem = ({ classNames, item }) => {
-  if (typeof item !== "object") {
+  var _effect = (0, import_tracking16.useSignals)();
+  try {
+    if (typeof item !== "object") {
+      return /* @__PURE__ */ import_react20.default.createElement("div", {
+        className: (0, import_react_ui_theme3.mx)(classNames, "whitespace-pre-wrap")
+      }, item);
+    }
     return /* @__PURE__ */ import_react20.default.createElement("div", {
-      className: (0, import_react_ui_theme3.mx)(classNames, "whitespace-pre-wrap")
-    }, item);
+      className: (0, import_react_ui_theme3.mx)("grid grid-cols-[80px,1fr]", classNames)
+    }, Object.entries(item).map(([key, value]) => /* @__PURE__ */ import_react20.default.createElement(import_react20.Fragment, {
+      key
+    }, /* @__PURE__ */ import_react20.default.createElement("div", {
+      className: "p-1 text-xs text-subdued"
+    }, key), /* @__PURE__ */ import_react20.default.createElement("div", null, typeof value === "string" ? value : JSON.stringify(value)))));
+  } finally {
+    _effect.f();
   }
-  return /* @__PURE__ */ import_react20.default.createElement("div", {
-    className: (0, import_react_ui_theme3.mx)("grid grid-cols-[80px,1fr]", classNames)
-  }, Object.entries(item).map(([key, value]) => /* @__PURE__ */ import_react20.default.createElement(import_react20.Fragment, {
-    key
-  }, /* @__PURE__ */ import_react20.default.createElement("div", {
-    className: "p-1 text-xs text-subdued"
-  }, key), /* @__PURE__ */ import_react20.default.createElement("div", null, typeof value === "string" ? value : JSON.stringify(value)))));
 };
 var queueShape = {
   type: "queue",
@@ -1896,37 +2017,42 @@ var icons = [
 ];
 var pickIcon = () => icons[Math.floor(Math.random() * icons.length)];
 var RandomComponent = ({ shape }) => {
-  const { runtime } = useComputeNodeState(shape);
-  const [spin, setSpin] = (0, import_react21.useState)(false);
-  const [icon, setIcon] = (0, import_react21.useState)(pickIcon());
-  (0, import_react21.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);
+  var _effect = (0, import_tracking17.useSignals)();
+  try {
+    const { runtime } = useComputeNodeState(shape);
+    const [spin, setSpin] = (0, import_react21.useState)(false);
+    const [icon, setIcon] = (0, import_react21.useState)(pickIcon());
+    (0, import_react21.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);
     };
-  }, [
-    spin
-  ]);
-  const handleClick = (ev) => {
-    ev.stopPropagation();
-    runtime.setOutput(import_conductor17.DEFAULT_OUTPUT, Math.random());
-    setSpin(true);
-  };
-  return /* @__PURE__ */ import_react21.default.createElement("div", {
-    className: "flex grow items-center justify-center"
-  }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui6.Icon, {
-    icon,
-    classNames: (0, import_react_ui_theme4.mx)(spin && "animate-[spin_1s]"),
-    size: 10,
-    onClick: handleClick
-  }));
+    return /* @__PURE__ */ import_react21.default.createElement("div", {
+      className: "flex grow items-center justify-center"
+    }, /* @__PURE__ */ import_react21.default.createElement(import_react_ui6.Icon, {
+      icon,
+      classNames: (0, import_react_ui_theme4.mx)(spin && "animate-[spin_1s]"),
+      size: 10,
+      onClick: handleClick
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var randomShape = {
   type: "rng",
@@ -1954,20 +2080,25 @@ var createScope = (props) => createShape({
   ...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_react22.default.createElement("div", {
-    className: "flex w-full justify-center items-center bg-black"
-  }, /* @__PURE__ */ import_react22.default.createElement(import_react_ui_sfx.Chaos, {
-    active,
-    getValue: getAverage,
-    options: {
-      ...import_react_ui_sfx.shaderPresets.heptapod,
-      zoom: 1.2
-    }
-  }));
+  var _effect = (0, import_tracking18.useSignals)();
+  try {
+    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_react22.default.createElement("div", {
+      className: "flex w-full justify-center items-center bg-black"
+    }, /* @__PURE__ */ import_react22.default.createElement(import_react_ui_sfx.Chaos, {
+      active,
+      getValue: getAverage,
+      options: {
+        ...import_react_ui_sfx.shaderPresets.heptapod,
+        zoom: 1.2
+      }
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var scopeShape = {
   type: "scope",
@@ -1994,24 +2125,29 @@ var createSurface = (props) => createShape({
   ...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_react23.default.createElement(Box, {
-    shape,
-    onAction: handleAction
-  }, value !== null && /* @__PURE__ */ import_react23.default.createElement(import_app_framework.Surface, {
-    role: "canvas-node",
-    data: {
-      value
-    },
-    limit: 1
-  }));
+  var _effect = (0, import_tracking19.useSignals)();
+  try {
+    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_react23.default.createElement(Box, {
+      shape,
+      onAction: handleAction
+    }, value !== null && /* @__PURE__ */ import_react23.default.createElement(import_app_framework.Surface, {
+      role: "canvas-node",
+      data: {
+        value
+      },
+      limit: 1
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var surfaceShape = {
   type: "surface",
@@ -2039,20 +2175,25 @@ var createSwitch = (props) => createShape({
   ...props
 });
 var SwitchComponent = ({ shape }) => {
-  const { runtime } = useComputeNodeState(shape);
-  const [value, setValue] = (0, import_react24.useState)(false);
-  (0, import_react24.useEffect)(() => {
-    runtime.setOutput(import_conductor20.DEFAULT_OUTPUT, value);
-  }, [
-    value
-  ]);
-  return /* @__PURE__ */ import_react24.default.createElement("div", {
-    className: "flex w-full justify-center items-center",
-    onClick: (ev) => ev.stopPropagation()
-  }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui7.Input.Root, null, /* @__PURE__ */ import_react24.default.createElement(import_react_ui7.Input.Switch, {
-    checked: value,
-    onCheckedChange: (value2) => setValue(value2)
-  })));
+  var _effect = (0, import_tracking20.useSignals)();
+  try {
+    const { runtime } = useComputeNodeState(shape);
+    const [value, setValue] = (0, import_react24.useState)(false);
+    (0, import_react24.useEffect)(() => {
+      runtime.setOutput(import_conductor20.DEFAULT_OUTPUT, value);
+    }, [
+      value
+    ]);
+    return /* @__PURE__ */ import_react24.default.createElement("div", {
+      className: "flex w-full justify-center items-center",
+      onClick: (ev) => ev.stopPropagation()
+    }, /* @__PURE__ */ import_react24.default.createElement(import_react_ui7.Input.Root, null, /* @__PURE__ */ import_react24.default.createElement(import_react_ui7.Input.Switch, {
+      checked: value,
+      onCheckedChange: (value2) => setValue(value2)
+    })));
+  } finally {
+    _effect.f();
+  }
 };
 var switchShape = {
   type: "switch",
@@ -2081,9 +2222,14 @@ var createTable = (props) => createShape({
   ...props
 });
 var TableComponent = ({ shape }) => {
-  return /* @__PURE__ */ import_react25.default.createElement(Box, {
-    shape
-  });
+  var _effect = (0, import_tracking21.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react25.default.createElement(Box, {
+      shape
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var tableShape = {
   type: "table",
@@ -2100,44 +2246,49 @@ var TemplateShape = import_effect23.Schema.extend(ComputeShape, import_effect23.
   valueType: import_effect23.Schema.optional(import_conductor22.ComputeValueType)
 }));
 var TextInputComponent3 = ({ shape, title, ...props }) => {
-  const { node } = useComputeNodeState(shape);
-  const inputRef = (0, import_react26.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_schema5.toJsonSchema)(schema);
-    }
-  };
-  const handleTypeChange = (newType) => {
-    (0, import_invariant5.invariant)(import_effect23.Schema.is(import_conductor22.ComputeValueType)(newType), "Invalid type", {
-      F: __dxlog_file6,
-      L: 58,
-      S: void 0,
-      A: [
-        "Schema.is(ComputeValueType)(newType)",
-        "'Invalid type'"
-      ]
-    });
-    node.valueType = newType;
-    node.inputSchema = (0, import_echo_schema5.toJsonSchema)((0, import_conductor22.getTemplateInputSchema)(node));
-  };
-  return /* @__PURE__ */ import_react26.default.createElement(Box, {
-    shape,
-    title: "Template",
-    status: /* @__PURE__ */ import_react26.default.createElement(TypeSelect, {
-      value: node.valueType ?? "string",
-      onValueChange: handleTypeChange
-    })
-  }, /* @__PURE__ */ import_react26.default.createElement(import_react_ui_canvas_editor19.TextBox, {
-    ...props,
-    ref: inputRef,
-    value: node.value,
-    language: node.valueType === "object" ? "json" : void 0,
-    onBlur: handleEnter,
-    onEnter: handleEnter
-  }));
+  var _effect = (0, import_tracking22.useSignals)();
+  try {
+    const { node } = useComputeNodeState(shape);
+    const inputRef = (0, import_react26.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_schema5.toJsonSchema)(schema);
+      }
+    };
+    const handleTypeChange = (newType) => {
+      (0, import_invariant5.invariant)(import_effect23.Schema.is(import_conductor22.ComputeValueType)(newType), "Invalid type", {
+        F: __dxlog_file6,
+        L: 58,
+        S: void 0,
+        A: [
+          "Schema.is(ComputeValueType)(newType)",
+          "'Invalid type'"
+        ]
+      });
+      node.valueType = newType;
+      node.inputSchema = (0, import_echo_schema5.toJsonSchema)((0, import_conductor22.getTemplateInputSchema)(node));
+    };
+    return /* @__PURE__ */ import_react26.default.createElement(Box, {
+      shape,
+      title: "Template",
+      status: /* @__PURE__ */ import_react26.default.createElement(TypeSelect, {
+        value: node.valueType ?? "string",
+        onValueChange: handleTypeChange
+      })
+    }, /* @__PURE__ */ import_react26.default.createElement(import_react_ui_canvas_editor19.TextBox, {
+      ...props,
+      ref: inputRef,
+      value: node.value,
+      language: node.valueType === "object" ? "json" : void 0,
+      onBlur: handleEnter,
+      onEnter: handleEnter
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var createTemplate = (props) => createShape({
   type: "template",
@@ -2171,20 +2322,25 @@ var createText = (props) => createShape({
   ...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_react27.default.createElement(Box, {
-    shape,
-    onAction: handleAction
-  }, /* @__PURE__ */ import_react27.default.createElement(import_react_ui_canvas_editor20.TextBox, {
-    value
-  }));
+  var _effect = (0, import_tracking23.useSignals)();
+  try {
+    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_react27.default.createElement(Box, {
+      shape,
+      onAction: handleAction
+    }, /* @__PURE__ */ import_react27.default.createElement(import_react_ui_canvas_editor20.TextBox, {
+      value
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var textShape = {
   type: "text",
@@ -2214,39 +2370,49 @@ var createThread = (props) => createShape({
   ...props
 });
 var ThreadComponent = ({ shape }) => {
-  const items = [];
-  const scrollRef = (0, import_react28.useRef)(null);
-  (0, import_react28.useEffect)(() => {
-    if (scrollRef.current) {
-      scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
-    }
-  }, [
-    items
-  ]);
-  return /* @__PURE__ */ import_react28.default.createElement(Box, {
-    shape
-  }, /* @__PURE__ */ import_react28.default.createElement("div", {
-    ref: scrollRef,
-    className: "flex flex-col w-full overflow-y-scroll gap-2 p-2"
-  }, [
-    ...items
-  ].map((item, i) => /* @__PURE__ */ import_react28.default.createElement(ThreadItem, {
-    key: i,
-    item
-  }))));
+  var _effect = (0, import_tracking24.useSignals)();
+  try {
+    const items = [];
+    const scrollRef = (0, import_react28.useRef)(null);
+    (0, import_react28.useEffect)(() => {
+      if (scrollRef.current) {
+        scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
+      }
+    }, [
+      items
+    ]);
+    return /* @__PURE__ */ import_react28.default.createElement(Box, {
+      shape
+    }, /* @__PURE__ */ import_react28.default.createElement("div", {
+      ref: scrollRef,
+      className: "flex flex-col w-full overflow-y-scroll gap-2 p-2"
+    }, [
+      ...items
+    ].map((item, i) => /* @__PURE__ */ import_react28.default.createElement(ThreadItem, {
+      key: i,
+      item
+    }))));
+  } finally {
+    _effect.f();
+  }
 };
 var ThreadItem = ({ classNames, item }) => {
-  if (typeof item !== "object") {
+  var _effect = (0, import_tracking24.useSignals)();
+  try {
+    if (typeof item !== "object") {
+      return /* @__PURE__ */ import_react28.default.createElement("div", {
+        className: (0, import_react_ui_theme5.mx)(classNames)
+      }, item);
+    }
+    const { role, message } = item;
     return /* @__PURE__ */ import_react28.default.createElement("div", {
-      className: (0, import_react_ui_theme5.mx)(classNames)
-    }, item);
+      className: (0, import_react_ui_theme5.mx)("flex", classNames, role === "user" && "justify-end")
+    }, /* @__PURE__ */ import_react28.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));
+  } finally {
+    _effect.f();
   }
-  const { role, message } = item;
-  return /* @__PURE__ */ import_react28.default.createElement("div", {
-    className: (0, import_react_ui_theme5.mx)("flex", classNames, role === "user" && "justify-end")
-  }, /* @__PURE__ */ import_react28.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",
@@ -2269,9 +2435,14 @@ var createTextToImage = (props) => createShape({
   ...props
 });
 var TextToImageComponent = ({ shape }) => {
-  return /* @__PURE__ */ import_react29.default.createElement(Box, {
-    shape
-  });
+  var _effect = (0, import_tracking25.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react29.default.createElement(Box, {
+      shape
+    });
+  } finally {
+    _effect.f();
+  }
 };
 var textToImageShape = {
   type: "text-to-image",
@@ -2306,56 +2477,66 @@ var createTrigger = (props) => {
   });
 };
 var TriggerComponent = ({ shape }) => {
-  const space = (0, import_echo3.useSpace)();
-  const functionTrigger = shape.functionTrigger?.target;
-  (0, import_react30.useEffect)(() => {
-    if (functionTrigger && !functionTrigger.spec) {
-      functionTrigger.spec = createTriggerSpec({
-        triggerKind: import_functions2.TriggerKind.Email,
-        spaceId: space?.id
-      });
-    }
-  }, [
-    functionTrigger,
-    functionTrigger?.spec
-  ]);
-  (0, import_react30.useEffect)(() => {
-    shape.size.height = getHeight(getOutputSchema(functionTrigger?.spec?.kind ?? import_functions2.TriggerKind.Email));
-  }, [
-    functionTrigger?.spec?.kind
-  ]);
-  const setKind = (kind) => {
-    if (functionTrigger?.spec?.kind !== kind) {
-      functionTrigger.spec = createTriggerSpec({
-        triggerKind: kind,
-        spaceId: space?.id
-      });
+  var _effect = (0, import_tracking26.useSignals)();
+  try {
+    const space = (0, import_echo3.useSpace)();
+    const functionTrigger = shape.functionTrigger?.target;
+    (0, import_react30.useEffect)(() => {
+      if (functionTrigger && !functionTrigger.spec) {
+        functionTrigger.spec = createTriggerSpec({
+          triggerKind: import_functions2.TriggerKind.Email,
+          spaceId: space?.id
+        });
+      }
+    }, [
+      functionTrigger,
+      functionTrigger?.spec
+    ]);
+    (0, import_react30.useEffect)(() => {
+      shape.size.height = getHeight(getOutputSchema(functionTrigger?.spec?.kind ?? import_functions2.TriggerKind.Email));
+    }, [
+      functionTrigger?.spec?.kind
+    ]);
+    const setKind = (kind) => {
+      if (functionTrigger?.spec?.kind !== kind) {
+        functionTrigger.spec = createTriggerSpec({
+          triggerKind: kind,
+          spaceId: space?.id
+        });
+      }
+    };
+    if (!functionTrigger?.spec) {
+      return;
     }
-  };
-  if (!functionTrigger?.spec) {
-    return;
+    return /* @__PURE__ */ import_react30.default.createElement(FunctionBody, {
+      shape,
+      status: /* @__PURE__ */ import_react30.default.createElement(TriggerKindSelect, {
+        value: functionTrigger.spec?.kind,
+        onValueChange: (kind) => setKind(kind)
+      }),
+      inputSchema: import_conductor25.VoidInput,
+      outputSchema: getOutputSchema(functionTrigger.spec.kind)
+    });
+  } finally {
+    _effect.f();
   }
-  return /* @__PURE__ */ import_react30.default.createElement(FunctionBody, {
-    shape,
-    status: /* @__PURE__ */ import_react30.default.createElement(TriggerKindSelect, {
-      value: functionTrigger.spec?.kind,
-      onValueChange: (kind) => setKind(kind)
-    }),
-    inputSchema: import_conductor25.VoidInput,
-    outputSchema: getOutputSchema(functionTrigger.spec.kind)
-  });
 };
 var TriggerKindSelect = ({ value, onValueChange }) => {
-  return /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Root, {
-    value,
-    onValueChange
-  }, /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.TriggerButton, {
-    variant: "ghost",
-    classNames: "w-full !px-0"
-  }), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Portal, null, /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Content, null, /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.ScrollUpButton, null), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Viewport, null, Object.values(import_functions2.TriggerKind).map((kind) => /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Option, {
-    key: kind,
-    value: kind
-  }, kind))), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.ScrollDownButton, null), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Arrow, null))));
+  var _effect = (0, import_tracking26.useSignals)();
+  try {
+    return /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Root, {
+      value,
+      onValueChange
+    }, /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.TriggerButton, {
+      variant: "ghost",
+      classNames: "w-full !px-0"
+    }), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Portal, null, /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Content, null, /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.ScrollUpButton, null), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Viewport, null, Object.values(import_functions2.TriggerKind).map((kind) => /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Option, {
+      key: kind,
+      value: kind
+    }, kind))), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.ScrollDownButton, null), /* @__PURE__ */ import_react30.default.createElement(import_react_ui8.Select.Arrow, null))));
+  } finally {
+    _effect.f();
+  }
 };
 var createTriggerSpec = (props) => {
   const kind = props.triggerKind ?? import_functions2.TriggerKind.Email;
@@ -2423,100 +2604,105 @@ var createGptRealtime = (props) => createShape({
   ...props
 });
 var GptRealtimeComponent = ({ shape }) => {
-  const [isLive, setIsLive] = (0, import_react31.useState)(false);
-  const [isReady, setIsReady] = (0, import_react31.useState)(false);
-  const config = (0, import_react_client2.useConfig)();
-  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 aiServiceUrl = new URL("/rtc-connect", config.values.runtime?.services?.ai?.server ?? DEFAULT_AI_SERVICE_URL);
-      const response = await fetch(aiServiceUrl, {
-        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 = () => {
-        import_log2.log.info("Configuring data channel", void 0, {
-          F: __dxlog_file7,
-          L: 87,
-          S: void 0,
-          C: (f, a) => f(...a)
+  var _effect = (0, import_tracking27.useSignals)();
+  try {
+    const [isLive, setIsLive] = (0, import_react31.useState)(false);
+    const [isReady, setIsReady] = (0, import_react31.useState)(false);
+    const config = (0, import_react_client2.useConfig)();
+    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
         });
-        const event = {
-          type: "session.update",
-          session: {
-            modalities: [
-              "text",
-              "audio"
-            ],
-            // Provide the tools. Note they match the keys in the `fns` object above
-            tools: []
+        stream.getTracks().forEach((track) => peerConnection.addTransceiver(track, {
+          direction: "sendrecv"
+        }));
+        const offer = await peerConnection.createOffer();
+        await peerConnection.setLocalDescription(offer);
+        const aiServiceUrl = new URL("/rtc-connect", config.values.runtime?.services?.ai?.server ?? DEFAULT_AI_SERVICE_URL);
+        const response = await fetch(aiServiceUrl, {
+          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 = () => {
+          import_log2.log.info("Configuring data channel", void 0, {
+            F: __dxlog_file7,
+            L: 87,
+            S: void 0,
+            C: (f, a) => f(...a)
+          });
+          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.send(JSON.stringify(event));
-      };
-      dataChannel.addEventListener("open", (ev) => {
-        import_log2.log.info("Opening data channel", {
-          ev
+        dataChannel.addEventListener("open", (ev) => {
+          import_log2.log.info("Opening data channel", {
+            ev
+          }, {
+            F: __dxlog_file7,
+            L: 100,
+            S: void 0,
+            C: (f, a) => f(...a)
+          });
+          configureData();
+        });
+        dataChannel.addEventListener("message", async (ev) => {
+          const msg = JSON.parse(ev.data);
+          if (msg.type === "response.function_call_arguments.done") {
+          }
+        });
+      } catch (error) {
+        import_log2.log.error("Error in realtime session:", {
+          error
         }, {
           F: __dxlog_file7,
-          L: 100,
+          L: 140,
           S: void 0,
           C: (f, a) => f(...a)
         });
-        configureData();
-      });
-      dataChannel.addEventListener("message", async (ev) => {
-        const msg = JSON.parse(ev.data);
-        if (msg.type === "response.function_call_arguments.done") {
-        }
-      });
-    } catch (error) {
-      import_log2.log.error("Error in realtime session:", {
-        error
-      }, {
-        F: __dxlog_file7,
-        L: 140,
-        S: void 0,
-        C: (f, a) => f(...a)
-      });
-      throw error;
-    }
-  };
-  return /* @__PURE__ */ import_react31.default.createElement("div", {
-    className: "flex w-full justify-center items-center"
-  }, /* @__PURE__ */ import_react31.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
-  }));
+        throw error;
+      }
+    };
+    return /* @__PURE__ */ import_react31.default.createElement("div", {
+      className: "flex w-full justify-center items-center"
+    }, /* @__PURE__ */ import_react31.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
+    }));
+  } finally {
+    _effect.f();
+  }
 };
 var gptRealtimeShape = {
   type: "gpt-realtime",
@@ -2593,8 +2779,7 @@ var computeShapes = [
 ];
 var ComputeShapeLayout = class extends import_react_ui_canvas_editor23.ShapeLayout {
   constructor(_controller, registry2) {
-    super(registry2);
-    this._controller = _controller;
+    super(registry2), this._controller = _controller;
   }
   // TODO(burdon): Doesn't update.
   getAnchors(shape) {