import { jsx as r, jsxs as s, Fragment as T } from "react/jsx-runtime";
import h from "@mui/material/Stack";
import v from "@mui/material/Card";
import y from "@mui/material/Chip";
import E from "@mui/material/Avatar";
import I from "@mui/material/Divider";
import { default as lt } from "@mui/material/Divider";
import u from "@mui/material/Typography";
import d from "@mui/material/Box";
import { I as C } from "./Icon-CuO9W7cA.js";
import L, { useState as w, useCallback as ne, useRef as F, useEffect as P } from "react";
import S from "@mui/material/Grid";
import R from "@mui/material/Accordion";
import $ from "@mui/material/AccordionDetails";
import O from "@mui/material/AccordionSummary";
import ie from "@mui/icons-material/ExpandMore";
import { LuChevronRight as ae, LuChevronDown as le, LuFile as se, LuBraces as N, LuFileCode as b, LuFileImage as ce, LuFileText as de } from "react-icons/lu";
import { toMuiSize as fe, toMuiColor as H, toBorderRadius as pe, toCssColor as G } from "./types.js";
import { T as ue } from "./Text-By4P3in5.js";
import he from "@mui/material/LinearProgress";
import { default as ct } from "@mui/material/LinearProgress";
import _ from "@mui/material/CircularProgress";
import { default as ft } from "@mui/material/CircularProgress";
import me from "@mui/material/List";
import xe from "@mui/material/ListSubheader";
import { default as ut } from "@mui/material/ListSubheader";
import z from "@mui/material/ListItem";
import k from "@mui/material/ListItemButton";
import M from "@mui/material/ListItemIcon";
import B from "@mui/material/ListItemText";
import { C as ge } from "./CopyButton-DPBgL0K8.js";
import ve from "@mui/material/Tooltip";
import be from "@mui/material/TextField";
import { H as ye } from "./HotkeyHint-6SOi-MaU.js";
import Se from "@mui/material/Badge";
import { SiDocker as Ce, SiRust as we, SiPython as Ie, SiJavascript as ze, SiTypescript as Me, SiGo as Ee } from "react-icons/si";
import Le from "@mui/icons-material/Search";
import Ae from "@mui/material/ButtonBase";
import { S as Ne } from "./StatusDot-CncykBAY.js";
const ke = ({
  title: e,
  titleDecorator: o,
  icon: t,
  children: i,
  variant: n,
  emphasis: a,
  noPadding: l = !1,
  onClick: f,
  sx: p
}) => {
  const m = n ?? (a ? {
    outline: "outlined",
    solid: "elevation",
    soft: "elevation",
    ghost: "outlined"
  }[a] ?? "outlined" : "outlined");
  return e ? /* @__PURE__ */ s(v, { variant: m, onClick: f, sx: { p: 0, gap: 0, ...p }, children: [
    /* @__PURE__ */ s(
      h,
      {
        direction: "row",
        spacing: 1,
        sx: { px: 1.5, py: 1 },
        alignItems: "center",
        justifyContent: "space-between",
        children: [
          /* @__PURE__ */ s(h, { direction: "row", alignItems: "center", spacing: 1, children: [
            t && (typeof t == "string" ? t.startsWith("http") ? /* @__PURE__ */ r(
              E,
              {
                src: t,
                sx: { height: 16, width: 16, borderRadius: "4px" }
              }
            ) : /* @__PURE__ */ r(C, { name: t, size: 14 }) : t),
            /* @__PURE__ */ r(u, { variant: "subtitle2", children: e })
          ] }),
          o && (typeof o == "string" || typeof o == "number" ? /* @__PURE__ */ r(
            y,
            {
              sx: { borderRadius: "4px" },
              size: "small",
              color: "primary",
              variant: "outlined",
              label: o
            }
          ) : o)
        ]
      }
    ),
    /* @__PURE__ */ r(I, {}),
    /* @__PURE__ */ r(d, { sx: { p: l ? 0 : 1.5 }, children: i })
  ] }) : /* @__PURE__ */ r(v, { variant: m, onClick: f, sx: { p: l ? 0 : 1.5, gap: 0, ...p }, children: i });
};
ke.displayName = "Card";
const Be = (e) => {
  switch (e) {
    case "sm":
      return 12;
    case "md":
      return 14;
    case "lg":
      return 16;
    default:
      return 14;
  }
}, We = (e) => {
  switch (e) {
    case "sm":
      return 0.5;
    case "md":
      return 1;
    case "lg":
      return 2;
    default:
      return 1;
  }
}, je = (e) => {
  switch (e) {
    case "sm":
      return 12;
    case "md":
      return 14;
    case "lg":
      return 16;
    default:
      return 14;
  }
}, De = ({
  title: e,
  titleSize: o = "md",
  icon: t,
  data: i,
  endAdornment: n,
  showUndefined: a = !1
}) => /* @__PURE__ */ s(
  v,
  {
    variant: "outlined",
    sx: {
      p: 0,
      gap: 0,
      bgcolor: "var(--ov-bg-surface-raised)"
    },
    children: [
      e && /* @__PURE__ */ s(
        d,
        {
          sx: {
            px: 1.5,
            py: 1,
            display: "flex",
            flexDirection: "row",
            justifyContent: "space-between",
            alignItems: "center",
            bgcolor: "var(--ov-bg-surface)",
            borderBottom: "1px solid var(--ov-border-default)"
          },
          children: [
            /* @__PURE__ */ s(
              h,
              {
                direction: "row",
                spacing: We(o),
                alignItems: "center",
                children: [
                  t && (typeof t == "string" ? t.startsWith("http") ? /* @__PURE__ */ r(
                    E,
                    {
                      src: t,
                      sx: { height: 16, width: 16, borderRadius: "4px" }
                    }
                  ) : /* @__PURE__ */ r(C, { name: t, size: je(o) }) : t),
                  /* @__PURE__ */ r(
                    u,
                    {
                      sx: { fontSize: Be(o) },
                      variant: "subtitle2",
                      children: e
                    }
                  )
                ]
              }
            ),
            n
          ]
        }
      ),
      /* @__PURE__ */ r(d, { sx: { px: 1.5, py: 1 }, children: /* @__PURE__ */ r(S, { container: !0, spacing: 1, children: i.map((l) => {
        if (l.value || a)
          return /* @__PURE__ */ s(L.Fragment, { children: [
            /* @__PURE__ */ r(S, { size: l.ratio?.[0] ?? 5, children: /* @__PURE__ */ s(h, { direction: "row", spacing: 1, alignItems: "center", children: [
              l.icon && (typeof l.icon == "string" ? l.icon.startsWith("http") ? /* @__PURE__ */ r(
                E,
                {
                  src: l.icon,
                  sx: { width: 24, height: 24 }
                }
              ) : /* @__PURE__ */ r(C, { name: l.icon, size: 14 }) : l.icon),
              /* @__PURE__ */ r(u, { variant: "caption", children: l.key })
            ] }) }),
            /* @__PURE__ */ r(S, { size: l.ratio?.[1] ?? 7, children: /* @__PURE__ */ s(
              h,
              {
                direction: "row",
                spacing: 1,
                alignItems: "center",
                justifyContent: "space-between",
                children: [
                  /* @__PURE__ */ r(
                    u,
                    {
                      variant: "caption",
                      noWrap: !0,
                      sx: { color: "var(--ov-fg-default)" },
                      children: l.used ? `${l.used} / ${l.value}` : l.value
                    }
                  ),
                  l.endAdornment
                ]
              }
            ) })
          ] }, l.key);
      }) }) })
    ]
  }
);
De.displayName = "DetailsCard";
const Te = ({ title: e, kvs: o, defaultExpanded: t }) => /* @__PURE__ */ s(
  R,
  {
    disabled: !Object.keys(o).length,
    defaultExpanded: t,
    disableGutters: !0,
    sx: { "&:before": { display: "none" } },
    children: [
      /* @__PURE__ */ r(O, { expandIcon: /* @__PURE__ */ r(ie, {}), children: /* @__PURE__ */ s(h, { direction: "row", gap: 1, alignItems: "center", children: [
        /* @__PURE__ */ r(u, { variant: "subtitle2", children: e }),
        /* @__PURE__ */ r(
          y,
          {
            size: "small",
            variant: "outlined",
            color: "primary",
            label: Object.keys(o).length,
            sx: { borderRadius: "4px" }
          }
        )
      ] }) }),
      /* @__PURE__ */ r($, { children: /* @__PURE__ */ r(S, { container: !0, spacing: 0.25, children: Object.entries(o).map(([i, n]) => /* @__PURE__ */ s(L.Fragment, { children: [
        /* @__PURE__ */ r(S, { size: 6, children: /* @__PURE__ */ r(u, { variant: "caption", sx: { fontWeight: 400 }, children: i }) }),
        /* @__PURE__ */ r(S, { size: 6, children: /* @__PURE__ */ r(u, { variant: "caption", sx: { fontWeight: 600 }, children: n }) })
      ] }, i)) }) })
    ]
  }
);
Te.displayName = "KVCard";
function Fe(e) {
  switch (e) {
    case "outline":
    case "ghost":
      return "outlined";
    default:
      return "filled";
  }
}
function Pe(e, o) {
  if (e === "soft") {
    const t = G(o);
    return {
      bgcolor: `color-mix(in srgb, ${t} 18%, transparent)`,
      color: t,
      border: "1px solid",
      borderColor: `color-mix(in srgb, ${t} 30%, transparent)`,
      fontWeight: 600,
      "& .MuiChip-label": { color: t },
      "& .MuiChip-icon": { color: t },
      "& .MuiChip-deleteIcon": { color: t, opacity: 0.7, "&:hover": { opacity: 1 } }
    };
  }
  if (e === "ghost")
    return { borderColor: "transparent", bgcolor: "transparent" };
}
function Re(e) {
  if (e === "xs")
    return { height: 20, fontSize: "0.6875rem", "& .MuiChip-label": { px: "6px" }, "& .MuiChip-icon": { fontSize: "0.75rem" } };
  if (e === "xl")
    return { height: 40, fontSize: "1rem", "& .MuiChip-label": { px: "16px" } };
}
const $e = {
  soft: "soft",
  outlined: "outline",
  solid: "solid",
  plain: "ghost",
  filled: "solid"
};
function K({
  label: e,
  children: o,
  color: t = "neutral",
  emphasis: i,
  variant: n,
  size: a = "sm",
  shape: l,
  textTransform: f,
  icon: p,
  startAdornment: c,
  endAdornment: m,
  deletable: g = !1,
  onDelete: x,
  onClick: Y,
  disabled: q = !1,
  sx: J
}) {
  const A = i ?? (n ? $e[n] ?? "soft" : "soft"), Q = e ?? o, X = p ?? c, Z = A === "soft" ? "filled" : Fe(A), ee = Pe(A, t), re = Re(a), te = l ? { borderRadius: pe(l) } : void 0, oe = f ? { "& .MuiChip-label": { textTransform: f } } : void 0;
  return /* @__PURE__ */ r(
    y,
    {
      label: Q,
      color: H(t),
      variant: Z,
      size: fe(a),
      icon: X,
      onDelete: g || x ? x ?? void 0 : void 0,
      onClick: Y,
      disabled: q,
      sx: {
        ...ee,
        ...re,
        ...te,
        ...oe,
        ...J
      }
    }
  );
}
K.displayName = "Chip";
const Oe = {
  sm: { minHeight: 28, headerPy: "4px", headerPx: 1, fontSize: 12, iconSize: 14, chevronSize: 14 },
  md: { minHeight: 32, headerPy: "6px", headerPx: 1.25, fontSize: 13, iconSize: 16, chevronSize: 16 },
  lg: { minHeight: 38, headerPy: "10px", headerPx: 1.5, fontSize: 14, iconSize: 18, chevronSize: 18 }
};
function V(e) {
  switch (e) {
    case "bordered":
      return {
        borderRadius: "6px",
        border: "1px solid var(--ov-border-default)"
      };
    case "plain":
      return {};
    case "flush":
      return {};
  }
}
function He(e, o) {
  return o === 0 ? !1 : e !== "flush";
}
function U({
  section: e,
  size: o,
  monospace: t,
  expanded: i,
  onExpandedChange: n
}) {
  const a = Oe[o], l = i !== void 0 || e.expanded !== void 0, f = i ?? e.expanded, p = (g, x) => {
    n?.(x), e.onExpandedChange?.(x);
  }, c = {
    disableGutters: !0,
    disabled: e.disabled,
    onChange: p,
    sx: {
      boxShadow: "none",
      background: "transparent !important",
      "&:before": { display: "none" },
      "&.Mui-expanded": { margin: 0 }
    }
  };
  l ? c.expanded = f : c.defaultExpanded = e.defaultExpanded;
  const m = () => e.icon ? typeof e.icon == "string" ? /* @__PURE__ */ r(d, { sx: { display: "flex", alignItems: "center", mr: 0.75, color: "var(--ov-fg-muted)" }, children: /* @__PURE__ */ r(C, { name: e.icon, size: a.iconSize }) }) : /* @__PURE__ */ r(d, { sx: { display: "flex", alignItems: "center", mr: 0.75, color: "var(--ov-fg-muted)" }, children: e.icon }) : null;
  return /* @__PURE__ */ s(R, { ...c, children: [
    /* @__PURE__ */ s(
      O,
      {
        expandIcon: null,
        sx: {
          minHeight: a.minHeight,
          py: a.headerPy,
          px: a.headerPx,
          "&:hover": { bgcolor: "var(--ov-state-hover)" },
          "&.Mui-expanded": { minHeight: a.minHeight },
          "& .MuiAccordionSummary-content": {
            margin: 0,
            display: "flex",
            alignItems: "center",
            gap: 0,
            "&.Mui-expanded": { margin: 0 }
          }
        },
        children: [
          /* @__PURE__ */ r(Ge, { size: a.chevronSize }),
          m(),
          /* @__PURE__ */ r(
            ue,
            {
              size: o === "lg" ? "md" : o,
              weight: "semibold",
              inline: !0,
              sx: {
                color: "var(--ov-fg-base)",
                ...t && { fontFamily: "var(--ov-font-mono)", fontSize: a.fontSize },
                ...!t && { fontSize: a.fontSize },
                lineHeight: 1
              },
              children: e.title
            }
          ),
          e.count !== void 0 && /* @__PURE__ */ r(d, { sx: { ml: 0.75 }, children: /* @__PURE__ */ r(
            K,
            {
              size: "xs",
              color: "neutral",
              emphasis: "soft",
              label: e.count
            }
          ) }),
          /* @__PURE__ */ r(d, { sx: { flex: 1 } }),
          e.endDecorator && /* @__PURE__ */ r(
            d,
            {
              sx: { display: "flex", alignItems: "center", ml: 1 },
              onClick: (g) => g.stopPropagation(),
              children: e.endDecorator
            }
          )
        ]
      }
    ),
    /* @__PURE__ */ r($, { sx: { p: 0 }, children: e.children })
  ] });
}
function Ge({ size: e }) {
  return /* @__PURE__ */ s(
    d,
    {
      sx: {
        display: "flex",
        alignItems: "center",
        mr: 0.75,
        color: "var(--ov-fg-muted)"
      },
      children: [
        /* @__PURE__ */ r(
          d,
          {
            component: "span",
            sx: {
              display: "flex",
              ".MuiAccordionSummary-root.Mui-expanded &": { display: "none" }
            },
            children: /* @__PURE__ */ r(ae, { size: e })
          }
        ),
        /* @__PURE__ */ r(
          d,
          {
            component: "span",
            sx: {
              display: "none",
              ".MuiAccordionSummary-root.Mui-expanded &": { display: "flex" }
            },
            children: /* @__PURE__ */ r(le, { size: e })
          }
        )
      ]
    }
  );
}
function _e() {
  return /* @__PURE__ */ r(d, { sx: { height: "1px", bgcolor: "var(--ov-border-default)" } });
}
function Ke({
  sections: e,
  variant: o = "bordered",
  size: t = "md",
  monospace: i = !1,
  exclusive: n = !1,
  sx: a
}) {
  const [l, f] = w(() => {
    if (!n) return null;
    const c = e.findIndex((m) => m.defaultExpanded || m.expanded);
    return c >= 0 ? c : null;
  }), p = ne(
    (c) => (m) => {
      n && f(m ? c : null);
    },
    [n]
  );
  return e.length === 0 ? /* @__PURE__ */ r(T, {}) : /* @__PURE__ */ r(d, { sx: { flexGrow: 0, ...V(o), ...typeof a == "object" && !Array.isArray(a) ? a : {} }, children: e.map((c, m) => {
    const g = c.key ?? (typeof c.title == "string" ? c.title : String(m)), x = n ? {
      expanded: l === m,
      onExpandedChange: p(m)
    } : {};
    return /* @__PURE__ */ s(L.Fragment, { children: [
      He(o, m) && /* @__PURE__ */ r(_e, {}),
      /* @__PURE__ */ r(
        U,
        {
          section: c,
          size: t,
          monospace: i,
          ...x
        }
      )
    ] }, g);
  }) });
}
Ke.displayName = "ExpandableSections";
function Ve({
  variant: e = "bordered",
  size: o = "md",
  monospace: t = !1,
  ...i
}) {
  return /* @__PURE__ */ r(d, { sx: { ...V(e) }, children: /* @__PURE__ */ r(
    U,
    {
      section: i,
      size: o,
      monospace: t
    }
  ) });
}
Ve.displayName = "ExpandableSection";
const Ue = {
  NONE: "",
  BYTES: "B",
  KB: "KB",
  MB: "MB",
  GB: "GB",
  PERCENTAGE: "%",
  MILLISECONDS: "ms",
  SECONDS: "s",
  COUNT: "",
  OPS_PER_SEC: "ops/s",
  BYTES_PER_SEC: "B/s",
  MILLICORES: "m",
  CORES: "cores"
};
function W(e, o) {
  const t = Ue[o] ?? o;
  return o === "BYTES" || o === "bytes" ? e >= 1024 * 1024 * 1024 ? `${(e / (1024 * 1024 * 1024)).toFixed(1)} GB` : e >= 1024 * 1024 ? `${(e / (1024 * 1024)).toFixed(1)} MB` : e >= 1024 ? `${(e / 1024).toFixed(1)} KB` : `${e} B` : o === "MILLICORES" || o === "millicores" ? e >= 1e3 ? `${(e / 1e3).toFixed(2)} cores` : `${Math.round(e)}${t}` : Number.isInteger(e) ? `${e}${t ? ` ${t}` : ""}` : `${e.toFixed(2)}${t ? ` ${t}` : ""}`;
}
const Ye = ({ metric: e }) => {
  const o = e.capacity != null && e.capacity > 0, t = o ? Math.min(e.value / e.capacity * 100, 100) : null, i = () => t == null ? "primary" : t >= 90 ? "error" : t >= 70 ? "warning" : "primary";
  return /* @__PURE__ */ s(d, { sx: { minWidth: 0, flex: 1 }, children: [
    /* @__PURE__ */ s(h, { direction: "row", spacing: 0.5, alignItems: "center", sx: { mb: 0.25 }, children: [
      e.icon && /* @__PURE__ */ r(C, { name: e.icon, style: { fontSize: 14, opacity: 0.7 } }),
      /* @__PURE__ */ r(
        u,
        {
          variant: "caption",
          sx: { fontWeight: 500, opacity: 0.8, whiteSpace: "nowrap", overflow: "hidden", textOverflow: "ellipsis" },
          children: e.name
        }
      )
    ] }),
    /* @__PURE__ */ r(u, { variant: "body2", sx: { fontWeight: 600, fontVariantNumeric: "tabular-nums" }, children: W(e.value, e.unit) }),
    o && /* @__PURE__ */ s(d, { sx: { mt: 0.5 }, children: [
      /* @__PURE__ */ r(
        he,
        {
          variant: "determinate",
          value: t,
          color: i(),
          sx: { height: 4, borderRadius: 2 }
        }
      ),
      /* @__PURE__ */ s(u, { variant: "caption", sx: { opacity: 0.6, fontSize: "0.65rem" }, children: [
        t.toFixed(0),
        "% of ",
        W(e.capacity, e.unit)
      ] })
    ] })
  ] });
}, nt = ({
  providers: e,
  isLoading: o = !1,
  error: t,
  sx: i
}) => o && e.length === 0 ? /* @__PURE__ */ r(d, { sx: { display: "flex", justifyContent: "center", py: 2, ...i }, children: /* @__PURE__ */ r(_, { size: 20 }) }) : t ? /* @__PURE__ */ r(d, { sx: { px: 1, py: 0.5, ...i }, children: /* @__PURE__ */ r(u, { variant: "caption", color: "error", children: t }) }) : e.length === 0 ? null : /* @__PURE__ */ r(h, { spacing: 1.5, sx: i, children: e.map((n) => /* @__PURE__ */ s(d, { children: [
  e.length > 1 && /* @__PURE__ */ s(h, { direction: "row", spacing: 0.5, alignItems: "center", sx: { mb: 0.75 }, children: [
    n.providerIcon && /* @__PURE__ */ r(C, { name: n.providerIcon, style: { fontSize: 14 } }),
    /* @__PURE__ */ r(
      y,
      {
        label: n.providerName,
        size: "small",
        variant: "outlined",
        sx: { height: 20, fontSize: "0.7rem" }
      }
    )
  ] }),
  /* @__PURE__ */ r(
    h,
    {
      direction: "row",
      spacing: 1.5,
      sx: {
        flexWrap: "wrap",
        "& > *": { minWidth: 100 }
      },
      children: n.metrics.map((a) => /* @__PURE__ */ r(Ye, { metric: a }, a.metricID))
    }
  )
] }, n.providerID)) }), qe = {
  xs: !0,
  sm: !0,
  md: !1,
  lg: !1,
  xl: !1
};
function Je({
  children: e,
  size: o = "md",
  subheader: t,
  dense: i,
  disablePadding: n = !1,
  sx: a
}) {
  return /* @__PURE__ */ r(
    me,
    {
      dense: i ?? qe[o],
      disablePadding: n,
      subheader: t ? /* @__PURE__ */ r(xe, { children: t }) : void 0,
      sx: a,
      children: e
    }
  );
}
Je.displayName = "List";
function Qe({ sx: e }) {
  return /* @__PURE__ */ r(I, { component: "li", sx: e });
}
Qe.displayName = "ListDivider";
function Xe({
  children: e,
  primary: o,
  secondary: t,
  icon: i,
  action: n,
  selected: a = !1,
  disabled: l = !1,
  onClick: f,
  sx: p
}) {
  return e && !o ? f ? /* @__PURE__ */ r(z, { disablePadding: !0, secondaryAction: n, sx: p, children: /* @__PURE__ */ s(
    k,
    {
      selected: a,
      disabled: l,
      onClick: f,
      children: [
        i && /* @__PURE__ */ r(M, { children: i }),
        e
      ]
    }
  ) }) : /* @__PURE__ */ s(z, { secondaryAction: n, sx: p, children: [
    i && /* @__PURE__ */ r(M, { children: i }),
    e
  ] }) : f ? /* @__PURE__ */ r(z, { disablePadding: !0, secondaryAction: n, sx: p, children: /* @__PURE__ */ s(
    k,
    {
      selected: a,
      disabled: l,
      onClick: f,
      children: [
        i && /* @__PURE__ */ r(M, { children: i }),
        /* @__PURE__ */ r(B, { primary: o, secondary: t }),
        e
      ]
    }
  ) }) : /* @__PURE__ */ s(z, { secondaryAction: n, sx: p, children: [
    i && /* @__PURE__ */ r(M, { children: i }),
    /* @__PURE__ */ r(B, { primary: o, secondary: t }),
    e
  ] });
}
Xe.displayName = "ListItem";
function Ze({
  ratio: e = "1/1",
  children: o,
  sx: t
}) {
  return /* @__PURE__ */ r(
    d,
    {
      sx: {
        position: "relative",
        width: "100%",
        aspectRatio: typeof e == "number" ? String(e) : e,
        overflow: "hidden",
        "& > *": {
          position: "absolute",
          top: 0,
          left: 0,
          width: "100%",
          height: "100%",
          objectFit: "cover"
        },
        ...t
      },
      children: o
    }
  );
}
Ze.displayName = "AspectRatio";
function er({
  value: e,
  truncate: o = !0,
  maxWidth: t,
  sx: i,
  variant: n = "mono"
}) {
  const [a, l] = w(!1);
  return /* @__PURE__ */ s(
    d,
    {
      onMouseEnter: () => l(!0),
      onMouseLeave: () => l(!1),
      sx: {
        display: "inline-flex",
        alignItems: "center",
        gap: 0.5,
        maxWidth: t,
        minWidth: 0,
        ...i
      },
      children: [
        n === "mono" ? /* @__PURE__ */ r(
          u,
          {
            variant: "body2",
            sx: {
              fontSize: "0.8125rem",
              color: "var(--ov-fg-default)",
              fontFamily: "var(--ov-font-mono)",
              ...o && {
                overflow: "hidden",
                textOverflow: "ellipsis",
                whiteSpace: "nowrap"
              }
            },
            children: e
          }
        ) : /* @__PURE__ */ r("span", { style: {
          ...o ? { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } : {}
        }, children: e }),
        /* @__PURE__ */ r(
          "span",
          {
            onClick: (f) => f.stopPropagation(),
            style: {
              display: "inline-flex",
              alignItems: "center",
              visibility: a ? "visible" : "hidden",
              flexShrink: 0
            },
            children: /* @__PURE__ */ r(ge, { value: e, size: "xs" })
          }
        )
      ]
    }
  );
}
er.displayName = "ClipboardText";
function rr({
  children: e,
  maxWidth: o,
  copyOnClick: t = !1,
  sx: i
}) {
  const n = F(null), [a, l] = w(!1);
  P(() => {
    const c = n.current;
    c && l(c.scrollWidth > c.clientWidth);
  }, [e]);
  const p = /* @__PURE__ */ r(
    d,
    {
      ref: n,
      onClick: () => {
        t && navigator.clipboard.writeText(e).catch(() => {
        });
      },
      sx: {
        overflow: "hidden",
        textOverflow: "ellipsis",
        whiteSpace: "nowrap",
        maxWidth: o,
        fontSize: "0.8125rem",
        color: "var(--ov-fg-default)",
        cursor: t ? "pointer" : void 0,
        ...i
      },
      children: e
    }
  );
  return a ? /* @__PURE__ */ r(ve, { title: e, arrow: !0, children: p }) : p;
}
rr.displayName = "OverflowText";
const j = {
  xs: "0.6875rem",
  sm: "0.8125rem",
  md: "0.875rem",
  lg: "1rem",
  xl: "1.125rem"
};
function tr({
  value: e,
  onSave: o,
  placeholder: t = "Click to edit",
  size: i = "sm",
  sx: n
}) {
  const [a, l] = w(!1), [f, p] = w(e), c = F(null);
  P(() => {
    a && c.current && (c.current.focus(), c.current.select());
  }, [a]);
  const m = () => {
    l(!1), f !== e && o(f);
  }, g = () => {
    l(!1), p(e);
  };
  return a ? /* @__PURE__ */ r(d, { sx: n, children: /* @__PURE__ */ r(
    be,
    {
      inputRef: c,
      value: f,
      onChange: (x) => p(x.target.value),
      onBlur: m,
      onKeyDown: (x) => {
        x.key === "Enter" && m(), x.key === "Escape" && g();
      },
      variant: "outlined",
      size: "small",
      fullWidth: !0,
      slotProps: {
        input: {
          sx: { fontSize: j[i], py: 0.25, px: 0.5 }
        }
      }
    }
  ) }) : /* @__PURE__ */ r(
    d,
    {
      onClick: () => {
        p(e), l(!0);
      },
      sx: {
        cursor: "pointer",
        borderRadius: "4px",
        px: 0.5,
        py: 0.25,
        "&:hover": { bgcolor: "var(--ov-state-hover)" },
        ...n
      },
      children: /* @__PURE__ */ r(
        u,
        {
          variant: "body2",
          sx: {
            fontSize: j[i],
            color: e ? "var(--ov-fg-default)" : "var(--ov-fg-faint)"
          },
          children: e || t
        }
      )
    }
  );
}
tr.displayName = "InlineEdit";
function or({
  count: e,
  dot: o = !1,
  color: t = "primary",
  max: i = 99,
  invisible: n,
  anchorOrigin: a,
  children: l,
  sx: f
}) {
  return /* @__PURE__ */ r(
    Se,
    {
      badgeContent: o ? void 0 : e,
      variant: o ? "dot" : "standard",
      color: H(t),
      max: i,
      invisible: n,
      anchorOrigin: a,
      sx: f,
      children: l
    }
  );
}
or.displayName = "Badge";
const nr = {
  xs: 24,
  sm: 32,
  md: 40,
  lg: 48,
  xl: 64
}, ir = {
  xs: "0.625rem",
  sm: "0.75rem",
  md: "0.875rem",
  lg: "1rem",
  xl: "1.25rem"
}, D = [
  "#e57373",
  "#f06292",
  "#ba68c8",
  "#9575cd",
  "#7986cb",
  "#64b5f6",
  "#4fc3f7",
  "#4dd0e1",
  "#4db6ac",
  "#81c784",
  "#aed581",
  "#dce775",
  "#fff176",
  "#ffd54f",
  "#ffb74d",
  "#ff8a65"
];
function ar(e) {
  let o = 0;
  for (let t = 0; t < e.length; t++)
    o = e.charCodeAt(t) + ((o << 5) - o), o |= 0;
  return Math.abs(o);
}
function lr(e) {
  const o = e.trim().split(/\s+/);
  return o.length >= 2 ? (o[0][0] + o[1][0]).toUpperCase() : e.slice(0, 2).toUpperCase();
}
function sr(e) {
  return D[ar(e) % D.length];
}
const cr = {
  xs: 4,
  sm: 6,
  md: 8,
  lg: 10,
  xl: 12
};
function dr({
  src: e,
  name: o,
  size: t = "md",
  variant: i = "rounded",
  children: n,
  sx: a
}) {
  const l = nr[t], f = o ? sr(o) : void 0, p = o ? lr(o) : void 0, c = n ?? (e ? void 0 : p);
  return /* @__PURE__ */ r(
    E,
    {
      src: e,
      alt: o,
      variant: i === "circular" ? "circular" : "rounded",
      sx: {
        width: l,
        height: l,
        fontSize: ir[t],
        fontWeight: 600,
        bgcolor: e ? void 0 : f,
        ...i === "rounded" ? { borderRadius: `${cr[t]}px` } : {},
        ...a
      },
      children: c
    }
  );
}
dr.displayName = "Avatar";
const fr = {
  xs: 12,
  sm: 14,
  md: 16,
  lg: 20,
  xl: 24
};
function pr(e, o) {
  if (o.toLowerCase().startsWith("dockerfile"))
    return { icon: Ce, color: "var(--ov-info-default)" };
  switch (e) {
    case ".go":
      return { icon: Ee, color: "#00ADD8" };
    case ".ts":
    case ".tsx":
      return { icon: Me, color: "#3178C6" };
    case ".js":
    case ".jsx":
    case ".mjs":
    case ".cjs":
      return { icon: ze, color: "#F7DF1E" };
    case ".py":
      return { icon: Ie, color: "#3776AB" };
    case ".rs":
      return { icon: we, color: "#DEA584" };
    case ".yaml":
    case ".yml":
      return { icon: b, color: "var(--ov-info-default)" };
    case ".json":
      return { icon: N, color: "#F5C518" };
    case ".md":
    case ".mdx":
    case ".txt":
    case ".log":
      return { icon: de, color: "var(--ov-fg-muted)" };
    case ".html":
    case ".htm":
    case ".xml":
    case ".svg":
      return { icon: b, color: "#E44D26" };
    case ".css":
    case ".scss":
    case ".less":
      return { icon: b, color: "#264DE4" };
    case ".png":
    case ".jpg":
    case ".jpeg":
    case ".gif":
    case ".webp":
    case ".ico":
      return { icon: ce, color: "var(--ov-success-default)" };
    case ".toml":
    case ".ini":
    case ".env":
    case ".cfg":
      return { icon: b, color: "var(--ov-fg-muted)" };
    case ".sh":
    case ".bash":
    case ".zsh":
      return { icon: b, color: "var(--ov-success-default)" };
    case ".proto":
      return { icon: b, color: "var(--ov-warning-default)" };
    case ".sql":
      return { icon: b, color: "#336791" };
    case ".jsonc":
      return { icon: N, color: "#F5C518" };
    default:
      return { icon: se, color: "var(--ov-fg-muted)" };
  }
}
function ur({
  filename: e,
  size: o = "sm",
  sx: t
}) {
  const i = fr[o], n = e.lastIndexOf("."), a = n >= 0 ? e.slice(n).toLowerCase() : "", l = e.split("/").pop() ?? e, { icon: f, color: p } = pr(a, l);
  return /* @__PURE__ */ r(
    d,
    {
      component: "span",
      sx: {
        display: "inline-flex",
        color: p,
        flexShrink: 0,
        ...typeof t == "object" && !Array.isArray(t) ? t : {}
      },
      children: /* @__PURE__ */ r(f, { size: i })
    }
  );
}
ur.displayName = "FileIcon";
function hr({
  items: e,
  maxVisible: o = 3,
  renderItem: t,
  sx: i
}) {
  const [n, a] = w(!1), l = n ? e : e.slice(0, o), f = e.length - o;
  return /* @__PURE__ */ s(
    d,
    {
      sx: {
        display: "flex",
        alignItems: "center",
        gap: 0.5,
        flexWrap: "wrap",
        ...typeof i == "object" && !Array.isArray(i) ? i : {}
      },
      children: [
        l.map(
          (p, c) => t ? t(p, c) : /* @__PURE__ */ r(d, { component: "span", children: p }, c)
        ),
        !n && f > 0 && /* @__PURE__ */ r(
          y,
          {
            label: `+${f} more`,
            size: "small",
            onClick: () => a(!0),
            sx: {
              fontSize: "var(--ov-text-xs)",
              height: 20,
              cursor: "pointer",
              bgcolor: "var(--ov-bg-surface-inset)",
              color: "var(--ov-fg-muted)",
              "&:hover": { bgcolor: "var(--ov-state-hover)" }
            }
          }
        ),
        n && f > 0 && /* @__PURE__ */ r(
          y,
          {
            label: "Show less",
            size: "small",
            onClick: () => a(!1),
            sx: {
              fontSize: "var(--ov-text-xs)",
              height: 20,
              cursor: "pointer",
              bgcolor: "var(--ov-bg-surface-inset)",
              color: "var(--ov-fg-muted)",
              "&:hover": { bgcolor: "var(--ov-state-hover)" }
            }
          }
        )
      ]
    }
  );
}
hr.displayName = "TruncatedList";
function mr({
  query: e,
  suggestions: o,
  onSuggestionClick: t,
  sx: i
}) {
  return /* @__PURE__ */ s(
    d,
    {
      sx: {
        display: "flex",
        flexDirection: "column",
        alignItems: "center",
        py: 4,
        gap: 1.5,
        ...typeof i == "object" && !Array.isArray(i) ? i : {}
      },
      children: [
        /* @__PURE__ */ r(Le, { sx: { fontSize: 32, color: "var(--ov-fg-faint)" } }),
        /* @__PURE__ */ s(u, { sx: { fontSize: "var(--ov-text-sm)", color: "var(--ov-fg-muted)" }, children: [
          "No results for “",
          e,
          "”"
        ] }),
        o && o.length > 0 && /* @__PURE__ */ s(d, { sx: { display: "flex", gap: 0.75, flexWrap: "wrap", justifyContent: "center", mt: 0.5 }, children: [
          /* @__PURE__ */ r(u, { sx: { fontSize: "var(--ov-text-xs)", color: "var(--ov-fg-faint)", width: "100%", textAlign: "center" }, children: "Try:" }),
          o.map((n) => /* @__PURE__ */ r(
            y,
            {
              label: n,
              size: "small",
              onClick: t ? () => t(n) : void 0,
              sx: {
                fontSize: "var(--ov-text-xs)",
                cursor: t ? "pointer" : "default",
                bgcolor: "var(--ov-bg-surface-inset)",
                color: "var(--ov-fg-muted)"
              }
            },
            n
          ))
        ] })
      ]
    }
  );
}
mr.displayName = "EmptySearch";
function xr({
  active: e,
  children: o,
  label: t,
  blur: i = !1,
  sx: n
}) {
  return /* @__PURE__ */ s(
    d,
    {
      sx: {
        position: "relative",
        ...typeof n == "object" && !Array.isArray(n) ? n : {}
      },
      children: [
        o,
        e && /* @__PURE__ */ s(
          d,
          {
            sx: {
              position: "absolute",
              inset: 0,
              display: "flex",
              flexDirection: "column",
              alignItems: "center",
              justifyContent: "center",
              gap: 1.5,
              bgcolor: "rgba(0, 0, 0, 0.3)",
              zIndex: 10,
              borderRadius: "inherit",
              ...i && { backdropFilter: "blur(3px)" }
            },
            children: [
              /* @__PURE__ */ r(_, { size: 28, sx: { color: "var(--ov-accent-fg)" } }),
              t && /* @__PURE__ */ r(u, { sx: { fontSize: "var(--ov-text-sm)", color: "#fff", fontWeight: 500 }, children: t })
            ]
          }
        )
      ]
    }
  );
}
xr.displayName = "LoadingOverlay";
function gr({ shortcut: e }) {
  const o = e.split("+").map((t) => t.trim());
  return /* @__PURE__ */ r(ye, { keys: o });
}
gr.displayName = "Kbd";
function vr({
  value: e,
  label: o,
  description: t,
  icon: i,
  trend: n,
  color: a = "primary",
  sx: l
}) {
  const f = n ? n.value > 0 ? "up" : n.value < 0 ? "down" : "flat" : void 0, p = f === "up" ? "var(--ov-success-default)" : f === "down" ? "var(--ov-danger-default)" : "var(--ov-fg-muted)", c = f === "up" ? "↑" : f === "down" ? "↓" : "→";
  return /* @__PURE__ */ s(
    v,
    {
      variant: "outlined",
      sx: {
        p: 2,
        display: "flex",
        flexDirection: "column",
        gap: 0.5,
        ...l
      },
      children: [
        /* @__PURE__ */ s(h, { direction: "row", justifyContent: "space-between", alignItems: "flex-start", children: [
          /* @__PURE__ */ s(d, { children: [
            /* @__PURE__ */ r(
              u,
              {
                sx: {
                  fontSize: "var(--ov-text-2xl)",
                  fontWeight: 700,
                  lineHeight: 1.2,
                  color: `var(${G(a)})`
                },
                children: e
              }
            ),
            /* @__PURE__ */ r(
              u,
              {
                variant: "body2",
                sx: { color: "var(--ov-fg-muted)", fontWeight: 500, mt: 0.25 },
                children: o
              }
            )
          ] }),
          i && /* @__PURE__ */ r(d, { sx: { color: "var(--ov-fg-faint)", fontSize: 24, display: "flex" }, children: i })
        ] }),
        (n || t) && /* @__PURE__ */ s(h, { direction: "row", alignItems: "center", spacing: 1, sx: { mt: 0.5 }, children: [
          n && /* @__PURE__ */ s(
            u,
            {
              variant: "caption",
              sx: { color: p, fontWeight: 600 },
              children: [
                c,
                " ",
                Math.abs(n.value),
                "%",
                n.label ? ` ${n.label}` : ""
              ]
            }
          ),
          t && /* @__PURE__ */ r(u, { variant: "caption", sx: { color: "var(--ov-fg-faint)" }, children: t })
        ] })
      ]
    }
  );
}
vr.displayName = "StatCard";
function br({
  media: e,
  mediaHeight: o = 140,
  title: t,
  description: i,
  meta: n,
  actions: a,
  onClick: l,
  sx: f
}) {
  return /* @__PURE__ */ s(
    v,
    {
      variant: "outlined",
      onClick: l,
      sx: {
        p: 0,
        cursor: l ? "pointer" : void 0,
        transition: "border-color 0.15s, box-shadow 0.15s",
        "&:hover": l ? {
          borderColor: "var(--ov-border-focus)",
          boxShadow: "0 2px 8px rgba(0,0,0,0.08)"
        } : void 0,
        ...f
      },
      children: [
        typeof e == "string" ? /* @__PURE__ */ r(
          d,
          {
            sx: {
              height: o,
              width: "100%",
              backgroundImage: `url(${e})`,
              backgroundSize: "cover",
              backgroundPosition: "center",
              borderBottom: "1px solid var(--ov-border-default)"
            }
          }
        ) : /* @__PURE__ */ r(
          d,
          {
            sx: {
              height: o,
              width: "100%",
              display: "flex",
              alignItems: "center",
              justifyContent: "center",
              bgcolor: "var(--ov-bg-surface)",
              borderBottom: "1px solid var(--ov-border-default)",
              color: "var(--ov-fg-faint)",
              fontSize: 40
            },
            children: e
          }
        ),
        /* @__PURE__ */ s(d, { sx: { px: 1.5, py: 1.25 }, children: [
          /* @__PURE__ */ r(u, { variant: "subtitle2", sx: { mb: 0.25 }, children: t }),
          i && /* @__PURE__ */ r(
            u,
            {
              variant: "body2",
              sx: {
                color: "var(--ov-fg-muted)",
                display: "-webkit-box",
                WebkitLineClamp: 2,
                WebkitBoxOrient: "vertical",
                overflow: "hidden"
              },
              children: i
            }
          ),
          n && /* @__PURE__ */ r(
            u,
            {
              variant: "caption",
              component: "div",
              sx: { color: "var(--ov-fg-faint)", mt: 0.5 },
              children: n
            }
          )
        ] }),
        a && /* @__PURE__ */ r(
          h,
          {
            direction: "row",
            spacing: 1,
            sx: {
              px: 1.5,
              py: 1,
              borderTop: "1px solid var(--ov-border-default)"
            },
            children: a
          }
        )
      ]
    }
  );
}
br.displayName = "MediaCard";
function yr({
  icon: e,
  title: o,
  description: t,
  primaryAction: i,
  secondaryAction: n,
  direction: a = "vertical",
  sx: l
}) {
  const f = a === "horizontal";
  return /* @__PURE__ */ s(
    v,
    {
      variant: "outlined",
      sx: {
        p: 2,
        display: "flex",
        flexDirection: f ? "row" : "column",
        alignItems: f ? "center" : "flex-start",
        gap: f ? 2 : 1,
        ...l
      },
      children: [
        e && /* @__PURE__ */ r(
          d,
          {
            sx: {
              fontSize: 32,
              color: "var(--ov-fg-muted)",
              display: "flex",
              flexShrink: 0
            },
            children: e
          }
        ),
        /* @__PURE__ */ s(d, { sx: { flex: 1, minWidth: 0 }, children: [
          /* @__PURE__ */ r(u, { variant: "subtitle2", sx: { mb: 0.25 }, children: o }),
          t && /* @__PURE__ */ r(u, { variant: "body2", sx: { color: "var(--ov-fg-muted)" }, children: t })
        ] }),
        (i || n) && /* @__PURE__ */ s(
          h,
          {
            direction: "row",
            spacing: 1,
            sx: {
              mt: f ? 0 : 1,
              flexShrink: 0
            },
            children: [
              i,
              n
            ]
          }
        )
      ]
    }
  );
}
yr.displayName = "ActionCard";
function Sr({
  title: e,
  icon: o,
  headerAction: t,
  items: i,
  maxVisible: n = 5,
  emptyMessage: a = "No items",
  sx: l
}) {
  const p = n * 40;
  return /* @__PURE__ */ s(v, { variant: "outlined", sx: { p: 0, ...l }, children: [
    /* @__PURE__ */ s(
      h,
      {
        direction: "row",
        spacing: 1,
        sx: { px: 1.5, py: 1 },
        alignItems: "center",
        justifyContent: "space-between",
        children: [
          /* @__PURE__ */ s(h, { direction: "row", alignItems: "center", spacing: 1, children: [
            o && /* @__PURE__ */ r(d, { sx: { display: "flex", color: "var(--ov-fg-muted)", fontSize: 16 }, children: o }),
            /* @__PURE__ */ r(u, { variant: "subtitle2", children: e })
          ] }),
          t
        ]
      }
    ),
    /* @__PURE__ */ r(I, {}),
    i.length === 0 ? /* @__PURE__ */ r(d, { sx: { px: 1.5, py: 2, textAlign: "center" }, children: /* @__PURE__ */ r(u, { variant: "body2", sx: { color: "var(--ov-fg-faint)" }, children: a }) }) : /* @__PURE__ */ r(d, { sx: { maxHeight: p, overflowY: "auto" }, children: i.map((c, m) => {
      const g = /* @__PURE__ */ s(
        h,
        {
          direction: "row",
          alignItems: "center",
          spacing: 1,
          sx: {
            px: 1.5,
            height: 40,
            width: "100%",
            borderBottom: m < i.length - 1 ? "1px solid var(--ov-border-default)" : void 0,
            "&:hover": c.onClick ? { bgcolor: "var(--ov-bg-surface-hover)" } : void 0,
            transition: "background-color 0.1s"
          },
          children: [
            c.icon && /* @__PURE__ */ r(d, { sx: { display: "flex", color: "var(--ov-fg-muted)", fontSize: 16, flexShrink: 0 }, children: c.icon }),
            /* @__PURE__ */ s(d, { sx: { flex: 1, minWidth: 0 }, children: [
              /* @__PURE__ */ r(u, { variant: "body2", noWrap: !0, children: c.label }),
              c.secondary && /* @__PURE__ */ r(u, { variant: "caption", noWrap: !0, sx: { color: "var(--ov-fg-faint)" }, children: c.secondary })
            ] }),
            c.trailing && /* @__PURE__ */ r(d, { sx: { flexShrink: 0, display: "flex", alignItems: "center" }, children: c.trailing })
          ]
        }
      );
      return c.onClick ? /* @__PURE__ */ r(
        Ae,
        {
          onClick: c.onClick,
          sx: { display: "block", width: "100%", textAlign: "left" },
          children: g
        },
        c.key
      ) : /* @__PURE__ */ r(L.Fragment, { children: g }, c.key);
    }) })
  ] });
}
Sr.displayName = "ListCard";
function Cr({
  title: e,
  icon: o,
  status: t,
  statusLabel: i,
  description: n,
  metadata: a,
  headerAction: l,
  sx: f
}) {
  return /* @__PURE__ */ s(v, { variant: "outlined", sx: { p: 0, ...f }, children: [
    /* @__PURE__ */ s(
      h,
      {
        direction: "row",
        spacing: 1,
        sx: { px: 1.5, py: 1 },
        alignItems: "center",
        justifyContent: "space-between",
        children: [
          /* @__PURE__ */ s(h, { direction: "row", alignItems: "center", spacing: 1, children: [
            o && /* @__PURE__ */ r(d, { sx: { display: "flex", color: "var(--ov-fg-muted)", fontSize: 16 }, children: o }),
            /* @__PURE__ */ r(u, { variant: "subtitle2", children: e })
          ] }),
          l
        ]
      }
    ),
    /* @__PURE__ */ r(I, {}),
    /* @__PURE__ */ s(d, { sx: { px: 1.5, py: 1.25 }, children: [
      /* @__PURE__ */ s(h, { direction: "row", alignItems: "center", spacing: 1, children: [
        /* @__PURE__ */ r(Ne, { status: t, pulse: t === "pending" }),
        /* @__PURE__ */ r(
          u,
          {
            variant: "body2",
            sx: { fontWeight: 600, textTransform: "capitalize" },
            children: i ?? t
          }
        )
      ] }),
      n && /* @__PURE__ */ r(
        u,
        {
          variant: "body2",
          sx: { color: "var(--ov-fg-muted)", mt: 0.5 },
          children: n
        }
      )
    ] }),
    a && a.length > 0 && /* @__PURE__ */ s(T, { children: [
      /* @__PURE__ */ r(I, {}),
      /* @__PURE__ */ r(d, { sx: { px: 1.5, py: 1 }, children: a.map((p, c) => /* @__PURE__ */ s(
        h,
        {
          direction: "row",
          justifyContent: "space-between",
          alignItems: "center",
          sx: {
            py: 0.5,
            borderBottom: c < a.length - 1 ? "1px solid var(--ov-border-default)" : void 0
          },
          children: [
            /* @__PURE__ */ r(u, { variant: "caption", sx: { color: "var(--ov-fg-muted)" }, children: p.label }),
            /* @__PURE__ */ r(u, { variant: "caption", sx: { color: "var(--ov-fg-default)", fontWeight: 500 }, children: p.value })
          ]
        },
        p.label
      )) })
    ] })
  ] });
}
Cr.displayName = "StatusCard";
export {
  yr as ActionCard,
  Ze as AspectRatio,
  dr as Avatar,
  or as Badge,
  ke as Card,
  K as Chip,
  ft as CircularProgress,
  er as ClipboardText,
  De as DetailsCard,
  lt as Divider,
  mr as EmptySearch,
  Ve as ExpandableSection,
  Ke as ExpandableSections,
  ur as FileIcon,
  ye as HotkeyHint,
  C as Icon,
  tr as InlineEdit,
  Te as KVCard,
  gr as Kbd,
  ct as LinearProgress,
  Je as List,
  Sr as ListCard,
  Qe as ListDivider,
  Xe as ListItem,
  ut as ListSubheader,
  xr as LoadingOverlay,
  br as MediaCard,
  nt as MetricsSection,
  rr as OverflowText,
  vr as StatCard,
  Cr as StatusCard,
  hr as TruncatedList
};
