udp-react-enterprise-component-library 1.0.5-beta.2 → 1.0.6

package/dist-tsdown/WorkflowContainer-Bm1FHgJq.cjs

@@ -1,1718 +0,0 @@
-const require_chunk = require('./chunk-CsX-DzYB.cjs');
-const require_SideSheet = require('./SideSheet-XOQ0yjmY.cjs');
-const require_EnvironmentRibbon = require('./EnvironmentRibbon-C5I-zJ7u.cjs');
-const require_UtilitySideBar = require('./UtilitySideBar-C-5lGIvy.cjs');
-const require_PageContainer = require('./PageContainer-BG6v3pM7.cjs');
-const react = require_chunk.__toESM(require("react"));
-const __material_ui_core = require_chunk.__toESM(require("@material-ui/core"));
-const react_jsx_runtime = require_chunk.__toESM(require("react/jsx-runtime"));
-const udp_react_stencil_component_library = require_chunk.__toESM(require("udp-react-stencil-component-library"));
-const react_router_dom = require_chunk.__toESM(require("react-router-dom"));
-const luxon = require_chunk.__toESM(require("luxon"));
-const __material_ui_lab_Autocomplete = require_chunk.__toESM(require("@material-ui/lab/Autocomplete"));
-const clsx = require_chunk.__toESM(require("clsx"));
-const __fluentui_react_icons = require_chunk.__toESM(require("@fluentui/react-icons"));
-const lodash = require_chunk.__toESM(require("lodash"));
-const react_i18next = require_chunk.__toESM(require("react-i18next"));
-const zustand = require_chunk.__toESM(require("zustand"));
-const zustand_middleware = require_chunk.__toESM(require("zustand/middleware"));
-const __material_ui_core_styles = require_chunk.__toESM(require("@material-ui/core/styles"));
-const react_dnd = require_chunk.__toESM(require("react-dnd"));
-const react_dnd_html5_backend = require_chunk.__toESM(require("react-dnd-html5-backend"));
-const __material_ui_lab_TreeView = require_chunk.__toESM(require("@material-ui/lab/TreeView"));
-const __material_ui_lab_TreeItem = require_chunk.__toESM(require("@material-ui/lab/TreeItem"));
-const __material_ui_icons_CheckCircle = require_chunk.__toESM(require("@material-ui/icons/CheckCircle"));
-const __material_ui_icons_RadioButtonUnchecked = require_chunk.__toESM(require("@material-ui/icons/RadioButtonUnchecked"));
-const __material_ui_icons_RadioButtonChecked = require_chunk.__toESM(require("@material-ui/icons/RadioButtonChecked"));
-const src_assets_images_phone_png = require_chunk.__toESM(require("./assets/images/phone.png"));
-const react_html_parser = require_chunk.__toESM(require("react-html-parser"));
-
-//#region src/UI/inputs/textField/FluentTextFieldAutoComplete.jsx
-const useStyles$10 = (0, __material_ui_core.makeStyles)((theme) => ({
-	formTextInput: { fontSize: 14 },
-	labelRoot: { fontSize: 14 }
-}));
-const AutoCompletePopper = (props) => {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Popper, {
-		...props,
-		placement: "bottom-start"
-	});
-};
-const FluentTextFieldAutoComplete = (props) => {
-	const { label, placeholder, options, textFieldProps, disabled, onChange: onChangeProp, value, optionKey, additionalOnChangeAction, classes: classProps, variant = "outlined", inputProps, inputPropClasses, customPopper, disableClearable = false, defaultValue, additionalOptionKey, isMultiple = false, limitTags, renderTags, optionLabelDisplayFunction = (option) => option, groupBy = null, size = "medium", id, udprecordid,...other } = props;
-	const classes = useStyles$10();
-	const { autocompleteRoot } = classProps || {};
-	const onChange = (0, react.useCallback)((e, value$1) => {
-		if (additionalOnChangeAction) additionalOnChangeAction(value$1);
-		return onChangeProp?.(value$1);
-	}, [onChangeProp, additionalOnChangeAction]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_lab_Autocomplete.default, {
-		id: "autocomplete",
-		multiple: isMultiple,
-		limitTags,
-		disabled,
-		options: options || [],
-		getOptionLabel: (option) => option && (optionKey ? `${optionLabelDisplayFunction(option[optionKey])}${additionalOptionKey ? ` - (${option[additionalOptionKey]})` : ""}` : optionLabelDisplayFunction(option) || ""),
-		getOptionSelected: (option, val) => optionKey ? option[optionKey] === val[optionKey] : option === val,
-		groupBy,
-		onChange,
-		value: value || (isMultiple ? [] : null),
-		className: autocompleteRoot,
-		classes: { root: classProps?.formControl },
-		PopperComponent: customPopper || AutoCompletePopper,
-		disableClearable,
-		defaultValue,
-		size,
-		renderInput: (params) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.TextField, {
-			...textFieldProps,
-			...params,
-			...other,
-			inputProps: {
-				...params.inputProps,
-				id,
-				udprecordid
-			},
-			label,
-			margin: "dense",
-			variant,
-			placeholder,
-			size: "small",
-			InputProps: {
-				...params.InputProps,
-				...inputProps,
-				classes: {
-					root: classProps?.inputPropRoot,
-					input: (0, clsx.default)(classes.formTextInput, classProps?.inputPropInput)
-				}
-			},
-			InputLabelProps: { classes: { root: (0, clsx.default)(classes.labelRoot, classProps?.formLabelRoot) } }
-		}),
-		renderTags
-	});
-};
-
-//#endregion
-//#region src/utilities/input/DateUtilities.js
-const formatDateToLocaleString = (isoDate, luxonFormat = "") => {
-	return luxon.DateTime.fromISO(isoDate, { zone: "utc" }).toLocal().toLocaleString(luxonFormat);
-};
-const toUtcDate = (date) => {
-	if (!date) return null;
-	if (date.endsWith("Z")) return new Date(date);
-	else return /* @__PURE__ */ new Date(date + "Z");
-};
-
-//#endregion
-//#region src/workflow/menus/WorkflowTreeMenuItem.jsx
-const useStyles$9 = (0, __material_ui_core.makeStyles)((theme) => ({
-	root: {
-		"&.Mui-selected > .MuiTreeItem-content": {
-			backgroundColor: theme?.getThemeData()?.mode === "dark" ? theme.palette.grey[700] : theme.palette.grey[300],
-			borderRight: `4px solid ${theme.palette.primary.main}`
-		},
-		"&.Mui-selected > .MuiTreeItem-content .MuiTreeItem-label": {
-			backgroundColor: "transparent",
-			paddingLeft: 0
-		},
-		"&.Mui-selected > .MuiTreeItem-content > .MuiCollapse-wrapperInner": { backgroundColor: theme?.getThemeData()?.mode !== "dark" && theme.palette.grey[50] },
-		"& .MuiTreeItem-content .MuiTreeItem-iconContainer": { display: (props) => props.sidebarExpanded ? "flex" : "none" }
-	},
-	content: { backgroundColor: (props) => theme?.getThemeData()?.mode !== "dark" && !props.sidebarExpanded && props.conditionalIconName && props.conditionalIconColor ? (0, __material_ui_core.lighten)(props.conditionalIconColor, .92) : "" },
-	labelRoot: {
-		display: "flex",
-		alignItems: "center",
-		marginLeft: (props) => props.sidebarExpanded ? 0 : theme.spacing(1.5),
-		width: "100%"
-	},
-	labelContainer: {
-		display: (props) => !props.sidebarExpanded ? "none" : "",
-		width: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? `calc(100% - ${theme.spacing(6.25)}px)` : `calc(100% - ${theme.spacing(7.75)}px)`
-	},
-	conditionalIconContainer: { display: "inline-flex" },
-	labelText: {
-		fontSize: "0.75rem",
-		fontWeight: 600,
-		lineHeight: "1rem",
-		letterSpacing: .1
-	},
-	captionText: {
-		marginLeft: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? theme.spacing(1) : "",
-		fontSize: "0.65rem",
-		fontWeight: 400,
-		lineHeight: 1,
-		letterSpacing: .4
-	},
-	labelOverflow: {
-		whiteSpace: "nowrap",
-		overflow: "hidden",
-		textOverflow: "ellipsis",
-		marginTop: `-${theme.spacing(.25)}px`
-	},
-	group: {
-		width: "100%",
-		"& .MuiTreeItem-group": { marginLeft: 0 },
-		"& .MuiTreeItem-content": {
-			paddingLeft: (props) => props.sidebarExpanded ? (props.depth || 1) * theme.spacing(1) : 0,
-			borderRight: (props) => props.showRightBorderColor ? `4px solid ${theme.palette.primary.main}` : "",
-			borderBottom: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? `1px solid ${theme.palette.grey[200]}` : ""
-		},
-		"& .MuiTreeItem-content .MuiTreeItem-label": {
-			paddingLeft: 0,
-			width: (props) => props.sidebarExpanded && `calc(100% - ${theme.spacing(2.5)}px)`
-		},
-		"& .MuiTreeItem-content .MuiTreeItem-iconContainer span": { display: (props) => props.hideExpansion ? "none" : "" },
-		"& .MuiCollapse-wrapperInner": { backgroundColor: (props) => theme?.getThemeData()?.mode !== "dark" && props.isSelectedNode ? theme.palette.grey[50] : "" }
-	},
-	iconContainer: {
-		display: "flex",
-		justifyContent: "center",
-		marginTop: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? theme.spacing(.25) : theme.spacing(.5),
-		marginBottom: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? theme.spacing(.25) : theme.spacing(.5),
-		marginRight: theme.spacing(1),
-		width: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? theme.spacing(3) : theme.spacing(4),
-		height: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? theme.spacing(3) : theme.spacing(4)
-	}
-}));
-const WorkflowTreeMenuItem = (props) => {
-	const { parentId, nodeId, iconName, iconType, conditionalIconName, conditionalIconType, conditionalIconColor, label, iconColor, onNodeSelect, isSelectedNode, subLabel, sidebarExpanded, isLastNode, loading, node, onDropNode, treeViewMode, menuIndex, aggregateThresholdId,...other } = props;
-	const classes = useStyles$9(props);
-	const theme = (0, __material_ui_core.useTheme)();
-	const [{ isDragging }, dragRef] = (0, react_dnd.useDrag)({
-		type: "BaseTreeMenuItem",
-		item: {
-			...node,
-			sourceNodeMenuIndex: menuIndex
-		},
-		collect: (monitor) => ({ isDragging: monitor.isDragging() })
-	});
-	const handleOnDrop = (0, react.useCallback)((sourceNode, monitor) => {
-		if (!monitor.didDrop()) {
-			if (onDropNode) {
-				const { sourceNodeMenuIndex,...other$1 } = sourceNode;
-				onDropNode({ ...other$1 }, node, sourceNodeMenuIndex, menuIndex);
-			}
-		}
-	}, [
-		onDropNode,
-		node,
-		menuIndex
-	]);
-	const [{ canDrop, isOver }, dropRef] = (0, react_dnd.useDrop)(() => ({
-		accept: ["BaseTreeMenuItem"],
-		drop: (sourceNode, monitor) => {
-			handleOnDrop(sourceNode, monitor);
-		},
-		canDrop: (sourceNode) => checkCanDrop(sourceNode),
-		collect: (monitor) => ({
-			isOver: monitor.isOver(),
-			canDrop: !!monitor.canDrop()
-		})
-	}), [handleOnDrop]);
-	const checkCanDrop = (0, react.useCallback)((sourceNode) => {
-		if (sourceNode) {
-			const onDropActions = node?.properties?.nodeActions?.filter((na) => na?.triggerType === require_EnvironmentRibbon.NodeActionTriggerEnums.On_Node_Drop);
-			if (!onDropActions) return false;
-			const nodeDragEntities = onDropActions?.map((action) => action?.dragEntityName);
-			return nodeDragEntities.includes(sourceNode?.properties?.catalogReturnObject);
-		}
-	}, [node]);
-	const handleOnLabelClick = (0, react.useCallback)((e) => {
-		e.preventDefault();
-		onNodeSelect(e, nodeId);
-	}, [onNodeSelect, nodeId]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_lab_TreeItem.default, {
-		className: classes.group,
-		nodeId,
-		label: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			ref: dropRef,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Tooltip, {
-				title: sidebarExpanded ? "" : label,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					ref: node?.properties?.isDraggable && dragRef || null,
-					style: { opacity: isDragging ? .5 : 1 },
-					children: loading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.CircularProgress, { size: 12 }) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						id: "udpRecord-BaseTreeMenuItem-" + label?.replace(/\s+/g, ""),
-						udprecordid: "udpRecord-BaseTreeMenuItem-" + label?.replace(/\s+/g, ""),
-						className: classes.labelRoot,
-						style: { fontWeight: isSelectedNode ? "bold" : "" },
-						children: [
-							iconName && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: classes.iconContainer,
-								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.UnityFluentIcon, {
-									size: treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? "small" : "large",
-									color: iconColor,
-									type: iconType,
-									icon: iconType === "unity" ? require_UtilitySideBar.getUnityIconFromName(iconName) : require_UtilitySideBar.getIconFromName(iconName),
-									style: { color: iconColor ? (0, __material_ui_core.darken)(iconColor, .1) : theme.palette.secondary.main }
-								})
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-								className: classes.labelContainer,
-								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__material_ui_core.Typography, {
-									variant: "subtitle2",
-									className: (0, clsx.default)(classes.labelText, classes.labelOverflow),
-									children: [label, subLabel && treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
-										variant: "caption",
-										className: (0, clsx.default)(classes.captionText, classes.labelOverflow),
-										children: subLabel
-									})]
-								}), subLabel && treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Classic && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-									className: classes.labelOverflow,
-									children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
-										variant: "caption",
-										className: (0, clsx.default)(classes.captionText),
-										children: subLabel
-									})
-								})]
-							}),
-							/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UtilitySideBar.AggregateChip, { aggregateThresholdId }),
-							conditionalIconName && sidebarExpanded && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-								className: classes.conditionalIconContainer,
-								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.UnityFluentIcon, {
-									size: treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? "small" : "default",
-									color: conditionalIconColor,
-									type: conditionalIconType,
-									icon: conditionalIconType === "unity" ? require_UtilitySideBar.getUnityIconFromName(conditionalIconName) : require_UtilitySideBar.getIconFromName(conditionalIconName),
-									style: { color: conditionalIconColor }
-								})
-							})
-						]
-					})
-				})
-			})
-		}),
-		onLabelClick: handleOnLabelClick,
-		classes: {
-			root: classes.root,
-			content: classes.content
-		},
-		...other
-	}, nodeId);
-};
-
-//#endregion
-//#region src/workflow/menus/WorkflowTreeMenu.jsx
-const useStyles$8 = (0, __material_ui_core.makeStyles)((theme) => ({
-	root: {
-		marginBottom: theme.spacing(1.75),
-		borderTop: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? `1px solid ${theme.palette.grey[200]}` : ""
-	},
-	noChildrenContainer: { borderBottom: (props) => props.treeViewMode === require_EnvironmentRibbon.TreeViewModeEnums.Compact ? `1px solid ${theme.palette.grey[200]}` : "" }
-}));
-const WorkflowTreeMenu = (props) => {
-	const { menuItems, onSelectNode, onDropNode, menuIndex, selectedNodeId, selectedNodeParentId, sidebarExpanded, treeViewMode, childrenKey = "children" } = props;
-	const [expanded, setExpanded] = (0, react.useState)(null);
-	const [isCurrentActiveTree, setIsCurrentActiveTree] = (0, react.useState)(false);
-	const [selectedNodeIsHidden, setSelectedNodeIsHidden] = (0, react.useState)(false);
-	const [tree, setTree] = (0, react.useState)(menuItems);
-	const theme = (0, __material_ui_core.useTheme)();
-	const classes = useStyles$8(props);
-	const handleSelectedNode = (0, react.useCallback)((e, value) => {
-		const selectedNode = require_UtilitySideBar.searchTree(tree, value);
-		if (onSelectNode) {
-			onSelectNode(selectedNode, menuIndex);
-			setSelectedNodeIsHidden(false);
-		}
-	}, [
-		tree,
-		menuIndex,
-		onSelectNode
-	]);
-	const renderTree = (0, react.useCallback)((node, depth = 1) => {
-		let label = node.properties?.nodeLabel || node.properties?.name;
-		let subLabel = node.properties?.nodeSubLabel;
-		let iconName = node.properties?.defaultIcon?.name;
-		let iconType = node.properties?.defaultIcon?.type;
-		let conditionalIconName = node.properties?.conditionalIcon?.name || "";
-		let conditionalIconType = node.properties?.conditionalIcon?.name ? node.properties.conditionalIcon?.type : "";
-		let conditionalIconColor = node.properties?.conditionalIcon?.name ? node.properties?.conditionalIcon?.color : "";
-		let nodeId = node.id;
-		let iconColor = node.properties?.conditionalIconName ? node.properties?.conditionalIconColor : node.properties?.defaultIcon?.color?.hex;
-		let aggregateThresholdId = node.properties?.aggregateThresholdId || "";
-		if (node.isGroupNode) {
-			label = node.properties?.label;
-			subLabel = node.properties?.subLabel;
-			iconName = node.properties?.icon?.name;
-			iconType = node.properties?.icon?.type;
-			iconColor = node.properties?.icon?.color?.hex;
-		}
-		return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(WorkflowTreeMenuItem, {
-			nodeId,
-			label,
-			subLabel,
-			iconName,
-			iconType,
-			conditionalIconName,
-			conditionalIconType,
-			conditionalIconColor,
-			parentId: node.parentId,
-			iconColor,
-			onNodeSelect: handleSelectedNode,
-			selectedNodeId,
-			isSelectedNode: selectedNodeId === node.id,
-			showRightBorderColor: selectedNodeIsHidden && isCurrentActiveTree && require_UtilitySideBar.getNodeIdForRightBorder(expanded, tree, selectedNodeParentId) === node.id,
-			isCurrentActiveTree,
-			sidebarExpanded,
-			depth,
-			hideExpansion: !!!node[childrenKey]?.length,
-			node,
-			onDropNode,
-			treeViewMode,
-			menuIndex,
-			aggregateThresholdId,
-			children: [
-				node.properties?.lazyLoad && !!!node[childrenKey]?.length && !node.completedLoadingChildren && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.CircularProgress, {
-					size: 12,
-					style: { marginLeft: (depth || 1) * theme.spacing(1) }
-				}),
-				node.properties?.lazyLoad && !!!node[childrenKey]?.length && node.completedLoadingChildren && sidebarExpanded && !node.errorRetrievingChildren && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: classes.noChildrenContainer,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
-						variant: "caption",
-						style: {
-							marginLeft: (depth || 1) * theme.spacing(3),
-							fontWeight: 400
-						},
-						children: "No Children"
-					})
-				}),
-				node.properties?.lazyLoad && node.completedLoadingChildren && sidebarExpanded && node.errorRetrievingChildren && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: classes.noChildrenContainer,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
-						variant: "caption",
-						style: {
-							marginLeft: (depth || 1) * theme.spacing(3),
-							fontWeight: 400
-						},
-						children: `Error Retrieving ${!!node[childrenKey]?.length ? `Additional ` : ""}Children`
-					})
-				}),
-				Array.isArray(node[childrenKey]) ? node[childrenKey].map((n, i) => renderTree(n, depth + 1)) : null
-			]
-		}, nodeId);
-	}, [
-		handleSelectedNode,
-		selectedNodeId,
-		selectedNodeIsHidden,
-		isCurrentActiveTree,
-		sidebarExpanded,
-		expanded,
-		tree,
-		selectedNodeParentId,
-		theme,
-		classes,
-		onDropNode,
-		treeViewMode,
-		menuIndex,
-		childrenKey
-	]);
-	const handleNodeExpansion = (0, react.useCallback)(async (evt, nodeIds) => {
-		const treeCopy = (0, lodash.cloneDeep)(tree);
-		setExpanded(nodeIds);
-		const parentNode = require_UtilitySideBar.searchTree(treeCopy, selectedNodeParentId);
-		const initialAllParentNodeIds = selectedNodeParentId ? [selectedNodeParentId] : [];
-		const allParentNodeIds = require_UtilitySideBar.findAllParentIds(treeCopy, parentNode, initialAllParentNodeIds);
-		const selectedNodeShown = allParentNodeIds.every((id) => nodeIds.includes(id));
-		if (isCurrentActiveTree && allParentNodeIds.length && !selectedNodeShown) setSelectedNodeIsHidden(true);
-		else setSelectedNodeIsHidden(false);
-	}, [
-		isCurrentActiveTree,
-		tree,
-		selectedNodeParentId
-	]);
-	const getExpandedRecursively = (0, react.useCallback)((tree$1) => {
-		if (!tree$1) return [];
-		return tree$1.reduce((expandedIds, item) => {
-			if (item?.isExpanded) expandedIds.push(item.id);
-			if (item && item[childrenKey]?.length) expandedIds = expandedIds.concat(getExpandedRecursively(item[childrenKey]));
-			return expandedIds;
-		}, []);
-	}, [childrenKey]);
-	(0, react.useEffect)(() => {
-		setTree(menuItems);
-	}, [menuItems]);
-	(0, react.useEffect)(() => {
-		if (!tree) return;
-		let expanded$1 = [];
-		if (tree?.isExpanded) expanded$1.push(tree.id);
-		expanded$1 = expanded$1.concat(getExpandedRecursively(tree[childrenKey]));
-		setExpanded(expanded$1);
-	}, [
-		getExpandedRecursively,
-		tree,
-		childrenKey
-	]);
-	(0, react.useEffect)(() => {
-		if (!!require_UtilitySideBar.searchTree(tree, selectedNodeId)) setIsCurrentActiveTree(true);
-		else setIsCurrentActiveTree(false);
-	}, [tree, selectedNodeId]);
-	if (!expanded) return null;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_lab_TreeView.default, {
-		className: classes.root,
-		defaultCollapseIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.FluentIcon, {
-			size: "small",
-			component: __fluentui_react_icons.CaretUpSolid8Icon,
-			style: {
-				color: (0, __material_ui_core.lighten)(theme.palette.primary.main, .5),
-				width: theme.spacing(1.5),
-				height: theme.spacing(1.5)
-			}
-		}),
-		expanded: expanded || [],
-		onNodeToggle: handleNodeExpansion,
-		defaultExpandIcon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.FluentIcon, {
-			size: "small",
-			component: __fluentui_react_icons.CaretDownSolid8Icon,
-			style: {
-				color: (0, __material_ui_core.lighten)(theme.palette.primary.main, .5),
-				width: theme.spacing(1.5),
-				height: theme.spacing(1.5)
-			}
-		}),
-		selected: selectedNodeId,
-		children: tree && renderTree(tree)
-	}, tree);
-};
-
-//#endregion
-//#region src/enums/workflowEnums.ts
-let UnitTypeEnums = /* @__PURE__ */ function(UnitTypeEnums$1) {
-	UnitTypeEnums$1[UnitTypeEnums$1["Scope"] = 0] = "Scope";
-	UnitTypeEnums$1[UnitTypeEnums$1["Sequence"] = 1] = "Sequence";
-	UnitTypeEnums$1[UnitTypeEnums$1["Group"] = 2] = "Group";
-	UnitTypeEnums$1[UnitTypeEnums$1["Fork"] = 3] = "Fork";
-	UnitTypeEnums$1[UnitTypeEnums$1["Branch"] = 4] = "Branch";
-	UnitTypeEnums$1[UnitTypeEnums$1["Retry"] = 5] = "Retry";
-	UnitTypeEnums$1[UnitTypeEnums$1["Attempt"] = 6] = "Attempt";
-	UnitTypeEnums$1[UnitTypeEnums$1["Iterator"] = 7] = "Iterator";
-	UnitTypeEnums$1[UnitTypeEnums$1["Loop"] = 8] = "Loop";
-	UnitTypeEnums$1[UnitTypeEnums$1["Break"] = 9] = "Break";
-	UnitTypeEnums$1[UnitTypeEnums$1["Block"] = 10] = "Block";
-	UnitTypeEnums$1[UnitTypeEnums$1["Adaptor"] = 11] = "Adaptor";
-	UnitTypeEnums$1[UnitTypeEnums$1["Code"] = 12] = "Code";
-	UnitTypeEnums$1[UnitTypeEnums$1["Pause"] = 13] = "Pause";
-	UnitTypeEnums$1[UnitTypeEnums$1["Fault"] = 14] = "Fault";
-	UnitTypeEnums$1[UnitTypeEnums$1["Trace"] = 15] = "Trace";
-	UnitTypeEnums$1[UnitTypeEnums$1["Catcher"] = 16] = "Catcher";
-	UnitTypeEnums$1[UnitTypeEnums$1["Thrower"] = 17] = "Thrower";
-	UnitTypeEnums$1[UnitTypeEnums$1["Plan"] = 18] = "Plan";
-	UnitTypeEnums$1[UnitTypeEnums$1["Task"] = 19] = "Task";
-	UnitTypeEnums$1[UnitTypeEnums$1["Sprint"] = 20] = "Sprint";
-	UnitTypeEnums$1[UnitTypeEnums$1["Auth"] = 21] = "Auth";
-	UnitTypeEnums$1[UnitTypeEnums$1["Rest"] = 22] = "Rest";
-	UnitTypeEnums$1[UnitTypeEnums$1["Fuse"] = 23] = "Fuse";
-	UnitTypeEnums$1[UnitTypeEnums$1["Mail"] = 24] = "Mail";
-	UnitTypeEnums$1[UnitTypeEnums$1["Sms"] = 25] = "Sms";
-	UnitTypeEnums$1[UnitTypeEnums$1["Publisher"] = 26] = "Publisher";
-	UnitTypeEnums$1[UnitTypeEnums$1["Fiber"] = 27] = "Fiber";
-	UnitTypeEnums$1[UnitTypeEnums$1["Mapper"] = 28] = "Mapper";
-	UnitTypeEnums$1[UnitTypeEnums$1["Section"] = 29] = "Section";
-	UnitTypeEnums$1[UnitTypeEnums$1["Scene"] = 30] = "Scene";
-	UnitTypeEnums$1[UnitTypeEnums$1["Placeholder"] = 100] = "Placeholder";
-	return UnitTypeEnums$1;
-}({});
-let UnitStateType = /* @__PURE__ */ function(UnitStateType$1) {
-	UnitStateType$1[UnitStateType$1["Initial"] = 0] = "Initial";
-	UnitStateType$1[UnitStateType$1["Started"] = 1] = "Started";
-	UnitStateType$1[UnitStateType$1["Completed"] = 2] = "Completed";
-	UnitStateType$1[UnitStateType$1["Cancelled"] = 3] = "Cancelled";
-	UnitStateType$1[UnitStateType$1["Failed"] = 4] = "Failed";
-	return UnitStateType$1;
-}({});
-
-//#endregion
-//#region src/utilities/workflow/workflowUtilities.js
-const getWorkflowTaskIconByActionType = (type) => {
-	let iconName = "ClipboardListIcon";
-	switch (type) {
-		case UnitTypeEnums.Rest:
-			iconName = "CloudImportExportIcon";
-			break;
-		case UnitTypeEnums.Sms:
-			iconName = "MessageFillIcon";
-			break;
-		case UnitTypeEnums.Mail:
-			iconName = "MailSolidIcon";
-			break;
-		case UnitTypeEnums.Scene:
-			iconName = "ReleaseGateIcon";
-			break;
-		default: break;
-	}
-	return iconName;
-};
-const getWorkflowTaskStateIconByStateType = (type) => {
-	let iconName = "";
-	switch (type) {
-		case UnitStateType.Initial:
-			iconName = "StopwatchIcon";
-			break;
-		case UnitStateType.Started:
-			iconName = "ProgressLoopOuterIcon";
-			break;
-		case UnitStateType.Completed:
-			iconName = "CheckMarkIcon";
-			break;
-		case UnitStateType.Cancelled:
-			iconName = "CancelIcon";
-			break;
-		case UnitStateType.Failed:
-		default:
-			iconName = "ErrorBadgeIcon";
-			break;
-	}
-	return iconName;
-};
-const getWorkflowTaskStateIconColorByStateType = (type) => {
-	let color = "";
-	switch (type) {
-		case UnitStateType.Initial:
-			color = "#ffa726";
-			break;
-		case UnitStateType.Started:
-			color = "#29b6f6";
-			break;
-		case UnitStateType.Completed:
-			color = "#66bb6a";
-			break;
-		case UnitStateType.Cancelled:
-			color = "#f44336";
-			break;
-		case UnitStateType.Failed:
-		default:
-			color = "#f44336";
-			break;
-	}
-	return color;
-};
-const SELECTABLE_NODE_TYPES = [
-	UnitTypeEnums.Sms,
-	UnitTypeEnums.Mail,
-	UnitTypeEnums.Scene
-];
-const transformWorkflowPlayTree = (node) => {
-	if (!node) return null;
-	const label = node.name || "";
-	const expanded = "expanded";
-	const startedAt = node.startedAt ? formatDateToLocaleString(node.startedAt, luxon.DateTime.DATETIME_SHORT) : null;
-	const updatedNode = {
-		id: node.id,
-		parentId: node.parentId,
-		isExpanded: expanded,
-		isSelectable: !!node.type && SELECTABLE_NODE_TYPES.includes(node.type),
-		properties: {
-			defaultIcon: {
-				type: "",
-				name: getWorkflowTaskIconByActionType(node.type),
-				color: ""
-			},
-			conditionalIcon: {
-				type: "",
-				name: !!node.type && getWorkflowTaskStateIconByStateType(node.state),
-				color: !!node.type && getWorkflowTaskStateIconColorByStateType(node.state)
-			},
-			nodeLabel: label,
-			nodeSubLabel: node.parentId ? node.description : startedAt || "",
-			state: node.state,
-			type: node.type,
-			interruptPages: node.interruptPages,
-			playSceneId: node.playSceneId,
-			startedAt: node.startedAt,
-			endedAt: node.endedAt,
-			dueDate: node.dueDate,
-			variables: node.variables,
-			sms: node.type === UnitTypeEnums.Sms ? {
-				templateData: node.templateData,
-				to: node.to,
-				from: node.from,
-				body: node.body
-			} : null,
-			email: node.type === UnitTypeEnums.Mail ? {
-				templateData: node.templateData,
-				to: node.to,
-				from: node.from,
-				subject: node.subject,
-				text: node.text,
-				html: node.html
-			} : null
-		},
-		children: []
-	};
-	for (const child of node.children) {
-		const updatedChild = transformWorkflowPlayTree(child);
-		if (updatedChild) updatedNode.children.push(updatedChild);
-	}
-	return updatedNode;
-};
-
-//#endregion
-//#region src/stores/workflowStore.ts
-const useWorkflowStore = (0, zustand.create)()((0, zustand_middleware.devtools)((set) => ({
-	title: "",
-	setWorkflowToolbarTitle: (title) => set((state) => ({ title })),
-	taskDataMap: {},
-	updateTaskDataMap: (taskId, pageId, data) => set((state) => {
-		const updatedTaskDataMap = { ...state.taskDataMap };
-		if (updatedTaskDataMap[taskId]) if (updatedTaskDataMap[taskId][pageId]) updatedTaskDataMap[taskId][pageId] = data;
-		else updatedTaskDataMap[taskId] = { [pageId]: data };
-		else updatedTaskDataMap[taskId] = { [pageId]: data };
-		return { taskDataMap: updatedTaskDataMap };
-	}),
-	setTaskDataMap: (taskId, data) => set((state) => {
-		const updatedTaskDataMap = { ...state.taskDataMap };
-		updatedTaskDataMap[taskId] = data;
-		return { taskDataMap: updatedTaskDataMap };
-	})
-})));
-
-//#endregion
-//#region src/workflow/components/WorkflowTaskFlow.jsx
-const useStyles$7 = (0, __material_ui_core.makeStyles)((theme) => ({
-	root: { display: "flex" },
-	taskInfoBlock: {
-		backgroundColor: (0, __material_ui_core.lighten)(theme.palette.primary.main, .3),
-		width: theme.spacing(25),
-		color: theme.palette.common.white,
-		padding: `${theme.spacing(.5)}px ${theme.spacing(2.25)}px`
-	},
-	description: {
-		textOverflow: "ellipsis",
-		overflow: "hidden",
-		whiteSpace: "nowrap"
-	},
-	button: {
-		backgroundColor: theme.palette.primary.main,
-		color: theme.palette.common.white,
-		borderRadius: 0,
-		"&:hover": { backgroundColor: theme.palette.primary.dark },
-		minWidth: theme.spacing(3)
-	},
-	stepperContainer: {
-		width: "100%",
-		padding: 0,
-		marginTop: `-${theme.spacing(1.5)}px`,
-		background: "none"
-	},
-	stepIconRoot: {
-		zIndex: 1,
-		color: theme.palette.primary.main,
-		width: theme.spacing(3),
-		height: theme.spacing(3),
-		display: "flex",
-		borderRadius: "50%",
-		justifyContent: "center",
-		alignItems: "center",
-		"&.active": {
-			backgroundColor: theme.palette.primary.main,
-			color: theme.palette.common.white
-		},
-		"&.completed": {
-			backgroundColor: theme.palette.common.white,
-			color: theme.palette.success.main
-		}
-	},
-	stepLabel: { "& > .MuiStepLabel-label": { marginTop: theme.spacing(.5) } }
-}));
-const ColorLibConnector = (0, __material_ui_core.withStyles)((theme) => ({
-	connectorRoot: {
-		top: 10,
-		left: "calc(-50% + 12px)",
-		right: "calc(50% + 12px)"
-	},
-	alternativeLabel: {
-		left: "calc(-50% + 12px)",
-		right: "calc(50% + 12px)"
-	},
-	active: { "& $line": { borderColor: theme.palette.primary.main } },
-	completed: { "& $line": { borderColor: theme.palette.primary.main } },
-	line: {
-		borderTopWidth: 3,
-		borderRadius: 1
-	}
-}))(__material_ui_core.StepConnector);
-const ColorlibStepIcon = (props) => {
-	const { active, completed } = props;
-	const classes = useStyles$7();
-	const rootClass = `${classes.stepIconRoot} ${active ? "active" : ""} ${completed ? "completed" : ""}`;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: rootClass,
-		children: completed ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_icons_CheckCircle.default, {}) : active ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_icons_RadioButtonChecked.default, {}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_icons_RadioButtonUnchecked.default, {})
-	});
-};
-const WorkflowTaskFlow = (props) => {
-	const { steps = [], handleClick = () => {}, task } = props;
-	const classes = useStyles$7();
-	const [activeStep, setActiveStep] = (0, react.useState)(0);
-	const handleStepClick = (stepIndex) => {
-		handleClick(stepIndex);
-		setActiveStep(stepIndex);
-	};
-	const handleOnLeftButtonClick = (0, react.useCallback)(() => {
-		if (activeStep > 0) {
-			const newIndex = activeStep - 1;
-			handleClick(newIndex);
-			setActiveStep(newIndex);
-		}
-	}, [activeStep, handleClick]);
-	const handleOnRightButtonClick = (0, react.useCallback)(() => {
-		if (activeStep !== steps?.length - 1) {
-			const newIndex = activeStep + 1;
-			handleClick(newIndex);
-			setActiveStep(newIndex);
-		}
-	}, [
-		steps,
-		activeStep,
-		handleClick
-	]);
-	const getFormattedDueDate = (0, react.useCallback)((date) => {
-		if (!date) return "";
-		const shortDate = formatDateToLocaleString(date, luxon.DateTime.DATE_SHORT);
-		return `Due ${shortDate}`;
-	}, []);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: classes.root,
-		children: [
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: classes.taskInfoBlock,
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: classes.description,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
-						variant: "caption",
-						children: task?.properties?.nodeLabel || ""
-					})
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: classes.description,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
-						variant: "caption",
-						style: { fontWeight: 500 },
-						children: getFormattedDueDate(task?.properties?.dueDate)
-					})
-				})]
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Button, {
-				className: classes.button,
-				onClick: handleOnLeftButtonClick,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.FluentIcon, { component: __fluentui_react_icons.ChevronLeftIcon })
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Stepper, {
-				alternativeLabel: true,
-				activeStep,
-				connector: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ColorLibConnector, {}),
-				className: classes.stepperContainer,
-				children: steps.map((step, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Step, {
-					onClick: () => handleStepClick(index),
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.StepLabel, {
-						classes: { labelContainer: classes.stepLabel },
-						StepIconComponent: ColorlibStepIcon,
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Typography, {
-							variant: "caption",
-							children: step.label
-						})
-					})
-				}, step.label))
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Button, {
-				className: classes.button,
-				onClick: handleOnRightButtonClick,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.FluentIcon, { component: __fluentui_react_icons.ChevronRightIcon })
-			})
-		]
-	});
-};
-
-//#endregion
-//#region src/UI/loading/LinearProgress.jsx
-const useStyles$6 = (0, __material_ui_core_styles.makeStyles)((theme) => ({
-	root: { backgroundColor: theme.palette.grey[300] },
-	barColorPrimary: { backgroundColor: theme.palette.primary.main },
-	barColorSecondary: { backgroundColor: theme.palette.secondary.main },
-	barColorSuccess: { backgroundColor: theme.palette.success.main },
-	barColorError: { backgroundColor: theme.palette.error.main },
-	barColorWarning: { backgroundColor: theme.palette.warning.main },
-	barColorInfo: { backgroundColor: theme.palette.info.main },
-	customColorBar: (props) => ({ backgroundColor: props.color })
-}));
-const LinearProgress = (props) => {
-	const { variant = "indeterminate", value, color = "primary",...otherProps } = props;
-	const isPredefinedColor = [
-		"primary",
-		"secondary",
-		"success",
-		"error",
-		"warning",
-		"info"
-	].includes(color);
-	const classes = useStyles$6({ color });
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.LinearProgress, {
-		...otherProps,
-		variant,
-		value,
-		classes: {
-			root: classes.root,
-			bar: (0, clsx.default)({
-				[classes.barColorPrimary]: color === "primary",
-				[classes.barColorSecondary]: color === "secondary",
-				[classes.barColorSuccess]: color === "success",
-				[classes.barColorError]: color === "error",
-				[classes.barColorWarning]: color === "warning",
-				[classes.barColorInfo]: color === "info",
-				[classes.customColorBar]: !isPredefinedColor
-			})
-		}
-	});
-};
-
-//#endregion
-//#region src/UI/loading/CircularProgress.jsx
-const useStyles$5 = (0, __material_ui_core_styles.makeStyles)((theme) => ({
-	circleColorPrimary: { color: theme.palette.primary.main },
-	circleColorSecondary: { color: theme.palette.secondary.main },
-	circleColorSuccess: { color: theme.palette.success.main },
-	circleColorError: { color: theme.palette.error.main },
-	circleColorWarning: { color: theme.palette.warning.main },
-	circleColorInfo: { color: theme.palette.info.main },
-	customColorCircle: (props) => ({ backgroundColor: props.color })
-}));
-const CircularProgress = (props) => {
-	const { variant = "indeterminate", value, color = "primary",...otherProps } = props;
-	const isPredefinedColor = [
-		"primary",
-		"secondary",
-		"success",
-		"error",
-		"warning",
-		"info"
-	].includes(color);
-	const classes = useStyles$5({ color });
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.CircularProgress, {
-		...otherProps,
-		variant,
-		value,
-		classes: {
-			root: classes.root,
-			circle: (0, clsx.default)({
-				[classes.circleColorPrimary]: color === "primary",
-				[classes.circleColorSecondary]: color === "secondary",
-				[classes.circleColorSuccess]: color === "success",
-				[classes.circleColorError]: color === "error",
-				[classes.circleColorWarning]: color === "warning",
-				[classes.circleColorInfo]: color === "info",
-				[classes.customColorCircle]: !isPredefinedColor
-			})
-		}
-	});
-};
-
-//#endregion
-//#region src/workflow/WorkflowUiInterruptContent.jsx
-const useStyles$4 = (0, __material_ui_core.makeStyles)((theme) => ({
-	root: {},
-	loadingContent: {
-		flex: 1,
-		display: "flex",
-		flexDirection: "column",
-		alignItems: "center",
-		justifyContent: "center",
-		height: "calc(100vh - 160px)"
-	}
-}));
-const WorkflowUiInterruptContent = (props) => {
-	const { selectedNode, workflow, reloadWorkflow, users, groups, handleClose, inquiryPageParams = {} } = props;
-	const classes = useStyles$4();
-	const [selectedPageId, setSelectedPageId] = (0, react.useState)("");
-	const [currentWorkflowStep, setCurrentWorkflowStep] = (0, react.useState)(0);
-	const [loading, setLoading] = (0, react.useState)(false);
-	const [loadingTaskData, setLoadingTaskData] = (0, react.useState)(true);
-	const [reassignSidesheetOpen, setReassignSidesheetOpen] = (0, react.useState)(false);
-	const [reassigningAssignee, setReassigningAssignee] = (0, react.useState)(false);
-	const [workflowPageData, setWorkflowPageData] = (0, react.useState)(null);
-	const [orderedPageData, setOrderedPageData] = (0, react.useState)([]);
-	const user = require_EnvironmentRibbon.useUser();
-	const taskDataMap = useWorkflowStore((state) => state.taskDataMap);
-	const setTaskDataMap = useWorkflowStore((state) => state.setTaskDataMap);
-	const { t } = (0, react_i18next.useTranslation)();
-	const formRef = (0, react.useRef)(null);
-	const [{ data: pageData, loading: pageLoading, error: pageError }] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.tenantV1ApiUrl, `page/${selectedPageId}`, {}, !!!selectedPageId, false);
-	const [{ data: playScene, loading: playSceneLoading, error: playSceneError }, fetchPlayScene] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.maestroV1ApiUrl, `maestro/play/scene/${selectedNode?.properties?.playSceneId || null}?includeData=true`, {}, !!!selectedNode?.properties?.playSceneId, false);
-	const updatePlaySceneData = (0, react.useCallback)(async (data = "") => require_SideSheet.apiMutate(udp_react_stencil_component_library.ConfigService.maestroV1ApiUrl, `maestro/play/scene/${selectedNode?.properties?.playSceneId || null}/data`, { method: "put" }, { data }), [selectedNode]);
-	const updatePlaySceneState = (0, react.useCallback)(async (data = {}, sceneState) => require_SideSheet.apiMutate(udp_react_stencil_component_library.ConfigService.maestroV1ApiUrl, `maestro/play/scene/${selectedNode?.properties?.playSceneId || null}/${sceneState}`, { method: "put" }, { data }), [selectedNode]);
-	const updatePlaySceneAssignee = (0, react.useCallback)(async (data = "") => require_SideSheet.apiMutate(udp_react_stencil_component_library.ConfigService.maestroV1ApiUrl, `maestro/play/scene/${selectedNode?.properties?.playSceneId || null}/assignee`, { method: "put" }, { data }), [selectedNode]);
-	const closeReassignmentSheet = (0, react.useCallback)(() => {
-		setReassignSidesheetOpen(false);
-	}, []);
-	const workflowTaskSteps = (0, react.useMemo)(() => {
-		if (!selectedNode?.properties?.interruptPages) return [];
-		const orderedInterruptPages = (0, lodash.orderBy)(selectedNode.properties.interruptPages, ["sequenceNo"], ["asc"]);
-		const steps = orderedInterruptPages.reduce((list, ip) => {
-			const step = {
-				label: ip.displayName || ip.page?.name,
-				pageId: ip.page?.pageId,
-				requiredFieldMapping: ip.requiredFieldMapping
-			};
-			list.push(step);
-			return list;
-		}, []);
-		return steps;
-	}, [selectedNode]);
-	const assigneeOptions = (0, react.useMemo)(() => {
-		const formattedUsers = users?.reduce((list, user$1) => {
-			list.push({
-				id: user$1?.unityId || "",
-				name: `${user$1?.displayName} - (User)` || ""
-			});
-			return list;
-		}, []) || [];
-		const formattedGroups = groups.reduce((list, group) => {
-			list.push({
-				id: group?.groupId || "",
-				name: `${group?.name} - (Group)` || ""
-			});
-			return list;
-		}, []) || [];
-		const options = formattedUsers.concat(formattedGroups);
-		return options;
-	}, [users, groups]);
-	const saveCurrentWorkflowData = (0, react.useCallback)(async () => {
-		let playSceneData = null;
-		if (selectedNode?.properties?.playSceneId) playSceneData = taskDataMap[selectedNode.properties.playSceneId];
-		if (playSceneData) {
-			await updatePlaySceneData({ data: JSON.stringify(playSceneData) });
-			await fetchPlayScene();
-		}
-	}, [
-		taskDataMap,
-		fetchPlayScene,
-		updatePlaySceneData,
-		selectedNode
-	]);
-	const updateWorkflowPageData = (0, react.useCallback)(async (data, pageId) => {
-		if (!selectedNode?.properties?.playSceneId || !pageId) {
-			console.warn("No TaskId or PageId availble to save Workflow Page Data");
-			return;
-		}
-		if (selectedNode?.properties?.state === UnitStateType.Initial || selectedNode?.properties?.state === UnitStateType.Completed || selectedNode?.properties?.state === UnitStateType.Cancelled || selectedNode?.properties?.state === UnitStateType.Failed) return;
-		let playSceneData = null;
-		if (selectedNode?.properties?.playSceneId) {
-			playSceneData = taskDataMap[selectedNode.properties.playSceneId];
-			if (playSceneData) playSceneData[pageId] = data;
-		}
-		if (playSceneData) {
-			await updatePlaySceneData({ data: JSON.stringify(playSceneData) });
-			await fetchPlayScene();
-		}
-	}, [
-		selectedNode,
-		fetchPlayScene,
-		taskDataMap,
-		updatePlaySceneData
-	]);
-	const handleTaskChange = (0, react.useCallback)(async (step) => {
-		setCurrentWorkflowStep(step);
-	}, []);
-	const handleTaskSubmit = (0, react.useCallback)(async () => {
-		setLoading(true);
-		await saveCurrentWorkflowData();
-		await updatePlaySceneState("", 2);
-		await reloadWorkflow();
-		setLoading(false);
-	}, [
-		updatePlaySceneState,
-		reloadWorkflow,
-		saveCurrentWorkflowData
-	]);
-	const secondaryButtons = (0, react.useMemo)(() => {
-		const buttons = [];
-		if (handleClose) buttons.push({
-			label: t("Close"),
-			component: __fluentui_react_icons.CancelIcon,
-			click: () => handleClose()
-		});
-		if (selectedNode?.properties?.state !== UnitStateType.Started) return buttons;
-		buttons.push({
-			label: t("Reassign"),
-			component: __fluentui_react_icons.ForwardIcon,
-			click: () => setReassignSidesheetOpen(true)
-		});
-		return buttons;
-	}, [
-		t,
-		selectedNode,
-		handleClose
-	]);
-	const handleReassignment = (0, react.useCallback)(() => {
-		formRef?.current.form.submit();
-	}, []);
-	const reassignTask = (0, react.useCallback)(async (values) => {
-		setReassigningAssignee(true);
-		await updatePlaySceneAssignee({ data: values?.assignee?.id || "" });
-		await fetchPlayScene();
-		setReassigningAssignee(false);
-		closeReassignmentSheet();
-	}, [
-		updatePlaySceneAssignee,
-		fetchPlayScene,
-		closeReassignmentSheet
-	]);
-	const requiredFieldMapping = (0, react.useMemo)(() => {
-		const step = workflowTaskSteps?.find((wts) => wts.pageId === pageData?.pageId);
-		let fieldMapping = step?.requiredFieldMapping ? (0, lodash.cloneDeep)(step.requiredFieldMapping) : {};
-		const workflowVariables = selectedNode?.properties?.variables || null;
-		if (!!fieldMapping && !!workflowVariables) Object.keys(fieldMapping)?.forEach((rfmKey) => {
-			const requiredField = fieldMapping[rfmKey];
-			if (!!requiredField?.value) {
-				if (requiredField?.type === "workflowVariable") {
-					let matchedVariable = false;
-					Object.keys(workflowVariables).forEach((key) => {
-						if (requiredField.value === key) {
-							requiredField.value = workflowVariables[key] || "";
-							matchedVariable = true;
-							return;
-						}
-					});
-					if (!matchedVariable) requiredField.value = null;
-				}
-			}
-		});
-		return fieldMapping || {};
-	}, [
-		pageData?.pageId,
-		selectedNode,
-		workflowTaskSteps
-	]);
-	const pageWidgetParams = (0, react.useMemo)(() => {
-		const requiredFieldsMap = Object.keys(requiredFieldMapping).reduce((fieldMap, key) => {
-			fieldMap[key] = requiredFieldMapping[key]?.value || "";
-			return fieldMap;
-		}, {});
-		return {
-			setSideSheetWidth: () => {
-				console.warn("setSideSheetWidth Not implemented");
-			},
-			setSideSheetButtonLabel: () => {
-				console.warn("setSideSheetButtonLabel Not implemented");
-			},
-			setSideSheetOnSubmit: () => {
-				console.warn("setSideSheetOnSubmit Not implemented");
-			},
-			setSideSheetAdditionalOnClose: () => {
-				console.warn("setSideSheetAdditionalOnClose Not implemented");
-			},
-			setSideSheetProps: () => {
-				console.warn("setSideSheetProps Not implemented");
-			},
-			closeSideSheet: () => {
-				console.warn("closeSideSheet Not implemented");
-			},
-			onCreate: () => {
-				console.warn("onCreate Not implemented");
-			},
-			onUpdate: () => {
-				console.warn("onUpdate Not implemented");
-			},
-			...inquiryPageParams,
-			pageId: pageData?.pageId,
-			updateWorkflowPageData: (data) => updateWorkflowPageData(data, pageData?.pageId),
-			workflowTask: selectedNode,
-			workflowPageData: {
-				...requiredFieldsMap,
-				...workflowPageData
-			},
-			requiredFieldsMap: requiredFieldMapping || null,
-			currentWorkflowStep,
-			orderedWorkflowPageData: orderedPageData
-		};
-	}, [
-		pageData?.pageId,
-		selectedNode,
-		workflowPageData,
-		updateWorkflowPageData,
-		requiredFieldMapping,
-		inquiryPageParams,
-		currentWorkflowStep,
-		orderedPageData
-	]);
-	const currentAssignee = (0, react.useMemo)(() => {
-		if (!playScene?.assignee || !assigneeOptions?.length) return "";
-		const matchingAssignee = assigneeOptions.find((assignee) => assignee.id === playScene.assignee);
-		return matchingAssignee || "";
-	}, [playScene, assigneeOptions]);
-	const pageHeight = (0, react.useMemo)(() => "calc(100vh - 162px)", []);
-	(0, react.useEffect)(() => {
-		if (!selectedNode?.properties?.playSceneId || !selectedPageId || loadingTaskData) {
-			setWorkflowPageData(null);
-			return;
-		}
-		if (taskDataMap?.[selectedNode.properties.playSceneId] && taskDataMap[selectedNode.properties.playSceneId][selectedPageId]) {
-			setWorkflowPageData(taskDataMap[selectedNode.properties.playSceneId][selectedPageId]);
-			return;
-		}
-		if (Object.keys(taskDataMap).length && selectedNode?.properties?.playSceneId && selectedPageId && !playSceneLoading && !loadingTaskData) {
-			setWorkflowPageData((prevData) => {
-				if (!prevData) return {};
-				else if (!Object.keys(prevData).length) return prevData;
-			});
-			return;
-		}
-		setWorkflowPageData(null);
-	}, [
-		selectedNode,
-		selectedPageId,
-		taskDataMap,
-		loadingTaskData,
-		playSceneLoading,
-		workflowTaskSteps
-	]);
-	(0, react.useEffect)(() => {
-		if (workflowTaskSteps?.length) setSelectedPageId(workflowTaskSteps[currentWorkflowStep]?.pageId);
-	}, [workflowTaskSteps, currentWorkflowStep]);
-	(0, react.useEffect)(() => {
-		setLoadingTaskData(true);
-		if (!playSceneLoading && selectedNode?.properties?.playSceneId) {
-			const json = playScene?.data ? JSON.parse(playScene.data) : {};
-			setTaskDataMap(selectedNode.properties.playSceneId, json);
-		}
-		setLoadingTaskData(false);
-	}, [
-		playScene,
-		playSceneLoading,
-		setTaskDataMap,
-		selectedNode
-	]);
-	(0, react.useEffect)(() => {
-		const orderedData = [];
-		if (taskDataMap?.[selectedNode.properties.playSceneId]) workflowTaskSteps.forEach((step) => {
-			orderedData.push(taskDataMap[selectedNode.properties.playSceneId][step.pageId] || {});
-		});
-		setOrderedPageData(orderedData);
-	}, [
-		taskDataMap,
-		workflowTaskSteps,
-		selectedNode
-	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [
-		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__material_ui_core.Card, {
-			variant: "outlined",
-			style: {
-				border: "none",
-				paddingBottom: workflowTaskSteps?.length > 1 ? 10 : 0
-			},
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PageContainer.PrimaryActionHeader, {
-				single: true,
-				title: workflow?.name,
-				buttonLabel: "Submit",
-				handleClick: handleTaskSubmit,
-				pabDisabled: selectedNode?.properties?.state !== UnitStateType.Started,
-				secondaryButtons
-			}), loading && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LinearProgress, {})]
-		}),
-		workflowTaskSteps?.length > 1 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkflowTaskFlow, {
-			steps: workflowTaskSteps,
-			handleClick: handleTaskChange,
-			task: selectedNode
-		}),
-		selectedPageId && workflowPageData ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PageContainer.PageContainer, {
-			user,
-			pageData,
-			pageLoading,
-			widgetParams: pageWidgetParams,
-			disableMargins: true,
-			fromMenu: true,
-			height: pageHeight
-		}, selectedPageId) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: classes.loadingContent,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(CircularProgress, { size: 64 })
-		}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SideSheet.SideSheet, {
-			open: reassignSidesheetOpen,
-			buttonLabel: t("Reassign"),
-			onClose: closeReassignmentSheet,
-			onSubmit: handleReassignment,
-			title: t("Reassign Task"),
-			width: "25%",
-			progress: reassigningAssignee,
-			variant: "indeterminate",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SideSheet.Form, {
-				onSubmit: reassignTask,
-				ref: formRef,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_SideSheet.Field, {
-					component: FluentTextFieldAutoComplete,
-					name: "assignee",
-					id: "assignee",
-					label: t("Assignee"),
-					initialValue: currentAssignee || "",
-					options: assigneeOptions || [],
-					optionKey: "name",
-					variant: "outlined",
-					margin: "dense"
-				})
-			})
-		})
-	] });
-};
-
-//#endregion
-//#region src/UI/components/dataDisplay/SmsDisplay.jsx
-const useStyles$3 = (0, __material_ui_core.makeStyles)((theme) => ({
-	messages: {
-		flex: "1",
-		margin: "0 20px",
-		overflow: "hidden"
-	},
-	messagesBox: {
-		paddingRight: "3%",
-		paddingLeft: "3%",
-		width: "23vw",
-		height: "88%",
-		overflowY: "auto",
-		boxSizing: "border-box",
-		display: "flex",
-		justifyContent: "center"
-	},
-	message: {
-		backgroundColor: "#E9E9EB",
-		borderRadius: "10px",
-		padding: "10px",
-		marginBottom: "10px",
-		alignSelf: "flex-start",
-		overflowWrap: "break-word",
-		margin: theme.spacing(1)
-	},
-	messageSection: {
-		flex: "1",
-		overflowY: "auto",
-		padding: "20px",
-		backgroundImage: `url(${src_assets_images_phone_png.default})`,
-		backgroundSize: "contain",
-		backgroundRepeat: "no-repeat",
-		backgroundPosition: "center",
-		position: "relative",
-		display: "flex",
-		alignItems: "center",
-		justifyContent: "center",
-		height: "calc(100vh - 140px)"
-	}
-}));
-const SmsDisplay = (props) => {
-	const { messages = [], to, from, title, handleClose } = props;
-	const classes = useStyles$3();
-	const [messagesList, setMessagesList] = (0, react.useState)(messages);
-	const { t } = (0, react_i18next.useTranslation)();
-	const messagesBoxRef = (0, react.useRef)(null);
-	const secondaryButtons = (0, react.useMemo)(() => {
-		const buttons = [];
-		if (handleClose) buttons.push({
-			label: t("Close"),
-			component: __fluentui_react_icons.CancelIcon,
-			click: () => handleClose()
-		});
-		return buttons;
-	}, [t, handleClose]);
-	(0, react.useEffect)(() => {
-		if (messagesBoxRef.current) messagesBoxRef.current.scrollTop = messagesBoxRef.current.scrollHeight;
-	}, [messagesList]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Card, {
-		square: true,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PageContainer.PrimaryActionHeader, {
-			hidePAB: true,
-			title,
-			subheader: `To: ${to} . From: ${from}`,
-			secondaryButtons
-		})
-	}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Box, {
-		className: classes.messages,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Box, {
-			className: classes.messageSection,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Box, {
-				className: classes.messagesBox,
-				ref: messagesBoxRef,
-				children: messagesList.map((message, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Grow, {
-					in: true,
-					timeout: 800,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Box, {
-						className: classes.message,
-						dangerouslySetInnerHTML: { __html: message }
-					})
-				}, index))
-			})
-		})
-	})] });
-};
-
-//#endregion
-//#region src/UI/components/dataDisplay/EmailDisplay.jsx
-const useStyles$2 = (0, __material_ui_core.makeStyles)((theme) => ({ htmlContainer: {
-	display: "flex",
-	justifyContent: "center"
-} }));
-const EmailDisplay = (props) => {
-	const { html = "", to, from, title, handleClose } = props;
-	const classes = useStyles$2();
-	const { t } = (0, react_i18next.useTranslation)();
-	const secondaryButtons = (0, react.useMemo)(() => {
-		const buttons = [];
-		if (handleClose) buttons.push({
-			label: t("Close"),
-			component: __fluentui_react_icons.CancelIcon,
-			click: () => handleClose()
-		});
-		return buttons;
-	}, [t, handleClose]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__material_ui_core.Card, {
-			square: true,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PageContainer.PrimaryActionHeader, {
-				hidePAB: true,
-				title,
-				subheader: `To: ${to} . From: ${from}`,
-				secondaryButtons
-			})
-		}),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_EnvironmentRibbon.LayoutUnit, { unit: "sm" }),
-		/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-			className: classes.htmlContainer,
-			children: (0, react_html_parser.default)(html)
-		})
-	] });
-};
-
-//#endregion
-//#region src/workflow/WorkflowContent.jsx
-const useStyles$1 = (0, __material_ui_core.makeStyles)((theme) => ({ root: { height: "100%" } }));
-const WorkflowContent = (props) => {
-	const { selectedNode, workflow, reloadWorkflow, users, groups, handleClose, inquiryPageParams = {} } = props;
-	const buildEnv = require_EnvironmentRibbon.useBuildEnvironment();
-	const classes = useStyles$1({
-		...props,
-		appRibbonSpace: buildEnv ? require_EnvironmentRibbon.APP_RIBBON_SPACE : 0
-	});
-	const user = require_EnvironmentRibbon.useUser();
-	const [{ data: pageData, loading: pageLoading, error: pageError }] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.tenantV1ApiUrl, `page/${selectedNode?.properties?.page?.id}`, {}, !!!selectedNode?.properties?.page?.id, false);
-	const content = (0, react.useMemo)(() => {
-		let res = null;
-		if (selectedNode?.properties?.type === UnitTypeEnums.Scene) res = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkflowUiInterruptContent, {
-			selectedNode,
-			workflow,
-			reloadWorkflow,
-			users,
-			groups,
-			handleClose,
-			inquiryPageParams
-		}, selectedNode.id);
-		else if (selectedNode?.properties?.type === UnitTypeEnums.Sms) res = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SmsDisplay, {
-			messages: [selectedNode?.properties?.sms?.body || ""],
-			to: selectedNode?.properties?.sms?.to || "",
-			from: selectedNode?.properties?.sms?.from || "",
-			title: selectedNode?.properties?.nodeLabel || "",
-			handleClose
-		});
-		else if (selectedNode?.properties?.type === UnitTypeEnums.Mail) res = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EmailDisplay, {
-			html: selectedNode?.properties?.email?.html || selectedNode?.properties?.email?.text || "",
-			to: selectedNode?.properties?.email?.to || "",
-			from: selectedNode?.properties?.email?.from || "",
-			title: selectedNode?.properties?.nodeLabel || "",
-			handleClose
-		});
-		else if (selectedNode?.properties?.page?.id) res = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_PageContainer.PageContainer, {
-			user,
-			pageData,
-			pageLoading,
-			widgetParams: {
-				pageId: pageData?.pageId,
-				entityName: selectedNode?.properties?.page?.entity?.entityName,
-				pbiReportCode: selectedNode?.properties?.page?.pbiReportCode,
-				requiredFieldsMap: selectedNode?.properties?.page?.requiredFieldMapping,
-				udpTagId: selectedNode?.properties?.page?.udpTagId,
-				queryId: selectedNode?.properties?.page?.queryId,
-				inquiryTreeId: selectedNode?.properties?.page?.inquiryTreeId
-			},
-			disableMargins: true,
-			fromMenu: true
-		}, selectedNode?.id);
-		return res;
-	}, [
-		groups,
-		pageData,
-		pageLoading,
-		reloadWorkflow,
-		selectedNode,
-		user,
-		users,
-		workflow,
-		handleClose
-	]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-		className: classes.root,
-		children: content
-	});
-};
-
-//#endregion
-//#region src/hooks/useUpdateSearchParams.js
-const useUpdateSearchParams = () => {
-	const history = (0, react_router_dom.useHistory)();
-	const location = (0, react_router_dom.useLocation)();
-	const updateSearchParams = (params) => {
-		const searchParams = new URLSearchParams(location.search);
-		Object.keys(params).forEach((key) => {
-			if (params[key] !== null) searchParams.set(key, params[key]);
-			else searchParams.delete(key);
-		});
-		history.push({
-			pathname: location.pathname,
-			search: searchParams.toString()
-		});
-	};
-	return updateSearchParams;
-};
-
-//#endregion
-//#region src/workflow/WorkflowContainer.jsx
-const useStyles = (0, __material_ui_core.makeStyles)((theme) => ({
-	root: {
-		flex: 1,
-		minHeight: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,
-		display: "grid",
-		gridTemplateAreas: ["sidebar content"].map((line) => `"${line}"`).join(" "),
-		gridTemplateColumns: "auto 1fr",
-		gridTemplateRows: "auto 1fr"
-	},
-	sidebar: {
-		gridArea: "sidebar",
-		marginRight: theme.spacing(1)
-	},
-	content: {
-		gridArea: "content",
-		display: "flex",
-		flexDirection: "column",
-		position: "relative",
-		zIndex: 1,
-		height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 56}px)`,
-		overflowY: "auto"
-	},
-	menuContent: {
-		marginTop: theme.spacing(1),
-		height: ({ appRibbonSpace }) => `calc(100vh - ${appRibbonSpace + 116}px)`,
-		overflowX: "hidden"
-	},
-	loader: {
-		marginRight: theme.spacing(1),
-		marginLeft: theme.spacing(1)
-	},
-	loadingContent: {
-		flex: 1,
-		display: "flex",
-		flexDirection: "column",
-		alignItems: "center",
-		justifyContent: "center"
-	}
-}));
-const WorkflowContainer = (props) => {
-	const { playId, taskId, autoCollapseNav = true } = props;
-	const buildEnv = require_EnvironmentRibbon.useBuildEnvironment();
-	const classes = useStyles({
-		...props,
-		appRibbonSpace: buildEnv ? require_EnvironmentRibbon.APP_RIBBON_SPACE : 0
-	});
-	const location = (0, react_router_dom.useLocation)();
-	const updateSearchParams = useUpdateSearchParams();
-	const user = require_EnvironmentRibbon.useUser();
-	const setLocationState = require_PageContainer.useSetLocationState();
-	const { t } = (0, react_i18next.useTranslation)();
-	const [menuItemsList, setMenuItemsList] = (0, react.useState)([]);
-	const [selectedNode, setSelectedNode] = (0, react.useState)(null);
-	const [sidebarExpanded, setSidebarExpanded] = (0, react.useState)(true);
-	const [reloadFromPage, setReloadFromPage] = (0, react.useState)(false);
-	const [workflow, setWorkflow] = (0, react.useState)(false);
-	const state = location.state;
-	let searchParamStr = location.search;
-	let searchParams = new URLSearchParams(searchParamStr);
-	const urlPlayId = location.pathname.replace("/workflowtask/", "");
-	const udpPlayId = playId || urlPlayId || (state ? state.playId : searchParams.has("playId") === true ? searchParams.get("playId") : "");
-	const udpTaskId = taskId || (state ? state.taskId : searchParams.has("taskId") === true ? searchParams.get("taskId") : "");
-	const [{ data: workflowPlay, loading: workflowPlayLoading }, reloadWorkflow] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.builderV1ApiUrl, `workflow/play/${udpPlayId}`, {}, !!!udpPlayId, false);
-	const [{ data: users }] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.securityV1ApiUrl, `users?tenantId=${user?.currentTenantId || ""}`, {}, !!!user?.currentTenantId);
-	const [{ data: groups }] = require_EnvironmentRibbon.useAxiosGet(udp_react_stencil_component_library.ConfigService.tenantV1ApiUrl, `groups?tenantId=${user?.currentTenantId || ""}&productId=${udp_react_stencil_component_library.ConfigService.config.UNITY_PRODUCT_ID}`, {}, !!!user?.currentTenantId);
-	const { setSubHeaderActionHasChildren, setNavigationExpanded } = require_EnvironmentRibbon.useShellStore();
-	const handleReloadWorkflow = (0, react.useCallback)(async () => {
-		setReloadFromPage(true);
-		await reloadWorkflow();
-		setReloadFromPage(false);
-	}, [reloadWorkflow]);
-	const handleSelectedNode = (0, react.useCallback)(async (node, menuIndex) => {
-		if (node.isSelectable) {
-			setSelectedNode(node);
-			await handleReloadWorkflow();
-			if (node?.properties?.playSceneId) updateSearchParams({ taskId: node.properties.playSceneId });
-		}
-	}, [updateSearchParams, handleReloadWorkflow]);
-	const handleDropNode = (0, react.useCallback)((sourceNode, targetNode, sourceNodeMenuIndex, targetNodeMenuIndex) => {}, []);
-	const handleSidebarExpandClick = (0, react.useCallback)(() => {
-		setSidebarExpanded((expanded) => !expanded);
-	}, []);
-	(0, react.useEffect)(() => {
-		if (workflowPlay) setWorkflow(workflowPlay);
-	}, [workflowPlay]);
-	(0, react.useEffect)(() => {
-		setLocationState({ label: t("Workflow") });
-	}, [setLocationState, t]);
-	(0, react.useEffect)(() => {
-		if (workflow) setSelectedNode((prevNode) => {
-			if (!!prevNode) {
-				const foundNode = workflow.workflowPlayNode?.children?.find((child) => child.id === prevNode.id);
-				if (!!foundNode) {
-					const updatedNode = { ...prevNode };
-					updatedNode.properties.state = foundNode.state;
-					return updatedNode;
-				} else return prevNode;
-			}
-		});
-	}, [workflow]);
-	(0, react.useEffect)(() => {
-		if (workflow) {
-			const list = [];
-			const updatedMenu = transformWorkflowPlayTree(workflow.workflowPlayNode);
-			if (updatedMenu) list.push(updatedMenu);
-			setMenuItemsList(list);
-		}
-	}, [workflow]);
-	(0, react.useEffect)(() => {
-		if (!selectedNode) {
-			const menu = menuItemsList[0];
-			if (menu) {
-				if (!!udpTaskId) {
-					const matchingTaskNode = menu.children.find((child) => child?.properties?.playSceneId === udpTaskId);
-					setSelectedNode(matchingTaskNode || menu.children[0] || null);
-				} else {
-					const firstSelectableMenuItem = menu?.children?.find((item) => item.isSelectable);
-					setSelectedNode(firstSelectableMenuItem || null);
-				}
-				if (autoCollapseNav) setNavigationExpanded(false);
-			}
-		}
-	}, [
-		udpTaskId,
-		menuItemsList,
-		selectedNode,
-		setNavigationExpanded,
-		autoCollapseNav
-	]);
-	(0, react.useEffect)(() => {
-		setSubHeaderActionHasChildren(false);
-	}, [setSubHeaderActionHasChildren]);
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_dnd.DndProvider, {
-		backend: react_dnd_html5_backend.HTML5Backend,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-			className: classes.root,
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: classes.sidebar,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UtilitySideBar.UtilitySideBar, {
-					title: "Workflow",
-					isUsingChildren: true,
-					resizable: true,
-					removePadding: true,
-					removeTopLayoutUnit: true,
-					onUtilitySidebarToggleExpandClick: handleSidebarExpandClick,
-					collapsedWidth: 64,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						className: classes.menuContent,
-						children: [menuItemsList?.length > 0 && (!workflowPlayLoading || reloadFromPage) && menuItemsList.map((menuItems, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							className: classes.nodeContainer,
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkflowTreeMenu, {
-								menuItems,
-								onSelectNode: handleSelectedNode,
-								onDropNode: handleDropNode,
-								menuIndex: index,
-								selectedNodeId: selectedNode?.id,
-								selectedNodeParentId: selectedNode?.parentId,
-								sidebarExpanded,
-								treeViewMode: require_EnvironmentRibbon.TreeViewModeEnums.Classic
-							})
-						}, menuItems.id)), workflowPlayLoading && !reloadFromPage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							className: classes.loader,
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_UtilitySideBar.NodeLoader, { loading: workflowPlayLoading })
-						})]
-					}, playId)
-				})
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: classes.content,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(WorkflowContent, {
-					selectedNode,
-					workflow,
-					reloadWorkflow: handleReloadWorkflow,
-					users,
-					groups
-				})
-			})]
-		})
-	});
-};
-
-//#endregion
-Object.defineProperty(exports, 'CircularProgress', {
-  enumerable: true,
-  get: function () {
-    return CircularProgress;
-  }
-});
-Object.defineProperty(exports, 'FluentTextFieldAutoComplete', {
-  enumerable: true,
-  get: function () {
-    return FluentTextFieldAutoComplete;
-  }
-});
-Object.defineProperty(exports, 'LinearProgress', {
-  enumerable: true,
-  get: function () {
-    return LinearProgress;
-  }
-});
-Object.defineProperty(exports, 'UnitStateType', {
-  enumerable: true,
-  get: function () {
-    return UnitStateType;
-  }
-});
-Object.defineProperty(exports, 'WorkflowContainer', {
-  enumerable: true,
-  get: function () {
-    return WorkflowContainer;
-  }
-});
-Object.defineProperty(exports, 'WorkflowContent', {
-  enumerable: true,
-  get: function () {
-    return WorkflowContent;
-  }
-});
-Object.defineProperty(exports, 'WorkflowTreeMenu', {
-  enumerable: true,
-  get: function () {
-    return WorkflowTreeMenu;
-  }
-});
-Object.defineProperty(exports, 'formatDateToLocaleString', {
-  enumerable: true,
-  get: function () {
-    return formatDateToLocaleString;
-  }
-});
-Object.defineProperty(exports, 'toUtcDate', {
-  enumerable: true,
-  get: function () {
-    return toUtcDate;
-  }
-});
-Object.defineProperty(exports, 'transformWorkflowPlayTree', {
-  enumerable: true,
-  get: function () {
-    return transformWorkflowPlayTree;
-  }
-});
-Object.defineProperty(exports, 'useWorkflowStore', {
-  enumerable: true,
-  get: function () {
-    return useWorkflowStore;
-  }
-});
-//# sourceMappingURL=WorkflowContainer-Bm1FHgJq.cjs.map