npm - @pega/cosmos-react-build - Versions diffs - 3.0.0-dev.15.0 → 3.0.0-dev.16.0 - Mend

@pega/cosmos-react-build 3.0.0-dev.15.0 → 3.0.0-dev.16.0

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 (55) hide show

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;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"deleteNodeUtils.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/deleteNodeUtils.ts"],"names":[],"mappings":"AAEA,OAAO,cAAmC,MAAM,kCAAkC,CAAC;AA4BnF,MAAM,eAAe,GAAG;IACtB,oBAAoB,EAAE,~~CACpB~~,KAAoB,~~EACpB~~,MAAc,~~EACqB~~,EAAE;~~QACrC~~,MAAM,eAAe,GACnB,cAAc,CAAC,kBAAkB,CAAC,KAAK,CAAC,YAAY,EAAE,EAAE,MAAM,CAAC,CAAC;QAElE,IAAI,eAAe,IAAI,eAAe,CAAC,KAAK,EAAE;YAC5C,MAAM,OAAO,GAAG,eAAe,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;gBAC/C,IACE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC;oBACnB,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;oBACvB,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,QAAQ,EACzC;oBACA,IAAI,KAAK,GAA4B,EAAE,CAAC;oBACxC,IAAI,UAAU,GAAiC,EAAE,CAAC;oBAElD,4BAA4B;oBAC5B,MAAM,SAAS,GAAG;wBAChB,KAAK,EAAE;4BACL,GAAG,eAAe,CAAC,OAAO,CAAC,aAAa;yBACzC;wBACD,UAAU,EAAE;4BACV,GAAG,eAAe,CAAC,OAAO,CAAC,kBAAkB;yBAC9C;qBACF,CAAC;oBAEF,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;wBAClB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;4BACxB,KAAK,GAAG;gCACN,GAAG,KAAK;gCACR,GAAG,IAAI,CAAC,OAAO,CAAC,aAAa;6BAC9B,CAAC;4BAEF,OAAO,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;4BAErC,4CAA4C;4BAC5C,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gCAC9B,OAAO,SAAS,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;4BAC7B,CAAC,CAAC,CAAC;4BAEH,UAAU,GAAG;gCACX,GAAG,UAAU;gCACb,GAAG,IAAI,CAAC,OAAO,CAAC,kBAAkB;6BACnC,CAAC;4BAEF,iDAAiD;4BACjD,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE;gCACnC,OAAO,SAAS,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;4BAClC,CAAC,CAAC,CAAC;yBACJ;oBACH,CAAC,CAAC,CAAC;oBAEH,8BAA8B;oBAC9B,OAAO,SAAS,CAAC,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;oBAE/C,OAAO;wBACL,SAAS,EAAE,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;wBACpD,SAAS,EAAE;4BACT,KAAK;4BACL,UAAU;yBACX;wBACD,SAAS;qBACV,CAAC;iBACH;gBACD,OAAO,EAAE,CAAC;YACZ,CAAC,CAAC,CAAC;YAEH,MAAM,MAAM,~~GAAG~~;~~gBACb~~,OAAO,EAAE,OAAkC;gBAC3C,cAAc,EAAE,MAAM;gBACtB,iBAAiB,EAAE,eAAe,CAAC,MAAM;gBACzC,QAAQ,EAAE;oBACR,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,aAAa;oBAC5C,UAAU,EAAE,eAAe,CAAC,OAAO,CAAC,kBAAkB;iBACvD;aACF,CAAC;YAEF,8BAA8B;YAC9B,OAAO,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,eAAe,CAAC,MAAM,CAAC,CAAC;~~YAErD~~,OAAO,~~MAA+B~~,CAAC;~~SACxC~~;~~IACH~~,CAAC;CACF,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import { NodeProps } from '../Node/Node.types';\nimport { Node, ConnectorProps, DirectedGraph, GraphData } from '../Renderer/Utils/Graph';\nimport GraphTraversal, { ConvergenceData } from '../Renderer/Utils/GraphTraversal';\n\nexport interface GraphDataAsMap {\n nodes: Record<string, Node>;\n connectors: Record<string, ConnectorProps>;\n}\n\nexport interface DeleteNodeModalOption {\n connector: ConnectorProps;\n pathItems: GraphDataAsMap;\n restItems: GraphDataAsMap;\n}\n\nexport interface DeleteNodeModalResult {\n options: DeleteNodeModalOption[];\n selectedNodeId: string;\n destinationNodeId: string;\n allItems: GraphDataAsMap;\n}\n\nexport interface DeleteNodeOutcome {\n graphData: GraphData<NodeProps, ConnectorProps>;\n updates?: {\n connectors: ConnectorProps[];\n };\n deletes: GraphDataAsMap;\n}\n\nconst deleteNodeUtils = {\n getDeleteNodeOptions: (\n graph: DirectedGraph~~,\n~~ nodeId: string\n ): DeleteNodeModalResult ~~\| undefined~~ => {\n const convergenceData: ConvergenceData<Node, ConnectorProps> \| false =\n GraphTraversal.getConvergenceData(graph.getGraphData(), nodeId);\n\n if (convergenceData && convergenceData.paths) {\n const options = convergenceData.paths.map(path => {\n if (\n Array.isArray(path) &&\n !Array.isArray(path[0]) &&\n typeof path[0].connectors[0] === 'string'\n ) {\n let nodes: GraphDataAsMap['nodes'] = {};\n let connectors: GraphDataAsMap['connectors'] = {};\n\n // rest of the overall items\n const restItems = {\n nodes: {\n ...convergenceData.summary.nodesinvolved\n },\n connectors: {\n ...convergenceData.summary.connectorsInvolved\n }\n };\n\n path.forEach(item => {\n if (!Array.isArray(item)) {\n nodes = {\n ...nodes,\n ...item.summary.nodesinvolved\n };\n\n delete nodes[convergenceData.nodeId];\n\n // remove the above nodes from the restItems\n Object.keys(nodes).forEach(id => {\n delete restItems.nodes[id];\n });\n\n connectors = {\n ...connectors,\n ...item.summary.connectorsInvolved\n };\n\n // remove the above connectors from the restItems\n Object.keys(connectors).forEach(id => {\n delete restItems.connectors[id];\n });\n }\n });\n\n // ignore the destination node\n delete restItems.nodes[convergenceData.nodeId];\n\n return {\n connector: graph.getConnector(path[0].connectors[0]),\n pathItems: {\n nodes,\n connectors\n },\n restItems\n };\n }\n return [];\n });\n\n const result = {\n options: options as DeleteNodeModalOption[],\n selectedNodeId: nodeId,\n destinationNodeId: convergenceData.nodeId,\n allItems: {\n nodes: convergenceData.summary.nodesinvolved,\n connectors: convergenceData.summary.connectorsInvolved\n }\n };\n\n // ignore the destination node\n delete result.allItems.nodes[convergenceData.nodeId];\n\n return result ~~as DeleteNodeModalResult~~;\n }\n }\n};\n\nexport default deleteNodeUtils;\n"]}
1	+ {"version":3,"file":"deleteNodeUtils.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Utils/deleteNodeUtils.ts"],"names":[],"mappings":"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","sourcesContent":["import { NodeProps } from '../Node/Node.types';\nimport { Node, ConnectorProps, DirectedGraph, GraphData } from '../Renderer/Utils/Graph';\nimport GraphTraversal, { ConvergenceData } from '../Renderer/Utils/GraphTraversal';\n\nexport interface GraphDataAsMap {\n nodes: Record<string, Node>;\n connectors: Record<string, ConnectorProps>;\n}\n\nexport interface DeleteNodeModalOption {\n connector: ConnectorProps;\n pathItems: GraphDataAsMap;\n restItems: GraphDataAsMap;\n}\n\nexport interface DeleteNodeModalResult {\n options: DeleteNodeModalOption[];\n selectedNodeId: string;\n destinationNodeId?: string;\n allItems: GraphDataAsMap;\n}\n\nexport interface DeleteNodeOutcome {\n graphData: GraphData<NodeProps, ConnectorProps>;\n updates?: {\n connectors: ConnectorProps[];\n };\n deletes: GraphDataAsMap;\n}\n\nconst deleteNodeUtils = {\n getDeleteNodeOptions: (graph: DirectedGraph, nodeId: string): DeleteNodeModalResult => {\n const convergenceData: ConvergenceData<Node, ConnectorProps> \| false =\n GraphTraversal.getConvergenceData(graph.getGraphData(), nodeId);\n\n if (convergenceData && convergenceData.paths) {\n const options = convergenceData.paths.map(path => {\n if (\n Array.isArray(path) &&\n !Array.isArray(path[0]) &&\n typeof path[0].connectors[0] === 'string'\n ) {\n let nodes: GraphDataAsMap['nodes'] = {};\n let connectors: GraphDataAsMap['connectors'] = {};\n\n // rest of the overall items\n const restItems = {\n nodes: {\n ...convergenceData.summary.nodesinvolved\n },\n connectors: {\n ...convergenceData.summary.connectorsInvolved\n }\n };\n\n path.forEach(item => {\n if (!Array.isArray(item)) {\n nodes = {\n ...nodes,\n ...item.summary.nodesinvolved\n };\n\n delete nodes[convergenceData.nodeId];\n\n // remove the above nodes from the restItems\n Object.keys(nodes).forEach(id => {\n delete restItems.nodes[id];\n });\n\n connectors = {\n ...connectors,\n ...item.summary.connectorsInvolved\n };\n\n // remove the above connectors from the restItems\n Object.keys(connectors).forEach(id => {\n delete restItems.connectors[id];\n });\n }\n });\n\n // ignore the destination node\n delete restItems.nodes[convergenceData.nodeId];\n\n return {\n connector: graph.getConnector(path[0].connectors[0]),\n pathItems: {\n nodes,\n connectors\n },\n restItems\n };\n }\n return [];\n });\n\n const result: DeleteNodeModalResult = {\n options: options as DeleteNodeModalOption[],\n selectedNodeId: nodeId,\n destinationNodeId: convergenceData.nodeId,\n allItems: {\n nodes: convergenceData.summary.nodesinvolved,\n connectors: convergenceData.summary.connectorsInvolved\n }\n };\n\n // ignore the destination node\n if (result.allItems) delete result.allItems.nodes[convergenceData.nodeId];\n\n return result;\n }\n return {\n options: [],\n selectedNodeId: nodeId,\n destinationNodeId: undefined,\n allItems: {\n nodes: {},\n connectors: {}\n }\n };\n }\n};\n\nexport default deleteNodeUtils;\n"]}

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

