diff --git a/packages/x-flow/package.json b/packages/x-flow/package.json index 1f6860eb6..2559fa816 100644 --- a/packages/x-flow/package.json +++ b/packages/x-flow/package.json @@ -56,7 +56,8 @@ "tinycolor2": "^1.6.0", "use-context-selector": "^1.4.1", "zundo": "^2.1.0", - "zustand": "^4.5.4" + "zustand": "^4.5.4", + "@monaco-editor/react": "^4.4.6" }, "devDependencies": { "deep-equal": "^2.0.3", diff --git a/packages/x-flow/src/components/CustomNode/index.tsx b/packages/x-flow/src/components/CustomNode/index.tsx index 15d156a75..2c560478e 100644 --- a/packages/x-flow/src/components/CustomNode/index.tsx +++ b/packages/x-flow/src/components/CustomNode/index.tsx @@ -20,6 +20,9 @@ export default memo((props: any) => { useContext(ConfigContext); const deletable = globalConfig?.edge?.deletable ?? true; + // const isConnectableStart = globalConfig?.handle?.isConnectableStart ?? true; + // const isConnectableEnd = globalConfig?.handle?.isConnectableEnd ?? true; + const NodeWidget = widgets[`${capitalize(type)}Node`] || widgets['CommonNode']; const [isHovered, setIsHovered] = useState(false); @@ -92,6 +95,24 @@ export default memo((props: any) => { deleteNode(id); }, [pasteNode]); + const defaultAction = (e, sourceHandle) => { + if (e.key === 'copy') { + handleCopyNode(); + } else if (e.key === 'paste') { + handlePasteNode(); + } else if (e.key === 'delete') { + handleDeleteNode(); + } else if (e.key.startsWith('paste-')) { + if (sourceHandle) { + handlePasteNode({ + sourceHandle, + }); + } else { + handlePasteNode(); + } + } + }; + const itemClick = e => { if (!e.key) { return; @@ -105,23 +126,11 @@ export default memo((props: any) => { if (type === 'Switch' && e.key.startsWith('paste-') && sourceHandle) { data['sourceHandle'] = sourceHandle; } - onMenuItemClick(data); + onMenuItemClick(data, () => { + defaultAction(e, sourceHandle); + }); } else { - if (e.key === 'copy') { - handleCopyNode(); - } else if (e.key === 'paste') { - handlePasteNode(); - } else if (e.key === 'delete') { - handleDeleteNode(); - } else if (e.key.startsWith('paste-')) { - if (sourceHandle) { - handlePasteNode({ - sourceHandle, - }); - } else { - handlePasteNode(); - } - } + defaultAction(e, sourceHandle); } }; @@ -187,6 +196,8 @@ export default memo((props: any) => { type="target" position={targetPosition} isConnectable={isConnectable} + // isConnectableStart={isConnectableStart} + // isConnectableEnd={isConnectableEnd} /> )} {selected && ( @@ -234,6 +245,8 @@ export default memo((props: any) => { selected={selected} isHovered={isHovered} handleAddNode={handleAddNode} + // isConnectableStart={isConnectableStart} + // isConnectableEnd={isConnectableEnd} /> )} diff --git a/packages/x-flow/src/operator/Control/index.tsx b/packages/x-flow/src/operator/Control/index.tsx index 2496d08d7..cd8f9238c 100644 --- a/packages/x-flow/src/operator/Control/index.tsx +++ b/packages/x-flow/src/operator/Control/index.tsx @@ -1,17 +1,22 @@ import { Button, Tooltip } from 'antd'; import type { MouseEvent } from 'react'; -import React, { memo } from 'react'; +import React, { memo, useContext } from 'react'; import IconView from '../../components/IconView'; import NodeSelectPopover from '../../components/NodesPopover'; import { useStore, useStoreApi } from '../../hooks/useStore'; +import { ConfigContext } from '../../models/context'; import { useEventEmitterContextContext } from '../../models/event-emitter'; -import './index.less'; import { useFullscreen } from 'ahooks'; +import './index.less'; const Control = (props: any) => { const { addNode, xflowRef } = props; - const [isFullscreen, {toggleFullscreen }] = useFullscreen(xflowRef); + const [isFullscreen, { toggleFullscreen }] = useFullscreen(xflowRef); + const { globalConfig } = useContext(ConfigContext); + + const hideAddNode = globalConfig?.controls?.hideAddNode ?? false; + const hideAnnotate = globalConfig?.controls?.hideAnnotate ?? false; const addNote = (e: MouseEvent) => { e.stopPropagation(); @@ -27,22 +32,38 @@ const Control = (props: any) => { return (
- - document.getElementById('xflow-container') as HTMLElement}> + {!hideAddNode && ( + + + document.getElementById('xflow-container') as HTMLElement + } + > +