@pega/cosmos-react-build 5.0.0-dev.4.7 → 5.0.0-dev.4.9

package/lib/components/FlowModeller/Node/NodeTemplate.styles.js

@@ -1,151 +0,0 @@
-import styled, { css } from 'styled-components';
-import { defaultThemeProp, Card, Text, CardFooter, Icon } from '@pega/cosmos-react-core';
-export const StyledCircle = styled.div(({ theme }) => {
-    return css `
-    height: 2rem;
-    width: 2rem;
-    background: var(--bg-color);
-    border-radius: 50%;
-    align-self: center;
-    &:focus {
-      outline: none;
-      box-shadow: ${theme.base.shadow.focus};
-    }
-  `;
-});
-StyledCircle.defaultProps = defaultThemeProp;
-export const StyledLabel = styled(Text)(({ nodeType, theme }) => {
-    return css `
-    align-self: center;
-    ${nodeType.name === 'start'
-        ? css `
-          padding-block-end: ${theme.base.spacing};
-        `
-        : css `
-          padding-block-start: ${theme.base.spacing};
-        `}
-  `;
-});
-StyledLabel.defaultProps = defaultThemeProp;
-export const StyledIcon = styled.div(({ theme }) => {
-    return css `
-    min-height: 2rem;
-    min-width: 2rem;
-    padding: calc(0.5 * ${theme.base.spacing});
-    margin-inline-end: ${theme.base.spacing};
-    text-align: center;
-    background-color: var(--bg-color);
-    color: var(--fg-color);
-    border-radius: ${theme.base['border-radius']};
-  `;
-});
-StyledIcon.defaultProps = defaultThemeProp;
-export const StyledNodeTemplateHeader = styled.header(({ theme }) => {
-    return css `
-    white-space: nowrap;
-    button {
-      border-radius: ${theme.base['border-radius']};
-    }
-  `;
-});
-StyledNodeTemplateHeader.defaultProps = defaultThemeProp;
-export const StyledText = styled(Text)(({ error, theme }) => {
-    return css `
-    padding-inline-end: ${theme.base.spacing};
-    overflow: hidden;
-    text-overflow: ellipsis;
-    max-width: ${error ? '20ch' : '23ch'};
-  `;
-});
-StyledText.defaultProps = defaultThemeProp;
-export const StyledNodeTemplate = styled(Card)(({ highlight, theme }) => {
-    return css `
-    width: 17.5rem;
-    height: 7.5rem;
-    align-self: center;
-    overflow: hidden;
-    border: 0.125rem solid transparent;
-
-    ${highlight &&
-        css `
-      &&& {
-        color: ${theme.base.colors.black};
-        background-color: ${theme.base.colors.red['extra-light']};
-        border-radius: 0.25rem;
-        box-shadow: 0 0 0 0.125rem ${theme.base.colors.red.medium};
-      }
-    `}
-
-    &&& {
-      border-radius: ${theme.base['border-radius']};
-    }
-
-    &:hover {
-      cursor: pointer;
-    }
-
-    :focus-visible {
-      box-shadow: ${theme.base.shadow.focus};
-    }
-
-    &[aria-current='location'] {
-      box-shadow: none;
-      border: 0.125rem solid ${theme.base.palette.interactive};
-      cursor: pointer;
-    }
-  `;
-});
-StyledNodeTemplate.defaultProps = defaultThemeProp;
-export const StyledNodeTemplateFooter = styled(CardFooter)(({ theme }) => {
-    return css `
-    margin-top: auto;
-    &:not(${StyledNodeTemplate} ${StyledNodeTemplate} > &) {
-      padding: ${theme.base.spacing};
-    }
-  `;
-});
-StyledNodeTemplateFooter.defaultProps = defaultThemeProp;
-export const StyledNodeTempleteContent = styled.div(({ theme }) => {
-    return css `
-    padding: ${theme.base.spacing};
-    padding-block-start: 0;
-    max-height: 2.5rem;
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: pre-wrap;
-    word-wrap: break-word;
-  `;
-});
-StyledNodeTempleteContent.defaultProps = defaultThemeProp;
-export const StyledAdditionalData = styled.dl `
-  overflow: hidden;
-`;
-export const StyledAdditionalDataItem = styled.div(({ theme }) => {
-    return css `
-    padding: 0 calc(0.5 * ${theme.base.spacing});
-    background-color: ${theme.base.palette['secondary-background']};
-    border-radius: ${theme.base['border-radius']};
-  `;
-});
-StyledAdditionalDataItem.defaultProps = defaultThemeProp;
-export const StyledTextWithEllipsis = styled(Text)(() => {
-    return css `
-    overflow: hidden;
-    width: auto;
-    display: inline-block;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-  `;
-});
-StyledTextWithEllipsis.defaultProps = defaultThemeProp;
-export const StyledErrorIcon = styled(Icon)(({ theme }) => {
-    return css `
-    color: ${theme.base.palette.urgent};
-    margin-inline-end: ${theme.base.spacing};
-  `;
-});
-StyledErrorIcon.defaultProps = defaultThemeProp;
-//# sourceMappingURL=NodeTemplate.styles.js.map

