@industry-theme/file-city-panel 0.2.20 → 0.2.22

package/dist/panels.bundle.js

@@ -106,7 +106,7 @@ const createLucideIcon = (iconName, iconNode) => {
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$5 = [
+const __iconNode$b = [
   [
     "path",
     {
@@ -115,14 +115,14 @@ const __iconNode$5 = [
     }
   ]
 ];
-const Activity = createLucideIcon("activity", __iconNode$5);
+const Activity = createLucideIcon("activity", __iconNode$b);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$4 = [
+const __iconNode$a = [
   ["path", { d: "M10 12h4", key: "a56b0p" }],
   ["path", { d: "M10 8h4", key: "1sr2af" }],
   ["path", { d: "M14 21v-3a2 2 0 0 0-4 0v3", key: "1rgiei" }],
@@ -135,27 +135,105 @@ const __iconNode$4 = [
   ],
   ["path", { d: "M6 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16", key: "16ra0t" }]
 ];
-const Building2 = createLucideIcon("building-2", __iconNode$4);
+const Building2 = createLucideIcon("building-2", __iconNode$a);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$3 = [
+const __iconNode$9 = [
   ["path", { d: "M3 3v16a2 2 0 0 0 2 2h16", key: "c24i48" }],
   ["path", { d: "M18 17V9", key: "2bz60n" }],
   ["path", { d: "M13 17V5", key: "1frdt8" }],
   ["path", { d: "M8 17v-3", key: "17ska0" }]
 ];
-const ChartColumn = createLucideIcon("chart-column", __iconNode$3);
+const ChartColumn = createLucideIcon("chart-column", __iconNode$9);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$2 = [
+const __iconNode$8 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __iconNode$8);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$7 = [["path", { d: "m9 18 6-6-6-6", key: "mthhwq" }]];
+const ChevronRight = createLucideIcon("chevron-right", __iconNode$7);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$6 = [
+  [
+    "path",
+    {
+      d: "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49",
+      key: "ct8e1f"
+    }
+  ],
+  ["path", { d: "M14.084 14.158a3 3 0 0 1-4.242-4.242", key: "151rxh" }],
+  [
+    "path",
+    {
+      d: "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143",
+      key: "13bj9a"
+    }
+  ],
+  ["path", { d: "m2 2 20 20", key: "1ooewy" }]
+];
+const EyeOff = createLucideIcon("eye-off", __iconNode$6);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$5 = [
+  [
+    "path",
+    {
+      d: "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0",
+      key: "1nclc0"
+    }
+  ],
+  ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
+];
+const Eye = createLucideIcon("eye", __iconNode$5);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$4 = [
+  [
+    "path",
+    {
+      d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",
+      key: "1oefj6"
+    }
+  ],
+  ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5", key: "wfsgrz" }],
+  ["path", { d: "M10 9H8", key: "b1mrlr" }],
+  ["path", { d: "M16 13H8", key: "t4e002" }],
+  ["path", { d: "M16 17H8", key: "z1uh3a" }]
+];
+const FileText = createLucideIcon("file-text", __iconNode$4);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$3 = [
   [
     "path",
     {
@@ -165,14 +243,14 @@ const __iconNode$2 = [
   ],
   ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5", key: "wfsgrz" }]
 ];
-const File = createLucideIcon("file", __iconNode$2);
+const File = createLucideIcon("file", __iconNode$3);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
  */
-const __iconNode$1 = [
+const __iconNode$2 = [
   [
     "path",
     {
@@ -181,7 +259,20 @@ const __iconNode$1 = [
     }
   ]
 ];
-const Folder = createLucideIcon("folder", __iconNode$1);
+const Folder = createLucideIcon("folder", __iconNode$2);
+/**
+ * @license lucide-react v0.552.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const __iconNode$1 = [
+  ["line", { x1: "6", x2: "6", y1: "3", y2: "15", key: "17qcm7" }],
+  ["circle", { cx: "18", cy: "6", r: "3", key: "1h7g24" }],
+  ["circle", { cx: "6", cy: "18", r: "3", key: "fqmcym" }],
+  ["path", { d: "M18 9a9 9 0 0 1-9 9", key: "n2h4wq" }]
+];
+const GitBranch = createLucideIcon("git-branch", __iconNode$1);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
@@ -2605,29 +2696,632 @@ const Legend = ({
                         children: fileType.name
                       }
                     ),
-                    /* @__PURE__ */ jsx(
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
+                          color: theme2.colors.textSecondary,
+                          flexShrink: 0
+                        },
+                        children: fileType.count
+                      }
+                    )
+                  ]
+                },
+                fileType.id
+              ))
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+const AgentActivityView = ({
+  layers,
+  onLayerClick,
+  onClearAll,
+  showHeader = true
+}) => {
+  const { theme: theme2 } = useTheme();
+  const [expandedLayers, setExpandedLayers] = React.useState(/* @__PURE__ */ new Set());
+  const toggleExpanded = (id2) => {
+    setExpandedLayers((prev) => {
+      const next = new Set(prev);
+      if (next.has(id2)) {
+        next.delete(id2);
+      } else {
+        next.add(id2);
+      }
+      return next;
+    });
+  };
+  const formatTimestamp = (timestamp) => {
+    const date = new Date(timestamp);
+    return date.toLocaleTimeString(void 0, {
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit"
+    });
+  };
+  const getFileName = (path) => {
+    const parts = path.split("/");
+    return parts[parts.length - 1];
+  };
+  const getDirectory = (path) => {
+    const parts = path.split("/");
+    if (parts.length <= 1) return "";
+    return parts.slice(0, -1).join("/");
+  };
+  if (layers.length === 0) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        style: {
+          display: "flex",
+          flexDirection: "column",
+          flex: 1,
+          backgroundColor: theme2.colors.background,
+          ...showHeader && {
+            border: `1px solid ${theme2.colors.border}`,
+            borderRadius: "6px"
+          },
+          overflow: "hidden"
+        },
+        children: [
+          showHeader && /* @__PURE__ */ jsx(
+            "div",
+            {
+              style: {
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                padding: "12px 16px",
+                backgroundColor: theme2.colors.backgroundLight,
+                borderBottom: `1px solid ${theme2.colors.border}`
+              },
+              children: /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "8px",
+                    color: theme2.colors.primary,
+                    fontFamily: theme2.fonts.body,
+                    fontWeight: 600,
+                    fontSize: theme2.fontSizes[1]
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(Activity, { size: 16 }),
+                    "Agent Activity"
+                  ]
+                }
+              )
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              style: {
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                justifyContent: "center",
+                flex: 1,
+                padding: "32px 16px",
+                color: theme2.colors.textSecondary,
+                fontFamily: theme2.fonts.body,
+                fontSize: theme2.fontSizes[0]
+              },
+              children: [
+                /* @__PURE__ */ jsx(Activity, { size: 32, style: { opacity: 0.3, marginBottom: "8px" } }),
+                /* @__PURE__ */ jsx("span", { children: "No agent activity yet" })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        flex: 1,
+        backgroundColor: theme2.colors.background,
+        ...showHeader && {
+          border: `1px solid ${theme2.colors.border}`,
+          borderRadius: "6px"
+        },
+        overflow: "hidden"
+      },
+      children: [
+        showHeader && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+              padding: "12px 16px",
+              backgroundColor: theme2.colors.backgroundLight,
+              borderBottom: `1px solid ${theme2.colors.border}`,
+              flexShrink: 0
+            },
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "8px",
+                    color: theme2.colors.primary,
+                    fontFamily: theme2.fonts.body,
+                    fontWeight: 600,
+                    fontSize: theme2.fontSizes[1]
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(Activity, { size: 16 }),
+                    "Agent Activity",
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          backgroundColor: theme2.colors.primary,
+                          color: theme2.colors.background,
+                          padding: "2px 8px",
+                          borderRadius: "10px",
+                          fontSize: theme2.fontSizes[0],
+                          fontWeight: 500
+                        },
+                        children: layers.length
+                      }
+                    )
+                  ]
+                }
+              ),
+              onClearAll && /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  onClick: onClearAll,
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "4px",
+                    padding: "4px 10px",
+                    fontSize: theme2.fontSizes[0],
+                    fontFamily: theme2.fonts.body,
+                    color: theme2.colors.textSecondary,
+                    backgroundColor: "transparent",
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderRadius: "4px",
+                    cursor: "pointer",
+                    transition: "all 0.15s ease"
+                  },
+                  title: "Clear all agent activity",
+                  children: [
+                    /* @__PURE__ */ jsx(X, { size: 12 }),
+                    "Clear All"
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              flex: 1,
+              overflowY: "auto"
+            },
+            children: [...layers].sort((a, b) => (b.timestamp ?? 0) - (a.timestamp ?? 0)).map((layer, index) => {
+              const isExpanded = expandedLayers.has(layer.id);
+              const fileCount = layer.items.length;
+              return /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    borderBottom: index < layers.length - 1 ? `1px solid ${theme2.colors.border}` : "none"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxs(
+                      "div",
+                      {
+                        onClick: () => toggleExpanded(layer.id),
+                        style: {
+                          display: "flex",
+                          alignItems: "center",
+                          gap: "12px",
+                          padding: "12px 16px",
+                          backgroundColor: layer.enabled ? "transparent" : `${theme2.colors.backgroundLight}`,
+                          opacity: layer.enabled ? 1 : 0.6,
+                          cursor: "pointer",
+                          transition: "all 0.15s ease"
+                        },
+                        children: [
+                          /* @__PURE__ */ jsx(
+                            "div",
+                            {
+                              style: {
+                                display: "flex",
+                                alignItems: "center",
+                                justifyContent: "center",
+                                width: "20px",
+                                height: "20px",
+                                color: theme2.colors.textSecondary,
+                                flexShrink: 0
+                              },
+                              children: isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { size: 16 }) : /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(
+                            "div",
+                            {
+                              style: {
+                                width: "16px",
+                                height: "16px",
+                                backgroundColor: layer.color,
+                                borderRadius: "4px",
+                                flexShrink: 0,
+                                boxShadow: `0 0 8px ${layer.color}60`
+                              }
+                            }
+                          ),
+                          /* @__PURE__ */ jsxs(
+                            "div",
+                            {
+                              style: {
+                                display: "flex",
+                                flexDirection: "column",
+                                gap: "2px",
+                                flex: 1,
+                                minWidth: 0
+                              },
+                              children: [
+                                /* @__PURE__ */ jsx(
+                                  "div",
+                                  {
+                                    style: {
+                                      display: "flex",
+                                      alignItems: "center",
+                                      gap: "8px"
+                                    },
+                                    children: /* @__PURE__ */ jsx(
+                                      "span",
+                                      {
+                                        style: {
+                                          fontFamily: theme2.fonts.body,
+                                          fontSize: theme2.fontSizes[1],
+                                          fontWeight: 500,
+                                          color: theme2.colors.text,
+                                          overflow: "hidden",
+                                          textOverflow: "ellipsis",
+                                          whiteSpace: "nowrap"
+                                        },
+                                        children: layer.name
+                                      }
+                                    )
+                                  }
+                                ),
+                                /* @__PURE__ */ jsxs(
+                                  "div",
+                                  {
+                                    style: {
+                                      display: "flex",
+                                      alignItems: "center",
+                                      gap: "12px",
+                                      fontFamily: theme2.fonts.body,
+                                      fontSize: theme2.fontSizes[0],
+                                      color: theme2.colors.textSecondary
+                                    },
+                                    children: [
+                                      /* @__PURE__ */ jsxs("span", { children: [
+                                        fileCount,
+                                        " ",
+                                        fileCount === 1 ? "file" : "files"
+                                      ] }),
+                                      layer.timestamp && /* @__PURE__ */ jsx("span", { children: formatTimestamp(layer.timestamp) })
+                                    ]
+                                  }
+                                )
+                              ]
+                            }
+                          ),
+                          /* @__PURE__ */ jsx(
+                            "button",
+                            {
+                              onClick: (e) => {
+                                e.stopPropagation();
+                                onLayerClick == null ? void 0 : onLayerClick(layer.id);
+                              },
+                              style: {
+                                display: "flex",
+                                alignItems: "center",
+                                justifyContent: "center",
+                                width: "32px",
+                                height: "32px",
+                                padding: 0,
+                                backgroundColor: "transparent",
+                                border: `1px solid ${theme2.colors.border}`,
+                                borderRadius: "4px",
+                                cursor: onLayerClick ? "pointer" : "default",
+                                color: layer.enabled ? theme2.colors.primary : theme2.colors.textSecondary,
+                                flexShrink: 0,
+                                transition: "all 0.15s ease"
+                              },
+                              title: layer.enabled ? "Hide layer" : "Show layer",
+                              children: layer.enabled ? /* @__PURE__ */ jsx(Eye, { size: 16 }) : /* @__PURE__ */ jsx(EyeOff, { size: 16 })
+                            }
+                          )
+                        ]
+                      }
+                    ),
+                    isExpanded && /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        style: {
+                          backgroundColor: theme2.colors.backgroundLight,
+                          borderTop: `1px solid ${theme2.colors.border}`
+                        },
+                        children: layer.items.map((item, itemIndex) => /* @__PURE__ */ jsxs(
+                          "div",
+                          {
+                            style: {
+                              display: "flex",
+                              alignItems: "center",
+                              gap: "8px",
+                              padding: "8px 16px 8px 48px",
+                              borderBottom: itemIndex < layer.items.length - 1 ? `1px solid ${theme2.colors.border}40` : "none"
+                            },
+                            children: [
+                              /* @__PURE__ */ jsx(
+                                FileText,
+                                {
+                                  size: 14,
+                                  style: {
+                                    color: layer.color,
+                                    flexShrink: 0
+                                  }
+                                }
+                              ),
+                              /* @__PURE__ */ jsxs(
+                                "div",
+                                {
+                                  style: {
+                                    display: "flex",
+                                    flexDirection: "column",
+                                    gap: "1px",
+                                    minWidth: 0,
+                                    flex: 1
+                                  },
+                                  children: [
+                                    /* @__PURE__ */ jsx(
+                                      "span",
+                                      {
+                                        style: {
+                                          fontFamily: theme2.fonts.body,
+                                          fontSize: theme2.fontSizes[0],
+                                          color: theme2.colors.text,
+                                          overflow: "hidden",
+                                          textOverflow: "ellipsis",
+                                          whiteSpace: "nowrap"
+                                        },
+                                        children: getFileName(item.path)
+                                      }
+                                    ),
+                                    getDirectory(item.path) && /* @__PURE__ */ jsx(
+                                      "span",
+                                      {
+                                        style: {
+                                          fontFamily: theme2.fonts.body,
+                                          fontSize: "10px",
+                                          color: theme2.colors.textSecondary,
+                                          overflow: "hidden",
+                                          textOverflow: "ellipsis",
+                                          whiteSpace: "nowrap"
+                                        },
+                                        children: getDirectory(item.path)
+                                      }
+                                    )
+                                  ]
+                                }
+                              ),
+                              /* @__PURE__ */ jsx(
+                                "span",
+                                {
+                                  style: {
+                                    fontFamily: theme2.fonts.body,
+                                    fontSize: "10px",
+                                    color: theme2.colors.textSecondary,
+                                    backgroundColor: `${layer.color}20`,
+                                    padding: "2px 6px",
+                                    borderRadius: "3px",
+                                    textTransform: "uppercase",
+                                    flexShrink: 0
+                                  },
+                                  children: item.renderStrategy
+                                }
+                              )
+                            ]
+                          },
+                          item.path
+                        ))
+                      }
+                    )
+                  ]
+                },
+                layer.id
+              );
+            })
+          }
+        )
+      ]
+    }
+  );
+};
+const LegendTabs = ({
+  tabs,
+  defaultTab,
+  onTabChange
+}) => {
+  var _a;
+  const { theme: theme2 } = useTheme();
+  const [activeTab, setActiveTab] = React.useState(
+    defaultTab || ((_a = tabs[0]) == null ? void 0 : _a.id) || "agent"
+  );
+  React.useEffect(() => {
+    if (tabs.length > 0 && !tabs.find((t) => t.id === activeTab)) {
+      setActiveTab(tabs[0].id);
+    }
+  }, [tabs, activeTab]);
+  const handleTabClick = (tabId) => {
+    setActiveTab(tabId);
+    onTabChange == null ? void 0 : onTabChange(tabId);
+  };
+  if (tabs.length === 0) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          flex: 1,
+          padding: "24px 16px",
+          color: theme2.colors.textSecondary,
+          fontFamily: theme2.fonts.body,
+          fontSize: theme2.fontSizes[0],
+          fontStyle: "italic"
+        },
+        children: "No data available"
+      }
+    );
+  }
+  if (tabs.length === 1) {
+    return /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", flex: 1, minHeight: 0 }, children: tabs[0].content });
+  }
+  const activeTabData = tabs.find((t) => t.id === activeTab);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        flex: 1,
+        minHeight: 0,
+        overflow: "hidden"
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexShrink: 0
+            },
+            children: tabs.map((tab, index) => {
+              const isActive = tab.id === activeTab;
+              return /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  onClick: () => handleTabClick(tab.id),
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    gap: "6px",
+                    flex: 1,
+                    padding: "10px 12px",
+                    backgroundColor: theme2.colors.background,
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderBottom: isActive ? `1px solid ${theme2.colors.background}` : `1px solid ${theme2.colors.border}`,
+                    borderLeft: index === 0 ? `1px solid ${theme2.colors.border}` : "none",
+                    marginBottom: "-1px",
+                    cursor: "pointer",
+                    fontFamily: theme2.fonts.body,
+                    fontSize: theme2.fontSizes[0],
+                    fontWeight: isActive ? 600 : 400,
+                    color: isActive ? theme2.colors.text : theme2.colors.textSecondary,
+                    opacity: isActive ? 1 : 0.9,
+                    transition: "all 0.15s ease"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          display: "flex",
+                          alignItems: "center",
+                          color: isActive ? theme2.colors.primary : theme2.colors.textSecondary
+                        },
+                        children: tab.icon
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("span", { children: tab.label }),
+                    tab.count !== void 0 && tab.count > 0 && /* @__PURE__ */ jsx(
                       "span",
                       {
                         style: {
-                          fontSize: theme2.fontSizes[0],
-                          fontFamily: theme2.fonts.body,
-                          color: theme2.colors.textSecondary,
-                          flexShrink: 0
+                          backgroundColor: isActive ? theme2.colors.primary : theme2.colors.border,
+                          color: isActive ? theme2.colors.background : theme2.colors.textSecondary,
+                          padding: "1px 6px",
+                          borderRadius: "8px",
+                          fontSize: "10px",
+                          fontWeight: 500,
+                          minWidth: "18px",
+                          textAlign: "center"
                         },
-                        children: fileType.count
+                        children: tab.count
                       }
                     )
                   ]
                 },
