@eccenca/gui-elements 22.0.0-rc.7 → 22.1.0-rc.1

package/dist/cjs/extensions/react-flow/edges/getSmoothStepPath.js

@@ -0,0 +1,98 @@
+"use strict";
+/**
+ * Copied from `react-flow` because we need to change there routing.
+ * We use the 10.2.0cversion minus commit 87d518f8b5540a91a3f9c163a2315c2de47abc31
+ * @see https://github.com/wbkd/react-flow/commit/87d518f8b5540a91a3f9c163a2315c2de47abc31
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getSmoothStepPath = void 0;
+const react_flow_renderer_1 = require("react-flow-renderer");
+// These are some helper methods for drawing the round corners
+// The name indicates the direction of the path. "bottomLeftCorner" goes
+// from bottom to the left and "leftBottomCorner" goes from left to the bottom.
+// We have to consider the direction of the paths because of the animated lines.
+const bottomLeftCorner = (x, y, size) => `L ${x},${y - size}Q ${x},${y} ${x + size},${y}`;
+const leftBottomCorner = (x, y, size) => `L ${x + size},${y}Q ${x},${y} ${x},${y - size}`;
+const bottomRightCorner = (x, y, size) => `L ${x},${y - size}Q ${x},${y} ${x - size},${y}`;
+const rightBottomCorner = (x, y, size) => `L ${x - size},${y}Q ${x},${y} ${x},${y - size}`;
+const leftTopCorner = (x, y, size) => `L ${x + size},${y}Q ${x},${y} ${x},${y + size}`;
+const topLeftCorner = (x, y, size) => `L ${x},${y + size}Q ${x},${y} ${x + size},${y}`;
+const topRightCorner = (x, y, size) => `L ${x},${y + size}Q ${x},${y} ${x - size},${y}`;
+const rightTopCorner = (x, y, size) => `L ${x - size},${y}Q ${x},${y} ${x},${y + size}`;
+function getSmoothStepPath({ sourceX, sourceY, sourcePosition = react_flow_renderer_1.Position.Bottom, targetX, targetY, targetPosition = react_flow_renderer_1.Position.Top, borderRadius = 5, centerX, centerY, }) {
+    const [_centerX, _centerY, offsetX, offsetY] = (0, react_flow_renderer_1.getEdgeCenter)({ sourceX, sourceY, targetX, targetY });
+    const cornerWidth = Math.min(borderRadius, Math.abs(targetX - sourceX));
+    const cornerHeight = Math.min(borderRadius, Math.abs(targetY - sourceY));
+    const cornerSize = Math.min(cornerWidth, cornerHeight, offsetX, offsetY);
+    const cX = typeof centerX !== 'undefined' ? centerX : _centerX;
+    const cY = typeof centerY !== 'undefined' ? centerY : _centerY;
+    let firstCornerPath = "";
+    let secondCornerPath = "";
+    if (sourceX <= targetX) {
+        if (sourceY <= targetY) {
+            firstCornerPath = bottomLeftCorner(sourceX, cY, cornerSize);
+            secondCornerPath = rightTopCorner(targetX, cY, cornerSize);
+            if (sourcePosition === react_flow_renderer_1.Position.Right) {
+                if (targetPosition === react_flow_renderer_1.Position.Left) {
+                    firstCornerPath = rightTopCorner(cX, sourceY, cornerSize);
+                    secondCornerPath = bottomLeftCorner(cX, targetY, cornerSize);
+                }
+            }
+            else {
+                if (targetPosition === react_flow_renderer_1.Position.Left) {
+                    // no change
+                }
+            }
+        }
+        else {
+            firstCornerPath = topLeftCorner(sourceX, cY, cornerSize);
+            secondCornerPath = rightBottomCorner(targetX, cY, cornerSize);
+            if (sourcePosition === react_flow_renderer_1.Position.Right) {
+                if (targetPosition === react_flow_renderer_1.Position.Left) {
+                    firstCornerPath = rightBottomCorner(cX, sourceY, cornerSize);
+                    secondCornerPath = topLeftCorner(cX, targetY, cornerSize);
+                }
+            }
+            else {
+                if (targetPosition === react_flow_renderer_1.Position.Left) {
+                    // no change
+                }
+            }
+        }
+    }
+    else {
+        if (sourceY <= targetY) {
+            firstCornerPath = bottomRightCorner(sourceX, cY, cornerSize);
+            secondCornerPath = leftTopCorner(targetX, cY, cornerSize);
+            if (sourcePosition === react_flow_renderer_1.Position.Left) {
+                if (targetPosition === react_flow_renderer_1.Position.Right) {
+                    firstCornerPath = leftTopCorner(cX, sourceY, cornerSize);
+                    secondCornerPath = bottomRightCorner(cX, targetY, cornerSize);
+                }
+            }
+            else {
+                if (targetPosition === react_flow_renderer_1.Position.Right) {
+                    // no change
+                }
+            }
+        }
+        else {
+            firstCornerPath = topRightCorner(sourceX, cY, cornerSize);
+            secondCornerPath = leftBottomCorner(targetX, cY, cornerSize);
+            if (sourcePosition === react_flow_renderer_1.Position.Left) {
+                if (targetPosition === react_flow_renderer_1.Position.Right) {
+                    firstCornerPath = leftBottomCorner(cX, sourceY, cornerSize);
+                    secondCornerPath = topRightCorner(cX, targetY, cornerSize);
+                }
+            }
+            else {
+                if (targetPosition === react_flow_renderer_1.Position.Right) {
+                    // no change
+                }
+            }
+        }
+    }
+    return `M ${sourceX},${sourceY}${firstCornerPath}${secondCornerPath}L ${targetX},${targetY}`;
+}
+exports.getSmoothStepPath = getSmoothStepPath;
+//# sourceMappingURL=getSmoothStepPath.js.map

package/dist/cjs/extensions/react-flow/edges/getSmoothStepPath.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getSmoothStepPath.js","sourceRoot":"","sources":["../../../../../src/extensions/react-flow/edges/getSmoothStepPath.ts"],"names":[],"mappings":"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"}

package/dist/cjs/extensions/react-flow/edges/utils.js

@@ -2,19 +2,112 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.drawEdgeStep = exports.drawEdgeStraight = void 0;
 const react_flow_renderer_1 = require("react-flow-renderer");
-const drawEdgeStraight = ({ sourceX, sourceY, targetX, targetY, }) => {
-    return `M ${sourceX},${sourceY}L ${targetX},${targetY}`;
+const getSmoothStepPath_1 = require("./getSmoothStepPath");
+const posCorrectionEdge = ({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, correctionLength = 7, correctionRadius = 7 }) => {
+    let newSourceX = sourceX;
+    let newSourceY = sourceY;
+    let newTargetX = targetX;
+    let newTargetY = targetY;
+    let startCommandCorrection = `M ${sourceX},${sourceY} `;
+    let endCommandCorrection = ``;
+    if (sourcePosition === react_flow_renderer_1.Position.Left && sourceX < targetX) {
+        newSourceX = newSourceX - 2 * correctionLength;
+        if (sourceY < targetY) {
+            newSourceY = sourceY + correctionRadius;
+            startCommandCorrection = startCommandCorrection + ` L ${newSourceX + correctionRadius},${sourceY} A ${correctionRadius} ${correctionRadius} ${90} ${0} ${0} `;
+        }
+        else {
+            newSourceY = sourceY - correctionRadius;
+            startCommandCorrection = startCommandCorrection + ` L ${newSourceX + correctionRadius},${sourceY} A ${correctionRadius} ${correctionRadius} ${90} ${0} ${1} `;
+        }
+    }
+    if (sourcePosition === react_flow_renderer_1.Position.Right && sourceX > targetX) {
+        newSourceX = targetPosition === react_flow_renderer_1.Position.Right ? newSourceX + correctionLength + correctionRadius : newSourceX + correctionLength;
+        if (sourceY < targetY) {
+            newSourceY = sourceY + correctionRadius;
+            startCommandCorrection = startCommandCorrection + ` L ${newSourceX - correctionRadius},${sourceY} A ${correctionRadius} ${correctionRadius} ${90} ${0} ${1} `;
+        }
+        else {
+            newSourceY = sourceY - correctionRadius;
+            startCommandCorrection = startCommandCorrection + ` L ${newSourceX - correctionRadius},${sourceY} A ${correctionRadius} ${correctionRadius} ${90} ${0} ${0} `;
+        }
+    }
+    if (targetPosition === react_flow_renderer_1.Position.Left && sourceX > targetX) {
+        newTargetX = newTargetX - 3 * correctionLength;
+        if (sourceY < targetY) {
+            newTargetY = targetY - correctionRadius;
+            endCommandCorrection = ` A ${correctionRadius} ${correctionRadius} ${90} ${0} ${0} ${newTargetX + correctionRadius},${targetY} L ${targetX},${targetY}`;
+        }
+        else {
+            newTargetY = targetY + correctionRadius;
+            endCommandCorrection = ` A ${correctionRadius} ${correctionRadius} ${90} ${0} ${1} ${newTargetX + correctionRadius},${targetY} L ${targetX},${targetY}`;
+        }
+    }
+    if (targetPosition === react_flow_renderer_1.Position.Right && sourceX < targetX) {
+        newTargetX = newTargetX + 3 * correctionLength;
+        if (sourceY < targetY) {
+            newTargetY = targetY - correctionRadius;
+            endCommandCorrection = ` A ${correctionRadius} ${correctionRadius} ${90} ${0} ${1} ${newTargetX - correctionRadius},${targetY} L ${targetX},${targetY}`;
+        }
+        else {
+            newTargetY = targetY + correctionRadius;
+            endCommandCorrection = ` A ${correctionRadius} ${correctionRadius} ${90} ${0} ${0} ${newTargetX - correctionRadius},${targetY} L ${targetX},${targetY}`;
+        }
+    }
+    return {
+        newSourceX,
+        newSourceY,
+        newTargetX,
+        newTargetY,
+        startCommandCorrection,
+        endCommandCorrection,
+    };
+};
+const pathCommandCorrection = ({ pathCommand, startCorrection, endCorrection, }) => {
+    return startCorrection + pathCommand.substring(1) + endCorrection;
+};
+const drawEdgeStraight = ({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, }) => {
+    const corrections = posCorrectionEdge({
+        sourceX,
+        sourceY,
+        sourcePosition,
+        targetX,
+        targetY,
+        targetPosition,
+        correctionRadius: 0
+    });
+    const pathCommand = `M ${corrections.newSourceX},${corrections.newSourceY}L ${corrections.newTargetX},${corrections.newTargetY}`;
+    return pathCommandCorrection({
+        pathCommand,
+        startCorrection: corrections.startCommandCorrection,
+        endCorrection: corrections.endCommandCorrection,
+    });
 };
 exports.drawEdgeStraight = drawEdgeStraight;
 const drawEdgeStep = ({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition, data = {}, }) => {
-    return (0, react_flow_renderer_1.getSmoothStepPath)({
+    const corrections = posCorrectionEdge({
         sourceX,
         sourceY,
         sourcePosition,
         targetX,
         targetY,
         targetPosition,
-        borderRadius: data.stepCornerRadius || 10
+        correctionLength: data.stepCornerRadius || 7,
+        correctionRadius: data.stepCornerRadius || 7,
+    });
+    const pathCommand = (0, getSmoothStepPath_1.getSmoothStepPath)({
+        sourceX: corrections.newSourceX,
+        sourceY: corrections.newSourceY,
+        sourcePosition,
+        targetX: corrections.newTargetX,
+        targetY: corrections.newTargetY,
+        targetPosition,
+        borderRadius: data.stepCornerRadius || 7
+    });
+    return pathCommandCorrection({
+        pathCommand,
+        startCorrection: corrections.startCommandCorrection,
+        endCorrection: corrections.endCommandCorrection,
     });
 };
 exports.drawEdgeStep = drawEdgeStep;

package/dist/cjs/extensions/react-flow/edges/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/extensions/react-flow/edges/utils.ts"],"names":[],"mappings":";;;AAEA,6DAAwD;AAEjD,MAAM,gBAAgB,GAAG,CAAC,EAC7B,OAAO,EACP,OAAO,EACP,OAAO,EACP,OAAO,GACQ,EAAE,EAAE;IACnB,OAAO,KAAK,OAAO,IAAI,OAAO,KAAK,OAAO,IAAI,OAAO,EAAE,CAAC;AAC5D,CAAC,CAAA;AAPY,QAAA,gBAAgB,oBAO5B;AAEM,MAAM,YAAY,GAAG,CAAC,EACzB,OAAO,EACP,OAAO,EACP,cAAc,EACd,OAAO,EACP,OAAO,EACP,cAAc,EACd,IAAI,GAAG,EAAE,GACG,EAAE,EAAE;IAChB,OAAO,IAAA,uCAAiB,EAAC;QACrB,OAAO;QACP,OAAO;QACP,cAAc;QACd,OAAO;QACP,OAAO;QACP,cAAc;QACd,YAAY,EAAE,IAAI,CAAC,gBAAgB,IAAI,EAAE;KAC5C,CAAC,CAAC;AACP,CAAC,CAAA;AAlBY,QAAA,YAAY,gBAkBxB"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/extensions/react-flow/edges/utils.ts"],"names":[],"mappings":"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"}

package/dist/cjs/extensions/react-flow/index.js

@@ -1,8 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.minimapNodeColor = exports.minimapNodeClassName = exports.MiniMap = exports.edgeTypes = exports.EdgeTools = exports.EdgeStep = exports.EdgeDefault = exports.nodeTypes = exports.NodeTools = exports.NodeDefault = void 0;
+exports.minimapNodeColor = exports.minimapNodeClassName = exports.MiniMap = exports.edgeTypes = exports.EdgeTools = exports.EdgeStep = exports.EdgeDefault = exports.nodeTypes = exports.NodeTools = exports.NodeContentExtension = exports.NodeContent = exports.NodeDefault = void 0;
 var NodeDefault_1 = require("./nodes/NodeDefault");
 Object.defineProperty(exports, "NodeDefault", { enumerable: true, get: function () { return NodeDefault_1.NodeDefault; } });
+var NodeContent_1 = require("./nodes/NodeContent");
+Object.defineProperty(exports, "NodeContent", { enumerable: true, get: function () { return NodeContent_1.NodeContent; } });
+var NodeContentExtension_1 = require("./nodes/NodeContentExtension");
+Object.defineProperty(exports, "NodeContentExtension", { enumerable: true, get: function () { return NodeContentExtension_1.NodeContentExtension; } });
 var NodeTools_1 = require("./nodes/NodeTools");
 Object.defineProperty(exports, "NodeTools", { enumerable: true, get: function () { return NodeTools_1.NodeTools; } });
 var nodeTypes_1 = require("./nodes/nodeTypes");

package/dist/cjs/extensions/react-flow/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/extensions/react-flow/index.ts"],"names":[],"mappings":";;;AAAA,mDAAkD;AAAzC,0GAAA,WAAW,OAAA;AACpB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,mDAAkD;AAAzC,0GAAA,WAAW,OAAA;AACpB,6CAA4C;AAAnC,oGAAA,QAAQ,OAAA;AACjB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,6CAA4C;AAAnC,kGAAA,OAAO,OAAA;AAChB,yCAAyE;AAAhE,6GAAA,oBAAoB,OAAA;AAAE,yGAAA,gBAAgB,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/extensions/react-flow/index.ts"],"names":[],"mappings":";;;AAAA,mDAAkD;AAAzC,0GAAA,WAAW,OAAA;AACpB,mDAAkD;AAAzC,0GAAA,WAAW,OAAA;AACpB,qEAAoE;AAA3D,4HAAA,oBAAoB,OAAA;AAC7B,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,mDAAkD;AAAzC,0GAAA,WAAW,OAAA;AACpB,6CAA4C;AAAnC,oGAAA,QAAQ,OAAA;AACjB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,+CAA8C;AAArC,sGAAA,SAAS,OAAA;AAClB,6CAA4C;AAAnC,kGAAA,OAAO,OAAA;AAChB,yCAAyE;AAAhE,6GAAA,oBAAoB,OAAA;AAAE,yGAAA,gBAAgB,OAAA"}

package/dist/cjs/extensions/react-flow/minimap/utils.js

@@ -2,11 +2,11 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.minimapNodeColor = exports.minimapNodeClassName = void 0;
 const constants_1 = require("./../../../configuration/constants");
-const NodeDefault_1 = require("./../nodes/NodeDefault");
+const NodeContent_1 = require("./../nodes/NodeContent");
 const minimapNodeClassName = (node) => {
     var _a, _b, _c;
     const typeClass = `${constants_1.CLASSPREFIX}-graphviz__minimap__node--` + node.type;
-    const stateClass = ((_a = node.data) === null || _a === void 0 ? void 0 : _a.highlightedState) ? (0, NodeDefault_1.gethighlightedStateClasses)(node.data.highlightedState, `${constants_1.CLASSPREFIX}-graphviz__minimap__node`) : "";
+    const stateClass = ((_a = node.data) === null || _a === void 0 ? void 0 : _a.highlightedState) ? (0, NodeContent_1.gethighlightedStateClasses)(node.data.highlightedState, `${constants_1.CLASSPREFIX}-graphviz__minimap__node`) : "";
     const customColor = ((_c = (_b = node.data) === null || _b === void 0 ? void 0 : _b.style) === null || _c === void 0 ? void 0 : _c.borderColor) ? `${constants_1.CLASSPREFIX}-graphviz__minimap__node--customcolor` : "";
     return typeClass + (stateClass ? " " + stateClass : "") + (customColor ? " " + customColor : "");
 };

package/dist/cjs/extensions/react-flow/nodes/NodeContent.js

@@ -0,0 +1,141 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NodeContent = exports.gethighlightedStateClasses = void 0;
+const react_1 = __importDefault(require("react"));
+const react_flow_renderer_1 = require("react-flow-renderer");
+const index_1 = require("../../../index");
+const constants_1 = require("../../../configuration/constants");
+const HandleDefault_1 = require("./../handles/HandleDefault");
+const defaultHandles = [
+    { type: "target" },
+    { type: "source" },
+];
+const getDefaultMinimalTooltipData = (node) => {
+    var _a, _b, _c, _d;
+    return {
+        label: (_a = node.data) === null || _a === void 0 ? void 0 : _a.label,
+        content: (_b = node.data) === null || _b === void 0 ? void 0 : _b.content,
+        iconName: (_c = node.data) === null || _c === void 0 ? void 0 : _c.iconName,
+        depiction: (_d = node.data) === null || _d === void 0 ? void 0 : _d.depiction,
+    };
+};
+const addHandles = (handles, position, posDirection, isConnectable, nodeStyle) => {
+    return handles[position].map((handle, idx) => {
+        var _a, _b;
+        const { className, style = {}, category, } = handle;
+        const styleAdditions = {
+            color: (_a = nodeStyle.borderColor) !== null && _a !== void 0 ? _a : undefined
+        };
+        styleAdditions[posDirection] = (100 / (handles[position].length + 1) * (idx + 1)) + "%";
+        const handleProperties = Object.assign(Object.assign({}, handle), {
+            position: (_b = handle.position) !== null && _b !== void 0 ? _b : position,
+            style: Object.assign(Object.assign({}, style), styleAdditions),
+            posdirection: posDirection,
+            isConnectable: typeof handle.isConnectable !== "undefined" ? handle.isConnectable : isConnectable,
+            className: !!category ? (className ? className + " " : "") + (0, exports.gethighlightedStateClasses)(category, `${constants_1.CLASSPREFIX}-graphviz__handle`) : className,
+        });
+        return (react_1.default.createElement(MemoHandler, Object.assign({}, handleProperties, { key: "handle" + idx })));
+    });
+};
+const imgWithTooltip = (imgEl, tooltipText) => {
+    if (!!tooltipText) {
+        return react_1.default.createElement(index_1.Tooltip, { content: tooltipText },
+            react_1.default.createElement("span", null, imgEl));
+    }
+    return imgEl;
+};
+const gethighlightedStateClasses = (state, baseClassName) => {
+    let hightlights = typeof state === "string" ? [state] : state;
+    //@ts-ignore
+    return hightlights.map(item => `${baseClassName}--highlight-${item}`).join(' ');
+};
+exports.gethighlightedStateClasses = gethighlightedStateClasses;
+const MemoHandler = react_1.default.memo((props) => react_1.default.createElement(HandleDefault_1.HandleDefault, Object.assign({}, props)), (prev, next) => {
+    const styleHasChanged = prev.style[prev.posdirection] === next.style[next.posdirection];
+    return styleHasChanged;
+});
+/**
+ * The `NodeContent` element manages the main view of how a node is displaying which content.
+ * This element cannot be used directly, all properties must be routed through the `data` property of an `elements` property item inside the `ReactFlow` container.
+ */
+function NodeContent(_a) {
+    var { iconName, depiction, typeLabel, label, showExecutionButtons = true, executionButtons, menuButtons, content, contentExtension, size = "small", minimalShape = "circular", highlightedState, handles = defaultHandles, adaptHeightForHandleMinCount, adaptSizeIncrement = 15, getMinimalTooltipData = getDefaultMinimalTooltipData, style = {}, showUnconnectableHandles = false, animated = false, 
+    // forwarded props
+    targetPosition = react_flow_renderer_1.Position.Left, sourcePosition = react_flow_renderer_1.Position.Right, isConnectable = true, selected, letPassWheelEvents = false, 
+    // businessData is just being ignored
+    businessData } = _a, 
+    // other props for DOM element
+    otherProps = __rest(_a, ["iconName", "depiction", "typeLabel", "label", "showExecutionButtons", "executionButtons", "menuButtons", "content", "contentExtension", "size", "minimalShape", "highlightedState", "handles", "adaptHeightForHandleMinCount", "adaptSizeIncrement", "getMinimalTooltipData", "style", "showUnconnectableHandles", "animated", "targetPosition", "sourcePosition", "isConnectable", "selected", "letPassWheelEvents", "businessData"]);
+    const [adjustedContentProps, setAdjustedContentProps] = react_1.default.useState({});
+    const handleStack = {};
+    handleStack[react_flow_renderer_1.Position.Top] = [];
+    handleStack[react_flow_renderer_1.Position.Right] = [];
+    handleStack[react_flow_renderer_1.Position.Bottom] = [];
+    handleStack[react_flow_renderer_1.Position.Left] = [];
+    if (handles.length > 0) {
+        handles.forEach(handle => {
+            if (!!handle.position) {
+                handleStack[handle.position].push(handle);
+            }
+            else if (handle.category === "configuration") {
+                handleStack[react_flow_renderer_1.Position.Top].push(handle);
+            }
+            else {
+                if (handle.type === "target") {
+                    handleStack[targetPosition].push(handle);
+                }
+                if (handle.type === "source") {
+                    handleStack[sourcePosition].push(handle);
+                }
+            }
+        });
+    }
+    const styleExpandDimensions = {};
+    if (typeof adaptHeightForHandleMinCount !== "undefined" &&
+        (minimalShape === "none" || !!selected) &&
+        adaptSizeIncrement && (handleStack[react_flow_renderer_1.Position.Left].length >= adaptHeightForHandleMinCount ||
+        handleStack[react_flow_renderer_1.Position.Right].length >= adaptHeightForHandleMinCount)) {
+        const minHeightLeft = handleStack[react_flow_renderer_1.Position.Left].length * adaptSizeIncrement;
+        const minHeightRight = handleStack[react_flow_renderer_1.Position.Right].length * adaptSizeIncrement;
+        styleExpandDimensions["minHeight"] = Math.max(minHeightLeft, minHeightRight);
+    }
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("section", Object.assign({}, otherProps, { style: Object.assign(Object.assign({}, style), styleExpandDimensions), className: `${constants_1.CLASSPREFIX}-graphviz__node` +
+                ` ${constants_1.CLASSPREFIX}-graphviz__node--${size}` +
+                ` ${constants_1.CLASSPREFIX}-graphviz__node--minimal-${minimalShape}` +
+                (!!highlightedState ? " " + (0, exports.gethighlightedStateClasses)(highlightedState, `${constants_1.CLASSPREFIX}-graphviz__node`) : "") +
+                (animated ? ` ${constants_1.CLASSPREFIX}-graphviz__node--animated` : "") +
+                (showUnconnectableHandles === false ? ` ${constants_1.CLASSPREFIX}-graphviz__node--hidehandles` : "") +
+                (letPassWheelEvents === false ? ` nowheel` : "") }),
+            react_1.default.createElement("header", { className: `${constants_1.CLASSPREFIX}-graphviz__node__header` },
+                (!!iconName || !!depiction) && (react_1.default.createElement("span", { className: `${constants_1.CLASSPREFIX}-graphviz__node__header-depiction` },
+                    !!depiction && imgWithTooltip(react_1.default.createElement("img", { src: depiction, alt: "" }), (minimalShape === "none" || selected) ? typeLabel : undefined),
+                    (!!iconName && !depiction) && react_1.default.createElement(index_1.Icon, { name: iconName, tooltipText: (minimalShape === "none" || selected) ? typeLabel : undefined }))),
+                react_1.default.createElement("span", { className: `${constants_1.CLASSPREFIX}-graphviz__node__header-label`, title: label }, label),
+                (menuButtons || (showExecutionButtons && executionButtons)) && (react_1.default.createElement("span", { className: `${constants_1.CLASSPREFIX}-graphviz__node__header-menu` },
+                    (showExecutionButtons && typeof executionButtons === "function") ? executionButtons(adjustedContentProps, setAdjustedContentProps) : null, menuButtons !== null && menuButtons !== void 0 ? menuButtons : null))),
+            content && (react_1.default.createElement("div", { className: `${constants_1.CLASSPREFIX}-graphviz__node__content` }, typeof content === "function" ? content(adjustedContentProps) : content)),
+            react_1.default.createElement("div", { className: `${constants_1.CLASSPREFIX}-graphviz__node__footer` }),
+            contentExtension),
+        !!handles && (react_1.default.createElement(react_1.default.Fragment, null,
+            addHandles(handleStack, react_flow_renderer_1.Position.Top, "left", isConnectable, style),
+            addHandles(handleStack, react_flow_renderer_1.Position.Right, "top", isConnectable, style),
+            addHandles(handleStack, react_flow_renderer_1.Position.Bottom, "left", isConnectable, style),
+            addHandles(handleStack, react_flow_renderer_1.Position.Left, "top", isConnectable, style)))));
+}
+exports.NodeContent = NodeContent;
+//# sourceMappingURL=NodeContent.js.map

