@pega/cosmos-react-build 2.0.0-rc.5 → 2.1.2

package/lib/components/FlowModeller/NodeLibrary.js

@@ -1,7 +1,8 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
-import { Icon, Menu, menuHelpers, Popover, SearchInput, useI18n, escapeRegExp } from '@pega/cosmos-react-core';
+import { readableColor } from 'polished';
+import { Icon, Menu, menuHelpers, Popover, SearchInput, useI18n, cap, createStringMatcher } from '@pega/cosmos-react-core';
 import { StyledIcon } from './Node/NodeTemplate.styles';
 const StyledPopover = styled(Popover) `
   min-width: 40ch;
@@ -16,11 +17,9 @@ const NodeLibrary = forwardRef(({ show, target, items, onClick }, ref) => {
             searchEleRef?.current?.focus();
         }
     }, [show, searchEleRef.current]);
-    const searchRegex = useMemo(() => {
-        return new RegExp(escapeRegExp(search));
-    }, [search]);
+    const searchRegex = useMemo(() => (search ? createStringMatcher(cap(search), 'contains', '') : null), [search]);
     const itemsToRender = useMemo(() => {
-        return menuHelpers.mapTree(search
+        return menuHelpers.mapTree(searchRegex
             ? menuHelpers.flatten(items).filter(({ primary }) => {
                 return searchRegex.test(primary);
             })
@@ -32,7 +31,10 @@ const NodeLibrary = forwardRef(({ show, target, items, onClick }, ref) => {
             const nodeItem = node;
             return {
                 ...node,
-                visual: nodeItem.type ? (_jsx(StyledIcon, { id: node.id, color: nodeItem.type.color, children: _jsx(Icon, { name: nodeItem.type.icon }, void 0) }, void 0)) : undefined,
+                visual: nodeItem.type ? (_jsx(StyledIcon, { id: node.id, style: {
+                        '--bg-color': nodeItem.type.color,
+                        '--fg-color': readableColor(nodeItem.type.color)
+                    }, children: _jsx(Icon, { name: nodeItem.type.icon }, void 0) }, void 0)) : undefined,
                 count: node.items ? node.items.length : undefined,
                 secondary: node.secondary,
                 selected: selectable ? !!node.selected : undefined
@@ -43,7 +45,7 @@ const NodeLibrary = forwardRef(({ show, target, items, onClick }, ref) => {
         const selectedNode = menuHelpers.getItem(items, id);
         onClick(selectedNode);
     }, [onClick]);
-    return (_jsx(StyledPopover, { show: show, target: target, ref: ref, children: _jsx(Menu, { items: itemsToRender, onItemClick: onItemSelect, header: _jsx(SearchInput, { ref: searchEleRef, onSearchChange: setSearch, value: search, searchInputAriaLabel: t('search_nodes'), placeholder: t('search_nodes') }, void 0) }, void 0) }, void 0));
+    return (_jsx(_Fragment, { children: show && (_jsx(StyledPopover, { show: show, target: target, ref: ref, children: _jsx(Menu, { items: itemsToRender, onItemClick: onItemSelect, header: _jsx(SearchInput, { ref: searchEleRef, onSearchChange: setSearch, value: search, searchInputAriaLabel: t('search_nodes'), placeholder: t('search_nodes') }, void 0) }, void 0) }, void 0)) }, void 0));
 });
 export default NodeLibrary;
 //# sourceMappingURL=NodeLibrary.js.map

package/lib/components/FlowModeller/NodeLibrary.js.map

@@ -1 +1 @@
-{"version":3,"file":"NodeLibrary.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/NodeLibrary.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FC,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from 'react';\nimport styled from 'styled-components';\n\nimport {\n  ForwardProps,\n  Icon,\n  Menu,\n  MenuGroupProps,\n  menuHelpers,\n  MenuItemProps,\n  Popover,\n  SearchInput,\n  useI18n,\n  escapeRegExp\n} from '@pega/cosmos-react-core';\n\nimport { NodeLibraryItem } from './Node/Node.types';\nimport { StyledIcon } from './Node/NodeTemplate.styles';\n\nconst StyledPopover: typeof Popover = styled(Popover)`\n  min-width: 40ch;\n`;\n\nexport interface NodeLibraryProps {\n  show: boolean;\n  target: HTMLElement | null;\n  items: NodeLibraryItem[];\n  onClick: (libItem: NodeLibraryItem) => void;\n}\n\nconst NodeLibrary: FC<NodeLibraryProps & ForwardProps> = forwardRef(\n  (\n    { show, target, items, onClick }: PropsWithoutRef<NodeLibraryProps>,\n    ref: Ref<HTMLDivElement>\n  ) => {\n    const [search, setSearch] = useState('');\n\n    const t = useI18n();\n    const searchEleRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n      if (show) {\n        setSearch('');\n        searchEleRef?.current?.focus();\n      }\n    }, [show, searchEleRef.current]);\n\n    const searchRegex = useMemo(() => {\n      return new RegExp(escapeRegExp(search));\n    }, [search]);\n\n    const itemsToRender: (MenuItemProps | MenuGroupProps)[] = useMemo(() => {\n      return menuHelpers.mapTree(\n        search\n          ? menuHelpers.flatten(items).filter(({ primary }: MenuItemProps) => {\n              return searchRegex.test(primary);\n            })\n          : items,\n        node => {\n          let selectable = false;\n          if (!node.items) {\n            selectable = true;\n          }\n\n          const nodeItem: NodeLibraryItem = node as NodeLibraryItem;\n          return {\n            ...node,\n            visual: nodeItem.type ? (\n              <StyledIcon id={node.id} color={nodeItem.type.color}>\n                <Icon name={nodeItem.type.icon} />\n              </StyledIcon>\n            ) : undefined,\n            count: node.items ? node.items.length : undefined,\n            secondary: node.secondary,\n            selected: selectable ? !!node.selected : undefined\n          };\n        }\n      );\n    }, [items, searchRegex]);\n\n    const onItemSelect = useCallback(\n      (id: MenuItemProps['id']) => {\n        const selectedNode = menuHelpers.getItem(items, id) as NodeLibraryItem;\n        onClick(selectedNode);\n      },\n      [onClick]\n    );\n\n    return (\n      <StyledPopover show={show} target={target} ref={ref}>\n        <Menu\n          items={itemsToRender}\n          onItemClick={onItemSelect}\n          header={\n            <SearchInput\n              ref={searchEleRef}\n              onSearchChange={setSearch}\n              value={search}\n              searchInputAriaLabel={t('search_nodes')}\n              placeholder={t('search_nodes')}\n            />\n          }\n        />\n      </StyledPopover>\n    );\n  }\n);\n\nexport default NodeLibrary;\n"]}
+{"version":3,"file":"NodeLibrary.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/NodeLibrary.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  FC,\n  forwardRef,\n  PropsWithoutRef,\n  Ref,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  CSSProperties\n} from 'react';\nimport styled from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport {\n  ForwardProps,\n  Icon,\n  Menu,\n  MenuGroupProps,\n  menuHelpers,\n  MenuItemProps,\n  Popover,\n  SearchInput,\n  useI18n,\n  cap,\n  createStringMatcher\n} from '@pega/cosmos-react-core';\n\nimport { NodeLibraryItem } from './Node/Node.types';\nimport { StyledIcon } from './Node/NodeTemplate.styles';\n\nconst StyledPopover: typeof Popover = styled(Popover)`\n  min-width: 40ch;\n`;\n\nexport interface NodeLibraryProps {\n  show: boolean;\n  target: HTMLElement | null;\n  items: NodeLibraryItem[];\n  onClick: (libItem: NodeLibraryItem) => void;\n  ref?: Ref<HTMLDivElement>;\n}\n\nconst NodeLibrary: FC<NodeLibraryProps & ForwardProps> = forwardRef(\n  (\n    { show, target, items, onClick }: PropsWithoutRef<NodeLibraryProps>,\n    ref: NodeLibraryProps['ref']\n  ) => {\n    const [search, setSearch] = useState('');\n\n    const t = useI18n();\n    const searchEleRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n      if (show) {\n        setSearch('');\n        searchEleRef?.current?.focus();\n      }\n    }, [show, searchEleRef.current]);\n\n    const searchRegex = useMemo(\n      () => (search ? createStringMatcher(cap(search), 'contains', '') : null),\n      [search]\n    );\n\n    const itemsToRender: (MenuItemProps | MenuGroupProps)[] = useMemo(() => {\n      return menuHelpers.mapTree(\n        searchRegex\n          ? menuHelpers.flatten(items).filter(({ primary }: MenuItemProps) => {\n              return searchRegex.test(primary);\n            })\n          : items,\n        node => {\n          let selectable = false;\n          if (!node.items) {\n            selectable = true;\n          }\n\n          const nodeItem: NodeLibraryItem = node as NodeLibraryItem;\n          return {\n            ...node,\n            visual: nodeItem.type ? (\n              <StyledIcon\n                id={node.id}\n                style={\n                  {\n                    '--bg-color': nodeItem.type.color,\n                    '--fg-color': readableColor(nodeItem.type.color)\n                  } as CSSProperties\n                }\n              >\n                <Icon name={nodeItem.type.icon} />\n              </StyledIcon>\n            ) : undefined,\n            count: node.items ? node.items.length : undefined,\n            secondary: node.secondary,\n            selected: selectable ? !!node.selected : undefined\n          };\n        }\n      );\n    }, [items, searchRegex]);\n\n    const onItemSelect = useCallback(\n      (id: MenuItemProps['id']) => {\n        const selectedNode = menuHelpers.getItem(items, id) as NodeLibraryItem;\n        onClick(selectedNode);\n      },\n      [onClick]\n    );\n    return (\n      <>\n        {show && (\n          <StyledPopover show={show} target={target} ref={ref}>\n            <Menu\n              items={itemsToRender}\n              onItemClick={onItemSelect}\n              header={\n                <SearchInput\n                  ref={searchEleRef}\n                  onSearchChange={setSearch}\n                  value={search}\n                  searchInputAriaLabel={t('search_nodes')}\n                  placeholder={t('search_nodes')}\n                />\n              }\n            />\n          </StyledPopover>\n        )}\n      </>\n    );\n  }\n);\n\nexport default NodeLibrary;\n"]}

package/lib/components/FlowModeller/Renderer/Connectors.d.ts

@@ -0,0 +1,13 @@
+import { FC, ComponentType } from 'react';
+import { RendererConnectorProps } from './Renderer.types';
+export interface ConnectorProps {
+    items: RendererConnectorProps[];
+    dimensions: {
+        width: number;
+        height: number;
+    };
+    content?: ComponentType<RendererConnectorProps>;
+}
+declare const Connectors: FC<ConnectorProps>;
+export default Connectors;
+//# sourceMappingURL=Connectors.d.ts.map

package/lib/components/FlowModeller/Renderer/Connectors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Connectors.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Connectors.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,EAAE,sBAAsB,EAAE,MAAM,kBAAkB,CAAC;AAyD1D,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,sBAAsB,EAAE,CAAC;IAChC,UAAU,EAAE;QACV,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;IACF,OAAO,CAAC,EAAE,aAAa,CAAC,sBAAsB,CAAC,CAAC;CACjD;AACD,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,cAAc,CAqClC,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/FlowModeller/Renderer/{Connector.js → Connectors.js}

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import styled, { css } from 'styled-components';
-import { defaultThemeProp, Flex, Label, useTheme } from '@pega/cosmos-react-core';
+import styled from 'styled-components';
+import { useTheme } from '@pega/cosmos-react-core';
 const CURVE_RADIUS = 16;
 const genLine = (points) => {
     const lineStr = points
@@ -32,19 +32,16 @@ const genLine = (points) => {
         .join('');
     return `M${lineStr.substr(1)}`;
 };
-const StyledLabel = styled(Label)(({ theme }) => {
-    return css `
-    border-radius: ${theme.base['border-radius']};
-    background: ${theme.base.colors.slate.dark};
-    color: ${theme.base.colors.white};
-    text-align: center;
-    padding: calc(0.5 * ${theme.base.spacing});
-  `;
-});
-StyledLabel.defaultProps = defaultThemeProp;
-const Connector = ({ points, labelLayout }) => {
+const StyledConnectorContainer = styled.div `
+  position: absolute;
+  top: 0;
+  left: 0;
+`;
+const Connectors = ({ items, dimensions, content: Content }) => {
     const theme = useTheme();
-    return (_jsxs("g", { children: [_jsx("path", { d: genLine(points), stroke: theme.base.colors.slate.dark, strokeWidth: '1', fill: 'none' }, void 0), labelLayout?.value && (_jsx("foreignObject", { x: labelLayout.x - labelLayout.width, y: labelLayout.y + 15, width: labelLayout.width, height: labelLayout.height, children: _jsx(Flex, { container: { justify: 'center' }, children: _jsx(StyledLabel, { children: labelLayout.value }, void 0) }, void 0) }, void 0))] }, void 0));
+    return (_jsx(StyledConnectorContainer, { children: _jsx("svg", { width: dimensions.width, height: dimensions.height, xmlns: 'http://www.w3.org/2000/svg', viewBox: `0 0 ${dimensions.width} ${dimensions.height}`, children: items.map(item => {
+                return (_jsxs("g", { children: [_jsx("path", { id: item.id, d: genLine(item.points), stroke: theme.base.colors.slate.dark, strokeWidth: '1', fill: 'none' }, void 0), item.labelLayout && (_jsx("foreignObject", { x: item.labelLayout.x - item.labelLayout.width, y: item.points.length > 10 ? item.points[3].y - 15 : item.labelLayout.y - 7.5, width: item.labelLayout.width, height: item.labelLayout.height, children: Content && _jsx(Content, { ...item }, void 0) }, void 0))] }, item.id));
+            }) }, void 0) }, void 0));
 };
-export default Connector;
-//# sourceMappingURL=Connector.js.map
+export default Connectors;
+//# sourceMappingURL=Connectors.js.map

package/lib/components/FlowModeller/Renderer/Connectors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Connectors.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Connectors.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FC, ComponentType } from 'react';\nimport styled from 'styled-components';\n\nimport { useTheme } from '@pega/cosmos-react-core';\n\nimport { RendererConnectorProps } from './Renderer.types';\n\ninterface Points {\n  x: number;\n  y: number;\n}\n\nconst CURVE_RADIUS = 16;\nconst genLine = (points: Points[]) => {\n  const lineStr: string = points\n    .map((point: Points, idx: number, arr: Points[]) => {\n      const { x, y } = point;\n      const prev = arr[idx - 1];\n      const next = arr[idx + 1];\n      const line = `L${x},${y}`;\n\n      // if the point is extream end, no need to add a curve\n      if (!prev || !next) return line;\n\n      // if point is colinear with prev and next, no need to add a curve\n      if (prev.x === next.x || prev.y === next.y) return line;\n\n      if (point.x > next.x)\n        // BOTTOM-RIGHT ↲\n        return `L${x},${\n          y - CURVE_RADIUS\n        }a${CURVE_RADIUS},${CURVE_RADIUS} 0 0 1 -${CURVE_RADIUS},${CURVE_RADIUS}`;\n\n      // BOTTOM-LEFT ↳\n      if (point.x < next.x)\n        return `L${x},${\n          y - CURVE_RADIUS\n        }a${CURVE_RADIUS},${CURVE_RADIUS} 0 0 0 ${CURVE_RADIUS},${CURVE_RADIUS}`;\n\n      // TOP-LEFT ↱\n      if (point.x < prev.x)\n        return `L${\n          x + CURVE_RADIUS\n        },${y}a${CURVE_RADIUS},${CURVE_RADIUS} 0 0 0 -${CURVE_RADIUS},${CURVE_RADIUS}`;\n\n      // TOP-RIGHT ↴\n      if (point.x > prev.x)\n        return `L${\n          x - CURVE_RADIUS\n        },${y}a${CURVE_RADIUS},${CURVE_RADIUS} 0 0 1 ${CURVE_RADIUS},${CURVE_RADIUS}`;\n\n      return `L${x},${y}`;\n    })\n    .join('');\n  return `M${lineStr.substr(1)}`;\n};\n\nconst StyledConnectorContainer = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n`;\nexport interface ConnectorProps {\n  items: RendererConnectorProps[];\n  dimensions: {\n    width: number;\n    height: number;\n  };\n  content?: ComponentType<RendererConnectorProps>;\n}\nconst Connectors: FC<ConnectorProps> = ({ items, dimensions, content: Content }) => {\n  const theme = useTheme();\n\n  return (\n    <StyledConnectorContainer>\n      <svg\n        width={dimensions.width}\n        height={dimensions.height}\n        xmlns='http://www.w3.org/2000/svg'\n        viewBox={`0 0 ${dimensions.width} ${dimensions.height}`}\n      >\n        {items.map(item => {\n          return (\n            <g key={item.id}>\n              <path\n                id={item.id}\n                d={genLine(item.points)}\n                stroke={theme.base.colors.slate.dark}\n                strokeWidth='1'\n                fill='none'\n              />\n              {item.labelLayout && (\n                <foreignObject\n                  x={item.labelLayout.x - item.labelLayout.width}\n                  y={item.points.length > 10 ? item.points[3].y - 15 : item.labelLayout.y - 7.5}\n                  width={item.labelLayout.width}\n                  height={item.labelLayout.height}\n                >\n                  {Content && <Content {...item} />}\n                </foreignObject>\n              )}\n            </g>\n          );\n        })}\n      </svg>\n    </StyledConnectorContainer>\n  );\n};\n\nexport default Connectors;\n"]}

