@hitachivantara/uikit-react-lab 5.20.3 → 5.21.0

package/dist/esm/Flow/Node/{BaseNode.js → BaseNode.mjs}

@@ -5,10 +5,10 @@ import { uid } from "uid";
 import { HvButton, HvTypography } from "@hitachivantara/uikit-react-core";
 import { Delete, Duplicate } from "@hitachivantara/uikit-react-icons";
 import { theme, getColor } from "@hitachivantara/uikit-styles";
-import { useFlowNode, useFlowNodeInputEdges, useFlowNodeOutputEdges } from "../hooks/useFlowNode.js";
-import { useNodeMetaRegistry } from "../FlowContext/NodeMetaContext.js";
-import { useClasses } from "./BaseNode.styles.js";
-import { staticClasses } from "./BaseNode.styles.js";
+import { useFlowNode, useFlowNodeInputEdges, useFlowNodeOutputEdges } from "../hooks/useFlowNode.mjs";
+import { useNodeMetaRegistry } from "../FlowContext/NodeMetaContext.mjs";
+import { useClasses } from "./BaseNode.styles.mjs";
+import { staticClasses } from "./BaseNode.styles.mjs";
 const isInputConnected = (id, type, handleId, edges) => {
   if (type === "target") {
     return edges.some((e) => e.target === id && e.targetHandle === handleId);
@@ -32,6 +32,7 @@ const HvFlowBaseNode = ({
   inputs,
   outputs,
   nodeActions = defaultActions,
+  footer,
   classes: classesProp,
   className,
   children
@@ -145,11 +146,7 @@ const HvFlowBaseNode = ({
                   type: "target",
                   isConnectableStart: false,
                   id: handleId,
-                  position: Position.Left,
-                  style: {
-                    top: "auto",
-                    bottom: (outputs?.length ? 80 : 18) + (outputs?.length || 0) * 29 + 29 * idx
-                  }
+                  position: Position.Left
                 }
               ),
               /* @__PURE__ */ jsx(HvTypography, { children: input.label }),
@@ -168,18 +165,15 @@ const HvFlowBaseNode = ({
                   type: "source",
                   isConnectableEnd: false,
                   id: handleId,
-                  position: Position.Right,
-                  style: {
-                    bottom: -10 + 29 * (outputs.length - idx),
-                    top: "auto"
-                  }
+                  position: Position.Right
                 }
               ),
               output.isMandatory && !isInputConnected(id, "source", handleId, outputEdges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory }),
               /* @__PURE__ */ jsx(HvTypography, { children: output.label })
             ] }, idx);
           }) })
-        ] })
+        ] }),
+        footer && /* @__PURE__ */ jsx("div", { className: classes.footerContainer, children: footer })
       ]
     }
   );
@@ -188,4 +182,4 @@ export {
   HvFlowBaseNode,
   staticClasses as flowBaseNodeClasses
 };
-//# sourceMappingURL=BaseNode.js.map
+//# sourceMappingURL=BaseNode.mjs.map

package/dist/esm/Flow/Node/BaseNode.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseNode.mjs","sources":["../../../../src/Flow/Node/BaseNode.tsx"],"sourcesContent":["import React, { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n  Edge,\n  Handle,\n  NodeProps,\n  NodeToolbar,\n  Position,\n  useReactFlow,\n} from \"reactflow\";\nimport { uid } from \"uid\";\nimport {\n  ExtractNames,\n  HvActionGeneric,\n  HvBaseProps,\n  HvButton,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Delete, Duplicate } from \"@hitachivantara/uikit-react-icons\";\nimport { HvColorAny, getColor, theme } from \"@hitachivantara/uikit-styles\";\n\nimport {\n  HvFlowNodeAction,\n  HvFlowBuiltInActions,\n  HvFlowNodeInput,\n  HvFlowNodeOutput,\n} from \"../types\";\nimport {\n  useFlowNode,\n  useFlowNodeInputEdges,\n  useFlowNodeOutputEdges,\n} from \"../hooks/useFlowNode\";\nimport { useNodeMetaRegistry } from \"../FlowContext/NodeMetaContext\";\nimport { staticClasses, useClasses } from \"./BaseNode.styles\";\n\nexport { staticClasses as flowBaseNodeClasses };\n\nexport type HvFlowBaseNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowBaseNodeProps<T = any>\n  extends Omit<HvBaseProps, \"id\">,\n    NodeProps<T> {\n  /** Header title */\n  title?: string;\n  /** Header icon */\n  icon?: React.ReactNode;\n  /** Header color */\n  color?: HvColorAny;\n  /** Header items */\n  headerItems?: React.ReactNode;\n  /** Node inputs */\n  inputs?: HvFlowNodeInput[];\n  /** Node outputs */\n  outputs?: HvFlowNodeOutput[];\n  /** Node actions */\n  nodeActions?: HvFlowNodeAction[];\n  /** The content of the Node footer */\n  footer?: React.ReactNode;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowBaseNodeClasses;\n}\n\nconst isInputConnected = (\n  id: string,\n  type: \"target\" | \"source\",\n  handleId: string,\n  edges: Edge[]\n) => {\n  if (type === \"target\") {\n    return edges.some((e) => e.target === id && e.targetHandle === handleId);\n  }\n  if (type === \"source\") {\n    return edges.some((e) => e.source === id && e.sourceHandle === handleId);\n  }\n\n  return false;\n};\n\nconst defaultActions: HvFlowBuiltInActions[] = [\n  { id: \"delete\", label: \"Delete\", icon: <Delete /> },\n  { id: \"duplicate\", label: \"Duplicate\", icon: <Duplicate /> },\n];\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n  isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowBaseNode = ({\n  id,\n  title,\n  headerItems,\n  icon,\n  color: colorProp,\n  inputs,\n  outputs,\n  nodeActions = defaultActions,\n  footer,\n  classes: classesProp,\n  className,\n  children,\n}: HvFlowBaseNodeProps<unknown>) => {\n  const { registerNode, unregisterNode } = useNodeMetaRegistry();\n  useEffect(() => {\n    registerNode(id, { label: title || \"\", inputs, outputs });\n    return () => unregisterNode(id);\n  }, [id, title, inputs, outputs, registerNode, unregisterNode]);\n\n  const [showActions, setShowActions] = useState(false);\n  const reactFlowInstance = useReactFlow();\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const node = useFlowNode(id);\n  const inputEdges = useFlowNodeInputEdges(id);\n  const outputEdges = useFlowNodeOutputEdges(id);\n\n  const handleDefaultAction = useCallback(\n    (action: HvFlowNodeAction) => {\n      if (!node) return;\n\n      if (action.callback) {\n        action.callback(node);\n        return;\n      }\n\n      // built-in actions\n      switch (action.id) {\n        case \"delete\":\n          reactFlowInstance.deleteElements({ nodes: [node] });\n          break;\n        case \"duplicate\":\n          reactFlowInstance.addNodes([\n            {\n              ...node,\n              id: uid(),\n              position: {\n                x: node.position.x,\n                y: node.position.y + (node.height || 0) + 20,\n              },\n              selected: false,\n              zIndex: Number(theme.zIndices.overlay),\n            },\n          ]);\n          break;\n        default:\n          break;\n      }\n    },\n    [node, reactFlowInstance]\n  );\n\n  if (!node) return null;\n\n  const color = getColor(colorProp);\n  const iconColor = isValidElement(icon)\n    ? getColor(icon.props.color || \"base_dark\")\n    : getColor(\"base_dark\");\n\n  return (\n    <div\n      className={cx(\n        \"nowheel\", // Disables the default canvas pan behaviour when scrolling inside the node\n        css({ border: `1px solid ${color}` }),\n        classes.root,\n        className\n      )}\n      onMouseEnter={() => setShowActions(true)}\n      onMouseLeave={() => setShowActions(false)}\n    >\n      <NodeToolbar isVisible={showActions} offset={0}>\n        {nodeActions?.map((action) => (\n          <HvButton\n            key={action.id}\n            icon\n            onClick={() => handleDefaultAction(action)}\n          >\n            {renderedIcon(action.icon)}\n          </HvButton>\n        ))}\n      </NodeToolbar>\n      <div\n        className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n      >\n        <div\n          className={cx(\n            classes.titleContainer,\n            css({ \"& svg *.color0\": { fill: iconColor } })\n          )}\n        >\n          {icon}\n          <HvTypography\n            component=\"p\"\n            variant=\"title4\"\n            className={classes.title}\n          >\n            {title}\n          </HvTypography>\n        </div>\n        {headerItems && <div style={{ display: \"flex\" }}>{headerItems}</div>}\n      </div>\n      {children && <div className={classes.contentContainer}>{children}</div>}\n      {inputs && inputs.length > 0 && (\n        <>\n          <div className={classes.inputsTitleContainer}>\n            <HvTypography>Inputs</HvTypography>\n          </div>\n\n          <div className={classes.inputsContainer}>\n            {inputs?.map((input, idx) => {\n              const handleId = input.id ?? idx.toString();\n              return (\n                <div className={classes.inputContainer} key={idx}>\n                  <Handle\n                    type=\"target\"\n                    isConnectableStart={false}\n                    id={handleId}\n                    position={Position.Left}\n                  />\n                  <HvTypography>{input.label}</HvTypography>\n                  {input.isMandatory &&\n                    !isInputConnected(id, \"target\", handleId, inputEdges) && (\n                      <div className={classes.mandatory} />\n                    )}\n                </div>\n              );\n            })}\n          </div>\n        </>\n      )}\n      {outputs && outputs.length > 0 && (\n        <>\n          <div className={classes.outputsTitleContainer}>\n            <HvTypography>Outputs</HvTypography>\n          </div>\n          <div className={classes.outputsContainer}>\n            {outputs?.map((output, idx) => {\n              const handleId = output.id ?? idx.toString();\n              return (\n                <div className={classes.outputContainer} key={idx}>\n                  <Handle\n                    type=\"source\"\n                    isConnectableEnd={false}\n                    id={handleId}\n                    position={Position.Right}\n                  />\n                  {output.isMandatory &&\n                    !isInputConnected(id, \"source\", handleId, outputEdges) && (\n                      <div className={classes.mandatory} />\n                    )}\n                  <HvTypography>{output.label}</HvTypography>\n                </div>\n              );\n            })}\n          </div>\n        </>\n      )}\n      {footer && <div className={classes.footerContainer}>{footer}</div>}\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/Flow/Node/{BaseNode.styles.js → BaseNode.styles.mjs}

