@hitachivantara/uikit-react-lab 5.7.0 → 5.8.0

package/dist/cjs/components/Flow/Flow.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Flow.cjs","sources":["../../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport {\n  DndContext,\n  DndContextProps,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\n\nimport { ReactFlowProvider } from \"reactflow\";\n\nimport { HvActionGeneric } from \"@hitachivantara/uikit-react-core\";\nimport { HvFlowNodeGroups, HvFlowNodeTypes } from \"./types\";\nimport { HvFlowProvider } from \"./FlowContext\";\nimport { HvDroppableFlow, HvDroppableFlowProps } from \"./DroppableFlow\";\nimport { HvFlowSidebarGroupItem } from \"./Sidebar/SidebarGroup/SidebarGroupItem\";\n\nexport interface HvFlowProps<\n  NodeData = any,\n  NodeType extends string | undefined = string | undefined,\n  NodeGroups extends keyof any = string\n> extends HvDroppableFlowProps<NodeData, NodeType> {\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow sidebar. */\n  sidebar?: React.ReactNode;\n  /** Flow default actions. */\n  defaultActions?: HvActionGeneric[];\n  /**\n   * Dnd Kit context props. This should be used for accessibility purposes.\n   *\n   * More information can be found on the [Dnd Kit documentation](https://docs.dndkit.com/guides/accessibility)\n   */\n  dndContextProps?: Pick<DndContextProps, \"accessibility\">;\n}\n\n/**\n * Flow component to build interactive node-based UIs.\n *\n * This implementation leverages [React Flow](https://reactflow.dev).\n * The drag and drop functionality leverages [Dnd Kit](https://docs.dndkit.com)\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvFlow = ({\n  nodeTypes,\n  nodeGroups,\n  sidebar,\n  defaultActions,\n  dndContextProps,\n  ...others\n}: HvFlowProps) => {\n  const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor)\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  // We're wrapping the main Flow component with the ReactFlowProvider to access the react flow instance.\n  // HvFlowContext is our custom internal context.\n  return (\n    <ReactFlowProvider>\n      <HvFlowProvider\n        nodeGroups={nodeGroups}\n        nodeTypes={nodeTypes}\n        defaultActions={defaultActions}\n      >\n        <DndContext\n          onDragStart={handleDragStart}\n          onDragEnd={handleDragEnd}\n          sensors={sensors}\n          modifiers={[restrictToWindowEdges]}\n          {...dndContextProps}\n        >\n          <HvDroppableFlow {...others} />\n          {sidebar}\n          <DragOverlay modifiers={[restrictToWindowEdges]}>\n            {draggingLabel ? (\n              <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n            ) : null}\n          </DragOverlay>\n        </DndContext>\n      </HvFlowProvider>\n    </ReactFlowProvider>\n  );\n};\n"],"names":["HvFlow","nodeTypes","nodeGroups","sidebar","defaultActions","dndContextProps","others","draggingLabel","setDraggingLabel","useState","undefined","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","ReactFlowProvider","jsx","HvFlowProvider","jsxs","DndContext","restrictToWindowEdges","HvDroppableFlow","DragOverlay","HvFlowSidebarGroupItem"],"mappings":";;;;;;;;;;AAkDO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,QAAM,CAACC,eAAeC,gBAAgB,IAAIC,MAAAA,SAASC,MAAS;AAE5D,QAAMC,UAAUC,KAAAA,WACdC,KAAAA,UAAUC,KAAa,aAAA,GACvBD,KAAAA,UAAUE,KAAc,cAAA,CAC1B;AAEA,QAAMC,kBAAmDC,CAAU,UAAA;;AACjE,SAAIA,WAAMC,OAAOC,KAAKC,YAAlBH,mBAA2BI,QAAQ;AACrCb,wBAAiBS,WAAMC,OAAOC,KAAKC,QAAQC,WAA1BJ,mBAAkCK,KAAK;AAAA,IAC1D;AAAA,EAAA;AAGF,QAAMC,gBAA8CA,MAAM;AACxDf,qBAAiBE,MAAS;AAAA,EAAA;AAK5B,wCACGc,UAAAA,mBACC,EAAA,UAAAC,2BAAA,IAACC,8BACC,YACA,WACA,gBAEA,UAACC,2BAAA,KAAAC,iBAAA,EACC,aAAaZ,iBACb,WAAWO,eACX,SACA,WAAW,CAACM,UAAqB,qBAAA,GACjC,GAAIxB,iBAEJ,UAAA;AAAA,IAACoB,2BAAAA,IAAAK,cAAA,iBAAA,EAAgB,GAAIxB,QAAO;AAAA,IAC3BH;AAAAA,IACAsB,2BAAA,IAAAM,KAAA,aAAA,EAAY,WAAW,CAACF,UAAAA,qBAAqB,GAC3CtB,UAAAA,gBACEkB,2BAAAA,IAAAO,iBAAAA,wBAAA,EAAuB,OAAOzB,eAAe,YAAU,KAAA,CAAA,IACtD,MACN;AAAA,EAAA,GACF,GACF,EACF,CAAA;AAEJ;;"}
+{"version":3,"file":"Flow.cjs","sources":["../../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport {\n  DndContext,\n  DndContextProps,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\n\nimport { ReactFlowProvider } from \"reactflow\";\n\nimport {\n  HvFlowDefaultActions,\n  HvFlowNodeGroups,\n  HvFlowNodeTypes,\n} from \"./types\";\nimport { HvFlowProvider } from \"./FlowContext\";\nimport { HvDroppableFlow, HvDroppableFlowProps } from \"./DroppableFlow\";\nimport { HvFlowSidebarGroupItem } from \"./Sidebar/SidebarGroup/SidebarGroupItem\";\n\nexport interface HvFlowProps<\n  NodeData = any,\n  NodeType extends string | undefined = string | undefined,\n  NodeGroups extends keyof any = string\n> extends HvDroppableFlowProps<NodeData, NodeType> {\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow sidebar. */\n  sidebar?: React.ReactNode;\n  /** Flow default actions. */\n  defaultActions?: HvFlowDefaultActions[];\n  /**\n   * Dnd Kit context props. This should be used for accessibility purposes.\n   *\n   * More information can be found on the [Dnd Kit documentation](https://docs.dndkit.com/guides/accessibility)\n   */\n  dndContextProps?: Pick<DndContextProps, \"accessibility\">;\n}\n\n/**\n * Flow component to build interactive node-based UIs.\n *\n * This implementation leverages [React Flow](https://reactflow.dev).\n * The drag and drop functionality leverages [Dnd Kit](https://docs.dndkit.com)\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvFlow = ({\n  nodeTypes,\n  nodeGroups,\n  sidebar,\n  defaultActions,\n  dndContextProps,\n  ...others\n}: HvFlowProps) => {\n  const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor)\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  // We're wrapping the main Flow component with the ReactFlowProvider to access the react flow instance.\n  // HvFlowContext is our custom internal context.\n  return (\n    <ReactFlowProvider>\n      <HvFlowProvider\n        nodeGroups={nodeGroups}\n        nodeTypes={nodeTypes}\n        defaultActions={defaultActions}\n      >\n        <DndContext\n          onDragStart={handleDragStart}\n          onDragEnd={handleDragEnd}\n          sensors={sensors}\n          modifiers={[restrictToWindowEdges]}\n          {...dndContextProps}\n        >\n          <HvDroppableFlow {...others} />\n          {sidebar}\n          <DragOverlay modifiers={[restrictToWindowEdges]}>\n            {draggingLabel ? (\n              <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n            ) : null}\n          </DragOverlay>\n        </DndContext>\n      </HvFlowProvider>\n    </ReactFlowProvider>\n  );\n};\n"],"names":["HvFlow","nodeTypes","nodeGroups","sidebar","defaultActions","dndContextProps","others","draggingLabel","setDraggingLabel","useState","undefined","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","ReactFlowProvider","jsx","HvFlowProvider","jsxs","DndContext","restrictToWindowEdges","HvDroppableFlow","DragOverlay","HvFlowSidebarGroupItem"],"mappings":";;;;;;;;;;AAqDO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,QAAM,CAACC,eAAeC,gBAAgB,IAAIC,MAAAA,SAASC,MAAS;AAE5D,QAAMC,UAAUC,KAAAA,WACdC,KAAAA,UAAUC,KAAa,aAAA,GACvBD,KAAAA,UAAUE,KAAc,cAAA,CAC1B;AAEA,QAAMC,kBAAmDC,CAAU,UAAA;;AACjE,SAAIA,WAAMC,OAAOC,KAAKC,YAAlBH,mBAA2BI,QAAQ;AACrCb,wBAAiBS,WAAMC,OAAOC,KAAKC,QAAQC,WAA1BJ,mBAAkCK,KAAK;AAAA,IAC1D;AAAA,EAAA;AAGF,QAAMC,gBAA8CA,MAAM;AACxDf,qBAAiBE,MAAS;AAAA,EAAA;AAK5B,wCACGc,UAAAA,mBACC,EAAA,UAAAC,2BAAA,IAACC,8BACC,YACA,WACA,gBAEA,UAACC,2BAAA,KAAAC,iBAAA,EACC,aAAaZ,iBACb,WAAWO,eACX,SACA,WAAW,CAACM,UAAqB,qBAAA,GACjC,GAAIxB,iBAEJ,UAAA;AAAA,IAACoB,2BAAAA,IAAAK,cAAA,iBAAA,EAAgB,GAAIxB,QAAO;AAAA,IAC3BH;AAAAA,IACAsB,2BAAA,IAAAM,KAAA,aAAA,EAAY,WAAW,CAACF,UAAAA,qBAAqB,GAC3CtB,UAAAA,gBACEkB,2BAAAA,IAAAO,iBAAAA,wBAAA,EAAuB,OAAOzB,eAAe,YAAU,KAAA,CAAA,IACtD,MACN;AAAA,EAAA,GACF,GACF,EACF,CAAA;AAEJ;;"}

package/dist/cjs/components/Flow/Flow.styles.cjs