package/lib/components/FlowModeller/Renderer/Nodes.d.ts

@@ -0,0 +1,9 @@
+import { ComponentType, FC } from 'react';
+import { RendererNodeProps } from './Renderer.types';
+export interface NodesProps {
+    items: RendererNodeProps[];
+    content?: ComponentType<RendererNodeProps>;
+}
+declare const Nodes: FC<NodesProps>;
+export default Nodes;
+//# sourceMappingURL=Nodes.d.ts.map

package/lib/components/FlowModeller/Renderer/Nodes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Nodes.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Nodes.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAoBrD,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,OAAO,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CAC5C;AACD,QAAA,MAAM,KAAK,EAAE,EAAE,CAAC,UAAU,CAmBzB,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/lib/components/FlowModeller/Renderer/Nodes.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import styled, { css } from 'styled-components';
+import { Flex } from '@pega/cosmos-react-core';
+const StyledNodeWrapper = styled.div(({ dimensions, position }) => {
+    return css `
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: ${dimensions.width}px;
+    height: ${dimensions.height}px;
+    transform: translate(${position.x}px, ${position.y}px);
+  `;
+});
+const StyledNodeContainer = styled.div `
+  position: absolute;
+  top: 0;
+  left: 0;
+`;
+const Nodes = ({ items, content: Node }) => {
+    return (_jsx(StyledNodeContainer, { children: items.map(item => {
+            return (_jsx(Flex, { as: StyledNodeWrapper, id: item.id, dimensions: item.dimensions, position: item.position, container: { justify: 'center' }, children: Node && _jsx(Node, { ...item }, void 0) }, item.id));
+        }) }, void 0));
+};
+export default Nodes;
+//# sourceMappingURL=Nodes.js.map