@@ -28,16 +28,16 @@ const { staticClasses, useClasses } = createClasses("HvFlowBaseNode", {
     justifyContent: "center",
     padding: theme.space.xs,
     backgroundColor: theme.colors.atmo2,
-    borderTop: `1px solid ${theme.colors.atmo4}`,
-    borderBottom: `1px solid ${theme.colors.atmo4}`
+    borderTop: `1px solid ${theme.colors.atmo3}`,
+    borderBottom: `1px solid ${theme.colors.atmo3}`
   },
   outputsTitleContainer: {
     display: "flex",
     justifyContent: "center",
     padding: theme.space.xs,
     backgroundColor: theme.colors.atmo2,
-    borderTop: `1px solid ${theme.colors.atmo4}`,
-    borderBottom: `1px solid ${theme.colors.atmo4}`
+    borderTop: `1px solid ${theme.colors.atmo3}`,
+    borderBottom: `1px solid ${theme.colors.atmo3}`
   },
   contentContainer: {},
   inputsContainer: {
@@ -57,12 +57,20 @@ const { staticClasses, useClasses } = createClasses("HvFlowBaseNode", {
   inputContainer: {
     display: "flex",
     flexDirection: "row",
-    alignItems: "center"
+    alignItems: "center",
+    position: "relative",
+    "& .react-flow__handle-left": {
+      left: -20
+    }
   },
   outputContainer: {
     display: "flex",
     flexDirection: "row",
-    alignItems: "center"
+    alignItems: "center",
+    position: "relative",
+    "& .react-flow__handle-right": {
+      right: -20
+    }
   },
   mandatory: {
     width: 10,
@@ -70,10 +78,14 @@ const { staticClasses, useClasses } = createClasses("HvFlowBaseNode", {
     margin: theme.spacing(0, theme.space.xs),
     borderRadius: theme.radii.circle,
     backgroundColor: theme.colors.negative_20
+  },
+  footerContainer: {
+    padding: theme.space.sm,
+    borderTop: `1px solid ${theme.colors.atmo3}`
   }
 });
 export {
   staticClasses,
   useClasses
 };
-//# sourceMappingURL=BaseNode.styles.js.map
+//# sourceMappingURL=BaseNode.styles.mjs.map

package/dist/esm/Flow/Node/BaseNode.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseNode.styles.mjs","sources":["../../../../src/Flow/Node/BaseNode.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowBaseNode\", {\n  root: {\n    borderRadius: theme.radii.round,\n    backgroundColor: theme.colors.atmo1,\n    boxShadow: theme.colors.shadow,\n    minWidth: \"250px\",\n  },\n  headerContainer: {\n    padding: theme.spacing(0.5, 1),\n    display: \"flex\",\n    flexDirection: \"row\",\n    justifyContent: \"space-between\",\n    alignItems: \"center\",\n    borderTopLeftRadius: \"inherit\",\n    borderTopRightRadius: \"inherit\",\n  },\n  titleContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  title: {\n    color: theme.colors.base_dark,\n  },\n  inputsTitleContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    padding: theme.space.xs,\n    backgroundColor: theme.colors.atmo2,\n    borderTop: `1px solid ${theme.colors.atmo3}`,\n    borderBottom: `1px solid ${theme.colors.atmo3}`,\n  },\n  outputsTitleContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    padding: theme.space.xs,\n    backgroundColor: theme.colors.atmo2,\n    borderTop: `1px solid ${theme.colors.atmo3}`,\n    borderBottom: `1px solid ${theme.colors.atmo3}`,\n  },\n  contentContainer: {},\n  inputsContainer: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    padding: theme.space.sm,\n    gap: theme.space.xs,\n    alignItems: \"flex-start\",\n  },\n  outputsContainer: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    padding: theme.space.sm,\n    gap: theme.space.xs,\n    alignItems: \"flex-end\",\n  },\n  inputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    position: \"relative\",\n    \"& .react-flow__handle-left\": {\n      left: -20,\n    },\n  },\n  outputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n    position: \"relative\",\n    \"& .react-flow__handle-right\": {\n      right: -20,\n    },\n  },\n  mandatory: {\n    width: 10,\n    height: 10,\n    margin: theme.spacing(0, theme.space.xs),\n    borderRadius: theme.radii.circle,\n    backgroundColor: theme.colors.negative_20,\n  },\n  footerContainer: {\n    padding: theme.space.sm,\n    borderTop: `1px solid ${theme.colors.atmo3}`,\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,kBAAkB;AAAA,EAC3E,MAAM;AAAA,IACJ,cAAc,MAAM,MAAM;AAAA,IAC1B,iBAAiB,MAAM,OAAO;AAAA,IAC9B,WAAW,MAAM,OAAO;AAAA,IACxB,UAAU;AAAA,EACZ;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS,MAAM,QAAQ,KAAK,CAAC;AAAA,IAC7B,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,YAAY;AAAA,IACZ,qBAAqB;AAAA,IACrB,sBAAsB;AAAA,EACxB;AAAA,EACA,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,EACd;AAAA,EACA,OAAO;AAAA,IACL,OAAO,MAAM,OAAO;AAAA,EACtB;AAAA,EACA,sBAAsB;AAAA,IACpB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,SAAS,MAAM,MAAM;AAAA,IACrB,iBAAiB,MAAM,OAAO;AAAA,IAC9B,WAAW,aAAa,MAAM,OAAO,KAAK;AAAA,IAC1C,cAAc,aAAa,MAAM,OAAO,KAAK;AAAA,EAC/C;AAAA,EACA,uBAAuB;AAAA,IACrB,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,SAAS,MAAM,MAAM;AAAA,IACrB,iBAAiB,MAAM,OAAO;AAAA,IAC9B,WAAW,aAAa,MAAM,OAAO,KAAK;AAAA,IAC1C,cAAc,aAAa,MAAM,OAAO,KAAK;AAAA,EAC/C;AAAA,EACA,kBAAkB,CAAC;AAAA,EACnB,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,SAAS,MAAM,MAAM;AAAA,IACrB,KAAK,MAAM,MAAM;AAAA,IACjB,YAAY;AAAA,EACd;AAAA,EACA,kBAAkB;AAAA,IAChB,SAAS;AAAA,IACT,eAAe;AAAA,IACf,SAAS,MAAM,MAAM;AAAA,IACrB,KAAK,MAAM,MAAM;AAAA,IACjB,YAAY;AAAA,EACd;AAAA,EACA,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,8BAA8B;AAAA,MAC5B,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,+BAA+B;AAAA,MAC7B,OAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA,WAAW;AAAA,IACT,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ,MAAM,QAAQ,GAAG,MAAM,MAAM,EAAE;AAAA,IACvC,cAAc,MAAM,MAAM;AAAA,IAC1B,iBAAiB,MAAM,OAAO;AAAA,EAChC;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS,MAAM,MAAM;AAAA,IACrB,WAAW,aAAa,MAAM,OAAO,KAAK;AAAA,EAC5C;AACF,CAAC;"}

package/dist/esm/Flow/Node/{Node.js → Node.mjs}

@@ -2,12 +2,12 @@ import { jsxs, Fragment, jsx } from "@emotion/react/jsx-runtime";
 import { useState, isValidElement } from "react";
 import { HvTooltip, HvButton, HvTypography, HvDropDownMenu } from "@hitachivantara/uikit-react-core";
 import { Info, Up, Down } from "@hitachivantara/uikit-react-icons";
-import { useClasses } from "./Node.styles.js";
-import { staticClasses } from "./Node.styles.js";
-import ParamRenderer from "./Parameters/ParamRenderer.js";
-import { HvFlowBaseNode } from "./BaseNode.js";
-import { useFlowNode } from "../hooks/useFlowNode.js";
-import { useFlowContext } from "../hooks/useFlowContext.js";
+import { useClasses } from "./Node.styles.mjs";
+import { staticClasses } from "./Node.styles.mjs";
+import ParamRenderer from "./Parameters/ParamRenderer.mjs";
+import { HvFlowBaseNode } from "./BaseNode.mjs";
+import { useFlowNode } from "../hooks/useFlowNode.mjs";
+import { useFlowContext } from "../hooks/useFlowContext.mjs";
 const renderedIcon = (actionIcon) => isValidElement(actionIcon) ? actionIcon : actionIcon?.();
 const HvFlowNode = ({
   id,
@@ -108,4 +108,4 @@ export {
   HvFlowNode,
   staticClasses as flowNodeClasses
 };
-//# sourceMappingURL=Node.js.map
+//# sourceMappingURL=Node.mjs.map

package/dist/esm/Flow/Node/Node.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Node.mjs","sources":["../../../../src/Flow/Node/Node.tsx"],"sourcesContent":["import React, { isValidElement, useState } from \"react\";\n\nimport {\n  ExtractNames,\n  HvActionGeneric,\n  HvActionsGenericProps,\n  HvButton,\n  HvButtonProps,\n  HvDropDownMenu,\n  HvTooltip,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks\";\nimport { HvFlowNodeInput, HvFlowNodeOutput, HvFlowNodeParam } from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport {\n  HvFlowBaseNode,\n  HvFlowBaseNodeProps,\n  HvFlowBaseNodeClasses,\n} from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport interface HvFlowNodeClasses\n  extends ExtractNames<typeof useClasses>,\n    HvFlowBaseNodeClasses {}\n\nexport type HvFlowNodeDefaults = {\n  title?: string;\n  subTitle?: string;\n  color?: string;\n  icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any> extends HvFlowBaseNodeProps<T> {\n  /** Node description */\n  description?: string;\n  /** Node actions */\n  actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n  /** Node action callback */\n  actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n  /** Node maximum number of actions visible */\n  maxVisibleActions?: number;\n  /** Node expanded */\n  expanded?: boolean;\n  /** Node parameters */\n  params?: HvFlowNodeParam[];\n  /** A set of node default values for when there are no groups to fetch this data from. */\n  nodeDefaults?: HvFlowNodeDefaults;\n  /** Props to be passed to the expand parameters button. */\n  expandParamsButtonProps?: HvButtonProps;\n  /** Node outputs. */\n  outputs?: HvFlowNodeOutput[];\n  /** Node inputs. */\n  inputs?: HvFlowNodeInput[];\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowNodeClasses;\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n  isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n  id,\n  type,\n  headerItems,\n  description,\n  actions,\n  outputs,\n  inputs,\n  actionCallback,\n  maxVisibleActions = 1,\n  expanded = false,\n  params,\n  nodeDefaults,\n  classes: classesProp,\n  children,\n  expandParamsButtonProps,\n  ...props\n}: HvFlowNodeProps<unknown>) => {\n  const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n\n  const [showParams, setShowParams] = useState(expanded);\n\n  const node = useFlowNode(id);\n\n  const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n\n  const subtitle = nodeTypes?.[type].meta?.label || nodeDefaults?.subTitle;\n  const groupId = nodeTypes?.[type].meta?.groupId;\n\n  const group = (groupId && nodeGroups && nodeGroups[groupId]) || undefined;\n  const groupLabel = group?.label || nodeDefaults?.title;\n  const icon = group?.icon || nodeDefaults?.icon;\n  const color = group?.color || nodeDefaults?.color;\n\n  const actsVisible = actions?.slice(0, maxVisibleActions);\n  const actsDropdown = actions?.slice(maxVisibleActions);\n\n  const hasParams = !!(params && params.length > 0);\n\n  return (\n    <HvFlowBaseNode\n      id={id}\n      type={type}\n      title={groupLabel}\n      icon={icon}\n      color={color}\n      inputs={inputs}\n      outputs={outputs}\n      nodeActions={defaultActions}\n      classes={classesProp as HvFlowBaseNodeClasses}\n      headerItems={\n        <>\n          {headerItems}\n          {description && (\n            <HvTooltip title={description}>\n              <div>\n                <Info color=\"base_dark\" />\n              </div>\n            </HvTooltip>\n          )}\n          {hasParams && (\n            <HvButton\n              icon\n              overrideIconColors={false}\n              onClick={() => setShowParams((p) => !p)}\n              aria-label={showParams ? \"Collapse\" : \"Expand\"}\n              {...expandParamsButtonProps}\n            >\n              {showParams ? (\n                <Up role=\"none\" color=\"base_dark\" />\n              ) : (\n                <Down role=\"none\" color=\"base_dark\" />\n              )}\n            </HvButton>\n          )}\n        </>\n      }\n      {...props}\n    >\n      {(subtitle || actsVisible?.length || actsDropdown?.length) && (\n        <div className={classes.subtitleContainer}>\n          {subtitle && (\n            <div>\n              <HvTypography>{subtitle}</HvTypography>\n            </div>\n          )}\n          <div className={classes.actions}>\n            {actions?.length && actions?.length > 0 && (\n              <>\n                {actsVisible?.map((action) => (\n                  <HvTooltip key={action.id} title={action.label}>\n                    <HvButton\n                      icon\n                      onClick={(event) => {\n                        actionCallback?.(event, id, action);\n                      }}\n                      aria-label={action.label}\n                    >\n                      {renderedIcon(action.icon)}\n                    </HvButton>\n                  </HvTooltip>\n                ))}\n\n                {actsDropdown && actsDropdown.length > 0 && (\n                  <HvDropDownMenu\n                    keepOpened={false}\n                    dataList={actsDropdown?.map((action) => ({\n                      id: action.id,\n                      label: action.label,\n                    }))}\n                    onClick={(event, action) => {\n                      actionCallback?.(event, id, action as HvActionGeneric);\n                    }}\n                  />\n                )}\n              </>\n            )}\n          </div>\n        </div>\n      )}\n      {children}\n      {showParams && params && (\n        <div className={classes.paramsContainer}>\n          <ParamRenderer nodeId={id} params={params} data={node?.data} />\n        </div>\n      )}\n    </HvFlowBaseNode>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/Flow/Node/{Node.styles.js → Node.styles.mjs}

@@ -29,4 +29,4 @@ export {
   staticClasses,
   useClasses
 };
-//# sourceMappingURL=Node.styles.js.map
+//# sourceMappingURL=Node.styles.mjs.map

package/dist/esm/Flow/Node/Node.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Node.styles.mjs","sources":["../../../../src/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\n  subtitleContainer: {\n    minHeight: 48,\n    padding: theme.spacing(\n      theme.space.xs,\n      theme.space.xs,\n      theme.space.xs,\n      theme.space.sm\n    ),\n    display: \"flex\",\n    flexDirection: \"row\",\n    justifyContent: \"space-between\",\n    alignItems: \"center\",\n  },\n  actions: {\n    display: \"flex\",\n    alignItems: \"center\",\n  },\n  paramsContainer: {\n    borderTop: `1px solid ${theme.colors.atmo4}`,\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: theme.space.xs,\n    padding: theme.space.sm,\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,cAAc;AAAA,EACvE,mBAAmB;AAAA,IACjB,WAAW;AAAA,IACX,SAAS,MAAM;AAAA,MACb,MAAM,MAAM;AAAA,MACZ,MAAM,MAAM;AAAA,MACZ,MAAM,MAAM;AAAA,MACZ,MAAM,MAAM;AAAA,IACd;AAAA,IACA,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,YAAY;AAAA,EACd;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,EACd;AAAA,EACA,iBAAiB;AAAA,IACf,WAAW,aAAa,MAAM,OAAO,KAAK;AAAA,IAC1C,SAAS;AAAA,IACT,eAAe;AAAA,IACf,KAAK,MAAM,MAAM;AAAA,IACjB,SAAS,MAAM,MAAM;AAAA,EACvB;AACF,CAAC;"}

package/dist/esm/Flow/Node/Parameters/{ParamRenderer.js → ParamRenderer.mjs}

@@ -1,6 +1,6 @@
 import { jsx, Fragment } from "@emotion/react/jsx-runtime";
-import Text from "./Text.js";
-import Select from "./Select.js";
+import Text from "./Text.mjs";
+import Select from "./Select.mjs";
 const renderers = {
   text: Text,
   select: Select
@@ -17,4 +17,4 @@ const ParamRenderer$1 = ParamRenderer;
 export {
   ParamRenderer$1 as default
 };
-//# sourceMappingURL=ParamRenderer.js.map
+//# sourceMappingURL=ParamRenderer.mjs.map

package/dist/esm/Flow/Node/Parameters/ParamRenderer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParamRenderer.mjs","sources":["../../../../../src/Flow/Node/Parameters/ParamRenderer.tsx"],"sourcesContent":["import { HvFlowNodeParam } from \"../../types\";\nimport Text from \"./Text\";\nimport Select from \"./Select\";\n\nexport type ParamRendererProps = {\n  nodeId: string;\n  params: HvFlowNodeParam[];\n  data: any;\n};\n\nconst renderers = {\n  text: Text,\n  select: Select,\n};\n\nconst ParamRenderer = ({ nodeId, params, data }: ParamRendererProps) => {\n  return (\n    <>\n      {params.map((param, idx) => {\n        const Renderer = renderers[param.type];\n        if (!Renderer) return null;\n\n        return <Renderer key={idx} nodeId={nodeId} param={param} data={data} />;\n        return null;\n      })}\n    </>\n  );\n};\n\nexport default ParamRenderer;\n"],"names":[],"mappings":";;;AAUA,MAAM,YAAY;AAAA,EAChB,MAAM;AAAA,EACN,QAAQ;AACV;AAEA,MAAM,gBAAgB,CAAC,EAAE,QAAQ,QAAQ,WAA+B;AACtE,SAEK,oBAAA,UAAA,EAAA,UAAA,OAAO,IAAI,CAAC,OAAO,QAAQ;AACpB,UAAA,WAAW,UAAU,MAAM,IAAI;AACrC,QAAI,CAAC;AAAiB,aAAA;AAEtB,WAAQ,oBAAA,UAAA,EAAmB,QAAgB,OAAc,QAAnC,GAA+C;AAAA,EAEtE,CAAA,EACH,CAAA;AAEJ;AAEA,MAAA,kBAAe;"}

package/dist/esm/Flow/Node/Parameters/{Select.js → Select.mjs}

@@ -44,4 +44,4 @@ const Select$1 = Select;
 export {
   Select$1 as default
 };
-//# sourceMappingURL=Select.js.map
+//# sourceMappingURL=Select.mjs.map

package/dist/esm/Flow/Node/Parameters/Select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.mjs","sources":["../../../../../src/Flow/Node/Parameters/Select.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { HvDropdown, HvDropdownProps } from \"@hitachivantara/uikit-react-core\";\nimport { useReactFlow } from \"reactflow\";\n\nimport { HvFlowNodeSelectParam } from \"../../types\";\n\ninterface SelectProps {\n  nodeId: string;\n  param: Omit<HvFlowNodeSelectParam, \"type\">;\n  data: any;\n}\n\nconst Select = ({ nodeId, param, data }: SelectProps) => {\n  const { id, label, multiple = false, options } = param;\n\n  const reactFlowInstance = useReactFlow();\n\n  const [opts, setOpts] = useState<string[] | undefined>(\n    data[id] ? (Array.isArray(data[id]) ? data[id] : [data[id]]) : undefined\n  );\n\n  const onSelectChange: HvDropdownProps[\"onChange\"] = (item) => {\n    const nodes = reactFlowInstance.getNodes();\n\n    const newOpts = Array.isArray(item)\n      ? item.map((x) => x.label as string)\n      : (item?.label as string) ?? undefined;\n\n    const newNodes = nodes.map((node) => {\n      if (node.id === nodeId) {\n        node.data = {\n          ...node.data,\n          [id]: newOpts,\n        };\n      }\n      return node;\n    });\n\n    reactFlowInstance.setNodes(newNodes);\n    setOpts(\n      newOpts ? (Array.isArray(newOpts) ? newOpts : [newOpts]) : undefined\n    );\n  };\n\n  return (\n    <HvDropdown\n      className=\"nodrag\" // Prevents dragging within the select field\n      disablePortal\n      label={label}\n      values={options?.map((o) => {\n        return { id: o, label: o, selected: !!opts?.find((opt) => opt === o) };\n      })}\n      onChange={onSelectChange}\n      maxHeight={100}\n      multiSelect={multiple}\n    />\n  );\n};\n\nexport default Select;\n"],"names":[],"mappings":";;;;AAYA,MAAM,SAAS,CAAC,EAAE,QAAQ,OAAO,WAAwB;AACvD,QAAM,EAAE,IAAI,OAAO,WAAW,OAAO,QAAY,IAAA;AAEjD,QAAM,oBAAoB;AAEpB,QAAA,CAAC,MAAM,OAAO,IAAI;AAAA,IACtB,KAAK,EAAE,IAAK,MAAM,QAAQ,KAAK,EAAE,CAAC,IAAI,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,IAAK;AAAA,EAAA;AAG3D,QAAA,iBAA8C,CAAC,SAAS;AACtD,UAAA,QAAQ,kBAAkB;AAEhC,UAAM,UAAU,MAAM,QAAQ,IAAI,IAC9B,KAAK,IAAI,CAAC,MAAM,EAAE,KAAe,IAChC,MAAM,SAAoB;AAE/B,UAAM,WAAW,MAAM,IAAI,CAAC,SAAS;AAC/B,UAAA,KAAK,OAAO,QAAQ;AACtB,aAAK,OAAO;AAAA,UACV,GAAG,KAAK;AAAA,UACR,CAAC,EAAE,GAAG;AAAA,QAAA;AAAA,MAEV;AACO,aAAA;AAAA,IAAA,CACR;AAED,sBAAkB,SAAS,QAAQ;AACnC;AAAA,MACE,UAAW,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,IAAK;AAAA,IAAA;AAAA,EAC7D;AAIA,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa;AAAA,MACb;AAAA,MACA,QAAQ,SAAS,IAAI,CAAC,MAAM;AAC1B,eAAO,EAAE,IAAI,GAAG,OAAO,GAAG,UAAU,CAAC,CAAC,MAAM,KAAK,CAAC,QAAQ,QAAQ,CAAC,EAAE;AAAA,MAAA,CACtE;AAAA,MACD,UAAU;AAAA,MACV,WAAW;AAAA,MACX,aAAa;AAAA,IAAA;AAAA,EAAA;AAGnB;AAEA,MAAA,WAAe;"}

package/dist/esm/Flow/Node/Parameters/{Text.js → Text.mjs}

@@ -31,4 +31,4 @@ const Text$1 = Text;
 export {
   Text$1 as default
 };
-//# sourceMappingURL=Text.js.map
+//# sourceMappingURL=Text.mjs.map

package/dist/esm/Flow/Node/Parameters/Text.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.mjs","sources":["../../../../../src/Flow/Node/Parameters/Text.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { HvInput, HvInputProps } from \"@hitachivantara/uikit-react-core\";\nimport { useReactFlow } from \"reactflow\";\n\nimport { HvFlowNodeTextParam } from \"../../types\";\n\ninterface TextProps {\n  nodeId: string;\n  param: Omit<HvFlowNodeTextParam, \"type\">;\n  data: any;\n}\n\nconst Text = ({ nodeId, param, data }: TextProps) => {\n  const { id, label } = param;\n\n  const reactFlowInstance = useReactFlow();\n\n  const [text, setText] = useState(data[id]);\n\n  const onTextChange: HvInputProps[\"onChange\"] = (event, val) => {\n    const nodes = reactFlowInstance.getNodes();\n\n    const newNodes = nodes.map((node) => {\n      if (node.id === nodeId) {\n        node.data = { ...node.data, [id]: val };\n      }\n      return node;\n    });\n\n    reactFlowInstance.setNodes(newNodes);\n    setText(val);\n  };\n\n  return (\n    <HvInput\n      className=\"nodrag\" // Prevents dragging within the input field\n      label={label}\n      value={text}\n      onChange={onTextChange}\n    />\n  );\n};\n\nexport default Text;\n"],"names":[],"mappings":";;;;AAYA,MAAM,OAAO,CAAC,EAAE,QAAQ,OAAO,WAAsB;AAC7C,QAAA,EAAE,IAAI,MAAU,IAAA;AAEtB,QAAM,oBAAoB;AAE1B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK,EAAE,CAAC;AAEnC,QAAA,eAAyC,CAAC,OAAO,QAAQ;AACvD,UAAA,QAAQ,kBAAkB;AAEhC,UAAM,WAAW,MAAM,IAAI,CAAC,SAAS;AAC/B,UAAA,KAAK,OAAO,QAAQ;AACjB,aAAA,OAAO,EAAE,GAAG,KAAK,MAAM,CAAC,EAAE,GAAG;MACpC;AACO,aAAA;AAAA,IAAA,CACR;AAED,sBAAkB,SAAS,QAAQ;AACnC,YAAQ,GAAG;AAAA,EAAA;AAIX,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV;AAAA,MACA,OAAO;AAAA,MACP,UAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;AAEA,MAAA,SAAe;"}