-                fileType.id
-              ))
-            }
-          )
-        ] })
+                tab.id
+              );
+            })
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              flex: 1,
+              minHeight: 0,
+              overflow: "auto",
+              borderTop: `1px solid ${theme2.colors.border}`
+            },
+            children: activeTabData == null ? void 0 : activeTabData.content
+          }
+        )
       ]
     }
   );
 };
+const createAgentTab = (content, count2) => ({
+  id: "agent",
+  label: "Agent",
+  icon: /* @__PURE__ */ jsx(Activity, { size: 14 }),
+  count: count2,
+  content
+});
+const createGitTab = (content, count2) => ({
+  id: "git",
+  label: "Git",
+  icon: /* @__PURE__ */ jsx(GitBranch, { size: 14 }),
+  count: count2,
+  content
+});
 function getDefaultExportFromCjs(x) {
   return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
 }
@@ -14258,9 +14952,11 @@ const COLOR_MODES = [
   { id: "fileTypes", name: "File Types", description: "Color by file extension" },
   { id: "git", name: "Git Status", description: "Color by git changes" },
   { id: "coverage", name: "Test Coverage", description: "Color by test coverage %" },
-  { id: "eslint", name: "Linting", description: "Color by ESLint issues" },
+  { id: "eslint", name: "Linting (ESLint)", description: "Color by ESLint issues" },
+  { id: "biome-lint", name: "Linting (Biome)", description: "Color by Biome lint issues" },
   { id: "typescript", name: "Type Safety", description: "Color by TypeScript errors" },
-  { id: "prettier", name: "Formatting", description: "Color by Prettier issues" },
+  { id: "prettier", name: "Formatting (Prettier)", description: "Color by Prettier issues" },
+  { id: "biome-format", name: "Formatting (Biome)", description: "Color by Biome format issues" },
   { id: "knip", name: "Dead Code", description: "Color by unused exports" },
   { id: "alexandria", name: "Documentation", description: "Color by doc coverage" }
 ];