package/lib/components/FlowModeller/Renderer/Nodes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Nodes.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Nodes.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAI/C,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAGjC,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,EAAE,EAAE;IAC9B,OAAO,GAAG,CAAA;;;;aAIC,UAAU,CAAC,KAAK;cACf,UAAU,CAAC,MAAM;2BACJ,QAAQ,CAAC,CAAC,OAAO,QAAQ,CAAC,CAAC;GACnD,CAAC;AACJ,CAAC,CAAC,CAAC;AACH,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAIrC,CAAC;AAKF,MAAM,KAAK,GAAmB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE;IACzD,OAAO,CACL,KAAC,mBAAmB,cACjB,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YAChB,OAAO,CACL,KAAC,IAAI,IAEH,EAAE,EAAE,iBAAiB,EACrB,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,YAE/B,IAAI,IAAI,KAAC,IAAI,OAAK,IAAI,WAAI,IAPtB,IAAI,CAAC,EAAE,CAQP,CACR,CAAC;QACJ,CAAC,CAAC,WACkB,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,KAAK,CAAC","sourcesContent":["import { ComponentType, FC } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex } from '@pega/cosmos-react-core';\n\nimport { RendererNodeProps } from './Renderer.types';\n\nconst StyledNodeWrapper = styled.div<{\n  dimensions: RendererNodeProps['dimensions'];\n  position: RendererNodeProps['position'];\n}>(({ dimensions, position }) => {\n  return css`\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: ${dimensions.width}px;\n    height: ${dimensions.height}px;\n    transform: translate(${position.x}px, ${position.y}px);\n  `;\n});\nconst StyledNodeContainer = styled.div`\n  position: absolute;\n  top: 0;\n  left: 0;\n`;\nexport interface NodesProps {\n  items: RendererNodeProps[];\n  content?: ComponentType<RendererNodeProps>;\n}\nconst Nodes: FC<NodesProps> = ({ items, content: Node }) => {\n  return (\n    <StyledNodeContainer>\n      {items.map(item => {\n        return (\n          <Flex\n            key={item.id}\n            as={StyledNodeWrapper}\n            id={item.id}\n            dimensions={item.dimensions}\n            position={item.position}\n            container={{ justify: 'center' }}\n          >\n            {Node && <Node {...item} />}\n          </Flex>\n        );\n      })}\n    </StyledNodeContainer>\n  );\n};\n\nexport default Nodes;\n"]}

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

@@ -1,17 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import styled from 'styled-components';
-import ConnectorsContainer from './ConnectorsContainer';
-import NodesContainer from './NodesContainer';
+import Connectors from './Connectors';
+import Nodes from './Nodes';
 import GraphLayout from './Utils/GraphLayout';
 const StyledWrapper = styled.div `
   position: relative;
   width: 100%;
   height: 100%;
 `;
-const Renderer = ({ graphData }) => {
+const Renderer = ({ graphData, connector, node }) => {
     // apply the plotted positions
     const graphDimensions = GraphLayout.plot(graphData);
-    return (_jsxs(StyledWrapper, { children: [_jsx(ConnectorsContainer, { items: graphData.connectors, dimensions: graphDimensions }, void 0), _jsx(NodesContainer, { items: graphData.nodes }, void 0)] }, void 0));
+    return (_jsxs(StyledWrapper, { children: [_jsx(Connectors, { items: graphData.connectors, content: connector, dimensions: graphDimensions }, void 0), _jsx(Nodes, { items: graphData.nodes, content: node }, void 0)] }, void 0));
 };
 export default Renderer;
 //# sourceMappingURL=Renderer.js.map

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

@@ -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,mBAAmB,MAAM,uBAAuB,CAAC;AAExD,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,WAAW,MAAM,qBAAqB,CAAC;AAE9C,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;CAI/B,CAAC;AAEF,MAAM,QAAQ,GAAsB,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE;IACpD,8BAA8B;IAC9B,MAAM,eAAe,GAAG,WAAW,CAAC,IAAI,CAA6B,SAAS,CAAC,CAAC;IAEhF,OAAO,CACL,MAAC,aAAa,eACZ,KAAC,mBAAmB,IAAC,KAAK,EAAE,SAAS,CAAC,UAAU,EAAE,UAAU,EAAE,eAAe,WAAI,EACjF,KAAC,cAAc,IAAC,KAAK,EAAE,SAAS,CAAC,KAAK,WAAI,YAC5B,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC","sourcesContent":["import { FC } from 'react';\nimport styled from 'styled-components';\n\nimport ConnectorsContainer from './ConnectorsContainer';\nimport { RendererProps } from './Renderer.types';\nimport NodesContainer from './NodesContainer';\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 }) => {\n  // apply the plotted positions\n  const graphDimensions = GraphLayout.plot<RendererProps['graphData']>(graphData);\n\n  return (\n    <StyledWrapper>\n      <ConnectorsContainer items={graphData.connectors} dimensions={graphDimensions} />\n      <NodesContainer items={graphData.nodes} />\n    </StyledWrapper>\n  );\n};\n\nexport default Renderer;\n"]}
+{"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,EAAE,EAAE;IACrE,8BAA8B;IAC9B,MAAM,eAAe,GAAG,WAAW,CAAC,IAAI,CAA6B,SAAS,CAAC,CAAC;IAEhF,OAAO,CACL,MAAC,aAAa,eACZ,KAAC,UAAU,IAAC,KAAK,EAAE,SAAS,CAAC,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,eAAe,WAAI,EAC5F,KAAC,KAAK,IAAC,KAAK,EAAE,SAAS,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,WAAI,YAClC,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 }) => {\n  // apply the plotted positions\n  const graphDimensions = GraphLayout.plot<RendererProps['graphData']>(graphData);\n\n  return (\n    <StyledWrapper>\n      <Connectors items={graphData.connectors} content={connector} dimensions={graphDimensions} />\n      <Nodes items={graphData.nodes} content={node} />\n    </StyledWrapper>\n  );\n};\n\nexport default Renderer;\n"]}

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

