@industry-theme/file-city-panel 0.2.32 → 0.2.33

package/dist/panels.bundle.js

@@ -11131,7 +11131,7 @@ const createGitTab = (content, count2) => ({
 });
 var dist$1 = {};
 var ArchitectureMapHighlightLayers = {};
-const require$$6 = /* @__PURE__ */ getAugmentedNamespace(esm$1);
+const require$$7 = /* @__PURE__ */ getAugmentedNamespace(esm$1);
 var cityDataUtils = {};
 var hasRequiredCityDataUtils;
 function requireCityDataUtils() {
@@ -11421,20 +11421,71 @@ function requireDrawLayeredBuildings() {
   if (hasRequiredDrawLayeredBuildings) return drawLayeredBuildings;
   hasRequiredDrawLayeredBuildings = 1;
   Object.defineProperty(drawLayeredBuildings, "__esModule", { value: true });
+  drawLayeredBuildings.LayerIndex = void 0;
   drawLayeredBuildings.drawGrid = drawGrid;
   drawLayeredBuildings.drawLayeredDistricts = drawLayeredDistricts;
   drawLayeredBuildings.drawLayeredBuildings = drawLayeredBuildings$1;
-  function pathMatchesItem(path, item, checkType = "children") {
-    if (item.type === "file") {
-      return path === item.path;
-    } else {
+  class LayerIndex {
+    constructor(layers) {
+      this.exactIndex = /* @__PURE__ */ new Map();
+      this.directoryPaths = [];
+      this.sortedCache = /* @__PURE__ */ new Map();
+      this.buildIndex(layers);
+    }
+    buildIndex(layers) {
+      for (const layer of layers) {
+        if (!layer.enabled)
+          continue;
+        for (const item of layer.items) {
+          const entry = { layer, item };
+          if (item.type === "file") {
+            const existing = this.exactIndex.get(item.path);
+            if (existing) {
+              existing.push(entry);
+            } else {
+              this.exactIndex.set(item.path, [entry]);
+            }
+          } else {
+            this.directoryPaths.push({ path: item.path, layer, item });
+          }
+        }
+      }
+      this.directoryPaths.sort((a, b) => b.path.length - a.path.length);
+    }
+    /**
+     * Get all layer items that apply to a given path.
+     * For 'exact' mode: only matches the exact path.
+     * For 'children' mode: matches exact path OR parent directories that contain this path.
+     */
+    getItemsForPath(path, checkType = "children") {
+      const cacheKey = `${path}:${checkType}`;
+      const cached = this.sortedCache.get(cacheKey);
+      if (cached)
+        return cached;
+      const matches = [];
+      const exactMatches = this.exactIndex.get(path);
+      if (exactMatches) {
+        matches.push(...exactMatches);
+      }
       if (checkType === "exact") {
-        return path === item.path;
+        for (const dir of this.directoryPaths) {
+          if (dir.path === path) {
+            matches.push({ layer: dir.layer, item: dir.item });
+          }
+        }
       } else {
-        return path === item.path || path.startsWith(item.path + "/");
+        for (const dir of this.directoryPaths) {
+          if (path === dir.path || path.startsWith(dir.path + "/")) {
+            matches.push({ layer: dir.layer, item: dir.item });
+          }
+        }
       }
+      const sorted = matches.sort((a, b) => b.layer.priority - a.layer.priority);
+      this.sortedCache.set(cacheKey, sorted);
+      return sorted;
     }
   }
+  drawLayeredBuildings.LayerIndex = LayerIndex;
   function drawRoundedRect(ctx, x, y, width, height, radius, fill, stroke) {
     ctx.beginPath();
     ctx.moveTo(x + radius, y);
@@ -11452,19 +11503,6 @@ function requireDrawLayeredBuildings() {
     if (stroke)
       ctx.stroke();
   }
-  function getLayerItemsForPath(path, layers, checkType = "children") {
-    const matches = [];
-    for (const layer of layers) {
-      if (!layer.enabled)
-        continue;
-      for (const item of layer.items) {
-        if (pathMatchesItem(path, item, checkType)) {
-          matches.push({ layer, item });
-        }
-      }
-    }
-    return matches.sort((a, b) => b.layer.priority - a.layer.priority);
-  }
   function drawGrid(ctx, width, height, gridSize) {
     ctx.save();
     ctx.strokeStyle = "rgba(255, 255, 255, 0.05)";
@@ -11697,12 +11735,13 @@ function requireDrawLayeredBuildings() {
         break;
     }
   }
-  function drawLayeredDistricts(ctx, districts, worldToCanvas, scale, layers, hoveredDistrict, fullSize, defaultDirectoryColor, layoutConfig, abstractedPaths, showDirectoryLabels = true, borderRadius = 0) {
+  function drawLayeredDistricts(ctx, districts, worldToCanvas, scale, layers, hoveredDistrict, fullSize, defaultDirectoryColor, layoutConfig, abstractedPaths, showDirectoryLabels = true, borderRadius = 0, layerIndex) {
+    const index = layerIndex || new LayerIndex(layers);
     districts.forEach((district) => {
       var _a, _b;
       const districtPath = district.path || "";
       const isRoot = !districtPath || districtPath === "";
-      const rootLayerMatches = getLayerItemsForPath(districtPath, layers, "exact");
+      const rootLayerMatches = index.getItemsForPath(districtPath, "exact");
       const hasLayerRendering = rootLayerMatches.length > 0;
       if (isRoot && !hasLayerRendering)
         return;
@@ -11723,7 +11762,7 @@ function requireDrawLayeredBuildings() {
       const baseColor = hexToRgb(baseColorHex);
       let opacity = 0.3;
       let borderOpacity = 0.6;
-      const layerMatches = getLayerItemsForPath(districtPath, layers, "exact");
+      const layerMatches = index.getItemsForPath(districtPath, "exact");
       const hasLayerHighlight = layerMatches.length > 0;
       if (hasLayerHighlight) {
         opacity = 0.5;
@@ -11856,7 +11895,8 @@ function requireDrawLayeredBuildings() {
     const ext = fileExtension.toLowerCase();
     return ext === ".jsx" || ext === ".tsx";
   }
-  function drawLayeredBuildings$1(ctx, buildings, worldToCanvas, scale, layers, hoveredBuilding, defaultBuildingColor, showFileNames, hoverBorderColor, disableOpacityDimming, showFileTypeIcons, borderRadius = 0) {
+  function drawLayeredBuildings$1(ctx, buildings, worldToCanvas, scale, layers, hoveredBuilding, defaultBuildingColor, showFileNames, hoverBorderColor, disableOpacityDimming, showFileTypeIcons, borderRadius = 0, layerIndex) {
+    const index = layerIndex || new LayerIndex(layers);
     buildings.forEach((building) => {
       const pos = worldToCanvas(building.position.x, building.position.z);
       let width, height;
@@ -11874,7 +11914,7 @@ function requireDrawLayeredBuildings() {
         width,
         height
       };
-      const layerMatches = getLayerItemsForPath(building.path, layers).filter((match) => match.item.type === "file");
+      const layerMatches = index.getItemsForPath(building.path).filter((match) => match.item.type === "file");
       const hasLayerHighlight = layerMatches.length > 0;
       const isHovered = hoveredBuilding === building;
       let color2;
@@ -11982,7 +12022,7 @@ function requireArchitectureMapHighlightLayers() {
   Object.defineProperty(ArchitectureMapHighlightLayers, "__esModule", { value: true });
   ArchitectureMapHighlightLayers.ArchitectureMapHighlightLayers = void 0;
   const react_1 = __importStar(React);
-  const industry_theme_1 = require$$6;
+  const industry_theme_1 = require$$7;
   const cityDataUtils_1 = requireCityDataUtils();
   const drawLayeredBuildings_1 = requireDrawLayeredBuildings();
   const DEFAULT_DISPLAY_OPTIONS = {
@@ -12581,6 +12621,7 @@ ${projectInfo.currentBranch}`;
       }
       return layers;
     }, [stableLayers, dynamicLayers, abstractionLayer]);
+    const layerIndex = (0, react_1.useMemo)(() => new drawLayeredBuildings_1.LayerIndex(allLayers), [allLayers]);
     const { abstractedPathsSet, abstractedPathLookup } = (0, react_1.useMemo)(() => {
       const pathsSet = /* @__PURE__ */ new Set();
       const abstractionLayerDef = allLayers.find((l) => l.id === "directory-abstraction");
@@ -12703,9 +12744,10 @@ ${projectInfo.currentBranch}`;
         abstractedPathsSet,
         // Pass abstracted paths to skip labels
         showDirectoryLabels,
-        districtBorderRadius
+        districtBorderRadius,
+        layerIndex
       );
-      (0, drawLayeredBuildings_1.drawLayeredBuildings)(ctx, visibleBuildingsMemo, worldToCanvas, scale * zoomState.scale, allLayers, interactionState.hoveredBuilding, resolvedDefaultBuildingColor, showFileNames, resolvedHoverBorderColor, disableOpacityDimming, showFileTypeIcons, buildingBorderRadius);
+      (0, drawLayeredBuildings_1.drawLayeredBuildings)(ctx, visibleBuildingsMemo, worldToCanvas, scale * zoomState.scale, allLayers, interactionState.hoveredBuilding, resolvedDefaultBuildingColor, showFileNames, resolvedHoverBorderColor, disableOpacityDimming, showFileTypeIcons, buildingBorderRadius, layerIndex);
     }, [
       filteredCityData,
       canvasSize,
@@ -12734,7 +12776,8 @@ ${projectInfo.currentBranch}`;
       // Memoized values for performance (don't recalculate on hover)
       visibleDistrictsMemo,
       visibleBuildingsMemo,
-      abstractedPathsSet
+      abstractedPathsSet,
+      layerIndex
     ]);
     const performHitTest = (0, react_1.useCallback)((canvasX, canvasY) => {
       var _a, _b;
@@ -14932,7 +14975,7 @@ const dist = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty
   buildMultiVersionCity,
   getFilesFromGitHubTree
 }, Symbol.toStringTag, { value: "Module" }));
-const require$$3 = /* @__PURE__ */ getAugmentedNamespace(dist);
+const require$$4 = /* @__PURE__ */ getAugmentedNamespace(dist);
 var useCodeCityData = {};
 var hasRequiredUseCodeCityData;
 function requireUseCodeCityData() {
@@ -14941,7 +14984,7 @@ function requireUseCodeCityData() {
   Object.defineProperty(useCodeCityData, "__esModule", { value: true });
   useCodeCityData.useCodeCityData = useCodeCityData$1;
   const react_1 = React;
-  const file_city_builder_1 = require$$3;
+  const file_city_builder_1 = require$$4;
   function useCodeCityData$1({ fileSystemTree, autoUpdate = true }) {
     const [cityData, setCityData] = (0, react_1.useState)(null);
     const [isLoading, setIsLoading] = (0, react_1.useState)(false);
@@ -22524,8 +22567,8 @@ function requireCityViewWithReactFlow() {
   CityViewWithReactFlow.CityViewWithReactFlow = void 0;
   const react_1 = __importStar(React);
   const reactflow_1 = __importStar(require$$1);
-  const industry_theme_1 = require$$6;
-  const file_city_builder_1 = require$$3;
+  const industry_theme_1 = require$$7;
+  const file_city_builder_1 = require$$4;
   const ArchitectureMapHighlightLayers_1 = requireArchitectureMapHighlightLayers();
   const CellNode = ({ data, selected }) => {
     const { label, fileTree, fileCount, directoryCount } = data;
@@ -22780,11 +22823,15 @@ function requireDist() {
   hasRequiredDist = 1;
   (function(exports$1) {
     Object.defineProperty(exports$1, "__esModule", { value: true });
-    exports$1.useTheme = exports$1.ThemeProvider = exports$1.CityViewWithReactFlow = exports$1.useCodeCityData = exports$1.MultiVersionCityBuilder = exports$1.getFileColorMapping = exports$1.getDefaultFileColorConfig = exports$1.createFileColorHighlightLayers = exports$1.filterCityDataForMultipleDirectories = exports$1.filterCityDataForSubdirectory = exports$1.filterCityDataForSelectiveRender = exports$1.ArchitectureMapHighlightLayers = void 0;
+    exports$1.useTheme = exports$1.ThemeProvider = exports$1.CityViewWithReactFlow = exports$1.useCodeCityData = exports$1.MultiVersionCityBuilder = exports$1.getFileColorMapping = exports$1.getDefaultFileColorConfig = exports$1.createFileColorHighlightLayers = exports$1.filterCityDataForMultipleDirectories = exports$1.filterCityDataForSubdirectory = exports$1.filterCityDataForSelectiveRender = exports$1.LayerIndex = exports$1.ArchitectureMapHighlightLayers = void 0;
     var ArchitectureMapHighlightLayers_1 = requireArchitectureMapHighlightLayers();
     Object.defineProperty(exports$1, "ArchitectureMapHighlightLayers", { enumerable: true, get: function() {
       return ArchitectureMapHighlightLayers_1.ArchitectureMapHighlightLayers;
     } });
+    var drawLayeredBuildings_1 = requireDrawLayeredBuildings();
+    Object.defineProperty(exports$1, "LayerIndex", { enumerable: true, get: function() {
+      return drawLayeredBuildings_1.LayerIndex;
+    } });
     var cityDataUtils_1 = requireCityDataUtils();
     Object.defineProperty(exports$1, "filterCityDataForSelectiveRender", { enumerable: true, get: function() {
       return cityDataUtils_1.filterCityDataForSelectiveRender;
@@ -22805,7 +22852,7 @@ function requireDist() {
     Object.defineProperty(exports$1, "getFileColorMapping", { enumerable: true, get: function() {
       return fileColorHighlightLayers_1.getFileColorMapping;
     } });
-    var file_city_builder_1 = require$$3;
+    var file_city_builder_1 = require$$4;
     Object.defineProperty(exports$1, "MultiVersionCityBuilder", { enumerable: true, get: function() {
       return file_city_builder_1.MultiVersionCityBuilder;
     } });
@@ -22817,7 +22864,7 @@ function requireDist() {
     Object.defineProperty(exports$1, "CityViewWithReactFlow", { enumerable: true, get: function() {
       return CityViewWithReactFlow_1.CityViewWithReactFlow;
     } });
-    var industry_theme_1 = require$$6;
+    var industry_theme_1 = require$$7;
     Object.defineProperty(exports$1, "ThemeProvider", { enumerable: true, get: function() {
       return industry_theme_1.ThemeProvider;
     } });
@@ -24246,6 +24293,7 @@ function getLayersForColorMode(mode, buildings, qualityData, fileColorLayers, gi
   var _a;
   if (mode === "fileTypes") return fileColorLayers;
   if (mode === "git") return gitLayers;
+  if (mode === "pr") return [];
   if (usesCoverageData(mode)) {
     if (qualityData == null ? void 0 : qualityData.fileCoverage) {
       return createCoverageHighlightLayers(buildings, qualityData.fileCoverage);
@@ -24287,12 +24335,22 @@ const GIT_STATUS_COLORS = {
   deleted: "#ef4444"
   // Red
 };
+const PR_STATUS_COLORS = {
+  added: "#22c55e",
+  // Green
+  modified: "#f59e0b",
+  // Yellow/amber (consistent with git unstaged)
+  removed: "#ef4444",
+  // Red
+  renamed: "#8b5cf6"
+  // Purple
+};
 const CodeCityPanelContent = ({
   context,
   actions: actions2,
   events
 }) => {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
   const { theme: theme2 } = useTheme();
   const [cityData, setCityData] = useState(null);
   const [hoverInfo, setHoverInfo] = useState(null);
@@ -24342,11 +24400,13 @@ const CodeCityPanelContent = ({
   }, [containerSize]);
   const fileTreeSlice = context.getSlice("fileTree");
   const gitSlice = context.getSlice("git");
+  const prFilesSlice = context.getSlice("prFiles");
   const agentHighlightLayersSlice = context.getSlice("agentHighlightLayers");
   const colorModesSlice = context.getSlice("fileCityColorModes");
   const qualityData = (_c = colorModesSlice == null ? void 0 : colorModesSlice.data) == null ? void 0 : _c.qualityData;
   const fileColorLayersRegistered = useRef(false);
   const gitLayersRegistered = useRef(false);
+  const prFilesLayersRegistered = useRef(false);
   const agentLayersRegistered = useRef(false);
   const lastHasGitOrAgentLayers = useRef(null);
   const currentRepoPath = (_d = context.currentScope.repository) == null ? void 0 : _d.path;
@@ -24356,11 +24416,13 @@ const CodeCityPanelContent = ({
       setHighlightLayers([]);
       fileColorLayersRegistered.current = false;
       gitLayersRegistered.current = false;
+      prFilesLayersRegistered.current = false;
       agentLayersRegistered.current = false;
       lastHasGitOrAgentLayers.current = null;
       lastRepoPath.current = currentRepoPath;
     }
   }, [currentRepoPath]);
+  const [prFilesVersion, setPrFilesVersion] = useState(0);
   useEffect(() => {
     if (!events) return;
     const cleanupHover = events.on("package:hover", (event) => {
@@ -24371,9 +24433,19 @@ const CodeCityPanelContent = ({
       const payload = event.payload;
       setSelectedPackagePath((payload == null ? void 0 : payload.packagePath) ?? null);
     });
+    const cleanupPrFiles = events.on("prFiles:updated", () => {
+      console.log("[CodeCityPanel] PR files updated, triggering re-render");
+      setPrFilesVersion((v) => v + 1);
+    });
+    const cleanupPrFilesCleared = events.on("prFiles:cleared", () => {
+      console.log("[CodeCityPanel] PR files cleared, triggering re-render");
+      setPrFilesVersion((v) => v + 1);
+    });
     return () => {
       cleanupHover == null ? void 0 : cleanupHover();
       cleanupSelect == null ? void 0 : cleanupSelect();
+      cleanupPrFiles == null ? void 0 : cleanupPrFiles();
+      cleanupPrFilesCleared == null ? void 0 : cleanupPrFilesCleared();
     };
   }, [events]);
   useEffect(() => {
@@ -24392,7 +24464,7 @@ const CodeCityPanelContent = ({
     return COLOR_MODES.find((m) => m.id === colorMode) || COLOR_MODES[0];
   }, [colorMode]);
   const hoveredFileMetric = useMemo(() => {
-    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o, _p;
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p;
     if (!((_a2 = hoverInfo == null ? void 0 : hoverInfo.hoveredBuilding) == null ? void 0 : _a2.path)) return null;
     const filePath = hoverInfo.hoveredBuilding.path;
     if (!qualityData) return null;
@@ -24457,7 +24529,7 @@ const CodeCityPanelContent = ({
         return { type: "knip", value: null, label: "No dead code data" };
       }
       case "alexandria": {
-        const metric = (_p = (_o = qualityData.fileMetrics) == null ? void 0 : _o.alexandria) == null ? void 0 : _p.find((m) => m.file === filePath);
+        const metric = (_p = (_o2 = qualityData.fileMetrics) == null ? void 0 : _o2.alexandria) == null ? void 0 : _p.find((m) => m.file === filePath);
         if (metric) {
           const issues = metric.issueCount;
           return { type: "alexandria", value: metric, label: issues > 0 ? `${issues} doc issue${issues > 1 ? "s" : ""}` : "Well documented" };
@@ -24606,9 +24678,88 @@ const CodeCityPanelContent = ({
     }
     return layers;
   }, [cityData, gitSlice == null ? void 0 : gitSlice.data]);
+  const prFilesLayers = useMemo(() => {
+    var _a2;
+    if (!cityData || !cityData.buildings || !((_a2 = prFilesSlice == null ? void 0 : prFilesSlice.data) == null ? void 0 : _a2.filesByStatus)) {
+      return [];
+    }
+    const prFiles = prFilesSlice.data.filesByStatus;
+    const buildingsByPath = new Map(
+      cityData.buildings.map((b) => [b.path, b])
+    );
+    const createLayerItems = (paths) => {
+      const items2 = [];
+      for (const path of paths) {
+        const building = buildingsByPath.get(path);
+        if (building) {
+          items2.push({
+            path: building.path,
+            type: "file",
+            renderStrategy: "fill"
+          });
+        }
+      }
+      return items2;
+    };
+    const layers = [];
+    if (prFiles.added.length > 0) {
+      const items2 = createLayerItems(prFiles.added);
+      if (items2.length > 0) {
+        layers.push({
+          id: "pr-highlight-added",
+          name: "PR Added",
+          enabled: true,
+          color: PR_STATUS_COLORS.added,
+          priority: 85,
+          items: items2
+        });
+      }
+    }
+    if (prFiles.modified.length > 0) {
+      const items2 = createLayerItems(prFiles.modified);
+      if (items2.length > 0) {
+        layers.push({
+          id: "pr-highlight-modified",
+          name: "PR Modified",
+          enabled: true,
+          color: PR_STATUS_COLORS.modified,
+          priority: 95,
+          items: items2
+        });
+      }
+    }
+    if (prFiles.removed.length > 0) {
+      const items2 = createLayerItems(prFiles.removed);
+      if (items2.length > 0) {
+        layers.push({
+          id: "pr-highlight-removed",
+          name: "PR Removed",
+          enabled: true,
+          color: PR_STATUS_COLORS.removed,
+          priority: 105,
+          items: items2
+        });
+      }
+    }
+    if (prFiles.renamed.length > 0) {
+      const renamedPaths = prFiles.renamed.map((r) => r.filename);
+      const items2 = createLayerItems(renamedPaths);
+      if (items2.length > 0) {
+        layers.push({
+          id: "pr-highlight-renamed",
+          name: "PR Renamed",
+          enabled: true,
+          color: PR_STATUS_COLORS.renamed,
+          priority: 88,
+          items: items2
+        });
+      }
+    }
+    return layers;
+  }, [cityData, (_f = prFilesSlice == null ? void 0 : prFilesSlice.data) == null ? void 0 : _f.filesByStatus, prFilesVersion]);
   const qualityLayers = useMemo(() => {
     if (!(cityData == null ? void 0 : cityData.buildings)) return [];
-    if (colorMode === "fileTypes" || colorMode === "git") return [];
+    if (colorMode === "fileTypes" || colorMode === "git" || colorMode === "pr") return [];
     return getLayersForColorMode(
       colorMode,
       cityData.buildings,
@@ -24824,7 +24975,7 @@ const CodeCityPanelContent = ({
     const hasAgentLayers = formattedAgentLayers.length > 0;
     let modeLayers = [];
     if (hasAgentLayers) {
-      modeLayers = [...gitStatusLayers, ...formattedAgentLayers];
+      modeLayers = [...gitStatusLayers, ...prFilesLayers, ...formattedAgentLayers];
     } else {
       switch (colorMode) {
         case "fileTypes":
@@ -24842,18 +24993,20 @@ const CodeCityPanelContent = ({
         case "git":
           modeLayers = gitStatusLayers;
           break;
+        case "pr":
+          modeLayers = prFilesLayers;
+          break;
         default:
           modeLayers = qualityLayers;
           break;
       }
     }
     setBaseLayers(modeLayers);
-    const activePackagePath = selectedPackagePath ?? hoveredPackagePath;
-    if (activePackagePath && activePackagePath !== "" && activePackagePath !== "/" && modeLayers.length > 0) {
+    if (selectedPackagePath && selectedPackagePath !== "" && selectedPackagePath !== "/" && modeLayers.length > 0) {
       const packageFilteredLayers = [];
       modeLayers.forEach((layer) => {
         const insidePackage = layer.items.filter(
-          (item) => isFileInPackage(item.path, activePackagePath)
+          (item) => isFileInPackage(item.path, selectedPackagePath)
         );
         if (insidePackage.length > 0) {
           packageFilteredLayers.push({
@@ -24863,64 +25016,30 @@ const CodeCityPanelContent = ({
           });
         }
       });
-      if (hoveredPackagePath && hoveredPackagePath !== selectedPackagePath) {
-        packageFilteredLayers.push({
-          id: "hovered-package-highlight",
-          name: "Hovered Package",
-          enabled: true,
-          color: "#6b7280",
-          // Gray highlight for hover
-          priority: 190,
-          items: [{
-            path: hoveredPackagePath,
-            type: "directory",
-            renderStrategy: "border"
-          }],
-          borderWidth: 2
-        });
-      }
-      if (selectedPackagePath) {
-        packageFilteredLayers.push({
-          id: "selected-package-highlight",
-          name: "Selected Package",
-          enabled: true,
-          color: "#3b82f6",
-          // Blue highlight
-          priority: 200,
-          // High priority to show on top
-          items: [{
-            path: selectedPackagePath,
-            type: "directory",
-            renderStrategy: "border"
-          }],
-          borderWidth: 3
-        });
-      }
+      packageFilteredLayers.push({
+        id: "selected-package-highlight",
+        name: "Selected Package",
+        enabled: true,
+        color: "#3b82f6",
+        // Blue highlight
+        priority: 200,
+        // High priority to show on top
+        items: [{
+          path: selectedPackagePath,
+          type: "directory",
+          renderStrategy: "border"
+        }],
+        borderWidth: 3
+      });
       setHighlightLayers(packageFilteredLayers);
     } else {
-      const layersWithHover = [...modeLayers];
-      if (hoveredPackagePath) {
-        layersWithHover.push({
-          id: "hovered-package-highlight",
-          name: "Hovered Package",
-          enabled: true,
-          color: "#6b7280",
-          // Gray highlight for hover
-          priority: 190,
-          items: [{
-            path: hoveredPackagePath,
-            type: "directory",
-            renderStrategy: "border"
-          }],
-          borderWidth: 2
-        });
-      }
-      setHighlightLayers(layersWithHover);
+      setHighlightLayers(modeLayers);
     }
     fileColorLayersRegistered.current = !hasAgentLayers && colorMode === "fileTypes";
     gitLayersRegistered.current = hasAgentLayers || colorMode === "git";
+    prFilesLayersRegistered.current = hasAgentLayers || colorMode === "pr";
     agentLayersRegistered.current = hasAgentLayers;
-  }, [colorMode, fileColorLayers, gitStatusLayers, qualityLayers, agentHighlightLayersSlice == null ? void 0 : agentHighlightLayersSlice.data, hoveredPackagePath, selectedPackagePath, isFileInPackage]);
+  }, [colorMode, fileColorLayers, gitStatusLayers, prFilesLayers, qualityLayers, agentHighlightLayersSlice == null ? void 0 : agentHighlightLayersSlice.data, selectedPackagePath, isFileInPackage]);
   useEffect(() => {
     if (!(fileTreeSlice == null ? void 0 : fileTreeSlice.data) || !fileTreeSlice.data.allFiles) {
       setLoading(false);
@@ -24954,7 +25073,7 @@ const CodeCityPanelContent = ({
     } finally {
       setLoading(false);
     }
-  }, [fileTreeSlice == null ? void 0 : fileTreeSlice.data, fileTreeSlice == null ? void 0 : fileTreeSlice.loading, (_f = context.currentScope.repository) == null ? void 0 : _f.path]);
+  }, [fileTreeSlice == null ? void 0 : fileTreeSlice.data, fileTreeSlice == null ? void 0 : fileTreeSlice.loading, (_g = context.currentScope.repository) == null ? void 0 : _g.path]);
   const handleFileClick = useCallback(
     (filePath) => {
       if (actions2.openFile) {
@@ -25242,7 +25361,7 @@ const CodeCityPanelContent = ({
                                             textOverflow: "ellipsis",
                                             whiteSpace: "nowrap"
                                           },
-                                          children: ((_g = hoverInfo.fileTooltip) == null ? void 0 : _g.text) || ((_i = (_h = hoverInfo.hoveredDistrict) == null ? void 0 : _h.path) == null ? void 0 : _i.split("/").pop()) || ((_j = hoverInfo.hoveredDistrict) == null ? void 0 : _j.path) || "Unknown"
+                                          children: ((_h = hoverInfo.fileTooltip) == null ? void 0 : _h.text) || ((_j = (_i = hoverInfo.hoveredDistrict) == null ? void 0 : _i.path) == null ? void 0 : _j.split("/").pop()) || ((_k = hoverInfo.hoveredDistrict) == null ? void 0 : _k.path) || "Unknown"
                                         }
                                       ),
                                       /* @__PURE__ */ jsx(
@@ -25256,7 +25375,7 @@ const CodeCityPanelContent = ({
                                             textOverflow: "ellipsis",
                                             whiteSpace: "nowrap"
                                           },
-                                          children: ((_k = hoverInfo.hoveredBuilding) == null ? void 0 : _k.path) || ((_l = hoverInfo.hoveredDistrict) == null ? void 0 : _l.path) || "/"
+                                          children: ((_l = hoverInfo.hoveredBuilding) == null ? void 0 : _l.path) || ((_m = hoverInfo.hoveredDistrict) == null ? void 0 : _m.path) || "/"
                                         }
                                       )
                                     ]
@@ -25383,7 +25502,7 @@ const CodeCityPanelContent = ({
                             fileTypes: [],
                             gitStatus: gitSlice == null ? void 0 : gitSlice.data,
                             fileTree: fileTreeSlice == null ? void 0 : fileTreeSlice.data,
-                            rootPath: (_m = context.currentScope.repository) == null ? void 0 : _m.path,
+                            rootPath: (_n = context.currentScope.repository) == null ? void 0 : _n.path,
                             onGitFileClick: handleFileClick,
                             onGitNodeHover: handleGitNodeHover,
                             position: layout.legendPosition
@@ -25401,7 +25520,7 @@ const CodeCityPanelContent = ({
                   fileTypes: legendFileTypes,
                   gitStatus: gitSlice == null ? void 0 : gitSlice.data,
                   fileTree: fileTreeSlice == null ? void 0 : fileTreeSlice.data,
-                  rootPath: (_n = context.currentScope.repository) == null ? void 0 : _n.path,
+                  rootPath: (_o = context.currentScope.repository) == null ? void 0 : _o.path,
                   agentLayers: legendAgentLayers,
                   qualityMetrics: legendQualityMetrics,
                   colorMode,