Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 | 1x 1x 1x 1x 10590x 10590x 10590x 10590x 10582x 10582x 10582x 10582x 31739x 31739x 31739x 31739x 31739x 31739x | import * as React from "react"; import { GraphConfigContext, IGraphConfig } from "../contexts"; import { getNodeConfig, getPortPosition } from "../utils"; import { IGraphProps } from "./Graph"; import { ICanvasNode, ICanvasPort, TSetData } from "./Graph.interface"; interface IProps { node: ICanvasNode; graphProps: IGraphProps; setData: TSetData; onPortMouseDown( node: ICanvasNode, port: ICanvasPort ): React.EventHandler<React.MouseEvent<SVGGElement>>; onMouseEnter( node: ICanvasNode, port: ICanvasPort ): React.EventHandler<React.MouseEvent<SVGGElement>>; onMouseLeave( node: ICanvasNode, port: ICanvasPort ): React.EventHandler<React.MouseEvent<SVGGElement>>; } export const GraphOneNodePorts: React.FunctionComponent<IProps> = props => { const { node, graphProps } = props; const setData = props.setData.bind(null); const graphConfig = React.useContext<IGraphConfig>(GraphConfigContext); const nodeConfig = getNodeConfig(node, graphConfig); Iif (!nodeConfig.getPorts) { return null; } const ports = nodeConfig.getPorts({ model: node, graphProps, setData }); const reversePorts = ports.reverse(); // to make tooltip(hover on port) have a correct order return ( <g> {reversePorts.map(p => { const portShape = p.shape ? p.shape : "default"; const portConfig = graphConfig.getPortConfigByName(portShape); Iif (!portConfig || !portConfig.render) { return null; } const pos = getPortPosition(node, p, graphConfig); return React.useMemo(() => { return ( <g key={`${node.id}${p.id}`} onMouseDown={props.onPortMouseDown(node, p)} onMouseEnter={props.onMouseEnter(node, p)} onMouseLeave={props.onMouseLeave(node, p)} > {portConfig.render({ model: p, parentNode: node, graphProps, setData, ...pos })} </g> ); }, [node.x, node.y, p.position, p.state]); })} </g> ); }; |