@flanksource/clicky-ui 0.2.5 → 0.2.7

package/dist/data/TimeseriesGauge.cjs

@@ -0,0 +1,144 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const reactQuery = require("@tanstack/react-query");
+const react = require("react");
+const utils = require("../lib/utils.cjs");
+const format = require("../lib/format.cjs");
+const Modal = require("../overlay/Modal.cjs");
+const Icon = require("./Icon.cjs");
+const TimeseriesPanel = require("./TimeseriesPanel.cjs");
+const UiFullscreen = require("../icons/components/UiFullscreen.cjs");
+const defaultFetcher = async (url) => {
+  const res = await fetch(url);
+  if (!res.ok) throw new Error(`metrics request failed: ${res.status}`);
+  return res.json();
+};
+const GAUGE_RADIUS = 40;
+const GAUGE_ARC = Math.PI * GAUGE_RADIUS;
+const GAUGE_PATH = `M 10 50 A ${GAUGE_RADIUS} ${GAUGE_RADIUS} 0 0 1 90 50`;
+function toneClass(pct, [warn, danger]) {
+  if (pct >= danger) return "text-red-500";
+  if (pct >= warn) return "text-amber-500";
+  return "text-emerald-500";
+}
+function latestValue(resp) {
+  var _a;
+  const points = resp == null ? void 0 : resp.points;
+  if (!points || points.length === 0) return void 0;
+  return (_a = points[points.length - 1]) == null ? void 0 : _a.value;
+}
+function GaugeIcon({ icon }) {
+  if (typeof icon === "string") {
+    return /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { name: icon, width: 14, height: 14, className: "text-muted-foreground" });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon, width: 14, height: 14, className: "text-muted-foreground" });
+}
+function TimeseriesGauge({
+  baseUrl = "",
+  value,
+  max,
+  title,
+  icon,
+  unit,
+  range = "1h",
+  refreshMs = 5e3,
+  expandable = true,
+  thresholds = [75, 90],
+  centerDisplay = "value",
+  fetcher = defaultFetcher,
+  className
+}) {
+  var _a, _b;
+  const [expanded, setExpanded] = react.useState(false);
+  const maxIsSeries = typeof max === "object";
+  const maxSeries = maxIsSeries ? max : void 0;
+  const ids = react.useMemo(() => {
+    const list = [value.id];
+    if (maxSeries) list.push(maxSeries.id);
+    return list;
+  }, [value.id, maxSeries]);
+  const results = reactQuery.useQueries({
+    queries: ids.map((id) => {
+      const u = new URL(baseUrl + id, window.location.origin);
+      if (range) u.searchParams.set("since", range);
+      const requestUrl = u.pathname + u.search;
+      return {
+        queryKey: ["timeseries", requestUrl],
+        queryFn: () => fetcher(requestUrl),
+        refetchInterval: refreshMs > 0 ? refreshMs : false,
+        staleTime: 0,
+        retry: 0
+      };
+    })
+  });
+  const rawValue = latestValue((_a = results[0]) == null ? void 0 : _a.data);
+  const hasValue = rawValue !== void 0;
+  const usage = value.transform ? value.transform(rawValue ?? 0) : rawValue ?? 0;
+  let limit;
+  if (typeof max === "number") {
+    limit = max;
+  } else if (maxSeries) {
+    const rawMax = latestValue((_b = results[1]) == null ? void 0 : _b.data);
+    limit = rawMax === void 0 ? void 0 : maxSeries.transform ? maxSeries.transform(rawMax) : rawMax;
+  }
+  const bounded = hasValue && limit !== void 0 && limit > 0;
+  const pct = bounded ? Math.min(100, Math.round(usage / limit * 100)) : 0;
+  const tone = toneClass(pct, thresholds);
+  const chartSeries = react.useMemo(() => {
+    const s = [{ id: value.id, label: "value", ...value.transform ? { transform: value.transform } : {} }];
+    if (maxSeries) s.push({ id: maxSeries.id, label: "max", ...maxSeries.transform ? { transform: maxSeries.transform } : {} });
+    return s;
+  }, [value.id, value.transform, maxSeries]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("flex flex-col items-center gap-1", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative h-10 w-20", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 100 50", className: "h-full w-full overflow-visible", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: GAUGE_PATH, fill: "none", stroke: "currentColor", strokeWidth: 9, strokeLinecap: "round", className: "text-muted" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: GAUGE_PATH,
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: 9,
+            strokeLinecap: "round",
+            className: tone,
+            strokeDasharray: GAUGE_ARC,
+            strokeDashoffset: GAUGE_ARC * (1 - pct / 100)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-x-0 bottom-0 text-center text-sm font-semibold text-foreground", children: centerDisplay === "percent" ? bounded ? `${pct}%` : hasValue ? "n/a" : "—" : hasValue ? format.formatUnit(usage, unit) : "—" }),
+      expandable && /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": "Expand chart",
+          onClick: () => setExpanded(true),
+          className: "absolute right-0 top-0 text-muted-foreground hover:text-foreground",
+          children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiFullscreen.UiFullscreen, width: 12, height: 12 })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-xs text-muted-foreground", children: [
+      icon ? /* @__PURE__ */ jsxRuntime.jsx(GaugeIcon, { icon }) : null,
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: title })
+    ] }),
+    expandable && /* @__PURE__ */ jsxRuntime.jsx(Modal.Modal, { open: expanded, onClose: () => setExpanded(false), title, size: "xl", children: /* @__PURE__ */ jsxRuntime.jsx(
+      TimeseriesPanel.TimeseriesPanel,
+      {
+        title,
+        ...icon ? { icon } : {},
+        ...unit ? { unit } : {},
+        baseUrl,
+        series: chartSeries,
+        range,
+        refreshMs,
+        expandable: false,
+        fetcher
+      }
+    ) })
+  ] });
+}
+exports.TimeseriesGauge = TimeseriesGauge;
+//# sourceMappingURL=TimeseriesGauge.cjs.map

