@flanksource/clicky-ui 0.3.24 → 0.3.26

package/dist/data.js

@@ -71,6 +71,8 @@ import { ExecutionTree } from "./data/ExecutionTree.js";
 import { TreeNode } from "./data/TreeNode.js";
 import { TreeGroupHeader } from "./data/TreeGroupHeader.js";
 import { Timeline } from "./data/Timeline.js";
+import { DEBUG_CAPTURE_HEADER, DEBUG_REFRESH_INSPECTION_HEADER, debugCaptureHeaders, debugConsoleAvailable, debugConsoleOpen, registerDebugConsole, revealDebugConsole, setDebugCaptureLevel, setDebugConsoleOpen, setDebugRefreshInspection, subscribeToDebugConsole } from "./data/debugConsoleSignal.js";
+import { useDebugAction } from "./data/useDebugAction.js";
 import { allGroupsTerminal, isTerminalStatus } from "./data/TaskSnapshot.js";
 import { bucketTasks, logLevelColor, taskSegments, taskStatusBg, taskStatusColor, taskStatusIcon } from "./data/task-status.js";
 import { TaskProgress } from "./data/TaskProgress.js";
@@ -104,10 +106,8 @@ import { CacheValue } from "./data/cache-browser/CacheValue.js";
 import { ClickyExportDialog } from "./data/clicky-export/ClickyExportDialog.js";
 import { FixtureEditor } from "./data/FixtureEditor/FixtureEditor.js";
 import { GitChangedFilesSummary, GitCommitList, GitDiffPanel, GitFileList } from "./data/git/GitChangeList.js";
-import { QUERY_INFO_CONTENT_TYPE, buildQueryInfoUrl, fetchQueryInfo } from "./data/query-info/queryInfo.js";
 import { QueryBrowser } from "./data/query-browser/QueryBrowser.js";
 import { QueryBrowserExecutionError } from "./data/query-browser/QueryBrowser.types.js";
-import { QueryInfoDialog } from "./data/query-info/QueryInfoDialog.js";
 import { STATUS_LABELS, aggregateStatusCounts, collapseSingleChildChains, collectFrameworks, filterTests, formatCount, formatTestDuration, hasFailed, hasPending, humanizeName, statusIconFor, statusToneFor, sum, sumNonTaskTests, testStatus, totalDuration } from "./data/test-runner/status.js";
 import { TestAttempts, TestFailureDetail, TestOutput } from "./data/test-runner/TestFailureDetail.js";
 import { TestDetailPanel } from "./data/test-runner/TestDetailPanel.js";
@@ -317,6 +317,7 @@ import { UiNetwork, UiNetworkFilled } from "./icons/components/UiNetwork.js";
 import { UiNull } from "./icons/components/UiNull.js";
 import { UiNumeric } from "./icons/components/UiNumeric.js";
 import { UiObject } from "./icons/components/UiObject.js";
+import { UiOpenScad } from "./icons/components/UiOpenScad.js";
 import { UiOperator } from "./icons/components/UiOperator.js";
 import { UiOrganization, UiOrganizationCheck, UiOrganizationCheckFilled, UiOrganizationCross, UiOrganizationCrossFilled, UiOrganizationFilled, UiOrganizationMinus, UiOrganizationMinusFilled, UiOrganizationPlus, UiOrganizationPlusFilled } from "./icons/components/UiOrganization.js";
 import { UiPackage, UiPackageFilled } from "./icons/components/UiPackage.js";
@@ -452,7 +453,6 @@ import { formatGitCommitDateHeader } from "./data/git/git-dates.js";
 import { frameworkIcon } from "./data/test-runner/frameworkIcon.js";
 import { isLeaf } from "./data/cache-browser/types.js";
 import { useClickyExport } from "./data/clicky-export/useClickyExport.js";