package/lib/components/FlowModeller/Node/NodeTemplate.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NodeTemplate.styles.js","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplate.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAIzF,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACnD,OAAO,GAAG,CAAA;;;;;;;;oBAQQ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;GAExC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,CAAC,CAAyB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE;IACtF,OAAO,GAAG,CAAA;;MAEN,QAAQ,CAAC,IAAI,KAAK,OAAO;QACzB,CAAC,CAAC,GAAG,CAAA;+BACoB,KAAK,CAAC,IAAI,CAAC,OAAO;SACxC;QACH,CAAC,CAAC,GAAG,CAAA;iCACsB,KAAK,CAAC,IAAI,CAAC,OAAO;SAC1C;GACN,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,WAAW,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE5C,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACjD,OAAO,GAAG,CAAA;;;0BAGc,KAAK,CAAC,IAAI,CAAC,OAAO;yBACnB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;qBAItB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;GAC7C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAClE,OAAO,GAAG,CAAA;;;uBAGW,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;GAE/C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEzD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAAiC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1F,OAAO,GAAG,CAAA;0BACc,KAAK,CAAC,IAAI,CAAC,OAAO;;;iBAG3B,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;GACrC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAyB,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE;IAC9F,OAAO,GAAG,CAAA;;;;;;;MAON,SAAS;QACX,GAAG,CAAA;;iBAEU,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;4BACZ,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,aAAa,CAAC;;qCAE3B,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM;;KAE5D;;;uBAGkB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;;;;;;;oBAQ9B,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK;;;;;+BAKZ,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;;;GAG1D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvE,OAAO,GAAG,CAAA;;YAEA,kBAAkB,IAAI,kBAAkB;iBACnC,KAAK,CAAC,IAAI,CAAC,OAAO;;GAEhC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEzD,MAAM,CAAC,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAChE,OAAO,GAAG,CAAA;eACG,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;;;;;;GAU9B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE1D,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,EAAE,CAAA;;CAE5C,CAAC;AAEF,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC/D,OAAO,GAAG,CAAA;4BACgB,KAAK,CAAC,IAAI,CAAC,OAAO;wBACtB,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,sBAAsB,CAAC;qBAC7C,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;GAC7C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEzD,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE;IACtD,OAAO,GAAG,CAAA;;;;;;GAMT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;aACC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM;yBACb,KAAK,CAAC,IAAI,CAAC,OAAO;GACxC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp, Card, Text, CardFooter, Icon } from '@pega/cosmos-react-core';\n\nimport { NodeType } from './Node.types';\n\nexport const StyledCircle = styled.div(({ theme }) => {\n  return css`\n    height: 2rem;\n    width: 2rem;\n    background: var(--bg-color);\n    border-radius: 50%;\n    align-self: center;\n    &:focus {\n      outline: none;\n      box-shadow: ${theme.base.shadow.focus};\n    }\n  `;\n});\n\nStyledCircle.defaultProps = defaultThemeProp;\n\nexport const StyledLabel = styled(Text)<{ nodeType: NodeType }>(({ nodeType, theme }) => {\n  return css`\n    align-self: center;\n    ${nodeType.name === 'start'\n      ? css`\n          padding-block-end: ${theme.base.spacing};\n        `\n      : css`\n          padding-block-start: ${theme.base.spacing};\n        `}\n  `;\n});\n\nStyledLabel.defaultProps = defaultThemeProp;\n\nexport const StyledIcon = styled.div(({ theme }) => {\n  return css`\n    min-height: 2rem;\n    min-width: 2rem;\n    padding: calc(0.5 * ${theme.base.spacing});\n    margin-inline-end: ${theme.base.spacing};\n    text-align: center;\n    background-color: var(--bg-color);\n    color: var(--fg-color);\n    border-radius: ${theme.base['border-radius']};\n  `;\n});\n\nStyledIcon.defaultProps = defaultThemeProp;\n\nexport const StyledNodeTemplateHeader = styled.header(({ theme }) => {\n  return css`\n    white-space: nowrap;\n    button {\n      border-radius: ${theme.base['border-radius']};\n    }\n  `;\n});\n\nStyledNodeTemplateHeader.defaultProps = defaultThemeProp;\n\nexport const StyledText = styled(Text)<{ error?: string | undefined }>(({ error, theme }) => {\n  return css`\n    padding-inline-end: ${theme.base.spacing};\n    overflow: hidden;\n    text-overflow: ellipsis;\n    max-width: ${error ? '20ch' : '23ch'};\n  `;\n});\n\nStyledText.defaultProps = defaultThemeProp;\n\nexport const StyledNodeTemplate = styled(Card)<{ highlight: boolean }>(({ highlight, theme }) => {\n  return css`\n    width: 17.5rem;\n    height: 7.5rem;\n    align-self: center;\n    overflow: hidden;\n    border: 0.125rem solid transparent;\n\n    ${highlight &&\n    css`\n      &&& {\n        color: ${theme.base.colors.black};\n        background-color: ${theme.base.colors.red['extra-light']};\n        border-radius: 0.25rem;\n        box-shadow: 0 0 0 0.125rem ${theme.base.colors.red.medium};\n      }\n    `}\n\n    &&& {\n      border-radius: ${theme.base['border-radius']};\n    }\n\n    &:hover {\n      cursor: pointer;\n    }\n\n    :focus-visible {\n      box-shadow: ${theme.base.shadow.focus};\n    }\n\n    &[aria-current='location'] {\n      box-shadow: none;\n      border: 0.125rem solid ${theme.base.palette.interactive};\n      cursor: pointer;\n    }\n  `;\n});\n\nStyledNodeTemplate.defaultProps = defaultThemeProp;\n\nexport const StyledNodeTemplateFooter = styled(CardFooter)(({ theme }) => {\n  return css`\n    margin-top: auto;\n    &:not(${StyledNodeTemplate} ${StyledNodeTemplate} > &) {\n      padding: ${theme.base.spacing};\n    }\n  `;\n});\n\nStyledNodeTemplateFooter.defaultProps = defaultThemeProp;\n\nexport const StyledNodeTempleteContent = styled.div(({ theme }) => {\n  return css`\n    padding: ${theme.base.spacing};\n    padding-block-start: 0;\n    max-height: 2.5rem;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: pre-wrap;\n    word-wrap: break-word;\n  `;\n});\n\nStyledNodeTempleteContent.defaultProps = defaultThemeProp;\n\nexport const StyledAdditionalData = styled.dl`\n  overflow: hidden;\n`;\n\nexport const StyledAdditionalDataItem = styled.div(({ theme }) => {\n  return css`\n    padding: 0 calc(0.5 * ${theme.base.spacing});\n    background-color: ${theme.base.palette['secondary-background']};\n    border-radius: ${theme.base['border-radius']};\n  `;\n});\n\nStyledAdditionalDataItem.defaultProps = defaultThemeProp;\n\nexport const StyledTextWithEllipsis = styled(Text)(() => {\n  return css`\n    overflow: hidden;\n    width: auto;\n    display: inline-block;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  `;\n});\n\nStyledTextWithEllipsis.defaultProps = defaultThemeProp;\n\nexport const StyledErrorIcon = styled(Icon)(({ theme }) => {\n  return css`\n    color: ${theme.base.palette.urgent};\n    margin-inline-end: ${theme.base.spacing};\n  `;\n});\n\nStyledErrorIcon.defaultProps = defaultThemeProp;\n"]}