package/dist/cjs/extensions/react-flow/nodes/NodeContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeContent.js","sourceRoot":"","sources":["../../../../../src/extensions/react-flow/nodes/NodeContent.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/extensions/react-flow/nodes/NodeContentExtension.js

@@ -0,0 +1,41 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NodeContentExtension = void 0;
+const react_1 = __importDefault(require("react"));
+const constants_1 = require("../../../configuration/constants");
+const IconButton_1 = __importDefault(require("../../../components/Icon/IconButton"));
+/**
+ * Displays an content area that can be attached to `NodeContent` elements.
+ */
+const NodeContentExtension = (_a) => {
+    var { children, slideOutOfNode = false, isExpanded = false, onToggle = undefined, actionButtons, tooltipExpand = "Show more", tooltipReduce = "Show less" } = _a, 
+    // other props for DOM element
+    otherProps = __rest(_a, ["children", "slideOutOfNode", "isExpanded", "onToggle", "actionButtons", "tooltipExpand", "tooltipReduce"]);
+    // always expand element if there is no handler to manage it
+    const expanded = onToggle ? isExpanded : true;
+    return (react_1.default.createElement("div", Object.assign({}, otherProps, { className: `${constants_1.CLASSPREFIX}-graphviz__node__extension` +
+            (slideOutOfNode ? ` ${constants_1.CLASSPREFIX}-graphviz__node__extension--slideout` : "") +
+            (expanded ? ` ${constants_1.CLASSPREFIX}-graphviz__node__extension--expanded` : "") }),
+        !expanded && onToggle && (react_1.default.createElement(IconButton_1.default, { className: `${constants_1.CLASSPREFIX}-graphviz__node__extension-expandbutton`, name: "item-vertmenu", text: tooltipExpand, onClick: (e) => { onToggle(e, expanded); } })),
+        expanded && (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("div", { className: `${constants_1.CLASSPREFIX}-graphviz__node__extension-body` }, children),
+            (!!actionButtons || !!onToggle) && (react_1.default.createElement("div", { className: `${constants_1.CLASSPREFIX}-graphviz__node__extension-actions` },
+                react_1.default.createElement(IconButton_1.default, { className: `${constants_1.CLASSPREFIX}-graphviz__node__extension-reducebutton`, name: "toggler-showless", text: tooltipReduce, onClick: onToggle ? (e) => { onToggle(e, expanded); } : undefined }),
+                actionButtons))))));
+};
+exports.NodeContentExtension = NodeContentExtension;
+//# sourceMappingURL=NodeContentExtension.js.map

