@eccenca/gui-elements 6.1.0 → 22.0.0-rc.6

package/dist/extensions/react-flow/minimap/MiniMap.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { MiniMapProps as ReactFlowMiniMapProps, OnLoadParams } from "react-flow-renderer";
+export interface MiniMapProps extends ReactFlowMiniMapProps {
+    flowInstance?: OnLoadParams;
+    enableNavigation?: boolean;
+}
+/** An improved mini-map for react-flow that supports navigation via the mini-map. */
+export declare const MiniMap: React.MemoExoticComponent<({ flowInstance, enableNavigation, maskColor, ...minimapProps }: MiniMapProps) => JSX.Element>;

package/dist/extensions/react-flow/minimap/MiniMap.js

@@ -0,0 +1,111 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MiniMap = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactFlowRenderer = require("react-flow-renderer");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+let minimapCalcConf = {
+  navigationOn: false,
+  minimapElement: null,
+  flowElement: null
+};
+/** An improved mini-map for react-flow that supports navigation via the mini-map. */
+
+const MiniMap = /*#__PURE__*/(0, _react.memo)(({
+  flowInstance,
+  enableNavigation = false,
+  maskColor = "#ddddddbb",
+  ...minimapProps
+}) => {
+  const minimapWrapper = _react.default.useRef(null);
+
+  (0, _react.useEffect)(() => {
+    const minimapDiv = minimapWrapper.current;
+
+    if (enableNavigation && flowInstance && minimapDiv) {
+      minimapCalcConf = {
+        navigationOn: false,
+        minimapElement: minimapDiv.querySelector(".react-flow__minimap"),
+        flowElement: minimapDiv.closest(".react-flow")
+      };
+    }
+  }, [flowInstance, enableNavigation]); // sets the visible area of the canvas based on mouse movement on the mini-map
+
+  const handleMiniMapMouseMove = event => {
+    var _minimapCalcConf$mini, _minimapCalcConf$mini2;
+
+    const minimapConfig = (_minimapCalcConf$mini = minimapCalcConf.minimapElement) === null || _minimapCalcConf$mini === void 0 ? void 0 : (_minimapCalcConf$mini2 = _minimapCalcConf$mini.getAttribute("viewBox")) === null || _minimapCalcConf$mini2 === void 0 ? void 0 : _minimapCalcConf$mini2.split(" ");
+
+    if (minimapCalcConf.navigationOn && minimapCalcConf.minimapElement && minimapCalcConf.flowElement && flowInstance && minimapConfig) {
+      const minimapBounds = minimapCalcConf.minimapElement.getBoundingClientRect();
+      const canvasBounds = minimapCalcConf.flowElement.getBoundingClientRect();
+      const instanceState = flowInstance.toObject();
+      const minimapCoordinates = {
+        x0: parseInt(minimapConfig[0]),
+        y0: parseInt(minimapConfig[1]),
+        x1: parseInt(minimapConfig[2]) + parseInt(minimapConfig[0]),
+        y1: parseInt(minimapConfig[3]) + parseInt(minimapConfig[1])
+      };
+      const minimapClick = {
+        x: event.clientX - minimapBounds.left,
+        y: event.clientY - minimapBounds.top
+      };
+      const canvasPosition = {
+        x: (minimapCoordinates.x1 - minimapCoordinates.x0) / minimapBounds.width * minimapClick.x * -1 - minimapCoordinates.x0,
+        y: (minimapCoordinates.y1 - minimapCoordinates.y0) / minimapBounds.height * minimapClick.y * -1 - minimapCoordinates.y0
+      };
+      const canvasNewState = {
+        zoom: instanceState.zoom,
+        x: canvasPosition.x * instanceState.zoom + canvasBounds.width / 2,
+        y: canvasPosition.y * instanceState.zoom + canvasBounds.height / 2
+      };
+      flowInstance.setTransform(canvasNewState);
+    }
+  };
+  /**
+      sets the view for the user when clicked and finish navigation
+   **/
+
+
+  const handleMiniMapMouseUp = event => {
+    handleMiniMapMouseMove(event);
+    minimapCalcConf.navigationOn = false;
+  };
+  /**
+      enables the mini-map fake drag effect see "handleMiniMapMouseMove" above.
+   **/
+
+
+  const handleMiniMapMouseDown = event => {
+    if (enableNavigation && flowInstance) {
+      minimapCalcConf.navigationOn = true;
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement("div", {
+    ref: minimapWrapper,
+    onMouseDown: handleMiniMapMouseDown,
+    onMouseUp: handleMiniMapMouseUp,
+    onMouseMove: handleMiniMapMouseMove,
+    onMouseLeave: handleMiniMapMouseUp,
+    style: flowInstance ? {
+      cursor: "grab"
+    } : {}
+  }, /*#__PURE__*/_react.default.createElement(_reactFlowRenderer.MiniMap, (0, _extends2.default)({
+    maskColor: maskColor
+  }, minimapProps)));
+});
+exports.MiniMap = MiniMap;

package/dist/extensions/react-flow/minimap/MiniMap.jsx

@@ -0,0 +1,83 @@
+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;
+};
+import React, { useEffect, memo } from "react";
+import { MiniMap as ReactFlowMiniMap, } from "react-flow-renderer";
+var minimapCalcConf = {
+    navigationOn: false,
+    minimapElement: null,
+    flowElement: null
+};
+/** An improved mini-map for react-flow that supports navigation via the mini-map. */
+export var MiniMap = memo(function (_a) {
+    var flowInstance = _a.flowInstance, _b = _a.enableNavigation, enableNavigation = _b === void 0 ? false : _b, _c = _a.maskColor, maskColor = _c === void 0 ? "#ddddddbb" : _c, minimapProps = __rest(_a, ["flowInstance", "enableNavigation", "maskColor"]);
+    var minimapWrapper = React.useRef(null);
+    useEffect(function () {
+        var minimapDiv = minimapWrapper.current;
+        if (enableNavigation && flowInstance && minimapDiv) {
+            minimapCalcConf = {
+                navigationOn: false,
+                minimapElement: minimapDiv.querySelector(".react-flow__minimap"),
+                flowElement: minimapDiv.closest(".react-flow"),
+            };
+        }
+    }, [flowInstance, enableNavigation]);
+    // sets the visible area of the canvas based on mouse movement on the mini-map
+    var handleMiniMapMouseMove = function (event) {
+        var _a, _b;
+        var minimapConfig = (_b = (_a = minimapCalcConf.minimapElement) === null || _a === void 0 ? void 0 : _a.getAttribute("viewBox")) === null || _b === void 0 ? void 0 : _b.split(" ");
+        if (minimapCalcConf.navigationOn && minimapCalcConf.minimapElement && minimapCalcConf.flowElement && flowInstance && minimapConfig) {
+            var minimapBounds = minimapCalcConf.minimapElement.getBoundingClientRect();
+            var canvasBounds = minimapCalcConf.flowElement.getBoundingClientRect();
+            var instanceState = flowInstance.toObject();
+            var minimapCoordinates = {
+                x0: parseInt(minimapConfig[0]),
+                y0: parseInt(minimapConfig[1]),
+                x1: parseInt(minimapConfig[2]) + parseInt(minimapConfig[0]),
+                y1: parseInt(minimapConfig[3]) + parseInt(minimapConfig[1]),
+            };
+            var minimapClick = {
+                x: event.clientX - minimapBounds.left,
+                y: event.clientY - minimapBounds.top,
+            };
+            var canvasPosition = {
+                x: ((minimapCoordinates.x1 - minimapCoordinates.x0) / minimapBounds.width) * minimapClick.x * -1 -
+                    minimapCoordinates.x0,
+                y: ((minimapCoordinates.y1 - minimapCoordinates.y0) / minimapBounds.height) * minimapClick.y * -1 -
+                    minimapCoordinates.y0,
+            };
+            var canvasNewState = {
+                zoom: instanceState.zoom,
+                x: canvasPosition.x * instanceState.zoom + canvasBounds.width / 2,
+                y: canvasPosition.y * instanceState.zoom + canvasBounds.height / 2,
+            };
+            flowInstance.setTransform(canvasNewState);
+        }
+    };
+    /**
+        sets the view for the user when clicked and finish navigation
+     **/
+    var handleMiniMapMouseUp = function (event) {
+        handleMiniMapMouseMove(event);
+        minimapCalcConf.navigationOn = false;
+    };
+    /**
+        enables the mini-map fake drag effect see "handleMiniMapMouseMove" above.
+     **/
+    var handleMiniMapMouseDown = function (event) {
+        if (enableNavigation && flowInstance) {
+            minimapCalcConf.navigationOn = true;
+        }
+    };
+    return (<div ref={minimapWrapper} onMouseDown={handleMiniMapMouseDown} onMouseUp={handleMiniMapMouseUp} onMouseMove={handleMiniMapMouseMove} onMouseLeave={handleMiniMapMouseUp} style={flowInstance ? { cursor: "grab" } : {}}>
+            <ReactFlowMiniMap maskColor={maskColor} {...minimapProps}/>
+        </div>);
+});

package/dist/extensions/react-flow/minimap/utils.d.ts

@@ -0,0 +1,2 @@
+export declare const minimapNodeClassName: (node: any) => string;
+export declare const minimapNodeColor: (node: any) => any;

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

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.minimapNodeColor = exports.minimapNodeClassName = void 0;
+
+var _constants = require("./../../../configuration/constants");
+
+var _NodeDefault = require("./../nodes/NodeDefault");
+
+const minimapNodeClassName = node => {
+  var _node$data, _node$data2, _node$data2$style;
+
+  const typeClass = `${_constants.CLASSPREFIX}-graphviz__minimap__node--` + node.type;
+  const stateClass = (_node$data = node.data) !== null && _node$data !== void 0 && _node$data.highlightedState ? (0, _NodeDefault.gethighlightedStateClasses)(node.data.highlightedState, `${_constants.CLASSPREFIX}-graphviz__minimap__node`) : "";
+  const customColor = (_node$data2 = node.data) !== null && _node$data2 !== void 0 && (_node$data2$style = _node$data2.style) !== null && _node$data2$style !== void 0 && _node$data2$style.borderColor ? `${_constants.CLASSPREFIX}-graphviz__minimap__node--customcolor` : "";
+  return typeClass + (stateClass ? " " + stateClass : "") + (customColor ? " " + customColor : "");
+};
+
+exports.minimapNodeClassName = minimapNodeClassName;
+
+const minimapNodeColor = node => {
+  var _node$data3, _node$data3$style;
+
+  return ((_node$data3 = node.data) === null || _node$data3 === void 0 ? void 0 : (_node$data3$style = _node$data3.style) === null || _node$data3$style === void 0 ? void 0 : _node$data3$style.borderColor) ?? "";
+};
+
+exports.minimapNodeColor = minimapNodeColor;

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

@@ -0,0 +1,56 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NodeContentExtension = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _constants = require("../../../configuration/constants");
+
+var _IconButton = _interopRequireDefault(require("../../../components/Icon/IconButton"));
+
+/**
+ * Displays an content area that can be attached to `NodeContent` elements.
+ */
+const NodeContentExtension = ({
+  children,
+  isExpanded = false,
+  onToggle = undefined,
+  actionButtons,
+  tooltipExpand = "Show more",
+  tooltipReduce = "Show less",
+  // other props for DOM element
+  ...otherProps
+}) => {
+  // always expand element if there is no handler to manage it
+  const expanded = onToggle ? isExpanded : true;
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({}, otherProps, {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__extension` + (expanded ? ` ${_constants.CLASSPREFIX}-graphviz__node__extension--expanded` : "")
+  }), !expanded && onToggle && /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__extension-expandbutton`,
+    name: "item-vertmenu",
+    text: tooltipExpand,
+    onClick: e => {
+      onToggle(e, expanded);
+    }
+  }), expanded && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__extension-body`
+  }, children), /*#__PURE__*/_react.default.createElement("div", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__extension-actions`
+  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__extension-reducebutton`,
+    name: "toggler-showless",
+    text: tooltipReduce,
+    onClick: onToggle ? e => {
+      onToggle(e, expanded);
+    } : undefined
+  }), actionButtons)));
+};
+
+exports.NodeContentExtension = NodeContentExtension;

package/dist/extensions/react-flow/nodes/NodeDefault.d.ts

@@ -0,0 +1,133 @@
+import React from "react";
+import { NodeProps as ReactFlowNodeProps, Position } from "react-flow-renderer";
+import { HandleProps } from "./../handles/HandleDefault";
+import { ValidIconName } from "../../../components/Icon/canonicalIconNames";
+declare type HighlightingState = "success" | "warning" | "danger" | "match" | "altmatch";
+export interface IHandleProps extends HandleProps {
+    category?: "configuration";
+}
+interface NodeContentData {
+    /**
+     * Name of icon that should be displayed before the node label.
+     * Must be a name from our list of canonical icon names.
+     */
+    iconName?: ValidIconName;
+    /**
+     * Valid and accessible URL or `data-uri` for an image that should be displayed before the node label.
+     */
+    depiction?: string;
+    /**
+     * Label that is displayed in the node header.
+     */
+    label: string;
+    /**
+     * Content element, displayed in the node body.
+     */
+    content?: React.ReactNode;
+    /**
+     * Content extension, displayed at the bottom side of a node.
+     */
+    contentExtension?: React.ReactNode;
+}
+export interface NodeContentProps<T> extends NodeContentData, React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Size of the node.
+     * If `minimalShape` is not set to `none`then the configured size definition is only used for the selected node state.
+     */
+    size?: "tiny" | "small" | "medium" | "large";
+    /**
+     * Defines if the node is initially displayed within a very small shape.
+     * If not set to `none` then the node is only displayed in normal size when it is selected.
+     */
+    minimalShape?: "none" | "circular" | "rectangular";
+    /**
+     * Set the type of used highlights to mark the node.
+     */
+    highlightedState?: HighlightingState | HighlightingState[];
+    /**
+     * Text used for tooltip used on icon and depiction.
+     */
+    typeLabel?: string;
+    /**
+     * If `executionButtons` content is included or not.
+     * It is displayed in the node header between label and menu.
+     */
+    showExecutionButtons?: boolean;
+    /**
+     * Set of defined buttons and icons that can be displayed.
+     */
+    executionButtons?: () => React.ReactNode;
+    /**
+     * Can be used for permanent action button or context menu.
+     * It is displayed at the node header right to the label.
+     */
+    menuButtons?: React.ReactNode;
+    /**
+     * Array of property definition objects for `Handle` components that need to be created for the node.
+     * @see https://reactflow.dev/docs/api/handle/
+     */
+    handles?: IHandleProps[];
+    /**
+     * Set the minimal number of handles on left or right side of the node to activate the recalculation of the minimal height of the node.
+     */
+    adaptHeightForHandleMinCount?: number;
+    /**
+     * Height per handle in px (without the unit) used for minimal height calculation of the node.
+     */
+    adaptSizeIncrement?: number;
+    /**
+     * Callback function to provide content for the tooltip on a node with a defined `minimalShape`.
+     * If you do not want a tooltip in this state you need to provide a callback that returns an empty value.
+     */
+    getMinimalTooltipData?: (node: NodeProps<T>) => NodeContentData;
+    /**
+     * Set if a handle is displayed even if it does not allow a connection to an edge.
+     */
+    showUnconnectableHandles?: boolean;
+    /**
+     * The node is displayed with some animated shadow for highlighting purposes.
+     */
+    animated?: boolean;
+    /** Additional data stored in the node. */
+    businessData?: T;
+    /**
+     * This property is only forwarded from the `NodeDefault` element.
+     * If set then it will be always overwritten internally.
+     */
+    targetPosition?: typeof Position[keyof typeof Position];
+    /**
+     * This property is only forwarded from the `NodeDefault` element.
+     * If set then it will be always overwritten internally.
+     */
+    sourcePosition?: typeof Position[keyof typeof Position];
+    /**
+     * This property is only forwarded from the `NodeDefault` element.
+     * If set then it will be always overwritten internally.
+     */
+    isConnectable?: boolean;
+    /**
+     * This property is only forwarded from the `NodeDefault` element.
+     * If set then it will be always overwritten internally.
+     */
+    selected?: boolean;
+}
+export interface NodeProps<T> extends ReactFlowNodeProps {
+    /**
+     * Contains all properties for our implementation of the React-Flow node.
+     * For details pls see the `NodeContent` element documentation.
+     */
+    data: NodeContentProps<T>;
+}
+export declare const gethighlightedStateClasses: (state: any, baseClassName: any) => any;
+/**
+ * The `NodeDefault` element manages the display of React-Flow nodes.
+ * This element cannot be used directly, it must be connected via a `nodeTypes` definition and all properties need to be routed through the `elements` property items inside the `ReactFlow` container.
+ * @see https://reactflow.dev/docs/api/nodes/
+ */
+export declare const NodeDefault: React.MemoExoticComponent<(node: NodeProps<any>) => JSX.Element>;
+/**
+ * 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.
+ */
+export declare const NodeContent: ({ iconName, depiction, typeLabel, label, showExecutionButtons, executionButtons, menuButtons, content, contentExtension, size, minimalShape, highlightedState, handles, adaptHeightForHandleMinCount, adaptSizeIncrement, getMinimalTooltipData, style, showUnconnectableHandles, animated, targetPosition, sourcePosition, isConnectable, selected, businessData, ...otherProps }: NodeContentProps<any>) => JSX.Element;
+export {};

package/dist/extensions/react-flow/nodes/NodeDefault.js

@@ -0,0 +1,223 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.gethighlightedStateClasses = exports.NodeDefault = exports.NodeContent = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _reactFlowRenderer = require("react-flow-renderer");
+
+var _constants = require("../../../configuration/constants");
+
+var _index = require("../../../index");
+
+var _HandleDefault = require("./../handles/HandleDefault");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const defaultHandles = [{
+  type: "target"
+}, {
+  type: "source"
+}];
+
+const MemoHandler = /*#__PURE__*/_react.default.memo(props => /*#__PURE__*/_react.default.createElement(_HandleDefault.HandleDefault, props), (prev, next) => {
+  const styleHasChanged = prev.style[prev.posdirection] === next.style[next.posdirection];
+  return styleHasChanged;
+});
+
+const addHandles = (handles, position, posDirection, isConnectable, nodeStyle) => {
+  return handles[position].map((handle, idx) => {
+    const {
+      className,
+      style = {},
+      category
+    } = handle;
+    const styleAdditions = {
+      color: nodeStyle.borderColor ?? undefined
+    };
+    styleAdditions[posDirection] = 100 / (handles[position].length + 1) * (idx + 1) + "%";
+    const handleProperties = { ...handle,
+      ...{
+        position: handle.position ?? position,
+        style: { ...style,
+          ...styleAdditions
+        },
+        posdirection: posDirection,
+        isConnectable: typeof handle.isConnectable !== "undefined" ? handle.isConnectable : isConnectable,
+        className: !!category ? (className ? className + " " : "") + gethighlightedStateClasses(category, `${_constants.CLASSPREFIX}-graphviz__handle`) : className
+      }
+    };
+    return /*#__PURE__*/_react.default.createElement(MemoHandler, (0, _extends2.default)({}, handleProperties, {
+      key: "handle" + idx
+    }));
+  });
+};
+
+const getDefaultMinimalTooltipData = node => {
+  var _node$data, _node$data2, _node$data3, _node$data4;
+
+  return {
+    label: (_node$data = node.data) === null || _node$data === void 0 ? void 0 : _node$data.label,
+    content: (_node$data2 = node.data) === null || _node$data2 === void 0 ? void 0 : _node$data2.content,
+    iconName: (_node$data3 = node.data) === null || _node$data3 === void 0 ? void 0 : _node$data3.iconName,
+    depiction: (_node$data4 = node.data) === null || _node$data4 === void 0 ? void 0 : _node$data4.depiction
+  };
+};
+
+const imgWithTooltip = (imgEl, tooltipText) => {
+  if (!!tooltipText) {
+    return /*#__PURE__*/_react.default.createElement(_index.Tooltip, {
+      content: tooltipText
+    }, /*#__PURE__*/_react.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(' ');
+};
+/**
+ * The `NodeDefault` element manages the display of React-Flow nodes.
+ * This element cannot be used directly, it must be connected via a `nodeTypes` definition and all properties need to be routed through the `elements` property items inside the `ReactFlow` container.
+ * @see https://reactflow.dev/docs/api/nodes/
+ */
+
+
+exports.gethighlightedStateClasses = gethighlightedStateClasses;
+const NodeDefault = /*#__PURE__*/(0, _react.memo)(node => {
+  const {
+    data,
+    targetPosition = _reactFlowRenderer.Position.Left,
+    sourcePosition = _reactFlowRenderer.Position.Right,
+    isConnectable = true,
+    selected
+  } = node;
+
+  const nodeEl = /*#__PURE__*/_react.default.createElement(NodeContent, (0, _extends2.default)({}, data, {
+    targetPosition,
+    sourcePosition,
+    isConnectable,
+    selected
+  }));
+
+  if (!selected && (data === null || data === void 0 ? void 0 : data.minimalShape) !== "none" && !!(data !== null && data !== void 0 && data.getMinimalTooltipData)) {
+    const tooltipData = data === null || data === void 0 ? void 0 : data.getMinimalTooltipData(node);
+
+    if (!!tooltipData.label || !!tooltipData.content) {
+      return /*#__PURE__*/_react.default.createElement(_index.Tooltip, {
+        content: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, tooltipData.label && /*#__PURE__*/_react.default.createElement("div", null, tooltipData.label), tooltipData.content && /*#__PURE__*/_react.default.createElement("div", null, tooltipData.content))
+      }, nodeEl);
+    }
+  }
+
+  return nodeEl;
+});
+/**
+ * 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.
+ */
+
+exports.NodeDefault = NodeDefault;
+
+const NodeContent = ({
+  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 = _reactFlowRenderer.Position.Left,
+  sourcePosition = _reactFlowRenderer.Position.Right,
+  isConnectable = true,
+  selected,
+  // businessData is just being ignored
+  businessData,
+  // other props for DOM element
+  ...otherProps
+}) => {
+  const handleStack = {};
+  handleStack[_reactFlowRenderer.Position.Top] = [];
+  handleStack[_reactFlowRenderer.Position.Right] = [];
+  handleStack[_reactFlowRenderer.Position.Bottom] = [];
+  handleStack[_reactFlowRenderer.Position.Left] = [];
+
+  if (handles.length > 0) {
+    handles.forEach(handle => {
+      if (!!handle.position) {
+        handleStack[handle.position].push(handle);
+      } else if (handle.category === "configuration") {
+        handleStack[_reactFlowRenderer.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[_reactFlowRenderer.Position.Left].length >= adaptHeightForHandleMinCount || handleStack[_reactFlowRenderer.Position.Right].length >= adaptHeightForHandleMinCount)) {
+    const minHeightLeft = handleStack[_reactFlowRenderer.Position.Left].length * adaptSizeIncrement;
+    const minHeightRight = handleStack[_reactFlowRenderer.Position.Right].length * adaptSizeIncrement;
+    styleExpandDimensions["minHeight"] = Math.max(minHeightLeft, minHeightRight);
+  }
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("section", (0, _extends2.default)({}, otherProps, {
+    style: { ...style,
+      ...styleExpandDimensions
+    },
+    className: `${_constants.CLASSPREFIX}-graphviz__node` + ` ${_constants.CLASSPREFIX}-graphviz__node--${size}` + ` ${_constants.CLASSPREFIX}-graphviz__node--minimal-${minimalShape}` + (!!highlightedState ? " " + gethighlightedStateClasses(highlightedState, `${_constants.CLASSPREFIX}-graphviz__node`) : "") + (animated ? ` ${_constants.CLASSPREFIX}-graphviz__node--animated` : "") + (showUnconnectableHandles === false ? ` ${_constants.CLASSPREFIX}-graphviz__node--hidehandles` : "")
+  }), /*#__PURE__*/_react.default.createElement("header", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__header`
+  }, (!!iconName || !!depiction) && /*#__PURE__*/_react.default.createElement("span", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__header-depiction`
+  }, !!depiction && imgWithTooltip( /*#__PURE__*/_react.default.createElement("img", {
+    src: depiction,
+    alt: ""
+  }), minimalShape === "none" || selected ? typeLabel : undefined), !!iconName && !depiction && /*#__PURE__*/_react.default.createElement(_index.Icon, {
+    name: iconName,
+    tooltipText: minimalShape === "none" || selected ? typeLabel : undefined
+  })), /*#__PURE__*/_react.default.createElement("span", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__header-label`,
+    title: label
+  }, label), (menuButtons || showExecutionButtons && executionButtons) && /*#__PURE__*/_react.default.createElement("span", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__header-menu`
+  }, showExecutionButtons && typeof executionButtons === "function" ? executionButtons() : null, menuButtons ?? null)), content && /*#__PURE__*/_react.default.createElement("div", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__content`
+  }, content), contentExtension && /*#__PURE__*/_react.default.createElement("div", {
+    className: `${_constants.CLASSPREFIX}-graphviz__node__footer`
+  }, contentExtension)), !!handles && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, addHandles(handleStack, _reactFlowRenderer.Position.Top, "left", isConnectable, style), addHandles(handleStack, _reactFlowRenderer.Position.Right, "top", isConnectable, style), addHandles(handleStack, _reactFlowRenderer.Position.Bottom, "left", isConnectable, style), addHandles(handleStack, _reactFlowRenderer.Position.Left, "top", isConnectable, style)));
+};
+
+exports.NodeContent = NodeContent;