@@ -23,22 +23,16 @@ const {
       backgroundColor: uikitReactCore.theme.colors.negative_20,
       width: 12,
       height: 12,
-      "&.react-flow__handle-top": {
-        top: -6
-      },
-      "&.react-flow__handle-bottom": {
-        bottom: -6
+      "&.react-flow__handle-left": {
+        translate: "0 4px"
       }
     },
     "& .react-flow__handle-valid": {
       backgroundColor: uikitReactCore.theme.colors.positive_20,
       width: 12,
       height: 12,
-      "&.react-flow__handle-top": {
-        top: -6
-      },
-      "&.react-flow__handle-bottom": {
-        bottom: -6
+      "&.react-flow__handle-left": {
+        translate: "0 4px"
       }
     },
     [`& .selected > .${Node_styles.staticClasses.root}`]: {

package/dist/cjs/components/Flow/Flow.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Flow.styles.cjs","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\nimport { flowNodeClasses } from \"./Node\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlow\", {\n  root: {\n    height: \"100%\",\n    \"& .react-flow__handle\": {\n      backgroundColor: theme.colors.secondary_60,\n      width: 8,\n      height: 8,\n      zIndex: theme.zIndices.overlay,\n    },\n    \"& .react-flow__handle-connecting\": {\n      backgroundColor: theme.colors.negative_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-top\": {\n        top: -6,\n      },\n      \"&.react-flow__handle-bottom\": {\n        bottom: -6,\n      },\n    },\n    \"& .react-flow__handle-valid\": {\n      backgroundColor: theme.colors.positive_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-top\": {\n        top: -6,\n      },\n      \"&.react-flow__handle-bottom\": {\n        bottom: -6,\n      },\n    },\n    [`& .selected > .${flowNodeClasses.root}`]: {\n      border: `1px solid ${theme.colors.secondary_60}`,\n      borderRadius: theme.radii.round,\n      boxSizing: \"border-box\",\n    },\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","height","backgroundColor","theme","colors","secondary_60","width","zIndex","zIndices","overlay","negative_20","top","bottom","positive_20","flowNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":";;;;;;;;;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,eAAAA,cAAc,UAAU;AAAA,EACnEC,MAAM;AAAA,IACJC,QAAQ;AAAA,IACR,yBAAyB;AAAA,MACvBC,iBAAiBC,eAAAA,MAAMC,OAAOC;AAAAA,MAC9BC,OAAO;AAAA,MACPL,QAAQ;AAAA,MACRM,QAAQJ,eAAAA,MAAMK,SAASC;AAAAA,IACzB;AAAA,IACA,oCAAoC;AAAA,MAClCP,iBAAiBC,eAAAA,MAAMC,OAAOM;AAAAA,MAC9BJ,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,4BAA4B;AAAA,QAC1BU,KAAK;AAAA,MACP;AAAA,MACA,+BAA+B;AAAA,QAC7BC,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,+BAA+B;AAAA,MAC7BV,iBAAiBC,eAAAA,MAAMC,OAAOS;AAAAA,MAC9BP,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,4BAA4B;AAAA,QAC1BU,KAAK;AAAA,MACP;AAAA,MACA,+BAA+B;AAAA,QAC7BC,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAE,kBAAiBE,0BAAgBd,IAAK,EAAC,GAAG;AAAA,MAC1Ce,QAAS,aAAYZ,eAAMC,MAAAA,OAAOC,YAAa;AAAA,MAC/CW,cAAcb,eAAAA,MAAMc,MAAMC;AAAAA,MAC1BC,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;;;"}
+{"version":3,"file":"Flow.styles.cjs","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\nimport { flowNodeClasses } from \"./Node\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlow\", {\n  root: {\n    height: \"100%\",\n    \"& .react-flow__handle\": {\n      backgroundColor: theme.colors.secondary_60,\n      width: 8,\n      height: 8,\n      zIndex: theme.zIndices.overlay,\n    },\n    \"& .react-flow__handle-connecting\": {\n      backgroundColor: theme.colors.negative_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-left\": {\n        translate: \"0 4px\",\n      },\n    },\n    \"& .react-flow__handle-valid\": {\n      backgroundColor: theme.colors.positive_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-left\": {\n        translate: \"0 4px\",\n      },\n    },\n    [`& .selected > .${flowNodeClasses.root}`]: {\n      border: `1px solid ${theme.colors.secondary_60}`,\n      borderRadius: theme.radii.round,\n      boxSizing: \"border-box\",\n    },\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","height","backgroundColor","theme","colors","secondary_60","width","zIndex","zIndices","overlay","negative_20","translate","positive_20","flowNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":";;;;;;;;;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,eAAAA,cAAc,UAAU;AAAA,EACnEC,MAAM;AAAA,IACJC,QAAQ;AAAA,IACR,yBAAyB;AAAA,MACvBC,iBAAiBC,eAAAA,MAAMC,OAAOC;AAAAA,MAC9BC,OAAO;AAAA,MACPL,QAAQ;AAAA,MACRM,QAAQJ,eAAAA,MAAMK,SAASC;AAAAA,IACzB;AAAA,IACA,oCAAoC;AAAA,MAClCP,iBAAiBC,eAAAA,MAAMC,OAAOM;AAAAA,MAC9BJ,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3BU,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,+BAA+B;AAAA,MAC7BT,iBAAiBC,eAAAA,MAAMC,OAAOQ;AAAAA,MAC9BN,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3BU,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,CAAE,kBAAiBE,0BAAgBb,IAAK,EAAC,GAAG;AAAA,MAC1Cc,QAAS,aAAYX,eAAMC,MAAAA,OAAOC,YAAa;AAAA,MAC/CU,cAAcZ,eAAAA,MAAMa,MAAMC;AAAAA,MAC1BC,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;;;"}

package/dist/cjs/components/Flow/FlowContext/FlowContext.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FlowContext.cjs","sources":["../../../../../src/components/Flow/FlowContext/FlowContext.tsx"],"sourcesContent":["import { HvActionGeneric } from \"@hitachivantara/uikit-react-core\";\nimport {\n  Dispatch,\n  SetStateAction,\n  createContext,\n  useContext,\n  useMemo,\n  useState,\n} from \"react\";\n\nimport { HvFlowNodeGroups, HvFlowNodeTypes } from \"../types\";\n\nexport interface HvFlowContextValue<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes groups expanded on sidebar. */\n  expandedNodeGroups?: string[];\n  /** Flow default actions. */\n  defaultActions?: HvActionGeneric[];\n  /** Function to set `expandedNodeGroups`. */\n  setExpandedNodeGroups?: Dispatch<SetStateAction<string[]>>;\n}\n\nexport const HvFlowContext = createContext<HvFlowContextValue>({});\n\nexport interface HvFlowProviderProps<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowContextValue<NodeGroups>[\"nodeTypes\"];\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowContextValue<NodeGroups>[\"nodeGroups\"];\n  /** Flow default actions. */\n  defaultActions?: HvActionGeneric[];\n  /** Children. */\n  children?: React.ReactNode;\n}\n\nexport const HvFlowProvider = ({\n  nodeGroups,\n  nodeTypes,\n  defaultActions,\n  children,\n}: HvFlowProviderProps) => {\n  const [expandedNodeGroups, setExpandedNodeGroups] = useState<string[]>([]);\n\n  const value = useMemo(\n    () => ({\n      nodeTypes,\n      nodeGroups,\n      defaultActions,\n      expandedNodeGroups,\n      setExpandedNodeGroups,\n    }),\n    [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]\n  );\n\n  return (\n    <HvFlowContext.Provider value={value}>{children}</HvFlowContext.Provider>\n  );\n};\n\nexport const useFlowContext = () => useContext(HvFlowContext);\n"],"names":["HvFlowContext","createContext","HvFlowProvider","nodeGroups","nodeTypes","defaultActions","children","expandedNodeGroups","setExpandedNodeGroups","useState","value","useMemo","jsx","useFlowContext","useContext"],"mappings":";;;;AAyBaA,MAAAA,gBAAgBC,MAAkC,cAAA,EAAE;AAa1D,MAAMC,iBAAiBA,CAAC;AAAA,EAC7BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACmB,MAAM;AACzB,QAAM,CAACC,oBAAoBC,qBAAqB,IAAIC,MAAAA,SAAmB,CAAE,CAAA;AAEnEC,QAAAA,QAAQC,MAAAA,QACZ,OAAO;AAAA,IACLP;AAAAA,IACAD;AAAAA,IACAE;AAAAA,IACAE;AAAAA,IACAC;AAAAA,EAAAA,IAEF,CAACJ,WAAWD,YAAYE,gBAAgBE,kBAAkB,CAC5D;AAEA,SACGK,2BAAAA,IAAA,cAAc,UAAd,EAAuB,OAAeN,SAAS,CAAA;AAEpD;AAEaO,MAAAA,iBAAiBA,MAAMC,MAAAA,WAAWd,aAAa;;;;"}
+{"version":3,"file":"FlowContext.cjs","sources":["../../../../../src/components/Flow/FlowContext/FlowContext.tsx"],"sourcesContent":["import {\n  Dispatch,\n  SetStateAction,\n  createContext,\n  useContext,\n  useMemo,\n  useState,\n} from \"react\";\n\nimport {\n  HvFlowDefaultActions,\n  HvFlowNodeGroups,\n  HvFlowNodeTypes,\n} from \"../types\";\n\nexport interface HvFlowContextValue<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes groups expanded on sidebar. */\n  expandedNodeGroups?: string[];\n  /** Flow default actions. */\n  defaultActions?: HvFlowDefaultActions[];\n  /** Function to set `expandedNodeGroups`. */\n  setExpandedNodeGroups?: Dispatch<SetStateAction<string[]>>;\n}\n\nexport const HvFlowContext = createContext<HvFlowContextValue>({});\n\nexport interface HvFlowProviderProps<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowContextValue<NodeGroups>[\"nodeTypes\"];\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowContextValue<NodeGroups>[\"nodeGroups\"];\n  /** Flow default actions. */\n  defaultActions?: HvFlowDefaultActions[];\n  /** Children. */\n  children?: React.ReactNode;\n}\n\nexport const HvFlowProvider = ({\n  nodeGroups,\n  nodeTypes,\n  defaultActions,\n  children,\n}: HvFlowProviderProps) => {\n  const [expandedNodeGroups, setExpandedNodeGroups] = useState<string[]>([]);\n\n  const value = useMemo(\n    () => ({\n      nodeTypes,\n      nodeGroups,\n      defaultActions,\n      expandedNodeGroups,\n      setExpandedNodeGroups,\n    }),\n    [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]\n  );\n\n  return (\n    <HvFlowContext.Provider value={value}>{children}</HvFlowContext.Provider>\n  );\n};\n\nexport const useFlowContext = () => useContext(HvFlowContext);\n"],"names":["HvFlowContext","createContext","HvFlowProvider","nodeGroups","nodeTypes","defaultActions","children","expandedNodeGroups","setExpandedNodeGroups","useState","value","useMemo","jsx","useFlowContext","useContext"],"mappings":";;;;AA4BaA,MAAAA,gBAAgBC,MAAkC,cAAA,EAAE;AAa1D,MAAMC,iBAAiBA,CAAC;AAAA,EAC7BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACmB,MAAM;AACzB,QAAM,CAACC,oBAAoBC,qBAAqB,IAAIC,MAAAA,SAAmB,CAAE,CAAA;AAEnEC,QAAAA,QAAQC,MAAAA,QACZ,OAAO;AAAA,IACLP;AAAAA,IACAD;AAAAA,IACAE;AAAAA,IACAE;AAAAA,IACAC;AAAAA,EAAAA,IAEF,CAACJ,WAAWD,YAAYE,gBAAgBE,kBAAkB,CAC5D;AAEA,SACGK,2BAAAA,IAAA,cAAc,UAAd,EAAuB,OAAeN,SAAS,CAAA;AAEpD;AAEaO,MAAAA,iBAAiBA,MAAMC,MAAAA,WAAWd,aAAa;;;;"}

package/dist/cjs/components/Flow/Node/Node.cjs

@@ -27,7 +27,8 @@ const HvFlowNode = ({
   actionCallback,
   maxVisibleActions = 1,
   classes: classesProp,
-  className
+  className,
+  children
 }) => {
   var _a, _b, _c, _d, _e, _f;
   const [showParams, setShowParams] = React.useState(expanded);
@@ -59,7 +60,7 @@ const HvFlowNode = ({
       if (n.id === id) {
         if (Object.keys(n.data).length === 0) {
           params == null ? void 0 : params.forEach((param) => {
-            n.data[param.label] = param.value;
+            n.data[param.id] = param.value;
           });
         }
       }
@@ -128,24 +129,30 @@ const HvFlowNode = ({
         } })
       ] }) })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Inputs" }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsContainer, children: inputs == null ? void 0 : inputs.map((input, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.inputContainer, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.Handle, { type: "target", isConnectableStart: false, id: `${idx}`, position: ReactFlow.Position.Left, style: {
-        top: 160 + 29 * idx
-      } }),
-      /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: input.label }),
-      input.isMandatory && !isInputConnected(id, "target", idx, edges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory })
-    ] }, idx)) }),
+    children && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.contentContainer, children }),
     showParams && params && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.paramsContainer, children: /* @__PURE__ */ jsxRuntime.jsx(ParamRenderer.default, { nodeId: id, params, data: node == null ? void 0 : node.data }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Outputs" }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsContainer, children: outputs == null ? void 0 : outputs.map((output, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.outputContainer, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.Handle, { type: "source", isConnectableEnd: false, id: `${idx}`, position: ReactFlow.Position.Right, style: {
-        bottom: -8 + 29 * (outputs.length - idx),
-        top: "auto"
-      } }),
-      output.isMandatory && !isInputConnected(id, "source", idx, edges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory }),
-      /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: output.label })
-    ] }, idx)) })
+    inputs && inputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Inputs" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsContainer, children: inputs == null ? void 0 : inputs.map((input, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.inputContainer, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.Handle, { type: "target", isConnectableStart: false, id: `${idx}`, position: ReactFlow.Position.Left, style: {
+          top: "auto",
+          bottom: ((outputs == null ? void 0 : outputs.length) ? 80 : 18) + ((outputs == null ? void 0 : outputs.length) || 0) * 29 + 29 * idx
+        } }),
+        /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: input.label }),
+        input.isMandatory && !isInputConnected(id, "target", idx, edges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory })
+      ] }, idx)) })
+    ] }),
+    outputs && outputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: "Outputs" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.outputsContainer, children: outputs == null ? void 0 : outputs.map((output, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.outputContainer, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ReactFlow.Handle, { type: "source", isConnectableEnd: false, id: `${idx}`, position: ReactFlow.Position.Right, style: {
+          bottom: -10 + 29 * (outputs.length - idx),
+          top: "auto"
+        } }),
+        output.isMandatory && !isInputConnected(id, "source", idx, edges) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory }),
+        /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: output.label })
+      ] }, idx)) })
+    ] })
   ] });
 };
 exports.flowNodeClasses = Node_styles.staticClasses;