@@ -14,9 +14,18 @@ declare const helpers: {
     addConnector(graphData: GraphData<NodeProps, ConnectorProps>, nodeId: string, label?: string | undefined, getNewConnector?: AddHelperParams['getNewConnector']): {
         graphData: GraphData<NodeProps, ConnectorProps<unknown>>;
         connector: ConnectorProps<unknown>;
+    } | {
+        graphData: {
+            nodes: never[];
+            connectors: never[];
+        };
+        connector: {};
     };
     deleteConnector: (graphData: GraphData<NodeProps, ConnectorProps>, connector: ConnectorProps) => DeleteNodeOutcome;
-    addNode: ({ graphData, nodeType, metaData, getNewNode, getNewConnector, connectorsCount }: AddHelperParams) => GraphData<NodeProps, ConnectorProps<unknown>>;
+    addNode: ({ graphData, nodeType, metaData, getNewNode, getNewConnector, connectorsCount }: AddHelperParams) => {
+        graphData: GraphData<NodeProps, ConnectorProps<unknown>>;
+        node: NodeProps;
+    };
     deleteNode(graphData: GraphData<NodeProps, ConnectorProps>, nodeId: string): DeleteNodeOutcome | false;
 };
 export default helpers;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/helper.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAExD,OAAwB,EAAE,iBAAiB,EAAkB,MAAM,yBAAyB,CAAC;AAE7F,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,SAAS,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,cAAc,CAAC;CAC5E;AAED,QAAA,MAAM,OAAO;4BAEE,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,gDAEI,eAAe,CAAC,iBAAiB,CAAC~~;;;;iCA2BzB~~,UAAU,SAAS,EAAE,cAAc,CAAC,aAAa,cAAc;+~~FAiDzF~~,eAAe~~;0BAgEL~~,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,GACb,iBAAiB,GAAG,KAAK;~~CAwC7B~~,CAAC;AAEF,eAAe,OAAO,CAAC"}
