@dxos/react-ui-canvas-compute 0.8.0 → 0.8.1-main.a06ad20

package/dist/lib/browser/index.mjs

@@ -91,8 +91,58 @@ var useComputeContext = () => {
   return useContext(ComputeContext) ?? raise2(new Error("Missing ComputeContext"));
 };
 
+// packages/ui/react-ui-canvas-compute/src/hooks/useComputeGraphController.ts
+import { useEffect, useState } from "react";
+var combine = (...cbs) => {
+  return () => {
+    for (const cb of cbs) {
+      cb();
+    }
+  };
+};
+var useComputeGraphController = ({ controller, graph, editorRef }) => {
+  const [, forceUpdate] = useState({});
+  useEffect(() => {
+    if (!controller || !graph) {
+      return;
+    }
+    void controller.open();
+    const off = combine(
+      controller.update.on(() => {
+        void editorRef.current?.update();
+        forceUpdate({});
+      }),
+      // TODO(burdon): Every node is called on every update.
+      controller.output.on(({ nodeId, property, value }) => {
+        if (value.type === "not-executed") {
+          return;
+        }
+        const edge = graph.edges.find((edge2) => {
+          const source = graph.getNode(edge2.source);
+          return source.node === nodeId && edge2.output === property;
+        });
+        if (edge) {
+          void editorRef.current?.action?.({
+            type: "trigger",
+            edges: [
+              edge
+            ]
+          });
+        }
+      })
+    );
+    return () => {
+      void controller.close();
+      off();
+    };
+  }, [
+    graph,
+    controller
+  ]);
+};
+
 // packages/ui/react-ui-canvas-compute/src/hooks/useComputeNodeState.ts
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect as useEffect2, useState as useState2 } from "react";
 import { S } from "@dxos/echo-schema";
 import { invariant as invariant2 } from "@dxos/invariant";
 var __dxlog_file2 = "/home/runner/work/dxos/dxos/packages/ui/react-ui-canvas-compute/src/hooks/useComputeNodeState.ts";
@@ -107,8 +157,8 @@ var useComputeNodeState = (shape) => {
       ""
     ]
   });