@@ -14270,9 +14966,11 @@ const DEFAULT_COLOR_MODES = [
 ];
 const QUALITY_COLOR_MODES = [
   { id: "coverage", name: "Test Coverage", description: "Color by test coverage %" },
-  { id: "eslint", name: "Linting", description: "Color by ESLint issues" },
+  { id: "eslint", name: "Linting (ESLint)", description: "Color by ESLint issues" },
+  { id: "biome-lint", name: "Linting (Biome)", description: "Color by Biome lint issues" },
   { id: "typescript", name: "Type Safety", description: "Color by TypeScript errors" },
-  { id: "prettier", name: "Formatting", description: "Color by Prettier issues" },
+  { id: "prettier", name: "Formatting (Prettier)", description: "Color by Prettier issues" },
+  { id: "biome-format", name: "Formatting (Biome)", description: "Color by Biome format issues" },
   { id: "knip", name: "Dead Code", description: "Color by unused exports" },
   { id: "alexandria", name: "Documentation", description: "Color by doc coverage" }
 ];
@@ -14458,6 +15156,116 @@ function createEslintHighlightLayers(buildings, eslintMetrics) {
   }
   return layers;
 }
+function createBiomeLintHighlightLayers(buildings, biomeLintMetrics) {
+  const buildingsByPath = new Map(buildings.map((b) => [b.path, b]));
+  const metricsByPath = new Map(biomeLintMetrics.map((m) => [normalizePath(m.file), m]));
+  const layerGroups = {
+    clean: [],
+    // 0 issues - green
+    minor: [],
+    // 1-3 issues - orange
+    moderate: [],
+    // 4-10 issues - orange-red
+    significant: [],
+    // 11-25 issues - red
+    severe: [],
+    // 26+ issues - dark red
+    noData: []
+    // No metric data
+  };
+  for (const [path, building] of buildingsByPath) {
+    const normalizedPath = normalizePath(path);
+    const metric = metricsByPath.get(normalizedPath);
+    if (!metric) {
+      layerGroups.noData.push({
+        path: building.path,
+        type: "file",
+        renderStrategy: "fill"
+      });
+    } else {
+      const issues = metric.issueCount;
+      let bucket;
+      if (issues === 0) bucket = "clean";
+      else if (issues <= 3) bucket = "minor";
+      else if (issues <= 10) bucket = "moderate";
+      else if (issues <= 25) bucket = "significant";
+      else bucket = "severe";
+      layerGroups[bucket].push({
+        path: building.path,
+        type: "file",
+        renderStrategy: "fill"
+      });
+    }
+  }
+  const layers = [];
+  if (layerGroups.clean.length > 0) {
+    layers.push({
+      id: "biome-lint-clean",
+      name: "0 issues",
+      enabled: true,
+      color: "#22c55e",
+      // green - only for no lint issues
+      priority: 50,
+      items: layerGroups.clean
+    });
+  }
+  if (layerGroups.minor.length > 0) {
+    layers.push({
+      id: "biome-lint-minor",
+      name: "1-3 issues",
+      enabled: true,
+      color: "#f97316",
+      // orange
+      priority: 50,
+      items: layerGroups.minor
+    });
+  }
+  if (layerGroups.moderate.length > 0) {
+    layers.push({
+      id: "biome-lint-moderate",
+      name: "4-10 issues",
+      enabled: true,
+      color: "#ea580c",
+      // orange-600 (darker orange)
+      priority: 50,
+      items: layerGroups.moderate
+    });
+  }
+  if (layerGroups.significant.length > 0) {
+    layers.push({
+      id: "biome-lint-significant",
+      name: "11-25 issues",
+      enabled: true,
+      color: "#ef4444",
+      // red
+      priority: 50,
+      items: layerGroups.significant
+    });
+  }
+  if (layerGroups.severe.length > 0) {
+    layers.push({
+      id: "biome-lint-severe",
+      name: "26+ issues",
+      enabled: true,
+      color: "#991b1b",
+      // dark red
+      priority: 50,
+      items: layerGroups.severe
+    });
+  }
+  if (layerGroups.noData.length > 0) {
+    layers.push({
+      id: "biome-lint-nodata",
+      name: "No data",
+      enabled: true,
+      color: "#6b7280",
+      // gray
+      priority: 40,
+      items: layerGroups.noData
+    });
+  }
+  return layers;
+}
 function createTypescriptHighlightLayers(buildings, typescriptMetrics) {
   const buildingsByPath = new Map(buildings.map((b) => [b.path, b]));
   const metricsByPath = new Map(typescriptMetrics.map((m) => [normalizePath(m.file), m]));
@@ -14678,6 +15486,116 @@ function createPrettierHighlightLayers(buildings, prettierMetrics) {
   }
   return layers;
 }