-import { useQueryInfo } from "./data/query-info/useQueryInfo.js";
 export {
   AnsiHtml,
   Avatar,
@@ -475,6 +475,8 @@ export {
   CodeDiff,
   CopyBadge,
   DATA_TABLE_FILTER_LOOKUP_LIMIT,
+  DEBUG_CAPTURE_HEADER,
+  DEBUG_REFRESH_INSPECTION_HEADER,
   DataTable,
   DiagnosticsDetailPanel,
   DiagnosticsTree,
@@ -514,10 +516,8 @@ export {
   PromptBanner,
   PromptDialog,
   Properties,
-  QUERY_INFO_CONTENT_TYPE,
   QueryBrowser,
   QueryBrowserExecutionError,
-  QueryInfoDialog,
   RUNTIME_PREFIXES,
   RadialGauge,
   STATUS_LABELS,
@@ -913,6 +913,7 @@ export {
   UiNull,
   UiNumeric,
   UiObject,
+  UiOpenScad,
   UiOperator,
   UiOrganization,
   UiOrganizationCheck,
@@ -1174,7 +1175,6 @@ export {
   badgeVariants,
   bucketTasks,
   buildMarkdownPreviewUrl,
-  buildQueryInfoUrl,
   buildSchemaTree,
   buildSchemaViewerTree,
   buildStepBranchTree,
@@ -1199,12 +1199,14 @@ export {
   createFenceMarkdown,
   createTestRunnerRegistry,
   cycleFilterState,
+  debugCaptureHeaders,
+  debugConsoleAvailable,
+  debugConsoleOpen,
   decodeFilterState,
   deriveProgressBars,
   detectDumpFormat,
   emptyTestFilters,
   encodeFilterState,
-  fetchQueryInfo,
   filterStateToRecord,
   filterTests,
   findNodeByRoutePath,
@@ -1268,9 +1270,11 @@ export {
   processStateIcon,
   pruneNullNodes,
   recordToFilterState,
+  registerDebugConsole,
   resolveBreakdown,
   resolveFixtureFenceSchema,
   resolveSeries,
+  revealDebugConsole,
   schemaKeys,
   segment,
   serializeMultiFilterValue,
@@ -1279,6 +1283,9 @@ export {
   serverFiltersToFilterBar,
   serverTimingCounterSummary,
   serverTimingMetricLabel,
+  setDebugCaptureLevel,
+  setDebugConsoleOpen,
+  setDebugRefreshInspection,
   setFallbackIconProvider,
   shortFrameName,
   slugify,
@@ -1287,6 +1294,7 @@ export {
   statusIconFor,
   statusToneFor,
   stringifyFixtureYaml,
+  subscribeToDebugConsole,
   sum,
   sumNonTaskTests,
   tagActionsFromRecord,
@@ -1300,8 +1308,8 @@ export {
   totalDuration,
   updateFilterSelection,
   useClickyExport,
+  useDebugAction,
   usePrompts,
-  useQueryInfo,
   useTagActions,
   useTagActionsValue,
   useTestRunner,

package/dist/devtools/DebugConsole.cjs

@@ -0,0 +1,138 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const IconButton = require("../components/IconButton.cjs");
+const Tabs = require("../layout/Tabs.cjs");
+const debugClient = require("./debugClient.cjs");
+const debugStore = require("./debugStore.cjs");
+const ConsoleTab = require("./tabs/ConsoleTab.cjs");
+const InspectionTab = require("./tabs/InspectionTab.cjs");
+const NetworkTab = require("./tabs/NetworkTab.cjs");
+const QueriesTab = require("./tabs/QueriesTab.cjs");
+const types = require("./types.cjs");
+const UiTrash = require("../icons/components/UiTrash.cjs");
+const UiClose = require("../icons/components/UiClose.cjs");
+function DebugConsole({
+  state,
+  store = debugStore.debugStore,
+  client,
+  onClose,
+  tab: controlledTab,
+  onTabChange
+}) {
+  const [uncontrolledTab, setUncontrolledTab] = react.useState("queries");
+  const tab = controlledTab ?? uncontrolledTab;
+  const selectTab = (next) => {
+    setUncontrolledTab(next);
+    onTabChange == null ? void 0 : onTabChange(next);
+  };
+  const [selectedId, setSelectedId] = react.useState();
+  const selected = useSelectedRecord(state.records, selectedId);
+  const tabs = react.useMemo(
+    () => [
+      { id: "queries", label: "Queries", count: state.records.length },
+      { id: "network", label: "Network", count: (selected == null ? void 0 : selected.counts.harEntries) ?? 0 },
+      { id: "console", label: "Console", count: state.logs.length },
+      {
+        id: "inspection",
+        label: "Inspection",
+        count: ((selected == null ? void 0 : selected.counts.inspections) ?? 0) + ((selected == null ? void 0 : selected.counts.probes) ?? 0)
+      }
+    ],
+    [state.records.length, state.logs.length, selected]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full min-h-0 flex-col bg-background", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-density-3 border-border border-b px-density-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Tabs.Tabs, { tabs, value: tab, onChange: (id) => selectTab(id), className: "flex-1" }),
+      /* @__PURE__ */ jsxRuntime.jsx(LevelPicker, { level: state.level, onChange: (level) => store.setLevel(level) }),
+      /* @__PURE__ */ jsxRuntime.jsx(ConnectionDot, { connected: state.connected, error: state.streamError }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        IconButton.IconButton,
+        {
+          icon: UiTrash.UiTrash,
+          label: "Clear captures",
+          iconClassName: "size-4",
+          onClick: () => {
+            store.clear();
+            void (client ?? new debugClient.DebugClient()).clear().catch(() => {
+            });
+          }
+        }
+      ),
+      onClose ? /* @__PURE__ */ jsxRuntime.jsx(IconButton.IconButton, { icon: UiClose.UiClose, label: "Close console", iconClassName: "size-4", onClick: onClose }) : null
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden", children: [
+      tab === "queries" ? /* @__PURE__ */ jsxRuntime.jsx(
+        QueriesTab.QueriesTab,
+        {
+          records: state.records,
+          client,
+          onSelect: (record) => setSelectedId(record.id)
+        }
+      ) : null,
+      tab === "network" ? /* @__PURE__ */ jsxRuntime.jsx(NetworkTab.NetworkTab, { record: selected, client }) : null,
+      tab === "console" ? /* @__PURE__ */ jsxRuntime.jsx(ConsoleTab.ConsoleTab, { lines: state.logs }) : null,
+      tab === "inspection" ? /* @__PURE__ */ jsxRuntime.jsx(
+        InspectionTab.InspectionTab,
+        {
+          record: selected,
+          client,
+          refreshInspection: state.refreshInspection,
+          onRefreshInspectionChange: (refresh) => store.setRefreshInspection(refresh)
+        }
+      ) : null
+    ] })
+  ] });
+}
+function useSelectedRecord(records, selectedId) {
+  return react.useMemo(() => {
+    if (selectedId) {
+      const found = records.find((record) => record.id === selectedId);
+      if (found) return found;
+    }
+    return records[records.length - 1];
+  }, [records, selectedId]);
+}
+function LevelPicker({
+  level,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex items-center gap-density-1 text-xs", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "Capture" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "select",
+      {
+        className: "rounded border border-border bg-background px-density-1 py-0.5 font-mono text-xs",
+        value: level,
+        title: types.LEVEL_HELP[level],
+        onChange: (event) => onChange(event.target.value),
+        children: types.SELECTABLE_LEVELS.map((option) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: option, title: types.LEVEL_HELP[option], children: option }, option))
+      }
+    )
+  ] });
+}
+function ConnectionDot({
+  connected,
+  error
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      className: "flex items-center gap-density-1 text-muted-foreground text-xs",
+      title: error ?? (connected ? "Streaming" : "Not connected"),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: `inline-block size-2 rounded-full ${connected ? "bg-green-500" : "bg-muted-foreground/40"}`
+          }
+        ),
+        connected ? "live" : "offline"
+      ]
+    }
+  );
+}
+exports.DebugConsole = DebugConsole;
+//# sourceMappingURL=DebugConsole.cjs.map

