@hitachivantara/uikit-react-lab 5.39.0 → 5.40.0

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 (8) hide show
  1. package/dist/cjs/Flow/Flow.styles.cjs +1 -0
  2. package/dist/cjs/Flow/Node/BaseNode.cjs +13 -8
  3. package/dist/esm/Flow/Flow.styles.js +1 -0
  4. package/dist/esm/Flow/Flow.styles.js.map +1 -1
  5. package/dist/esm/Flow/Node/BaseNode.js +13 -8
  6. package/dist/esm/Flow/Node/BaseNode.js.map +1 -1
  7. package/dist/types/index.d.ts +37 -35
  8. package/package.json +6 -5
package/dist/cjs/Flow/Flow.styles.cjs CHANGED
@@ -4,6 +4,7 @@ const uikitReactCore = require("@hitachivantara/uikit-react-core");
4
4
  const BaseNode_styles = require("./Node/BaseNode.styles.cjs");
5
5
  require("react/jsx-runtime");
6
6
  require("reactflow");
7
+ require("@hitachivantara/uikit-react-utils");
7
8
  const { staticClasses, useClasses } = uikitReactCore.createClasses("HvFlow", {
8
9
  root: {
9
10
  height: "100%",
package/dist/cjs/Flow/Node/BaseNode.cjs CHANGED
@@ -3,6 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
3
  const jsxRuntime = require("react/jsx-runtime");
4
4
  const ReactFlow = require("reactflow");
5
5
  const uikitReactCore = require("@hitachivantara/uikit-react-core");
6
+ const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
6
7
  const BaseNode_styles = require("./BaseNode.styles.cjs");
7
8
  const utils = require("./utils.cjs");
8
9
  const useNode = require("../hooks/useNode.cjs");
@@ -95,10 +96,12 @@ const HvFlowBaseNode = ({
95
96
  return /* @__PURE__ */ jsxRuntime.jsxs(
96
97
  "div",
97
98
  {
98
- style: {
99
- // @ts-ignore
100
- "--node-color": color
101
- },
99
+ style: uikitReactUtils.mergeStyles(
100
+ {},
101
+ {
102
+ "--node-color": color
103
+ }
104
+ ),
102
105
  className: cx(
103
106
  "nowheel",
104
107
  // Disables the default canvas pan behaviour when scrolling inside the node
@@ -121,10 +124,12 @@ const HvFlowBaseNode = ({
121
124
  /* @__PURE__ */ jsxRuntime.jsxs(
122
125
  "div",
123
126
  {
124
- style: {
125
- // @ts-ignore
126
- "--icon-color": iconColor
127
- },
127
+ style: uikitReactUtils.mergeStyles(
128
+ {},
129
+ {
130
+ "--icon-color": iconColor
131
+ }
132
+ ),
128
133
  className: classes.titleContainer,
129
134
  children: [
130
135
  icon,
package/dist/esm/Flow/Flow.styles.js CHANGED
@@ -2,6 +2,7 @@ import { createClasses, theme } from "@hitachivantara/uikit-react-core";
2
2
  import { staticClasses as staticClasses$1 } from "./Node/BaseNode.styles.js";
3
3
  import "react/jsx-runtime";
4
4
  import "reactflow";
5
+ import "@hitachivantara/uikit-react-utils";
5
6
  const { staticClasses, useClasses } = createClasses("HvFlow", {
6
7
  root: {
7
8
  height: "100%",
package/dist/esm/Flow/Flow.styles.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Flow.styles.js","sources":["../../../src/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 [`& .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":["flowBaseNodeClasses"],"mappings":";;;;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,UAAU;AAAA,EACnE,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,CAAC,kBAAkBA,gBAAoB,IAAI,EAAE,GAAG;AAAA,MAC9C,QAAQ,aAAa,MAAM,OAAO,YAAY;AAAA,MAC9C,cAAc,MAAM,MAAM;AAAA,MAC1B,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;"}
1
+ {"version":3,"file":"Flow.styles.js","sources":["../../../src/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 [`& .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":["flowBaseNodeClasses"],"mappings":";;;;;AAIO,MAAM,EAAE,eAAe,eAAe,cAAc,UAAU;AAAA,EACnE,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,CAAC,kBAAkBA,gBAAoB,IAAI,EAAE,GAAG;AAAA,MAC9C,QAAQ,aAAa,MAAM,OAAO,YAAY;AAAA,MAC9C,cAAc,MAAM,MAAM;AAAA,MAC1B,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;"}
package/dist/esm/Flow/Node/BaseNode.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { jsxs, jsx, Fragment } from "react/jsx-runtime";
2
2
  import { NodeToolbar, Handle, Position } from "reactflow";
3
3
  import { useLabels, HvIconButton, HvTypography } from "@hitachivantara/uikit-react-core";
4
+ import { mergeStyles } from "@hitachivantara/uikit-react-utils";
4
5
  import { useClasses } from "./BaseNode.styles.js";
5
6
  import { staticClasses } from "./BaseNode.styles.js";
6
7
  import { renderedIcon, isInputGroup, isOutputGroup, isConnected } from "./utils.js";
@@ -94,10 +95,12 @@ const HvFlowBaseNode = ({
94
95
  return /* @__PURE__ */ jsxs(
95
96
  "div",
96
97
  {
97
- style: {
98
- // @ts-ignore
99
- "--node-color": color
100
- },
98
+ style: mergeStyles(
99
+ {},
100
+ {
101
+ "--node-color": color
102
+ }
103
+ ),
101
104
  className: cx(
102
105
  "nowheel",
103
106
  // Disables the default canvas pan behaviour when scrolling inside the node
@@ -120,10 +123,12 @@ const HvFlowBaseNode = ({
120
123
  /* @__PURE__ */ jsxs(
121
124
  "div",
122
125
  {
123
- style: {
124
- // @ts-ignore
125
- "--icon-color": iconColor
126
- },
126
+ style: mergeStyles(
127
+ {},
128
+ {
129
+ "--icon-color": iconColor
130
+ }
131
+ ),
127
132
  className: classes.titleContainer,
128
133
  children: [
129
134
  icon,
package/dist/esm/Flow/Node/BaseNode.js.map CHANGED
@@ -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\";\nimport { mergeStyles } from \"@hitachivantara/uikit-react-utils\";\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={mergeStyles(\n {},\n {\n \"--node-color\": color,\n },\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={mergeStyles(\n {},\n {\n \"--icon-color\": iconColor,\n },\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/types/index.d.ts CHANGED
@@ -33,6 +33,7 @@ import { HvSize } from '@hitachivantara/uikit-react-core';
33
33
  import { HvSliderProps } from '@hitachivantara/uikit-react-core';
34
34
  import { HvTypographyVariants } from '@hitachivantara/uikit-react-core';
35
35
  import { JSX as JSX_2 } from 'react/jsx-runtime';
36
+ import { JSXElementConstructor } from 'react';
36
37
  import { KeyboardEventHandler } from 'react';
37
38
  import { MiniMapProps } from 'reactflow';
38
39
  import { MouseEventHandler } from 'react';
@@ -42,6 +43,7 @@ import { NodeToolbarProps } from 'reactflow';
42
43
  import { PanelPosition } from 'reactflow';
43
44
  import { PointerEventHandler } from 'react';
44
45
  import { Position } from 'reactflow';
46
+ import { ReactElement } from 'react';
45
47
  import { ReactEventHandler } from 'react';
46
48
  import { ReactFlowInstance } from 'reactflow';
47
49
  import { ReactFlowProps } from 'reactflow';
@@ -119,8 +121,8 @@ export declare const flowBaseNodeClasses: {
119
121
  titleContainer: "HvFlowBaseNode-titleContainer";
120
122
  mandatory: "HvFlowBaseNode-mandatory";
121
123
  footerContainer: "HvFlowBaseNode-footerContainer";
122
- inputContainer: "HvFlowBaseNode-inputContainer";
123
124
  handle: "HvFlowBaseNode-handle";
125
+ inputContainer: "HvFlowBaseNode-inputContainer";
124
126
  headerContainer: "HvFlowBaseNode-headerContainer";
125
127
  inputsTitleContainer: "HvFlowBaseNode-inputsTitleContainer";
126
128
  outputsTitleContainer: "HvFlowBaseNode-outputsTitleContainer";
@@ -146,10 +148,11 @@ export declare const flowNodeClasses: {
146
148
  title: "HvFlowNode-title";
147
149
  titleContainer: "HvFlowNode-titleContainer";
148
150
  mandatory: "HvFlowNode-mandatory";
151
+ subtitle: "HvFlowNode-subtitle";
149
152
  actions: "HvFlowNode-actions";
150
153
  footerContainer: "HvFlowNode-footerContainer";
151
- inputContainer: "HvFlowNode-inputContainer";
152
154
  handle: "HvFlowNode-handle";
155
+ inputContainer: "HvFlowNode-inputContainer";
153
156
  headerContainer: "HvFlowNode-headerContainer";
154
157
  inputsTitleContainer: "HvFlowNode-inputsTitleContainer";
155
158
  outputsTitleContainer: "HvFlowNode-outputsTitleContainer";
@@ -160,7 +163,6 @@ export declare const flowNodeClasses: {
160
163
  outputGroupContainer: "HvFlowNode-outputGroupContainer";
161
164
  outputContainer: "HvFlowNode-outputContainer";
162
165
  handleConnected: "HvFlowNode-handleConnected";
163
- subtitle: "HvFlowNode-subtitle";
164
166
  subtitleContainer: "HvFlowNode-subtitleContainer";
165
167
  inlineEditRoot: "HvFlowNode-inlineEditRoot";
166
168
  inlineEditButton: "HvFlowNode-inlineEditButton";
@@ -336,11 +338,12 @@ export declare const hvDashboardNodeClasses: {
336
338
  title: "HvDashboardNode-title";
337
339
  titleContainer: "HvDashboardNode-titleContainer";
338
340
  mandatory: "HvDashboardNode-mandatory";
339
- empty: "HvDashboardNode-empty";
341
+ subtitle: "HvDashboardNode-subtitle";
340
342
  actions: "HvDashboardNode-actions";
343
+ empty: "HvDashboardNode-empty";
341
344
  footerContainer: "HvDashboardNode-footerContainer";
342
- inputContainer: "HvDashboardNode-inputContainer";
343
345
  handle: "HvDashboardNode-handle";
346
+ inputContainer: "HvDashboardNode-inputContainer";
344
347
  headerContainer: "HvDashboardNode-headerContainer";
345
348
  inputsTitleContainer: "HvDashboardNode-inputsTitleContainer";
346
349
  outputsTitleContainer: "HvDashboardNode-outputsTitleContainer";
@@ -351,7 +354,6 @@ export declare const hvDashboardNodeClasses: {
351
354
  outputGroupContainer: "HvDashboardNode-outputGroupContainer";
352
355
  outputContainer: "HvDashboardNode-outputContainer";
353
356
  handleConnected: "HvDashboardNode-handleConnected";
354
- subtitle: "HvDashboardNode-subtitle";
355
357
  subtitleContainer: "HvDashboardNode-subtitleContainer";
356
358
  inlineEditRoot: "HvDashboardNode-inlineEditRoot";
357
359
  inlineEditButton: "HvDashboardNode-inlineEditButton";
@@ -1050,15 +1052,15 @@ declare const useClasses_6: (classesProp?: Partial<Record<"titleContainer" | "de
1050
1052
  cx: (...args: any) => string;
1051
1053
  };
1052
1054
 
1053
- declare const useClasses_7: (classesProp?: Partial<Record<"root" | "title" | "titleContainer" | "mandatory" | "footerContainer" | "inputContainer" | "handle" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "inputGroupContainer" | "outputGroupContainer" | "outputContainer" | "handleConnected", string>>, addStatic?: boolean) => {
1055
+ declare const useClasses_7: (classesProp?: Partial<Record<"root" | "title" | "titleContainer" | "mandatory" | "footerContainer" | "handle" | "inputContainer" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "inputGroupContainer" | "outputGroupContainer" | "outputContainer" | "handleConnected", string>>, addStatic?: boolean) => {
1054
1056
  classes: {
1055
1057
  root: string;
1056
1058
  title: string;
1057
1059
  titleContainer: string;
1058
1060
  mandatory: string;
1059
1061
  footerContainer: string;
1060
- inputContainer: string;
1061
1062
  handle: string;
1063
+ inputContainer: string;
1062
1064
  headerContainer: string;
1063
1065
  inputsTitleContainer: string;
1064
1066
  outputsTitleContainer: string;
@@ -1074,16 +1076,17 @@ declare const useClasses_7: (classesProp?: Partial<Record<"root" | "title" | "ti
1074
1076
  cx: (...args: any) => string;
1075
1077
  };
1076
1078
 
1077
- declare const useClasses_8: (classesProp?: Partial<Record<"root" | "title" | "titleContainer" | "mandatory" | "actions" | "footerContainer" | "inputContainer" | "handle" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "inputGroupContainer" | "outputGroupContainer" | "outputContainer" | "handleConnected" | "subtitle" | "subtitleContainer" | "inlineEditRoot" | "inlineEditButton" | "actionsButton" | "paramsContainer", string>>, addStatic?: boolean) => {
1079
+ declare const useClasses_8: (classesProp?: Partial<Record<"root" | "title" | "titleContainer" | "mandatory" | "subtitle" | "actions" | "footerContainer" | "handle" | "inputContainer" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "inputGroupContainer" | "outputGroupContainer" | "outputContainer" | "handleConnected" | "subtitleContainer" | "inlineEditRoot" | "inlineEditButton" | "actionsButton" | "paramsContainer", string>>, addStatic?: boolean) => {
1078
1080
  classes: {
1079
1081
  root: string;
1080
1082
  title: string;
1081
1083
  titleContainer: string;
1082
1084
  mandatory: string;
1085
+ subtitle: string;
1083
1086
  actions: string;
1084
1087
  footerContainer: string;
1085
- inputContainer: string;
1086
1088
  handle: string;
1089
+ inputContainer: string;
1087
1090
  headerContainer: string;
1088
1091
  inputsTitleContainer: string;
1089
1092
  outputsTitleContainer: string;
@@ -1094,7 +1097,6 @@ declare const useClasses_8: (classesProp?: Partial<Record<"root" | "title" | "ti
1094
1097
  outputGroupContainer: string;
1095
1098
  outputContainer: string;
1096
1099
  handleConnected: string;
1097
- subtitle: string;
1098
1100
  subtitleContainer: string;
1099
1101
  inlineEditRoot: string;
1100
1102
  inlineEditButton: string;
@@ -1105,17 +1107,18 @@ declare const useClasses_8: (classesProp?: Partial<Record<"root" | "title" | "ti
1105
1107
  cx: (...args: any) => string;
1106
1108
  };
1107
1109
 
1108
- declare const useClasses_9: (classesProp?: Partial<Record<"root" | "title" | "titleContainer" | "mandatory" | "empty" | "actions" | "footerContainer" | "inputContainer" | "handle" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "inputGroupContainer" | "outputGroupContainer" | "outputContainer" | "handleConnected" | "subtitle" | "subtitleContainer" | "inlineEditRoot" | "inlineEditButton" | "actionsButton" | "paramsContainer", string>>, addStatic?: boolean) => {
1110
+ declare const useClasses_9: (classesProp?: Partial<Record<"root" | "title" | "titleContainer" | "mandatory" | "subtitle" | "actions" | "empty" | "footerContainer" | "handle" | "inputContainer" | "headerContainer" | "inputsTitleContainer" | "outputsTitleContainer" | "contentContainer" | "inputsContainer" | "outputsContainer" | "inputGroupContainer" | "outputGroupContainer" | "outputContainer" | "handleConnected" | "subtitleContainer" | "inlineEditRoot" | "inlineEditButton" | "actionsButton" | "paramsContainer", string>>, addStatic?: boolean) => {
1109
1111
  classes: {
1110
1112
  root: string;
1111
1113
  title: string;
1112
1114
  titleContainer: string;
1113
1115
  mandatory: string;
1114
- empty: string;
1116
+ subtitle: string;
1115
1117
  actions: string;
1118
+ empty: string;
1116
1119
  footerContainer: string;
1117
- inputContainer: string;
1118
1120
  handle: string;
1121
+ inputContainer: string;
1119
1122
  headerContainer: string;
1120
1123
  inputsTitleContainer: string;
1121
1124
  outputsTitleContainer: string;
@@ -1126,7 +1129,6 @@ declare const useClasses_9: (classesProp?: Partial<Record<"root" | "title" | "ti
1126
1129
  outputGroupContainer: string;
1127
1130
  outputContainer: string;
1128
1131
  handleConnected: string;
1129
- subtitle: string;
1130
1132
  subtitleContainer: string;
1131
1133
  inlineEditRoot: string;
1132
1134
  inlineEditButton: string;
@@ -1176,24 +1178,24 @@ export declare function useFlowOutputNodes<T = any>(id?: string): Node_2<T>[];
1176
1178
  export declare function useHvNode(props: HvUseNodeParams): {
1177
1179
  id: string;
1178
1180
  title: string | undefined;
1179
- icon: ReactNode;
1181
+ icon: string | number | boolean | ReactElement<any, string | JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined;
1180
1182
  color: string | undefined;
1181
1183
  iconColor: string | undefined;
1182
1184
  subtitle: any;
1183
1185
  inputs: (HvFlowNodeInput | HvFlowNodeOutput | {
1184
1186
  inputs: HvFlowNodeInput[];
1185
- label: React.ReactNode;
1187
+ label: ReactNode;
1186
1188
  } | {
1187
1189
  outputs: HvFlowNodeOutput[];
1188
- label: React.ReactNode;
1190
+ label: ReactNode;
1189
1191
  })[] | undefined;
1190
1192
  inputEdges: Edge[];
1191
1193
  outputs: (HvFlowNodeInput | HvFlowNodeOutput | {
1192
1194
  inputs: HvFlowNodeInput[];
1193
- label: React.ReactNode;
1195
+ label: ReactNode;
1194
1196
  } | {
1195
1197
  outputs: HvFlowNodeOutput[];
1196
- label: React.ReactNode;
1198
+ label: ReactNode;
1197
1199
  })[] | undefined;
1198
1200
  outputEdges: Edge[];
1199
1201
  node: Node_2 | undefined;
@@ -1208,7 +1210,7 @@ export declare function useHvNode(props: HvUseNodeParams): {
1208
1210
  accessKey?: string | undefined;
1209
1211
  autoFocus?: boolean | undefined;
1210
1212
  className?: string | undefined;
1211
- contentEditable?: (boolean | "false" | "true") | "inherit" | "plaintext-only" | undefined;
1213
+ contentEditable?: "inherit" | (boolean | "false" | "true") | "plaintext-only" | undefined;
1212
1214
  contextMenu?: string | undefined;
1213
1215
  dir?: string | undefined;
1214
1216
  draggable?: (boolean | "false" | "true") | undefined;
@@ -1221,7 +1223,7 @@ export declare function useHvNode(props: HvUseNodeParams): {
1221
1223
  style?: CSSProperties | undefined;
1222
1224
  tabIndex?: number | undefined;
1223
1225
  title?: string | undefined;
1224
- translate?: "yes" | "no" | undefined;
1226
+ translate?: "no" | "yes" | undefined;
1225
1227
  radioGroup?: string | undefined;
1226
1228
  role?: AriaRole | undefined;
1227
1229
  about?: string | undefined;
@@ -1247,32 +1249,32 @@ export declare function useHvNode(props: HvUseNodeParams): {
1247
1249
  results?: number | undefined;
1248
1250
  security?: string | undefined;
1249
1251
  unselectable?: "on" | "off" | undefined;
1250
- inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
1252
+ inputMode?: "none" | "text" | "search" | "email" | "tel" | "url" | "numeric" | "decimal" | undefined;
1251
1253
  is?: string | undefined;
1252
1254
  children?: ReactNode;
1253
1255
  "aria-activedescendant"?: string | undefined;
1254
1256
  "aria-atomic"?: (boolean | "false" | "true") | undefined;
1255
- "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
1257
+ "aria-autocomplete"?: "none" | "list" | "both" | "inline" | undefined;
1256
1258
  "aria-braillelabel"?: string | undefined;
1257
1259
  "aria-brailleroledescription"?: string | undefined;
1258
1260
  "aria-busy"?: (boolean | "false" | "true") | undefined;
1259
- "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
1261
+ "aria-checked"?: boolean | "mixed" | "false" | "true" | undefined;
1260
1262
  "aria-colcount"?: number | undefined;
1261
1263
  "aria-colindex"?: number | undefined;
1262
1264
  "aria-colindextext"?: string | undefined;
1263
1265
  "aria-colspan"?: number | undefined;
1264
1266
  "aria-controls"?: string | undefined;
1265
- "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
1267
+ "aria-current"?: boolean | "page" | "step" | "false" | "true" | "time" | "date" | "location" | undefined;
1266
1268
  "aria-describedby"?: string | undefined;
1267
1269
  "aria-description"?: string | undefined;
1268
1270
  "aria-details"?: string | undefined;
1269
1271
  "aria-disabled"?: (boolean | "false" | "true") | undefined;
1270
- "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
1272
+ "aria-dropeffect"?: "none" | "link" | "copy" | "move" | "popup" | "execute" | undefined;
1271
1273
  "aria-errormessage"?: string | undefined;
1272
1274
  "aria-expanded"?: (boolean | "false" | "true") | undefined;
1273
1275
  "aria-flowto"?: string | undefined;
1274
1276
  "aria-grabbed"?: (boolean | "false" | "true") | undefined;
1275
- "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
1277
+ "aria-haspopup"?: boolean | "grid" | "menu" | "listbox" | "false" | "true" | "dialog" | "tree" | undefined;
1276
1278
  "aria-hidden"?: (boolean | "false" | "true") | undefined;
1277
1279
  "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
1278
1280
  "aria-keyshortcuts"?: string | undefined;
@@ -1283,13 +1285,13 @@ export declare function useHvNode(props: HvUseNodeParams): {
1283
1285
  "aria-modal"?: (boolean | "false" | "true") | undefined;
1284
1286
  "aria-multiline"?: (boolean | "false" | "true") | undefined;
1285
1287
  "aria-multiselectable"?: (boolean | "false" | "true") | undefined;
1286
- "aria-orientation"?: "horizontal" | "vertical" | undefined;
1288
+ "aria-orientation"?: "vertical" | "horizontal" | undefined;
1287
1289
  "aria-owns"?: string | undefined;
1288
1290
  "aria-placeholder"?: string | undefined;
1289
1291
  "aria-posinset"?: number | undefined;
1290
- "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
1292
+ "aria-pressed"?: boolean | "mixed" | "false" | "true" | undefined;
1291
1293
  "aria-readonly"?: (boolean | "false" | "true") | undefined;
1292
- "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
1294
+ "aria-relevant"?: "all" | "text" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
1293
1295
  "aria-required"?: (boolean | "false" | "true") | undefined;
1294
1296
  "aria-roledescription"?: string | undefined;
1295
1297
  "aria-rowcount"?: number | undefined;
@@ -1466,16 +1468,16 @@ export declare function useHvNode(props: HvUseNodeParams): {
1466
1468
  onAnimationIterationCapture?: AnimationEventHandler<HTMLDivElement> | undefined;
1467
1469
  onTransitionEnd?: TransitionEventHandler<HTMLDivElement> | undefined;
1468
1470
  onTransitionEndCapture?: TransitionEventHandler<HTMLDivElement> | undefined;
1469
- nodeId?: string | string[];
1471
+ nodeId?: string | string[] | undefined;
1470
1472
  isVisible: boolean;
1471
- position?: Position;
1473
+ position?: Position | undefined;
1472
1474
  offset: number;
1473
- align?: Align;
1475
+ align?: Align | undefined;
1474
1476
  };
1475
1477
  toggleShowActions: () => void;
1476
1478
  handleDefaultAction: (action: HvFlowNodeAction) => void;
1477
1479
  setNodeData: (setNewData: (newData?: any) => any) => void;
1478
- setNodeParent: (node?: Node_2<any>, extent?: "parent" | CoordinateExtent) => void;
1480
+ setNodeParent: (node?: Node_2<any> | undefined, extent?: CoordinateExtent | "parent" | undefined) => void;
1479
1481
  };
1480
1482
 
1481
1483
  export declare function useNodeMetaRegistry(): {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hitachivantara/uikit-react-lab",
3
- "version": "5.39.0",
3
+ "version": "5.40.0",
4
4
  "private": false,
5
5
  "author": "Hitachi Vantara UI Kit Team",
6
6
  "description": "Contributed React components for the NEXT UI Kit.",
@@ -33,9 +33,10 @@
33
33
  "@dnd-kit/core": "^6.1.0",
34
34
  "@dnd-kit/modifiers": "^6.0.1",
35
35
  "@emotion/css": "^11.11.0",
36
- "@hitachivantara/uikit-react-core": "^5.69.0",
37
- "@hitachivantara/uikit-react-icons": "^5.10.9",
38
- "@hitachivantara/uikit-styles": "^5.32.1",
36
+ "@hitachivantara/uikit-react-core": "^5.70.0",
37
+ "@hitachivantara/uikit-react-icons": "^5.10.10",
38
+ "@hitachivantara/uikit-react-utils": "^0.2.2",
39
+ "@hitachivantara/uikit-styles": "^5.33.0",
39
40
  "@mui/base": "^5.0.0-beta.40",
40
41
  "@types/react-grid-layout": "^1.3.5",
41
42
  "react-grid-layout": "^1.4.4",
@@ -51,7 +52,7 @@
51
52
  "access": "public",
52
53
  "directory": "package"
53
54
  },
54
- "gitHead": "12e14ff262d62992cf3b833a4dd4cdac07541d51",
55
+ "gitHead": "43f1456d5a748ec8fc9fe27972459cfa3d0f4416",
55
56
  "exports": {
56
57
  ".": {
57
58
  "types": "./dist/types/index.d.ts",