package/dist/esm/Flow/Sidebar/{Sidebar.js → Sidebar.mjs}

@@ -5,13 +5,13 @@ import { useDroppable, useDndMonitor, DragOverlay } from "@dnd-kit/core";
 import { restrictToWindowEdges } from "@dnd-kit/modifiers";
 import { useLabels, useUniqueId, HvDrawer, HvTypography, HvInput } from "@hitachivantara/uikit-react-core";
 import { Add } from "@hitachivantara/uikit-react-icons";
-import { useClasses } from "./Sidebar.styles.js";
-import { staticClasses } from "./Sidebar.styles.js";
-import { buildGroups } from "./utils.js";
-import { HvFlowSidebarGroup } from "./SidebarGroup/SidebarGroup.js";
-import { HvFlowSidebarGroupItem } from "./SidebarGroup/SidebarGroupItem/SidebarGroupItem.js";
-import { useFlowContext } from "../hooks/useFlowContext.js";
-import { HvFlowDraggableSidebarGroupItem } from "./SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.js";
+import { useClasses } from "./Sidebar.styles.mjs";
+import { staticClasses } from "./Sidebar.styles.mjs";
+import { buildGroups } from "./utils.mjs";
+import { HvFlowSidebarGroup } from "./SidebarGroup/SidebarGroup.mjs";
+import { HvFlowSidebarGroupItem } from "./SidebarGroup/SidebarGroupItem/SidebarGroupItem.mjs";
+import { useFlowContext } from "../hooks/useFlowContext.mjs";
+import { HvFlowDraggableSidebarGroupItem } from "./SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.mjs";
 const DEFAULT_LABELS = {
   itemAriaRoleDescription: "Draggable",
   expandGroupButtonAriaLabel: "Expand group",
@@ -161,4 +161,4 @@ export {
   HvFlowSidebar,
   staticClasses as flowSidebarClasses
 };
-//# sourceMappingURL=Sidebar.js.map
+//# sourceMappingURL=Sidebar.mjs.map

package/dist/esm/Flow/Sidebar/Sidebar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar.mjs","sources":["../../../../src/Flow/Sidebar/Sidebar.tsx"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport debounce from \"lodash/debounce\";\nimport {\n  DndContextProps,\n  DragOverlay,\n  DragOverlayProps,\n  useDndMonitor,\n  useDroppable,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\nimport {\n  ExtractNames,\n  HvDrawer,\n  HvDrawerProps,\n  HvInput,\n  HvInputProps,\n  HvTypography,\n  useLabels,\n  useUniqueId,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Add } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./Sidebar.styles\";\nimport { HvFlowSidebarGroup } from \"./SidebarGroup\";\nimport { useFlowContext } from \"../hooks\";\nimport { buildGroups } from \"./utils\";\nimport {\n  HvFlowDraggableSidebarGroupItem,\n  HvFlowSidebarGroupItem,\n} from \"./SidebarGroup/SidebarGroupItem\";\nimport { HvFlowNodeGroup } from \"../types\";\n\nexport { staticClasses as flowSidebarClasses };\n\nexport type HvFlowSidebarClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarProps\n  extends Omit<HvDrawerProps, \"classes\" | \"title\"> {\n  /** Sidebar title. */\n  title?: string;\n  /** Sidebar description. */\n  description?: string;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowSidebarClasses;\n  /** Labels used on the sidebar. */\n  labels?: {\n    itemAriaRoleDescription?: string;\n    expandGroupButtonAriaLabel?: string;\n    searchPlaceholder?: string;\n    searchAriaLabel?: string;\n  };\n  /**\n   * Dnd Kit drag overlay props for customization.\n   *\n   * More information can be found in the [Dnd Kit documentation](https://docs.dndkit.com/api-documentation/draggable/drag-overlay).\n   */\n  dragOverlayProps?: DragOverlayProps;\n  /** Props to be applied to the default nodes group. */\n  defaultGroupProps?: HvFlowNodeGroup;\n}\n\nconst DEFAULT_LABELS: HvFlowSidebarProps[\"labels\"] = {\n  itemAriaRoleDescription: \"Draggable\",\n  expandGroupButtonAriaLabel: \"Expand group\",\n  searchPlaceholder: \"Search node...\",\n  searchAriaLabel: \"Search node...\",\n};\n\nexport const HvFlowSidebar = ({\n  id,\n  title,\n  description,\n  anchor = \"right\",\n  buttonTitle = \"Close\",\n  classes: classesProp,\n  labels: labelsProps,\n  dragOverlayProps,\n  defaultGroupProps,\n  ...others\n}: HvFlowSidebarProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const { nodeGroups, nodeTypes, setExpandedNodeGroups } = useFlowContext();\n\n  const unfilteredGroups = useMemo(\n    () => buildGroups(nodeGroups, nodeTypes, defaultGroupProps),\n    [nodeGroups, nodeTypes, defaultGroupProps]\n  );\n\n  const [groups, setGroups] = useState(unfilteredGroups);\n  const [ndTypes, setNdTypes] = useState(nodeTypes);\n  const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n  useEffect(() => {\n    setGroups(unfilteredGroups);\n  }, [unfilteredGroups]);\n\n  const labels = useLabels(DEFAULT_LABELS, labelsProps);\n\n  const drawerElementId = useUniqueId(id, \"hvFlowSidebarDrawer\");\n  const groupsElementId = useUniqueId(id, \"hvFlowSidebarGroups\");\n\n  // The sidebar is droppable to distinguish between the canvas and the sidebar\n  // Otherwise items dropped inside the sidebar will be added to the canvas\n  const { setNodeRef } = useDroppable({\n    id: drawerElementId,\n  });\n\n  const handleDragStart: DndContextProps[\"onDragStart\"] = (event) => {\n    if (event.active.data.current?.hvFlow) {\n      setDraggingLabel(event.active.data.current.hvFlow?.label);\n    }\n  };\n\n  const handleDragEnd: DndContextProps[\"onDragEnd\"] = () => {\n    setDraggingLabel(undefined);\n  };\n\n  useDndMonitor({\n    onDragEnd: handleDragEnd,\n    onDragStart: handleDragStart,\n  });\n\n  const handleSearch: HvInputProps[\"onChange\"] = (event, value) => {\n    if (nodeGroups) {\n      const gps = value\n        ? Object.entries(unfilteredGroups).reduce((acc, curr) => {\n            // Filter nodes by search\n            const filteredNodes = curr[1].nodes.filter((obj) =>\n              obj.label.toLocaleLowerCase().includes(value.toLocaleLowerCase())\n            );\n            const nodesCount = filteredNodes.length;\n\n            // Only show groups with nodes\n            if (nodesCount > 0) {\n              acc[curr[0]] = {\n                ...curr[1],\n                nodes: filteredNodes,\n              };\n            }\n\n            return acc;\n          }, {})\n        : unfilteredGroups;\n\n      setGroups(gps);\n      setExpandedNodeGroups?.(value ? Object.keys(gps) : []);\n    } else if (nodeTypes) {\n      const filteredNodeTypes = {};\n      for (const [key, node] of Object.entries(nodeTypes)) {\n        if (\n          node.meta?.label\n            .toLocaleLowerCase()\n            .includes(value.toLocaleLowerCase())\n        ) {\n          filteredNodeTypes[key] = node;\n        }\n      }\n      setNdTypes(value ? filteredNodeTypes : nodeTypes);\n    }\n  };\n\n  const handleDebouncedSearch = debounce(handleSearch, 500);\n\n  return (\n    <HvDrawer\n      BackdropComponent={undefined}\n      variant=\"persistent\"\n      classes={{\n        paper: classes.drawerPaper,\n      }}\n      showBackdrop={false}\n      anchor={anchor}\n      buttonTitle={buttonTitle}\n      {...others}\n    >\n      <div id={drawerElementId} ref={setNodeRef}>\n        <div className={classes.titleContainer}>\n          <Add role=\"none\" />\n          <HvTypography component=\"p\" variant=\"title3\">\n            {title}\n          </HvTypography>\n        </div>\n        <div className={classes.contentContainer}>\n          <HvTypography className={classes.description}>\n            {description}\n          </HvTypography>\n          <HvInput\n            className={classes.searchRoot}\n            type=\"search\"\n            placeholder={labels?.searchPlaceholder}\n            aria-label={labels?.searchAriaLabel}\n            aria-controls={groupsElementId}\n            aria-owns={groupsElementId}\n            onChange={handleDebouncedSearch}\n            inputProps={{ autoComplete: \"off\" }}\n          />\n          {nodeGroups ? (\n            <ul id={groupsElementId} className={classes.groupsContainer}>\n              {Object.entries(groups).map((obj) => {\n                return (\n                  <HvFlowSidebarGroup\n                    key={obj[0]}\n                    id={obj[0]}\n                    expandButtonProps={{\n                      \"aria-label\": labels?.expandGroupButtonAriaLabel,\n                    }}\n                    itemProps={{\n                      \"aria-roledescription\": labels?.itemAriaRoleDescription,\n                    }}\n                    {...obj[1]}\n                  />\n                );\n              })}\n            </ul>\n          ) : (\n            ndTypes &&\n            Object.entries(ndTypes).map((obj) => {\n              return (\n                <HvFlowDraggableSidebarGroupItem\n                  key={obj[0]}\n                  id={obj[0]}\n                  type={obj[0]}\n                  label={obj[1]?.meta?.label || \"\"}\n                  data={obj[1]?.meta?.data}\n                  aria-roledescription={labels?.itemAriaRoleDescription}\n                  className={classes.nodeType}\n                />\n              );\n            })\n          )}\n        </div>\n      </div>\n      <DragOverlay modifiers={[restrictToWindowEdges]} {...dragOverlayProps}>\n        {draggingLabel ? (\n          <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n        ) : null}\n      </DragOverlay>\n    </HvDrawer>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/Flow/Sidebar/{Sidebar.styles.js → Sidebar.styles.mjs}

@@ -25,4 +25,4 @@ export {
   staticClasses,
   useClasses
 };
-//# sourceMappingURL=Sidebar.styles.js.map
+//# sourceMappingURL=Sidebar.styles.mjs.map

package/dist/esm/Flow/Sidebar/Sidebar.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar.styles.mjs","sources":["../../../../src/Flow/Sidebar/Sidebar.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowSidebar\", {\n  drawerPaper: { width: \"360px\" },\n  titleContainer: {\n    display: \"flex\",\n    padding: theme.spacing(\"sm\", \"lg\", \"xs\", \"sm\"),\n  },\n  contentContainer: { padding: theme.spacing(0, \"lg\", \"sm\", \"lg\") },\n  description: { color: theme.colors.secondary_60 },\n  searchRoot: {\n    paddingTop: theme.space.sm,\n    paddingBottom: theme.space.sm,\n  },\n  groupsContainer: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    gap: theme.space.sm,\n    listStyleType: \"none\",\n  },\n  nodeType: {\n    marginBottom: theme.space.xs,\n  },\n});\n"],"names":[],"mappings":";AAEO,MAAM,EAAE,eAAe,eAAe,cAAc,iBAAiB;AAAA,EAC1E,aAAa,EAAE,OAAO,QAAQ;AAAA,EAC9B,gBAAgB;AAAA,IACd,SAAS;AAAA,IACT,SAAS,MAAM,QAAQ,MAAM,MAAM,MAAM,IAAI;AAAA,EAC/C;AAAA,EACA,kBAAkB,EAAE,SAAS,MAAM,QAAQ,GAAG,MAAM,MAAM,IAAI,EAAE;AAAA,EAChE,aAAa,EAAE,OAAO,MAAM,OAAO,aAAa;AAAA,EAChD,YAAY;AAAA,IACV,YAAY,MAAM,MAAM;AAAA,IACxB,eAAe,MAAM,MAAM;AAAA,EAC7B;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,eAAe;AAAA,IACf,KAAK,MAAM,MAAM;AAAA,IACjB,eAAe;AAAA,EACjB;AAAA,EACA,UAAU;AAAA,IACR,cAAc,MAAM,MAAM;AAAA,EAC5B;AACF,CAAC;"}