package/dist/devtools/DebugConsole.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugConsole.cjs","sources":["../../src/devtools/DebugConsole.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { IconButton } from \"../components/IconButton\";\nimport { UiClose, UiTrash } from \"../icons\";\nimport { Tabs, type TabItem } from \"../layout/Tabs\";\nimport { DebugClient } from \"./debugClient\";\nimport { debugStore, type DebugStore, type DebugStoreState } from \"./debugStore\";\nimport { ConsoleTab } from \"./tabs/ConsoleTab\";\nimport { InspectionTab } from \"./tabs/InspectionTab\";\nimport { NetworkTab } from \"./tabs/NetworkTab\";\nimport { QueriesTab } from \"./tabs/QueriesTab\";\nimport {\n  LEVEL_HELP,\n  SELECTABLE_LEVELS,\n  type DebugLevel,\n  type DebugTab,\n  type ExecutionSummary,\n} from \"./types\";\n\nexport type { DebugTab };\n\n/**\n * The console itself: a header that says what is being captured and at what\n * cost, and one of four tabs below it.\n *\n * Three tabs are scoped to a selected capture and one is not. Queries is the\n * list; Network and Inspection explain the row you picked from it; Console is\n * the process tail, which belongs to the server rather than to any one request.\n */\n\nexport type DebugConsoleProps = {\n  state: DebugStoreState;\n  store?: DebugStore | undefined;\n  client?: DebugClient | undefined;\n  onClose?: (() => void) | undefined;\n  /** Controlled tab, so the host can deep-link into one. */\n  tab?: DebugTab | undefined;\n  onTabChange?: ((tab: DebugTab) => void) | undefined;\n};\n\nexport function DebugConsole({\n  state,\n  store = debugStore,\n  client,\n  onClose,\n  tab: controlledTab,\n  onTabChange,\n}: DebugConsoleProps) {\n  const [uncontrolledTab, setUncontrolledTab] = useState<DebugTab>(\"queries\");\n  const tab = controlledTab ?? uncontrolledTab;\n  const selectTab = (next: DebugTab) => {\n    setUncontrolledTab(next);\n    onTabChange?.(next);\n  };\n\n  const [selectedId, setSelectedId] = useState<string | undefined>();\n  const selected = useSelectedRecord(state.records, selectedId);\n\n  const tabs: TabItem[] = useMemo(\n    () => [\n      { id: \"queries\", label: \"Queries\", count: state.records.length },\n      { id: \"network\", label: \"Network\", count: selected?.counts.harEntries ?? 0 },\n      { id: \"console\", label: \"Console\", count: state.logs.length },\n      {\n        id: \"inspection\",\n        label: \"Inspection\",\n        count: (selected?.counts.inspections ?? 0) + (selected?.counts.probes ?? 0),\n      },\n    ],\n    [state.records.length, state.logs.length, selected],\n  );\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col bg-background\">\n      <div className=\"flex shrink-0 items-center gap-density-3 border-border border-b px-density-3\">\n        <Tabs tabs={tabs} value={tab} onChange={(id) => selectTab(id as DebugTab)} className=\"flex-1\" />\n\n        <LevelPicker level={state.level} onChange={(level) => store.setLevel(level)} />\n\n        <ConnectionDot connected={state.connected} error={state.streamError} />\n\n        <IconButton\n          icon={UiTrash}\n          label=\"Clear captures\"\n          iconClassName=\"size-4\"\n          onClick={() => {\n            store.clear();\n            void (client ?? new DebugClient()).clear().catch(() => {\n              // The server's buffer outliving the client's view is a cosmetic\n              // mismatch, not a reason to fail the click the user just made.\n            });\n          }}\n        />\n        {onClose ? (\n          <IconButton icon={UiClose} label=\"Close console\" iconClassName=\"size-4\" onClick={onClose} />\n        ) : null}\n      </div>\n\n      {/* A bounded flex column. Every tab below hands its height to a component\n          that scrolls internally (DataTable, LogsTable, HarPanel), and each of\n          those sizes itself as `flex-1 min-h-0` — which needs a flex parent with\n          a definite height, or it resolves to content height and the console\n          body grows instead of scrolling. */}\n      <div className=\"flex min-h-0 flex-1 flex-col overflow-hidden\">\n        {tab === \"queries\" ? (\n          <QueriesTab\n            records={state.records}\n            client={client}\n            onSelect={(record) => setSelectedId(record.id)}\n          />\n        ) : null}\n        {tab === \"network\" ? <NetworkTab record={selected} client={client} /> : null}\n        {tab === \"console\" ? <ConsoleTab lines={state.logs} /> : null}\n        {tab === \"inspection\" ? (\n          <InspectionTab\n            record={selected}\n            client={client}\n            refreshInspection={state.refreshInspection}\n            onRefreshInspectionChange={(refresh) => store.setRefreshInspection(refresh)}\n          />\n        ) : null}\n      </div>\n    </div>\n  );\n}\n\n/**\n * The selected capture, falling back to the most recent one.\n *\n * Without the fallback, Network and Inspection open empty on a console that is\n * plainly full of rows, which reads as a broken tab rather than as \"pick one\".\n */\nfunction useSelectedRecord(\n  records: ExecutionSummary[],\n  selectedId: string | undefined,\n): ExecutionSummary | undefined {\n  return useMemo(() => {\n    if (selectedId) {\n      const found = records.find((record) => record.id === selectedId);\n      if (found) return found;\n    }\n    return records[records.length - 1];\n  }, [records, selectedId]);\n}\n\nfunction LevelPicker({\n  level,\n  onChange,\n}: {\n  level: DebugLevel;\n  onChange: (level: DebugLevel) => void;\n}) {\n  return (\n    <label className=\"flex items-center gap-density-1 text-xs\">\n      <span className=\"text-muted-foreground\">Capture</span>\n      <select\n        className=\"rounded border border-border bg-background px-density-1 py-0.5 font-mono text-xs\"\n        value={level}\n        title={LEVEL_HELP[level]}\n        onChange={(event) => onChange(event.target.value as DebugLevel)}\n      >\n        {SELECTABLE_LEVELS.map((option) => (\n          <option key={option} value={option} title={LEVEL_HELP[option]}>\n            {option}\n          </option>\n        ))}\n      </select>\n    </label>\n  );\n}\n\nfunction ConnectionDot({\n  connected,\n  error,\n}: {\n  connected: boolean;\n  error?: string | undefined;\n}) {\n  return (\n    <span\n      className=\"flex items-center gap-density-1 text-muted-foreground text-xs\"\n      title={error ?? (connected ? \"Streaming\" : \"Not connected\")}\n    >\n      <span\n        aria-hidden\n        className={`inline-block size-2 rounded-full ${connected ? \"bg-green-500\" : \"bg-muted-foreground/40\"}`}\n      />\n      {connected ? \"live\" : \"offline\"}\n    </span>\n  );\n}\n"],"names":["debugStore","useState","useMemo","jsxs","jsx","Tabs","IconButton","UiTrash","DebugClient","UiClose","QueriesTab","NetworkTab","ConsoleTab","InspectionTab","LEVEL_HELP","SELECTABLE_LEVELS"],"mappings":"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"}

package/dist/devtools/DebugConsole.d.ts

