@industry-theme/file-city-panel 0.2.2 → 0.2.4

package/dist/panels/CodeCityPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeCityPanel.d.ts","sourceRoot":"","sources":["../../src/panels/CodeCityPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAuBjF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAYpD;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,OAAO,EAAE,MAAM,EAAE,CAAC;CACnB;AA2sCD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAEvD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EA4BxC,CAAC"}
+{"version":3,"file":"CodeCityPanel.d.ts","sourceRoot":"","sources":["../../src/panels/CodeCityPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AAsBjF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAYpD;;GAEG;AACH,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,OAAO,EAAE,MAAM,EAAE,CAAC;CACnB;AAuuCD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAEvD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EA8BxC,CAAC"}

package/dist/panels/components/Legend.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Legend.d.ts","sourceRoot":"","sources":["../../../src/panels/components/Legend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,WAAW;IACnB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,SAAS,CAAC,EAAE,eAAe,EAAE,CAAC;IAC9B,WAAW,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACjC,cAAc,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACvC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,gBAAgB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,iBAAiB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,oBAAoB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA8axC,CAAC"}
+{"version":3,"file":"Legend.d.ts","sourceRoot":"","sources":["../../../src/panels/components/Legend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAExD,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,WAAW;IACnB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,SAAS,CAAC,EAAE,eAAe,EAAE,CAAC;IAC9B,WAAW,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACjC,cAAc,CAAC,EAAE,mBAAmB,EAAE,CAAC;IACvC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,gBAAgB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,iBAAiB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,oBAAoB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;GAIG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA2bxC,CAAC"}

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$7 = [
+const __iconNode$6 = [
   [
     "path",
     {
@@ -115,14 +115,14 @@ const __iconNode$7 = [
     }
   ]
 ];
-const Activity = createLucideIcon("activity", __iconNode$7);
+const Activity = createLucideIcon("activity", __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$6 = [
+const __iconNode$5 = [
   ["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,35 +135,35 @@ const __iconNode$6 = [
   ],
   ["path", { d: "M6 21V5a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v16", key: "16ra0t" }]
 ];
-const Building2 = createLucideIcon("building-2", __iconNode$6);
+const Building2 = createLucideIcon("building-2", __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$5 = [
+const __iconNode$4 = [
   ["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$5);
+const ChartColumn = createLucideIcon("chart-column", __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$4 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
-const ChevronDown = createLucideIcon("chevron-down", __iconNode$4);
+const __iconNode$3 = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]];
+const ChevronDown = createLucideIcon("chevron-down", __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$3 = [
+const __iconNode$2 = [
   [
     "path",
     {
@@ -173,14 +173,14 @@ const __iconNode$3 = [
   ],
   ["path", { d: "M14 2v5a1 1 0 0 0 1 1h5", key: "wfsgrz" }]
 ];
-const File = createLucideIcon("file", __iconNode$3);
+const File = createLucideIcon("file", __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$2 = [
+const __iconNode$1 = [
   [
     "path",
     {
@@ -189,22 +189,7 @@ const __iconNode$2 = [
     }
   ]
 ];
-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 = [
-  ["path", { d: "M3 5h.01", key: "18ugdj" }],
-  ["path", { d: "M3 12h.01", key: "nlz23k" }],
-  ["path", { d: "M3 19h.01", key: "noohij" }],
-  ["path", { d: "M8 5h13", key: "1pao27" }],
-  ["path", { d: "M8 12h13", key: "1za7za" }],
-  ["path", { d: "M8 19h13", key: "m83p4d" }]
-];
-const List = createLucideIcon("list", __iconNode$1);
+const Folder = createLucideIcon("folder", __iconNode$1);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
@@ -2223,7 +2208,8 @@ const Legend = ({
                 display: "flex",
                 alignItems: "center",
                 gap: "6px",
-                fontSize: "11px",
+                fontSize: theme2.fontSizes[0],
+                fontFamily: theme2.fonts.body,
                 fontWeight: 600,
                 color: theme2.colors.textSecondary,
                 textTransform: "uppercase",
@@ -2281,7 +2267,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "11px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.text,
                           whiteSpace: "nowrap",
                           overflow: "hidden",
@@ -2296,7 +2283,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "10px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.textSecondary,
                           flexShrink: 0
                         },
@@ -2331,7 +2319,8 @@ const Legend = ({
                       display: "flex",
                       alignItems: "center",
                       gap: "6px",
-                      fontSize: "11px",
+                      fontSize: theme2.fontSizes[0],
+                      fontFamily: theme2.fonts.body,
                       fontWeight: 600,
                       color: theme2.colors.primary,
                       textTransform: "uppercase",
@@ -2352,7 +2341,8 @@ const Legend = ({
                       alignItems: "center",
                       gap: "4px",
                       padding: "2px 6px",
-                      fontSize: "10px",
+                      fontSize: theme2.fontSizes[0],
+                      fontFamily: theme2.fonts.body,
                       color: theme2.colors.textSecondary,
                       backgroundColor: "transparent",
                       border: `1px solid ${theme2.colors.border}`,
@@ -2416,7 +2406,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "11px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.text,
                           whiteSpace: "nowrap",
                           overflow: "hidden",
@@ -2431,7 +2422,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "10px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.textSecondary,
                           flexShrink: 0
                         },
@@ -2450,7 +2442,8 @@ const Legend = ({
             "div",
             {
               style: {
-                fontSize: "11px",
+                fontSize: theme2.fontSizes[0],
+                fontFamily: theme2.fonts.body,
                 fontWeight: 600,
                 color: theme2.colors.textSecondary,
                 textTransform: "uppercase",
@@ -2505,7 +2498,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "12px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.text,
                           whiteSpace: "nowrap",
                           overflow: "hidden",
@@ -2520,7 +2514,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "10px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.textSecondary,
                           flexShrink: 0
                         },
@@ -2539,7 +2534,8 @@ const Legend = ({
             "div",
             {
               style: {
-                fontSize: "11px",
+                fontSize: theme2.fontSizes[0],
+                fontFamily: theme2.fonts.body,
                 fontWeight: 600,
                 color: theme2.colors.textSecondary,
                 textTransform: "uppercase",
@@ -2595,7 +2591,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "12px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.text,
                           whiteSpace: "nowrap",
                           overflow: "hidden",
@@ -2610,7 +2607,8 @@ const Legend = ({
                       "span",
                       {
                         style: {
-                          fontSize: "10px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.textSecondary,
                           flexShrink: 0
                         },
@@ -14618,6 +14616,7 @@ const CodeCityPanelContent = ({
     resizeObserver.observe(container);
     return () => resizeObserver.disconnect();
   }, []);
+  const headerCompact = containerSize ? containerSize.width < 400 : false;
   const LEGEND_MIN_SIZE = 200;
   const layout = useMemo(() => {
     if (!containerSize) {
@@ -14682,9 +14681,16 @@ const CodeCityPanelContent = ({
       const payload = event.payload;
       setSelectedPackagePath((payload == null ? void 0 : payload.packagePath) ?? null);
     });
+    const cleanupColorMode = events.on("quality:colorMode:select", (event) => {
+      const payload = event.payload;
+      if (payload == null ? void 0 : payload.colorMode) {
+        setColorMode(payload.colorMode);
+      }
+    });
     return () => {
       cleanupHover == null ? void 0 : cleanupHover();
       cleanupSelect == null ? void 0 : cleanupSelect();
+      cleanupColorMode == null ? void 0 : cleanupColorMode();
     };
   }, [events]);
   const availableColorModes = useMemo(() => {
@@ -15185,26 +15191,40 @@ const CodeCityPanelContent = ({
               padding: "0 16px",
               height: "40px",
               borderBottom: `1px solid ${theme2.colors.border}`,
-              backgroundColor: theme2.colors.backgroundLight,
+              backgroundColor: theme2.colors.background,
               flexShrink: 0,
               gap: "12px"
             },
             children: [
-              /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: computedTreeStats && /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
-                  /* @__PURE__ */ jsx(File, { size: 14, style: { color: theme2.colors.textSecondary } }),
-                  /* @__PURE__ */ jsxs("span", { style: { fontSize: "13px", color: theme2.colors.text }, children: [
-                    computedTreeStats.fileCount.toLocaleString(),
-                    " files"
-                  ] })
-                ] }),
-                /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
-                  /* @__PURE__ */ jsx(Folder, { size: 14, style: { color: theme2.colors.textSecondary } }),
-                  /* @__PURE__ */ jsxs("span", { style: { fontSize: "13px", color: theme2.colors.text }, children: [
-                    computedTreeStats.directoryCount.toLocaleString(),
-                    " folders"
-                  ] })
-                ] })
+              /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", gap: "12px", minWidth: 0, flexShrink: 1 }, children: computedTreeStats && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    style: { display: "flex", alignItems: "center", gap: "4px", whiteSpace: "nowrap" },
+                    title: `${computedTreeStats.fileCount.toLocaleString()} files`,
+                    children: [
+                      /* @__PURE__ */ jsx(File, { size: 14, style: { color: theme2.colors.textSecondary, flexShrink: 0 } }),
+                      /* @__PURE__ */ jsxs("span", { style: { fontSize: theme2.fontSizes[1], fontFamily: theme2.fonts.body, color: theme2.colors.text }, children: [
+                        computedTreeStats.fileCount.toLocaleString(),
+                        !headerCompact && " files"
+                      ] })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    style: { display: "flex", alignItems: "center", gap: "4px", whiteSpace: "nowrap" },
+                    title: `${computedTreeStats.directoryCount.toLocaleString()} folders`,
+                    children: [
+                      /* @__PURE__ */ jsx(Folder, { size: 14, style: { color: theme2.colors.textSecondary, flexShrink: 0 } }),
+                      /* @__PURE__ */ jsxs("span", { style: { fontSize: theme2.fontSizes[1], fontFamily: theme2.fonts.body, color: theme2.colors.text }, children: [
+                        computedTreeStats.directoryCount.toLocaleString(),
+                        !headerCompact && " folders"
+                      ] })
+                    ]
+                  }
+                )
               ] }) }),
               availableColorModes.length > 1 && /* @__PURE__ */ jsxs(
                 "div",
@@ -15221,7 +15241,8 @@ const CodeCityPanelContent = ({
                           alignItems: "center",
                           gap: "6px",
                           padding: "4px 10px",
-                          fontSize: "12px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.text,
                           backgroundColor: theme2.colors.background,
                           border: `1px solid ${theme2.colors.border}`,
@@ -15276,7 +15297,8 @@ const CodeCityPanelContent = ({
                               alignItems: "flex-start",
                               width: "100%",
                               padding: "8px 12px",
-                              fontSize: "12px",
+                              fontSize: theme2.fontSizes[0],
+                              fontFamily: theme2.fonts.body,
                               color: mode.id === colorMode ? theme2.colors.primary : theme2.colors.text,
                               backgroundColor: mode.id === colorMode ? theme2.colors.primary + "15" : "transparent",
                               border: "none",
@@ -15300,7 +15322,8 @@ const CodeCityPanelContent = ({
                                 "span",
                                 {
                                   style: {
-                                    fontSize: "10px",
+                                    fontSize: theme2.fontSizes[0],
+                                    fontFamily: theme2.fonts.body,
                                     color: theme2.colors.textSecondary,
                                     marginTop: "2px"
                                   },
@@ -15316,28 +15339,28 @@ const CodeCityPanelContent = ({
                   ]
                 }
               ),
-              (legendFileTypes.length > 0 || legendGitStatus.length > 0 || legendQualityMetrics.length > 0) && /* @__PURE__ */ jsxs(
+              (legendFileTypes.length > 0 || legendGitStatus.length > 0 || legendQualityMetrics.length > 0) && /* @__PURE__ */ jsx(
                 "button",
                 {
                   onClick: () => setShowLegend(!showLegend),
                   style: {
-                    fontSize: "12px",
+                    fontSize: theme2.fontSizes[0],
+                    fontFamily: theme2.fonts.body,
                     color: showLegend ? theme2.colors.primary : theme2.colors.textSecondary,
                     backgroundColor: showLegend ? theme2.colors.primary + "22" : theme2.colors.background,
-                    padding: "2px 8px",
-                    borderRadius: "4px",
+                    padding: "0 16px",
+                    marginRight: "-16px",
+                    borderRadius: 0,
                     display: "flex",
                     alignItems: "center",
+                    alignSelf: "stretch",
                     gap: "4px",
-                    border: showLegend ? `1px solid ${theme2.colors.primary}` : "1px solid transparent",
+                    border: "none",
                     cursor: "pointer",
                     transition: "all 0.2s ease"
                   },
                   title: showLegend ? "Hide legend" : "Show legend",
-                  children: [
-                    /* @__PURE__ */ jsx(List, { size: 12 }),
-                    "Legend"
-                  ]
+                  children: "Legend"
                 }
               )
             ]
@@ -15422,7 +15445,8 @@ const CodeCityPanelContent = ({
                           display: "flex",
                           alignItems: "center",
                           padding: "0 12px",
-                          fontSize: "12px",
+                          fontSize: theme2.fontSizes[0],
+                          fontFamily: theme2.fonts.body,
                           color: theme2.colors.text,
                           gap: "12px",
                           flexShrink: 0
@@ -15444,8 +15468,9 @@ const CodeCityPanelContent = ({
                                   {
                                     style: {
                                       fontWeight: 600,
+                                      fontFamily: theme2.fonts.monospace,
                                       color: theme2.colors.primary,
-                                      fontSize: "13px",
+                                      fontSize: theme2.fontSizes[1],
                                       overflow: "hidden",
                                       textOverflow: "ellipsis",
                                       whiteSpace: "nowrap"
@@ -15457,8 +15482,9 @@ const CodeCityPanelContent = ({
                                   "div",
                                   {
                                     style: {
+                                      fontFamily: theme2.fonts.monospace,
                                       color: theme2.colors.textSecondary,
-                                      fontSize: "10px",
+                                      fontSize: theme2.fontSizes[0],
                                       overflow: "hidden",
                                       textOverflow: "ellipsis",
                                       whiteSpace: "nowrap"
@@ -15473,8 +15499,9 @@ const CodeCityPanelContent = ({
                             "div",
                             {
                               style: {
+                                fontFamily: theme2.fonts.body,
                                 color: theme2.colors.textSecondary,
-                                fontSize: "11px",
+                                fontSize: theme2.fontSizes[0],
                                 flexShrink: 0
                               },
                               children: [
@@ -15495,7 +15522,8 @@ const CodeCityPanelContent = ({
                                 backgroundColor: theme2.colors.backgroundLight,
                                 borderRadius: "4px",
                                 border: `1px solid ${theme2.colors.border}`,
-                                fontSize: "11px",
+                                fontSize: theme2.fontSizes[0],
+                                fontFamily: theme2.fonts.body,
                                 fontWeight: 500,
                                 color: hoveredFileMetric.value === null ? theme2.colors.textSecondary : theme2.colors.text,
                                 flexShrink: 0
@@ -15513,7 +15541,8 @@ const CodeCityPanelContent = ({
                                 alignItems: "center",
                                 gap: "8px",
                                 color: theme2.colors.text,
-                                fontSize: "11px"
+                                fontSize: theme2.fontSizes[0],
+                                fontFamily: theme2.fonts.body
                               },
                               children: [
                                 /* @__PURE__ */ jsxs(
@@ -15549,7 +15578,8 @@ const CodeCityPanelContent = ({
                               style: {
                                 color: theme2.colors.textSecondary,
                                 fontStyle: "italic",
-                                fontSize: "11px"
+                                fontSize: theme2.fontSizes[0],
+                                fontFamily: theme2.fonts.body
                               },
                               children: "Hover over files and directories to see details • Click to open"
                             }