@vention/machine-apps-components 0.6.27 → 1.0.0

package/index.esm.js

@@ -1,3 +1,4 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import React, { createContext, useState, useEffect, useCallback, useContext, useMemo, memo, useRef, forwardRef, useImperativeHandle } from 'react';
 import i18n from 'i18next';
 import { initReactI18next, useTranslation } from 'react-i18next';
@@ -9,7 +10,6 @@ import 'dayjs/locale/en';
 import 'dayjs/locale/fr';
 import 'dayjs/locale/de';
 import 'dayjs/locale/es';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Box, useTheme, Typography, Button, InputAdornment, IconButton, TableContainer, Paper, Table, TableHead, TableRow, TableCell, TableBody, List, ListItem, Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material';
 import { VentionSelect, VentionModalBase, VentionIcon, VentionTextInput, COLORS, VentionButton, VentionStatusIndicator, VentionSpinner, VentionAlert, VentionDropZone, VentionUploadFile, VentionIconButton } from '@vention/machine-ui';
 import { tss } from 'tss-react/mui';
@@ -2284,7 +2284,7 @@ if (!i18n.isInitialized) {
     try {
       const stored = localStorage.getItem("machine-apps-components:timezone");
       return stored || "auto";
-    } catch (_unused) {
+    } catch (_a) {
       return "auto";
     }
   };
@@ -2381,7 +2381,7 @@ const I18nProvider = function I18nProvider({
         return normalizeLocale(stored, supportedLanguages);
       }
       return normalizeLocale(defaultLocale, supportedLanguages);
-    } catch (_unused) {
+    } catch (_a) {
       return normalizeLocale(defaultLocale, supportedLanguages);
     }
   });
@@ -2393,7 +2393,7 @@ const I18nProvider = function I18nProvider({
         return stored;
       }
       return defaultUnitSystem;
-    } catch (_unused2) {
+    } catch (_a) {
       return defaultUnitSystem;
     }
   });
@@ -2402,7 +2402,7 @@ const I18nProvider = function I18nProvider({
     try {
       const stored = localStorage.getItem(STORAGE_KEYS.timezone);
       return stored || defaultTimezone;
-    } catch (_unused3) {
+    } catch (_a) {
       return defaultTimezone;
     }
   });