package/dist/data/TimeseriesGauge.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeseriesGauge.cjs","sources":["../../src/data/TimeseriesGauge.tsx"],"sourcesContent":["import { useQueries } from \"@tanstack/react-query\";\nimport { useMemo, useState } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { formatUnit } from \"../lib/format\";\nimport { Modal } from \"../overlay/Modal\";\nimport { UiFullscreen } from \"../icons\";\nimport { Icon, type StaticIconComponent } from \"./Icon\";\nimport {\n  TimeseriesPanel,\n  type TimeseriesResponse,\n  type TimeseriesSeries,\n} from \"./TimeseriesPanel\";\n\n/** A metric series whose latest value drives the gauge fill or its maximum. */\nexport interface GaugeSeries {\n  /** Metric id appended to the gauge's baseUrl, e.g. \"k8s.statefulset.cycle.cpu.usage\". */\n  id: string;\n  /** Maps the latest value before display (e.g. unit scaling). Identity when omitted. */\n  transform?: (value: number) => number;\n}\n\nexport interface TimeseriesGaugeProps {\n  /** Common prefix; the value/max requests are `baseUrl + id`. */\n  baseUrl?: string;\n  /** The metric whose latest value fills the gauge. */\n  value: GaugeSeries;\n  /**\n   * The gauge maximum. Either a metric series (its latest value, e.g. a `.limit`\n   * metric) or a fixed number. When omitted, or when the resolved max is 0, the\n   * gauge shows the raw value with no fill (an unbounded reading).\n   */\n  max?: GaugeSeries | number;\n  title: string;\n  /** Iconify name or static icon component shown beside the label. */\n  icon?: string | StaticIconComponent;\n  /** Grafana-style unit key for the readout (e.g. \"bytes\", \"percent\", \"short\", \"ms\"). */\n  unit?: string;\n  /** Look-back window for the expand chart, passed as ?since=; defaults to \"1h\". */\n  range?: string;\n  /** Poll interval in ms; defaults to 5000. Pass 0 to disable polling. */\n  refreshMs?: number;\n  /** Show an expand button that opens the value/max time-series chart in a modal. Default true. */\n  expandable?: boolean;\n  /**\n   * Utilisation thresholds (percent of max) at which the arc turns amber then\n   * red. Defaults to [75, 90].\n   */\n  thresholds?: [warning: number, danger: number];\n  /**\n   * What to print in the centre: the formatted value (default) or the\n   * utilisation percentage of max (e.g. CPU usage out of its millicore limit).\n   */\n  centerDisplay?: \"value\" | \"percent\";\n  /** Override the default fetch (e.g. to route through an app's API client). */\n  fetcher?: (url: string) => Promise<TimeseriesResponse>;\n  className?: string;\n}\n\nconst defaultFetcher = async (url: string): Promise<TimeseriesResponse> => {\n  const res = await fetch(url);\n  if (!res.ok) throw new Error(`metrics request failed: ${res.status}`);\n  return res.json();\n};\n\n// Half-gauge SVG geometry: a 100×50 viewBox semicircle (radius 40, centre 50,50)\n// swept 180°. The arc length is π·r; stroke-dashoffset reveals value/max of it.\nconst GAUGE_RADIUS = 40;\nconst GAUGE_ARC = Math.PI * GAUGE_RADIUS;\nconst GAUGE_PATH = `M 10 50 A ${GAUGE_RADIUS} ${GAUGE_RADIUS} 0 0 1 90 50`;\n\nfunction toneClass(pct: number, [warn, danger]: [number, number]): string {\n  if (pct >= danger) return \"text-red-500\";\n  if (pct >= warn) return \"text-amber-500\";\n  return \"text-emerald-500\";\n}\n\nfunction latestValue(resp: TimeseriesResponse | undefined): number | undefined {\n  const points = resp?.points;\n  if (!points || points.length === 0) return undefined;\n  return points[points.length - 1]?.value;\n}\n\nfunction GaugeIcon({ icon }: { icon: string | StaticIconComponent }) {\n  if (typeof icon === \"string\") {\n    return <Icon name={icon} width={14} height={14} className=\"text-muted-foreground\" />;\n  }\n  return <Icon icon={icon} width={14} height={14} className=\"text-muted-foreground\" />;\n}\n\n/**\n * TimeseriesGauge renders a half (180°) radial gauge whose fill is the latest\n * value of a metric over its maximum (a `.limit`-style metric or a fixed number),\n * both read live from the timeseries store. The centre shows the utilisation\n * percentage, with the value/max caption below; the arc colour crosses warning\n * and danger thresholds. An expand button opens the full value/max time-series\n * chart in a modal (a `TimeseriesPanel`), so the gauge gives the at-a-glance\n * reading and the chart the trend.\n */\nexport function TimeseriesGauge({\n  baseUrl = \"\",\n  value,\n  max,\n  title,\n  icon,\n  unit,\n  range = \"1h\",\n  refreshMs = 5000,\n  expandable = true,\n  thresholds = [75, 90],\n  centerDisplay = \"value\",\n  fetcher = defaultFetcher,\n  className,\n}: TimeseriesGaugeProps) {\n  const [expanded, setExpanded] = useState(false);\n\n  const maxIsSeries = typeof max === \"object\";\n  const maxSeries = maxIsSeries ? max : undefined;\n  const ids = useMemo(() => {\n    const list = [value.id];\n    if (maxSeries) list.push(maxSeries.id);\n    return list;\n  }, [value.id, maxSeries]);\n\n  const results = useQueries({\n    queries: ids.map((id) => {\n      const u = new URL(baseUrl + id, window.location.origin);\n      if (range) u.searchParams.set(\"since\", range);\n      const requestUrl = u.pathname + u.search;\n      return {\n        queryKey: [\"timeseries\", requestUrl],\n        queryFn: () => fetcher(requestUrl),\n        refetchInterval: refreshMs > 0 ? refreshMs : false,\n        staleTime: 0,\n        retry: 0,\n      };\n    }),\n  });\n\n  const rawValue = latestValue(results[0]?.data);\n  const hasValue = rawValue !== undefined;\n  const usage = value.transform ? value.transform(rawValue ?? 0) : (rawValue ?? 0);\n\n  let limit: number | undefined;\n  if (typeof max === \"number\") {\n    limit = max;\n  } else if (maxSeries) {\n    const rawMax = latestValue(results[1]?.data);\n    limit = rawMax === undefined ? undefined : maxSeries.transform ? maxSeries.transform(rawMax) : rawMax;\n  }\n\n  const bounded = hasValue && limit !== undefined && limit > 0;\n  const pct = bounded ? Math.min(100, Math.round((usage / (limit as number)) * 100)) : 0;\n  const tone = toneClass(pct, thresholds);\n\n  const chartSeries: TimeseriesSeries[] = useMemo(() => {\n    const s: TimeseriesSeries[] = [{ id: value.id, label: \"value\", ...(value.transform ? { transform: value.transform } : {}) }];\n    if (maxSeries) s.push({ id: maxSeries.id, label: \"max\", ...(maxSeries.transform ? { transform: maxSeries.transform } : {}) });\n    return s;\n  }, [value.id, value.transform, maxSeries]);\n\n  return (\n    <div className={cn(\"flex flex-col items-center gap-1\", className)}>\n      <div className=\"relative h-10 w-20\">\n        <svg viewBox=\"0 0 100 50\" className=\"h-full w-full overflow-visible\">\n          <path d={GAUGE_PATH} fill=\"none\" stroke=\"currentColor\" strokeWidth={9} strokeLinecap=\"round\" className=\"text-muted\" />\n          <path\n            d={GAUGE_PATH}\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={9}\n            strokeLinecap=\"round\"\n            className={tone}\n            strokeDasharray={GAUGE_ARC}\n            strokeDashoffset={GAUGE_ARC * (1 - pct / 100)}\n          />\n        </svg>\n        <span className=\"absolute inset-x-0 bottom-0 text-center text-sm font-semibold text-foreground\">\n          {centerDisplay === \"percent\"\n            ? bounded\n              ? `${pct}%`\n              : hasValue\n                ? \"n/a\"\n                : \"—\"\n            : hasValue\n              ? formatUnit(usage, unit)\n              : \"—\"}\n        </span>\n        {expandable && (\n          <button\n            type=\"button\"\n            aria-label=\"Expand chart\"\n            onClick={() => setExpanded(true)}\n            className=\"absolute right-0 top-0 text-muted-foreground hover:text-foreground\"\n          >\n            <Icon icon={UiFullscreen} width={12} height={12} />\n          </button>\n        )}\n      </div>\n      <div className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n        {icon ? <GaugeIcon icon={icon} /> : null}\n        <span>{title}</span>\n      </div>\n\n      {expandable && (\n        <Modal open={expanded} onClose={() => setExpanded(false)} title={title} size=\"xl\">\n          <TimeseriesPanel\n            title={title}\n            {...(icon ? { icon } : {})}\n            {...(unit ? { unit } : {})}\n            baseUrl={baseUrl}\n            series={chartSeries}\n            range={range}\n            refreshMs={refreshMs}\n            expandable={false}\n            fetcher={fetcher}\n          />\n        </Modal>\n      )}\n    </div>\n  );\n}\n"],"names":["jsx","Icon","useState","useMemo","useQueries","cn","jsxs","formatUnit","UiFullscreen","Modal","TimeseriesPanel"],"mappings":"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"}