@@ -0,0 +1,23 @@
+import { DebugClient } from './debugClient';
+import { DebugStore, DebugStoreState } from './debugStore';
+import { DebugTab } from './types';
+export type { DebugTab };
+/**
+ * The console itself: a header that says what is being captured and at what
+ * cost, and one of four tabs below it.
+ *
+ * Three tabs are scoped to a selected capture and one is not. Queries is the
+ * list; Network and Inspection explain the row you picked from it; Console is
+ * the process tail, which belongs to the server rather than to any one request.
+ */
+export type DebugConsoleProps = {
+    state: DebugStoreState;
+    store?: DebugStore | undefined;
+    client?: DebugClient | undefined;
+    onClose?: (() => void) | undefined;
+    /** Controlled tab, so the host can deep-link into one. */
+    tab?: DebugTab | undefined;
+    onTabChange?: ((tab: DebugTab) => void) | undefined;
+};
+export declare function DebugConsole({ state, store, client, onClose, tab: controlledTab, onTabChange, }: DebugConsoleProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DebugConsole.d.ts.map

package/dist/devtools/DebugConsole.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugConsole.d.ts","sourceRoot":"","sources":["../../src/devtools/DebugConsole.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAc,KAAK,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAKjF,OAAO,EAIL,KAAK,QAAQ,EAEd,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,QAAQ,EAAE,CAAC;AAEzB;;;;;;;GAOG;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,eAAe,CAAC;IACvB,KAAK,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IAC/B,MAAM,CAAC,EAAE,WAAW,GAAG,SAAS,CAAC;IACjC,OAAO,CAAC,EAAE,CAAC,MAAM,IAAI,CAAC,GAAG,SAAS,CAAC;IACnC,0DAA0D;IAC1D,GAAG,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,CAAC,CAAC,GAAG,EAAE,QAAQ,KAAK,IAAI,CAAC,GAAG,SAAS,CAAC;CACrD,CAAC;AAEF,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,KAAkB,EAClB,MAAM,EACN,OAAO,EACP,GAAG,EAAE,aAAa,EAClB,WAAW,GACZ,EAAE,iBAAiB,2CA6EnB"}

package/dist/devtools/DebugConsole.js

@@ -0,0 +1,138 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState, useMemo } from "react";
+import { IconButton } from "../components/IconButton.js";
+import { Tabs } from "../layout/Tabs.js";
+import { DebugClient } from "./debugClient.js";
+import { debugStore } from "./debugStore.js";
+import { ConsoleTab } from "./tabs/ConsoleTab.js";
+import { InspectionTab } from "./tabs/InspectionTab.js";
+import { NetworkTab } from "./tabs/NetworkTab.js";
+import { QueriesTab } from "./tabs/QueriesTab.js";
+import { LEVEL_HELP, SELECTABLE_LEVELS } from "./types.js";
+import { UiTrash } from "../icons/components/UiTrash.js";
+import { UiClose } from "../icons/components/UiClose.js";
+function DebugConsole({
+  state,
+  store = debugStore,
+  client,
+  onClose,
+  tab: controlledTab,
+  onTabChange
+}) {
+  const [uncontrolledTab, setUncontrolledTab] = useState("queries");
+  const tab = controlledTab ?? uncontrolledTab;
+  const selectTab = (next) => {
+    setUncontrolledTab(next);
+    onTabChange == null ? void 0 : onTabChange(next);
+  };
+  const [selectedId, setSelectedId] = useState();
+  const selected = useSelectedRecord(state.records, selectedId);
+  const tabs = useMemo(
+    () => [
+      { id: "queries", label: "Queries", count: state.records.length },
+      { id: "network", label: "Network", count: (selected == null ? void 0 : selected.counts.harEntries) ?? 0 },
+      { id: "console", label: "Console", count: state.logs.length },
+      {
+        id: "inspection",
+        label: "Inspection",
+        count: ((selected == null ? void 0 : selected.counts.inspections) ?? 0) + ((selected == null ? void 0 : selected.counts.probes) ?? 0)
+      }
+    ],
+    [state.records.length, state.logs.length, selected]
+  );
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-0 flex-col bg-background", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-center gap-density-3 border-border border-b px-density-3", children: [
+      /* @__PURE__ */ jsx(Tabs, { tabs, value: tab, onChange: (id) => selectTab(id), className: "flex-1" }),
+      /* @__PURE__ */ jsx(LevelPicker, { level: state.level, onChange: (level) => store.setLevel(level) }),
+      /* @__PURE__ */ jsx(ConnectionDot, { connected: state.connected, error: state.streamError }),
+      /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          icon: UiTrash,
+          label: "Clear captures",
+          iconClassName: "size-4",
+          onClick: () => {
+            store.clear();
+            void (client ?? new DebugClient()).clear().catch(() => {
+            });
+          }
+        }
+      ),
+      onClose ? /* @__PURE__ */ jsx(IconButton, { icon: UiClose, label: "Close console", iconClassName: "size-4", onClick: onClose }) : null
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden", children: [
+      tab === "queries" ? /* @__PURE__ */ jsx(
+        QueriesTab,
+        {
+          records: state.records,
+          client,
+          onSelect: (record) => setSelectedId(record.id)
+        }
+      ) : null,
+      tab === "network" ? /* @__PURE__ */ jsx(NetworkTab, { record: selected, client }) : null,
+      tab === "console" ? /* @__PURE__ */ jsx(ConsoleTab, { lines: state.logs }) : null,
+      tab === "inspection" ? /* @__PURE__ */ jsx(
+        InspectionTab,
+        {
+          record: selected,
+          client,
+          refreshInspection: state.refreshInspection,
+          onRefreshInspectionChange: (refresh) => store.setRefreshInspection(refresh)
+        }
+      ) : null
+    ] })
+  ] });
+}
+function useSelectedRecord(records, selectedId) {
+  return useMemo(() => {
+    if (selectedId) {
+      const found = records.find((record) => record.id === selectedId);
+      if (found) return found;
+    }
+    return records[records.length - 1];
+  }, [records, selectedId]);
+}
+function LevelPicker({
+  level,
+  onChange
+}) {
+  return /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-density-1 text-xs", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Capture" }),
+    /* @__PURE__ */ jsx(
+      "select",
+      {
+        className: "rounded border border-border bg-background px-density-1 py-0.5 font-mono text-xs",
+        value: level,
+        title: LEVEL_HELP[level],
+        onChange: (event) => onChange(event.target.value),
+        children: SELECTABLE_LEVELS.map((option) => /* @__PURE__ */ jsx("option", { value: option, title: LEVEL_HELP[option], children: option }, option))
+      }
+    )
+  ] });
+}
+function ConnectionDot({
+  connected,
+  error
+}) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: "flex items-center gap-density-1 text-muted-foreground text-xs",
+      title: error ?? (connected ? "Streaming" : "Not connected"),
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: `inline-block size-2 rounded-full ${connected ? "bg-green-500" : "bg-muted-foreground/40"}`
+          }
+        ),
+        connected ? "live" : "offline"
+      ]
+    }
+  );
+}
+export {
+  DebugConsole
+};
+//# sourceMappingURL=DebugConsole.js.map