package/dist/esm/Flow/Sidebar/SidebarGroup/{SidebarGroup.js → SidebarGroup.mjs}

@@ -3,10 +3,10 @@ import { useMemo, useCallback } from "react";
 import { Up, Down } from "@hitachivantara/uikit-react-icons";
 import { HvTypography, HvButton } from "@hitachivantara/uikit-react-core";
 import { getColor } from "@hitachivantara/uikit-styles";
-import { useClasses } from "./SidebarGroup.styles.js";
-import { staticClasses } from "./SidebarGroup.styles.js";
-import { useFlowContext } from "../../hooks/useFlowContext.js";
-import { HvFlowDraggableSidebarGroupItem } from "./SidebarGroupItem/DraggableSidebarGroupItem.js";
+import { useClasses } from "./SidebarGroup.styles.mjs";
+import { staticClasses } from "./SidebarGroup.styles.mjs";
+import { useFlowContext } from "../../hooks/useFlowContext.mjs";
+import { HvFlowDraggableSidebarGroupItem } from "./SidebarGroupItem/DraggableSidebarGroupItem.mjs";
 const HvFlowSidebarGroup = ({
   id,
   label,
@@ -61,4 +61,4 @@ export {
   HvFlowSidebarGroup,
   staticClasses as flowSidebarGroupClasses
 };
-//# sourceMappingURL=SidebarGroup.js.map
+//# sourceMappingURL=SidebarGroup.mjs.map

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarGroup.mjs","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.tsx"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\n\nimport { Down, Up } from \"@hitachivantara/uikit-react-icons\";\nimport {\n  ExtractNames,\n  HvButton,\n  HvButtonProps,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\n\nimport { HvFlowNodeGroup } from \"../../types\";\nimport { staticClasses, useClasses } from \"./SidebarGroup.styles\";\nimport {\n  HvFlowDraggableSidebarGroupItem,\n  HvFlowDraggableSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\nimport { useFlowContext } from \"../../hooks\";\n\nexport { staticClasses as flowSidebarGroupClasses };\n\nexport type HvFlowSidebarGroupClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFlowSidebarGroupNode = {\n  type: string;\n  label: string;\n  data?: unknown;\n};\n\nexport type HvFlowSidebarGroupNodes = HvFlowSidebarGroupNode[];\n\nexport interface HvFlowSidebarGroupProps extends HvFlowNodeGroup {\n  /** Group id. */\n  id: string;\n  /** Group nodes. */\n  nodes: HvFlowSidebarGroupNodes;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowSidebarGroupClasses;\n  /** Expand button props. */\n  expandButtonProps?: HvButtonProps;\n  /** Item group props. */\n  itemProps?: Partial<HvFlowDraggableSidebarGroupItemProps>;\n}\n\nexport const HvFlowSidebarGroup = ({\n  id,\n  label,\n  nodes,\n  color,\n  description,\n  icon,\n  expandButtonProps,\n  classes: classesProp,\n  itemProps,\n}: HvFlowSidebarGroupProps) => {\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { expandedNodeGroups, setExpandedNodeGroups } = useFlowContext();\n\n  const opened = useMemo(\n    () => !!expandedNodeGroups?.find((groupId) => groupId === id),\n    [expandedNodeGroups, id]\n  );\n\n  const handleClick = useCallback(() => {\n    setExpandedNodeGroups?.((prev) =>\n      opened ? prev.filter((groupId) => id !== groupId) : [...prev, id]\n    );\n  }, [id, opened, setExpandedNodeGroups]);\n\n  return (\n    <li className={cx(css({ borderColor: getColor(color) }), classes.root)}>\n      <div className={classes.titleContainer}>\n        <div className={classes.labelContainer}>\n          <div className={classes.icon} role=\"none\">\n            {icon}\n          </div>\n          <HvTypography component=\"p\" variant=\"title4\">\n            {nodes.length > 1 ? `${label} (${nodes.length})` : label}\n          </HvTypography>\n        </div>\n        <HvButton\n          icon\n          onClick={handleClick}\n          aria-expanded={opened}\n          {...expandButtonProps}\n        >\n          {opened ? <Up role=\"none\" /> : <Down role=\"none\" />}\n        </HvButton>\n      </div>\n      {description && (\n        <div className={classes.descriptionContainer}>\n          <HvTypography>{description}</HvTypography>\n        </div>\n      )}\n      {opened && (\n        <div className={classes.itemsContainer}>\n          {nodes.map((obj) => (\n            <HvFlowDraggableSidebarGroupItem\n              key={obj.type}\n              {...itemProps}\n              {...obj}\n            />\n          ))}\n        </div>\n      )}\n    </li>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AA4CO,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AACF,MAA+B;AAC7B,QAAM,EAAE,SAAS,IAAI,IAAI,IAAI,WAAW,WAAW;AAEnD,QAAM,EAAE,oBAAoB,sBAAsB,IAAI,eAAe;AAErE,QAAM,SAAS;AAAA,IACb,MAAM,CAAC,CAAC,oBAAoB,KAAK,CAAC,YAAY,YAAY,EAAE;AAAA,IAC5D,CAAC,oBAAoB,EAAE;AAAA,EAAA;AAGnB,QAAA,cAAc,YAAY,MAAM;AACpC;AAAA,MAAwB,CAAC,SACvB,SAAS,KAAK,OAAO,CAAC,YAAY,OAAO,OAAO,IAAI,CAAC,GAAG,MAAM,EAAE;AAAA,IAAA;AAAA,EAEjE,GAAA,CAAC,IAAI,QAAQ,qBAAqB,CAAC;AAEtC,SACG,qBAAA,MAAA,EAAG,WAAW,GAAG,IAAI,EAAE,aAAa,SAAS,KAAK,EAAE,CAAC,GAAG,QAAQ,IAAI,GACnE,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,MAAC,qBAAA,OAAA,EAAI,WAAW,QAAQ,gBACtB,UAAA;AAAA,QAAA,oBAAC,SAAI,WAAW,QAAQ,MAAM,MAAK,QAChC,UACH,MAAA;AAAA,QACC,oBAAA,cAAA,EAAa,WAAU,KAAI,SAAQ,UACjC,UAAA,MAAM,SAAS,IAAI,GAAG,KAAK,KAAK,MAAM,MAAM,MAAM,OACrD;AAAA,MAAA,GACF;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAI;AAAA,UACJ,SAAS;AAAA,UACT,iBAAe;AAAA,UACd,GAAG;AAAA,UAEH,UAAA,6BAAU,IAAG,EAAA,MAAK,QAAO,IAAK,oBAAC,MAAK,EAAA,MAAK,OAAO,CAAA;AAAA,QAAA;AAAA,MACnD;AAAA,IAAA,GACF;AAAA,IACC,mCACE,OAAI,EAAA,WAAW,QAAQ,sBACtB,UAAA,oBAAC,cAAc,EAAA,UAAA,YAAA,CAAY,EAC7B,CAAA;AAAA,IAED,8BACE,OAAI,EAAA,WAAW,QAAQ,gBACrB,UAAA,MAAM,IAAI,CAAC,QACV;AAAA,MAAC;AAAA,MAAA;AAAA,QAEE,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MAFC,IAAI;AAAA,IAIZ,CAAA,GACH;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

package/dist/esm/Flow/Sidebar/SidebarGroup/{SidebarGroup.styles.js → SidebarGroup.styles.mjs}

@@ -32,4 +32,4 @@ export {
   staticClasses,
   useClasses
 };
-//# sourceMappingURL=SidebarGroup.styles.js.map
+//# sourceMappingURL=SidebarGroup.styles.mjs.map

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarGroup.styles.mjs","sources":["../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroup.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvFlowSidebarGroup\",\n  {\n    root: {\n      padding: theme.space.sm,\n      borderRadius: theme.radii.round,\n      borderWidth: \"1px\",\n      borderTopWidth: \"3px\",\n    },\n    titleContainer: {\n      display: \"flex\",\n      justifyContent: \"space-between\",\n    },\n    labelContainer: {\n      display: \"flex\",\n      alignItems: \"center\",\n    },\n    icon: { paddingRight: theme.space.xs },\n    descriptionContainer: {\n      padding: `${theme.space.xs} 0 ${theme.space.sm} calc(32px + ${theme.space.xs})`,\n    },\n    itemsContainer: {\n      display: \"flex\",\n      flexDirection: \"column\",\n      gap: theme.space.xs,\n      paddingLeft: theme.space.sm,\n    },\n  }\n);\n"],"names":[],"mappings":";AAEa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS,MAAM,MAAM;AAAA,MACrB,cAAc,MAAM,MAAM;AAAA,MAC1B,aAAa;AAAA,MACb,gBAAgB;AAAA,IAClB;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,gBAAgB;AAAA,IAClB;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,YAAY;AAAA,IACd;AAAA,IACA,MAAM,EAAE,cAAc,MAAM,MAAM,GAAG;AAAA,IACrC,sBAAsB;AAAA,MACpB,SAAS,GAAG,MAAM,MAAM,EAAE,MAAM,MAAM,MAAM,EAAE,gBAAgB,MAAM,MAAM,EAAE;AAAA,IAC9E;AAAA,IACA,gBAAgB;AAAA,MACd,SAAS;AAAA,MACT,eAAe;AAAA,MACf,KAAK,MAAM,MAAM;AAAA,MACjB,aAAa,MAAM,MAAM;AAAA,IAC3B;AAAA,EACF;AACF;"}

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/{DraggableSidebarGroupItem.js → DraggableSidebarGroupItem.mjs}