package/dist/cjs/components/Flow/Node/Node.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Node.cjs","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import {\n  ExtractNames,\n  HvActionGeneric,\n  HvActionsGenericProps,\n  HvBaseProps,\n  HvButton,\n  HvDropDownMenu,\n  HvTooltip,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\nimport { getColor, theme } from \"@hitachivantara/uikit-styles\";\nimport { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n  Handle,\n  NodeProps,\n  NodeToolbar,\n  Position,\n  useReactFlow,\n  useStore,\n} from \"reactflow\";\nimport { useFlowContext } from \"../FlowContext/FlowContext\";\n\nimport { HvFlowNodeInput, HvFlowNodeOutput, HvFlowNodeParam } from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowNodeProps extends Omit<HvBaseProps, \"id\">, NodeProps {\n  /** Node description */\n  description: string;\n  /** Node expanded */\n  expanded?: boolean;\n  /** Node inputs */\n  inputs?: HvFlowNodeInput[];\n  /** Node outputs */\n  outputs?: HvFlowNodeOutput[];\n  /** Node parameters */\n  params?: HvFlowNodeParam[];\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  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowNodeClasses;\n}\n\nconst isInputConnected = (id, type, idx, edges) => {\n  if (type === \"target\") {\n    return edges.some(\n      (e) => e.target === id && e.targetHandle === idx.toString()\n    );\n  }\n  if (type === \"source\") {\n    return edges.some(\n      (e) => e.source === id && e.sourceHandle === idx.toString()\n    );\n  }\n};\n\nexport const HvFlowNode = ({\n  id,\n  type,\n  description,\n  expanded = false,\n  params,\n  actions,\n  actionCallback,\n  maxVisibleActions = 1,\n  classes: classesProp,\n  className,\n}: HvFlowNodeProps) => {\n  const [showParams, setShowParams] = useState(expanded);\n  const [showActions, setShowActions] = useState(false);\n  const reactFlowInstance = useReactFlow();\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n  const edges = useStore((s) => s.edges);\n  const nodes = useStore((s) => s.getNodes());\n\n  const node = nodes.find((n) => n.id === id);\n\n  const groupId = nodeTypes?.[type].meta?.groupId;\n  const title = nodeTypes?.[type].meta?.label;\n  const groupLabel = groupId && nodeGroups && nodeGroups[groupId].label;\n\n  const inputs = nodeTypes?.[type]?.meta?.inputs;\n  const outputs = nodeTypes?.[type]?.meta?.outputs;\n  const icon = groupId && nodeGroups && nodeGroups[groupId].icon;\n  const colorProp = groupId && nodeGroups && nodeGroups[groupId].color;\n  const color = getColor(colorProp);\n\n  useEffect(() => {\n    const newNodes = nodes.map((n) => {\n      if (n.id === id) {\n        if (Object.keys(n.data).length === 0) {\n          params?.forEach((param) => {\n            n.data[param.label] = param.value;\n          });\n        }\n      }\n      return n;\n    });\n    reactFlowInstance.setNodes(newNodes);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleDefaultAction = useCallback(\n    (action: string) => {\n      if (!node) return;\n\n      switch (action) {\n        case \"delete\":\n          reactFlowInstance.deleteElements({ nodes: [node] });\n          break;\n        case \"duplicate\":\n          reactFlowInstance.addNodes([\n            {\n              ...node,\n              id: `${reactFlowInstance.getNodes().length + 1}`,\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  const hasParams = !!(params && params.length > 0);\n\n  if (!node) return null;\n\n  const actsVisible = actions?.slice(0, maxVisibleActions);\n  const actsDropdown = actions?.slice(maxVisibleActions);\n\n  const renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n    isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\n  return (\n    <div\n      className={cx(\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        {defaultActions?.map((action) => (\n          <HvButton icon onClick={() => handleDefaultAction(action.id)}>\n            {renderedIcon(action.icon)}\n          </HvButton>\n        ))}\n      </NodeToolbar>\n      <div\n        className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n      >\n        <div className={classes.groupContainer}>\n          {icon}\n          <HvTypography variant=\"title4\" className={classes.group}>\n            {groupLabel}\n          </HvTypography>\n        </div>\n        <div style={{ display: \"flex\" }}>\n          <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n            <div>\n              <Info />\n            </div>\n          </HvTooltip>\n          <HvButton\n            icon\n            disabled={!hasParams}\n            onClick={() => setShowParams((p) => !p)}\n          >\n            {showParams ? <Up /> : <Down />}\n          </HvButton>\n        </div>\n      </div>\n      <div className={classes.titleContainer}>\n        <div>\n          <HvTypography>{title}</HvTypography>\n        </div>\n        <div className={classes.actions}>\n          {actions?.length && actions?.length > 0 && (\n            <>\n              {actsVisible?.map((action) => (\n                <HvTooltip title={<HvTypography>{action.label}</HvTypography>}>\n                  <div>\n                    <HvButton\n                      icon\n                      onClick={(event) => {\n                        actionCallback?.(event, node.id, action);\n                      }}\n                    >\n                      {renderedIcon(action.icon)}\n                    </HvButton>\n                  </div>\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, node.id, action as HvActionGeneric);\n                  }}\n                />\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      <div className={classes.inputsTitleContainer}>\n        <HvTypography>Inputs</HvTypography>\n      </div>\n      <div className={classes.inputsContainer}>\n        {inputs?.map((input, idx) => (\n          <div className={classes.inputContainer} key={idx}>\n            <Handle\n              type=\"target\"\n              isConnectableStart={false}\n              id={`${idx}`}\n              position={Position.Left}\n              style={{\n                top: 160 + 29 * idx,\n              }}\n            />\n            <HvTypography>{input.label}</HvTypography>\n            {input.isMandatory &&\n              !isInputConnected(id, \"target\", idx, edges) && (\n                <div className={classes.mandatory} />\n              )}\n          </div>\n        ))}\n      </div>\n      {showParams && params && (\n        <div className={classes.paramsContainer}>\n          <ParamRenderer nodeId={id} params={params} data={node?.data} />\n        </div>\n      )}\n      <div className={classes.outputsTitleContainer}>\n        <HvTypography>Outputs</HvTypography>\n      </div>\n      <div className={classes.outputsContainer}>\n        {outputs?.map((output, idx) => (\n          <div className={classes.outputContainer} key={idx}>\n            <Handle\n              type=\"source\"\n              isConnectableEnd={false}\n              id={`${idx}`}\n              position={Position.Right}\n              style={{\n                bottom: -8 + 29 * (outputs.length - idx),\n                top: \"auto\",\n              }}\n            />\n            {output.isMandatory &&\n              !isInputConnected(id, \"source\", idx, edges) && (\n                <div className={classes.mandatory} />\n              )}\n            <HvTypography>{output.label}</HvTypography>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n"],"names":["isInputConnected","id","type","idx","edges","some","e","target","targetHandle","toString","source","sourceHandle","HvFlowNode","description","expanded","params","actions","actionCallback","maxVisibleActions","classes","classesProp","className","showParams","setShowParams","useState","showActions","setShowActions","reactFlowInstance","useReactFlow","cx","css","useClasses","nodeGroups","nodeTypes","defaultActions","useFlowContext","useStore","s","nodes","getNodes","node","find","n","groupId","meta","title","label","groupLabel","inputs","outputs","icon","colorProp","color","getColor","useEffect","newNodes","map","Object","keys","data","length","forEach","param","value","setNodes","handleDefaultAction","useCallback","action","deleteElements","addNodes","position","x","y","height","selected","zIndex","Number","theme","zIndices","overlay","hasParams","actsVisible","slice","actsDropdown","renderedIcon","actionIcon","isValidElement","jsxs","border","root","jsx","NodeToolbar","HvButton","backgroundColor","headerContainer","groupContainer","HvTypography","group","display","HvTooltip","Info","p","Up","Down","titleContainer","event","HvDropDownMenu","inputsTitleContainer","inputsContainer","input","inputContainer","Handle","Position","Left","top","isMandatory","mandatory","paramsContainer","ParamRenderer","outputsTitleContainer","outputsContainer","output","outputContainer","Right","bottom"],"mappings":"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"}
+{"version":3,"file":"Node.cjs","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import {\n  ExtractNames,\n  HvActionGeneric,\n  HvActionsGenericProps,\n  HvBaseProps,\n  HvButton,\n  HvDropDownMenu,\n  HvTooltip,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\nimport { getColor, theme } from \"@hitachivantara/uikit-styles\";\nimport { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n  Handle,\n  NodeProps,\n  NodeToolbar,\n  Position,\n  useReactFlow,\n  useStore,\n} from \"reactflow\";\nimport { useFlowContext } from \"../FlowContext/FlowContext\";\n\nimport {\n  HvFlowDefaultAction,\n  HvFlowNodeInput,\n  HvFlowNodeOutput,\n  HvFlowNodeParam,\n} from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowNodeProps extends Omit<HvBaseProps, \"id\">, NodeProps {\n  /** Node description */\n  description: string;\n  /** Node expanded */\n  expanded?: boolean;\n  /** Node inputs */\n  inputs?: HvFlowNodeInput[];\n  /** Node outputs */\n  outputs?: HvFlowNodeOutput[];\n  /** Node parameters */\n  params?: HvFlowNodeParam[];\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  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowNodeClasses;\n}\n\nconst isInputConnected = (id, type, idx, edges) => {\n  if (type === \"target\") {\n    return edges.some(\n      (e) => e.target === id && e.targetHandle === idx.toString()\n    );\n  }\n  if (type === \"source\") {\n    return edges.some(\n      (e) => e.source === id && e.sourceHandle === idx.toString()\n    );\n  }\n};\n\nexport const HvFlowNode = ({\n  id,\n  type,\n  description,\n  expanded = false,\n  params,\n  actions,\n  actionCallback,\n  maxVisibleActions = 1,\n  classes: classesProp,\n  className,\n  children,\n}: HvFlowNodeProps) => {\n  const [showParams, setShowParams] = useState(expanded);\n  const [showActions, setShowActions] = useState(false);\n  const reactFlowInstance = useReactFlow();\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n  const edges = useStore((s) => s.edges);\n  const nodes = useStore((s) => s.getNodes());\n\n  const node = nodes.find((n) => n.id === id);\n\n  const groupId = nodeTypes?.[type].meta?.groupId;\n  const title = nodeTypes?.[type].meta?.label;\n  const groupLabel = groupId && nodeGroups && nodeGroups[groupId].label;\n\n  const inputs = nodeTypes?.[type]?.meta?.inputs;\n  const outputs = nodeTypes?.[type]?.meta?.outputs;\n  const icon = groupId && nodeGroups && nodeGroups[groupId].icon;\n  const colorProp = groupId && nodeGroups && nodeGroups[groupId].color;\n  const color = getColor(colorProp);\n\n  useEffect(() => {\n    const newNodes = nodes.map((n) => {\n      if (n.id === id) {\n        if (Object.keys(n.data).length === 0) {\n          params?.forEach((param) => {\n            n.data[param.id] = param.value;\n          });\n        }\n      }\n      return n;\n    });\n    reactFlowInstance.setNodes(newNodes);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleDefaultAction = useCallback(\n    (action: HvFlowDefaultAction) => {\n      if (!node) return;\n\n      switch (action) {\n        case \"delete\":\n          reactFlowInstance.deleteElements({ nodes: [node] });\n          break;\n        case \"duplicate\":\n          reactFlowInstance.addNodes([\n            {\n              ...node,\n              id: `${reactFlowInstance.getNodes().length + 1}`,\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  const hasParams = !!(params && params.length > 0);\n\n  if (!node) return null;\n\n  const actsVisible = actions?.slice(0, maxVisibleActions);\n  const actsDropdown = actions?.slice(maxVisibleActions);\n\n  const renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n    isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\n  return (\n    <div\n      className={cx(\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        {defaultActions?.map((action) => (\n          <HvButton icon onClick={() => handleDefaultAction(action.id)}>\n            {renderedIcon(action.icon)}\n          </HvButton>\n        ))}\n      </NodeToolbar>\n      <div\n        className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n      >\n        <div className={classes.groupContainer}>\n          {icon}\n          <HvTypography variant=\"title4\" className={classes.group}>\n            {groupLabel}\n          </HvTypography>\n        </div>\n        <div style={{ display: \"flex\" }}>\n          <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n            <div>\n              <Info />\n            </div>\n          </HvTooltip>\n          <HvButton\n            icon\n            disabled={!hasParams}\n            onClick={() => setShowParams((p) => !p)}\n          >\n            {showParams ? <Up /> : <Down />}\n          </HvButton>\n        </div>\n      </div>\n      <div className={classes.titleContainer}>\n        <div>\n          <HvTypography>{title}</HvTypography>\n        </div>\n        <div className={classes.actions}>\n          {actions?.length && actions?.length > 0 && (\n            <>\n              {actsVisible?.map((action) => (\n                <HvTooltip title={<HvTypography>{action.label}</HvTypography>}>\n                  <div>\n                    <HvButton\n                      icon\n                      onClick={(event) => {\n                        actionCallback?.(event, node.id, action);\n                      }}\n                    >\n                      {renderedIcon(action.icon)}\n                    </HvButton>\n                  </div>\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, node.id, action as HvActionGeneric);\n                  }}\n                />\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      {children && <div className={classes.contentContainer}>{children}</div>}\n      {showParams && params && (\n        <div className={classes.paramsContainer}>\n          <ParamRenderer nodeId={id} params={params} data={node?.data} />\n        </div>\n      )}\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              <div className={classes.inputContainer} key={idx}>\n                <Handle\n                  type=\"target\"\n                  isConnectableStart={false}\n                  id={`${idx}`}\n                  position={Position.Left}\n                  style={{\n                    top: \"auto\",\n                    bottom:\n                      (outputs?.length ? 80 : 18) +\n                      (outputs?.length || 0) * 29 +\n                      29 * idx,\n                  }}\n                />\n                <HvTypography>{input.label}</HvTypography>\n                {input.isMandatory &&\n                  !isInputConnected(id, \"target\", idx, edges) && (\n                    <div className={classes.mandatory} />\n                  )}\n              </div>\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              <div className={classes.outputContainer} key={idx}>\n                <Handle\n                  type=\"source\"\n                  isConnectableEnd={false}\n                  id={`${idx}`}\n                  position={Position.Right}\n                  style={{\n                    bottom: -10 + 29 * (outputs.length - idx),\n                    top: \"auto\",\n                  }}\n                />\n                {output.isMandatory &&\n                  !isInputConnected(id, \"source\", idx, edges) && (\n                    <div className={classes.mandatory} />\n                  )}\n                <HvTypography>{output.label}</HvTypography>\n              </div>\n            ))}\n          </div>\n        </>\n      )}\n    </div>\n  );\n};\n"],"names":["isInputConnected","id","type","idx","edges","some","e","target","targetHandle","toString","source","sourceHandle","HvFlowNode","description","expanded","params","actions","actionCallback","maxVisibleActions","classes","classesProp","className","children","showParams","setShowParams","useState","showActions","setShowActions","reactFlowInstance","useReactFlow","cx","css","useClasses","nodeGroups","nodeTypes","defaultActions","useFlowContext","useStore","s","nodes","getNodes","node","find","n","groupId","meta","title","label","groupLabel","inputs","outputs","icon","colorProp","color","getColor","useEffect","newNodes","map","Object","keys","data","length","forEach","param","value","setNodes","handleDefaultAction","useCallback","action","deleteElements","addNodes","position","x","y","height","selected","zIndex","Number","theme","zIndices","overlay","hasParams","actsVisible","slice","actsDropdown","renderedIcon","actionIcon","isValidElement","jsxs","border","root","jsx","NodeToolbar","HvButton","backgroundColor","headerContainer","groupContainer","HvTypography","group","display","HvTooltip","Info","p","Up","Down","titleContainer","event","HvDropDownMenu","contentContainer","paramsContainer","ParamRenderer","Fragment","inputsTitleContainer","inputsContainer","input","inputContainer","Handle","Position","Left","top","bottom","isMandatory","mandatory","outputsTitleContainer","outputsContainer","output","outputContainer","Right"],"mappings":"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"}