package/dist/devtools/DebugConsole.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugConsole.js","sources":["../../src/devtools/DebugConsole.tsx"],"sourcesContent":["import { useMemo, useState } from \"react\";\nimport { IconButton } from \"../components/IconButton\";\nimport { UiClose, UiTrash } from \"../icons\";\nimport { Tabs, type TabItem } from \"../layout/Tabs\";\nimport { DebugClient } from \"./debugClient\";\nimport { debugStore, type DebugStore, type DebugStoreState } from \"./debugStore\";\nimport { ConsoleTab } from \"./tabs/ConsoleTab\";\nimport { InspectionTab } from \"./tabs/InspectionTab\";\nimport { NetworkTab } from \"./tabs/NetworkTab\";\nimport { QueriesTab } from \"./tabs/QueriesTab\";\nimport {\n  LEVEL_HELP,\n  SELECTABLE_LEVELS,\n  type DebugLevel,\n  type DebugTab,\n  type ExecutionSummary,\n} from \"./types\";\n\nexport type { DebugTab };\n\n/**\n * The console itself: a header that says what is being captured and at what\n * cost, and one of four tabs below it.\n *\n * Three tabs are scoped to a selected capture and one is not. Queries is the\n * list; Network and Inspection explain the row you picked from it; Console is\n * the process tail, which belongs to the server rather than to any one request.\n */\n\nexport type DebugConsoleProps = {\n  state: DebugStoreState;\n  store?: DebugStore | undefined;\n  client?: DebugClient | undefined;\n  onClose?: (() => void) | undefined;\n  /** Controlled tab, so the host can deep-link into one. */\n  tab?: DebugTab | undefined;\n  onTabChange?: ((tab: DebugTab) => void) | undefined;\n};\n\nexport function DebugConsole({\n  state,\n  store = debugStore,\n  client,\n  onClose,\n  tab: controlledTab,\n  onTabChange,\n}: DebugConsoleProps) {\n  const [uncontrolledTab, setUncontrolledTab] = useState<DebugTab>(\"queries\");\n  const tab = controlledTab ?? uncontrolledTab;\n  const selectTab = (next: DebugTab) => {\n    setUncontrolledTab(next);\n    onTabChange?.(next);\n  };\n\n  const [selectedId, setSelectedId] = useState<string | undefined>();\n  const selected = useSelectedRecord(state.records, selectedId);\n\n  const tabs: TabItem[] = useMemo(\n    () => [\n      { id: \"queries\", label: \"Queries\", count: state.records.length },\n      { id: \"network\", label: \"Network\", count: selected?.counts.harEntries ?? 0 },\n      { id: \"console\", label: \"Console\", count: state.logs.length },\n      {\n        id: \"inspection\",\n        label: \"Inspection\",\n        count: (selected?.counts.inspections ?? 0) + (selected?.counts.probes ?? 0),\n      },\n    ],\n    [state.records.length, state.logs.length, selected],\n  );\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col bg-background\">\n      <div className=\"flex shrink-0 items-center gap-density-3 border-border border-b px-density-3\">\n        <Tabs tabs={tabs} value={tab} onChange={(id) => selectTab(id as DebugTab)} className=\"flex-1\" />\n\n        <LevelPicker level={state.level} onChange={(level) => store.setLevel(level)} />\n\n        <ConnectionDot connected={state.connected} error={state.streamError} />\n\n        <IconButton\n          icon={UiTrash}\n          label=\"Clear captures\"\n          iconClassName=\"size-4\"\n          onClick={() => {\n            store.clear();\n            void (client ?? new DebugClient()).clear().catch(() => {\n              // The server's buffer outliving the client's view is a cosmetic\n              // mismatch, not a reason to fail the click the user just made.\n            });\n          }}\n        />\n        {onClose ? (\n          <IconButton icon={UiClose} label=\"Close console\" iconClassName=\"size-4\" onClick={onClose} />\n        ) : null}\n      </div>\n\n      {/* A bounded flex column. Every tab below hands its height to a component\n          that scrolls internally (DataTable, LogsTable, HarPanel), and each of\n          those sizes itself as `flex-1 min-h-0` — which needs a flex parent with\n          a definite height, or it resolves to content height and the console\n          body grows instead of scrolling. */}\n      <div className=\"flex min-h-0 flex-1 flex-col overflow-hidden\">\n        {tab === \"queries\" ? (\n          <QueriesTab\n            records={state.records}\n            client={client}\n            onSelect={(record) => setSelectedId(record.id)}\n          />\n        ) : null}\n        {tab === \"network\" ? <NetworkTab record={selected} client={client} /> : null}\n        {tab === \"console\" ? <ConsoleTab lines={state.logs} /> : null}\n        {tab === \"inspection\" ? (\n          <InspectionTab\n            record={selected}\n            client={client}\n            refreshInspection={state.refreshInspection}\n            onRefreshInspectionChange={(refresh) => store.setRefreshInspection(refresh)}\n          />\n        ) : null}\n      </div>\n    </div>\n  );\n}\n\n/**\n * The selected capture, falling back to the most recent one.\n *\n * Without the fallback, Network and Inspection open empty on a console that is\n * plainly full of rows, which reads as a broken tab rather than as \"pick one\".\n */\nfunction useSelectedRecord(\n  records: ExecutionSummary[],\n  selectedId: string | undefined,\n): ExecutionSummary | undefined {\n  return useMemo(() => {\n    if (selectedId) {\n      const found = records.find((record) => record.id === selectedId);\n      if (found) return found;\n    }\n    return records[records.length - 1];\n  }, [records, selectedId]);\n}\n\nfunction LevelPicker({\n  level,\n  onChange,\n}: {\n  level: DebugLevel;\n  onChange: (level: DebugLevel) => void;\n}) {\n  return (\n    <label className=\"flex items-center gap-density-1 text-xs\">\n      <span className=\"text-muted-foreground\">Capture</span>\n      <select\n        className=\"rounded border border-border bg-background px-density-1 py-0.5 font-mono text-xs\"\n        value={level}\n        title={LEVEL_HELP[level]}\n        onChange={(event) => onChange(event.target.value as DebugLevel)}\n      >\n        {SELECTABLE_LEVELS.map((option) => (\n          <option key={option} value={option} title={LEVEL_HELP[option]}>\n            {option}\n          </option>\n        ))}\n      </select>\n    </label>\n  );\n}\n\nfunction ConnectionDot({\n  connected,\n  error,\n}: {\n  connected: boolean;\n  error?: string | undefined;\n}) {\n  return (\n    <span\n      className=\"flex items-center gap-density-1 text-muted-foreground text-xs\"\n      title={error ?? (connected ? \"Streaming\" : \"Not connected\")}\n    >\n      <span\n        aria-hidden\n        className={`inline-block size-2 rounded-full ${connected ? \"bg-green-500\" : \"bg-muted-foreground/40\"}`}\n      />\n      {connected ? \"live\" : \"offline\"}\n    </span>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/devtools/DebugConsoleButton.cjs

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const debugConsoleSignal = require("../data/debugConsoleSignal.cjs");
+const utils = require("../lib/utils.cjs");
+const debugStore = require("./debugStore.cjs");
+const UiDebug = require("../icons/components/UiDebug.cjs");
+function DebugConsoleButton({
+  label = "Debug console",
+  className,
+  store = debugStore.debugStore
+}) {
+  const open = react.useSyncExternalStore(debugConsoleSignal.subscribeToDebugConsole, debugConsoleSignal.debugConsoleOpen, () => false);
+  const state = react.useSyncExternalStore(store.subscribe, store.getSnapshot, store.getSnapshot);
+  const failures = state.records.filter(hasFailed).length;
+  const badge = failures > 0 ? failures : state.records.length;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      "aria-label": label,
+      "aria-pressed": open,
+      title: triggerTitle(state.records.length, failures, open),
+      onClick: () => debugConsoleSignal.revealDebugConsole({ toggle: true }),
+      className: utils.cn(
+        "relative inline-flex size-9 shrink-0 items-center justify-center rounded-md bg-transparent text-foreground transition-colors hover:bg-accent",
+        open && "bg-accent",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(UiDebug.UiDebug, { className: "size-5", "aria-hidden": true }),
+        badge > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: utils.cn(
+              "-right-0.5 -top-0.5 absolute min-w-4 rounded-full px-1 text-[10px] leading-4 tabular-nums",
+              failures > 0 ? "bg-destructive text-destructive-foreground" : "bg-muted text-muted-foreground"
+            ),
+            children: badge > 99 ? "99+" : badge
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function hasFailed(record) {
+  return Boolean(record.error) || record.status !== void 0 && record.status >= 400;
+}
+function triggerTitle(records, failures, open) {
+  const action = open ? "Hide" : "Show";
+  if (records === 0) return `${action} the debug console`;
+  const captures = `${records} capture${records === 1 ? "" : "s"}`;
+  if (failures === 0) return `${action} the debug console — ${captures}`;
+  return `${action} the debug console — ${captures}, ${failures} failed`;
+}
+exports.DebugConsoleButton = DebugConsoleButton;
+//# sourceMappingURL=DebugConsoleButton.cjs.map

package/dist/devtools/DebugConsoleButton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugConsoleButton.cjs","sources":["../../src/devtools/DebugConsoleButton.tsx"],"sourcesContent":["import { useSyncExternalStore } from \"react\";\nimport {\n  debugConsoleOpen,\n  revealDebugConsole,\n  subscribeToDebugConsole,\n} from \"../data/debugConsoleSignal\";\nimport { UiDebug } from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport { debugStore, type DebugStore } from \"./debugStore\";\n\n/**\n * The console's trigger, styled as navbar chrome for AppShell's actions slot.\n *\n * It replaced a collapsed status bar pinned under the page. The bar cost a\n * strip of every screen to say something only a developer wants, and it sat\n * where a page's own footer belongs; the navbar is where an app's other global\n * affordances already are, beside the chat trigger.\n *\n * The badge is what the bar was actually for. A trigger that says nothing gives\n * no reason to press it — \"3 errors\" does.\n */\n\nexport type DebugConsoleButtonProps = {\n  label?: string | undefined;\n  className?: string | undefined;\n  /** The capture store to count. Defaults to the shared one the dock streams into. */\n  store?: DebugStore | undefined;\n};\n\nexport function DebugConsoleButton({\n  label = \"Debug console\",\n  className,\n  store = debugStore,\n}: DebugConsoleButtonProps) {\n  const open = useSyncExternalStore(subscribeToDebugConsole, debugConsoleOpen, () => false);\n  const state = useSyncExternalStore(store.subscribe, store.getSnapshot, store.getSnapshot);\n  const failures = state.records.filter(hasFailed).length;\n  const badge = failures > 0 ? failures : state.records.length;\n\n  return (\n    <button\n      type=\"button\"\n      aria-label={label}\n      aria-pressed={open}\n      title={triggerTitle(state.records.length, failures, open)}\n      onClick={() => revealDebugConsole({ toggle: true })}\n      className={cn(\n        \"relative inline-flex size-9 shrink-0 items-center justify-center rounded-md bg-transparent text-foreground transition-colors hover:bg-accent\",\n        open && \"bg-accent\",\n        className,\n      )}\n    >\n      <UiDebug className=\"size-5\" aria-hidden />\n      {badge > 0 ? (\n        <span\n          aria-hidden\n          className={cn(\n            \"-right-0.5 -top-0.5 absolute min-w-4 rounded-full px-1 text-[10px] leading-4 tabular-nums\",\n            failures > 0\n              ? \"bg-destructive text-destructive-foreground\"\n              : \"bg-muted text-muted-foreground\",\n          )}\n        >\n          {badge > 99 ? \"99+\" : badge}\n        </span>\n      ) : null}\n    </button>\n  );\n}\n\n/**\n * A failed capture is either one the transport reported an error for or one\n * whose status came back 4xx/5xx — a record can carry the second without the\n * first when the handler wrote the status itself.\n */\nfunction hasFailed(record: { error?: string | undefined; status?: number | undefined }): boolean {\n  return Boolean(record.error) || (record.status !== undefined && record.status >= 400);\n}\n\nfunction triggerTitle(records: number, failures: number, open: boolean): string {\n  const action = open ? \"Hide\" : \"Show\";\n  if (records === 0) return `${action} the debug console`;\n  const captures = `${records} capture${records === 1 ? \"\" : \"s\"}`;\n  if (failures === 0) return `${action} the debug console — ${captures}`;\n  return `${action} the debug console — ${captures}, ${failures} failed`;\n}\n"],"names":["debugStore","useSyncExternalStore","subscribeToDebugConsole","debugConsoleOpen","jsxs","revealDebugConsole","cn","jsx","UiDebug"],"mappings":";;;;;;;;AA6BO,SAAS,mBAAmB;AAAA,EACjC,QAAQ;AAAA,EACR;AAAA,EACA,QAAQA,WAAAA;AACV,GAA4B;AAC1B,QAAM,OAAOC,MAAAA,qBAAqBC,mBAAAA,yBAAyBC,mBAAAA,kBAAkB,MAAM,KAAK;AACxF,QAAM,QAAQF,MAAAA,qBAAqB,MAAM,WAAW,MAAM,aAAa,MAAM,WAAW;AACxF,QAAM,WAAW,MAAM,QAAQ,OAAO,SAAS,EAAE;AACjD,QAAM,QAAQ,WAAW,IAAI,WAAW,MAAM,QAAQ;AAEtD,SACEG,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,gBAAc;AAAA,MACd,OAAO,aAAa,MAAM,QAAQ,QAAQ,UAAU,IAAI;AAAA,MACxD,SAAS,MAAMC,mBAAAA,mBAAmB,EAAE,QAAQ,MAAM;AAAA,MAClD,WAAWC,MAAAA;AAAAA,QACT;AAAA,QACA,QAAQ;AAAA,QACR;AAAA,MAAA;AAAA,MAGF,UAAA;AAAA,QAAAC,2BAAAA,IAACC,QAAAA,SAAA,EAAQ,WAAU,UAAS,eAAW,MAAC;AAAA,QACvC,QAAQ,IACPD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,eAAW;AAAA,YACX,WAAWD,MAAAA;AAAAA,cACT;AAAA,cACA,WAAW,IACP,+CACA;AAAA,YAAA;AAAA,YAGL,UAAA,QAAQ,KAAK,QAAQ;AAAA,UAAA;AAAA,QAAA,IAEtB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGV;AAOA,SAAS,UAAU,QAA8E;AAC/F,SAAO,QAAQ,OAAO,KAAK,KAAM,OAAO,WAAW,UAAa,OAAO,UAAU;AACnF;AAEA,SAAS,aAAa,SAAiB,UAAkB,MAAuB;AAC9E,QAAM,SAAS,OAAO,SAAS;AAC/B,MAAI,YAAY,EAAG,QAAO,GAAG,MAAM;AACnC,QAAM,WAAW,GAAG,OAAO,WAAW,YAAY,IAAI,KAAK,GAAG;AAC9D,MAAI,aAAa,EAAG,QAAO,GAAG,MAAM,wBAAwB,QAAQ;AACpE,SAAO,GAAG,MAAM,wBAAwB,QAAQ,KAAK,QAAQ;AAC/D;;"}

