npm - @pega/cosmos-react-build - Versions diffs - 3.0.0-dev.14.0 → 3.0.0-dev.16.1 - Mend

@pega/cosmos-react-build 3.0.0-dev.14.0 → 3.0.0-dev.16.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (66) hide show

package/lib/components/FlowModeller/FlowModeller.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlowModeller.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n useEffect,\n MouseEvent,\n useReducer,\n Reducer,\n useCallback,\n useRef,\n useMemo\n} from 'react';\n\nimport {\n PopoverProps,\n createUID,\n useElement,\n useOuterEvent,\n useI18n,\n OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport ItemLibrary, { LibraryItem } from '../ItemLibrary/ItemLibrary';\n\nimport { GraphData } from './Renderer/Utils/Graph';\nimport {\n AddNodeHandlerParams,\n RendererConnectorProps,\n RendererNodeProps\n} from './Renderer/Renderer.types';\nimport FlowRenderer from './Renderer/Renderer';\nimport {\n ActionParams,\n NodeLibraryItem,\n START_NODETYPE,\n STOP_NODETYPE,\n NodeComponentData\n} from './Node/Node.types';\nimport PlaceHolderHelper from './Utils/addNodeUtils';\nimport { AddButton } from './AddNode';\nimport FlowModellerHelper from './helper';\nimport DeletePopover, { DeleteNodePopoverProps } from './DeletePopover';\nimport Connector from './Connector';\nimport Node from './Node';\nimport { DeleteNodeModalOption, DeleteNodeOutcome } from './Utils/deleteNodeUtils';\nimport FlowModellerContext from './FlowModellerContext';\nimport { FlowModellerProps } from './FlowModeller.types';\n\ntype ModellerState = {\n showLib: boolean;\n activeItem: Element \| null;\n activeAddBtnMeta: {\n target: null; // we will maintain ref of an Element\n meta: AddNodeHandlerParams;\n };\n graphData: GraphData<RendererNodeProps, RendererConnectorProps>;\n highlightItems?: DeleteNodeModalOption['pathItems'];\n showDeletePopover: boolean;\n deleteProps:\n \| OmitStrict<DeleteNodePopoverProps & { target: PopoverProps['target'] }, 'show'>\n \| undefined;\n};\n\nconst initState: ModellerState = {\n showLib: false,\n activeItem: null,\n activeAddBtnMeta: {\n target: null,\n meta: {\n refType: 'node',\n refId: ''\n }\n },\n graphData: { nodes: [], connectors: [] },\n highlightItems: undefined,\n showDeletePopover: false,\n deleteProps: undefined\n};\n\nconst reducer = (state: ModellerState, action: { type: string; payload: any }) => {\n switch (action.type) {\n case 'showLibrary':\n // minor optimization, not to update state.. if no change in the value\n return action.payload.show === state.showLib\n ? state\n : { ...state, showLib: action.payload.show };\n case 'setActiveItem':\n return {\n ...state,\n activeItem: action.payload.target\n };\n case 'setActiveAddButton':\n state.activeAddBtnMeta = {\n ...action.payload\n };\n return {\n ...state,\n showLib: true\n };\n case 'setGraphData':\n return {\n ...state,\n graphData: action.payload.graphData,\n highlightItems: action.payload.highlightItems\n };\n case 'highlight':\n // minor optimization to avoid unnecessary re-render\n if (action.payload.hideDeletePopover === !state.showDeletePopover) {\n return state;\n }\n\n return {\n ...state,\n highlightItems: action.payload.highlightItems,\n showDeletePopover: action.payload.hideDeletePopover !== true && state.showDeletePopover\n };\n case 'showDeletePopover':\n return {\n ...state,\n showDeletePopover: action.payload.showDeletePopover,\n deleteProps: action.payload.deleteProps\n };\n default:\n return state;\n }\n};\n\nconst FlowModeller = ({\n graphData,\n highlightData,\n onNodeActionClick,\n onNodeAdd,\n nodeLibrary,\n onNodeClick,\n onDelete,\n actions,\n readOnly\n}: PropsWithoutRef<FlowModellerProps>) => {\n const [state, dispatch] = useReducer<Reducer<ModellerState, any>>(reducer, initState);\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const [deletePopoverEl, setDeletePopoverEl] = useElement<HTMLElement>(null);\n const stateRef = useRef<ModellerState>(initState);\n\n // stateRef always refers to the same state obj\n // \"fixed\" callbacks can refer to this object whenever\n // it need the current value. Note: the callbacks will not\n // be reactive - they will not re-run the instant state changes,\n // but they will see the current value whenever they do run\n stateRef.current = state;\n\n const t = useI18n();\n\n const onNodeCreate = (el: HTMLElement \| SVGForeignObjectElement, meta: AddNodeHandlerParams) => {\n dispatch({\n type: 'setActiveAddButton',\n payload: {\n target: el,\n meta\n }\n });\n };\n\n const closeMenu = () => {\n dispatch({\n type: 'showLibrary',\n payload: {\n show: false\n }\n });\n };\n\n const closeDeleteModel = () => {\n // un-highlight the nodes and connectors\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: undefined,\n hideDeletePopover: true\n }\n });\n };\n\n const onDeleteWrapper = useCallback(\n (params: ActionParams, e: MouseEvent) => {\n const result: DeleteNodeOutcome \| false = FlowModellerHelper.deleteNode(\n graphData,\n params.nodeId\n );\n\n if (result) {\n onDelete?.({ ...params, additionalData: result }, e);\n } else {\n dispatch({\n type: 'showDeletePopover',\n payload: {\n showDeletePopover: true,\n deleteProps: {\n flowGraphData: graphData,\n rendererGraphData: stateRef.current.graphData,\n nodeId: params.nodeId,\n target: {\n getBoundingClientRect: () =>\n document\n .getElementById(`modeller-node-${stateRef.current.deleteProps?.nodeId}`)\n ?.getBoundingClientRect()\n } as PopoverProps['target'],\n onChange: highlights => {\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: highlights\n }\n });\n },\n onSubmit: outcome => {\n // un-highlight the nodes and connectors\n closeDeleteModel();\n onDelete?.({ ...params, additionalData: outcome }, e);\n },\n onCancel: closeDeleteModel\n } as ModellerState['deleteProps']\n }\n });\n }\n },\n [graphData, state.graphData]\n );\n\n useEffect(() => {\n const onGetNewPHNode: (metaData: AddNodeHandlerParams) => RendererNodeProps = metaData => {\n return {\n id: createUID(),\n children: (\n <AddButton\n addNodeHandler={(e: MouseEvent<HTMLButtonElement>) => {\n onNodeCreate(e.currentTarget as HTMLElement, metaData);\n }}\n />\n ),\n position: { x: 0, y: 0 },\n dimensions: { width: 1, height: 0 }\n };\n };\n\n const onGetNewPHConnector: (\n fromNodeId: string,\n toNodeId: string,\n metaData: AddNodeHandlerParams\n ) => RendererConnectorProps = (fromNodeId, toNodeId) => {\n return {\n id: createUID(),\n fromNodeId,\n toNodeId,\n points: [],\n data: {\n onNodeCreate\n }\n };\n };\n\n const flowNodes: RendererNodeProps[] = graphData.nodes.map(node => {\n const flowNode: RendererNodeProps = {\n ...node,\n dimensions: {\n width: 280,\n height: 120\n },\n position: {\n x: 0,\n y: 0\n },\n data: {\n isActive: state.activeItem?.id === node.id,\n actions,\n onDelete: onDeleteWrapper,\n onActionClick: onNodeActionClick,\n onClick: onNodeClick\n } as NodeComponentData\n };\n\n if (node.type.id === START_NODETYPE.id \|\| node.type.id === STOP_NODETYPE.id) {\n flowNode.dimensions.width = 58;\n flowNode.dimensions.height = 58;\n }\n return flowNode;\n });\n\n const connectors: RendererConnectorProps[] = graphData.connectors.map(connector => {\n return {\n ...connector,\n points: [],\n data: {\n label: connector.label,\n onNodeCreate\n }\n };\n });\n\n // inject the placeholderAddNodes dynamically\n const newGraphData: GraphData<RendererNodeProps, RendererConnectorProps> =\n PlaceHolderHelper.injectPlaceholderNodes(\n { nodes: flowNodes, connectors },\n onGetNewPHNode,\n onGetNewPHConnector\n );\n\n dispatch({\n type: 'setGraphData',\n payload: {\n graphData: newGraphData\n }\n });\n }, [graphData]);\n\n /*\n Library popover functionality\n */\n const onLibraryItemSelect = useCallback(\n (libItem: LibraryItem) => {\n const metaData = state.activeAddBtnMeta.meta;\n closeMenu();\n onNodeAdd((libItem as NodeLibraryItem).type, metaData);\n },\n [state.activeAddBtnMeta]\n );\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closeMenu();\n }\n },\n [closeMenu]\n );\n\n useOuterEvent('mousedown', [popoverEl], closeMenu);\n useOuterEvent('mousedown', [deletePopoverEl], closeDeleteModel);\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, []);\n\n const items: NodeLibraryItem[] = nodeLibrary !== undefined ? nodeLibrary : [];\n\n const ctxValue = useMemo(() => ({ readOnly }), [readOnly]);\n\n return (\n <div>\n <FlowModellerContext.Provider value={ctxValue}>\n <FlowRenderer\n graphData={state.graphData}\n connector={Connector}\n node={Node}\n highlights={highlightData ?? state.highlightItems}\n />\n </FlowModellerContext.Provider>\n {state.showDeletePopover && state.deleteProps && (\n <DeletePopover\n show={state.showDeletePopover}\n ref={setDeletePopoverEl}\n {...state.deleteProps}\n />\n )}\n <ItemLibrary\n show={state.showLib}\n target={state.activeAddBtnMeta.target}\n placeholder={t('search_nodes')}\n items={items}\n onClick={onLibraryItemSelect}\n ref={setPopoverEl}\n position='bottom'\n />\n </div>\n );\n};\n\nexport default FlowModeller;\n"]}
1	+ {"version":3,"file":"FlowModeller.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n useEffect,\n MouseEvent,\n useReducer,\n Reducer,\n useCallback,\n useRef,\n useMemo\n} from 'react';\n\nimport {\n PopoverProps,\n createUID,\n useElement,\n useOuterEvent,\n useI18n,\n OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport ItemLibrary, { LibraryItem } from '../ItemLibrary/ItemLibrary';\n\nimport { GraphData } from './Renderer/Utils/Graph';\nimport { AddNodeHandlerParams } from './Renderer/Renderer.types';\nimport FlowRenderer from './Renderer/Renderer';\nimport {\n ActionParams,\n NodeLibraryItem,\n START_NODETYPE,\n STOP_NODETYPE,\n NodeComponentData\n} from './Node/Node.types';\nimport PlaceHolderHelper from './Utils/addNodeUtils';\nimport { AddButton } from './AddNode';\nimport FlowModellerHelper from './helper';\nimport DeletePopover, { DeleteNodePopoverProps } from './DeletePopover';\nimport Connector from './Connector';\nimport Node from './Node';\nimport { DeleteNodeModalOption, DeleteNodeOutcome } from './Utils/deleteNodeUtils';\nimport FlowModellerContext from './FlowModellerContext';\nimport { FlowModellerProps } from './FlowModeller.types';\nimport { PlottedGraphNode, PlottedGraphConnector } from './Renderer/Utils/GraphLayout';\n\ntype ModellerState = {\n showLib: boolean;\n activeItem: Element \| null;\n activeAddBtnMeta: {\n target: null; // we will maintain ref of an Element\n meta: AddNodeHandlerParams;\n };\n graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;\n highlightItems?: DeleteNodeModalOption['pathItems'];\n showDeletePopover: boolean;\n deleteProps:\n \| OmitStrict<DeleteNodePopoverProps & { target: PopoverProps['target'] }, 'show'>\n \| undefined;\n};\n\nconst initState: ModellerState = {\n showLib: false,\n activeItem: null,\n activeAddBtnMeta: {\n target: null,\n meta: {\n refType: 'node',\n refId: ''\n }\n },\n graphData: { nodes: [], connectors: [] },\n highlightItems: undefined,\n showDeletePopover: false,\n deleteProps: undefined\n};\n\nconst reducer = (state: ModellerState, action: { type: string; payload: any }) => {\n switch (action.type) {\n case 'showLibrary':\n // minor optimization, not to update state.. if no change in the value\n return action.payload.show === state.showLib\n ? state\n : { ...state, showLib: action.payload.show };\n case 'setActiveItem':\n return {\n ...state,\n activeItem: action.payload.target\n };\n case 'setActiveAddButton':\n state.activeAddBtnMeta = {\n ...action.payload\n };\n return {\n ...state,\n showLib: true\n };\n case 'setGraphData':\n return {\n ...state,\n graphData: action.payload.graphData,\n highlightItems: action.payload.highlightItems\n };\n case 'highlight':\n // minor optimization to avoid unnecessary re-render\n if (action.payload.hideDeletePopover === !state.showDeletePopover) {\n return state;\n }\n\n return {\n ...state,\n highlightItems: action.payload.highlightItems,\n showDeletePopover: action.payload.hideDeletePopover !== true && state.showDeletePopover\n };\n case 'showDeletePopover':\n return {\n ...state,\n showDeletePopover: action.payload.showDeletePopover,\n deleteProps: action.payload.deleteProps\n };\n default:\n return state;\n }\n};\n\nconst FlowModeller = ({\n graphData,\n highlightData,\n onNodeActionClick,\n onNodeAdd,\n nodeLibrary,\n onNodeClick,\n onDelete,\n actions,\n readOnly\n}: PropsWithoutRef<FlowModellerProps>) => {\n const [state, dispatch] = useReducer<Reducer<ModellerState, any>>(reducer, initState);\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const [deletePopoverEl, setDeletePopoverEl] = useElement<HTMLElement>(null);\n const stateRef = useRef<ModellerState>(initState);\n\n // stateRef always refers to the same state obj\n // \"fixed\" callbacks can refer to this object whenever\n // it need the current value. Note: the callbacks will not\n // be reactive - they will not re-run the instant state changes,\n // but they will see the current value whenever they do run\n stateRef.current = state;\n const t = useI18n();\n\n const onNodeCreate = (el: HTMLElement \| SVGForeignObjectElement, meta: AddNodeHandlerParams) => {\n dispatch({\n type: 'setActiveAddButton',\n payload: {\n target: el,\n meta\n }\n });\n };\n\n const closeMenu = () => {\n dispatch({\n type: 'showLibrary',\n payload: {\n show: false\n }\n });\n };\n\n const closeDeleteModel = () => {\n // un-highlight the nodes and connectors\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: undefined,\n hideDeletePopover: true\n }\n });\n };\n\n const onDeleteWrapper = useCallback(\n (params: ActionParams, e: MouseEvent) => {\n const result: DeleteNodeOutcome \| false = FlowModellerHelper.deleteNode(\n graphData,\n params.nodeId\n );\n\n if (result) {\n onDelete?.({ ...params, additionalData: result }, e);\n } else {\n dispatch({\n type: 'showDeletePopover',\n payload: {\n showDeletePopover: true,\n deleteProps: {\n flowGraphData: graphData,\n rendererGraphData: stateRef.current.graphData,\n nodeId: params.nodeId,\n target: {\n getBoundingClientRect: () =>\n document\n .getElementById(`modeller-node-${stateRef.current.deleteProps?.nodeId}`)\n ?.getBoundingClientRect()\n } as PopoverProps['target'],\n onChange: highlights => {\n dispatch({\n type: 'highlight',\n payload: {\n highlightItems: highlights\n }\n });\n },\n onSubmit: outcome => {\n // un-highlight the nodes and connectors\n closeDeleteModel();\n onDelete?.({ ...params, additionalData: outcome }, e);\n },\n onCancel: closeDeleteModel\n } as ModellerState['deleteProps']\n }\n });\n }\n },\n [graphData, state.graphData]\n );\n\n useEffect(() => {\n const onGetNewPHNode: (metaData: AddNodeHandlerParams) => PlottedGraphNode = metaData => {\n return {\n id: createUID(),\n children: (\n <AddButton\n addNodeHandler={(e: MouseEvent<HTMLButtonElement>) => {\n onNodeCreate(e.currentTarget as HTMLElement, metaData);\n }}\n />\n ),\n position: { x: 0, y: 0 },\n dimensions: { width: 1, height: 0 }\n };\n };\n\n const onGetNewPHConnector: (\n fromNodeId: string,\n toNodeId: string,\n metaData: AddNodeHandlerParams\n ) => PlottedGraphConnector = (fromNodeId, toNodeId) => {\n return {\n id: createUID(),\n fromNodeId,\n toNodeId,\n points: [],\n data: {\n onNodeCreate\n }\n };\n };\n\n const flowNodes: PlottedGraphNode[] = graphData.nodes.map(node => {\n const flowNode: PlottedGraphNode = {\n ...node,\n dimensions: {\n width: 280,\n height: 120\n },\n position: {\n x: 0,\n y: 0\n },\n data: {\n isActive: state.activeItem?.id === node.id,\n actions,\n onDelete: onDeleteWrapper,\n onActionClick: onNodeActionClick,\n onClick: onNodeClick\n } as NodeComponentData\n };\n\n if (node.type.id === START_NODETYPE.id \|\| node.type.id === STOP_NODETYPE.id) {\n flowNode.dimensions.width = 58;\n flowNode.dimensions.height = 58;\n }\n return flowNode;\n });\n\n const connectors: PlottedGraphConnector[] = graphData.connectors.map(connector => {\n return {\n ...connector,\n points: [],\n data: {\n label: connector.label,\n onNodeCreate\n }\n };\n });\n\n // inject the placeholderAddNodes dynamically\n const newGraphData: GraphData<PlottedGraphNode, PlottedGraphConnector> =\n PlaceHolderHelper.injectPlaceholderNodes(\n { nodes: flowNodes, connectors },\n onGetNewPHNode,\n onGetNewPHConnector\n );\n\n dispatch({\n type: 'setGraphData',\n payload: {\n graphData: newGraphData\n }\n });\n }, [graphData]);\n\n /*\n Library popover functionality\n */\n const onLibraryItemSelect = useCallback(\n (libItem: LibraryItem) => {\n const metaData = state.activeAddBtnMeta.meta;\n closeMenu();\n onNodeAdd((libItem as NodeLibraryItem).type, metaData);\n },\n [state.activeAddBtnMeta]\n );\n\n const onKeydown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closeMenu();\n }\n },\n [closeMenu]\n );\n\n useOuterEvent('mousedown', [popoverEl], closeMenu);\n useOuterEvent('mousedown', [deletePopoverEl], closeDeleteModel);\n\n useEffect(() => {\n document.addEventListener('keydown', onKeydown);\n\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, []);\n\n const items: NodeLibraryItem[] = nodeLibrary !== undefined ? nodeLibrary : [];\n\n const ctxValue = useMemo(\n () => ({ readOnly, highlights: highlightData ?? state.highlightItems }),\n [readOnly, state.highlightItems, highlightData]\n );\n\n return (\n <div>\n <FlowModellerContext.Provider value={ctxValue}>\n <FlowRenderer graphData={state.graphData} connector={Connector} node={Node} />\n </FlowModellerContext.Provider>\n {state.showDeletePopover && state.deleteProps && (\n <DeletePopover\n show={state.showDeletePopover}\n ref={setDeletePopoverEl}\n {...state.deleteProps}\n />\n )}\n <ItemLibrary\n show={state.showLib}\n target={state.activeAddBtnMeta.target}\n placeholder={t('search_nodes')}\n items={items}\n onClick={onLibraryItemSelect}\n ref={setPopoverEl}\n position='bottom'\n />\n </div>\n );\n};\n\nexport default FlowModeller;\n"]}

package/lib/components/FlowModeller/FlowModellerContext.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import { FlowModellerProps } from './FlowModeller.types';
-declare const FlowModellerContext: import("react").Context<Pick<FlowModellerProps, "readOnly">>;
+import { RendererProps } from './Renderer/Renderer.types';
+declare const FlowModellerContext: import("react").Context<Pick<FlowModellerProps, "readOnly"> & Partial<Pick<RendererProps, "highlights">>>;
 export default FlowModellerContext;
 //# sourceMappingURL=FlowModellerContext.d.ts.map

package/lib/components/FlowModeller/FlowModellerContext.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlowModellerContext.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;~~AAEzD~~,QAAA,MAAM,mBAAmB,~~8DAEvB~~,CAAC;AAEH,eAAe,mBAAmB,CAAC"}
1	+ {"version":3,"file":"FlowModellerContext.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE1D,QAAA,MAAM,mBAAmB,2GAKvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}

package/lib/components/FlowModeller/FlowModellerContext.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { createContext } from 'react';
 const FlowModellerContext = createContext({
-    readOnly: false
+    readOnly: false,
+    highlights: { nodes: {}, connectors: {} }
 });
 export default FlowModellerContext;
 //# sourceMappingURL=FlowModellerContext.js.map

package/lib/components/FlowModeller/FlowModellerContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FlowModellerContext.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;~~AAItC~~,MAAM,mBAAmB,GAAG,aAAa,~~CAAsC~~;~~IAC7E~~,QAAQ,EAAE,KAAK;~~CAChB~~,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { FlowModellerProps } from './FlowModeller.types';\n\nconst FlowModellerContext = createContext<Pick<FlowModellerProps, 'readOnly'>>({\n readOnly: false\n});\n\nexport default FlowModellerContext;\n"]}
1	+ {"version":3,"file":"FlowModellerContext.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAKtC,MAAM,mBAAmB,GAAG,aAAa,CAEvC;IACA,QAAQ,EAAE,KAAK;IACf,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE;CAC1C,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport { FlowModellerProps } from './FlowModeller.types';\nimport { RendererProps } from './Renderer/Renderer.types';\n\nconst FlowModellerContext = createContext<\n Pick<FlowModellerProps, 'readOnly'> & Partial<Pick<RendererProps, 'highlights'>>\n>({\n readOnly: false,\n highlights: { nodes: {}, connectors: {} }\n});\n\nexport default FlowModellerContext;\n"]}

package/lib/components/FlowModeller/Node/NodeTemplates.js CHANGED Viewed

@@ -57,7 +57,7 @@ export const DefaultNode = ({ id, label, type, description, additionalData, acti
     const [nodeIcon, setNodeIcon] = useElement();
     const [nodeErrorToolTip, setNodeErrorToolTip] = useElement();
     const color = readableColor(colorMap[type.color]);
-    const { readOnly } = useContext(FlowModellerContext);
+    const { readOnly, highlights } = useContext(FlowModellerContext);
     useEffect(() => {
         if (error) {
             setNodeDescription(null);
@@ -65,7 +65,7 @@ export const DefaultNode = ({ id, label, type, description, additionalData, acti
             setNodeIcon(null);
         }
     }, [error]);
-    return (_jsxs(StyledNodeTemplate, { "aria-label": error || label, onClick: (e) => onClick?.(id, e), onKeyDown: handleEnterKeyDown, ref: setNodeErrorToolTip, highlight: error ? true : highlight, error: error, id: `modeller-node-${id}`, ...restProps, children: [_jsxs(Flex, { as: StyledNodeTemplateHeader, container: { alignItems: 'center', pad: 1, justify: 'between' }, children: [_jsxs(Flex, { container: { alignItems: 'center' }, children: [_jsx(StyledIcon, { id: id, style: {
+    return (_jsxs(StyledNodeTemplate, { "aria-label": error || label, onClick: (e) => onClick?.(id, e), onKeyDown: handleEnterKeyDown, ref: setNodeErrorToolTip, highlight: error ? true : !!highlights?.nodes?.[id], error: error, id: `modeller-node-${id}`, ...restProps, children: [_jsxs(Flex, { as: StyledNodeTemplateHeader, container: { alignItems: 'center', pad: 1, justify: 'between' }, children: [_jsxs(Flex, { container: { alignItems: 'center' }, children: [_jsx(StyledIcon, { id: id, style: {
                                     '--bg-color': colorMap[type.color],
                                     '--fg-color': color
                                 }, ref: setNodeIcon, children: _jsx(Icon, { name: type.icon }) }), _jsx(Tooltip, { target: nodeIcon, hideDelay: 'none', children: cap(type.name) }), _jsx(StyledText, { variant: 'h4', ref: setNodeLabel, children: label }), _jsx(Tooltip, { describeTarget: false, target: nodeLabel, hideDelay: 'none', children: label })] }), !readOnly && actionItems && (_jsx(MenuButton, { portal: true, variant: 'simple', text: t('actions'), icon: 'more', iconOnly: true, onClick: (e) => e.stopPropagation(), onKeyDown: (e) => e.stopPropagation(), menu: {

package/lib/components/FlowModeller/Node/NodeTemplates.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NodeTemplates.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n CSSProperties,\n useCallback,\n MouseEvent,\n KeyboardEvent,\n FC,\n useEffect,\n useContext\n} from 'react';\nimport { readableColor } from 'polished';\n\nimport {\n MenuButton,\n Icon,\n Flex,\n Tooltip,\n useElement,\n useI18n,\n cap,\n Text\n} from '@pega/cosmos-react-core';\n\nimport { colorMap } from '../../../utils';\nimport FlowModellerContext from '../FlowModellerContext';\n\nimport {\n StyledLabel,\n StyledCircle,\n StyledIcon,\n StyledNodeTemplateHeader,\n StyledNodeTempleteContent,\n StyledNodeTemplate,\n StyledText,\n StyledTextWithEllipsis,\n StyledAdditionalData,\n StyledNodeTemplateFooter,\n StyledAdditionalDataItem\n} from './NodeTemplate.styles';\nimport { NodeProps, NodeComponentProps, AdditionalDataItemProps } from './Node.types';\n\nconst MetaListItem = ({ label, value }: AdditionalDataItemProps) => {\n const [nodeAdditionalDataItem, setNodeAdditionalDataItem] = useElement();\n return (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ wrap: 'nowrap', pad: 0.25, gap: 0.25 }}\n item={{ grow: 1 }}\n ref={setNodeAdditionalDataItem}\n >\n <StyledTextWithEllipsis as='dd'>{label}</StyledTextWithEllipsis>\n <Text role='separator' variant='secondary' aria-hidden='true'>\n : \n </Text>\n <StyledTextWithEllipsis as='dt'>{value}</StyledTextWithEllipsis>\n </Flex>\n <Tooltip target={nodeAdditionalDataItem} hideDelay='none'>\n {`${label}:${value}`}\n </Tooltip>\n </>\n );\n};\n\nconst MetaList: FC<{ metadata: NodeProps['additionalData'] }> = ({ metadata }) => {\n const [nodeAdditionalData, setNodeAdditionalData] = useElement();\n let additionalDataValue = '';\n metadata?.forEach((item: AdditionalDataItemProps, index: number) => {\n if (index > 1) {\n additionalDataValue += `${item.label}: ${item.value}\n `;\n }\n });\n return (\n <Flex as={StyledAdditionalData} container={{ wrap: 'nowrap', colGap: 1, rowGap: 0.25 }}>\n {metadata?.map((data: AdditionalDataItemProps, index: number) => {\n if (index >= 2) {\n return;\n }\n return <MetaListItem key={data.id} {...data} />;\n })}\n {metadata && metadata.length > 2 && (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ pad: 0.25 }}\n item={{ grow: 1, shrink: 0 }}\n ref={setNodeAdditionalData}\n >\n <StyledTextWithEllipsis as='dt'>{`+${metadata?.length - 2}`}</StyledTextWithEllipsis>\n </Flex>\n {additionalDataValue && (\n <Tooltip target={nodeAdditionalData} hideDelay='none'>\n {additionalDataValue}\n </Tooltip>\n )}\n </>\n )}\n </Flex>\n );\n};\nexport const DefaultNode = ({\n id,\n label,\n type,\n description,\n additionalData,\n actions,\n onActionClick,\n onClick,\n onDelete,\n highlight,\n error,\n ...restProps\n}: NodeComponentProps) => {\n const t = useI18n();\n\n const actionItems = actions?.map(actionItem => {\n return {\n id: actionItem.id,\n primary: actionItem.text,\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onActionClick?.({ actionId, nodeId: id }, e);\n }\n };\n });\n\n if (onDelete !== undefined) {\n actionItems?.push({\n id: 'flowmodeller-delete-node',\n primary: t('delete'),\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onDelete?.({ actionId, nodeId: id }, e);\n }\n });\n }\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n onClick?.(id, e);\n }\n },\n [onClick]\n );\n\n const [nodeLabel, setNodeLabel] = useElement();\n const [nodeDescription, setNodeDescription] = useElement();\n\n const [nodeIcon, setNodeIcon] = useElement();\n const [nodeErrorToolTip, setNodeErrorToolTip] = useElement();\n const color = readableColor(colorMap[type.color]);\n const { readOnly } = useContext(FlowModellerContext);\n\n useEffect(() => {\n if (error) {\n setNodeDescription(null);\n setNodeLabel(null);\n setNodeIcon(null);\n }\n }, [error]);\n\n return (\n <StyledNodeTemplate\n aria-label={error \|\| label}\n onClick={(e: MouseEvent) => onClick?.(id, e)}\n onKeyDown={handleEnterKeyDown}\n ref={setNodeErrorToolTip}\n highlight={error ? true : highlight}\n error={error}\n id={`modeller-node-${id}`}\n {...restProps}\n >\n <Flex\n as={StyledNodeTemplateHeader}\n container={{ alignItems: 'center', pad: 1, justify: 'between' }}\n >\n <Flex container={{ alignItems: 'center' }}>\n <StyledIcon\n id={id}\n style={\n {\n '--bg-color': colorMap[type.color],\n '--fg-color': color\n } as CSSProperties\n }\n ref={setNodeIcon}\n >\n <Icon name={type.icon} />\n </StyledIcon>\n <Tooltip target={nodeIcon} hideDelay='none'>\n {cap(type.name)}\n </Tooltip>\n <StyledText variant='h4' ref={setNodeLabel}>\n {label}\n </StyledText>\n <Tooltip describeTarget={false} target={nodeLabel} hideDelay='none'>\n {label}\n </Tooltip>\n </Flex>\n {!readOnly && actionItems && (\n <MenuButton\n portal\n variant='simple'\n text={t('actions')}\n icon='more'\n iconOnly\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={(e: KeyboardEvent) => e.stopPropagation()}\n menu={{\n items: actionItems\n }}\n />\n )}\n </Flex>\n {description && (\n <>\n <StyledNodeTempleteContent ref={setNodeDescription}>\n {description}\n </StyledNodeTempleteContent>\n <Tooltip describeTarget={false} target={nodeDescription} hideDelay='none'>\n {description}\n </Tooltip>\n </>\n )}\n {additionalData && (\n <StyledNodeTemplateFooter>\n <MetaList metadata={additionalData} />\n </StyledNodeTemplateFooter>\n )}\n {error && (\n <Tooltip target={nodeErrorToolTip} hideDelay='none'>\n {error}\n </Tooltip>\n )}\n </StyledNodeTemplate>\n );\n};\n\nexport const StartNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n </Flex>\n );\n};\n\nexport const EndNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n </Flex>\n );\n};\n"]}
1	+ {"version":3,"file":"NodeTemplates.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n PropsWithoutRef,\n CSSProperties,\n useCallback,\n MouseEvent,\n KeyboardEvent,\n FC,\n useEffect,\n useContext\n} from 'react';\nimport { readableColor } from 'polished';\n\nimport {\n MenuButton,\n Icon,\n Flex,\n Tooltip,\n useElement,\n useI18n,\n cap,\n Text\n} from '@pega/cosmos-react-core';\n\nimport { colorMap } from '../../../utils';\nimport FlowModellerContext from '../FlowModellerContext';\n\nimport {\n StyledLabel,\n StyledCircle,\n StyledIcon,\n StyledNodeTemplateHeader,\n StyledNodeTempleteContent,\n StyledNodeTemplate,\n StyledText,\n StyledTextWithEllipsis,\n StyledAdditionalData,\n StyledNodeTemplateFooter,\n StyledAdditionalDataItem\n} from './NodeTemplate.styles';\nimport { NodeProps, NodeComponentProps, AdditionalDataItemProps } from './Node.types';\n\nconst MetaListItem = ({ label, value }: AdditionalDataItemProps) => {\n const [nodeAdditionalDataItem, setNodeAdditionalDataItem] = useElement();\n return (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ wrap: 'nowrap', pad: 0.25, gap: 0.25 }}\n item={{ grow: 1 }}\n ref={setNodeAdditionalDataItem}\n >\n <StyledTextWithEllipsis as='dd'>{label}</StyledTextWithEllipsis>\n <Text role='separator' variant='secondary' aria-hidden='true'>\n : \n </Text>\n <StyledTextWithEllipsis as='dt'>{value}</StyledTextWithEllipsis>\n </Flex>\n <Tooltip target={nodeAdditionalDataItem} hideDelay='none'>\n {`${label}:${value}`}\n </Tooltip>\n </>\n );\n};\n\nconst MetaList: FC<{ metadata: NodeProps['additionalData'] }> = ({ metadata }) => {\n const [nodeAdditionalData, setNodeAdditionalData] = useElement();\n let additionalDataValue = '';\n metadata?.forEach((item: AdditionalDataItemProps, index: number) => {\n if (index > 1) {\n additionalDataValue += `${item.label}: ${item.value}\n `;\n }\n });\n return (\n <Flex as={StyledAdditionalData} container={{ wrap: 'nowrap', colGap: 1, rowGap: 0.25 }}>\n {metadata?.map((data: AdditionalDataItemProps, index: number) => {\n if (index >= 2) {\n return;\n }\n return <MetaListItem key={data.id} {...data} />;\n })}\n {metadata && metadata.length > 2 && (\n <>\n <Flex\n as={StyledAdditionalDataItem}\n container={{ pad: 0.25 }}\n item={{ grow: 1, shrink: 0 }}\n ref={setNodeAdditionalData}\n >\n <StyledTextWithEllipsis as='dt'>{`+${metadata?.length - 2}`}</StyledTextWithEllipsis>\n </Flex>\n {additionalDataValue && (\n <Tooltip target={nodeAdditionalData} hideDelay='none'>\n {additionalDataValue}\n </Tooltip>\n )}\n </>\n )}\n </Flex>\n );\n};\nexport const DefaultNode = ({\n id,\n label,\n type,\n description,\n additionalData,\n actions,\n onActionClick,\n onClick,\n onDelete,\n highlight,\n error,\n ...restProps\n}: NodeComponentProps) => {\n const t = useI18n();\n\n const actionItems = actions?.map(actionItem => {\n return {\n id: actionItem.id,\n primary: actionItem.text,\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onActionClick?.({ actionId, nodeId: id }, e);\n }\n };\n });\n\n if (onDelete !== undefined) {\n actionItems?.push({\n id: 'flowmodeller-delete-node',\n primary: t('delete'),\n onClick: (actionId: string, e: MouseEvent) => {\n e.stopPropagation();\n onDelete?.({ actionId, nodeId: id }, e);\n }\n });\n }\n\n const handleEnterKeyDown = useCallback(\n (e: KeyboardEvent) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n onClick?.(id, e);\n }\n },\n [onClick]\n );\n\n const [nodeLabel, setNodeLabel] = useElement();\n const [nodeDescription, setNodeDescription] = useElement();\n\n const [nodeIcon, setNodeIcon] = useElement();\n const [nodeErrorToolTip, setNodeErrorToolTip] = useElement();\n const color = readableColor(colorMap[type.color]);\n const { readOnly, highlights } = useContext(FlowModellerContext);\n\n useEffect(() => {\n if (error) {\n setNodeDescription(null);\n setNodeLabel(null);\n setNodeIcon(null);\n }\n }, [error]);\n\n return (\n <StyledNodeTemplate\n aria-label={error \|\| label}\n onClick={(e: MouseEvent) => onClick?.(id, e)}\n onKeyDown={handleEnterKeyDown}\n ref={setNodeErrorToolTip}\n highlight={error ? true : !!highlights?.nodes?.[id]}\n error={error}\n id={`modeller-node-${id}`}\n {...restProps}\n >\n <Flex\n as={StyledNodeTemplateHeader}\n container={{ alignItems: 'center', pad: 1, justify: 'between' }}\n >\n <Flex container={{ alignItems: 'center' }}>\n <StyledIcon\n id={id}\n style={\n {\n '--bg-color': colorMap[type.color],\n '--fg-color': color\n } as CSSProperties\n }\n ref={setNodeIcon}\n >\n <Icon name={type.icon} />\n </StyledIcon>\n <Tooltip target={nodeIcon} hideDelay='none'>\n {cap(type.name)}\n </Tooltip>\n <StyledText variant='h4' ref={setNodeLabel}>\n {label}\n </StyledText>\n <Tooltip describeTarget={false} target={nodeLabel} hideDelay='none'>\n {label}\n </Tooltip>\n </Flex>\n {!readOnly && actionItems && (\n <MenuButton\n portal\n variant='simple'\n text={t('actions')}\n icon='more'\n iconOnly\n onClick={(e: MouseEvent) => e.stopPropagation()}\n onKeyDown={(e: KeyboardEvent) => e.stopPropagation()}\n menu={{\n items: actionItems\n }}\n />\n )}\n </Flex>\n {description && (\n <>\n <StyledNodeTempleteContent ref={setNodeDescription}>\n {description}\n </StyledNodeTempleteContent>\n <Tooltip describeTarget={false} target={nodeDescription} hideDelay='none'>\n {description}\n </Tooltip>\n </>\n )}\n {additionalData && (\n <StyledNodeTemplateFooter>\n <MetaList metadata={additionalData} />\n </StyledNodeTemplateFooter>\n )}\n {error && (\n <Tooltip target={nodeErrorToolTip} hideDelay='none'>\n {error}\n </Tooltip>\n )}\n </StyledNodeTemplate>\n );\n};\n\nexport const StartNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n </Flex>\n );\n};\n\nexport const EndNode = ({ type, label }: PropsWithoutRef<NodeProps>) => {\n return (\n <Flex container={{ justify: 'center', direction: 'column' }}>\n <Flex\n as={StyledCircle}\n style={\n {\n '--bg-color': colorMap[type.color]\n } as CSSProperties\n }\n tabIndex='0'\n aria-label={label}\n role='button'\n />\n <Flex as={StyledLabel} nodeType={type}>\n {label}\n </Flex>\n </Flex>\n );\n};\n"]}

package/lib/components/FlowModeller/Renderer/Renderer.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,~~EAAE~~,MAAM,OAAO,CAAC;~~AAI3B~~,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;~~AAUjD~~,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,~~CAe~~/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
1	+ {"version":3,"file":"Renderer.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAc,MAAM,OAAO,CAAC;AAOvC,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAuBjD,QAAA,MAAM,QAAQ,EAAE,EAAE,CAAC,aAAa,CA0C/B,CAAC;AAEF,eAAe,QAAQ,CAAC"}

package/lib/components/FlowModeller/Renderer/Renderer.js CHANGED Viewed

@@ -1,17 +1,42 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled from 'styled-components';
-import Connectors from './Connectors';
-import Nodes from './Nodes';
+import { createElement as _createElement } from "react";
+import { useContext } from 'react';
+import styled, { css } from 'styled-components';
+import { Flex } from '@pega/cosmos-react-core';
+import FlowModellerContext from '../FlowModellerContext';
 import GraphLayout from './Utils/GraphLayout';
 const StyledWrapper = styled.div `
   position: relative;
   width: 100%;
   height: 100%;
 `;
-const Renderer = ({ graphData, connector, node, highlights }) => {
+const StyledContentWrapper = styled.div `
+  position: absolute;
+  top: 0;
+  left: 0;
+`;
+const StyledNodeWrapper = styled(StyledContentWrapper)(() => {
+    return css `
+    width: var(--width);
+    height: var(--height);
+    transform: translate(var(--xPos), var(--yPos));
+  `;
+});
+const Renderer = ({ graphData, connector: Connector, node: Node }) => {
     // apply the plotted positions
-    const graphDimensions = GraphLayout.plot(graphData);
-    return (_jsxs(StyledWrapper, { children: [_jsx(Connectors, { items: graphData.connectors, content: connector, dimensions: graphDimensions, highlights: highlights?.connectors }), _jsx(Nodes, { items: graphData.nodes, content: node, highlights: highlights?.nodes })] }));
+    const { readOnly } = useContext(FlowModellerContext);
+    const graphDimensions = GraphLayout.plot(graphData, readOnly);
+    return (_jsxs(StyledWrapper, { children: [_jsx(StyledContentWrapper, { children: _jsx("svg", { width: graphDimensions.width, height: graphDimensions.height, viewBox: `0 0 ${graphDimensions.width} ${graphDimensions.height}`, children: Connector &&
+                        graphData.connectors.map(item => {
+                            return _createElement(Connector, { ...item, key: item.id });
+                        }) }) }), _jsx(StyledContentWrapper, { children: graphData.nodes.map(item => {
+                    return (_jsx(Flex, { as: StyledNodeWrapper, id: item.id, style: {
+                            '--width': `${item.dimensions.width}px`,
+                            '--height': `${item.dimensions.height}px`,
+                            '--xPos': `${item.position.x}px`,
+                            '--yPos': `${item.position.y}px`
+                        }, container: { justify: 'center' }, children: Node && _jsx(Node, { ...item }) }, item.id));
+                }) })] }));
 };
 export default Renderer;
 //# sourceMappingURL=Renderer.js.map

package/lib/components/FlowModeller/Renderer/Renderer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Renderer.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.tsx"],"names":[],"mappings":";~~AACA~~,OAAO,MAAM,MAAM,mBAAmB,CAAC;~~AAEvC~~,OAAO,~~UAAU~~,MAAM,~~cAAc~~,CAAC;~~AAEtC~~,OAAO,~~KAAK~~,MAAM,~~SAAS~~,CAAC;~~AAC5B~~,OAAO,WAAW,MAAM,qBAAqB,CAAC;AAE9C,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI/B,CAAC;AAEF,MAAM,QAAQ,GAAsB,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,~~UAAU~~,EAAE,EAAE,EAAE;~~IACjF~~,8BAA8B;IAC9B,MAAM,eAAe,GAAG,WAAW,CAAC,IAAI,CAA6B,SAAS,CAAC,CAAC;~~IAEhF~~,OAAO,CACL,MAAC,aAAa,eACZ,KAAC,~~UAAU~~,~~IACT~~,KAAK,EAAE,~~SAAS~~,CAAC,~~UAAU~~,~~EAC3B~~,OAAO,EAAE,SAAS,~~EAClB~~,UAAU,EAAE,~~eAAe~~,~~EAC3B~~,~~UAAU~~,EAAE,~~UAAU~~,EAAE,~~UAAU~~,~~GAClC~~,~~EACF~~,KAAC,KAAK,~~IAAC~~,KAAK,EAAE,SAAS,CAAC,KAAK,EAAE,~~OAAO~~,EAAE,IAAI,EAAE,~~UAAU~~,EAAE,~~UAAU~~,EAAE,~~KAAK~~,GAAI,~~IACjE~~,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { FC } from 'react';\nimport styled from 'styled-components';\n\nimport ~~Connectors~~ from '~~./Connectors~~';\nimport { RendererProps } from './Renderer.types';\nimport ~~Nodes from './Nodes';\nimport~~ GraphLayout from './Utils/GraphLayout';\n\nconst StyledWrapper = styled.div`\n position: relative;\n width: 100%;\n height: 100%;\n`;\n\nconst Renderer: FC<RendererProps> = ({ graphData, connector, node, ~~highlights~~ }) => {\n // apply the plotted positions\n const graphDimensions = GraphLayout.plot<RendererProps['graphData']>(graphData);\n\n return (\n <StyledWrapper>\n <~~Connectors~~\n ~~items~~={~~graphData~~.~~connectors~~}\n ~~content~~={~~connector~~}\n ~~dimensions~~={graphDimensions}\n ~~highlights=~~{~~highlights?.~~connectors}\n ~~/>\~~n <~~Nodes items=~~{graphData.nodes} ~~content~~={~~node~~} ~~highlights~~={~~highlights?.nodes~~} ~~/>\~~n </StyledWrapper>\n );\n};\n\nexport default Renderer;\n"]}
1	+ {"version":3,"file":"Renderer.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAM,UAAU,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAE/C,OAAO,mBAAmB,MAAM,wBAAwB,CAAC;AAGzD,OAAO,WAAW,MAAM,qBAAqB,CAAC;AAE9C,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI/B,CAAC;AAEF,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAItC,CAAC;AAEF,MAAM,iBAAiB,GAAG,MAAM,CAAC,oBAAoB,CAAC,CAAC,GAAG,EAAE;IAC1D,OAAO,GAAG,CAAA;;;;GAIT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,QAAQ,GAAsB,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE;IACtF,8BAA8B;IAC9B,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,mBAAmB,CAAC,CAAC;IAErD,MAAM,eAAe,GAAG,WAAW,CAAC,IAAI,CAA6B,SAAS,EAAE,QAAQ,CAAC,CAAC;IAE1F,OAAO,CACL,MAAC,aAAa,eACZ,KAAC,oBAAoB,cACnB,cACE,KAAK,EAAE,eAAe,CAAC,KAAK,EAC5B,MAAM,EAAE,eAAe,CAAC,MAAM,EAC9B,OAAO,EAAE,OAAO,eAAe,CAAC,KAAK,IAAI,eAAe,CAAC,MAAM,EAAE,YAEhE,SAAS;wBACR,SAAS,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;4BAC9B,OAAO,eAAC,SAAS,OAAK,IAAI,EAAE,GAAG,EAAE,IAAI,CAAC,EAAE,GAAI,CAAC;wBAC/C,CAAC,CAAC,GACA,GACe,EACvB,KAAC,oBAAoB,cAClB,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;oBAC1B,OAAO,CACL,KAAC,IAAI,IAEH,EAAE,EAAE,iBAAiB,EACrB,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,KAAK,EAAE;4BACL,SAAS,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,IAAI;4BACvC,UAAU,EAAE,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,IAAI;4BACzC,QAAQ,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI;4BAChC,QAAQ,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI;yBACjC,EACD,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,YAE/B,IAAI,IAAI,KAAC,IAAI,OAAK,IAAI,GAAI,IAXtB,IAAI,CAAC,EAAE,CAYP,CACR,CAAC;gBACJ,CAAC,CAAC,GACmB,IACT,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { FC, useContext } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex } from '@pega/cosmos-react-core';\n\nimport FlowModellerContext from '../FlowModellerContext';\n\nimport { RendererProps } from './Renderer.types';\nimport GraphLayout from './Utils/GraphLayout';\n\nconst StyledWrapper = styled.div`\n position: relative;\n width: 100%;\n height: 100%;\n`;\n\nconst StyledContentWrapper = styled.div`\n position: absolute;\n top: 0;\n left: 0;\n`;\n\nconst StyledNodeWrapper = styled(StyledContentWrapper)(() => {\n return css`\n width: var(--width);\n height: var(--height);\n transform: translate(var(--xPos), var(--yPos));\n `;\n});\n\nconst Renderer: FC<RendererProps> = ({ graphData, connector: Connector, node: Node }) => {\n // apply the plotted positions\n const { readOnly } = useContext(FlowModellerContext);\n\n const graphDimensions = GraphLayout.plot<RendererProps['graphData']>(graphData, readOnly);\n\n return (\n <StyledWrapper>\n <StyledContentWrapper>\n <svg\n width={graphDimensions.width}\n height={graphDimensions.height}\n viewBox={`0 0 ${graphDimensions.width} ${graphDimensions.height}`}\n >\n {Connector &&\n graphData.connectors.map(item => {\n return <Connector {...item} key={item.id} />;\n })}\n </svg>\n </StyledContentWrapper>\n <StyledContentWrapper>\n {graphData.nodes.map(item => {\n return (\n <Flex\n key={item.id}\n as={StyledNodeWrapper}\n id={item.id}\n style={{\n '--width': `${item.dimensions.width}px`,\n '--height': `${item.dimensions.height}px`,\n '--xPos': `${item.position.x}px`,\n '--yPos': `${item.position.y}px`\n }}\n container={{ justify: 'center' }}\n >\n {Node && <Node {...item} />}\n </Flex>\n );\n })}\n </StyledContentWrapper>\n </StyledWrapper>\n );\n};\n\nexport default Renderer;\n"]}

package/lib/components/FlowModeller/Renderer/Renderer.types.d.ts CHANGED Viewed

@@ -5,20 +5,14 @@ export interface AddNodeHandlerParams {
     refType: 'node' | 'connector';
     refId: string | string[];
 }
-export interface RendererNodeProps extends PlottedGraphNode {
-    highlight?: boolean;
-}
-export interface RendererConnectorProps extends PlottedGraphConnector {
-    highlight?: boolean;
-}
 export interface RendererProps {
-    graphData: GraphData<RendererNodeProps, RendererConnectorProps>;
+    graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;
     disableAutoLayout?: boolean;
     highlights?: {
         nodes: Record<string, Node>;
         connectors: Record<string, ConnectorProps>;
     };
-    connector?: FC<RendererConnectorProps>;
-    node?: FC<Node>;
+    connector?: FC<PlottedGraphConnector>;
+    node?: FC<PlottedGraphNode>;
 }
 //# sourceMappingURL=Renderer.types.d.ts.map

package/lib/components/FlowModeller/Renderer/Renderer.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Renderer.types.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE9E,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,GAAG,WAAW,CAAC;IAC9B,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAC1B;AAED,MAAM,WAAW,~~iBAAkB,SAAQ,gBAAgB;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,sBAAuB,SAAQ,qBAAqB;IACnE,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,~~aAAa;IAC5B,SAAS,EAAE,SAAS,CAAC,~~iBAAiB~~,EAAE,~~sBAAsB~~,CAAC,CAAC;~~IAChE~~,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,UAAU,CAAC,EAAE;QACX,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QAC5B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;KAC5C,CAAC;IACF,SAAS,CAAC,EAAE,EAAE,CAAC,~~sBAAsB~~,CAAC,CAAC;~~IACvC~~,IAAI,CAAC,EAAE,EAAE,CAAC,~~IAAI~~,CAAC,CAAC;~~CACjB~~"}
1	+ {"version":3,"file":"Renderer.types.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,OAAO,EAAE,cAAc,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAChE,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE9E,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,GAAG,WAAW,CAAC;IAC9B,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAC1B;AAED,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,SAAS,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,CAAC;IAC9D,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,UAAU,CAAC,EAAE;QACX,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;QAC5B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;KAC5C,CAAC;IACF,SAAS,CAAC,EAAE,EAAE,CAAC,qBAAqB,CAAC,CAAC;IACtC,IAAI,CAAC,EAAE,EAAE,CAAC,gBAAgB,CAAC,CAAC;CAC7B"}

package/lib/components/FlowModeller/Renderer/Renderer.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Renderer.types.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"","sourcesContent":["import { FC } from 'react';\n\nimport { ConnectorProps, Node, GraphData } from './Utils/Graph';\nimport { PlottedGraphConnector, PlottedGraphNode } from './Utils/GraphLayout';\n\nexport interface AddNodeHandlerParams {\n refType: 'node' \| 'connector';\n refId: string \| string[];\n}\n\nexport interface ~~RendererNodeProps extends PlottedGraphNode {\n highlight?: boolean;\n}\n\nexport interface RendererConnectorProps extends PlottedGraphConnector {\n highlight?: boolean;\n}\n\nexport interface~~ RendererProps {\n graphData: GraphData<~~RendererNodeProps~~, ~~RendererConnectorProps~~>;\n disableAutoLayout?: boolean;\n highlights?: {\n nodes: Record<string, Node>;\n connectors: Record<string, ConnectorProps>;\n };\n connector?: FC<~~RendererConnectorProps~~>;\n node?: FC<~~Node~~>;\n}\n"]}
1	+ {"version":3,"file":"Renderer.types.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"","sourcesContent":["import { FC } from 'react';\n\nimport { ConnectorProps, Node, GraphData } from './Utils/Graph';\nimport { PlottedGraphConnector, PlottedGraphNode } from './Utils/GraphLayout';\n\nexport interface AddNodeHandlerParams {\n refType: 'node' \| 'connector';\n refId: string \| string[];\n}\n\nexport interface RendererProps {\n graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;\n disableAutoLayout?: boolean;\n highlights?: {\n nodes: Record<string, Node>;\n connectors: Record<string, ConnectorProps>;\n };\n connector?: FC<PlottedGraphConnector>;\n node?: FC<PlottedGraphNode>;\n}\n"]}

package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.d.ts CHANGED Viewed

@@ -27,7 +27,7 @@ export declare enum GraphLayoutDirection {
     TopToBottom = "TB"
 }
 export default class GraphLayout {
-    static plot<T extends GraphData<PlottedGraphNode, PlottedGraphConnector>>(graphData: T, direction?: GraphLayoutDirection): {
+    static plot<T extends GraphData<PlottedGraphNode, PlottedGraphConnector>>(graphData: T, readOnly?: boolean, direction?: GraphLayoutDirection): {
         width: number;
         height: number;
     };

package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GraphLayout.d.ts","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/GraphLayout.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE1D,MAAM,WAAW,gBAAgB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,CAAC,CAAC;IACxD,UAAU,EAAE;QACV,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,QAAQ,EAAE;QACR,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;KACX,CAAC;CACH;AAED,MAAM,WAAW,qBAAqB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IACvE,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACnC,WAAW,CAAC,EAAE;QACZ,KAAK,EAAE,GAAG,CAAC;QACX,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;QACf,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;KACX,CAAC;CACH;AAED,oBAAY,oBAAoB;IAC9B,WAAW,OAAO;IAClB,WAAW,OAAO;CACnB;AAKD,MAAM,CAAC,OAAO,OAAO,WAAW;IAE9B,MAAM,CAAC,IAAI,CAAC,CAAC,SAAS,SAAS,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,EACtE,SAAS,EAAE,CAAC,EACZ,SAAS,GAAE,oBAAuD;;;;~~CAsHrE~~"}
1	+ {"version":3,"file":"GraphLayout.d.ts","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/GraphLayout.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE1D,MAAM,WAAW,gBAAgB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,IAAI,CAAC,CAAC,CAAC;IACxD,UAAU,EAAE;QACV,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,QAAQ,EAAE;QACR,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;KACX,CAAC;CACH;AAED,MAAM,WAAW,qBAAqB,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;IACvE,MAAM,EAAE;QAAE,CAAC,EAAE,MAAM,CAAC;QAAC,CAAC,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACnC,WAAW,CAAC,EAAE;QACZ,KAAK,EAAE,GAAG,CAAC;QACX,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;QACf,CAAC,EAAE,MAAM,CAAC;QACV,CAAC,EAAE,MAAM,CAAC;KACX,CAAC;CACH;AAED,oBAAY,oBAAoB;IAC9B,WAAW,OAAO;IAClB,WAAW,OAAO;CACnB;AAKD,MAAM,CAAC,OAAO,OAAO,WAAW;IAE9B,MAAM,CAAC,IAAI,CAAC,CAAC,SAAS,SAAS,CAAC,gBAAgB,EAAE,qBAAqB,CAAC,EACtE,SAAS,EAAE,CAAC,EACZ,QAAQ,GAAE,OAAe,EACzB,SAAS,GAAE,oBAAuD;;;;CAyIrE"}

package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.js CHANGED Viewed

@@ -8,20 +8,20 @@ const DEFAULT_GRAPH_WIDTH = 2000;
 const DEFAULT_GRAPH_HEIGHT = 2000;
 export default class GraphLayout {
     // Using Dagre layouting
-    static plot(graphData, direction = GraphLayoutDirection.TopToBottom) {
+    static plot(graphData, readOnly = false, direction = GraphLayoutDirection.TopToBottom) {
         const dagreGraph = new dagre.graphlib.Graph({ multigraph: true });
         dagreGraph.setDefaultEdgeLabel(() => ({}));
         const defaultNodeWidth = 280;
         const defaultNodeHeight = 112;
         dagreGraph.setGraph({
             rankdir: direction,
-            ranksep: 20,
+            ranksep: readOnly ? 2 : 4,
             edgesep: defaultNodeWidth / 2,
             nodesep: 20,
             // cspell:disable-next
             marginx: 200,
             // cspell:disable-next
-            marginy: 50
+            marginy: 32
         });
         graphData.nodes.forEach(node => {
             const height = node.dimensions.height === 0 ? 0 : node.dimensions.height || defaultNodeHeight;
@@ -54,7 +54,7 @@ export default class GraphLayout {
             con.labelLayout = {
                 value: edge.label,
                 x: edge.x,
-                y: edge.y - 10,
+                y: edge.y,
                 width: edge.width,
                 height: edge.height
             };
@@ -86,9 +86,22 @@ export default class GraphLayout {
                 { ...firstPoint, y: firstPoint.y + 10 },
                 { ...secondPoint, y: secondPoint.y + 10 },
                 ...edge.points.slice(2, lastIndex),
-                lastPoint,
-                { x: toNode.x, y: toNode.y }
+                lastPoint
             ];
+            // Only add the last point incase the edge has an arc at end
+            if (edge.points[lastIndex].x !== edge.points[lastIndex - 1].x) {
+                con.points.push({ x: toNode.x, y: toNode.y });
+            }
+            // if current edge source node is an placeholder node move down the starting point of placeholder node by 12
+            if (fromNode.height === 0) {
+                con.points[0].y += 12;
+            }
+            const edgeLastPointIndex = con.points.length - 1;
+            // Move the merging arcs last point to the starting point of placeholder node
+            if (con.points[edgeLastPointIndex].x === con.points[edgeLastPointIndex - 1].x &&
+                toNode.height === 0) {
+                con.points[edgeLastPointIndex].y += 12;
+            }
         });
         const width = dagreGraph.graph().width;
         const height = dagreGraph.graph().height;

package/lib/components/FlowModeller/Renderer/Utils/GraphLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"GraphLayout.js","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/GraphLayout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA0B1B,MAAM,CAAN,IAAY,oBAGX;AAHD,WAAY,oBAAoB;IAC9B,0CAAkB,CAAA;IAClB,0CAAkB,CAAA;AACpB,CAAC,EAHW,oBAAoB,KAApB,oBAAoB,QAG/B;AAED,MAAM,mBAAmB,GAAG,IAAI,CAAC;AACjC,MAAM,oBAAoB,GAAG,IAAI,CAAC;AAElC,MAAM,CAAC,OAAO,OAAO,WAAW;IAC9B,wBAAwB;IACxB,MAAM,CAAC,IAAI,CACT,SAAY,EACZ,YAAkC,oBAAoB,CAAC,WAAW;QAElE,MAAM,UAAU,GAAG,IAAI,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC,CAAC;QAElE,UAAU,CAAC,mBAAmB,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAE3C,MAAM,gBAAgB,GAAG,GAAG,CAAC;QAC7B,MAAM,iBAAiB,GAAG,GAAG,CAAC;QAE9B,UAAU,CAAC,QAAQ,CAAC;YAClB,OAAO,EAAE,SAAS;YAClB,OAAO,EAAE,~~EAAE~~;~~YACX~~,OAAO,EAAE,gBAAgB,GAAG,CAAC;YAC7B,OAAO,EAAE,EAAE;YACX,sBAAsB;YACtB,OAAO,EAAE,GAAG;YACZ,sBAAsB;YACtB,OAAO,EAAE,EAAE;SACZ,CAAC,CAAC;QAEH,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAC7B,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,MAAM,IAAI,iBAAiB,CAAC;YAC9F,MAAM,KAAK,GAAG,IAAI,CAAC,UAAU,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,KAAK,IAAI,gBAAgB,CAAC;YAC1F,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE;gBAC1B,KAAK;gBACL,MAAM;aACP,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;YAC1C,UAAU,CAAC,OAAO,CAChB,GAAG,CAAC,UAAU,EACd,GAAG,CAAC,QAAQ,EACZ;gBACE,MAAM,EAAE,CAAC;gBACT,MAAM,EAAE,CAAC;gBACT,KAAK,EAAE,GAAG,CAAC,IAAI,EAAE,KAAK,IAAI,EAAE;gBAC5B,KAAK,EAAE,GAAG;gBACV,MAAM,EAAE,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE;gBACjC,sBAAsB;gBACtB,QAAQ,EAAE,GAAG;gBACb,WAAW,EAAE,CAAC;aACf,EACD,KAAK,CAAC,QAAQ,EAAE,CACjB,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,KAAK,CAAC,MAAM,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;QAE7B,SAAS,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;YAC3B,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACpC,EAAE,CAAC,QAAQ,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC;YACjD,EAAE,CAAC,QAAQ,CAAC,CAAC,GAAG,IAAI,CAAC,CAAC,GAAG,EAAE,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;QACpD,CAAC,CAAC,CAAC;QAEH,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE;YAC1C,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC;YAE7E,GAAG,CAAC,WAAW,GAAG;gBAChB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,CAAC,EAAE,IAAI,CAAC,CAAC;gBACT,CAAC,EAAE,IAAI,CAAC,CAAC~~,GAAG,EAAE~~;~~gBACd~~,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,MAAM,EAAE,IAAI,CAAC,MAAM;aACpB,CAAC;YAEF,MAAM,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;YACzC,IAAI,UAAU,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YAChC,MAAM,WAAW,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YACnC,IAAI,SAAS,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;YACvC,MAAM,eAAe,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC;YAEnD,MAAM,QAAQ,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;YACjD,MAAM,MAAM,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;YAE7C,UAAU;gBACR,UAAU,CAAC,CAAC,KAAK,WAAW,CAAC,CAAC;oBAC5B,CAAC,CAAC;wBACE,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;wBACjB,CAAC,EAAE,QAAQ,CAAC,CAAC;wBACb,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;qBACpB;oBACH,CAAC,CAAC,UAAU,CAAC;YAEjB,SAAS;gBACP,SAAS,CAAC,CAAC,KAAK,eAAe,CAAC,CAAC;oBAC/B,CAAC,CAAC;wBACE,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC;wBACzB,CAAC,EAAE,MAAM,CAAC,CAAC;wBACX,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC;qBAChC;oBACH,CAAC,CAAC,SAAS,CAAC;YAEhB,GAAG,CAAC,MAAM,GAAG;gBACX,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;gBACtD,EAAE,GAAG,UAAU,EAAE,CAAC,EAAE,UAAU,CAAC,CAAC,GAAG,EAAE,EAAE;gBACvC,EAAE,GAAG,WAAW,EAAE,CAAC,EAAE,WAAW,CAAC,CAAC,GAAG,EAAE,EAAE;gBACzC,GAAG,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC;gBAClC,SAAS;~~gBACT~~,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE;~~aAC7B~~,CAAC;~~QACJ~~,CAAC,CAAC,CAAC;QAEH,MAAM,KAAK,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,KAAK,CAAC;QACvC,MAAM,MAAM,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,MAAM,CAAC;QAEzC,IAAI,KAAK,KAAK,SAAS,IAAI,MAAM,KAAK,SAAS,EAAE;YAC/C,OAAO;gBACL,KAAK,EAAE,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,mBAAmB;gBAC3D,MAAM,EAAE,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,oBAAoB;aAChE,CAAC;SACH;QAED,OAAO;YACL,KAAK,EAAE,mBAAmB;YAC1B,MAAM,EAAE,oBAAoB;SAC7B,CAAC;IACJ,CAAC;CACF","sourcesContent":["import dagre from 'dagre';\n\nimport { ConnectorProps, GraphData, Node } from './Graph';\n\nexport interface PlottedGraphNode<T = any> extends Node<T> {\n dimensions: {\n width: number;\n height: number;\n };\n position: {\n x: number;\n y: number;\n };\n}\n\nexport interface PlottedGraphConnector<T = any> extends ConnectorProps<T> {\n points: { x: number; y: number }[];\n labelLayout?: {\n value: any;\n width: number;\n height: number;\n x: number;\n y: number;\n };\n}\n\nexport enum GraphLayoutDirection {\n LeftToRight = 'LR',\n TopToBottom = 'TB'\n}\n\nconst DEFAULT_GRAPH_WIDTH = 2000;\nconst DEFAULT_GRAPH_HEIGHT = 2000;\n\nexport default class GraphLayout {\n // Using Dagre layouting\n static plot<T extends GraphData<PlottedGraphNode, PlottedGraphConnector>>(\n graphData: T,\n direction: GraphLayoutDirection = GraphLayoutDirection.TopToBottom\n ) {\n const dagreGraph = new dagre.graphlib.Graph({ multigraph: true });\n\n dagreGraph.setDefaultEdgeLabel(() => ({}));\n\n const defaultNodeWidth = 280;\n const defaultNodeHeight = 112;\n\n dagreGraph.setGraph({\n rankdir: direction,\n ranksep: 20,\n edgesep: defaultNodeWidth / 2,\n nodesep: 20,\n // cspell:disable-next\n marginx: 200,\n // cspell:disable-next\n marginy: 50\n });\n\n graphData.nodes.forEach(node => {\n const height = node.dimensions.height === 0 ? 0 : node.dimensions.height \|\| defaultNodeHeight;\n const width = node.dimensions.width === 0 ? 0 : node.dimensions.width \|\| defaultNodeWidth;\n dagreGraph.setNode(node.id, {\n width,\n height\n });\n });\n\n graphData.connectors.forEach((con, index) => {\n dagreGraph.setEdge(\n con.fromNodeId,\n con.toNodeId,\n {\n weight: 1,\n minlen: 2,\n label: con.data?.label \|\| '',\n width: 250,\n height: con.data?.label ? 90 : 40,\n // cspell:disable-next\n lablepos: 'c',\n labeloffset: 0\n },\n index.toString()\n );\n });\n\n dagre.layout(dagreGraph, {});\n\n graphData.nodes.forEach(el => {\n const node = dagreGraph.node(el.id);\n el.position.x = node.x - el.dimensions.width / 2;\n el.position.y = node.y - el.dimensions.height / 2;\n });\n\n graphData.connectors.forEach((con, index) => {\n const edge = dagreGraph.edge(con.fromNodeId, con.toNodeId, index.toString());\n\n con.labelLayout = {\n value: edge.label,\n x: edge.x,\n y: edge.y ~~- 10~~,\n width: edge.width,\n height: edge.height\n };\n\n const lastIndex = edge.points.length - 1;\n let firstPoint = edge.points[0];\n const secondPoint = edge.points[1];\n let lastPoint = edge.points[lastIndex];\n const secondLastPoint = edge.points[lastIndex - 1];\n\n const fromNode = dagreGraph.node(con.fromNodeId);\n const toNode = dagreGraph.node(con.toNodeId);\n\n firstPoint =\n firstPoint.x !== secondPoint.x\n ? {\n ...edge.points[0],\n x: fromNode.x,\n y: edge.points[1].y\n }\n : firstPoint;\n\n lastPoint =\n lastPoint.x !== secondLastPoint.x\n ? {\n ...edge.points[lastIndex],\n x: toNode.x,\n y: edge.points[lastIndex - 1].y\n }\n : lastPoint;\n\n con.points = [\n { x: fromNode.x, y: fromNode.y + fromNode.height / 2 },\n { ...firstPoint, y: firstPoint.y + 10 },\n { ...secondPoint, y: secondPoint.y + 10 },\n ...edge.points.slice(2, lastIndex),\n lastPoint,\n { x: toNode.x, y: toNode.y }\n ];\n });\n\n const width = dagreGraph.graph().width;\n const height = dagreGraph.graph().height;\n\n if (width !== undefined && height !== undefined) {\n return {\n width: Number.isFinite(width) ? width : DEFAULT_GRAPH_WIDTH,\n height: Number.isFinite(height) ? height : DEFAULT_GRAPH_HEIGHT\n };\n }\n\n return {\n width: DEFAULT_GRAPH_WIDTH,\n height: DEFAULT_GRAPH_HEIGHT\n };\n }\n}\n"]}
1	+ {"version":3,"file":"GraphLayout.js","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/GraphLayout.ts"],"names":[],"mappings":"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","sourcesContent":["import dagre from 'dagre';\n\nimport { ConnectorProps, GraphData, Node } from './Graph';\n\nexport interface PlottedGraphNode<T = any> extends Node<T> {\n dimensions: {\n width: number;\n height: number;\n };\n position: {\n x: number;\n y: number;\n };\n}\n\nexport interface PlottedGraphConnector<T = any> extends ConnectorProps<T> {\n points: { x: number; y: number }[];\n labelLayout?: {\n value: any;\n width: number;\n height: number;\n x: number;\n y: number;\n };\n}\n\nexport enum GraphLayoutDirection {\n LeftToRight = 'LR',\n TopToBottom = 'TB'\n}\n\nconst DEFAULT_GRAPH_WIDTH = 2000;\nconst DEFAULT_GRAPH_HEIGHT = 2000;\n\nexport default class GraphLayout {\n // Using Dagre layouting\n static plot<T extends GraphData<PlottedGraphNode, PlottedGraphConnector>>(\n graphData: T,\n readOnly: boolean = false,\n direction: GraphLayoutDirection = GraphLayoutDirection.TopToBottom\n ) {\n const dagreGraph = new dagre.graphlib.Graph({ multigraph: true });\n\n dagreGraph.setDefaultEdgeLabel(() => ({}));\n\n const defaultNodeWidth = 280;\n const defaultNodeHeight = 112;\n\n dagreGraph.setGraph({\n rankdir: direction,\n ranksep: readOnly ? 2 : 4,\n edgesep: defaultNodeWidth / 2,\n nodesep: 20,\n // cspell:disable-next\n marginx: 200,\n // cspell:disable-next\n marginy: 32\n });\n\n graphData.nodes.forEach(node => {\n const height = node.dimensions.height === 0 ? 0 : node.dimensions.height \|\| defaultNodeHeight;\n const width = node.dimensions.width === 0 ? 0 : node.dimensions.width \|\| defaultNodeWidth;\n dagreGraph.setNode(node.id, {\n width,\n height\n });\n });\n\n graphData.connectors.forEach((con, index) => {\n dagreGraph.setEdge(\n con.fromNodeId,\n con.toNodeId,\n {\n weight: 1,\n minlen: 2,\n label: con.data?.label \|\| '',\n width: 250,\n height: con.data?.label ? 90 : 40,\n // cspell:disable-next\n lablepos: 'c',\n labeloffset: 0\n },\n index.toString()\n );\n });\n\n dagre.layout(dagreGraph, {});\n\n graphData.nodes.forEach(el => {\n const node = dagreGraph.node(el.id);\n el.position.x = node.x - el.dimensions.width / 2;\n el.position.y = node.y - el.dimensions.height / 2;\n });\n\n graphData.connectors.forEach((con, index) => {\n const edge = dagreGraph.edge(con.fromNodeId, con.toNodeId, index.toString());\n\n con.labelLayout = {\n value: edge.label,\n x: edge.x,\n y: edge.y,\n width: edge.width,\n height: edge.height\n };\n\n const lastIndex = edge.points.length - 1;\n let firstPoint = edge.points[0];\n const secondPoint = edge.points[1];\n let lastPoint = edge.points[lastIndex];\n const secondLastPoint = edge.points[lastIndex - 1];\n\n const fromNode = dagreGraph.node(con.fromNodeId);\n const toNode = dagreGraph.node(con.toNodeId);\n\n firstPoint =\n firstPoint.x !== secondPoint.x\n ? {\n ...edge.points[0],\n x: fromNode.x,\n y: edge.points[1].y\n }\n : firstPoint;\n\n lastPoint =\n lastPoint.x !== secondLastPoint.x\n ? {\n ...edge.points[lastIndex],\n x: toNode.x,\n y: edge.points[lastIndex - 1].y\n }\n : lastPoint;\n\n con.points = [\n { x: fromNode.x, y: fromNode.y + fromNode.height / 2 },\n { ...firstPoint, y: firstPoint.y + 10 },\n { ...secondPoint, y: secondPoint.y + 10 },\n ...edge.points.slice(2, lastIndex),\n lastPoint\n ];\n\n // Only add the last point incase the edge has an arc at end\n if (edge.points[lastIndex].x !== edge.points[lastIndex - 1].x) {\n con.points.push({ x: toNode.x, y: toNode.y });\n }\n\n // if current edge source node is an placeholder node move down the starting point of placeholder node by 12\n if (fromNode.height === 0) {\n con.points[0].y += 12;\n }\n\n const edgeLastPointIndex = con.points.length - 1;\n\n // Move the merging arcs last point to the starting point of placeholder node\n if (\n con.points[edgeLastPointIndex].x === con.points[edgeLastPointIndex - 1].x &&\n toNode.height === 0\n ) {\n con.points[edgeLastPointIndex].y += 12;\n }\n });\n\n const width = dagreGraph.graph().width;\n const height = dagreGraph.graph().height;\n\n if (width !== undefined && height !== undefined) {\n return {\n width: Number.isFinite(width) ? width : DEFAULT_GRAPH_WIDTH,\n height: Number.isFinite(height) ? height : DEFAULT_GRAPH_HEIGHT\n };\n }\n\n return {\n width: DEFAULT_GRAPH_WIDTH,\n height: DEFAULT_GRAPH_HEIGHT\n };\n }\n}\n"]}

package/lib/components/FlowModeller/Utils/addNodeUtils.d.ts CHANGED Viewed

@@ -1,16 +1,17 @@
-import { AddNodeHandlerParams, RendererConnectorProps, RendererNodeProps } from '../Renderer/Renderer.types';
+import { AddNodeHandlerParams } from '../Renderer/Renderer.types';
 import { ConnectorProps, DirectedGraph, GraphData, Node } from '../Renderer/Utils/Graph';
-export interface PlaceHolderNode extends RendererNodeProps {
+import { PlottedGraphNode, PlottedGraphConnector } from '../Renderer/Utils/GraphLayout';
+export interface PlaceHolderNode extends PlottedGraphNode {
     realConnectors: string[];
 }
-export interface PlaceHolderConnector extends RendererConnectorProps {
+export interface PlaceHolderConnector extends PlottedGraphConnector {
     realConnectors: string[];
 }
 export declare const isPlaceHolderNode: (node: PlaceHolderNode | Node) => node is PlaceHolderNode;
 export declare const isPlaceHolderConnector: (connector: PlaceHolderConnector | ConnectorProps) => connector is PlaceHolderConnector;
 declare const PlaceHolderHelper: {
-    insertAtConnectorsMerge: (graph: DirectedGraph, getNewPHNodeCB: (addNodeMeta: AddNodeHandlerParams) => RendererNodeProps, getNewPHConnectorCB: (fromNode: string, toNode: string, addNodeMeta: AddNodeHandlerParams) => RendererConnectorProps) => void;
-    injectPlaceholderNodes: (graphData: GraphData<RendererNodeProps, RendererConnectorProps>, onGetNewNode: (metaData: AddNodeHandlerParams) => RendererNodeProps, onGetNewConnector: (fromNodeId: string, toNodeId: string, metaData: AddNodeHandlerParams) => RendererConnectorProps) => GraphData<RendererNodeProps, RendererConnectorProps>;
+    insertAtConnectorsMerge: (graph: DirectedGraph, getNewPHNodeCB: (addNodeMeta: AddNodeHandlerParams) => PlottedGraphNode, getNewPHConnectorCB: (fromNode: string, toNode: string, addNodeMeta: AddNodeHandlerParams) => PlottedGraphConnector) => void;
+    injectPlaceholderNodes: (graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>, onGetNewNode: (metaData: AddNodeHandlerParams) => PlottedGraphNode, onGetNewConnector: (fromNodeId: string, toNodeId: string, metaData: AddNodeHandlerParams) => PlottedGraphConnector) => GraphData<PlottedGraphNode<any>, PlottedGraphConnector<any>>;
 };
 export default PlaceHolderHelper;
 //# sourceMappingURL=addNodeUtils.d.ts.map

package/lib/components/FlowModeller/Utils/addNodeUtils.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"addNodeUtils.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/addNodeUtils.ts"],"names":[],"mappings":"AAGA,OAAO,~~EACL~~,oBAAoB,~~EACpB~~,~~sBAAsB,EACtB,iBAAiB,EAClB,~~MAAM,4BAA4B,CAAC;~~AACpC~~,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;~~AAGzF~~,MAAM,WAAW,eAAgB,SAAQ,~~iBAAiB~~;~~IACxD~~,cAAc,EAAE,MAAM,EAAE,CAAC;CAC1B;AACD,MAAM,WAAW,oBAAqB,SAAQ,~~sBAAsB~~;~~IAClE~~,cAAc,EAAE,MAAM,EAAE,CAAC;CAC1B;AAGD,eAAO,MAAM,iBAAiB,SAAU,eAAe,GAAG,IAAI,4BAE7D,CAAC;AAGF,eAAO,MAAM,sBAAsB,cACtB,oBAAoB,GAAG,cAAc,sCAGjD,CAAC;AAEF,QAAA,MAAM,iBAAiB;qCAEZ,aAAa,gCACU,oBAAoB,KAAK,~~iBAAiB~~,~~kCAE5D~~,MAAM,UACR,MAAM,eACD,oBAAoB,KAC9B,~~sBAAsB~~;~~wCAgEhB~~,UAAU,~~iBAAiB~~,EAAE,~~sBAAsB~~,CAAC,~~2BACtC~~,oBAAoB,KAAK,~~iBAAiB~~,~~kCAErD~~,MAAM,YACR,MAAM,YACN,oBAAoB,KAC3B,~~sBAAsB~~;~~CA8D9B~~,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"addNodeUtils.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/addNodeUtils.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACzF,OAAO,EAAE,gBAAgB,EAAE,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AAGxF,MAAM,WAAW,eAAgB,SAAQ,gBAAgB;IACvD,cAAc,EAAE,MAAM,EAAE,CAAC;CAC1B;AACD,MAAM,WAAW,oBAAqB,SAAQ,qBAAqB;IACjE,cAAc,EAAE,MAAM,EAAE,CAAC;CAC1B;AAGD,eAAO,MAAM,iBAAiB,SAAU,eAAe,GAAG,IAAI,4BAE7D,CAAC;AAGF,eAAO,MAAM,sBAAsB,cACtB,oBAAoB,GAAG,cAAc,sCAGjD,CAAC;AAEF,QAAA,MAAM,iBAAiB;qCAEZ,aAAa,gCACU,oBAAoB,KAAK,gBAAgB,kCAE3D,MAAM,UACR,MAAM,eACD,oBAAoB,KAC9B,qBAAqB;wCAgEf,UAAU,gBAAgB,EAAE,qBAAqB,CAAC,2BACpC,oBAAoB,KAAK,gBAAgB,kCAEpD,MAAM,YACR,MAAM,YACN,oBAAoB,KAC3B,qBAAqB;CA8D7B,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/FlowModeller/Utils/addNodeUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"addNodeUtils.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/addNodeUtils.ts"],"names":[],"mappings":"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","sourcesContent":["import { OmitStrict } from '@pega/cosmos-react-core';\n\nimport { AddNodeProps } from '../AddNode';\nimport {\n AddNodeHandlerParams,\n RendererConnectorProps,\n RendererNodeProps\n} from '../Renderer/Renderer.types';\nimport { ConnectorProps, DirectedGraph, GraphData, Node } from '../Renderer/Utils/Graph';\nimport GraphTraversal from '../Renderer/Utils/GraphTraversal';\n\nexport interface PlaceHolderNode extends RendererNodeProps {\n realConnectors: string[];\n}\nexport interface PlaceHolderConnector extends RendererConnectorProps {\n realConnectors: string[];\n}\n\n// type-guard PlaceHolderNode\nexport const isPlaceHolderNode = (node: PlaceHolderNode \| Node): node is PlaceHolderNode => {\n return (node as PlaceHolderNode).realConnectors !== undefined;\n};\n\n// type-guard PlaceHolderConnector\nexport const isPlaceHolderConnector = (\n connector: PlaceHolderConnector \| ConnectorProps\n): connector is PlaceHolderConnector => {\n return (connector as PlaceHolderConnector).realConnectors !== undefined;\n};\n\nconst PlaceHolderHelper = {\n insertAtConnectorsMerge: (\n graph: DirectedGraph,\n getNewPHNodeCB: (addNodeMeta: AddNodeHandlerParams) => RendererNodeProps,\n getNewPHConnectorCB: (\n fromNode: string,\n toNode: string,\n addNodeMeta: AddNodeHandlerParams\n ) => RendererConnectorProps\n ) => {\n const gd = graph.getGraphData();\n\n // process the graph and find the first node automatically. We can find it easily by iterating and finding the node with no in-connectors\n const bfs = GraphTraversal.bfs(gd);\n bfs.reverse().forEach(nodeId => {\n const node = graph.getNode(nodeId);\n\n // get the node's convergence data\n const result = GraphTraversal.getConvergenceData(graph.getGraphData(), node.id);\n\n // if node has more than one out-connector and has convergence data\n if (result !== false) {\n // iterate over the resultant connectors\n for (let i = 0; i < result.connectors.length; i += 1) {\n const connectorsToUpdate = result.connectors[i];\n\n if (typeof connectorsToUpdate !== 'string' && connectorsToUpdate.length > 1) {\n let refConnectorIdsArray: string[] = [];\n\n connectorsToUpdate.forEach(itrConId => {\n let conId = itrConId;\n if (Array.isArray(conId)) {\n conId = itrConId[0] as string;\n }\n\n const connector = graph.getConnector(conId);\n if (isPlaceHolderConnector(connector)) {\n refConnectorIdsArray = [...refConnectorIdsArray, ...connector.realConnectors];\n } else {\n refConnectorIdsArray.push(conId);\n }\n });\n\n const addNodeMeta: AddNodeHandlerParams = {\n refType: 'connector',\n refId: refConnectorIdsArray\n };\n const newNode = getNewPHNodeCB(addNodeMeta);\n const newPNode: PlaceHolderNode = {\n ...newNode,\n realConnectors: refConnectorIdsArray\n };\n graph.addNode(newPNode);\n\n connectorsToUpdate.forEach(item => {\n graph.setConnector(item as string, {\n toNodeId: newNode.id\n });\n });\n\n const newConnector = getNewPHConnectorCB(newNode.id, result.nodeId, addNodeMeta);\n const newPConnector: PlaceHolderConnector = {\n ...newConnector,\n realConnectors: refConnectorIdsArray\n };\n graph.addConnector(newPConnector);\n }\n }\n }\n });\n },\n injectPlaceholderNodes: (\n graphData: GraphData<RendererNodeProps, RendererConnectorProps>,\n onGetNewNode: (metaData: AddNodeHandlerParams) => RendererNodeProps,\n onGetNewConnector: (\n fromNodeId: string,\n toNodeId: string,\n metaData: AddNodeHandlerParams\n ) => RendererConnectorProps\n ) => {\n // gets GraphData<RendererNodeProps, RendererConnectorProps>\n const targetGraph = new DirectedGraph(graphData);\n\n // insert placeholder-nodes at connector convergence point for nodes with multiple out connectors.\n PlaceHolderHelper.insertAtConnectorsMerge(targetGraph, onGetNewNode, onGetNewConnector);\n\n // iterate all nodes with more than one in-connectors and insert addNode before current one.\n targetGraph.getNodes().forEach(node => {\n // should not add a node before a placeholder node\n if (isPlaceHolderNode(node)) {\n return;\n }\n\n if (targetGraph.getPrevNodesCount(node.id) > 1) {\n let refConnectorIdsArray: string[] = [];\n\n // connect all in-connectors to a new node and create a new connector that connects from new node to the actual toNodeId.\n targetGraph.getInConnectors(node.id).forEach(con => {\n const connector = targetGraph.getConnector(con.id);\n if (isPlaceHolderConnector(connector)) {\n refConnectorIdsArray = [...refConnectorIdsArray, ...connector.realConnectors];\n } else {\n refConnectorIdsArray.push(con.id);\n }\n });\n\n const metaData: AddNodeHandlerParams = {\n refType: 'connector',\n refId: refConnectorIdsArray\n };\n\n // create a new placeholder node\n const newNode: OmitStrict<AddNodeProps, 'highlight' \| 'addNodeHandler'> =\n onGetNewNode(metaData);\n const placeHolderNode: PlaceHolderNode = {\n ...newNode,\n realConnectors: refConnectorIdsArray\n };\n\n targetGraph.addNode(placeHolderNode);\n\n // connect all in-connectors to a new node and create a new connector that connects from new node to the actual toNodeId.\n targetGraph.getInConnectors(node.id).forEach(con => {\n targetGraph.setConnector(con.id, {\n toNodeId: placeHolderNode.id\n });\n });\n\n const newConnector = onGetNewConnector(placeHolderNode.id, node.id, metaData);\n const placeholderConnector: PlaceHolderConnector = {\n ...newConnector,\n realConnectors: refConnectorIdsArray\n };\n\n targetGraph.addConnector(placeholderConnector);\n }\n });\n\n return targetGraph.getGraphData();\n }\n};\n\nexport default PlaceHolderHelper;\n"]}
1	+ {"version":3,"file":"addNodeUtils.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/addNodeUtils.ts"],"names":[],"mappings":"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","sourcesContent":["import { OmitStrict } from '@pega/cosmos-react-core';\n\nimport { AddNodeProps } from '../AddNode';\nimport { AddNodeHandlerParams } from '../Renderer/Renderer.types';\nimport { ConnectorProps, DirectedGraph, GraphData, Node } from '../Renderer/Utils/Graph';\nimport { PlottedGraphNode, PlottedGraphConnector } from '../Renderer/Utils/GraphLayout';\nimport GraphTraversal from '../Renderer/Utils/GraphTraversal';\n\nexport interface PlaceHolderNode extends PlottedGraphNode {\n realConnectors: string[];\n}\nexport interface PlaceHolderConnector extends PlottedGraphConnector {\n realConnectors: string[];\n}\n\n// type-guard PlaceHolderNode\nexport const isPlaceHolderNode = (node: PlaceHolderNode \| Node): node is PlaceHolderNode => {\n return (node as PlaceHolderNode).realConnectors !== undefined;\n};\n\n// type-guard PlaceHolderConnector\nexport const isPlaceHolderConnector = (\n connector: PlaceHolderConnector \| ConnectorProps\n): connector is PlaceHolderConnector => {\n return (connector as PlaceHolderConnector).realConnectors !== undefined;\n};\n\nconst PlaceHolderHelper = {\n insertAtConnectorsMerge: (\n graph: DirectedGraph,\n getNewPHNodeCB: (addNodeMeta: AddNodeHandlerParams) => PlottedGraphNode,\n getNewPHConnectorCB: (\n fromNode: string,\n toNode: string,\n addNodeMeta: AddNodeHandlerParams\n ) => PlottedGraphConnector\n ) => {\n const gd = graph.getGraphData();\n\n // process the graph and find the first node automatically. We can find it easily by iterating and finding the node with no in-connectors\n const bfs = GraphTraversal.bfs(gd);\n bfs.reverse().forEach(nodeId => {\n const node = graph.getNode(nodeId);\n\n // get the node's convergence data\n const result = GraphTraversal.getConvergenceData(graph.getGraphData(), node.id);\n\n // if node has more than one out-connector and has convergence data\n if (result !== false) {\n // iterate over the resultant connectors\n for (let i = 0; i < result.connectors.length; i += 1) {\n const connectorsToUpdate = result.connectors[i];\n\n if (typeof connectorsToUpdate !== 'string' && connectorsToUpdate.length > 1) {\n let refConnectorIdsArray: string[] = [];\n\n connectorsToUpdate.forEach(itrConId => {\n let conId = itrConId;\n if (Array.isArray(conId)) {\n conId = itrConId[0] as string;\n }\n\n const connector = graph.getConnector(conId);\n if (isPlaceHolderConnector(connector)) {\n refConnectorIdsArray = [...refConnectorIdsArray, ...connector.realConnectors];\n } else {\n refConnectorIdsArray.push(conId);\n }\n });\n\n const addNodeMeta: AddNodeHandlerParams = {\n refType: 'connector',\n refId: refConnectorIdsArray\n };\n const newNode = getNewPHNodeCB(addNodeMeta);\n const newPNode: PlaceHolderNode = {\n ...newNode,\n realConnectors: refConnectorIdsArray\n };\n graph.addNode(newPNode);\n\n connectorsToUpdate.forEach(item => {\n graph.setConnector(item as string, {\n toNodeId: newNode.id\n });\n });\n\n const newConnector = getNewPHConnectorCB(newNode.id, result.nodeId, addNodeMeta);\n const newPConnector: PlaceHolderConnector = {\n ...newConnector,\n realConnectors: refConnectorIdsArray\n };\n graph.addConnector(newPConnector);\n }\n }\n }\n });\n },\n injectPlaceholderNodes: (\n graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>,\n onGetNewNode: (metaData: AddNodeHandlerParams) => PlottedGraphNode,\n onGetNewConnector: (\n fromNodeId: string,\n toNodeId: string,\n metaData: AddNodeHandlerParams\n ) => PlottedGraphConnector\n ) => {\n // gets GraphData<RendererNodeProps, RendererConnectorProps>\n const targetGraph = new DirectedGraph(graphData);\n\n // insert placeholder-nodes at connector convergence point for nodes with multiple out connectors.\n PlaceHolderHelper.insertAtConnectorsMerge(targetGraph, onGetNewNode, onGetNewConnector);\n\n // iterate all nodes with more than one in-connectors and insert addNode before current one.\n targetGraph.getNodes().forEach(node => {\n // should not add a node before a placeholder node\n if (isPlaceHolderNode(node)) {\n return;\n }\n\n if (targetGraph.getPrevNodesCount(node.id) > 1) {\n let refConnectorIdsArray: string[] = [];\n\n // connect all in-connectors to a new node and create a new connector that connects from new node to the actual toNodeId.\n targetGraph.getInConnectors(node.id).forEach(con => {\n const connector = targetGraph.getConnector(con.id);\n if (isPlaceHolderConnector(connector)) {\n refConnectorIdsArray = [...refConnectorIdsArray, ...connector.realConnectors];\n } else {\n refConnectorIdsArray.push(con.id);\n }\n });\n\n const metaData: AddNodeHandlerParams = {\n refType: 'connector',\n refId: refConnectorIdsArray\n };\n\n // create a new placeholder node\n const newNode: OmitStrict<AddNodeProps, 'highlight' \| 'addNodeHandler'> =\n onGetNewNode(metaData);\n const placeHolderNode: PlaceHolderNode = {\n ...newNode,\n realConnectors: refConnectorIdsArray\n };\n\n targetGraph.addNode(placeHolderNode);\n\n // connect all in-connectors to a new node and create a new connector that connects from new node to the actual toNodeId.\n targetGraph.getInConnectors(node.id).forEach(con => {\n targetGraph.setConnector(con.id, {\n toNodeId: placeHolderNode.id\n });\n });\n\n const newConnector = onGetNewConnector(placeHolderNode.id, node.id, metaData);\n const placeholderConnector: PlaceHolderConnector = {\n ...newConnector,\n realConnectors: refConnectorIdsArray\n };\n\n targetGraph.addConnector(placeholderConnector);\n }\n });\n\n return targetGraph.getGraphData();\n }\n};\n\nexport default PlaceHolderHelper;\n"]}

package/lib/components/FlowModeller/Utils/deleteNodeUtils.d.ts CHANGED Viewed

@@ -12,7 +12,7 @@ export interface DeleteNodeModalOption {
 export interface DeleteNodeModalResult {
     options: DeleteNodeModalOption[];
     selectedNodeId: string;
-    destinationNodeId: string;
+    destinationNodeId?: string;
     allItems: GraphDataAsMap;
 }
 export interface DeleteNodeOutcome {
@@ -23,7 +23,7 @@ export interface DeleteNodeOutcome {
     deletes: GraphDataAsMap;
 }
 declare const deleteNodeUtils: {
-    getDeleteNodeOptions: (graph: DirectedGraph, nodeId: string) => DeleteNodeModalResult | undefined;
+    getDeleteNodeOptions: (graph: DirectedGraph, nodeId: string) => DeleteNodeModalResult;
 };
 export default deleteNodeUtils;
 //# sourceMappingURL=deleteNodeUtils.d.ts.map

package/lib/components/FlowModeller/Utils/deleteNodeUtils.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"deleteNodeUtils.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/deleteNodeUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGzF,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;CAC5C;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,EAAE,cAAc,CAAC;IAC1B,SAAS,EAAE,cAAc,CAAC;IAC1B,SAAS,EAAE,cAAc,CAAC;CAC3B;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,qBAAqB,EAAE,CAAC;IACjC,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,EAAE,MAAM,CAAC;~~IAC1B~~,QAAQ,EAAE,cAAc,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,OAAO,CAAC,EAAE;QACR,UAAU,EAAE,cAAc,EAAE,CAAC;KAC9B,CAAC;IACF,OAAO,EAAE,cAAc,CAAC;CACzB;AAED,QAAA,MAAM,eAAe;~~kCAEV~~,aAAa,~~UACZ~~,MAAM,~~KACb~~,qBAAqB~~,GAAG,SAAS~~;~~CAiFrC~~,CAAC;AAEF,eAAe,eAAe,CAAC"}
1	+ {"version":3,"file":"deleteNodeUtils.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/deleteNodeUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,IAAI,EAAE,cAAc,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAGzF,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC;CAC5C;AAED,MAAM,WAAW,qBAAqB;IACpC,SAAS,EAAE,cAAc,CAAC;IAC1B,SAAS,EAAE,cAAc,CAAC;IAC1B,SAAS,EAAE,cAAc,CAAC;CAC3B;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,qBAAqB,EAAE,CAAC;IACjC,cAAc,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,QAAQ,EAAE,cAAc,CAAC;CAC1B;AAED,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,OAAO,CAAC,EAAE;QACR,UAAU,EAAE,cAAc,EAAE,CAAC;KAC9B,CAAC;IACF,OAAO,EAAE,cAAc,CAAC;CACzB;AAED,QAAA,MAAM,eAAe;kCACW,aAAa,UAAU,MAAM,KAAG,qBAAqB;CA0FpF,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/lib/components/FlowModeller/Utils/deleteNodeUtils.js CHANGED Viewed

@@ -62,9 +62,19 @@ const deleteNodeUtils = {
                 }
             };
             // ignore the destination node
-            delete result.allItems.nodes[convergenceData.nodeId];
+            if (result.allItems)
+                delete result.allItems.nodes[convergenceData.nodeId];
             return result;
         }
+        return {
+            options: [],
+            selectedNodeId: nodeId,
+            destinationNodeId: undefined,
+            allItems: {
+                nodes: {},
+                connectors: {}
+            }
+        };
     }
 };
 export default deleteNodeUtils;