package/dist/cjs/components/Flow/Node/Node.styles.cjs

@@ -27,6 +27,7 @@ const {
     color: uikitReactCore.theme.colors.base_dark
   },
   titleContainer: {
+    minHeight: 48,
     padding: uikitReactCore.theme.spacing(uikitReactCore.theme.space.xs, uikitReactCore.theme.space.xs, uikitReactCore.theme.space.xs, uikitReactCore.theme.space.sm),
     display: "flex",
     flexDirection: "row",
@@ -53,6 +54,9 @@ const {
     borderTop: `1px solid ${uikitReactCore.theme.colors.atmo4}`,
     borderBottom: `1px solid ${uikitReactCore.theme.colors.atmo4}`
   },
+  contentContainer: {
+    padding: uikitReactCore.theme.space.sm
+  },
   inputsContainer: {
     display: "flex",
     flexDirection: "column",

package/dist/cjs/components/Flow/Node/Node.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Node.styles.cjs","sources":["../../../../../src/components/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\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  },\n  groupContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  group: {\n    color: theme.colors.base_dark,\n  },\n  titleContainer: {\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  inputsTitleContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    padding: theme.space.xs,\n    backgroundColor: theme.colors.atmo2,\n    borderTop: `1px solid ${theme.colors.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\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.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n  },\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  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  inputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  outputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\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});\n"],"names":["staticClasses","useClasses","createClasses","root","borderRadius","theme","radii","round","backgroundColor","colors","atmo1","boxShadow","shadow","minWidth","headerContainer","padding","spacing","display","flexDirection","justifyContent","alignItems","groupContainer","group","color","base_dark","titleContainer","space","xs","sm","actions","inputsTitleContainer","atmo2","borderTop","atmo4","borderBottom","outputsTitleContainer","inputsContainer","gap","outputsContainer","paramsContainer","inputContainer","outputContainer","mandatory","width","height","margin","circle","negative_20"],"mappings":"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"}
+{"version":3,"file":"Node.styles.cjs","sources":["../../../../../src/components/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\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  },\n  groupContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  group: {\n    color: theme.colors.base_dark,\n  },\n  titleContainer: {\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  inputsTitleContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    padding: theme.space.xs,\n    backgroundColor: theme.colors.atmo2,\n    borderTop: `1px solid ${theme.colors.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\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.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n  },\n  contentContainer: {\n    padding: theme.space.sm,\n  },\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  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  inputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  outputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\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});\n"],"names":["staticClasses","useClasses","createClasses","root","borderRadius","theme","radii","round","backgroundColor","colors","atmo1","boxShadow","shadow","minWidth","headerContainer","padding","spacing","display","flexDirection","justifyContent","alignItems","groupContainer","group","color","base_dark","titleContainer","minHeight","space","xs","sm","actions","inputsTitleContainer","atmo2","borderTop","atmo4","borderBottom","outputsTitleContainer","contentContainer","inputsContainer","gap","outputsContainer","paramsContainer","inputContainer","outputContainer","mandatory","width","height","margin","circle","negative_20"],"mappings":";;;AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,eAAAA,cAAc,cAAc;AAAA,EACvEC,MAAM;AAAA,IACJC,cAAcC,eAAAA,MAAMC,MAAMC;AAAAA,IAC1BC,iBAAiBH,eAAAA,MAAMI,OAAOC;AAAAA,IAC9BC,WAAWN,eAAAA,MAAMI,OAAOG;AAAAA,IACxBC,UAAU;AAAA,EACZ;AAAA,EACAC,iBAAiB;AAAA,IACfC,SAASV,eAAAA,MAAMW,QAAQ,KAAK,CAAC;AAAA,IAC7BC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,gBAAgB;AAAA,IACdJ,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAE,OAAO;AAAA,IACLC,OAAOlB,eAAAA,MAAMI,OAAOe;AAAAA,EACtB;AAAA,EACAC,gBAAgB;AAAA,IACdC,WAAW;AAAA,IACXX,SAASV,eAAAA,MAAMW,QACbX,eAAAA,MAAMsB,MAAMC,IACZvB,eAAAA,MAAMsB,MAAMC,IACZvB,eAAMsB,MAAAA,MAAMC,IACZvB,eAAAA,MAAMsB,MAAME,EACd;AAAA,IACAZ,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAU,SAAS;AAAA,IACPb,SAAS;AAAA,IACTG,YAAY;AAAA,EACd;AAAA,EACAW,sBAAsB;AAAA,IACpBd,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,eAAAA,MAAMsB,MAAMC;AAAAA,IACrBpB,iBAAiBH,eAAAA,MAAMI,OAAOuB;AAAAA,IAC9BC,WAAY,aAAY5B,eAAMI,MAAAA,OAAOyB,KAAM;AAAA,IAC3CC,cAAe,aAAY9B,eAAMI,MAAAA,OAAOyB,KAAM;AAAA,EAChD;AAAA,EACAE,uBAAuB;AAAA,IACrBnB,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,eAAAA,MAAMsB,MAAMC;AAAAA,IACrBpB,iBAAiBH,eAAAA,MAAMI,OAAOuB;AAAAA,IAC9BC,WAAY,aAAY5B,eAAMI,MAAAA,OAAOyB,KAAM;AAAA,IAC3CC,cAAe,aAAY9B,eAAMI,MAAAA,OAAOyB,KAAM;AAAA,EAChD;AAAA,EACAG,kBAAkB;AAAA,IAChBtB,SAASV,eAAAA,MAAMsB,MAAME;AAAAA,EACvB;AAAA,EACAS,iBAAiB;AAAA,IACfrB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,eAAAA,MAAMsB,MAAME;AAAAA,IACrBU,KAAKlC,eAAAA,MAAMsB,MAAMC;AAAAA,IACjBR,YAAY;AAAA,EACd;AAAA,EACAoB,kBAAkB;AAAA,IAChBvB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,eAAAA,MAAMsB,MAAME;AAAAA,IACrBU,KAAKlC,eAAAA,MAAMsB,MAAMC;AAAAA,IACjBR,YAAY;AAAA,EACd;AAAA,EACAqB,iBAAiB;AAAA,IACfR,WAAY,aAAY5B,eAAMI,MAAAA,OAAOyB,KAAM;AAAA,IAC3CjB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfqB,KAAKlC,eAAAA,MAAMsB,MAAMC;AAAAA,IACjBb,SAASV,eAAAA,MAAMsB,MAAME;AAAAA,EACvB;AAAA,EACAa,gBAAgB;AAAA,IACdzB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAuB,iBAAiB;AAAA,IACf1B,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAwB,WAAW;AAAA,IACTC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,QAAQ1C,eAAMW,MAAAA,QAAQ,GAAGX,eAAAA,MAAMsB,MAAMC,EAAE;AAAA,IACvCxB,cAAcC,eAAAA,MAAMC,MAAM0C;AAAAA,IAC1BxC,iBAAiBH,eAAAA,MAAMI,OAAOwC;AAAAA,EAChC;AACF,CAAC;;;"}