package/dist/devtools/DebugConsoleButton.d.ts

@@ -0,0 +1,20 @@
+import { DebugStore } from './debugStore';
+/**
+ * The console's trigger, styled as navbar chrome for AppShell's actions slot.
+ *
+ * It replaced a collapsed status bar pinned under the page. The bar cost a
+ * strip of every screen to say something only a developer wants, and it sat
+ * where a page's own footer belongs; the navbar is where an app's other global
+ * affordances already are, beside the chat trigger.
+ *
+ * The badge is what the bar was actually for. A trigger that says nothing gives
+ * no reason to press it — "3 errors" does.
+ */
+export type DebugConsoleButtonProps = {
+    label?: string | undefined;
+    className?: string | undefined;
+    /** The capture store to count. Defaults to the shared one the dock streams into. */
+    store?: DebugStore | undefined;
+};
+export declare function DebugConsoleButton({ label, className, store, }: DebugConsoleButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DebugConsoleButton.d.ts.map

package/dist/devtools/DebugConsoleButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugConsoleButton.d.ts","sourceRoot":"","sources":["../../src/devtools/DebugConsoleButton.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAc,KAAK,UAAU,EAAE,MAAM,cAAc,CAAC;AAE3D;;;;;;;;;;GAUG;AAEH,MAAM,MAAM,uBAAuB,GAAG;IACpC,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,oFAAoF;IACpF,KAAK,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;CAChC,CAAC;AAEF,wBAAgB,kBAAkB,CAAC,EACjC,KAAuB,EACvB,SAAS,EACT,KAAkB,GACnB,EAAE,uBAAuB,2CAmCzB"}

package/dist/devtools/DebugConsoleButton.js

@@ -0,0 +1,59 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useSyncExternalStore } from "react";
+import { subscribeToDebugConsole, debugConsoleOpen, revealDebugConsole } from "../data/debugConsoleSignal.js";
+import { cn } from "../lib/utils.js";
+import { debugStore } from "./debugStore.js";
+import { UiDebug } from "../icons/components/UiDebug.js";
+function DebugConsoleButton({
+  label = "Debug console",
+  className,
+  store = debugStore
+}) {
+  const open = useSyncExternalStore(subscribeToDebugConsole, debugConsoleOpen, () => false);
+  const state = useSyncExternalStore(store.subscribe, store.getSnapshot, store.getSnapshot);
+  const failures = state.records.filter(hasFailed).length;
+  const badge = failures > 0 ? failures : state.records.length;
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      "aria-label": label,
+      "aria-pressed": open,
+      title: triggerTitle(state.records.length, failures, open),
+      onClick: () => revealDebugConsole({ toggle: true }),
+      className: cn(
+        "relative inline-flex size-9 shrink-0 items-center justify-center rounded-md bg-transparent text-foreground transition-colors hover:bg-accent",
+        open && "bg-accent",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(UiDebug, { className: "size-5", "aria-hidden": true }),
+        badge > 0 ? /* @__PURE__ */ jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: cn(
+              "-right-0.5 -top-0.5 absolute min-w-4 rounded-full px-1 text-[10px] leading-4 tabular-nums",
+              failures > 0 ? "bg-destructive text-destructive-foreground" : "bg-muted text-muted-foreground"
+            ),
+            children: badge > 99 ? "99+" : badge
+          }
+        ) : null
+      ]
+    }
+  );
+}
+function hasFailed(record) {
+  return Boolean(record.error) || record.status !== void 0 && record.status >= 400;
+}
+function triggerTitle(records, failures, open) {
+  const action = open ? "Hide" : "Show";
+  if (records === 0) return `${action} the debug console`;
+  const captures = `${records} capture${records === 1 ? "" : "s"}`;
+  if (failures === 0) return `${action} the debug console — ${captures}`;
+  return `${action} the debug console — ${captures}, ${failures} failed`;
+}
+export {
+  DebugConsoleButton
+};
+//# sourceMappingURL=DebugConsoleButton.js.map

