npm - @hitachivantara/uikit-react-lab - Versions diffs - 5.37.1 → 5.37.3 - Mend

@hitachivantara/uikit-react-lab 5.37.1 → 5.37.3

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 (52) hide show

package/dist/cjs/Dashboard/Dashboard.cjs CHANGED Viewed

@@ -27,15 +27,12 @@ const HvDashboard = (props) => {
   const { classes, cx } = Dashboard_styles.useClasses(classesProp);
   const { activeTheme } = uikitReactCore.useTheme();
   const layouts = React.useMemo(() => {
-    if (layoutsProp)
-      return layoutsProp;
-    if (!layout)
-      return {};
+    if (layoutsProp) return layoutsProp;
+    if (!layout) return {};
     return { xs: layout, sm: layout, md: layout, lg: layout, xl: layout };
   }, [layoutsProp, layout]);
   const cols = React.useMemo(() => {
-    if (!colsProp)
-      return defaultCols;
+    if (!colsProp) return defaultCols;
     if (typeof colsProp === "number") {
       return {
         xs: colsProp,

package/dist/cjs/Flow/DroppableFlow.cjs CHANGED Viewed

@@ -23,16 +23,13 @@ const validateEdge = (nodes, edges, connection, nodeMetaRegistry) => {
     target: targetId,
     targetHandle
   } = connection;
-  if (!sourceHandle || !targetHandle || !sourceId || !targetId)
-    return false;
+  if (!sourceHandle || !targetHandle || !sourceId || !targetId) return false;
   const sourceNode = getNode(nodes, sourceId);
   const targetNode = getNode(nodes, targetId);
-  if (!sourceNode || !targetNode)
-    return false;
+  if (!sourceNode || !targetNode) return false;
   const sourceType = sourceNode.type;
   const targetType = targetNode.type;
-  if (!sourceType || !targetType)
-    return false;
+  if (!sourceType || !targetType) return false;
   const inputs = nodeMetaRegistry[targetId]?.inputs || [];
   const outputs = nodeMetaRegistry[sourceId]?.outputs || [];
   const source = outputs.flatMap((out) => out.outputs || out).find((out) => out.id === sourceHandle);
@@ -92,8 +89,7 @@ const HvDroppableFlow = ({
   });
   const handleDragEnd = React.useCallback(
     (event) => {
-      if (event.over?.id !== elementId)
-        return;
+      if (event.over?.id !== elementId) return;
       const hvFlow = event.active.data.current?.hvFlow;
       const type = hvFlow?.type;
       if (!type || !nodeTypes?.[type]) {

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

@@ -91,8 +91,7 @@ const HvFlowBaseNode = ({
       input.isMandatory && !edgeConnected && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.mandatory })
     ] }, input.id);
   };
-  if (!node)
-    return null;
+  if (!node) return null;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -147,8 +146,7 @@ const HvFlowBaseNode = ({
         inputs && inputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactCore.HvTypography, { children: labels?.inputsTitle }) }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.inputsContainer, children: inputs?.map((input, idx) => {
-            if (!utils.isInputGroup(input))
-              return renderInput(input);
+            if (!utils.isInputGroup(input)) return renderInput(input);
             return /* @__PURE__ */ jsxRuntime.jsxs(
               "div",
               {

package/dist/cjs/Flow/Node/Parameters/ParamRenderer.cjs CHANGED Viewed

@@ -12,8 +12,7 @@ const renderers = {
 const ParamRenderer = ({ params, data }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: params.map((param, idx) => {
     const Renderer = renderers[param.type];
-    if (!Renderer)
-      return null;
+    if (!Renderer) return null;
     return /* @__PURE__ */ jsxRuntime.jsx(Renderer, { param, data }, idx);
   }) });
 };

package/dist/cjs/Flow/Node/Parameters/Select.cjs CHANGED Viewed

@@ -38,5 +38,4 @@ const Select = ({ param, data }) => {
     }
   );
 };
-const Select$1 = Select;
-exports.default = Select$1;
+exports.default = Select;

package/dist/cjs/Flow/Node/Parameters/Slider.cjs CHANGED Viewed

@@ -30,5 +30,4 @@ const Slider = ({ param, data }) => {
     }
   );
 };
-const Slider$1 = Slider;
-exports.default = Slider$1;
+exports.default = Slider;

package/dist/cjs/Flow/Node/Parameters/Text.cjs CHANGED Viewed

@@ -16,5 +16,4 @@ const Text = ({ param, data }) => {
     }
   );
 };
-const Text$1 = Text;
-exports.default = Text$1;
+exports.default = Text;

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

@@ -50,8 +50,7 @@ const HvFlowSidebar = ({
     onDragStart: handleDragStart
   });
   const filteredGroups = React.useMemo(() => {
-    if (!filterValue || !nodeGroups)
-      return nodeGroups || {};
+    if (!filterValue || !nodeGroups) return nodeGroups || {};
     return filterValue ? Object.entries(nodeGroups).reduce(
       (acc, [groupId, group]) => {
         const filteredItems = (group.items || []).filter(

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

@@ -70,8 +70,7 @@ function useFlowNodeUtils(id) {
   const reactFlowInstance = useFlowInstance.useFlowInstance();
   const setNodeData = React.useCallback(
     (setNewData) => {
-      if (!nodeId)
-        return;
+      if (!nodeId) return;
       reactFlowInstance.setNodes((nodes) => {
         return nodes.map((n) => {
           if (n.id === nodeId) {

package/dist/cjs/Flow/hooks/useNode.cjs CHANGED Viewed

@@ -77,8 +77,7 @@ function useHvNode(props) {
   }, [id, title, inputs, outputs, registerNode, unregisterNode]);
   const handleDefaultAction = React.useCallback(
     (action) => {
-      if (!node)
-        return;
+      if (!node) return;
       if (action.callback) {
         action.callback(node);
         return;

package/dist/cjs/StepNavigation/DefaultNavigation/Step/Step.cjs CHANGED Viewed

@@ -5,6 +5,23 @@ const uikitReactCore = require("@hitachivantara/uikit-react-core");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const utils = require("../utils.cjs");
 const Step_styles = require("./Step.styles.cjs");
+const iconSizeObject = {
+  xs: "XS",
+  sm: "XS",
+  md: "S",
+  lg: "M",
+  xl: "M"
+};
+const stateObject = {
+  Pending: 16,
+  Failed: 24,
+  Completed: 24
+};
+const iconStateObject = {
+  Pending: uikitReactIcons.HourGlass,
+  Failed: uikitReactIcons.Level3Bad,
+  Completed: uikitReactIcons.Level0Good
+};
 const HvStep = ({
   className,
   classes: classesProp,
@@ -16,18 +33,8 @@ const HvStep = ({
   number = 1
 }) => {
   const { classes, cx } = Step_styles.useClasses(classesProp);
-  const iconSize = {
-    xs: "XS",
-    sm: "XS",
-    md: "S",
-    ml: "M",
-    xl: "M"
-  }[size];
-  const squareL = {
-    Pending: 16,
-    Failed: 24,
-    Completed: 24
-  }[state];
+  const iconSize = iconSizeObject[size];
+  const squareL = stateObject[state];
   const svgSize = {
     xs: squareL - 8,
     sm: squareL,
@@ -39,11 +46,7 @@ const HvStep = ({
   const color = state === "Pending" ? "atmo2" : void 0;
   const semantic = state !== "Pending" ? utils.getSemantic(state) : void 0;
   const status = state === "Current" ? "secondary_60" : void 0;
-  const IconComponent = {
-    Pending: uikitReactIcons.HourGlass,
-    Failed: uikitReactIcons.Level3Bad,
-    Completed: uikitReactIcons.Level0Good
-  }[state];
+  const IconComponent = iconStateObject[state];
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {

package/dist/cjs/StepNavigation/StepNavigation.cjs CHANGED Viewed

@@ -136,11 +136,11 @@ const HvStepNavigation = ({
       title = rawTitle,
       titleWidth = 0,
       titleDisabled = false
-    } = getTitleProps({
+    } = getTitleProps?.({
       state,
       rawTitle,
       number: index + 1
-    });
+    }) ?? {};
     return /* @__PURE__ */ jsxRuntime.jsx(
       uikitReactCore.HvTypography,
       {
@@ -173,9 +173,8 @@ const HvStepNavigation = ({
       className: cx(classes.root, className),
       ...others,
       children: ({ stepsWidth, navWidth, ...itemsProps }) => /* @__PURE__ */ jsxRuntime.jsx(
-        uikitReactCore.HvBox,
+        "nav",
         {
-          component: "nav",
           style: {
             width: `${navWidth}px`,
             margin: 0

package/dist/cjs/Wizard/WizardActions/WizardActions.cjs CHANGED Viewed

@@ -57,8 +57,7 @@ const HvWizardActions = ({
     [handleSubmit, context]
   );
   const nextDisabled = React.useMemo(() => {
-    if (loading)
-      return true;
+    if (loading) return true;
     return !skippable && !context?.[tab]?.valid;
   }, [context, loading, skippable, tab]);
   return /* @__PURE__ */ jsxRuntime.jsxs(uikitReactCore.HvDialogActions, { className: classes.actionsContainer, children: [

package/dist/cjs/Wizard/WizardContent/WizardContent.cjs CHANGED Viewed

@@ -20,27 +20,29 @@ const HvWizardContent = ({
   const { classes, cx } = WizardContent_styles.useClasses(classesProp);
   const { context, setContext, summary, tab } = React.useContext(WizardContext.default);
   const arrayChildren = React__default.default.Children.toArray(children);
-  const initialContext = arrayChildren.reduce((acc, child, index) => {
-    const invalid = "mustValidate" in child.props && child.props.mustValidate === true ? false : null;
-    const valid = invalid ?? (index === 0 || null);
-    acc[index] = { ...child.props, form: {}, valid, touched: index === 0 };
-    return acc;
-  }, {});
+  const initialContext = arrayChildren.reduce(
+    (acc, child, index) => {
+      const invalid = "mustValidate" in child.props && child.props.mustValidate === true ? false : null;
+      const valid = invalid ?? (index === 0 || null);
+      acc[index] = { ...child.props, form: {}, valid, touched: index === 0 };
+      return acc;
+    },
+    {}
+  );
   const summaryRef = React.useRef();
   const resizedRef = React.useRef({ height: 0, width: 0 });
   const [containerRef, sizes] = usehooksTs.useElementSize();
   const [summaryHeight, setSummaryHeight] = React.useState(0);
   const [summaryWidth, setSummaryWidth] = React.useState(0);
   const [summaryLeft, setSummaryLeft] = React.useState(0);
-  const updateSummaryMeasures = React.useCallback((newSizes) => {
-    const modalWidth = newSizes.width;
-    const drawerWidth = modalWidth * DRAWER_PERCENTAGE;
-    setSummaryHeight(newSizes.height);
+  const updateSummaryMeasures = React.useCallback(({ height = 0, width = 0 }) => {
+    const drawerWidth = width * DRAWER_PERCENTAGE;
+    setSummaryHeight(height);
     setSummaryWidth(Math.max(drawerWidth, DRAWER_MIN_WIDTH));
-    setSummaryLeft(modalWidth - Math.max(drawerWidth, DRAWER_MIN_WIDTH));
+    setSummaryLeft(width - Math.max(drawerWidth, DRAWER_MIN_WIDTH));
     resizedRef.current = {
-      height: newSizes.height,
-      width: newSizes.width
+      height,
+      width
     };
   }, []);
   React.useEffect(() => {
@@ -61,14 +63,17 @@ const HvWizardContent = ({
   React.useEffect(() => {
     if (tab && !context[tab]?.touched) {
       setContext(
-        (oldContext) => Object.entries(oldContext).reduce((acc, [key, childState]) => {
-          acc[key] = +key <= tab ? {
-            ...childState,
-            touched: true,
-            valid: childState?.valid ?? true
-          } : childState;
-          return acc;
-        }, {})
+        (oldContext) => Object.entries(oldContext).reduce(
+          (acc, [key, childState]) => {
+            acc[Number(key)] = +key <= tab ? {
+              ...childState,
+              touched: true,
+              valid: childState?.valid ?? true
+            } : childState;
+            return acc;
+          },
+          {}
+        )
       );
     }
   }, [tab, context, setContext]);

package/dist/cjs/Wizard/WizardTitle/WizardTitle.cjs CHANGED Viewed

@@ -8,18 +8,12 @@ const WizardTitle_styles = require("./WizardTitle.styles.cjs");
 const WizardContext = require("../WizardContext/WizardContext.cjs");
 const StepNavigation = require("../../StepNavigation/StepNavigation.cjs");
 const switchTabState = (state, currentTab, index) => {
-  if (state.loading)
-    return "Pending";
-  if (index === currentTab)
-    return "Current";
-  if (state.valid)
-    return "Completed";
-  if (state.disabled)
-    return "Disabled";
-  if (state.valid === null)
-    return "Enabled";
-  if (state.touched && state.valid === false)
-    return "Failed";
+  if (state?.loading) return "Pending";
+  if (index === currentTab) return "Current";
+  if (state?.valid) return "Completed";
+  if (state?.disabled) return "Disabled";
+  if (state?.valid === null) return "Enabled";
+  if (state?.touched && state?.valid === false) return "Failed";
   return "Enabled";
 };
 const HvWizardTitle = ({

package/dist/esm/Dashboard/Dashboard.js CHANGED Viewed

@@ -26,15 +26,12 @@ const HvDashboard = (props) => {
   const { classes, cx } = useClasses(classesProp);
   const { activeTheme } = useTheme();
   const layouts = useMemo(() => {
-    if (layoutsProp)
-      return layoutsProp;
-    if (!layout)
-      return {};
+    if (layoutsProp) return layoutsProp;
+    if (!layout) return {};
     return { xs: layout, sm: layout, md: layout, lg: layout, xl: layout };
   }, [layoutsProp, layout]);
   const cols = useMemo(() => {
-    if (!colsProp)
-      return defaultCols;
+    if (!colsProp) return defaultCols;
     if (typeof colsProp === "number") {
       return {
         xs: colsProp,

package/dist/esm/Dashboard/Dashboard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dashboard.js","sources":["../../../src/Dashboard/Dashboard.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport {\n Layouts,\n ReactGridLayoutProps,\n Responsive as ResponsiveGrid,\n ResponsiveProps,\n WidthProvider,\n} from \"react-grid-layout\";\nimport { Global } from \"@emotion/react\";\nimport {\n ExtractNames,\n useDefaultProps,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { gridStyles, staticClasses, useClasses } from \"./Dashboard.styles\";\n\nconst GridLayout = WidthProvider(ResponsiveGrid);\n\n/** Default column breakpoints. For now, use always 12-column /\nconst defaultCols: HvDashboardProps[\"cols\"] = {\n xs: 12,\n sm: 12,\n md: 12,\n lg: 12,\n xl: 12,\n};\n\nexport { staticClasses as dashboardClasses };\n\nexport type HvDashboardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDashboardProps extends Omit<ResponsiveProps, \"cols\"> {\n /* Dashboard items. Each node must be `key`'ed /\n children: React.ReactNode;\n /* An object used to override or extend the styles applied. /\n classes?: HvDashboardClasses;\n /\n Layout is an array of object with the format:\n \n `{i: string, x: number, y: number, w: number, h: number}`\n \n The `i` must match the key used on each item component.\n /\n layout?: ReactGridLayoutProps[\"layout\"];\n /* Number of grid columns or an object of breakpoint -> #columns /\n cols?: number \| ResponsiveProps[\"cols\"];\n}\n\n/\n A Dashboard grid layout component, based on `react-grid-layout`.\n * The children elements are grid items and must be `key`ed.\n \n @see https://github.com/react-grid-layout/react-grid-layout?tab=readme-ov-file#grid-layout-props\n \n DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvDashboard = (props: HvDashboardProps) => {\n const {\n children,\n className,\n layout,\n cols: colsProp,\n layouts: layoutsProp,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvDashboard\", props);\n const { classes, cx } = useClasses(classesProp);\n const { activeTheme } = useTheme();\n\n const layouts = useMemo<Layouts>(() => {\n if (layoutsProp) return layoutsProp;\n if (!layout) return {};\n\n return { xs: layout, sm: layout, md: layout, lg: layout, xl: layout };\n }, [layoutsProp, layout]);\n\n const cols = useMemo<ResponsiveProps[\"cols\"]>(() => {\n if (!colsProp) return defaultCols;\n\n if (typeof colsProp === \"number\") {\n return {\n xs: colsProp,\n sm: colsProp,\n md: colsProp,\n lg: colsProp,\n xl: colsProp,\n };\n }\n\n return colsProp;\n }, [colsProp]);\n\n return (\n <>\n <Global styles={gridStyles} />\n <GridLayout\n className={cx(classes.root, className)}\n breakpoints={activeTheme?.breakpoints.values}\n cols={cols}\n layouts={layouts}\n {...others}\n >\n {children}\n </GridLayout>\n </>\n );\n};\n"],"names":["ResponsiveGrid"],"mappings":";;;;;;;AAiBA,MAAM,aAAa,cAAcA,UAAc;AAG/C,MAAM,cAAwC;AAAA,EAC5C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AA+Ba,MAAA,cAAc,CAAC,UAA4B;AAChD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACD,gBAAgB,eAAe,KAAK;AACxC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AACxC,QAAA,EAAE,gBAAgB;AAElB,QAAA,UAAU,QAAiB,MAAM;~~AACjC~~,QAAA;~~AAAoB~~,~~aAAA;AACxB~~,~~QAAI,~~CAAC~~;AAAQ~~,~~aAAO~~;AAEb,WAAA,EAAE,IAAI,QAAQ,IAAI,QAAQ,IAAI,QAAQ,IAAI,QAAQ,IAAI,OAAO;AAAA,EAAA,GACnE,CAAC,aAAa,MAAM,CAAC;AAElB,QAAA,OAAO,QAAiC,MAAM;~~AAClD~~,~~QAAI~~,CAAC~~;AAAiB~~,~~aAAA~~;AAElB,QAAA,OAAO,aAAa,UAAU;AACzB,aAAA;AAAA,QACL,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IAER;AAEO,WAAA;AAAA,EAAA,GACN,CAAC,QAAQ,CAAC;AAEb,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAC,oBAAA,QAAA,EAAO,QAAQ,WAAY,CAAA;AAAA,IAC5B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACrC,aAAa,aAAa,YAAY;AAAA,QACtC;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QAEH;AAAA,MAAA;AAAA,IACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}
1	+ {"version":3,"file":"Dashboard.js","sources":["../../../src/Dashboard/Dashboard.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport {\n Layouts,\n ReactGridLayoutProps,\n Responsive as ResponsiveGrid,\n ResponsiveProps,\n WidthProvider,\n} from \"react-grid-layout\";\nimport { Global } from \"@emotion/react\";\nimport {\n ExtractNames,\n useDefaultProps,\n useTheme,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { gridStyles, staticClasses, useClasses } from \"./Dashboard.styles\";\n\nconst GridLayout = WidthProvider(ResponsiveGrid);\n\n/** Default column breakpoints. For now, use always 12-column /\nconst defaultCols: HvDashboardProps[\"cols\"] = {\n xs: 12,\n sm: 12,\n md: 12,\n lg: 12,\n xl: 12,\n};\n\nexport { staticClasses as dashboardClasses };\n\nexport type HvDashboardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDashboardProps extends Omit<ResponsiveProps, \"cols\"> {\n /* Dashboard items. Each node must be `key`'ed /\n children: React.ReactNode;\n /* An object used to override or extend the styles applied. /\n classes?: HvDashboardClasses;\n /\n Layout is an array of object with the format:\n \n `{i: string, x: number, y: number, w: number, h: number}`\n \n The `i` must match the key used on each item component.\n /\n layout?: ReactGridLayoutProps[\"layout\"];\n /* Number of grid columns or an object of breakpoint -> #columns /\n cols?: number \| ResponsiveProps[\"cols\"];\n}\n\n/\n A Dashboard grid layout component, based on `react-grid-layout`.\n * The children elements are grid items and must be `key`ed.\n \n @see https://github.com/react-grid-layout/react-grid-layout?tab=readme-ov-file#grid-layout-props\n \n DISCLAIMER: This component is a work in progress and there might be breaking changes.\n */\nexport const HvDashboard = (props: HvDashboardProps) => {\n const {\n children,\n className,\n layout,\n cols: colsProp,\n layouts: layoutsProp,\n classes: classesProp,\n ...others\n } = useDefaultProps(\"HvDashboard\", props);\n const { classes, cx } = useClasses(classesProp);\n const { activeTheme } = useTheme();\n\n const layouts = useMemo<Layouts>(() => {\n if (layoutsProp) return layoutsProp;\n if (!layout) return {};\n\n return { xs: layout, sm: layout, md: layout, lg: layout, xl: layout };\n }, [layoutsProp, layout]);\n\n const cols = useMemo<ResponsiveProps[\"cols\"]>(() => {\n if (!colsProp) return defaultCols;\n\n if (typeof colsProp === \"number\") {\n return {\n xs: colsProp,\n sm: colsProp,\n md: colsProp,\n lg: colsProp,\n xl: colsProp,\n };\n }\n\n return colsProp;\n }, [colsProp]);\n\n return (\n <>\n <Global styles={gridStyles} />\n <GridLayout\n className={cx(classes.root, className)}\n breakpoints={activeTheme?.breakpoints.values}\n cols={cols}\n layouts={layouts}\n {...others}\n >\n {children}\n </GridLayout>\n </>\n );\n};\n"],"names":["ResponsiveGrid"],"mappings":";;;;;;;AAiBA,MAAM,aAAa,cAAcA,UAAc;AAG/C,MAAM,cAAwC;AAAA,EAC5C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AA+Ba,MAAA,cAAc,CAAC,UAA4B;AAChD,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACD,gBAAgB,eAAe,KAAK;AACxC,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AACxC,QAAA,EAAE,gBAAgB;AAElB,QAAA,UAAU,QAAiB,MAAM;AACrC,QAAI,YAAoB,QAAA;AACpB,QAAA,CAAC,OAAQ,QAAO;AAEb,WAAA,EAAE,IAAI,QAAQ,IAAI,QAAQ,IAAI,QAAQ,IAAI,QAAQ,IAAI,OAAO;AAAA,EAAA,GACnE,CAAC,aAAa,MAAM,CAAC;AAElB,QAAA,OAAO,QAAiC,MAAM;AAC9C,QAAA,CAAC,SAAiB,QAAA;AAElB,QAAA,OAAO,aAAa,UAAU;AACzB,aAAA;AAAA,QACL,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IAER;AAEO,WAAA;AAAA,EAAA,GACN,CAAC,QAAQ,CAAC;AAEb,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAC,oBAAA,QAAA,EAAO,QAAQ,WAAY,CAAA;AAAA,IAC5B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QACrC,aAAa,aAAa,YAAY;AAAA,QACtC;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QAEH;AAAA,MAAA;AAAA,IACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/dist/esm/Flow/DroppableFlow.js CHANGED Viewed

@@ -20,16 +20,13 @@ const validateEdge = (nodes, edges, connection, nodeMetaRegistry) => {
     target: targetId,
     targetHandle
   } = connection;
-  if (!sourceHandle || !targetHandle || !sourceId || !targetId)
-    return false;
+  if (!sourceHandle || !targetHandle || !sourceId || !targetId) return false;
   const sourceNode = getNode(nodes, sourceId);
   const targetNode = getNode(nodes, targetId);
-  if (!sourceNode || !targetNode)
-    return false;
+  if (!sourceNode || !targetNode) return false;
   const sourceType = sourceNode.type;
   const targetType = targetNode.type;
-  if (!sourceType || !targetType)
-    return false;
+  if (!sourceType || !targetType) return false;
   const inputs = nodeMetaRegistry[targetId]?.inputs || [];
   const outputs = nodeMetaRegistry[sourceId]?.outputs || [];
   const source = outputs.flatMap((out) => out.outputs || out).find((out) => out.id === sourceHandle);
@@ -89,8 +86,7 @@ const HvDroppableFlow = ({
   });
   const handleDragEnd = useCallback(
     (event) => {
-      if (event.over?.id !== elementId)
-        return;
+      if (event.over?.id !== elementId) return;
       const hvFlow = event.active.data.current?.hvFlow;
       const type = hvFlow?.type;
       if (!type || !nodeTypes?.[type]) {

package/dist/esm/Flow/DroppableFlow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DroppableFlow.js","sources":["../../../src/Flow/DroppableFlow.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from \"react\";\nimport { DragEndEvent, useDndMonitor, useDroppable } from \"@dnd-kit/core\";\nimport { Global } from \"@emotion/react\";\nimport ReactFlow, {\n addEdge,\n applyEdgeChanges,\n applyNodeChanges,\n Connection,\n Edge,\n EdgeChange,\n MarkerType,\n Node,\n NodeChange,\n ReactFlowProps,\n} from \"reactflow\";\nimport { uid } from \"uid\";\nimport { ExtractNames, useUniqueId } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowStyles } from \"./base\";\nimport { staticClasses, useClasses } from \"./Flow.styles\";\nimport { useNodeMetaRegistry } from \"./FlowContext/NodeMetaContext\";\nimport { useFlowInstance } from \"./hooks\";\nimport {\n HvFlowNodeInputGroup,\n HvFlowNodeMetaRegistry,\n HvFlowNodeOutputGroup,\n HvFlowNodeTypes,\n} from \"./types\";\n\nexport { staticClasses as flowClasses };\n\nexport type HvFlowClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDroppableFlowProps<\n NodeType extends string \| undefined = string \| undefined,\n NodeData = any,\n> extends Omit<ReactFlowProps, \"nodes\" \| \"edges\" \| \"nodeTypes\"> {\n /** Flow content: background, controls, and minimap. /\n children?: React.ReactNode;\n /* Flow nodes types. /\n nodeTypes?: HvFlowNodeTypes<NodeData>;\n /* Flow nodes. /\n nodes?: Node<NodeData, NodeType>[];\n /* Flow edges. /\n edges?: Edge[];\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvFlowClasses;\n /* Callback called when the flow changes. Returns the updated nodes and edges. /\n onFlowChange?: (nodes: Node<NodeData, NodeType>[], edges: Edge[]) => void;\n /\n Callback called when a node is dropped in the flow.\n \n This callback should be used to override the custom UI Kit drop event.\n * Thus, when defined, the user is responsible for adding nodes to the flow.\n \n This callback is called when `HvFlowSidebar` is used or a custom sidebar was created using Dnd Kit.\n * When a custom sidebar was created using the native HTML drag and drop API, refer to the `onDrop` callback.\n \n Returns the event and the node to be added to the flow.\n */\n onDndDrop?: (event: DragEndEvent, node: Node) => void;\n}\n\nexport const getNode = (nodes: Node[], nodeId: string) => {\n return nodes.find((n) => n.id === nodeId);\n};\n\nconst validateEdge = (\n nodes: Node[],\n edges: Edge[],\n connection: Connection,\n nodeMetaRegistry: HvFlowNodeMetaRegistry,\n) => {\n const {\n source: sourceId,\n sourceHandle,\n target: targetId,\n targetHandle,\n } = connection;\n\n if (!sourceHandle \|\| !targetHandle \|\| !sourceId \|\| !targetId) return false;\n\n const sourceNode = getNode(nodes, sourceId);\n const targetNode = getNode(nodes, targetId);\n\n if (!sourceNode \|\| !targetNode) return false;\n\n const sourceType = sourceNode.type;\n const targetType = targetNode.type;\n\n if (!sourceType \|\| !targetType) return false;\n\n const inputs = nodeMetaRegistry[targetId]?.inputs \|\| [];\n const outputs = nodeMetaRegistry[sourceId]?.outputs \|\| [];\n\n const source = outputs\n .flatMap((out) => (out as HvFlowNodeOutputGroup).outputs \|\| out)\n .find((out) => out.id === sourceHandle);\n const target = inputs\n .flatMap((inp) => (inp as HvFlowNodeInputGroup).inputs \|\| inp)\n .find((inp) => inp.id === targetHandle);\n\n const sourceProvides = source?.provides \|\| \"\";\n const targetAccepts = target?.accepts \|\| [];\n const sourceMaxConnections = source?.maxConnections;\n const targetMaxConnections = target?.maxConnections;\n\n let isValid =\n targetAccepts.length === 0 \|\| targetAccepts.includes(sourceProvides);\n\n if (isValid && targetMaxConnections != null) {\n const targetConnections = edges.filter(\n (edg) => edg.target === targetId && edg.targetHandle === targetHandle,\n ).length;\n\n isValid = targetConnections < targetMaxConnections;\n }\n\n if (isValid && sourceMaxConnections != null) {\n const sourceConnections = edges.filter(\n (edg) => edg.source === sourceId && edg.sourceHandle === sourceHandle,\n ).length;\n\n isValid = sourceConnections < sourceMaxConnections;\n }\n\n return isValid;\n};\n\nexport const HvDroppableFlow = ({\n id,\n className,\n children,\n onFlowChange,\n onDndDrop,\n classes: classesProp,\n nodes: initialNodes = [],\n edges: initialEdges = [],\n onConnect: onConnectProp,\n onNodesChange: onNodesChangeProp,\n onEdgesChange: onEdgesChangeProp,\n defaultEdgeOptions: defaultEdgeOptionsProp,\n nodeTypes,\n ...others\n}: HvDroppableFlowProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id);\n\n const reactFlowInstance = useFlowInstance();\n\n const [nodes, setNodes] = useState(initialNodes);\n const [edges, setEdges] = useState(initialEdges);\n // Keeping track of nodes and edges for onFlowChange since useState is async\n const nodesRef = useRef(initialNodes);\n const edgesRef = useRef(initialEdges);\n\n const updateNodes = (nds: Node[]) => {\n setNodes(nds);\n nodesRef.current = nds;\n };\n\n const updateEdges = (eds: Edge[]) => {\n setEdges(eds);\n edgesRef.current = eds;\n };\n\n const { setNodeRef } = useDroppable({\n id: elementId,\n });\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n if (event.over?.id !== elementId) return;\n\n const hvFlow = event.active.data.current?.hvFlow;\n const type = hvFlow?.type;\n\n // Only known node types can be dropped in the canvas\n if (!type \|\| !nodeTypes?.[type]) {\n if (import.meta.env.DEV) {\n // eslint-disable-next-line no-console\n console.error(\n `Could not add node to the flow because of unknown type ${type}. Use nodeTypes to define all the node types.`,\n );\n }\n return;\n }\n\n // Position node in the flow\n const position = reactFlowInstance.screenToFlowPosition({\n x: hvFlow?.x \|\| 0,\n y: hvFlow?.y \|\| 0,\n });\n\n // Node data\n const data = {\n nodeLabel: hvFlow?.label,\n ...hvFlow?.data,\n };\n\n // Node to add\n const newNode: Node = {\n id: uid(),\n position,\n data,\n type,\n };\n\n // Drop override\n if (onDndDrop) {\n onDndDrop(event, newNode);\n return;\n }\n\n updateNodes(nodes.concat(newNode));\n },\n [elementId, nodeTypes, nodes, onDndDrop, reactFlowInstance],\n );\n\n useDndMonitor({\n onDragEnd: handleDragEnd,\n });\n\n const handleFlowChange = useCallback(\n (nds: Node[], eds: Edge[]) => {\n // The new flow is returned if the user is not dragging nodes\n // This avoids triggering this handler too many times\n const isDragging = nds.find((node) => node.dragging);\n if (!isDragging) {\n onFlowChange?.(nds, eds);\n }\n },\n [onFlowChange],\n );\n\n const handleConnect = useCallback(\n (connection: Connection) => {\n const eds = addEdge(connection, edgesRef.current);\n updateEdges(eds);\n\n handleFlowChange(nodesRef.current, eds);\n onConnectProp?.(connection);\n },\n [handleFlowChange, onConnectProp],\n );\n\n const handleNodesChange = useCallback(\n (changes: NodeChange[]) => {\n const nds = applyNodeChanges(changes, nodesRef.current);\n updateNodes(nds);\n\n handleFlowChange(nds, edgesRef.current);\n onNodesChangeProp?.(changes);\n },\n [handleFlowChange, onNodesChangeProp],\n );\n\n const handleEdgesChange = useCallback(\n (changes: EdgeChange[]) => {\n const eds = applyEdgeChanges(changes, edgesRef.current);\n updateEdges(eds);\n\n handleFlowChange(nodesRef.current, eds);\n onEdgesChangeProp?.(changes);\n },\n [handleFlowChange, onEdgesChangeProp],\n );\n\n const { registry } = useNodeMetaRegistry();\n\n const isValidConnection: ReactFlowProps[\"isValidConnection\"] = (connection) =>\n validateEdge(nodes, edges, connection, registry);\n\n const defaultEdgeOptions = {\n markerEnd: {\n type: MarkerType.ArrowClosed,\n height: 20,\n width: 20,\n },\n type: \"smoothstep\",\n pathOptions: {\n borderRadius: 40,\n },\n ...defaultEdgeOptionsProp,\n };\n\n return (\n <>\n <Global styles={flowStyles} />\n <div\n id={elementId}\n ref={setNodeRef}\n className={cx(classes.root, className)}\n >\n <ReactFlow\n nodes={nodes}\n edges={edges}\n nodeTypes={nodeTypes}\n onNodesChange={handleNodesChange}\n onEdgesChange={handleEdgesChange}\n onConnect={handleConnect}\n isValidConnection={isValidConnection}\n defaultEdgeOptions={defaultEdgeOptions}\n snapGrid={[1, 1]}\n snapToGrid\n onError={(code, message) => {\n if (import.meta.env.DEV) {\n // eslint-disable-next-line no-console\n console.error(message);\n }\n }}\n {...others}\n >\n {children}\n </ReactFlow>\n </div>\n </>\n );\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"DroppableFlow.js","sources":["../../../src/Flow/DroppableFlow.tsx"],"sourcesContent":["import { useCallback, useRef, useState } from \"react\";\nimport { DragEndEvent, useDndMonitor, useDroppable } from \"@dnd-kit/core\";\nimport { Global } from \"@emotion/react\";\nimport ReactFlow, {\n addEdge,\n applyEdgeChanges,\n applyNodeChanges,\n Connection,\n Edge,\n EdgeChange,\n MarkerType,\n Node,\n NodeChange,\n ReactFlowProps,\n} from \"reactflow\";\nimport { uid } from \"uid\";\nimport { ExtractNames, useUniqueId } from \"@hitachivantara/uikit-react-core\";\n\nimport { flowStyles } from \"./base\";\nimport { staticClasses, useClasses } from \"./Flow.styles\";\nimport { useNodeMetaRegistry } from \"./FlowContext/NodeMetaContext\";\nimport { useFlowInstance } from \"./hooks\";\nimport {\n HvFlowNodeInputGroup,\n HvFlowNodeMetaRegistry,\n HvFlowNodeOutputGroup,\n HvFlowNodeTypes,\n} from \"./types\";\n\nexport { staticClasses as flowClasses };\n\nexport type HvFlowClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDroppableFlowProps<\n NodeType extends string \| undefined = string \| undefined,\n NodeData = any,\n> extends Omit<ReactFlowProps, \"nodes\" \| \"edges\" \| \"nodeTypes\"> {\n /** Flow content: background, controls, and minimap. /\n children?: React.ReactNode;\n /* Flow nodes types. /\n nodeTypes?: HvFlowNodeTypes<NodeData>;\n /* Flow nodes. /\n nodes?: Node<NodeData, NodeType>[];\n /* Flow edges. /\n edges?: Edge[];\n /* A Jss Object used to override or extend the styles applied to the component. /\n classes?: HvFlowClasses;\n /* Callback called when the flow changes. Returns the updated nodes and edges. /\n onFlowChange?: (nodes: Node<NodeData, NodeType>[], edges: Edge[]) => void;\n /\n Callback called when a node is dropped in the flow.\n \n This callback should be used to override the custom UI Kit drop event.\n * Thus, when defined, the user is responsible for adding nodes to the flow.\n \n This callback is called when `HvFlowSidebar` is used or a custom sidebar was created using Dnd Kit.\n * When a custom sidebar was created using the native HTML drag and drop API, refer to the `onDrop` callback.\n \n Returns the event and the node to be added to the flow.\n */\n onDndDrop?: (event: DragEndEvent, node: Node) => void;\n}\n\nexport const getNode = (nodes: Node[], nodeId: string) => {\n return nodes.find((n) => n.id === nodeId);\n};\n\nconst validateEdge = (\n nodes: Node[],\n edges: Edge[],\n connection: Connection,\n nodeMetaRegistry: HvFlowNodeMetaRegistry,\n) => {\n const {\n source: sourceId,\n sourceHandle,\n target: targetId,\n targetHandle,\n } = connection;\n\n if (!sourceHandle \|\| !targetHandle \|\| !sourceId \|\| !targetId) return false;\n\n const sourceNode = getNode(nodes, sourceId);\n const targetNode = getNode(nodes, targetId);\n\n if (!sourceNode \|\| !targetNode) return false;\n\n const sourceType = sourceNode.type;\n const targetType = targetNode.type;\n\n if (!sourceType \|\| !targetType) return false;\n\n const inputs = nodeMetaRegistry[targetId]?.inputs \|\| [];\n const outputs = nodeMetaRegistry[sourceId]?.outputs \|\| [];\n\n const source = outputs\n .flatMap((out) => (out as HvFlowNodeOutputGroup).outputs \|\| out)\n .find((out) => out.id === sourceHandle);\n const target = inputs\n .flatMap((inp) => (inp as HvFlowNodeInputGroup).inputs \|\| inp)\n .find((inp) => inp.id === targetHandle);\n\n const sourceProvides = source?.provides \|\| \"\";\n const targetAccepts = target?.accepts \|\| [];\n const sourceMaxConnections = source?.maxConnections;\n const targetMaxConnections = target?.maxConnections;\n\n let isValid =\n targetAccepts.length === 0 \|\| targetAccepts.includes(sourceProvides);\n\n if (isValid && targetMaxConnections != null) {\n const targetConnections = edges.filter(\n (edg) => edg.target === targetId && edg.targetHandle === targetHandle,\n ).length;\n\n isValid = targetConnections < targetMaxConnections;\n }\n\n if (isValid && sourceMaxConnections != null) {\n const sourceConnections = edges.filter(\n (edg) => edg.source === sourceId && edg.sourceHandle === sourceHandle,\n ).length;\n\n isValid = sourceConnections < sourceMaxConnections;\n }\n\n return isValid;\n};\n\nexport const HvDroppableFlow = ({\n id,\n className,\n children,\n onFlowChange,\n onDndDrop,\n classes: classesProp,\n nodes: initialNodes = [],\n edges: initialEdges = [],\n onConnect: onConnectProp,\n onNodesChange: onNodesChangeProp,\n onEdgesChange: onEdgesChangeProp,\n defaultEdgeOptions: defaultEdgeOptionsProp,\n nodeTypes,\n ...others\n}: HvDroppableFlowProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const elementId = useUniqueId(id);\n\n const reactFlowInstance = useFlowInstance();\n\n const [nodes, setNodes] = useState(initialNodes);\n const [edges, setEdges] = useState(initialEdges);\n // Keeping track of nodes and edges for onFlowChange since useState is async\n const nodesRef = useRef(initialNodes);\n const edgesRef = useRef(initialEdges);\n\n const updateNodes = (nds: Node[]) => {\n setNodes(nds);\n nodesRef.current = nds;\n };\n\n const updateEdges = (eds: Edge[]) => {\n setEdges(eds);\n edgesRef.current = eds;\n };\n\n const { setNodeRef } = useDroppable({\n id: elementId,\n });\n\n const handleDragEnd = useCallback(\n (event: DragEndEvent) => {\n if (event.over?.id !== elementId) return;\n\n const hvFlow = event.active.data.current?.hvFlow;\n const type = hvFlow?.type;\n\n // Only known node types can be dropped in the canvas\n if (!type \|\| !nodeTypes?.[type]) {\n if (import.meta.env.DEV) {\n // eslint-disable-next-line no-console\n console.error(\n `Could not add node to the flow because of unknown type ${type}. Use nodeTypes to define all the node types.`,\n );\n }\n return;\n }\n\n // Position node in the flow\n const position = reactFlowInstance.screenToFlowPosition({\n x: hvFlow?.x \|\| 0,\n y: hvFlow?.y \|\| 0,\n });\n\n // Node data\n const data = {\n nodeLabel: hvFlow?.label,\n ...hvFlow?.data,\n };\n\n // Node to add\n const newNode: Node = {\n id: uid(),\n position,\n data,\n type,\n };\n\n // Drop override\n if (onDndDrop) {\n onDndDrop(event, newNode);\n return;\n }\n\n updateNodes(nodes.concat(newNode));\n },\n [elementId, nodeTypes, nodes, onDndDrop, reactFlowInstance],\n );\n\n useDndMonitor({\n onDragEnd: handleDragEnd,\n });\n\n const handleFlowChange = useCallback(\n (nds: Node[], eds: Edge[]) => {\n // The new flow is returned if the user is not dragging nodes\n // This avoids triggering this handler too many times\n const isDragging = nds.find((node) => node.dragging);\n if (!isDragging) {\n onFlowChange?.(nds, eds);\n }\n },\n [onFlowChange],\n );\n\n const handleConnect = useCallback(\n (connection: Connection) => {\n const eds = addEdge(connection, edgesRef.current);\n updateEdges(eds);\n\n handleFlowChange(nodesRef.current, eds);\n onConnectProp?.(connection);\n },\n [handleFlowChange, onConnectProp],\n );\n\n const handleNodesChange = useCallback(\n (changes: NodeChange[]) => {\n const nds = applyNodeChanges(changes, nodesRef.current);\n updateNodes(nds);\n\n handleFlowChange(nds, edgesRef.current);\n onNodesChangeProp?.(changes);\n },\n [handleFlowChange, onNodesChangeProp],\n );\n\n const handleEdgesChange = useCallback(\n (changes: EdgeChange[]) => {\n const eds = applyEdgeChanges(changes, edgesRef.current);\n updateEdges(eds);\n\n handleFlowChange(nodesRef.current, eds);\n onEdgesChangeProp?.(changes);\n },\n [handleFlowChange, onEdgesChangeProp],\n );\n\n const { registry } = useNodeMetaRegistry();\n\n const isValidConnection: ReactFlowProps[\"isValidConnection\"] = (connection) =>\n validateEdge(nodes, edges, connection, registry);\n\n const defaultEdgeOptions = {\n markerEnd: {\n type: MarkerType.ArrowClosed,\n height: 20,\n width: 20,\n },\n type: \"smoothstep\",\n pathOptions: {\n borderRadius: 40,\n },\n ...defaultEdgeOptionsProp,\n };\n\n return (\n <>\n <Global styles={flowStyles} />\n <div\n id={elementId}\n ref={setNodeRef}\n className={cx(classes.root, className)}\n >\n <ReactFlow\n nodes={nodes}\n edges={edges}\n nodeTypes={nodeTypes}\n onNodesChange={handleNodesChange}\n onEdgesChange={handleEdgesChange}\n onConnect={handleConnect}\n isValidConnection={isValidConnection}\n defaultEdgeOptions={defaultEdgeOptions}\n snapGrid={[1, 1]}\n snapToGrid\n onError={(code, message) => {\n if (import.meta.env.DEV) {\n // eslint-disable-next-line no-console\n console.error(message);\n }\n }}\n {...others}\n >\n {children}\n </ReactFlow>\n </div>\n </>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;AA+Da,MAAA,UAAU,CAAC,OAAe,WAAmB;AACxD,SAAO,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,MAAM;AAC1C;AAEA,MAAM,eAAe,CACnB,OACA,OACA,YACA,qBACG;AACG,QAAA;AAAA,IACJ,QAAQ;AAAA,IACR;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,EACE,IAAA;AAEA,MAAA,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,YAAY,CAAC,SAAiB,QAAA;AAE/D,QAAA,aAAa,QAAQ,OAAO,QAAQ;AACpC,QAAA,aAAa,QAAQ,OAAO,QAAQ;AAE1C,MAAI,CAAC,cAAc,CAAC,WAAmB,QAAA;AAEvC,QAAM,aAAa,WAAW;AAC9B,QAAM,aAAa,WAAW;AAE9B,MAAI,CAAC,cAAc,CAAC,WAAmB,QAAA;AAEvC,QAAM,SAAS,iBAAiB,QAAQ,GAAG,UAAU,CAAA;AACrD,QAAM,UAAU,iBAAiB,QAAQ,GAAG,WAAW,CAAA;AAEvD,QAAM,SAAS,QACZ,QAAQ,CAAC,QAAS,IAA8B,WAAW,GAAG,EAC9D,KAAK,CAAC,QAAQ,IAAI,OAAO,YAAY;AACxC,QAAM,SAAS,OACZ,QAAQ,CAAC,QAAS,IAA6B,UAAU,GAAG,EAC5D,KAAK,CAAC,QAAQ,IAAI,OAAO,YAAY;AAElC,QAAA,iBAAiB,QAAQ,YAAY;AACrC,QAAA,gBAAgB,QAAQ,WAAW;AACzC,QAAM,uBAAuB,QAAQ;AACrC,QAAM,uBAAuB,QAAQ;AAErC,MAAI,UACF,cAAc,WAAW,KAAK,cAAc,SAAS,cAAc;AAEjE,MAAA,WAAW,wBAAwB,MAAM;AAC3C,UAAM,oBAAoB,MAAM;AAAA,MAC9B,CAAC,QAAQ,IAAI,WAAW,YAAY,IAAI,iBAAiB;AAAA,IACzD,EAAA;AAEF,cAAU,oBAAoB;AAAA,EAChC;AAEI,MAAA,WAAW,wBAAwB,MAAM;AAC3C,UAAM,oBAAoB,MAAM;AAAA,MAC9B,CAAC,QAAQ,IAAI,WAAW,YAAY,IAAI,iBAAiB;AAAA,IACzD,EAAA;AAEF,cAAU,oBAAoB;AAAA,EAChC;AAEO,SAAA;AACT;AAEO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT,OAAO,eAAe,CAAC;AAAA,EACvB,OAAO,eAAe,CAAC;AAAA,EACvB,WAAW;AAAA,EACX,eAAe;AAAA,EACf,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB;AAAA,EACA,GAAG;AACL,MAA4B;AAC1B,QAAM,EAAE,SAAS,GAAG,IAAI,WAAW,WAAW;AAExC,QAAA,YAAY,YAAY,EAAE;AAEhC,QAAM,oBAAoB;AAE1B,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,YAAY;AAC/C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,YAAY;AAEzC,QAAA,WAAW,OAAO,YAAY;AAC9B,QAAA,WAAW,OAAO,YAAY;AAE9B,QAAA,cAAc,CAAC,QAAgB;AACnC,aAAS,GAAG;AACZ,aAAS,UAAU;AAAA,EAAA;AAGf,QAAA,cAAc,CAAC,QAAgB;AACnC,aAAS,GAAG;AACZ,aAAS,UAAU;AAAA,EAAA;AAGf,QAAA,EAAE,WAAW,IAAI,aAAa;AAAA,IAClC,IAAI;AAAA,EAAA,CACL;AAED,QAAM,gBAAgB;AAAA,IACpB,CAAC,UAAwB;AACnB,UAAA,MAAM,MAAM,OAAO,UAAW;AAElC,YAAM,SAAS,MAAM,OAAO,KAAK,SAAS;AAC1C,YAAM,OAAO,QAAQ;AAGrB,UAAI,CAAC,QAAQ,CAAC,YAAY,IAAI,GAAG;AAO/B;AAAA,MACF;AAGM,YAAA,WAAW,kBAAkB,qBAAqB;AAAA,QACtD,GAAG,QAAQ,KAAK;AAAA,QAChB,GAAG,QAAQ,KAAK;AAAA,MAAA,CACjB;AAGD,YAAM,OAAO;AAAA,QACX,WAAW,QAAQ;AAAA,QACnB,GAAG,QAAQ;AAAA,MAAA;AAIb,YAAM,UAAgB;AAAA,QACpB,IAAI,IAAI;AAAA,QACR;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAIF,UAAI,WAAW;AACb,kBAAU,OAAO,OAAO;AACxB;AAAA,MACF;AAEY,kBAAA,MAAM,OAAO,OAAO,CAAC;AAAA,IACnC;AAAA,IACA,CAAC,WAAW,WAAW,OAAO,WAAW,iBAAiB;AAAA,EAAA;AAG9C,gBAAA;AAAA,IACZ,WAAW;AAAA,EAAA,CACZ;AAED,QAAM,mBAAmB;AAAA,IACvB,CAAC,KAAa,QAAgB;AAG5B,YAAM,aAAa,IAAI,KAAK,CAAC,SAAS,KAAK,QAAQ;AACnD,UAAI,CAAC,YAAY;AACf,uBAAe,KAAK,GAAG;AAAA,MACzB;AAAA,IACF;AAAA,IACA,CAAC,YAAY;AAAA,EAAA;AAGf,QAAM,gBAAgB;AAAA,IACpB,CAAC,eAA2B;AAC1B,YAAM,MAAM,QAAQ,YAAY,SAAS,OAAO;AAChD,kBAAY,GAAG;AAEE,uBAAA,SAAS,SAAS,GAAG;AACtC,sBAAgB,UAAU;AAAA,IAC5B;AAAA,IACA,CAAC,kBAAkB,aAAa;AAAA,EAAA;AAGlC,QAAM,oBAAoB;AAAA,IACxB,CAAC,YAA0B;AACzB,YAAM,MAAM,iBAAiB,SAAS,SAAS,OAAO;AACtD,kBAAY,GAAG;AAEE,uBAAA,KAAK,SAAS,OAAO;AACtC,0BAAoB,OAAO;AAAA,IAC7B;AAAA,IACA,CAAC,kBAAkB,iBAAiB;AAAA,EAAA;AAGtC,QAAM,oBAAoB;AAAA,IACxB,CAAC,YAA0B;AACzB,YAAM,MAAM,iBAAiB,SAAS,SAAS,OAAO;AACtD,kBAAY,GAAG;AAEE,uBAAA,SAAS,SAAS,GAAG;AACtC,0BAAoB,OAAO;AAAA,IAC7B;AAAA,IACA,CAAC,kBAAkB,iBAAiB;AAAA,EAAA;AAGhC,QAAA,EAAE,aAAa;AAErB,QAAM,oBAAyD,CAAC,eAC9D,aAAa,OAAO,OAAO,YAAY,QAAQ;AAEjD,QAAM,qBAAqB;AAAA,IACzB,WAAW;AAAA,MACT,MAAM,WAAW;AAAA,MACjB,QAAQ;AAAA,MACR,OAAO;AAAA,IACT;AAAA,IACA,MAAM;AAAA,IACN,aAAa;AAAA,MACX,cAAc;AAAA,IAChB;AAAA,IACA,GAAG;AAAA,EAAA;AAGL,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAC,oBAAA,QAAA,EAAO,QAAQ,WAAY,CAAA;AAAA,IAC5B;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,QACJ,KAAK;AAAA,QACL,WAAW,GAAG,QAAQ,MAAM,SAAS;AAAA,QAErC,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,eAAe;AAAA,YACf,eAAe;AAAA,YACf,WAAW;AAAA,YACX;AAAA,YACA;AAAA,YACA,UAAU,CAAC,GAAG,CAAC;AAAA,YACf,YAAU;AAAA,YACV,SAAS,CAAC,MAAM,YAAY;AAAA,YAK5B;AAAA,YACC,GAAG;AAAA,YAEH;AAAA,UAAA;AAAA,QACH;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}

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

@@ -90,8 +90,7 @@ const HvFlowBaseNode = ({
       input.isMandatory && !edgeConnected && /* @__PURE__ */ jsx("div", { className: classes.mandatory })
     ] }, input.id);
   };
-  if (!node)
-    return null;
+  if (!node) return null;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -146,8 +145,7 @@ const HvFlowBaseNode = ({
         inputs && inputs.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
           /* @__PURE__ */ jsx("div", { className: classes.inputsTitleContainer, children: /* @__PURE__ */ jsx(HvTypography, { children: labels?.inputsTitle }) }),
           /* @__PURE__ */ jsx("div", { className: classes.inputsContainer, children: inputs?.map((input, idx) => {
-            if (!isInputGroup(input))
-              return renderInput(input);
+            if (!isInputGroup(input)) return renderInput(input);
             return /* @__PURE__ */ jsxs(
               "div",
               {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseNode.js","sources":["../../../../src/Flow/Node/BaseNode.tsx"],"sourcesContent":["import { Handle, NodeProps, NodeToolbar, Position } from \"reactflow\";\nimport {\n ExtractNames,\n HvBaseProps,\n HvIconButton,\n HvTypography,\n useLabels,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvUseNodeParams, useHvNode } from \"../hooks\";\nimport {\n HvFlowNodeInput,\n HvFlowNodeInputGroup,\n HvFlowNodeOutput,\n HvFlowNodeOutputGroup,\n} from \"../types\";\nimport { staticClasses, useClasses } from \"./BaseNode.styles\";\nimport {\n isConnected,\n isInputGroup,\n isOutputGroup,\n renderedIcon,\n} from \"./utils\";\n\nexport { staticClasses as flowBaseNodeClasses };\n\nexport type HvFlowBaseNodeClasses = ExtractNames<typeof useClasses>;\n\nexport const DEFAULT_LABELS = {\n outputsTitle: \"Outputs\",\n inputsTitle: \"Inputs\",\n deleteActionLabel: \"Delete\",\n duplicateActionLabel: \"Duplicate\",\n};\n\nexport interface HvFlowBaseNodeProps<T = any>\n extends Omit<HvBaseProps, \"id\" \| \"color\">,\n Omit<HvUseNodeParams, \"id\">,\n NodeProps<T> {\n /** Header items /\n headerItems?: React.ReactNode;\n /* The content of the node footer /\n footer?: React.ReactNode;\n /* Labels used on the node. /\n labels?: Partial<typeof DEFAULT_LABELS>;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowBaseNodeClasses;\n}\n\nexport const HvFlowBaseNode = ({\n id,\n title: titleProp,\n headerItems,\n icon: iconProp,\n color: colorProp,\n inputs: inputsProp,\n outputs: outputsProp,\n nodeActions: nodeActionsProp,\n footer,\n classes: classesProp,\n labels: labelsProp,\n className,\n children,\n}: HvFlowBaseNodeProps<unknown>) => {\n const {\n toggleShowActions,\n getNodeToolbarProps,\n handleDefaultAction,\n nodeActions,\n title,\n icon,\n color,\n iconColor,\n inputEdges,\n inputs,\n outputEdges,\n outputs,\n node,\n } = useHvNode({\n id,\n title: titleProp,\n inputs: inputsProp,\n outputs: outputsProp,\n icon: iconProp,\n color: colorProp,\n labels: labelsProp,\n nodeActions: nodeActionsProp,\n });\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const { classes, cx } = useClasses(classesProp);\n\n const renderOutput = (output: HvFlowNodeOutput) => {\n const edgeConnected = isConnected(id, \"source\", output.id!, outputEdges);\n\n return (\n <div className={classes.outputContainer} key={output.id}>\n <Handle\n type=\"source\"\n isConnectableEnd={false}\n id={output.id}\n position={Position.Right}\n className={cx(classes.handle, {\n [classes.handleConnected]: edgeConnected,\n })}\n />\n {output.isMandatory && !edgeConnected && (\n <div className={classes.mandatory} />\n )}\n <HvTypography component=\"div\">{output.label}</HvTypography>\n </div>\n );\n };\n\n const renderInput = (input: HvFlowNodeInput) => {\n const edgeConnected = isConnected(id, \"target\", input.id!, inputEdges);\n\n return (\n <div className={classes.inputContainer} key={input.id}>\n <Handle\n type=\"target\"\n isConnectableStart={false}\n id={input.id}\n position={Position.Left}\n className={cx(classes.handle, {\n [classes.handleConnected]: edgeConnected,\n })}\n />\n <HvTypography component=\"div\">{input.label}</HvTypography>\n {input.isMandatory && !edgeConnected && (\n <div className={classes.mandatory} />\n )}\n </div>\n );\n };\n\n if (!node) return null;\n\n return (\n <div\n style={{\n // @ts-ignore\n \"--node-color\": color,\n }}\n className={cx(\n \"nowheel\", // Disables the default canvas pan behaviour when scrolling inside the node\n classes.root,\n className,\n )}\n onMouseEnter={toggleShowActions}\n onMouseLeave={toggleShowActions}\n >\n <NodeToolbar {...getNodeToolbarProps()}>\n {nodeActions?.map((action) => (\n <HvIconButton\n key={action.id}\n title={action.label}\n onClick={() => handleDefaultAction(action)}\n >\n {renderedIcon(action.icon)}\n </HvIconButton>\n ))}\n </NodeToolbar>\n <div className={classes.headerContainer}>\n <div\n style={{\n // @ts-ignore\n \"--icon-color\": iconColor,\n }}\n className={classes.titleContainer}\n >\n {icon}\n <HvTypography\n component=\"p\"\n variant=\"title4\"\n className={classes.title}\n >\n {title}\n </HvTypography>\n </div>\n {headerItems && <div style={{ display: \"flex\" }}>{headerItems}</div>}\n </div>\n {children && <div className={classes.contentContainer}>{children}</div>}\n {inputs && inputs.length > 0 && (\n <>\n <div className={classes.inputsTitleContainer}>\n <HvTypography>{labels?.inputsTitle}</HvTypography>\n </div>\n <div className={classes.inputsContainer}>\n {inputs?.map((input, idx) => {\n if (!isInputGroup(input)) return renderInput(input);\n\n return (\n <div\n className={classes.inputGroupContainer}\n key={`group${idx}`}\n >\n <HvTypography component=\"div\" variant=\"label\">\n {input.label}\n </HvTypography>\n {(input as HvFlowNodeInputGroup).inputs.map((inp) =>\n renderInput(inp),\n )}\n </div>\n );\n })}\n </div>\n </>\n )}\n {outputs && outputs.length > 0 && (\n <>\n <div className={classes.outputsTitleContainer}>\n <HvTypography>{labels?.outputsTitle}</HvTypography>\n </div>\n <div className={classes.outputsContainer}>\n {outputs?.map((output, idx) => {\n if (!isOutputGroup(output)) {\n return renderOutput(output);\n }\n\n return (\n <div\n className={classes.outputGroupContainer}\n key={`group${idx}`}\n >\n <HvTypography component=\"div\" variant=\"label\">\n {output.label}\n </HvTypography>\n {(output as HvFlowNodeOutputGroup).outputs.map((out) => {\n return renderOutput(out);\n })}\n </div>\n );\n })}\n </div>\n </>\n )}\n {footer && <div className={classes.footerContainer}>{footer}</div>}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"BaseNode.js","sources":["../../../../src/Flow/Node/BaseNode.tsx"],"sourcesContent":["import { Handle, NodeProps, NodeToolbar, Position } from \"reactflow\";\nimport {\n ExtractNames,\n HvBaseProps,\n HvIconButton,\n HvTypography,\n useLabels,\n} from \"@hitachivantara/uikit-react-core\";\n\nimport { HvUseNodeParams, useHvNode } from \"../hooks\";\nimport {\n HvFlowNodeInput,\n HvFlowNodeInputGroup,\n HvFlowNodeOutput,\n HvFlowNodeOutputGroup,\n} from \"../types\";\nimport { staticClasses, useClasses } from \"./BaseNode.styles\";\nimport {\n isConnected,\n isInputGroup,\n isOutputGroup,\n renderedIcon,\n} from \"./utils\";\n\nexport { staticClasses as flowBaseNodeClasses };\n\nexport type HvFlowBaseNodeClasses = ExtractNames<typeof useClasses>;\n\nexport const DEFAULT_LABELS = {\n outputsTitle: \"Outputs\",\n inputsTitle: \"Inputs\",\n deleteActionLabel: \"Delete\",\n duplicateActionLabel: \"Duplicate\",\n};\n\nexport interface HvFlowBaseNodeProps<T = any>\n extends Omit<HvBaseProps, \"id\" \| \"color\">,\n Omit<HvUseNodeParams, \"id\">,\n NodeProps<T> {\n /** Header items /\n headerItems?: React.ReactNode;\n /* The content of the node footer /\n footer?: React.ReactNode;\n /* Labels used on the node. /\n labels?: Partial<typeof DEFAULT_LABELS>;\n /* A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvFlowBaseNodeClasses;\n}\n\nexport const HvFlowBaseNode = ({\n id,\n title: titleProp,\n headerItems,\n icon: iconProp,\n color: colorProp,\n inputs: inputsProp,\n outputs: outputsProp,\n nodeActions: nodeActionsProp,\n footer,\n classes: classesProp,\n labels: labelsProp,\n className,\n children,\n}: HvFlowBaseNodeProps<unknown>) => {\n const {\n toggleShowActions,\n getNodeToolbarProps,\n handleDefaultAction,\n nodeActions,\n title,\n icon,\n color,\n iconColor,\n inputEdges,\n inputs,\n outputEdges,\n outputs,\n node,\n } = useHvNode({\n id,\n title: titleProp,\n inputs: inputsProp,\n outputs: outputsProp,\n icon: iconProp,\n color: colorProp,\n labels: labelsProp,\n nodeActions: nodeActionsProp,\n });\n\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n\n const { classes, cx } = useClasses(classesProp);\n\n const renderOutput = (output: HvFlowNodeOutput) => {\n const edgeConnected = isConnected(id, \"source\", output.id!, outputEdges);\n\n return (\n <div className={classes.outputContainer} key={output.id}>\n <Handle\n type=\"source\"\n isConnectableEnd={false}\n id={output.id}\n position={Position.Right}\n className={cx(classes.handle, {\n [classes.handleConnected]: edgeConnected,\n })}\n />\n {output.isMandatory && !edgeConnected && (\n <div className={classes.mandatory} />\n )}\n <HvTypography component=\"div\">{output.label}</HvTypography>\n </div>\n );\n };\n\n const renderInput = (input: HvFlowNodeInput) => {\n const edgeConnected = isConnected(id, \"target\", input.id!, inputEdges);\n\n return (\n <div className={classes.inputContainer} key={input.id}>\n <Handle\n type=\"target\"\n isConnectableStart={false}\n id={input.id}\n position={Position.Left}\n className={cx(classes.handle, {\n [classes.handleConnected]: edgeConnected,\n })}\n />\n <HvTypography component=\"div\">{input.label}</HvTypography>\n {input.isMandatory && !edgeConnected && (\n <div className={classes.mandatory} />\n )}\n </div>\n );\n };\n\n if (!node) return null;\n\n return (\n <div\n style={{\n // @ts-ignore\n \"--node-color\": color,\n }}\n className={cx(\n \"nowheel\", // Disables the default canvas pan behaviour when scrolling inside the node\n classes.root,\n className,\n )}\n onMouseEnter={toggleShowActions}\n onMouseLeave={toggleShowActions}\n >\n <NodeToolbar {...getNodeToolbarProps()}>\n {nodeActions?.map((action) => (\n <HvIconButton\n key={action.id}\n title={action.label}\n onClick={() => handleDefaultAction(action)}\n >\n {renderedIcon(action.icon)}\n </HvIconButton>\n ))}\n </NodeToolbar>\n <div className={classes.headerContainer}>\n <div\n style={{\n // @ts-ignore\n \"--icon-color\": iconColor,\n }}\n className={classes.titleContainer}\n >\n {icon}\n <HvTypography\n component=\"p\"\n variant=\"title4\"\n className={classes.title}\n >\n {title}\n </HvTypography>\n </div>\n {headerItems && <div style={{ display: \"flex\" }}>{headerItems}</div>}\n </div>\n {children && <div className={classes.contentContainer}>{children}</div>}\n {inputs && inputs.length > 0 && (\n <>\n <div className={classes.inputsTitleContainer}>\n <HvTypography>{labels?.inputsTitle}</HvTypography>\n </div>\n <div className={classes.inputsContainer}>\n {inputs?.map((input, idx) => {\n if (!isInputGroup(input)) return renderInput(input);\n\n return (\n <div\n className={classes.inputGroupContainer}\n key={`group${idx}`}\n >\n <HvTypography component=\"div\" variant=\"label\">\n {input.label}\n </HvTypography>\n {(input as HvFlowNodeInputGroup).inputs.map((inp) =>\n renderInput(inp),\n )}\n </div>\n );\n })}\n </div>\n </>\n )}\n {outputs && outputs.length > 0 && (\n <>\n <div className={classes.outputsTitleContainer}>\n <HvTypography>{labels?.outputsTitle}</HvTypography>\n </div>\n <div className={classes.outputsContainer}>\n {outputs?.map((output, idx) => {\n if (!isOutputGroup(output)) {\n return renderOutput(output);\n }\n\n return (\n <div\n className={classes.outputGroupContainer}\n key={`group${idx}`}\n >\n <HvTypography component=\"div\" variant=\"label\">\n {output.label}\n </HvTypography>\n {(output as HvFlowNodeOutputGroup).outputs.map((out) => {\n return renderOutput(out);\n })}\n </div>\n );\n })}\n </div>\n </>\n )}\n {footer && <div className={classes.footerContainer}>{footer}</div>}\n </div>\n );\n};\n"],"names":[],"mappings":"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"}

package/dist/esm/Flow/Node/Parameters/ParamRenderer.js CHANGED Viewed

@@ -10,8 +10,7 @@ const renderers = {
 const ParamRenderer = ({ params, data }) => {
   return /* @__PURE__ */ jsx(Fragment, { children: params.map((param, idx) => {
     const Renderer = renderers[param.type];
-    if (!Renderer)
-      return null;
+    if (!Renderer) return null;
     return /* @__PURE__ */ jsx(Renderer, { param, data }, idx);
   }) });
 };

package/dist/esm/Flow/Node/Parameters/ParamRenderer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ParamRenderer.js","sources":["../../../../../src/Flow/Node/Parameters/ParamRenderer.tsx"],"sourcesContent":["import { HvFlowNodeParam } from \"../../types\";\nimport Select from \"./Select\";\nimport Slider from \"./Slider\";\nimport Text from \"./Text\";\n\nexport type ParamRendererProps = {\n params: HvFlowNodeParam[];\n data: any;\n};\n\nconst renderers = {\n text: Text,\n select: Select,\n slider: Slider,\n};\n\nexport const ParamRenderer = ({ params, data }: ParamRendererProps) => {\n return (\n <>\n {params.map((param, idx) => {\n const Renderer = renderers[param.type];\n if (!Renderer) return null;\n\n return <Renderer key={idx} param={param} data={data} />;\n })}\n </>\n );\n};\n"],"names":[],"mappings":";;;;AAUA,MAAM,YAAY;AAAA,EAChB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AACV;AAEO,MAAM,gBAAgB,CAAC,EAAE,QAAQ,WAA+B;AACrE,SAEK,oBAAA,UAAA,EAAA,UAAA,OAAO,IAAI,CAAC,OAAO,QAAQ;AACpB,UAAA,WAAW,UAAU,MAAM,IAAI;~~AACrC~~,~~QAAI~~,CAAC~~;AAAiB~~,~~aAAA~~;AAEtB,WAAQ,oBAAA,UAAA,EAAmB,OAAc,KAAA,GAAnB,GAA+B;AAAA,EACtD,CAAA,EACH,CAAA;AAEJ;"}
1	+ {"version":3,"file":"ParamRenderer.js","sources":["../../../../../src/Flow/Node/Parameters/ParamRenderer.tsx"],"sourcesContent":["import { HvFlowNodeParam } from \"../../types\";\nimport Select from \"./Select\";\nimport Slider from \"./Slider\";\nimport Text from \"./Text\";\n\nexport type ParamRendererProps = {\n params: HvFlowNodeParam[];\n data: any;\n};\n\nconst renderers = {\n text: Text,\n select: Select,\n slider: Slider,\n};\n\nexport const ParamRenderer = ({ params, data }: ParamRendererProps) => {\n return (\n <>\n {params.map((param, idx) => {\n const Renderer = renderers[param.type];\n if (!Renderer) return null;\n\n return <Renderer key={idx} param={param} data={data} />;\n })}\n </>\n );\n};\n"],"names":[],"mappings":";;;;AAUA,MAAM,YAAY;AAAA,EAChB,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AACV;AAEO,MAAM,gBAAgB,CAAC,EAAE,QAAQ,WAA+B;AACrE,SAEK,oBAAA,UAAA,EAAA,UAAA,OAAO,IAAI,CAAC,OAAO,QAAQ;AACpB,UAAA,WAAW,UAAU,MAAM,IAAI;AACjC,QAAA,CAAC,SAAiB,QAAA;AAEtB,WAAQ,oBAAA,UAAA,EAAmB,OAAc,KAAA,GAAnB,GAA+B;AAAA,EACtD,CAAA,EACH,CAAA;AAEJ;"}

package/dist/esm/Flow/Node/Parameters/Select.js CHANGED Viewed

@@ -36,7 +36,6 @@ const Select = ({ param, data }) => {
     }
   );
 };
-const Select$1 = Select;
 export {
-  Select$1 as default
+  Select as default
 };

package/dist/esm/Flow/Node/Parameters/Select.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.js","sources":["../../../../../src/Flow/Node/Parameters/Select.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { HvDropdown, HvDropdownProps } from \"@hitachivantara/uikit-react-core\";\n\nimport { useFlowNodeUtils } from \"../../hooks\";\nimport { HvFlowNodeSelectParam } from \"../../types\";\n\ninterface SelectProps {\n param: Omit<HvFlowNodeSelectParam, \"type\">;\n data: any;\n}\n\nconst Select = ({ param, data }: SelectProps) => {\n const { id, label, multiple = false, options } = param;\n const { setNodeData } = useFlowNodeUtils();\n\n const [opts, setOpts] = useState<string[] \| undefined>(\n data[id] ? (Array.isArray(data[id]) ? data[id] : [data[id]]) : undefined,\n );\n\n const handleChange: HvDropdownProps[\"onChange\"] = (item) => {\n const newOpts = Array.isArray(item)\n ? item.map((x) => x.id as string)\n : (item?.id as string) ?? undefined;\n\n setNodeData((prev) => ({ ...prev, [id]: newOpts }));\n setOpts(\n newOpts ? (Array.isArray(newOpts) ? newOpts : [newOpts]) : undefined,\n );\n };\n\n return (\n <HvDropdown\n className=\"nodrag\" // Prevents dragging within the select field\n disablePortal\n label={label}\n values={options?.map((option) => {\n const optionId = typeof option === \"string\" ? option : option.id;\n const optionLabel = typeof option === \"string\" ? option : option.label;\n\n return {\n id: optionId,\n label: optionLabel,\n selected: !!opts?.find((opt) => opt === optionId),\n };\n })}\n onChange={handleChange}\n maxHeight={100}\n multiSelect={multiple}\n />\n );\n};\n\nexport default Select;\n"],"names":[],"mappings":";;;;AAWA,MAAM,SAAS,CAAC,EAAE,OAAO,WAAwB;AAC/C,QAAM,EAAE,IAAI,OAAO,WAAW,OAAO,QAAY,IAAA;AAC3C,QAAA,EAAE,gBAAgB;AAElB,QAAA,CAAC,MAAM,OAAO,IAAI;AAAA,IACtB,KAAK,EAAE,IAAK,MAAM,QAAQ,KAAK,EAAE,CAAC,IAAI,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,IAAK;AAAA,EAAA;AAG3D,QAAA,eAA4C,CAAC,SAAS;AAC1D,UAAM,UAAU,MAAM,QAAQ,IAAI,IAC9B,KAAK,IAAI,CAAC,MAAM,EAAE,EAAY,~~IAC7B~~,MAAM,MAAiB;~~AAEhB~~,gBAAA,CAAC,UAAU,EAAE,GAAG,MAAM,CAAC,EAAE,GAAG,QAAU,EAAA;AAClD;AAAA,MACE,UAAW,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,IAAK;AAAA,IAAA;AAAA,EAC7D;AAIA,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa;AAAA,MACb;AAAA,MACA,QAAQ,SAAS,IAAI,CAAC,WAAW;AAC/B,cAAM,WAAW,OAAO,WAAW,WAAW,SAAS,OAAO;AAC9D,cAAM,cAAc,OAAO,WAAW,WAAW,SAAS,OAAO;AAE1D,eAAA;AAAA,UACL,IAAI;AAAA,UACJ,OAAO;AAAA,UACP,UAAU,CAAC,CAAC,MAAM,KAAK,CAAC,QAAQ,QAAQ,QAAQ;AAAA,QAAA;AAAA,MAClD,CACD;AAAA,MACD,UAAU;AAAA,MACV,WAAW;AAAA,MACX,aAAa;AAAA,IAAA;AAAA,EAAA;AAGnB;~~AAEA,MAAA,WAAe;~~"}
1	+ {"version":3,"file":"Select.js","sources":["../../../../../src/Flow/Node/Parameters/Select.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { HvDropdown, HvDropdownProps } from \"@hitachivantara/uikit-react-core\";\n\nimport { useFlowNodeUtils } from \"../../hooks\";\nimport { HvFlowNodeSelectParam } from \"../../types\";\n\ninterface SelectProps {\n param: Omit<HvFlowNodeSelectParam, \"type\">;\n data: any;\n}\n\nconst Select = ({ param, data }: SelectProps) => {\n const { id, label, multiple = false, options } = param;\n const { setNodeData } = useFlowNodeUtils();\n\n const [opts, setOpts] = useState<string[] \| undefined>(\n data[id] ? (Array.isArray(data[id]) ? data[id] : [data[id]]) : undefined,\n );\n\n const handleChange: HvDropdownProps[\"onChange\"] = (item) => {\n const newOpts = Array.isArray(item)\n ? item.map((x) => x.id as string)\n : ((item?.id as string) ?? undefined);\n\n setNodeData((prev) => ({ ...prev, [id]: newOpts }));\n setOpts(\n newOpts ? (Array.isArray(newOpts) ? newOpts : [newOpts]) : undefined,\n );\n };\n\n return (\n <HvDropdown\n className=\"nodrag\" // Prevents dragging within the select field\n disablePortal\n label={label}\n values={options?.map((option) => {\n const optionId = typeof option === \"string\" ? option : option.id;\n const optionLabel = typeof option === \"string\" ? option : option.label;\n\n return {\n id: optionId,\n label: optionLabel,\n selected: !!opts?.find((opt) => opt === optionId),\n };\n })}\n onChange={handleChange}\n maxHeight={100}\n multiSelect={multiple}\n />\n );\n};\n\nexport default Select;\n"],"names":[],"mappings":";;;;AAWA,MAAM,SAAS,CAAC,EAAE,OAAO,WAAwB;AAC/C,QAAM,EAAE,IAAI,OAAO,WAAW,OAAO,QAAY,IAAA;AAC3C,QAAA,EAAE,gBAAgB;AAElB,QAAA,CAAC,MAAM,OAAO,IAAI;AAAA,IACtB,KAAK,EAAE,IAAK,MAAM,QAAQ,KAAK,EAAE,CAAC,IAAI,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,CAAC,IAAK;AAAA,EAAA;AAG3D,QAAA,eAA4C,CAAC,SAAS;AAC1D,UAAM,UAAU,MAAM,QAAQ,IAAI,IAC9B,KAAK,IAAI,CAAC,MAAM,EAAE,EAAY,IAC5B,MAAM,MAAiB;AAEjB,gBAAA,CAAC,UAAU,EAAE,GAAG,MAAM,CAAC,EAAE,GAAG,QAAU,EAAA;AAClD;AAAA,MACE,UAAW,MAAM,QAAQ,OAAO,IAAI,UAAU,CAAC,OAAO,IAAK;AAAA,IAAA;AAAA,EAC7D;AAIA,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAa;AAAA,MACb;AAAA,MACA,QAAQ,SAAS,IAAI,CAAC,WAAW;AAC/B,cAAM,WAAW,OAAO,WAAW,WAAW,SAAS,OAAO;AAC9D,cAAM,cAAc,OAAO,WAAW,WAAW,SAAS,OAAO;AAE1D,eAAA;AAAA,UACL,IAAI;AAAA,UACJ,OAAO;AAAA,UACP,UAAU,CAAC,CAAC,MAAM,KAAK,CAAC,QAAQ,QAAQ,QAAQ;AAAA,QAAA;AAAA,MAClD,CACD;AAAA,MACD,UAAU;AAAA,MACV,WAAW;AAAA,MACX,aAAa;AAAA,IAAA;AAAA,EAAA;AAGnB;"}

package/dist/esm/Flow/Node/Parameters/Slider.js CHANGED Viewed

@@ -28,7 +28,6 @@ const Slider = ({ param, data }) => {
     }
   );
 };
-const Slider$1 = Slider;
 export {
-  Slider$1 as default
+  Slider as default
 };

package/dist/esm/Flow/Node/Parameters/Slider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.js","sources":["../../../../../src/Flow/Node/Parameters/Slider.tsx"],"sourcesContent":["import { css } from \"@emotion/css\";\nimport { HvSlider } from \"@hitachivantara/uikit-react-core\";\n\nimport { useFlowNodeUtils } from \"../../hooks\";\nimport { HvFlowNodeSliderParam } from \"../../types\";\n\ninterface SliderProps {\n param: Omit<HvFlowNodeSliderParam, \"type\">;\n data: any;\n}\n\nconst classes = {\n labelContainer: css({\n marginRight: 0,\n marginLeft: 0,\n }),\n sliderBase: css({\n padding: 0,\n }),\n};\n\nconst Slider = ({ param, data }: SliderProps) => {\n const { id } = param;\n const { setNodeData } = useFlowNodeUtils();\n\n return (\n <HvSlider\n className=\"nodrag\" // Prevents dragging within the input field\n defaultValues={data[id]}\n onChange={(val) => setNodeData((prev) => ({ ...prev, [id]: val }))}\n classes={{\n labelContainer: classes.labelContainer,\n sliderBase: classes.sliderBase,\n }}\n {...param}\n />\n );\n};\n\nexport default Slider;\n"],"names":[],"mappings":";;;;AAWA,MAAM,UAAU;AAAA,EACd,gBAAgB,IAAI;AAAA,IAClB,aAAa;AAAA,IACb,YAAY;AAAA,EAAA,CACb;AAAA,EACD,YAAY,IAAI;AAAA,IACd,SAAS;AAAA,EAAA,CACV;AACH;AAEA,MAAM,SAAS,CAAC,EAAE,OAAO,WAAwB;AACzC,QAAA,EAAE,GAAO,IAAA;AACT,QAAA,EAAE,gBAAgB;AAGtB,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAe,KAAK,EAAE;AAAA,MACtB,UAAU,CAAC,QAAQ,YAAY,CAAC,UAAU,EAAE,GAAG,MAAM,CAAC,EAAE,GAAG,MAAM;AAAA,MACjE,SAAS;AAAA,QACP,gBAAgB,QAAQ;AAAA,QACxB,YAAY,QAAQ;AAAA,MACtB;AAAA,MACC,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;~~AAEA,MAAA,WAAe;~~"}
1	+ {"version":3,"file":"Slider.js","sources":["../../../../../src/Flow/Node/Parameters/Slider.tsx"],"sourcesContent":["import { css } from \"@emotion/css\";\nimport { HvSlider } from \"@hitachivantara/uikit-react-core\";\n\nimport { useFlowNodeUtils } from \"../../hooks\";\nimport { HvFlowNodeSliderParam } from \"../../types\";\n\ninterface SliderProps {\n param: Omit<HvFlowNodeSliderParam, \"type\">;\n data: any;\n}\n\nconst classes = {\n labelContainer: css({\n marginRight: 0,\n marginLeft: 0,\n }),\n sliderBase: css({\n padding: 0,\n }),\n};\n\nconst Slider = ({ param, data }: SliderProps) => {\n const { id } = param;\n const { setNodeData } = useFlowNodeUtils();\n\n return (\n <HvSlider\n className=\"nodrag\" // Prevents dragging within the input field\n defaultValues={data[id]}\n onChange={(val) => setNodeData((prev) => ({ ...prev, [id]: val }))}\n classes={{\n labelContainer: classes.labelContainer,\n sliderBase: classes.sliderBase,\n }}\n {...param}\n />\n );\n};\n\nexport default Slider;\n"],"names":[],"mappings":";;;;AAWA,MAAM,UAAU;AAAA,EACd,gBAAgB,IAAI;AAAA,IAClB,aAAa;AAAA,IACb,YAAY;AAAA,EAAA,CACb;AAAA,EACD,YAAY,IAAI;AAAA,IACd,SAAS;AAAA,EAAA,CACV;AACH;AAEA,MAAM,SAAS,CAAC,EAAE,OAAO,WAAwB;AACzC,QAAA,EAAE,GAAO,IAAA;AACT,QAAA,EAAE,gBAAgB;AAGtB,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAe,KAAK,EAAE;AAAA,MACtB,UAAU,CAAC,QAAQ,YAAY,CAAC,UAAU,EAAE,GAAG,MAAM,CAAC,EAAE,GAAG,MAAM;AAAA,MACjE,SAAS;AAAA,QACP,gBAAgB,QAAQ;AAAA,QACxB,YAAY,QAAQ;AAAA,MACtB;AAAA,MACC,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/esm/Flow/Node/Parameters/Text.js CHANGED Viewed

@@ -14,7 +14,6 @@ const Text = ({ param, data }) => {
     }
   );
 };
-const Text$1 = Text;
 export {
-  Text$1 as default
+  Text as default
 };