@@ -3,7 +3,7 @@ import { useRef } from "react";
 import { useForkRef } from "@mui/material/utils";
 import { useDraggable } from "@dnd-kit/core";
 import { useUniqueId } from "@hitachivantara/uikit-react-core";
-import { HvFlowSidebarGroupItem } from "./SidebarGroupItem.js";
+import { HvFlowSidebarGroupItem } from "./SidebarGroupItem.mjs";
 const HvFlowDraggableSidebarGroupItem = ({
   id,
   label,
@@ -49,4 +49,4 @@ const HvFlowDraggableSidebarGroupItem = ({
 export {
   HvFlowDraggableSidebarGroupItem
 };
-//# sourceMappingURL=DraggableSidebarGroupItem.js.map
+//# sourceMappingURL=DraggableSidebarGroupItem.mjs.map

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DraggableSidebarGroupItem.mjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/DraggableSidebarGroupItem.tsx"],"sourcesContent":["import { useRef } from \"react\";\n\nimport { useForkRef } from \"@mui/material/utils\";\n\nimport { useDraggable } from \"@dnd-kit/core\";\n\nimport { useUniqueId } from \"@hitachivantara/uikit-react-core\";\n\nimport {\n  HvFlowSidebarGroupItem,\n  HvFlowSidebarGroupItemProps,\n} from \"./SidebarGroupItem\";\n\nexport interface HvFlowDraggableSidebarGroupItemProps\n  extends HvFlowSidebarGroupItemProps {\n  /** Item type. */\n  type: string;\n  /** Item data. */\n  data?: unknown;\n}\n\nexport const HvFlowDraggableSidebarGroupItem = ({\n  id,\n  label,\n  type,\n  data,\n  ...others\n}: HvFlowDraggableSidebarGroupItemProps) => {\n  const itemRef = useRef<HTMLElement>(null);\n\n  const elementId = useUniqueId(id, `hvFlowDraggableItem-${type}`);\n\n  const { attributes, listeners, setNodeRef, isDragging, transform } =\n    useDraggable({\n      id: elementId,\n      data: {\n        hvFlow: {\n          // Needed to know which item is being dragged and dropped\n          type,\n          // Needed for the drag overlay: otherwise the item is cut by the drawer because of overflow\n          label,\n          // Item position: used to position the item when dropped\n          x: itemRef.current?.getBoundingClientRect().x,\n          y: itemRef.current?.getBoundingClientRect().y,\n          // Data\n          data,\n        },\n      },\n    });\n\n  const forkedRef = useForkRef(itemRef, setNodeRef);\n\n  const style = transform\n    ? {\n        transform: `translate3d(${transform.x}px, ${transform.y}px, 0)`,\n      }\n    : undefined;\n\n  return (\n    <HvFlowSidebarGroupItem\n      ref={forkedRef}\n      style={style}\n      label={label}\n      isDragging={isDragging}\n      {...listeners}\n      {...attributes}\n      {...others}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAqBO,MAAM,kCAAkC,CAAC;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA4C;AACpC,QAAA,UAAU,OAAoB,IAAI;AAExC,QAAM,YAAY,YAAY,IAAI,uBAAuB,IAAI,EAAE;AAE/D,QAAM,EAAE,YAAY,WAAW,YAAY,YAAY,cACrD,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,MAAM;AAAA,MACJ,QAAQ;AAAA;AAAA,QAEN;AAAA;AAAA,QAEA;AAAA;AAAA,QAEA,GAAG,QAAQ,SAAS,sBAAwB,EAAA;AAAA,QAC5C,GAAG,QAAQ,SAAS,sBAAwB,EAAA;AAAA;AAAA,QAE5C;AAAA,MACF;AAAA,IACF;AAAA,EAAA,CACD;AAEG,QAAA,YAAY,WAAW,SAAS,UAAU;AAEhD,QAAM,QAAQ,YACV;AAAA,IACE,WAAW,eAAe,UAAU,CAAC,OAAO,UAAU,CAAC;AAAA,EAEzD,IAAA;AAGF,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/{SidebarGroupItem.js → SidebarGroupItem.mjs}

@@ -2,8 +2,8 @@ import { jsxs, jsx } from "@emotion/react/jsx-runtime";
 import { forwardRef } from "react";
 import { HvTypography } from "@hitachivantara/uikit-react-core";
 import { Drag } from "@hitachivantara/uikit-react-icons";
-import { useClasses } from "./SidebarGroupItem.styles.js";
-import { staticClasses } from "./SidebarGroupItem.styles.js";
+import { useClasses } from "./SidebarGroupItem.styles.mjs";
+import { staticClasses } from "./SidebarGroupItem.styles.mjs";
 const HvFlowSidebarGroupItem = forwardRef(
   ({
     label,
@@ -35,4 +35,4 @@ export {
   HvFlowSidebarGroupItem,
   staticClasses as flowSidebarGroupItemClasses
 };
-//# sourceMappingURL=SidebarGroupItem.js.map
+//# sourceMappingURL=SidebarGroupItem.mjs.map

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarGroupItem.mjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport {\n  ExtractNames,\n  HvBaseProps,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Drag } from \"@hitachivantara/uikit-react-icons\";\n\nimport { staticClasses, useClasses } from \"./SidebarGroupItem.styles\";\n\nexport { staticClasses as flowSidebarGroupItemClasses };\n\nexport type HvFlowSidebarGroupItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowSidebarGroupItemProps extends HvBaseProps {\n  /** Item label. */\n  label: string;\n  /** Whether the item is being dragged. */\n  isDragging?: boolean;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowSidebarGroupItemClasses;\n}\n\nexport const HvFlowSidebarGroupItem = forwardRef<\n  HTMLDivElement,\n  HvFlowSidebarGroupItemProps\n>(\n  (\n    {\n      label,\n      isDragging,\n      classes: classesProp,\n      className,\n      ...others\n    }: HvFlowSidebarGroupItemProps,\n    ref\n  ) => {\n    const { classes, cx } = useClasses(classesProp);\n\n    return (\n      <div\n        ref={ref}\n        className={cx(\n          classes.root,\n          { [classes.dragging]: isDragging },\n          className\n        )}\n        {...others}\n      >\n        <HvTypography>{label}</HvTypography>\n        <Drag role=\"none\" />\n      </div>\n    );\n  }\n);\n"],"names":[],"mappings":";;;;;;AAwBO,MAAM,yBAAyB;AAAA,EAIpC,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA,SAAS;AAAA,IACT;AAAA,IACA,GAAG;AAAA,KAEL,QACG;AACH,UAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAG5C,WAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,WAAW;AAAA,UACT,QAAQ;AAAA,UACR,EAAE,CAAC,QAAQ,QAAQ,GAAG,WAAW;AAAA,UACjC;AAAA,QACF;AAAA,QACC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAA,oBAAC,gBAAc,UAAM,MAAA,CAAA;AAAA,UACrB,oBAAC,MAAK,EAAA,MAAK,OAAO,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGxB;AACF;"}

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/{SidebarGroupItem.styles.js → SidebarGroupItem.styles.mjs}

@@ -21,4 +21,4 @@ export {
   staticClasses,
   useClasses
 };
-//# sourceMappingURL=SidebarGroupItem.styles.js.map
+//# sourceMappingURL=SidebarGroupItem.styles.mjs.map

package/dist/esm/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarGroupItem.styles.mjs","sources":["../../../../../../src/Flow/Sidebar/SidebarGroup/SidebarGroupItem/SidebarGroupItem.styles.tsx"],"sourcesContent":["import {\n  createClasses,\n  outlineStyles,\n  theme,\n} from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\n  \"HvFlowSidebarGroupItem\",\n  {\n    root: {\n      display: \"flex\",\n      alignItems: \"center\",\n      justifyContent: \"space-between\",\n      border: `1px solid ${theme.colors.atmo4}`,\n      padding: theme.spacing(0, 0, 0, \"sm\"),\n      cursor: \"pointer\",\n      boxShadow: `0 1px 0 ${theme.colors.shad1}`,\n\n      \"&:focus-visible\": {\n        ...outlineStyles,\n      },\n    },\n    dragging: { borderColor: theme.colors.primary_80 },\n  }\n);\n"],"names":[],"mappings":";AAMa,MAAA,EAAE,eAAe,WAAA,IAAe;AAAA,EAC3C;AAAA,EACA;AAAA,IACE,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,gBAAgB;AAAA,MAChB,QAAQ,aAAa,MAAM,OAAO,KAAK;AAAA,MACvC,SAAS,MAAM,QAAQ,GAAG,GAAG,GAAG,IAAI;AAAA,MACpC,QAAQ;AAAA,MACR,WAAW,WAAW,MAAM,OAAO,KAAK;AAAA,MAExC,mBAAmB;AAAA,QACjB,GAAG;AAAA,MACL;AAAA,IACF;AAAA,IACA,UAAU,EAAE,aAAa,MAAM,OAAO,WAAW;AAAA,EACnD;AACF;"}

package/dist/esm/Flow/Sidebar/{utils.js → utils.mjs}

@@ -40,4 +40,4 @@ const buildGroups = (nodeGroups, nodeTypes, defaultGroupProps) => {
 export {
   buildGroups
 };
-//# sourceMappingURL=utils.js.map
+//# sourceMappingURL=utils.mjs.map

package/dist/esm/Flow/Sidebar/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","sources":["../../../../src/Flow/Sidebar/utils.ts"],"sourcesContent":["import { HvFlowContextValue } from \"../FlowContext\";\nimport { HvFlowNodeGroup } from \"../types\";\nimport {\n  HvFlowSidebarGroupNodes,\n  HvFlowSidebarGroupNode,\n} from \"./SidebarGroup\";\n\ntype NodeGroup = HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes };\n\nexport const buildGroups = (\n  nodeGroups: HvFlowContextValue[\"nodeGroups\"],\n  nodeTypes: HvFlowContextValue[\"nodeTypes\"],\n  defaultGroupProps?: HvFlowNodeGroup\n) => {\n  if (!nodeGroups) return {};\n\n  return Object.entries(nodeGroups).reduce((acc, curr) => {\n    const nodesWithGroupId: HvFlowSidebarGroupNode[] = [];\n    const nodesWithoutGroupId: HvFlowSidebarGroupNode[] = [];\n\n    if (nodeTypes) {\n      for (const [nodeType, node] of Object.entries(nodeTypes)) {\n        if (node.meta?.groupId === curr[0]) {\n          nodesWithGroupId.push({\n            type: nodeType,\n            label: node.meta?.label,\n            data: node.meta?.data,\n          });\n        } else if (!node.meta?.groupId) {\n          nodesWithoutGroupId.push({\n            type: nodeType,\n            label: node.meta?.label || \"\",\n            data: node.meta?.data,\n          });\n        }\n      }\n    }\n\n    acc[curr[0]] = {\n      ...curr[1],\n      nodes: nodesWithGroupId,\n    };\n\n    // Create a \"Default\" group for nodes without a groupId\n    if (nodesWithoutGroupId.length > 0) {\n      acc.Default = {\n        // @ts-ignore\n        name: \"Default\",\n        label: \"Default\",\n        nodes: nodesWithoutGroupId,\n        ...defaultGroupProps,\n      };\n    }\n\n    return acc;\n  }, {} as Record<string, NodeGroup>);\n};\n"],"names":[],"mappings":"AASO,MAAM,cAAc,CACzB,YACA,WACA,sBACG;AACH,MAAI,CAAC;AAAY,WAAO;AAExB,SAAO,OAAO,QAAQ,UAAU,EAAE,OAAO,CAAC,KAAK,SAAS;AACtD,UAAM,mBAA6C,CAAA;AACnD,UAAM,sBAAgD,CAAA;AAEtD,QAAI,WAAW;AACb,iBAAW,CAAC,UAAU,IAAI,KAAK,OAAO,QAAQ,SAAS,GAAG;AACxD,YAAI,KAAK,MAAM,YAAY,KAAK,CAAC,GAAG;AAClC,2BAAiB,KAAK;AAAA,YACpB,MAAM;AAAA,YACN,OAAO,KAAK,MAAM;AAAA,YAClB,MAAM,KAAK,MAAM;AAAA,UAAA,CAClB;AAAA,QACQ,WAAA,CAAC,KAAK,MAAM,SAAS;AAC9B,8BAAoB,KAAK;AAAA,YACvB,MAAM;AAAA,YACN,OAAO,KAAK,MAAM,SAAS;AAAA,YAC3B,MAAM,KAAK,MAAM;AAAA,UAAA,CAClB;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEI,QAAA,KAAK,CAAC,CAAC,IAAI;AAAA,MACb,GAAG,KAAK,CAAC;AAAA,MACT,OAAO;AAAA,IAAA;AAIL,QAAA,oBAAoB,SAAS,GAAG;AAClC,UAAI,UAAU;AAAA;AAAA,QAEZ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,OAAO;AAAA,QACP,GAAG;AAAA,MAAA;AAAA,IAEP;AAEO,WAAA;AAAA,EACT,GAAG,CAA+B,CAAA;AACpC;"}

package/dist/esm/Flow/{base.js → base.mjs}

@@ -409,4 +409,4 @@ const flowStyles = css`
 export {
   flowStyles
 };
-//# sourceMappingURL=base.js.map
+//# sourceMappingURL=base.mjs.map

package/dist/esm/Flow/base.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"base.mjs","sources":["../../../src/Flow/base.ts"],"sourcesContent":["import { css } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const flowStyles = css`\n  /* this gets exported as style.css and can be used for the default theming */\n  /* these are the necessary styles for React Flow, they get used by base.css and style.css */\n  .react-flow__container {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    top: 0;\n    left: 0;\n  }\n  .react-flow__pane {\n    z-index: 1;\n    cursor: -webkit-grab;\n    cursor: grab;\n  }\n  .react-flow__pane.selection {\n    cursor: pointer;\n  }\n  .react-flow__pane.dragging {\n    cursor: -webkit-grabbing;\n    cursor: grabbing;\n  }\n  .react-flow__viewport {\n    transform-origin: 0 0;\n    z-index: 2;\n    pointer-events: none;\n  }\n  .react-flow__renderer {\n    z-index: 4;\n  }\n  .react-flow__selection {\n    z-index: 6;\n  }\n  .react-flow__nodesselection-rect:focus,\n  .react-flow__nodesselection-rect:focus-visible {\n    outline: none;\n  }\n  .react-flow .react-flow__edges {\n    pointer-events: none;\n    overflow: visible;\n  }\n  .react-flow__edge-path,\n  .react-flow__connection-path {\n    stroke: ${theme.colors.secondary};\n    stroke-width: 1;\n    fill: none;\n  }\n  .react-flow__edge {\n    pointer-events: visibleStroke;\n    cursor: pointer;\n  }\n  .react-flow__edge.animated path {\n    stroke-dasharray: 5;\n    -webkit-animation: dashdraw 0.5s linear infinite;\n    animation: dashdraw 0.5s linear infinite;\n  }\n  .react-flow__edge.animated path.react-flow__edge-interaction {\n    stroke-dasharray: none;\n    -webkit-animation: none;\n    animation: none;\n  }\n  .react-flow__edge.inactive {\n    pointer-events: none;\n  }\n  .react-flow__edge.selected,\n  .react-flow__edge:focus,\n  .react-flow__edge:focus-visible {\n    outline: none;\n  }\n  .react-flow__edge.selected .react-flow__edge-path,\n  .react-flow__edge:focus .react-flow__edge-path,\n  .react-flow__edge:focus-visible .react-flow__edge-path {\n    stroke: #555;\n  }\n  .react-flow__edge-textwrapper {\n    pointer-events: all;\n  }\n  .react-flow__edge-textbg {\n    fill: white;\n  }\n  .react-flow__edge .react-flow__edge-text {\n    pointer-events: none;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    user-select: none;\n  }\n  .react-flow__connection {\n    pointer-events: none;\n  }\n  .react-flow__connection .animated {\n    stroke-dasharray: 5;\n    -webkit-animation: dashdraw 0.5s linear infinite;\n    animation: dashdraw 0.5s linear infinite;\n  }\n  .react-flow__connectionline {\n    z-index: 1001;\n  }\n  .react-flow__nodes {\n    pointer-events: none;\n    transform-origin: 0 0;\n  }\n  .react-flow__node {\n    position: absolute;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    user-select: none;\n    pointer-events: all;\n    transform-origin: 0 0;\n    box-sizing: border-box;\n    cursor: -webkit-grab;\n    cursor: grab;\n  }\n  .react-flow__node.dragging {\n    cursor: -webkit-grabbing;\n    cursor: grabbing;\n  }\n  .react-flow__nodesselection {\n    z-index: 3;\n    transform-origin: left top;\n    pointer-events: none;\n  }\n  .react-flow__nodesselection-rect {\n    position: absolute;\n    pointer-events: all;\n    cursor: -webkit-grab;\n    cursor: grab;\n  }\n  .react-flow__handle {\n    position: absolute;\n    pointer-events: none;\n    min-width: 5px;\n    min-height: 5px;\n    width: 6px;\n    height: 6px;\n    background: #1a192b;\n    border: 1px solid white;\n    border-radius: 100%;\n  }\n  .react-flow__handle.connectionindicator {\n    pointer-events: all;\n    cursor: crosshair;\n  }\n  .react-flow__handle-bottom {\n    top: auto;\n    left: 50%;\n    bottom: -4px;\n    transform: translate(-50%, 0);\n  }\n  .react-flow__handle-top {\n    left: 50%;\n    top: -4px;\n    transform: translate(-50%, 0);\n  }\n  .react-flow__handle-left {\n    top: 50%;\n    left: -4px;\n    transform: translate(0, -50%);\n  }\n  .react-flow__handle-right {\n    right: -4px;\n    top: 50%;\n    transform: translate(0, -50%);\n  }\n  .react-flow__edgeupdater {\n    cursor: move;\n    pointer-events: all;\n  }\n  .react-flow__panel {\n    position: absolute;\n    z-index: 5;\n    margin: 15px;\n  }\n  .react-flow__panel.top {\n    top: 0;\n  }\n  .react-flow__panel.bottom {\n    bottom: 0;\n  }\n  .react-flow__panel.left {\n    left: 0;\n  }\n  .react-flow__panel.right {\n    right: 0;\n  }\n  .react-flow__panel.center {\n    left: 50%;\n    transform: translateX(-50%);\n  }\n  .react-flow__attribution {\n    font-size: 10px;\n    background: rgba(255, 255, 255, 0.5);\n    padding: 2px 3px;\n    margin: 0;\n  }\n  .react-flow__attribution a {\n    text-decoration: none;\n    color: #999;\n  }\n  @-webkit-keyframes dashdraw {\n    from {\n      stroke-dashoffset: 10;\n    }\n  }\n  @keyframes dashdraw {\n    from {\n      stroke-dashoffset: 10;\n    }\n  }\n  .react-flow__edgelabel-renderer {\n    position: absolute;\n    width: 100%;\n    height: 100%;\n    pointer-events: none;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    user-select: none;\n  }\n  .react-flow__edge.updating .react-flow__edge-path {\n    stroke: #777;\n  }\n  .react-flow__edge-text {\n    font-size: 10px;\n  }\n  .react-flow__node.selectable:focus,\n  .react-flow__node.selectable:focus-visible {\n    outline: none;\n  }\n  .react-flow__node-default,\n  .react-flow__node-input,\n  .react-flow__node-output,\n  .react-flow__node-group {\n    padding: ${theme.space.sm};\n    border-radius: ${theme.radii.round};\n    width: 150px;\n    color: ${theme.colors.secondary};\n    text-align: center;\n    border: 1px solid ${theme.colors.negative};\n    background-color: ${theme.colors.negative_20};\n  }\n  .react-flow__node-default::before {\n    content: \"Unknown node type\";\n    display: block;\n  }\n  .react-flow__node-default.selectable:hover,\n  .react-flow__node-input.selectable:hover,\n  .react-flow__node-output.selectable:hover,\n  .react-flow__node-group.selectable:hover {\n    box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.08);\n  }\n  .react-flow__node-default.selectable.selected,\n  .react-flow__node-default.selectable:focus,\n  .react-flow__node-default.selectable:focus-visible,\n  .react-flow__node-input.selectable.selected,\n  .react-flow__node-input.selectable:focus,\n  .react-flow__node-input.selectable:focus-visible,\n  .react-flow__node-output.selectable.selected,\n  .react-flow__node-output.selectable:focus,\n  .react-flow__node-output.selectable:focus-visible,\n  .react-flow__node-group.selectable.selected,\n  .react-flow__node-group.selectable:focus,\n  .react-flow__node-group.selectable:focus-visible {\n    box-shadow: 0 0 0 0.5px #1a192b;\n  }\n  .react-flow__node-group {\n    background-color: rgba(240, 240, 240, 0.25);\n  }\n  .react-flow__nodesselection-rect,\n  .react-flow__selection {\n    background: rgba(0, 89, 220, 0.08);\n    border: 1px dotted rgba(0, 89, 220, 0.8);\n  }\n  .react-flow__nodesselection-rect:focus,\n  .react-flow__nodesselection-rect:focus-visible,\n  .react-flow__selection:focus,\n  .react-flow__selection:focus-visible {\n    outline: none;\n  }\n  .react-flow__controls {\n    box-shadow: ${theme.colors.shadow};\n  }\n  .react-flow__controls-button {\n    border: none;\n    background: #fefefe;\n    border-bottom: 1px solid #eee;\n    box-sizing: content-box;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: 16px;\n    height: 16px;\n    cursor: pointer;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    user-select: none;\n    padding: 5px;\n  }\n  .react-flow__controls-button:hover {\n    background: #f4f4f4;\n  }\n  .react-flow__controls-button svg {\n    width: 100%;\n    max-width: 12px;\n    max-height: 12px;\n  }\n  .react-flow__controls-button:disabled {\n    pointer-events: none;\n  }\n  .react-flow__controls-button:disabled svg {\n    fill-opacity: 0.4;\n  }\n  .react-flow__minimap {\n    background-color: #fff;\n  }\n  .react-flow__resize-control {\n    position: absolute;\n  }\n  .react-flow__resize-control.left,\n  .react-flow__resize-control.right {\n    cursor: ew-resize;\n  }\n  .react-flow__resize-control.top,\n  .react-flow__resize-control.bottom {\n    cursor: ns-resize;\n  }\n  .react-flow__resize-control.top.left,\n  .react-flow__resize-control.bottom.right {\n    cursor: nwse-resize;\n  }\n  .react-flow__resize-control.bottom.left,\n  .react-flow__resize-control.top.right {\n    cursor: nesw-resize;\n  }\n  /* handle styles */\n  .react-flow__resize-control.handle {\n    width: 4px;\n    height: 4px;\n    border: 1px solid #fff;\n    border-radius: 1px;\n    background-color: ${theme.colors.primary};\n    transform: translate(-50%, -50%);\n  }\n  .react-flow__resize-control.handle.left {\n    left: 0;\n    top: 50%;\n  }\n  .react-flow__resize-control.handle.right {\n    left: 100%;\n    top: 50%;\n  }\n  .react-flow__resize-control.handle.top {\n    left: 50%;\n    top: 0;\n  }\n  .react-flow__resize-control.handle.bottom {\n    left: 50%;\n    top: 100%;\n  }\n  .react-flow__resize-control.handle.top.left {\n    left: 0;\n  }\n  .react-flow__resize-control.handle.bottom.left {\n    left: 0;\n  }\n  .react-flow__resize-control.handle.top.right {\n    left: 100%;\n  }\n  .react-flow__resize-control.handle.bottom.right {\n    left: 100%;\n  }\n  /* line styles */\n  .react-flow__resize-control.line {\n    border-color: ${theme.colors.primary};\n    border-width: 0;\n    border-style: solid;\n  }\n  .react-flow__resize-control.line.left,\n  .react-flow__resize-control.line.right {\n    width: 1px;\n    transform: translate(-50%, 0);\n    top: 0;\n    height: 100%;\n  }\n  .react-flow__resize-control.line.left {\n    left: 0;\n    border-left-width: 1px;\n  }\n  .react-flow__resize-control.line.right {\n    left: 100%;\n    border-right-width: 1px;\n  }\n  .react-flow__resize-control.line.top,\n  .react-flow__resize-control.line.bottom {\n    height: 1px;\n    transform: translate(0, -50%);\n    left: 0;\n    width: 100%;\n  }\n  .react-flow__resize-control.line.top {\n    top: 0;\n    border-top-width: 1px;\n  }\n  .react-flow__resize-control.line.bottom {\n    border-bottom-width: 1px;\n    top: 100%;\n  }\n`;\n"],"names":[],"mappings":";;AAGO,MAAM,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cA2CZ,MAAM,OAAO,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eA4LrB,MAAM,MAAM,EAAE;AAAA,qBACR,MAAM,MAAM,KAAK;AAAA;AAAA,aAEzB,MAAM,OAAO,SAAS;AAAA;AAAA,wBAEX,MAAM,OAAO,QAAQ;AAAA,wBACrB,MAAM,OAAO,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAyC9B,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBA4Db,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,oBAiCxB,MAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/esm/Flow/hooks/{useFlowContext.js → useFlowContext.mjs}

@@ -1,7 +1,7 @@
 import { useContext } from "react";
-import { HvFlowContext } from "../FlowContext/FlowContext.js";
+import { HvFlowContext } from "../FlowContext/FlowContext.mjs";
 const useFlowContext = () => useContext(HvFlowContext);
 export {
   useFlowContext
 };
-//# sourceMappingURL=useFlowContext.js.map
+//# sourceMappingURL=useFlowContext.mjs.map

package/dist/esm/Flow/hooks/useFlowContext.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFlowContext.mjs","sources":["../../../../src/Flow/hooks/useFlowContext.ts"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvFlowContext } from \"../FlowContext\";\n\nexport const useFlowContext = () => useContext(HvFlowContext);\n"],"names":[],"mappings":";;AAIa,MAAA,iBAAiB,MAAM,WAAW,aAAa;"}

package/dist/esm/Flow/hooks/{useFlowNode.js → useFlowNode.mjs}

@@ -61,4 +61,4 @@ export {
   useFlowNodeParents,
   useFlowOutputNodes
 };
-//# sourceMappingURL=useFlowNode.js.map
+//# sourceMappingURL=useFlowNode.mjs.map

package/dist/esm/Flow/hooks/useFlowNode.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFlowNode.mjs","sources":["../../../../src/Flow/hooks/useFlowNode.ts"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\nimport {\n  Node,\n  Edge,\n  ReactFlowState,\n  useStore,\n  useNodes,\n  useEdges,\n} from \"reactflow\";\n\nexport function useFlowNode<T extends Node = Node>(id: string) {\n  const nodeSelector = useCallback(\n    (state: ReactFlowState) =>\n      state.getNodes().find((n: Node): n is T => n.id === id),\n    [id]\n  );\n  return useStore<T | undefined>(nodeSelector);\n}\n\nexport function useFlowNodeInputEdges(id: string) {\n  const inputEdgesSelector = useCallback(\n    (state: ReactFlowState) => state.edges.filter((e: Edge) => e.target === id),\n    [id]\n  );\n  return useStore(inputEdgesSelector);\n}\n\nexport function useFlowNodeOutputEdges(id: string) {\n  const outputEdgesSelector = useCallback(\n    (state: ReactFlowState) => state.edges.filter((e: Edge) => e.source === id),\n    [id]\n  );\n  return useStore(outputEdgesSelector);\n}\n\nexport function useFlowNodeEdges(id: string) {\n  const edgesSelector = useCallback(\n    (state: ReactFlowState) =>\n      state.edges.filter((e: Edge) => e.source === id || e.target === id),\n    [id]\n  );\n  return useStore(edgesSelector);\n}\n\nexport function useFlowNodeParents(id: string) {\n  const inputEdges = useFlowNodeInputEdges(id);\n  const parentNodesSelector = useCallback(\n    (state: ReactFlowState) => {\n      return inputEdges\n        .map((e) => state.getNodes().find((n: Node) => n.id === e.source))\n        .filter((n): n is Node => n !== null);\n    },\n    [inputEdges]\n  );\n  return useStore(parentNodesSelector);\n}\n\nexport function useFlowInputNodes<T = any>(id: string) {\n  const nodes = useNodes();\n  const edges = useEdges();\n\n  return useMemo(() => {\n    return edges\n      .filter((e) => e.target === id)\n      .map((e) => nodes.find((n) => n.id === e.source))\n      .filter((n): n is Node<T> => n !== null);\n  }, [edges, id, nodes]);\n}\n\nexport function useFlowOutputNodes<T = any>(id: string) {\n  const nodes = useNodes();\n  const edges = useEdges();\n\n  return useMemo(() => {\n    return edges\n      .filter((e) => e.source === id)\n      .map((e) => nodes.find((n) => n.id === e.target))\n      .filter((n): n is Node<T> => n !== null);\n  }, [edges, id, nodes]);\n}\n"],"names":[],"mappings":";;AAUO,SAAS,YAAmC,IAAY;AAC7D,QAAM,eAAe;AAAA,IACnB,CAAC,UACC,MAAM,WAAW,KAAK,CAAC,MAAoB,EAAE,OAAO,EAAE;AAAA,IACxD,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAwB,YAAY;AAC7C;AAEO,SAAS,sBAAsB,IAAY;AAChD,QAAM,qBAAqB;AAAA,IACzB,CAAC,UAA0B,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,EAAE;AAAA,IAC1E,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAS,kBAAkB;AACpC;AAEO,SAAS,uBAAuB,IAAY;AACjD,QAAM,sBAAsB;AAAA,IAC1B,CAAC,UAA0B,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,EAAE;AAAA,IAC1E,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAS,mBAAmB;AACrC;AAEO,SAAS,iBAAiB,IAAY;AAC3C,QAAM,gBAAgB;AAAA,IACpB,CAAC,UACC,MAAM,MAAM,OAAO,CAAC,MAAY,EAAE,WAAW,MAAM,EAAE,WAAW,EAAE;AAAA,IACpE,CAAC,EAAE;AAAA,EAAA;AAEL,SAAO,SAAS,aAAa;AAC/B;AAEO,SAAS,mBAAmB,IAAY;AACvC,QAAA,aAAa,sBAAsB,EAAE;AAC3C,QAAM,sBAAsB;AAAA,IAC1B,CAAC,UAA0B;AAClB,aAAA,WACJ,IAAI,CAAC,MAAM,MAAM,SAAS,EAAE,KAAK,CAAC,MAAY,EAAE,OAAO,EAAE,MAAM,CAAC,EAChE,OAAO,CAAC,MAAiB,MAAM,IAAI;AAAA,IACxC;AAAA,IACA,CAAC,UAAU;AAAA,EAAA;AAEb,SAAO,SAAS,mBAAmB;AACrC;AAEO,SAAS,kBAA2B,IAAY;AACrD,QAAM,QAAQ;AACd,QAAM,QAAQ;AAEd,SAAO,QAAQ,MAAM;AACZ,WAAA,MACJ,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE,EAC7B,IAAI,CAAC,MAAM,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/C,OAAO,CAAC,MAAoB,MAAM,IAAI;AAAA,EACxC,GAAA,CAAC,OAAO,IAAI,KAAK,CAAC;AACvB;AAEO,SAAS,mBAA4B,IAAY;AACtD,QAAM,QAAQ;AACd,QAAM,QAAQ;AAEd,SAAO,QAAQ,MAAM;AACZ,WAAA,MACJ,OAAO,CAAC,MAAM,EAAE,WAAW,EAAE,EAC7B,IAAI,CAAC,MAAM,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,EAC/C,OAAO,CAAC,MAAoB,MAAM,IAAI;AAAA,EACxC,GAAA,CAAC,OAAO,IAAI,KAAK,CAAC;AACvB;"}