package/lib/components/FlowModeller/Node/NodeTemplates.d.ts

@@ -1,6 +0,0 @@
-import { PropsWithoutRef } from 'react';
-import { NodeProps, NodeComponentProps } from './Node.types';
-export declare const DefaultNode: ({ id, label, type, description, additionalData, actions, onActionClick, onClick, onDelete, reference, error, selected, referencedNode, ...restProps }: NodeComponentProps) => JSX.Element;
-export declare const StartNode: ({ type, label }: PropsWithoutRef<NodeProps>) => JSX.Element;
-export declare const EndNode: ({ type, label }: PropsWithoutRef<NodeProps>) => JSX.Element;
-//# sourceMappingURL=NodeTemplates.d.ts.map

package/lib/components/FlowModeller/Node/NodeTemplates.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"NodeTemplates.d.ts","sourceRoot":"","sources":["../../../../src/components/FlowModeller/Node/NodeTemplates.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,EAOhB,MAAM,OAAO,CAAC;AAuBf,OAAO,EAAE,SAAS,EAAE,kBAAkB,EAA2B,MAAM,cAAc,CAAC;AAqCtF,eAAO,MAAM,WAAW,0JAerB,kBAAkB,gBAkGpB,CAAC;AAEF,eAAO,MAAM,SAAS,oBAAqB,gBAAgB,SAAS,CAAC,gBAgBpE,CAAC;AAEF,eAAO,MAAM,OAAO,oBAAqB,gBAAgB,SAAS,CAAC,gBAgBlE,CAAC"}

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