package/dist/esm/components/Flow/Flow.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flow.js","sources":["../../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport {\n  DndContext,\n  DndContextProps,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\n\nimport { ReactFlowProvider } from \"reactflow\";\n\nimport { HvActionGeneric } from \"@hitachivantara/uikit-react-core\";\nimport { HvFlowNodeGroups, HvFlowNodeTypes } from \"./types\";\nimport { HvFlowProvider } from \"./FlowContext\";\nimport { HvDroppableFlow, HvDroppableFlowProps } from \"./DroppableFlow\";\nimport { HvFlowSidebarGroupItem } from \"./Sidebar/SidebarGroup/SidebarGroupItem\";\n\nexport interface HvFlowProps<\n  NodeData = any,\n  NodeType extends string | undefined = string | undefined,\n  NodeGroups extends keyof any = string\n> extends HvDroppableFlowProps<NodeData, NodeType> {\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow sidebar. */\n  sidebar?: React.ReactNode;\n  /** Flow default actions. */\n  defaultActions?: HvActionGeneric[];\n  /**\n   * Dnd Kit context props. This should be used for accessibility purposes.\n   *\n   * More information can be found on the [Dnd Kit documentation](https://docs.dndkit.com/guides/accessibility)\n   */\n  dndContextProps?: Pick<DndContextProps, \"accessibility\">;\n}\n\n/**\n * Flow component to build interactive node-based UIs.\n *\n * This implementation leverages [React Flow](https://reactflow.dev).\n * The drag and drop functionality leverages [Dnd Kit](https://docs.dndkit.com)\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvFlow = ({\n  nodeTypes,\n  nodeGroups,\n  sidebar,\n  defaultActions,\n  dndContextProps,\n  ...others\n}: HvFlowProps) => {\n  const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor)\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  // We're wrapping the main Flow component with the ReactFlowProvider to access the react flow instance.\n  // HvFlowContext is our custom internal context.\n  return (\n    <ReactFlowProvider>\n      <HvFlowProvider\n        nodeGroups={nodeGroups}\n        nodeTypes={nodeTypes}\n        defaultActions={defaultActions}\n      >\n        <DndContext\n          onDragStart={handleDragStart}\n          onDragEnd={handleDragEnd}\n          sensors={sensors}\n          modifiers={[restrictToWindowEdges]}\n          {...dndContextProps}\n        >\n          <HvDroppableFlow {...others} />\n          {sidebar}\n          <DragOverlay modifiers={[restrictToWindowEdges]}>\n            {draggingLabel ? (\n              <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n            ) : null}\n          </DragOverlay>\n        </DndContext>\n      </HvFlowProvider>\n    </ReactFlowProvider>\n  );\n};\n"],"names":["HvFlow","nodeTypes","nodeGroups","sidebar","defaultActions","dndContextProps","others","draggingLabel","setDraggingLabel","useState","undefined","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","restrictToWindowEdges"],"mappings":";;;;;;;;AAkDO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,QAAM,CAACC,eAAeC,gBAAgB,IAAIC,SAASC,MAAS;AAE5D,QAAMC,UAAUC,WACdC,UAAUC,aAAa,GACvBD,UAAUE,cAAc,CAC1B;AAEA,QAAMC,kBAAmDC,CAAU,UAAA;;AACjE,SAAIA,WAAMC,OAAOC,KAAKC,YAAlBH,mBAA2BI,QAAQ;AACrCb,wBAAiBS,WAAMC,OAAOC,KAAKC,QAAQC,WAA1BJ,mBAAkCK,KAAK;AAAA,IAC1D;AAAA,EAAA;AAGF,QAAMC,gBAA8CA,MAAM;AACxDf,qBAAiBE,MAAS;AAAA,EAAA;AAK5B,6BACG,mBACC,EAAA,UAAA,oBAAC,kBACC,YACA,WACA,gBAEA,UAAC,qBAAA,YAAA,EACC,aAAaM,iBACb,WAAWO,eACX,SACA,WAAW,CAACC,qBAAqB,GACjC,GAAInB,iBAEJ,UAAA;AAAA,IAAC,oBAAA,iBAAA,EAAgB,GAAIC,QAAO;AAAA,IAC3BH;AAAAA,IACA,oBAAA,aAAA,EAAY,WAAW,CAACqB,qBAAqB,GAC3CjB,UAAAA,gBACE,oBAAA,wBAAA,EAAuB,OAAOA,eAAe,YAAU,KAAA,CAAA,IACtD,MACN;AAAA,EAAA,GACF,GACF,EACF,CAAA;AAEJ;"}
+{"version":3,"file":"Flow.js","sources":["../../../../src/components/Flow/Flow.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport {\n  DndContext,\n  DndContextProps,\n  DragOverlay,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from \"@dnd-kit/core\";\nimport { restrictToWindowEdges } from \"@dnd-kit/modifiers\";\n\nimport { ReactFlowProvider } from \"reactflow\";\n\nimport {\n  HvFlowDefaultActions,\n  HvFlowNodeGroups,\n  HvFlowNodeTypes,\n} from \"./types\";\nimport { HvFlowProvider } from \"./FlowContext\";\nimport { HvDroppableFlow, HvDroppableFlowProps } from \"./DroppableFlow\";\nimport { HvFlowSidebarGroupItem } from \"./Sidebar/SidebarGroup/SidebarGroupItem\";\n\nexport interface HvFlowProps<\n  NodeData = any,\n  NodeType extends string | undefined = string | undefined,\n  NodeGroups extends keyof any = string\n> extends HvDroppableFlowProps<NodeData, NodeType> {\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow sidebar. */\n  sidebar?: React.ReactNode;\n  /** Flow default actions. */\n  defaultActions?: HvFlowDefaultActions[];\n  /**\n   * Dnd Kit context props. This should be used for accessibility purposes.\n   *\n   * More information can be found on the [Dnd Kit documentation](https://docs.dndkit.com/guides/accessibility)\n   */\n  dndContextProps?: Pick<DndContextProps, \"accessibility\">;\n}\n\n/**\n * Flow component to build interactive node-based UIs.\n *\n * This implementation leverages [React Flow](https://reactflow.dev).\n * The drag and drop functionality leverages [Dnd Kit](https://docs.dndkit.com)\n *\n * DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvFlow = ({\n  nodeTypes,\n  nodeGroups,\n  sidebar,\n  defaultActions,\n  dndContextProps,\n  ...others\n}: HvFlowProps) => {\n  const [draggingLabel, setDraggingLabel] = useState(undefined);\n\n  const sensors = useSensors(\n    useSensor(PointerSensor),\n    useSensor(KeyboardSensor)\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  // We're wrapping the main Flow component with the ReactFlowProvider to access the react flow instance.\n  // HvFlowContext is our custom internal context.\n  return (\n    <ReactFlowProvider>\n      <HvFlowProvider\n        nodeGroups={nodeGroups}\n        nodeTypes={nodeTypes}\n        defaultActions={defaultActions}\n      >\n        <DndContext\n          onDragStart={handleDragStart}\n          onDragEnd={handleDragEnd}\n          sensors={sensors}\n          modifiers={[restrictToWindowEdges]}\n          {...dndContextProps}\n        >\n          <HvDroppableFlow {...others} />\n          {sidebar}\n          <DragOverlay modifiers={[restrictToWindowEdges]}>\n            {draggingLabel ? (\n              <HvFlowSidebarGroupItem label={draggingLabel} isDragging />\n            ) : null}\n          </DragOverlay>\n        </DndContext>\n      </HvFlowProvider>\n    </ReactFlowProvider>\n  );\n};\n"],"names":["HvFlow","nodeTypes","nodeGroups","sidebar","defaultActions","dndContextProps","others","draggingLabel","setDraggingLabel","useState","undefined","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","handleDragStart","event","active","data","current","hvFlow","label","handleDragEnd","restrictToWindowEdges"],"mappings":";;;;;;;;AAqDO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,QAAM,CAACC,eAAeC,gBAAgB,IAAIC,SAASC,MAAS;AAE5D,QAAMC,UAAUC,WACdC,UAAUC,aAAa,GACvBD,UAAUE,cAAc,CAC1B;AAEA,QAAMC,kBAAmDC,CAAU,UAAA;;AACjE,SAAIA,WAAMC,OAAOC,KAAKC,YAAlBH,mBAA2BI,QAAQ;AACrCb,wBAAiBS,WAAMC,OAAOC,KAAKC,QAAQC,WAA1BJ,mBAAkCK,KAAK;AAAA,IAC1D;AAAA,EAAA;AAGF,QAAMC,gBAA8CA,MAAM;AACxDf,qBAAiBE,MAAS;AAAA,EAAA;AAK5B,6BACG,mBACC,EAAA,UAAA,oBAAC,kBACC,YACA,WACA,gBAEA,UAAC,qBAAA,YAAA,EACC,aAAaM,iBACb,WAAWO,eACX,SACA,WAAW,CAACC,qBAAqB,GACjC,GAAInB,iBAEJ,UAAA;AAAA,IAAC,oBAAA,iBAAA,EAAgB,GAAIC,QAAO;AAAA,IAC3BH;AAAAA,IACA,oBAAA,aAAA,EAAY,WAAW,CAACqB,qBAAqB,GAC3CjB,UAAAA,gBACE,oBAAA,wBAAA,EAAuB,OAAOA,eAAe,YAAU,KAAA,CAAA,IACtD,MACN;AAAA,EAAA,GACF,GACF,EACF,CAAA;AAEJ;"}

package/dist/esm/components/Flow/Flow.styles.js

@@ -21,22 +21,16 @@ const {
       backgroundColor: theme.colors.negative_20,
       width: 12,
       height: 12,
-      "&.react-flow__handle-top": {
-        top: -6
-      },
-      "&.react-flow__handle-bottom": {
-        bottom: -6
+      "&.react-flow__handle-left": {
+        translate: "0 4px"
       }
     },
     "& .react-flow__handle-valid": {
       backgroundColor: theme.colors.positive_20,
       width: 12,
       height: 12,
-      "&.react-flow__handle-top": {
-        top: -6
-      },
-      "&.react-flow__handle-bottom": {
-        bottom: -6
+      "&.react-flow__handle-left": {
+        translate: "0 4px"
       }
     },
     [`& .selected > .${staticClasses$1.root}`]: {

package/dist/esm/components/Flow/Flow.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flow.styles.js","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\nimport { flowNodeClasses } from \"./Node\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlow\", {\n  root: {\n    height: \"100%\",\n    \"& .react-flow__handle\": {\n      backgroundColor: theme.colors.secondary_60,\n      width: 8,\n      height: 8,\n      zIndex: theme.zIndices.overlay,\n    },\n    \"& .react-flow__handle-connecting\": {\n      backgroundColor: theme.colors.negative_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-top\": {\n        top: -6,\n      },\n      \"&.react-flow__handle-bottom\": {\n        bottom: -6,\n      },\n    },\n    \"& .react-flow__handle-valid\": {\n      backgroundColor: theme.colors.positive_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-top\": {\n        top: -6,\n      },\n      \"&.react-flow__handle-bottom\": {\n        bottom: -6,\n      },\n    },\n    [`& .selected > .${flowNodeClasses.root}`]: {\n      border: `1px solid ${theme.colors.secondary_60}`,\n      borderRadius: theme.radii.round,\n      boxSizing: \"border-box\",\n    },\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","height","backgroundColor","theme","colors","secondary_60","width","zIndex","zIndices","overlay","negative_20","top","bottom","positive_20","flowNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":";;;;;;;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,UAAU;AAAA,EACnEC,MAAM;AAAA,IACJC,QAAQ;AAAA,IACR,yBAAyB;AAAA,MACvBC,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,OAAO;AAAA,MACPL,QAAQ;AAAA,MACRM,QAAQJ,MAAMK,SAASC;AAAAA,IACzB;AAAA,IACA,oCAAoC;AAAA,MAClCP,iBAAiBC,MAAMC,OAAOM;AAAAA,MAC9BJ,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,4BAA4B;AAAA,QAC1BU,KAAK;AAAA,MACP;AAAA,MACA,+BAA+B;AAAA,QAC7BC,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,+BAA+B;AAAA,MAC7BV,iBAAiBC,MAAMC,OAAOS;AAAAA,MAC9BP,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,4BAA4B;AAAA,QAC1BU,KAAK;AAAA,MACP;AAAA,MACA,+BAA+B;AAAA,QAC7BC,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAE,kBAAiBE,gBAAgBd,IAAK,EAAC,GAAG;AAAA,MAC1Ce,QAAS,aAAYZ,MAAMC,OAAOC,YAAa;AAAA,MAC/CW,cAAcb,MAAMc,MAAMC;AAAAA,MAC1BC,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;"}
+{"version":3,"file":"Flow.styles.js","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\nimport { flowNodeClasses } from \"./Node\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlow\", {\n  root: {\n    height: \"100%\",\n    \"& .react-flow__handle\": {\n      backgroundColor: theme.colors.secondary_60,\n      width: 8,\n      height: 8,\n      zIndex: theme.zIndices.overlay,\n    },\n    \"& .react-flow__handle-connecting\": {\n      backgroundColor: theme.colors.negative_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-left\": {\n        translate: \"0 4px\",\n      },\n    },\n    \"& .react-flow__handle-valid\": {\n      backgroundColor: theme.colors.positive_20,\n      width: 12,\n      height: 12,\n      \"&.react-flow__handle-left\": {\n        translate: \"0 4px\",\n      },\n    },\n    [`& .selected > .${flowNodeClasses.root}`]: {\n      border: `1px solid ${theme.colors.secondary_60}`,\n      borderRadius: theme.radii.round,\n      boxSizing: \"border-box\",\n    },\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","height","backgroundColor","theme","colors","secondary_60","width","zIndex","zIndices","overlay","negative_20","translate","positive_20","flowNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":";;;;;;;AAGa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,UAAU;AAAA,EACnEC,MAAM;AAAA,IACJC,QAAQ;AAAA,IACR,yBAAyB;AAAA,MACvBC,iBAAiBC,MAAMC,OAAOC;AAAAA,MAC9BC,OAAO;AAAA,MACPL,QAAQ;AAAA,MACRM,QAAQJ,MAAMK,SAASC;AAAAA,IACzB;AAAA,IACA,oCAAoC;AAAA,MAClCP,iBAAiBC,MAAMC,OAAOM;AAAAA,MAC9BJ,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3BU,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,+BAA+B;AAAA,MAC7BT,iBAAiBC,MAAMC,OAAOQ;AAAAA,MAC9BN,OAAO;AAAA,MACPL,QAAQ;AAAA,MACR,6BAA6B;AAAA,QAC3BU,WAAW;AAAA,MACb;AAAA,IACF;AAAA,IACA,CAAE,kBAAiBE,gBAAgBb,IAAK,EAAC,GAAG;AAAA,MAC1Cc,QAAS,aAAYX,MAAMC,OAAOC,YAAa;AAAA,MAC/CU,cAAcZ,MAAMa,MAAMC;AAAAA,MAC1BC,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;"}

package/dist/esm/components/Flow/FlowContext/FlowContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlowContext.js","sources":["../../../../../src/components/Flow/FlowContext/FlowContext.tsx"],"sourcesContent":["import { HvActionGeneric } from \"@hitachivantara/uikit-react-core\";\nimport {\n  Dispatch,\n  SetStateAction,\n  createContext,\n  useContext,\n  useMemo,\n  useState,\n} from \"react\";\n\nimport { HvFlowNodeGroups, HvFlowNodeTypes } from \"../types\";\n\nexport interface HvFlowContextValue<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes groups expanded on sidebar. */\n  expandedNodeGroups?: string[];\n  /** Flow default actions. */\n  defaultActions?: HvActionGeneric[];\n  /** Function to set `expandedNodeGroups`. */\n  setExpandedNodeGroups?: Dispatch<SetStateAction<string[]>>;\n}\n\nexport const HvFlowContext = createContext<HvFlowContextValue>({});\n\nexport interface HvFlowProviderProps<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowContextValue<NodeGroups>[\"nodeTypes\"];\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowContextValue<NodeGroups>[\"nodeGroups\"];\n  /** Flow default actions. */\n  defaultActions?: HvActionGeneric[];\n  /** Children. */\n  children?: React.ReactNode;\n}\n\nexport const HvFlowProvider = ({\n  nodeGroups,\n  nodeTypes,\n  defaultActions,\n  children,\n}: HvFlowProviderProps) => {\n  const [expandedNodeGroups, setExpandedNodeGroups] = useState<string[]>([]);\n\n  const value = useMemo(\n    () => ({\n      nodeTypes,\n      nodeGroups,\n      defaultActions,\n      expandedNodeGroups,\n      setExpandedNodeGroups,\n    }),\n    [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]\n  );\n\n  return (\n    <HvFlowContext.Provider value={value}>{children}</HvFlowContext.Provider>\n  );\n};\n\nexport const useFlowContext = () => useContext(HvFlowContext);\n"],"names":["HvFlowContext","createContext","HvFlowProvider","nodeGroups","nodeTypes","defaultActions","children","expandedNodeGroups","setExpandedNodeGroups","useState","value","useMemo","useFlowContext","useContext"],"mappings":";;AAyBaA,MAAAA,gBAAgBC,cAAkC,EAAE;AAa1D,MAAMC,iBAAiBA,CAAC;AAAA,EAC7BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACmB,MAAM;AACzB,QAAM,CAACC,oBAAoBC,qBAAqB,IAAIC,SAAmB,CAAE,CAAA;AAEnEC,QAAAA,QAAQC,QACZ,OAAO;AAAA,IACLP;AAAAA,IACAD;AAAAA,IACAE;AAAAA,IACAE;AAAAA,IACAC;AAAAA,EAAAA,IAEF,CAACJ,WAAWD,YAAYE,gBAAgBE,kBAAkB,CAC5D;AAEA,SACG,oBAAA,cAAc,UAAd,EAAuB,OAAeD,SAAS,CAAA;AAEpD;AAEaM,MAAAA,iBAAiBA,MAAMC,WAAWb,aAAa;"}
+{"version":3,"file":"FlowContext.js","sources":["../../../../../src/components/Flow/FlowContext/FlowContext.tsx"],"sourcesContent":["import {\n  Dispatch,\n  SetStateAction,\n  createContext,\n  useContext,\n  useMemo,\n  useState,\n} from \"react\";\n\nimport {\n  HvFlowDefaultActions,\n  HvFlowNodeGroups,\n  HvFlowNodeTypes,\n} from \"../types\";\n\nexport interface HvFlowContextValue<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowNodeTypes<NodeGroups>;\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowNodeGroups<NodeGroups>;\n  /** Flow nodes groups expanded on sidebar. */\n  expandedNodeGroups?: string[];\n  /** Flow default actions. */\n  defaultActions?: HvFlowDefaultActions[];\n  /** Function to set `expandedNodeGroups`. */\n  setExpandedNodeGroups?: Dispatch<SetStateAction<string[]>>;\n}\n\nexport const HvFlowContext = createContext<HvFlowContextValue>({});\n\nexport interface HvFlowProviderProps<NodeGroups extends keyof any = string> {\n  /** Flow nodes types. */\n  nodeTypes?: HvFlowContextValue<NodeGroups>[\"nodeTypes\"];\n  /** Flow nodes groups. */\n  nodeGroups?: HvFlowContextValue<NodeGroups>[\"nodeGroups\"];\n  /** Flow default actions. */\n  defaultActions?: HvFlowDefaultActions[];\n  /** Children. */\n  children?: React.ReactNode;\n}\n\nexport const HvFlowProvider = ({\n  nodeGroups,\n  nodeTypes,\n  defaultActions,\n  children,\n}: HvFlowProviderProps) => {\n  const [expandedNodeGroups, setExpandedNodeGroups] = useState<string[]>([]);\n\n  const value = useMemo(\n    () => ({\n      nodeTypes,\n      nodeGroups,\n      defaultActions,\n      expandedNodeGroups,\n      setExpandedNodeGroups,\n    }),\n    [nodeTypes, nodeGroups, defaultActions, expandedNodeGroups]\n  );\n\n  return (\n    <HvFlowContext.Provider value={value}>{children}</HvFlowContext.Provider>\n  );\n};\n\nexport const useFlowContext = () => useContext(HvFlowContext);\n"],"names":["HvFlowContext","createContext","HvFlowProvider","nodeGroups","nodeTypes","defaultActions","children","expandedNodeGroups","setExpandedNodeGroups","useState","value","useMemo","useFlowContext","useContext"],"mappings":";;AA4BaA,MAAAA,gBAAgBC,cAAkC,EAAE;AAa1D,MAAMC,iBAAiBA,CAAC;AAAA,EAC7BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AACmB,MAAM;AACzB,QAAM,CAACC,oBAAoBC,qBAAqB,IAAIC,SAAmB,CAAE,CAAA;AAEnEC,QAAAA,QAAQC,QACZ,OAAO;AAAA,IACLP;AAAAA,IACAD;AAAAA,IACAE;AAAAA,IACAE;AAAAA,IACAC;AAAAA,EAAAA,IAEF,CAACJ,WAAWD,YAAYE,gBAAgBE,kBAAkB,CAC5D;AAEA,SACG,oBAAA,cAAc,UAAd,EAAuB,OAAeD,SAAS,CAAA;AAEpD;AAEaM,MAAAA,iBAAiBA,MAAMC,WAAWb,aAAa;"}