1	+ {"version":3,"file":"helper.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/helper.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,SAAS,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAClF,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAExD,OAAwB,EAAE,iBAAiB,EAAkB,MAAM,yBAAyB,CAAC;AAE7F,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,SAAS,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC;IAChD,QAAQ,EAAE,oBAAoB,CAAC;IAC/B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,MAAM,SAAS,CAAC;IAC7B,eAAe,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,KAAK,cAAc,CAAC;CAC5E;AAED,QAAA,MAAM,OAAO;4BAEE,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,gDAEI,eAAe,CAAC,iBAAiB,CAAC;;;;;;;;;;iCA4BzB,UAAU,SAAS,EAAE,cAAc,CAAC,aAAa,cAAc;+FAkCzF,eAAe;;;;0BA8DL,UAAU,SAAS,EAAE,cAAc,CAAC,UACvC,MAAM,GACb,iBAAiB,GAAG,KAAK;CAuC7B,CAAC;AAEF,eAAe,OAAO,CAAC"}

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

@@ -5,59 +5,44 @@ import deleteNodeUtils from './Utils/deleteNodeUtils';
 const helpers = {
     addConnector(graphData, nodeId, label, getNewConnector) {
         const graph = new DirectedGraph(graphData);
-        const convergeData = GraphTraversal.getConvergenceData(graphData, nodeId);
-        let newConnector;
-        if (convergeData) {
-            newConnector = getNewConnector
-                ? getNewConnector(nodeId, convergeData.nodeId)
+        const convergenceData = GraphTraversal.getConvergenceData(graphData, nodeId);
+        const outConnectors = graph.getOutConnectors(nodeId);
+        const convergenceNodeId = convergenceData ? convergenceData.nodeId : undefined;
+        const targetNodeId = outConnectors.length < 2 ? outConnectors[0].toNodeId : convergenceNodeId;
+        if (targetNodeId) {
+            const newConnector = getNewConnector
+                ? getNewConnector(nodeId, targetNodeId)
                 : {
                     id: createUID(),
                     fromNodeId: nodeId,
-                    toNodeId: convergeData.nodeId,
+                    toNodeId: targetNodeId,
                     label: label || ''
                 };
             graph.addConnector(newConnector);
+            return {
+                graphData: graph.getGraphData(),
+                connector: newConnector
+            };
         }
-        else {
-            throw new Error('Invalid node, either the node does not exist or it does not support branches');
-        }
-        return {
-            graphData: graph.getGraphData(),
-            connector: newConnector
-        };
+        return { graphData: { nodes: [], connectors: [] }, connector: {} };
     },
     deleteConnector: (graphData, connector) => {
         const nodeId = connector.fromNodeId;
         const graph = new DirectedGraph(graphData);
         const deleteOptionsResult = deleteNodeUtils.getDeleteNodeOptions(graph, nodeId);
         const deleteOptions = deleteOptionsResult.options;
-        let targetBranch = null;
         let itemsToDelete = deleteOptionsResult.allItems;
-        targetBranch = deleteOptions.find(current => {
-            if (connector.id === current.connector.id) {
-                return true;
-            }
-            return false;
-        });
+        const targetBranch = deleteOptions.find(deleteOption => connector.id === deleteOption.connector.id);
         if (targetBranch) {
             itemsToDelete = targetBranch?.pathItems;
         }
-        const resultGraphData = graph.getGraphData();
         // filter the highlighted nodes, including the selected node
-        const nodes = resultGraphData.nodes.filter(item => {
-            return itemsToDelete.nodes[item.id] === undefined;
-        });
+        const nodes = graphData.nodes.filter(item => !itemsToDelete.nodes[item.id]);
         // filter the highlighted connectors
-        const connectors = resultGraphData.connectors.filter(item => {
-            // if not in items to delete, add to list
-            if (itemsToDelete.connectors[item.id] === undefined) {
-                return true;
-            }
-            return false;
-        });
+        const connectors = graphData.connectors.filter(item => !itemsToDelete.connectors[item.id]);
         const outcome = {
             graphData: {
-                nodes: nodes,
+                nodes,
                 connectors
             },
             deletes: itemsToDelete
@@ -117,8 +102,10 @@ const helpers = {
                 };
             graph.addConnector(newConnector);
         }
-        // return the updated graphData
-        return graph.getGraphData();
+        return {
+            graphData: graph.getGraphData(),
+            node: newNode
+        };
     },
     deleteNode(graphData, nodeId) {
         const graph = new DirectedGraph(graphData);