package/dist/data/TimeseriesGauge.d.ts

@@ -0,0 +1,56 @@
+import { StaticIconComponent } from './Icon';
+import { TimeseriesResponse } from './TimeseriesPanel';
+/** A metric series whose latest value drives the gauge fill or its maximum. */
+export interface GaugeSeries {
+    /** Metric id appended to the gauge's baseUrl, e.g. "k8s.statefulset.cycle.cpu.usage". */
+    id: string;
+    /** Maps the latest value before display (e.g. unit scaling). Identity when omitted. */
+    transform?: (value: number) => number;
+}
+export interface TimeseriesGaugeProps {
+    /** Common prefix; the value/max requests are `baseUrl + id`. */
+    baseUrl?: string;
+    /** The metric whose latest value fills the gauge. */
+    value: GaugeSeries;
+    /**
+     * The gauge maximum. Either a metric series (its latest value, e.g. a `.limit`
+     * metric) or a fixed number. When omitted, or when the resolved max is 0, the
+     * gauge shows the raw value with no fill (an unbounded reading).
+     */
+    max?: GaugeSeries | number;
+    title: string;
+    /** Iconify name or static icon component shown beside the label. */
+    icon?: string | StaticIconComponent;
+    /** Grafana-style unit key for the readout (e.g. "bytes", "percent", "short", "ms"). */
+    unit?: string;
+    /** Look-back window for the expand chart, passed as ?since=; defaults to "1h". */
+    range?: string;
+    /** Poll interval in ms; defaults to 5000. Pass 0 to disable polling. */
+    refreshMs?: number;
+    /** Show an expand button that opens the value/max time-series chart in a modal. Default true. */
+    expandable?: boolean;
+    /**
+     * Utilisation thresholds (percent of max) at which the arc turns amber then
+     * red. Defaults to [75, 90].
+     */
+    thresholds?: [warning: number, danger: number];
+    /**
+     * What to print in the centre: the formatted value (default) or the
+     * utilisation percentage of max (e.g. CPU usage out of its millicore limit).
+     */
+    centerDisplay?: "value" | "percent";
+    /** Override the default fetch (e.g. to route through an app's API client). */
+    fetcher?: (url: string) => Promise<TimeseriesResponse>;
+    className?: string;
+}
+/**
+ * TimeseriesGauge renders a half (180°) radial gauge whose fill is the latest
+ * value of a metric over its maximum (a `.limit`-style metric or a fixed number),
+ * both read live from the timeseries store. The centre shows the utilisation
+ * percentage, with the value/max caption below; the arc colour crosses warning
+ * and danger thresholds. An expand button opens the full value/max time-series
+ * chart in a modal (a `TimeseriesPanel`), so the gauge gives the at-a-glance
+ * reading and the chart the trend.
+ */
+export declare function TimeseriesGauge({ baseUrl, value, max, title, icon, unit, range, refreshMs, expandable, thresholds, centerDisplay, fetcher, className, }: TimeseriesGaugeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=TimeseriesGauge.d.ts.map

package/dist/data/TimeseriesGauge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeseriesGauge.d.ts","sourceRoot":"","sources":["../../src/data/TimeseriesGauge.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAQ,KAAK,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AACxD,OAAO,EAEL,KAAK,kBAAkB,EAExB,MAAM,mBAAmB,CAAC;AAE3B,+EAA+E;AAC/E,MAAM,WAAW,WAAW;IAC1B,yFAAyF;IACzF,EAAE,EAAE,MAAM,CAAC;IACX,uFAAuF;IACvF,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;CACvC;AAED,MAAM,WAAW,oBAAoB;IACnC,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qDAAqD;IACrD,KAAK,EAAE,WAAW,CAAC;IACnB;;;;OAIG;IACH,GAAG,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACpC,uFAAuF;IACvF,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kFAAkF;IAClF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,wEAAwE;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iGAAiG;IACjG,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;IAC/C;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACpC,8EAA8E;IAC9E,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,kBAAkB,CAAC,CAAC;IACvD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAiCD;;;;;;;;GAQG;AACH,wBAAgB,eAAe,CAAC,EAC9B,OAAY,EACZ,KAAK,EACL,GAAG,EACH,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,KAAY,EACZ,SAAgB,EAChB,UAAiB,EACjB,UAAqB,EACrB,aAAuB,EACvB,OAAwB,EACxB,SAAS,GACV,EAAE,oBAAoB,2CA4GtB"}

package/dist/data/TimeseriesGauge.js

@@ -0,0 +1,144 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useQueries } from "@tanstack/react-query";
+import { useState, useMemo } from "react";
+import { cn } from "../lib/utils.js";
+import { formatUnit } from "../lib/format.js";
+import { Modal } from "../overlay/Modal.js";
+import { Icon } from "./Icon.js";
+import { TimeseriesPanel } from "./TimeseriesPanel.js";
+import { UiFullscreen } from "../icons/components/UiFullscreen.js";
+const defaultFetcher = async (url) => {
+  const res = await fetch(url);
+  if (!res.ok) throw new Error(`metrics request failed: ${res.status}`);
+  return res.json();
+};
+const GAUGE_RADIUS = 40;
+const GAUGE_ARC = Math.PI * GAUGE_RADIUS;
+const GAUGE_PATH = `M 10 50 A ${GAUGE_RADIUS} ${GAUGE_RADIUS} 0 0 1 90 50`;
+function toneClass(pct, [warn, danger]) {
+  if (pct >= danger) return "text-red-500";
+  if (pct >= warn) return "text-amber-500";
+  return "text-emerald-500";
+}
+function latestValue(resp) {
+  var _a;
+  const points = resp == null ? void 0 : resp.points;
+  if (!points || points.length === 0) return void 0;
+  return (_a = points[points.length - 1]) == null ? void 0 : _a.value;
+}
+function GaugeIcon({ icon }) {
+  if (typeof icon === "string") {
+    return /* @__PURE__ */ jsx(Icon, { name: icon, width: 14, height: 14, className: "text-muted-foreground" });
+  }
+  return /* @__PURE__ */ jsx(Icon, { icon, width: 14, height: 14, className: "text-muted-foreground" });
+}
+function TimeseriesGauge({
+  baseUrl = "",
+  value,
+  max,
+  title,
+  icon,
+  unit,
+  range = "1h",
+  refreshMs = 5e3,
+  expandable = true,
+  thresholds = [75, 90],
+  centerDisplay = "value",
+  fetcher = defaultFetcher,
+  className
+}) {
+  var _a, _b;
+  const [expanded, setExpanded] = useState(false);
+  const maxIsSeries = typeof max === "object";
+  const maxSeries = maxIsSeries ? max : void 0;
+  const ids = useMemo(() => {
+    const list = [value.id];
+    if (maxSeries) list.push(maxSeries.id);
+    return list;
+  }, [value.id, maxSeries]);
+  const results = useQueries({
+    queries: ids.map((id) => {
+      const u = new URL(baseUrl + id, window.location.origin);
+      if (range) u.searchParams.set("since", range);
+      const requestUrl = u.pathname + u.search;
+      return {
+        queryKey: ["timeseries", requestUrl],
+        queryFn: () => fetcher(requestUrl),
+        refetchInterval: refreshMs > 0 ? refreshMs : false,
+        staleTime: 0,
+        retry: 0
+      };
+    })
+  });
+  const rawValue = latestValue((_a = results[0]) == null ? void 0 : _a.data);
+  const hasValue = rawValue !== void 0;
+  const usage = value.transform ? value.transform(rawValue ?? 0) : rawValue ?? 0;
+  let limit;
+  if (typeof max === "number") {
+    limit = max;
+  } else if (maxSeries) {
+    const rawMax = latestValue((_b = results[1]) == null ? void 0 : _b.data);
+    limit = rawMax === void 0 ? void 0 : maxSeries.transform ? maxSeries.transform(rawMax) : rawMax;
+  }
+  const bounded = hasValue && limit !== void 0 && limit > 0;
+  const pct = bounded ? Math.min(100, Math.round(usage / limit * 100)) : 0;
+  const tone = toneClass(pct, thresholds);
+  const chartSeries = useMemo(() => {
+    const s = [{ id: value.id, label: "value", ...value.transform ? { transform: value.transform } : {} }];
+    if (maxSeries) s.push({ id: maxSeries.id, label: "max", ...maxSeries.transform ? { transform: maxSeries.transform } : {} });
+    return s;
+  }, [value.id, value.transform, maxSeries]);
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col items-center gap-1", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "relative h-10 w-20", children: [
+      /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 100 50", className: "h-full w-full overflow-visible", children: [
+        /* @__PURE__ */ jsx("path", { d: GAUGE_PATH, fill: "none", stroke: "currentColor", strokeWidth: 9, strokeLinecap: "round", className: "text-muted" }),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: GAUGE_PATH,
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: 9,
+            strokeLinecap: "round",
+            className: tone,
+            strokeDasharray: GAUGE_ARC,
+            strokeDashoffset: GAUGE_ARC * (1 - pct / 100)
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx("span", { className: "absolute inset-x-0 bottom-0 text-center text-sm font-semibold text-foreground", children: centerDisplay === "percent" ? bounded ? `${pct}%` : hasValue ? "n/a" : "—" : hasValue ? formatUnit(usage, unit) : "—" }),
+      expandable && /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": "Expand chart",
+          onClick: () => setExpanded(true),
+          className: "absolute right-0 top-0 text-muted-foreground hover:text-foreground",
+          children: /* @__PURE__ */ jsx(Icon, { icon: UiFullscreen, width: 12, height: 12 })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 text-xs text-muted-foreground", children: [
+      icon ? /* @__PURE__ */ jsx(GaugeIcon, { icon }) : null,
+      /* @__PURE__ */ jsx("span", { children: title })
+    ] }),
+    expandable && /* @__PURE__ */ jsx(Modal, { open: expanded, onClose: () => setExpanded(false), title, size: "xl", children: /* @__PURE__ */ jsx(
+      TimeseriesPanel,
+      {
+        title,
+        ...icon ? { icon } : {},
+        ...unit ? { unit } : {},
+        baseUrl,
+        series: chartSeries,
+        range,
+        refreshMs,
+        expandable: false,
+        fetcher
+      }
+    ) })
+  ] });
+}
+export {
+  TimeseriesGauge
+};
+//# sourceMappingURL=TimeseriesGauge.js.map