package/dist/cjs/extensions/react-flow/nodes/NodeContentExtension.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeContentExtension.js","sourceRoot":"","sources":["../../../../../src/extensions/react-flow/nodes/NodeContentExtension.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,gEAAyE;AACzE,qFAA6D;AAgC7D;;GAEG;AACI,MAAM,oBAAoB,GAAG,CAAC,EAUT,EAAE,EAAE;QAVK,EACjC,QAAQ,EACR,cAAc,GAAG,KAAK,EACtB,UAAU,GAAG,KAAK,EAClB,QAAQ,GAAG,SAAS,EACpB,aAAa,EACb,aAAa,GAAG,WAAW,EAC3B,aAAa,GAAG,WAAW,OAGH;IAFxB,8BAA8B;IAC3B,UAAU,cAToB,2GAUpC,CADgB;IAGb,4DAA4D;IAC5D,MAAM,QAAQ,GAAG,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC;IAE9C,OAAO,CACH,uDACQ,UAAU,IACd,SAAS,EACL,GAAG,uBAAM,4BAA4B;YACrC,CAAC,cAAc,CAAC,CAAC,CAAC,IAAI,uBAAM,sCAAsC,CAAC,CAAC,CAAC,EAAE,CAAC;YACxE,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,uBAAM,sCAAsC,CAAC,CAAC,CAAC,EAAE,CAAC;QAIlE,CAAC,QAAQ,IAAI,QAAQ,IAAI,CACrB,8BAAC,oBAAU,IACP,SAAS,EAAE,GAAG,uBAAM,yCAAyC,EAC7D,IAAI,EAAC,eAAe,EACpB,IAAI,EAAE,aAAa,EACnB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,GAAG,QAAQ,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,GAC5C,CACL;QAGD,QAAQ,IAAI,CACR;YACI,uCAAK,SAAS,EAAE,GAAG,uBAAM,iCAAiC,IACrD,QAAQ,CACP;YACL,CAAC,CAAC,CAAC,aAAa,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAChC,uCAAK,SAAS,EAAE,GAAG,uBAAM,oCAAoC;gBACzD,8BAAC,oBAAU,IACP,SAAS,EAAE,GAAG,uBAAM,yCAAyC,EAC7D,IAAI,EAAC,kBAAkB,EACvB,IAAI,EAAE,aAAa,EACnB,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,GAAG,QAAQ,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,GACnE;gBACD,aAAa,CACZ,CACT,CACF,CACN,CAEH,CACT,CAAC;AACN,CAAC,CAAA;AAxDY,QAAA,oBAAoB,wBAwDhC"}