@cere/cere-design-system 0.1.0 → 0.2.0

package/dist/chunk-HLH2VWXL.js

@@ -1,2658 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
-
-var _chunkX7E6GMFLjs = require('./chunk-X7E6GMFL.js');
-
-
-
-var _chunkKPDYKK3Vjs = require('./chunk-KPDYKK3V.js');
-
-
-var _chunk2EBCST6Xjs = require('./chunk-2EBCST6X.js');
-
-
-var _chunkMNM6HE72js = require('./chunk-MNM6HE72.js');
-
-
-var _chunkFN5YL4BKjs = require('./chunk-FN5YL4BK.js');
-
-
-
-var _chunkZGCN5WCGjs = require('./chunk-ZGCN5WCG.js');
-
-// src/components/layout/Logo.tsx
-var _material = require('@mui/material');
-var _jsxruntime = require('react/jsx-runtime');
-var sizesMap = {
-  large: 38,
-  medium: 32,
-  small: 24
-};
-var Container = _material.styled.call(void 0, (0, _material.Stack))({
-  [`& .${_material.svgIconClasses.root}`]: {
-    fontSize: "inherit"
-  }
-});
-var Logo = ({ children, size = "medium", icon = /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk2EBCST6Xjs.CereIcon, { color: "primary" }) }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, Container, { direction: "row", alignItems: "center", spacing: 2, fontSize: sizesMap[size], children: [
-  icon,
-  children && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Stack, { children })
-] });
-
-// src/components/layout/Dialog.tsx
-
-
-
-
-
-
-
-
-
-
-
-
-var _Close = require('@mui/icons-material/Close'); var _Close2 = _interopRequireDefault(_Close);
-
-var Dialog = ({
-  open,
-  title,
-  onClose,
-  onSubmit,
-  submitLabel = "Save",
-  cancelLabel = "Cancel",
-  isLoading = false,
-  disableSubmit = false,
-  showActions = true,
-  headerAction,
-  fullWidth = true,
-  maxWidth = "md",
-  children,
-  dividers = true,
-  confirmBeforeClose = false,
-  customActions,
-  ...dialogProps
-}) => {
-  const handleCloseAttempt = (e) => {
-    if (e) e.stopPropagation();
-    onClose();
-  };
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _material.Dialog,
-    {
-      open,
-      onClose: (_, reason) => {
-        if (confirmBeforeClose) return;
-        if (reason === "backdropClick" || reason === "escapeKeyDown") {
-          onClose();
-        }
-      },
-      fullWidth,
-      maxWidth,
-      ...dialogProps,
-      PaperProps: {
-        sx: { minHeight: dialogProps.fullScreen ? void 0 : "auto" },
-        ...dialogProps.PaperProps
-      },
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.DialogTitle, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", p: 2 }, children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { sx: { display: "flex", alignItems: "center" }, children: typeof title === "string" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "h6", children: title }) : title }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", alignItems: "center" }, children: [
-            headerAction,
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _material.IconButton,
-              {
-                edge: "end",
-                color: "inherit",
-                onClick: handleCloseAttempt,
-                "aria-label": "close",
-                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, {})
-              }
-            )
-          ] })
-        ] }),
-        dividers && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, {}),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.DialogContent, { dividers, children }),
-        (showActions || customActions) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-          dividers && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, {}),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.DialogActions, { children: customActions || /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _material.Button,
-              {
-                onClick: handleCloseAttempt,
-                disabled: isLoading,
-                children: cancelLabel
-              }
-            ),
-            onSubmit && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _material.Button,
-              {
-                variant: "contained",
-                color: "primary",
-                onClick: onSubmit,
-                disabled: disableSubmit || isLoading,
-                startIcon: isLoading ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.CircularProgress, { size: 20 }) : void 0,
-                children: submitLabel
-              }
-            )
-          ] }) })
-        ] })
-      ]
-    }
-  );
-};
-
-// src/components/layout/KpiCard.tsx
-var _react = require('react'); var React = _interopRequireWildcard(_react); var React2 = _interopRequireWildcard(_react); var React3 = _interopRequireWildcard(_react);
-var _Box = require('@mui/material/Box'); var _Box2 = _interopRequireDefault(_Box);
-var _Typography = require('@mui/material/Typography'); var _Typography2 = _interopRequireDefault(_Typography);
-
-var toneColor = (tone, theme) => {
-  switch (tone) {
-    case "violet":
-      return theme.palette.primary.main;
-    case "blue":
-      return theme.palette.info.main;
-    case "green":
-      return theme.palette.success.main;
-    case "orange":
-      return theme.palette.warning.main;
-    case "pink":
-      return _nullishCoalesce(_optionalChain([theme, 'access', _2 => _2.palette, 'access', _3 => _3.secondary, 'optionalAccess', _4 => _4.main]), () => ( theme.palette.primary.main));
-    case "neutral":
-    default:
-      return theme.palette.grey[300];
-  }
-};
-var KpiCard = React.forwardRef(
-  function KpiCard2({ icon, label, value, sub, tone = "neutral", ...rest }, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      _Box2.default,
-      {
-        ref,
-        "data-tone": tone,
-        ...rest,
-        sx: (theme) => ({
-          position: "relative",
-          display: "flex",
-          flexDirection: "column",
-          gap: 0.5,
-          padding: 2,
-          paddingLeft: 2.5,
-          borderRadius: 1.5,
-          backgroundColor: theme.palette.background.paper,
-          border: `1px solid ${theme.palette.divider}`,
-          overflow: "hidden",
-          "&::before": {
-            content: '""',
-            position: "absolute",
-            left: 0,
-            top: 0,
-            bottom: 0,
-            width: 4,
-            backgroundColor: toneColor(tone, theme)
-          }
-        }),
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { sx: { display: "flex", alignItems: "center", gap: 0.75 }, children: [
-            icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { display: "inline-flex", color: "text.secondary" }, children: icon }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "eyebrow", component: "span", children: label })
-          ] }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "panelTitle", component: "div", children: value }),
-          sub && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "body2", sx: { color: "text.secondary" }, children: sub })
-        ]
-      }
-    );
-  }
-);
-
-// src/components/layout/AgentAvatar.tsx
-
-
-
-var hashSeed = (seed) => {
-  let h = 5381;
-  for (let i = 0; i < seed.length; i += 1) {
-    h = (h << 5) + h + seed.charCodeAt(i) & 4294967295;
-  }
-  return Math.abs(h);
-};
-var palette = (theme) => [
-  theme.palette.primary.main,
-  theme.palette.primary.dark,
-  _nullishCoalesce(_optionalChain([theme, 'access', _5 => _5.palette, 'access', _6 => _6.secondary, 'optionalAccess', _7 => _7.main]), () => ( theme.palette.primary.main))
-];
-var AgentAvatar = React2.forwardRef(
-  function AgentAvatar2({ seed, name, size = 40, shadow = false, iconUrl, ariaLabel, ...rest }, ref) {
-    const initial = (_nullishCoalesce(_optionalChain([name, 'optionalAccess', _8 => _8.trim, 'call', _9 => _9(), 'optionalAccess', _10 => _10[0]]), () => ( "?"))).toUpperCase();
-    const radius = Math.round(size * 0.28);
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _Box2.default,
-      {
-        ref,
-        role: "img",
-        "aria-label": _nullishCoalesce(ariaLabel, () => ( name)),
-        ...rest,
-        sx: (theme) => {
-          const colors = palette(theme);
-          const paletteIndex = hashSeed(seed) % colors.length;
-          return {
-            width: size,
-            height: size,
-            borderRadius: `${radius}px`,
-            backgroundColor: colors[paletteIndex],
-            color: theme.palette.common.white,
-            display: "inline-flex",
-            alignItems: "center",
-            justifyContent: "center",
-            fontWeight: 700,
-            fontSize: Math.round(size * 0.42),
-            lineHeight: 1,
-            overflow: "hidden",
-            flexShrink: 0,
-            boxShadow: shadow ? theme.shadows[3] : "inset 0 1px 0 rgba(255,255,255,0.2)",
-            userSelect: "none"
-          };
-        },
-        children: iconUrl ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _Box2.default,
-          {
-            component: "img",
-            src: iconUrl,
-            alt: "",
-            sx: { width: "100%", height: "100%", objectFit: "cover" }
-          }
-        ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { "aria-hidden": "true", children: initial })
-      }
-    );
-  }
-);
-
-// src/components/layout/NumberedList.tsx
-
-
-
-
-var toneColors = (tone, theme) => {
-  switch (tone) {
-    case "blue":
-      return { bg: theme.palette.info.light, fg: theme.palette.info.dark };
-    case "green":
-      return { bg: theme.palette.success.light, fg: theme.palette.success.dark };
-    case "orange":
-      return { bg: theme.palette.warning.light, fg: theme.palette.warning.dark };
-    case "pink":
-      return {
-        bg: _nullishCoalesce(_optionalChain([theme, 'access', _11 => _11.palette, 'access', _12 => _12.secondary, 'optionalAccess', _13 => _13.light]), () => ( theme.palette.primary.light)),
-        fg: _nullishCoalesce(_optionalChain([theme, 'access', _14 => _14.palette, 'access', _15 => _15.secondary, 'optionalAccess', _16 => _16.main]), () => ( theme.palette.primary.main))
-      };
-    case "neutral":
-      return { bg: theme.palette.grey[100], fg: theme.palette.text.primary };
-    case "violet":
-    default:
-      return { bg: theme.palette.primary.light, fg: theme.palette.primary.main };
-  }
-};
-var NumberedList = React3.forwardRef(
-  function NumberedList2({ items, tone = "violet", startAt = 1, ...rest }, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _Box2.default,
-      {
-        ref,
-        component: "ol",
-        "data-tone": tone,
-        ...rest,
-        sx: (theme) => {
-          const { bg, fg } = toneColors(tone, theme);
-          return {
-            listStyle: "none",
-            margin: 0,
-            padding: 0,
-            display: "flex",
-            flexDirection: "column",
-            gap: 1.5,
-            "--numbered-list-bg": bg,
-            "--numbered-list-fg": fg
-          };
-        },
-        children: items.map((item, idx) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-          _Box2.default,
-          {
-            component: "li",
-            sx: { display: "flex", alignItems: "flex-start", gap: 1.5 },
-            children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                _Box2.default,
-                {
-                  "aria-hidden": "true",
-                  sx: {
-                    flexShrink: 0,
-                    width: 28,
-                    height: 28,
-                    borderRadius: "50%",
-                    display: "inline-flex",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    fontWeight: 700,
-                    fontSize: 13,
-                    backgroundColor: "var(--numbered-list-bg)",
-                    color: "var(--numbered-list-fg)"
-                  },
-                  children: startAt + idx
-                }
-              ),
-              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { sx: { flex: 1, minWidth: 0 }, children: [
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "subtitle1", component: "div", children: item.title }),
-                item.detail && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                  _Typography2.default,
-                  {
-                    variant: "body2",
-                    component: "div",
-                    sx: { color: "text.secondary", mt: 0.25 },
-                    children: item.detail
-                  }
-                )
-              ] }),
-              item.cta && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { flexShrink: 0 }, children: item.cta })
-            ]
-          },
-          `${idx}-${item.title}`
-        ))
-      }
-    );
-  }
-);
-
-// src/components/layout/Drawer.tsx
-
-var _Drawer = require('@mui/material/Drawer'); var _Drawer2 = _interopRequireDefault(_Drawer);
-var _styles = require('@mui/material/styles');
-
-
-
-// src/components/layout/drawerWidth.ts
-function resolveDrawerWidth(width, theme, defaultWidth) {
-  if (width === void 0) {
-    return { width: defaultWidth };
-  }
-  if (typeof width === "number" || typeof width === "string") {
-    return { width };
-  }
-  const base = _nullishCoalesce(width.xs, () => ( defaultWidth));
-  const css = { width: base };
-  ["sm", "md", "lg", "xl"].forEach((bp) => {
-    const value = width[bp];
-    if (value !== void 0) {
-      css[theme.breakpoints.up(bp)] = { width: value };
-    }
-  });
-  return css;
-}
-
-// src/components/layout/Drawer.tsx
-
-var StyledDrawer = _styles.styled.call(void 0, _Drawer2.default, {
-  shouldForwardProp: (prop) => prop !== "width" && prop !== "miniWidth" && prop !== "collapsed" && prop !== "topOffset"
-})(({ theme, width, miniWidth = 72, collapsed, topOffset = 0 }) => {
-  const widthCss = collapsed ? { width: miniWidth } : resolveDrawerWidth(width, theme, 240);
-  return {
-    ...widthCss,
-    flexShrink: 0,
-    "& .MuiDrawer-paper": {
-      ...widthCss,
-      boxSizing: "border-box",
-      boxShadow: "0px 2px 10px rgba(0, 0, 0, 0.05)",
-      transition: theme.transitions.create(["width", "top", "height"], {
-        easing: theme.transitions.easing.sharp,
-        duration: theme.transitions.duration.enteringScreen
-      }),
-      overflow: "visible",
-      // Let internal content handle scrolling
-      display: "flex",
-      flexDirection: "column",
-      top: `${topOffset}px !important`,
-      height: topOffset > 0 ? `calc(100% - ${topOffset}px) !important` : "100%",
-      zIndex: `${theme.zIndex.modal} !important`
-      // Use modal zIndex to be above everything except AppBar (which is modal + 1)
-    }
-  };
-});
-var Drawer = React.default.forwardRef(function Drawer2({
-  width,
-  miniWidth = 72,
-  collapsed = false,
-  title,
-  header,
-  showCloseButton,
-  tabs,
-  activeTab = 0,
-  onTabChange,
-  footer,
-  contentProps,
-  anchor = "right",
-  variant = "temporary",
-  topOffset = 0,
-  children,
-  onClose,
-  ...props
-}, ref) {
-  const defaultWidth = variant === "temporary" || variant === "persistent" ? 400 : 240;
-  const finalWidth = _nullishCoalesce(width, () => ( defaultWidth));
-  const shouldShowClose = _nullishCoalesce(showCloseButton, () => ( (variant === "temporary" || variant === "persistent")));
-  const hasHeader = title || header || shouldShowClose || tabs;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    StyledDrawer,
-    {
-      ref,
-      width: finalWidth,
-      miniWidth,
-      collapsed,
-      anchor,
-      variant,
-      topOffset,
-      onClose,
-      ModalProps: {
-        ...props.ModalProps,
-        style: {
-          zIndex: topOffset > 0 ? void 0 : void 0
-          // Let styled component handle zIndex
-        }
-      },
-      BackdropProps: {
-        ...props.BackdropProps,
-        style: {
-          backgroundColor: "rgba(0, 0, 0, 0.5)"
-        }
-      },
-      ...props,
-      children: [
-        hasHeader && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _material.Box,
-            {
-              sx: {
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "space-between",
-                p: 2,
-                minHeight: 64,
-                borderBottom: 1,
-                borderColor: "divider"
-              },
-              children: header || /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { sx: { flex: 1 }, children: typeof title === "string" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "h6", children: title }) : title }),
-                shouldShowClose && onClose && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                  _material.IconButton,
-                  {
-                    onClick: (e) => {
-                      e.stopPropagation();
-                      onClose(e, "backdropClick");
-                    },
-                    size: "small",
-                    sx: { ml: 1 },
-                    "aria-label": "close",
-                    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, {})
-                  }
-                )
-              ] })
-            }
-          ),
-          tabs && tabs.length > 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _material.Tabs,
-            {
-              value: activeTab,
-              onChange: (_, newValue) => _optionalChain([onTabChange, 'optionalCall', _17 => _17(newValue)]),
-              variant: tabs.length > 4 ? "scrollable" : "standard",
-              scrollButtons: tabs.length > 4 ? "auto" : false,
-              sx: {
-                borderBottom: 1,
-                borderColor: "divider",
-                px: 2,
-                "& .MuiTabs-scrollableContainer": {
-                  overflow: "auto"
-                }
-              },
-              children: tabs.map((tab, index) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Tab, { label: tab }, index))
-            }
-          )
-        ] }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _material.Box,
-          {
-            sx: {
-              flex: 1,
-              overflow: "auto",
-              display: "flex",
-              flexDirection: "column"
-            },
-            ...contentProps,
-            children
-          }
-        ),
-        footer && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, {}),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _material.Box,
-            {
-              sx: {
-                p: 2,
-                borderTop: 1,
-                borderColor: "divider"
-              },
-              children: footer
-            }
-          )
-        ] })
-      ]
-    }
-  );
-});
-
-// src/components/layout/MetaField.tsx
-
-
-
-
-var MetaField = React.default.forwardRef(function MetaField2({ label, value, mono = false, title }, ref) {
-  const resolvedTitle = _nullishCoalesce(title, () => ( (typeof value === "string" ? value : void 0)));
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { ref, sx: { display: "flex", flexDirection: "column", gap: 0.25, minWidth: 0 }, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _Typography2.default,
-      {
-        variant: "caption",
-        sx: {
-          color: "text.secondary",
-          textTransform: "uppercase",
-          letterSpacing: 0.4,
-          fontSize: 10,
-          fontWeight: 600
-        },
-        children: label
-      }
-    ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _Typography2.default,
-      {
-        variant: "body2",
-        sx: {
-          fontFamily: mono ? "monospace" : void 0,
-          fontSize: 13,
-          overflow: "hidden",
-          textOverflow: "ellipsis",
-          whiteSpace: "nowrap"
-        },
-        title: resolvedTitle,
-        children: value
-      }
-    )
-  ] });
-});
-
-// src/components/layout/ScrollableRow.tsx
-
-
-var _IconButton = require('@mui/material/IconButton'); var _IconButton2 = _interopRequireDefault(_IconButton);
-var _ChevronLeft = require('@mui/icons-material/ChevronLeft'); var _ChevronLeft2 = _interopRequireDefault(_ChevronLeft);
-var _ChevronRight = require('@mui/icons-material/ChevronRight'); var _ChevronRight2 = _interopRequireDefault(_ChevronRight);
-
-var EDGE_TOLERANCE_PX = 4;
-var ScrollableRow = ({
-  children,
-  leftLabel = "Scroll left",
-  rightLabel = "Scroll right",
-  minNudge = 160,
-  nudgeFraction = 0.6
-}) => {
-  const scrollerRef = _react.useRef.call(void 0, null);
-  const [canLeft, setCanLeft] = _react.useState.call(void 0, false);
-  const [canRight, setCanRight] = _react.useState.call(void 0, false);
-  _react.useEffect.call(void 0, () => {
-    const el = scrollerRef.current;
-    if (!el) return;
-    const update = () => {
-      setCanLeft(el.scrollLeft > EDGE_TOLERANCE_PX);
-      setCanRight(el.scrollLeft + el.clientWidth < el.scrollWidth - EDGE_TOLERANCE_PX);
-    };
-    update();
-    el.addEventListener("scroll", update, { passive: true });
-    const ro = typeof ResizeObserver !== "undefined" ? new ResizeObserver(update) : null;
-    _optionalChain([ro, 'optionalAccess', _18 => _18.observe, 'call', _19 => _19(el)]);
-    for (const c of Array.from(el.children)) _optionalChain([ro, 'optionalAccess', _20 => _20.observe, 'call', _21 => _21(c)]);
-    const mo = typeof MutationObserver !== "undefined" ? new MutationObserver(() => {
-      for (const c of Array.from(el.children)) _optionalChain([ro, 'optionalAccess', _22 => _22.observe, 'call', _23 => _23(c)]);
-      update();
-    }) : null;
-    _optionalChain([mo, 'optionalAccess', _24 => _24.observe, 'call', _25 => _25(el, { childList: true })]);
-    return () => {
-      el.removeEventListener("scroll", update);
-      _optionalChain([ro, 'optionalAccess', _26 => _26.disconnect, 'call', _27 => _27()]);
-      _optionalChain([mo, 'optionalAccess', _28 => _28.disconnect, 'call', _29 => _29()]);
-    };
-  }, []);
-  const nudge = (dir) => {
-    const el = scrollerRef.current;
-    if (!el) return;
-    el.scrollBy({ left: dir * Math.max(minNudge, el.clientWidth * nudgeFraction), behavior: "smooth" });
-  };
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { sx: { position: "relative", flex: 1, minWidth: 0 }, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _Box2.default,
-      {
-        ref: scrollerRef,
-        "data-scrollable-row-scroller": true,
-        sx: {
-          display: "flex",
-          gap: 1,
-          overflowX: "auto",
-          overflowY: "hidden",
-          scrollbarWidth: "thin",
-          py: 0.25
-        },
-        children
-      }
-    ),
-    canLeft && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _IconButton2.default,
-      {
-        size: "small",
-        "aria-label": leftLabel,
-        onClick: () => nudge(-1),
-        sx: {
-          position: "absolute",
-          left: -6,
-          top: "50%",
-          transform: "translateY(-50%)",
-          bgcolor: "background.paper",
-          boxShadow: 1,
-          "&:hover": { bgcolor: "background.paper" }
-        },
-        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ChevronLeft2.default, { fontSize: "small" })
-      }
-    ),
-    canRight && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _IconButton2.default,
-      {
-        size: "small",
-        "aria-label": rightLabel,
-        onClick: () => nudge(1),
-        sx: {
-          position: "absolute",
-          right: -6,
-          top: "50%",
-          transform: "translateY(-50%)",
-          bgcolor: "background.paper",
-          boxShadow: 1,
-          "&:hover": { bgcolor: "background.paper" }
-        },
-        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ChevronRight2.default, { fontSize: "small" })
-      }
-    )
-  ] });
-};
-
-// src/components/layout/SectionRow.tsx
-
-
-
-
-var SectionRow = React.default.forwardRef(function SectionRow2({ title, subtitle, action, leftLabel, rightLabel, children }, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { ref, component: "section", sx: { mb: 4 }, children: [
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      _Box2.default,
-      {
-        component: "header",
-        sx: {
-          display: "flex",
-          alignItems: "flex-end",
-          justifyContent: "space-between",
-          gap: 1.5,
-          mb: 1.5
-        },
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { sx: { minWidth: 0 }, children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { component: "h2", variant: "h6", sx: { m: 0 }, children: title }),
-            subtitle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "caption", sx: { color: "text.secondary" }, children: subtitle })
-          ] }),
-          action && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: action })
-        ]
-      }
-    ),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ScrollableRow, { leftLabel, rightLabel, children })
-  ] });
-});
-
-// src/components/layout/GradientSurface.tsx
-
-
-
-var PALETTES = [
-  { base: "linear-gradient(115deg, #0d0627 0%, #23194b 55%, #8B00EC 130%)", blobA: "#BD32A7", blobB: "#8B00EC" },
-  { base: "linear-gradient(115deg, #2a1635 0%, #5b2a55 55%, #c75a8a 130%)", blobA: "#ff7ea8", blobB: "#ffd1a8" },
-  { base: "linear-gradient(115deg, #0e2a2c 0%, #1d5d63 55%, #59c6c4 130%)", blobA: "#59c6c4", blobB: "#2bb0a0" },
-  { base: "linear-gradient(115deg, #131534 0%, #2c3a8c 55%, #6088e8 130%)", blobA: "#6088e8", blobB: "#3b5db8" },
-  { base: "linear-gradient(115deg, #1a0f30 0%, #3d2a78 55%, #8a5cf6 130%)", blobA: "#a892ff", blobB: "#6b4cf0" },
-  { base: "linear-gradient(115deg, #2b1124 0%, #6d2244 55%, #d44a7a 130%)", blobA: "#d44a7a", blobB: "#a8345e" }
-];
-var GRADIENT_PALETTE_COUNT = PALETTES.length;
-var GradientSurface = React.default.forwardRef(
-  function GradientSurface2({ index, children, sx }, ref) {
-    const wrapped = (index % GRADIENT_PALETTE_COUNT + GRADIENT_PALETTE_COUNT) % GRADIENT_PALETTE_COUNT;
-    const palette2 = PALETTES[wrapped];
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _Box2.default,
-      {
-        ref,
-        "data-gradient-index": wrapped,
-        sx: [
-          {
-            position: "relative",
-            overflow: "hidden",
-            background: palette2.base,
-            color: "common.white",
-            "&::before, &::after": {
-              content: '""',
-              position: "absolute",
-              pointerEvents: "none",
-              borderRadius: "50%",
-              filter: "blur(6px)"
-            },
-            "&::before": {
-              width: 460,
-              height: 460,
-              top: -120,
-              right: -120,
-              opacity: 0.7,
-              background: `radial-gradient(circle, ${palette2.blobA} 0%, transparent 70%)`
-            },
-            "&::after": {
-              width: 520,
-              height: 520,
-              bottom: -180,
-              left: -160,
-              opacity: 0.55,
-              background: `radial-gradient(circle, ${palette2.blobB} 0%, transparent 70%)`
-            }
-          },
-          ...Array.isArray(sx) ? sx : [sx]
-        ],
-        children
-      }
-    );
-  }
-);
-
-// src/components/layout/DefinitionRow.tsx
-
-
-
-
-var DefinitionRow = React.default.forwardRef(
-  function DefinitionRow2({ icon, label, sublabel, value, hint, dense = false, divider = true }, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      _Box2.default,
-      {
-        ref,
-        "data-density": dense ? "dense" : "normal",
-        sx: {
-          py: dense ? 0.75 : 1.25,
-          display: "flex",
-          alignItems: "center",
-          gap: 1.5,
-          ...divider && {
-            borderBottom: "1px solid",
-            borderColor: "divider",
-            "&:last-child": { borderBottom: "none" }
-          }
-        },
-        children: [
-          icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { display: "flex", alignItems: "center", color: "text.secondary" }, children: icon }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { sx: { minWidth: 0, flex: 1 }, children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "body2", sx: { fontWeight: 500, lineHeight: 1.2 }, children: label }),
-            sublabel && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "caption", sx: { color: "text.secondary" }, children: sublabel })
-          ] }),
-          (value || hint) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-            _Box2.default,
-            {
-              sx: {
-                display: "flex",
-                flexDirection: "column",
-                alignItems: "flex-end",
-                textAlign: "right"
-              },
-              children: [
-                value && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "body2", sx: { color: "text.secondary" }, children: value }),
-                hint && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "caption", sx: { color: "text.disabled" }, children: hint })
-              ]
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-
-// src/components/layout/PanelDialog.tsx
-
-var _Dialog = require('@mui/material/Dialog'); var _Dialog2 = _interopRequireDefault(_Dialog);
-
-
-
-var _Slide = require('@mui/material/Slide'); var _Slide2 = _interopRequireDefault(_Slide);
-
-
-var WIDTH_PX = {
-  sm: 420,
-  md: 640,
-  lg: 880,
-  xl: 1080
-};
-var SlideLeft = _react.forwardRef.call(void 0, 
-  function SlideLeft2(props, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Slide2.default, { direction: "left", ref, ...props });
-  }
-);
-var SlideUp = _react.forwardRef.call(void 0, 
-  function SlideUp2(props, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Slide2.default, { direction: "up", ref, ...props });
-  }
-);
-function PanelDialog({
-  open,
-  onClose,
-  title,
-  headerActions,
-  width = "md",
-  side = "right",
-  ariaLabel,
-  hideHeader = false,
-  paperSx,
-  backdropSx,
-  transition,
-  children
-}) {
-  const accessibleName = _nullishCoalesce(ariaLabel, () => ( (typeof title === "string" ? title : void 0)));
-  const isRight = side === "right";
-  const resolvedTransition = _nullishCoalesce(transition, () => ( (isRight ? "slide-left" : "fade")));
-  const TransitionComponent = resolvedTransition === "slide-left" ? SlideLeft : resolvedTransition === "slide-up" ? SlideUp : void 0;
-  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,
-      // 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__ */ _jsxruntime.jsxs.call(void 0, 
-    _Dialog2.default,
-    {
-      open,
-      onClose,
-      slots: TransitionComponent ? { transition: TransitionComponent } : void 0,
-      slotProps: {
-        paper: {
-          "aria-label": accessibleName,
-          sx: [paperBaseSx, ...Array.isArray(paperSx) ? paperSx : [paperSx]]
-        },
-        ...backdropSx ? { backdrop: { sx: backdropSx } } : {}
-      },
-      children: [
-        !hideHeader && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-          _Box2.default,
-          {
-            sx: {
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "space-between",
-              gap: 1,
-              px: 2,
-              py: 1.5,
-              borderBottom: "1px solid",
-              borderColor: "divider"
-            },
-            children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { display: "flex", alignItems: "center", minWidth: 0 }, children: typeof title === "string" ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { variant: "h6", noWrap: true, children: title }) : title }),
-              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
-                headerActions,
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _IconButton2.default, { "aria-label": "Close", onClick: onClose, edge: "end", size: "small", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, { fontSize: "small" }) })
-              ] })
-            ]
-          }
-        ),
-        hideHeader && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          _IconButton2.default,
-          {
-            "aria-label": "Close",
-            onClick: onClose,
-            size: "small",
-            sx: {
-              position: "absolute",
-              top: 12,
-              right: 12,
-              zIndex: 2,
-              bgcolor: "background.paper",
-              boxShadow: 1,
-              "&:hover": { bgcolor: "background.paper" }
-            },
-            children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, { fontSize: "small" })
-          }
-        ),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { flex: 1, overflow: "auto", minHeight: 0 }, children })
-      ]
-    }
-  );
-}
-
-// src/components/layout/SplitDialogContent.tsx
-
-
-
-var SplitDialogContent = React.default.forwardRef(
-  function SplitDialogContent2({ left, right, rightWidth = 320, collapseBelow = 860, sx }, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-      _Box2.default,
-      {
-        ref,
-        sx: {
-          display: "grid",
-          gridTemplateColumns: `1fr ${rightWidth}px`,
-          gap: "28px",
-          // Right padding reserves room for the floating close button on PanelDialog.
-          padding: "28px 56px 36px 36px",
-          overflowY: "auto",
-          [`@media (max-width: ${collapseBelow}px)`]: {
-            gridTemplateColumns: "1fr",
-            padding: "22px 56px 28px 22px"
-          },
-          ...sx
-        },
-        children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { sx: { display: "flex", flexDirection: "column", gap: "22px", minWidth: 0 }, children: left }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Box2.default, { component: "aside", sx: { display: "flex", flexDirection: "column", gap: "14px" }, children: right })
-        ]
-      }
-    );
-  }
-);
-
-// src/components/layout/List.tsx
-
-
-
-
-
-
-
-
-
-
-var List = React.default.forwardRef(function List2(props, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.List, { ref, ...props });
-});
-var StyledListItem = _styles.styled.call(void 0, _material.ListItem, {
-  shouldForwardProp: (prop) => prop !== "hoverable"
-})(({ hoverable = true, theme }) => ({
-  border: `1px solid ${theme.palette.grey[200]}`,
-  borderRadius: 8,
-  marginBottom: 8,
-  ...hoverable && {
-    "&:hover": {
-      backgroundColor: theme.palette.grey[50]
-    }
-  }
-}));
-var ListItem = React.default.forwardRef(function ListItem2({ primary, secondary, icon, action, hoverable = true, children, ...props }, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledListItem, { ref, hoverable, ...props, children: [
-    icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.ListItemIcon, { children: icon }),
-    (primary || secondary) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _material.ListItemText,
-      {
-        primary,
-        secondary
-      }
-    ),
-    children,
-    action && action
-  ] });
-});
-
-// src/components/layout/Avatar.tsx
-
-var _Avatar = require('@mui/material/Avatar'); var _Avatar2 = _interopRequireDefault(_Avatar);
-
-
-var sizeMap = {
-  small: 32,
-  medium: 40,
-  large: 56
-};
-var StyledAvatar = _styles.styled.call(void 0, _Avatar2.default, {
-  shouldForwardProp: (prop) => prop !== "avatarSize"
-})(({ avatarSize = 40, theme }) => ({
-  width: avatarSize,
-  height: avatarSize,
-  backgroundColor: theme.palette.primary.main,
-  color: theme.palette.primary.contrastText,
-  fontWeight: 600
-}));
-var Avatar = React.default.forwardRef(function Avatar2({ size = "medium", ...props }, ref) {
-  const avatarSize = typeof size === "number" ? size : sizeMap[size];
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledAvatar, { ref, avatarSize, ...props });
-});
-
-// src/components/layout/Table.tsx
-
-
-
-
-
-
-
-
-
-
-
-
-var StyledTableContainer = _styles.styled.call(void 0, (0, _material.TableContainer))(({ theme }) => ({
-  borderRadius: 8,
-  border: `1px solid ${theme.palette.grey[200]}`
-}));
-var StyledTableHead = _styles.styled.call(void 0, (0, _material.TableHead))(({ theme }) => ({
-  backgroundColor: theme.palette.grey[50],
-  "& .MuiTableCell-head": {
-    fontWeight: 600,
-    color: theme.palette.text.primary
-  }
-}));
-var Table = React.default.forwardRef(function Table2({ stickyHeader = false, children, ...props }, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledTableContainer, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Table, { ref, stickyHeader, ...props, children }) });
-});
-var TableHeader = React.default.forwardRef(
-  function TableHeader2({ columns, orderBy, order = "asc", onSort }, ref) {
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledTableHead, { ref, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.TableRow, { children: columns.map((column) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.TableCell, { align: column.align || "left", children: column.sortable && onSort ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _material.TableSortLabel,
-      {
-        active: orderBy === column.id,
-        direction: orderBy === column.id ? order : "asc",
-        onClick: () => onSort(column.id),
-        children: column.label
-      }
-    ) : column.label }, column.id)) }) });
-  }
-);
-
-// src/components/layout/Grid.tsx
-
-
-// src/components/layout/Breadcrumbs.tsx
-
-var _Breadcrumbs = require('@mui/material/Breadcrumbs'); var _Breadcrumbs2 = _interopRequireDefault(_Breadcrumbs);
-var _Link = require('@mui/material/Link'); var _Link2 = _interopRequireDefault(_Link);
-
-
-
-var StyledBreadcrumbs = _styles.styled.call(void 0, (0, _Breadcrumbs2.default))(({ theme }) => ({
-  "& .MuiBreadcrumbs-ol": {
-    flexWrap: "nowrap"
-  },
-  "& .MuiBreadcrumbs-separator": {
-    color: theme.palette.text.secondary
-  }
-}));
-var StyledLink = _styles.styled.call(void 0, (0, _Link2.default))(({ theme }) => ({
-  color: theme.palette.primary.main,
-  textDecoration: "none",
-  "&:hover": {
-    textDecoration: "underline"
-  }
-}));
-var Breadcrumbs = React.default.forwardRef(function Breadcrumbs2({ items, ...props }, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledBreadcrumbs, { ref, ...props, children: items.map((item, index) => {
-    const isLast = index === items.length - 1;
-    if (isLast || !item.href && !item.onClick) {
-      return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Typography2.default, { color: "text.primary", children: item.label }, index);
-    }
-    return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      StyledLink,
-      {
-        href: item.href,
-        onClick: (e) => {
-          if (item.onClick) {
-            e.preventDefault();
-            item.onClick();
-          }
-        },
-        children: item.label
-      },
-      index
-    );
-  }) });
-});
-
-// src/components/layout/Accordion.tsx
-
-
-
-
-
-
-var _ExpandMore = require('@mui/icons-material/ExpandMore'); var _ExpandMore2 = _interopRequireDefault(_ExpandMore);
-
-
-var StyledAccordion = _styles.styled.call(void 0, (0, _material.Accordion))(({ theme }) => ({
-  borderRadius: 8,
-  boxShadow: "none",
-  border: `1px solid ${theme.palette.grey[200]}`,
-  "&:before": {
-    display: "none"
-  },
-  "&.Mui-expanded": {
-    margin: 0
-  }
-}));
-var StyledAccordionSummary = _styles.styled.call(void 0, (0, _material.AccordionSummary))(({ theme }) => ({
-  backgroundColor: theme.palette.grey[50],
-  borderRadius: "8px 8px 0 0",
-  "&.Mui-expanded": {
-    borderRadius: "8px 8px 0 0"
-  },
-  "& .MuiAccordionSummary-content": {
-    margin: "12px 0"
-  }
-}));
-var StyledAccordionDetails = _styles.styled.call(void 0, (0, _material.AccordionDetails))({
-  padding: "16px"
-});
-var Accordion = React.default.forwardRef(function Accordion2({ title, children, defaultExpanded = false, ...props }, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, StyledAccordion, { ref, defaultExpanded, ...props, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledAccordionSummary, { expandIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ExpandMore2.default, {}), children: title }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledAccordionDetails, { children })
-  ] });
-});
-
-// src/components/layout/Paper.tsx
-
-var _Paper = require('@mui/material/Paper'); var _Paper2 = _interopRequireDefault(_Paper);
-
-
-var StyledPaper = _styles.styled.call(void 0, (0, _Paper2.default))(({ theme }) => ({
-  borderRadius: 8,
-  "&.MuiPaper-elevation": {
-    boxShadow: "0px 2px 8px rgba(0, 0, 0, 0.08)"
-  },
-  "&.MuiPaper-outlined": {
-    border: `1px solid ${theme.palette.grey[200]}`,
-    boxShadow: "none"
-  }
-}));
-var Paper = React.default.forwardRef(function Paper2({ variant = "elevation", ...props }, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    StyledPaper,
-    {
-      ref,
-      variant,
-      elevation: variant === "elevation" ? 1 : 0,
-      ...props
-    }
-  );
-});
-
-// src/components/layout/Divider.tsx
-
-var _Divider = require('@mui/material/Divider'); var _Divider2 = _interopRequireDefault(_Divider);
-
-
-var StyledDivider = _styles.styled.call(void 0, (0, _Divider2.default))(({ theme }) => ({
-  borderColor: theme.palette.grey[200]
-}));
-var Divider3 = React.default.forwardRef(function Divider4(props, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledDivider, { ref, ...props });
-});
-
-// src/components/layout/Stack.tsx
-
-
-// src/components/layout/Box.tsx
-
-
-// src/components/layout/Container.tsx
-
-
-// src/components/layout/AppBar.tsx
-
-
-
-
-
-
-var StyledAppBar = _styles.styled.call(void 0, _material.AppBar, {
-  shouldForwardProp: (prop) => prop !== "appBarHeight"
-})(({ appBarHeight = 64, theme }) => ({
-  backgroundColor: theme.palette.background.paper,
-  borderBottom: `1px solid ${theme.palette.grey[200]}`,
-  boxShadow: "none",
-  height: appBarHeight,
-  zIndex: 1300
-}));
-var StyledToolbar = _styles.styled.call(void 0, (0, _material.Toolbar))(({ theme }) => ({
-  height: "100%",
-  paddingLeft: theme.spacing(2),
-  paddingRight: theme.spacing(2),
-  gap: theme.spacing(2)
-}));
-var AppBar = ({ height = 64, children, ...props }) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledAppBar, { position: "fixed", appBarHeight: height, ...props, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledToolbar, { children }) });
-};
-
-// src/components/layout/Collapse.tsx
-
-
-
-
-
-var Collapse = React.default.forwardRef(function Collapse2(props, ref) {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Collapse, { ref, ...props });
-});
-
-// src/components/layout/EntityHeader/EntityHeader.tsx
-
-
-
-
-
-var _MoreHoriz = require('@mui/icons-material/MoreHoriz'); var _MoreHoriz2 = _interopRequireDefault(_MoreHoriz);
-
-var EntityHeader = React.default.forwardRef(
-  function EntityHeader2({
-    title,
-    subtitle,
-    role,
-    id,
-    primaryAction,
-    startActions,
-    endActions,
-    onCopyId,
-    onMoreOptions,
-    headingLevel = "h2",
-    divider = true
-  }, ref) {
-    const getPrimaryActionLabel = () => {
-      if (!primaryAction) return "";
-      const { label, count } = primaryAction;
-      return count !== void 0 ? `${label} (${count})` : label;
-    };
-    return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _Box2.default, { ref, children: [
-      /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-        _Box2.default,
-        {
-          sx: {
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "space-between",
-            px: 3,
-            py: 2,
-            gap: 1
-          },
-          children: [
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-              _Box2.default,
-              {
-                sx: {
-                  display: "flex",
-                  alignItems: "center",
-                  gap: 1,
-                  flexWrap: "wrap"
-                },
-                children: [
-                  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                    _Box2.default,
-                    {
-                      sx: {
-                        display: "flex",
-                        flexDirection: "column",
-                        gap: 0.5
-                      },
-                      children: [
-                        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                          _Typography2.default,
-                          {
-                            component: headingLevel,
-                            sx: {
-                              fontSize: "16px",
-                              fontWeight: 500,
-                              lineHeight: "24px",
-                              letterSpacing: "0.15px",
-                              color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary
-                            },
-                            children: title
-                          }
-                        ),
-                        subtitle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                          _Typography2.default,
-                          {
-                            variant: "body2",
-                            sx: {
-                              fontSize: "11px",
-                              fontWeight: 500,
-                              lineHeight: "16px",
-                              letterSpacing: "0.5px",
-                              color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textSecondary
-                            },
-                            children: subtitle
-                          }
-                        )
-                      ]
-                    }
-                  ),
-                  role && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkKPDYKK3Vjs.RoleBadge, { label: role, color: "primary", size: "small" }),
-                  id && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkKPDYKK3Vjs.IDBlock, { id, label: "ID", entityType: "entity", onCopy: onCopyId })
-                ]
-              }
-            ),
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-              _Box2.default,
-              {
-                sx: {
-                  display: "flex",
-                  alignItems: "center",
-                  gap: 1,
-                  flexShrink: 0
-                },
-                children: [
-                  startActions,
-                  primaryAction && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _chunkMNM6HE72js.Button,
-                    {
-                      variant: "primary",
-                      startIcon: primaryAction.icon,
-                      onClick: primaryAction.onClick,
-                      sx: {
-                        textTransform: "capitalize"
-                      },
-                      children: getPrimaryActionLabel()
-                    }
-                  ),
-                  endActions,
-                  onMoreOptions && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _IconButton2.default,
-                    {
-                      onClick: onMoreOptions,
-                      size: "small",
-                      "aria-label": "More options",
-                      sx: {
-                        padding: "8px",
-                        border: `1px solid ${_chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside}`,
-                        borderRadius: "8px",
-                        "&:hover": {
-                          backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.hoverOverlay,
-                          borderColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.borderDefault
-                        }
-                      },
-                      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                        _MoreHoriz2.default,
-                        {
-                          sx: {
-                            fontSize: "20px",
-                            color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textSecondary
-                          }
-                        }
-                      )
-                    }
-                  )
-                ]
-              }
-            )
-          ]
-        }
-      ),
-      divider && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _Divider2.default,
-        {
-          sx: {
-            borderColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside
-          }
-        }
-      )
-    ] });
-  }
-);
-
-// src/components/layout/DeploymentDashboardCard/DeploymentDashboardCard.tsx
-
-
-
-
-
-
-
-
-
-
-var _WorkOutline = require('@mui/icons-material/WorkOutline'); var _WorkOutline2 = _interopRequireDefault(_WorkOutline);
-var _Waves = require('@mui/icons-material/Waves'); var _Waves2 = _interopRequireDefault(_Waves);
-var _RocketLaunchOutlined = require('@mui/icons-material/RocketLaunchOutlined'); var _RocketLaunchOutlined2 = _interopRequireDefault(_RocketLaunchOutlined);
-var _InsertLink = require('@mui/icons-material/InsertLink'); var _InsertLink2 = _interopRequireDefault(_InsertLink);
-var _SmartToyOutlined = require('@mui/icons-material/SmartToyOutlined'); var _SmartToyOutlined2 = _interopRequireDefault(_SmartToyOutlined);
-
-
-// src/hooks/useControlledExpand.ts
-
-function useControlledExpand(controlledExpanded, onToggle, defaultExpanded = false) {
-  const [internal, setInternal] = _react.useState.call(void 0, defaultExpanded);
-  const isControlled = controlledExpanded !== void 0 && onToggle != null;
-  const expanded = isControlled ? controlledExpanded : internal;
-  const toggle = isControlled ? () => onToggle() : () => setInternal((prev) => !prev);
-  return { expanded, toggle };
-}
-
-// src/components/layout/DeploymentDashboardCard/DeploymentDashboardCard.tsx
-
-var ENTITY_LABELS = {
-  workspace: "Workspace",
-  stream: "Stream",
-  deployment: "Deployment",
-  engagement: "Engagement",
-  agent: "Agent"
-};
-var ENTITY_ICON_SIZE = 16;
-var ENTITY_ICONS = {
-  workspace: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _WorkOutline2.default, { sx: { fontSize: ENTITY_ICON_SIZE } }),
-  stream: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Waves2.default, { sx: { fontSize: ENTITY_ICON_SIZE } }),
-  deployment: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _RocketLaunchOutlined2.default, { sx: { fontSize: ENTITY_ICON_SIZE } }),
-  engagement: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _InsertLink2.default, { sx: { fontSize: ENTITY_ICON_SIZE } }),
-  agent: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _SmartToyOutlined2.default, { sx: { fontSize: ENTITY_ICON_SIZE } })
-};
-var STATUS_DOT_COLORS = {
-  normal: _chunkZGCN5WCGjs.deploymentStatusColors.normal,
-  warning: _chunkZGCN5WCGjs.deploymentStatusColors.warning,
-  error: _chunkZGCN5WCGjs.deploymentStatusColors.error,
-  disabled: _chunkZGCN5WCGjs.deploymentStatusColors.disabledDim
-};
-var CHEVRON_SIZE = 16;
-var ENTITY_CHIP_STYLES = {
-  borderRadius: "12px",
-  borderWidth: "1.5px",
-  padding: { left: 0.75, right: 1, vertical: 0.25 },
-  gap: 0.5
-};
-var ENTITY_CHIP_TYPOGRAPHY = {
-  fontSize: "12px",
-  fontWeight: 500,
-  lineHeight: 1.33,
-  letterSpacing: "0.07px"
-};
-var StatusDot = _styles.styled.call(void 0, _material.Box, {
-  shouldForwardProp: (p) => p !== "status"
-})(({ status }) => ({
-  width: 8,
-  height: 8,
-  borderRadius: "50%",
-  backgroundColor: status ? _nullishCoalesce(STATUS_DOT_COLORS[status], () => ( "transparent")) : "transparent",
-  flexShrink: 0
-}));
-var EntityChip = ({ entityType, color }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-  _material.Box,
-  {
-    sx: {
-      display: "inline-flex",
-      alignItems: "center",
-      gap: ENTITY_CHIP_STYLES.gap,
-      pl: ENTITY_CHIP_STYLES.padding.left,
-      pr: ENTITY_CHIP_STYLES.padding.right,
-      py: ENTITY_CHIP_STYLES.padding.vertical,
-      borderRadius: ENTITY_CHIP_STYLES.borderRadius,
-      backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.surfaceHigh,
-      border: `${ENTITY_CHIP_STYLES.borderWidth} solid ${color}`,
-      flexShrink: 0
-    },
-    children: [
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { sx: { color, display: "flex", alignItems: "center" }, children: ENTITY_ICONS[entityType] }),
-      /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        _material.Typography,
-        {
-          variant: "body2",
-          fontWeight: ENTITY_CHIP_TYPOGRAPHY.fontWeight,
-          sx: {
-            color: "common.black",
-            lineHeight: ENTITY_CHIP_TYPOGRAPHY.lineHeight,
-            fontSize: ENTITY_CHIP_TYPOGRAPHY.fontSize,
-            letterSpacing: ENTITY_CHIP_TYPOGRAPHY.letterSpacing
-          },
-          children: ENTITY_LABELS[entityType]
-        }
-      )
-    ]
-  }
-);
-var CapacityBar = ({ value, indented = false }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { pl: indented ? "40px" : 0, pr: "20px", py: 1 }, children: [
-  /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", justifyContent: "space-between", mb: 1 }, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "body2", sx: { color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary }, children: "Capacity" }),
-    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Typography, { variant: "body2", sx: { color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.accentBlue }, children: [
-      value,
-      "%"
-    ] })
-  ] }),
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _material.LinearProgress,
-    {
-      variant: "determinate",
-      value,
-      sx: {
-        height: 4,
-        borderRadius: "20px",
-        backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside,
-        "& .MuiLinearProgress-bar": {
-          borderRadius: "20px",
-          backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.accentBlue
-        }
-      }
-    }
-  )
-] });
-var getActionButtonStyles = (action) => {
-  const baseStyles = {
-    display: "inline-flex",
-    alignItems: "center",
-    gap: 0.5,
-    cursor: action.onClick ? "pointer" : "default",
-    background: "none",
-    font: "inherit",
-    color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary,
-    whiteSpace: "nowrap",
-    "&:hover": action.onClick ? { opacity: 0.7 } : void 0
-  };
-  const variantStyles = action.outlined ? {
-    border: `1px solid ${_chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside}`,
-    borderRadius: "8px",
-    p: 1,
-    bgcolor: "white"
-  } : {
-    border: "none",
-    p: 0
-  };
-  return { ...baseStyles, ...variantStyles };
-};
-var CardAction = ({ action }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-  _material.Box,
-  {
-    component: action.onClick ? "button" : "span",
-    onClick: action.onClick,
-    sx: getActionButtonStyles(action),
-    children: [
-      action.icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { component: "span", sx: { display: "flex", alignItems: "center" }, children: action.icon }),
-      action.label && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "body2", fontWeight: 500, component: "span", sx: { fontSize: "14px" }, children: action.label })
-    ]
-  }
-);
-var CardActionList = ({ actions }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _jsxruntime.Fragment, { children: actions.map((action) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CardAction, { action }, action.id)) });
-var DeploymentDashboardCard = ({
-  entityType,
-  title,
-  id: idDisplay,
-  createdAt,
-  updatedAt,
-  capacity,
-  actions = [],
-  statusIndicator = null,
-  expandable = false,
-  expanded: controlledExpanded,
-  onExpandToggle,
-  onCopyId,
-  className,
-  children
-}) => {
-  const theme = _material.useTheme.call(void 0, );
-  const entityColor = _nullishCoalesce(_optionalChain([theme, 'access', _30 => _30.palette, 'access', _31 => _31.deployment, 'optionalAccess', _32 => _32.entity, 'optionalAccess', _33 => _33[entityType]]), () => ( _chunkZGCN5WCGjs.deploymentEntityColors[entityType]));
-  const isControlled = expandable && onExpandToggle != null;
-  const { expanded, toggle } = useControlledExpand(
-    isControlled ? controlledExpanded : void 0,
-    isControlled ? onExpandToggle : void 0
-  );
-  const isWorkspace = entityType === "workspace";
-  const isDeployment = entityType === "deployment";
-  const getClampedCapacity = (capacity2) => {
-    if (!isDeployment || capacity2 == null) {
-      return void 0;
-    }
-    return Math.min(100, Math.max(0, capacity2));
-  };
-  const capacityClamped = getClampedCapacity(capacity);
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _material.Paper,
-    {
-      className,
-      elevation: 0,
-      sx: {
-        border: `1px solid ${isWorkspace ? _chunkFN5YL4BKjs.deploymentSurfaceTokens.accentBlue : _chunkFN5YL4BKjs.deploymentSurfaceTokens.borderDefault}`,
-        borderRadius: isWorkspace ? "4px" : "12px",
-        boxShadow: isWorkspace ? _chunkFN5YL4BKjs.deploymentSurfaceTokens.workspaceShadow : "none",
-        px: 1,
-        py: isDeployment ? 2 : 1,
-        pl: 1,
-        display: "flex",
-        flexDirection: "column",
-        gap: 0
-      },
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-          _material.Box,
-          {
-            sx: {
-              display: "flex",
-              justifyContent: "space-between",
-              alignItems: isDeployment ? "flex-start" : "center",
-              width: "100%"
-            },
-            children: [
-              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 0.5, minWidth: 0 }, children: [
-                /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", gap: 1, alignItems: "center" }, children: [
-                  expandable ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _material.IconButton,
-                    {
-                      size: "small",
-                      onClick: toggle,
-                      "aria-label": expanded ? "Collapse" : "Expand",
-                      sx: { p: "5px" },
-                      children: expanded ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ExpandMore2.default, { sx: { fontSize: CHEVRON_SIZE, color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.accentBlue } }) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ChevronRight2.default, { sx: { fontSize: CHEVRON_SIZE, color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.accentBlue } })
-                    }
-                  ) : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { sx: { width: 26, flexShrink: 0 } }),
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, EntityChip, { entityType, color: entityColor }),
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _material.Typography,
-                    {
-                      variant: "subtitle1",
-                      fontWeight: 500,
-                      noWrap: true,
-                      sx: { color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary, fontSize: "16px", letterSpacing: "0.08px" },
-                      children: title
-                    }
-                  ),
-                  idDisplay != null && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkKPDYKK3Vjs.IDBlock, { id: idDisplay, label: "ID", entityType, onCopy: onCopyId })
-                ] }),
-                (createdAt != null || updatedAt != null) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                  _material.Box,
-                  {
-                    sx: {
-                      display: "flex",
-                      gap: 2,
-                      px: "34px",
-                      color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textSecondary
-                    },
-                    children: [
-                      createdAt != null && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Typography, { variant: "body2", sx: { color: "inherit", fontSize: "14px" }, children: [
-                        "Created: ",
-                        createdAt
-                      ] }),
-                      updatedAt != null && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Typography, { variant: "body2", sx: { color: "inherit", fontSize: "14px" }, children: [
-                        "Last Updated: ",
-                        updatedAt
-                      ] })
-                    ]
-                  }
-                ),
-                capacityClamped !== void 0 && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CapacityBar, { value: capacityClamped, indented: expandable })
-              ] }),
-              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", gap: 1, alignItems: "center", flexShrink: 0 }, children: [
-                statusIndicator != null && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StatusDot, { status: statusIndicator, "aria-hidden": true }),
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, CardActionList, { actions })
-              ] })
-            ]
-          }
-        ),
-        children && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { sx: { mt: 1.5, display: "flex", flexDirection: "column", gap: 1 }, children })
-      ]
-    }
-  );
-};
-
-// src/components/layout/DeploymentEntityContextMenu/DeploymentEntityContextMenu.tsx
-
-
-
-var StyledMenu = _styles.styled.call(void 0, (0, _material.Menu))({
-  "& .MuiPaper-root": {
-    borderRadius: 4,
-    boxShadow: _chunkFN5YL4BKjs.deploymentSurfaceTokens.workspaceShadow,
-    minWidth: 220,
-    border: `1px solid ${_chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside}`,
-    padding: 8
-  },
-  "& .MuiList-root": {
-    padding: 0
-  }
-});
-var StyledMenuItem = _styles.styled.call(void 0, (0, _material.MenuItem))({
-  gap: 8,
-  padding: "8px 0",
-  borderRadius: 4,
-  minHeight: "auto",
-  "&:hover": {
-    backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.hoverLight
-  },
-  "& .MuiListItemIcon-root": {
-    minWidth: "auto",
-    color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary,
-    "& .MuiSvgIcon-root": {
-      fontSize: 24
-    }
-  },
-  "& .MuiListItemText-root .MuiTypography-root": {
-    fontSize: 16,
-    fontWeight: 500,
-    lineHeight: 1.5,
-    letterSpacing: "0.08px",
-    color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary
-  }
-});
-var HighlightedMenuItem = _styles.styled.call(void 0, StyledMenuItem)({
-  backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.highlightBg,
-  border: `1px solid ${_chunkFN5YL4BKjs.deploymentSurfaceTokens.highlightBorder}`,
-  padding: 8,
-  "&:hover": {
-    backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.highlightBgHover
-  }
-});
-var ToggleMenuItem = _styles.styled.call(void 0, (0, _material.MenuItem))({
-  gap: 8,
-  padding: "8px 0",
-  cursor: "default",
-  minHeight: "auto",
-  "&:hover": {
-    backgroundColor: "transparent"
-  },
-  "& .MuiListItemText-root .MuiTypography-root": {
-    fontSize: 16,
-    fontWeight: 500,
-    lineHeight: 1.5,
-    letterSpacing: "0.08px",
-    color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary
-  }
-});
-var EnableSwitch = _styles.styled.call(void 0, (0, _material.Switch))(({ theme }) => ({
-  width: 32,
-  height: 20,
-  padding: 0,
-  "& .MuiSwitch-switchBase": {
-    padding: 2,
-    "&.Mui-checked": {
-      transform: "translateX(12px)",
-      color: theme.palette.common.white,
-      "& + .MuiSwitch-track": {
-        backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.switchGreen,
-        opacity: 1
-      }
-    }
-  },
-  "& .MuiSwitch-thumb": {
-    width: 16,
-    height: 16
-  },
-  "& .MuiSwitch-track": {
-    borderRadius: 100,
-    backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.switchTrackOff,
-    opacity: 1
-  }
-}));
-var StyledDivider2 = _styles.styled.call(void 0, (0, _material.Divider))({
-  margin: "0 !important",
-  borderColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside
-});
-var DeploymentEntityContextMenu = ({
-  open,
-  anchorEl,
-  onClose,
-  items,
-  enableToggle = false,
-  enableChecked = false,
-  onEnableChange
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    StyledMenu,
-    {
-      anchorEl,
-      open,
-      onClose,
-      anchorOrigin: { vertical: "bottom", horizontal: "right" },
-      transformOrigin: { vertical: "top", horizontal: "right" },
-      slotProps: { paper: { "aria-label": "Entity context menu" } },
-      children: [
-        items.map((item) => {
-          if (item.type === "divider") {
-            return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledDivider2, {}, item.id);
-          }
-          if (item.type === "toggle") {
-            return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, ToggleMenuItem, { disableRipple: true, children: [
-              onEnableChange && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                EnableSwitch,
-                {
-                  size: "small",
-                  checked: enableChecked,
-                  onChange: (_, checked) => onEnableChange(checked),
-                  inputProps: { "aria-label": item.label }
-                }
-              ),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.ListItemText, { primary: item.label })
-            ] }, item.id);
-          }
-          const Row = item.highlighted ? HighlightedMenuItem : StyledMenuItem;
-          return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-            Row,
-            {
-              onClick: () => {
-                _optionalChain([item, 'access', _34 => _34.onClick, 'optionalCall', _35 => _35()]);
-                onClose();
-              },
-              children: [
-                item.icon && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.ListItemIcon, { children: item.icon }),
-                /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.ListItemText, { primary: item.label })
-              ]
-            },
-            item.id
-          );
-        }),
-        enableToggle && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledDivider2, {}),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, ToggleMenuItem, { disableRipple: true, children: [
-            onEnableChange && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              EnableSwitch,
-              {
-                size: "small",
-                checked: enableChecked,
-                onChange: (_, checked) => onEnableChange(checked),
-                inputProps: { "aria-label": "Enable" }
-              }
-            ),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.ListItemText, { primary: "Enable" })
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-
-// src/components/layout/DeploymentEntityContextMenu/contextMenuItems.tsx
-var _AddCircleOutline = require('@mui/icons-material/AddCircleOutline'); var _AddCircleOutline2 = _interopRequireDefault(_AddCircleOutline);
-var _Edit = require('@mui/icons-material/Edit'); var _Edit2 = _interopRequireDefault(_Edit);
-var _ContentCopy = require('@mui/icons-material/ContentCopy'); var _ContentCopy2 = _interopRequireDefault(_ContentCopy);
-
-var _Description = require('@mui/icons-material/Description'); var _Description2 = _interopRequireDefault(_Description);
-var _Settings = require('@mui/icons-material/Settings'); var _Settings2 = _interopRequireDefault(_Settings);
-
-var contextMenuItems = {
-  /** Add Engagement action (Add Circle icon) */
-  addEngagement: (onClick) => ({
-    id: "add-engagement",
-    label: "Add Engagement",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _AddCircleOutline2.default, {}),
-    onClick
-  }),
-  /** Add Agent action (Add Circle icon) */
-  addAgent: (onClick) => ({
-    id: "add-agent",
-    label: "Add Agent",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _AddCircleOutline2.default, {}),
-    onClick
-  }),
-  /** Add Stream action (Add Circle icon) */
-  addStream: (onClick) => ({
-    id: "add-stream",
-    label: "Add Stream",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _AddCircleOutline2.default, {}),
-    onClick
-  }),
-  /** Edit action (Pen / Edit icon) */
-  edit: (onClick) => ({
-    id: "edit",
-    label: "Edit",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Edit2.default, {}),
-    onClick
-  }),
-  /** Copy ID action (Copy icon) */
-  copyId: (onClick) => ({
-    id: "copy-id",
-    label: "Copy ID",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ContentCopy2.default, {}),
-    onClick
-  }),
-  /** Agent Flow Visualization — highlighted action (SmartToy icon) */
-  agentFlowVisualization: (onClick) => ({
-    id: "agent-flow",
-    label: "Agent Flow Visualization",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _SmartToyOutlined2.default, {}),
-    onClick,
-    highlighted: true
-  }),
-  /** View Logs action (Document / Description icon) */
-  viewLogs: (onClick) => ({
-    id: "view-logs",
-    label: "View Logs",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Description2.default, {}),
-    onClick
-  }),
-  /** Horizontal divider between sections */
-  divider: () => ({
-    id: "divider",
-    label: "",
-    type: "divider"
-  }),
-  /** Enable toggle row (switch on left + label) */
-  enable: () => ({
-    id: "enable",
-    label: "Enable",
-    type: "toggle"
-  }),
-  /** Settings action (Settings / Gear icon) */
-  settings: (onClick) => ({
-    id: "settings",
-    label: "Settings",
-    icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Settings2.default, {}),
-    onClick
-  })
-};
-
-// src/components/layout/DeploymentDashboardTree/DeploymentDashboardTree.tsx
-
-
-
-var TREE_SP = {
-  /** Vertical gap between sibling rows (Figma S / sp-8) */
-  rowGap: 8,
-  /** Gap between rail and children column (Figma sp-12) */
-  railGap: 12,
-  /** Rail width (Figma) */
-  railWidth: 4,
-  /** Total horizontal indent per level = railWidth + railGap (Figma M = 16) */
-  indentPerLevel: 4 + 12
-};
-var RAIL_OPACITY = {
-  workspace: 0.5,
-  stream: 0.5,
-  deployment: 0.4,
-  engagement: 0.4,
-  agent: 0.4
-};
-var Rail = _styles.styled.call(void 0, _material.Box, {
-  shouldForwardProp: (p) => p !== "railColor"
-})(({ railColor }) => ({
-  width: TREE_SP.railWidth,
-  borderRadius: TREE_SP.railWidth / 2,
-  backgroundColor: railColor,
-  flexShrink: 0,
-  alignSelf: "stretch"
-}));
-var TreeRow = ({ node, depth, onExpandToggle, onCopyId, renderCard }) => {
-  const hasChildren = Boolean(node.children && node.children.length > 0);
-  const { expanded, toggle } = useControlledExpand(
-    onExpandToggle != null ? node.expanded : void 0,
-    onExpandToggle ? () => onExpandToggle(node.id) : void 0,
-    _nullishCoalesce(node.expanded, () => ( false))
-  );
-  const entityColor = _nullishCoalesce(_chunkZGCN5WCGjs.deploymentEntityColors[node.entityType], () => ( _chunkZGCN5WCGjs.deploymentEntityColors.workspace));
-  const railOpacity = _nullishCoalesce(RAIL_OPACITY[node.entityType], () => ( 0.5));
-  const railColor = _styles.alpha.call(void 0, entityColor, railOpacity);
-  const renderedChildren = hasChildren && expanded ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", gap: `${TREE_SP.railGap}px` }, children: [
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Rail, { railColor, "aria-hidden": true, "data-rail": true }),
-    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-      _material.Box,
-      {
-        role: "group",
-        sx: {
-          flex: 1,
-          minWidth: 0,
-          display: "flex",
-          flexDirection: "column",
-          gap: `${TREE_SP.rowGap}px`
-        },
-        children: node.children.map((child) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-          TreeRow,
-          {
-            node: child,
-            depth: depth + 1,
-            onExpandToggle,
-            onCopyId,
-            renderCard
-          },
-          child.id
-        ))
-      }
-    )
-  ] }) : null;
-  const cardContent = _nullishCoalesce(_optionalChain([renderCard, 'optionalCall', _36 => _36(node)]), () => ( /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    DeploymentDashboardCard,
-    {
-      entityType: node.entityType,
-      title: node.title,
-      id: node.idDisplay,
-      createdAt: node.createdAt,
-      updatedAt: node.updatedAt,
-      capacity: node.capacity,
-      actions: node.actions,
-      statusIndicator: node.statusIndicator,
-      expandable: hasChildren,
-      expanded,
-      onExpandToggle: hasChildren ? toggle : void 0,
-      onCopyId: onCopyId && node.idDisplay ? () => onCopyId(node.id) : void 0,
-      children: renderedChildren
-    }
-  )));
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Box, { role: "treeitem", children: cardContent });
-};
-var DeploymentDashboardTree = ({
-  nodes,
-  onExpandToggle,
-  onCopyId,
-  renderCard
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _material.Box,
-    {
-      role: "tree",
-      sx: {
-        display: "flex",
-        flexDirection: "column",
-        gap: `${TREE_SP.rowGap}px`,
-        p: `${TREE_SP.rowGap}px`
-      },
-      children: nodes.map((node) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-        TreeRow,
-        {
-          node,
-          depth: 0,
-          onExpandToggle,
-          onCopyId,
-          renderCard
-        },
-        node.id
-      ))
-    }
-  );
-};
-
-// src/components/layout/DeploymentDashboardPanel/DeploymentDashboardPanel.tsx
-
-
-
-var PANEL_RADIUS = 12;
-var PANEL_SHADOW = "0px 1px 3px rgba(0, 0, 0, 0.08)";
-var StyledPanel = _styles.styled.call(void 0, (0, _material.Box))({
-  backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.surfaceHigh,
-  border: `1px solid ${_chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside}`,
-  borderRadius: PANEL_RADIUS,
-  boxShadow: PANEL_SHADOW,
-  overflow: "hidden"
-});
-var DeploymentDashboardPanel = ({
-  children,
-  className,
-  padding = 2
-}) => {
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, StyledPanel, { className, sx: { p: padding }, children });
-};
-
-// src/components/layout/WorkflowTopBar/WorkflowTopBar.tsx
-
-
-
-
-
-
-
-
-
-var _Cancel = require('@mui/icons-material/Cancel'); var _Cancel2 = _interopRequireDefault(_Cancel);
-
-
-var WorkflowTopBar = ({
-  title = "Agent visualization flow chart",
-  executionId,
-  executionIdLabel = "Job ID",
-  onExecutionIdChange,
-  onClearExecutionId,
-  submitLabel = "Submit",
-  onSubmit,
-  inspectorLabel = "Inspector",
-  onInspectorToggle,
-  onClose,
-  showInspectorToggle = true,
-  showCloseButton = true,
-  sx,
-  ...boxProps
-}) => {
-  const chrome = _styles.useTheme.call(void 0, ).palette.workflow.chrome;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _material.Box,
-    {
-      sx: [
-        {
-          backgroundColor: "common.white",
-          display: "flex",
-          flexDirection: "column",
-          width: "100%"
-        },
-        ...Array.isArray(sx) ? sx : [sx]
-      ],
-      ...boxProps,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-          _material.Box,
-          {
-            sx: {
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "space-between",
-              gap: 2,
-              px: 2,
-              py: 2,
-              minHeight: 72
-            },
-            children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                _material.Typography,
-                {
-                  variant: "subtitle1",
-                  sx: {
-                    color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary,
-                    fontWeight: 500,
-                    minWidth: 220
-                  },
-                  children: title
-                }
-              ),
-              /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                _material.Box,
-                {
-                  sx: {
-                    display: "flex",
-                    alignItems: "center",
-                    gap: 2,
-                    justifyContent: "flex-end",
-                    flex: 1,
-                    minWidth: 0
-                  },
-                  children: [
-                    /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-                      _material.Box,
-                      {
-                        sx: {
-                          display: "flex",
-                          alignItems: "center",
-                          backgroundColor: chrome.inputBg,
-                          borderRadius: "4px 4px 0 0",
-                          borderBottom: `2px solid ${chrome.inputBorder}`,
-                          px: 2,
-                          minWidth: 320,
-                          maxWidth: 440,
-                          flex: "1 1 auto",
-                          minHeight: 56
-                        },
-                        children: [
-                          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { flex: 1, minWidth: 0 }, children: [
-                            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                              _material.Typography,
-                              {
-                                variant: "caption",
-                                sx: {
-                                  color: chrome.labelText,
-                                  fontSize: 12,
-                                  display: "block"
-                                },
-                                children: executionIdLabel
-                              }
-                            ),
-                            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                              _material.InputBase,
-                              {
-                                value: executionId,
-                                onChange: (event) => _optionalChain([onExecutionIdChange, 'optionalCall', _37 => _37(event.target.value)]),
-                                inputProps: { "aria-label": executionIdLabel },
-                                sx: {
-                                  width: "100%",
-                                  mt: 0.25,
-                                  "& .MuiInputBase-input": {
-                                    p: 0,
-                                    color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary,
-                                    fontSize: 16,
-                                    lineHeight: 1.5
-                                  }
-                                }
-                              }
-                            )
-                          ] }),
-                          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                            _material.IconButton,
-                            {
-                              size: "small",
-                              "aria-label": `Clear ${executionIdLabel.toLowerCase()}`,
-                              onClick: onClearExecutionId,
-                              sx: { color: chrome.iconColor, ml: 1 },
-                              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Cancel2.default, { fontSize: "small" })
-                            }
-                          )
-                        ]
-                      }
-                    ),
-                    /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                      _chunkMNM6HE72js.Button,
-                      {
-                        variant: "primary",
-                        onClick: onSubmit,
-                        sx: {
-                          backgroundColor: chrome.buttonPrimary,
-                          "&:hover": {
-                            backgroundColor: chrome.buttonHover
-                          },
-                          "&:active": {
-                            backgroundColor: chrome.buttonActive
-                          }
-                        },
-                        children: submitLabel
-                      }
-                    ),
-                    showInspectorToggle && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkMNM6HE72js.Button, { variant: "secondary", onClick: onInspectorToggle, children: inspectorLabel }),
-                    showCloseButton && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                      _material.IconButton,
-                      {
-                        "aria-label": "Close workflow chrome",
-                        onClick: onClose,
-                        sx: {
-                          width: 30,
-                          height: 30,
-                          backgroundColor: _material.alpha.call(void 0, chrome.closeBtnBg, 0.28),
-                          color: chrome.iconColor
-                        },
-                        children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, { fontSize: "small" })
-                      }
-                    )
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, { sx: { borderColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside } })
-      ]
-    }
-  );
-};
-
-// src/components/layout/WorkflowSideInspector/WorkflowSideInspector.tsx
-
-
-
-
-
-
-
-
-
-
-var _ContentCopyOutlined = require('@mui/icons-material/ContentCopyOutlined'); var _ContentCopyOutlined2 = _interopRequireDefault(_ContentCopyOutlined);
-
-var INSPECTOR_WIDTH = 320;
-var InfoBlock = ({ label, value, mutedColor }) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "body2", sx: { color: mutedColor }, children: label }),
-  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _material.Typography,
-    {
-      variant: "body2",
-      sx: { color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary, whiteSpace: "pre-wrap" },
-      children: value
-    }
-  )
-] });
-var WorkflowSideInspector = ({
-  open = true,
-  title = "Inspector",
-  nodeTitle = "Player location cubby",
-  nodeDescription = "Retrieving everything we know about this player so far.",
-  nodeType = "cubbies",
-  inputValue = "Get player topic tree",
-  outputValue = "Topic tree with emotional trends and behavior patterns",
-  cubbyId = "ID:S8787",
-  timestamp = "2026-02-11 14:32:10",
-  duration = "120ms",
-  showInput = true,
-  showOutput = true,
-  showTimestamp = true,
-  showDuration = true,
-  actionLabel,
-  onClose,
-  onCopyCubbyId,
-  onAction,
-  sx,
-  ...paperProps
-}) => {
-  const theme = _material.useTheme.call(void 0, );
-  const chrome = theme.palette.workflow.chrome;
-  if (!open) {
-    return null;
-  }
-  const accent = theme.palette.workflow.node[nodeType].accent;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _material.Paper,
-    {
-      elevation: 0,
-      sx: {
-        width: INSPECTOR_WIDTH,
-        minWidth: INSPECTOR_WIDTH,
-        maxWidth: INSPECTOR_WIDTH,
-        p: 3,
-        backgroundColor: theme.palette.common.white,
-        borderRadius: 0,
-        boxShadow: "0px 5px 8px rgba(0, 3, 11, 0.12), 0px 0px 1px rgba(0, 3, 11, 0.24)",
-        display: "flex",
-        flexDirection: "column",
-        gap: 3,
-        ...sx
-      },
-      ...paperProps,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 1.25 }, children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "subtitle1", sx: { color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary }, children: title }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _material.IconButton,
-              {
-                "aria-label": "Close inspector",
-                onClick: onClose,
-                sx: {
-                  border: `1px solid ${_chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside}`,
-                  borderRadius: 2
-                },
-                children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Close2.default, { fontSize: "small" })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, { sx: { borderColor: chrome.divider } })
-        ] }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 3, flex: 1 }, children: [
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _material.Typography,
-              {
-                variant: "subtitle1",
-                sx: { color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary, fontWeight: 500 },
-                children: nodeTitle
-              }
-            ),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "body2", sx: { color: chrome.mutedText }, children: nodeDescription }),
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-              _material.Box,
-              {
-                sx: {
-                  display: "inline-flex",
-                  alignItems: "center",
-                  alignSelf: "flex-start",
-                  gap: 1,
-                  px: 1.25,
-                  py: 0.5,
-                  borderRadius: "999px",
-                  border: `1px solid ${accent}`,
-                  backgroundColor: _material.alpha.call(void 0, accent, 0.12)
-                },
-                children: [
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                    _material.Box,
-                    {
-                      sx: {
-                        width: 10,
-                        height: 10,
-                        borderRadius: "50%",
-                        backgroundColor: accent
-                      }
-                    }
-                  ),
-                  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "caption", sx: { color: accent, fontWeight: 500 }, children: _chunkX7E6GMFLjs.WORKFLOW_NODE_LABELS[nodeType] })
-                ]
-              }
-            )
-          ] }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, { sx: { borderColor: chrome.divider } }),
-          (showInput || showOutput) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
-              showInput && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InfoBlock, { label: "Input", value: inputValue, mutedColor: chrome.mutedText }),
-              showOutput && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InfoBlock, { label: "Output", value: outputValue, mutedColor: chrome.mutedText })
-            ] }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, { sx: { borderColor: chrome.divider } })
-          ] }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 1 }, children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "body2", sx: { color: chrome.mutedText }, children: "Cubby ID" }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _chunkMNM6HE72js.Button,
-              {
-                variant: "secondary",
-                size: "small",
-                startIcon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ContentCopyOutlined2.default, { fontSize: "small" }),
-                onClick: onCopyCubbyId,
-                sx: { alignSelf: "flex-start" },
-                children: cubbyId
-              }
-            )
-          ] }),
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, { sx: { borderColor: chrome.divider } }),
-          (showTimestamp || showDuration) && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", flexDirection: "column", gap: 2 }, children: [
-              showTimestamp && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InfoBlock, { label: "Timestamp", value: timestamp, mutedColor: chrome.mutedText }),
-              showDuration && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, InfoBlock, { label: "Duration", value: duration, mutedColor: chrome.mutedText })
-            ] }),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, { sx: { borderColor: chrome.divider } })
-          ] })
-        ] }),
-        actionLabel && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkMNM6HE72js.Button, { variant: "primary", fullWidth: true, onClick: onAction, children: actionLabel })
-      ]
-    }
-  );
-};
-
-// src/components/layout/WorkflowTimeBar/WorkflowTimeBar.tsx
-
-
-
-
-
-
-
-var _Stop = require('@mui/icons-material/Stop'); var _Stop2 = _interopRequireDefault(_Stop);
-
-
-var _Replay = require('@mui/icons-material/Replay'); var _Replay2 = _interopRequireDefault(_Replay);
-
-
-var SpeedButton = ({ value, selected, onClick }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-  _chunkMNM6HE72js.Button,
-  {
-    variant: selected ? "primary" : "secondary",
-    size: "small",
-    onClick,
-    sx: {
-      minWidth: 48,
-      px: 1.5,
-      py: 0.25,
-      borderRadius: 1,
-      fontSize: 14,
-      lineHeight: 1.4
-    },
-    children: `${value}x`
-  }
-);
-var WorkflowTimeBar = ({
-  elapsedTime = "01m : 12s",
-  progress = 26,
-  currentStep = 1,
-  totalSteps = 16,
-  speedOptions = [0.5, 1, 2, 4],
-  selectedSpeed = 0.5,
-  onStop,
-  onPreviousStep,
-  onNextStep,
-  onSpeedChange,
-  onReset,
-  sx,
-  ...boxProps
-}) => {
-  const chrome = _styles.useTheme.call(void 0, ).palette.workflow.chrome;
-  const boundedProgress = Math.max(0, Math.min(100, progress));
-  const atFirstStep = currentStep <= 1;
-  const atLastStep = currentStep >= totalSteps;
-  return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
-    _material.Box,
-    {
-      sx: [
-        {
-          width: "100%",
-          backgroundColor: "common.white",
-          px: 2,
-          pb: 2,
-          display: "flex",
-          flexDirection: "column",
-          gap: 2
-        },
-        ...Array.isArray(sx) ? sx : [sx]
-      ],
-      ...boxProps,
-      children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Divider, { sx: { borderColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside } }),
-        /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", alignItems: "center", gap: 2 }, children: [
-          /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-            _material.IconButton,
-            {
-              onClick: onStop,
-              "aria-label": "Stop playback",
-              sx: {
-                width: 40,
-                height: 40,
-                border: `1px solid ${_chunkFN5YL4BKjs.deploymentSurfaceTokens.strokeOutside}`,
-                borderRadius: 1,
-                color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary,
-                backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.surfaceHigh
-              },
-              children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Stop2.default, { sx: { fontSize: 16 } })
-            }
-          ),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { flex: 1, minWidth: 220, px: 1 }, children: [
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _material.Typography,
-              {
-                variant: "body2",
-                sx: { color: _chunkFN5YL4BKjs.deploymentSurfaceTokens.textPrimary, mb: 0.5 },
-                children: elapsedTime
-              }
-            ),
-            /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-              _material.LinearProgress,
-              {
-                variant: "determinate",
-                value: boundedProgress,
-                sx: {
-                  height: 3,
-                  borderRadius: 999,
-                  backgroundColor: chrome.progressBg,
-                  "& .MuiLinearProgress-bar": {
-                    backgroundColor: _chunkFN5YL4BKjs.deploymentSurfaceTokens.accentBlue
-                  }
-                }
-              }
-            )
-          ] }),
-          /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", alignItems: "center", gap: 3 }, children: [
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "subtitle1", sx: { fontWeight: 500 }, children: "Steps" }),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                _material.IconButton,
-                {
-                  size: "small",
-                  "aria-label": "Previous step",
-                  onClick: onPreviousStep,
-                  disabled: atFirstStep,
-                  sx: { backgroundColor: chrome.stepBtnBg },
-                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ChevronLeft2.default, { fontSize: "small" })
-                }
-              ),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "subtitle1", sx: { minWidth: 52, textAlign: "center" }, children: `${currentStep} / ${totalSteps}` }),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                _material.IconButton,
-                {
-                  size: "small",
-                  "aria-label": "Next step",
-                  onClick: onNextStep,
-                  disabled: atLastStep,
-                  sx: { backgroundColor: chrome.stepBtnBgHover },
-                  children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _ChevronRight2.default, { fontSize: "small" })
-                }
-              )
-            ] }),
-            /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _material.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.Typography, { variant: "subtitle1", sx: { fontWeight: 500 }, children: "Speed" }),
-              speedOptions.map((option) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-                SpeedButton,
-                {
-                  value: option,
-                  selected: option === selectedSpeed,
-                  onClick: () => _optionalChain([onSpeedChange, 'optionalCall', _38 => _38(option)])
-                },
-                option
-              )),
-              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _material.IconButton, { "aria-label": "Reset playback", onClick: onReset, size: "small", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _Replay2.default, { fontSize: "small" }) })
-            ] })
-          ] })
-        ] })
-      ]
-    }
-  );
-};
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-exports.Logo = Logo; exports.Dialog = Dialog; exports.KpiCard = KpiCard; exports.AgentAvatar = AgentAvatar; exports.NumberedList = NumberedList; exports.resolveDrawerWidth = resolveDrawerWidth; exports.Drawer = Drawer; exports.MetaField = MetaField; exports.ScrollableRow = ScrollableRow; exports.SectionRow = SectionRow; exports.GRADIENT_PALETTE_COUNT = GRADIENT_PALETTE_COUNT; exports.GradientSurface = GradientSurface; exports.DefinitionRow = DefinitionRow; exports.PanelDialog = PanelDialog; exports.SplitDialogContent = SplitDialogContent; exports.ListItemText = _material.ListItemText; exports.ListItemIcon = _material.ListItemIcon; exports.ListItemSecondaryAction = _material.ListItemSecondaryAction; exports.List = List; exports.ListItem = ListItem; exports.Avatar = Avatar; exports.Table = Table; exports.TableHeader = TableHeader; exports.Grid2 = _material.Grid2; exports.Breadcrumbs = Breadcrumbs; exports.Accordion = Accordion; exports.Paper = Paper; exports.Divider = Divider3; exports.Stack = _material.Stack; exports.Box = _material.Box; exports.Container = _material.Container; exports.Toolbar = _material.Toolbar; exports.AppBar = AppBar; exports.Collapse = Collapse; exports.EntityHeader = EntityHeader; exports.DeploymentDashboardCard = DeploymentDashboardCard; exports.DeploymentEntityContextMenu = DeploymentEntityContextMenu; exports.contextMenuItems = contextMenuItems; exports.DeploymentDashboardTree = DeploymentDashboardTree; exports.DeploymentDashboardPanel = DeploymentDashboardPanel; exports.WorkflowTopBar = WorkflowTopBar; exports.WorkflowSideInspector = WorkflowSideInspector; exports.WorkflowTimeBar = WorkflowTimeBar;
-//# sourceMappingURL=chunk-HLH2VWXL.js.map