package/dist/data/TimeseriesGauge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TimeseriesGauge.js","sources":["../../src/data/TimeseriesGauge.tsx"],"sourcesContent":["import { useQueries } from \"@tanstack/react-query\";\nimport { useMemo, useState } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { formatUnit } from \"../lib/format\";\nimport { Modal } from \"../overlay/Modal\";\nimport { UiFullscreen } from \"../icons\";\nimport { Icon, type StaticIconComponent } from \"./Icon\";\nimport {\n  TimeseriesPanel,\n  type TimeseriesResponse,\n  type TimeseriesSeries,\n} from \"./TimeseriesPanel\";\n\n/** A metric series whose latest value drives the gauge fill or its maximum. */\nexport interface GaugeSeries {\n  /** Metric id appended to the gauge's baseUrl, e.g. \"k8s.statefulset.cycle.cpu.usage\". */\n  id: string;\n  /** Maps the latest value before display (e.g. unit scaling). Identity when omitted. */\n  transform?: (value: number) => number;\n}\n\nexport interface TimeseriesGaugeProps {\n  /** Common prefix; the value/max requests are `baseUrl + id`. */\n  baseUrl?: string;\n  /** The metric whose latest value fills the gauge. */\n  value: GaugeSeries;\n  /**\n   * The gauge maximum. Either a metric series (its latest value, e.g. a `.limit`\n   * metric) or a fixed number. When omitted, or when the resolved max is 0, the\n   * gauge shows the raw value with no fill (an unbounded reading).\n   */\n  max?: GaugeSeries | number;\n  title: string;\n  /** Iconify name or static icon component shown beside the label. */\n  icon?: string | StaticIconComponent;\n  /** Grafana-style unit key for the readout (e.g. \"bytes\", \"percent\", \"short\", \"ms\"). */\n  unit?: string;\n  /** Look-back window for the expand chart, passed as ?since=; defaults to \"1h\". */\n  range?: string;\n  /** Poll interval in ms; defaults to 5000. Pass 0 to disable polling. */\n  refreshMs?: number;\n  /** Show an expand button that opens the value/max time-series chart in a modal. Default true. */\n  expandable?: boolean;\n  /**\n   * Utilisation thresholds (percent of max) at which the arc turns amber then\n   * red. Defaults to [75, 90].\n   */\n  thresholds?: [warning: number, danger: number];\n  /**\n   * What to print in the centre: the formatted value (default) or the\n   * utilisation percentage of max (e.g. CPU usage out of its millicore limit).\n   */\n  centerDisplay?: \"value\" | \"percent\";\n  /** Override the default fetch (e.g. to route through an app's API client). */\n  fetcher?: (url: string) => Promise<TimeseriesResponse>;\n  className?: string;\n}\n\nconst defaultFetcher = async (url: string): Promise<TimeseriesResponse> => {\n  const res = await fetch(url);\n  if (!res.ok) throw new Error(`metrics request failed: ${res.status}`);\n  return res.json();\n};\n\n// Half-gauge SVG geometry: a 100×50 viewBox semicircle (radius 40, centre 50,50)\n// swept 180°. The arc length is π·r; stroke-dashoffset reveals value/max of it.\nconst GAUGE_RADIUS = 40;\nconst GAUGE_ARC = Math.PI * GAUGE_RADIUS;\nconst GAUGE_PATH = `M 10 50 A ${GAUGE_RADIUS} ${GAUGE_RADIUS} 0 0 1 90 50`;\n\nfunction toneClass(pct: number, [warn, danger]: [number, number]): string {\n  if (pct >= danger) return \"text-red-500\";\n  if (pct >= warn) return \"text-amber-500\";\n  return \"text-emerald-500\";\n}\n\nfunction latestValue(resp: TimeseriesResponse | undefined): number | undefined {\n  const points = resp?.points;\n  if (!points || points.length === 0) return undefined;\n  return points[points.length - 1]?.value;\n}\n\nfunction GaugeIcon({ icon }: { icon: string | StaticIconComponent }) {\n  if (typeof icon === \"string\") {\n    return <Icon name={icon} width={14} height={14} className=\"text-muted-foreground\" />;\n  }\n  return <Icon icon={icon} width={14} height={14} className=\"text-muted-foreground\" />;\n}\n\n/**\n * TimeseriesGauge renders a half (180°) radial gauge whose fill is the latest\n * value of a metric over its maximum (a `.limit`-style metric or a fixed number),\n * both read live from the timeseries store. The centre shows the utilisation\n * percentage, with the value/max caption below; the arc colour crosses warning\n * and danger thresholds. An expand button opens the full value/max time-series\n * chart in a modal (a `TimeseriesPanel`), so the gauge gives the at-a-glance\n * reading and the chart the trend.\n */\nexport function TimeseriesGauge({\n  baseUrl = \"\",\n  value,\n  max,\n  title,\n  icon,\n  unit,\n  range = \"1h\",\n  refreshMs = 5000,\n  expandable = true,\n  thresholds = [75, 90],\n  centerDisplay = \"value\",\n  fetcher = defaultFetcher,\n  className,\n}: TimeseriesGaugeProps) {\n  const [expanded, setExpanded] = useState(false);\n\n  const maxIsSeries = typeof max === \"object\";\n  const maxSeries = maxIsSeries ? max : undefined;\n  const ids = useMemo(() => {\n    const list = [value.id];\n    if (maxSeries) list.push(maxSeries.id);\n    return list;\n  }, [value.id, maxSeries]);\n\n  const results = useQueries({\n    queries: ids.map((id) => {\n      const u = new URL(baseUrl + id, window.location.origin);\n      if (range) u.searchParams.set(\"since\", range);\n      const requestUrl = u.pathname + u.search;\n      return {\n        queryKey: [\"timeseries\", requestUrl],\n        queryFn: () => fetcher(requestUrl),\n        refetchInterval: refreshMs > 0 ? refreshMs : false,\n        staleTime: 0,\n        retry: 0,\n      };\n    }),\n  });\n\n  const rawValue = latestValue(results[0]?.data);\n  const hasValue = rawValue !== undefined;\n  const usage = value.transform ? value.transform(rawValue ?? 0) : (rawValue ?? 0);\n\n  let limit: number | undefined;\n  if (typeof max === \"number\") {\n    limit = max;\n  } else if (maxSeries) {\n    const rawMax = latestValue(results[1]?.data);\n    limit = rawMax === undefined ? undefined : maxSeries.transform ? maxSeries.transform(rawMax) : rawMax;\n  }\n\n  const bounded = hasValue && limit !== undefined && limit > 0;\n  const pct = bounded ? Math.min(100, Math.round((usage / (limit as number)) * 100)) : 0;\n  const tone = toneClass(pct, thresholds);\n\n  const chartSeries: TimeseriesSeries[] = useMemo(() => {\n    const s: TimeseriesSeries[] = [{ id: value.id, label: \"value\", ...(value.transform ? { transform: value.transform } : {}) }];\n    if (maxSeries) s.push({ id: maxSeries.id, label: \"max\", ...(maxSeries.transform ? { transform: maxSeries.transform } : {}) });\n    return s;\n  }, [value.id, value.transform, maxSeries]);\n\n  return (\n    <div className={cn(\"flex flex-col items-center gap-1\", className)}>\n      <div className=\"relative h-10 w-20\">\n        <svg viewBox=\"0 0 100 50\" className=\"h-full w-full overflow-visible\">\n          <path d={GAUGE_PATH} fill=\"none\" stroke=\"currentColor\" strokeWidth={9} strokeLinecap=\"round\" className=\"text-muted\" />\n          <path\n            d={GAUGE_PATH}\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth={9}\n            strokeLinecap=\"round\"\n            className={tone}\n            strokeDasharray={GAUGE_ARC}\n            strokeDashoffset={GAUGE_ARC * (1 - pct / 100)}\n          />\n        </svg>\n        <span className=\"absolute inset-x-0 bottom-0 text-center text-sm font-semibold text-foreground\">\n          {centerDisplay === \"percent\"\n            ? bounded\n              ? `${pct}%`\n              : hasValue\n                ? \"n/a\"\n                : \"—\"\n            : hasValue\n              ? formatUnit(usage, unit)\n              : \"—\"}\n        </span>\n        {expandable && (\n          <button\n            type=\"button\"\n            aria-label=\"Expand chart\"\n            onClick={() => setExpanded(true)}\n            className=\"absolute right-0 top-0 text-muted-foreground hover:text-foreground\"\n          >\n            <Icon icon={UiFullscreen} width={12} height={12} />\n          </button>\n        )}\n      </div>\n      <div className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n        {icon ? <GaugeIcon icon={icon} /> : null}\n        <span>{title}</span>\n      </div>\n\n      {expandable && (\n        <Modal open={expanded} onClose={() => setExpanded(false)} title={title} size=\"xl\">\n          <TimeseriesPanel\n            title={title}\n            {...(icon ? { icon } : {})}\n            {...(unit ? { unit } : {})}\n            baseUrl={baseUrl}\n            series={chartSeries}\n            range={range}\n            refreshMs={refreshMs}\n            expandable={false}\n            fetcher={fetcher}\n          />\n        </Modal>\n      )}\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/data.cjs

