@omniviewdev/ui 0.1.0

package/dist/domain.js

@@ -0,0 +1,871 @@
+import { jsxs as d, jsx as e } from "react/jsx-runtime";
+import l from "@mui/material/Box";
+import f from "@mui/material/Typography";
+import x from "@mui/material/Chip";
+import { S as O } from "./StatusPill-C1NaiCzd.js";
+import { T as B } from "./Tooltip-BEVuYuZ3.js";
+import { C as R } from "./CopyButton-DPBgL0K8.js";
+import N, { useMemo as y, useState as b, useRef as E, useEffect as L } from "react";
+import { a as $, T as D } from "./TabPanel-DLHbgKpl.js";
+import { C as z } from "./CodeBlock-B1iQO7zU.js";
+import H from "@mui/material/CircularProgress";
+import { S as k } from "./Skeleton-BUYyXUiC.js";
+import P from "@mui/material/IconButton";
+import { LuEyeOff as F, LuEye as V, LuChevronRight as K, LuX as _, LuPlus as J } from "react-icons/lu";
+import { toCssColor as G } from "./types.js";
+import U from "@mui/material/Popover";
+import X from "@mui/material/TextField";
+import Y from "@mui/material/MenuItem";
+import q from "@mui/material/Select";
+const C = {
+  xs: { fontSize: "0.6875rem", chipSize: "small" },
+  sm: { fontSize: "0.75rem", chipSize: "small" },
+  md: { fontSize: "0.8125rem", chipSize: "small" },
+  lg: { fontSize: "0.875rem", chipSize: "medium" },
+  xl: { fontSize: "1rem", chipSize: "medium" }
+};
+function Q({
+  kind: r,
+  name: a,
+  namespace: n,
+  icon: i,
+  onNavigate: o,
+  size: s = "sm",
+  interactive: t = !1
+}) {
+  const u = C[s] || C.sm;
+  return /* @__PURE__ */ d(
+    l,
+    {
+      sx: {
+        display: "inline-flex",
+        alignItems: "center",
+        gap: 0.5,
+        cursor: t ? "pointer" : void 0,
+        "&:hover": t ? { "& .resource-name": { textDecoration: "underline" } } : void 0
+      },
+      onClick: t ? o : void 0,
+      children: [
+        i && /* @__PURE__ */ e(l, { sx: { display: "flex", alignItems: "center", color: "var(--ov-fg-muted)", fontSize: u.fontSize }, children: i }),
+        /* @__PURE__ */ e(
+          x,
+          {
+            label: r,
+            size: u.chipSize,
+            variant: "outlined",
+            sx: {
+              height: "auto",
+              fontSize: "0.625rem",
+              fontWeight: 600,
+              color: "var(--ov-fg-muted)",
+              borderColor: "var(--ov-border-default)",
+              py: 0,
+              "& .MuiChip-label": { px: 0.5, py: 0 }
+            }
+          }
+        ),
+        /* @__PURE__ */ e(
+          f,
+          {
+            className: "resource-name",
+            variant: "body2",
+            sx: {
+              fontSize: u.fontSize,
+              fontWeight: 500,
+              color: t ? "var(--ov-accent-fg)" : "var(--ov-fg-base)"
+            },
+            noWrap: !0,
+            children: a
+          }
+        ),
+        n && /* @__PURE__ */ d(f, { variant: "caption", sx: { color: "var(--ov-fg-faint)", fontSize: u.fontSize }, children: [
+          "(",
+          n,
+          ")"
+        ] })
+      ]
+    }
+  );
+}
+Q.displayName = "ResourceRef";
+const Z = {
+  Running: "healthy",
+  Active: "healthy",
+  Bound: "healthy",
+  Available: "healthy",
+  Ready: "healthy",
+  Succeeded: "healthy",
+  Completed: "healthy",
+  Pending: "pending",
+  ContainerCreating: "pending",
+  Terminating: "warning",
+  Warning: "warning",
+  Degraded: "degraded",
+  CrashLoopBackOff: "error",
+  Failed: "error",
+  Error: "error",
+  ImagePullBackOff: "error",
+  ErrImagePull: "error",
+  OOMKilled: "error",
+  Unknown: "unknown"
+};
+function ee({
+  status: r,
+  conditions: a,
+  size: n = "sm",
+  showTooltip: i = !0
+}) {
+  const o = Z[r] ?? "unknown", s = /* @__PURE__ */ e(O, { status: o, label: r, size: n });
+  return i && a && a.length > 0 ? /* @__PURE__ */ e(
+    B,
+    {
+      variant: "rich",
+      title: /* @__PURE__ */ d(l, { sx: { maxWidth: 360 }, children: [
+        /* @__PURE__ */ e(f, { variant: "subtitle2", sx: { fontWeight: 600, mb: 0.5 }, children: "Conditions" }),
+        a.map((t, u) => /* @__PURE__ */ d(l, { sx: { mb: 0.5 }, children: [
+          /* @__PURE__ */ d(f, { variant: "caption", sx: { fontWeight: 600 }, children: [
+            t.type,
+            ": ",
+            t.status
+          ] }),
+          t.reason && /* @__PURE__ */ e(f, { variant: "caption", sx: { display: "block", color: "text.secondary" }, children: t.reason }),
+          t.message && /* @__PURE__ */ e(f, { variant: "caption", sx: { display: "block", color: "text.secondary", fontSize: "0.65rem" }, children: t.message })
+        ] }, u))
+      ] }),
+      children: /* @__PURE__ */ e(l, { sx: { display: "inline-flex" }, children: s })
+    }
+  ) : s;
+}
+ee.displayName = "ResourceStatus";
+const w = {
+  xs: { labelSize: "0.625rem", valueSize: "0.6875rem", gap: 1 },
+  sm: { labelSize: "0.6875rem", valueSize: "0.75rem", gap: 1.5 },
+  md: { labelSize: "0.75rem", valueSize: "0.8125rem", gap: 2 },
+  lg: { labelSize: "0.8125rem", valueSize: "0.875rem", gap: 2.5 },
+  xl: { labelSize: "0.875rem", valueSize: "1rem", gap: 3 }
+};
+function T({
+  items: r,
+  columns: a = 1,
+  size: n = "md"
+}) {
+  const i = w[n] || w.md;
+  return /* @__PURE__ */ e(
+    l,
+    {
+      sx: {
+        display: "grid",
+        gridTemplateColumns: `repeat(${a}, 1fr)`,
+        gap: i.gap
+      },
+      children: r.map((o, s) => /* @__PURE__ */ d(l, { children: [
+        /* @__PURE__ */ d(l, { sx: { display: "flex", alignItems: "center", gap: 0.5, mb: 0.25 }, children: [
+          o.icon && /* @__PURE__ */ e(l, { sx: { display: "flex", alignItems: "center", color: "var(--ov-fg-muted)" }, children: o.icon }),
+          /* @__PURE__ */ e(
+            f,
+            {
+              variant: "caption",
+              sx: {
+                fontSize: i.labelSize,
+                fontWeight: 600,
+                color: "var(--ov-fg-muted)",
+                textTransform: "uppercase",
+                letterSpacing: "0.04em"
+              },
+              children: o.label
+            }
+          )
+        ] }),
+        /* @__PURE__ */ d(l, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
+          /* @__PURE__ */ e(
+            f,
+            {
+              variant: "body2",
+              sx: { fontSize: i.valueSize, color: "var(--ov-fg-base)", wordBreak: "break-word" },
+              children: o.value
+            }
+          ),
+          o.copyable && /* @__PURE__ */ e(R, { value: String(o.value), size: "xs" })
+        ] })
+      ] }, s))
+    }
+  );
+}
+T.displayName = "DescriptionList";
+function A(r, a = "") {
+  const n = [];
+  for (const [i, o] of Object.entries(r)) {
+    const s = a ? `${a}.${i}` : i;
+    o !== null && typeof o == "object" && !Array.isArray(o) ? n.push(...A(o, s)) : n.push({
+      label: s,
+      value: Array.isArray(o) ? o.join(", ") : String(o ?? "—"),
+      copyable: !0
+    });
+  }
+  return n;
+}
+function re({
+  data: r,
+  title: a,
+  tabs: n,
+  defaultTab: i,
+  sx: o
+}) {
+  const s = y(() => A(r), [r]), t = y(() => {
+    try {
+      return JSON.stringify(r, null, 2);
+    } catch {
+      return "{}";
+    }
+  }, [r]), u = y(
+    () => [
+      {
+        key: "summary",
+        label: "Summary",
+        content: /* @__PURE__ */ e(T, { items: s, columns: 2 })
+      },
+      {
+        key: "yaml",
+        label: "YAML",
+        content: /* @__PURE__ */ e(z, { language: "yaml", lineNumbers: !0, children: t })
+      },
+      {
+        key: "json",
+        label: "JSON",
+        content: /* @__PURE__ */ e(z, { language: "json", lineNumbers: !0, children: t })
+      }
+    ],
+    [s, t]
+  ), m = y(
+    () => [...u, ...n ?? []],
+    [u, n]
+  ), [h, S] = b(i ?? m[0]?.key ?? "summary");
+  return /* @__PURE__ */ d(
+    l,
+    {
+      sx: {
+        border: "1px solid var(--ov-border-default)",
+        borderRadius: "6px",
+        overflow: "hidden",
+        ...typeof o == "object" && !Array.isArray(o) ? o : {}
+      },
+      children: [
+        a && /* @__PURE__ */ e(
+          l,
+          {
+            sx: {
+              px: 2,
+              py: 1,
+              borderBottom: "1px solid var(--ov-border-default)",
+              bgcolor: "var(--ov-bg-surface)"
+            },
+            children: /* @__PURE__ */ e(f, { variant: "subtitle2", sx: { fontWeight: 600, color: "var(--ov-fg-base)" }, children: a })
+          }
+        ),
+        /* @__PURE__ */ e(l, { sx: { px: 2, pt: 1 }, children: /* @__PURE__ */ e(
+          $,
+          {
+            tabs: m.map((v) => ({ key: v.key, label: v.label })),
+            value: h,
+            onChange: S,
+            size: "sm"
+          }
+        ) }),
+        /* @__PURE__ */ e(l, { sx: { p: 2 }, children: m.map((v) => /* @__PURE__ */ e(D, { value: v.key, activeValue: h, children: v.content }, v.key)) })
+      ]
+    }
+  );
+}
+re.displayName = "ObjectInspector";
+function oe(r) {
+  if (!r) return "—";
+  const a = Date.now() - new Date(r).getTime(), n = Math.floor(a / 6e4);
+  if (n < 60) return `${n}m`;
+  const i = Math.floor(n / 60);
+  return i < 24 ? `${i}h` : `${Math.floor(i / 24)}d`;
+}
+function te({ event: r }) {
+  return /* @__PURE__ */ d(
+    l,
+    {
+      sx: {
+        display: "flex",
+        alignItems: "flex-start",
+        gap: 1.5,
+        py: 1,
+        px: 1.5,
+        borderBottom: "1px solid var(--ov-border-muted)",
+        "&:last-child": { borderBottom: "none" }
+      },
+      children: [
+        /* @__PURE__ */ e(
+          x,
+          {
+            label: r.type,
+            size: "small",
+            color: r.type === "Warning" ? "warning" : "info",
+            variant: "outlined",
+            sx: { fontSize: "0.625rem", height: 20, flexShrink: 0, mt: 0.25 }
+          }
+        ),
+        /* @__PURE__ */ d(l, { sx: { flex: 1, minWidth: 0 }, children: [
+          /* @__PURE__ */ e(
+            f,
+            {
+              variant: "body2",
+              sx: { fontWeight: 600, fontSize: "0.8125rem", color: "var(--ov-fg-base)" },
+              children: r.reason
+            }
+          ),
+          /* @__PURE__ */ e(
+            f,
+            {
+              variant: "body2",
+              sx: { fontSize: "0.75rem", color: "var(--ov-fg-default)", mt: 0.25 },
+              children: r.message
+            }
+          ),
+          r.involvedObject && /* @__PURE__ */ d(f, { variant: "caption", sx: { color: "var(--ov-fg-muted)", mt: 0.25, display: "block" }, children: [
+            r.involvedObject.kind,
+            "/",
+            r.involvedObject.name,
+            r.involvedObject.namespace ? ` (${r.involvedObject.namespace})` : ""
+          ] })
+        ] }),
+        /* @__PURE__ */ d(l, { sx: { display: "flex", alignItems: "center", gap: 1, flexShrink: 0 }, children: [
+          r.count != null && r.count > 1 && /* @__PURE__ */ e(
+            x,
+            {
+              label: `×${r.count}`,
+              size: "small",
+              sx: { fontSize: "0.625rem", height: 18 }
+            }
+          ),
+          /* @__PURE__ */ e(f, { variant: "caption", sx: { color: "var(--ov-fg-faint)", whiteSpace: "nowrap" }, children: oe(r.lastTimestamp ?? r.firstTimestamp) })
+        ] })
+      ]
+    }
+  );
+}
+function le({
+  events: r,
+  loading: a = !1
+}) {
+  return a ? /* @__PURE__ */ e(l, { sx: { display: "flex", justifyContent: "center", py: 4 }, children: /* @__PURE__ */ e(H, { size: 24 }) }) : r.length === 0 ? /* @__PURE__ */ e(l, { sx: { textAlign: "center", py: 4, color: "var(--ov-fg-muted)" }, children: /* @__PURE__ */ e(f, { variant: "body2", children: "No events" }) }) : /* @__PURE__ */ e(l, { children: r.map((n, i) => /* @__PURE__ */ e(te, { event: n }, i)) });
+}
+le.displayName = "EventsList";
+const ie = {
+  info: "var(--ov-fg-default)",
+  warn: "var(--ov-warning)",
+  error: "var(--ov-danger)",
+  debug: "var(--ov-fg-faint)"
+}, I = 20;
+function ae({
+  lines: r,
+  follow: a = !1,
+  wrap: n = !1,
+  timestamps: i = !0,
+  maxLines: o,
+  severity: s
+}) {
+  const t = E(null), u = y(() => {
+    let m = r;
+    return s && (m = m.filter((h) => h.severity === s)), o && (m = m.slice(-o)), m;
+  }, [r, s, o]);
+  return L(() => {
+    a && t.current && (t.current.scrollTop = t.current.scrollHeight);
+  }, [u.length, a]), /* @__PURE__ */ e(
+    l,
+    {
+      ref: t,
+      sx: {
+        fontFamily: "var(--ov-font-mono)",
+        fontSize: "0.75rem",
+        lineHeight: `${I}px`,
+        bgcolor: "#0d1117",
+        color: "var(--ov-fg-default)",
+        border: "1px solid var(--ov-border-default)",
+        borderRadius: "6px",
+        overflow: "auto",
+        maxHeight: 400,
+        p: 1,
+        whiteSpace: n ? "pre-wrap" : "pre",
+        wordBreak: n ? "break-all" : void 0
+      },
+      children: u.length === 0 ? /* @__PURE__ */ e(
+        f,
+        {
+          variant: "body2",
+          sx: { color: "var(--ov-fg-muted)", fontFamily: "inherit", fontSize: "inherit", py: 2, textAlign: "center" },
+          children: "No log lines"
+        }
+      ) : u.map((m, h) => /* @__PURE__ */ d(
+        l,
+        {
+          sx: {
+            display: "flex",
+            gap: 1,
+            color: ie[m.severity ?? "info"],
+            minHeight: I,
+            "&:hover": { bgcolor: "rgba(255,255,255,0.03)" }
+          },
+          children: [
+            /* @__PURE__ */ e(
+              l,
+              {
+                sx: {
+                  color: "var(--ov-fg-faint)",
+                  userSelect: "none",
+                  width: 40,
+                  textAlign: "right",
+                  flexShrink: 0
+                },
+                children: h + 1
+              }
+            ),
+            i && m.timestamp && /* @__PURE__ */ e(l, { sx: { color: "var(--ov-fg-muted)", flexShrink: 0 }, children: m.timestamp }),
+            /* @__PURE__ */ e(l, { sx: { flex: 1 }, children: m.content })
+          ]
+        },
+        h
+      ))
+    }
+  );
+}
+ae.displayName = "LogsViewer";
+const ne = {
+  up: "var(--ov-success)",
+  down: "var(--ov-danger)",
+  neutral: "var(--ov-fg-muted)"
+};
+function se({
+  label: r,
+  value: a,
+  unit: n,
+  delta: i,
+  deltaDirection: o = "neutral",
+  sparkline: s,
+  loading: t = !1
+}) {
+  return t ? /* @__PURE__ */ d(
+    l,
+    {
+      sx: {
+        p: 2,
+        border: "1px solid var(--ov-border-default)",
+        borderRadius: "8px",
+        bgcolor: "var(--ov-bg-surface)"
+      },
+      children: [
+        /* @__PURE__ */ e(k, { variant: "text", width: "40%" }),
+        /* @__PURE__ */ e(k, { variant: "text", width: "60%", height: 32 })
+      ]
+    }
+  ) : /* @__PURE__ */ d(
+    l,
+    {
+      sx: {
+        p: 2,
+        border: "1px solid var(--ov-border-default)",
+        borderRadius: "8px",
+        bgcolor: "var(--ov-bg-surface)",
+        display: "flex",
+        flexDirection: "column",
+        gap: 0.5
+      },
+      children: [
+        /* @__PURE__ */ e(
+          f,
+          {
+            variant: "caption",
+            sx: {
+              fontSize: "0.6875rem",
+              fontWeight: 600,
+              color: "var(--ov-fg-muted)",
+              textTransform: "uppercase",
+              letterSpacing: "0.04em"
+            },
+            children: r
+          }
+        ),
+        /* @__PURE__ */ d(l, { sx: { display: "flex", alignItems: "baseline", gap: 0.5 }, children: [
+          /* @__PURE__ */ e(
+            f,
+            {
+              variant: "h5",
+              sx: { fontWeight: 700, color: "var(--ov-fg-base)", lineHeight: 1 },
+              children: a
+            }
+          ),
+          n && /* @__PURE__ */ e(f, { variant: "body2", sx: { color: "var(--ov-fg-muted)", fontSize: "0.75rem" }, children: n })
+        ] }),
+        i != null && /* @__PURE__ */ d(
+          f,
+          {
+            variant: "caption",
+            sx: {
+              color: ne[o],
+              fontWeight: 500,
+              fontSize: "0.75rem"
+            },
+            children: [
+              o === "up" && "↑",
+              o === "down" && "↓",
+              i > 0 ? "+" : "",
+              i,
+              "%"
+            ]
+          }
+        ),
+        s && /* @__PURE__ */ e(l, { sx: { mt: 0.5 }, children: s })
+      ]
+    }
+  );
+}
+se.displayName = "MetricCard";
+function ce({
+  value: r,
+  revealed: a,
+  onReveal: n,
+  copyable: i = !1
+}) {
+  const [o, s] = b(!1), t = a ?? o;
+  return /* @__PURE__ */ d(l, { sx: { display: "inline-flex", alignItems: "center", gap: 0.5 }, children: [
+    /* @__PURE__ */ e(
+      f,
+      {
+        variant: "body2",
+        sx: {
+          fontFamily: "var(--ov-font-mono)",
+          fontSize: "0.8125rem",
+          color: t ? "var(--ov-fg-base)" : "var(--ov-fg-muted)",
+          letterSpacing: t ? void 0 : "0.15em"
+        },
+        children: t ? r : "••••••••"
+      }
+    ),
+    /* @__PURE__ */ e(P, { size: "small", onClick: () => {
+      n ? n() : s((m) => !m);
+    }, sx: { p: 0.25 }, children: t ? /* @__PURE__ */ e(F, { size: 14 }) : /* @__PURE__ */ e(V, { size: 14 }) }),
+    i && /* @__PURE__ */ e(R, { value: r, size: "xs" })
+  ] });
+}
+ce.displayName = "SecretValueMask";
+const de = {
+  xs: "var(--ov-text-xs)",
+  sm: "var(--ov-text-xs)",
+  md: "var(--ov-text-sm)",
+  lg: "var(--ov-text-sm)",
+  xl: "var(--ov-text-sm)"
+};
+function fe({
+  segments: r,
+  onNavigate: a,
+  size: n = "sm",
+  sx: i
+}) {
+  const o = de[n];
+  return /* @__PURE__ */ e(
+    l,
+    {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        gap: 0.5,
+        ...typeof i == "object" && !Array.isArray(i) ? i : {}
+      },
+      children: r.map((s, t) => /* @__PURE__ */ d(N.Fragment, { children: [
+        t > 0 && /* @__PURE__ */ e(K, { size: 12, color: "var(--ov-fg-faint)" }),
+        /* @__PURE__ */ d(
+          l,
+          {
+            onClick: a ? () => a(s, t) : void 0,
+            sx: {
+              display: "inline-flex",
+              alignItems: "center",
+              gap: 0.5,
+              px: 0.5,
+              py: 0.125,
+              borderRadius: "3px",
+              cursor: a ? "pointer" : "default",
+              ...a && {
+                "&:hover": { bgcolor: "var(--ov-state-hover)" }
+              }
+            },
+            children: [
+              s.icon && /* @__PURE__ */ e(l, { sx: { display: "flex", color: "var(--ov-fg-muted)", flexShrink: 0 }, children: s.icon }),
+              /* @__PURE__ */ e(
+                f,
+                {
+                  sx: {
+                    fontSize: o,
+                    color: t === r.length - 1 ? "var(--ov-fg-base)" : "var(--ov-fg-muted)",
+                    fontWeight: t === r.length - 1 ? 500 : 400,
+                    whiteSpace: "nowrap"
+                  },
+                  children: s.label
+                }
+              )
+            ]
+          }
+        )
+      ] }, t))
+    }
+  );
+}
+fe.displayName = "ResourceBreadcrumb";
+const me = {
+  xs: 8,
+  sm: 10,
+  md: 12,
+  lg: 14,
+  xl: 16
+};
+function ue({
+  events: r,
+  size: a = "sm",
+  sx: n
+}) {
+  const i = me[a];
+  return /* @__PURE__ */ e(
+    l,
+    {
+      sx: {
+        display: "flex",
+        flexDirection: "column",
+        ...typeof n == "object" && !Array.isArray(n) ? n : {}
+      },
+      children: r.map((o, s) => {
+        const t = o.color ? G(o.color) : "var(--ov-fg-muted)", u = s === r.length - 1;
+        return /* @__PURE__ */ d(l, { sx: { display: "flex", gap: 1.5 }, children: [
+          /* @__PURE__ */ d(
+            l,
+            {
+              sx: {
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                width: i + 8,
+                flexShrink: 0
+              },
+              children: [
+                o.icon ? /* @__PURE__ */ e(l, { sx: { color: t, display: "flex", mt: 0.25 }, children: o.icon }) : /* @__PURE__ */ e(
+                  l,
+                  {
+                    sx: {
+                      width: i,
+                      height: i,
+                      borderRadius: "50%",
+                      bgcolor: t,
+                      mt: 0.5,
+                      flexShrink: 0
+                    }
+                  }
+                ),
+                !u && /* @__PURE__ */ e(
+                  l,
+                  {
+                    sx: {
+                      width: 2,
+                      flex: 1,
+                      bgcolor: "var(--ov-border-muted)",
+                      minHeight: 16
+                    }
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ d(l, { sx: { flex: 1, pb: u ? 0 : 2, minWidth: 0 }, children: [
+            /* @__PURE__ */ d(l, { sx: { display: "flex", justifyContent: "space-between", alignItems: "baseline", mb: 0.25 }, children: [
+              /* @__PURE__ */ e(
+                f,
+                {
+                  sx: {
+                    fontSize: a === "xs" ? "var(--ov-text-xs)" : "var(--ov-text-sm)",
+                    fontWeight: 500,
+                    color: "var(--ov-fg-base)"
+                  },
+                  children: o.title
+                }
+              ),
+              /* @__PURE__ */ e(
+                f,
+                {
+                  sx: {
+                    fontSize: "var(--ov-text-xs)",
+                    color: "var(--ov-fg-faint)",
+                    whiteSpace: "nowrap",
+                    ml: 1,
+                    flexShrink: 0
+                  },
+                  children: typeof o.timestamp == "string" ? o.timestamp : o.timestamp.toLocaleTimeString()
+                }
+              )
+            ] }),
+            o.description && /* @__PURE__ */ e(
+              f,
+              {
+                sx: {
+                  fontSize: "var(--ov-text-xs)",
+                  color: "var(--ov-fg-muted)",
+                  lineHeight: 1.5
+                },
+                children: o.description
+              }
+            )
+          ] })
+        ] }, o.id);
+      })
+    }
+  );
+}
+ue.displayName = "Timeline";
+function pe({
+  filters: r,
+  activeFilters: a,
+  onChange: n,
+  sx: i
+}) {
+  const [o, s] = b(null), [t, u] = b(null), [m, h] = b(""), S = (c, p) => {
+    s(c.currentTarget), u(p);
+    const g = a.find((M) => M.key === p.key);
+    h(g?.value ?? "");
+  }, v = () => {
+    if (!t) return;
+    const c = t.key, p = a.filter((g) => g.key !== c);
+    m.trim() && p.push({ key: c, value: m.trim() }), n(p), s(null), u(null);
+  }, W = (c) => {
+    n(a.filter((p) => p.key !== c));
+  }, j = new Set(a.map((c) => c.key));
+  return /* @__PURE__ */ d(
+    l,
+    {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        gap: 0.75,
+        flexWrap: "wrap",
+        ...typeof i == "object" && !Array.isArray(i) ? i : {}
+      },
+      children: [
+        a.map((c) => {
+          const p = r.find((g) => g.key === c.key);
+          return /* @__PURE__ */ e(
+            x,
+            {
+              label: `${p?.label ?? c.key}: ${c.value}`,
+              size: "small",
+              onDelete: () => W(c.key),
+              deleteIcon: /* @__PURE__ */ e(_, { size: 12 }),
+              onClick: (g) => p && S(g, p),
+              sx: {
+                fontSize: "var(--ov-text-xs)",
+                bgcolor: "var(--ov-accent-subtle)",
+                color: "var(--ov-accent-fg)",
+                "& .MuiChip-deleteIcon": { color: "var(--ov-accent-fg)" }
+              }
+            },
+            c.key
+          );
+        }),
+        r.filter((c) => !j.has(c.key)).map((c) => /* @__PURE__ */ e(
+          x,
+          {
+            label: c.label,
+            size: "small",
+            icon: /* @__PURE__ */ e(J, { size: 10 }),
+            onClick: (p) => S(p, c),
+            variant: "outlined",
+            sx: {
+              fontSize: "var(--ov-text-xs)",
+              borderColor: "var(--ov-border-default)",
+              color: "var(--ov-fg-muted)",
+              cursor: "pointer"
+            }
+          },
+          c.key
+        )),
+        /* @__PURE__ */ e(
+          U,
+          {
+            open: !!o,
+            anchorEl: o,
+            onClose: () => {
+              s(null), u(null);
+            },
+            anchorOrigin: { vertical: "bottom", horizontal: "left" },
+            transformOrigin: { vertical: "top", horizontal: "left" },
+            slotProps: {
+              paper: {
+                sx: {
+                  p: 2,
+                  minWidth: 220,
+                  bgcolor: "var(--ov-bg-surface)",
+                  border: "1px solid var(--ov-border-default)"
+                }
+              }
+            },
+            children: t && /* @__PURE__ */ d(l, { children: [
+              /* @__PURE__ */ e(f, { sx: { fontSize: "var(--ov-text-xs)", fontWeight: 600, color: "var(--ov-fg-muted)", mb: 1 }, children: t.label }),
+              t.type === "text" && /* @__PURE__ */ e(
+                X,
+                {
+                  autoFocus: !0,
+                  size: "small",
+                  fullWidth: !0,
+                  value: m,
+                  onChange: (c) => h(c.target.value),
+                  onKeyDown: (c) => {
+                    c.key === "Enter" && v();
+                  },
+                  placeholder: t.placeholder,
+                  sx: { mb: 1 }
+                }
+              ),
+              t.type === "select" && t.options && /* @__PURE__ */ e(
+                q,
+                {
+                  size: "small",
+                  fullWidth: !0,
+                  value: m,
+                  onChange: (c) => h(c.target.value),
+                  sx: { mb: 1 },
+                  children: t.options.map((c) => /* @__PURE__ */ e(Y, { value: c, children: c }, c))
+                }
+              ),
+              /* @__PURE__ */ e(l, { sx: { display: "flex", justifyContent: "flex-end", gap: 0.5 }, children: /* @__PURE__ */ e(
+                x,
+                {
+                  label: "Apply",
+                  size: "small",
+                  onClick: v,
+                  sx: {
+                    cursor: "pointer",
+                    bgcolor: "var(--ov-accent)",
+                    color: "#fff",
+                    fontSize: "var(--ov-text-xs)"
+                  }
+                }
+              ) })
+            ] })
+          }
+        )
+      ]
+    }
+  );
+}
+pe.displayName = "FilterBar";
+export {
+  T as DescriptionList,
+  le as EventsList,
+  pe as FilterBar,
+  ae as LogsViewer,
+  se as MetricCard,
+  re as ObjectInspector,
+  fe as ResourceBreadcrumb,
+  Q as ResourceRef,
+  ee as ResourceStatus,
+  ce as SecretValueMask,
+  ue as Timeline
+};