Commit 149ee5ba authored by sunyihao's avatar sunyihao

ReactFlowDemo

parent ef2c151e
This diff is collapsed.
...@@ -59,6 +59,7 @@ ...@@ -59,6 +59,7 @@
"react-app-polyfill": "^3.0.0", "react-app-polyfill": "^3.0.0",
"react-dev-utils": "^12.0.1", "react-dev-utils": "^12.0.1",
"react-dom": "^18.1.0", "react-dom": "^18.1.0",
"react-flow-renderer": "^10.3.5",
"react-refresh": "^0.11.0", "react-refresh": "^0.11.0",
"react-router-dom": "^6.3.0", "react-router-dom": "^6.3.0",
"resolve": "^1.20.0", "resolve": "^1.20.0",
......
...@@ -2,7 +2,7 @@ import request from "@/utils/axios/service"; ...@@ -2,7 +2,7 @@ import request from "@/utils/axios/service";
function current() { function current() {
return request({ return request({
url: "/accounts/current", url: "/accounts/current-mock",
method: "get", method: "get",
}); });
} }
......
import { ReactNode, useCallback, Suspense } from "react"; import { ReactNode, useCallback, Suspense } from "react";
import { BrowserRouter, Routes, Route, Navigate } from "react-router-dom"; import {
BrowserRouter,
Routes,
Route,
Navigate,
Router,
} from "react-router-dom";
import { route, navigate, operation } from "@/router"; import { route, navigate, operation } from "@/router";
import { observer } from "mobx-react-lite"; import { observer } from "mobx-react-lite";
import Loading from "@/views/Loading"; import Loading from "@/views/Loading";
......
...@@ -36,7 +36,7 @@ const demo = [ ...@@ -36,7 +36,7 @@ const demo = [
name: "总览", name: "总览",
path: "/overview", path: "/overview",
icon: "", icon: "",
element: "Demo", element: "ReactFlowDemo",
show: "true", show: "true",
children: [ children: [
{ {
...@@ -52,7 +52,7 @@ const demo = [ ...@@ -52,7 +52,7 @@ const demo = [
name: "项目概览", name: "项目概览",
path: "/summary", path: "/summary",
icon: "", icon: "",
element: "Demo", element: "ReactFlowDemo",
show: "true", show: "true",
children: [ children: [
{ {
......
...@@ -4,6 +4,7 @@ import MenuLayout from "@/views/MenuLayout"; ...@@ -4,6 +4,7 @@ import MenuLayout from "@/views/MenuLayout";
import * as React from "react"; import * as React from "react";
import NotFound from "@/views/404"; import NotFound from "@/views/404";
import Demo from "@/views/demo"; import Demo from "@/views/demo";
import ReactFlowDemo from "@/views/ReactFlowDemo";
export type route = { export type route = {
id?: string; id?: string;
...@@ -36,6 +37,7 @@ export const elements: { ...@@ -36,6 +37,7 @@ export const elements: {
}) => JSX.Element; }) => JSX.Element;
} = { } = {
Demo: Demo, Demo: Demo,
ReactFlowDemo: ReactFlowDemo,
}; };
export const routes: Array<route | navigate> = [ export const routes: Array<route | navigate> = [
......
import React, { memo, useCallback, useEffect } from "react";
import ReactFlow, {
addEdge,
Background,
useNodesState,
useEdgesState,
} from "react-flow-renderer";
import { Edge, Node, Connection } from "react-flow-renderer";
import MyFlowNode from "./MyFlowNode";
type inputProp = {
initialNodes: Array<Node>;
initialEdges: Array<Edge>;
edit?: boolean;
onClick?: (id: string) => void;
};
const nodeTypes = {
custom: MyFlowNode,
};
const OverviewFlow = memo(
({ initialNodes, initialEdges, edit = false, onClick }: inputProp) => {
const [nodes, setNodes, onNodesChange] = useNodesState([]);
const [edges, setEdges, onEdgesChange] = useEdgesState([]);
const onConnect = (params: Edge<any> | Connection) =>
setEdges((eds) => addEdge(params, eds));
useEffect(() => {
if (initialEdges.length && initialNodes.length) {
setNodes(initialNodes);
setEdges(initialEdges);
}
}, [initialEdges, initialNodes, setEdges, setNodes]);
const onClickCapture = useCallback((event: any) => {
onClick && onClick(event.target.children[0]?.dataset.nodeid);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return (
<ReactFlow
nodes={nodes}
edges={edges}
onNodesChange={edit ? onNodesChange : undefined}
onEdgesChange={edit ? onEdgesChange : undefined}
onConnect={edit ? onConnect : undefined}
fitView
onClick={onClickCapture}
style={{ backgroundColor: "#F7F8FA" }}
nodeTypes={nodeTypes}
>
<Background color="#C2C6CC" gap={16} size={0.5} />
</ReactFlow>
);
}
);
export default OverviewFlow;
import { Box } from "@mui/system";
import { Edge, Handle, Position } from "react-flow-renderer";
import styles from "./nodeStyles.module.css";
type parameter = {
id: string;
name: string;
class: string;
type: string;
hidden: false;
required: boolean;
value: string;
description: string;
level: string;
many: boolean;
null: boolean;
promoted: boolean;
promoted_name: string;
title: string;
validators: string;
choices: object;
};
type handle = {
id: string;
name: string;
class:
| "DatasetInputParameter"
| "DatasetOutputParameter"
| "FileInputParameter"
| "FileOutputParameter";
type: "DATASET" | "FILE" | "ARRAY[FILE]" | "ARRAY[DATASET]";
hidden: true;
};
const MyFlowNode = ({
data,
}: {
data: {
title: string;
description: string;
status: "success" | "default";
selected: boolean;
parameters: Array<parameter | handle>;
edges: Array<Edge>;
};
}) => {
let targetIndex = -1;
let sourceIndex = -1;
return (
<Box
sx={{
width: "130px",
display: "flex",
borderRadius: "4px",
fontSize: "12px",
fontWeight: "500",
color: "#1e2633",
lineHeight: "20px",
backgroundColor: "#ffffff",
border: data.selected ? "1px solid #1370ff" : "1px solid #e6e8eb",
boxShadow: data.selected
? "0px 3px 10px 0px rgba(0, 24, 57, 0.14)"
: "",
}}
>
{data.parameters.map((item) => {
if (
item.hidden === true &&
(item.class === "DatasetInputParameter" ||
item.class === "FileInputParameter")
) {
targetIndex++;
return (
<Handle
key={item.id}
type="target"
position={Position.Top}
id={item.id}
style={{ left: targetIndex * 16 + 16 }}
/>
);
} else {
return null;
}
})}
{data.parameters.map((item, index) => {
if (
item.hidden === true &&
(item.class === "DatasetOutputParameter" ||
item.class === "FileOutputParameter")
) {
sourceIndex++;
return (
<Handle
key={item.id}
type="source"
position={Position.Bottom}
id={item.id}
style={{ left: sourceIndex * 16 + 16 }}
/>
);
} else {
return null;
}
})}
<Box
className={data.status === "success" ? styles.success : styles.default}
></Box>
<Box>{data.title}</Box>
</Box>
);
};
export default MyFlowNode;
.success {
border-left: 4px solid #0dd09b;
}
.default {
border-left: 4px solid #e6e8eb;
}
import { Node } from "react-flow-renderer";
export const demoData: templateData = {
id: "370a0fb4-89cf-411c-8142-c8d0756a4f78",
title: "CADD EXAMPLE",
version: "1.0.0",
description: "",
language: "WDL",
languageVersion: "1.0",
tags: [],
source: "BASE64_ENCODED_WDL/CWL",
floes: [
{
id: "taskA",
position: {
x: 0,
y: 0,
},
data: {
title: "输入分子",
description: "",
parameters: [
{
id: "taskA-1",
name: "unit_input_dataset",
class: "DatasetInputParameter",
type: "DATASET",
hidden: false,
required: true,
value: "",
description: "Dataset with the design unit (DU) to dock to.",
level: "USER",
many: false,
null: false,
promoted: true,
promotedName: "unit_input_dataset",
title: "Design Unit or Receptor Dataset(s)",
validators: "",
choices: {},
},
{
id: "taskA-2",
name: "分子库A",
class: "DatasetOutputParameter",
type: "DATASET",
value: "out",
hidden: true,
},
],
edges: [
{
id: "taskA-taskB",
source: "taskA",
sourceHandle: "taskA-2",
target: "taskB",
targetHandle: "taskB-1",
label: "taskA.out",
},
{
id: "taskA-taskC",
source: "taskA",
sourceHandle: "taskA-2",
target: "taskC",
targetHandle: "taskC-1",
label: "taskA.out",
},
],
},
},
{
id: "taskB",
position: {
x: 0,
y: 100,
},
data: {
title: "基础属性筛选",
description: "",
parameters: [
{
id: "taskB-1",
name: "接收分子库",
class: "DatasetInputParameter",
type: "DATASET",
value: "taskA.out",
hidden: true,
},
{
id: "taskB-2",
name: "基础属性1",
class: "StringParameter",
type: "String",
hidden: false,
required: true,
value: "",
description: "Dataset with the design unit (DU) to dock to.",
level: "USER",
many: false,
null: false,
promoted: true,
promoted_name: "unit_input_dataset",
title: "Design Unit or Receptor Dataset(s)",
order: 1,
validators: "",
choices: {},
},
{
id: "taskB-3",
name: "基础属性2",
class: "StringParameter",
type: "String",
required: true,
hidden: false,
value: "",
description: "Dataset with the design unit (DU) to dock to.",
level: "USER",
many: false,
null: false,
promoted: true,
promoted_name: "unit_input_dataset",
title: "Design Unit or Receptor Dataset(s)",
order: 2,
validators: "",
choices: {},
},
{
id: "taskB-4",
name: "基础属性3",
class: "StringParameter",
type: "String",
hidden: false,
required: true,
value: "",
description: "Dataset with the design unit (DU) to dock to.",
level: "USER",
many: false,
null: false,
promoted: true,
promoted_name: "unit_input_dataset",
title: "Design Unit or Receptor Dataset(s)",
order: 1,
validators: "",
choices: {},
},
{
id: "taskB-5",
name: "输出分子库",
class: "DatasetOutputParameter",
type: "DATASET",
value: "out",
hidden: true,
},
],
edges: [
{
id: "taskB-taskD",
source: "taskB",
sourceHandle: "taskB-5",
target: "taskD",
targetHandle: "taskD-1",
label: "taskB.out",
},
],
},
},
{
id: "taskC",
position: {
x: 250,
y: 100,
},
data: {
title: "采样器",
description: "",
parameters: [
{
id: "taskC-1",
name: "接收分子库",
class: "DatasetInputParameter",
type: "DATASET",
value: "taskA.out",
hidden: true,
},
{
id: "taskC-2",
name: "基础属性3",
class: "StringParameter",
type: "String",
hidden: false,
required: true,
value: "",
description: "Dataset with the design unit (DU) to dock to.",
level: "USER",
many: false,
null: false,
promoted: true,
promoted_name: "unit_input_dataset",
title: "Design Unit or Receptor Dataset(s)",
order: 1,
validators: "",
choices: {},
},
{
id: "taskC-3",
name: "输出分子库",
class: "DatasetOutputParameter",
type: "DATASET",
value: "out",
hidden: true,
},
],
edges: [
{
id: "taskC-taskD",
source: "taskC",
sourceHandle: "taskC-3",
target: "taskD",
targetHandle: "taskD-2",
label: "taskC.out",
},
],
},
},
{
id: "taskD",
position: {
x: 0,
y: 200,
},
data: {
title: "输出结果",
description: "",
parameters: [
{
id: "taskD-1",
name: "接收分子库",
class: "DatasetInputParameter",
type: "DATASET",
value: "taskB.out",
hidden: true,
},
{
id: "taskD-2",
name: "接收分子库",
class: "DatasetInputParameter",
type: "DATASET",
value: "taskC.out",
hidden: true,
},
{
id: "taskD-3",
name: "结果名称",
class: "StringParameter",
type: "String",
hidden: false,
required: true,
value: "",
description: "",
level: "USER",
many: false,
null: false,
promoted: true,
promoted_name: "",
title: "",
order: 1,
validators: "",
choices: {},
},
],
},
},
],
};
export type templateData = {
id: string;
title: string;
version: string;
description: string;
language: string;
languageVersion: string;
tags: string[];
source: string;
floes: Array<Node>;
};
import { Box } from "@mui/system";
import { demoData } from "./demoData";
import MyFlow from "./components/MyFlow";
import { useImmer } from "use-immer";
import { useCallback, useEffect } from "react";
import { Node, Edge } from "react-flow-renderer";
const Demo = () => {
const [initialNodes, setInitialNodes] = useImmer<Array<Node>>([]);
const [initialEdges, setInitialEdges] = useImmer<Array<Edge>>([]);
useEffect(() => {
let edges: Array<Edge> = [];
for (let floe of demoData.floes) {
if (floe.data.edges) {
for (let item of floe.data.edges) {
item.type = "smoothstep";
item.style = {
stroke: "#D1D6DE",
};
item.labelBgStyle = {
fill: "#F7F8FA",
};
}
edges.push(...floe.data.edges);
}
floe.type = "custom";
floe.data.status = "default";
floe.data.selected = false;
}
setInitialNodes(demoData.floes);
setInitialEdges(edges);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
// const onFormItemFocus = useCallback((id: string) => {
// setInitialNodes((initialNodes) => {
// for (let node of initialNodes) {
// node.data.selected = node.id === id;
// }
// });
// setInitialEdges((initialEdges) => {
// for (let edge of initialEdges) {
// edge.animated = false;
// if (edge.target === id) {
// edge.animated = true;
// }
// if (edge.source === id) {
// edge.animated = true;
// }
// }
// });
// // eslint-disable-next-line react-hooks/exhaustive-deps
// }, []);
const onFormItemSuccess = useCallback((id: string) => {
setInitialNodes((initialNodes) => {
for (let node of initialNodes) {
if (node.id === id) {
if (node.data.status === "success") {
node.data.status = "default";
} else {
node.data.status = "success";
}
}
}
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
const onFlowClick = useCallback((id: string) => {
setInitialNodes((initialNodes) => {
for (let node of initialNodes) {
node.data.selected = node.id === id;
}
});
setInitialEdges((initialEdges) => {
for (let edge of initialEdges) {
edge.animated = false;
edge.style = {
stroke: "#D1D6DE",
};
if (edge.target === id) {
edge.animated = true;
edge.style = {
stroke: "#1370FF",
};
}
if (edge.source === id) {
edge.animated = true;
edge.style = {
stroke: "#1370FF",
};
}
}
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return (
<Box sx={{ display: "flex", width: "100%", height: "650px" }}>
<Box sx={{ width: "50%" }}>
{initialNodes.map((node) => {
return (
<Box
key={node.id}
sx={{
padding: "7px 30px",
backgroundColor: node.data.selected ? "#D9E8FF" : "#F1F1F1",
fontSize: "14px",
margin: "20px 0px",
cursor: "pointer",
}}
onClick={() => {
// onFormItemFocus(node.id);
onFormItemSuccess(node.id);
}}
>
{node.data.title}
</Box>
);
})}
</Box>
<Box sx={{ width: "50%" }}>
<MyFlow
initialEdges={initialEdges}
initialNodes={initialNodes}
edit={false}
onClick={onFlowClick}
></MyFlow>
</Box>
</Box>
);
};
export default Demo;
...@@ -1018,10 +1018,10 @@ ...@@ -1018,10 +1018,10 @@
"core-js-pure" "^3.20.2" "core-js-pure" "^3.20.2"
"regenerator-runtime" "^0.13.4" "regenerator-runtime" "^0.13.4"
"@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.13.10", "@babel/runtime@^7.16.3", "@babel/runtime@^7.17.2", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2": "@babel/runtime@^7.10.2", "@babel/runtime@^7.11.2", "@babel/runtime@^7.12.5", "@babel/runtime@^7.13.10", "@babel/runtime@^7.16.3", "@babel/runtime@^7.17.2", "@babel/runtime@^7.18.0", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.2", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.2":
"integrity" "sha512-lSiBBvodq29uShpWGNbgFdKYNiFDo5/HIYsaCEY9ff4sb10x9jizo2+pRrSyF4jKZCXqgzuqBOQKbUm90gQwJg==" "integrity" "sha512-38Y8f7YUhce/K7RMwTp7m0uCumpv9hZkitCbBClqQIow1qSbCvGkcegKOXpEWCQLfWmevgRiWokZ1GkpfhbZug=="
"resolved" "https://registry.npmjs.org/@babel/runtime/-/runtime-7.17.9.tgz" "resolved" "https://registry.npmjs.org/@babel/runtime/-/runtime-7.18.3.tgz"
"version" "7.17.9" "version" "7.18.3"
dependencies: dependencies:
"regenerator-runtime" "^0.13.4" "regenerator-runtime" "^0.13.4"
...@@ -3227,6 +3227,11 @@ ...@@ -3227,6 +3227,11 @@
"resolved" "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.2.2.tgz" "resolved" "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.2.2.tgz"
"version" "1.2.2" "version" "1.2.2"
"classcat@^5.0.3":
"integrity" "sha512-6dK2ke4VEJZOFx2ZfdDAl5OhEL8lvkl6EHF92IfRePfHxQTqir5NlcNVUv+2idjDqCX2NDc8m8YSAI5NI975ZQ=="
"resolved" "https://registry.npmjs.org/classcat/-/classcat-5.0.3.tgz"
"version" "5.0.3"
"clean-css@^5.2.2": "clean-css@^5.2.2":
"integrity" "sha512-YYuuxv4H/iNb1Z/5IbMRoxgrzjWGhOEFfd+groZ5dMCVkpENiMZmwspdrzBo9286JjM1gZJPAyL7ZIdzuvu2AQ==" "integrity" "sha512-YYuuxv4H/iNb1Z/5IbMRoxgrzjWGhOEFfd+groZ5dMCVkpENiMZmwspdrzBo9286JjM1gZJPAyL7ZIdzuvu2AQ=="
"resolved" "https://registry.npmjs.org/clean-css/-/clean-css-5.3.0.tgz" "resolved" "https://registry.npmjs.org/clean-css/-/clean-css-5.3.0.tgz"
...@@ -3678,6 +3683,68 @@ ...@@ -3678,6 +3683,68 @@
"resolved" "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz" "resolved" "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz"
"version" "3.0.11" "version" "3.0.11"
"d3-color@1 - 3":
"integrity" "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA=="
"resolved" "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz"
"version" "3.1.0"
"d3-dispatch@1 - 3":
"integrity" "sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg=="
"resolved" "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-3.0.1.tgz"
"version" "3.0.1"
"d3-drag@^3.0.0", "d3-drag@2 - 3":
"integrity" "sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg=="
"resolved" "https://registry.npmjs.org/d3-drag/-/d3-drag-3.0.0.tgz"
"version" "3.0.0"
dependencies:
"d3-dispatch" "1 - 3"
"d3-selection" "3"
"d3-ease@1 - 3":
"integrity" "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w=="
"resolved" "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz"
"version" "3.0.1"
"d3-interpolate@1 - 3":
"integrity" "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g=="
"resolved" "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz"
"version" "3.0.1"
dependencies:
"d3-color" "1 - 3"
"d3-selection@^3.0.0", "d3-selection@2 - 3", "d3-selection@3":
"integrity" "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ=="
"resolved" "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz"
"version" "3.0.0"
"d3-timer@1 - 3":
"integrity" "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA=="
"resolved" "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz"
"version" "3.0.1"
"d3-transition@2 - 3":
"integrity" "sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w=="
"resolved" "https://registry.npmjs.org/d3-transition/-/d3-transition-3.0.1.tgz"
"version" "3.0.1"
dependencies:
"d3-color" "1 - 3"
"d3-dispatch" "1 - 3"
"d3-ease" "1 - 3"
"d3-interpolate" "1 - 3"
"d3-timer" "1 - 3"
"d3-zoom@^3.0.0":
"integrity" "sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw=="
"resolved" "https://registry.npmjs.org/d3-zoom/-/d3-zoom-3.0.0.tgz"
"version" "3.0.0"
dependencies:
"d3-dispatch" "1 - 3"
"d3-drag" "2 - 3"
"d3-interpolate" "1 - 3"
"d3-selection" "2 - 3"
"d3-transition" "2 - 3"
"damerau-levenshtein@^1.0.7": "damerau-levenshtein@^1.0.7":
"integrity" "sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==" "integrity" "sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA=="
"resolved" "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz" "resolved" "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz"
...@@ -7550,7 +7617,7 @@ ...@@ -7550,7 +7617,7 @@
"strip-ansi" "^6.0.1" "strip-ansi" "^6.0.1"
"text-table" "^0.2.0" "text-table" "^0.2.0"
"react-dom@^17.0.0 || ^18.0.0", "react-dom@^18.0.0", "react-dom@^18.1.0", "react-dom@>=16.6.0", "react-dom@>=16.8": "react-dom@^17.0.0 || ^18.0.0", "react-dom@^18.0.0", "react-dom@^18.1.0", "react-dom@>=16.6.0", "react-dom@>=16.8", "react-dom@16 || 17 || 18":
"integrity" "sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w==" "integrity" "sha512-fU1Txz7Budmvamp7bshe4Zi32d0ll7ect+ccxNu9FlObT605GOEB8BfO4tmRJ39R5Zj831VCpvQ05QPBW5yb+w=="
"resolved" "https://registry.npmjs.org/react-dom/-/react-dom-18.1.0.tgz" "resolved" "https://registry.npmjs.org/react-dom/-/react-dom-18.1.0.tgz"
"version" "18.1.0" "version" "18.1.0"
...@@ -7563,6 +7630,18 @@ ...@@ -7563,6 +7630,18 @@
"resolved" "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz" "resolved" "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz"
"version" "6.0.11" "version" "6.0.11"
"react-flow-renderer@^10.3.5":
"integrity" "sha512-5aIm4eqmYhSwnV34Zp+aLXLUQ4w5t9LJjPJmlzRWzXEKbLECAWdOjRO/0z+EW54jft7mqp2YaL62ukzmS/Ey3g=="
"resolved" "https://registry.npmjs.org/react-flow-renderer/-/react-flow-renderer-10.3.5.tgz"
"version" "10.3.5"
dependencies:
"@babel/runtime" "^7.18.0"
"classcat" "^5.0.3"
"d3-drag" "^3.0.0"
"d3-selection" "^3.0.0"
"d3-zoom" "^3.0.0"
"zustand" "^3.7.2"
"react-is@^16.13.1": "react-is@^16.13.1":
"integrity" "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" "integrity" "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
"resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz" "resolved" "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz"
...@@ -7613,7 +7692,7 @@ ...@@ -7613,7 +7692,7 @@
"loose-envify" "^1.4.0" "loose-envify" "^1.4.0"
"prop-types" "^15.6.2" "prop-types" "^15.6.2"
"react@^16.8.0 || ^17 || ^18", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@^16.8.0 || ^17.0.1 || ^18.0.0", "react@^17.0.0 || ^18.0.0", "react@^18.0.0", "react@^18.1.0", "react@>=16.6.0", "react@>=16.8", "react@>=16.8.0": "react@^16.8.0 || ^17 || ^18", "react@^16.8.0 || ^17.0.0 || ^18.0.0", "react@^16.8.0 || ^17.0.1 || ^18.0.0", "react@^17.0.0 || ^18.0.0", "react@^18.0.0", "react@^18.1.0", "react@>=16.6.0", "react@>=16.8", "react@>=16.8.0", "react@16 || 17 || 18":
"integrity" "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ==" "integrity" "sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ=="
"resolved" "https://registry.npmjs.org/react/-/react-18.1.0.tgz" "resolved" "https://registry.npmjs.org/react/-/react-18.1.0.tgz"
"version" "18.1.0" "version" "18.1.0"
...@@ -9344,3 +9423,8 @@ ...@@ -9344,3 +9423,8 @@
"integrity" "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==" "integrity" "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q=="
"resolved" "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz" "resolved" "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz"
"version" "0.1.0" "version" "0.1.0"
"zustand@^3.7.2":
"integrity" "sha512-PIJDIZKtokhof+9+60cpockVOq05sJzHCriyvaLBmEJixseQ1a5Kdov6fWZfWOu5SK9c+FhH1jU0tntLxRJYMA=="
"resolved" "https://registry.npmjs.org/zustand/-/zustand-3.7.2.tgz"
"version" "3.7.2"
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment