@pega/cosmos-react-build 9.0.0-build.9.8 → 9.0.0

package/lib/components/FlowModeller/FlowModeller.js

@@ -0,0 +1,359 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useReducer, useCallback, useRef, useMemo, memo } from 'react';
+import styled, { css } from 'styled-components';
+import { createUID, useI18n, useEscape, defaultThemeProp } from '@pega/cosmos-react-core';
+import { resizeDrawerDefaultWidth } from '@pega/cosmos-react-core/lib/styles/constants';
+import ItemLibrary from '../ItemLibrary/ItemLibrary';
+import { DirectedGraph } from './Renderer/Utils/Graph';
+import FlowRenderer from './Renderer/Renderer';
+import { START_NODETYPE, END_NODETYPE } from './Node/Node.types';
+import PlaceHolderHelper from './Utils/addNodeUtils';
+import AddButton from './AddNode';
+import FlowModellerHelper from './helper';
+import DeleteDialog from './DeleteDialog';
+import Connector from './Connector';
+import Node from './Node';
+import FlowModellerContext from './FlowModellerContext';
+import deleteNodeUtils from './Utils/deleteNodeUtils';
+import FlowAuthoringPanel from './FlowAuthoringPanel/FlowAuthoringPanel';
+const isNodeLibraryItem = (item) => 'minConnectors' in item.type;
+const initState = {
+    showLib: false,
+    activeItem: null,
+    allowNonBranchNode: false,
+    activeAddBtnMeta: {
+        target: null,
+        meta: {
+            refType: 'node',
+            refId: ''
+        }
+    },
+    graphData: { nodes: [], connectors: [] },
+    highlightItems: undefined,
+    showDeleteDialog: false,
+    deleteProps: undefined
+};
+const reducer = (state, action) => {
+    switch (action.type) {
+        case 'showLibrary':
+            // minor optimization, not to update state.. if no change in the value
+            return action.payload.show === state.showLib
+                ? state
+                : { ...state, showLib: action.payload.show, allowNonBranchNode: false };
+        case 'setActiveItem':
+            return {
+                ...state,
+                activeItem: action.payload.target
+            };
+        case 'setActiveAddButton':
+            return {
+                ...state,
+                activeAddBtnMeta: {
+                    ...action.payload
+                },
+                showLib: true,
+                allowNonBranchNode: action.payload.allowNonBranchNode
+            };
+        case 'setGraphData':
+            return {
+                ...state,
+                graphData: action.payload.graphData,
+                highlightItems: action.payload.highlightItems
+            };
+        case 'highlight':
+            // minor optimization to avoid unnecessary re-render
+            if (action.payload.hideDeleteDialog === !state.showDeleteDialog) {
+                return state;
+            }
+            return {
+                ...state,
+                highlightItems: action.payload.highlightItems,
+                showDeleteDialog: action.payload.hideDeleteDialog !== true && state.showDeleteDialog
+            };
+        case 'showDeleteDialog':
+            return {
+                ...state,
+                showDeleteDialog: action.payload.showDeleteDialog,
+                deleteProps: action.payload.deleteProps
+            };
+        default:
+            return state;
+    }
+};
+const StyledFlowModellerWrapper = styled.div(({ theme }) => {
+    const { palette } = theme.base;
+    return css `
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    background-color: ${palette['secondary-background']};
+    display: flex;
+  `;
+});
+StyledFlowModellerWrapper.defaultProps = defaultThemeProp;
+const StyledFlowModellerContent = styled.div(() => {
+    return css `
+    flex: 1;
+    position: relative;
+    min-width: 0;
+    overflow: auto;
+    display: flex;
+    flex-direction: row;
+  `;
+});
+const StyledFlowAuthoringPanelWrapper = styled.div(({ $open }) => {
+    return css `
+    position: relative;
+    flex-shrink: 0;
+    width: ${$open ? `var(--resize-drawer-width, ${resizeDrawerDefaultWidth})` : '0'};
+    overflow: hidden;
+  `;
+});
+const FlowModeller = ({ graphData, highlightData, onNodeActionClick, onNodeAdd, nodeLibrary, onNodeClick, onDelete, actions, readOnly = false, selectedNodeId, panel }) => {
+    const [state, dispatch] = useReducer(reducer, initState);
+    const stateRef = useRef(initState);
+    const flowModellerRef = useRef(null);
+    const skipConnectorFocus = useRef(false);
+    // stateRef always refers to the same state obj
+    // "fixed" callbacks can refer to this object whenever
+    // it need the current value.  Note: the callbacks will not
+    // be reactive - they will not re-run the instant state changes,
+    // but they *will* see the current value whenever they do run
+    stateRef.current = state;
+    const t = useI18n();
+    const onNodeCreate = (el, meta) => {
+        const graph = new DirectedGraph(graphData);
+        let isAllowNonBranchNode = false;
+        if (meta.refType === 'connector') {
+            if (!Array.isArray(meta.refId)) {
+                meta.refId = [meta.refId];
+            }
+            const connectorData = graph.getConnector(meta.refId[0]);
+            const toNode = graph.getNode(connectorData.toNodeId);
+            const inConnectors = graph.getInConnectors(toNode.id);
+            let hiddenConnectorsCount = 0;
+            inConnectors.forEach(connector => {
+                const node = graph.getNode(connector.fromNodeId);
+                if (node.type.minConnectors === 0) {
+                    hiddenConnectorsCount += 1;
+                }
+            });
+            const isPlaceholderConnector = meta.refId.length > 1;
+            /** if node is being added on a placeholder connector then reduce number of in connectors of destination node
+             * by total number of connectors converging/joining to form placeholder connector and add one to the in connector count
+             */
+            const inConnectorsCount = isPlaceholderConnector
+                ? inConnectors.length - meta.refId.length + 1
+                : inConnectors.length;
+            /** if node is being added on a placeholder connector then reduce number of hidden connectors of destination node
+             * by total number of connectors converging/joining to from placeholder connector and are originating from go to nodes
+             */
+            if (isPlaceholderConnector) {
+                meta.refId.forEach(connector => {
+                    if (graph.getNode(graph.getConnector(connector).fromNodeId).type.minConnectors === 0) {
+                        hiddenConnectorsCount -= 1;
+                    }
+                });
+            }
+            /** check destination/target node in connectors count is more than one
+             * check non-hidden/visible connectors among in connectors of destination/target node are more than 1
+             * check connectors converging/joining to form a placeholder connector are not equal to total number of in connectors
+             */
+            if (inConnectorsCount > 1 &&
+                inConnectorsCount - hiddenConnectorsCount > 1 &&
+                inConnectors.length !== meta.refId.length) {
+                isAllowNonBranchNode = true;
+            }
+            else {
+                isAllowNonBranchNode = false;
+            }
+        }
+        skipConnectorFocus.current = false;
+        dispatch({
+            type: 'setActiveAddButton',
+            payload: {
+                target: el,
+                meta,
+                allowNonBranchNode: isAllowNonBranchNode
+            }
+        });
+    };
+    const closeMenu = () => {
+        dispatch({
+            type: 'showLibrary',
+            payload: {
+                show: false
+            }
+        });
+    };
+    const closeDeleteModel = () => {
+        // un-highlight the nodes and connectors
+        dispatch({
+            type: 'highlight',
+            payload: {
+                highlightItems: undefined,
+                hideDeleteDialog: true
+            }
+        });
+    };
+    const onDeleteWrapper = (params, e) => {
+        const result = FlowModellerHelper.deleteNode(graphData, params.nodeId);
+        if (result) {
+            if (result.error) {
+                onDelete?.({ ...params, additionalData: result }, deleteNodeUtils.getDeleteModalContent(t('delete_step_error'), result.references), e);
+            }
+            onDelete?.({ ...params, additionalData: result }, '', e);
+        }
+        else {
+            const targetElement = document.getElementById(`modeller-node-${params.nodeId}`);
+            if (targetElement) {
+                dispatch({
+                    type: 'showDeleteDialog',
+                    payload: {
+                        showDeleteDialog: true,
+                        deleteProps: {
+                            flowGraphData: graphData,
+                            rendererGraphData: graphData,
+                            nodeId: params.nodeId,
+                            target: targetElement,
+                            onChange: highlights => {
+                                dispatch({
+                                    type: 'highlight',
+                                    payload: {
+                                        highlightItems: highlights
+                                    }
+                                });
+                            },
+                            onSubmit: outcome => {
+                                // un-highlight the nodes and connectors
+                                closeDeleteModel();
+                                if (outcome.error) {
+                                    onDelete?.({ ...params, additionalData: outcome }, deleteNodeUtils.getDeleteModalContent(t('delete_step_error'), outcome.references), e);
+                                }
+                                else {
+                                    onDelete?.({ ...params, additionalData: outcome }, '', e);
+                                }
+                            },
+                            onCancel: closeDeleteModel
+                        }
+                    }
+                });
+            }
+        }
+    };
+    useEffect(() => {
+        const graph = new DirectedGraph(graphData);
+        const onGetNewPHNode = metaData => {
+            return {
+                id: createUID(),
+                children: (_jsx(AddButton, { addNodeHandler: (e) => {
+                        if (e.currentTarget) {
+                            onNodeCreate(e.currentTarget, metaData);
+                        }
+                    } })),
+                position: { x: 0, y: 0 },
+                dimensions: { width: 1, height: 0 }
+            };
+        };
+        const onGetNewPHConnector = (fromNodeId, toNodeId) => {
+            return {
+                id: createUID(),
+                fromNodeId,
+                toNodeId,
+                points: [],
+                data: {
+                    onNodeCreate,
+                    type: 'default'
+                }
+            };
+        };
+        const flowNodes = graphData.nodes.map(node => {
+            const flowNode = {
+                ...node,
+                dimensions: {
+                    width: 280,
+                    height: 120
+                },
+                position: {
+                    x: 0,
+                    y: 0
+                },
+                data: {
+                    selected: selectedNodeId === node.id,
+                    actions,
+                    onDelete: onDeleteWrapper,
+                    onActionClick: onNodeActionClick,
+                    onClick: onNodeClick
+                }
+            };
+            if (node.type.id === START_NODETYPE.id || node.type.id === END_NODETYPE.id) {
+                flowNode.dimensions.width = 59;
+                flowNode.dimensions.height = node.label ? 90 : 59;
+            }
+            return flowNode;
+        });
+        const connectors = graphData.connectors.map(connector => {
+            const nodeData = graph.getNode(connector.fromNodeId);
+            const isBranchNode = nodeData.type.minConnectors === 0;
+            return {
+                ...connector,
+                points: [],
+                data: {
+                    label: connector.label,
+                    onNodeCreate,
+                    type: !isBranchNode ? 'default' : 'hidden'
+                }
+            };
+        });
+        // inject the placeholderAddNodes dynamically
+        const newGraphData = PlaceHolderHelper.injectPlaceholderNodes({ nodes: flowNodes, connectors }, onGetNewPHNode, onGetNewPHConnector);
+        dispatch({
+            type: 'setGraphData',
+            payload: {
+                graphData: newGraphData
+            }
+        });
+    }, [graphData, selectedNodeId]);
+    // Library popover functionality
+    const onLibraryItemSelect = useCallback((libItem) => {
+        const metaData = state.activeAddBtnMeta.meta;
+        skipConnectorFocus.current = true;
+        closeMenu();
+        if (isNodeLibraryItem(libItem)) {
+            onNodeAdd(libItem.type, metaData);
+        }
+    }, [state.activeAddBtnMeta]);
+    useEscape(() => {
+        const currState = stateRef.current;
+        if (currState.showDeleteDialog) {
+            closeDeleteModel();
+            document.getElementById(`modeller-node-${currState?.deleteProps?.nodeId}`)?.focus();
+        }
+    }, flowModellerRef);
+    const items = useMemo(() => {
+        if (!state.allowNonBranchNode) {
+            return nodeLibrary.filter(shapeTypes => {
+                if (shapeTypes.type) {
+                    return shapeTypes.type.minConnectors !== 0;
+                }
+                return true;
+            });
+        }
+        return nodeLibrary;
+    }, [nodeLibrary, state.allowNonBranchNode]);
+    const ctxValue = useMemo(() => {
+        return {
+            readOnly,
+            highlights: highlightData
+                ? FlowModellerHelper.getHighlightsWithPlaceholders(graphData, highlightData, selectedNodeId)
+                : state.highlightItems,
+            showNodeLibrary: state.showLib
+        };
+    }, [readOnly, state.highlightItems, highlightData, state.showLib, graphData]);
+    return (_jsxs(StyledFlowModellerWrapper, { ref: flowModellerRef, children: [_jsxs(StyledFlowModellerContent, { children: [_jsx(FlowModellerContext.Provider, { value: ctxValue, children: _jsx(FlowRenderer, { graphData: state.graphData, connector: Connector, node: Node, selectedNodeId: selectedNodeId }) }), state.showDeleteDialog && state.deleteProps && _jsx(DeleteDialog, { ...state.deleteProps }), state.showLib && (_jsx(ItemLibrary, { target: state.showLib && state.activeAddBtnMeta.target instanceof HTMLElement
+                            ? state.activeAddBtnMeta.target
+                            : null, placeholder: t('search_placeholder_default'), items: items, onClick: onLibraryItemSelect, onDismiss: closeMenu, position: 'bottom', skipTargetFocus: skipConnectorFocus }))] }), _jsx(StyledFlowAuthoringPanelWrapper, { "$open": panel?.open, children: panel && _jsx(FlowAuthoringPanel, { ...panel }) })] }));
+};
+export default memo(FlowModeller);
+//# sourceMappingURL=FlowModeller.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModeller.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useReducer, useCallback, useRef, useMemo, memo } from 'react';\nimport type { Reducer, MouseEvent, PropsWithoutRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { createUID, useI18n, useEscape, defaultThemeProp } from '@pega/cosmos-react-core';\nimport { resizeDrawerDefaultWidth } from '@pega/cosmos-react-core/lib/styles/constants';\n\nimport ItemLibrary from '../ItemLibrary/ItemLibrary';\nimport type { LibraryItem } from '../ItemLibrary/ItemLibrary';\n\nimport { DirectedGraph } from './Renderer/Utils/Graph';\nimport type { GraphData } from './Renderer/Utils/Graph';\nimport type { AddNodeHandlerParams } from './Renderer/Renderer.types';\nimport FlowRenderer from './Renderer/Renderer';\nimport type { ActionParams, NodeLibraryItem, NodeProps } from './Node/Node.types';\nimport { START_NODETYPE, END_NODETYPE } from './Node/Node.types';\nimport PlaceHolderHelper from './Utils/addNodeUtils';\nimport AddButton from './AddNode';\nimport FlowModellerHelper from './helper';\nimport DeleteDialog from './DeleteDialog';\nimport Connector from './Connector';\nimport Node from './Node';\nimport FlowModellerContext from './FlowModellerContext';\nimport type { PlottedGraphNode, PlottedGraphConnector } from './Renderer/Utils/GraphLayout';\nimport type { DeleteNodeOutcome } from './Utils/deleteNodeUtils';\nimport deleteNodeUtils from './Utils/deleteNodeUtils';\nimport type { FlowModellerProps, ModellerState, ReducerAction } from './FlowModeller.types';\nimport FlowAuthoringPanel from './FlowAuthoringPanel/FlowAuthoringPanel';\n\nconst isNodeLibraryItem = (item: LibraryItem): item is NodeLibraryItem =>\n  'minConnectors' in item.type;\n\nconst initState: ModellerState = {\n  showLib: false,\n  activeItem: null,\n  allowNonBranchNode: false,\n  activeAddBtnMeta: {\n    target: null,\n    meta: {\n      refType: 'node',\n      refId: ''\n    }\n  },\n  graphData: { nodes: [], connectors: [] },\n  highlightItems: undefined,\n  showDeleteDialog: false,\n  deleteProps: undefined\n};\n\nconst reducer = (state: ModellerState, action: ReducerAction) => {\n  switch (action.type) {\n    case 'showLibrary':\n      // minor optimization, not to update state.. if no change in the value\n      return action.payload.show === state.showLib\n        ? state\n        : { ...state, showLib: action.payload.show, allowNonBranchNode: false };\n    case 'setActiveItem':\n      return {\n        ...state,\n        activeItem: action.payload.target\n      };\n    case 'setActiveAddButton':\n      return {\n        ...state,\n        activeAddBtnMeta: {\n          ...action.payload\n        },\n        showLib: true,\n        allowNonBranchNode: action.payload.allowNonBranchNode\n      };\n    case 'setGraphData':\n      return {\n        ...state,\n        graphData: action.payload.graphData,\n        highlightItems: action.payload.highlightItems\n      };\n    case 'highlight':\n      // minor optimization to avoid unnecessary re-render\n      if (action.payload.hideDeleteDialog === !state.showDeleteDialog) {\n        return state;\n      }\n\n      return {\n        ...state,\n        highlightItems: action.payload.highlightItems,\n        showDeleteDialog: action.payload.hideDeleteDialog !== true && state.showDeleteDialog\n      };\n    case 'showDeleteDialog':\n      return {\n        ...state,\n        showDeleteDialog: action.payload.showDeleteDialog,\n        deleteProps: action.payload.deleteProps\n      };\n    default:\n      return state;\n  }\n};\n\nconst StyledFlowModellerWrapper = styled.div(({ theme }) => {\n  const { palette } = theme.base;\n  return css`\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    background-color: ${palette['secondary-background']};\n    display: flex;\n  `;\n});\n\nStyledFlowModellerWrapper.defaultProps = defaultThemeProp;\n\nconst StyledFlowModellerContent = styled.div(() => {\n  return css`\n    flex: 1;\n    position: relative;\n    min-width: 0;\n    overflow: auto;\n    display: flex;\n    flex-direction: row;\n  `;\n});\n\nconst StyledFlowAuthoringPanelWrapper = styled.div<{ $open?: boolean }>(({ $open }) => {\n  return css`\n    position: relative;\n    flex-shrink: 0;\n    width: ${$open ? `var(--resize-drawer-width, ${resizeDrawerDefaultWidth})` : '0'};\n    overflow: hidden;\n  `;\n});\n\nconst FlowModeller = ({\n  graphData,\n  highlightData,\n  onNodeActionClick,\n  onNodeAdd,\n  nodeLibrary,\n  onNodeClick,\n  onDelete,\n  actions,\n  readOnly = false,\n  selectedNodeId,\n  panel\n}: PropsWithoutRef<FlowModellerProps>) => {\n  const [state, dispatch] = useReducer<Reducer<ModellerState, ReducerAction>>(reducer, initState);\n  const stateRef = useRef<ModellerState>(initState);\n  const flowModellerRef = useRef<HTMLDivElement>(null);\n  const skipConnectorFocus = useRef(false);\n\n  // stateRef always refers to the same state obj\n  // \"fixed\" callbacks can refer to this object whenever\n  // it need the current value.  Note: the callbacks will not\n  // be reactive - they will not re-run the instant state changes,\n  // but they *will* see the current value whenever they do run\n  stateRef.current = state;\n  const t = useI18n();\n\n  const onNodeCreate = (el: HTMLElement | SVGForeignObjectElement, meta: AddNodeHandlerParams) => {\n    const graph = new DirectedGraph(graphData);\n    let isAllowNonBranchNode = false;\n    if (meta.refType === 'connector') {\n      if (!Array.isArray(meta.refId)) {\n        meta.refId = [meta.refId];\n      }\n      const connectorData = graph.getConnector(meta.refId[0]);\n      const toNode = graph.getNode(connectorData.toNodeId);\n      const inConnectors = graph.getInConnectors(toNode.id);\n      let hiddenConnectorsCount = 0;\n      inConnectors.forEach(connector => {\n        const node = graph.getNode(connector.fromNodeId);\n        if (node.type.minConnectors === 0) {\n          hiddenConnectorsCount += 1;\n        }\n      });\n      const isPlaceholderConnector = meta.refId.length > 1;\n\n      /** if node is being added on a placeholder connector then reduce number of in connectors of destination node\n       * by total number of connectors converging/joining to form placeholder connector and add one to the in connector count\n       */\n      const inConnectorsCount = isPlaceholderConnector\n        ? inConnectors.length - meta.refId.length + 1\n        : inConnectors.length;\n\n      /** if node is being added on a placeholder connector then reduce number of hidden connectors of destination node\n       * by total number of connectors converging/joining to from placeholder connector and are originating from go to nodes\n       */\n      if (isPlaceholderConnector) {\n        meta.refId.forEach(connector => {\n          if (graph.getNode(graph.getConnector(connector).fromNodeId).type.minConnectors === 0) {\n            hiddenConnectorsCount -= 1;\n          }\n        });\n      }\n\n      /** check destination/target node in connectors count is more than one\n       * check non-hidden/visible connectors among in connectors of destination/target node are more than 1\n       * check connectors converging/joining to form a placeholder connector are not equal to total number of in connectors\n       */\n      if (\n        inConnectorsCount > 1 &&\n        inConnectorsCount - hiddenConnectorsCount > 1 &&\n        inConnectors.length !== meta.refId.length\n      ) {\n        isAllowNonBranchNode = true;\n      } else {\n        isAllowNonBranchNode = false;\n      }\n    }\n    skipConnectorFocus.current = false;\n    dispatch({\n      type: 'setActiveAddButton',\n      payload: {\n        target: el,\n        meta,\n        allowNonBranchNode: isAllowNonBranchNode\n      }\n    });\n  };\n\n  const closeMenu = () => {\n    dispatch({\n      type: 'showLibrary',\n      payload: {\n        show: false\n      }\n    });\n  };\n\n  const closeDeleteModel = () => {\n    // un-highlight the nodes and connectors\n    dispatch({\n      type: 'highlight',\n      payload: {\n        highlightItems: undefined,\n        hideDeleteDialog: true\n      }\n    });\n  };\n\n  const onDeleteWrapper = (params: ActionParams, e: MouseEvent) => {\n    const result: DeleteNodeOutcome | false = FlowModellerHelper.deleteNode(\n      graphData,\n      params.nodeId\n    );\n    if (result) {\n      if (result.error) {\n        onDelete?.(\n          { ...params, additionalData: result },\n          deleteNodeUtils.getDeleteModalContent(t('delete_step_error'), result.references),\n          e\n        );\n      }\n      onDelete?.({ ...params, additionalData: result }, '', e);\n    } else {\n      const targetElement = document.getElementById(`modeller-node-${params.nodeId}`);\n      if (targetElement) {\n        dispatch({\n          type: 'showDeleteDialog',\n          payload: {\n            showDeleteDialog: true,\n            deleteProps: {\n              flowGraphData: graphData,\n              rendererGraphData: graphData,\n              nodeId: params.nodeId,\n              target: targetElement,\n              onChange: highlights => {\n                dispatch({\n                  type: 'highlight',\n                  payload: {\n                    highlightItems: highlights\n                  }\n                });\n              },\n              onSubmit: outcome => {\n                // un-highlight the nodes and connectors\n                closeDeleteModel();\n                if (outcome.error) {\n                  onDelete?.(\n                    { ...params, additionalData: outcome },\n                    deleteNodeUtils.getDeleteModalContent(\n                      t('delete_step_error'),\n                      outcome.references\n                    ),\n                    e\n                  );\n                } else {\n                  onDelete?.({ ...params, additionalData: outcome }, '', e);\n                }\n              },\n              onCancel: closeDeleteModel\n            }\n          }\n        });\n      }\n    }\n  };\n\n  useEffect(() => {\n    const graph = new DirectedGraph(graphData);\n    const onGetNewPHNode: (metaData: AddNodeHandlerParams) => PlottedGraphNode = metaData => {\n      return {\n        id: createUID(),\n        children: (\n          <AddButton\n            addNodeHandler={(e: MouseEvent<HTMLButtonElement>) => {\n              if (e.currentTarget) {\n                onNodeCreate(e.currentTarget, metaData);\n              }\n            }}\n          />\n        ),\n        position: { x: 0, y: 0 },\n        dimensions: { width: 1, height: 0 }\n      };\n    };\n\n    const onGetNewPHConnector: (\n      fromNodeId: string,\n      toNodeId: string,\n      metaData: AddNodeHandlerParams\n    ) => PlottedGraphConnector = (fromNodeId, toNodeId) => {\n      return {\n        id: createUID(),\n        fromNodeId,\n        toNodeId,\n        points: [],\n        data: {\n          onNodeCreate,\n          type: 'default'\n        }\n      };\n    };\n\n    const flowNodes: PlottedGraphNode[] = graphData.nodes.map(node => {\n      const flowNode: PlottedGraphNode & NodeProps = {\n        ...node,\n        dimensions: {\n          width: 280,\n          height: 120\n        },\n        position: {\n          x: 0,\n          y: 0\n        },\n        data: {\n          selected: selectedNodeId === node.id,\n          actions,\n          onDelete: onDeleteWrapper,\n          onActionClick: onNodeActionClick,\n          onClick: onNodeClick\n        }\n      };\n\n      if (node.type.id === START_NODETYPE.id || node.type.id === END_NODETYPE.id) {\n        flowNode.dimensions.width = 59;\n        flowNode.dimensions.height = node.label ? 90 : 59;\n      }\n      return flowNode;\n    });\n\n    const connectors: PlottedGraphConnector[] = graphData.connectors.map(connector => {\n      const nodeData = graph.getNode(connector.fromNodeId);\n      const isBranchNode = nodeData.type.minConnectors === 0;\n      return {\n        ...connector,\n        points: [],\n        data: {\n          label: connector.label,\n          onNodeCreate,\n          type: !isBranchNode ? 'default' : 'hidden'\n        }\n      };\n    });\n\n    // inject the placeholderAddNodes dynamically\n    const newGraphData: GraphData<PlottedGraphNode, PlottedGraphConnector> =\n      PlaceHolderHelper.injectPlaceholderNodes(\n        { nodes: flowNodes, connectors },\n        onGetNewPHNode,\n        onGetNewPHConnector\n      );\n    dispatch({\n      type: 'setGraphData',\n      payload: {\n        graphData: newGraphData\n      }\n    });\n  }, [graphData, selectedNodeId]);\n  // Library popover functionality\n  const onLibraryItemSelect = useCallback(\n    (libItem: LibraryItem) => {\n      const metaData = state.activeAddBtnMeta.meta;\n      skipConnectorFocus.current = true;\n      closeMenu();\n      if (isNodeLibraryItem(libItem)) {\n        onNodeAdd(libItem.type, metaData);\n      }\n    },\n    [state.activeAddBtnMeta]\n  );\n\n  useEscape(() => {\n    const currState = stateRef.current;\n    if (currState.showDeleteDialog) {\n      closeDeleteModel();\n      document.getElementById(`modeller-node-${currState?.deleteProps?.nodeId}`)?.focus();\n    }\n  }, flowModellerRef);\n\n  const items: NodeLibraryItem[] = useMemo(() => {\n    if (!state.allowNonBranchNode) {\n      return nodeLibrary.filter(shapeTypes => {\n        if (shapeTypes.type) {\n          return shapeTypes.type.minConnectors !== 0;\n        }\n        return true;\n      });\n    }\n    return nodeLibrary;\n  }, [nodeLibrary, state.allowNonBranchNode]);\n\n  const ctxValue = useMemo(() => {\n    return {\n      readOnly,\n      highlights: highlightData\n        ? FlowModellerHelper.getHighlightsWithPlaceholders(graphData, highlightData, selectedNodeId)\n        : state.highlightItems,\n      showNodeLibrary: state.showLib\n    };\n  }, [readOnly, state.highlightItems, highlightData, state.showLib, graphData]);\n  return (\n    <StyledFlowModellerWrapper ref={flowModellerRef}>\n      <StyledFlowModellerContent>\n        <FlowModellerContext.Provider value={ctxValue}>\n          <FlowRenderer\n            graphData={state.graphData}\n            connector={Connector}\n            node={Node}\n            selectedNodeId={selectedNodeId}\n          />\n        </FlowModellerContext.Provider>\n        {state.showDeleteDialog && state.deleteProps && <DeleteDialog {...state.deleteProps} />}\n        {state.showLib && (\n          <ItemLibrary\n            target={\n              state.showLib && state.activeAddBtnMeta.target instanceof HTMLElement\n                ? state.activeAddBtnMeta.target\n                : null\n            }\n            placeholder={t('search_placeholder_default')}\n            items={items}\n            onClick={onLibraryItemSelect}\n            onDismiss={closeMenu}\n            position='bottom'\n            skipTargetFocus={skipConnectorFocus}\n          />\n        )}\n      </StyledFlowModellerContent>\n      <StyledFlowAuthoringPanelWrapper $open={panel?.open}>\n        {panel && <FlowAuthoringPanel {...panel} />}\n      </StyledFlowAuthoringPanelWrapper>\n    </StyledFlowModellerWrapper>\n  );\n};\n\nexport default memo(FlowModeller);\n"]}

package/lib/components/FlowModeller/FlowModeller.test-ids.d.ts

@@ -0,0 +1,3 @@
+export declare const getConnectorTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly []>;
+export declare const getNodeTestIds: (testIdProp?: import("@pega/cosmos-react-core").TestIdProp["testId"]) => import("@pega/cosmos-react-core").TestIdsRecord<readonly string[]>;
+//# sourceMappingURL=FlowModeller.test-ids.d.ts.map

package/lib/components/FlowModeller/FlowModeller.test-ids.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModeller.test-ids.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.test-ids.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,mBAAmB,uIAAyC,CAAC;AAC1E,eAAO,MAAM,cAAc,6IAA2D,CAAC"}

package/lib/components/FlowModeller/FlowModeller.test-ids.js

@@ -0,0 +1,5 @@
+import { createTestIds } from '@pega/cosmos-react-core';
+const FlowModellerActions = ['action-button', 'add-button'];
+export const getConnectorTestIds = createTestIds('add-node', []);
+export const getNodeTestIds = createTestIds('node', [...FlowModellerActions]);
+//# sourceMappingURL=FlowModeller.test-ids.js.map

package/lib/components/FlowModeller/FlowModeller.test-ids.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModeller.test-ids.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.test-ids.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAExD,MAAM,mBAAmB,GAAG,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC;AAE5D,MAAM,CAAC,MAAM,mBAAmB,GAAG,aAAa,CAAC,UAAU,EAAE,EAAW,CAAC,CAAC;AAC1E,MAAM,CAAC,MAAM,cAAc,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC,GAAG,mBAAmB,CAAU,CAAC,CAAC","sourcesContent":["import { createTestIds } from '@pega/cosmos-react-core';\n\nconst FlowModellerActions = ['action-button', 'add-button'];\n\nexport const getConnectorTestIds = createTestIds('add-node', [] as const);\nexport const getNodeTestIds = createTestIds('node', [...FlowModellerActions] as const);\n"]}

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