@@ -27,6 +27,9 @@ const SignedDeltaBar = require("./data/SignedDeltaBar.cjs");
 const SortableHeader = require("./data/SortableHeader.cjs");
 const TabButton = require("./data/TabButton.cjs");
 const TimeseriesPanel = require("./data/TimeseriesPanel.cjs");
+const TimeseriesGauge = require("./data/TimeseriesGauge.cjs");
+const TimeseriesCoreBars = require("./data/TimeseriesCoreBars.cjs");
+const StatusBreakdown = require("./data/StatusBreakdown.cjs");
 const Tree = require("./data/Tree.cjs");
 const TreeNode = require("./data/TreeNode.cjs");
 const TreeGroupHeader = require("./data/TreeGroupHeader.cjs");
@@ -353,6 +356,12 @@ exports.TabButton = TabButton.TabButton;
 exports.TimeseriesPanel = TimeseriesPanel.TimeseriesPanel;
 exports.resolveBreakdown = TimeseriesPanel.resolveBreakdown;
 exports.resolveSeries = TimeseriesPanel.resolveSeries;
+exports.TimeseriesGauge = TimeseriesGauge.TimeseriesGauge;
+exports.TimeseriesCoreBars = TimeseriesCoreBars.TimeseriesCoreBars;
+exports.deriveCoreBars = TimeseriesCoreBars.deriveCoreBars;
+exports.StackedStatusBar = StatusBreakdown.StackedStatusBar;
+exports.StatusRows = StatusBreakdown.StatusRows;
+exports.segment = StatusBreakdown.segment;
 exports.Tree = Tree.Tree;
 exports.TreeNode = TreeNode.TreeNode;
 exports.TreeGroupHeader = TreeGroupHeader.TreeGroupHeader;

