@receptron/graphai_vue_cytoscape 0.0.16 → 0.2.0

package/README.md

@@ -23,9 +23,7 @@ export default defineComponent({
     
     const run = async () => {
       const graphai = new GraphAI(selectdGraph.value, agents);
-      graphai.onLogCallback = async ({ nodeId, state }) => {
-        updateCytoscape(nodeId, state);
-      };
+      graphai.registerCallback(updateCytoscape);
       await graphai.run();
     }
     run();
@@ -37,3 +35,6 @@ export default defineComponent({
 });
 ```
 
+### requirement
+
+GraphAI 0.6.23 or above

package/lib/cytoscape.d.ts

@@ -1,11 +1,11 @@
 import { Ref, ComputedRef } from "vue";
-import { GraphData, NodeState } from "graphai";
+import { GraphData, TransactionLog } from "graphai";
 import { DataSource } from "graphai/lib/type";
 export declare const inputs2dataSources: (inputs: any) => string[];
 export declare const dataSourceNodeIds: (sources: DataSource[]) => string[];
 export declare const useCytoscape: (selectedGraph: ComputedRef<GraphData> | Ref<GraphData>) => {
     cytoscapeRef: Ref<any, any>;
-    updateCytoscape: (nodeId: string, state: NodeState) => Promise<void>;
+    updateCytoscape: (log: TransactionLog) => Promise<void>;
     resetCytoscape: () => void;
     layoutCytoscape: (key: string) => void;
     loadLayout: (key: string) => void;

package/lib/cytoscape.js

@@ -270,12 +270,13 @@ var useCytoscape = function (selectedGraph) {
     var cytoscapeData = (0, vue_1.ref)(cytoscapeFromGraph((_a = selectedGraph.value) !== null && _a !== void 0 ? _a : { nodes: {} }));
     var cytoscapeRef = (0, vue_1.ref)();
     var zoomingEnabled = (0, vue_1.ref)(true);
-    var updateCytoscape = function (nodeId, state) { return __awaiter(void 0, void 0, void 0, function () {
-        var elements, graph, nodeData;
+    var updateCytoscape = function (log) { return __awaiter(void 0, void 0, void 0, function () {
+        var nodeId, state, elements, graph, nodeData;
         var _a, _b, _c;
         return __generator(this, function (_d) {
             switch (_d.label) {
                 case 0:
+                    nodeId = log.nodeId, state = log.state;
                     if (![graphai_1.NodeState.Completed, graphai_1.NodeState.Waiting].includes(state)) return [3 /*break*/, 2];
                     return [4 /*yield*/, (0, graphai_1.sleep)(100)];
                 case 1:
@@ -283,9 +284,10 @@ var useCytoscape = function (selectedGraph) {
                     _d.label = 2;
                 case 2:
                     elements = cytoscapeData.value.elements;
+                    if (!elements.map[nodeId]) return [3 /*break*/, 4];
                     elements.map[nodeId].data.color = colorMap[state];
                     graph = selectedGraph.value;
-                    nodeData = (_b = ((_a = graph === null || graph === void 0 ? void 0 : graph.nodes) !== null && _a !== void 0 ? _a : {})[nodeId]) !== null && _b !== void 0 ? _b : [];
+                    nodeData = (_b = ((_a = graph === null || graph === void 0 ? void 0 : graph.nodes) !== null && _a !== void 0 ? _a : {})[nodeId]) !== null && _b !== void 0 ? _b : {};
                     if ("agent" in nodeData && state === graphai_1.NodeState.Queued && ((_c = nodeData.priority) !== null && _c !== void 0 ? _c : 0) > 0) {
                         // computed node
                         elements.map[nodeId].data.color = colorPriority;
@@ -344,7 +346,7 @@ var useCytoscape = function (selectedGraph) {
                         }
                         return prevName;
                     }, layout);
-                    console.log("layout", name_1);
+                    // console.log("layout", name);
                     cy.layout({ name: name_1 }).run();
                     cy.fit();
                     if (!(name_1 === layout)) return [3 /*break*/, 2];
@@ -358,7 +360,7 @@ var useCytoscape = function (selectedGraph) {
         });
     }); };
     var storePositions = function () {
-        console.log("storePositions");
+        // console.log("storePositions");
         if (cy) {
             cy.nodes().forEach(function (cynode) {
                 var id = cynode.id();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@receptron/graphai_vue_cytoscape",
-  "version": "0.0.16",
+  "version": "0.2.0",
   "main": "lib/cytoscape.js",
   "files": [
     "./lib"
@@ -30,19 +30,11 @@
     "cytoscape-klay": "^3.1.4"
   },
   "devDependencies": {
-    "@babel/types": "^7.26.3",
-    "@rushstack/eslint-patch": "^1.8.0",
-    "@tsconfig/node20": "^20.1.4",
     "@types/cytoscape-klay": "^3.1.4",
     "@vitejs/plugin-vue": "^5.2.1",
     "@vue/tsconfig": "^0.7.0",
-    "autoprefixer": "^10.4.19",
-    "npm-run-all2": "^7.0.1",
-    "postcss": "^8.4.49",
-    "tailwindcss": "^3.4.16",
-    "vite": "^6.0.3",
     "vue": "^3.5.13",
-    "vue-tsc": "^2.1.10"
+    "vue-tsc": "^2.2.0"
   },
   "types": "./lib/cytoscape.d.ts",
   "directories": {