@principal-ade/code-quality-panels 0.1.15 → 0.1.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/dist/panels.bundle.js +1060 -48
  2. package/dist/panels.bundle.js.map +1 -1
  3. package/dist/src/components/LensDataDebugPanel.d.ts +93 -0
  4. package/dist/src/components/LensDataDebugPanel.d.ts.map +1 -0
  5. package/dist/src/components/LensDataDebugPanel.stories.d.ts +31 -0
  6. package/dist/src/components/LensDataDebugPanel.stories.d.ts.map +1 -0
  7. package/dist/src/components/QualityEmptyState.d.ts +22 -0
  8. package/dist/src/components/QualityEmptyState.d.ts.map +1 -0
  9. package/dist/src/components/QualityHexagon.d.ts +52 -0
  10. package/dist/src/components/QualityHexagon.d.ts.map +1 -0
  11. package/dist/src/components/QualityHexagon.stories.d.ts +54 -0
  12. package/dist/src/components/QualityHexagon.stories.d.ts.map +1 -0
  13. package/dist/src/components/QualityMetricsList.d.ts +21 -0
  14. package/dist/src/components/QualityMetricsList.d.ts.map +1 -0
  15. package/dist/src/components/QualityMetricsList.stories.d.ts +33 -0
  16. package/dist/src/components/QualityMetricsList.stories.d.ts.map +1 -0
  17. package/dist/src/components/RepositoryQualityGrid.d.ts +84 -0
  18. package/dist/src/components/RepositoryQualityGrid.d.ts.map +1 -0
  19. package/dist/src/components/RepositoryQualityGrid.stories.d.ts +45 -0
  20. package/dist/src/components/RepositoryQualityGrid.stories.d.ts.map +1 -0
  21. package/dist/src/components/index.d.ts +6 -0
  22. package/dist/src/components/index.d.ts.map +1 -0
  23. package/dist/src/index.d.ts +21 -0
  24. package/dist/src/index.d.ts.map +1 -0
  25. package/dist/src/lib/utils.d.ts +3 -0
  26. package/dist/src/lib/utils.d.ts.map +1 -0
  27. package/dist/src/mocks/panelContext.d.ts +33 -0
  28. package/dist/src/mocks/panelContext.d.ts.map +1 -0
  29. package/dist/src/panels/LensDataDebugPanel.d.ts +13 -0
  30. package/dist/src/panels/LensDataDebugPanel.d.ts.map +1 -0
  31. package/dist/src/panels/LensDataDebugPanel.stories.d.ts +46 -0
  32. package/dist/src/panels/LensDataDebugPanel.stories.d.ts.map +1 -0
  33. package/dist/src/panels/QualityHexagonPanel.d.ts +7 -0
  34. package/dist/src/panels/QualityHexagonPanel.d.ts.map +1 -0
  35. package/dist/src/panels/QualityHexagonPanel.stories.d.ts +64 -0
  36. package/dist/src/panels/QualityHexagonPanel.stories.d.ts.map +1 -0
  37. package/dist/src/panels/RepositoryQualityGridPanel.d.ts +8 -0
  38. package/dist/src/panels/RepositoryQualityGridPanel.d.ts.map +1 -0
  39. package/dist/src/panels/RepositoryQualityGridPanel.stories.d.ts +26 -0
  40. package/dist/src/panels/RepositoryQualityGridPanel.stories.d.ts.map +1 -0
  41. package/dist/src/tools/index.d.ts +7 -0
  42. package/dist/src/tools/index.d.ts.map +1 -0
  43. package/dist/src/types/index.d.ts +7 -0
  44. package/dist/src/types/index.d.ts.map +1 -0
  45. package/dist/tools.bundle.js +7 -0
  46. package/package.json +4 -4