+function createBiomeFormatHighlightLayers(buildings, biomeFormatMetrics) {
+  const buildingsByPath = new Map(buildings.map((b) => [b.path, b]));
+  const metricsByPath = new Map(biomeFormatMetrics.map((m) => [normalizePath(m.file), m]));
+  const layerGroups = {
+    clean: [],
+    // 0 issues - green
+    minor: [],
+    // 1-3 issues - orange
+    moderate: [],
+    // 4-10 issues - orange-red
+    significant: [],
+    // 11-25 issues - red
+    severe: [],
+    // 26+ issues - dark red
+    noData: []
+    // No metric data
+  };
+  for (const [path, building] of buildingsByPath) {
+    const normalizedPath = normalizePath(path);
+    const metric = metricsByPath.get(normalizedPath);
+    if (!metric) {
+      layerGroups.noData.push({
+        path: building.path,
+        type: "file",
+        renderStrategy: "fill"
+      });
+    } else {
+      const issues = metric.issueCount;
+      let bucket;
+      if (issues === 0) bucket = "clean";
+      else if (issues <= 3) bucket = "minor";
+      else if (issues <= 10) bucket = "moderate";
+      else if (issues <= 25) bucket = "significant";
+      else bucket = "severe";
+      layerGroups[bucket].push({
+        path: building.path,
+        type: "file",
+        renderStrategy: "fill"
+      });
+    }
+  }
+  const layers = [];
+  if (layerGroups.clean.length > 0) {
+    layers.push({
+      id: "biome-format-clean",
+      name: "0 issues",
+      enabled: true,
+      color: "#22c55e",
+      // green - only for perfect formatting
+      priority: 50,
+      items: layerGroups.clean
+    });
+  }
+  if (layerGroups.minor.length > 0) {
+    layers.push({
+      id: "biome-format-minor",
+      name: "1-3 issues",
+      enabled: true,
+      color: "#f97316",
+      // orange
+      priority: 50,
+      items: layerGroups.minor
+    });
+  }
+  if (layerGroups.moderate.length > 0) {
+    layers.push({
+      id: "biome-format-moderate",
+      name: "4-10 issues",
+      enabled: true,
+      color: "#ea580c",
+      // orange-600 (darker orange)
+      priority: 50,
+      items: layerGroups.moderate
+    });
+  }
+  if (layerGroups.significant.length > 0) {
+    layers.push({
+      id: "biome-format-significant",
+      name: "11-25 issues",
+      enabled: true,
+      color: "#ef4444",
+      // red
+      priority: 50,
+      items: layerGroups.significant
+    });
+  }
+  if (layerGroups.severe.length > 0) {
+    layers.push({
+      id: "biome-format-severe",
+      name: "26+ issues",
+      enabled: true,
+      color: "#991b1b",
+      // dark red
+      priority: 50,
+      items: layerGroups.severe
+    });
+  }
+  if (layerGroups.noData.length > 0) {
+    layers.push({
+      id: "biome-format-nodata",
+      name: "No data",
+      enabled: true,
+      color: "#6b7280",
+      // gray
+      priority: 40,
+      items: layerGroups.noData
+    });
+  }
+  return layers;
+}
 function createKnipHighlightLayers(buildings, knipMetrics) {
   const buildingsByPath = new Map(buildings.map((b) => [b.path, b]));
   const metricsByPath = new Map(knipMetrics.map((m) => [normalizePath(m.file), m]));
@@ -14859,7 +15777,7 @@ function createAlexandriaHighlightLayers(buildings, alexandriaMetrics) {
   return layers;
 }
 function getLayersForColorMode(mode, buildings, qualityData, fileColorLayers, gitLayers) {
-  var _a, _b, _c, _d, _e;
+  var _a, _b, _c, _d, _e, _f, _g;
   switch (mode) {
     case "fileTypes":
       return fileColorLayers;
@@ -14875,23 +15793,33 @@ function getLayersForColorMode(mode, buildings, qualityData, fileColorLayers, gi
         return createEslintHighlightLayers(buildings, qualityData.fileMetrics.eslint);
       }
       return [];
+    case "biome-lint":
+      if ((_b = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _b["biome-lint"]) {
+        return createBiomeLintHighlightLayers(buildings, qualityData.fileMetrics["biome-lint"]);
+      }
+      return [];
     case "typescript":
-      if ((_b = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _b.typescript) {
+      if ((_c = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _c.typescript) {
         return createTypescriptHighlightLayers(buildings, qualityData.fileMetrics.typescript);
       }
       return [];
     case "prettier":
-      if ((_c = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _c.prettier) {
+      if ((_d = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _d.prettier) {
         return createPrettierHighlightLayers(buildings, qualityData.fileMetrics.prettier);
       }
       return [];
+    case "biome-format":
+      if ((_e = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _e["biome-format"]) {
+        return createBiomeFormatHighlightLayers(buildings, qualityData.fileMetrics["biome-format"]);
+      }
+      return [];
     case "knip":
-      if ((_d = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _d.knip) {
+      if ((_f = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _f.knip) {
         return createKnipHighlightLayers(buildings, qualityData.fileMetrics.knip);
       }
       return [];
     case "alexandria":
-      if ((_e = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _e.alexandria) {
+      if ((_g = qualityData == null ? void 0 : qualityData.fileMetrics) == null ? void 0 : _g.alexandria) {
         return createAlexandriaHighlightLayers(buildings, qualityData.fileMetrics.alexandria);
       }
       return [];
@@ -14999,7 +15927,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;
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m, _n, _o, _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;
@@ -15021,8 +15949,18 @@ const CodeCityPanelContent = ({
         }
         return { type: "eslint", value: null, label: "No lint data" };
       }
+      case "biome-lint": {
+        const metric = (_f2 = (_e2 = qualityData.fileMetrics) == null ? void 0 : _e2["biome-lint"]) == null ? void 0 : _f2.find((m) => m.file === filePath);
+        if (metric) {
+          const parts = [];
+          if (metric.errorCount > 0) parts.push(`${metric.errorCount} error${metric.errorCount > 1 ? "s" : ""}`);
+          if (metric.warningCount > 0) parts.push(`${metric.warningCount} warning${metric.warningCount > 1 ? "s" : ""}`);
+          return { type: "biome-lint", value: metric, label: parts.length > 0 ? parts.join(", ") : "No issues" };
+        }
+        return { type: "biome-lint", value: null, label: "No lint data" };
+      }
       case "typescript": {
-        const metric = (_f2 = (_e2 = qualityData.fileMetrics) == null ? void 0 : _e2.typescript) == null ? void 0 : _f2.find((m) => m.file === filePath);
+        const metric = (_h2 = (_g2 = qualityData.fileMetrics) == null ? void 0 : _g2.typescript) == null ? void 0 : _h2.find((m) => m.file === filePath);
         if (metric) {
           const errors = metric.errorCount;
           return { type: "typescript", value: metric, label: errors > 0 ? `${errors} type error${errors > 1 ? "s" : ""}` : "No type errors" };
@@ -15030,15 +15968,23 @@ const CodeCityPanelContent = ({
         return { type: "typescript", value: null, label: "No type data" };
       }
       case "prettier": {
-        const metric = (_h2 = (_g2 = qualityData.fileMetrics) == null ? void 0 : _g2.prettier) == null ? void 0 : _h2.find((m) => m.file === filePath);
+        const metric = (_j2 = (_i2 = qualityData.fileMetrics) == null ? void 0 : _i2.prettier) == null ? void 0 : _j2.find((m) => m.file === filePath);
         if (metric) {
           const issues = metric.issueCount;
           return { type: "prettier", value: metric, label: issues > 0 ? `${issues} formatting issue${issues > 1 ? "s" : ""}` : "Properly formatted" };
         }
         return { type: "prettier", value: null, label: "No format data" };
       }
+      case "biome-format": {
+        const metric = (_l2 = (_k2 = qualityData.fileMetrics) == null ? void 0 : _k2["biome-format"]) == null ? void 0 : _l2.find((m) => m.file === filePath);
+        if (metric) {
+          const issues = metric.issueCount;
+          return { type: "biome-format", value: metric, label: issues > 0 ? `${issues} formatting issue${issues > 1 ? "s" : ""}` : "Properly formatted" };
+        }
+        return { type: "biome-format", value: null, label: "No format data" };
+      }
       case "knip": {
-        const metric = (_j2 = (_i2 = qualityData.fileMetrics) == null ? void 0 : _i2.knip) == null ? void 0 : _j2.find((m) => m.file === filePath);
+        const metric = (_n = (_m = qualityData.fileMetrics) == null ? void 0 : _m.knip) == null ? void 0 : _n.find((m) => m.file === filePath);
         if (metric) {
           const issues = metric.issueCount;
           return { type: "knip", value: metric, label: issues > 0 ? `${issues} unused export${issues > 1 ? "s" : ""}` : "No dead code" };
@@ -15046,7 +15992,7 @@ const CodeCityPanelContent = ({
         return { type: "knip", value: null, label: "No dead code data" };
       }
       case "alexandria": {
-        const metric = (_l2 = (_k2 = qualityData.fileMetrics) == null ? void 0 : _k2.alexandria) == null ? void 0 : _l2.find((m) => m.file === filePath);
+        const metric = (_p = (_o = qualityData.fileMetrics) == null ? void 0 : _o.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" };
@@ -15254,16 +16200,36 @@ const CodeCityPanelContent = ({
       enabled: layer.enabled
     }));
   }, [highlightLayers]);
+  const agentActivityLayers = useMemo(() => {
+    const agentLayers = highlightLayers.filter(
+      (layer) => layer.id.startsWith("event-highlight")
+    );
+    return agentLayers.map((layer) => ({
+      id: layer.id,
+      name: layer.name,
+      color: layer.color,
+      enabled: layer.enabled,
+      items: layer.items.map((item) => ({
+        path: item.path,
+        type: item.type,
+        renderStrategy: item.renderStrategy || "fill"
+      })),
+      timestamp: layer.timestamp
+    }));
+  }, [highlightLayers]);
+  const hasAgentActivity = agentActivityLayers.length > 0;
   const legendQualityMetrics = useMemo(() => {
-    const qualityModeIds = ["coverage", "eslint", "typescript", "prettier", "knip", "alexandria"];
+    const qualityModeIds = ["coverage", "eslint", "biome-lint", "typescript", "prettier", "biome-format", "knip", "alexandria"];
     if (!qualityModeIds.includes(colorMode)) {
       return [];
     }
     const qualityLayerPrefixes = {
       coverage: "coverage-",
       eslint: "eslint-",
+      "biome-lint": "biome-lint-",
       typescript: "typescript-",
       prettier: "prettier-",
+      "biome-format": "biome-format-",
       knip: "knip-",
       alexandria: "alexandria-"
     };
@@ -15329,7 +16295,7 @@ const CodeCityPanelContent = ({
   }, []);
   const toggleQualityMetric = useCallback((id2) => {
     setHighlightLayers((prev) => {
-      const qualityPrefixes = ["coverage-", "eslint-", "typescript-", "prettier-", "knip-", "alexandria-"];
+      const qualityPrefixes = ["coverage-", "eslint-", "biome-lint-", "typescript-", "prettier-", "biome-format-", "knip-", "alexandria-"];
       const isQualityLayer = (layerId) => qualityPrefixes.some((p) => layerId.startsWith(p));
       const qualityLayers2 = prev.filter((l) => isQualityLayer(l.id));
       const clickedLayer = qualityLayers2.find((l) => l.id === id2);
@@ -15787,7 +16753,40 @@ const CodeCityPanelContent = ({
                   ]
                 }
               ),
-              /* @__PURE__ */ jsx(
+              hasAgentActivity ? /* @__PURE__ */ jsx(
+                LegendTabs,
+                {
+                  tabs: [
+                    createAgentTab(
+                      /* @__PURE__ */ jsx(
+                        AgentActivityView,
+                        {
+                          layers: agentActivityLayers,
+                          onLayerClick: toggleAgentLayer,
+                          onClearAll: clearAgentLayers,
+                          showHeader: false
+                        }
+                      ),
+                      agentActivityLayers.length
+                    ),
+                    ...legendGitStatus.length > 0 ? [
+                      createGitTab(
+                        /* @__PURE__ */ jsx(
+                          Legend,
+                          {
+                            fileTypes: [],
+                            gitStatus: legendGitStatus,
+                            onGitStatusClick: toggleGitStatus,
+                            position: layout.legendPosition
+                          }
+                        ),
+                        legendGitStatus.reduce((sum, s) => sum + s.count, 0)
+                      )
+                    ] : []
+                  ],
+                  defaultTab: "agent"
+                }
+              ) : /* @__PURE__ */ jsx(
                 Legend,
                 {
                   fileTypes: legendFileTypes,