@@ -1,70 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useContext } from 'react';
-import { readableColor } from 'polished';
-import { MenuButton, Icon, Flex, useI18n, Text, registerIcon } from '@pega/cosmos-react-core';
-import * as warnSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/warn-solid.icon';
-import { colorMap } from '../../../utils';
-import FlowModellerContext from '../FlowModellerContext';
-import { StyledLabel, StyledCircle, StyledIcon, StyledNodeTemplateHeader, StyledNodeTempleteContent, StyledNodeTemplate, StyledText, StyledTextWithEllipsis, StyledAdditionalData, StyledNodeTemplateFooter, StyledAdditionalDataItem, StyledErrorIcon } from './NodeTemplate.styles';
-registerIcon(warnSolidIcon);
-const MetaListItem = ({ label, value }) => {
-    return (_jsxs(Flex, { as: StyledAdditionalDataItem, container: { wrap: 'nowrap', pad: 0.25, gap: 0.25 }, item: { grow: 1 }, children: [_jsx(StyledTextWithEllipsis, { as: 'dd', children: label }), _jsx(Text, { role: 'separator', variant: 'secondary', "aria-hidden": 'true', children: ":\u00A0" }), _jsx(StyledTextWithEllipsis, { as: 'dt', children: value })] }));
-};
-const MetaList = ({ metadata }) => {
-    return (_jsxs(Flex, { as: StyledAdditionalData, container: { wrap: 'nowrap', colGap: 1, rowGap: 0.25 }, children: [metadata?.map((data, index) => {
-                if (index >= 2) {
-                    return;
-                }
-                return _jsx(MetaListItem, { ...data }, data.id);
-            }), metadata && metadata.length > 2 && (_jsx(Flex, { as: StyledAdditionalDataItem, container: { pad: 0.25 }, item: { grow: 1, shrink: 0 }, children: _jsx(StyledTextWithEllipsis, { as: 'dt', children: `+${metadata.length - 2}` }) }))] }));
-};
-export const DefaultNode = ({ id, label, type, description, additionalData, actions, onActionClick, onClick, onDelete, reference, error, selected, referencedNode, ...restProps }) => {
-    const t = useI18n();
-    const actionItems = actions?.map(actionItem => {
-        return {
-            id: actionItem.id,
-            primary: actionItem.text,
-            onClick: (actionId, e) => {
-                e.stopPropagation();
-                onActionClick?.({ actionId, nodeId: id }, e);
-            }
-        };
-    });
-    const references = referencedNode && [
-        { id: referencedNode?.id, label: t('go_to_noun'), value: referencedNode?.label }
-    ];
-    if (onDelete !== undefined) {
-        actionItems?.push({
-            id: 'flowmodeller-delete-node',
-            primary: t('delete'),
-            onClick: (actionId, e) => {
-                e.stopPropagation();
-                onDelete?.({ actionId, nodeId: id }, e);
-            }
-        });
-    }
-    const handleEnterKeyDown = useCallback((e) => {
-        if (e.key === 'Enter' && !e.shiftKey) {
-            onClick?.(id, e);
-        }
-    }, [onClick]);
-    const color = readableColor(colorMap[type.color]);
-    const { readOnly, highlights } = useContext(FlowModellerContext);
-    return (_jsxs(StyledNodeTemplate, { "aria-label": error ? t('step_name_error', [label]) : label, "aria-current": selected ? 'location' : undefined, onClick: (e) => onClick?.(id, e), onKeyDown: handleEnterKeyDown, id: `modeller-node-${id}`, highlight: !!highlights?.nodes?.[id], ...restProps, children: [_jsxs(Flex, { as: StyledNodeTemplateHeader, container: { alignItems: 'center', pad: 1, justify: 'between' }, children: [_jsxs(Flex, { container: { alignItems: 'center' }, children: [error && _jsx(StyledErrorIcon, { name: 'warn-solid' }), _jsx(StyledIcon, { id: id, style: {
-                                    '--bg-color': colorMap[type.color],
-                                    '--fg-color': color
-                                }, children: _jsx(Icon, { name: type.icon }) }), _jsx(StyledText, { variant: 'h4', children: label })] }), !readOnly && actionItems && (_jsx(MenuButton, { portal: true, variant: 'simple', text: t('actions'), icon: 'more', iconOnly: true, onClick: (e) => e.stopPropagation(), onKeyDown: (e) => e.stopPropagation(), menu: {
-                            items: actionItems
-                        } }))] }), description && _jsx(StyledNodeTempleteContent, { children: description }), additionalData && type.minConnectors > 0 && (_jsx(StyledNodeTemplateFooter, { children: _jsx(MetaList, { metadata: additionalData }) })), references && type.minConnectors < 1 && (_jsx(StyledNodeTemplateFooter, { children: _jsx(MetaList, { metadata: references }) }))] }));
-};
-export const StartNode = ({ type, label }) => {
-    return (_jsxs(Flex, { container: { justify: 'center', direction: 'column' }, children: [_jsx(StyledLabel, { nodeType: type, children: label }), _jsx(StyledCircle, { style: {
-                    '--bg-color': colorMap[type.color]
-                }, tabIndex: 0, "aria-label": label, role: 'button' })] }));
-};
-export const EndNode = ({ type, label }) => {
-    return (_jsxs(Flex, { container: { justify: 'center', direction: 'column' }, children: [_jsx(StyledCircle, { style: {
-                    '--bg-color': colorMap[type.color]
-                }, tabIndex: 0, "aria-label": label, role: 'button' }), _jsx(StyledLabel, { nodeType: type, children: label })] }));
-};
-//# sourceMappingURL=NodeTemplates.js.map

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

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

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