package/dist/esm/components/Flow/Node/Node.js

@@ -26,7 +26,8 @@ const HvFlowNode = ({
   actionCallback,
   maxVisibleActions = 1,
   classes: classesProp,
-  className
+  className,
+  children
 }) => {
   var _a, _b, _c, _d, _e, _f;
   const [showParams, setShowParams] = useState(expanded);
@@ -58,7 +59,7 @@ const HvFlowNode = ({
       if (n.id === id) {
         if (Object.keys(n.data).length === 0) {
           params == null ? void 0 : params.forEach((param) => {
-            n.data[param.label] = param.value;
+            n.data[param.id] = param.value;
           });
         }
       }
@@ -127,24 +128,30 @@ const HvFlowNode = ({
         } })
       ] }) })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Inputs" }) }),
-    /* @__PURE__ */ jsx("div", { className: classes.inputsContainer, children: inputs == null ? void 0 : inputs.map((input, idx) => /* @__PURE__ */ jsxs("div", { className: classes.inputContainer, children: [
-      /* @__PURE__ */ jsx(Handle, { type: "target", isConnectableStart: false, id: `${idx}`, position: Position.Left, style: {
-        top: 160 + 29 * idx
-      } }),
-      /* @__PURE__ */ jsx(HvTypography, { children: input.label }),
-      input.isMandatory && !isInputConnected(id, "target", idx, edges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory })
-    ] }, idx)) }),
+    children && /* @__PURE__ */ jsx("div", { className: classes.contentContainer, children }),
     showParams && params && /* @__PURE__ */ jsx("div", { className: classes.paramsContainer, children: /* @__PURE__ */ jsx(ParamRenderer, { nodeId: id, params, data: node == null ? void 0 : node.data }) }),