package/dist/devtools/DebugConsoleButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugConsoleButton.js","sources":["../../src/devtools/DebugConsoleButton.tsx"],"sourcesContent":["import { useSyncExternalStore } from \"react\";\nimport {\n  debugConsoleOpen,\n  revealDebugConsole,\n  subscribeToDebugConsole,\n} from \"../data/debugConsoleSignal\";\nimport { UiDebug } from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport { debugStore, type DebugStore } from \"./debugStore\";\n\n/**\n * The console's trigger, styled as navbar chrome for AppShell's actions slot.\n *\n * It replaced a collapsed status bar pinned under the page. The bar cost a\n * strip of every screen to say something only a developer wants, and it sat\n * where a page's own footer belongs; the navbar is where an app's other global\n * affordances already are, beside the chat trigger.\n *\n * The badge is what the bar was actually for. A trigger that says nothing gives\n * no reason to press it — \"3 errors\" does.\n */\n\nexport type DebugConsoleButtonProps = {\n  label?: string | undefined;\n  className?: string | undefined;\n  /** The capture store to count. Defaults to the shared one the dock streams into. */\n  store?: DebugStore | undefined;\n};\n\nexport function DebugConsoleButton({\n  label = \"Debug console\",\n  className,\n  store = debugStore,\n}: DebugConsoleButtonProps) {\n  const open = useSyncExternalStore(subscribeToDebugConsole, debugConsoleOpen, () => false);\n  const state = useSyncExternalStore(store.subscribe, store.getSnapshot, store.getSnapshot);\n  const failures = state.records.filter(hasFailed).length;\n  const badge = failures > 0 ? failures : state.records.length;\n\n  return (\n    <button\n      type=\"button\"\n      aria-label={label}\n      aria-pressed={open}\n      title={triggerTitle(state.records.length, failures, open)}\n      onClick={() => revealDebugConsole({ toggle: true })}\n      className={cn(\n        \"relative inline-flex size-9 shrink-0 items-center justify-center rounded-md bg-transparent text-foreground transition-colors hover:bg-accent\",\n        open && \"bg-accent\",\n        className,\n      )}\n    >\n      <UiDebug className=\"size-5\" aria-hidden />\n      {badge > 0 ? (\n        <span\n          aria-hidden\n          className={cn(\n            \"-right-0.5 -top-0.5 absolute min-w-4 rounded-full px-1 text-[10px] leading-4 tabular-nums\",\n            failures > 0\n              ? \"bg-destructive text-destructive-foreground\"\n              : \"bg-muted text-muted-foreground\",\n          )}\n        >\n          {badge > 99 ? \"99+\" : badge}\n        </span>\n      ) : null}\n    </button>\n  );\n}\n\n/**\n * A failed capture is either one the transport reported an error for or one\n * whose status came back 4xx/5xx — a record can carry the second without the\n * first when the handler wrote the status itself.\n */\nfunction hasFailed(record: { error?: string | undefined; status?: number | undefined }): boolean {\n  return Boolean(record.error) || (record.status !== undefined && record.status >= 400);\n}\n\nfunction triggerTitle(records: number, failures: number, open: boolean): string {\n  const action = open ? \"Hide\" : \"Show\";\n  if (records === 0) return `${action} the debug console`;\n  const captures = `${records} capture${records === 1 ? \"\" : \"s\"}`;\n  if (failures === 0) return `${action} the debug console — ${captures}`;\n  return `${action} the debug console — ${captures}, ${failures} failed`;\n}\n"],"names":[],"mappings":";;;;;;AA6BO,SAAS,mBAAmB;AAAA,EACjC,QAAQ;AAAA,EACR;AAAA,EACA,QAAQ;AACV,GAA4B;AAC1B,QAAM,OAAO,qBAAqB,yBAAyB,kBAAkB,MAAM,KAAK;AACxF,QAAM,QAAQ,qBAAqB,MAAM,WAAW,MAAM,aAAa,MAAM,WAAW;AACxF,QAAM,WAAW,MAAM,QAAQ,OAAO,SAAS,EAAE;AACjD,QAAM,QAAQ,WAAW,IAAI,WAAW,MAAM,QAAQ;AAEtD,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,gBAAc;AAAA,MACd,OAAO,aAAa,MAAM,QAAQ,QAAQ,UAAU,IAAI;AAAA,MACxD,SAAS,MAAM,mBAAmB,EAAE,QAAQ,MAAM;AAAA,MAClD,WAAW;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QACR;AAAA,MAAA;AAAA,MAGF,UAAA;AAAA,QAAA,oBAAC,SAAA,EAAQ,WAAU,UAAS,eAAW,MAAC;AAAA,QACvC,QAAQ,IACP;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,eAAW;AAAA,YACX,WAAW;AAAA,cACT;AAAA,cACA,WAAW,IACP,+CACA;AAAA,YAAA;AAAA,YAGL,UAAA,QAAQ,KAAK,QAAQ;AAAA,UAAA;AAAA,QAAA,IAEtB;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGV;AAOA,SAAS,UAAU,QAA8E;AAC/F,SAAO,QAAQ,OAAO,KAAK,KAAM,OAAO,WAAW,UAAa,OAAO,UAAU;AACnF;AAEA,SAAS,aAAa,SAAiB,UAAkB,MAAuB;AAC9E,QAAM,SAAS,OAAO,SAAS;AAC/B,MAAI,YAAY,EAAG,QAAO,GAAG,MAAM;AACnC,QAAM,WAAW,GAAG,OAAO,WAAW,YAAY,IAAI,KAAK,GAAG;AAC9D,MAAI,aAAa,EAAG,QAAO,GAAG,MAAM,wBAAwB,QAAQ;AACpE,SAAO,GAAG,MAAM,wBAAwB,QAAQ,KAAK,QAAQ;AAC/D;"}