package/dist/esm/Flow/hooks/{useFlowNodeMeta.js → useFlowNodeMeta.mjs}

@@ -1,4 +1,4 @@
-import { useNodeMetaRegistry } from "../FlowContext/NodeMetaContext.js";
+import { useNodeMetaRegistry } from "../FlowContext/NodeMetaContext.mjs";
 function useFlowNodeMeta(id) {
   const { registry } = useNodeMetaRegistry();
   return registry[id];
@@ -6,4 +6,4 @@ function useFlowNodeMeta(id) {
 export {
   useFlowNodeMeta
 };
-//# sourceMappingURL=useFlowNodeMeta.js.map
+//# sourceMappingURL=useFlowNodeMeta.mjs.map

package/dist/esm/Flow/hooks/useFlowNodeMeta.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFlowNodeMeta.mjs","sources":["../../../../src/Flow/hooks/useFlowNodeMeta.ts"],"sourcesContent":["import { useNodeMetaRegistry } from \"../FlowContext/NodeMetaContext\";\n\nexport function useFlowNodeMeta(id: string) {\n  const { registry } = useNodeMetaRegistry();\n\n  return registry[id];\n}\n"],"names":[],"mappings":";AAEO,SAAS,gBAAgB,IAAY;AACpC,QAAA,EAAE,aAAa;AAErB,SAAO,SAAS,EAAE;AACpB;"}

package/dist/esm/Flow/nodes/{DashboardNode.js → DashboardNode.mjs}

@@ -1,8 +1,8 @@
 import { jsxs, jsx } from "@emotion/react/jsx-runtime";
 import { createClasses, theme, useLabels, HvDialog, HvDialogTitle, HvDialogContent, HvEmptyState, HvDialogActions, HvButton } from "@hitachivantara/uikit-react-core";
 import { Info } from "@hitachivantara/uikit-react-icons";
-import { HvFlowNode } from "../Node/Node.js";
-import { HvDashboard } from "../../Dashboard/Dashboard.js";
+import { HvFlowNode } from "../Node/Node.mjs";
+import { HvDashboard } from "../../Dashboard/Dashboard.mjs";
 const { staticClasses, useClasses } = createClasses("HvDashboardNode", {
   actions: {
     display: "flex",
@@ -88,4 +88,4 @@ export {
   HvDashboardNode,
   staticClasses as hvDashboardNodeClasses
 };
-//# sourceMappingURL=DashboardNode.js.map
+//# sourceMappingURL=DashboardNode.mjs.map