@@ -1,18 +1,18 @@
-import { ReactNode } from 'react';
+import { ComponentType } from 'react';
 import { GraphData } from './Utils/Graph';
 import { PlottedGraphConnector, PlottedGraphNode } from './Utils/GraphLayout';
 export interface AddNodeHandlerParams {
     refType: 'node' | 'connector';
-    refId: string;
+    refId: string | string[];
 }
 export interface RendererNodeProps extends PlottedGraphNode {
-    children: ReactNode;
 }
 export interface RendererConnectorProps extends PlottedGraphConnector {
-    children?: ReactNode;
 }
 export interface RendererProps {
     graphData: GraphData<RendererNodeProps, RendererConnectorProps>;
     disableAutoLayout?: boolean;
+    connector?: ComponentType<RendererConnectorProps>;
+    node?: ComponentType<RendererNodeProps>;
 }
 //# sourceMappingURL=Renderer.types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Renderer.types.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,qBAAqB,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE9E,MAAM,WAAW,oBAAoB;IACnC,OAAO,EAAE,MAAM,GAAG,WAAW,CAAC;IAC9B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBAAkB,SAAQ,gBAAgB;IACzD,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,WAAW,sBAAuB,SAAQ,qBAAqB;IACnE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,SAAS,CAAC,iBAAiB,EAAE,sBAAsB,CAAC,CAAC;IAChE,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC7B"}
+{"version":3,"file":"Renderer.types.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,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;CAAG;AAE9D,MAAM,WAAW,sBAAuB,SAAQ,qBAAqB;CAAG;AAExE,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,SAAS,CAAC,iBAAiB,EAAE,sBAAsB,CAAC,CAAC;IAChE,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,SAAS,CAAC,EAAE,aAAa,CAAC,sBAAsB,CAAC,CAAC;IAClD,IAAI,CAAC,EAAE,aAAa,CAAC,iBAAiB,CAAC,CAAC;CACzC"}

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

@@ -1 +1 @@
-{"version":3,"file":"Renderer.types.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ReactNode } from 'react';\n\nimport { GraphData } from './Utils/Graph';\nimport { PlottedGraphConnector, PlottedGraphNode } from './Utils/GraphLayout';\n\nexport interface AddNodeHandlerParams {\n  refType: 'node' | 'connector';\n  refId: string;\n}\n\nexport interface RendererNodeProps extends PlottedGraphNode {\n  children: ReactNode;\n}\n\nexport interface RendererConnectorProps extends PlottedGraphConnector {\n  children?: ReactNode;\n}\n\nexport interface RendererProps {\n  graphData: GraphData<RendererNodeProps, RendererConnectorProps>;\n  disableAutoLayout?: boolean;\n}\n"]}
+{"version":3,"file":"Renderer.types.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Renderer/Renderer.types.ts"],"names":[],"mappings":"","sourcesContent":["import { ComponentType } from 'react';\n\nimport { 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\nexport interface RendererConnectorProps extends PlottedGraphConnector {}\n\nexport interface RendererProps {\n  graphData: GraphData<RendererNodeProps, RendererConnectorProps>;\n  disableAutoLayout?: boolean;\n  connector?: ComponentType<RendererConnectorProps>;\n  node?: ComponentType<RendererNodeProps>;\n}\n"]}

package/lib/components/FlowModeller/Renderer/Utils/Graph.d.ts

@@ -9,12 +9,11 @@ export interface Node<T = unknown> {
     id: string;
     data?: T;
 }
