npm - @hitachivantara/uikit-react-lab - Versions diffs - 5.15.0 → 5.16.1 - Mend

@hitachivantara/uikit-react-lab 5.15.0 → 5.16.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (26) hide show

package/dist/cjs/components/Flow/Empty/Empty.cjs CHANGED Viewed

@@ -12,7 +12,7 @@ const HvFlowEmpty = ({
     classes,
     cx
   } = Empty_styles.useClasses();
-  const nodes = ReactFlow.useStore((state) => state.getNodes());
+  const nodes = ReactFlow.useNodes();
   return !nodes || (nodes.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvEmptyState, { className: cx(classes.root, className), ...others }) : null);
 };
 exports.HvFlowEmpty = HvFlowEmpty;

package/dist/cjs/components/Flow/Empty/Empty.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Empty.cjs","sources":["../../../../../src/components/Flow/Empty/Empty.tsx"],"sourcesContent":["import { ~~useStore~~ } from \"reactflow\";\nimport {\n HvEmptyState,\n HvEmptyStateProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./Empty.styles\";\n\nexport interface HvFlowEmptyProps extends HvEmptyStateProps {}\n\nexport const HvFlowEmpty = ({ className, ...others }: HvFlowEmptyProps) => {\n const { classes, cx } = useClasses();\n const nodes = ~~useStore~~(~~(state~~) ~~=> state.getNodes())~~;\n return (\n !nodes \|\|\n (nodes.length === 0 ? (\n <HvEmptyState className={cx(classes.root, className)} {...others} />\n ) : null)\n );\n};\n"],"names":["HvFlowEmpty","className","others","classes","cx","useClasses","nodes","~~useStore~~","~~state","getNodes","~~length","jsx","HvEmptyState","root"],"mappings":";;;;;;AAUO,MAAMA,cAAcA,CAAC;AAAA,EAAEC;AAAAA,EAAW,GAAGC;AAAyB,MAAM;AACnE,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,MAAOC,aAAW,WAAA;AACnC,QAAMC,QAAQC,UAAAA~~,SAAUC,CAAUA,UAAAA,MAAMC,UAAU~~;~~AAClD~~,SACE,~~CAACH~~,UACAA,~~MAAMI~~,WAAW,IACfC,2BAAAA,IAAAC,eAAAA,cAAA,EAAa,~~WAAWR~~,GAAGD,~~QAAQU~~,~~MAAMZ~~,SAAS,GAAG,GAAIC,OAAU,CAAA,IAClE;AAER;;"}
1	+ {"version":3,"file":"Empty.cjs","sources":["../../../../../src/components/Flow/Empty/Empty.tsx"],"sourcesContent":["import { useNodes } from \"reactflow\";\nimport {\n HvEmptyState,\n HvEmptyStateProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./Empty.styles\";\n\nexport interface HvFlowEmptyProps extends HvEmptyStateProps {}\n\nexport const HvFlowEmpty = ({ className, ...others }: HvFlowEmptyProps) => {\n const { classes, cx } = useClasses();\n const nodes = useNodes();\n return (\n !nodes \|\|\n (nodes.length === 0 ? (\n <HvEmptyState className={cx(classes.root, className)} {...others} />\n ) : null)\n );\n};\n"],"names":["HvFlowEmpty","className","others","classes","cx","useClasses","nodes","useNodes","length","jsx","HvEmptyState","root"],"mappings":";;;;;;AAUO,MAAMA,cAAcA,CAAC;AAAA,EAAEC;AAAAA,EAAW,GAAGC;AAAyB,MAAM;AACnE,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,MAAOC,aAAW,WAAA;AACnC,QAAMC,QAAQC,UAAAA;AACd,SACE,CAACD,UACAA,MAAME,WAAW,IACfC,2BAAAA,IAAAC,eAAAA,cAAA,EAAa,WAAWN,GAAGD,QAAQQ,MAAMV,SAAS,GAAG,GAAIC,OAAU,CAAA,IAClE;AAER;;"}

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

@@ -5,6 +5,7 @@ const BaseNode_styles = require("./Node/BaseNode.styles.cjs");
 require("@emotion/react/jsx-runtime");
 require("react");
 require("reactflow");