-    /* @__PURE__ */ jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Outputs" }) }),
-    /* @__PURE__ */ jsx("div", { className: classes.outputsContainer, children: outputs == null ? void 0 : outputs.map((output, idx) => /* @__PURE__ */ jsxs("div", { className: classes.outputContainer, children: [
-      /* @__PURE__ */ jsx(Handle, { type: "source", isConnectableEnd: false, id: `${idx}`, position: Position.Right, style: {
-        bottom: -8 + 29 * (outputs.length - idx),
-        top: "auto"
-      } }),
-      output.isMandatory && !isInputConnected(id, "source", idx, edges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory }),
-      /* @__PURE__ */ jsx(HvTypography, { children: output.label })
-    ] }, idx)) })
+    inputs && inputs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Inputs" }) }),
+      /* @__PURE__ */ jsx("div", { className: classes.inputsContainer, children: inputs == null ? void 0 : inputs.map((input, idx) => /* @__PURE__ */ jsxs("div", { className: classes.inputContainer, children: [
+        /* @__PURE__ */ jsx(Handle, { type: "target", isConnectableStart: false, id: `${idx}`, position: Position.Left, style: {
+          top: "auto",
+          bottom: ((outputs == null ? void 0 : outputs.length) ? 80 : 18) + ((outputs == null ? void 0 : outputs.length) || 0) * 29 + 29 * idx
+        } }),
+        /* @__PURE__ */ jsx(HvTypography, { children: input.label }),
+        input.isMandatory && !isInputConnected(id, "target", idx, edges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory })
+      ] }, idx)) })
+    ] }),
+    outputs && outputs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx("div", { className: classes.outputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: "Outputs" }) }),
+      /* @__PURE__ */ jsx("div", { className: classes.outputsContainer, children: outputs == null ? void 0 : outputs.map((output, idx) => /* @__PURE__ */ jsxs("div", { className: classes.outputContainer, children: [
+        /* @__PURE__ */ jsx(Handle, { type: "source", isConnectableEnd: false, id: `${idx}`, position: Position.Right, style: {
+          bottom: -10 + 29 * (outputs.length - idx),
+          top: "auto"
+        } }),
+        output.isMandatory && !isInputConnected(id, "source", idx, edges) && /* @__PURE__ */ jsx("div", { className: classes.mandatory }),
+        /* @__PURE__ */ jsx(HvTypography, { children: output.label })
+      ] }, idx)) })
+    ] })
   ] });
 };
 export {

package/dist/esm/components/Flow/Node/Node.js.map

@@ -1 +1 @@
-{"version":3,"file":"Node.js","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import {\n  ExtractNames,\n  HvActionGeneric,\n  HvActionsGenericProps,\n  HvBaseProps,\n  HvButton,\n  HvDropDownMenu,\n  HvTooltip,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\nimport { getColor, theme } from \"@hitachivantara/uikit-styles\";\nimport { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n  Handle,\n  NodeProps,\n  NodeToolbar,\n  Position,\n  useReactFlow,\n  useStore,\n} from \"reactflow\";\nimport { useFlowContext } from \"../FlowContext/FlowContext\";\n\nimport { HvFlowNodeInput, HvFlowNodeOutput, HvFlowNodeParam } from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowNodeProps extends Omit<HvBaseProps, \"id\">, NodeProps {\n  /** Node description */\n  description: string;\n  /** Node expanded */\n  expanded?: boolean;\n  /** Node inputs */\n  inputs?: HvFlowNodeInput[];\n  /** Node outputs */\n  outputs?: HvFlowNodeOutput[];\n  /** Node parameters */\n  params?: HvFlowNodeParam[];\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  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowNodeClasses;\n}\n\nconst isInputConnected = (id, type, idx, edges) => {\n  if (type === \"target\") {\n    return edges.some(\n      (e) => e.target === id && e.targetHandle === idx.toString()\n    );\n  }\n  if (type === \"source\") {\n    return edges.some(\n      (e) => e.source === id && e.sourceHandle === idx.toString()\n    );\n  }\n};\n\nexport const HvFlowNode = ({\n  id,\n  type,\n  description,\n  expanded = false,\n  params,\n  actions,\n  actionCallback,\n  maxVisibleActions = 1,\n  classes: classesProp,\n  className,\n}: HvFlowNodeProps) => {\n  const [showParams, setShowParams] = useState(expanded);\n  const [showActions, setShowActions] = useState(false);\n  const reactFlowInstance = useReactFlow();\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n  const edges = useStore((s) => s.edges);\n  const nodes = useStore((s) => s.getNodes());\n\n  const node = nodes.find((n) => n.id === id);\n\n  const groupId = nodeTypes?.[type].meta?.groupId;\n  const title = nodeTypes?.[type].meta?.label;\n  const groupLabel = groupId && nodeGroups && nodeGroups[groupId].label;\n\n  const inputs = nodeTypes?.[type]?.meta?.inputs;\n  const outputs = nodeTypes?.[type]?.meta?.outputs;\n  const icon = groupId && nodeGroups && nodeGroups[groupId].icon;\n  const colorProp = groupId && nodeGroups && nodeGroups[groupId].color;\n  const color = getColor(colorProp);\n\n  useEffect(() => {\n    const newNodes = nodes.map((n) => {\n      if (n.id === id) {\n        if (Object.keys(n.data).length === 0) {\n          params?.forEach((param) => {\n            n.data[param.label] = param.value;\n          });\n        }\n      }\n      return n;\n    });\n    reactFlowInstance.setNodes(newNodes);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleDefaultAction = useCallback(\n    (action: string) => {\n      if (!node) return;\n\n      switch (action) {\n        case \"delete\":\n          reactFlowInstance.deleteElements({ nodes: [node] });\n          break;\n        case \"duplicate\":\n          reactFlowInstance.addNodes([\n            {\n              ...node,\n              id: `${reactFlowInstance.getNodes().length + 1}`,\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  const hasParams = !!(params && params.length > 0);\n\n  if (!node) return null;\n\n  const actsVisible = actions?.slice(0, maxVisibleActions);\n  const actsDropdown = actions?.slice(maxVisibleActions);\n\n  const renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n    isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\n  return (\n    <div\n      className={cx(\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        {defaultActions?.map((action) => (\n          <HvButton icon onClick={() => handleDefaultAction(action.id)}>\n            {renderedIcon(action.icon)}\n          </HvButton>\n        ))}\n      </NodeToolbar>\n      <div\n        className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n      >\n        <div className={classes.groupContainer}>\n          {icon}\n          <HvTypography variant=\"title4\" className={classes.group}>\n            {groupLabel}\n          </HvTypography>\n        </div>\n        <div style={{ display: \"flex\" }}>\n          <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n            <div>\n              <Info />\n            </div>\n          </HvTooltip>\n          <HvButton\n            icon\n            disabled={!hasParams}\n            onClick={() => setShowParams((p) => !p)}\n          >\n            {showParams ? <Up /> : <Down />}\n          </HvButton>\n        </div>\n      </div>\n      <div className={classes.titleContainer}>\n        <div>\n          <HvTypography>{title}</HvTypography>\n        </div>\n        <div className={classes.actions}>\n          {actions?.length && actions?.length > 0 && (\n            <>\n              {actsVisible?.map((action) => (\n                <HvTooltip title={<HvTypography>{action.label}</HvTypography>}>\n                  <div>\n                    <HvButton\n                      icon\n                      onClick={(event) => {\n                        actionCallback?.(event, node.id, action);\n                      }}\n                    >\n                      {renderedIcon(action.icon)}\n                    </HvButton>\n                  </div>\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, node.id, action as HvActionGeneric);\n                  }}\n                />\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      <div className={classes.inputsTitleContainer}>\n        <HvTypography>Inputs</HvTypography>\n      </div>\n      <div className={classes.inputsContainer}>\n        {inputs?.map((input, idx) => (\n          <div className={classes.inputContainer} key={idx}>\n            <Handle\n              type=\"target\"\n              isConnectableStart={false}\n              id={`${idx}`}\n              position={Position.Left}\n              style={{\n                top: 160 + 29 * idx,\n              }}\n            />\n            <HvTypography>{input.label}</HvTypography>\n            {input.isMandatory &&\n              !isInputConnected(id, \"target\", idx, edges) && (\n                <div className={classes.mandatory} />\n              )}\n          </div>\n        ))}\n      </div>\n      {showParams && params && (\n        <div className={classes.paramsContainer}>\n          <ParamRenderer nodeId={id} params={params} data={node?.data} />\n        </div>\n      )}\n      <div className={classes.outputsTitleContainer}>\n        <HvTypography>Outputs</HvTypography>\n      </div>\n      <div className={classes.outputsContainer}>\n        {outputs?.map((output, idx) => (\n          <div className={classes.outputContainer} key={idx}>\n            <Handle\n              type=\"source\"\n              isConnectableEnd={false}\n              id={`${idx}`}\n              position={Position.Right}\n              style={{\n                bottom: -8 + 29 * (outputs.length - idx),\n                top: \"auto\",\n              }}\n            />\n            {output.isMandatory &&\n              !isInputConnected(id, \"source\", idx, edges) && (\n                <div className={classes.mandatory} />\n              )}\n            <HvTypography>{output.label}</HvTypography>\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n"],"names":["isInputConnected","id","type","idx","edges","some","e","target","targetHandle","toString","source","sourceHandle","HvFlowNode","description","expanded","params","actions","actionCallback","maxVisibleActions","classes","classesProp","className","showParams","setShowParams","useState","showActions","setShowActions","reactFlowInstance","useReactFlow","cx","css","useClasses","nodeGroups","nodeTypes","defaultActions","useFlowContext","useStore","s","nodes","getNodes","node","find","n","groupId","meta","title","label","groupLabel","inputs","outputs","icon","colorProp","color","getColor","useEffect","newNodes","map","Object","keys","data","length","forEach","param","value","setNodes","handleDefaultAction","useCallback","action","deleteElements","addNodes","position","x","y","height","selected","zIndex","Number","theme","zIndices","overlay","hasParams","actsVisible","slice","actsDropdown","renderedIcon","actionIcon","isValidElement","border","root","backgroundColor","headerContainer","groupContainer","group","display","p","titleContainer","event","inputsTitleContainer","inputsContainer","input","inputContainer","Position","Left","top","isMandatory","mandatory","paramsContainer","outputsTitleContainer","outputsContainer","output","outputContainer","Right","bottom"],"mappings":"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"}
+{"version":3,"file":"Node.js","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import {\n  ExtractNames,\n  HvActionGeneric,\n  HvActionsGenericProps,\n  HvBaseProps,\n  HvButton,\n  HvDropDownMenu,\n  HvTooltip,\n  HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\nimport { getColor, theme } from \"@hitachivantara/uikit-styles\";\nimport { isValidElement, useCallback, useEffect, useState } from \"react\";\nimport {\n  Handle,\n  NodeProps,\n  NodeToolbar,\n  Position,\n  useReactFlow,\n  useStore,\n} from \"reactflow\";\nimport { useFlowContext } from \"../FlowContext/FlowContext\";\n\nimport {\n  HvFlowDefaultAction,\n  HvFlowNodeInput,\n  HvFlowNodeOutput,\n  HvFlowNodeParam,\n} from \"../types\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\n\nexport { staticClasses as flowNodeClasses };\n\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFlowNodeProps extends Omit<HvBaseProps, \"id\">, NodeProps {\n  /** Node description */\n  description: string;\n  /** Node expanded */\n  expanded?: boolean;\n  /** Node inputs */\n  inputs?: HvFlowNodeInput[];\n  /** Node outputs */\n  outputs?: HvFlowNodeOutput[];\n  /** Node parameters */\n  params?: HvFlowNodeParam[];\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  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvFlowNodeClasses;\n}\n\nconst isInputConnected = (id, type, idx, edges) => {\n  if (type === \"target\") {\n    return edges.some(\n      (e) => e.target === id && e.targetHandle === idx.toString()\n    );\n  }\n  if (type === \"source\") {\n    return edges.some(\n      (e) => e.source === id && e.sourceHandle === idx.toString()\n    );\n  }\n};\n\nexport const HvFlowNode = ({\n  id,\n  type,\n  description,\n  expanded = false,\n  params,\n  actions,\n  actionCallback,\n  maxVisibleActions = 1,\n  classes: classesProp,\n  className,\n  children,\n}: HvFlowNodeProps) => {\n  const [showParams, setShowParams] = useState(expanded);\n  const [showActions, setShowActions] = useState(false);\n  const reactFlowInstance = useReactFlow();\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n  const edges = useStore((s) => s.edges);\n  const nodes = useStore((s) => s.getNodes());\n\n  const node = nodes.find((n) => n.id === id);\n\n  const groupId = nodeTypes?.[type].meta?.groupId;\n  const title = nodeTypes?.[type].meta?.label;\n  const groupLabel = groupId && nodeGroups && nodeGroups[groupId].label;\n\n  const inputs = nodeTypes?.[type]?.meta?.inputs;\n  const outputs = nodeTypes?.[type]?.meta?.outputs;\n  const icon = groupId && nodeGroups && nodeGroups[groupId].icon;\n  const colorProp = groupId && nodeGroups && nodeGroups[groupId].color;\n  const color = getColor(colorProp);\n\n  useEffect(() => {\n    const newNodes = nodes.map((n) => {\n      if (n.id === id) {\n        if (Object.keys(n.data).length === 0) {\n          params?.forEach((param) => {\n            n.data[param.id] = param.value;\n          });\n        }\n      }\n      return n;\n    });\n    reactFlowInstance.setNodes(newNodes);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleDefaultAction = useCallback(\n    (action: HvFlowDefaultAction) => {\n      if (!node) return;\n\n      switch (action) {\n        case \"delete\":\n          reactFlowInstance.deleteElements({ nodes: [node] });\n          break;\n        case \"duplicate\":\n          reactFlowInstance.addNodes([\n            {\n              ...node,\n              id: `${reactFlowInstance.getNodes().length + 1}`,\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  const hasParams = !!(params && params.length > 0);\n\n  if (!node) return null;\n\n  const actsVisible = actions?.slice(0, maxVisibleActions);\n  const actsDropdown = actions?.slice(maxVisibleActions);\n\n  const renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n    isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\n  return (\n    <div\n      className={cx(\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        {defaultActions?.map((action) => (\n          <HvButton icon onClick={() => handleDefaultAction(action.id)}>\n            {renderedIcon(action.icon)}\n          </HvButton>\n        ))}\n      </NodeToolbar>\n      <div\n        className={cx(css({ backgroundColor: color }), classes.headerContainer)}\n      >\n        <div className={classes.groupContainer}>\n          {icon}\n          <HvTypography variant=\"title4\" className={classes.group}>\n            {groupLabel}\n          </HvTypography>\n        </div>\n        <div style={{ display: \"flex\" }}>\n          <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n            <div>\n              <Info />\n            </div>\n          </HvTooltip>\n          <HvButton\n            icon\n            disabled={!hasParams}\n            onClick={() => setShowParams((p) => !p)}\n          >\n            {showParams ? <Up /> : <Down />}\n          </HvButton>\n        </div>\n      </div>\n      <div className={classes.titleContainer}>\n        <div>\n          <HvTypography>{title}</HvTypography>\n        </div>\n        <div className={classes.actions}>\n          {actions?.length && actions?.length > 0 && (\n            <>\n              {actsVisible?.map((action) => (\n                <HvTooltip title={<HvTypography>{action.label}</HvTypography>}>\n                  <div>\n                    <HvButton\n                      icon\n                      onClick={(event) => {\n                        actionCallback?.(event, node.id, action);\n                      }}\n                    >\n                      {renderedIcon(action.icon)}\n                    </HvButton>\n                  </div>\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, node.id, action as HvActionGeneric);\n                  }}\n                />\n              )}\n            </>\n          )}\n        </div>\n      </div>\n      {children && <div className={classes.contentContainer}>{children}</div>}\n      {showParams && params && (\n        <div className={classes.paramsContainer}>\n          <ParamRenderer nodeId={id} params={params} data={node?.data} />\n        </div>\n      )}\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              <div className={classes.inputContainer} key={idx}>\n                <Handle\n                  type=\"target\"\n                  isConnectableStart={false}\n                  id={`${idx}`}\n                  position={Position.Left}\n                  style={{\n                    top: \"auto\",\n                    bottom:\n                      (outputs?.length ? 80 : 18) +\n                      (outputs?.length || 0) * 29 +\n                      29 * idx,\n                  }}\n                />\n                <HvTypography>{input.label}</HvTypography>\n                {input.isMandatory &&\n                  !isInputConnected(id, \"target\", idx, edges) && (\n                    <div className={classes.mandatory} />\n                  )}\n              </div>\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              <div className={classes.outputContainer} key={idx}>\n                <Handle\n                  type=\"source\"\n                  isConnectableEnd={false}\n                  id={`${idx}`}\n                  position={Position.Right}\n                  style={{\n                    bottom: -10 + 29 * (outputs.length - idx),\n                    top: \"auto\",\n                  }}\n                />\n                {output.isMandatory &&\n                  !isInputConnected(id, \"source\", idx, edges) && (\n                    <div className={classes.mandatory} />\n                  )}\n                <HvTypography>{output.label}</HvTypography>\n              </div>\n            ))}\n          </div>\n        </>\n      )}\n    </div>\n  );\n};\n"],"names":["isInputConnected","id","type","idx","edges","some","e","target","targetHandle","toString","source","sourceHandle","HvFlowNode","description","expanded","params","actions","actionCallback","maxVisibleActions","classes","classesProp","className","children","showParams","setShowParams","useState","showActions","setShowActions","reactFlowInstance","useReactFlow","cx","css","useClasses","nodeGroups","nodeTypes","defaultActions","useFlowContext","useStore","s","nodes","getNodes","node","find","n","groupId","meta","title","label","groupLabel","inputs","outputs","icon","colorProp","color","getColor","useEffect","newNodes","map","Object","keys","data","length","forEach","param","value","setNodes","handleDefaultAction","useCallback","action","deleteElements","addNodes","position","x","y","height","selected","zIndex","Number","theme","zIndices","overlay","hasParams","actsVisible","slice","actsDropdown","renderedIcon","actionIcon","isValidElement","border","root","backgroundColor","headerContainer","groupContainer","group","display","p","titleContainer","event","contentContainer","paramsContainer","inputsTitleContainer","inputsContainer","input","inputContainer","Position","Left","top","bottom","isMandatory","mandatory","outputsTitleContainer","outputsContainer","output","outputContainer","Right"],"mappings":"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"}

package/dist/esm/components/Flow/Node/Node.styles.js