-export interface GraphData<T extends Node, U extends ConnectorProps> {
+export interface GraphData<T extends Node = Node, U extends ConnectorProps = ConnectorProps> {
     nodes: T[];
     connectors: U[];
 }
-export declare class DirectedGraph<T extends Node = Node, U extends ConnectorProps = ConnectorProps, D1 = unknown, // Can be any here.. because nodeData is optional and each node may need to carry its own Data type.
-D2 = unknown> {
+export declare class DirectedGraph<T extends Node = Node, U extends ConnectorProps = ConnectorProps, D1 = unknown, D2 = unknown> {
     private nodes;
     private connectors;
     private nodeData;
@@ -44,6 +43,10 @@ D2 = unknown> {
     hasConnector(id: string): boolean;
     getConnector(id: string): U;
     removeConnector(id: string): DirectedGraph<T, U>;
+    setConnector(id: string, data: {
+        fromNodeId?: string;
+        toNodeId?: string;
+    }): DirectedGraph<T, U>;
     getInConnectors(toNodeId: string, fromNodeId?: string): ConnectorProps[];
     getOutConnectors(fromNodeId: string, toNodeId?: string): ConnectorProps[];
     getAllNodeConnectors(nodeId: string): ConnectorProps<unknown>[] | undefined;

package/lib/components/FlowModeller/Renderer/Utils/Graph.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Graph.d.ts","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/Graph.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,OAAO;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,IAAI,CAAC,CAAC,GAAG,OAAO;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,SAAS,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC,SAAS,cAAc;IACjE,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,UAAU,EAAE,CAAC,EAAE,CAAC;CACjB;AAED,qBAAa,aAAa,CACxB,CAAC,SAAS,IAAI,GAAG,IAAI,EACrB,CAAC,SAAS,cAAc,GAAG,cAAc,EACzC,EAAE,GAAG,OAAO,EAAE,oGAAoG;AAClH,EAAE,GAAG,OAAO;IAEZ,OAAO,CAAC,KAAK,CAAyB;IACtC,OAAO,CAAC,UAAU,CAAyB;IAG3C,OAAO,CAAC,QAAQ,CAAoC;IACpD,OAAO,CAAC,aAAa,CAAoC;IAEzD,OAAO,CAAC,YAAY,CAAyC;IAC7D,OAAO,CAAC,cAAc,CAA8C;IAEpE,OAAO,CAAC,aAAa,CAAyC;IAC9D,OAAO,CAAC,cAAc,CAA8C;IAEpE,OAAO,CAAC,SAAS,CAAK;IACtB,OAAO,CAAC,eAAe,CAAK;gBAEhB,SAAS,GAAE,SAAS,CAAC,CAAC,EAAE,CAAC,CAAiC;IAOtE,YAAY,IAAI,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;IAO/B,YAAY,IAAI,MAAM;IAItB,QAAQ;IAIR,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,GAAG,aAAa;IAoB1C,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC;IAI1B,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO;IAIhC,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,UAAQ,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IAyBzE,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE;IAMjC,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE;IAMjC,iBAAiB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM;IAOzC,iBAAiB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM;IAOzC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO;IAK/B,kBAAkB,IAAI,MAAM;IAI5B,aAAa;IAIb,YAAY,CAAC,SAAS,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IAgD1D,YAAY,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO;IAIjC,YAAY,CAAC,EAAE,EAAE,MAAM,GAAG,CAAC;IAI3B,eAAe,CAAC,EAAE,EAAE,MAAM,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IA+BhD,eAAe,CAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,GAAG,cAAc,EAAE;IAkBxE,gBAAgB,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,cAAc,EAAE;IAkBzE,oBAAoB,CAAC,MAAM,EAAE,MAAM;CAOpC"}
+{"version":3,"file":"Graph.d.ts","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/Graph.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,OAAO;IACzC,EAAE,EAAE,MAAM,CAAC;IACX,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,IAAI,CAAC,CAAC,GAAG,OAAO;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,CAAC,CAAC;CACV;AAED,MAAM,WAAW,SAAS,CAAC,CAAC,SAAS,IAAI,GAAG,IAAI,EAAE,CAAC,SAAS,cAAc,GAAG,cAAc;IACzF,KAAK,EAAE,CAAC,EAAE,CAAC;IACX,UAAU,EAAE,CAAC,EAAE,CAAC;CACjB;AAED,qBAAa,aAAa,CACxB,CAAC,SAAS,IAAI,GAAG,IAAI,EACrB,CAAC,SAAS,cAAc,GAAG,cAAc,EACzC,EAAE,GAAG,OAAO,EACZ,EAAE,GAAG,OAAO;IAEZ,OAAO,CAAC,KAAK,CAAyB;IACtC,OAAO,CAAC,UAAU,CAAyB;IAG3C,OAAO,CAAC,QAAQ,CAAoC;IACpD,OAAO,CAAC,aAAa,CAAoC;IAEzD,OAAO,CAAC,YAAY,CAAyC;IAC7D,OAAO,CAAC,cAAc,CAA8C;IAEpE,OAAO,CAAC,aAAa,CAAyC;IAC9D,OAAO,CAAC,cAAc,CAA8C;IAEpE,OAAO,CAAC,SAAS,CAAK;IACtB,OAAO,CAAC,eAAe,CAAK;gBAEhB,SAAS,GAAE,SAAS,CAAC,CAAC,EAAE,CAAC,CAAiC;IAOtE,YAAY,IAAI,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC;IAO/B,YAAY,IAAI,MAAM;IAItB,QAAQ;IAIR,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,GAAG,aAAa;IAoB1C,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC;IAI1B,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO;IAIhC,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,UAAQ,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IAyBzE,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE;IAMjC,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE;IAMjC,iBAAiB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM;IAOzC,iBAAiB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM;IAOzC,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO;IAK/B,kBAAkB,IAAI,MAAM;IAI5B,aAAa;IAIb,YAAY,CAAC,SAAS,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IAgD1D,YAAY,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO;IAIjC,YAAY,CAAC,EAAE,EAAE,MAAM,GAAG,CAAC;IAI3B,eAAe,CAAC,EAAE,EAAE,MAAM,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IA+BhD,YAAY,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;QAAE,UAAU,CAAC,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC;IAiE/F,eAAe,CAAC,QAAQ,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,GAAG,cAAc,EAAE;IAkBxE,gBAAgB,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,cAAc,EAAE;IAkBzE,oBAAoB,CAAC,MAAM,EAAE,MAAM;CAOpC"}

package/lib/components/FlowModeller/Renderer/Utils/Graph.js

@@ -211,6 +211,61 @@ export class DirectedGraph {
         }
         return this;
     }
+    setConnector(id, data) {
+        // VALIDATE
+        // -connector with given id exists
+        // -node with given fromNodeId exists
+        // -node with given toNodeId exists
+        if (!this.getConnector(id)) {
+            throw new Error(`Connector with id '${id}' does not exist.`);
+        }
+        if (data.fromNodeId && !this.getNode(data.fromNodeId)) {
+            throw new Error(`Node with id '${data.fromNodeId}' does not exist, to update fromNodeId.`);
+        }
+        if (data.toNodeId && !this.getNode(data.toNodeId)) {
+            throw new Error(`Node with id '${data.toNodeId}' does not exist, to update toNodeId.`);
+        }
+        const connector = this.getConnector(id);
+        // current references
+        let fromNodeId = connector.fromNodeId;
+        let toNodeId = connector.toNodeId;
+        // update prev nodes count - unset prev values
+        this.prevNodesCount[toNodeId][fromNodeId] -= 1;
+        if (this.prevNodesCount[toNodeId][fromNodeId] === 0) {
+            delete this.prevNodesCount[toNodeId][fromNodeId];
+        }
+        // update next nodes count - unset prev values
+        this.nextNodesCount[fromNodeId][toNodeId] -= 1;
+        if (this.nextNodesCount[fromNodeId][toNodeId] === 0) {
+            delete this.nextNodesCount[fromNodeId][toNodeId];
+        }
+        // remove prev references
+        delete this.inConnectors[toNodeId][id];
+        delete this.outConnectors[fromNodeId][id];
+        // new references
+        fromNodeId = data.fromNodeId ? data.fromNodeId : connector.fromNodeId;
+        toNodeId = data.toNodeId ? data.toNodeId : connector.toNodeId;
+        connector.fromNodeId = fromNodeId;
+        connector.toNodeId = toNodeId;
+        // update prev nodes count
+        if (this.prevNodesCount[toNodeId][fromNodeId]) {
+            this.prevNodesCount[toNodeId][fromNodeId] += 1;
+        }
+        else {
+            this.prevNodesCount[toNodeId][fromNodeId] = 1;
+        }
+        // update next nodes count
+        if (this.nextNodesCount[fromNodeId][toNodeId]) {
+            this.nextNodesCount[fromNodeId][toNodeId] += 1;
+        }
+        else {
+            this.nextNodesCount[fromNodeId][toNodeId] = 1;
+        }
+        // update in and out connectors for both the nodes
+        this.inConnectors[toNodeId][id] = connector;
+        this.outConnectors[fromNodeId][id] = connector;
+        return this;
+    }
     getInConnectors(toNodeId, fromNodeId) {
         const allInConnectors = this.inConnectors[toNodeId];
         if (allInConnectors) {

package/lib/components/FlowModeller/Renderer/Utils/Graph.js.map

@@ -1 +1 @@
-{"version":3,"file":"Graph.js","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/Graph.ts"],"names":[],"mappings":"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","sourcesContent":["export interface ConnectorProps<T = unknown> {\n  id: string;\n  fromNodeId: string;\n  toNodeId: string;\n  label?: string;\n  data?: T;\n}\n\nexport interface Node<T = unknown> {\n  id: string;\n  data?: T;\n}\n\nexport interface GraphData<T extends Node, U extends ConnectorProps> {\n  nodes: T[];\n  connectors: U[];\n}\n\nexport class DirectedGraph<\n  T extends Node = Node,\n  U extends ConnectorProps = ConnectorProps,\n  D1 = unknown, // Can be any here.. because nodeData is optional and each node may need to carry its own Data type.\n  D2 = unknown // Can be any here.. because connectorData is optional and each connector may need to carry its own Data type.\n> {\n  private nodes: Record<string, T> = {};\n  private connectors: Record<string, U> = {};\n\n  // additional way to maintain related data - for cases where Graph is used for indirect purposes\n  private nodeData: Record<string, D1 | unknown> = {};\n  private connectorData: Record<string, D2 | unknown> = {};\n\n  private inConnectors: Record<string, Record<string, U>> = {}; // we are maintaining connector reference instead of id, to avoid iterations later on.\n  private prevNodesCount: Record<string, Record<string, number>> = {};\n\n  private outConnectors: Record<string, Record<string, U>> = {}; // we are maintaining connector reference instead of id, to avoid iterations later on\n  private nextNodesCount: Record<string, Record<string, number>> = {};\n\n  private nodeCount = 0;\n  private connectorsCount = 0;\n\n  constructor(graphData: GraphData<T, U> = { nodes: [], connectors: [] }) {\n    // Not necessary to clone, as this class never modifies any nodes\n    graphData.nodes.forEach(item => this.addNode(item));\n    // copy/clone, connectors properties 'fromNodeId' and 'toNodeId' values may get modified by this class\n    graphData.connectors.forEach(item => this.addConnector(JSON.parse(JSON.stringify(item))));\n  }\n\n  getGraphData(): GraphData<T, U> {\n    return {\n      nodes: this.getNodes(),\n      connectors: this.getConnectors()\n    };\n  }\n\n  getNodeCount(): number {\n    return this.nodeCount;\n  }\n\n  getNodes() {\n    return Object.values(this.nodes);\n  }\n\n  addNode(node: T, data?: D1): DirectedGraph {\n    if (this.nodes[node.id] !== undefined) {\n      this.nodes[node.id] = node;\n      this.nodeData[node.id] = data;\n    } else {\n      this.nodes[node.id] = node;\n      this.nodeData[node.id] = data;\n\n      this.inConnectors[node.id] = {};\n      this.prevNodesCount[node.id] = {};\n\n      this.outConnectors[node.id] = {};\n      this.nextNodesCount[node.id] = {};\n\n      this.nodeCount += 1;\n    }\n\n    return this;\n  }\n\n  getNode(nodeId: string): T {\n    return this.nodes[nodeId];\n  }\n\n  hasNode(nodeId: string): boolean {\n    return this.nodes[nodeId] !== undefined;\n  }\n\n  deleteNode(nodeId: string, ignoreConnectors = false): DirectedGraph<T, U> {\n    if (this.hasNode(nodeId)) {\n      delete this.nodes[nodeId];\n      delete this.nodeData[nodeId];\n\n      if (ignoreConnectors !== true) {\n        const removeConnector = (id: string) => this.removeConnector(id);\n\n        // IMP NOTE its the responsibility of the callee to make sure that the connectors are cleanly reassigned, or else all attached connectors will be deleted\n\n        Object.keys(this.inConnectors[nodeId]).forEach(removeConnector);\n        delete this.inConnectors[nodeId];\n        delete this.prevNodesCount[nodeId];\n\n        Object.keys(this.outConnectors[nodeId]).forEach(removeConnector);\n        delete this.outConnectors[nodeId];\n        delete this.nextNodesCount[nodeId];\n      }\n\n      this.nodeCount += 1;\n    }\n\n    return this;\n  }\n\n  getPrevNodes(nodeId: string): T[] {\n    return this.prevNodesCount[nodeId]\n      ? Object.keys(this.prevNodesCount[nodeId]).map(id => this.getNode(id))\n      : [];\n  }\n\n  getNextNodes(nodeId: string): T[] {\n    return this.nextNodesCount[nodeId]\n      ? Object.keys(this.nextNodesCount[nodeId]).map(id => this.getNode(id))\n      : [];\n  }\n\n  getPrevNodesCount(nodeId: string): number {\n    return (this.prevNodesCount[nodeId] ? Object.values(this.prevNodesCount[nodeId]) : []).reduce(\n      (prev, current) => prev + current,\n      0\n    );\n  }\n\n  getNextNodesCount(nodeId: string): number {\n    return (this.nextNodesCount[nodeId] ? Object.values(this.nextNodesCount[nodeId]) : []).reduce(\n      (prev, current) => prev + current,\n      0\n    );\n  }\n\n  isLeaf(nodeId: string): boolean {\n    return this.getNextNodes(nodeId).length === 0;\n  }\n\n  // -- Connectors\n  getConnectorsCount(): number {\n    return this.connectorsCount;\n  }\n\n  getConnectors() {\n    return Object.values(this.connectors);\n  }\n\n  addConnector(connector: U, data?: D2): DirectedGraph<T, U> {\n    if (this.connectors[connector.id] !== undefined) {\n      // update the map\n      this.connectors[connector.id] = connector;\n      this.connectorData[connector.id] = data;\n\n      return this;\n    }\n\n    const id = connector.id;\n    const fromNodeId = connector.fromNodeId;\n    const toNodeId = connector.toNodeId;\n\n    // check if nodes with given ids exist\n    if (this.nodes[fromNodeId] === undefined || this.nodes[toNodeId] === undefined) {\n      throw new Error(\n        `One or more nodes does not exist, cannot add connector ${fromNodeId}-${toNodeId}`\n      );\n    }\n\n    // add it to the map\n    this.connectors[id] = connector;\n    this.connectorData[id] = data;\n\n    // update prev nodes count\n    if (this.prevNodesCount[toNodeId][fromNodeId]) {\n      this.prevNodesCount[toNodeId][fromNodeId] += 1;\n    } else {\n      this.prevNodesCount[toNodeId][fromNodeId] = 1;\n    }\n\n    // update next nodes count\n    if (this.nextNodesCount[fromNodeId][toNodeId]) {\n      this.nextNodesCount[fromNodeId][toNodeId] += 1;\n    } else {\n      this.nextNodesCount[fromNodeId][toNodeId] = 1;\n    }\n\n    // update in and out connectors for both the nodes\n    this.inConnectors[toNodeId][id] = connector;\n    this.outConnectors[fromNodeId][id] = connector;\n\n    // increment total connectors count\n    this.connectorsCount += 1;\n\n    return this;\n  }\n\n  hasConnector(id: string): boolean {\n    return this.connectors[id] !== undefined;\n  }\n\n  getConnector(id: string): U {\n    return this.connectors[id];\n  }\n\n  removeConnector(id: string): DirectedGraph<T, U> {\n    const connector = this.connectors[id];\n\n    if (connector !== undefined) {\n      const fromNodeId = connector.fromNodeId;\n      const toNodeId = connector.toNodeId;\n\n      delete this.connectors[id];\n      delete this.connectorData[id];\n\n      // update prev nodes count\n      this.prevNodesCount[toNodeId][fromNodeId] -= 1;\n      if (this.prevNodesCount[toNodeId][fromNodeId] === 0) {\n        delete this.prevNodesCount[toNodeId][fromNodeId];\n      }\n\n      // update next nodes count\n      this.nextNodesCount[fromNodeId][toNodeId] -= 1;\n      if (this.nextNodesCount[fromNodeId][toNodeId] === 0) {\n        delete this.nextNodesCount[fromNodeId][toNodeId];\n      }\n\n      delete this.inConnectors[toNodeId][id];\n      delete this.outConnectors[fromNodeId][id];\n\n      this.connectorsCount -= 1;\n    }\n\n    return this;\n  }\n\n  getInConnectors(toNodeId: string, fromNodeId?: string): ConnectorProps[] {\n    const allInConnectors = this.inConnectors[toNodeId];\n\n    if (allInConnectors) {\n      const connectorValues = Object.values(allInConnectors);\n\n      if (fromNodeId === undefined) {\n        return connectorValues;\n      }\n\n      return connectorValues.filter(connector => {\n        return connector.fromNodeId === fromNodeId;\n      });\n    }\n\n    return [];\n  }\n\n  getOutConnectors(fromNodeId: string, toNodeId?: string): ConnectorProps[] {\n    const allOutConnectors = this.outConnectors[fromNodeId];\n\n    if (allOutConnectors) {\n      const connectorValues = Object.values(allOutConnectors);\n\n      if (toNodeId === undefined) {\n        return connectorValues;\n      }\n\n      return connectorValues.filter(connector => {\n        return connector.toNodeId === toNodeId;\n      });\n    }\n\n    return [];\n  }\n\n  getAllNodeConnectors(nodeId: string) {\n    const inConnectors = this.getInConnectors(nodeId);\n\n    if (inConnectors) {\n      return inConnectors.concat(this.getOutConnectors(nodeId));\n    }\n  }\n}\n"]}
+{"version":3,"file":"Graph.js","sourceRoot":"","sources":["../../../../../src/components/FlowModeller/Renderer/Utils/Graph.ts"],"names":[],"mappings":"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","sourcesContent":["export interface ConnectorProps<T = unknown> {\n  id: string;\n  fromNodeId: string;\n  toNodeId: string;\n  label?: string;\n  data?: T;\n}\n\nexport interface Node<T = unknown> {\n  id: string;\n  data?: T;\n}\n\nexport interface GraphData<T extends Node = Node, U extends ConnectorProps = ConnectorProps> {\n  nodes: T[];\n  connectors: U[];\n}\n\nexport class DirectedGraph<\n  T extends Node = Node,\n  U extends ConnectorProps = ConnectorProps,\n  D1 = unknown,\n  D2 = unknown\n> {\n  private nodes: Record<string, T> = {};\n  private connectors: Record<string, U> = {};\n\n  // additional way to maintain related data - for cases where Graph is used for indirect purposes\n  private nodeData: Record<string, D1 | unknown> = {};\n  private connectorData: Record<string, D2 | unknown> = {};\n\n  private inConnectors: Record<string, Record<string, U>> = {}; // we are maintaining connector reference instead of id, to avoid iterations later on.\n  private prevNodesCount: Record<string, Record<string, number>> = {};\n\n  private outConnectors: Record<string, Record<string, U>> = {}; // we are maintaining connector reference instead of id, to avoid iterations later on\n  private nextNodesCount: Record<string, Record<string, number>> = {};\n\n  private nodeCount = 0;\n  private connectorsCount = 0;\n\n  constructor(graphData: GraphData<T, U> = { nodes: [], connectors: [] }) {\n    // Not necessary to clone, as this class never modifies any nodes\n    graphData.nodes.forEach(item => this.addNode(item));\n    // copy/clone, connectors properties 'fromNodeId' and 'toNodeId' values may get modified by this class\n    graphData.connectors.forEach(item => this.addConnector(JSON.parse(JSON.stringify(item))));\n  }\n\n  getGraphData(): GraphData<T, U> {\n    return {\n      nodes: this.getNodes(),\n      connectors: this.getConnectors()\n    };\n  }\n\n  getNodeCount(): number {\n    return this.nodeCount;\n  }\n\n  getNodes() {\n    return Object.values(this.nodes);\n  }\n\n  addNode(node: T, data?: D1): DirectedGraph {\n    if (this.nodes[node.id] !== undefined) {\n      this.nodes[node.id] = node;\n      this.nodeData[node.id] = data;\n    } else {\n      this.nodes[node.id] = node;\n      this.nodeData[node.id] = data;\n\n      this.inConnectors[node.id] = {};\n      this.prevNodesCount[node.id] = {};\n\n      this.outConnectors[node.id] = {};\n      this.nextNodesCount[node.id] = {};\n\n      this.nodeCount += 1;\n    }\n\n    return this;\n  }\n\n  getNode(nodeId: string): T {\n    return this.nodes[nodeId];\n  }\n\n  hasNode(nodeId: string): boolean {\n    return this.nodes[nodeId] !== undefined;\n  }\n\n  deleteNode(nodeId: string, ignoreConnectors = false): DirectedGraph<T, U> {\n    if (this.hasNode(nodeId)) {\n      delete this.nodes[nodeId];\n      delete this.nodeData[nodeId];\n\n      if (ignoreConnectors !== true) {\n        const removeConnector = (id: string) => this.removeConnector(id);\n\n        // IMP NOTE its the responsibility of the callee to make sure that the connectors are cleanly reassigned, or else all attached connectors will be deleted\n\n        Object.keys(this.inConnectors[nodeId]).forEach(removeConnector);\n        delete this.inConnectors[nodeId];\n        delete this.prevNodesCount[nodeId];\n\n        Object.keys(this.outConnectors[nodeId]).forEach(removeConnector);\n        delete this.outConnectors[nodeId];\n        delete this.nextNodesCount[nodeId];\n      }\n\n      this.nodeCount += 1;\n    }\n\n    return this;\n  }\n\n  getPrevNodes(nodeId: string): T[] {\n    return this.prevNodesCount[nodeId]\n      ? Object.keys(this.prevNodesCount[nodeId]).map(id => this.getNode(id))\n      : [];\n  }\n\n  getNextNodes(nodeId: string): T[] {\n    return this.nextNodesCount[nodeId]\n      ? Object.keys(this.nextNodesCount[nodeId]).map(id => this.getNode(id))\n      : [];\n  }\n\n  getPrevNodesCount(nodeId: string): number {\n    return (this.prevNodesCount[nodeId] ? Object.values(this.prevNodesCount[nodeId]) : []).reduce(\n      (prev, current) => prev + current,\n      0\n    );\n  }\n\n  getNextNodesCount(nodeId: string): number {\n    return (this.nextNodesCount[nodeId] ? Object.values(this.nextNodesCount[nodeId]) : []).reduce(\n      (prev, current) => prev + current,\n      0\n    );\n  }\n\n  isLeaf(nodeId: string): boolean {\n    return this.getNextNodes(nodeId).length === 0;\n  }\n\n  // -- Connectors\n  getConnectorsCount(): number {\n    return this.connectorsCount;\n  }\n\n  getConnectors() {\n    return Object.values(this.connectors);\n  }\n\n  addConnector(connector: U, data?: D2): DirectedGraph<T, U> {\n    if (this.connectors[connector.id] !== undefined) {\n      // update the map\n      this.connectors[connector.id] = connector;\n      this.connectorData[connector.id] = data;\n\n      return this;\n    }\n\n    const id = connector.id;\n    const fromNodeId = connector.fromNodeId;\n    const toNodeId = connector.toNodeId;\n\n    // check if nodes with given ids exist\n    if (this.nodes[fromNodeId] === undefined || this.nodes[toNodeId] === undefined) {\n      throw new Error(\n        `One or more nodes does not exist, cannot add connector ${fromNodeId}-${toNodeId}`\n      );\n    }\n\n    // add it to the map\n    this.connectors[id] = connector;\n    this.connectorData[id] = data;\n\n    // update prev nodes count\n    if (this.prevNodesCount[toNodeId][fromNodeId]) {\n      this.prevNodesCount[toNodeId][fromNodeId] += 1;\n    } else {\n      this.prevNodesCount[toNodeId][fromNodeId] = 1;\n    }\n\n    // update next nodes count\n    if (this.nextNodesCount[fromNodeId][toNodeId]) {\n      this.nextNodesCount[fromNodeId][toNodeId] += 1;\n    } else {\n      this.nextNodesCount[fromNodeId][toNodeId] = 1;\n    }\n\n    // update in and out connectors for both the nodes\n    this.inConnectors[toNodeId][id] = connector;\n    this.outConnectors[fromNodeId][id] = connector;\n\n    // increment total connectors count\n    this.connectorsCount += 1;\n\n    return this;\n  }\n\n  hasConnector(id: string): boolean {\n    return this.connectors[id] !== undefined;\n  }\n\n  getConnector(id: string): U {\n    return this.connectors[id];\n  }\n\n  removeConnector(id: string): DirectedGraph<T, U> {\n    const connector = this.connectors[id];\n\n    if (connector !== undefined) {\n      const fromNodeId = connector.fromNodeId;\n      const toNodeId = connector.toNodeId;\n\n      delete this.connectors[id];\n      delete this.connectorData[id];\n\n      // update prev nodes count\n      this.prevNodesCount[toNodeId][fromNodeId] -= 1;\n      if (this.prevNodesCount[toNodeId][fromNodeId] === 0) {\n        delete this.prevNodesCount[toNodeId][fromNodeId];\n      }\n\n      // update next nodes count\n      this.nextNodesCount[fromNodeId][toNodeId] -= 1;\n      if (this.nextNodesCount[fromNodeId][toNodeId] === 0) {\n        delete this.nextNodesCount[fromNodeId][toNodeId];\n      }\n\n      delete this.inConnectors[toNodeId][id];\n      delete this.outConnectors[fromNodeId][id];\n\n      this.connectorsCount -= 1;\n    }\n\n    return this;\n  }\n\n  setConnector(id: string, data: { fromNodeId?: string; toNodeId?: string }): DirectedGraph<T, U> {\n    // VALIDATE\n    // -connector with given id exists\n    // -node with given fromNodeId exists\n    // -node with given toNodeId exists\n    if (!this.getConnector(id)) {\n      throw new Error(`Connector with id '${id}' does not exist.`);\n    }\n    if (data.fromNodeId && !this.getNode(data.fromNodeId)) {\n      throw new Error(`Node with id '${data.fromNodeId}' does not exist, to update fromNodeId.`);\n    }\n    if (data.toNodeId && !this.getNode(data.toNodeId)) {\n      throw new Error(`Node with id '${data.toNodeId}' does not exist, to update toNodeId.`);\n    }\n\n    const connector = this.getConnector(id);\n\n    // current references\n    let fromNodeId = connector.fromNodeId;\n    let toNodeId = connector.toNodeId;\n\n    // update prev nodes count - unset prev values\n    this.prevNodesCount[toNodeId][fromNodeId] -= 1;\n    if (this.prevNodesCount[toNodeId][fromNodeId] === 0) {\n      delete this.prevNodesCount[toNodeId][fromNodeId];\n    }\n\n    // update next nodes count - unset prev values\n    this.nextNodesCount[fromNodeId][toNodeId] -= 1;\n    if (this.nextNodesCount[fromNodeId][toNodeId] === 0) {\n      delete this.nextNodesCount[fromNodeId][toNodeId];\n    }\n\n    // remove prev references\n    delete this.inConnectors[toNodeId][id];\n    delete this.outConnectors[fromNodeId][id];\n\n    // new references\n    fromNodeId = data.fromNodeId ? data.fromNodeId : connector.fromNodeId;\n    toNodeId = data.toNodeId ? data.toNodeId : connector.toNodeId;\n\n    connector.fromNodeId = fromNodeId;\n    connector.toNodeId = toNodeId;\n\n    // update prev nodes count\n    if (this.prevNodesCount[toNodeId][fromNodeId]) {\n      this.prevNodesCount[toNodeId][fromNodeId] += 1;\n    } else {\n      this.prevNodesCount[toNodeId][fromNodeId] = 1;\n    }\n\n    // update next nodes count\n    if (this.nextNodesCount[fromNodeId][toNodeId]) {\n      this.nextNodesCount[fromNodeId][toNodeId] += 1;\n    } else {\n      this.nextNodesCount[fromNodeId][toNodeId] = 1;\n    }\n\n    // update in and out connectors for both the nodes\n    this.inConnectors[toNodeId][id] = connector;\n    this.outConnectors[fromNodeId][id] = connector;\n\n    return this;\n  }\n\n  getInConnectors(toNodeId: string, fromNodeId?: string): ConnectorProps[] {\n    const allInConnectors = this.inConnectors[toNodeId];\n\n    if (allInConnectors) {\n      const connectorValues = Object.values(allInConnectors);\n\n      if (fromNodeId === undefined) {\n        return connectorValues;\n      }\n\n      return connectorValues.filter(connector => {\n        return connector.fromNodeId === fromNodeId;\n      });\n    }\n\n    return [];\n  }\n\n  getOutConnectors(fromNodeId: string, toNodeId?: string): ConnectorProps[] {\n    const allOutConnectors = this.outConnectors[fromNodeId];\n\n    if (allOutConnectors) {\n      const connectorValues = Object.values(allOutConnectors);\n\n      if (toNodeId === undefined) {\n        return connectorValues;\n      }\n\n      return connectorValues.filter(connector => {\n        return connector.toNodeId === toNodeId;\n      });\n    }\n\n    return [];\n  }\n\n  getAllNodeConnectors(nodeId: string) {\n    const inConnectors = this.getInConnectors(nodeId);\n\n    if (inConnectors) {\n      return inConnectors.concat(this.getOutConnectors(nodeId));\n    }\n  }\n}\n"]}

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

@@ -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;;;;CA8GrE"}
+{"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"}

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

@@ -9,37 +9,39 @@ const DEFAULT_GRAPH_HEIGHT = 2000;
 export default class GraphLayout {
     // Using Dagre layouting
     static plot(graphData, direction = GraphLayoutDirection.TopToBottom) {
-        const dagreGraph = new dagre.graphlib.Graph();
+        const dagreGraph = new dagre.graphlib.Graph({ multigraph: true });
         dagreGraph.setDefaultEdgeLabel(() => ({}));
         const defaultNodeWidth = 280;
         const defaultNodeHeight = 112;
         dagreGraph.setGraph({
             rankdir: direction,
-            ranksep: 10,
+            ranksep: 20,
             edgesep: defaultNodeWidth / 2,
-            nodesep: 40,
+            nodesep: 20,
             // cspell:disable-next
             marginx: 200,
             // cspell:disable-next
             marginy: 50
         });
         graphData.nodes.forEach(node => {
+            const height = node.dimensions.height === 0 ? 0 : node.dimensions.height || defaultNodeHeight;
+            const width = node.dimensions.width === 0 ? 0 : node.dimensions.width || defaultNodeWidth;
             dagreGraph.setNode(node.id, {
-                width: node.dimensions.width ? node.dimensions.width : defaultNodeWidth,
-                height: node.dimensions.height ? node.dimensions.height : defaultNodeHeight
+                width,
+                height
             });
         });
-        graphData.connectors.forEach(con => {
+        graphData.connectors.forEach((con, index) => {
             dagreGraph.setEdge(con.fromNodeId, con.toNodeId, {
                 weight: 1,
-                minlen: 1,
-                label: con.data?.label,
-                width: 200,
-                height: 60,
+                minlen: 2,
+                label: con.data?.label || '',
+                width: 250,
+                height: con.data?.label ? 90 : 40,
                 // cspell:disable-next
                 lablepos: 'c',
                 labeloffset: 0
-            });
+            }, index.toString());
         });
         dagre.layout(dagreGraph, {});
         graphData.nodes.forEach(el => {
@@ -47,8 +49,8 @@ export default class GraphLayout {
             el.position.x = node.x - el.dimensions.width / 2;
             el.position.y = node.y - el.dimensions.height / 2;
         });
-        graphData.connectors.forEach(con => {
-            const edge = dagreGraph.edge(con.fromNodeId, con.toNodeId);
+        graphData.connectors.forEach((con, index) => {
+            const edge = dagreGraph.edge(con.fromNodeId, con.toNodeId, index.toString());
             con.labelLayout = {
                 value: edge.label,
                 x: edge.x,
@@ -81,8 +83,9 @@ export default class GraphLayout {
                     : lastPoint;
             con.points = [
                 { x: fromNode.x, y: fromNode.y + fromNode.height / 2 },
-                firstPoint,
-                ...edge.points.slice(1, lastIndex),
+                { ...firstPoint, y: firstPoint.y + 10 },
+                { ...secondPoint, y: secondPoint.y + 10 },
+                ...edge.points.slice(2, lastIndex),
                 lastPoint,
                 { x: toNode.x, y: toNode.y }
             ];

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

@@ -1 +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    direction: GraphLayoutDirection = GraphLayoutDirection.TopToBottom\n  ) {\n    const dagreGraph = new dagre.graphlib.Graph();\n\n    dagreGraph.setDefaultEdgeLabel(() => ({}));\n\n    const defaultNodeWidth = 280;\n    const defaultNodeHeight = 112;\n\n    dagreGraph.setGraph({\n      rankdir: direction,\n      ranksep: 10,\n      edgesep: defaultNodeWidth / 2,\n      nodesep: 40,\n      // cspell:disable-next\n      marginx: 200,\n      // cspell:disable-next\n      marginy: 50\n    });\n\n    graphData.nodes.forEach(node => {\n      dagreGraph.setNode(node.id, {\n        width: node.dimensions.width ? node.dimensions.width : defaultNodeWidth,\n        height: node.dimensions.height ? node.dimensions.height : defaultNodeHeight\n      });\n    });\n\n    graphData.connectors.forEach(con => {\n      dagreGraph.setEdge(con.fromNodeId, con.toNodeId, {\n        weight: 1,\n        minlen: 1,\n        label: con.data?.label,\n        width: 200,\n        height: 60,\n        // cspell:disable-next\n        lablepos: 'c',\n        labeloffset: 0\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 => {\n      const edge = dagreGraph.edge(con.fromNodeId, con.toNodeId);\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,\n        ...edge.points.slice(1, 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"]}
+{"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    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"]}