@@ -2453,7 +2453,7 @@ const I18nProvider = function I18nProvider({
     setUnitSystem,
     setTimezone
   };
-  return /*#__PURE__*/jsx(I18nContext.Provider, {
+  return jsx(I18nContext.Provider, {
     value: value,
     children: children
   });
@@ -2624,9 +2624,9 @@ function inchesToMm(inches) {
   return inches * INCH_TO_MM;
 }
 function formatValueToDisplayUnit(value, unitSystem, options) {
-  var _options$decimals;
-  const decimals = (_options$decimals = options == null ? void 0 : options.decimals) != null ? _options$decimals : 2;
-  const showUnit = (options == null ? void 0 : options.showUnit) !== false;
+  var _a;
+  const decimals = (_a = options === null || options === void 0 ? void 0 : options.decimals) !== null && _a !== void 0 ? _a : 2;
+  const showUnit = (options === null || options === void 0 ? void 0 : options.showUnit) !== false;
   if (unitSystem === "imperial") {
     const inches = mmToInches(value);
     return showUnit ? `${inches.toFixed(decimals)} in` : inches.toFixed(decimals);
@@ -3101,12 +3101,12 @@ const I18nSettings = function I18nSettings({
   const handleLocaleChange = function handleLocaleChange(event) {
     setLocale(event.target.value);
   };
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: cx(classes.container, className),
     sx: sx,
-    children: [/*#__PURE__*/jsx(Box, {
+    children: [jsx(Box, {
       className: classes.settingItem,
-      children: /*#__PURE__*/jsx(VentionSelect, {
+      children: jsx(VentionSelect, {
         size: "xx-large",
         variant: "outlined",
         labelText: t("common.settings.unitSystem"),
@@ -3114,9 +3114,9 @@ const I18nSettings = function I18nSettings({
         onChange: handleUnitSystemChange,
         menuItems: unitSystemOptions
       })
-    }), /*#__PURE__*/jsx(Box, {
+    }), jsx(Box, {
       className: classes.settingItem,
-      children: /*#__PURE__*/jsx(VentionSelect, {
+      children: jsx(VentionSelect, {
         size: "xx-large",
         variant: "outlined",
         labelText: t("common.settings.timezone"),
@@ -3124,9 +3124,9 @@ const I18nSettings = function I18nSettings({
         onChange: handleTimezoneChange,
         menuItems: timezoneOptions
       })
-    }), supportedLanguages.length > 1 && /*#__PURE__*/jsx(Box, {
+    }), supportedLanguages.length > 1 && jsx(Box, {
       className: classes.settingItem,
-      children: /*#__PURE__*/jsx(VentionSelect, {
+      children: jsx(VentionSelect, {
         size: "xx-large",
         variant: "outlined",
         labelText: t("common.settings.locale"),
@@ -5530,7 +5530,7 @@ function TimeLabel({
   const [timeLabel, setTimeLabel] = useState(() => {
     try {
       return formatDate(Date.now(), "HH:mm");
-    } catch (_unused) {
+    } catch (_a) {
       return new Date().toLocaleTimeString([], {
         hour: "numeric",
         minute: "2-digit"
@@ -5541,7 +5541,7 @@ function TimeLabel({
     try {
       const formatted = formatDate(Date.now(), "HH:mm");
       setTimeLabel(formatted);
-    } catch (_unused2) {
+    } catch (_a) {
       setTimeLabel(new Date().toLocaleTimeString([], {
         hour: "numeric",
         minute: "2-digit"
@@ -5553,7 +5553,7 @@ function TimeLabel({
       try {
         const formatted = formatDate(Date.now(), "HH:mm");
         setTimeLabel(formatted);
-      } catch (_unused3) {
+      } catch (_a) {
         setTimeLabel(new Date().toLocaleTimeString([], {
           hour: "numeric",
           minute: "2-digit"
@@ -5562,9 +5562,9 @@ function TimeLabel({
     }, 1000);
     return () => clearInterval(intervalId);
   }, [formatDate, timezone, locale]);
-  return /*#__PURE__*/jsx(Typography, {
+  return jsx(Typography, {
     className: className,
-    color: color != null ? color : theme.palette.common.white,
+    color: color !== null && color !== void 0 ? color : theme.palette.common.white,
     children: timeLabel
   });
 }
@@ -5576,14 +5576,12 @@ function TimeLabel({
 const isTouchScreenDevice = () => {
   return "ontouchstart" in window || navigator.maxTouchPoints > 0;
 };
-
 /**
  * Closes the custom UI by sending a message to the parent window
  */
 const closeCustomUi = () => {
   window.parent.postMessage("closeCustomUi", "*");
 };
-
 /**
  * Navigates to a specific route in the Control Center
  * @param route - The route to navigate to (remoteSupport or controlCenterHomepage)
@@ -5624,38 +5622,38 @@ const NavigationConfirmationModal = function NavigationConfirmationModal(props)
       defaultValue: "Go to Remote Support"
     });
   };
-  return /*#__PURE__*/jsx(VentionModalBase, {
+  return jsx(VentionModalBase, {
     isOpen: isOpen,
     onClose: onClose,
     modalSize: "xx-large",
     isTouchDevice: isTouchScreenDevice(),
     width: "1312px",
-    children: /*#__PURE__*/jsxs(Box, {
+    children: jsxs(Box, {
       className: classes.modalContent,
-      children: [/*#__PURE__*/jsx(Box, {
+      children: [jsx(Box, {
         className: classes.iconContainer,
-        children: /*#__PURE__*/jsx(VentionIcon, {
+        children: jsx(VentionIcon, {
           type: "alert-triangle-filled",
           size: 56,
           color: "#F59E0B"
         })
-      }), /*#__PURE__*/jsx(Typography, {
+      }), jsx(Typography, {
         className: classes.title,
         children: t("navigation.modal.exit.title", {
           defaultValue: "You are about to exit the application"
         })
-      }), /*#__PURE__*/jsx(Typography, {
+      }), jsx(Typography, {
         className: classes.body,
         children: t("navigation.modal.exit.message", {
           defaultValue: "Please make sure your changes are saved before you leave the app."
         })
-      }), /*#__PURE__*/jsx(Button, {
+      }), jsx(Button, {
         onClick: handleConfirm,
         className: classes.button,
         disableRipple: true,
-        children: /*#__PURE__*/jsx(Box, {
+        children: jsx(Box, {
           className: classes.buttonLabel,
-          children: /*#__PURE__*/jsx(Typography, {
+          children: jsx(Typography, {
             className: classes.buttonText,
             children: getButtonText()
           })
@@ -5678,11 +5676,11 @@ const useStyles$g = tss.create(({
   iconContainer: {
     marginBottom: theme.spacing(7)
   },
-  title: Object.assign({}, theme.typography.hmiText28SemiBold, {
+  title: Object.assign(Object.assign({}, theme.typography.hmiText28SemiBold), {
     textAlign: "center",
     marginBottom: theme.spacing(6)
   }),
-  body: Object.assign({}, theme.typography.hmiText22Regular, {
+  body: Object.assign(Object.assign({}, theme.typography.hmiText22Regular), {
     textAlign: "center"
   }),
   button: {
@@ -5770,29 +5768,29 @@ const PasswordProtectionModal = function PasswordProtectionModal(props) {
       setIsKeyboardVisible(false);
     };
   }, [isOpen]);
-  return /*#__PURE__*/jsxs(Fragment, {
-    children: [/*#__PURE__*/jsx("style", {
+  return jsxs(Fragment, {
+    children: [jsx("style", {
       children: isKeyboardVisible && `
           [data-testid="vention-modal-container"] {
             transform: translateY(-22.5vh) !important;
             transition: transform 0.3s ease-out;
           }
         `
-    }), /*#__PURE__*/jsx(VentionModalBase, {
+    }), jsx(VentionModalBase, {
       isOpen: isOpen,
       onClose: handleClose,
       modalSize: "x-large",
       isTouchDevice: isTouchScreenDevice(),
       width: "1120px",
       backDropClickClosable: false,
-      children: /*#__PURE__*/jsxs(Box, {
+      children: jsxs(Box, {
         className: classes.modalContent,
-        children: [/*#__PURE__*/jsx(Typography, {
+        children: [jsx(Typography, {
           className: classes.title,
           children: t("navigation.modal.password.title", {
             defaultValue: "Administrator login required"
           })
-        }), /*#__PURE__*/jsx(Box, {
+        }), jsx(Box, {
           component: "form",
           id: "password-form",
           onSubmit: event => {
@@ -5800,7 +5798,7 @@ const PasswordProtectionModal = function PasswordProtectionModal(props) {
             handleConfirm();
           },
           className: classes.inputContainer,
-          children: /*#__PURE__*/jsx(VentionTextInput, {
+          children: jsx(VentionTextInput, {
             label: t("navigation.modal.password.label", {
               defaultValue: "Password"
             }),
@@ -5817,14 +5815,14 @@ const PasswordProtectionModal = function PasswordProtectionModal(props) {
             fullWidth: true,
             size: "xx-large",
             InputProps: {
-              endAdornment: /*#__PURE__*/jsx(InputAdornment, {
+              endAdornment: jsx(InputAdornment, {
                 position: "end",
-                children: /*#__PURE__*/jsx(IconButton, {
+                children: jsx(IconButton, {
                   onClick: () => setShowPassword(!showPassword),
                   edge: "end",
                   disableRipple: true,
                   type: "button",
-                  children: /*#__PURE__*/jsx(VentionIcon, {
+                  children: jsx(VentionIcon, {
                     type: showPassword ? "eye-closed" : "eye",
                     size: 28,
                     color: "#0f172a"
@@ -5833,14 +5831,14 @@ const PasswordProtectionModal = function PasswordProtectionModal(props) {
               })
             }
           })
-        }), /*#__PURE__*/jsx(Button, {
+        }), jsx(Button, {
           className: classes.button,
           disableRipple: true,
           type: "submit",
           form: "password-form",
-          children: /*#__PURE__*/jsx(Box, {
+          children: jsx(Box, {
             className: classes.buttonLabel,
-            children: /*#__PURE__*/jsx(Typography, {
+            children: jsx(Typography, {
               className: classes.buttonText,
               children: t("navigation.modal.password.confirm", {
                 defaultValue: "Confirm"
@@ -5928,7 +5926,7 @@ const NavigationBarItem = function NavigationBarItem(props) {
   const {
     t
   } = useI18n();
-  const isActive = (location == null ? void 0 : location.pathname) === path;
+  const isActive = (location === null || location === void 0 ? void 0 : location.pathname) === path;
   const currentIcon = isDisabled && iconDisabled ? iconDisabled : icon;
   const handleItemClick = function handleItemClick() {
     if (isDisabled || !handleNavigate || !setPasswordProtectedItem) return;
@@ -5938,7 +5936,7 @@ const NavigationBarItem = function NavigationBarItem(props) {
     }
     onClick ? onClick() : handleNavigate(path);
   };
-  return /*#__PURE__*/jsxs(Button, {
+  return jsxs(Button, {
     disableRipple: true,
     disabled: isDisabled,
     onClick: handleItemClick,
@@ -5946,10 +5944,10 @@ const NavigationBarItem = function NavigationBarItem(props) {
       [classes.active]: isActive,
       [classes.disabled]: isDisabled
     }),
-    children: [/*#__PURE__*/jsx(Box, {
+    children: [jsx(Box, {
       className: classes.navIcon,
       children: currentIcon
-    }), /*#__PURE__*/jsx(Typography, {
+    }), jsx(Typography, {
       className: classes.navLabel,
       children: t(label, {
         defaultValue: label
@@ -6010,7 +6008,7 @@ const Z_INDEX = {
 
 const iconSize = 32;
 const NavigationBarRoot = function NavigationBarRoot(props) {
-  var _passwordProtectedIte;
+  var _a;
   const {
     children,
     showTimer = true,
@@ -6047,7 +6045,7 @@ const NavigationBarRoot = function NavigationBarRoot(props) {
   useEffect(function updateCurrentPassword() {
     const currentPage = React.Children.toArray(children).find(child => /*#__PURE__*/React.isValidElement(child) && child.type === NavigationBarItem && child.props.path === location.pathname);
     const currentPagePassword = /*#__PURE__*/React.isValidElement(currentPage) ? currentPage.props.password : undefined;
-    setCurrentPassword(currentPagePassword != null ? currentPagePassword : null);
+    setCurrentPassword(currentPagePassword !== null && currentPagePassword !== void 0 ? currentPagePassword : null);
   }, [location.pathname, children]);
   const handleControlCenterClick = function handleControlCenterClick() {
     if (isControlCenterDisabled) return;
@@ -6079,7 +6077,7 @@ const NavigationBarRoot = function NavigationBarRoot(props) {
     if (child.type !== NavigationBarItem) return child;
     const itemId = child.props.id;
     const isDisabled = disabledSet.has(itemId);
-    return /*#__PURE__*/React.cloneElement(child, Object.assign({}, child.props, {
+    return /*#__PURE__*/React.cloneElement(child, Object.assign(Object.assign({}, child.props), {
       isDisabled: isDisabled,
       location: location,
       handleNavigate: handleNavigate,
@@ -6093,23 +6091,23 @@ const NavigationBarRoot = function NavigationBarRoot(props) {
   const handleClosePassword = function handleClosePassword() {
     setPasswordProtectedItem(null);
   };
-  return /*#__PURE__*/jsxs(Fragment, {
-    children: [/*#__PURE__*/jsx(NavigationConfirmationModal, {
+  return jsxs(Fragment, {
+    children: [jsx(NavigationConfirmationModal, {
       isOpen: modalDestination !== null,
       destination: modalDestination,
       onClose: handleCloseConfirmation
-    }), /*#__PURE__*/jsx(PasswordProtectionModal, {
+    }), jsx(PasswordProtectionModal, {
       isOpen: passwordProtectedItem !== null,
       onClose: handleClosePassword,
       onSuccess: handlePasswordSuccess,
-      correctPassword: (_passwordProtectedIte = passwordProtectedItem == null ? void 0 : passwordProtectedItem.password) != null ? _passwordProtectedIte : ""
-    }), /*#__PURE__*/jsx("footer", {
+      correctPassword: (_a = passwordProtectedItem === null || passwordProtectedItem === void 0 ? void 0 : passwordProtectedItem.password) !== null && _a !== void 0 ? _a : ""
+    }), jsx("footer", {
       className: classes.root,
-      children: /*#__PURE__*/jsxs(Box, {
+      children: jsxs(Box, {
         className: classes.container,
-        children: [/*#__PURE__*/jsx(Box, {
+        children: [jsx(Box, {
           className: classes.sideClusterLeft,
-          children: showControlCenterButton && /*#__PURE__*/jsx(VentionButton, {
+          children: showControlCenterButton && jsx(VentionButton, {
             disableRipple: true,
             onClick: handleControlCenterClick,
             disabled: isControlCenterDisabled,
@@ -6120,7 +6118,7 @@ const NavigationBarRoot = function NavigationBarRoot(props) {
               opacity: isControlCenterDisabled ? 0.5 : 1,
               cursor: isControlCenterDisabled ? "not-allowed" : "pointer"
             },
-            children: /*#__PURE__*/jsx(Typography, {
+            children: jsx(Typography, {
               className: classes.sideButtonLabel,
               style: {
                 color: isControlCenterDisabled ? getFadedColor(theme.palette.common.white) : theme.palette.common.white
@@ -6130,12 +6128,12 @@ const NavigationBarRoot = function NavigationBarRoot(props) {
               })
             })
           })
-        }), /*#__PURE__*/jsx("nav", {
+        }), jsx("nav", {
           className: classes.tabBarButtonContainer,
           children: processedChildren
-        }), /*#__PURE__*/jsxs(Box, {
+        }), jsxs(Box, {
           className: classes.sideClusterRight,
-          children: [showSupportButton && /*#__PURE__*/jsx(VentionButton, {
+          children: [showSupportButton && jsx(VentionButton, {
             disableRipple: true,
             onClick: handleSupportClick,
             disabled: isSupportDisabled,
@@ -6146,12 +6144,12 @@ const NavigationBarRoot = function NavigationBarRoot(props) {
               opacity: isSupportDisabled ? 0.5 : 1,
               cursor: isSupportDisabled ? "not-allowed" : "pointer"
             },
-            iconLeft: /*#__PURE__*/jsx(VentionIcon, {
+            iconLeft: jsx(VentionIcon, {
               size: iconSize,
               color: isSupportDisabled ? getFadedColor(theme.palette.common.white) : theme.palette.common.white,
               type: "headset-filled"
             }),
-            children: /*#__PURE__*/jsx(Typography, {
+            children: jsx(Typography, {
               className: classes.sideButtonLabel,
               style: {
                 color: isSupportDisabled ? getFadedColor(theme.palette.common.white) : theme.palette.common.white
@@ -6160,7 +6158,7 @@ const NavigationBarRoot = function NavigationBarRoot(props) {
                 defaultValue: "Support"
               })
             })
-          }), showTimer && /*#__PURE__*/jsx(TimeLabel, {
+          }), showTimer && jsx(TimeLabel, {
             className: classes.timeLabel,
             color: theme.palette.common.white
           })]
@@ -6244,7 +6242,7 @@ const useStyles$d = tss.withParams().create(({
     fontWeight: 600,
     lineHeight: "32px"
   },
-  timeLabel: Object.assign({}, theme.typography.hmiText22Regular, {
+  timeLabel: Object.assign(Object.assign({}, theme.typography.hmiText22Regular), {
     fontWeight: 600
   }),
   tabBarButtonContainer: {
@@ -6346,7 +6344,7 @@ const StatusTopBarButton = function StatusTopBarButton(props) {
       onClick();
     }
   };
-  return /*#__PURE__*/jsx(VentionButton, {
+  return jsx(VentionButton, {
     variant: variant,
     onClick: handleClick,
     disabled: disabled || !onClick,
@@ -6362,11 +6360,11 @@ const StatusTopBarButton = function StatusTopBarButton(props) {
         backgroundColor: finalBackgroundColorHover || finalBackgroundColor
       }
     },
-    iconLeft: finalIcon ? /*#__PURE__*/jsx(Box, {
+    iconLeft: finalIcon ? jsx(Box, {
       className: classes.iconWrapper,
       children: finalIcon
     }) : undefined,
-    children: /*#__PURE__*/jsx(Typography, {
+    children: jsx(Typography, {
       className: classes.actionLabel,
       style: {
         color: finalTextColor
@@ -6416,24 +6414,24 @@ const StatusTopBarRoot = function StatusTopBarRoot(props) {
   });
   const visibleButtons = buttonConfigs.filter(config => config.visible !== false);
   const hasVisibleButtons = visibleButtons.length > 0;
-  return /*#__PURE__*/jsxs("header", {
+  return jsxs("header", {
     className: classes.root,
-    children: [/*#__PURE__*/jsxs("div", {
+    children: [jsxs("div", {
       className: classes.content,
-      children: [/*#__PURE__*/jsx("div", {
+      children: [jsx("div", {
         className: classes.leftArea,
-        children: status && /*#__PURE__*/jsx(VentionStatusIndicator, {
+        children: status && jsx(VentionStatusIndicator, {
           size: "xx-large",
           dotColor: status.color,
           label: status.label
         })
-      }), hasVisibleButtons && /*#__PURE__*/jsx("div", {
+      }), hasVisibleButtons && jsx("div", {
         className: classes.rightArea,
-        children: visibleButtons.map(config => /*#__PURE__*/jsx(StatusTopBarButton, Object.assign({}, config, {
+        children: visibleButtons.map(config => jsx(StatusTopBarButton, Object.assign({}, config, {
           visible: true
         }), config.id))
       })]
-    }), /*#__PURE__*/jsx("div", {
+    }), jsx("div", {
       className: classes.bottomBorder
     })]
   });
@@ -6490,9 +6488,9 @@ const Sidebar = function Sidebar(props) {
   } = useStyles$a({
     variant
   });
-  return /*#__PURE__*/jsx(Box, {
+  return jsx(Box, {
     className: classes.container,
-    children: items.map(item => /*#__PURE__*/jsx(SidebarItemComponent, {
+    children: items.map(item => jsx(SidebarItemComponent, {
       item: item,
       variant: variant
     }, item.id))
@@ -6511,7 +6509,7 @@ const SidebarItemComponent = function SidebarItemComponent(props) {
     variant
   });
   const isDisabled = item.state === "disabled";
-  return /*#__PURE__*/jsx(Button, {
+  return jsx(Button, {
     className: classes.button,
     onClick: item.onClick,
     disabled: isDisabled,
@@ -6519,30 +6517,30 @@ const SidebarItemComponent = function SidebarItemComponent(props) {
     disableFocusRipple: true,
     disableTouchRipple: true,
     "data-testid": `sidebar-item-${item.id}`,
-    children: /*#__PURE__*/jsxs(Box, {
+    children: jsxs(Box, {
       className: classes.content,
-      children: [/*#__PURE__*/jsxs(Box, {
+      children: [jsxs(Box, {
         className: classes.leftSection,
-        children: [item.icon ? /*#__PURE__*/jsx(Box, {
+        children: [item.icon ? jsx(Box, {
           className: classes.iconWrapper,
           children: item.icon
-        }) : /*#__PURE__*/jsx(Box, {
+        }) : jsx(Box, {
           className: classes.iconPlaceholder
-        }), /*#__PURE__*/jsxs(Box, {
+        }), jsxs(Box, {
           className: classes.textContainer,
-          children: [/*#__PURE__*/jsx(Typography, {
+          children: [jsx(Typography, {
             className: classes.title,
             children: item.title
-          }), item.subtitle && /*#__PURE__*/jsx(Typography, {
+          }), item.subtitle && jsx(Typography, {
             className: classes.subtitle,
             children: item.subtitle
           })]
         })]
-      }), item.iconType && /*#__PURE__*/jsx(Box, {
+      }), item.iconType && jsx(Box, {
         className: classes.rightSection,
-        children: /*#__PURE__*/jsx(Box, {
+        children: jsx(Box, {
           className: classes.rightIcon,
-          children: /*#__PURE__*/jsx(VentionIcon, {
+          children: jsx(VentionIcon, {
             type: item.iconType,
             size: ICON_SIZE
           })
@@ -6588,7 +6586,7 @@ const useSidebarItemStyles = tss.withParams().create(function createSidebarItemS
       transition: "all 0.2s ease"
     };
     if (isAccentVariant) {
-      return Object.assign({}, baseStyles, {
+      return Object.assign(Object.assign({}, baseStyles), {
         borderRadius: 0,
         backgroundColor: isActive ? theme.palette.background.surface1active : "transparent",
         border: "none",
@@ -6598,7 +6596,7 @@ const useSidebarItemStyles = tss.withParams().create(function createSidebarItemS
         }
       });
     }
-    return Object.assign({}, baseStyles, {
+    return Object.assign(Object.assign({}, baseStyles), {
       borderRadius: theme.spacing(2),
       backgroundColor: isActive ? theme.palette.background.surface1active : theme.palette.background.paper,
       border: `1px solid ${isActive ? theme.palette.border.main : theme.palette.divider}`,
@@ -6640,10 +6638,10 @@ const useSidebarItemStyles = tss.withParams().create(function createSidebarItemS
       flexDirection: "column",
       gap: theme.spacing(1)
     },
-    title: Object.assign({}, theme.typography.heading24SemiBold, {
+    title: Object.assign(Object.assign({}, theme.typography.heading24SemiBold), {
       color: isDisabled ? theme.palette.text.disabled : theme.palette.text.primary
     }),
-    subtitle: Object.assign({}, theme.typography.hmiText20Regular, {
+    subtitle: Object.assign(Object.assign({}, theme.typography.hmiText20Regular), {
       color: isDisabled ? theme.palette.text.disabled : theme.palette.text.primary
     }),
     rightSection: {
@@ -6770,13 +6768,13 @@ const LogsTable = /*#__PURE__*/memo(({
     };
   }, [onLoadMoreLogs, hasMoreLogs]);
   if (_isLoading) {
-    return /*#__PURE__*/jsx(Box, {
+    return jsx(Box, {
       className: classes.tableSection,
-      children: /*#__PURE__*/jsxs(Box, {
+      children: jsxs(Box, {
         className: classes.centerState,
-        children: [/*#__PURE__*/jsx(VentionSpinner, {
+        children: [jsx(VentionSpinner, {
           size: "large"
-        }), /*#__PURE__*/jsx(Typography, {
+        }), jsx(Typography, {
           variant: "heading24Medium",
           sx: {
             marginTop: 2
@@ -6789,11 +6787,11 @@ const LogsTable = /*#__PURE__*/memo(({
     });
   }
   if (_error) {
-    return /*#__PURE__*/jsx(Box, {
+    return jsx(Box, {
       className: classes.tableSection,
-      children: /*#__PURE__*/jsx(Box, {
+      children: jsx(Box, {
         className: classes.errorState,
-        children: /*#__PURE__*/jsx(VentionAlert, {
+        children: jsx(VentionAlert, {
           severity: "error",
           title: t("logs.error.loading", {
             defaultValue: "Error loading logs"
@@ -6805,14 +6803,14 @@ const LogsTable = /*#__PURE__*/memo(({
     });
   }
   if (!_logs || _logs.length === 0) {
-    return /*#__PURE__*/jsx(Box, {
+    return jsx(Box, {
       className: classes.tableSection,
-      children: /*#__PURE__*/jsxs(Box, {
+      children: jsxs(Box, {
         className: classes.centerState,
-        children: [emptyStateIcon && /*#__PURE__*/jsx(Box, {
+        children: [emptyStateIcon && jsx(Box, {
           className: classes.emptyStateIcon,
           children: emptyStateIcon
-        }), /*#__PURE__*/jsx(Typography, {
+        }), jsx(Typography, {
           variant: "heading24Medium",
           children: emptyMessage
         })]
@@ -6833,20 +6831,20 @@ const LogsTable = /*#__PURE__*/memo(({
   };
   const renderTypeIcon = level => {
     if (level === "error") {
-      return /*#__PURE__*/jsx(VentionIcon, {
+      return jsx(VentionIcon, {
         size: 20,
         type: "alert-circle-filled",
         color: theme.palette.error.main
       });
     }
     if (level === "warning") {
-      return /*#__PURE__*/jsx(VentionIcon, {
+      return jsx(VentionIcon, {
         size: 20,
         type: "alert-triangle-filled",
         color: theme.palette.warning.main
       });
     }
-    return /*#__PURE__*/jsx(VentionIcon, {
+    return jsx(VentionIcon, {
       size: 20,
       type: "info-circle-filled",
       color: theme.palette.info.main
@@ -6859,7 +6857,7 @@ const LogsTable = /*#__PURE__*/memo(({
         return dateStr;
       }
       return formatDate(timestamp, "YYYY-MM-DD h:mm:ssa");
-    } catch (_unused) {
+    } catch (_a) {
       try {
         const date = new Date(dateStr);
         if (isNaN(date.getTime())) return dateStr;
@@ -6872,63 +6870,63 @@ const LogsTable = /*#__PURE__*/memo(({
           second: "2-digit",
           hour12: true
         });
-      } catch (_unused2) {
+      } catch (_b) {
         return dateStr;
       }
     }
   };
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: classes.tableSection,
-    children: [/*#__PURE__*/jsx(TableContainer, {
+    children: [jsx(TableContainer, {
       component: Paper,
       className: classes.tableContainer,
-      children: /*#__PURE__*/jsxs(Table, {
+      children: jsxs(Table, {
         stickyHeader: true,
         className: classes.table,
-        children: [/*#__PURE__*/jsx(TableHead, {
+        children: [jsx(TableHead, {
           className: classes.tableHead,
-          children: /*#__PURE__*/jsxs(TableRow, {
-            children: [/*#__PURE__*/jsx(TableCell, {
+          children: jsxs(TableRow, {
+            children: [jsx(TableCell, {
               className: classes.iconHeaderCell
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: cx(classes.tableHeaderCell, classes.dateColumn),
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: classes.tableText,
                 children: t("logs.table.date", {
                   defaultValue: "Date"
                 })
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: cx(classes.tableHeaderCell, classes.typeColumn),
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: classes.tableText,
                 children: t("logs.table.type", {
                   defaultValue: "Type"
                 })
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: cx(classes.tableHeaderCell, classes.codeColumn),
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: classes.tableText,
                 children: t("logs.table.code", {
                   defaultValue: "Code"
                 })
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: cx(classes.tableHeaderCell, classes.messageColumn),
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: classes.tableText,
                 children: t("logs.table.message", {
                   defaultValue: "Message"
                 })
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: cx(classes.tableHeaderCell, classes.descriptionColumn),
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: classes.tableText,
                 children: t("logs.table.description", {
@@ -6937,52 +6935,52 @@ const LogsTable = /*#__PURE__*/memo(({
               })
             })]
           })
-        }), /*#__PURE__*/jsx(TableBody, {
-          children: _logs.map(log => /*#__PURE__*/jsxs(TableRow, {
+        }), jsx(TableBody, {
+          children: _logs.map(log => jsxs(TableRow, {
             hover: true,
             onClick: onLogClick ? () => onLogClick(log) : undefined,
             className: cx(classes.row, onLogClick ? classes.clickableRow : undefined),
-            children: [/*#__PURE__*/jsx(TableCell, {
+            children: [jsx(TableCell, {
               className: classes.iconCell,
-              children: /*#__PURE__*/jsx(Box, {
+              children: jsx(Box, {
                 className: classes.iconWrapper,
                 children: renderTypeIcon(log.level)
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: classes.truncateCell,
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: cx(classes.tableText, classes.truncateText),
                 children: formatLogDate(log.date)
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: cx(classes.typeCell, classes.truncateCell, getTypeClassName(log.level)),
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: cx(classes.tableText, classes.truncateText),
                 children: t(`logs.type.${log.level}`, {
                   defaultValue: log.level
                 })
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: classes.truncateCell,
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: cx(classes.tableText, classes.truncateText),
                 title: log.code,
                 children: log.code
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: classes.truncateCell,
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: cx(classes.tableText, classes.truncateText),
                 title: log.message,
                 children: log.message
               })
-            }), /*#__PURE__*/jsx(TableCell, {
+            }), jsx(TableCell, {
               className: classes.truncateCell,
-              children: /*#__PURE__*/jsx(Typography, {
+              children: jsx(Typography, {
                 variant: "heading24Medium",
                 className: cx(classes.tableText, classes.truncateText),
                 title: log.description,
@@ -6992,21 +6990,21 @@ const LogsTable = /*#__PURE__*/memo(({
           }, log.id))
         })]
       })
-    }), onLoadMoreLogs && hasMoreLogs && /*#__PURE__*/jsxs(Box, {
+    }), onLoadMoreLogs && hasMoreLogs && jsxs(Box, {
       ref: loadMoreRef,
       className: classes.loadMoreTrigger,
-      children: [/*#__PURE__*/jsx(VentionSpinner, {
+      children: [jsx(VentionSpinner, {
         size: "medium"
-      }), /*#__PURE__*/jsx(Typography, {
+      }), jsx(Typography, {
         variant: "uiText14Regular",
         className: classes.loadMoreText,
         children: t("logs.loadingMore", {
           defaultValue: "Loading more logs..."
         })
       })]
-    }), onLoadMoreLogs && !hasMoreLogs && _logs.length > 0 && /*#__PURE__*/jsx(Box, {
+    }), onLoadMoreLogs && !hasMoreLogs && _logs.length > 0 && jsx(Box, {
       className: classes.endMessage,
-      children: /*#__PURE__*/jsx(Typography, {
+      children: jsx(Typography, {
         variant: "uiText14Regular",
         children: t("logs.noMoreLogs", {
           defaultValue: "No more logs to load"
@@ -7156,7 +7154,7 @@ const LogFilterForm = /*#__PURE__*/memo(({
   onReset,
   initialFilters
 }) => {
-  var _initialFilters$fromD, _initialFilters$toDat, _initialFilters$logTy, _initialFilters$sortO;
+  var _a, _b, _c, _d;
   const {
     classes
   } = useStyles$8();
@@ -7167,10 +7165,10 @@ const LogFilterForm = /*#__PURE__*/memo(({
   useEffect(function updateFilterChangeRef() {
     handleFilterChangeRef.current = onFilterChange;
   }, [onFilterChange]);
-  const [fromDate, setFromDate] = useState((_initialFilters$fromD = initialFilters == null ? void 0 : initialFilters.fromDate) != null ? _initialFilters$fromD : "");
-  const [toDate, setToDate] = useState((_initialFilters$toDat = initialFilters == null ? void 0 : initialFilters.toDate) != null ? _initialFilters$toDat : "");
-  const [logType, setLogType] = useState((_initialFilters$logTy = initialFilters == null ? void 0 : initialFilters.logType) != null ? _initialFilters$logTy : null);
-  const [sortOrder, setSortOrder] = useState((_initialFilters$sortO = initialFilters == null ? void 0 : initialFilters.sortOrder) != null ? _initialFilters$sortO : "latest");
+  const [fromDate, setFromDate] = useState((_a = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.fromDate) !== null && _a !== void 0 ? _a : "");
+  const [toDate, setToDate] = useState((_b = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.toDate) !== null && _b !== void 0 ? _b : "");
+  const [logType, setLogType] = useState((_c = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.logType) !== null && _c !== void 0 ? _c : null);
+  const [sortOrder, setSortOrder] = useState((_d = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.sortOrder) !== null && _d !== void 0 ? _d : "latest");
   const prevInitialFiltersRef = useRef(initialFilters);
   useEffect(function syncInitialFilters() {
     if (prevInitialFiltersRef.current !== initialFilters) {
@@ -7220,21 +7218,22 @@ const LogFilterForm = /*#__PURE__*/memo(({
     setToDate("");
     setLogType(null);
     setSortOrder("latest");
-    onReset == null || onReset();
+    onReset === null || onReset === void 0 ? void 0 : onReset();
   };
   useEffect(function notifyFilterChange() {
-    handleFilterChangeRef.current == null || handleFilterChangeRef.current({
+    var _a;
+    (_a = handleFilterChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(handleFilterChangeRef, {
       fromDate,
       toDate,
       logType,
       sortOrder
     });
   }, [fromDate, toDate, logType, sortOrder]);
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: classes.filterSection,
-    children: [/*#__PURE__*/jsx(Box, {
+    children: [jsx(Box, {
       className: classes.filterInput,
-      children: /*#__PURE__*/jsx(VentionTextInput, {
+      children: jsx(VentionTextInput, {
         size: "xx-large",
         label: t("logs.filter.from", {
           defaultValue: "From"
@@ -7243,9 +7242,9 @@ const LogFilterForm = /*#__PURE__*/memo(({
         onChange: event => setFromDate(event.target.value),
         type: "date"
       })
-    }), /*#__PURE__*/jsx(Box, {
+    }), jsx(Box, {
       className: classes.filterInput,
-      children: /*#__PURE__*/jsx(VentionTextInput, {
+      children: jsx(VentionTextInput, {
         size: "xx-large",
         label: t("logs.filter.to", {
           defaultValue: "To"
@@ -7254,15 +7253,15 @@ const LogFilterForm = /*#__PURE__*/memo(({
         onChange: event => setToDate(event.target.value),
         type: "date"
       })
-    }), /*#__PURE__*/jsx(Box, {
+    }), jsx(Box, {
       className: classes.filterInput,
-      children: /*#__PURE__*/jsx(VentionSelect, {
+      children: jsx(VentionSelect, {
         size: "xx-large",
         variant: "outlined",
         labelText: t("logs.filter.type", {
           defaultValue: "Type"
         }),
-        value: logType != null ? logType : "",
+        value: logType !== null && logType !== void 0 ? logType : "",
         onChange: event => {
           const value = event.target.value;
           setLogType(value === "" ? null : value);
@@ -7272,9 +7271,9 @@ const LogFilterForm = /*#__PURE__*/memo(({
         }),
         menuItems: typeOptions
       })
-    }), /*#__PURE__*/jsx(Box, {
+    }), jsx(Box, {
       className: classes.filterInput,
-      children: /*#__PURE__*/jsx(VentionSelect, {
+      children: jsx(VentionSelect, {
         size: "xx-large",
         variant: "outlined",
         labelText: t("logs.filter.sort", {
@@ -7284,7 +7283,7 @@ const LogFilterForm = /*#__PURE__*/memo(({
         onChange: event => setSortOrder(event.target.value),
         menuItems: sortOptions
       })
-    }), /*#__PURE__*/jsx(VentionButton, {
+    }), jsx(VentionButton, {
       size: "x-large",
       onClick: handleReset,
       className: classes.resetButton,
@@ -7532,6 +7531,38 @@ exportWebAssemblyErrorCauseWrapper('RuntimeError', function (init) {
   return function RuntimeError(message) { return apply(init, this, arguments); };
 });
 
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
+
+
+function __awaiter(thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
 const LogsPagination = /*#__PURE__*/memo(({
   currentPage,
   totalPages,
@@ -7553,22 +7584,22 @@ const LogsPagination = /*#__PURE__*/memo(({
       onPageChange(currentPage + 1);
     }
   };
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: classes.paginationSection,
-    children: [/*#__PURE__*/jsx(VentionButton, {
+    children: [jsx(VentionButton, {
       size: "x-large",
       className: classes.paginationButton,
       onClick: handlePrevious,
       disabled: currentPage === 1,
       children: "\u2190"
-    }), /*#__PURE__*/jsxs(Typography, {
+    }), jsxs(Typography, {
       variant: "heading18SemiBold",
       children: [t("pagination.page", {
         defaultValue: "Page"
       }), " ", currentPage, " ", t("pagination.of", {
         defaultValue: "of"
       }), " ", totalPages]
-    }), /*#__PURE__*/jsx(VentionButton, {
+    }), jsx(VentionButton, {
       size: "x-large",
       className: classes.paginationButton,
       onClick: handleNext,
@@ -7612,7 +7643,7 @@ const parseLogDate = dateStr => {
   return parsed.isValid() ? parsed.valueOf() : 0;
 };
 const LogsPanel = /*#__PURE__*/forwardRef((props, ref) => {
-  var _initialFilters$fromD, _initialFilters$toDat, _initialFilters$logTy, _initialFilters$sortO, _pagination$mode, _pagination$pageSize, _pagination$initialPa;
+  var _a, _b, _c, _d, _e, _f, _g;
   const {
     dataFetcher,
     initialFilters,
@@ -7634,46 +7665,48 @@ const LogsPanel = /*#__PURE__*/forwardRef((props, ref) => {
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
   const [filters, setFilters] = useState({
-    fromDate: (_initialFilters$fromD = initialFilters == null ? void 0 : initialFilters.fromDate) != null ? _initialFilters$fromD : null,
-    toDate: (_initialFilters$toDat = initialFilters == null ? void 0 : initialFilters.toDate) != null ? _initialFilters$toDat : null,
-    logType: (_initialFilters$logTy = initialFilters == null ? void 0 : initialFilters.logType) != null ? _initialFilters$logTy : null,
-    sortOrder: (_initialFilters$sortO = initialFilters == null ? void 0 : initialFilters.sortOrder) != null ? _initialFilters$sortO : "latest"
+    fromDate: (_a = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.fromDate) !== null && _a !== void 0 ? _a : null,
+    toDate: (_b = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.toDate) !== null && _b !== void 0 ? _b : null,
+    logType: (_c = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.logType) !== null && _c !== void 0 ? _c : null,
+    sortOrder: (_d = initialFilters === null || initialFilters === void 0 ? void 0 : initialFilters.sortOrder) !== null && _d !== void 0 ? _d : "latest"
   });
-  const paginationMode = (_pagination$mode = pagination == null ? void 0 : pagination.mode) != null ? _pagination$mode : "none";
-  const pageSize = (_pagination$pageSize = pagination == null ? void 0 : pagination.pageSize) != null ? _pagination$pageSize : 10;
-  const [currentPage, setCurrentPage] = useState((_pagination$initialPa = pagination == null ? void 0 : pagination.initialPage) != null ? _pagination$initialPa : 1);
+  const paginationMode = (_e = pagination === null || pagination === void 0 ? void 0 : pagination.mode) !== null && _e !== void 0 ? _e : "none";
+  const pageSize = (_f = pagination === null || pagination === void 0 ? void 0 : pagination.pageSize) !== null && _f !== void 0 ? _f : 10;
+  const [currentPage, setCurrentPage] = useState((_g = pagination === null || pagination === void 0 ? void 0 : pagination.initialPage) !== null && _g !== void 0 ? _g : 1);
   const [totalPages, setTotalPages] = useState(1);
   const [hasMorePages, setHasMorePages] = useState(false);
-  const fetchData = useCallback(async function fetchData(page, signal) {
-    setIsLoading(true);
-    setError(null);
-    try {
-      const result = await dataFetcher({
-        filters,
-        page,
-        pageSize
-      });
-      if (!(signal != null && signal.aborted)) {
-        if (paginationMode === "infinite-scroll" && page > 1) {
-          setLogs(prev => [...prev, ...result.logs]);
-        } else {
-          setLogs(result.logs);
+  const fetchData = useCallback(function fetchData(page, signal) {
+    return __awaiter(this, void 0, void 0, function* () {
+      setIsLoading(true);
+      setError(null);
+      try {
+        const result = yield dataFetcher({
+          filters,
+          page,
+          pageSize
+        });
+        if (!(signal === null || signal === void 0 ? void 0 : signal.aborted)) {
+          if (paginationMode === "infinite-scroll" && page > 1) {
+            setLogs(prev => [...prev, ...result.logs]);
+          } else {
+            setLogs(result.logs);
+          }
+          setTotalPages(result.totalPages);
+          setHasMorePages(result.hasMorePages);
+          setCurrentPage(result.currentPage);
+          setIsLoading(false);
         }
-        setTotalPages(result.totalPages);
-        setHasMorePages(result.hasMorePages);
-        setCurrentPage(result.currentPage);
-        setIsLoading(false);
-      }
-    } catch (error) {
-      if (!(signal != null && signal.aborted)) {
-        const errorMessage = error instanceof Error ? error.message : "Failed to load logs";
-        setError(errorMessage);
-        setIsLoading(false);
-        if (onError) {
-          onError(error);
+      } catch (error) {
+        if (!(signal === null || signal === void 0 ? void 0 : signal.aborted)) {
+          const errorMessage = error instanceof Error ? error.message : "Failed to load logs";
+          setError(errorMessage);
+          setIsLoading(false);
+          if (onError) {
+            onError(error);
+          }
         }
       }
-    }
+    });
   }, [dataFetcher, filters, pageSize, paginationMode, onError]);
   useEffect(function fetchDataOnChange() {
     const controller = new AbortController();
@@ -7716,14 +7749,14 @@ const LogsPanel = /*#__PURE__*/forwardRef((props, ref) => {
       onFilterChange(resetFilters);
     }
   }, [onFilterChange, paginationMode]);
-  const refresh = useCallback(async () => {
-    await fetchData(currentPage);
-  }, [fetchData, currentPage]);
+  const refresh = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+    yield fetchData(currentPage);
+  }), [fetchData, currentPage]);
   const resetFilters = useCallback(() => {
     handleReset();
   }, [handleReset]);
   const applyFilters = useCallback(newFilters => {
-    const updatedFilters = Object.assign({}, filters, newFilters);
+    const updatedFilters = Object.assign(Object.assign({}, filters), newFilters);
     setFilters(updatedFilters);
     if (onFilterChange) {
       onFilterChange(updatedFilters);
@@ -7738,14 +7771,14 @@ const LogsPanel = /*#__PURE__*/forwardRef((props, ref) => {
     getCurrentFilters,
     exportLogs
   }), [refresh, resetFilters, applyFilters, getCurrentFilters, exportLogs]);
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: cx(classes.root, className),
     sx: sx,
-    children: [/*#__PURE__*/jsx(LogFilterForm, {
+    children: [jsx(LogFilterForm, {
       onFilterChange: handleFilterChange,
       onReset: handleReset,
       initialFilters: filters
-    }), /*#__PURE__*/jsx(LogsTable, {
+    }), jsx(LogsTable, {
       logs: logs,
       isLoading: isLoading,
       error: error,
@@ -7755,7 +7788,7 @@ const LogsPanel = /*#__PURE__*/forwardRef((props, ref) => {
       tableHeight: tableHeight,
       emptyStateMessage: emptyStateMessage,
       emptyStateIcon: emptyStateIcon
-    }), paginationMode === "pagination" && !isLoading && !error && logs.length > 0 && /*#__PURE__*/jsx(LogsPagination, {
+    }), paginationMode === "pagination" && !isLoading && !error && logs.length > 0 && jsx(LogsPagination, {
       currentPage: currentPage,
       totalPages: totalPages,
       onPageChange: handlePageChange
@@ -7784,14 +7817,14 @@ const SettingsPage = function SettingsPage({
   } = useStyles$5({
     sidebarWidth
   });
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: classes.root,
-    children: [/*#__PURE__*/jsx(Box, {
+    children: [jsx(Box, {
       className: classes.sidebar,
-      children: /*#__PURE__*/jsx(Sidebar, {
+      children: jsx(Sidebar, {
         items: sidebarItems
       })
-    }), /*#__PURE__*/jsx(Box, {
+    }), jsx(Box, {
       className: classes.content,
       children: children
     })]
@@ -7850,9 +7883,9 @@ function FileUploadPanel({
   const {
     t
   } = useTranslation();
-  const displayTitle = title != null ? title : t("fileUploadPanel.defaultTitle");
-  const displayDropzoneTitle = dropzoneTitle != null ? dropzoneTitle : t("fileUploadPanel.dropzoneTitle");
-  const displayFileCriteria = fileCriteriaDescription != null ? fileCriteriaDescription : t("fileUploadPanel.defaultFileCriteria");
+  const displayTitle = title !== null && title !== void 0 ? title : t("fileUploadPanel.defaultTitle");
+  const displayDropzoneTitle = dropzoneTitle !== null && dropzoneTitle !== void 0 ? dropzoneTitle : t("fileUploadPanel.dropzoneTitle");
+  const displayFileCriteria = fileCriteriaDescription !== null && fileCriteriaDescription !== void 0 ? fileCriteriaDescription : t("fileUploadPanel.defaultFileCriteria");
   function handleFileRemove(fileId) {
     onFileRemove(fileId);
   }
@@ -7866,23 +7899,23 @@ function FileUploadPanel({
       onFileCancel(fileId);
     }
   }
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: cx(classes.container, className),
     sx: sx,
-    children: [displayTitle && /*#__PURE__*/jsx(Typography, {
+    children: [displayTitle && jsx(Typography, {
       variant: titleVariant,
       className: classes.title,
       children: displayTitle
-    }), /*#__PURE__*/jsx(VentionDropZone, {
+    }), jsx(VentionDropZone, {
       style: "outline",
       size: "large",
       onFilesSelect: onFilesSelect,
       fileCriteriaDescription: displayFileCriteria,
       defaultTitle: displayDropzoneTitle,
       disabled: disabled
-    }), files.length > 0 && /*#__PURE__*/jsx(Box, {
+    }), files.length > 0 && jsx(Box, {
       className: classes.fileList,
-      children: files.map(file => /*#__PURE__*/jsx(VentionUploadFile, {
+      children: files.map(file => jsx(VentionUploadFile, {
         fileName: file.name,
         fileSize: formatFileSize(file.size),
         state: file.state,
@@ -7914,7 +7947,7 @@ const useStyles$4 = tss.withParams().create(({
     display: "flex",
     flexDirection: "column",
     gap: theme.spacing(1),
-    maxHeight: maxHeight != null ? maxHeight : "auto",
+    maxHeight: maxHeight !== null && maxHeight !== void 0 ? maxHeight : "auto",
     overflowY: maxHeight ? "auto" : "visible",
     "& .MuiGrid-container": {
       width: "100%"
@@ -7941,7 +7974,7 @@ function StepProgressCircle({
   className,
   sx
 }) {
-  var _title$toLowerCase$re;
+  var _a;
   const {
     t
   } = useTranslation();
@@ -7953,9 +7986,9 @@ function StepProgressCircle({
     strokeWidth,
     variant
   });
-  const titleKey = (_title$toLowerCase$re = title == null ? void 0 : title.toLowerCase().replace(/\s/g, "")) != null ? _title$toLowerCase$re : "progress";
+  const titleKey = (_a = title === null || title === void 0 ? void 0 : title.toLowerCase().replace(/\s/g, "")) !== null && _a !== void 0 ? _a : "progress";
   const displayTitle = t(`stepProgressCircle.title.${titleKey}`, {
-    defaultValue: title != null ? title : "Progress"
+    defaultValue: title !== null && title !== void 0 ? title : "Progress"
   });
   const percentage = totalSteps > 0 ? Math.round(currentStep / totalSteps * 100) : 0;
   const radius = (size - strokeWidth) / 2 - CIRCLE_PADDING;
@@ -7963,27 +7996,27 @@ function StepProgressCircle({
   const strokeDashoffset = circumference - percentage / 100 * circumference;
   const center = size / 2;
   const progressText = totalSteps > 0 ? `${currentStep}/${totalSteps}` : "-/-";
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: cx(classes.container, className),
     sx: sx,
-    children: [showTitle && /*#__PURE__*/jsx(Typography, {
+    children: [showTitle && jsx(Typography, {
       variant: titleVariant,
       className: classes.title,
       children: displayTitle
-    }), /*#__PURE__*/jsxs(Box, {
+    }), jsxs(Box, {
       className: classes.circleContainer,
-      children: [/*#__PURE__*/jsxs("svg", {
+      children: [jsxs("svg", {
         className: classes.svg,
         width: size,
         height: size,
         viewBox: `0 0 ${size} ${size}`,
-        children: [/*#__PURE__*/jsx("circle", {
+        children: [jsx("circle", {
           cx: center,
           cy: center,
           r: radius,
           className: classes.backgroundCircle,
           fill: "none"
-        }), /*#__PURE__*/jsx("circle", {
+        }), jsx("circle", {
           cx: center,
           cy: center,
           r: radius,
@@ -7994,9 +8027,9 @@ function StepProgressCircle({
           strokeDasharray: circumference,
           strokeDashoffset: strokeDashoffset
         })]
-      }), /*#__PURE__*/jsx(Box, {
+      }), jsx(Box, {
         className: classes.textContainer,
-        children: /*#__PURE__*/jsx(Typography, {
+        children: jsx(Typography, {
           variant: progressVariant,
           className: classes.progressText,
           children: progressText
@@ -8086,7 +8119,7 @@ const ActionButton = function ActionButton({
   const translatedLabel = t(`actionButton.${translationKey}`, {
     defaultValue: label
   });
-  return /*#__PURE__*/jsx(VentionIconButton, {
+  return jsx(VentionIconButton, {
     onClick: onClick,
     disabled: disabled,
     size: "x-large",
@@ -8094,12 +8127,12 @@ const ActionButton = function ActionButton({
     className: cx(classes.button, className),
     sx: sx,
     "data-testid": "action-button",
-    children: /*#__PURE__*/jsxs(Box, {
+    children: jsxs(Box, {
       className: classes.content,
-      children: [/*#__PURE__*/jsx(Box, {
+      children: [jsx(Box, {
         className: classes.iconContainer,
         children: icon
-      }), /*#__PURE__*/jsx(Typography, {
+      }), jsx(Typography, {
         variant: labelVariant,
         className: classes.label,
         children: translatedLabel
@@ -8197,7 +8230,7 @@ const PressButton = function PressButton({
       isTouchActive.current = false;
     }, 400);
   }
-  return /*#__PURE__*/jsx(VentionIconButton, {
+  return jsx(VentionIconButton, {
     disabled: disabled,
     size: "x-large",
     variant: "filled",
@@ -8210,12 +8243,12 @@ const PressButton = function PressButton({
     onTouchStart: handleTouchStart,
     onTouchEnd: handleTouchEnd,
     onTouchCancel: handleTouchEnd,
-    children: /*#__PURE__*/jsxs(Box, {
+    children: jsxs(Box, {
       className: classes.content,
-      children: [/*#__PURE__*/jsx(Box, {
+      children: [jsx(Box, {
         className: classes.iconContainer,
         children: icon
-      }), /*#__PURE__*/jsx(Typography, {
+      }), jsx(Typography, {
         variant: labelVariant,
         className: classes.label,
         children: translatedLabel
@@ -8419,39 +8452,41 @@ function ProductFormListComponent({
     setDeleteId(id);
     setDeleteDialogOpen(true);
   }
-  async function handleDeleteConfirm() {
-    if (deleteId) {
-      await onDelete(deleteId);
-      setDeleteDialogOpen(false);
-      setDeleteId(null);
-    }
+  function handleDeleteConfirm() {
+    return __awaiter(this, void 0, void 0, function* () {
+      if (deleteId) {
+        yield onDelete(deleteId);
+        setDeleteDialogOpen(false);
+        setDeleteId(null);
+      }
+    });
   }
   function handleDeleteCancel() {
     setDeleteDialogOpen(false);
     setDeleteId(null);
   }
   function handleFieldChange(name, value) {
-    setFormData(prev => Object.assign({}, prev, {
+    setFormData(prev => Object.assign(Object.assign({}, prev), {
       [name]: value
     }));
   }
   function getFieldDisplayValue(field, value) {
+    var _a, _b;
     if (field.type === "select") {
-      var _field$options;
-      return ((_field$options = field.options) == null || (_field$options = _field$options.find(opt => opt.value === value)) == null ? void 0 : _field$options.label) || String(value);
+      return ((_b = (_a = field.options) === null || _a === void 0 ? void 0 : _a.find(opt => opt.value === value)) === null || _b === void 0 ? void 0 : _b.label) || String(value);
     }
-    return (value == null ? void 0 : value.toString()) || "";
+    return (value === null || value === void 0 ? void 0 : value.toString()) || "";
   }
   function renderItemContent(item) {
     const mainField = fields[0];
     const secondaryFields = fields.slice(1);
-    return /*#__PURE__*/jsxs(Box, {
+    return jsxs(Box, {
       className: classes.itemContent,
-      children: [/*#__PURE__*/jsx(Typography, {
+      children: [jsx(Typography, {
         variant: itemTitleVariant,
         className: classes.itemTitle,
         children: getFieldDisplayValue(mainField, item[mainField.name])
-      }), /*#__PURE__*/jsx(Typography, {
+      }), jsx(Typography, {
         variant: itemSubtitleVariant,
         color: "textSecondary",
         className: classes.itemSubtitle,
@@ -8460,14 +8495,14 @@ function ProductFormListComponent({
     });
   }
   function renderField(field) {
+    var _a;
     const fieldValue = formData[field.name];
     if (field.type === "select") {
-      var _field$options2;
-      const menuItems = ((_field$options2 = field.options) == null ? void 0 : _field$options2.map(opt => ({
+      const menuItems = ((_a = field.options) === null || _a === void 0 ? void 0 : _a.map(opt => ({
         value: opt.value,
         displayText: opt.label
       }))) || [];
-      return /*#__PURE__*/jsx(VentionSelect, {
+      return jsx(VentionSelect, {
         labelText: field.label,
         value: fieldValue || "",
         onChange: event => {
@@ -8478,9 +8513,9 @@ function ProductFormListComponent({
         variant: "outlined"
       }, field.name);
     }
-    return /*#__PURE__*/jsx(VentionTextInput, {
+    return jsx(VentionTextInput, {
       label: field.label,
-      value: fieldValue != null ? fieldValue : "",
+      value: fieldValue !== null && fieldValue !== void 0 ? fieldValue : "",
       onChange: event => {
         handleFieldChange(field.name, field.type === "number" ? Number(event.target.value) : event.target.value);
       },
@@ -8494,55 +8529,55 @@ function ProductFormListComponent({
     }, field.name);
   }
   const isEditing = Object.keys(formData).length > 0 && "id" in formData;
-  return /*#__PURE__*/jsxs(Box, {
+  return jsxs(Box, {
     className: cx(classes.container, className),
     sx: sx,
-    children: [/*#__PURE__*/jsxs(Box, {
+    children: [jsxs(Box, {
       className: classes.header,
-      children: [/*#__PURE__*/jsx(Typography, {
+      children: [jsx(Typography, {
         variant: titleVariant,
         children: title
-      }), /*#__PURE__*/jsx(VentionButton, {
+      }), jsx(VentionButton, {
         onClick: () => {
           setFormData({});
           setEditDialogOpen(true);
         },
         size: "large",
         variant: "filled",
-        startIcon: /*#__PURE__*/jsx(VentionIcon, {
+        startIcon: jsx(VentionIcon, {
           type: "plus",
           size: 24,
           color: "white"
         }),
         children: t("productFormList.add")
       })]
-    }), /*#__PURE__*/jsx(Box, {
+    }), jsx(Box, {
       className: classes.listContainer,
-      children: items.length === 0 ? /*#__PURE__*/jsx(Box, {
+      children: items.length === 0 ? jsx(Box, {
         className: classes.emptyState,
-        children: /*#__PURE__*/jsx(Typography, {
+        children: jsx(Typography, {
           variant: "uiText14Regular",
           color: "textSecondary",
           children: t("productFormList.emptyState", {
             defaultValue: "No items yet. Click Add to create one."
           })
         })
-      }) : /*#__PURE__*/jsx(List, {
-        children: items.map(item => /*#__PURE__*/jsxs(ListItem, {
+      }) : jsx(List, {
+        children: items.map(item => jsxs(ListItem, {
           className: classes.listItem,
-          children: [renderItemContent(item), /*#__PURE__*/jsxs(Box, {
+          children: [renderItemContent(item), jsxs(Box, {
             className: classes.actions,
-            children: [/*#__PURE__*/jsx(IconButton, {
+            children: [jsx(IconButton, {
               onClick: () => handleEditClick(item),
               size: "medium",
-              children: /*#__PURE__*/jsx(VentionIcon, {
+              children: jsx(VentionIcon, {
                 type: "edit",
                 size: 24
               })
-            }), /*#__PURE__*/jsx(IconButton, {
+            }), jsx(IconButton, {
               onClick: () => handleDeleteClick(getItemId(item)),
               size: "medium",
-              children: /*#__PURE__*/jsx(VentionIcon, {
+              children: jsx(VentionIcon, {
                 type: "trash",
                 size: 24
               })
@@ -8550,66 +8585,66 @@ function ProductFormListComponent({
           })]
         }, getItemId(item)))
       })
-    }), /*#__PURE__*/jsxs(Dialog, {
+    }), jsxs(Dialog, {
       open: editDialogOpen,
       onClose: handleEditClose,
       maxWidth: "sm",
       fullWidth: true,
-      children: [/*#__PURE__*/jsx(DialogTitle, {
-        children: /*#__PURE__*/jsx(Typography, {
+      children: [jsx(DialogTitle, {
+        children: jsx(Typography, {
           variant: "heading18SemiBold",
           textAlign: "center",
           children: isEditing ? t("productFormList.modify") : t("productFormList.new")
         })
-      }), /*#__PURE__*/jsx(DialogContent, {
+      }), jsx(DialogContent, {
         className: classes.dialogContent,
-        children: /*#__PURE__*/jsx(Box, {
+        children: jsx(Box, {
           className: classes.dialogForm,
           children: fields.map(field => renderField(field))
         })
-      }), /*#__PURE__*/jsxs(DialogActions, {
+      }), jsxs(DialogActions, {
         className: classes.dialogActions,
-        children: [/*#__PURE__*/jsx(VentionButton, {
+        children: [jsx(VentionButton, {
           onClick: handleEditClose,
           variant: "outline",
           size: "large",
           children: t("productFormList.cancel")
-        }), /*#__PURE__*/jsx(VentionButton, {
-          onClick: async () => {
-            if (await onSubmit(formData)) {
+        }), jsx(VentionButton, {
+          onClick: () => __awaiter(this, void 0, void 0, function* () {
+            if (yield onSubmit(formData)) {
               handleEditClose();
             }
-          },
+          }),
           variant: "filled",
           size: "large",
           children: isEditing ? t("productFormList.save") : t("productFormList.create")
         })]
       })]
-    }), /*#__PURE__*/jsxs(Dialog, {
+    }), jsxs(Dialog, {
       open: deleteDialogOpen,
       onClose: handleDeleteCancel,
       maxWidth: "xs",
       fullWidth: true,
-      children: [/*#__PURE__*/jsx(DialogTitle, {
-        children: /*#__PURE__*/jsx(Typography, {
+      children: [jsx(DialogTitle, {
+        children: jsx(Typography, {
           variant: "heading18SemiBold",
           textAlign: "center",
           children: t("productFormList.delete")
         })
-      }), /*#__PURE__*/jsx(DialogContent, {
-        children: /*#__PURE__*/jsx(Typography, {
+      }), jsx(DialogContent, {
+        children: jsx(Typography, {
           variant: "uiText14Regular",
           className: classes.deleteMessage,
           children: t("productFormList.deleteConfirmation")
         })
-      }), /*#__PURE__*/jsxs(DialogActions, {
+      }), jsxs(DialogActions, {
         className: classes.dialogActions,
-        children: [/*#__PURE__*/jsx(VentionButton, {
+        children: [jsx(VentionButton, {
           onClick: handleDeleteCancel,
           variant: "outline",
           size: "large",
           children: t("productFormList.cancel")
-        }), /*#__PURE__*/jsx(VentionButton, {
+        }), jsx(VentionButton, {
           onClick: handleDeleteConfirm,
           variant: "destructive",
           size: "large",
@@ -8703,12 +8738,12 @@ const useStyles = tss.withParams().create(({
   }
 }));
 
-let UserLevel = /*#__PURE__*/function (UserLevel) {
+var UserLevel;
+(function (UserLevel) {
   UserLevel[UserLevel["Operator"] = 1] = "Operator";
   UserLevel[UserLevel["Maintenance"] = 2] = "Maintenance";
   UserLevel[UserLevel["Admin"] = 3] = "Admin";
-  return UserLevel;
-}({});
+})(UserLevel || (UserLevel = {}));
 function hasSufficientLevel(requiredLevel, currentLevel) {
   return currentLevel >= requiredLevel;
 }
@@ -10911,7 +10946,6 @@ if (DESCRIPTORS && !('size' in URLSearchParamsPrototype)) {
  * - Local/Edge: http://hostname:8000
  * - Deployed: Uses passthrough URL for digital twin infrastructure
  */
-
 /**
  * Gets the execution engine HTTP URL for deployed environments
  * @param processName - The name of the process/service
@@ -10933,7 +10967,6 @@ function getExecutionEngineHttpUrl(processName) {
   const baseOrigin = isDev ? "https://digital-twin.vention.foo" : origin;
   return `${baseOrigin}${basePath}`;
 }
-
 /**
  * Checks if the current environment is running on edge (local controller)
  * @returns true if running on edge, false otherwise
@@ -10944,7 +10977,6 @@ function isOnEdge() {
   } = window.location;
   return hostname.startsWith("192.168") || hostname.startsWith("10.") || hostname.startsWith("100.") || hostname === "localhost" || hostname === "127.0.0.1" || hostname.endsWith(".ts.net");
 }
-
 /**
  * Gets the API base URL for the specified process/service
  * @param options - Configuration options including process name and optional edge port