package/dist/data.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"data.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"data.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/data.d.ts

@@ -26,6 +26,9 @@ export { SignedDeltaBar, type SignedDeltaBarProps } from './data/SignedDeltaBar'
 export { SortableHeader, type SortableHeaderProps } from './data/SortableHeader';
 export { TabButton, type TabButtonProps } from './data/TabButton';
 export { TimeseriesPanel, resolveSeries, resolveBreakdown, type BreakdownItem, type ResolvedSeries, type TimeseriesPanelProps, type TimeseriesPoint, type TimeseriesResponse, type TimeseriesSeries, } from './data/TimeseriesPanel';
+export { TimeseriesGauge, type GaugeSeries, type TimeseriesGaugeProps, } from './data/TimeseriesGauge';
+export { TimeseriesCoreBars, deriveCoreBars, type TimeseriesCoreBarsProps, type CoreBar, type CoreBarsModel, } from './data/TimeseriesCoreBars';
+export { StatusRows, StackedStatusBar, segment, type StatusSegment, type StatusRenderLink, } from './data/StatusBreakdown';
 export { Tree, type TreeProps } from './data/Tree';
 export { TreeNode, type TreeNodeProps, type TreeRowContext } from './data/TreeNode';
 export { TreeGroupHeader, type TreeGroupHeaderProps } from './data/TreeGroupHeader';