@@ -1,5 +0,0 @@
-import { FC } from 'react';
-import { Node as GraphNode } from './Renderer/Utils/Graph';
-declare const Node: FC<GraphNode>;
-export default Node;
-//# sourceMappingURL=Node.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Node.d.ts","sourceRoot":"","sources":["../../../src/components/FlowModeller/Node.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAiC,MAAM,OAAO,CAAC;AAU1D,OAAO,EAAE,IAAI,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAE3D,QAAA,MAAM,IAAI,EAAE,EAAE,CAAC,SAAS,CAkCtB,CAAC;AAEH,eAAe,IAAI,CAAC"}

package/lib/components/FlowModeller/Node.js

@@ -1,22 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo, useCallback } from 'react';
-import { START_NODETYPE, STOP_NODETYPE } from './Node/Node.types';
-import { DefaultNode, EndNode, StartNode } from './Node/NodeTemplates';
-const Node = memo(props => {
-    const { id, type, label, data, ...restProps } = props;
-    const clickHandler = useCallback((nodeId, e) => {
-        data?.onClick?.(nodeId, e);
-    }, [data?.onClick]);
-    if (!type) {
-        return null;
-    }
-    if (type?.id === START_NODETYPE.id) {
-        return _jsx(StartNode, { id: id, type: type, label: label.toUpperCase() });
-    }
-    if (type?.id === STOP_NODETYPE.id) {
-        return _jsx(EndNode, { id: id, type: type, label: label.toUpperCase() });
-    }
-    return (_jsx(DefaultNode, { ...restProps, id: id, label: label, type: type, onClick: clickHandler, onDelete: data?.onDelete, onActionClick: data?.onActionClick, actions: data?.actions, selected: data.selected }));
-});
-export default Node;
-//# sourceMappingURL=Node.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Node.js","sourceRoot":"","sources":["../../../src/components/FlowModeller/Node.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,IAAI,EAAE,WAAW,EAAc,MAAM,OAAO,CAAC;AAE1D,OAAO,EAIL,cAAc,EACd,aAAa,EACd,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAGvE,MAAM,IAAI,GAAkB,IAAI,CAAC,KAAK,CAAC,EAAE;IACvC,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,SAAS,EAAE,GAC3C,KAAsD,CAAC;IAEzD,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,MAAc,EAAE,CAAa,EAAE,EAAE;QAChC,IAAI,EAAE,OAAO,EAAE,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IAC7B,CAAC,EACD,CAAC,IAAI,EAAE,OAAO,CAAC,CAChB,CAAC;IAEF,IAAI,CAAC,IAAI,EAAE;QACT,OAAO,IAAI,CAAC;KACb;IAED,IAAI,IAAI,EAAE,EAAE,KAAK,cAAc,CAAC,EAAE,EAAE;QAClC,OAAO,KAAC,SAAS,IAAC,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,GAAI,CAAC;KACtE;IACD,IAAI,IAAI,EAAE,EAAE,KAAK,aAAa,CAAC,EAAE,EAAE;QACjC,OAAO,KAAC,OAAO,IAAC,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,WAAW,EAAE,GAAI,CAAC;KACpE;IACD,OAAO,CACL,KAAC,WAAW,OACN,SAAS,EACb,EAAE,EAAE,EAAE,EACN,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,YAA6C,EACtD,QAAQ,EAAE,IAAI,EAAE,QAAQ,EACxB,aAAa,EAAE,IAAI,EAAE,aAAa,EAClC,OAAO,EAAE,IAAI,EAAE,OAAO,EACtB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GACvB,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,IAAI,CAAC","sourcesContent":["import { FC, memo, useCallback, MouseEvent } from 'react';\n\nimport {\n  ModellerNodeComponentProps,\n  NodeComponentData,\n  NodeComponentProps,\n  START_NODETYPE,\n  STOP_NODETYPE\n} from './Node/Node.types';\nimport { DefaultNode, EndNode, StartNode } from './Node/NodeTemplates';\nimport { Node as GraphNode } from './Renderer/Utils/Graph';\n\nconst Node: FC<GraphNode> = memo(props => {\n  const { id, type, label, data, ...restProps } =\n    props as ModellerNodeComponentProps<NodeComponentData>;\n\n  const clickHandler = useCallback(\n    (nodeId: string, e: MouseEvent) => {\n      data?.onClick?.(nodeId, e);\n    },\n    [data?.onClick]\n  );\n\n  if (!type) {\n    return null;\n  }\n\n  if (type?.id === START_NODETYPE.id) {\n    return <StartNode id={id} type={type} label={label.toUpperCase()} />;\n  }\n  if (type?.id === STOP_NODETYPE.id) {\n    return <EndNode id={id} type={type} label={label.toUpperCase()} />;\n  }\n  return (\n    <DefaultNode\n      {...restProps}\n      id={id}\n      label={label}\n      type={type}\n      onClick={clickHandler as NodeComponentProps['onClick']}\n      onDelete={data?.onDelete}\n      onActionClick={data?.onActionClick}\n      actions={data?.actions}\n      selected={data.selected}\n    />\n  );\n});\n\nexport default Node;\n"]}

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