-  const [meta, setMeta] = useState();
-  useEffect(() => {
+  const [meta, setMeta] = useState2();
+  useEffect2(() => {
     let disposed = false;
     queueMicrotask(async () => {
       invariant2(shape.node, "Node not specified", {
@@ -664,14 +714,14 @@ var Box = /* @__PURE__ */ forwardRef(({ children, classNames, shape, title, stat
 });
 
 // packages/ui/react-ui-canvas-compute/src/shapes/common/FunctionBody.tsx
-import React2, { useRef, useState as useState2 } from "react";
+import React2, { useRef, useState as useState3 } from "react";
 import { VoidInput, VoidOutput } from "@dxos/conductor";
 import { AST as AST2 } from "@dxos/echo-schema";
 import { useCanvasContext } from "@dxos/react-ui-canvas";
 import { getParentShapeElement, createAnchors, rowHeight } from "@dxos/react-ui-canvas-editor";
 
 // packages/ui/react-ui-canvas-compute/src/shapes/defs.ts
-import { AST } from "@effect/schema";
+import { SchemaAST as AST } from "effect";
 import { DEFAULT_INPUT as DEFAULT_INPUT2, DEFAULT_OUTPUT as DEFAULT_OUTPUT2 } from "@dxos/conductor";
 import { ObjectId as ObjectId3, S as S2 } from "@dxos/echo-schema";
 import { Polygon } from "@dxos/react-ui-canvas-editor";
@@ -708,7 +758,7 @@ var expandedHeight = 200;
 var FunctionBody = ({ shape, name, content, inputSchema = VoidInput, outputSchema = VoidOutput, ...props }) => {
   const { scale } = useCanvasContext();
   const rootRef = useRef(null);
-  const [open, setOpen] = useState2(false);
+  const [open, setOpen] = useState3(false);
   const handleAction = (action) => {
     if (!rootRef.current) {
       return;
@@ -863,7 +913,7 @@ var appendShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/Audio.tsx
-import React6, { useEffect as useEffect2, useState as useState3 } from "react";
+import React6, { useEffect as useEffect3, useState as useState4 } from "react";
 import { S as S5 } from "@dxos/echo-schema";
 import { Icon as Icon2 } from "@dxos/react-ui";
 import { createAnchorMap } from "@dxos/react-ui-canvas-editor";
@@ -880,8 +930,8 @@ var createAudio = (props) => createShape({
 });
 var AudioComponent = ({ shape }) => {
   const { node } = useComputeNodeState(shape);
-  const [active, setActive] = useState3(false);
-  useEffect2(() => {
+  const [active, setActive] = useState4(false);
+  useEffect3(() => {
     node.value = active;
   }, [
     active
@@ -1183,7 +1233,7 @@ var chatShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/Constant.tsx
-import React10, { useCallback as useCallback2, useRef as useRef3, useState as useState4 } from "react";
+import React10, { useCallback as useCallback2, useRef as useRef3, useState as useState5 } from "react";
 import { ComputeValueType as ComputeValueType2 } from "@dxos/conductor";
 import { S as S9 } from "@dxos/echo-schema";
 import { Input } from "@dxos/react-ui";
@@ -1207,7 +1257,7 @@ var inferType = (value) => {
 };
 var ConstantComponent = ({ shape, title, chat, ...props }) => {
   const { node } = useComputeNodeState(shape);
-  const [type, setType] = useState4(inferType(node.value) ?? ComputeValueType2.literals[0]);
+  const [type, setType] = useState5(inferType(node.value) ?? ComputeValueType2.literals[0]);
   const inputRef = useRef3(null);
   const handleEnter = useCallback2((text) => {
     const value = text.trim();
@@ -1392,7 +1442,7 @@ var functionShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/Gpt.tsx
-import React13, { useEffect as useEffect3, useState as useState5 } from "react";
+import React13, { useEffect as useEffect4, useState as useState6 } from "react";
 import { GptInput, GptOutput } from "@dxos/conductor";
 import { S as S12 } from "@dxos/echo-schema";
 var GptShape = S12.extend(ComputeShape, S12.Struct({
@@ -1408,9 +1458,9 @@ var createGpt = (props) => createShape({
 });
 var GptComponent = ({ shape }) => {
   const { meta, runtime } = useComputeNodeState(shape);
-  const [text, setText] = useState5("");
-  const [tokens, setTokens] = useState5(0);
-  useEffect3(() => {
+  const [text, setText] = useState6("");
+  const [tokens, setTokens] = useState6(0);
+  useEffect4(() => {
     return runtime.subscribeToEventLog((ev) => {
       switch (ev.type) {
         case "begin-compute": {
@@ -1653,7 +1703,7 @@ var queueShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/RNG.tsx
-import React17, { useEffect as useEffect4, useState as useState6 } from "react";
+import React17, { useEffect as useEffect5, useState as useState7 } from "react";
 import { DEFAULT_OUTPUT as DEFAULT_OUTPUT5 } from "@dxos/conductor";
 import { S as S16 } from "@dxos/echo-schema";
 import { Icon as Icon4 } from "@dxos/react-ui";
@@ -1683,9 +1733,9 @@ var icons = [
 var pickIcon = () => icons[Math.floor(Math.random() * icons.length)];
 var RandomComponent = ({ shape }) => {
   const { runtime } = useComputeNodeState(shape);
-  const [spin, setSpin] = useState6(false);
-  const [icon, setIcon] = useState6(pickIcon());
-  useEffect4(() => {
+  const [spin, setSpin] = useState7(false);
+  const [icon, setIcon] = useState7(pickIcon());
+  useEffect5(() => {
     if (!spin) {
       return;
     }
@@ -1829,7 +1879,7 @@ var surfaceShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/Switch.tsx
-import React20, { useEffect as useEffect5, useState as useState7 } from "react";
+import React20, { useEffect as useEffect6, useState as useState8 } from "react";
 import { DEFAULT_OUTPUT as DEFAULT_OUTPUT6 } from "@dxos/conductor";
 import { S as S19 } from "@dxos/echo-schema";
 import { Input as Input2 } from "@dxos/react-ui";
@@ -1847,8 +1897,8 @@ var createSwitch = (props) => createShape({
 });
 var SwitchComponent = ({ shape }) => {
   const { runtime } = useComputeNodeState(shape);
-  const [value, setValue] = useState7(false);
-  useEffect5(() => {
+  const [value, setValue] = useState8(false);
+  useEffect6(() => {
     runtime.setOutput(DEFAULT_OUTPUT6, value);
   }, [
     value
@@ -2028,7 +2078,7 @@ var textShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/Thread.tsx
-import React24, { useEffect as useEffect6, useRef as useRef6 } from "react";
+import React24, { useEffect as useEffect7, useRef as useRef6 } from "react";
 import { createInputSchema as createInputSchema2, createOutputSchema as createOutputSchema2, GptMessage as GptMessage2 } from "@dxos/conductor";
 import { S as S23 } from "@dxos/echo-schema";
 import { mx as mx5 } from "@dxos/react-ui-theme";
@@ -2048,7 +2098,7 @@ var createThread = (props) => createShape({
 var ThreadComponent = ({ shape }) => {
   const items = [];
   const scrollRef = useRef6(null);
-  useEffect6(() => {
+  useEffect7(() => {
     if (scrollRef.current) {
       scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
     }
@@ -2125,7 +2175,7 @@ var textToImageShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/Trigger.tsx
-import React26, { useEffect as useEffect7 } from "react";
+import React26, { useEffect as useEffect8 } from "react";
 import { EmailTriggerOutput, QueueTriggerOutput, SubscriptionTriggerOutput, TimerTriggerOutput, VoidInput as VoidInput3, WebhookTriggerOutput } from "@dxos/conductor";
 import { ObjectId as ObjectId4, Ref, S as S25 } from "@dxos/echo-schema";
 import { FunctionTrigger, TriggerKind } from "@dxos/functions";
@@ -2154,7 +2204,7 @@ var createTrigger = (props) => {
 var TriggerComponent = ({ shape }) => {
   const space = useSpace();
   const functionTrigger = shape.functionTrigger?.target;
-  useEffect7(() => {
+  useEffect8(() => {
     if (functionTrigger && !functionTrigger.spec) {
       functionTrigger.spec = createTriggerSpec({
         triggerKind: TriggerKind.Email,
@@ -2165,7 +2215,7 @@ var TriggerComponent = ({ shape }) => {
     functionTrigger,
     functionTrigger?.spec
   ]);
-  useEffect7(() => {
+  useEffect8(() => {
     shape.size.height = getHeight(getOutputSchema(functionTrigger?.spec?.type ?? TriggerKind.Email));
   }, [
     functionTrigger?.spec?.type
@@ -2258,7 +2308,7 @@ var triggerShape = {
 };
 
 // packages/ui/react-ui-canvas-compute/src/shapes/GptRealtime.tsx
-import React27, { useState as useState8 } from "react";
+import React27, { useState as useState9 } from "react";
 import { S as S26 } from "@dxos/echo-schema";
 import { log as log2 } from "@dxos/log";
 import { useConfig } from "@dxos/react-client";
@@ -2276,8 +2326,8 @@ var createGptRealtime = (props) => createShape({
   ...props
 });
 var GptRealtimeComponent = ({ shape }) => {
-  const [isLive, setIsLive] = useState8(false);
-  const [isReady, setIsReady] = useState8(false);
+  const [isLive, setIsLive] = useState9(false);
+  const [isReady, setIsReady] = useState9(false);
   const config = useConfig();
   const start = async () => {
     setIsLive(true);
@@ -2605,6 +2655,7 @@ export {
   threadShape,
   triggerShape,
   useComputeContext,
+  useComputeGraphController,
   useComputeNodeState,
   useGraphMonitor
 };