package/dist/data.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../src/data.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"data.d.ts","sourceRoot":"","sources":["../src/data.ts"],"names":[],"mappings":"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"}

package/dist/data.js

@@ -25,6 +25,9 @@ import { SignedDeltaBar } from "./data/SignedDeltaBar.js";
 import { SortableHeader } from "./data/SortableHeader.js";
 import { TabButton } from "./data/TabButton.js";
 import { TimeseriesPanel, resolveBreakdown, resolveSeries } from "./data/TimeseriesPanel.js";
+import { TimeseriesGauge } from "./data/TimeseriesGauge.js";
+import { TimeseriesCoreBars, deriveCoreBars } from "./data/TimeseriesCoreBars.js";
+import { StackedStatusBar, StatusRows, segment } from "./data/StatusBreakdown.js";
 import { Tree } from "./data/Tree.js";
 import { TreeNode } from "./data/TreeNode.js";
 import { TreeGroupHeader } from "./data/TreeGroupHeader.js";
@@ -338,12 +341,16 @@ export {
   SignedDeltaBar,
   SortableHeader,
   StackTrace,
+  StackedStatusBar,
   StatusDot,
+  StatusRows,
   TabButton,
   TagActionsProvider,
   TagList,
   TaskManager,
   TaskProgress,
+  TimeseriesCoreBars,
+  TimeseriesGauge,
   TimeseriesPanel,
   Timestamp,
   Tree,
@@ -848,6 +855,7 @@ export {
   countProcesses,
   countStackByState,
   countThreadsByState,
+  deriveCoreBars,
   detectDumpFormat,
   findProcessByPID,
   formatPropertyLabel,
@@ -875,6 +883,7 @@ export {
   processStateIcon,
   resolveBreakdown,
   resolveSeries,
+  segment,
   setFallbackIconProvider,
   splitTagToken,
   tagActionsFromRecord,

package/dist/data.js.map

@@ -1 +1 @@
-{"version":3,"file":"data.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"data.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.cjs

@@ -56,6 +56,9 @@ const SignedDeltaBar = require("./data/SignedDeltaBar.cjs");
 const SortableHeader = require("./data/SortableHeader.cjs");
 const TabButton = require("./data/TabButton.cjs");
 const TimeseriesPanel = require("./data/TimeseriesPanel.cjs");
+const TimeseriesGauge = require("./data/TimeseriesGauge.cjs");
+const TimeseriesCoreBars = require("./data/TimeseriesCoreBars.cjs");
+const StatusBreakdown = require("./data/StatusBreakdown.cjs");
 const Tree = require("./data/Tree.cjs");
 const TreeNode = require("./data/TreeNode.cjs");
 const TreeGroupHeader = require("./data/TreeGroupHeader.cjs");
@@ -442,6 +445,12 @@ exports.TabButton = TabButton.TabButton;
 exports.TimeseriesPanel = TimeseriesPanel.TimeseriesPanel;
 exports.resolveBreakdown = TimeseriesPanel.resolveBreakdown;
 exports.resolveSeries = TimeseriesPanel.resolveSeries;
+exports.TimeseriesGauge = TimeseriesGauge.TimeseriesGauge;
+exports.TimeseriesCoreBars = TimeseriesCoreBars.TimeseriesCoreBars;
+exports.deriveCoreBars = TimeseriesCoreBars.deriveCoreBars;
+exports.StackedStatusBar = StatusBreakdown.StackedStatusBar;
+exports.StatusRows = StatusBreakdown.StatusRows;
+exports.segment = StatusBreakdown.segment;
 exports.Tree = Tree.Tree;
 exports.TreeNode = TreeNode.TreeNode;
 exports.TreeGroupHeader = TreeGroupHeader.TreeGroupHeader;

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.js

@@ -54,6 +54,9 @@ import { SignedDeltaBar } from "./data/SignedDeltaBar.js";
 import { SortableHeader } from "./data/SortableHeader.js";
 import { TabButton } from "./data/TabButton.js";
 import { TimeseriesPanel, resolveBreakdown, resolveSeries } from "./data/TimeseriesPanel.js";
+import { TimeseriesGauge } from "./data/TimeseriesGauge.js";
+import { TimeseriesCoreBars, deriveCoreBars } from "./data/TimeseriesCoreBars.js";
+import { StackedStatusBar, StatusRows, segment } from "./data/StatusBreakdown.js";
 import { Tree } from "./data/Tree.js";
 import { TreeNode } from "./data/TreeNode.js";
 import { TreeGroupHeader } from "./data/TreeGroupHeader.js";
@@ -420,7 +423,9 @@ export {
   SplitButton,
   SplitPane,
   StackTrace,
+  StackedStatusBar,
   StatusDot,
+  StatusRows,
   TabButton,
   TagActionsProvider,
   TagList,
@@ -429,6 +434,8 @@ export {
   ThemeProvider,
   ThemeSwitcher,
   TimeRange,
+  TimeseriesCoreBars,
+  TimeseriesGauge,
   TimeseriesPanel,
   Timestamp,
   Tree,
@@ -936,6 +943,7 @@ export {
   countProcesses,
   countStackByState,
   countThreadsByState,
+  deriveCoreBars,
   detectDumpFormat,
   filterOperationsByDomain,
   findDetailEndpoint,
@@ -977,6 +985,7 @@ export {
   resolveBreakdown,
   resolveSeries,
   resolveSize,
+  segment,
   setFallbackIconProvider,
   splitTagToken,
   tagActionsFromRecord,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}