@@ -1,5 +0,0 @@
-import { FC } from 'react';
-import { RendererProps } from './Renderer.types';
-declare const Renderer: FC<RendererProps>;
-export default Renderer;
-//# sourceMappingURL=Renderer.d.ts.map

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

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

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

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

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

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

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

@@ -1,18 +0,0 @@
-import { FC } from 'react';
-import { ConnectorProps, Node, GraphData } from './Utils/Graph';
-import { PlottedGraphConnector, PlottedGraphNode } from './Utils/GraphLayout';
-export interface AddNodeHandlerParams {
-    refType: 'node' | 'connector';
-    refId: string | string[];
-}
-export interface RendererProps {
-    graphData: GraphData<PlottedGraphNode, PlottedGraphConnector>;
-    disableAutoLayout?: boolean;
-    highlights?: {
-        nodes: Record<string, Node>;
-        connectors: Record<string, ConnectorProps>;
-    };
-    connector?: FC<PlottedGraphConnector>;
-    node?: FC<PlottedGraphNode>;
-}
-//# sourceMappingURL=Renderer.types.d.ts.map

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

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

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

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

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

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

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

@@ -1,59 +0,0 @@
-export interface ConnectorProps<T = unknown> {
-    id: string;
-    fromNodeId: string;
-    toNodeId: string;
-    label?: string;
-    data?: T;
-}
-export interface NodeType {
-    minConnectors: number;
-}
-export interface Node<T = unknown> {
-    type?: NodeType;
-    id: string;
-    data?: T;
-    reference?: string;
-}
-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, D2 = unknown> {
-    private nodes;
-    private connectors;
-    private nodeData;
-    private connectorData;
-    private inConnectors;
-    private prevNodesCount;
-    private outConnectors;
-    private nextNodesCount;
-    private nodeCount;
-    private connectorsCount;
-    constructor(graphData?: GraphData<T, U>);
-    getGraphData(): GraphData<T, U>;
-    getNodeCount(): number;
-    getNodes(): T[];
-    addNode(node: T, data?: D1): DirectedGraph;
-    getNode(nodeId: string): T;
-    hasNode(nodeId: string): boolean;
-    deleteNode(nodeId: string, ignoreConnectors?: boolean): DirectedGraph<T, U>;
-    getPrevNodes(nodeId: string): T[];
-    getNextNodes(nodeId: string): T[];
-    getPrevNodesCount(nodeId: string): number;
-    getNextNodesCount(nodeId: string): number;
-    isLeaf(nodeId: string): boolean;
-    getConnectorsCount(): number;
-    getConnectors(): U[];
-    addConnector(connector: U, data?: D2): DirectedGraph<T, U>;
-    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): U[];
-    getOutConnectors(fromNodeId: string, toNodeId?: string): U[];
-    getAllNodeConnectors(nodeId: string): U[] | undefined;
-}
-//# sourceMappingURL=Graph.d.ts.map

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

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