npm - @cere/cere-design-system - Versions diffs - 0.0.42 → 0.0.43 - Mend

@cere/cere-design-system 0.0.42 → 0.0.43

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

Files changed (7) hide show

package/dist/index.mjs CHANGED Viewed

@@ -2172,7 +2172,7 @@ function useSearchHotkeys(inputRef, options2 = {}) {
     function onKeyDown(event) {
       if (enableK && event.key.toLowerCase() === "k") {
         const correctMod = mac ? event.metaKey && !event.ctrlKey : event.ctrlKey && !event.metaKey;
-        if (correctMod) {
+        if (correctMod && !event.shiftKey && !event.altKey) {
           event.preventDefault();
           inputRef.current?.focus();
           return;
@@ -2193,15 +2193,16 @@ function useSearchHotkeys(inputRef, options2 = {}) {
 }
 // src/components/inputs/SearchField.tsx
-import { jsx as jsx8, jsxs } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var ShortcutHint = () => {
   const [mounted, setMounted] = useState(false);
   useEffect2(() => {
     setMounted(true);
   }, []);
   if (!mounted) return null;
-  const modKey = isMacPlatform() ? "\u2318" : "Ctrl";
-  return /* @__PURE__ */ jsxs(
+  const isMac = isMacPlatform();
+  const label = isMac ? "\u2318\u2009K" : "Ctrl + K";
+  return /* @__PURE__ */ jsx8(
     Box,
     {
       component: "span",
@@ -2218,10 +2219,7 @@ var ShortcutHint = () => {
         color: "text.secondary",
         lineHeight: 1
       },
-      children: [
-        modKey,
-        "K"
-      ]
+      children: label
     }
   );
 };
@@ -2239,21 +2237,19 @@ var SearchField = ({
     onChange?.(e);
     onSearch?.(e.target.value);
   };
-  const pillSx = variant === "pill" ? {
-    "& .MuiOutlinedInput-root": {
-      borderRadius: "999px",
-      paddingRight: "6px"
-    }
-  } : void 0;
+  const pillInputSx = variant === "pill" ? { borderRadius: "999px", paddingRight: "6px" } : void 0;
   return /* @__PURE__ */ jsx8(
     TextField,
     {
       placeholder,
       onChange: handleChange,
-      sx: [pillSx, ...Array.isArray(sx) ? sx : [sx]],
-      InputProps: {
-        startAdornment: /* @__PURE__ */ jsx8(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx8(SearchIcon, { style: { fontSize: 18, color: theme2.palette.text.disabled } }) }),
-        endAdornment: shortcutHint ? /* @__PURE__ */ jsx8(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx8(ShortcutHint, {}) }) : void 0
+      sx,
+      slotProps: {
+        input: {
+          ...pillInputSx ? { sx: pillInputSx } : {},
+          startAdornment: /* @__PURE__ */ jsx8(InputAdornment, { position: "start", children: /* @__PURE__ */ jsx8(SearchIcon, { style: { fontSize: 18, color: theme2.palette.text.disabled } }) }),
+          endAdornment: shortcutHint ? /* @__PURE__ */ jsx8(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx8(ShortcutHint, {}) }) : void 0
+        }
       },
       ...props
     }
@@ -2302,7 +2298,7 @@ var ToggleButtonGroup = (props) => {
 // src/components/inputs/Switch.tsx
 import MuiSwitch from "@mui/material/Switch";
 import { styled as styled5 } from "@mui/material/styles";
-import { jsx as jsx10, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs } from "react/jsx-runtime";
 var StyledSwitch = styled5(MuiSwitch)(({ theme: theme2 }) => ({
   width: 44,
   height: 24,
@@ -2358,7 +2354,7 @@ var Switch = ({
   if (!label) {
     return switchComponent;
   }
-  return /* @__PURE__ */ jsxs2("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
+  return /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
     labelPosition === "left" && /* @__PURE__ */ jsx10("span", { children: label }),
     switchComponent,
     labelPosition === "right" && /* @__PURE__ */ jsx10("span", { children: label })
@@ -2463,7 +2459,7 @@ import Typography from "@mui/material/Typography";
 import { DatePicker } from "@mui/x-date-pickers/DatePicker";
 import { LocalizationProvider } from "@mui/x-date-pickers/LocalizationProvider";
 import { AdapterDateFns } from "@mui/x-date-pickers/AdapterDateFnsV3";
-import { jsx as jsx13, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs2 } from "react/jsx-runtime";
 var DateRangePicker = ({
   startDate,
   endDate,
@@ -2474,7 +2470,7 @@ var DateRangePicker = ({
   disabled = false,
   size: size3 = "small"
 }) => {
-  return /* @__PURE__ */ jsx13(LocalizationProvider, { dateAdapter: AdapterDateFns, children: /* @__PURE__ */ jsxs3(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
+  return /* @__PURE__ */ jsx13(LocalizationProvider, { dateAdapter: AdapterDateFns, children: /* @__PURE__ */ jsxs2(Stack, { direction: "row", spacing: 1, alignItems: "center", children: [
     /* @__PURE__ */ jsx13(
       DatePicker,
       {
@@ -2515,7 +2511,7 @@ import { useCallback, useRef } from "react";
 import { forwardRef } from "react";
 import { Stack as Stack2, styled as styled8, avatarClasses, Typography as Typography2, Button as Button2 } from "@mui/material";
 import { ArrowDropUp, ArrowDropDown } from "@mui/icons-material";
-import { jsx as jsx14, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs3 } from "react/jsx-runtime";
 var Clickable = styled8(Button2)({
   padding: 0
 });
@@ -2541,7 +2537,7 @@ var Center = styled8(Typography2)(({ theme: theme2 }) => ({
   color: theme2.palette.text.primary
 }));
 var DropdownAnchor = forwardRef(
-  ({ open, label, leftElement, onOpen, variant, ...props }, ref) => /* @__PURE__ */ jsx14(Clickable, { ref, ...props, color: "inherit", variant: "text", onClick: onOpen, children: /* @__PURE__ */ jsxs4(Anchor, { variant, spacing: 1, direction: "row", alignItems: "stretch", children: [
+  ({ open, label, leftElement, onOpen, variant, ...props }, ref) => /* @__PURE__ */ jsx14(Clickable, { ref, ...props, color: "inherit", variant: "text", onClick: onOpen, children: /* @__PURE__ */ jsxs3(Anchor, { variant, spacing: 1, direction: "row", alignItems: "stretch", children: [
     /* @__PURE__ */ jsx14(Left, { children: leftElement }),
     /* @__PURE__ */ jsx14(Center, { variant: "body1", children: label }),
     variant !== "header" && (open ? /* @__PURE__ */ jsx14(ArrowDropUp, {}) : /* @__PURE__ */ jsx14(ArrowDropDown, {}))
@@ -2550,7 +2546,7 @@ var DropdownAnchor = forwardRef(
 DropdownAnchor.displayName = "DropdownAnchor";
 // src/components/navigation/Dropdown/Dropdown.tsx
-import { Fragment, jsx as jsx15, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx15, jsxs as jsxs4 } from "react/jsx-runtime";
 var Dropdown = ({
   open,
   label,
@@ -2568,7 +2564,7 @@ var Dropdown = ({
   const horizontal = direction === "left" ? "right" : "left";
   const onOpen = useCallback(() => onToggle?.(true), [onToggle]);
   const padding = dense ? 1 : 2;
-  return /* @__PURE__ */ jsxs5(Fragment, { children: [
+  return /* @__PURE__ */ jsxs4(Fragment, { children: [
     renderAnchor({ ref: anchorRef, onOpen, open }),
     /* @__PURE__ */ jsx15(
       Popover,
@@ -2619,7 +2615,7 @@ import {
   ListItemText,
   styled as styled9
 } from "@mui/material";
-import { jsx as jsx16, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs5 } from "react/jsx-runtime";
 var StyledListItemButton = styled9(ListItemButton, {
   shouldForwardProp: (prop) => prop !== "selected" && prop !== "size"
 })(({ theme: theme2, selected, size: size3 = "medium" }) => {
@@ -2658,7 +2654,7 @@ var SidebarItem = ({
   endIcon,
   children
 }) => {
-  return /* @__PURE__ */ jsxs6(StyledListItemButton, { selected, size: size3, onClick, children: [
+  return /* @__PURE__ */ jsxs5(StyledListItemButton, { selected, size: size3, onClick, children: [
     icon && /* @__PURE__ */ jsx16(ListItemIcon, { children: icon }),
     /* @__PURE__ */ jsx16(ListItemText, { primary: label }),
     endIcon && /* @__PURE__ */ jsx16("div", { style: { marginLeft: "auto" }, children: endIcon }),
@@ -2728,7 +2724,7 @@ import AddIcon from "@mui/icons-material/Add";
 import CheckIcon from "@mui/icons-material/Check";
 import SettingsIcon from "@mui/icons-material/Settings";
 import PersonAddAltIcon from "@mui/icons-material/PersonAddAlt";
-import { Fragment as Fragment2, jsx as jsx18, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx18, jsxs as jsxs6 } from "react/jsx-runtime";
 var ServiceSelectorButton = ({
   services,
   selectedServiceId,
@@ -2785,7 +2781,7 @@ var ServiceSelectorButton = ({
     return matchesSearch && matchesArchivedFilter;
   });
   if (compact) {
-    return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+    return /* @__PURE__ */ jsxs6(Fragment2, { children: [
       /* @__PURE__ */ jsx18(Box3, { sx: { position: "relative" }, children: /* @__PURE__ */ jsx18(Tooltip, { title: "Select service", placement: "right", children: /* @__PURE__ */ jsx18(
         IconButton2,
         {
@@ -2837,10 +2833,10 @@ var ServiceSelectorButton = ({
       )
     ] });
   }
-  return /* @__PURE__ */ jsxs7(Fragment2, { children: [
-    /* @__PURE__ */ jsxs7(Box3, { sx: { display: "flex", alignItems: "center", ...sx }, children: [
-      selectedService ? /* @__PURE__ */ jsxs7(Fragment2, { children: [
-        isManager ? /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs6(Fragment2, { children: [
+    /* @__PURE__ */ jsxs6(Box3, { sx: { display: "flex", alignItems: "center", ...sx }, children: [
+      selectedService ? /* @__PURE__ */ jsxs6(Fragment2, { children: [
+        isManager ? /* @__PURE__ */ jsxs6(
           Link,
           {
             underline: "hover",
@@ -2870,7 +2866,7 @@ var ServiceSelectorButton = ({
               selectedService.name
             ]
           }
-        ) : /* @__PURE__ */ jsxs7(
+        ) : /* @__PURE__ */ jsxs6(
           Box3,
           {
             sx: {
@@ -3008,7 +3004,7 @@ var ServiceSelectorPanel = ({
       }
     }
   };
-  return /* @__PURE__ */ jsxs7(
+  return /* @__PURE__ */ jsxs6(
     Menu,
     {
       anchorEl,
@@ -3033,7 +3029,7 @@ var ServiceSelectorPanel = ({
         }
       },
       children: [
-        selectedService && /* @__PURE__ */ jsxs7(
+        selectedService && /* @__PURE__ */ jsxs6(
           Box3,
           {
             sx: {
@@ -3045,7 +3041,7 @@ var ServiceSelectorPanel = ({
               borderColor: "divider"
             },
             children: [
-              /* @__PURE__ */ jsxs7(Box3, { sx: {
+              /* @__PURE__ */ jsxs6(Box3, { sx: {
                 display: "flex",
                 alignItems: "center",
                 mb: 1.5
@@ -3063,7 +3059,7 @@ var ServiceSelectorPanel = ({
                     children: selectedService.name.charAt(0)
                   }
                 ),
-                /* @__PURE__ */ jsx18(Box3, { sx: { flex: 1 }, children: /* @__PURE__ */ jsxs7(Box3, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+                /* @__PURE__ */ jsx18(Box3, { sx: { flex: 1 }, children: /* @__PURE__ */ jsxs6(Box3, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
                   /* @__PURE__ */ jsx18(Typography3, { variant: "subtitle1", sx: { fontWeight: 600, fontSize: "1rem" }, children: selectedService.name }),
                   /* @__PURE__ */ jsx18(
                     Box3,
@@ -3084,7 +3080,7 @@ var ServiceSelectorPanel = ({
                   )
                 ] }) })
               ] }),
-              (onOpenSettings || onOpenAddMember) && /* @__PURE__ */ jsxs7(Box3, { sx: { display: "flex", gap: 1 }, children: [
+              (onOpenSettings || onOpenAddMember) && /* @__PURE__ */ jsxs6(Box3, { sx: { display: "flex", gap: 1 }, children: [
                 onOpenAddMember && /* @__PURE__ */ jsx18(
                   Button3,
                   {
@@ -3155,8 +3151,8 @@ var ServiceSelectorPanel = ({
             ]
           }
         ),
-        /* @__PURE__ */ jsxs7(Box3, { sx: { px: 2, pt: 2, pb: 1.5 }, children: [
-          /* @__PURE__ */ jsxs7(Box3, { sx: { display: "flex", alignItems: "center", mb: 1.5 }, children: [
+        /* @__PURE__ */ jsxs6(Box3, { sx: { px: 2, pt: 2, pb: 1.5 }, children: [
+          /* @__PURE__ */ jsxs6(Box3, { sx: { display: "flex", alignItems: "center", mb: 1.5 }, children: [
             /* @__PURE__ */ jsx18(
               TextField2,
               {
@@ -3195,8 +3191,8 @@ var ServiceSelectorPanel = ({
                 overflow: "auto",
                 py: 1
               },
-              children: loading ? /* @__PURE__ */ jsx18(Box3, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx18(Typography3, { variant: "body2", color: "text.secondary", children: "Loading services..." }) }) : filteredServices.length === 0 ? /* @__PURE__ */ jsx18(Box3, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx18(Typography3, { variant: "body2", color: "text.secondary", children: searchTerm ? `No ${showArchived ? "archived " : ""}services matching "${searchTerm}"` : showArchived ? "No archived services found" : "No active services found" }) }) : /* @__PURE__ */ jsxs7(Fragment2, { children: [
-                /* @__PURE__ */ jsxs7(
+              children: loading ? /* @__PURE__ */ jsx18(Box3, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx18(Typography3, { variant: "body2", color: "text.secondary", children: "Loading services..." }) }) : filteredServices.length === 0 ? /* @__PURE__ */ jsx18(Box3, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx18(Typography3, { variant: "body2", color: "text.secondary", children: searchTerm ? `No ${showArchived ? "archived " : ""}services matching "${searchTerm}"` : showArchived ? "No archived services found" : "No active services found" }) }) : /* @__PURE__ */ jsxs6(Fragment2, { children: [
+                /* @__PURE__ */ jsxs6(
                   Typography3,
                   {
                     variant: "caption",
@@ -3231,7 +3227,7 @@ var ServiceSelectorPanel = ({
                     ]
                   }
                 ),
-                /* @__PURE__ */ jsx18(List2, { disablePadding: true, children: filteredServices.map((service) => /* @__PURE__ */ jsxs7(
+                /* @__PURE__ */ jsx18(List2, { disablePadding: true, children: filteredServices.map((service) => /* @__PURE__ */ jsxs6(
                   ListItem,
                   {
                     sx: {
@@ -3353,7 +3349,7 @@ import KeyboardArrowDownIcon2 from "@mui/icons-material/KeyboardArrowDown";
 import SearchIcon3 from "@mui/icons-material/Search";
 import AddIcon2 from "@mui/icons-material/Add";
 import CheckIcon2 from "@mui/icons-material/Check";
-import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs7 } from "react/jsx-runtime";
 var WorkspaceSelectorButton = ({
   workspaces,
   selectedWorkspaceId,
@@ -3385,9 +3381,9 @@ var WorkspaceSelectorButton = ({
   if (!workspaces || workspaces.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsxs8(Fragment3, { children: [
-    /* @__PURE__ */ jsxs8(Box4, { sx: { display: "flex", alignItems: "center", ...sx }, children: [
-      selectedWorkspace ? /* @__PURE__ */ jsx19(Fragment3, { children: /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs7(Fragment3, { children: [
+    /* @__PURE__ */ jsxs7(Box4, { sx: { display: "flex", alignItems: "center", ...sx }, children: [
+      selectedWorkspace ? /* @__PURE__ */ jsx19(Fragment3, { children: /* @__PURE__ */ jsxs7(
         Link2,
         {
           underline: "hover",
@@ -3509,7 +3505,7 @@ var WorkspaceSelectorPanel = ({
           borderRadius: 2
         }
       },
-      children: /* @__PURE__ */ jsxs8(Box4, { children: [
+      children: /* @__PURE__ */ jsxs7(Box4, { children: [
         /* @__PURE__ */ jsx19(Box4, { sx: { px: 2, pt: 2, pb: 1.5 }, children: /* @__PURE__ */ jsx19(
           TextField3,
           {
@@ -3523,7 +3519,7 @@ var WorkspaceSelectorPanel = ({
             }
           }
         ) }),
-        /* @__PURE__ */ jsx19(Box4, { sx: { maxHeight: 400, overflowY: "auto" }, children: loading ? /* @__PURE__ */ jsx19(Box4, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx19(Typography4, { variant: "body2", color: "text.secondary", children: "Loading..." }) }) : filteredWorkspaces.length === 0 ? /* @__PURE__ */ jsx19(Box4, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx19(Typography4, { variant: "body2", color: "text.secondary", children: "No workspaces found" }) }) : /* @__PURE__ */ jsx19(List3, { dense: true, children: filteredWorkspaces.map((workspace) => /* @__PURE__ */ jsxs8(
+        /* @__PURE__ */ jsx19(Box4, { sx: { maxHeight: 400, overflowY: "auto" }, children: loading ? /* @__PURE__ */ jsx19(Box4, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx19(Typography4, { variant: "body2", color: "text.secondary", children: "Loading..." }) }) : filteredWorkspaces.length === 0 ? /* @__PURE__ */ jsx19(Box4, { sx: { p: 2, textAlign: "center" }, children: /* @__PURE__ */ jsx19(Typography4, { variant: "body2", color: "text.secondary", children: "No workspaces found" }) }) : /* @__PURE__ */ jsx19(List3, { dense: true, children: filteredWorkspaces.map((workspace) => /* @__PURE__ */ jsxs7(
           ListItem2,
           {
             onClick: () => handleSelect(workspace.id),
@@ -3546,7 +3542,7 @@ var WorkspaceSelectorPanel = ({
               /* @__PURE__ */ jsx19(
                 ListItemText3,
                 {
-                  primary: /* @__PURE__ */ jsxs8(Box4, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+                  primary: /* @__PURE__ */ jsxs7(Box4, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
                     /* @__PURE__ */ jsx19(Typography4, { variant: "body2", fontWeight: 500, children: workspace.name }),
                     workspace.id === selectedWorkspaceId && /* @__PURE__ */ jsx19(CheckIcon2, { fontSize: "small", color: "primary" })
                   ] }),
@@ -3787,7 +3783,7 @@ import { Box as Box6, Typography as Typography5, IconButton as IconButton4, Tool
 import { styled as styled12 } from "@mui/material/styles";
 import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
 import ChevronRightIcon from "@mui/icons-material/ChevronRight";
-import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs9 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs8 } from "react/jsx-runtime";
 var HeaderContainer = styled12(Box6, {
   shouldForwardProp: (prop) => prop !== "isCollapsed"
 })(({ theme: theme2, isCollapsed }) => ({
@@ -3828,7 +3824,7 @@ var SideNavHeader = React5.memo(({
   collapsed = false
 }) => {
   const headerAriaLabel = ariaLabel || `${title} navigation header`;
-  const brandingContent = /* @__PURE__ */ jsxs9(Fragment4, { children: [
+  const brandingContent = /* @__PURE__ */ jsxs8(Fragment4, { children: [
     logo && /* @__PURE__ */ jsx22(
       Box6,
       {
@@ -3856,7 +3852,7 @@ var SideNavHeader = React5.memo(({
       }
     )
   ] });
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs8(
     HeaderContainer,
     {
       "data-testid": "sidenav-header-content",
@@ -3930,7 +3926,7 @@ import {
   Tooltip as Tooltip3
 } from "@mui/material";
 import { styled as styled13 } from "@mui/material/styles";
-import { jsx as jsx23, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs9 } from "react/jsx-runtime";
 var StyledListItemButton2 = styled13(ListItemButton2, {
   shouldForwardProp: (prop) => !["selected", "size", "iconPosition", "isCollapsed"].includes(prop)
 })(({ theme: theme2, selected, size: size3, isCollapsed }) => {
@@ -4047,7 +4043,7 @@ var NavigationItem = React6.memo(({
       }
     }
   );
-  const buttonContent = /* @__PURE__ */ jsxs10(
+  const buttonContent = /* @__PURE__ */ jsxs9(
     StyledListItemButton2,
     {
       selected,
@@ -4173,7 +4169,7 @@ import React8 from "react";
 import { Box as Box8, Typography as Typography6, Tooltip as Tooltip4 } from "@mui/material";
 import { styled as styled14 } from "@mui/material/styles";
 import PowerIcon from "@mui/icons-material/Power";
-import { jsx as jsx25, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs10 } from "react/jsx-runtime";
 var StatusPill = styled14(Box8, {
   shouldForwardProp: (prop) => !["variant", "interactive"].includes(prop)
 })(({ theme: theme2, variant = "info", interactive }) => {
@@ -4248,7 +4244,7 @@ var ConnectionStatus = React8.memo(({
       onClick();
     }
   };
-  const statusContent = /* @__PURE__ */ jsxs11(
+  const statusContent = /* @__PURE__ */ jsxs10(
     StatusPill,
     {
       role: "status",
@@ -4307,7 +4303,7 @@ import React9 from "react";
 import { Box as Box9, Avatar as Avatar3, Typography as Typography7, Button as Button5, IconButton as IconButton5, Tooltip as Tooltip5 } from "@mui/material";
 import { styled as styled15 } from "@mui/material/styles";
 import LogoutIcon from "@mui/icons-material/Logout";
-import { jsx as jsx26, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs11 } from "react/jsx-runtime";
 var AccountContainer = styled15(Box9, {
   shouldForwardProp: (prop) => !["layout", "isCompact"].includes(prop)
 })(({ theme: theme2, layout = "horizontal", isCompact }) => ({
@@ -4349,7 +4345,7 @@ var AccountSection = React9.memo(({
   const initials = user.initials || deriveInitials(user.name);
   const avatarSrc = user.avatarUrl;
   if (compact) {
-    return /* @__PURE__ */ jsxs12(AccountContainer, { layout, isCompact: true, "aria-label": "Account section", children: [
+    return /* @__PURE__ */ jsxs11(AccountContainer, { layout, isCompact: true, "aria-label": "Account section", children: [
       /* @__PURE__ */ jsx26(
         Tooltip5,
         {
@@ -4393,7 +4389,7 @@ var AccountSection = React9.memo(({
       ) })
     ] });
   }
-  return /* @__PURE__ */ jsxs12(AccountContainer, { layout, isCompact: false, "aria-label": "Account section", children: [
+  return /* @__PURE__ */ jsxs11(AccountContainer, { layout, isCompact: false, "aria-label": "Account section", children: [
     /* @__PURE__ */ jsx26(
       Avatar3,
       {
@@ -4410,7 +4406,7 @@ var AccountSection = React9.memo(({
         children: initials
       }
     ),
-    /* @__PURE__ */ jsxs12(
+    /* @__PURE__ */ jsxs11(
       Box9,
       {
         sx: {
@@ -4554,7 +4550,7 @@ import {
   Divider
 } from "@mui/material";
 import { styled as styled18 } from "@mui/material/styles";
-import { Fragment as Fragment5, jsx as jsx29, jsxs as jsxs13 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx29, jsxs as jsxs12 } from "react/jsx-runtime";
 var StyledMenu = styled18(MuiMenu)(({ theme: theme2 }) => ({
   "& .MuiPaper-root": {
     borderRadius: 8,
@@ -4595,8 +4591,8 @@ var MenuItem = ({
   disabled = false,
   divider = false
 }) => {
-  return /* @__PURE__ */ jsxs13(Fragment5, { children: [
-    /* @__PURE__ */ jsxs13(MuiMenuItem, { onClick, disabled, children: [
+  return /* @__PURE__ */ jsxs12(Fragment5, { children: [
+    /* @__PURE__ */ jsxs12(MuiMenuItem, { onClick, disabled, children: [
       icon && /* @__PURE__ */ jsx29(ListItemIcon3, { children: icon }),
       /* @__PURE__ */ jsx29(ListItemText5, { children: label })
     ] }),
@@ -4660,7 +4656,7 @@ var Link3 = ({ underline = "hover", ...props }) => {
 };
 // src/components/navigation/Selector.tsx
-import { Fragment as Fragment6, jsx as jsx32, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx32, jsxs as jsxs13 } from "react/jsx-runtime";
 var Selector = ({
   options: options2,
   selectedId,
@@ -4693,12 +4689,12 @@ var Selector = ({
     onSelect(id);
     handleClose();
   };
-  const defaultRenderSelected = (option) => /* @__PURE__ */ jsxs14(Box10, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+  const defaultRenderSelected = (option) => /* @__PURE__ */ jsxs13(Box10, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
     option.avatar ? /* @__PURE__ */ jsx32(Avatar4, { src: option.avatar, sx: { width: 20, height: 20 } }) : option.icon ? option.icon : /* @__PURE__ */ jsx32(Avatar4, { sx: { width: 20, height: 20, bgcolor: theme2.palette.primary.main, fontSize: "0.7rem" }, children: option.name.charAt(0) }),
     /* @__PURE__ */ jsx32(Typography8, { variant: "body2", children: option.name })
   ] });
   if (compact) {
-    return /* @__PURE__ */ jsxs14(Fragment6, { children: [
+    return /* @__PURE__ */ jsxs13(Fragment6, { children: [
       /* @__PURE__ */ jsx32(IconButton, { onClick: handleOpen, size: "small", children: selectedOption ? selectedOption.avatar ? /* @__PURE__ */ jsx32(Avatar4, { src: selectedOption.avatar, sx: { width: 32, height: 32 } }) : /* @__PURE__ */ jsx32(Avatar4, { sx: { width: 32, height: 32, bgcolor: theme2.palette.primary.main }, children: selectedOption.name.charAt(0) }) : /* @__PURE__ */ jsx32(Avatar4, { sx: { width: 32, height: 32, bgcolor: theme2.palette.grey[400] }, children: "?" }) }),
       /* @__PURE__ */ jsx32(
         Menu4,
@@ -4709,7 +4705,7 @@ var Selector = ({
           PaperProps: {
             sx: { width, maxHeight: 600, mt: 1 }
           },
-          children: loading ? /* @__PURE__ */ jsx32(Box10, { sx: { display: "flex", justifyContent: "center", p: 2 }, children: /* @__PURE__ */ jsx32(CircularProgress, { size: 24 }) }) : /* @__PURE__ */ jsxs14(Fragment6, { children: [
+          children: loading ? /* @__PURE__ */ jsx32(Box10, { sx: { display: "flex", justifyContent: "center", p: 2 }, children: /* @__PURE__ */ jsx32(CircularProgress, { size: 24 }) }) : /* @__PURE__ */ jsxs13(Fragment6, { children: [
             options2.length > 5 && /* @__PURE__ */ jsx32(Box10, { sx: { p: 1, borderBottom: `1px solid ${theme2.palette.grey[200]}` }, children: /* @__PURE__ */ jsx32(
               TextField,
               {
@@ -4723,8 +4719,8 @@ var Selector = ({
                 }
               }
             ) }),
-            /* @__PURE__ */ jsxs14(List5, { sx: { maxHeight: 400, overflow: "auto" }, children: [
-              filteredOptions.map((option) => /* @__PURE__ */ jsxs14(
+            /* @__PURE__ */ jsxs13(List5, { sx: { maxHeight: 400, overflow: "auto" }, children: [
+              filteredOptions.map((option) => /* @__PURE__ */ jsxs13(
                 ListItemButton3,
                 {
                   selected: option.id === selectedId,
@@ -4756,8 +4752,8 @@ var Selector = ({
       )
     ] });
   }
-  return /* @__PURE__ */ jsxs14(Fragment6, { children: [
-    /* @__PURE__ */ jsxs14(Box10, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
+  return /* @__PURE__ */ jsxs13(Fragment6, { children: [
+    /* @__PURE__ */ jsxs13(Box10, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
       selectedOption ? renderSelected ? /* @__PURE__ */ jsx32(Link3, { onClick: handleOpen, underline: "hover", children: renderSelected(selectedOption) }) : /* @__PURE__ */ jsx32(Link3, { onClick: handleOpen, underline: "hover", children: defaultRenderSelected(selectedOption) }) : /* @__PURE__ */ jsx32(Typography8, { variant: "body2", color: "text.secondary", children: placeholder }),
       /* @__PURE__ */ jsx32(IconButton, { onClick: handleOpen, size: "small", sx: { p: 0.2, ml: 0.5 }, children: /* @__PURE__ */ jsx32(KeyboardArrowDownIcon3, { fontSize: "small" }) })
     ] }),
@@ -4770,7 +4766,7 @@ var Selector = ({
         PaperProps: {
           sx: { width, maxHeight: 600, mt: 1 }
         },
-        children: loading ? /* @__PURE__ */ jsx32(Box10, { sx: { display: "flex", justifyContent: "center", p: 2 }, children: /* @__PURE__ */ jsx32(CircularProgress, { size: 24 }) }) : /* @__PURE__ */ jsxs14(Fragment6, { children: [
+        children: loading ? /* @__PURE__ */ jsx32(Box10, { sx: { display: "flex", justifyContent: "center", p: 2 }, children: /* @__PURE__ */ jsx32(CircularProgress, { size: 24 }) }) : /* @__PURE__ */ jsxs13(Fragment6, { children: [
           options2.length > 5 && /* @__PURE__ */ jsx32(Box10, { sx: { p: 1, borderBottom: `1px solid ${theme2.palette.grey[200]}` }, children: /* @__PURE__ */ jsx32(
             TextField,
             {
@@ -4784,8 +4780,8 @@ var Selector = ({
               }
             }
           ) }),
-          /* @__PURE__ */ jsxs14(List5, { sx: { maxHeight: 400, overflow: "auto" }, children: [
-            filteredOptions.map((option) => /* @__PURE__ */ jsxs14(
+          /* @__PURE__ */ jsxs13(List5, { sx: { maxHeight: 400, overflow: "auto" }, children: [
+            filteredOptions.map((option) => /* @__PURE__ */ jsxs13(
               ListItemButton3,
               {
                 selected: option.id === selectedId,
@@ -4934,7 +4930,7 @@ import Box11 from "@mui/material/Box";
 import Tooltip6 from "@mui/material/Tooltip";
 import CheckIcon3 from "@mui/icons-material/Check";
 import ContentCopyIcon from "@mui/icons-material/ContentCopy";
-import { jsx as jsx35, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs14 } from "react/jsx-runtime";
 var COPY_FEEDBACK_MS = 1200;
 var CopyChip = ({
   text,
@@ -4962,7 +4958,7 @@ var CopyChip = ({
     if (timerRef.current != null) clearTimeout(timerRef.current);
     timerRef.current = setTimeout(() => setCopied(false), COPY_FEEDBACK_MS);
   };
-  return /* @__PURE__ */ jsx35(Tooltip6, { title: copied ? tooltipCopiedLabel : tooltipLabel, placement: "top", children: /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsx35(Tooltip6, { title: copied ? tooltipCopiedLabel : tooltipLabel, placement: "top", children: /* @__PURE__ */ jsxs14(
     Box11,
     {
       component: "button",
@@ -5056,7 +5052,7 @@ import Snackbar from "@mui/material/Snackbar";
 import Alert from "@mui/material/Alert";
 import ContentCopyIcon2 from "@mui/icons-material/ContentCopy";
 import { styled as styled24 } from "@mui/material/styles";
-import { Fragment as Fragment7, jsx as jsx37, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx37, jsxs as jsxs15 } from "react/jsx-runtime";
 var IDContainer = styled24(Box12)(() => ({
   display: "inline-flex",
   alignItems: "center",
@@ -5092,9 +5088,9 @@ var IDBlock = ({
   const handleSnackbarClose = () => {
     setSnackbar((prev) => ({ ...prev, open: false }));
   };
-  return /* @__PURE__ */ jsxs16(Fragment7, { children: [
-    /* @__PURE__ */ jsxs16(IDContainer, { children: [
-      /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs15(Fragment7, { children: [
+    /* @__PURE__ */ jsxs15(IDContainer, { children: [
+      /* @__PURE__ */ jsxs15(
         Typography9,
         {
           variant: "body2",
@@ -5222,7 +5218,7 @@ import MuiAlert from "@mui/material/Alert";
 import { AlertTitle as MuiAlertTitle } from "@mui/material";
 import MuiSnackbar from "@mui/material/Snackbar";
 import { styled as styled27 } from "@mui/material/styles";
-import { jsx as jsx40, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs16 } from "react/jsx-runtime";
 var StyledAlert = styled27(MuiAlert)({
   borderRadius: 8,
   "&.MuiAlert-filled": {
@@ -5235,7 +5231,7 @@ var Alert2 = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs17(StyledAlert, { severity, ...props, children: [
+  return /* @__PURE__ */ jsxs16(StyledAlert, { severity, ...props, children: [
     title && /* @__PURE__ */ jsx40(MuiAlertTitle, { children: title }),
     children
   ] });
@@ -5305,14 +5301,14 @@ var Snackbar2 = ({
 // src/components/feedback/EmptyState.tsx
 import { Box as Box13, Typography as Typography10 } from "@mui/material";
-import { jsx as jsx41, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs17 } from "react/jsx-runtime";
 var EmptyState = ({
   title = "No items found",
   description,
   icon,
   action
 }) => {
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs17(
     Box13,
     {
       sx: {
@@ -5346,13 +5342,13 @@ var EmptyState = ({
 // src/components/feedback/Loading.tsx
 import { Box as Box14, CircularProgress as CircularProgress3, Typography as Typography11 } from "@mui/material";
-import { jsx as jsx42, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs18 } from "react/jsx-runtime";
 var Loading = ({
   message = "Loading...",
   size: size3 = 40,
   fullScreen = false
 }) => {
-  const content = /* @__PURE__ */ jsxs19(
+  const content = /* @__PURE__ */ jsxs18(
     Box14,
     {
       sx: {
@@ -5385,13 +5381,13 @@ var Loading = ({
 // src/components/feedback/AppLoading.tsx
 import { Box as Box15, CircularProgress as CircularProgress4, Typography as Typography12 } from "@mui/material";
-import { jsx as jsx43, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs19 } from "react/jsx-runtime";
 var AppLoading = ({
   message = "Loading...",
   logo = "/icons/logo.png",
   sx = {}
 }) => {
-  return /* @__PURE__ */ jsxs20(
+  return /* @__PURE__ */ jsxs19(
     Box15,
     {
       sx: [
@@ -5450,8 +5446,8 @@ import { Stack as Stack3, styled as styled28, svgIconClasses } from "@mui/materi
 // src/components/icons/CereIcon.tsx
 import { memo } from "react";
 import { SvgIcon } from "@mui/material";
-import { jsx as jsx45, jsxs as jsxs21 } from "react/jsx-runtime";
-var CereIcon = memo((props) => /* @__PURE__ */ jsxs21(SvgIcon, { ...props, viewBox: "0 0 24 28", children: [
+import { jsx as jsx45, jsxs as jsxs20 } from "react/jsx-runtime";
+var CereIcon = memo((props) => /* @__PURE__ */ jsxs20(SvgIcon, { ...props, viewBox: "0 0 24 28", children: [
   /* @__PURE__ */ jsx45("g", { clipPath: "url(#a)", children: /* @__PURE__ */ jsx45(
     "path",
     {
@@ -5463,7 +5459,7 @@ var CereIcon = memo((props) => /* @__PURE__ */ jsxs21(SvgIcon, { ...props, viewB
 ] }));
 // src/components/layout/Logo.tsx
-import { jsx as jsx46, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs21 } from "react/jsx-runtime";
 var sizesMap = {
   large: 38,
   medium: 32,
@@ -5474,7 +5470,7 @@ var Container = styled28(Stack3)({
     fontSize: "inherit"
   }
 });
-var Logo = ({ children, size: size3 = "medium", icon = /* @__PURE__ */ jsx46(CereIcon, { color: "primary" }) }) => /* @__PURE__ */ jsxs22(Container, { direction: "row", alignItems: "center", spacing: 2, fontSize: sizesMap[size3], children: [
+var Logo = ({ children, size: size3 = "medium", icon = /* @__PURE__ */ jsx46(CereIcon, { color: "primary" }) }) => /* @__PURE__ */ jsxs21(Container, { direction: "row", alignItems: "center", spacing: 2, fontSize: sizesMap[size3], children: [
   icon,
   children && /* @__PURE__ */ jsx46(Stack3, { children })
 ] });
@@ -5493,7 +5489,7 @@ import {
   CircularProgress as CircularProgress6
 } from "@mui/material";
 import CloseIcon from "@mui/icons-material/Close";
-import { Fragment as Fragment8, jsx as jsx47, jsxs as jsxs23 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx47, jsxs as jsxs22 } from "react/jsx-runtime";
 var Dialog = ({
   open,
   title,
@@ -5517,7 +5513,7 @@ var Dialog = ({
     if (e) e.stopPropagation();
     onClose();
   };
-  return /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsxs22(
     MuiDialog,
     {
       open,
@@ -5534,9 +5530,9 @@ var Dialog = ({
         ...dialogProps.PaperProps
       },
       children: [
-        /* @__PURE__ */ jsxs23(DialogTitle, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", p: 2 }, children: [
+        /* @__PURE__ */ jsxs22(DialogTitle, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", p: 2 }, children: [
           /* @__PURE__ */ jsx47(Box16, { sx: { display: "flex", alignItems: "center" }, children: typeof title === "string" ? /* @__PURE__ */ jsx47(Typography13, { variant: "h6", children: title }) : title }),
-          /* @__PURE__ */ jsxs23(Box16, { sx: { display: "flex", alignItems: "center" }, children: [
+          /* @__PURE__ */ jsxs22(Box16, { sx: { display: "flex", alignItems: "center" }, children: [
             headerAction,
             /* @__PURE__ */ jsx47(
               IconButton7,
@@ -5552,9 +5548,9 @@ var Dialog = ({
         ] }),
         dividers && /* @__PURE__ */ jsx47(Divider2, {}),
         /* @__PURE__ */ jsx47(DialogContent, { dividers, children }),
-        (showActions || customActions) && /* @__PURE__ */ jsxs23(Fragment8, { children: [
+        (showActions || customActions) && /* @__PURE__ */ jsxs22(Fragment8, { children: [
           dividers && /* @__PURE__ */ jsx47(Divider2, {}),
-          /* @__PURE__ */ jsx47(DialogActions, { children: customActions || /* @__PURE__ */ jsxs23(Fragment8, { children: [
+          /* @__PURE__ */ jsx47(DialogActions, { children: customActions || /* @__PURE__ */ jsxs22(Fragment8, { children: [
             /* @__PURE__ */ jsx47(
               Button6,
               {
@@ -5607,7 +5603,7 @@ function resolveDrawerWidth(width, theme2, defaultWidth) {
 }
 // src/components/layout/Drawer.tsx
-import { Fragment as Fragment9, jsx as jsx48, jsxs as jsxs24 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx48, jsxs as jsxs23 } from "react/jsx-runtime";
 var StyledDrawer2 = styled29(MuiDrawer, {
   shouldForwardProp: (prop) => prop !== "width" && prop !== "miniWidth" && prop !== "collapsed" && prop !== "topOffset"
 })(({ theme: theme2, width, miniWidth = 72, collapsed, topOffset = 0 }) => {
@@ -5657,7 +5653,7 @@ var Drawer2 = ({
   const finalWidth = width ?? defaultWidth;
   const shouldShowClose = showCloseButton ?? (variant === "temporary" || variant === "persistent");
   const hasHeader = title || header || shouldShowClose || tabs;
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs23(
     StyledDrawer2,
     {
       width: finalWidth,
@@ -5682,7 +5678,7 @@ var Drawer2 = ({
       },
       ...props,
       children: [
-        hasHeader && /* @__PURE__ */ jsxs24(Fragment9, { children: [
+        hasHeader && /* @__PURE__ */ jsxs23(Fragment9, { children: [
           /* @__PURE__ */ jsx48(
             Box17,
             {
@@ -5695,7 +5691,7 @@ var Drawer2 = ({
                 borderBottom: 1,
                 borderColor: "divider"
               },
-              children: header || /* @__PURE__ */ jsxs24(Fragment9, { children: [
+              children: header || /* @__PURE__ */ jsxs23(Fragment9, { children: [
                 /* @__PURE__ */ jsx48(Box17, { sx: { flex: 1 }, children: typeof title === "string" ? /* @__PURE__ */ jsx48(Typography14, { variant: "h6", children: title }) : title }),
                 shouldShowClose && onClose && /* @__PURE__ */ jsx48(
                   IconButton8,
@@ -5745,7 +5741,7 @@ var Drawer2 = ({
             children
           }
         ),
-        footer && /* @__PURE__ */ jsxs24(Fragment9, { children: [
+        footer && /* @__PURE__ */ jsxs23(Fragment9, { children: [
           /* @__PURE__ */ jsx48(Divider3, {}),
           /* @__PURE__ */ jsx48(
             Box17,
@@ -5767,10 +5763,10 @@ var Drawer2 = ({
 // src/components/layout/MetaField.tsx
 import Box18 from "@mui/material/Box";
 import Typography15 from "@mui/material/Typography";
-import { jsx as jsx49, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx49, jsxs as jsxs24 } from "react/jsx-runtime";
 var MetaField = ({ label, value, mono = false, title }) => {
   const resolvedTitle = title ?? (typeof value === "string" ? value : void 0);
-  return /* @__PURE__ */ jsxs25(Box18, { sx: { display: "flex", flexDirection: "column", gap: 0.25, minWidth: 0 }, children: [
+  return /* @__PURE__ */ jsxs24(Box18, { sx: { display: "flex", flexDirection: "column", gap: 0.25, minWidth: 0 }, children: [
     /* @__PURE__ */ jsx49(
       Typography15,
       {
@@ -5809,7 +5805,7 @@ import Box19 from "@mui/material/Box";
 import IconButton9 from "@mui/material/IconButton";
 import ChevronLeftIcon2 from "@mui/icons-material/ChevronLeft";
 import ChevronRightIcon2 from "@mui/icons-material/ChevronRight";
-import { jsx as jsx50, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx50, jsxs as jsxs25 } from "react/jsx-runtime";
 var EDGE_TOLERANCE_PX = 4;
 var ScrollableRow = ({
   children,
@@ -5849,7 +5845,7 @@ var ScrollableRow = ({
     if (!el) return;
     el.scrollBy({ left: dir * Math.max(minNudge, el.clientWidth * nudgeFraction), behavior: "smooth" });
   };
-  return /* @__PURE__ */ jsxs26(Box19, { sx: { position: "relative", flex: 1, minWidth: 0 }, children: [
+  return /* @__PURE__ */ jsxs25(Box19, { sx: { position: "relative", flex: 1, minWidth: 0 }, children: [
     /* @__PURE__ */ jsx50(
       Box19,
       {
@@ -5908,7 +5904,7 @@ var ScrollableRow = ({
 // src/components/layout/SectionRow.tsx
 import Box20 from "@mui/material/Box";
 import Typography16 from "@mui/material/Typography";
-import { jsx as jsx51, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs26 } from "react/jsx-runtime";
 function SectionRow({
   title,
   subtitle,
@@ -5917,8 +5913,8 @@ function SectionRow({
   rightLabel,
   children
 }) {
-  return /* @__PURE__ */ jsxs27(Box20, { component: "section", sx: { mb: 4 }, children: [
-    /* @__PURE__ */ jsxs27(
+  return /* @__PURE__ */ jsxs26(Box20, { component: "section", sx: { mb: 4 }, children: [
+    /* @__PURE__ */ jsxs26(
       Box20,
       {
         component: "header",
@@ -5930,7 +5926,7 @@ function SectionRow({
           mb: 1.5
         },
         children: [
-          /* @__PURE__ */ jsxs27(Box20, { sx: { minWidth: 0 }, children: [
+          /* @__PURE__ */ jsxs26(Box20, { sx: { minWidth: 0 }, children: [
             /* @__PURE__ */ jsx51(Typography16, { component: "h2", variant: "h6", sx: { m: 0 }, children: title }),
             subtitle && /* @__PURE__ */ jsx51(Typography16, { variant: "caption", sx: { color: "text.secondary" }, children: subtitle })
           ] }),
@@ -5943,14 +5939,16 @@ function SectionRow({
 }
 // src/components/layout/Carousel.tsx
-import { useEffect as useEffect5, useState as useState10 } from "react";
+import { useEffect as useEffect5, useMemo, useState as useState10 } from "react";
 import Box21 from "@mui/material/Box";
 import IconButton10 from "@mui/material/IconButton";
 import Typography17 from "@mui/material/Typography";
 import ChevronLeftIcon3 from "@mui/icons-material/ChevronLeft";
 import ChevronRightIcon3 from "@mui/icons-material/ChevronRight";
+import { alpha } from "@mui/material/styles";
 import useEmblaCarousel from "embla-carousel-react";
-import { Fragment as Fragment10, jsx as jsx52, jsxs as jsxs28 } from "react/jsx-runtime";
+import Autoplay from "embla-carousel-autoplay";
+import { Fragment as Fragment10, jsx as jsx52, jsxs as jsxs27 } from "react/jsx-runtime";
 var pad2 = (n) => String(n).padStart(2, "0");
 function Carousel({
   slides,
@@ -5967,33 +5965,49 @@ function Carousel({
   onSelect,
   arrowSx,
   dotColor,
-  dotActiveColor
+  dotActiveColor,
+  emblaOptions
 }) {
-  const [emblaRef, emblaApi] = useEmblaCarousel({ loop: true, align: "start" });
+  const plugins = useMemo(
+    () => autoplay ? [
+      Autoplay({
+        delay: autoplayDelayMs,
+        stopOnInteraction: true,
+        stopOnMouseEnter: pauseOnHover
+      })
+    ] : [],
+    [autoplay, autoplayDelayMs, pauseOnHover]
+  );
+  const [emblaRef, emblaApi] = useEmblaCarousel(
+    { loop: true, align: "start", ...emblaOptions },
+    plugins
+  );
   const [selected, setSelected] = useState10(0);
-  const [paused, setPaused] = useState10(false);
+  const [snapCount, setSnapCount] = useState10(0);
   const count = slides.length;
   useEffect5(() => {
     if (!emblaApi) return;
+    const refreshSnaps = () => {
+      setSnapCount(emblaApi.scrollSnapList().length);
+    };
     const handleSelect = () => {
       const next = emblaApi.selectedScrollSnap();
       setSelected(next);
       onSelect?.(next);
     };
     emblaApi.on("select", handleSelect);
+    emblaApi.on("reInit", refreshSnaps);
+    refreshSnaps();
     handleSelect();
     return () => {
       emblaApi.off("select", handleSelect);
+      emblaApi.off("reInit", refreshSnaps);
     };
   }, [emblaApi, onSelect]);
-  useEffect5(() => {
-    if (!emblaApi || !autoplay || paused || count <= 1) return;
-    const id = window.setInterval(() => emblaApi.scrollNext(), autoplayDelayMs);
-    return () => window.clearInterval(id);
-  }, [emblaApi, autoplay, paused, count, autoplayDelayMs]);
   if (count === 0) return null;
   const showControls = count > 1;
   const slideBasis = `${100 / Math.max(1, slidesPerView)}%`;
+  const dotCount = snapCount > 0 ? snapCount : count;
   const arrowBaseSx = {
     position: "absolute",
     top: "50%",
@@ -6002,14 +6016,12 @@ function Carousel({
     boxShadow: 1,
     "&:hover": { bgcolor: "background.paper" }
   };
-  return /* @__PURE__ */ jsxs28(
+  return /* @__PURE__ */ jsxs27(
     Box21,
     {
       role: "region",
       "aria-roledescription": "carousel",
       "aria-label": ariaLabel,
-      onPointerEnter: pauseOnHover ? () => setPaused(true) : void 0,
-      onPointerLeave: pauseOnHover ? () => setPaused(false) : void 0,
       sx: { position: "relative", width: "100%" },
       children: [
         /* @__PURE__ */ jsx52(Box21, { ref: emblaRef, sx: { overflow: "hidden" }, children: /* @__PURE__ */ jsx52(Box21, { sx: { display: "flex" }, children: slides.map((item, i) => /* @__PURE__ */ jsx52(
@@ -6023,7 +6035,7 @@ function Carousel({
           },
           getKey ? getKey(item, i) : i
         )) }) }),
-        showControls && showArrows && /* @__PURE__ */ jsxs28(Fragment10, { children: [
+        showControls && showArrows && /* @__PURE__ */ jsxs27(Fragment10, { children: [
           /* @__PURE__ */ jsx52(
             IconButton10,
             {
@@ -6043,25 +6055,25 @@ function Carousel({
             }
           )
         ] }),
-        showControls && showCounter && /* @__PURE__ */ jsxs28(
+        showControls && showCounter && /* @__PURE__ */ jsxs27(
           Typography17,
           {
             variant: "caption",
-            sx: {
+            sx: (theme2) => ({
               position: "absolute",
               top: 12,
               right: 16,
               px: 1,
               py: 0.25,
               borderRadius: 1,
-              bgcolor: "rgba(0,0,0,0.5)",
+              bgcolor: alpha(theme2.palette.common.black, 0.5),
               color: "common.white",
               letterSpacing: 1
-            },
+            }),
             children: [
               pad2(selected + 1),
               " / ",
-              pad2(count)
+              pad2(dotCount)
             ]
           }
         ),
@@ -6079,7 +6091,7 @@ function Carousel({
               justifyContent: "center",
               gap: 1
             },
-            children: slides.map((item, i) => /* @__PURE__ */ jsx52(
+            children: Array.from({ length: dotCount }).map((_, i) => /* @__PURE__ */ jsx52(
               Box21,
               {
                 component: "button",
@@ -6099,7 +6111,7 @@ function Carousel({
                   transition: "width 0.2s ease, background 0.2s ease"
                 })
               },
-              getKey ? getKey(item, i) : i
+              i
             ))
           }
         )
@@ -6167,7 +6179,7 @@ function GradientSurface({ index, children, sx }) {
 // src/components/layout/DefinitionRow.tsx
 import Box23 from "@mui/material/Box";
 import Typography18 from "@mui/material/Typography";
-import { jsx as jsx54, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx54, jsxs as jsxs28 } from "react/jsx-runtime";
 function DefinitionRow({
   icon,
   label,
@@ -6177,7 +6189,7 @@ function DefinitionRow({
   dense = false,
   divider = true
 }) {
-  return /* @__PURE__ */ jsxs29(
+  return /* @__PURE__ */ jsxs28(
     Box23,
     {
       "data-density": dense ? "dense" : "normal",
@@ -6189,16 +6201,16 @@ function DefinitionRow({
         ...divider && {
           borderBottom: "1px solid",
           borderColor: "divider",
-          "&:last-of-type": { borderBottom: "none" }
+          "&:last-child": { borderBottom: "none" }
         }
       },
       children: [
         icon && /* @__PURE__ */ jsx54(Box23, { sx: { display: "flex", alignItems: "center", color: "text.secondary" }, children: icon }),
-        /* @__PURE__ */ jsxs29(Box23, { sx: { minWidth: 0, flex: 1 }, children: [
+        /* @__PURE__ */ jsxs28(Box23, { sx: { minWidth: 0, flex: 1 }, children: [
           /* @__PURE__ */ jsx54(Typography18, { variant: "body2", sx: { fontWeight: 500, lineHeight: 1.2 }, children: label }),
           sublabel && /* @__PURE__ */ jsx54(Typography18, { variant: "caption", sx: { color: "text.secondary" }, children: sublabel })
         ] }),
-        (value || hint) && /* @__PURE__ */ jsxs29(
+        (value || hint) && /* @__PURE__ */ jsxs28(
           Box23,
           {
             sx: {
@@ -6226,7 +6238,7 @@ import Box24 from "@mui/material/Box";
 import Typography19 from "@mui/material/Typography";
 import Slide from "@mui/material/Slide";
 import CloseIcon3 from "@mui/icons-material/Close";
-import { jsx as jsx55, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx55, jsxs as jsxs29 } from "react/jsx-runtime";
 var WIDTH_PX = {
   sm: 420,
   md: 640,
@@ -6264,23 +6276,29 @@ function PanelDialog({
   const paperBaseSx = {
     width: WIDTH_PX[width],
     maxWidth: "100%",
+    // Lay paper children out as a flex column so the body can `flex: 1` and
+    // own its own scroll region.
+    display: "flex",
+    flexDirection: "column",
     ...isRight && {
       position: "absolute",
       right: 0,
       top: 0,
       bottom: 0,
       margin: 0,
-      maxHeight: "100vh",
-      height: "100vh",
+      // Use dynamic viewport units so mobile browsers (esp. iOS Safari) don't
+      // pop the layout when the URL bar shows/hides.
+      maxHeight: "100dvh",
+      height: "100dvh",
       borderRadius: 0
     }
   };
-  return /* @__PURE__ */ jsxs30(
+  return /* @__PURE__ */ jsxs29(
     MuiDialog2,
     {
       open,
       onClose,
-      TransitionComponent,
+      slots: TransitionComponent ? { transition: TransitionComponent } : void 0,
       slotProps: {
         paper: {
           "aria-label": accessibleName,
@@ -6289,7 +6307,7 @@ function PanelDialog({
         ...backdropSx ? { backdrop: { sx: backdropSx } } : {}
       },
       children: [
-        !hideHeader && /* @__PURE__ */ jsxs30(
+        !hideHeader && /* @__PURE__ */ jsxs29(
           Box24,
           {
             sx: {
@@ -6304,7 +6322,7 @@ function PanelDialog({
             },
             children: [
               /* @__PURE__ */ jsx55(Box24, { sx: { display: "flex", alignItems: "center", minWidth: 0 }, children: typeof title === "string" ? /* @__PURE__ */ jsx55(Typography19, { variant: "h6", noWrap: true, children: title }) : title }),
-              /* @__PURE__ */ jsxs30(Box24, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+              /* @__PURE__ */ jsxs29(Box24, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
                 headerActions,
                 /* @__PURE__ */ jsx55(IconButton11, { "aria-label": "Close", onClick: onClose, edge: "end", size: "small", children: /* @__PURE__ */ jsx55(CloseIcon3, { fontSize: "small" }) })
               ] })
@@ -6351,7 +6369,7 @@ var StyledCard = styled30(MuiCard, {
     borderRadius: 8,
     transition: "all 0.2s ease-in-out",
     ...dsVariant === "standard" && {
-      boxShadow: "0px 1px 3px rgba(0, 0, 0, 0.12)",
+      boxShadow: theme2.shadows[1],
       backgroundColor: theme2.palette.background.paper
     },
     ...dsVariant === "tinted" && {
@@ -6369,7 +6387,7 @@ var StyledCard = styled30(MuiCard, {
     },
     ...hoverable && {
       "&:hover": {
-        boxShadow: "0px 4px 12px rgba(0, 0, 0, 0.15)",
+        boxShadow: theme2.shadows[4],
         transform: "translateY(-2px)"
       }
     }
@@ -6413,7 +6431,7 @@ import {
   ListItemSecondaryAction
 } from "@mui/material";
 import { styled as styled31 } from "@mui/material/styles";
-import { jsx as jsx57, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs30 } from "react/jsx-runtime";
 var List6 = (props) => {
   return /* @__PURE__ */ jsx57(MuiList, { ...props });
 };
@@ -6438,7 +6456,7 @@ var ListItem4 = ({
   children,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs31(StyledListItem, { hoverable, ...props, children: [
+  return /* @__PURE__ */ jsxs30(StyledListItem, { hoverable, ...props, children: [
     icon && /* @__PURE__ */ jsx57(ListItemIcon4, { children: icon }),
     (primary || secondary) && /* @__PURE__ */ jsx57(
       ListItemText7,
@@ -6573,7 +6591,7 @@ import {
 } from "@mui/material";
 import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
 import { styled as styled35 } from "@mui/material/styles";
-import { jsx as jsx61, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs31 } from "react/jsx-runtime";
 var StyledAccordion = styled35(MuiAccordion)(({ theme: theme2 }) => ({
   borderRadius: 8,
   boxShadow: "none",
@@ -6604,7 +6622,7 @@ var Accordion = ({
   defaultExpanded = false,
   ...props
 }) => {
-  return /* @__PURE__ */ jsxs32(StyledAccordion, { defaultExpanded, ...props, children: [
+  return /* @__PURE__ */ jsxs31(StyledAccordion, { defaultExpanded, ...props, children: [
     /* @__PURE__ */ jsx61(StyledAccordionSummary, { expandIcon: /* @__PURE__ */ jsx61(ExpandMoreIcon, {}), children: title }),
     /* @__PURE__ */ jsx61(StyledAccordionDetails, { children })
   ] });
@@ -6692,7 +6710,7 @@ import Typography22 from "@mui/material/Typography";
 import IconButton12 from "@mui/material/IconButton";
 import Divider5 from "@mui/material/Divider";
 import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
-import { jsx as jsx66, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx66, jsxs as jsxs32 } from "react/jsx-runtime";
 var EntityHeader = ({
   title,
   subtitle,
@@ -6711,8 +6729,8 @@ var EntityHeader = ({
     const { label, count } = primaryAction;
     return count !== void 0 ? `${label} (${count})` : label;
   };
-  return /* @__PURE__ */ jsxs33(Box26, { children: [
-    /* @__PURE__ */ jsxs33(
+  return /* @__PURE__ */ jsxs32(Box26, { children: [
+    /* @__PURE__ */ jsxs32(
       Box26,
       {
         sx: {
@@ -6724,7 +6742,7 @@ var EntityHeader = ({
           gap: 1
         },
         children: [
-          /* @__PURE__ */ jsxs33(
+          /* @__PURE__ */ jsxs32(
             Box26,
             {
               sx: {
@@ -6734,7 +6752,7 @@ var EntityHeader = ({
                 flexWrap: "wrap"
               },
               children: [
-                /* @__PURE__ */ jsxs33(
+                /* @__PURE__ */ jsxs32(
                   Box26,
                   {
                     sx: {
@@ -6779,7 +6797,7 @@ var EntityHeader = ({
               ]
             }
           ),
-          /* @__PURE__ */ jsxs33(
+          /* @__PURE__ */ jsxs32(
             Box26,
             {
               sx: {
@@ -6875,7 +6893,7 @@ function useControlledExpand(controlledExpanded, onToggle, defaultExpanded = fal
 }
 // src/components/layout/DeploymentDashboardCard/DeploymentDashboardCard.tsx
-import { Fragment as Fragment11, jsx as jsx67, jsxs as jsxs34 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx67, jsxs as jsxs33 } from "react/jsx-runtime";
 var ENTITY_LABELS = {
   workspace: "Workspace",
   stream: "Stream",
@@ -6919,7 +6937,7 @@ var StatusDot2 = styled39(Box27, {
   backgroundColor: status ? STATUS_DOT_COLORS[status] ?? "transparent" : "transparent",
   flexShrink: 0
 }));
-var EntityChip = ({ entityType, color }) => /* @__PURE__ */ jsxs34(
+var EntityChip = ({ entityType, color }) => /* @__PURE__ */ jsxs33(
   Box27,
   {
     sx: {
@@ -6953,10 +6971,10 @@ var EntityChip = ({ entityType, color }) => /* @__PURE__ */ jsxs34(
     ]
   }
 );
-var CapacityBar = ({ value, indented = false }) => /* @__PURE__ */ jsxs34(Box27, { sx: { pl: indented ? "40px" : 0, pr: "20px", py: 1 }, children: [
-  /* @__PURE__ */ jsxs34(Box27, { sx: { display: "flex", justifyContent: "space-between", mb: 1 }, children: [
+var CapacityBar = ({ value, indented = false }) => /* @__PURE__ */ jsxs33(Box27, { sx: { pl: indented ? "40px" : 0, pr: "20px", py: 1 }, children: [
+  /* @__PURE__ */ jsxs33(Box27, { sx: { display: "flex", justifyContent: "space-between", mb: 1 }, children: [
     /* @__PURE__ */ jsx67(Typography23, { variant: "body2", sx: { color: deploymentSurfaceTokens.textPrimary }, children: "Capacity" }),
-    /* @__PURE__ */ jsxs34(Typography23, { variant: "body2", sx: { color: deploymentSurfaceTokens.accentBlue }, children: [
+    /* @__PURE__ */ jsxs33(Typography23, { variant: "body2", sx: { color: deploymentSurfaceTokens.accentBlue }, children: [
       value,
       "%"
     ] })
@@ -7001,7 +7019,7 @@ var getActionButtonStyles = (action) => {
   };
   return { ...baseStyles, ...variantStyles };
 };
-var CardAction = ({ action }) => /* @__PURE__ */ jsxs34(
+var CardAction = ({ action }) => /* @__PURE__ */ jsxs33(
   Box27,
   {
     component: action.onClick ? "button" : "span",
@@ -7046,7 +7064,7 @@ var DeploymentDashboardCard = ({
     return Math.min(100, Math.max(0, capacity2));
   };
   const capacityClamped = getClampedCapacity(capacity);
-  return /* @__PURE__ */ jsxs34(
+  return /* @__PURE__ */ jsxs33(
     Paper2,
     {
       className,
@@ -7063,7 +7081,7 @@ var DeploymentDashboardCard = ({
         gap: 0
       },
       children: [
-        /* @__PURE__ */ jsxs34(
+        /* @__PURE__ */ jsxs33(
           Box27,
           {
             sx: {
@@ -7073,8 +7091,8 @@ var DeploymentDashboardCard = ({
               width: "100%"
             },
             children: [
-              /* @__PURE__ */ jsxs34(Box27, { sx: { display: "flex", flexDirection: "column", gap: 0.5, minWidth: 0 }, children: [
-                /* @__PURE__ */ jsxs34(Box27, { sx: { display: "flex", gap: 1, alignItems: "center" }, children: [
+              /* @__PURE__ */ jsxs33(Box27, { sx: { display: "flex", flexDirection: "column", gap: 0.5, minWidth: 0 }, children: [
+                /* @__PURE__ */ jsxs33(Box27, { sx: { display: "flex", gap: 1, alignItems: "center" }, children: [
                   expandable ? /* @__PURE__ */ jsx67(
                     IconButton13,
                     {
@@ -7098,7 +7116,7 @@ var DeploymentDashboardCard = ({
                   ),
                   idDisplay != null && /* @__PURE__ */ jsx67(IDBlock, { id: idDisplay, label: "ID", entityType, onCopy: onCopyId })
                 ] }),
-                (createdAt != null || updatedAt != null) && /* @__PURE__ */ jsxs34(
+                (createdAt != null || updatedAt != null) && /* @__PURE__ */ jsxs33(
                   Box27,
                   {
                     sx: {
@@ -7108,11 +7126,11 @@ var DeploymentDashboardCard = ({
                       color: deploymentSurfaceTokens.textSecondary
                     },
                     children: [
-                      createdAt != null && /* @__PURE__ */ jsxs34(Typography23, { variant: "body2", sx: { color: "inherit", fontSize: "14px" }, children: [
+                      createdAt != null && /* @__PURE__ */ jsxs33(Typography23, { variant: "body2", sx: { color: "inherit", fontSize: "14px" }, children: [
                         "Created: ",
                         createdAt
                       ] }),
-                      updatedAt != null && /* @__PURE__ */ jsxs34(Typography23, { variant: "body2", sx: { color: "inherit", fontSize: "14px" }, children: [
+                      updatedAt != null && /* @__PURE__ */ jsxs33(Typography23, { variant: "body2", sx: { color: "inherit", fontSize: "14px" }, children: [
                         "Last Updated: ",
                         updatedAt
                       ] })
@@ -7121,7 +7139,7 @@ var DeploymentDashboardCard = ({
                 ),
                 capacityClamped !== void 0 && /* @__PURE__ */ jsx67(CapacityBar, { value: capacityClamped, indented: expandable })
               ] }),
-              /* @__PURE__ */ jsxs34(Box27, { sx: { display: "flex", gap: 1, alignItems: "center", flexShrink: 0 }, children: [
+              /* @__PURE__ */ jsxs33(Box27, { sx: { display: "flex", gap: 1, alignItems: "center", flexShrink: 0 }, children: [
                 statusIndicator != null && /* @__PURE__ */ jsx67(StatusDot2, { status: statusIndicator, "aria-hidden": true }),
                 /* @__PURE__ */ jsx67(CardActionList, { actions })
               ] })
@@ -7137,7 +7155,7 @@ var DeploymentDashboardCard = ({
 // src/components/layout/DeploymentEntityContextMenu/DeploymentEntityContextMenu.tsx
 import { Menu as Menu5, MenuItem as MenuItem2, Switch as Switch2, Divider as Divider6, ListItemIcon as ListItemIcon5, ListItemText as ListItemText8 } from "@mui/material";
 import { styled as styled40 } from "@mui/material/styles";
-import { Fragment as Fragment12, jsx as jsx68, jsxs as jsxs35 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx68, jsxs as jsxs34 } from "react/jsx-runtime";
 var StyledMenu2 = styled40(Menu5)({
   "& .MuiPaper-root": {
     borderRadius: 4,
@@ -7235,7 +7253,7 @@ var DeploymentEntityContextMenu = ({
   enableChecked = false,
   onEnableChange
 }) => {
-  return /* @__PURE__ */ jsxs35(
+  return /* @__PURE__ */ jsxs34(
     StyledMenu2,
     {
       anchorEl,
@@ -7250,7 +7268,7 @@ var DeploymentEntityContextMenu = ({
             return /* @__PURE__ */ jsx68(StyledDivider2, {}, item.id);
           }
           if (item.type === "toggle") {
-            return /* @__PURE__ */ jsxs35(ToggleMenuItem, { disableRipple: true, children: [
+            return /* @__PURE__ */ jsxs34(ToggleMenuItem, { disableRipple: true, children: [
               onEnableChange && /* @__PURE__ */ jsx68(
                 EnableSwitch,
                 {
@@ -7264,7 +7282,7 @@ var DeploymentEntityContextMenu = ({
             ] }, item.id);
           }
           const Row = item.highlighted ? HighlightedMenuItem : StyledMenuItem;
-          return /* @__PURE__ */ jsxs35(
+          return /* @__PURE__ */ jsxs34(
             Row,
             {
               onClick: () => {
@@ -7279,9 +7297,9 @@ var DeploymentEntityContextMenu = ({
             item.id
           );
         }),
-        enableToggle && /* @__PURE__ */ jsxs35(Fragment12, { children: [
+        enableToggle && /* @__PURE__ */ jsxs34(Fragment12, { children: [
           /* @__PURE__ */ jsx68(StyledDivider2, {}),
-          /* @__PURE__ */ jsxs35(ToggleMenuItem, { disableRipple: true, children: [
+          /* @__PURE__ */ jsxs34(ToggleMenuItem, { disableRipple: true, children: [
             onEnableChange && /* @__PURE__ */ jsx68(
               EnableSwitch,
               {
@@ -7381,8 +7399,8 @@ var contextMenuItems = {
 // src/components/layout/DeploymentDashboardTree/DeploymentDashboardTree.tsx
 import { Box as Box28 } from "@mui/material";
-import { styled as styled41, alpha } from "@mui/material/styles";
-import { jsx as jsx70, jsxs as jsxs36 } from "react/jsx-runtime";
+import { styled as styled41, alpha as alpha2 } from "@mui/material/styles";
+import { jsx as jsx70, jsxs as jsxs35 } from "react/jsx-runtime";
 var TREE_SP = {
   /** Vertical gap between sibling rows (Figma S / sp-8) */
   rowGap: 8,
@@ -7418,8 +7436,8 @@ var TreeRow = ({ node, depth, onExpandToggle, onCopyId, renderCard }) => {
   );
   const entityColor = deploymentEntityColors[node.entityType] ?? deploymentEntityColors.workspace;
   const railOpacity = RAIL_OPACITY[node.entityType] ?? 0.5;
-  const railColor = alpha(entityColor, railOpacity);
-  const renderedChildren = hasChildren && expanded ? /* @__PURE__ */ jsxs36(Box28, { sx: { display: "flex", gap: `${TREE_SP.railGap}px` }, children: [
+  const railColor = alpha2(entityColor, railOpacity);
+  const renderedChildren = hasChildren && expanded ? /* @__PURE__ */ jsxs35(Box28, { sx: { display: "flex", gap: `${TREE_SP.railGap}px` }, children: [
     /* @__PURE__ */ jsx70(Rail, { railColor, "aria-hidden": true, "data-rail": true }),
     /* @__PURE__ */ jsx70(
       Box28,
@@ -7536,7 +7554,7 @@ import CheckCircleOutlineIcon from "@mui/icons-material/CheckCircleOutline";
 import ForkRightIcon from "@mui/icons-material/ForkRight";
 import CallMergeIcon from "@mui/icons-material/CallMerge";
 import { useTheme as useTheme5 } from "@mui/material";
-import { jsx as jsx72, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx72, jsxs as jsxs36 } from "react/jsx-runtime";
 var WORKFLOW_NODE_LABELS = {
   start: "Start",
   input: "Input",
@@ -7601,7 +7619,7 @@ var SideConnectorDot = ({
     })
   }
 );
-var NodeTypeBadge = ({ nodeType, badgeBackground, badgeBorder, badgeText, icon, label }) => /* @__PURE__ */ jsxs37(
+var NodeTypeBadge = ({ nodeType, badgeBackground, badgeBorder, badgeText, icon, label }) => /* @__PURE__ */ jsxs36(
   Box30,
   {
     sx: {
@@ -7651,7 +7669,7 @@ var WorkflowNode = ({
   const nodeTokens = theme2.palette.workflow.node[nodeType];
   const chrome = theme2.palette.workflow.chrome;
   const accentColor = nodeTokens.accent;
-  return /* @__PURE__ */ jsxs37(
+  return /* @__PURE__ */ jsxs36(
     Paper3,
     {
       elevation: 0,
@@ -7677,7 +7695,7 @@ var WorkflowNode = ({
       children: [
         showSideDots && /* @__PURE__ */ jsx72(SideConnectorDot, { accentColor, side: "left" }),
         showSideDots && /* @__PURE__ */ jsx72(SideConnectorDot, { accentColor, side: "right" }),
-        /* @__PURE__ */ jsxs37(
+        /* @__PURE__ */ jsxs36(
           Box30,
           {
             sx: {
@@ -7691,7 +7709,7 @@ var WorkflowNode = ({
               minWidth: 0
             },
             children: [
-              /* @__PURE__ */ jsxs37(Box30, { sx: { minWidth: 0, flex: 1 }, children: [
+              /* @__PURE__ */ jsxs36(Box30, { sx: { minWidth: 0, flex: 1 }, children: [
                 /* @__PURE__ */ jsx72(
                   Typography24,
                   {
@@ -7752,12 +7770,12 @@ import {
   IconButton as IconButton14,
   InputBase,
   Typography as Typography25,
-  alpha as alpha2
+  alpha as alpha3
 } from "@mui/material";
 import CloseIcon4 from "@mui/icons-material/Close";
 import CancelIcon from "@mui/icons-material/Cancel";
 import { useTheme as useTheme6 } from "@mui/material/styles";
-import { jsx as jsx73, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx73, jsxs as jsxs37 } from "react/jsx-runtime";
 var WorkflowTopBar = ({
   title = "Agent visualization flow chart",
   executionId,
@@ -7775,7 +7793,7 @@ var WorkflowTopBar = ({
   ...boxProps
 }) => {
   const chrome = useTheme6().palette.workflow.chrome;
-  return /* @__PURE__ */ jsxs38(
+  return /* @__PURE__ */ jsxs37(
     Box31,
     {
       sx: [
@@ -7789,7 +7807,7 @@ var WorkflowTopBar = ({
       ],
       ...boxProps,
       children: [
-        /* @__PURE__ */ jsxs38(
+        /* @__PURE__ */ jsxs37(
           Box31,
           {
             sx: {
@@ -7814,7 +7832,7 @@ var WorkflowTopBar = ({
                   children: title
                 }
               ),
-              /* @__PURE__ */ jsxs38(
+              /* @__PURE__ */ jsxs37(
                 Box31,
                 {
                   sx: {
@@ -7826,7 +7844,7 @@ var WorkflowTopBar = ({
                     minWidth: 0
                   },
                   children: [
-                    /* @__PURE__ */ jsxs38(
+                    /* @__PURE__ */ jsxs37(
                       Box31,
                       {
                         sx: {
@@ -7842,7 +7860,7 @@ var WorkflowTopBar = ({
                           minHeight: 56
                         },
                         children: [
-                          /* @__PURE__ */ jsxs38(Box31, { sx: { flex: 1, minWidth: 0 }, children: [
+                          /* @__PURE__ */ jsxs37(Box31, { sx: { flex: 1, minWidth: 0 }, children: [
                             /* @__PURE__ */ jsx73(
                               Typography25,
                               {
@@ -7913,7 +7931,7 @@ var WorkflowTopBar = ({
                         sx: {
                           width: 30,
                           height: 30,
-                          backgroundColor: alpha2(chrome.closeBtnBg, 0.28),
+                          backgroundColor: alpha3(chrome.closeBtnBg, 0.28),
                           color: chrome.iconColor
                         },
                         children: /* @__PURE__ */ jsx73(CloseIcon4, { fontSize: "small" })
@@ -7938,14 +7956,14 @@ import {
   IconButton as IconButton15,
   Paper as Paper4,
   Typography as Typography26,
-  alpha as alpha3,
+  alpha as alpha4,
   useTheme as useTheme7
 } from "@mui/material";
 import CloseIcon5 from "@mui/icons-material/Close";
 import ContentCopyOutlinedIcon from "@mui/icons-material/ContentCopyOutlined";
-import { Fragment as Fragment13, jsx as jsx74, jsxs as jsxs39 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx74, jsxs as jsxs38 } from "react/jsx-runtime";
 var INSPECTOR_WIDTH = 320;
-var InfoBlock = ({ label, value, mutedColor }) => /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
+var InfoBlock = ({ label, value, mutedColor }) => /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
   /* @__PURE__ */ jsx74(Typography26, { variant: "body2", sx: { color: mutedColor }, children: label }),
   /* @__PURE__ */ jsx74(
     Typography26,
@@ -7984,7 +8002,7 @@ var WorkflowSideInspector = ({
     return null;
   }
   const accent = theme2.palette.workflow.node[nodeType].accent;
-  return /* @__PURE__ */ jsxs39(
+  return /* @__PURE__ */ jsxs38(
     Paper4,
     {
       elevation: 0,
@@ -8003,8 +8021,8 @@ var WorkflowSideInspector = ({
       },
       ...paperProps,
       children: [
-        /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1.25 }, children: [
-          /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
+        /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1.25 }, children: [
+          /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
             /* @__PURE__ */ jsx74(Typography26, { variant: "subtitle1", sx: { color: deploymentSurfaceTokens.textPrimary }, children: title }),
             /* @__PURE__ */ jsx74(
               IconButton15,
@@ -8021,8 +8039,8 @@ var WorkflowSideInspector = ({
           ] }),
           /* @__PURE__ */ jsx74(Divider8, { sx: { borderColor: chrome.divider } })
         ] }),
-        /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", flexDirection: "column", gap: 3, flex: 1 }, children: [
-          /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
+        /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", flexDirection: "column", gap: 3, flex: 1 }, children: [
+          /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
             /* @__PURE__ */ jsx74(
               Typography26,
               {
@@ -8032,7 +8050,7 @@ var WorkflowSideInspector = ({
               }
             ),
             /* @__PURE__ */ jsx74(Typography26, { variant: "body2", sx: { color: chrome.mutedText }, children: nodeDescription }),
-            /* @__PURE__ */ jsxs39(
+            /* @__PURE__ */ jsxs38(
               Box32,
               {
                 sx: {
@@ -8044,7 +8062,7 @@ var WorkflowSideInspector = ({
                   py: 0.5,
                   borderRadius: "999px",
                   border: `1px solid ${accent}`,
-                  backgroundColor: alpha3(accent, 0.12)
+                  backgroundColor: alpha4(accent, 0.12)
                 },
                 children: [
                   /* @__PURE__ */ jsx74(
@@ -8064,14 +8082,14 @@ var WorkflowSideInspector = ({
             )
           ] }),
           /* @__PURE__ */ jsx74(Divider8, { sx: { borderColor: chrome.divider } }),
-          (showInput || showOutput) && /* @__PURE__ */ jsxs39(Fragment13, { children: [
-            /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
+          (showInput || showOutput) && /* @__PURE__ */ jsxs38(Fragment13, { children: [
+            /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
               showInput && /* @__PURE__ */ jsx74(InfoBlock, { label: "Input", value: inputValue, mutedColor: chrome.mutedText }),
               showOutput && /* @__PURE__ */ jsx74(InfoBlock, { label: "Output", value: outputValue, mutedColor: chrome.mutedText })
             ] }),
             /* @__PURE__ */ jsx74(Divider8, { sx: { borderColor: chrome.divider } })
           ] }),
-          /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
+          /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
             /* @__PURE__ */ jsx74(Typography26, { variant: "body2", sx: { color: chrome.mutedText }, children: "Cubby ID" }),
             /* @__PURE__ */ jsx74(
               Button,
@@ -8086,8 +8104,8 @@ var WorkflowSideInspector = ({
             )
           ] }),
           /* @__PURE__ */ jsx74(Divider8, { sx: { borderColor: chrome.divider } }),
-          (showTimestamp || showDuration) && /* @__PURE__ */ jsxs39(Fragment13, { children: [
-            /* @__PURE__ */ jsxs39(Box32, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
+          (showTimestamp || showDuration) && /* @__PURE__ */ jsxs38(Fragment13, { children: [
+            /* @__PURE__ */ jsxs38(Box32, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
               showTimestamp && /* @__PURE__ */ jsx74(InfoBlock, { label: "Timestamp", value: timestamp, mutedColor: chrome.mutedText }),
               showDuration && /* @__PURE__ */ jsx74(InfoBlock, { label: "Duration", value: duration, mutedColor: chrome.mutedText })
             ] }),
@@ -8113,7 +8131,7 @@ import ChevronLeftIcon4 from "@mui/icons-material/ChevronLeft";
 import ChevronRightIcon5 from "@mui/icons-material/ChevronRight";
 import ReplayIcon from "@mui/icons-material/Replay";
 import { useTheme as useTheme8 } from "@mui/material/styles";
-import { jsx as jsx75, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx75, jsxs as jsxs39 } from "react/jsx-runtime";
 var SpeedButton = ({ value, selected, onClick }) => /* @__PURE__ */ jsx75(
   Button,
   {
@@ -8150,7 +8168,7 @@ var WorkflowTimeBar = ({
   const boundedProgress = Math.max(0, Math.min(100, progress));
   const atFirstStep = currentStep <= 1;
   const atLastStep = currentStep >= totalSteps;
-  return /* @__PURE__ */ jsxs40(
+  return /* @__PURE__ */ jsxs39(
     Box33,
     {
       sx: [
@@ -8168,7 +8186,7 @@ var WorkflowTimeBar = ({
       ...boxProps,
       children: [
         /* @__PURE__ */ jsx75(Divider9, { sx: { borderColor: deploymentSurfaceTokens.strokeOutside } }),
-        /* @__PURE__ */ jsxs40(Box33, { sx: { display: "flex", alignItems: "center", gap: 2 }, children: [
+        /* @__PURE__ */ jsxs39(Box33, { sx: { display: "flex", alignItems: "center", gap: 2 }, children: [
           /* @__PURE__ */ jsx75(
             IconButton16,
             {
@@ -8185,7 +8203,7 @@ var WorkflowTimeBar = ({
               children: /* @__PURE__ */ jsx75(StopIcon, { sx: { fontSize: 16 } })
             }
           ),
-          /* @__PURE__ */ jsxs40(Box33, { sx: { flex: 1, minWidth: 220, px: 1 }, children: [
+          /* @__PURE__ */ jsxs39(Box33, { sx: { flex: 1, minWidth: 220, px: 1 }, children: [
             /* @__PURE__ */ jsx75(
               Typography27,
               {
@@ -8210,8 +8228,8 @@ var WorkflowTimeBar = ({
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs40(Box33, { sx: { display: "flex", alignItems: "center", gap: 3 }, children: [
-            /* @__PURE__ */ jsxs40(Box33, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+          /* @__PURE__ */ jsxs39(Box33, { sx: { display: "flex", alignItems: "center", gap: 3 }, children: [
+            /* @__PURE__ */ jsxs39(Box33, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
               /* @__PURE__ */ jsx75(Typography27, { variant: "subtitle1", sx: { fontWeight: 500 }, children: "Steps" }),
               /* @__PURE__ */ jsx75(
                 IconButton16,
@@ -8237,7 +8255,7 @@ var WorkflowTimeBar = ({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs40(Box33, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+            /* @__PURE__ */ jsxs39(Box33, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
               /* @__PURE__ */ jsx75(Typography27, { variant: "subtitle1", sx: { fontWeight: 500 }, children: "Speed" }),
               speedOptions.map((option) => /* @__PURE__ */ jsx75(
                 SpeedButton,
@@ -8260,8 +8278,8 @@ var WorkflowTimeBar = ({
 // src/components/icons/ActivityAppIcon.tsx
 import { memo as memo2 } from "react";
 import { SvgIcon as SvgIcon2 } from "@mui/material";
-import { jsx as jsx76, jsxs as jsxs41 } from "react/jsx-runtime";
-var ActivityAppIcon = memo2((props) => /* @__PURE__ */ jsxs41(SvgIcon2, { ...props, viewBox: "0 0 36 36", children: [
+import { jsx as jsx76, jsxs as jsxs40 } from "react/jsx-runtime";
+var ActivityAppIcon = memo2((props) => /* @__PURE__ */ jsxs40(SvgIcon2, { ...props, viewBox: "0 0 36 36", children: [
   /* @__PURE__ */ jsx76("rect", { fill: "none", stroke: "currentColor", width: 34, height: 34, x: 1, y: 1, strokeWidth: 1.5, rx: 6.8 }),
   /* @__PURE__ */ jsx76(
     "rect",
@@ -8337,9 +8355,9 @@ var RightArrowIcon = (props) => {
 // src/components/icons/AvatarIcon.tsx
 import { SvgIcon as SvgIcon5 } from "@mui/material";
-import { jsx as jsx79, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx79, jsxs as jsxs41 } from "react/jsx-runtime";
 var AvatarIcon = (props) => {
-  return /* @__PURE__ */ jsxs42(SvgIcon5, { ...props, viewBox: "0 0 16 16", children: [
+  return /* @__PURE__ */ jsxs41(SvgIcon5, { ...props, viewBox: "0 0 16 16", children: [
     /* @__PURE__ */ jsx79(
       "path",
       {
@@ -8364,8 +8382,8 @@ var AvatarIcon = (props) => {
 // src/components/icons/BarTrackingIcon.tsx
 import { memo as memo3 } from "react";
 import { SvgIcon as SvgIcon6 } from "@mui/material";
-import { jsx as jsx80, jsxs as jsxs43 } from "react/jsx-runtime";
-var BarTrackingIcon = memo3((props) => /* @__PURE__ */ jsxs43(SvgIcon6, { ...props, viewBox: "0 0 96 97", children: [
+import { jsx as jsx80, jsxs as jsxs42 } from "react/jsx-runtime";
+var BarTrackingIcon = memo3((props) => /* @__PURE__ */ jsxs42(SvgIcon6, { ...props, viewBox: "0 0 96 97", children: [
   /* @__PURE__ */ jsx80(
     "rect",
     {
@@ -8437,8 +8455,8 @@ var ClockIcon = memo4((props) => /* @__PURE__ */ jsx81(SvgIcon7, { ...props, vie
 // src/components/icons/CloudFlashIcon.tsx
 import { memo as memo5 } from "react";
 import { SvgIcon as SvgIcon8 } from "@mui/material";
-import { jsx as jsx82, jsxs as jsxs44 } from "react/jsx-runtime";
-var CloudFlashIcon = memo5((props) => /* @__PURE__ */ jsxs44(SvgIcon8, { ...props, fill: "none", viewBox: "0 0 96 97", children: [
+import { jsx as jsx82, jsxs as jsxs43 } from "react/jsx-runtime";
+var CloudFlashIcon = memo5((props) => /* @__PURE__ */ jsxs43(SvgIcon8, { ...props, fill: "none", viewBox: "0 0 96 97", children: [
   /* @__PURE__ */ jsx82(
     "path",
     {
@@ -8462,8 +8480,8 @@ var CloudFlashIcon = memo5((props) => /* @__PURE__ */ jsxs44(SvgIcon8, { ...prop
 // src/components/icons/DecentralizedServerIcon.tsx
 import { memo as memo6 } from "react";
 import { SvgIcon as SvgIcon9 } from "@mui/material";
-import { jsx as jsx83, jsxs as jsxs45 } from "react/jsx-runtime";
-var DecentralizedServerIcon = memo6((props) => /* @__PURE__ */ jsxs45(SvgIcon9, { ...props, viewBox: "0 0 96 97", children: [
+import { jsx as jsx83, jsxs as jsxs44 } from "react/jsx-runtime";
+var DecentralizedServerIcon = memo6((props) => /* @__PURE__ */ jsxs44(SvgIcon9, { ...props, viewBox: "0 0 96 97", children: [
   /* @__PURE__ */ jsx83(
     "path",
     {
@@ -8649,8 +8667,8 @@ var DiscordIcon = memo7((props) => /* @__PURE__ */ jsx84(SvgIcon10, { ...props,
 // src/components/icons/DownloadIcon.tsx
 import { memo as memo8 } from "react";
 import { SvgIcon as SvgIcon11 } from "@mui/material";
-import { jsx as jsx85, jsxs as jsxs46 } from "react/jsx-runtime";
-var DownloadIcon = memo8((props) => /* @__PURE__ */ jsxs46(SvgIcon11, { ...props, viewBox: "0 0 17 16", fill: "none", children: [
+import { jsx as jsx85, jsxs as jsxs45 } from "react/jsx-runtime";
+var DownloadIcon = memo8((props) => /* @__PURE__ */ jsxs45(SvgIcon11, { ...props, viewBox: "0 0 17 16", fill: "none", children: [
   /* @__PURE__ */ jsx85(
     "path",
     {
@@ -8670,8 +8688,8 @@ var DownloadIcon = memo8((props) => /* @__PURE__ */ jsxs46(SvgIcon11, { ...props
 // src/components/icons/FilledFolderIcon.tsx
 import { memo as memo9 } from "react";
 import { SvgIcon as SvgIcon12 } from "@mui/material";
-import { jsx as jsx86, jsxs as jsxs47 } from "react/jsx-runtime";
-var FilledFolderIcon = memo9((props) => /* @__PURE__ */ jsxs47(SvgIcon12, { sx: { fill: "none" }, ...props, fill: "none", viewBox: "0 0 22 22", children: [
+import { jsx as jsx86, jsxs as jsxs46 } from "react/jsx-runtime";
+var FilledFolderIcon = memo9((props) => /* @__PURE__ */ jsxs46(SvgIcon12, { sx: { fill: "none" }, ...props, fill: "none", viewBox: "0 0 22 22", children: [
   /* @__PURE__ */ jsx86("rect", { x: "0.5", y: "0.5", width: "21", height: "21", rx: "4.5", fill: "#FCF8EC" }),
   /* @__PURE__ */ jsx86("rect", { x: "0.5", y: "0.5", width: "21", height: "21", rx: "4.5", stroke: "#E1B43E" }),
   /* @__PURE__ */ jsx86(
@@ -8688,8 +8706,8 @@ var FilledFolderIcon = memo9((props) => /* @__PURE__ */ jsxs47(SvgIcon12, { sx:
 // src/components/icons/FolderIcon.tsx
 import { memo as memo10 } from "react";
 import { SvgIcon as SvgIcon13 } from "@mui/material";
-import { jsx as jsx87, jsxs as jsxs48 } from "react/jsx-runtime";
-var FolderIcon = memo10((props) => /* @__PURE__ */ jsxs48(SvgIcon13, { sx: { fill: "none" }, ...props, fill: "none", viewBox: "0 0 22 22", children: [
+import { jsx as jsx87, jsxs as jsxs47 } from "react/jsx-runtime";
+var FolderIcon = memo10((props) => /* @__PURE__ */ jsxs47(SvgIcon13, { sx: { fill: "none" }, ...props, fill: "none", viewBox: "0 0 22 22", children: [
   /* @__PURE__ */ jsx87("rect", { x: "0.5", y: "0.5", width: "21", height: "21", rx: "4.5", fill: "#F5F7FA" }),
   /* @__PURE__ */ jsx87("rect", { x: "0.5", y: "0.5", width: "21", height: "21", rx: "4.5", stroke: "#E6E6E6" }),
   /* @__PURE__ */ jsx87(
@@ -8708,8 +8726,8 @@ var FolderIcon = memo10((props) => /* @__PURE__ */ jsxs48(SvgIcon13, { sx: { fil
 // src/components/icons/GithubLogoIcon.tsx
 import { memo as memo11 } from "react";
 import { SvgIcon as SvgIcon14 } from "@mui/material";
-import { jsx as jsx88, jsxs as jsxs49 } from "react/jsx-runtime";
-var GithubLogoIcon = memo11((props) => /* @__PURE__ */ jsxs49(SvgIcon14, { ...props, viewBox: "0 0 17 16", sx: { fill: "none" }, children: [
+import { jsx as jsx88, jsxs as jsxs48 } from "react/jsx-runtime";
+var GithubLogoIcon = memo11((props) => /* @__PURE__ */ jsxs48(SvgIcon14, { ...props, viewBox: "0 0 17 16", sx: { fill: "none" }, children: [
   /* @__PURE__ */ jsx88(
     "path",
     {
@@ -8743,8 +8761,8 @@ var ShareIcon = memo12((props) => /* @__PURE__ */ jsx89(SvgIcon15, { ...props, v
 // src/components/icons/StorageAppIcon.tsx
 import { memo as memo13 } from "react";
 import { SvgIcon as SvgIcon16 } from "@mui/material";
-import { jsx as jsx90, jsxs as jsxs50 } from "react/jsx-runtime";
-var StorageAppIcon = memo13((props) => /* @__PURE__ */ jsxs50(SvgIcon16, { ...props, viewBox: "0 0 38 29", fill: "none", children: [
+import { jsx as jsx90, jsxs as jsxs49 } from "react/jsx-runtime";
+var StorageAppIcon = memo13((props) => /* @__PURE__ */ jsxs49(SvgIcon16, { ...props, viewBox: "0 0 38 29", fill: "none", children: [
   /* @__PURE__ */ jsx90(
     "path",
     {
@@ -8912,7 +8930,7 @@ import { Box as Box35, Stack as Stack5, Typography as Typography28, styled as st
 import { LineChart } from "@mui/x-charts";
 import size2 from "byte-size";
 import { format } from "date-fns";
-import { jsx as jsx98, jsxs as jsxs51 } from "react/jsx-runtime";
+import { jsx as jsx98, jsxs as jsxs50 } from "react/jsx-runtime";
 var Chart = styled44(Box35)(() => ({
   height: 200
 }));
@@ -8923,7 +8941,7 @@ var ChartWidget = ({
   formatValue = (value2) => size2(value2 || 0).toString()
 }) => {
   const theme2 = useTheme9();
-  return /* @__PURE__ */ jsxs51(Stack5, { spacing: 1, children: [
+  return /* @__PURE__ */ jsxs50(Stack5, { spacing: 1, children: [
     /* @__PURE__ */ jsx98(Typography28, { variant: "caption", color: "text.secondary", children: title }),
     /* @__PURE__ */ jsx98(Typography28, { fontWeight: "bold", children: value }),
     /* @__PURE__ */ jsx98(Chart, { children: /* @__PURE__ */ jsx98(
@@ -9011,8 +9029,8 @@ var PeriodSelect = ({ value, onChange }) => /* @__PURE__ */ jsx99(
 );
 // src/components/charts/MetricsChart/MetricsChart.tsx
-import { useMemo, useState as useState13 } from "react";
-import { jsx as jsx100, jsxs as jsxs52 } from "react/jsx-runtime";
+import { useMemo as useMemo2, useState as useState13 } from "react";
+import { jsx as jsx100, jsxs as jsxs51 } from "react/jsx-runtime";
 var mapPeriodToFromDate = (period = "month") => {
   const date = /* @__PURE__ */ new Date();
   if (period === "hour") {
@@ -9043,12 +9061,12 @@ var LoadingText = styled45("text")(({ theme: theme2 }) => ({
 var MetricsChart = ({ history = [] }) => {
   const theme2 = useTheme10();
   const [period, setPeriod] = useState13("week");
-  const periodFrom = useMemo(() => mapPeriodToFromDate(period), [period]);
-  const periodHistory = useMemo(
+  const periodFrom = useMemo2(() => mapPeriodToFromDate(period), [period]);
+  const periodHistory = useMemo2(
     () => history.filter((record) => record.recordTime > periodFrom),
     [history, periodFrom]
   );
-  const total = useMemo(
+  const total = useMemo2(
     () => periodHistory.reduce(
       (acc, record) => ({
         gets: acc.gets + record.gets,
@@ -9072,14 +9090,14 @@ var MetricsChart = ({ history = [] }) => {
     const backgroundHeight = textHeight + padding.top + padding.bottom;
     const rectX = left + (width - backgroundWidth) / 2;
     const rectY = top + (height - backgroundHeight) / 2;
-    return /* @__PURE__ */ jsxs52("g", { children: [
+    return /* @__PURE__ */ jsxs51("g", { children: [
       /* @__PURE__ */ jsx100(NoDataRect, { x: rectX, y: rectY, width: backgroundWidth, height: backgroundHeight }),
       /* @__PURE__ */ jsx100(LoadingText, { style: { ...theme2.typography.subtitle1 }, x: left + width / 2, y: top + height / 2, children: text })
     ] });
   };
-  return /* @__PURE__ */ jsxs52(Card2, { children: [
+  return /* @__PURE__ */ jsxs51(Card2, { children: [
     /* @__PURE__ */ jsx100(CardHeader2, { title: "GET / PUT Requests", action: /* @__PURE__ */ jsx100(PeriodSelect, { value: period, onChange: setPeriod }) }),
-    /* @__PURE__ */ jsxs52(CardMedia2, { children: [
+    /* @__PURE__ */ jsxs51(CardMedia2, { children: [
       /* @__PURE__ */ jsx100(
         Chart2,
         {
@@ -9141,33 +9159,33 @@ var MetricsChart = ({ history = [] }) => {
           ]
         }
       ),
-      periodHistory.length > 0 && /* @__PURE__ */ jsxs52(Stack6, { direction: "row", spacing: 2, marginY: 3, justifyContent: "center", children: [
-        /* @__PURE__ */ jsxs52(Stack6, { direction: "row", spacing: 1, alignItems: "center", children: [
+      periodHistory.length > 0 && /* @__PURE__ */ jsxs51(Stack6, { direction: "row", spacing: 2, marginY: 3, justifyContent: "center", children: [
+        /* @__PURE__ */ jsxs51(Stack6, { direction: "row", spacing: 1, alignItems: "center", children: [
           /* @__PURE__ */ jsx100(Box36, { sx: { width: 14, height: 14, borderRadius: "4px", backgroundColor: theme2.palette.primary.main } }),
           /* @__PURE__ */ jsx100(Typography29, { variant: "body2", children: "Get" })
         ] }),
-        /* @__PURE__ */ jsxs52(Stack6, { direction: "row", spacing: 1, alignItems: "center", children: [
+        /* @__PURE__ */ jsxs51(Stack6, { direction: "row", spacing: 1, alignItems: "center", children: [
           /* @__PURE__ */ jsx100(Box36, { sx: { width: 14, height: 14, borderRadius: "4px", backgroundColor: theme2.palette.success.main } }),
           /* @__PURE__ */ jsx100(Typography29, { variant: "body2", children: "Put" })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ jsxs52(CardMedia2, { children: [
+    /* @__PURE__ */ jsxs51(CardMedia2, { children: [
       /* @__PURE__ */ jsx100(Divider10, { flexItem: true }),
-      /* @__PURE__ */ jsxs52(Stack6, { direction: "row", spacing: 2, padding: 2, children: [
-        /* @__PURE__ */ jsxs52(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
+      /* @__PURE__ */ jsxs51(Stack6, { direction: "row", spacing: 2, padding: 2, children: [
+        /* @__PURE__ */ jsxs51(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
           /* @__PURE__ */ jsx100(Typography29, { variant: "body2", color: "secondary", children: "GET Requests per account" }),
           /* @__PURE__ */ jsx100(Typography29, { variant: "h3", children: total.gets })
         ] }),
-        /* @__PURE__ */ jsxs52(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
+        /* @__PURE__ */ jsxs51(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
           /* @__PURE__ */ jsx100(Typography29, { variant: "body2", color: "secondary", children: "PUT Requests per account" }),
           /* @__PURE__ */ jsx100(Typography29, { variant: "h3", children: total.puts })
         ] }),
-        /* @__PURE__ */ jsxs52(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
+        /* @__PURE__ */ jsxs51(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
           /* @__PURE__ */ jsx100(Typography29, { variant: "body2", color: "secondary", children: "Total Consumed per account" }),
           /* @__PURE__ */ jsx100(Typography29, { variant: "h3", children: /* @__PURE__ */ jsx100(BytesSize, { bytes: total.transferredBytes }) })
         ] }),
-        /* @__PURE__ */ jsxs52(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
+        /* @__PURE__ */ jsxs51(Stack6, { direction: "row", alignItems: "center", spacing: 1, children: [
           /* @__PURE__ */ jsx100(Typography29, { variant: "body2", color: "secondary", children: "Total Stored per account" }),
           /* @__PURE__ */ jsx100(Typography29, { variant: "h3", children: /* @__PURE__ */ jsx100(BytesSize, { bytes: total.storedBytes }) })
         ] })
@@ -9177,7 +9195,7 @@ var MetricsChart = ({ history = [] }) => {
 };
 // src/components/charts/TimeSeriesGraph/TimeSeriesGraph.tsx
-import { useCallback as useCallback6, useMemo as useMemo2, useState as useState14 } from "react";
+import { useCallback as useCallback6, useMemo as useMemo3, useState as useState14 } from "react";
 import {
   Box as Box37,
   Card as Card3,
@@ -9211,7 +9229,7 @@ var TimeRangeSelect = ({ options: options2, value, onChange }) => /* @__PURE__ *
 // src/components/charts/TimeSeriesGraph/SummaryStats.tsx
 import { Stack as Stack7, Typography as Typography30 } from "@mui/material";
-import { jsx as jsx102, jsxs as jsxs53 } from "react/jsx-runtime";
+import { jsx as jsx102, jsxs as jsxs52 } from "react/jsx-runtime";
 var formatSummaryValue = (value, unit) => {
   const displayValue = typeof value === "number" ? value.toLocaleString() : value;
   return unit ? `${displayValue} ${unit}` : displayValue;
@@ -9230,7 +9248,7 @@ var SummaryStats = ({ items }) => {
       useFlexGap: true,
       role: "list",
       "aria-label": "Summary statistics",
-      children: items.map((item) => /* @__PURE__ */ jsxs53(
+      children: items.map((item) => /* @__PURE__ */ jsxs52(
         Stack7,
         {
           direction: "row",
@@ -9249,7 +9267,7 @@ var SummaryStats = ({ items }) => {
 };
 // src/components/charts/TimeSeriesGraph/TimeSeriesGraph.tsx
-import { Fragment as Fragment15, jsx as jsx103, jsxs as jsxs54 } from "react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx103, jsxs as jsxs53 } from "react/jsx-runtime";
 var ChartContainer = styled46(Box37)({
   position: "relative",
   height: 320
@@ -9322,12 +9340,12 @@ var TimeSeriesGraph = ({
 }) => {
   const theme2 = useTheme11();
   const [hiddenSeries, setHiddenSeries] = useState14(/* @__PURE__ */ new Set());
-  const dataset = useMemo2(() => buildDataset(series, hiddenSeries), [series, hiddenSeries]);
-  const visibleSeries = useMemo2(
+  const dataset = useMemo3(() => buildDataset(series, hiddenSeries), [series, hiddenSeries]);
+  const visibleSeries = useMemo3(
     () => series.filter((s) => !hiddenSeries.has(s.name)),
     [series, hiddenSeries]
   );
-  const chartColors = useMemo2(() => visibleSeries.map((s) => s.color), [visibleSeries]);
+  const chartColors = useMemo3(() => visibleSeries.map((s) => s.color), [visibleSeries]);
   const handleLegendToggle = useCallback6((seriesName) => {
     setHiddenSeries((prev) => {
       const next = new Set(prev);
@@ -9339,7 +9357,7 @@ var TimeSeriesGraph = ({
       return next;
     });
   }, []);
-  const timeBounds = useMemo2(() => {
+  const timeBounds = useMemo3(() => {
     if (dataset.length === 0) return { min: void 0, max: void 0 };
     const timestamps = dataset.map((row) => row.timestamp.getTime());
     return {
@@ -9347,13 +9365,13 @@ var TimeSeriesGraph = ({
       max: new Date(Math.max(...timestamps))
     };
   }, [dataset]);
-  const resolvedXAxisFormat = useMemo2(
+  const resolvedXAxisFormat = useMemo3(
     () => xAxisFormat ?? inferXAxisFormat(timeBounds.min, timeBounds.max),
     [xAxisFormat, timeBounds.min, timeBounds.max]
   );
   const hasData = dataset.length > 0;
   const shouldShowSummary = showSummary && summaryItems && summaryItems.length > 0;
-  const headerActionElement = /* @__PURE__ */ jsxs54(Stack8, { direction: "row", spacing: 1, alignItems: "center", children: [
+  const headerActionElement = /* @__PURE__ */ jsxs53(Stack8, { direction: "row", spacing: 1, alignItems: "center", children: [
     headerAction,
     timeRangeOptions && timeRangeOptions.length > 0 && /* @__PURE__ */ jsx103(
       TimeRangeSelect,
@@ -9365,7 +9383,7 @@ var TimeSeriesGraph = ({
     )
   ] });
   const showHeader = !!title || !!headerAction || timeRangeOptions && timeRangeOptions.length > 0;
-  return /* @__PURE__ */ jsxs54(
+  return /* @__PURE__ */ jsxs53(
     Card3,
     {
       "aria-label": title ? `Line chart showing ${title}` : "Line chart",
@@ -9382,8 +9400,8 @@ var TimeSeriesGraph = ({
             action: headerActionElement
           }
         ),
-        /* @__PURE__ */ jsxs54(CardMedia3, { children: [
-          /* @__PURE__ */ jsxs54(ChartContainer, { children: [
+        /* @__PURE__ */ jsxs53(CardMedia3, { children: [
+          /* @__PURE__ */ jsxs53(ChartContainer, { children: [
             loading && /* @__PURE__ */ jsx103(LoadingOverlay, { role: "status", "aria-label": "Loading chart data", children: /* @__PURE__ */ jsx103(CircularProgress7, { size: 40 }) }),
             /* @__PURE__ */ jsx103(
               LineChart3,
@@ -9450,7 +9468,7 @@ var TimeSeriesGraph = ({
               "aria-label": "Chart legend",
               children: series.map((s) => {
                 const isHidden = hiddenSeries.has(s.name);
-                return /* @__PURE__ */ jsxs54(
+                return /* @__PURE__ */ jsxs53(
                   Stack8,
                   {
                     direction: "row",
@@ -9477,7 +9495,7 @@ var TimeSeriesGraph = ({
             }
           )
         ] }),
-        shouldShowSummary && /* @__PURE__ */ jsxs54(Fragment15, { children: [
+        shouldShowSummary && /* @__PURE__ */ jsxs53(Fragment15, { children: [
           /* @__PURE__ */ jsx103(Divider11, {}),
           /* @__PURE__ */ jsx103(SummaryStats, { items: summaryItems })
         ] })
@@ -9499,7 +9517,7 @@ import ReactFlow, {
 import { Box as Box38 } from "@mui/material";
 import { useTheme as useTheme12 } from "@mui/material/styles";
 import { Background as Background2, Controls as Controls2, MiniMap as MiniMap2, Panel, BackgroundVariant as BackgroundVariant2, ConnectionLineType as ConnectionLineType2 } from "reactflow";
-import { jsx as jsx104, jsxs as jsxs55 } from "react/jsx-runtime";
+import { jsx as jsx104, jsxs as jsxs54 } from "react/jsx-runtime";
 var FlowEditor = ({
   nodes,
   edges,
@@ -9545,7 +9563,7 @@ var FlowEditor = ({
         ...Array.isArray(containerSx) ? containerSx : [containerSx]
       ],
       ...restContainerProps,
-      children: /* @__PURE__ */ jsxs55(
+      children: /* @__PURE__ */ jsxs54(
         ReactFlow,
         {
           nodes,
@@ -9610,7 +9628,7 @@ import FullscreenExitIcon from "@mui/icons-material/FullscreenExit";
 import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline";
 import ExpandMoreIcon3 from "@mui/icons-material/ExpandMore";
 import ExpandLessIcon from "@mui/icons-material/ExpandLess";
-import { jsx as jsx105, jsxs as jsxs56 } from "react/jsx-runtime";
+import { jsx as jsx105, jsxs as jsxs55 } from "react/jsx-runtime";
 var configureTypeScript = (monaco) => {
   monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
     target: monaco.languages.typescript.ScriptTarget.ES2020,
@@ -9849,7 +9867,7 @@ var CodeEditor = ({
         pb: isFullscreen ? 2 : 0,
         overflow: isFullscreen ? "hidden" : "visible"
       },
-      children: /* @__PURE__ */ jsxs56(
+      children: /* @__PURE__ */ jsxs55(
         Box39,
         {
           sx: {
@@ -9917,7 +9935,7 @@ var CodeEditor = ({
                 )
               }
             ),
-            validationErrors.length > 0 && /* @__PURE__ */ jsxs56(
+            validationErrors.length > 0 && /* @__PURE__ */ jsxs55(
               Box39,
               {
                 sx: {
@@ -9931,7 +9949,7 @@ var CodeEditor = ({
                   transition: "max-height 0.2s ease"
                 },
                 children: [
-                  /* @__PURE__ */ jsxs56(
+                  /* @__PURE__ */ jsxs55(
                     Box39,
                     {
                       sx: {
@@ -9948,7 +9966,7 @@ var CodeEditor = ({
                       children: [
                         /* @__PURE__ */ jsx105(ErrorOutlineIcon, { color: "error", fontSize: "small" }),
                         /* @__PURE__ */ jsx105(Box39, { sx: { fontWeight: 600, color: "text.primary" }, children: "Problems" }),
-                        /* @__PURE__ */ jsxs56(Box39, { sx: { ml: 1 }, children: [
+                        /* @__PURE__ */ jsxs55(Box39, { sx: { ml: 1 }, children: [
                           validationErrors.length,
                           " error",
                           validationErrors.length > 1 ? "s" : ""
@@ -9969,7 +9987,7 @@ var CodeEditor = ({
                       ]
                     }
                   ),
-                  showProblems && /* @__PURE__ */ jsx105(Box39, { sx: { overflow: "auto" }, children: validationErrors.map((error, index) => /* @__PURE__ */ jsxs56(
+                  showProblems && /* @__PURE__ */ jsx105(Box39, { sx: { overflow: "auto" }, children: validationErrors.map((error, index) => /* @__PURE__ */ jsxs55(
                     Box39,
                     {
                       onClick: () => gotoMarker(error),
@@ -9987,7 +10005,7 @@ var CodeEditor = ({
                       },
                       children: [
                         /* @__PURE__ */ jsx105(ErrorOutlineIcon, { color: "error", sx: { fontSize: 18 } }),
-                        /* @__PURE__ */ jsxs56(Box39, { sx: { color: "text.secondary", width: 64 }, children: [
+                        /* @__PURE__ */ jsxs55(Box39, { sx: { color: "text.secondary", width: 64 }, children: [
                           "Line ",
                           error.startLineNumber
                         ] }),
@@ -10012,7 +10030,7 @@ import { Panel as Panel2 } from "reactflow";
 // src/components/third-party/WorkflowNodeHandle.tsx
 import { Handle, Position } from "reactflow";
 import { useTheme as useTheme13 } from "@mui/material";
-import { Fragment as Fragment16, jsx as jsx106, jsxs as jsxs57 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx106, jsxs as jsxs56 } from "react/jsx-runtime";
 var WorkflowNodeHandle = ({
   data,
   selected
@@ -10027,7 +10045,7 @@ var WorkflowNodeHandle = ({
     background: handleColor,
     boxShadow: WORKFLOW_NODE_SHADOW
   };
-  return /* @__PURE__ */ jsxs57(Fragment16, { children: [
+  return /* @__PURE__ */ jsxs56(Fragment16, { children: [
     /* @__PURE__ */ jsx106(Handle, { type: "target", position: Position.Left, style: handleStyle }),
     /* @__PURE__ */ jsx106(
       WorkflowNode,
@@ -10326,7 +10344,7 @@ function useCodeEditorWorkspace({
 import React17 from "react";
 import { Box as Box40, IconButton as IconButton18, Tooltip as Tooltip9, Typography as Typography32 } from "@mui/material";
 import CloseIcon6 from "@mui/icons-material/Close";
-import { jsx as jsx107, jsxs as jsxs58 } from "react/jsx-runtime";
+import { jsx as jsx107, jsxs as jsxs57 } from "react/jsx-runtime";
 var CodeEditorTabs = ({
   tabs,
   activeTab,
@@ -10362,7 +10380,7 @@ var CodeEditorTabs = ({
             onClose: () => onTabClose?.(tab.path)
           }) }, tab.path);
         }
-        return /* @__PURE__ */ jsxs58(
+        return /* @__PURE__ */ jsxs57(
           Box40,
           {
             onClick: () => onTabSelect?.(tab.path),
@@ -10461,7 +10479,7 @@ import FolderOpenIcon from "@mui/icons-material/FolderOpen";
 import InsertDriveFileOutlinedIcon from "@mui/icons-material/InsertDriveFileOutlined";
 import ExpandMoreIcon4 from "@mui/icons-material/ExpandMore";
 import ChevronRightIcon6 from "@mui/icons-material/ChevronRight";
-import { jsx as jsx108, jsxs as jsxs59 } from "react/jsx-runtime";
+import { jsx as jsx108, jsxs as jsxs58 } from "react/jsx-runtime";
 var STATUS_CONFIG = {
   new: { label: "N", color: "success.main" },
   modified: { label: "M", color: "warning.main" },
@@ -10510,7 +10528,7 @@ var CodeEditorFileTree = ({
     const isExpanded = expandedPaths.has(node.path);
     const isSelected = node.path === selectedPath;
     if (renderNode) {
-      return /* @__PURE__ */ jsxs59(React18.Fragment, { children: [
+      return /* @__PURE__ */ jsxs58(React18.Fragment, { children: [
         renderNode({
           node,
           depth,
@@ -10528,8 +10546,8 @@ var CodeEditorFileTree = ({
         isFolder && isExpanded && node.children?.map((child) => renderTreeNode(child, depth + 1))
       ] }, node.path);
     }
-    return /* @__PURE__ */ jsxs59(React18.Fragment, { children: [
-      /* @__PURE__ */ jsxs59(
+    return /* @__PURE__ */ jsxs58(React18.Fragment, { children: [
+      /* @__PURE__ */ jsxs58(
         ListItemButton4,
         {
           selected: isSelected,
@@ -10616,7 +10634,7 @@ var CodeEditorFileTree = ({
 // src/components/third-party/CodeEditorWorkspace/CodeEditorStatusBar.tsx
 import { Box as Box42, Tooltip as Tooltip10, Typography as Typography33 } from "@mui/material";
-import { Fragment as Fragment17, jsx as jsx109, jsxs as jsxs60 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx109, jsxs as jsxs59 } from "react/jsx-runtime";
 var LANGUAGE_LABELS = {
   typescript: "TypeScript",
   javascript: "JavaScript",
@@ -10644,7 +10662,7 @@ var CodeEditorStatusBar = ({
   }
   const leftItems = items?.filter((i) => i.align !== "right") ?? [];
   const rightItems = items?.filter((i) => i.align === "right") ?? [];
-  return /* @__PURE__ */ jsxs60(
+  return /* @__PURE__ */ jsxs59(
     Box42,
     {
       sx: {
@@ -10665,7 +10683,7 @@ var CodeEditorStatusBar = ({
       },
       ...containerProps,
       children: [
-        /* @__PURE__ */ jsxs60(Box42, { sx: { display: "flex", alignItems: "center", gap: 1.5, overflow: "hidden" }, children: [
+        /* @__PURE__ */ jsxs59(Box42, { sx: { display: "flex", alignItems: "center", gap: 1.5, overflow: "hidden" }, children: [
           gitInfo && /* @__PURE__ */ jsx109(
             Tooltip10,
             {
@@ -10676,7 +10694,7 @@ var CodeEditorStatusBar = ({
                 gitInfo.behind != null && `\u2193 ${gitInfo.behind} behind`
               ].filter(Boolean).join(" \xB7 ") || gitInfo.branch,
               enterDelay: 400,
-              children: /* @__PURE__ */ jsxs60(
+              children: /* @__PURE__ */ jsxs59(
                 Box42,
                 {
                   onClick: onBranchClick,
@@ -10736,11 +10754,11 @@ var CodeEditorStatusBar = ({
                         }
                       }
                     ),
-                    gitInfo.ahead != null && gitInfo.ahead > 0 && /* @__PURE__ */ jsxs60(Typography33, { variant: "caption", sx: { fontSize: "inherit", fontFamily: "inherit", color: "inherit", lineHeight: 1, opacity: 0.85 }, children: [
+                    gitInfo.ahead != null && gitInfo.ahead > 0 && /* @__PURE__ */ jsxs59(Typography33, { variant: "caption", sx: { fontSize: "inherit", fontFamily: "inherit", color: "inherit", lineHeight: 1, opacity: 0.85 }, children: [
                       "\u2191",
                       gitInfo.ahead
                     ] }),
-                    gitInfo.behind != null && gitInfo.behind > 0 && /* @__PURE__ */ jsxs60(Typography33, { variant: "caption", sx: { fontSize: "inherit", fontFamily: "inherit", color: "inherit", lineHeight: 1, opacity: 0.85 }, children: [
+                    gitInfo.behind != null && gitInfo.behind > 0 && /* @__PURE__ */ jsxs59(Typography33, { variant: "caption", sx: { fontSize: "inherit", fontFamily: "inherit", color: "inherit", lineHeight: 1, opacity: 0.85 }, children: [
                       "\u2193",
                       gitInfo.behind
                     ] })
@@ -10751,9 +10769,9 @@ var CodeEditorStatusBar = ({
           ),
           leftItems.map((item) => /* @__PURE__ */ jsx109(StatusBarItemElement, { item }, item.id))
         ] }),
-        /* @__PURE__ */ jsxs60(Box42, { sx: { display: "flex", alignItems: "center", gap: 1.5, overflow: "hidden" }, children: [
+        /* @__PURE__ */ jsxs59(Box42, { sx: { display: "flex", alignItems: "center", gap: 1.5, overflow: "hidden" }, children: [
           rightItems.map((item) => /* @__PURE__ */ jsx109(StatusBarItemElement, { item }, item.id)),
-          cursorPosition && /* @__PURE__ */ jsxs60(
+          cursorPosition && /* @__PURE__ */ jsxs59(
             Typography33,
             {
               variant: "caption",
@@ -10810,7 +10828,7 @@ var StatusBarItemElement = ({ item }) => {
 // src/components/third-party/CodeEditorWorkspace/CodeEditorWelcomeScreen.tsx
 import { Box as Box43 } from "@mui/material";
-import { jsx as jsx110, jsxs as jsxs61 } from "react/jsx-runtime";
+import { jsx as jsx110, jsxs as jsxs60 } from "react/jsx-runtime";
 var CodeEditorWelcomeScreen = ({
   logo,
   children,
@@ -10826,7 +10844,7 @@ var CodeEditorWelcomeScreen = ({
       }
     }
   );
-  return /* @__PURE__ */ jsxs61(
+  return /* @__PURE__ */ jsxs60(
     Box43,
     {
       sx: {
@@ -10862,7 +10880,7 @@ var CodeEditorWelcomeScreen = ({
 // src/components/third-party/CodeEditorWorkspace/CodeEditorWorkspace.tsx
 import React19 from "react";
 import { Box as Box44 } from "@mui/material";
-import { jsx as jsx111, jsxs as jsxs62 } from "react/jsx-runtime";
+import { jsx as jsx111, jsxs as jsxs61 } from "react/jsx-runtime";
 var CodeEditorWorkspace = ({
   files,
   initialOpenPaths,
@@ -10964,7 +10982,7 @@ var CodeEditorWorkspace = ({
       ...editorProps
     }
   ) : welcomeElement;
-  return /* @__PURE__ */ jsxs62(
+  return /* @__PURE__ */ jsxs61(
     Box44,
     {
       sx: {
@@ -10979,7 +10997,7 @@ var CodeEditorWorkspace = ({
       ...containerProps,
       children: [
         fileTreeElement,
-        /* @__PURE__ */ jsxs62(Box44, { sx: { flex: 1, display: "flex", flexDirection: "column", minWidth: 0, overflow: "hidden" }, children: [
+        /* @__PURE__ */ jsxs61(Box44, { sx: { flex: 1, display: "flex", flexDirection: "column", minWidth: 0, overflow: "hidden" }, children: [
           tabsElement,
           /* @__PURE__ */ jsx111(Box44, { sx: { flex: 1, overflow: "hidden" }, children: editorElement }),
           statusBarElement