@@ -0,0 +1,84 @@
+import type { MouseEvent, ReactNode } from 'react';
+import type { Action } from '@pega/cosmos-react-core';
+import type { GraphData, ConnectorProps } from './Renderer/Utils/Graph';
+import type { AddNodeHandlerParams, RendererProps } from './Renderer/Renderer.types';
+import type { ActionParams, NodeProps, NodeLibraryItem, NodeType, NodeComponentData } from './Node/Node.types';
+import type { PlottedGraphNode, PlottedGraphConnector } from './Renderer/Utils/GraphLayout';
+import type { DeleteNodeModalOption } from './Utils/deleteNodeUtils';
+import type { DeleteDialogProps } from './DeleteDialog';
+import type { FlowAuthoringPanelProps } from './FlowAuthoringPanel/FlowAuthoringPanel.types';
+export interface FlowModellerProps {
+    graphData: GraphData<NodeProps, ConnectorProps>;
+    /** Node actions */
+    actions?: Action[];
+    /** Callback to add node from connector */
+    onNodeAdd: (nodeType: NodeType, params: AddNodeHandlerParams) => void;
+    /** Callback for handling the click on the node */
+    onNodeClick?: NodeComponentData['onClick'];
+    /** Callback for actions on Node */
+    onNodeActionClick?: (param: ActionParams, e: MouseEvent) => void;
+    /** Callback for node deletion */
+    onDelete?: (param: ActionParams, error: ReactNode, e: MouseEvent) => void;
+    /** Types of nodes */
+    nodeLibrary: NodeLibraryItem[];
+    /** Highlights */
+    highlightData?: RendererProps['highlights'];
+    /** To make FlowModeller readOnly state
+     * @default false
+     */
+    readOnly?: boolean;
+    /** Current selected node */
+    selectedNodeId?: NodeProps['id'];
+    /** Props to render the FlowAuthoringPanel inside the FlowModeller */
+    panel?: FlowAuthoringPanelProps;
+}
+export type ModellerState = {
+    showLib: boolean;
+    allowNonBranchNode: boolean;
+    activeItem: Element | null;
+    activeAddBtnMeta: {
+        target: HTMLElement | SVGForeignObjectElement | null;
+        meta: AddNodeHandlerParams;
+    };
+    graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;
+    highlightItems?: DeleteNodeModalOption['pathItems'];
+    showDeleteDialog: boolean;
+    deleteProps: DeleteDialogProps | undefined;
+};
+export type ReducerAction = {
+    type: 'showLibrary';
+    payload: {
+        show: boolean;
+    };
+} | {
+    type: 'setActiveItem';
+    payload: {
+        target: Element | null;
+    };
+} | {
+    type: 'setActiveAddButton';
+    payload: {
+        target: HTMLElement | SVGForeignObjectElement | null;
+        meta: AddNodeHandlerParams;
+        allowNonBranchNode: boolean;
+    };
+} | {
+    type: 'setGraphData';
+    payload: {
+        graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;
+        highlightItems?: DeleteNodeModalOption['pathItems'];
+    };
+} | {
+    type: 'highlight';
+    payload: {
+        highlightItems?: DeleteNodeModalOption['pathItems'];
+        hideDeleteDialog?: boolean;
+    };
+} | {
+    type: 'showDeleteDialog';
+    payload: {
+        showDeleteDialog: boolean;
+        deleteProps?: DeleteDialogProps;
+    };
+};
+//# sourceMappingURL=FlowModeller.types.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModeller.types.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.types.ts"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=FlowModeller.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModeller.types.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModeller.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { MouseEvent, ReactNode } from 'react';\n\nimport type { Action } from '@pega/cosmos-react-core';\n\nimport type { GraphData, ConnectorProps } from './Renderer/Utils/Graph';\nimport type { AddNodeHandlerParams, RendererProps } from './Renderer/Renderer.types';\nimport type {\n  ActionParams,\n  NodeProps,\n  NodeLibraryItem,\n  NodeType,\n  NodeComponentData\n} from './Node/Node.types';\nimport type { PlottedGraphNode, PlottedGraphConnector } from './Renderer/Utils/GraphLayout';\nimport type { DeleteNodeModalOption } from './Utils/deleteNodeUtils';\nimport type { DeleteDialogProps } from './DeleteDialog';\nimport type { FlowAuthoringPanelProps } from './FlowAuthoringPanel/FlowAuthoringPanel.types';\n\nexport interface FlowModellerProps {\n  graphData: GraphData<NodeProps, ConnectorProps>;\n  /** Node actions */\n  actions?: Action[];\n  /** Callback to add node from connector */\n  onNodeAdd: (nodeType: NodeType, params: AddNodeHandlerParams) => void;\n  /** Callback for handling the click on the node */\n  onNodeClick?: NodeComponentData['onClick'];\n  /** Callback for actions on Node */\n  onNodeActionClick?: (param: ActionParams, e: MouseEvent) => void;\n  /** Callback for node deletion */\n  onDelete?: (param: ActionParams, error: ReactNode, e: MouseEvent) => void;\n  /** Types of nodes */\n  nodeLibrary: NodeLibraryItem[];\n  /** Highlights */\n  highlightData?: RendererProps['highlights'];\n  /** To make FlowModeller readOnly state\n   * @default false\n   */\n  readOnly?: boolean;\n  /** Current selected node */\n  selectedNodeId?: NodeProps['id'];\n  /** Props to render the FlowAuthoringPanel inside the FlowModeller */\n  panel?: FlowAuthoringPanelProps;\n}\n\nexport type ModellerState = {\n  showLib: boolean;\n  allowNonBranchNode: boolean;\n  activeItem: Element | null;\n  activeAddBtnMeta: {\n    target: HTMLElement | SVGForeignObjectElement | null; // we will maintain ref of an Element\n    meta: AddNodeHandlerParams;\n  };\n  graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;\n  highlightItems?: DeleteNodeModalOption['pathItems'];\n  showDeleteDialog: boolean;\n  deleteProps: DeleteDialogProps | undefined;\n};\n\nexport type ReducerAction =\n  | { type: 'showLibrary'; payload: { show: boolean } }\n  | { type: 'setActiveItem'; payload: { target: Element | null } }\n  | {\n      type: 'setActiveAddButton';\n      payload: {\n        target: HTMLElement | SVGForeignObjectElement | null;\n        meta: AddNodeHandlerParams;\n        allowNonBranchNode: boolean;\n      };\n    }\n  | {\n      type: 'setGraphData';\n      payload: {\n        graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;\n        highlightItems?: DeleteNodeModalOption['pathItems'];\n      };\n    }\n  | {\n      type: 'highlight';\n      payload: { highlightItems?: DeleteNodeModalOption['pathItems']; hideDeleteDialog?: boolean };\n    }\n  | {\n      type: 'showDeleteDialog';\n      payload: { showDeleteDialog: boolean; deleteProps?: DeleteDialogProps };\n    };\n"]}

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

