@principal-ade/code-quality-panels 0.1.25 → 0.1.26

package/dist/panels.bundle.js

@@ -370,7 +370,16 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "issues",
     description: "Pluggable linting utility for JavaScript and TypeScript",
-    command: "eslint"
+    command: "eslint",
+    fileMetricsRequirements: {
+      completeCommand: "npx eslint . --format json",
+      requiredFlags: ["--format json"],
+      formatFlag: "--format json",
+      withoutConfig: "Only files with issues are reported in the output",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: false,
+      notes: "ESLint JSON output only includes files that have issues. Clean files are not listed."
+    }
   },
   {
     id: "biome-lint",
@@ -382,7 +391,16 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "issues",
     description: "Fast linter for JavaScript and TypeScript",
-    command: "biome lint"
+    command: "biome lint",
+    fileMetricsRequirements: {
+      completeCommand: "npx @biomejs/biome lint . --reporter=json",
+      requiredFlags: ["--reporter=json"],
+      formatFlag: "--reporter=json",
+      withoutConfig: "Output cannot be parsed for file metrics",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: true,
+      notes: "Biome JSON output includes all analyzed files."
+    }
   },
   {
     id: "oxlint",
@@ -394,7 +412,15 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "issues",
     description: "Blazing fast JavaScript/TypeScript linter",
-    command: "oxlint"
+    command: "oxlint",
+    fileMetricsRequirements: {
+      completeCommand: "npx oxlint --format json",
+      requiredFlags: ["--format json"],
+      formatFlag: "--format json",
+      withoutConfig: "Output cannot be parsed for file metrics",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: false
+    }
   },
   // Python linting
   {
@@ -407,7 +433,16 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "issues",
     description: "Extremely fast Python linter",
-    command: "ruff check"
+    command: "ruff check",
+    fileMetricsRequirements: {
+      completeCommand: "ruff check . --output-format=json",
+      requiredFlags: ["--output-format=json"],
+      formatFlag: "--output-format=json",
+      withoutConfig: "Output cannot be parsed for file metrics",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: false,
+      notes: "Ruff JSON output only includes files with issues."
+    }
   },
   {
     id: "pylint",
@@ -418,7 +453,15 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "issues",
     description: "Python static code analyzer",
-    command: "pylint"
+    command: "pylint",
+    fileMetricsRequirements: {
+      completeCommand: "pylint --output-format=json .",
+      requiredFlags: ["--output-format=json"],
+      formatFlag: "--output-format=json",
+      withoutConfig: "Output cannot be parsed for file metrics",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: false
+    }
   },
   // Go linting
   {
@@ -457,7 +500,15 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "binary",
     description: "Opinionated code formatter",
-    command: "prettier --check"
+    command: "prettier --check",
+    fileMetricsRequirements: {
+      completeCommand: "npx prettier --check . --no-error-on-unmatched-pattern --log-level debug",
+      requiredFlags: ["--check", "--log-level debug"],
+      withoutConfig: "Without --log-level debug, file list is not available",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: true,
+      notes: "Prettier with --log-level debug lists all checked files. This is the reference implementation for complete file metrics."
+    }
   },
   {
     id: "biome-format",
@@ -469,7 +520,15 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "binary",
     description: "Fast code formatter for JavaScript and TypeScript",
-    command: "biome format"
+    command: "biome format",
+    fileMetricsRequirements: {
+      completeCommand: "npx @biomejs/biome format . --reporter=json",
+      requiredFlags: ["--reporter=json"],
+      formatFlag: "--reporter=json",
+      withoutConfig: "Output cannot be parsed for file metrics",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: true
+    }
   },
   // Python formatting
   {
@@ -532,7 +591,15 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "issues",
     description: "TypeScript type checker",
-    command: "tsc --noEmit"
+    command: "tsc --noEmit",
+    fileMetricsRequirements: {
+      completeCommand: "npx tsc --noEmit --listFiles",
+      requiredFlags: ["--listFiles"],
+      withoutConfig: "Only files with type errors are reported. Cannot determine total files analyzed.",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: false,
+      notes: "The --listFiles flag is REQUIRED to get the complete list of files TypeScript analyzed. Without it, only files with errors appear in output."
+    }
   },
   // Python type checking
   {
@@ -583,7 +650,16 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "coverage",
     description: "JavaScript testing framework",
-    command: "jest --coverage"
+    command: "jest --coverage",
+    fileMetricsRequirements: {
+      completeCommand: "npx jest --coverage --json --outputFile=jest-results.json",
+      requiredFlags: ["--coverage", "--json"],
+      formatFlag: "--json",
+      withoutConfig: "Without --coverage, no per-file coverage data is available. Without --json, output cannot be parsed.",
+      fallbackStrategy: "coverage-only",
+      nativelyComplete: false,
+      notes: "Jest coverage data provides per-file metrics for source files. Test file results are separate from source coverage."
+    }
   },
   {
     id: "vitest",
@@ -595,7 +671,16 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "coverage",
     description: "Vite-native testing framework",
-    command: "vitest run --coverage"
+    command: "vitest run --coverage",
+    fileMetricsRequirements: {
+      completeCommand: "npx vitest run --coverage --reporter=json",
+      requiredFlags: ["--coverage", "--reporter=json"],
+      formatFlag: "--reporter=json",
+      withoutConfig: "Without --coverage, no per-file coverage data is available",
+      fallbackStrategy: "coverage-only",
+      nativelyComplete: false,
+      notes: "Vitest coverage provides per-file metrics. Requires @vitest/coverage-v8 or @vitest/coverage-istanbul."
+    }
   },
   {
     id: "bun-test",
@@ -607,7 +692,15 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "coverage",
     description: "Bun native test runner",
-    command: "bun test"
+    command: "bun test",
+    fileMetricsRequirements: {
+      completeCommand: "bun test --coverage",
+      requiredFlags: ["--coverage"],
+      withoutConfig: "Without --coverage, no per-file coverage data is available",
+      fallbackStrategy: "coverage-only",
+      nativelyComplete: false,
+      notes: "Bun test coverage is built-in but requires --coverage flag."
+    }
   },
   // Python testing
   {
@@ -658,7 +751,16 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "issues",
     description: "Find unused files, dependencies and exports",
-    command: "knip"
+    command: "knip",
+    fileMetricsRequirements: {
+      completeCommand: "npx knip --reporter json",
+      requiredFlags: ["--reporter json"],
+      formatFlag: "--reporter json",
+      withoutConfig: "Output cannot be parsed for file metrics",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: false,
+      notes: "Knip reports unused files and exports. It does not list all analyzed files, only those with issues."
+    }
   },
   // Python
   {
@@ -684,7 +786,16 @@ var LENS_REGISTRY = [
     outputsAggregate: true,
     colorScheme: "binary",
     description: "Documentation coverage checker",
-    command: "alexandria lint"
+    command: "alexandria lint",
+    fileMetricsRequirements: {
+      completeCommand: "npx @principal-ai/alexandria-cli coverage --json",
+      requiredFlags: ["--json"],
+      formatFlag: "--json",
+      withoutConfig: "Output cannot be parsed for file metrics",
+      fallbackStrategy: "source-file-count",
+      nativelyComplete: true,
+      notes: "Alexandria reports documentation coverage for all analyzed files."
+    }
   },
   {
     id: "typedoc",
@@ -1544,7 +1655,10 @@ function QualityHexagonExpandable({
                 },
                 children: metricConfig.map(({ key, label }) => {
                   const value = metrics[key];
-                  const configured = isMetricConfigured(key, lensesRan);
+                  const configured = isMetricConfigured(
+                    key,
+                    lensesRan
+                  );
                   return /* @__PURE__ */ jsxs(
                     "div",
                     {
@@ -2179,7 +2293,10 @@ const LEGACY_FALLBACKS = {
 function getColorModeForMetric(metric, lensesRan) {
   if (!isValidHexagonMetric(metric)) return null;
   const hexagonMetric = metric;
-  const colorMode = getColorModeForHexagonMetric(hexagonMetric, lensesRan ?? []);
+  const colorMode = getColorModeForHexagonMetric(
+    hexagonMetric,
+    lensesRan ?? []
+  );
   if (!colorMode && lensesRan === void 0) {
     return LEGACY_FALLBACKS[hexagonMetric] ?? null;
   }
@@ -2413,7 +2530,10 @@ const QualityHexagonPanelContent = ({
                         });
                       },
                       onMetricClick: (metric) => {
-                        const colorMode = getColorModeForMetric(metric, pkg.lensesRan);
+                        const colorMode = getColorModeForMetric(
+                          metric,
+                          pkg.lensesRan
+                        );
                         if (colorMode) {
                           events.emit({
                             type: "quality:colorMode:select",
@@ -3236,10 +3356,25 @@ function LensDataDebugPanel$1({
   const [expandedFiles, setExpandedFiles] = React2.useState(
     /* @__PURE__ */ new Set()
   );
+  const [expandedAnalyzedFiles, setExpandedAnalyzedFiles] = React2.useState(/* @__PURE__ */ new Set());
+  React2.useEffect(() => {
+    if (initialSelectedPackage) {
+      setSelectedPackage((current) => {
+        if (current !== initialSelectedPackage) {
+          setExpandedLens(null);
+          setExpandedFiles(/* @__PURE__ */ new Set());
+          setExpandedAnalyzedFiles(/* @__PURE__ */ new Set());
+          return initialSelectedPackage;
+        }
+        return current;
+      });
+    }
+  }, [initialSelectedPackage]);
   const handlePackageSelect = (pkg) => {
     setSelectedPackage(pkg);
     setExpandedLens(null);
     setExpandedFiles(/* @__PURE__ */ new Set());
+    setExpandedAnalyzedFiles(/* @__PURE__ */ new Set());
     onPackageSelect == null ? void 0 : onPackageSelect(pkg);
   };
   const toggleLens = (lensId) => {
@@ -3255,6 +3390,15 @@ function LensDataDebugPanel$1({
     }
     setExpandedFiles(newSet);
   };
+  const toggleAnalyzedFiles = (lensKey) => {
+    const newSet = new Set(expandedAnalyzedFiles);
+    if (newSet.has(lensKey)) {
+      newSet.delete(lensKey);
+    } else {
+      newSet.add(lensKey);
+    }
+    setExpandedAnalyzedFiles(newSet);
+  };
   const selectedResults = selectedPackage ? packageGroups.get(selectedPackage) || [] : [];
   return /* @__PURE__ */ jsxs(
     "div",
@@ -3270,62 +3414,7 @@ function LensDataDebugPanel$1({
         fontSize: 13
       },
       children: [
-        packageNames.length > 1 && /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              display: "flex",
-              flexWrap: "wrap",
-              gap: 8,
-              marginBottom: 8
-            },
-            children: packageNames.map((pkg) => {
-              const summary = getPackageSummary(packageGroups.get(pkg) || []);
-              const isSelected = selectedPackage === pkg;
-              return /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  onClick: () => handlePackageSelect(pkg),
-                  style: {
-                    display: "flex",
-                    alignItems: "center",
-                    gap: 8,
-                    padding: "8px 12px",
-                    borderRadius: 6,
-                    border: `1px solid ${isSelected ? theme.colors.primary : theme.colors.border}`,
-                    backgroundColor: isSelected ? theme.colors.surface : "transparent",
-                    color: theme.colors.text,
-                    cursor: "pointer",
-                    transition: "all 0.15s ease"
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx("span", { style: { fontWeight: 500 }, children: pkg }),
-                    /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        style: {
-                          fontSize: 11,
-                          padding: "2px 6px",
-                          borderRadius: 4,
-                          backgroundColor: summary.totalErrors > 0 ? getSeverityBg("error") : summary.totalWarnings > 0 ? getSeverityBg("warning") : "rgba(34, 197, 94, 0.1)",
-                          color: summary.totalErrors > 0 ? getSeverityColor("error") : summary.totalWarnings > 0 ? getSeverityColor("warning") : "#22c55e"
-                        },
-                        children: [
-                          summary.passCount,
-                          "/",
-                          summary.lensCount,
-                          " pass"
-                        ]
-                      }
-                    )
-                  ]
-                },
-                pkg
-              );
-            })
-          }
-        ),
-        packageNames.length === 1 && /* @__PURE__ */ jsxs(
+        selectedPackage && !onPackageSelect && /* @__PURE__ */ jsxs(
           "div",
           {
             style: {
@@ -3338,7 +3427,26 @@ function LensDataDebugPanel$1({
               marginBottom: 8
             },
             children: [
-              /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: theme.colors.text }, children: packageNames[0] }),
+              packageNames.length > 1 ? /* @__PURE__ */ jsx(
+                "select",
+                {
+                  value: selectedPackage,
+                  onChange: (e) => handlePackageSelect(e.target.value),
+                  style: {
+                    padding: "4px 8px",
+                    borderRadius: 4,
+                    border: `1px solid ${theme.colors.border}`,
+                    backgroundColor: theme.colors.background,
+                    color: theme.colors.text,
+                    fontFamily: "monospace",
+                    fontSize: 13,
+                    fontWeight: 600,
+                    cursor: "pointer",
+                    outline: "none"
+                  },
+                  children: packageNames.map((pkg) => /* @__PURE__ */ jsx("option", { value: pkg, children: pkg }, pkg))
+                }
+              ) : /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: theme.colors.text }, children: selectedPackage }),
               (() => {
                 const summary = getPackageSummary(selectedResults);
                 return /* @__PURE__ */ jsxs(
@@ -3363,21 +3471,8 @@ function LensDataDebugPanel$1({
             ]
           }
         ),
-        !selectedPackage && packageNames.length > 1 && /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              padding: 24,
-              textAlign: "center",
-              color: theme.colors.textMuted,
-              backgroundColor: theme.colors.surface,
-              borderRadius: 6
-            },
-            children: "Select a package above to view lens results"
-          }
-        ),
         selectedPackage && selectedResults.map((result, idx) => {
-          var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s;
+          var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
           const lensKey = `${((_a = result.lens) == null ? void 0 : _a.id) ?? "unknown"}-${idx}`;
           const isExpanded = expandedLens === lensKey;
           const filesWithIssues = getFilesWithIssues(result.issues ?? []);
@@ -3600,6 +3695,149 @@ function LensDataDebugPanel$1({
                           ]
                         }
                       ),
+                      result.coverage && /* @__PURE__ */ jsxs("div", { style: { marginTop: 16 }, children: [
+                        /* @__PURE__ */ jsx(
+                          "div",
+                          {
+                            style: {
+                              fontSize: 12,
+                              fontWeight: 600,
+                              color: theme.colors.textMuted,
+                              marginBottom: 8
+                            },
+                            children: "Coverage Data"
+                          }
+                        ),
+                        /* @__PURE__ */ jsxs(
+                          "div",
+                          {
+                            style: {
+                              padding: 12,
+                              backgroundColor: theme.colors.surface,
+                              borderRadius: 4
+                            },
+                            children: [
+                              /* @__PURE__ */ jsxs(
+                                "div",
+                                {
+                                  style: {
+                                    display: "grid",
+                                    gridTemplateColumns: "repeat(auto-fit, minmax(100px, 1fr))",
+                                    gap: 12,
+                                    marginBottom: 12
+                                  },
+                                  children: [
+                                    /* @__PURE__ */ jsxs("div", { children: [
+                                      /* @__PURE__ */ jsx(
+                                        "div",
+                                        {
+                                          style: {
+                                            fontSize: 11,
+                                            color: theme.colors.textMuted
+                                          },
+                                          children: "Line"
+                                        }
+                                      ),
+                                      /* @__PURE__ */ jsxs("div", { style: { fontSize: 14, fontWeight: 600 }, children: [
+                                        result.coverage.line,
+                                        "%"
+                                      ] })
+                                    ] }),
+                                    result.coverage.branch !== void 0 && /* @__PURE__ */ jsxs("div", { children: [
+                                      /* @__PURE__ */ jsx(
+                                        "div",
+                                        {
+                                          style: {
+                                            fontSize: 11,
+                                            color: theme.colors.textMuted
+                                          },
+                                          children: "Branch"
+                                        }
+                                      ),
+                                      /* @__PURE__ */ jsxs("div", { style: { fontSize: 14, fontWeight: 600 }, children: [
+                                        result.coverage.branch,
+                                        "%"
+                                      ] })
+                                    ] }),
+                                    result.coverage.function !== void 0 && /* @__PURE__ */ jsxs("div", { children: [
+                                      /* @__PURE__ */ jsx(
+                                        "div",
+                                        {
+                                          style: {
+                                            fontSize: 11,
+                                            color: theme.colors.textMuted
+                                          },
+                                          children: "Function"
+                                        }
+                                      ),
+                                      /* @__PURE__ */ jsxs("div", { style: { fontSize: 14, fontWeight: 600 }, children: [
+                                        result.coverage.function,
+                                        "%"
+                                      ] })
+                                    ] }),
+                                    result.coverage.statement !== void 0 && /* @__PURE__ */ jsxs("div", { children: [
+                                      /* @__PURE__ */ jsx(
+                                        "div",
+                                        {
+                                          style: {
+                                            fontSize: 11,
+                                            color: theme.colors.textMuted
+                                          },
+                                          children: "Statement"
+                                        }
+                                      ),
+                                      /* @__PURE__ */ jsxs("div", { style: { fontSize: 14, fontWeight: 600 }, children: [
+                                        result.coverage.statement,
+                                        "%"
+                                      ] })
+                                    ] })
+                                  ]
+                                }
+                              ),
+                              /* @__PURE__ */ jsxs(
+                                "div",
+                                {
+                                  style: {
+                                    padding: 8,
+                                    borderRadius: 4,
+                                    backgroundColor: ((_t = result.coverage.files) == null ? void 0 : _t.length) ? "rgba(34, 197, 94, 0.1)" : "rgba(239, 68, 68, 0.1)",
+                                    border: `1px solid ${((_u = result.coverage.files) == null ? void 0 : _u.length) ? "#22c55e" : "#ef4444"}`
+                                  },
+                                  children: [
+                                    /* @__PURE__ */ jsxs(
+                                      "div",
+                                      {
+                                        style: {
+                                          fontSize: 12,
+                                          fontWeight: 500,
+                                          color: ((_v = result.coverage.files) == null ? void 0 : _v.length) ? "#22c55e" : "#ef4444"
+                                        },
+                                        children: [
+                                          "coverage.files: ",
+                                          ((_w = result.coverage.files) == null ? void 0 : _w.length) ?? 0,
+                                          " ",
+                                          "entries"
+                                        ]
+                                      }
+                                    ),
+                                    !((_x = result.coverage.files) == null ? void 0 : _x.length) && /* @__PURE__ */ jsx(
+                                      "div",
+                                      {
+                                        style: {
+                                          fontSize: 11,
+                                          color: "#ef4444",
+                                          marginTop: 4
+                                        },
+                                        children: "Warning: Coverage won't appear on map visualization!"
+                                      }
+                                    )
+                                  ]
+                                }
+                              )
+                            ]
+                          }
+                        )
+                      ] }),
                       filesWithIssues.size > 0 ? /* @__PURE__ */ jsxs("div", { children: [
                         /* @__PURE__ */ jsxs(
                           "div",
@@ -3888,6 +4126,98 @@ function LensDataDebugPanel$1({
                             ))
                           }
                         )
+                      ] }),
+                      result.analyzedFiles && result.analyzedFiles.length > 0 && /* @__PURE__ */ jsxs("div", { style: { marginTop: 16 }, children: [
+                        /* @__PURE__ */ jsxs(
+                          "div",
+                          {
+                            onClick: () => toggleAnalyzedFiles(lensKey),
+                            style: {
+                              fontSize: 12,
+                              fontWeight: 600,
+                              color: theme.colors.textMuted,
+                              marginBottom: 8,
+                              cursor: "pointer",
+                              display: "flex",
+                              alignItems: "center",
+                              gap: 6
+                            },
+                            children: [
+                              /* @__PURE__ */ jsx(
+                                "svg",
+                                {
+                                  width: "12",
+                                  height: "12",
+                                  viewBox: "0 0 24 24",
+                                  fill: "none",
+                                  stroke: "currentColor",
+                                  strokeWidth: "2",
+                                  style: {
+                                    transform: expandedAnalyzedFiles.has(lensKey) ? "rotate(90deg)" : "rotate(0deg)",
+                                    transition: "transform 0.15s ease"
+                                  },
+                                  children: /* @__PURE__ */ jsx("polyline", { points: "9,18 15,12 9,6" })
+                                }
+                              ),
+                              "Analyzed Files (",
+                              result.analyzedFiles.length,
+                              ")"
+                            ]
+                          }
+                        ),
+                        expandedAnalyzedFiles.has(lensKey) && /* @__PURE__ */ jsx(
+                          "div",
+                          {
+                            style: {
+                              maxHeight: 300,
+                              overflow: "auto",
+                              padding: 8,
+                              backgroundColor: theme.colors.surface,
+                              borderRadius: 4
+                            },
+                            children: result.analyzedFiles.map((file, idx2) => /* @__PURE__ */ jsxs(
+                              "div",
+                              {
+                                style: {
+                                  display: "flex",
+                                  alignItems: "center",
+                                  justifyContent: "space-between",
+                                  padding: "4px 8px",
+                                  fontSize: 12,
+                                  borderRadius: 2,
+                                  backgroundColor: file.hasIssues ? "rgba(239, 68, 68, 0.05)" : "transparent"
+                                },
+                                children: [
+                                  /* @__PURE__ */ jsx(
+                                    "span",
+                                    {
+                                      style: {
+                                        color: theme.colors.text,
+                                        cursor: onFileClick ? "pointer" : "default"
+                                      },
+                                      onClick: () => onFileClick == null ? void 0 : onFileClick(file.path),
+                                      children: file.path
+                                    }
+                                  ),
+                                  file.hasIssues && /* @__PURE__ */ jsx(
+                                    "span",
+                                    {
+                                      style: {
+                                        fontSize: 10,
+                                        color: "#ef4444",
+                                        padding: "1px 4px",
+                                        borderRadius: 2,
+                                        backgroundColor: "rgba(239, 68, 68, 0.1)"
+                                      },
+                                      children: "issues"
+                                    }
+                                  )
+                                ]
+                              },
+                              idx2
+                            ))
+                          }
+                        )
                       ] })
                     ]
                   }
@@ -3903,15 +4233,54 @@ function LensDataDebugPanel$1({
 }
 const LensDataDebugPanelContent = ({
   context,
-  actions
+  actions,
+  events
 }) => {
+  var _a;
   const { theme } = useTheme();
+  const [selectedPackage, setSelectedPackage] = React2__default.useState(
+    null
+  );
   const lensResultsSlice = context.getSlice("lensResults");
   const hasSlice = context.hasSlice("lensResults");
   const isLoading = (lensResultsSlice == null ? void 0 : lensResultsSlice.loading) ?? false;
+  const { packageNames, packagePathMap } = React2__default.useMemo(() => {
+    var _a2;
+    if (!((_a2 = lensResultsSlice == null ? void 0 : lensResultsSlice.data) == null ? void 0 : _a2.results))
+      return { packageNames: [], packagePathMap: /* @__PURE__ */ new Map() };
+    const names = /* @__PURE__ */ new Set();
+    const pathMap = /* @__PURE__ */ new Map();
+    lensResultsSlice.data.results.forEach((r2) => {
+      var _a3, _b;
+      const name = ((_a3 = r2.package) == null ? void 0 : _a3.name) ?? "unknown";
+      const path = ((_b = r2.package) == null ? void 0 : _b.path) ?? "";
+      names.add(name);
+      if (path) pathMap.set(path, name);
+      pathMap.set(name, name);
+    });
+    return { packageNames: Array.from(names), packagePathMap: pathMap };
+  }, [(_a = lensResultsSlice == null ? void 0 : lensResultsSlice.data) == null ? void 0 : _a.results]);
+  React2__default.useEffect(() => {
+    if (packageNames.length > 0 && !selectedPackage) {
+      setSelectedPackage(packageNames[0]);
+    }
+  }, [packageNames, selectedPackage]);
+  React2__default.useEffect(() => {
+    if (!events) return;
+    const cleanup = events.on("package:select", (event) => {
+      const payload = event.payload;
+      if (!payload) return;
+      const matchedPackage = packagePathMap.get(payload.packagePath) ?? packagePathMap.get(payload.packageName) ?? // Also try matching the last segment of the path
+      packagePathMap.get(payload.packagePath.split("/").pop() ?? "");
+      if (matchedPackage) {
+        setSelectedPackage(matchedPackage);
+      }
+    });
+    return cleanup;
+  }, [events, packagePathMap]);
   const handleFileClick = (file, line) => {
-    var _a, _b, _c;
-    const repoPath = (_a = context.currentScope.repository) == null ? void 0 : _a.path;
+    var _a2, _b, _c;
+    const repoPath = (_a2 = context.currentScope.repository) == null ? void 0 : _a2.path;
     const fullPath = repoPath ? `${repoPath}/${file}` : file;
     if (line) {
       (_b = actions.openFile) == null ? void 0 : _b.call(actions, `${fullPath}:${line}`);
@@ -3963,34 +4332,34 @@ const LensDataDebugPanelContent = ({
                   }
                 )
               ] }),
-              (lensResultsSlice == null ? void 0 : lensResultsSlice.data) && /* @__PURE__ */ jsxs(
+              (lensResultsSlice == null ? void 0 : lensResultsSlice.data) && packageNames.length > 0 && /* @__PURE__ */ jsx(
                 "div",
                 {
                   style: {
                     display: "flex",
                     alignItems: "center",
                     gap: 12,
-                    fontSize: 11,
-                    color: theme.colors.textMuted
+                    fontSize: 12
                   },
-                  children: [
-                    /* @__PURE__ */ jsxs("span", { children: [
-                      new Set(
-                        lensResultsSlice.data.results.map(
-                          (r2) => {
-                            var _a;
-                            return ((_a = r2.package) == null ? void 0 : _a.name) ?? "unknown";
-                          }
-                        )
-                      ).size,
-                      " ",
-                      "packages"
-                    ] }),
-                    /* @__PURE__ */ jsxs("span", { children: [
-                      lensResultsSlice.data.results.length,
-                      " results"
-                    ] })
-                  ]
+                  children: packageNames.length > 1 ? /* @__PURE__ */ jsx(
+                    "select",
+                    {
+                      value: selectedPackage ?? "",
+                      onChange: (e) => setSelectedPackage(e.target.value),
+                      style: {
+                        padding: "4px 8px",
+                        borderRadius: 4,
+                        border: `1px solid ${theme.colors.border}`,
+                        backgroundColor: theme.colors.surface,
+                        color: theme.colors.text,
+                        fontFamily: theme.fonts.body,
+                        fontSize: 12,
+                        cursor: "pointer",
+                        outline: "none"
+                      },
+                      children: packageNames.map((pkg) => /* @__PURE__ */ jsx("option", { value: pkg, children: pkg }, pkg))
+                    }
+                  ) : /* @__PURE__ */ jsx("span", { style: { color: theme.colors.textMuted }, children: packageNames[0] })
                 }
               )
             ]
@@ -4040,7 +4409,9 @@ const LensDataDebugPanelContent = ({
               {
                 data: lensResultsSlice.data,
                 theme,
-                onFileClick: handleFileClick
+                onFileClick: handleFileClick,
+                selectedPackage: selectedPackage ?? void 0,
+                onPackageSelect: setSelectedPackage
               }
             )
           }