@@ -25,6 +25,7 @@ const {
     color: theme.colors.base_dark
   },
   titleContainer: {
+    minHeight: 48,
     padding: theme.spacing(theme.space.xs, theme.space.xs, theme.space.xs, theme.space.sm),
     display: "flex",
     flexDirection: "row",
@@ -51,6 +52,9 @@ const {
     borderTop: `1px solid ${theme.colors.atmo4}`,
     borderBottom: `1px solid ${theme.colors.atmo4}`
   },
+  contentContainer: {
+    padding: theme.space.sm
+  },
   inputsContainer: {
     display: "flex",
     flexDirection: "column",

package/dist/esm/components/Flow/Node/Node.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Node.styles.js","sources":["../../../../../src/components/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\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  },\n  groupContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  group: {\n    color: theme.colors.base_dark,\n  },\n  titleContainer: {\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  inputsTitleContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    padding: theme.space.xs,\n    backgroundColor: theme.colors.atmo2,\n    borderTop: `1px solid ${theme.colors.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\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.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n  },\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  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  inputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  outputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\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});\n"],"names":["staticClasses","useClasses","createClasses","root","borderRadius","theme","radii","round","backgroundColor","colors","atmo1","boxShadow","shadow","minWidth","headerContainer","padding","spacing","display","flexDirection","justifyContent","alignItems","groupContainer","group","color","base_dark","titleContainer","space","xs","sm","actions","inputsTitleContainer","atmo2","borderTop","atmo4","borderBottom","outputsTitleContainer","inputsContainer","gap","outputsContainer","paramsContainer","inputContainer","outputContainer","mandatory","width","height","margin","circle","negative_20"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,cAAc;AAAA,EACvEC,MAAM;AAAA,IACJC,cAAcC,MAAMC,MAAMC;AAAAA,IAC1BC,iBAAiBH,MAAMI,OAAOC;AAAAA,IAC9BC,WAAWN,MAAMI,OAAOG;AAAAA,IACxBC,UAAU;AAAA,EACZ;AAAA,EACAC,iBAAiB;AAAA,IACfC,SAASV,MAAMW,QAAQ,KAAK,CAAC;AAAA,IAC7BC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,gBAAgB;AAAA,IACdJ,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAE,OAAO;AAAA,IACLC,OAAOlB,MAAMI,OAAOe;AAAAA,EACtB;AAAA,EACAC,gBAAgB;AAAA,IACdV,SAASV,MAAMW,QACbX,MAAMqB,MAAMC,IACZtB,MAAMqB,MAAMC,IACZtB,MAAMqB,MAAMC,IACZtB,MAAMqB,MAAME,EACd;AAAA,IACAX,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAS,SAAS;AAAA,IACPZ,SAAS;AAAA,IACTG,YAAY;AAAA,EACd;AAAA,EACAU,sBAAsB;AAAA,IACpBb,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,MAAMqB,MAAMC;AAAAA,IACrBnB,iBAAiBH,MAAMI,OAAOsB;AAAAA,IAC9BC,WAAY,aAAY3B,MAAMI,OAAOwB,KAAM;AAAA,IAC3CC,cAAe,aAAY7B,MAAMI,OAAOwB,KAAM;AAAA,EAChD;AAAA,EACAE,uBAAuB;AAAA,IACrBlB,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,MAAMqB,MAAMC;AAAAA,IACrBnB,iBAAiBH,MAAMI,OAAOsB;AAAAA,IAC9BC,WAAY,aAAY3B,MAAMI,OAAOwB,KAAM;AAAA,IAC3CC,cAAe,aAAY7B,MAAMI,OAAOwB,KAAM;AAAA,EAChD;AAAA,EACAG,iBAAiB;AAAA,IACfnB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,MAAMqB,MAAME;AAAAA,IACrBS,KAAKhC,MAAMqB,MAAMC;AAAAA,IACjBP,YAAY;AAAA,EACd;AAAA,EACAkB,kBAAkB;AAAA,IAChBrB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,MAAMqB,MAAME;AAAAA,IACrBS,KAAKhC,MAAMqB,MAAMC;AAAAA,IACjBP,YAAY;AAAA,EACd;AAAA,EACAmB,iBAAiB;AAAA,IACfP,WAAY,aAAY3B,MAAMI,OAAOwB,KAAM;AAAA,IAC3ChB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfmB,KAAKhC,MAAMqB,MAAMC;AAAAA,IACjBZ,SAASV,MAAMqB,MAAME;AAAAA,EACvB;AAAA,EACAY,gBAAgB;AAAA,IACdvB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAqB,iBAAiB;AAAA,IACfxB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAsB,WAAW;AAAA,IACTC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,QAAQxC,MAAMW,QAAQ,GAAGX,MAAMqB,MAAMC,EAAE;AAAA,IACvCvB,cAAcC,MAAMC,MAAMwC;AAAAA,IAC1BtC,iBAAiBH,MAAMI,OAAOsC;AAAAA,EAChC;AACF,CAAC;"}
+{"version":3,"file":"Node.styles.js","sources":["../../../../../src/components/Flow/Node/Node.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvFlowNode\", {\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  },\n  groupContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  group: {\n    color: theme.colors.base_dark,\n  },\n  titleContainer: {\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  inputsTitleContainer: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    padding: theme.space.xs,\n    backgroundColor: theme.colors.atmo2,\n    borderTop: `1px solid ${theme.colors.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\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.atmo4}`,\n    borderBottom: `1px solid ${theme.colors.atmo4}`,\n  },\n  contentContainer: {\n    padding: theme.space.sm,\n  },\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  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  inputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\n  },\n  outputContainer: {\n    display: \"flex\",\n    flexDirection: \"row\",\n    alignItems: \"center\",\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});\n"],"names":["staticClasses","useClasses","createClasses","root","borderRadius","theme","radii","round","backgroundColor","colors","atmo1","boxShadow","shadow","minWidth","headerContainer","padding","spacing","display","flexDirection","justifyContent","alignItems","groupContainer","group","color","base_dark","titleContainer","minHeight","space","xs","sm","actions","inputsTitleContainer","atmo2","borderTop","atmo4","borderBottom","outputsTitleContainer","contentContainer","inputsContainer","gap","outputsContainer","paramsContainer","inputContainer","outputContainer","mandatory","width","height","margin","circle","negative_20"],"mappings":";AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,cAAc,cAAc;AAAA,EACvEC,MAAM;AAAA,IACJC,cAAcC,MAAMC,MAAMC;AAAAA,IAC1BC,iBAAiBH,MAAMI,OAAOC;AAAAA,IAC9BC,WAAWN,MAAMI,OAAOG;AAAAA,IACxBC,UAAU;AAAA,EACZ;AAAA,EACAC,iBAAiB;AAAA,IACfC,SAASV,MAAMW,QAAQ,KAAK,CAAC;AAAA,IAC7BC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,gBAAgB;AAAA,IACdJ,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAE,OAAO;AAAA,IACLC,OAAOlB,MAAMI,OAAOe;AAAAA,EACtB;AAAA,EACAC,gBAAgB;AAAA,IACdC,WAAW;AAAA,IACXX,SAASV,MAAMW,QACbX,MAAMsB,MAAMC,IACZvB,MAAMsB,MAAMC,IACZvB,MAAMsB,MAAMC,IACZvB,MAAMsB,MAAME,EACd;AAAA,IACAZ,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAU,SAAS;AAAA,IACPb,SAAS;AAAA,IACTG,YAAY;AAAA,EACd;AAAA,EACAW,sBAAsB;AAAA,IACpBd,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,MAAMsB,MAAMC;AAAAA,IACrBpB,iBAAiBH,MAAMI,OAAOuB;AAAAA,IAC9BC,WAAY,aAAY5B,MAAMI,OAAOyB,KAAM;AAAA,IAC3CC,cAAe,aAAY9B,MAAMI,OAAOyB,KAAM;AAAA,EAChD;AAAA,EACAE,uBAAuB;AAAA,IACrBnB,SAAS;AAAA,IACTE,gBAAgB;AAAA,IAChBJ,SAASV,MAAMsB,MAAMC;AAAAA,IACrBpB,iBAAiBH,MAAMI,OAAOuB;AAAAA,IAC9BC,WAAY,aAAY5B,MAAMI,OAAOyB,KAAM;AAAA,IAC3CC,cAAe,aAAY9B,MAAMI,OAAOyB,KAAM;AAAA,EAChD;AAAA,EACAG,kBAAkB;AAAA,IAChBtB,SAASV,MAAMsB,MAAME;AAAAA,EACvB;AAAA,EACAS,iBAAiB;AAAA,IACfrB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,MAAMsB,MAAME;AAAAA,IACrBU,KAAKlC,MAAMsB,MAAMC;AAAAA,IACjBR,YAAY;AAAA,EACd;AAAA,EACAoB,kBAAkB;AAAA,IAChBvB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfH,SAASV,MAAMsB,MAAME;AAAAA,IACrBU,KAAKlC,MAAMsB,MAAMC;AAAAA,IACjBR,YAAY;AAAA,EACd;AAAA,EACAqB,iBAAiB;AAAA,IACfR,WAAY,aAAY5B,MAAMI,OAAOyB,KAAM;AAAA,IAC3CjB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfqB,KAAKlC,MAAMsB,MAAMC;AAAAA,IACjBb,SAASV,MAAMsB,MAAME;AAAAA,EACvB;AAAA,EACAa,gBAAgB;AAAA,IACdzB,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAuB,iBAAiB;AAAA,IACf1B,SAAS;AAAA,IACTC,eAAe;AAAA,IACfE,YAAY;AAAA,EACd;AAAA,EACAwB,WAAW;AAAA,IACTC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,QAAQ1C,MAAMW,QAAQ,GAAGX,MAAMsB,MAAMC,EAAE;AAAA,IACvCxB,cAAcC,MAAMC,MAAM0C;AAAAA,IAC1BxC,iBAAiBH,MAAMI,OAAOwC;AAAAA,EAChC;AACF,CAAC;"}

package/dist/types/index.d.ts

@@ -45,6 +45,7 @@ export declare const flowNodeClasses: {
     groupContainer: "HvFlowNode-groupContainer";
     inputsTitleContainer: "HvFlowNode-inputsTitleContainer";
     outputsTitleContainer: "HvFlowNode-outputsTitleContainer";
+    contentContainer: "HvFlowNode-contentContainer";
     inputsContainer: "HvFlowNode-inputsContainer";
     outputsContainer: "HvFlowNode-outputsContainer";
     paramsContainer: "HvFlowNode-paramsContainer";
@@ -117,6 +118,12 @@ export declare interface HvFlowControlsProps extends Omit<ControlProps, "positio
     hideInteractive?: boolean;
 }
 
+export declare type HvFlowDefaultAction = "delete" | "duplicate";
+
+export declare type HvFlowDefaultActions = Omit<HvActionGeneric, "id"> & {
+    id: HvFlowDefaultAction;
+};
+
 export declare const HvFlowMinimap: ({ nodeColor, maskColor, maskStrokeColor, nodeStrokeColor, classes: classesProp, className, ...others }: HvFlowMinimapProps) => JSX_2.Element;
 
 export declare type HvFlowMinimapClasses = ExtractNames<typeof useClasses_9>;
@@ -134,7 +141,7 @@ export declare interface HvFlowMinimapProps<NodeData = any> extends Omit<MiniMap
     classes?: HvFlowMinimapClasses;
 }
 
-export declare const HvFlowNode: ({ id, type, description, expanded, params, actions, actionCallback, maxVisibleActions, classes: classesProp, className, }: HvFlowNodeProps) => JSX_2.Element | null;
+export declare const HvFlowNode: ({ id, type, description, expanded, params, actions, actionCallback, maxVisibleActions, classes: classesProp, className, children, }: HvFlowNodeProps) => JSX_2.Element | null;
 
 export declare type HvFlowNodeClasses = ExtractNames<typeof useClasses_11>;
 
@@ -221,7 +228,7 @@ export declare interface HvFlowProps<NodeData = any, NodeType extends string | u
     /** Flow sidebar. */
     sidebar?: React.ReactNode;
     /** Flow default actions. */
-    defaultActions?: HvActionGeneric[];
+    defaultActions?: HvFlowDefaultActions[];
     /**
      * Dnd Kit context props. This should be used for accessibility purposes.
      *
@@ -490,7 +497,7 @@ declare const useClasses_10: (classesProp?: Partial<Record<"description" | "titl
     cx: (...args: any) => string;
 };
 
-declare const useClasses_11: (classesProp?: Partial<Record<"root" | "group" | "mandatory" | "actions" | "titleContainer" | "headerContainer" | "groupContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "inputsContainer" | "outputsContainer" | "paramsContainer" | "inputContainer" | "outputContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_11: (classesProp?: Partial<Record<"root" | "group" | "mandatory" | "actions" | "titleContainer" | "headerContainer" | "groupContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "paramsContainer" | "inputContainer" | "outputContainer", string>>, addStatic?: boolean) => {
     classes: {
         root: string;
         group: string;
@@ -501,6 +508,7 @@ declare const useClasses_11: (classesProp?: Partial<Record<"root" | "group" | "m
         groupContainer: string;
         inputsTitleContainer: string;
         outputsTitleContainer: string;
+        contentContainer: string;
         inputsContainer: string;
         outputsContainer: string;
         paramsContainer: string;
@@ -588,10 +596,10 @@ declare const useClasses_6: (classesProp?: Partial<Record<"root" | "paper" | "cl
     cx: (...args: any) => string;
 };
 
-declare const useClasses_7: (classesProp?: Partial<Record<"fixedHeight" | "contentContainer" | "summaryRef" | "summarySticky" | "summaryContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_7: (classesProp?: Partial<Record<"contentContainer" | "fixedHeight" | "summaryRef" | "summarySticky" | "summaryContainer", string>>, addStatic?: boolean) => {
     classes: {
-        fixedHeight: string;
         contentContainer: string;
+        fixedHeight: string;
         summaryRef: string;
         summarySticky: string;
         summaryContainer: string;
@@ -643,8 +651,8 @@ export declare const wizardContainerClasses: {
 };
 
 export declare const wizardContentClasses: {
-    fixedHeight: "HvWizardContent-fixedHeight";
     contentContainer: "HvWizardContent-contentContainer";
+    fixedHeight: "HvWizardContent-fixedHeight";
     summaryRef: "HvWizardContent-summaryRef";
     summarySticky: "HvWizardContent-summarySticky";
     summaryContainer: "HvWizardContent-summaryContainer";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-lab",
-  "version": "5.7.0",
+  "version": "5.8.0",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Contributed React components for the NEXT UI Kit.",
@@ -48,7 +48,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "f1d113e5f993a61c1a2a2733001ac2f70b8ede56",
+  "gitHead": "9c3318b18360a5bd05f46841b803f7a8e7650f1b",
   "main": "dist/cjs/index.cjs",
   "exports": {
     ".": {