+require("uid");
 require("@hitachivantara/uikit-react-icons");
 require("@hitachivantara/uikit-styles");
 const {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Flow.styles.cjs","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowBaseNodeClasses } 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 > .${flowBaseNodeClasses.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","flowBaseNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":"~~;;;;;;;;;~~AAIa,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,8BAAoBb,IAAK,EAAC,GAAG;AAAA,MAC9Cc,QAAS,aAAYX,eAAMC,MAAAA,OAAOC,YAAa;AAAA,MAC/CU,cAAcZ,eAAAA,MAAMa,MAAMC;AAAAA,MAC1BC,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;;;"}
1	+ {"version":3,"file":"Flow.styles.cjs","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowBaseNodeClasses } 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 > .${flowBaseNodeClasses.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","flowBaseNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":";;;;;;;;;;AAIa,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,8BAAoBb,IAAK,EAAC,GAAG;AAAA,MAC9Cc,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/Node/BaseNode.cjs CHANGED Viewed

@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const ReactFlow = require("reactflow");
+const uid = require("uid");
 const uikitReactCore = require("@hitachivantara/uikit-react-core");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitStyles = require("@hitachivantara/uikit-styles");
@@ -59,8 +60,8 @@ const HvFlowBaseNode = ({
     cx,
     css
   } = BaseNode_styles.useClasses(classesProp);
-  const edges = ReactFlow.useStore((s) => s.edges);
-  const nodes = ReactFlow.useStore((s) => s.getNodes());
+  const edges = ReactFlow.useEdges();
+  const nodes = ReactFlow.useNodes();
   const node = nodes.find((n) => n.id === id);
   const handleDefaultAction = React.useCallback((action) => {
     if (!node)
@@ -78,7 +79,7 @@ const HvFlowBaseNode = ({
       case "duplicate":
         reactFlowInstance.addNodes([{
           ...node,
-          id: `${reactFlowInstance.getNodes().length + 1}`,
+          id: uid.uid(),
           position: {
             x: node.position.x,
             y: node.position.y + (node.height || 0) + 20
@@ -92,6 +93,7 @@ const HvFlowBaseNode = ({
   if (!node)
     return null;
   const color = uikitStyles.getColor(colorProp);
+  const iconColor = React.isValidElement(icon) ? uikitStyles.getColor(icon.props.color || "base_dark") : uikitStyles.getColor("base_dark");
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(
     "nowheel",
     // Disables the default canvas pan behaviour when scrolling inside the node
@@ -105,7 +107,11 @@ const HvFlowBaseNode = ({
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(css({
       backgroundColor: color
     }), classes.headerContainer), children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.titleContainer, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(classes.titleContainer, css({
+        "& svg *.color0": {
+          fill: iconColor
+        }
+      })), children: [
         icon,
         /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { variant: "title4", className: classes.title, children: title })
       ] }),

package/dist/cjs/components/Flow/Node/BaseNode.cjs.map CHANGED Viewed

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

@@ -51,15 +51,15 @@ const HvFlowNode = ({
   const hasParams = !!(params && params.length > 0);
   return /* @__PURE__ */ jsxRuntime.jsxs(BaseNode.HvFlowBaseNode, { id, type, title: groupLabel, icon, color, inputs, outputs, nodeActions: defaultActions, classes: classesProp, headerItems: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     headerItems,
-    description && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: description }), children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, {}) }) }),
-    hasParams && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvButton, { icon: true, onClick: () => setShowParams((p) => !p), children: showParams ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Up, {}) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, {}) })
+    description && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: description }), children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, { color: "base_dark" }) }) }),
+    hasParams && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvButton, { icon: true, overrideIconColors: false, onClick: () => setShowParams((p) => !p), children: showParams ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Up, { color: "base_dark" }) : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Down, { color: "base_dark" }) })
   ] }), ...props, children: [
     (subtitle || actsVisible?.length || actsDropdown?.length) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.subtitleContainer, children: [
       subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: subtitle }) }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.actions, children: actions?.length && actions?.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        actsVisible?.map((action) => /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: action.label }), children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvButton, { icon: true, onClick: (event) => {
+        actsVisible?.map((action) => /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTooltip, { title: action.label, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvButton, { icon: true, onClick: (event) => {
           actionCallback?.(event, id, action);
-        }, "aria-label": action.label, children: renderedIcon(action.icon) }) }) }, action.id)),
+        }, "aria-label": action.label, children: renderedIcon(action.icon) }) }, action.id)),
         actsDropdown && actsDropdown.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvDropDownMenu, { keepOpened: false, dataList: actsDropdown?.map((action) => ({
           id: action.id,
           label: action.label

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Node.cjs","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import React, { ~~SyntheticEvent,~~ isValidElement, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvActionGeneric,\n HvActionsGenericProps,\n HvButton,\n HvDropDownMenu,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks/index\";\nimport { HvFlowNodeParam } from \"../types/index\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport { HvFlowBaseNode, HvFlowBaseNodeProps } from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n// TODO How to include here the types from the parent component?\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFlowNodeDefaults = {\n title?: string;\n subTitle?: string;\n color?: string;\n icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any>\n extends Omit<HvFlowBaseNodeProps<T>, \"classes\"> {\n /** Node description /\n description?: string;\n /* Node actions /\n actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n /* Node action callback /\n actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n /* Node maximum number of actions visible /\n maxVisibleActions?: number;\n /* Node expanded /\n expanded?: boolean;\n /* Node parameters /\n params?: HvFlowNodeParam[];\n /* A set of node default values for when there are no groups to fetch this data from. /\n nodeDefaults?: HvFlowNodeDefaults;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowNodeClasses \| HvFlowBaseNodeProps<T>[\"classes\"];\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n id,\n type,\n headerItems,\n description,\n actions,\n actionCallback,\n maxVisibleActions = 1,\n expanded = false,\n params,\n nodeDefaults,\n classes: classesProp,\n children,\n ...props\n}: HvFlowNodeProps<unknown>) => {\n const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n const [showParams, setShowParams] = useState(expanded);\n const { node } = useFlowNode(id);\n\n const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n const groupId = nodeTypes?.[type].meta?.groupId;\n const subtitle = nodeTypes?.[type].meta?.label \|\| nodeDefaults?.subTitle;\n const groupLabel =\n (groupId && nodeGroups && nodeGroups[groupId].label) \|\| nodeDefaults?.title;\n\n const inputs = nodeTypes?.[type]?.meta?.inputs;\n const outputs = nodeTypes?.[type]?.meta?.outputs;\n const icon =\n (groupId && nodeGroups && nodeGroups[groupId].icon) \|\| nodeDefaults?.icon;\n const colorProp =\n (groupId && nodeGroups && nodeGroups[groupId].color) \|\| nodeDefaults?.color;\n const color = getColor(colorProp);\n\n const actsVisible = actions?.slice(0, maxVisibleActions);\n const actsDropdown = actions?.slice(maxVisibleActions);\n\n const hasParams = !!(params && params.length > 0);\n\n return (\n <HvFlowBaseNode\n id={id}\n type={type}\n title={groupLabel}\n icon={icon}\n color={color}\n inputs={inputs}\n outputs={outputs}\n nodeActions={defaultActions}\n classes={classesProp as HvFlowBaseNodeProps<unknown>[\"classes\"]}\n headerItems={\n <>\n {headerItems}\n {description && (\n <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n <div>\n <Info />\n </div>\n </HvTooltip>\n )}\n {hasParams && (\n <HvButton icon onClick={() => setShowParams((p) => !p)}>\n {showParams ? <Up /> : <Down />}\n </HvButton>\n )}\n </>\n }\n {...props}\n >\n {(subtitle \|\| actsVisible?.length \|\| actsDropdown?.length) && (\n <div className={classes.subtitleContainer}>\n {subtitle && (\n <div>\n <HvTypography>{subtitle}</HvTypography>\n </div>\n )}\n <div className={classes.actions}>\n {actions?.length && actions?.length > 0 && (\n <>\n {actsVisible?.map((action) => (\n <HvTooltip\n key={action.id}\n title={~~<HvTypography>{~~action.label}~~</HvTypography>}\n~~ >\n <~~div>\n <~~HvButton\n icon\n onClick={(event~~: SyntheticEvent<Element, Event>~~) => {\n actionCallback?.(event, id, action);\n }}\n aria-label={action.label}\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, id, action as HvActionGeneric);\n }}\n />\n )}\n </>\n )}\n </div>\n </div>\n )}\n {children}\n {showParams && params && (\n <div className={classes.paramsContainer}>\n <ParamRenderer nodeId={id} params={params} data={node?.data} />\n </div>\n )}\n </HvFlowBaseNode>\n );\n};\n"],"names":["renderedIcon","actionIcon","isValidElement","HvFlowNode","id","type","headerItems","description","actions","actionCallback","maxVisibleActions","expanded","params","nodeDefaults","classes","classesProp","children","props","useClasses","showParams","setShowParams","useState","node","useFlowNode","nodeGroups","nodeTypes","defaultActions","useFlowContext","groupId","meta","subtitle","label","subTitle","groupLabel","title","inputs","outputs","icon","colorProp","color","getColor","actsVisible","slice","actsDropdown","hasParams","length","jsxs","HvFlowBaseNode","jsx","HvTooltip","HvTypography","Info","HvButton","p","Up","Down","subtitleContainer","map","action","event","HvDropDownMenu","paramsContainer","ParamRenderer","data"],"mappings":";;;;;;;;;;;;AAmDA,MAAMA,eAAeA,CAACC,eACpBC,qBAAeD,UAAU,IAAIA,aAAcA;AAEtC,MAAME,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,oBAAoB;AAAA,EACpBC,WAAW;AAAA,EACXC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACA,GAAGC;AACqB,MAAM;AACxB,QAAA;AAAA,IAAEH;AAAAA,EAAAA,IAAYI,YAAAA,WAAWH,WAAiC;AAChE,QAAM,CAACI,YAAYC,aAAa,IAAIC,eAASV,QAAQ;AAC/C,QAAA;AAAA,IAAEW;AAAAA,EAAAA,IAASC,YAAAA,YAAYnB,EAAE;AAEzB,QAAA;AAAA,IAAEoB;AAAAA,IAAYC;AAAAA,IAAWC;AAAAA,MAAmBC,eAAe,eAAA;AACjE,QAAMC,UAAUH,YAAYpB,IAAI,EAAEwB,MAAMD;AACxC,QAAME,WAAWL,YAAYpB,IAAI,EAAEwB,MAAME,SAASlB,cAAcmB;AAChE,QAAMC,aACHL,WAAWJ,cAAcA,WAAWI,OAAO,EAAEG,SAAUlB,cAAcqB;AAExE,QAAMC,SAASV,YAAYpB,IAAI,GAAGwB,MAAMM;AACxC,QAAMC,UAAUX,YAAYpB,IAAI,GAAGwB,MAAMO;AACzC,QAAMC,OACHT,WAAWJ,cAAcA,WAAWI,OAAO,EAAES,QAASxB,cAAcwB;AACvE,QAAMC,YACHV,WAAWJ,cAAcA,WAAWI,OAAO,EAAEW,SAAU1B,cAAc0B;AAClEA,QAAAA,QAAQC,qBAASF,SAAS;AAEhC,QAAMG,cAAcjC,SAASkC,MAAM,GAAGhC,iBAAiB;AACjDiC,QAAAA,eAAenC,SAASkC,MAAMhC,iBAAiB;AAErD,QAAMkC,YAAY,CAAC,EAAEhC,UAAUA,OAAOiC,SAAS;AAE/C,SACGC,2BAAA,KAAAC,SAAA,gBAAA,EACC,IACA,MACA,OAAOd,YACP,MACA,OACA,QACA,SACA,aAAaP,gBACb,SAASX,aACT,aAEKT,2BAAAA,KAAAA,qBAAAA,EAAAA,UAAAA;AAAAA,IAAAA;AAAAA,IACAC,eACCyC,2BAAAA,IAACC,~~eAAAA~~,~~WAAU~~,EAAA,~~OAAQD~~,~~2BAAAA~~,~~IAAAE~~,~~eAAA~~,~~cAAA~~,~~EAAc3C~~,~~UAAY~~,~~YAAA,CAAA,~~GAC3C,~~UAACyC~~,~~2BAAA~~,~~IAAA~~,~~OAAA~~,~~EACC,~~UAACA,~~2BAAA~~,~~IAAAG~~,~~sBAAA~~,~~CAAA~~,~~CAAI~~,~~EACP~~,CAAA,GACF;AAAA,IAEDP,aACEI,2BAAAA,IAAAI,~~eAAA~~,UAAA,~~EAAS~~,MAAI,~~MAAC~~,SAAS,MAAMhC,cAAeiC,~~CAAAA~~,~~MAAM~~,CAACA,CAAC,~~GAClDlC~~,~~UAAa~~,~~aAAA6B~~,~~2BAAAA~~,~~IAACM~~,~~sBAAK~~,~~IAAGN,+BAACO~~,gBAAAA,~~OAAO~~,CAAA~~,GACjC~~;AAAA,EAAA,GAEJ,GAEF,GAAItC,OAEFa,UAAAA;AAAAA,KAAYW,YAAAA,aAAaI,UAAUF,cAAcE,2CAChD,OAAI,EAAA,WAAW/B,QAAQ0C,mBACrB1B,UAAAA;AAAAA,MAAAA,YACEkB,2BAAA,IAAA,OAAA,EACC,UAACA,2BAAAA,IAAAE,eAAA,cAAA,EAAcpB,mBAAS,CAAA,GAC1B;AAAA,MAEFkB,2BAAA,IAAC,OAAI,EAAA,WAAWlC,QAAQN,SACrBA,mBAASqC,UAAUrC,SAASqC,SAAS,KAEjCJ,2BAAAA,KAAAA,WAAAA,UAAAA,EAAAA,UAAAA;AAAAA,QAAAA,aAAagB,IAAKC,~~CACjB~~,~~WAAAV~~,2BAAA,~~IAACC~~,~~4BAEC~~,~~OAAOD,+BAACE~~,~~eAAAA~~,~~gBAAcQ~~,~~UAAO3B~~,~~OAAAA~~,~~OAAM,GAEnC,~~UAAAiB,~~2BAAAA~~,~~IAAC~~,~~SACC~~,~~UAACA~~,~~2BAAAA,IAAAI,eAAA,UAAA,EACC,~~MAAI,MACJ,~~SAAS~~,~~CAACO~~,~~UAA0C~~;~~AACjCA~~,2BAAAA,OAAOvD,IAAIsD,MAAM;AAAA,~~QAEpC~~,~~GAAA~~,cAAYA,OAAO3B,OAElB/B,~~UAAa0D~~,~~aAAAA~~,OAAOrB,IAAI,EAC3B,CAAA,~~EACF,CAAA,~~EAAA,~~GAbKqB~~,OAAOtD,~~EAcd~~,CACD;AAAA,QAEAuC,gBAAgBA,aAAaE,SAAS,KACrCG,2BAAA,IAACY,eACC,gBAAA,EAAA,YAAY,OACZ,UAAUjB,cAAcc,IAAKC,CAAY,YAAA;AAAA,UACvCtD,IAAIsD,OAAOtD;AAAAA,UACX2B,OAAO2B,OAAO3B;AAAAA,QACd,EAAA,GACF,SAAS,CAAC4B,OAAOD,WAAW;AACTC,2BAAAA,OAAOvD,IAAIsD,MAA0B;AAAA,QAAA,GAG3D;AAAA,MAAA,EAAA,CACH,EAEJ,CAAA;AAAA,IAAA,GACF;AAAA,IAED1C;AAAAA,IACAG,cAAcP,UACZoC,2BAAAA,IAAA,OAAA,EAAI,WAAWlC,QAAQ+C,iBACtB,UAACb,2BAAAA,IAAAc,cAAAA,SAAA,EAAc,QAAQ1D,IAAI,QAAgB,MAAMkB,MAAMyC,KAAK,CAAA,GAC9D;AAAA,EAEJ,EAAA,CAAA;AAEJ;;;"}
1	+ {"version":3,"file":"Node.cjs","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import React, { isValidElement, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvActionGeneric,\n HvActionsGenericProps,\n HvButton,\n HvDropDownMenu,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks/index\";\nimport { HvFlowNodeParam } from \"../types/index\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport { HvFlowBaseNode, HvFlowBaseNodeProps } from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n// TODO How to include here the types from the parent component?\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFlowNodeDefaults = {\n title?: string;\n subTitle?: string;\n color?: string;\n icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any>\n extends Omit<HvFlowBaseNodeProps<T>, \"classes\"> {\n /** Node description /\n description?: string;\n /* Node actions /\n actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n /* Node action callback /\n actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n /* Node maximum number of actions visible /\n maxVisibleActions?: number;\n /* Node expanded /\n expanded?: boolean;\n /* Node parameters /\n params?: HvFlowNodeParam[];\n /* A set of node default values for when there are no groups to fetch this data from. /\n nodeDefaults?: HvFlowNodeDefaults;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowNodeClasses \| HvFlowBaseNodeProps<T>[\"classes\"];\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n id,\n type,\n headerItems,\n description,\n actions,\n actionCallback,\n maxVisibleActions = 1,\n expanded = false,\n params,\n nodeDefaults,\n classes: classesProp,\n children,\n ...props\n}: HvFlowNodeProps<unknown>) => {\n const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n const [showParams, setShowParams] = useState(expanded);\n const { node } = useFlowNode(id);\n\n const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n const groupId = nodeTypes?.[type].meta?.groupId;\n const subtitle = nodeTypes?.[type].meta?.label \|\| nodeDefaults?.subTitle;\n const groupLabel =\n (groupId && nodeGroups && nodeGroups[groupId].label) \|\| nodeDefaults?.title;\n\n const inputs = nodeTypes?.[type]?.meta?.inputs;\n const outputs = nodeTypes?.[type]?.meta?.outputs;\n const icon =\n (groupId && nodeGroups && nodeGroups[groupId].icon) \|\| nodeDefaults?.icon;\n const colorProp =\n (groupId && nodeGroups && nodeGroups[groupId].color) \|\| nodeDefaults?.color;\n const color = getColor(colorProp);\n\n const actsVisible = actions?.slice(0, maxVisibleActions);\n const actsDropdown = actions?.slice(maxVisibleActions);\n\n const hasParams = !!(params && params.length > 0);\n\n return (\n <HvFlowBaseNode\n id={id}\n type={type}\n title={groupLabel}\n icon={icon}\n color={color}\n inputs={inputs}\n outputs={outputs}\n nodeActions={defaultActions}\n classes={classesProp as HvFlowBaseNodeProps<unknown>[\"classes\"]}\n headerItems={\n <>\n {headerItems}\n {description && (\n <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n <div>\n <Info color=\"base_dark\" />\n </div>\n </HvTooltip>\n )}\n {hasParams && (\n <HvButton\n icon\n overrideIconColors={false}\n onClick={() => setShowParams((p) => !p)}\n >\n {showParams ? (\n <Up color=\"base_dark\" />\n ) : (\n <Down color=\"base_dark\" />\n )}\n </HvButton>\n )}\n </>\n }\n {...props}\n >\n {(subtitle \|\| actsVisible?.length \|\| actsDropdown?.length) && (\n <div className={classes.subtitleContainer}>\n {subtitle && (\n <div>\n <HvTypography>{subtitle}</HvTypography>\n </div>\n )}\n <div className={classes.actions}>\n {actions?.length && actions?.length > 0 && (\n <>\n {actsVisible?.map((action) => (\n <HvTooltip key={action.id} title={action.label}>\n <HvButton\n icon\n onClick={(event) => {\n actionCallback?.(event, id, action);\n }}\n aria-label={action.label}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n </HvTooltip>\n ))}\n\n {actsDropdown && actsDropdown.length > 0 && (\n <HvDropDownMenu\n keepOpened={false}\n dataList={actsDropdown?.map((action) => ({\n id: action.id,\n label: action.label,\n }))}\n onClick={(event, action) => {\n actionCallback?.(event, id, action as HvActionGeneric);\n }}\n />\n )}\n </>\n )}\n </div>\n </div>\n )}\n {children}\n {showParams && params && (\n <div className={classes.paramsContainer}>\n <ParamRenderer nodeId={id} params={params} data={node?.data} />\n </div>\n )}\n </HvFlowBaseNode>\n );\n};\n"],"names":["renderedIcon","actionIcon","isValidElement","HvFlowNode","id","type","headerItems","description","actions","actionCallback","maxVisibleActions","expanded","params","nodeDefaults","classes","classesProp","children","props","useClasses","showParams","setShowParams","useState","node","useFlowNode","nodeGroups","nodeTypes","defaultActions","useFlowContext","groupId","meta","subtitle","label","subTitle","groupLabel","title","inputs","outputs","icon","colorProp","color","getColor","actsVisible","slice","actsDropdown","hasParams","length","jsxs","HvFlowBaseNode","jsx","HvTooltip","HvTypography","Info","HvButton","p","Up","Down","subtitleContainer","map","action","event","HvDropDownMenu","paramsContainer","ParamRenderer","data"],"mappings":"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"}

package/dist/cjs/components/Flow/Sidebar/utils.cjs CHANGED Viewed

@@ -1,44 +1,43 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const buildGroups = (nodeGroups, nodeTypes, defaultGroupProps) => {
-  if (nodeGroups) {
-    const groups = Object.entries(nodeGroups).reduce((acc, curr) => {
-      const nodesWithGroupId = [];
-      const nodesWithoutGroupId = [];
-      if (nodeTypes) {
-        for (const [nodeType, node] of Object.entries(nodeTypes)) {
-          if (node.meta?.groupId === curr[0]) {
-            nodesWithGroupId.push({
-              type: nodeType,
-              label: node.meta?.label,
-              data: node.meta?.data
-            });
-          } else if (!node.meta?.groupId) {
-            nodesWithoutGroupId.push({
-              type: nodeType,
-              label: node.meta?.label || "",
-              data: node.meta?.data
-            });
-          }
+  if (!nodeGroups)
+    return {};
+  return Object.entries(nodeGroups).reduce((acc, curr) => {
+    const nodesWithGroupId = [];
+    const nodesWithoutGroupId = [];
+    if (nodeTypes) {
+      for (const [nodeType, node] of Object.entries(nodeTypes)) {
+        if (node.meta?.groupId === curr[0]) {
+          nodesWithGroupId.push({
+            type: nodeType,
+            label: node.meta?.label,
+            data: node.meta?.data
+          });
+        } else if (!node.meta?.groupId) {
+          nodesWithoutGroupId.push({
+            type: nodeType,
+            label: node.meta?.label || "",
+            data: node.meta?.data
+          });
         }
       }
-      acc[curr[0]] = {
-        ...curr[1],
-        nodes: nodesWithGroupId
+    }
+    acc[curr[0]] = {
+      ...curr[1],
+      nodes: nodesWithGroupId
+    };
+    if (nodesWithoutGroupId.length > 0) {
+      acc.Default = {
+        // @ts-ignore
+        name: "Default",
+        label: "Default",
+        nodes: nodesWithoutGroupId,
+        ...defaultGroupProps
       };
-      if (nodesWithoutGroupId.length > 0) {
-        acc.Default = {
-          name: "Default",
-          label: "Default",
-          nodes: nodesWithoutGroupId,
-          ...defaultGroupProps
-        };
-      }
-      return acc;
-    }, {});
-    return groups;
-  }
-  return {};
+    }
+    return acc;
+  }, {});
 };
 exports.buildGroups = buildGroups;
 //# sourceMappingURL=utils.cjs.map

package/dist/cjs/components/Flow/Sidebar/utils.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.cjs","sources":["../../../../../src/components/Flow/Sidebar/utils.ts"],"sourcesContent":["import { HvFlowContextValue } from \"../FlowContext\";\nimport { HvFlowNodeGroup } from \"../types\";\nimport {\n HvFlowSidebarGroupNodes,\n HvFlowSidebarGroupNode,\n} from \"./SidebarGroup\";\n\nexport const buildGroups = (\n nodeGroups: HvFlowContextValue[\"nodeGroups\"],\n nodeTypes: HvFlowContextValue[\"nodeTypes\"],\n defaultGroupProps?: HvFlowNodeGroup\n): ~~{\n [key: string]: HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes };\n}~~ => {\n if (nodeGroups) {\n ~~const~~ ~~groups =~~ Object.entries(nodeGroups).reduce((acc, curr) => {\n const nodesWithGroupId: HvFlowSidebarGroupNode[] = [];\n const nodesWithoutGroupId: HvFlowSidebarGroupNode[] = [];\n\n if (nodeTypes) {\n for (const [nodeType, node] of Object.entries(nodeTypes)) {\n if (node.meta?.groupId === curr[0]) {\n nodesWithGroupId.push({\n type: nodeType,\n label: node.meta?.label,\n data: node.meta?.data,\n });\n } else if (!node.meta?.groupId) {\n nodesWithoutGroupId.push({\n type: nodeType,\n label: node.meta?.label \|\| \"\",\n data: node.meta?.data,\n });\n }\n }\n }\n\n acc[curr[0]] = {\n ...curr[1],\n nodes: nodesWithGroupId,\n } ~~as HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes }~~;\n\n // Create a \"Default\" group for nodes without a groupId\n if (nodesWithoutGroupId.length > 0) {\n // @ts-ignore\n ~~acc.Default = {\n~~ name: \"Default\",\n label: \"Default\",\n nodes: nodesWithoutGroupId,\n ...defaultGroupProps,\n } ~~as HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes }~~;\n }\n\n return acc;\n }, {}~~);\n\n return~~ ~~groups;\n }\n\n return~~ {};\n};\n"],"names":["buildGroups","nodeGroups","nodeTypes","defaultGroupProps","~~groups","~~Object","entries","reduce","acc","curr","nodesWithGroupId","nodesWithoutGroupId","nodeType","node","meta","groupId","push","type","label","data","nodes","length","Default","name"],"mappings":";;~~AAOO~~,MAAMA,cAAcA,CACzBC,YACAC,WACAC,~~sBAGG~~;AACH,~~MAAIF~~,~~YAAY~~;~~AACRG~~,~~UAAAA~~,~~SAASC~~,OAAOC,~~QAAQL~~,UAAU,~~EAAEM~~,OAAO,CAACC,KAAKC,SAAS;~~AAC9D~~,~~YAAMC~~,mBAA6C,CAAA;AACnD,~~YAAMC~~,sBAAgD,CAAA;AAEtD,~~UAAIT~~,WAAW;AACb,~~mBAAW~~,~~CAACU~~,UAAUC,IAAI,KAAKR,OAAOC,~~QAAQJ~~,SAAS,GAAG;AACxD,~~cAAIW~~,KAAKC,MAAMC,YAAYN,KAAK,CAAC,GAAG;AAClCC,~~6BAAiBM~~,KAAK;AAAA,~~cACpBC~~,MAAML;AAAAA,~~cACNM~~,OAAOL,KAAKC,MAAMI;AAAAA,~~cAClBC~~,MAAMN,KAAKC,MAAMK;AAAAA,~~YAAAA~~,CAClB;AAAA,~~UACQ~~,WAAA,CAACN,KAAKC,MAAMC,SAAS;AAC9BJ,~~gCAAoBK~~,KAAK;AAAA,~~cACvBC~~,MAAML;AAAAA,~~cACNM~~,OAAOL,KAAKC,MAAMI,SAAS;AAAA,~~cAC3BC~~,MAAMN,KAAKC,MAAMK;AAAAA,~~YAAAA~~,CAClB;AAAA,~~UACH~~;AAAA,~~QACF~~;AAAA,~~MACF~~;AAEIV,~~UAAAA~~,KAAK,CAAC,CAAC,IAAI;AAAA,~~QACb~~,GAAGA,KAAK,CAAC;AAAA,~~QACTW~~,OAAOV;AAAAA,~~MAAAA~~;AAILC,~~UAAAA~~,oBAAoBU,SAAS,GAAG;~~AAElCb~~,~~YAAIc~~,UAAU;AAAA,~~UACZC~~,MAAM;AAAA,~~UACNL~~,OAAO;AAAA,~~UACPE~~,OAAOT;AAAAA,~~UACP~~,~~GAAGR~~;AAAAA,~~QAAAA~~;AAAAA,~~MAEP~~;~~AAEOK~~,~~aAAAA~~;AAAAA,~~IACT~~,GAAG,~~CAAE~~,CAAA;~~AAEEJ,WAAAA;AAAAA,EACT;AAEA,SAAO;AACT~~;;"}
1	+ {"version":3,"file":"utils.cjs","sources":["../../../../../src/components/Flow/Sidebar/utils.ts"],"sourcesContent":["import { HvFlowContextValue } from \"../FlowContext\";\nimport { HvFlowNodeGroup } from \"../types\";\nimport {\n HvFlowSidebarGroupNodes,\n HvFlowSidebarGroupNode,\n} from \"./SidebarGroup\";\n\ntype NodeGroup = HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes };\n\nexport const buildGroups = (\n nodeGroups: HvFlowContextValue[\"nodeGroups\"],\n nodeTypes: HvFlowContextValue[\"nodeTypes\"],\n defaultGroupProps?: HvFlowNodeGroup\n) => {\n if (!nodeGroups) return {};\n\n return Object.entries(nodeGroups).reduce((acc, curr) => {\n const nodesWithGroupId: HvFlowSidebarGroupNode[] = [];\n const nodesWithoutGroupId: HvFlowSidebarGroupNode[] = [];\n\n if (nodeTypes) {\n for (const [nodeType, node] of Object.entries(nodeTypes)) {\n if (node.meta?.groupId === curr[0]) {\n nodesWithGroupId.push({\n type: nodeType,\n label: node.meta?.label,\n data: node.meta?.data,\n });\n } else if (!node.meta?.groupId) {\n nodesWithoutGroupId.push({\n type: nodeType,\n label: node.meta?.label \|\| \"\",\n data: node.meta?.data,\n });\n }\n }\n }\n\n acc[curr[0]] = {\n ...curr[1],\n nodes: nodesWithGroupId,\n };\n\n // Create a \"Default\" group for nodes without a groupId\n if (nodesWithoutGroupId.length > 0) {\n acc.Default = {\n // @ts-ignore\n name: \"Default\",\n label: \"Default\",\n nodes: nodesWithoutGroupId,\n ...defaultGroupProps,\n };\n }\n\n return acc;\n }, {} as Record<string, NodeGroup>);\n};\n"],"names":["buildGroups","nodeGroups","nodeTypes","defaultGroupProps","Object","entries","reduce","acc","curr","nodesWithGroupId","nodesWithoutGroupId","nodeType","node","meta","groupId","push","type","label","data","nodes","length","Default","name"],"mappings":";;AASO,MAAMA,cAAcA,CACzBC,YACAC,WACAC,sBACG;AACH,MAAI,CAACF;AAAY,WAAO;AAExB,SAAOG,OAAOC,QAAQJ,UAAU,EAAEK,OAAO,CAACC,KAAKC,SAAS;AACtD,UAAMC,mBAA6C,CAAA;AACnD,UAAMC,sBAAgD,CAAA;AAEtD,QAAIR,WAAW;AACb,iBAAW,CAACS,UAAUC,IAAI,KAAKR,OAAOC,QAAQH,SAAS,GAAG;AACxD,YAAIU,KAAKC,MAAMC,YAAYN,KAAK,CAAC,GAAG;AAClCC,2BAAiBM,KAAK;AAAA,YACpBC,MAAML;AAAAA,YACNM,OAAOL,KAAKC,MAAMI;AAAAA,YAClBC,MAAMN,KAAKC,MAAMK;AAAAA,UAAAA,CAClB;AAAA,QACQ,WAAA,CAACN,KAAKC,MAAMC,SAAS;AAC9BJ,8BAAoBK,KAAK;AAAA,YACvBC,MAAML;AAAAA,YACNM,OAAOL,KAAKC,MAAMI,SAAS;AAAA,YAC3BC,MAAMN,KAAKC,MAAMK;AAAAA,UAAAA,CAClB;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEIV,QAAAA,KAAK,CAAC,CAAC,IAAI;AAAA,MACb,GAAGA,KAAK,CAAC;AAAA,MACTW,OAAOV;AAAAA,IAAAA;AAILC,QAAAA,oBAAoBU,SAAS,GAAG;AAClCb,UAAIc,UAAU;AAAA;AAAA,QAEZC,MAAM;AAAA,QACNL,OAAO;AAAA,QACPE,OAAOT;AAAAA,QACP,GAAGP;AAAAA,MAAAA;AAAAA,IAEP;AAEOI,WAAAA;AAAAA,EACT,GAAG,CAAgC,CAAA;AACrC;;"}

package/dist/cjs/components/Flow/hooks/useFlowNode.cjs CHANGED Viewed

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const ReactFlow = require("reactflow");
-const useFlowNode = (id) => {
-  const nodes = ReactFlow.useStore((state) => state.getNodes());
-  const edges = ReactFlow.useStore((state) => state.edges);
+function useFlowNode(id) {
+  const nodes = ReactFlow.useNodes();
+  const edges = ReactFlow.useEdges();
   return {
     // self node
     get node() {
@@ -20,6 +20,6 @@ const useFlowNode = (id) => {
       return parentNodeArray;
     }
   };
-};
+}
 exports.useFlowNode = useFlowNode;
 //# sourceMappingURL=useFlowNode.cjs.map

package/dist/cjs/components/Flow/hooks/useFlowNode.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFlowNode.cjs","sources":["../../../../../src/components/Flow/hooks/useFlowNode.ts"],"sourcesContent":["import { Edge, Node, ~~useStore~~ } from \"reactflow\";\n\nexport ~~const~~ useFlowNode = (id: string) => {\n const nodes = ~~useStore~~(~~(state~~) ~~=> state.getNodes())~~;\n const edges = ~~useStore~~(~~(state~~) ~~=> state.edges)~~;\n\n return {\n // self node\n get node() {\n const self = nodes.find((n: Node) => n.id === id);\n return self;\n },\n\n // parent nodes\n get parentNodes() {\n const connectedEdges = edges.filter((e: Edge) => e.target === id);\n const parentNodeArray = connectedEdges.map((e) => {\n const parentNode = nodes.find((n: Node) => n.id === e.source) as Node;\n return parentNode;\n });\n return parentNodeArray;\n },\n };\n};\n"],"names":["useFlowNode","id","nodes","~~useStore~~","~~state~~","~~getNodes~~","~~edges","~~node","self","find","n","parentNodes","connectedEdges","filter","e","target","parentNodeArray","map","parentNode","source"],"mappings":";;;~~AAEaA~~,~~MAAAA~~,~~cAAcA~~,~~CAACC,OAAe~~;~~AACzC~~,QAAMC,QAAQC,UAAAA~~,SAAUC,CAAUA,UAAAA,MAAMC,UAAU~~;~~AAClD~~,QAAMC,~~QAAQH~~,UAAAA~~,SAAUC,CAAUA,UAAAA,MAAME,KAAK~~;~~AAEtC~~,SAAA;AAAA;AAAA,IAEL,IAAIC,OAAO;AACT,YAAMC,~~OAAON~~,~~MAAMO~~,KAAK,CAACC,MAAYA,~~EAAET~~,OAAOA,EAAE;~~AACzCO~~,aAAAA;AAAAA,IACT;AAAA;AAAA,IAGA,IAAIG,cAAc;AAChB,YAAMC,~~iBAAiBN~~,~~MAAMO~~,OAAO,CAACC,MAAYA,EAAEC,~~WAAWd~~,EAAE;~~AAC1De~~,YAAAA,kBAAkBJ,eAAeK,IAAKH,CAAM,MAAA;AAC1CI,cAAAA,~~aAAahB~~,~~MAAMO~~,KAAK,CAACC,MAAYA,~~EAAET~~,~~OAAOa~~,EAAEK,MAAM;AACrDD,eAAAA;AAAAA,MAAAA,CACR;AACMF,aAAAA;AAAAA,IACT;AAAA,EAAA;AAEJ;;"}
1	+ {"version":3,"file":"useFlowNode.cjs","sources":["../../../../../src/components/Flow/hooks/useFlowNode.ts"],"sourcesContent":["import { Edge, Node, useEdges, useNodes } from \"reactflow\";\n\nexport function useFlowNode<T = any>(id: string) {\n const nodes = useNodes<T>();\n const edges = useEdges();\n\n return {\n // self node\n get node() {\n const self = nodes.find((n: Node) => n.id === id);\n return self;\n },\n\n // parent nodes\n get parentNodes() {\n const connectedEdges = edges.filter((e: Edge) => e.target === id);\n const parentNodeArray = connectedEdges.map((e) => {\n const parentNode = nodes.find((n: Node) => n.id === e.source) as Node;\n return parentNode;\n });\n return parentNodeArray;\n },\n };\n}\n"],"names":["useFlowNode","id","nodes","useNodes","edges","useEdges","node","self","find","n","parentNodes","connectedEdges","filter","e","target","parentNodeArray","map","parentNode","source"],"mappings":";;;AAEO,SAASA,YAAqBC,IAAY;AAC/C,QAAMC,QAAQC,UAAAA;AACd,QAAMC,QAAQC,UAAAA;AAEP,SAAA;AAAA;AAAA,IAEL,IAAIC,OAAO;AACT,YAAMC,OAAOL,MAAMM,KAAK,CAACC,MAAYA,EAAER,OAAOA,EAAE;AACzCM,aAAAA;AAAAA,IACT;AAAA;AAAA,IAGA,IAAIG,cAAc;AAChB,YAAMC,iBAAiBP,MAAMQ,OAAO,CAACC,MAAYA,EAAEC,WAAWb,EAAE;AAC1Dc,YAAAA,kBAAkBJ,eAAeK,IAAKH,CAAM,MAAA;AAC1CI,cAAAA,aAAaf,MAAMM,KAAK,CAACC,MAAYA,EAAER,OAAOY,EAAEK,MAAM;AACrDD,eAAAA;AAAAA,MAAAA,CACR;AACMF,aAAAA;AAAAA,IACT;AAAA,EAAA;AAEJ;;"}

package/dist/esm/components/Flow/Empty/Empty.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { jsx } from "@emotion/react/jsx-runtime";
-import { useStore } from "reactflow";
+import { useNodes } from "reactflow";
 import { HvEmptyState } from "@hitachivantara/uikit-react-core";
 import { useClasses } from "./Empty.styles.js";
 const HvFlowEmpty = ({
@@ -10,7 +10,7 @@ const HvFlowEmpty = ({
     classes,
     cx
   } = useClasses();
-  const nodes = useStore((state) => state.getNodes());
+  const nodes = useNodes();
   return !nodes || (nodes.length === 0 ? /* @__PURE__ */ jsx(HvEmptyState, { className: cx(classes.root, className), ...others }) : null);
 };
 export {

package/dist/esm/components/Flow/Empty/Empty.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Empty.js","sources":["../../../../../src/components/Flow/Empty/Empty.tsx"],"sourcesContent":["import { ~~useStore~~ } from \"reactflow\";\nimport {\n HvEmptyState,\n HvEmptyStateProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./Empty.styles\";\n\nexport interface HvFlowEmptyProps extends HvEmptyStateProps {}\n\nexport const HvFlowEmpty = ({ className, ...others }: HvFlowEmptyProps) => {\n const { classes, cx } = useClasses();\n const nodes = ~~useStore~~(~~(state~~) ~~=> state.getNodes())~~;\n return (\n !nodes \|\|\n (nodes.length === 0 ? (\n <HvEmptyState className={cx(classes.root, className)} {...others} />\n ) : null)\n );\n};\n"],"names":["HvFlowEmpty","className","others","classes","cx","useClasses","nodes","~~useStore~~","~~state","getNodes","~~length","root"],"mappings":";;;;AAUO,MAAMA,cAAcA,CAAC;AAAA,EAAEC;AAAAA,EAAW,GAAGC;AAAyB,MAAM;AACnE,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,MAAOC,WAAW;AACnC,QAAMC,QAAQC~~,SAAUC,CAAUA,UAAAA,MAAMC,UAAU~~;~~AAClD~~,SACE,~~CAACH~~,UACAA,~~MAAMI~~,WAAW,IACf,oBAAA,cAAA,EAAa,~~WAAWN~~,GAAGD,~~QAAQQ~~,~~MAAMV~~,SAAS,GAAG,GAAIC,OAAU,CAAA,IAClE;AAER;"}
1	+ {"version":3,"file":"Empty.js","sources":["../../../../../src/components/Flow/Empty/Empty.tsx"],"sourcesContent":["import { useNodes } from \"reactflow\";\nimport {\n HvEmptyState,\n HvEmptyStateProps,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { useClasses } from \"./Empty.styles\";\n\nexport interface HvFlowEmptyProps extends HvEmptyStateProps {}\n\nexport const HvFlowEmpty = ({ className, ...others }: HvFlowEmptyProps) => {\n const { classes, cx } = useClasses();\n const nodes = useNodes();\n return (\n !nodes \|\|\n (nodes.length === 0 ? (\n <HvEmptyState className={cx(classes.root, className)} {...others} />\n ) : null)\n );\n};\n"],"names":["HvFlowEmpty","className","others","classes","cx","useClasses","nodes","useNodes","length","root"],"mappings":";;;;AAUO,MAAMA,cAAcA,CAAC;AAAA,EAAEC;AAAAA,EAAW,GAAGC;AAAyB,MAAM;AACnE,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,MAAOC,WAAW;AACnC,QAAMC,QAAQC;AACd,SACE,CAACD,UACAA,MAAME,WAAW,IACf,oBAAA,cAAA,EAAa,WAAWJ,GAAGD,QAAQM,MAAMR,SAAS,GAAG,GAAIC,OAAU,CAAA,IAClE;AAER;"}

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

@@ -3,6 +3,7 @@ import { staticClasses as staticClasses$1 } from "./Node/BaseNode.styles.js";
 import "@emotion/react/jsx-runtime";
 import "react";
 import "reactflow";
+import "uid";
 import "@hitachivantara/uikit-react-icons";
 import "@hitachivantara/uikit-styles";
 const {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Flow.styles.js","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowBaseNodeClasses } 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 > .${flowBaseNodeClasses.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","flowBaseNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":"~~;;;;;;;~~AAIa,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,gBAAoBb,IAAK,EAAC,GAAG;AAAA,MAC9Cc,QAAS,aAAYX,MAAMC,OAAOC,YAAa;AAAA,MAC/CU,cAAcZ,MAAMa,MAAMC;AAAAA,MAC1BC,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;"}
1	+ {"version":3,"file":"Flow.styles.js","sources":["../../../../src/components/Flow/Flow.styles.tsx"],"sourcesContent":["import { createClasses, theme } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowBaseNodeClasses } 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 > .${flowBaseNodeClasses.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","flowBaseNodeClasses","border","borderRadius","radii","round","boxSizing"],"mappings":";;;;;;;;AAIa,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,gBAAoBb,IAAK,EAAC,GAAG;AAAA,MAC9Cc,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/Node/BaseNode.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { jsxs, jsx, Fragment } from "@emotion/react/jsx-runtime";
 import { useEffect, useState, useCallback, isValidElement } from "react";
-import { useReactFlow, useStore, NodeToolbar, Handle, Position } from "reactflow";
+import { useReactFlow, useEdges, useNodes, NodeToolbar, Handle, Position } from "reactflow";
+import { uid } from "uid";
 import { HvButton, HvTypography } from "@hitachivantara/uikit-react-core";
 import { Delete, Duplicate } from "@hitachivantara/uikit-react-icons";
 import { theme, getColor } from "@hitachivantara/uikit-styles";
@@ -58,8 +59,8 @@ const HvFlowBaseNode = ({
     cx,
     css
   } = useClasses(classesProp);
-  const edges = useStore((s) => s.edges);
-  const nodes = useStore((s) => s.getNodes());
+  const edges = useEdges();
+  const nodes = useNodes();
   const node = nodes.find((n) => n.id === id);
   const handleDefaultAction = useCallback((action) => {
     if (!node)
@@ -77,7 +78,7 @@ const HvFlowBaseNode = ({
       case "duplicate":
         reactFlowInstance.addNodes([{
           ...node,
-          id: `${reactFlowInstance.getNodes().length + 1}`,
+          id: uid(),
           position: {
             x: node.position.x,
             y: node.position.y + (node.height || 0) + 20
@@ -91,6 +92,7 @@ const HvFlowBaseNode = ({
   if (!node)
     return null;
   const color = getColor(colorProp);
+  const iconColor = isValidElement(icon) ? getColor(icon.props.color || "base_dark") : getColor("base_dark");
   return /* @__PURE__ */ jsxs("div", { className: cx(
     "nowheel",
     // Disables the default canvas pan behaviour when scrolling inside the node
@@ -104,7 +106,11 @@ const HvFlowBaseNode = ({
     /* @__PURE__ */ jsxs("div", { className: cx(css({
       backgroundColor: color
     }), classes.headerContainer), children: [
-      /* @__PURE__ */ jsxs("div", { className: classes.titleContainer, children: [
+      /* @__PURE__ */ jsxs("div", { className: cx(classes.titleContainer, css({
+        "& svg *.color0": {
+          fill: iconColor
+        }
+      })), children: [
         icon,
         /* @__PURE__ */ jsx(HvTypography, { variant: "title4", className: classes.title, children: title })
       ] }),

package/dist/esm/components/Flow/Node/BaseNode.js.map CHANGED Viewed

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

@@ -50,15 +50,15 @@ const HvFlowNode = ({
   const hasParams = !!(params && params.length > 0);
   return /* @__PURE__ */ jsxs(HvFlowBaseNode, { id, type, title: groupLabel, icon, color, inputs, outputs, nodeActions: defaultActions, classes: classesProp, headerItems: /* @__PURE__ */ jsxs(Fragment, { children: [
     headerItems,
-    description && /* @__PURE__ */ jsx(HvTooltip, { title: /* @__PURE__ */ jsx(HvTypography, { children: description }), children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Info, {}) }) }),
-    hasParams && /* @__PURE__ */ jsx(HvButton, { icon: true, onClick: () => setShowParams((p) => !p), children: showParams ? /* @__PURE__ */ jsx(Up, {}) : /* @__PURE__ */ jsx(Down, {}) })
+    description && /* @__PURE__ */ jsx(HvTooltip, { title: /* @__PURE__ */ jsx(HvTypography, { children: description }), children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Info, { color: "base_dark" }) }) }),
+    hasParams && /* @__PURE__ */ jsx(HvButton, { icon: true, overrideIconColors: false, onClick: () => setShowParams((p) => !p), children: showParams ? /* @__PURE__ */ jsx(Up, { color: "base_dark" }) : /* @__PURE__ */ jsx(Down, { color: "base_dark" }) })
   ] }), ...props, children: [
     (subtitle || actsVisible?.length || actsDropdown?.length) && /* @__PURE__ */ jsxs("div", { className: classes.subtitleContainer, children: [
       subtitle && /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(HvTypography, { children: subtitle }) }),
       /* @__PURE__ */ jsx("div", { className: classes.actions, children: actions?.length && actions?.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-        actsVisible?.map((action) => /* @__PURE__ */ jsx(HvTooltip, { title: /* @__PURE__ */ jsx(HvTypography, { children: action.label }), children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(HvButton, { icon: true, onClick: (event) => {
+        actsVisible?.map((action) => /* @__PURE__ */ jsx(HvTooltip, { title: action.label, children: /* @__PURE__ */ jsx(HvButton, { icon: true, onClick: (event) => {
           actionCallback?.(event, id, action);
-        }, "aria-label": action.label, children: renderedIcon(action.icon) }) }) }, action.id)),
+        }, "aria-label": action.label, children: renderedIcon(action.icon) }) }, action.id)),
         actsDropdown && actsDropdown.length > 0 && /* @__PURE__ */ jsx(HvDropDownMenu, { keepOpened: false, dataList: actsDropdown?.map((action) => ({
           id: action.id,
           label: action.label

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Node.js","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import React, { ~~SyntheticEvent,~~ isValidElement, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvActionGeneric,\n HvActionsGenericProps,\n HvButton,\n HvDropDownMenu,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks/index\";\nimport { HvFlowNodeParam } from \"../types/index\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport { HvFlowBaseNode, HvFlowBaseNodeProps } from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n// TODO How to include here the types from the parent component?\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFlowNodeDefaults = {\n title?: string;\n subTitle?: string;\n color?: string;\n icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any>\n extends Omit<HvFlowBaseNodeProps<T>, \"classes\"> {\n /** Node description /\n description?: string;\n /* Node actions /\n actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n /* Node action callback /\n actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n /* Node maximum number of actions visible /\n maxVisibleActions?: number;\n /* Node expanded /\n expanded?: boolean;\n /* Node parameters /\n params?: HvFlowNodeParam[];\n /* A set of node default values for when there are no groups to fetch this data from. /\n nodeDefaults?: HvFlowNodeDefaults;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowNodeClasses \| HvFlowBaseNodeProps<T>[\"classes\"];\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n id,\n type,\n headerItems,\n description,\n actions,\n actionCallback,\n maxVisibleActions = 1,\n expanded = false,\n params,\n nodeDefaults,\n classes: classesProp,\n children,\n ...props\n}: HvFlowNodeProps<unknown>) => {\n const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n const [showParams, setShowParams] = useState(expanded);\n const { node } = useFlowNode(id);\n\n const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n const groupId = nodeTypes?.[type].meta?.groupId;\n const subtitle = nodeTypes?.[type].meta?.label \|\| nodeDefaults?.subTitle;\n const groupLabel =\n (groupId && nodeGroups && nodeGroups[groupId].label) \|\| nodeDefaults?.title;\n\n const inputs = nodeTypes?.[type]?.meta?.inputs;\n const outputs = nodeTypes?.[type]?.meta?.outputs;\n const icon =\n (groupId && nodeGroups && nodeGroups[groupId].icon) \|\| nodeDefaults?.icon;\n const colorProp =\n (groupId && nodeGroups && nodeGroups[groupId].color) \|\| nodeDefaults?.color;\n const color = getColor(colorProp);\n\n const actsVisible = actions?.slice(0, maxVisibleActions);\n const actsDropdown = actions?.slice(maxVisibleActions);\n\n const hasParams = !!(params && params.length > 0);\n\n return (\n <HvFlowBaseNode\n id={id}\n type={type}\n title={groupLabel}\n icon={icon}\n color={color}\n inputs={inputs}\n outputs={outputs}\n nodeActions={defaultActions}\n classes={classesProp as HvFlowBaseNodeProps<unknown>[\"classes\"]}\n headerItems={\n <>\n {headerItems}\n {description && (\n <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n <div>\n <Info />\n </div>\n </HvTooltip>\n )}\n {hasParams && (\n <HvButton icon onClick={() => setShowParams((p) => !p)}>\n {showParams ? <Up /> : <Down />}\n </HvButton>\n )}\n </>\n }\n {...props}\n >\n {(subtitle \|\| actsVisible?.length \|\| actsDropdown?.length) && (\n <div className={classes.subtitleContainer}>\n {subtitle && (\n <div>\n <HvTypography>{subtitle}</HvTypography>\n </div>\n )}\n <div className={classes.actions}>\n {actions?.length && actions?.length > 0 && (\n <>\n {actsVisible?.map((action) => (\n <HvTooltip\n key={action.id}\n title={~~<HvTypography>{~~action.label}~~</HvTypography>}\n~~ >\n <~~div>\n <~~HvButton\n icon\n onClick={(event~~: SyntheticEvent<Element, Event>~~) => {\n actionCallback?.(event, id, action);\n }}\n aria-label={action.label}\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, id, action as HvActionGeneric);\n }}\n />\n )}\n </>\n )}\n </div>\n </div>\n )}\n {children}\n {showParams && params && (\n <div className={classes.paramsContainer}>\n <ParamRenderer nodeId={id} params={params} data={node?.data} />\n </div>\n )}\n </HvFlowBaseNode>\n );\n};\n"],"names":["renderedIcon","actionIcon","isValidElement","HvFlowNode","id","type","headerItems","description","actions","actionCallback","maxVisibleActions","expanded","params","nodeDefaults","classes","classesProp","children","props","useClasses","showParams","setShowParams","useState","node","useFlowNode","nodeGroups","nodeTypes","defaultActions","useFlowContext","groupId","meta","subtitle","label","subTitle","groupLabel","title","inputs","outputs","icon","colorProp","color","getColor","actsVisible","slice","actsDropdown","hasParams","length","p","subtitleContainer","map","action","event","paramsContainer","data"],"mappings":";;;;;;;;;;;AAmDA,MAAMA,eAAeA,CAACC,eACpBC,eAAeD,UAAU,IAAIA,aAAcA;AAEtC,MAAME,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,oBAAoB;AAAA,EACpBC,WAAW;AAAA,EACXC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACA,GAAGC;AACqB,MAAM;AACxB,QAAA;AAAA,IAAEH;AAAAA,EAAAA,IAAYI,WAAWH,WAAiC;AAChE,QAAM,CAACI,YAAYC,aAAa,IAAIC,SAASV,QAAQ;AAC/C,QAAA;AAAA,IAAEW;AAAAA,EAAAA,IAASC,YAAYnB,EAAE;AAEzB,QAAA;AAAA,IAAEoB;AAAAA,IAAYC;AAAAA,IAAWC;AAAAA,MAAmBC,eAAe;AACjE,QAAMC,UAAUH,YAAYpB,IAAI,EAAEwB,MAAMD;AACxC,QAAME,WAAWL,YAAYpB,IAAI,EAAEwB,MAAME,SAASlB,cAAcmB;AAChE,QAAMC,aACHL,WAAWJ,cAAcA,WAAWI,OAAO,EAAEG,SAAUlB,cAAcqB;AAExE,QAAMC,SAASV,YAAYpB,IAAI,GAAGwB,MAAMM;AACxC,QAAMC,UAAUX,YAAYpB,IAAI,GAAGwB,MAAMO;AACzC,QAAMC,OACHT,WAAWJ,cAAcA,WAAWI,OAAO,EAAES,QAASxB,cAAcwB;AACvE,QAAMC,YACHV,WAAWJ,cAAcA,WAAWI,OAAO,EAAEW,SAAU1B,cAAc0B;AAClEA,QAAAA,QAAQC,SAASF,SAAS;AAEhC,QAAMG,cAAcjC,SAASkC,MAAM,GAAGhC,iBAAiB;AACjDiC,QAAAA,eAAenC,SAASkC,MAAMhC,iBAAiB;AAErD,QAAMkC,YAAY,CAAC,EAAEhC,UAAUA,OAAOiC,SAAS;AAE/C,SACG,qBAAA,gBAAA,EACC,IACA,MACA,OAAOZ,YACP,MACA,OACA,QACA,SACA,aAAaP,gBACb,SAASX,aACT,aAEKT,qBAAAA,UAAAA,EAAAA,UAAAA;AAAAA,IAAAA;AAAAA,IACAC,eACC,oBAAC,WAAU,EAAA,~~OAAQ~~,~~oBAAA~~,~~cAAA~~,~~EAAcA~~,~~UAAY~~,~~YAAA~~,~~CAAA,~~GAC3C,~~UAAC~~,~~oBAAA~~,~~OAAA~~,~~EACC,~~UAAC,oBAAA,MAAA,~~CAAA~~,~~CAAI~~,~~EACP~~,CAAA,GACF;AAAA,IAEDqC,aACE,oBAAA,UAAA,~~EAAS~~,MAAI,~~MAAC~~,SAAS,MAAMxB,cAAe0B,~~CAAAA~~,~~MAAM~~,CAACA,CAAC,~~GAClD3B~~,~~UAAa~~,~~aAAA~~,~~oBAAC~~,~~MAAK~~,~~IAAG~~,~~oBAAC~~,~~OAAO~~,CAAA~~,GACjC~~;AAAA,EAAA,GAEJ,GAEF,GAAIF,OAEFa,UAAAA;AAAAA,KAAYW,YAAAA,aAAaI,UAAUF,cAAcE,gCAChD,OAAI,EAAA,WAAW/B,QAAQiC,mBACrBjB,UAAAA;AAAAA,MAAAA,YACE,oBAAA,OAAA,EACC,UAAC,oBAAA,cAAA,EAAcA,mBAAS,CAAA,GAC1B;AAAA,MAEF,oBAAC,OAAI,EAAA,WAAWhB,QAAQN,SACrBA,mBAASqC,UAAUrC,SAASqC,SAAS,KAEjCJ,qBAAAA,UAAAA,EAAAA,UAAAA;AAAAA,QAAAA,aAAaO,IAAKC,~~CACjB~~,~~WAAA~~,~~oBAAC~~,~~aAEC~~,~~OAAO~~,~~oBAAC~~,~~gBAAcA~~,~~UAAOlB~~,~~OAAAA,OAAM,GAEnC,~~UAAA,oBAAC,~~SACC~~,~~UAAC~~,~~oBAAA,UAAA,EACC,~~MAAI,MACJ,~~SAAS~~,~~CAACmB~~,~~UAA0C~~;~~AACjCA~~,2BAAAA,OAAO9C,IAAI6C,MAAM;AAAA,~~QAEpC~~,~~GAAA~~,cAAYA,OAAOlB,OAElB/B,~~UAAaiD~~,~~aAAAA~~,OAAOZ,IAAI,EAC3B,CAAA,~~EACF,CAAA,~~EAAA,~~GAbKY~~,OAAO7C,~~EAcd~~,CACD;AAAA,QAEAuC,gBAAgBA,aAAaE,SAAS,KACrC,oBAAC,gBACC,EAAA,YAAY,OACZ,UAAUF,cAAcK,IAAKC,CAAY,YAAA;AAAA,UACvC7C,IAAI6C,OAAO7C;AAAAA,UACX2B,OAAOkB,OAAOlB;AAAAA,QACd,EAAA,GACF,SAAS,CAACmB,OAAOD,WAAW;AACTC,2BAAAA,OAAO9C,IAAI6C,MAA0B;AAAA,QAAA,GAG3D;AAAA,MAAA,EAAA,CACH,EAEJ,CAAA;AAAA,IAAA,GACF;AAAA,IAEDjC;AAAAA,IACAG,cAAcP,UACZ,oBAAA,OAAA,EAAI,WAAWE,QAAQqC,iBACtB,UAAC,oBAAA,eAAA,EAAc,QAAQ/C,IAAI,QAAgB,MAAMkB,MAAM8B,KAAK,CAAA,GAC9D;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
1	+ {"version":3,"file":"Node.js","sources":["../../../../../src/components/Flow/Node/Node.tsx"],"sourcesContent":["import React, { isValidElement, useState } from \"react\";\n\nimport {\n ExtractNames,\n HvActionGeneric,\n HvActionsGenericProps,\n HvButton,\n HvDropDownMenu,\n HvTooltip,\n HvTypography,\n} from \"@hitachivantara/uikit-react-core\";\nimport { getColor } from \"@hitachivantara/uikit-styles\";\nimport { Down, Info, Up } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useFlowContext, useFlowNode } from \"../hooks/index\";\nimport { HvFlowNodeParam } from \"../types/index\";\nimport { staticClasses, useClasses } from \"./Node.styles\";\nimport ParamRenderer from \"./Parameters/ParamRenderer\";\nimport { HvFlowBaseNode, HvFlowBaseNodeProps } from \"./BaseNode\";\n\nexport { staticClasses as flowNodeClasses };\n// TODO How to include here the types from the parent component?\nexport type HvFlowNodeClasses = ExtractNames<typeof useClasses>;\n\nexport type HvFlowNodeDefaults = {\n title?: string;\n subTitle?: string;\n color?: string;\n icon?: React.ReactNode;\n};\n\nexport interface HvFlowNodeProps<T = any>\n extends Omit<HvFlowBaseNodeProps<T>, \"classes\"> {\n /** Node description /\n description?: string;\n /* Node actions /\n actions?: HvActionGeneric[]; // HvFlowNodeActions[];\n /* Node action callback /\n actionCallback?: HvActionsGenericProps[\"actionsCallback\"];\n /* Node maximum number of actions visible /\n maxVisibleActions?: number;\n /* Node expanded /\n expanded?: boolean;\n /* Node parameters /\n params?: HvFlowNodeParam[];\n /* A set of node default values for when there are no groups to fetch this data from. /\n nodeDefaults?: HvFlowNodeDefaults;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowNodeClasses \| HvFlowBaseNodeProps<T>[\"classes\"];\n}\n\nconst renderedIcon = (actionIcon: HvActionGeneric[\"icon\"]) =>\n isValidElement(actionIcon) ? actionIcon : (actionIcon as Function)?.();\n\nexport const HvFlowNode = ({\n id,\n type,\n headerItems,\n description,\n actions,\n actionCallback,\n maxVisibleActions = 1,\n expanded = false,\n params,\n nodeDefaults,\n classes: classesProp,\n children,\n ...props\n}: HvFlowNodeProps<unknown>) => {\n const { classes } = useClasses(classesProp as HvFlowNodeClasses);\n const [showParams, setShowParams] = useState(expanded);\n const { node } = useFlowNode(id);\n\n const { nodeGroups, nodeTypes, defaultActions } = useFlowContext();\n const groupId = nodeTypes?.[type].meta?.groupId;\n const subtitle = nodeTypes?.[type].meta?.label \|\| nodeDefaults?.subTitle;\n const groupLabel =\n (groupId && nodeGroups && nodeGroups[groupId].label) \|\| nodeDefaults?.title;\n\n const inputs = nodeTypes?.[type]?.meta?.inputs;\n const outputs = nodeTypes?.[type]?.meta?.outputs;\n const icon =\n (groupId && nodeGroups && nodeGroups[groupId].icon) \|\| nodeDefaults?.icon;\n const colorProp =\n (groupId && nodeGroups && nodeGroups[groupId].color) \|\| nodeDefaults?.color;\n const color = getColor(colorProp);\n\n const actsVisible = actions?.slice(0, maxVisibleActions);\n const actsDropdown = actions?.slice(maxVisibleActions);\n\n const hasParams = !!(params && params.length > 0);\n\n return (\n <HvFlowBaseNode\n id={id}\n type={type}\n title={groupLabel}\n icon={icon}\n color={color}\n inputs={inputs}\n outputs={outputs}\n nodeActions={defaultActions}\n classes={classesProp as HvFlowBaseNodeProps<unknown>[\"classes\"]}\n headerItems={\n <>\n {headerItems}\n {description && (\n <HvTooltip title={<HvTypography>{description}</HvTypography>}>\n <div>\n <Info color=\"base_dark\" />\n </div>\n </HvTooltip>\n )}\n {hasParams && (\n <HvButton\n icon\n overrideIconColors={false}\n onClick={() => setShowParams((p) => !p)}\n >\n {showParams ? (\n <Up color=\"base_dark\" />\n ) : (\n <Down color=\"base_dark\" />\n )}\n </HvButton>\n )}\n </>\n }\n {...props}\n >\n {(subtitle \|\| actsVisible?.length \|\| actsDropdown?.length) && (\n <div className={classes.subtitleContainer}>\n {subtitle && (\n <div>\n <HvTypography>{subtitle}</HvTypography>\n </div>\n )}\n <div className={classes.actions}>\n {actions?.length && actions?.length > 0 && (\n <>\n {actsVisible?.map((action) => (\n <HvTooltip key={action.id} title={action.label}>\n <HvButton\n icon\n onClick={(event) => {\n actionCallback?.(event, id, action);\n }}\n aria-label={action.label}\n >\n {renderedIcon(action.icon)}\n </HvButton>\n </HvTooltip>\n ))}\n\n {actsDropdown && actsDropdown.length > 0 && (\n <HvDropDownMenu\n keepOpened={false}\n dataList={actsDropdown?.map((action) => ({\n id: action.id,\n label: action.label,\n }))}\n onClick={(event, action) => {\n actionCallback?.(event, id, action as HvActionGeneric);\n }}\n />\n )}\n </>\n )}\n </div>\n </div>\n )}\n {children}\n {showParams && params && (\n <div className={classes.paramsContainer}>\n <ParamRenderer nodeId={id} params={params} data={node?.data} />\n </div>\n )}\n </HvFlowBaseNode>\n );\n};\n"],"names":["renderedIcon","actionIcon","isValidElement","HvFlowNode","id","type","headerItems","description","actions","actionCallback","maxVisibleActions","expanded","params","nodeDefaults","classes","classesProp","children","props","useClasses","showParams","setShowParams","useState","node","useFlowNode","nodeGroups","nodeTypes","defaultActions","useFlowContext","groupId","meta","subtitle","label","subTitle","groupLabel","title","inputs","outputs","icon","colorProp","color","getColor","actsVisible","slice","actsDropdown","hasParams","length","p","subtitleContainer","map","action","event","paramsContainer","data"],"mappings":"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"}

package/dist/esm/components/Flow/Sidebar/utils.js CHANGED Viewed

@@ -1,42 +1,41 @@
 const buildGroups = (nodeGroups, nodeTypes, defaultGroupProps) => {
-  if (nodeGroups) {
-    const groups = Object.entries(nodeGroups).reduce((acc, curr) => {
-      const nodesWithGroupId = [];
-      const nodesWithoutGroupId = [];
-      if (nodeTypes) {
-        for (const [nodeType, node] of Object.entries(nodeTypes)) {
-          if (node.meta?.groupId === curr[0]) {
-            nodesWithGroupId.push({
-              type: nodeType,
-              label: node.meta?.label,
-              data: node.meta?.data
-            });
-          } else if (!node.meta?.groupId) {
-            nodesWithoutGroupId.push({
-              type: nodeType,
-              label: node.meta?.label || "",
-              data: node.meta?.data
-            });
-          }
+  if (!nodeGroups)
+    return {};
+  return Object.entries(nodeGroups).reduce((acc, curr) => {
+    const nodesWithGroupId = [];
+    const nodesWithoutGroupId = [];
+    if (nodeTypes) {
+      for (const [nodeType, node] of Object.entries(nodeTypes)) {
+        if (node.meta?.groupId === curr[0]) {
+          nodesWithGroupId.push({
+            type: nodeType,
+            label: node.meta?.label,
+            data: node.meta?.data
+          });
+        } else if (!node.meta?.groupId) {
+          nodesWithoutGroupId.push({
+            type: nodeType,
+            label: node.meta?.label || "",
+            data: node.meta?.data
+          });
         }
       }
-      acc[curr[0]] = {
-        ...curr[1],
-        nodes: nodesWithGroupId
+    }
+    acc[curr[0]] = {
+      ...curr[1],
+      nodes: nodesWithGroupId
+    };
+    if (nodesWithoutGroupId.length > 0) {
+      acc.Default = {
+        // @ts-ignore
+        name: "Default",
+        label: "Default",
+        nodes: nodesWithoutGroupId,
+        ...defaultGroupProps
       };
-      if (nodesWithoutGroupId.length > 0) {
-        acc.Default = {
-          name: "Default",
-          label: "Default",
-          nodes: nodesWithoutGroupId,
-          ...defaultGroupProps
-        };
-      }
-      return acc;
-    }, {});
-    return groups;
-  }
-  return {};
+    }
+    return acc;
+  }, {});
 };
 export {
   buildGroups

package/dist/esm/components/Flow/Sidebar/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sources":["../../../../../src/components/Flow/Sidebar/utils.ts"],"sourcesContent":["import { HvFlowContextValue } from \"../FlowContext\";\nimport { HvFlowNodeGroup } from \"../types\";\nimport {\n HvFlowSidebarGroupNodes,\n HvFlowSidebarGroupNode,\n} from \"./SidebarGroup\";\n\nexport const buildGroups = (\n nodeGroups: HvFlowContextValue[\"nodeGroups\"],\n nodeTypes: HvFlowContextValue[\"nodeTypes\"],\n defaultGroupProps?: HvFlowNodeGroup\n): ~~{\n [key: string]: HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes };\n}~~ => {\n if (nodeGroups) {\n ~~const~~ ~~groups =~~ Object.entries(nodeGroups).reduce((acc, curr) => {\n const nodesWithGroupId: HvFlowSidebarGroupNode[] = [];\n const nodesWithoutGroupId: HvFlowSidebarGroupNode[] = [];\n\n if (nodeTypes) {\n for (const [nodeType, node] of Object.entries(nodeTypes)) {\n if (node.meta?.groupId === curr[0]) {\n nodesWithGroupId.push({\n type: nodeType,\n label: node.meta?.label,\n data: node.meta?.data,\n });\n } else if (!node.meta?.groupId) {\n nodesWithoutGroupId.push({\n type: nodeType,\n label: node.meta?.label \|\| \"\",\n data: node.meta?.data,\n });\n }\n }\n }\n\n acc[curr[0]] = {\n ...curr[1],\n nodes: nodesWithGroupId,\n } ~~as HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes }~~;\n\n // Create a \"Default\" group for nodes without a groupId\n if (nodesWithoutGroupId.length > 0) {\n // @ts-ignore\n ~~acc.Default = {\n~~ name: \"Default\",\n label: \"Default\",\n nodes: nodesWithoutGroupId,\n ...defaultGroupProps,\n } ~~as HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes }~~;\n }\n\n return acc;\n }, {}~~);\n\n return~~ ~~groups;\n }\n\n return~~ {};\n};\n"],"names":["buildGroups","nodeGroups","nodeTypes","defaultGroupProps","~~groups","~~Object","entries","reduce","acc","curr","nodesWithGroupId","nodesWithoutGroupId","nodeType","node","meta","groupId","push","type","label","data","nodes","length","Default","name"],"mappings":"~~AAOO~~,MAAMA,cAAcA,CACzBC,YACAC,WACAC,~~sBAGG~~;AACH,~~MAAIF~~,~~YAAY~~;~~AACRG~~,~~UAAAA~~,~~SAASC~~,OAAOC,~~QAAQL~~,UAAU,~~EAAEM~~,OAAO,CAACC,KAAKC,SAAS;~~AAC9D~~,~~YAAMC~~,mBAA6C,CAAA;AACnD,~~YAAMC~~,sBAAgD,CAAA;AAEtD,~~UAAIT~~,WAAW;AACb,~~mBAAW~~,~~CAACU~~,UAAUC,IAAI,KAAKR,OAAOC,~~QAAQJ~~,SAAS,GAAG;AACxD,~~cAAIW~~,KAAKC,MAAMC,YAAYN,KAAK,CAAC,GAAG;AAClCC,~~6BAAiBM~~,KAAK;AAAA,~~cACpBC~~,MAAML;AAAAA,~~cACNM~~,OAAOL,KAAKC,MAAMI;AAAAA,~~cAClBC~~,MAAMN,KAAKC,MAAMK;AAAAA,~~YAAAA~~,CAClB;AAAA,~~UACQ~~,WAAA,CAACN,KAAKC,MAAMC,SAAS;AAC9BJ,~~gCAAoBK~~,KAAK;AAAA,~~cACvBC~~,MAAML;AAAAA,~~cACNM~~,OAAOL,KAAKC,MAAMI,SAAS;AAAA,~~cAC3BC~~,MAAMN,KAAKC,MAAMK;AAAAA,~~YAAAA~~,CAClB;AAAA,~~UACH~~;AAAA,~~QACF~~;AAAA,~~MACF~~;AAEIV,~~UAAAA~~,KAAK,CAAC,CAAC,IAAI;AAAA,~~QACb~~,GAAGA,KAAK,CAAC;AAAA,~~QACTW~~,OAAOV;AAAAA,~~MAAAA~~;AAILC,~~UAAAA~~,oBAAoBU,SAAS,GAAG;~~AAElCb~~,~~YAAIc~~,UAAU;AAAA,~~UACZC~~,MAAM;AAAA,~~UACNL~~,OAAO;AAAA,~~UACPE~~,OAAOT;AAAAA,~~UACP~~,~~GAAGR~~;AAAAA,~~QAAAA~~;AAAAA,~~MAEP~~;~~AAEOK~~,~~aAAAA~~;AAAAA,~~IACT~~,GAAG,~~CAAE~~,CAAA;~~AAEEJ,WAAAA~~;~~AAAAA,EACT;AAEA,SAAO;AACT;~~"}
1	+ {"version":3,"file":"utils.js","sources":["../../../../../src/components/Flow/Sidebar/utils.ts"],"sourcesContent":["import { HvFlowContextValue } from \"../FlowContext\";\nimport { HvFlowNodeGroup } from \"../types\";\nimport {\n HvFlowSidebarGroupNodes,\n HvFlowSidebarGroupNode,\n} from \"./SidebarGroup\";\n\ntype NodeGroup = HvFlowNodeGroup & { nodes: HvFlowSidebarGroupNodes };\n\nexport const buildGroups = (\n nodeGroups: HvFlowContextValue[\"nodeGroups\"],\n nodeTypes: HvFlowContextValue[\"nodeTypes\"],\n defaultGroupProps?: HvFlowNodeGroup\n) => {\n if (!nodeGroups) return {};\n\n return Object.entries(nodeGroups).reduce((acc, curr) => {\n const nodesWithGroupId: HvFlowSidebarGroupNode[] = [];\n const nodesWithoutGroupId: HvFlowSidebarGroupNode[] = [];\n\n if (nodeTypes) {\n for (const [nodeType, node] of Object.entries(nodeTypes)) {\n if (node.meta?.groupId === curr[0]) {\n nodesWithGroupId.push({\n type: nodeType,\n label: node.meta?.label,\n data: node.meta?.data,\n });\n } else if (!node.meta?.groupId) {\n nodesWithoutGroupId.push({\n type: nodeType,\n label: node.meta?.label \|\| \"\",\n data: node.meta?.data,\n });\n }\n }\n }\n\n acc[curr[0]] = {\n ...curr[1],\n nodes: nodesWithGroupId,\n };\n\n // Create a \"Default\" group for nodes without a groupId\n if (nodesWithoutGroupId.length > 0) {\n acc.Default = {\n // @ts-ignore\n name: \"Default\",\n label: \"Default\",\n nodes: nodesWithoutGroupId,\n ...defaultGroupProps,\n };\n }\n\n return acc;\n }, {} as Record<string, NodeGroup>);\n};\n"],"names":["buildGroups","nodeGroups","nodeTypes","defaultGroupProps","Object","entries","reduce","acc","curr","nodesWithGroupId","nodesWithoutGroupId","nodeType","node","meta","groupId","push","type","label","data","nodes","length","Default","name"],"mappings":"AASO,MAAMA,cAAcA,CACzBC,YACAC,WACAC,sBACG;AACH,MAAI,CAACF;AAAY,WAAO;AAExB,SAAOG,OAAOC,QAAQJ,UAAU,EAAEK,OAAO,CAACC,KAAKC,SAAS;AACtD,UAAMC,mBAA6C,CAAA;AACnD,UAAMC,sBAAgD,CAAA;AAEtD,QAAIR,WAAW;AACb,iBAAW,CAACS,UAAUC,IAAI,KAAKR,OAAOC,QAAQH,SAAS,GAAG;AACxD,YAAIU,KAAKC,MAAMC,YAAYN,KAAK,CAAC,GAAG;AAClCC,2BAAiBM,KAAK;AAAA,YACpBC,MAAML;AAAAA,YACNM,OAAOL,KAAKC,MAAMI;AAAAA,YAClBC,MAAMN,KAAKC,MAAMK;AAAAA,UAAAA,CAClB;AAAA,QACQ,WAAA,CAACN,KAAKC,MAAMC,SAAS;AAC9BJ,8BAAoBK,KAAK;AAAA,YACvBC,MAAML;AAAAA,YACNM,OAAOL,KAAKC,MAAMI,SAAS;AAAA,YAC3BC,MAAMN,KAAKC,MAAMK;AAAAA,UAAAA,CAClB;AAAA,QACH;AAAA,MACF;AAAA,IACF;AAEIV,QAAAA,KAAK,CAAC,CAAC,IAAI;AAAA,MACb,GAAGA,KAAK,CAAC;AAAA,MACTW,OAAOV;AAAAA,IAAAA;AAILC,QAAAA,oBAAoBU,SAAS,GAAG;AAClCb,UAAIc,UAAU;AAAA;AAAA,QAEZC,MAAM;AAAA,QACNL,OAAO;AAAA,QACPE,OAAOT;AAAAA,QACP,GAAGP;AAAAA,MAAAA;AAAAA,IAEP;AAEOI,WAAAA;AAAAA,EACT,GAAG,CAAgC,CAAA;AACrC;"}

package/dist/esm/components/Flow/hooks/useFlowNode.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { useStore } from "reactflow";
-const useFlowNode = (id) => {
-  const nodes = useStore((state) => state.getNodes());
-  const edges = useStore((state) => state.edges);
+import { useNodes, useEdges } from "reactflow";
+function useFlowNode(id) {
+  const nodes = useNodes();
+  const edges = useEdges();
   return {
     // self node
     get node() {
@@ -18,7 +18,7 @@ const useFlowNode = (id) => {
       return parentNodeArray;
     }
   };
-};
+}
 export {
   useFlowNode
 };

package/dist/esm/components/Flow/hooks/useFlowNode.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFlowNode.js","sources":["../../../../../src/components/Flow/hooks/useFlowNode.ts"],"sourcesContent":["import { Edge, Node, ~~useStore~~ } from \"reactflow\";\n\nexport ~~const~~ useFlowNode = (id: string) => {\n const nodes = ~~useStore~~(~~(state~~) ~~=> state.getNodes())~~;\n const edges = ~~useStore~~(~~(state~~) ~~=> state.edges)~~;\n\n return {\n // self node\n get node() {\n const self = nodes.find((n: Node) => n.id === id);\n return self;\n },\n\n // parent nodes\n get parentNodes() {\n const connectedEdges = edges.filter((e: Edge) => e.target === id);\n const parentNodeArray = connectedEdges.map((e) => {\n const parentNode = nodes.find((n: Node) => n.id === e.source) as Node;\n return parentNode;\n });\n return parentNodeArray;\n },\n };\n};\n"],"names":["useFlowNode","id","nodes","~~useStore~~","~~state~~","~~getNodes~~","~~edges","~~node","self","find","n","parentNodes","connectedEdges","filter","e","target","parentNodeArray","map","parentNode","source"],"mappings":";~~AAEaA~~,~~MAAAA~~,~~cAAcA~~,~~CAACC,OAAe~~;~~AACzC~~,QAAMC,QAAQC~~,SAAUC,CAAUA,UAAAA,MAAMC,UAAU~~;~~AAClD~~,QAAMC,~~QAAQH,SAAUC,CAAUA,UAAAA,MAAME,KAAK~~;~~AAEtC~~,SAAA;AAAA;AAAA,IAEL,IAAIC,OAAO;AACT,YAAMC,~~OAAON~~,~~MAAMO~~,KAAK,CAACC,MAAYA,~~EAAET~~,OAAOA,EAAE;~~AACzCO~~,aAAAA;AAAAA,IACT;AAAA;AAAA,IAGA,IAAIG,cAAc;AAChB,YAAMC,~~iBAAiBN~~,~~MAAMO~~,OAAO,CAACC,MAAYA,EAAEC,~~WAAWd~~,EAAE;~~AAC1De~~,YAAAA,kBAAkBJ,eAAeK,IAAKH,CAAM,MAAA;AAC1CI,cAAAA,~~aAAahB~~,~~MAAMO~~,KAAK,CAACC,MAAYA,~~EAAET~~,~~OAAOa~~,EAAEK,MAAM;AACrDD,eAAAA;AAAAA,MAAAA,CACR;AACMF,aAAAA;AAAAA,IACT;AAAA,EAAA;AAEJ;"}
1	+ {"version":3,"file":"useFlowNode.js","sources":["../../../../../src/components/Flow/hooks/useFlowNode.ts"],"sourcesContent":["import { Edge, Node, useEdges, useNodes } from \"reactflow\";\n\nexport function useFlowNode<T = any>(id: string) {\n const nodes = useNodes<T>();\n const edges = useEdges();\n\n return {\n // self node\n get node() {\n const self = nodes.find((n: Node) => n.id === id);\n return self;\n },\n\n // parent nodes\n get parentNodes() {\n const connectedEdges = edges.filter((e: Edge) => e.target === id);\n const parentNodeArray = connectedEdges.map((e) => {\n const parentNode = nodes.find((n: Node) => n.id === e.source) as Node;\n return parentNode;\n });\n return parentNodeArray;\n },\n };\n}\n"],"names":["useFlowNode","id","nodes","useNodes","edges","useEdges","node","self","find","n","parentNodes","connectedEdges","filter","e","target","parentNodeArray","map","parentNode","source"],"mappings":";AAEO,SAASA,YAAqBC,IAAY;AAC/C,QAAMC,QAAQC;AACd,QAAMC,QAAQC;AAEP,SAAA;AAAA;AAAA,IAEL,IAAIC,OAAO;AACT,YAAMC,OAAOL,MAAMM,KAAK,CAACC,MAAYA,EAAER,OAAOA,EAAE;AACzCM,aAAAA;AAAAA,IACT;AAAA;AAAA,IAGA,IAAIG,cAAc;AAChB,YAAMC,iBAAiBP,MAAMQ,OAAO,CAACC,MAAYA,EAAEC,WAAWb,EAAE;AAC1Dc,YAAAA,kBAAkBJ,eAAeK,IAAKH,CAAM,MAAA;AAC1CI,cAAAA,aAAaf,MAAMM,KAAK,CAACC,MAAYA,EAAER,OAAOY,EAAEK,MAAM;AACrDD,eAAAA;AAAAA,MAAAA,CACR;AACMF,aAAAA;AAAAA,IACT;AAAA,EAAA;AAEJ;"}

package/dist/types/index.d.ts CHANGED Viewed

@@ -1,14 +1,14 @@
 import { BackgroundProps } from 'reactflow';
 import { ComponentClass } from 'react';
 import { ControlProps } from 'reactflow';
-import type { CSSInterpolation } from '@emotion/serialize';
+import { CSSInterpolation } from '@emotion/serialize';
 import { Dispatch } from 'react';
 import { DndContextProps } from '@dnd-kit/core';
 import { DragEndEvent } from '@dnd-kit/core';
 import { DragOverlayProps } from '@dnd-kit/core';
 import { Edge } from 'reactflow';
 import { ExtractNames } from '@hitachivantara/uikit-react-core';
-import { FunctionComponent } from 'react';
+import { FC } from 'react';
 import { GetMiniMapNodeAttribute } from 'reactflow';
 import { HvActionGeneric } from '@hitachivantara/uikit-react-core';
 import { HvActionsGenericProps } from '@hitachivantara/uikit-react-core';
@@ -20,7 +20,7 @@ import { HvColorAny } from '@hitachivantara/uikit-styles';
 import { HvDialogProps } from '@hitachivantara/uikit-react-core';
 import { HvDrawerProps } from '@hitachivantara/uikit-react-core';
 import { HvEmptyStateProps } from '@hitachivantara/uikit-react-core';
-import type { JSX as JSX_2 } from '@emotion/react/jsx-runtime';
+import { JSX as JSX_2 } from '@emotion/react/jsx-runtime';
 import { MiniMapProps } from 'reactflow';
 import { ModalProps } from '@mui/material';
 import { Node as Node_2 } from 'reactflow';
@@ -31,17 +31,17 @@ import { ReactFlowProps } from 'reactflow';
 import { SetStateAction } from 'react';
 export declare const flowBaseNodeClasses: {
-    title: "HvFlowBaseNode-title";
     root: "HvFlowBaseNode-root";
-    mandatory: "HvFlowBaseNode-mandatory";
+    title: "HvFlowBaseNode-title";
     titleContainer: "HvFlowBaseNode-titleContainer";
+    mandatory: "HvFlowBaseNode-mandatory";
+    inputContainer: "HvFlowBaseNode-inputContainer";
+    contentContainer: "HvFlowBaseNode-contentContainer";
     headerContainer: "HvFlowBaseNode-headerContainer";
     inputsTitleContainer: "HvFlowBaseNode-inputsTitleContainer";
     outputsTitleContainer: "HvFlowBaseNode-outputsTitleContainer";
-    contentContainer: "HvFlowBaseNode-contentContainer";
     inputsContainer: "HvFlowBaseNode-inputsContainer";
     outputsContainer: "HvFlowBaseNode-outputsContainer";
-    inputContainer: "HvFlowBaseNode-inputContainer";
     outputContainer: "HvFlowBaseNode-outputContainer";
 };
@@ -209,12 +209,10 @@ export declare interface HvFlowNodeAction extends HvActionGeneric {
 export declare type HvFlowNodeClasses = ExtractNames<typeof useClasses_12>;
-export declare interface HvFlowNodeComponentClass<GroupId extends keyof any = string, NodeData = any> extends ComponentClass<NodeProps> {
-    /** Metadata used on the HvFlowSidebar component to group the node */
-    meta?: HvFlowNodeTypeMeta<GroupId, NodeData>;
+export declare interface HvFlowNodeComponentClass<GroupId extends keyof any = string, NodeData = any> extends ComponentClass<NodeProps>, NodeExtras<GroupId, NodeData> {
 }
-export declare type HvFlowNodeComponentType<GroupId extends keyof any = string, NodeData = any> = HvFlowNodeComponentClass<GroupId, NodeData> | HvFlowNodeFunctionComponent<GroupId, NodeData>;
+export declare type HvFlowNodeComponentType<GroupId extends keyof any = string, NodeData = any> = HvFlowNodeComponentClass<GroupId, NodeData> | HvFlowNodeFC<GroupId, NodeData>;
 export declare type HvFlowNodeDefaults = {
     title?: string;
@@ -223,10 +221,8 @@ export declare type HvFlowNodeDefaults = {
     icon?: React_2.ReactNode;
 };
-/** Node types */
-export declare interface HvFlowNodeFunctionComponent<GroupId extends keyof any = string, NodeData = any> extends FunctionComponent<NodeProps> {
-    /** Metadata used on the HvFlowSidebar component to group the node */
-    meta?: HvFlowNodeTypeMeta<GroupId, NodeData>;
+/** HvFlowNode component type. @extends React.FC */
+export declare interface HvFlowNodeFC<GroupId extends keyof any = string, NodeData = any> extends FC<NodeProps>, NodeExtras<GroupId, NodeData> {
 }
 /** Node groups */
@@ -297,6 +293,7 @@ export declare interface HvFlowNodeTextParam extends HvFlowNodeSharedParam {
     type: "text";
 }
+/** Metadata used on the `HvFlowSidebar` component to group the node */
 export declare type HvFlowNodeTypeMeta<GroupId extends keyof any = string, NodeData = any> = {
     label: string;
     groupId?: GroupId;
@@ -305,9 +302,7 @@ export declare type HvFlowNodeTypeMeta<GroupId extends keyof any = string, NodeD
     data?: NodeData;
 };
-export declare type HvFlowNodeTypes<GroupId extends keyof any = string, NodeData = any> = {
-    [key: string]: HvFlowNodeComponentType<GroupId, NodeData>;
-};
+export declare type HvFlowNodeTypes<GroupId extends keyof any = string, NodeData = any> = Record<string, HvFlowNodeComponentType<GroupId, NodeData>>;
 export declare interface HvFlowProps<NodeGroups extends keyof any = string, NodeType extends string | undefined = string | undefined, NodeData = any> extends HvDroppableFlowProps<NodeType, NodeData> {
     /** Flow nodes groups. */
@@ -555,20 +550,24 @@ export declare interface HvWizardTitleProps extends HvBaseProps {
     classes?: HvWizardTitleClasses;
 }
+declare type NodeExtras<GroupId extends keyof any = string, NodeData = any> = {
+    meta?: HvFlowNodeTypeMeta<GroupId, NodeData>;
+};
 export declare const stepNavigationClasses: {
-    li: "HvStepNavigation-li";
-    ol: "HvStepNavigation-ol";
     root: "HvStepNavigation-root";
     separator: "HvStepNavigation-separator";
+    li: "HvStepNavigation-li";
+    ol: "HvStepNavigation-ol";
     titles: "HvStepNavigation-titles";
 };
-declare const useClasses: (classesProp?: Partial<Record<"li" | "ol" | "root" | "separator" | "titles", string>>, addStatic?: boolean) => {
+declare const useClasses: (classesProp?: Partial<Record<"root" | "separator" | "li" | "ol" | "titles", string>>, addStatic?: boolean) => {
     classes: {
-        li: string;
-        ol: string;
         root: string;
         separator: string;
+        li: string;
+        ol: string;
         titles: string;
     };
     css: {
@@ -595,19 +594,19 @@ declare const useClasses_10: (classesProp?: Partial<Record<"description" | "titl
     cx: (...args: any) => string;
 };
-declare const useClasses_11: (classesProp?: Partial<Record<"title" | "root" | "mandatory" | "titleContainer" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "inputContainer" | "outputContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_11: (classesProp?: Partial<Record<"root" | "title" | "titleContainer" | "mandatory" | "inputContainer" | "contentContainer" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "inputsContainer" | "outputsContainer" | "outputContainer", string>>, addStatic?: boolean) => {
     classes: {
-        title: string;
         root: string;
-        mandatory: string;
+        title: string;
         titleContainer: string;
+        mandatory: string;
+        inputContainer: string;
+        contentContainer: string;
         headerContainer: string;
         inputsTitleContainer: string;
         outputsTitleContainer: string;
-        contentContainer: string;
         inputsContainer: string;
         outputsContainer: string;
-        inputContainer: string;
         outputContainer: string;
     };
     css: {
@@ -630,16 +629,16 @@ declare const useClasses_12: (classesProp?: Partial<Record<"actions" | "subtitle
     cx: (...args: any) => string;
 };
-declare const useClasses_2: (classesProp?: Partial<Record<"xl" | "lg" | "md" | "sm" | "xs" | "root" | "ghost" | "avatar" | "ghostDisabled" | "notCurrent", string>>, addStatic?: boolean) => {
+declare const useClasses_2: (classesProp?: Partial<Record<"xs" | "sm" | "md" | "lg" | "xl" | "root" | "avatar" | "ghost" | "ghostDisabled" | "notCurrent", string>>, addStatic?: boolean) => {
     classes: {
-        xl: string;
-        lg: string;
-        md: string;
-        sm: string;
         xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
         root: string;
-        ghost: string;
         avatar: string;
+        ghost: string;
         ghostDisabled: string;
         notCurrent: string;
     };
@@ -661,10 +660,10 @@ declare const useClasses_3: (classesProp?: Partial<Record<"root", string>>, addS
     cx: (...args: any) => string;
 };
-declare const useClasses_4: (classesProp?: Partial<Record<"buttonWidth" | "actionsContainer" | "buttonsContainer" | "buttonSpacing", string>>, addStatic?: boolean) => {
+declare const useClasses_4: (classesProp?: Partial<Record<"actionsContainer" | "buttonWidth" | "buttonsContainer" | "buttonSpacing", string>>, addStatic?: boolean) => {
     classes: {
-        buttonWidth: string;
         actionsContainer: string;
+        buttonWidth: string;
         buttonsContainer: string;
         buttonSpacing: string;
     };
@@ -675,13 +674,13 @@ declare const useClasses_4: (classesProp?: Partial<Record<"buttonWidth" | "actio
     cx: (...args: any) => string;
 };
-declare const useClasses_5: (classesProp?: Partial<Record<"titleContainer" | "messageContainer" | "headerContainer" | "buttonWidth" | "rootSummaryButton" | "stepContainer", string>>, addStatic?: boolean) => {
+declare const useClasses_5: (classesProp?: Partial<Record<"titleContainer" | "messageContainer" | "buttonWidth" | "rootSummaryButton" | "headerContainer" | "stepContainer", string>>, addStatic?: boolean) => {
     classes: {
         titleContainer: string;
         messageContainer: string;
-        headerContainer: string;
         buttonWidth: string;
         rootSummaryButton: string;
+        headerContainer: string;
         stepContainer: string;
     };
     css: {
@@ -743,14 +742,14 @@ declare const useClasses_9: (classesProp?: Partial<Record<"root", string>>, addS
 export declare const useFlowContext: () => HvFlowContextValue<string>;
-export declare const useFlowNode: (id: string) => {
-    readonly node: Node_2 | undefined;
-    readonly parentNodes: Node_2[];
+export declare function useFlowNode<T = any>(id: string): {
+    readonly node: Node_2<T, string | undefined> | undefined;
+    readonly parentNodes: Node_2<any, string | undefined>[];
 };
 export declare const wizardActionsClasses: {
-    buttonWidth: "HvWizardActions-buttonWidth";
     actionsContainer: "HvWizardActions-actionsContainer";
+    buttonWidth: "HvWizardActions-buttonWidth";
     buttonsContainer: "HvWizardActions-buttonsContainer";
     buttonSpacing: "HvWizardActions-buttonSpacing";
 };
@@ -776,9 +775,9 @@ export declare const wizardContentClasses: {
 export declare const wizardTitleClasses: {
     titleContainer: "HvWizardTitle-titleContainer";
     messageContainer: "HvWizardTitle-messageContainer";
-    headerContainer: "HvWizardTitle-headerContainer";
     buttonWidth: "HvWizardTitle-buttonWidth";
     rootSummaryButton: "HvWizardTitle-rootSummaryButton";
+    headerContainer: "HvWizardTitle-headerContainer";
     stepContainer: "HvWizardTitle-stepContainer";
 };

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-lab",
-  "version": "5.15.0",
+  "version": "5.16.1",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Contributed React components for the NEXT UI Kit.",
@@ -32,9 +32,9 @@
     "@dnd-kit/core": "^6.0.8",
     "@dnd-kit/modifiers": "^6.0.1",
     "@emotion/css": "^11.11.0",
-    "@hitachivantara/uikit-react-core": "^5.36.3",
-    "@hitachivantara/uikit-react-icons": "^5.7.2",
-    "@hitachivantara/uikit-styles": "^5.16.1",
+    "@hitachivantara/uikit-react-core": "^5.36.5",
+    "@hitachivantara/uikit-react-icons": "^5.7.3",
+    "@hitachivantara/uikit-styles": "^5.16.2",
     "lodash": "^4.17.21",
     "reactflow": "^11.9.4",
     "uid": "^2.0.2",
@@ -48,7 +48,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "1464c1eda257df2ecca90646bc1e01474bc69d67",
+  "gitHead": "d0236ef87c697adb1d66b6b99a09404ee33e930e",
   "main": "dist/cjs/index.cjs",
   "exports": {
     ".": {