@@ -0,0 +1,10 @@
+import type { FlowModellerProps } from './FlowModeller.types';
+import type { RendererProps } from './Renderer/Renderer.types';
+export interface FlowModellerContextValue {
+    readOnly: FlowModellerProps['readOnly'];
+    highlights: RendererProps['highlights'];
+    showNodeLibrary: boolean;
+}
+declare const FlowModellerContext: import("react").Context<FlowModellerContextValue>;
+export default FlowModellerContext;
+//# sourceMappingURL=FlowModellerContext.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModellerContext.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAE/D,MAAM,WAAW,wBAAwB;IACvC,QAAQ,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACxC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;IACxC,eAAe,EAAE,OAAO,CAAC;CAC1B;AAED,QAAA,MAAM,mBAAmB,mDAIvB,CAAC;AAEH,eAAe,mBAAmB,CAAC"}

package/lib/components/FlowModeller/FlowModellerContext.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"FlowModellerContext.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/FlowModellerContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAWtC,MAAM,mBAAmB,GAAG,aAAa,CAA2B;IAClE,QAAQ,EAAE,KAAK;IACf,UAAU,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE;IACzC,eAAe,EAAE,KAAK;CACvB,CAAC,CAAC;AAEH,eAAe,mBAAmB,CAAC","sourcesContent":["import { createContext } from 'react';\n\nimport type { FlowModellerProps } from './FlowModeller.types';\nimport type { RendererProps } from './Renderer/Renderer.types';\n\nexport interface FlowModellerContextValue {\n  readOnly: FlowModellerProps['readOnly'];\n  highlights: RendererProps['highlights'];\n  showNodeLibrary: boolean;\n}\n\nconst FlowModellerContext = createContext<FlowModellerContextValue>({\n  readOnly: false,\n  highlights: { nodes: {}, connectors: {} },\n  showNodeLibrary: false\n});\n\nexport default FlowModellerContext;\n"]}