@@ -106,7 +106,7 @@ const createLucideIcon = (iconName, iconNode) => {
106
106
  * This source code is licensed under the ISC license.
107
107
  * See the LICENSE file in the root directory of this source tree.
108
108
  */
109
- const __iconNode$d = [
109
+ const __iconNode$e = [
110
110
  ["path", { d: "M12 7v14", key: "1akyts" }],
111
111
  [
112
112
  "path",
@@ -116,14 +116,14 @@ const __iconNode$d = [
116
116
  }
117
117
  ]
118
118
  ];
119
- const BookOpen = createLucideIcon("book-open", __iconNode$d);
119
+ const BookOpen = createLucideIcon("book-open", __iconNode$e);
120
120
  /**
121
121
  * @license lucide-react v0.552.0 - ISC
122
122
  *
123
123
  * This source code is licensed under the ISC license.
124
124
  * See the LICENSE file in the root directory of this source tree.
125
125
  */
126
- const __iconNode$c = [
126
+ const __iconNode$d = [
127
127
  [
128
128
  "path",
129
129
  { d: "M8 3H7a2 2 0 0 0-2 2v5a2 2 0 0 1-2 2 2 2 0 0 1 2 2v5c0 1.1.9 2 2 2h1", key: "ezmyqa" }
@@ -136,7 +136,27 @@ const __iconNode$c = [
136
136
  }
137
137
  ]
138
138
  ];
139
- const Braces = createLucideIcon("braces", __iconNode$c);
139
+ const Braces = createLucideIcon("braces", __iconNode$d);
140
+ /**
141
+ * @license lucide-react v0.552.0 - ISC
142
+ *
143
+ * This source code is licensed under the ISC license.
144
+ * See the LICENSE file in the root directory of this source tree.
145
+ */
146
+ const __iconNode$c = [
147
+ ["path", { d: "M12 20v-9", key: "1qisl0" }],
148
+ ["path", { d: "M14 7a4 4 0 0 1 4 4v3a6 6 0 0 1-12 0v-3a4 4 0 0 1 4-4z", key: "uouzyp" }],
149
+ ["path", { d: "M14.12 3.88 16 2", key: "qol33r" }],
150
+ ["path", { d: "M21 21a4 4 0 0 0-3.81-4", key: "1b0z45" }],
151
+ ["path", { d: "M21 5a4 4 0 0 1-3.55 3.97", key: "5cxbf6" }],
152
+ ["path", { d: "M22 13h-4", key: "1jl80f" }],
153
+ ["path", { d: "M3 21a4 4 0 0 1 3.81-4", key: "1fjd4g" }],
154
+ ["path", { d: "M3 5a4 4 0 0 0 3.55 3.97", key: "1d7oge" }],
155
+ ["path", { d: "M6 13H2", key: "82j7cp" }],
156
+ ["path", { d: "m8 2 1.88 1.88", key: "fmnt4t" }],
157
+ ["path", { d: "M9 7.13V6a3 3 0 1 1 6 0v1.13", key: "1vgav8" }]
158
+ ];
159
+ const Bug = createLucideIcon("bug", __iconNode$c);
140
160
  /**
141
161
  * @license lucide-react v0.552.0 - ISC
142
162
  *
@@ -348,11 +368,11 @@ function getThemeColors(theme) {
348
368
  textColor: theme.colors.text,
349
369
  scoreColor: theme.colors.text,
350
370
  tierColors: {
351
- none: { fill: theme.colors.muted, stroke: theme.colors.border, bg: theme.colors.backgroundLight },
352
- bronze: { fill: theme.colors.warning, stroke: theme.colors.warning, bg: theme.colors.backgroundLight },
353
- silver: { fill: theme.colors.secondary, stroke: theme.colors.secondary, bg: theme.colors.backgroundLight },
354
- gold: { fill: theme.colors.accent, stroke: theme.colors.accent, bg: theme.colors.backgroundLight },
355
- platinum: { fill: theme.colors.primary, stroke: theme.colors.primary, bg: theme.colors.backgroundLight }
371
+ none: { fill: "#808080", stroke: "#808080", bg: theme.colors.backgroundLight },
372
+ bronze: { fill: "#CD7F32", stroke: "#CD7F32", bg: theme.colors.backgroundLight },
373
+ silver: { fill: "#C0C0C0", stroke: "#C0C0C0", bg: theme.colors.backgroundLight },
374
+ gold: { fill: "#FFD700", stroke: "#FFD700", bg: theme.colors.backgroundLight },
375
+ platinum: { fill: "#E5E4E2", stroke: "#E5E4E2", bg: theme.colors.backgroundLight }
356
376
  },
357
377
  metricColors: {
358
378
  types: theme.colors.warning,
@@ -369,13 +389,19 @@ function getThemeColors(theme) {
369
389
  }
370
390
  };
371
391
  }
392
+ function getValueColor$2(value, key) {
393
+ const effectiveValue = key === "deadCode" ? 100 - value : value;
394
+ if (effectiveValue >= 80) return "#2E7D32";
395
+ if (effectiveValue >= 60) return "#E6A700";
396
+ return "#C62828";
397
+ }
372
398
  const getMetricConfig = (themeColors) => [
373
- { key: "types", label: "Types", color: themeColors.metricColors.types, angle: -120 },
374
- { key: "documentation", label: "Docs", color: themeColors.metricColors.documentation, angle: -60 },
375
- { key: "tests", label: "Tests", color: themeColors.metricColors.tests, angle: 0 },
376
- { key: "deadCode", label: "Dead Code", color: themeColors.metricColors.deadCode, angle: 60 },
377
- { key: "formatting", label: "Format", color: themeColors.metricColors.formatting, angle: 120 },
378
- { key: "linting", label: "Linting", color: themeColors.metricColors.linting, angle: 180 }
399
+ { key: "formatting", label: "Format", color: themeColors.metricColors.formatting, angle: -120 },
400
+ { key: "linting", label: "Linting", color: themeColors.metricColors.linting, angle: -60 },
401
+ { key: "types", label: "Types", color: themeColors.metricColors.types, angle: 0 },
402
+ { key: "tests", label: "Tests", color: themeColors.metricColors.tests, angle: 60 },
403
+ { key: "deadCode", label: "Dead Code", color: themeColors.metricColors.deadCode, angle: 120 },
404
+ { key: "documentation", label: "Docs", color: themeColors.metricColors.documentation, angle: 180 }
379
405
  ];
380
406
  function calculateHexagonPoints(center, radius, metricConfig) {
381
407
  return metricConfig.map(({ angle }) => {
@@ -731,9 +757,8 @@ function QualityHexagonDetailed({
731
757
  showValues: false
732
758
  }
733
759
  ) }),
734
- /* @__PURE__ */ jsx("div", { style: { flex: "1 1 200px", minWidth: 200, display: "flex", flexDirection: "column", gap: 8, padding: "8px 24px" }, children: metricConfig.map(({ key, label, color }) => {
760
+ /* @__PURE__ */ jsx("div", { style: { flex: "1 1 200px", minWidth: 200, display: "flex", flexDirection: "column", gap: 8, padding: "8px 24px" }, children: metricConfig.map(({ key, label }) => {
735
761
  const value = metrics[key];
736
- const displayValue = value;
737
762
  return /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12 }, children: [
738
763
  /* @__PURE__ */ jsxs("span", { style: {
739
764
  fontSize: 14,
@@ -745,9 +770,9 @@ function QualityHexagonDetailed({
745
770
  /* @__PURE__ */ jsxs("span", { style: {
746
771
  fontSize: 14,
747
772
  fontWeight: 500,
748
- color
773
+ color: getValueColor$2(value, key)
749
774
  }, children: [
750
- displayValue,
775
+ value,
751
776
  "%"
752
777
  ] })
753
778
  ] }, key);
@@ -905,7 +930,7 @@ function QualityHexagonExpandable({
905
930
  padding: "8px 24px",
906
931
  borderTop: `1px solid ${theme.colors.border}`,
907
932
  marginTop: 8
908
- }, children: metricConfig.map(({ key, label, color }) => {
933
+ }, children: metricConfig.map(({ key, label }) => {
909
934
  const value = metrics[key];
910
935
  return /* @__PURE__ */ jsxs(
911
936
  "div",
@@ -944,7 +969,7 @@ function QualityHexagonExpandable({
944
969
  /* @__PURE__ */ jsxs("span", { style: {
945
970
  fontSize: 14,
946
971
  fontWeight: 500,
947
- color
972
+ color: getValueColor$2(value, key)
948
973
  }, children: [
949
974
  value,
950
975
  "%"
@@ -1064,10 +1089,10 @@ const CommandLine = ({ command, theme, label }) => {
1064
1089
  };
1065
1090
  const MetricsPreview = ({ theme }) => {
1066
1091
  const metrics = [
1067
- { key: "tests", label: "Tests", description: "Test coverage & pass rate", Icon: FlaskConical },
1092
+ { key: "formatting", label: "Formatting", description: "Prettier code style", Icon: Sparkles },
1068
1093
  { key: "linting", label: "Linting", description: "ESLint code quality", Icon: FileSearch },
1069
1094
  { key: "types", label: "Types", description: "TypeScript type safety", Icon: Braces },
1070
- { key: "formatting", label: "Formatting", description: "Prettier code style", Icon: Sparkles },
1095
+ { key: "tests", label: "Tests", description: "Test coverage & pass rate", Icon: FlaskConical },
1071
1096
  { key: "deadCode", label: "Dead Code", description: "Unused exports & deps", Icon: Trash2 },
1072
1097
  { key: "documentation", label: "Docs", description: "Code documentation", Icon: BookOpen }
1073
1098
  ];
@@ -1483,11 +1508,11 @@ const QualityHexagonPanelContent = ({
1483
1508
  return () => unsubscribers.forEach((unsub) => unsub());
1484
1509
  }, [events, context, packages]);
1485
1510
  const tierColors = {
1486
- none: theme.colors.muted,
1487
- bronze: theme.colors.warning,
1488
- silver: theme.colors.secondary,
1489
- gold: theme.colors.accent,
1490
- platinum: theme.colors.primary
1511
+ none: "#808080",
1512
+ bronze: "#CD7F32",
1513
+ silver: "#C0C0C0",
1514
+ gold: "#FFD700",
1515
+ platinum: "#E5E4E2"
1491
1516
  };
1492
1517
  const overallTier = packages.length > 0 ? calculateQualityTier(
1493
1518
  packages.reduce((acc, pkg) => ({
@@ -1631,12 +1656,12 @@ const QualityHexagonPanelContent = ({
1631
1656
  };
1632
1657
  const QualityHexagonPanel = QualityHexagonPanelContent;
1633
1658
  const METRIC_OPTIONS = [
1659
+ { key: "formatting", label: "Format" },
1660
+ { key: "linting", label: "Linting" },
1634
1661
  { key: "types", label: "Types" },
1635
- { key: "documentation", label: "Docs" },
1636
1662
  { key: "tests", label: "Tests" },
1637
1663
  { key: "deadCode", label: "Dead Code" },
1638
- { key: "formatting", label: "Format" },
1639
- { key: "linting", label: "Linting" }
1664
+ { key: "documentation", label: "Docs" }
1640
1665
  ];
1641
1666
  function flattenRepositories(repositories) {
1642
1667
  const items = [];
@@ -1677,11 +1702,11 @@ function formatLabel(item, showRepositoryName, isSameAsRepo) {
1677
1702
  }
1678
1703
  return `${item.repositoryName} / ${item.packageName}`;
1679
1704
  }
1680
- function getValueColor(value, key, theme) {
1705
+ function getValueColor$1(value, key) {
1681
1706
  const effectiveValue = key === "deadCode" ? 100 - value : value;
1682
- if (effectiveValue >= 80) return theme.colors.success;
1683
- if (effectiveValue >= 60) return theme.colors.warning;
1684
- return theme.colors.error;
1707
+ if (effectiveValue >= 80) return "#2E7D32";
1708
+ if (effectiveValue >= 60) return "#E6A700";
1709
+ return "#C62828";
1685
1710
  }
1686
1711
  function RepositoryQualityGridItem({
1687
1712
  item,
@@ -1696,11 +1721,11 @@ function RepositoryQualityGridItem({
1696
1721
  const isSameAsRepo = item.packageName === item.repositoryName;
1697
1722
  const label = formatLabel(item, showRepositoryName, isSameAsRepo);
1698
1723
  const tierColors = {
1699
- none: theme.colors.muted,
1700
- bronze: theme.colors.warning,
1701
- silver: theme.colors.secondary,
1702
- gold: theme.colors.accent,
1703
- platinum: theme.colors.primary
1724
+ none: "#808080",
1725
+ bronze: "#CD7F32",
1726
+ silver: "#C0C0C0",
1727
+ gold: "#FFD700",
1728
+ platinum: "#E5E4E2"
1704
1729
  };
1705
1730
  const displayInfo = React2.useMemo(() => {
1706
1731
  if (selectedMetric) {
@@ -1710,7 +1735,7 @@ function RepositoryQualityGridItem({
1710
1735
  return {
1711
1736
  label: option.label,
1712
1737
  value,
1713
- valueColor: getValueColor(value, selectedMetric, theme)
1738
+ valueColor: getValueColor$1(value, selectedMetric)
1714
1739
  };
1715
1740
  }
1716
1741
  }
@@ -1718,11 +1743,11 @@ function RepositoryQualityGridItem({
1718
1743
  return {
1719
1744
  label: hoveredVertex.label,
1720
1745
  value: hoveredVertex.value,
1721
- valueColor: getValueColor(hoveredVertex.value, hoveredVertex.key, theme)
1746
+ valueColor: getValueColor$1(hoveredVertex.value, hoveredVertex.key)
1722
1747
  };
1723
1748
  }
1724
1749
  return null;
1725
- }, [selectedMetric, hoveredVertex, item.metrics, theme]);
1750
+ }, [selectedMetric, hoveredVertex, item.metrics]);
1726
1751
  return /* @__PURE__ */ jsxs(
1727
1752
  "div",
1728
1753
  {
@@ -1877,11 +1902,11 @@ function RepositoryQualityGrid({
1877
1902
  });
1878
1903
  }, [items, selectedMetric]);
1879
1904
  const tierColors = {
1880
- none: theme.colors.muted,
1881
- bronze: theme.colors.warning,
1882
- silver: theme.colors.secondary,
1883
- gold: theme.colors.accent,
1884
- platinum: theme.colors.primary
1905
+ none: "#808080",
1906
+ bronze: "#CD7F32",
1907
+ silver: "#C0C0C0",
1908
+ gold: "#FFD700",
1909
+ platinum: "#E5E4E2"
1885
1910
  };
1886
1911
  const tierLabels = {
1887
1912
  none: "No Data",
@@ -2160,6 +2185,963 @@ const RepositoryQualityGridPanelContent = ({
2160
2185
  );
2161
2186
  };
2162
2187
  const RepositoryQualityGridPanel = RepositoryQualityGridPanelContent;
2188
+ function groupResultsByPackage(results) {
2189
+ const map = /* @__PURE__ */ new Map();
2190
+ for (const result of results) {
2191
+ const key = result.package.name;
2192
+ const existing = map.get(key) || [];
2193
+ existing.push(result);
2194
+ map.set(key, existing);
2195
+ }
2196
+ return map;
2197
+ }
2198
+ function getFilesWithIssues(issues) {
2199
+ const fileMap = /* @__PURE__ */ new Map();
2200
+ for (const issue of issues) {
2201
+ if (!issue.file) continue;
2202
+ const existing = fileMap.get(issue.file) || [];
2203
+ existing.push(issue);
2204
+ fileMap.set(issue.file, existing);
2205
+ }
2206
+ return fileMap;
2207
+ }
2208
+ function getSeverityColor(severity) {
2209
+ switch (severity) {
2210
+ case "error":
2211
+ return "#ef4444";
2212
+ case "warning":
2213
+ return "#f59e0b";
2214
+ case "info":
2215
+ return "#3b82f6";
2216
+ case "hint":
2217
+ return "#6b7280";
2218
+ default:
2219
+ return "#6b7280";
2220
+ }
2221
+ }
2222
+ function getSeverityBg(severity) {
2223
+ switch (severity) {
2224
+ case "error":
2225
+ return "rgba(239, 68, 68, 0.1)";
2226
+ case "warning":
2227
+ return "rgba(245, 158, 11, 0.1)";
2228
+ case "info":
2229
+ return "rgba(59, 130, 246, 0.1)";
2230
+ case "hint":
2231
+ return "rgba(107, 114, 128, 0.1)";
2232
+ default:
2233
+ return "rgba(107, 114, 128, 0.1)";
2234
+ }
2235
+ }
2236
+ function getPackageSummary(results) {
2237
+ let totalErrors = 0;
2238
+ let totalWarnings = 0;
2239
+ let passCount = 0;
2240
+ let failCount = 0;
2241
+ for (const result of results) {
2242
+ totalErrors += result.metrics.issuesBySeverity.error;
2243
+ totalWarnings += result.metrics.issuesBySeverity.warning;
2244
+ if (result.execution.success) {
2245
+ passCount++;
2246
+ } else {
2247
+ failCount++;
2248
+ }
2249
+ }
2250
+ return { totalErrors, totalWarnings, passCount, failCount, lensCount: results.length };
2251
+ }
2252
+ function LensDataDebugPanel$1({
2253
+ data,
2254
+ theme,
2255
+ className,
2256
+ selectedPackage: initialSelectedPackage,
2257
+ onFileClick,
2258
+ onPackageSelect
2259
+ }) {
2260
+ const packageGroups = React2.useMemo(() => groupResultsByPackage(data.results), [data.results]);
2261
+ const packageNames = React2.useMemo(() => Array.from(packageGroups.keys()), [packageGroups]);
2262
+ const [selectedPackage, setSelectedPackage] = React2.useState(
2263
+ initialSelectedPackage || (packageNames.length === 1 ? packageNames[0] : null)
2264
+ );
2265
+ const [expandedLens, setExpandedLens] = React2.useState(null);
2266
+ const [expandedFiles, setExpandedFiles] = React2.useState(/* @__PURE__ */ new Set());
2267
+ const handlePackageSelect = (pkg) => {
2268
+ setSelectedPackage(pkg);
2269
+ setExpandedLens(null);
2270
+ setExpandedFiles(/* @__PURE__ */ new Set());
2271
+ onPackageSelect == null ? void 0 : onPackageSelect(pkg);
2272
+ };
2273
+ const toggleLens = (lensId) => {
2274
+ setExpandedLens(expandedLens === lensId ? null : lensId);
2275
+ setExpandedFiles(/* @__PURE__ */ new Set());
2276
+ };
2277
+ const toggleFile = (file) => {
2278
+ const newSet = new Set(expandedFiles);
2279
+ if (newSet.has(file)) {
2280
+ newSet.delete(file);
2281
+ } else {
2282
+ newSet.add(file);
2283
+ }
2284
+ setExpandedFiles(newSet);
2285
+ };
2286
+ const selectedResults = selectedPackage ? packageGroups.get(selectedPackage) || [] : [];
2287
+ return /* @__PURE__ */ jsxs(
2288
+ "div",
2289
+ {
2290
+ className: cn(className),
2291
+ style: {
2292
+ display: "flex",
2293
+ flexDirection: "column",
2294
+ gap: 8,
2295
+ padding: 16,
2296
+ backgroundColor: theme.colors.background,
2297
+ fontFamily: "monospace",
2298
+ fontSize: 13
2299
+ },
2300
+ children: [
2301
+ packageNames.length > 1 && /* @__PURE__ */ jsx("div", { style: {
2302
+ display: "flex",
2303
+ flexWrap: "wrap",
2304
+ gap: 8,
2305
+ marginBottom: 8
2306
+ }, children: packageNames.map((pkg) => {
2307
+ const summary = getPackageSummary(packageGroups.get(pkg) || []);
2308
+ const isSelected = selectedPackage === pkg;
2309
+ return /* @__PURE__ */ jsxs(
2310
+ "button",
2311
+ {
2312
+ onClick: () => handlePackageSelect(pkg),
2313
+ style: {
2314
+ display: "flex",
2315
+ alignItems: "center",
2316
+ gap: 8,
2317
+ padding: "8px 12px",
2318
+ borderRadius: 6,
2319
+ border: `1px solid ${isSelected ? theme.colors.primary : theme.colors.border}`,
2320
+ backgroundColor: isSelected ? theme.colors.surface : "transparent",
2321
+ color: theme.colors.text,
2322
+ cursor: "pointer",
2323
+ transition: "all 0.15s ease"
2324
+ },
2325
+ children: [
2326
+ /* @__PURE__ */ jsx("span", { style: { fontWeight: 500 }, children: pkg }),
2327
+ /* @__PURE__ */ jsxs("span", { style: {
2328
+ fontSize: 11,
2329
+ padding: "2px 6px",
2330
+ borderRadius: 4,
2331
+ backgroundColor: summary.totalErrors > 0 ? getSeverityBg("error") : summary.totalWarnings > 0 ? getSeverityBg("warning") : "rgba(34, 197, 94, 0.1)",
2332
+ color: summary.totalErrors > 0 ? getSeverityColor("error") : summary.totalWarnings > 0 ? getSeverityColor("warning") : "#22c55e"
2333
+ }, children: [
2334
+ summary.passCount,
2335
+ "/",
2336
+ summary.lensCount,
2337
+ " pass"
2338
+ ] })
2339
+ ]
2340
+ },
2341
+ pkg
2342
+ );
2343
+ }) }),
2344
+ packageNames.length === 1 && /* @__PURE__ */ jsxs("div", { style: {
2345
+ display: "flex",
2346
+ alignItems: "center",
2347
+ gap: 12,
2348
+ padding: "8px 12px",
2349
+ backgroundColor: theme.colors.surface,
2350
+ borderRadius: 6,
2351
+ marginBottom: 8
2352
+ }, children: [
2353
+ /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: theme.colors.text }, children: packageNames[0] }),
2354
+ (() => {
2355
+ const summary = getPackageSummary(selectedResults);
2356
+ return /* @__PURE__ */ jsxs("span", { style: {
2357
+ fontSize: 11,
2358
+ padding: "2px 6px",
2359
+ borderRadius: 4,
2360
+ backgroundColor: summary.totalErrors > 0 ? getSeverityBg("error") : summary.totalWarnings > 0 ? getSeverityBg("warning") : "rgba(34, 197, 94, 0.1)",
2361
+ color: summary.totalErrors > 0 ? getSeverityColor("error") : summary.totalWarnings > 0 ? getSeverityColor("warning") : "#22c55e"
2362
+ }, children: [
2363
+ summary.passCount,
2364
+ "/",
2365
+ summary.lensCount,
2366
+ " pass"
2367
+ ] });
2368
+ })()
2369
+ ] }),
2370
+ !selectedPackage && packageNames.length > 1 && /* @__PURE__ */ jsx("div", { style: {
2371
+ padding: 24,
2372
+ textAlign: "center",
2373
+ color: theme.colors.textMuted,
2374
+ backgroundColor: theme.colors.surface,
2375
+ borderRadius: 6
2376
+ }, children: "Select a package above to view lens results" }),
2377
+ selectedPackage && selectedResults.map((result, idx) => {
2378
+ const lensKey = `${result.lens.id}-${idx}`;
2379
+ const isExpanded = expandedLens === lensKey;
2380
+ const filesWithIssues = getFilesWithIssues(result.issues);
2381
+ const hasIssues = result.issues.length > 0;
2382
+ return /* @__PURE__ */ jsxs(
2383
+ "div",
2384
+ {
2385
+ style: {
2386
+ border: `1px solid ${theme.colors.border}`,
2387
+ borderRadius: 6,
2388
+ overflow: "hidden"
2389
+ },
2390
+ children: [
2391
+ /* @__PURE__ */ jsxs(
2392
+ "div",
2393
+ {
2394
+ onClick: () => toggleLens(lensKey),
2395
+ style: {
2396
+ display: "flex",
2397
+ alignItems: "center",
2398
+ justifyContent: "space-between",
2399
+ padding: "10px 12px",
2400
+ backgroundColor: theme.colors.surface,
2401
+ cursor: "pointer",
2402
+ gap: 12
2403
+ },
2404
+ children: [
2405
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 8 }, children: [
2406
+ /* @__PURE__ */ jsx(
2407
+ "svg",
2408
+ {
2409
+ width: "14",
2410
+ height: "14",
2411
+ viewBox: "0 0 24 24",
2412
+ fill: "none",
2413
+ stroke: theme.colors.textMuted,
2414
+ strokeWidth: "2",
2415
+ style: {
2416
+ transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)",
2417
+ transition: "transform 0.15s ease"
2418
+ },
2419
+ children: /* @__PURE__ */ jsx("polyline", { points: "9,18 15,12 9,6" })
2420
+ }
2421
+ ),
2422
+ /* @__PURE__ */ jsx("span", { style: { fontWeight: 600, color: theme.colors.text }, children: result.lens.id }),
2423
+ /* @__PURE__ */ jsxs("span", { style: { color: theme.colors.textMuted }, children: [
2424
+ "(",
2425
+ result.lens.command,
2426
+ ")"
2427
+ ] })
2428
+ ] }),
2429
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
2430
+ /* @__PURE__ */ jsx("span", { style: {
2431
+ padding: "2px 6px",
2432
+ borderRadius: 4,
2433
+ fontSize: 11,
2434
+ backgroundColor: result.execution.success ? "rgba(34, 197, 94, 0.1)" : "rgba(239, 68, 68, 0.1)",
2435
+ color: result.execution.success ? "#22c55e" : "#ef4444"
2436
+ }, children: result.execution.success ? "pass" : "fail" }),
2437
+ hasIssues && /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 6 }, children: [
2438
+ result.metrics.issuesBySeverity.error > 0 && /* @__PURE__ */ jsxs("span", { style: {
2439
+ padding: "2px 6px",
2440
+ borderRadius: 4,
2441
+ fontSize: 11,
2442
+ backgroundColor: getSeverityBg("error"),
2443
+ color: getSeverityColor("error")
2444
+ }, children: [
2445
+ result.metrics.issuesBySeverity.error,
2446
+ " errors"
2447
+ ] }),
2448
+ result.metrics.issuesBySeverity.warning > 0 && /* @__PURE__ */ jsxs("span", { style: {
2449
+ padding: "2px 6px",
2450
+ borderRadius: 4,
2451
+ fontSize: 11,
2452
+ backgroundColor: getSeverityBg("warning"),
2453
+ color: getSeverityColor("warning")
2454
+ }, children: [
2455
+ result.metrics.issuesBySeverity.warning,
2456
+ " warnings"
2457
+ ] })
2458
+ ] }),
2459
+ /* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: theme.colors.textMuted }, children: [
2460
+ result.metrics.filesAnalyzed,
2461
+ " files"
2462
+ ] })
2463
+ ] })
2464
+ ]
2465
+ }
2466
+ ),
2467
+ isExpanded && /* @__PURE__ */ jsxs("div", { style: {
2468
+ padding: 12,
2469
+ backgroundColor: theme.colors.backgroundLight,
2470
+ borderTop: `1px solid ${theme.colors.border}`
2471
+ }, children: [
2472
+ /* @__PURE__ */ jsxs("div", { style: {
2473
+ display: "grid",
2474
+ gridTemplateColumns: "repeat(auto-fit, minmax(120px, 1fr))",
2475
+ gap: 8,
2476
+ marginBottom: 16,
2477
+ padding: 12,
2478
+ backgroundColor: theme.colors.surface,
2479
+ borderRadius: 4
2480
+ }, children: [
2481
+ /* @__PURE__ */ jsxs("div", { children: [
2482
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Files Analyzed" }),
2483
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: result.metrics.filesAnalyzed })
2484
+ ] }),
2485
+ /* @__PURE__ */ jsxs("div", { children: [
2486
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Total Issues" }),
2487
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: result.metrics.totalIssues })
2488
+ ] }),
2489
+ /* @__PURE__ */ jsxs("div", { children: [
2490
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Duration" }),
2491
+ /* @__PURE__ */ jsxs("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: [
2492
+ result.execution.duration || 0,
2493
+ "ms"
2494
+ ] })
2495
+ ] }),
2496
+ result.coverage && /* @__PURE__ */ jsxs("div", { children: [
2497
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 11, color: theme.colors.textMuted }, children: "Coverage" }),
2498
+ /* @__PURE__ */ jsxs("div", { style: { fontSize: 16, fontWeight: 600, color: theme.colors.text }, children: [
2499
+ result.coverage.line,
2500
+ "%"
2501
+ ] })
2502
+ ] })
2503
+ ] }),
2504
+ filesWithIssues.size > 0 ? /* @__PURE__ */ jsxs("div", { children: [
2505
+ /* @__PURE__ */ jsxs("div", { style: {
2506
+ fontSize: 12,
2507
+ fontWeight: 600,
2508
+ color: theme.colors.textMuted,
2509
+ marginBottom: 8
2510
+ }, children: [
2511
+ "Files with Issues (",
2512
+ filesWithIssues.size,
2513
+ ")"
2514
+ ] }),
2515
+ /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: 4 }, children: Array.from(filesWithIssues.entries()).map(([file, issues]) => {
2516
+ const isFileExpanded = expandedFiles.has(file);
2517
+ return /* @__PURE__ */ jsxs(
2518
+ "div",
2519
+ {
2520
+ style: {
2521
+ border: `1px solid ${theme.colors.border}`,
2522
+ borderRadius: 4,
2523
+ overflow: "hidden"
2524
+ },
2525
+ children: [
2526
+ /* @__PURE__ */ jsxs(
2527
+ "div",
2528
+ {
2529
+ onClick: () => toggleFile(file),
2530
+ style: {
2531
+ display: "flex",
2532
+ alignItems: "center",
2533
+ justifyContent: "space-between",
2534
+ padding: "8px 10px",
2535
+ backgroundColor: theme.colors.surface,
2536
+ cursor: "pointer"
2537
+ },
2538
+ children: [
2539
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
2540
+ /* @__PURE__ */ jsx(
2541
+ "svg",
2542
+ {
2543
+ width: "12",
2544
+ height: "12",
2545
+ viewBox: "0 0 24 24",
2546
+ fill: "none",
2547
+ stroke: theme.colors.textMuted,
2548
+ strokeWidth: "2",
2549
+ style: {
2550
+ transform: isFileExpanded ? "rotate(90deg)" : "rotate(0deg)",
2551
+ transition: "transform 0.15s ease"
2552
+ },
2553
+ children: /* @__PURE__ */ jsx("polyline", { points: "9,18 15,12 9,6" })
2554
+ }
2555
+ ),
2556
+ /* @__PURE__ */ jsx(
2557
+ "span",
2558
+ {
2559
+ style: {
2560
+ color: theme.colors.text,
2561
+ cursor: onFileClick ? "pointer" : "default"
2562
+ },
2563
+ onClick: (e) => {
2564
+ if (onFileClick) {
2565
+ e.stopPropagation();
2566
+ onFileClick(file);
2567
+ }
2568
+ },
2569
+ children: file
2570
+ }
2571
+ )
2572
+ ] }),
2573
+ /* @__PURE__ */ jsxs("span", { style: {
2574
+ fontSize: 11,
2575
+ padding: "2px 6px",
2576
+ borderRadius: 4,
2577
+ backgroundColor: getSeverityBg("error"),
2578
+ color: getSeverityColor("error")
2579
+ }, children: [
2580
+ issues.length,
2581
+ " issues"
2582
+ ] })
2583
+ ]
2584
+ }
2585
+ ),
2586
+ isFileExpanded && /* @__PURE__ */ jsx("div", { style: {
2587
+ padding: 8,
2588
+ backgroundColor: theme.colors.background,
2589
+ borderTop: `1px solid ${theme.colors.border}`,
2590
+ maxHeight: 300,
2591
+ overflow: "auto"
2592
+ }, children: issues.map((issue, issueIdx) => /* @__PURE__ */ jsxs(
2593
+ "div",
2594
+ {
2595
+ onClick: () => onFileClick == null ? void 0 : onFileClick(file, issue.line),
2596
+ style: {
2597
+ display: "flex",
2598
+ gap: 8,
2599
+ padding: "6px 8px",
2600
+ borderRadius: 4,
2601
+ cursor: onFileClick ? "pointer" : "default",
2602
+ transition: "background-color 0.1s ease"
2603
+ },
2604
+ onMouseEnter: (e) => {
2605
+ e.currentTarget.style.backgroundColor = theme.colors.surface;
2606
+ },
2607
+ onMouseLeave: (e) => {
2608
+ e.currentTarget.style.backgroundColor = "transparent";
2609
+ },
2610
+ children: [
2611
+ /* @__PURE__ */ jsxs("span", { style: {
2612
+ fontSize: 11,
2613
+ color: theme.colors.textMuted,
2614
+ minWidth: 45
2615
+ }, children: [
2616
+ "L",
2617
+ issue.line
2618
+ ] }),
2619
+ /* @__PURE__ */ jsx("span", { style: {
2620
+ fontSize: 10,
2621
+ padding: "1px 4px",
2622
+ borderRadius: 3,
2623
+ backgroundColor: getSeverityBg(issue.severity),
2624
+ color: getSeverityColor(issue.severity),
2625
+ textTransform: "uppercase"
2626
+ }, children: issue.severity.charAt(0) }),
2627
+ /* @__PURE__ */ jsx("span", { style: {
2628
+ flex: 1,
2629
+ fontSize: 12,
2630
+ color: theme.colors.text
2631
+ }, children: issue.message }),
2632
+ issue.rule && /* @__PURE__ */ jsx("span", { style: {
2633
+ fontSize: 10,
2634
+ color: theme.colors.textMuted,
2635
+ opacity: 0.7
2636
+ }, children: issue.rule })
2637
+ ]
2638
+ },
2639
+ issueIdx
2640
+ )) })
2641
+ ]
2642
+ },
2643
+ file
2644
+ );
2645
+ }) })
2646
+ ] }) : /* @__PURE__ */ jsx("div", { style: {
2647
+ padding: 16,
2648
+ textAlign: "center",
2649
+ color: theme.colors.textMuted,
2650
+ backgroundColor: theme.colors.surface,
2651
+ borderRadius: 4
2652
+ }, children: "No issues found" }),
2653
+ result.fileMetrics && result.fileMetrics.length > 0 && /* @__PURE__ */ jsxs("div", { style: { marginTop: 16 }, children: [
2654
+ /* @__PURE__ */ jsxs("div", { style: {
2655
+ fontSize: 12,
2656
+ fontWeight: 600,
2657
+ color: theme.colors.textMuted,
2658
+ marginBottom: 8
2659
+ }, children: [
2660
+ "File Metrics (",
2661
+ result.fileMetrics.length,
2662
+ ")"
2663
+ ] }),
2664
+ /* @__PURE__ */ jsx("div", { style: {
2665
+ display: "flex",
2666
+ flexDirection: "column",
2667
+ gap: 2,
2668
+ padding: 8,
2669
+ backgroundColor: theme.colors.surface,
2670
+ borderRadius: 4
2671
+ }, children: result.fileMetrics.map((fm, idx2) => /* @__PURE__ */ jsxs(
2672
+ "div",
2673
+ {
2674
+ style: {
2675
+ display: "flex",
2676
+ alignItems: "center",
2677
+ justifyContent: "space-between",
2678
+ padding: "4px 8px"
2679
+ },
2680
+ children: [
2681
+ /* @__PURE__ */ jsx("span", { style: { color: theme.colors.text, fontSize: 12 }, children: fm.file }),
2682
+ /* @__PURE__ */ jsxs("span", { style: {
2683
+ fontSize: 12,
2684
+ fontWeight: 500,
2685
+ color: fm.score >= 80 ? "#22c55e" : fm.score >= 60 ? "#f59e0b" : "#ef4444"
2686
+ }, children: [
2687
+ fm.score,
2688
+ "%"
2689
+ ] })
2690
+ ]
2691
+ },
2692
+ idx2
2693
+ )) })
2694
+ ] })
2695
+ ] })
2696
+ ]
2697
+ },
2698
+ lensKey
2699
+ );
2700
+ })
2701
+ ]
2702
+ }
2703
+ );
2704
+ }
2705
+ const LensDataDebugPanelContent = ({
2706
+ context,
2707
+ actions
2708
+ }) => {
2709
+ var _a, _b, _c;
2710
+ const { theme } = useTheme();
2711
+ const lensResultsSlice = context.getSlice("lensResults");
2712
+ const hasSlice = context.hasSlice("lensResults");
2713
+ const isLoading = (lensResultsSlice == null ? void 0 : lensResultsSlice.loading) ?? false;
2714
+ const handleFileClick = (file, line) => {
2715
+ var _a2, _b2, _c2;
2716
+ const repoPath = (_a2 = context.currentScope.repository) == null ? void 0 : _a2.path;
2717
+ const fullPath = repoPath ? `${repoPath}/${file}` : file;
2718
+ if (line) {
2719
+ (_b2 = actions.openFile) == null ? void 0 : _b2.call(actions, `${fullPath}:${line}`);
2720
+ } else {
2721
+ (_c2 = actions.openFile) == null ? void 0 : _c2.call(actions, fullPath);
2722
+ }
2723
+ };
2724
+ return /* @__PURE__ */ jsxs(
2725
+ "div",
2726
+ {
2727
+ style: {
2728
+ fontFamily: theme.fonts.body,
2729
+ height: "100%",
2730
+ minHeight: 0,
2731
+ backgroundColor: theme.colors.background,
2732
+ color: theme.colors.text,
2733
+ overflowY: "auto",
2734
+ boxSizing: "border-box",
2735
+ display: "flex",
2736
+ flexDirection: "column"
2737
+ },
2738
+ children: [
2739
+ /* @__PURE__ */ jsxs("div", { style: {
2740
+ display: "flex",
2741
+ alignItems: "center",
2742
+ justifyContent: "space-between",
2743
+ height: 40,
2744
+ flexShrink: 0,
2745
+ padding: "0 16px",
2746
+ borderBottom: `1px solid ${theme.colors.border}`,
2747
+ boxSizing: "border-box"
2748
+ }, children: [
2749
+ /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
2750
+ /* @__PURE__ */ jsx(Bug, { size: 18, color: theme.colors.primary }),
2751
+ /* @__PURE__ */ jsx(
2752
+ "h2",
2753
+ {
2754
+ style: {
2755
+ margin: 0,
2756
+ fontSize: 14,
2757
+ fontWeight: 600,
2758
+ color: theme.colors.text
2759
+ },
2760
+ children: "Lens Data Debug"
2761
+ }
2762
+ ),
2763
+ (lensResultsSlice == null ? void 0 : lensResultsSlice.data) && /* @__PURE__ */ jsxs(Fragment, { children: [
2764
+ /* @__PURE__ */ jsx("span", { style: { color: theme.colors.textMuted }, children: "•" }),
2765
+ /* @__PURE__ */ jsxs("span", { style: { fontSize: 12, color: theme.colors.textMuted }, children: [
2766
+ ((_a = lensResultsSlice.data.metadata.git) == null ? void 0 : _a.repository) || "Unknown",
2767
+ " @ ",
2768
+ ((_c = (_b = lensResultsSlice.data.metadata.git) == null ? void 0 : _b.commit) == null ? void 0 : _c.slice(0, 7)) || "?"
2769
+ ] })
2770
+ ] })
2771
+ ] }),
2772
+ (lensResultsSlice == null ? void 0 : lensResultsSlice.data) && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: 12, fontSize: 11, color: theme.colors.textMuted }, children: [
2773
+ /* @__PURE__ */ jsxs("span", { children: [
2774
+ new Set(lensResultsSlice.data.results.map((r2) => r2.package.name)).size,
2775
+ " packages"
2776
+ ] }),
2777
+ /* @__PURE__ */ jsxs("span", { children: [
2778
+ lensResultsSlice.data.results.length,
2779
+ " results"
2780
+ ] })
2781
+ ] })
2782
+ ] }),
2783
+ /* @__PURE__ */ jsx(
2784
+ "div",
2785
+ {
2786
+ style: {
2787
+ flex: 1,
2788
+ minHeight: 0,
2789
+ overflow: "auto"
2790
+ },
2791
+ children: isLoading ? /* @__PURE__ */ jsx("div", { style: {
2792
+ padding: 40,
2793
+ textAlign: "center",
2794
+ color: theme.colors.textMuted
2795
+ }, children: "Loading lens results..." }) : !hasSlice || !(lensResultsSlice == null ? void 0 : lensResultsSlice.data) ? /* @__PURE__ */ jsxs("div", { style: {
2796
+ padding: 40,
2797
+ textAlign: "center",
2798
+ color: theme.colors.textMuted
2799
+ }, children: [
2800
+ /* @__PURE__ */ jsx(Bug, { size: 48, color: theme.colors.border, style: { marginBottom: 16 } }),
2801
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 14, marginBottom: 8 }, children: "No lens data available" }),
2802
+ /* @__PURE__ */ jsx("div", { style: { fontSize: 12 }, children: "Run quality-lens-cli or check that the lensResults slice is configured." })
2803
+ ] }) : /* @__PURE__ */ jsx(
2804
+ LensDataDebugPanel$1,
2805
+ {
2806
+ data: lensResultsSlice.data,
2807
+ theme,
2808
+ onFileClick: handleFileClick
2809
+ }
2810
+ )
2811
+ }
2812
+ )
2813
+ ]
2814
+ }
2815
+ );
2816
+ };
2817
+ const LensDataDebugPanel = LensDataDebugPanelContent;
2818
+ function getValueColor(value, key) {
2819
+ const effectiveValue = key === "deadCode" ? 100 - value : value;
2820
+ if (effectiveValue >= 80) return "#2E7D32";
2821
+ if (effectiveValue >= 60) return "#E6A700";
2822
+ return "#C62828";
2823
+ }
2824
+ function getValueBgColor(value, key) {
2825
+ const effectiveValue = key === "deadCode" ? 100 - value : value;
2826
+ if (effectiveValue >= 80) return "rgba(46, 125, 50, 0.1)";
2827
+ if (effectiveValue >= 60) return "rgba(230, 167, 0, 0.1)";
2828
+ return "rgba(198, 40, 40, 0.1)";
2829
+ }
2830
+ function getMetricIcon(key) {
2831
+ const iconProps = {
2832
+ width: 18,
2833
+ height: 18,
2834
+ viewBox: "0 0 24 24",
2835
+ fill: "none",
2836
+ stroke: "currentColor",
2837
+ strokeWidth: 2,
2838
+ strokeLinecap: "round",
2839
+ strokeLinejoin: "round"
2840
+ };
2841
+ switch (key) {
2842
+ case "types":
2843
+ return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
2844
+ /* @__PURE__ */ jsx("path", { d: "M12 2L2 7l10 5 10-5-10-5z" }),
2845
+ /* @__PURE__ */ jsx("path", { d: "M2 17l10 5 10-5" }),
2846
+ /* @__PURE__ */ jsx("path", { d: "M2 12l10 5 10-5" })
2847
+ ] });
2848
+ case "documentation":
2849
+ return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
2850
+ /* @__PURE__ */ jsx("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
2851
+ /* @__PURE__ */ jsx("polyline", { points: "14,2 14,8 20,8" }),
2852
+ /* @__PURE__ */ jsx("line", { x1: "16", y1: "13", x2: "8", y2: "13" }),
2853
+ /* @__PURE__ */ jsx("line", { x1: "16", y1: "17", x2: "8", y2: "17" }),
2854
+ /* @__PURE__ */ jsx("line", { x1: "10", y1: "9", x2: "8", y2: "9" })
2855
+ ] });
2856
+ case "tests":
2857
+ return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
2858
+ /* @__PURE__ */ jsx("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
2859
+ /* @__PURE__ */ jsx("polyline", { points: "22,4 12,14.01 9,11.01" })
2860
+ ] });
2861
+ case "deadCode":
2862
+ return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
2863
+ /* @__PURE__ */ jsx("polyline", { points: "3,6 5,6 21,6" }),
2864
+ /* @__PURE__ */ jsx("path", { d: "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }),
2865
+ /* @__PURE__ */ jsx("line", { x1: "10", y1: "11", x2: "10", y2: "17" }),
2866
+ /* @__PURE__ */ jsx("line", { x1: "14", y1: "11", x2: "14", y2: "17" })
2867
+ ] });
2868
+ case "formatting":
2869
+ return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
2870
+ /* @__PURE__ */ jsx("line", { x1: "21", y1: "10", x2: "7", y2: "10" }),
2871
+ /* @__PURE__ */ jsx("line", { x1: "21", y1: "6", x2: "3", y2: "6" }),
2872
+ /* @__PURE__ */ jsx("line", { x1: "21", y1: "14", x2: "3", y2: "14" }),
2873
+ /* @__PURE__ */ jsx("line", { x1: "21", y1: "18", x2: "7", y2: "18" })
2874
+ ] });
2875
+ case "linting":
2876
+ return /* @__PURE__ */ jsxs("svg", { ...iconProps, children: [
2877
+ /* @__PURE__ */ jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }),
2878
+ /* @__PURE__ */ jsx("line", { x1: "12", y1: "8", x2: "12", y2: "12" }),
2879
+ /* @__PURE__ */ jsx("line", { x1: "12", y1: "16", x2: "12.01", y2: "16" })
2880
+ ] });
2881
+ default:
2882
+ return null;
2883
+ }
2884
+ }
2885
+ const METRIC_CONFIG = [
2886
+ { key: "types", label: "Types", description: "Type safety score" },
2887
+ { key: "documentation", label: "Documentation", description: "Documentation coverage" },
2888
+ { key: "tests", label: "Tests", description: "Test coverage and passing rate" },
2889
+ { key: "deadCode", label: "Dead Code", description: "Unused code detected" },
2890
+ { key: "formatting", label: "Formatting", description: "Code formatting consistency" },
2891
+ { key: "linting", label: "Linting", description: "Linting compliance" }
2892
+ ];
2893
+ function QualityMetricsList({
2894
+ metrics,
2895
+ theme,
2896
+ className,
2897
+ onMetricClick
2898
+ }) {
2899
+ return /* @__PURE__ */ jsx(
2900
+ "div",
2901
+ {
2902
+ className: cn(className),
2903
+ style: {
2904
+ display: "flex",
2905
+ flexDirection: "column",
2906
+ gap: 4
2907
+ },
2908
+ children: METRIC_CONFIG.map(({ key, label, description }) => {
2909
+ const value = metrics[key];
2910
+ const isDeadCode = key === "deadCode";
2911
+ return /* @__PURE__ */ jsxs(
2912
+ "div",
2913
+ {
2914
+ onClick: () => onMetricClick == null ? void 0 : onMetricClick(key),
2915
+ style: {
2916
+ display: "flex",
2917
+ alignItems: "center",
2918
+ gap: 12,
2919
+ padding: "10px 12px",
2920
+ borderRadius: 6,
2921
+ backgroundColor: theme.colors.surface,
2922
+ border: `1px solid ${theme.colors.border}`,
2923
+ cursor: onMetricClick ? "pointer" : "default",
2924
+ transition: "all 0.15s ease"
2925
+ },
2926
+ onMouseEnter: (e) => {
2927
+ if (onMetricClick) {
2928
+ e.currentTarget.style.backgroundColor = theme.colors.backgroundLight;
2929
+ e.currentTarget.style.borderColor = theme.colors.primary;
2930
+ }
2931
+ },
2932
+ onMouseLeave: (e) => {
2933
+ e.currentTarget.style.backgroundColor = theme.colors.surface;
2934
+ e.currentTarget.style.borderColor = theme.colors.border;
2935
+ },
2936
+ children: [
2937
+ /* @__PURE__ */ jsx(
2938
+ "div",
2939
+ {
2940
+ style: {
2941
+ display: "flex",
2942
+ alignItems: "center",
2943
+ justifyContent: "center",
2944
+ width: 32,
2945
+ height: 32,
2946
+ borderRadius: 6,
2947
+ backgroundColor: getValueBgColor(value, key),
2948
+ color: getValueColor(value, key),
2949
+ flexShrink: 0
2950
+ },
2951
+ children: getMetricIcon(key)
2952
+ }
2953
+ ),
2954
+ /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
2955
+ /* @__PURE__ */ jsxs(
2956
+ "div",
2957
+ {
2958
+ style: {
2959
+ fontSize: 14,
2960
+ fontWeight: 500,
2961
+ color: theme.colors.text
2962
+ },
2963
+ children: [
2964
+ label,
2965
+ isDeadCode && /* @__PURE__ */ jsx(
2966
+ "span",
2967
+ {
2968
+ style: {
2969
+ fontSize: 11,
2970
+ color: theme.colors.textMuted,
2971
+ marginLeft: 4
2972
+ },
2973
+ children: "(lower is better)"
2974
+ }
2975
+ )
2976
+ ]
2977
+ }
2978
+ ),
2979
+ /* @__PURE__ */ jsx(
2980
+ "div",
2981
+ {
2982
+ style: {
2983
+ fontSize: 12,
2984
+ color: theme.colors.textMuted,
2985
+ whiteSpace: "nowrap",
2986
+ overflow: "hidden",
2987
+ textOverflow: "ellipsis"
2988
+ },
2989
+ children: description
2990
+ }
2991
+ )
2992
+ ] }),
2993
+ /* @__PURE__ */ jsxs(
2994
+ "div",
2995
+ {
2996
+ style: {
2997
+ display: "flex",
2998
+ alignItems: "center",
2999
+ gap: 8,
3000
+ flexShrink: 0
3001
+ },
3002
+ children: [
3003
+ /* @__PURE__ */ jsx(
3004
+ "div",
3005
+ {
3006
+ style: {
3007
+ width: 60,
3008
+ height: 6,
3009
+ borderRadius: 3,
3010
+ backgroundColor: theme.colors.border,
3011
+ overflow: "hidden"
3012
+ },
3013
+ children: /* @__PURE__ */ jsx(
3014
+ "div",
3015
+ {
3016
+ style: {
3017
+ width: `${isDeadCode ? 100 - value : value}%`,
3018
+ height: "100%",
3019
+ backgroundColor: getValueColor(value, key),
3020
+ borderRadius: 3,
3021
+ transition: "width 0.3s ease"
3022
+ }
3023
+ }
3024
+ )
3025
+ }
3026
+ ),
3027
+ /* @__PURE__ */ jsxs(
3028
+ "span",
3029
+ {
3030
+ style: {
3031
+ fontSize: 14,
3032
+ fontWeight: 600,
3033
+ color: getValueColor(value, key),
3034
+ minWidth: 45,
3035
+ textAlign: "right"
3036
+ },
3037
+ children: [
3038
+ value.toFixed(1),
3039
+ "%"
3040
+ ]
3041
+ }
3042
+ )
3043
+ ]
3044
+ }
3045
+ ),
3046
+ onMetricClick && /* @__PURE__ */ jsx(
3047
+ "svg",
3048
+ {
3049
+ width: "16",
3050
+ height: "16",
3051
+ viewBox: "0 0 24 24",
3052
+ fill: "none",
3053
+ stroke: theme.colors.textMuted,
3054
+ strokeWidth: "2",
3055
+ strokeLinecap: "round",
3056
+ strokeLinejoin: "round",
3057
+ style: { flexShrink: 0 },
3058
+ children: /* @__PURE__ */ jsx("polyline", { points: "9,18 15,12 9,6" })
3059
+ }
3060
+ )
3061
+ ]
3062
+ },
3063
+ key
3064
+ );
3065
+ })
3066
+ }
3067
+ );
3068
+ }
3069
+ function QualityMetricsListCompact({
3070
+ metrics,
3071
+ theme,
3072
+ className,
3073
+ onMetricClick
3074
+ }) {
3075
+ return /* @__PURE__ */ jsx(
3076
+ "div",
3077
+ {
3078
+ className: cn(className),
3079
+ style: {
3080
+ display: "flex",
3081
+ flexDirection: "column",
3082
+ gap: 2
3083
+ },
3084
+ children: METRIC_CONFIG.map(({ key, label }) => {
3085
+ const value = metrics[key];
3086
+ const isDeadCode = key === "deadCode";
3087
+ return /* @__PURE__ */ jsxs(
3088
+ "div",
3089
+ {
3090
+ onClick: () => onMetricClick == null ? void 0 : onMetricClick(key),
3091
+ style: {
3092
+ display: "flex",
3093
+ alignItems: "center",
3094
+ justifyContent: "space-between",
3095
+ gap: 8,
3096
+ padding: "6px 8px",
3097
+ borderRadius: 4,
3098
+ cursor: onMetricClick ? "pointer" : "default",
3099
+ transition: "background-color 0.15s ease"
3100
+ },
3101
+ onMouseEnter: (e) => {
3102
+ if (onMetricClick) {
3103
+ e.currentTarget.style.backgroundColor = theme.colors.surface;
3104
+ }
3105
+ },
3106
+ onMouseLeave: (e) => {
3107
+ e.currentTarget.style.backgroundColor = "transparent";
3108
+ },
3109
+ children: [
3110
+ /* @__PURE__ */ jsxs(
3111
+ "span",
3112
+ {
3113
+ style: {
3114
+ fontSize: 13,
3115
+ color: theme.colors.textMuted
3116
+ },
3117
+ children: [
3118
+ label,
3119
+ isDeadCode && " ↓"
3120
+ ]
3121
+ }
3122
+ ),
3123
+ /* @__PURE__ */ jsxs(
3124
+ "span",
3125
+ {
3126
+ style: {
3127
+ fontSize: 13,
3128
+ fontWeight: 500,
3129
+ color: getValueColor(value, key)
3130
+ },
3131
+ children: [
3132
+ value.toFixed(1),
3133
+ "%"
3134
+ ]
3135
+ }
3136
+ )
3137
+ ]
3138
+ },
3139
+ key
3140
+ );
3141
+ })
3142
+ }
3143
+ );
3144
+ }
2163
3145
  const panels = [
2164
3146
  {
2165
3147
  metadata: {
@@ -2208,6 +3190,32 @@ const panels = [
2208
3190
  onUnmount: async (_context) => {
2209
3191
  console.log("Repository Quality Grid Panel unmounting");
2210
3192
  }
3193
+ },
3194
+ {
3195
+ metadata: {
3196
+ id: "principal-ade.lens-data-debug-panel",
3197
+ name: "Lens Data Debug",
3198
+ icon: "🐛",
3199
+ version: "0.1.0",
3200
+ author: "Principal ADE",
3201
+ description: "Debug panel for inspecting raw lens results from quality-lens-cli. Shows package breakdown, lens results with pass/fail status, and files with issues.",
3202
+ slices: ["lensResults"],
3203
+ tools: []
3204
+ },
3205
+ component: LensDataDebugPanel,
3206
+ onMount: async (context) => {
3207
+ var _a;
3208
+ console.log(
3209
+ "Lens Data Debug Panel mounted",
3210
+ (_a = context.currentScope.repository) == null ? void 0 : _a.path
3211
+ );
3212
+ if (context.hasSlice("lensResults") && !context.isSliceLoading("lensResults")) {
3213
+ await context.refresh("repository", "lensResults");
3214
+ }
3215
+ },
3216
+ onUnmount: async (_context) => {
3217
+ console.log("Lens Data Debug Panel unmounting");
3218
+ }
2211
3219
  }
2212
3220
  ];
2213
3221
  const onPackageLoad = async () => {
@@ -2217,11 +3225,15 @@ const onPackageUnload = async () => {
2217
3225
  console.log("Panel package unloading - Code Quality Panels");
2218
3226
  };
2219
3227
  export {
3228
+ LensDataDebugPanel$1 as LensDataDebugComponent,
3229
+ LensDataDebugPanel,
2220
3230
  QualityHexagon,
2221
3231
  QualityHexagonCompact,
2222
3232
  QualityHexagonDetailed,
2223
3233
  QualityHexagonExpandable,
2224
3234
  QualityHexagonPanel,
3235
+ QualityMetricsList,
3236
+ QualityMetricsListCompact,
2225
3237
  RepositoryQualityGrid,
2226
3238
  RepositoryQualityGridItem,
2227
3239
  RepositoryQualityGridPanel,