@industry-theme/repository-composition-panels 0.2.4 → 0.2.5

package/dist/panels.bundle.js

@@ -1,157 +1,5 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import React2, { createContext, useState, useEffect, useContext, forwardRef, createElement, useRef, memo, PureComponent, isValidElement, cloneElement, useLayoutEffect, useMemo, useCallback, useImperativeHandle } from "react";
-var terminalTheme = {
-  space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
-  fonts: {
-    body: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace',
-    heading: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace',
-    monospace: '"SF Mono", "Monaco", "Inconsolata", "Fira Code", monospace'
-  },
-  fontSizes: [12, 14, 16, 18, 20, 24, 32, 48, 64, 96],
-  fontScale: 1,
-  fontWeights: {
-    body: 400,
-    heading: 500,
-    bold: 600,
-    light: 300,
-    medium: 500,
-    semibold: 600
-  },
-  lineHeights: {
-    body: 1.6,
-    heading: 1.3,
-    tight: 1.4,
-    relaxed: 1.8
-  },
-  breakpoints: ["640px", "768px", "1024px", "1280px"],
-  sizes: [16, 32, 64, 128, 256, 512, 768, 1024, 1536],
-  radii: [0, 2, 4, 6, 8, 12, 16, 24],
-  shadows: [
-    "none",
-    "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
-    "0 2px 4px 0 rgba(0, 0, 0, 0.06)",
-    "0 4px 6px 0 rgba(0, 0, 0, 0.07)",
-    "0 8px 12px 0 rgba(0, 0, 0, 0.08)",
-    "0 16px 24px 0 rgba(0, 0, 0, 0.10)"
-  ],
-  zIndices: [0, 1, 10, 20, 30, 40, 50],
-  colors: {
-    text: "#e4e4e4",
-    background: "rgba(10, 10, 10, 0.85)",
-    primary: "#66b3ff",
-    secondary: "#80c4ff",
-    accent: "#66ff99",
-    highlight: "rgba(102, 179, 255, 0.15)",
-    muted: "rgba(26, 26, 26, 0.8)",
-    success: "#66ff99",
-    warning: "#ffcc66",
-    error: "#ff6666",
-    info: "#66b3ff",
-    border: "rgba(255, 255, 255, 0.1)",
-    backgroundSecondary: "rgba(15, 15, 15, 0.9)",
-    backgroundTertiary: "rgba(20, 20, 20, 0.9)",
-    backgroundLight: "rgba(255, 255, 255, 0.05)",
-    backgroundHover: "rgba(102, 179, 255, 0.08)",
-    surface: "rgba(15, 15, 15, 0.95)",
-    textSecondary: "rgba(255, 255, 255, 0.7)",
-    textTertiary: "rgba(255, 255, 255, 0.5)",
-    textMuted: "rgba(255, 255, 255, 0.4)",
-    highlightBg: "rgba(255, 235, 59, 0.25)",
-    highlightBorder: "rgba(255, 235, 59, 0.5)"
-  },
-  modes: {
-    light: {
-      text: "#1a1a1a",
-      background: "rgba(255, 255, 255, 0.9)",
-      primary: "#0066cc",
-      secondary: "#0052a3",
-      accent: "#00cc88",
-      highlight: "rgba(0, 102, 204, 0.08)",
-      muted: "rgba(245, 245, 245, 0.8)",
-      success: "#00cc88",
-      warning: "#ffaa00",
-      error: "#ff3333",
-      info: "#0066cc",
-      border: "rgba(0, 0, 0, 0.1)",
-      backgroundSecondary: "rgba(250, 250, 250, 0.9)",
-      backgroundTertiary: "rgba(245, 245, 245, 0.9)",
-      backgroundLight: "rgba(0, 0, 0, 0.02)",
-      backgroundHover: "rgba(0, 102, 204, 0.04)",
-      surface: "rgba(255, 255, 255, 0.95)",
-      textSecondary: "rgba(0, 0, 0, 0.6)",
-      textTertiary: "rgba(0, 0, 0, 0.4)",
-      textMuted: "rgba(0, 0, 0, 0.3)",
-      highlightBg: "rgba(255, 235, 59, 0.3)",
-      highlightBorder: "rgba(255, 235, 59, 0.6)"
-    }
-  },
-  buttons: {
-    primary: {
-      color: "white",
-      bg: "primary",
-      borderWidth: 0,
-      "&:hover": {
-        bg: "secondary"
-      }
-    },
-    secondary: {
-      color: "primary",
-      bg: "transparent",
-      borderWidth: 1,
-      borderStyle: "solid",
-      borderColor: "primary",
-      "&:hover": {
-        bg: "highlight"
-      }
-    },
-    ghost: {
-      color: "text",
-      bg: "transparent",
-      "&:hover": {
-        bg: "backgroundHover"
-      }
-    }
-  },
-  text: {
-    heading: {
-      fontFamily: "heading",
-      fontWeight: "heading",
-      lineHeight: "heading"
-    },
-    body: {
-      fontFamily: "body",
-      fontWeight: "body",
-      lineHeight: "body"
-    },
-    caption: {
-      fontSize: 1,
-      color: "textSecondary"
-    }
-  },
-  cards: {
-    primary: {
-      bg: "surface",
-      border: "1px solid",
-      borderColor: "border",
-      borderRadius: 1
-    },
-    secondary: {
-      bg: "backgroundSecondary",
-      border: "1px solid",
-      borderColor: "border",
-      borderRadius: 1
-    }
-  }
-};
-function getMode(theme2, mode) {
-  if (!mode || !theme2.modes || !theme2.modes[mode]) {
-    return theme2.colors;
-  }
-  return {
-    ...theme2.colors,
-    ...theme2.modes[mode]
-  };
-}
+import React2, { createContext, useContext, forwardRef, createElement, useRef, useEffect, memo, PureComponent, isValidElement, cloneElement, useLayoutEffect, useMemo, useState, useCallback, useImperativeHandle } from "react";
 var ThemeContext;
 var getThemeContext = () => {
   if (typeof window !== "undefined") {
@@ -175,46 +23,6 @@ var useTheme = () => {
   }
   return context;
 };
-var ThemeProvider = ({
-  children,
-  theme: customTheme = theme,
-  initialMode
-}) => {
-  const [mode, setMode] = useState(initialMode);
-  const activeTheme = React2.useMemo(() => {
-    if (!mode || !customTheme.modes || !customTheme.modes[mode]) {
-      return customTheme;
-    }
-    return {
-      ...customTheme,
-      colors: getMode(customTheme, mode)
-    };
-  }, [customTheme, mode]);
-  useEffect(() => {
-    if (!initialMode) {
-      const savedMode = localStorage.getItem("principlemd-theme-mode");
-      if (savedMode) {
-        setMode(savedMode);
-      }
-    }
-  }, [initialMode]);
-  useEffect(() => {
-    if (mode) {
-      localStorage.setItem("principlemd-theme-mode", mode);
-    } else {
-      localStorage.removeItem("principlemd-theme-mode");
-    }
-  }, [mode]);
-  const value = {
-    theme: activeTheme,
-    mode,
-    setMode
-  };
-  return /* @__PURE__ */ React2.createElement(ThemeContextSingleton.Provider, {
-    value
-  }, children);
-};
-var theme = terminalTheme;
 /**
  * @license lucide-react v0.552.0 - ISC
  *
@@ -320,18 +128,18 @@ 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$q = [
+const __iconNode$p = [
   ["path", { d: "M5 12h14", key: "1ays0h" }],
   ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
 ];
-const ArrowRight = createLucideIcon("arrow-right", __iconNode$q);
+const ArrowRight = createLucideIcon("arrow-right", __iconNode$p);
 /**
  * @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$p = [
+const __iconNode$o = [
   [
     "path",
     {
@@ -342,46 +150,7 @@ const __iconNode$p = [
   ["path", { d: "m3.3 7 8.7 5 8.7-5", key: "g66t2b" }],
   ["path", { d: "M12 22V12", key: "d0xqtd" }]
 ];
-const Box = createLucideIcon("box", __iconNode$p);
-/**
- * @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$o = [
-  [
-    "path",
-    {
-      d: "M2.97 12.92A2 2 0 0 0 2 14.63v3.24a2 2 0 0 0 .97 1.71l3 1.8a2 2 0 0 0 2.06 0L12 19v-5.5l-5-3-4.03 2.42Z",
-      key: "lc1i9w"
-    }
-  ],
-  ["path", { d: "m7 16.5-4.74-2.85", key: "1o9zyk" }],
-  ["path", { d: "m7 16.5 5-3", key: "va8pkn" }],
-  ["path", { d: "M7 16.5v5.17", key: "jnp8gn" }],
-  [
-    "path",
-    {
-      d: "M12 13.5V19l3.97 2.38a2 2 0 0 0 2.06 0l3-1.8a2 2 0 0 0 .97-1.71v-3.24a2 2 0 0 0-.97-1.71L17 10.5l-5 3Z",
-      key: "8zsnat"
-    }
-  ],
-  ["path", { d: "m17 16.5-5-3", key: "8arw3v" }],
-  ["path", { d: "m17 16.5 4.74-2.85", key: "8rfmw" }],
-  ["path", { d: "M17 16.5v5.17", key: "k6z78m" }],
-  [
-    "path",
-    {
-      d: "M7.97 4.42A2 2 0 0 0 7 6.13v4.37l5 3 5-3V6.13a2 2 0 0 0-.97-1.71l-3-1.8a2 2 0 0 0-2.06 0l-3 1.8Z",
-      key: "1xygjf"
-    }
-  ],
-  ["path", { d: "M12 8 7.26 5.15", key: "1vbdud" }],
-  ["path", { d: "m12 8 4.74-2.85", key: "3rx089" }],
-  ["path", { d: "M12 13.5V8", key: "1io7kd" }]
-];
-const Boxes = createLucideIcon("boxes", __iconNode$o);
+const Box = createLucideIcon("box", __iconNode$o);
 /**
  * @license lucide-react v0.552.0 - ISC
  *
@@ -7896,7 +7665,7 @@ function TreeNode({
   node,
   style,
   dragHandle,
-  theme: theme2,
+  theme,
   rightContent,
   extraContent,
   isSelectedDirectory = false,
@@ -7910,14 +7679,14 @@ function TreeNode({
     style: { marginRight: "4px", display: "flex", alignItems: "center" }
   }, node.isOpen ? /* @__PURE__ */ React2.createElement(ChevronDown, {
     size: 16,
-    color: theme2.colors.text
+    color: theme.colors.text
   }) : /* @__PURE__ */ React2.createElement(ChevronRight, {
     size: 16,
-    color: theme2.colors.text
+    color: theme.colors.text
   })) : null;
-  const backgroundColor = node.isSelected ? `${theme2.colors.primary}20` : isSelectedDirectory ? `${theme2.colors.primary}15` : isHovered ? `${theme2.colors.text}10` : "transparent";
-  const border = node.isSelected ? `1px solid ${theme2.colors.primary}` : "1px solid transparent";
-  const color = nameColor ? nameColor : node.isSelected || isSelectedDirectory ? theme2.colors.primary : theme2.colors.text;
+  const backgroundColor = node.isSelected ? `${theme.colors.primary}20` : isSelectedDirectory ? `${theme.colors.primary}15` : isHovered ? `${theme.colors.text}10` : "transparent";
+  const border = node.isSelected ? `1px solid ${theme.colors.primary}` : "1px solid transparent";
+  const color = nameColor ? nameColor : node.isSelected || isSelectedDirectory ? theme.colors.primary : theme.colors.text;
   return /* @__PURE__ */ React2.createElement("div", {
     style: {
       ...style,
@@ -7959,7 +7728,7 @@ function TreeNode({
     style: { flexShrink: 0 }
   }, rightContent));
 }
-var getGitStatusDisplay2 = (status, theme2) => {
+var getGitStatusDisplay2 = (status, theme) => {
   switch (status) {
     case "M":
     case "MM":
@@ -7967,7 +7736,7 @@ var getGitStatusDisplay2 = (status, theme2) => {
         icon: /* @__PURE__ */ React2.createElement(SquarePen, {
           size: 14
         }),
-        color: theme2.colors.primary || "#007bff",
+        color: theme.colors.primary || "#007bff",
         label: "Modified"
       };
     case "A":
@@ -8092,7 +7861,7 @@ var countVisibleNodes2 = (nodes, openByDefault) => {
 };
 var GitStatusFileTree = ({
   fileTree,
-  theme: theme2,
+  theme,
   gitStatusData,
   selectedDirectories = [],
   selectedFile,
@@ -8115,12 +7884,12 @@ var GitStatusFileTree = ({
   }, [gitStatusData]);
   const NodeRenderer = (props) => {
     const { node } = props;
-    const gitDisplay = node.data.gitStatus ? getGitStatusDisplay2(node.data.gitStatus, theme2) : null;
+    const gitDisplay = node.data.gitStatus ? getGitStatusDisplay2(node.data.gitStatus, theme) : null;
     let nameColor;
     if (gitDisplay) {
       nameColor = gitDisplay.color;
     } else if (node.data.hasChangedChildren) {
-      const baseColor = theme2.colors.primary || "#007bff";
+      const baseColor = theme.colors.primary || "#007bff";
       nameColor = baseColor + "80";
     }
     const rightContent = gitDisplay ? /* @__PURE__ */ React2.createElement("div", {
@@ -8140,7 +7909,7 @@ var GitStatusFileTree = ({
     }, node.data.gitStatus)) : null;
     return /* @__PURE__ */ React2.createElement(TreeNode, {
       ...props,
-      theme: theme2,
+      theme,
       rightContent,
       nameColor,
       horizontalNodePadding,
@@ -8181,9 +7950,9 @@ var GitStatusFileTree = ({
   return /* @__PURE__ */ React2.createElement("div", {
     ref: containerRef,
     style: {
-      backgroundColor: transparentBackground ? "transparent" : theme2.colors.background,
-      color: theme2.colors.text,
-      fontFamily: theme2.fonts.body,
+      backgroundColor: transparentBackground ? "transparent" : theme.colors.background,
+      color: theme.colors.text,
+      fontFamily: theme.fonts.body,
       ...autoHeight ? {} : { height: "100%" }
     }
   }, /* @__PURE__ */ React2.createElement(Tree, {
@@ -8324,7 +8093,7 @@ const GitChangesPanelContent = ({
   loadingMessage = "Loading git changes...",
   selectedFile
 }) => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   const hasChanges = gitStatus.staged.length > 0 || gitStatus.unstaged.length > 0 || gitStatus.untracked.length > 0 || gitStatus.deleted.length > 0;
   const [showFullTree, setShowFullTree] = useState(false);
   const userHasToggledView = useRef(false);
@@ -8430,7 +8199,7 @@ const GitChangesPanelContent = ({
       style: {
         display: "flex",
         alignItems: "stretch",
-        backgroundColor: theme2.colors.backgroundTertiary,
+        backgroundColor: theme.colors.backgroundTertiary,
         width: "100%"
       },
       children: [
@@ -8444,10 +8213,10 @@ const GitChangesPanelContent = ({
             style: {
               flex: 1,
               padding: "6px 12px",
-              fontSize: theme2.fontSizes[1],
-              backgroundColor: showFullTree ? theme2.colors.backgroundSecondary : "transparent",
-              color: showFullTree ? theme2.colors.text : theme2.colors.textSecondary,
-              border: showFullTree ? `1px solid ${theme2.colors.border}` : "1px solid transparent",
+              fontSize: theme.fontSizes[1],
+              backgroundColor: showFullTree ? theme.colors.backgroundSecondary : "transparent",
+              color: showFullTree ? theme.colors.text : theme.colors.textSecondary,
+              border: showFullTree ? `1px solid ${theme.colors.border}` : "1px solid transparent",
               cursor: "pointer",
               fontWeight: showFullTree ? 600 : 400,
               transition: "all 0.2s"
@@ -8465,10 +8234,10 @@ const GitChangesPanelContent = ({
             style: {
               flex: 1,
               padding: "6px 12px",
-              fontSize: theme2.fontSizes[1],
-              backgroundColor: !showFullTree ? theme2.colors.backgroundSecondary : "transparent",
-              color: !showFullTree ? theme2.colors.text : theme2.colors.textSecondary,
-              border: !showFullTree ? `1px solid ${theme2.colors.border}` : "1px solid transparent",
+              fontSize: theme.fontSizes[1],
+              backgroundColor: !showFullTree ? theme.colors.backgroundSecondary : "transparent",
+              color: !showFullTree ? theme.colors.text : theme.colors.textSecondary,
+              border: !showFullTree ? `1px solid ${theme.colors.border}` : "1px solid transparent",
               cursor: "pointer",
               fontWeight: !showFullTree ? 600 : 400,
               transition: "all 0.2s"
@@ -8487,7 +8256,7 @@ const GitChangesPanelContent = ({
           style: {
             padding: "20px",
             textAlign: "center",
-            color: theme2.colors.textSecondary
+            color: theme.colors.textSecondary
           },
           children: loadingMessage
         }
@@ -8500,7 +8269,7 @@ const GitChangesPanelContent = ({
           style: {
             padding: "20px",
             textAlign: "center",
-            color: theme2.colors.textSecondary
+            color: theme.colors.textSecondary
           },
           children: emptyMessage
         }
@@ -8513,7 +8282,7 @@ const GitChangesPanelContent = ({
       GitStatusFileTree,
       {
         fileTree: gitChangesData.tree,
-        theme: theme2,
+        theme,
         gitStatusData: gitChangesData.statusData,
         onFileSelect: handleFileSelect,
         selectedFile,
@@ -8521,23 +8290,23 @@ const GitChangesPanelContent = ({
         horizontalNodePadding: "16px",
         openByDefault: !showFullTree
       },
-      `${showFullTree}-${gitChangesData.statusData.length}`
+      showFullTree ? "full" : "changes"
     );
   };
   return /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%" }, children: [
-    /* @__PURE__ */ jsx("div", { style: { borderBottom: `1px solid ${theme2.colors.border}` }, children: /* @__PURE__ */ jsx(ToggleButtons, {}) }),
+    /* @__PURE__ */ jsx("div", { style: { borderBottom: `1px solid ${theme.colors.border}` }, children: /* @__PURE__ */ jsx(ToggleButtons, {}) }),
     /* @__PURE__ */ jsx("div", { style: { flex: 1, overflow: "auto" }, children: /* @__PURE__ */ jsx(Content, {}) })
   ] });
 };
 const GitChangesPanelPreview = () => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   return /* @__PURE__ */ jsxs(
     "div",
     {
       style: {
         padding: "12px",
         fontSize: "12px",
-        color: theme2.colors.text,
+        color: theme.colors.text,
         display: "flex",
         flexDirection: "column",
         gap: "6px"
@@ -8750,7 +8519,7 @@ const DependencyInfoModal = ({
   isOpen,
   onClose
 }) => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   if (!isOpen) return null;
   return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
     "div",
@@ -8761,8 +8530,8 @@ const DependencyInfoModal = ({
         left: 0,
         right: 0,
         bottom: 0,
-        backgroundColor: theme2.colors.muted,
-        zIndex: theme2.zIndices[4],
+        backgroundColor: theme.colors.muted,
+        zIndex: theme.zIndices[4],
         display: "flex",
         alignItems: "center",
         justifyContent: "center"
@@ -8772,15 +8541,15 @@ const DependencyInfoModal = ({
         "div",
         {
           style: {
-            backgroundColor: theme2.colors.background,
-            borderRadius: `${theme2.radii[3]}px`,
+            backgroundColor: theme.colors.background,
+            borderRadius: `${theme.radii[3]}px`,
             maxWidth: "600px",
             maxHeight: "80vh",
             width: "90%",
             overflow: "hidden",
             display: "flex",
             flexDirection: "column",
-            boxShadow: theme2.shadows[3]
+            boxShadow: theme.shadows[3]
           },
           onClick: (e) => e.stopPropagation(),
           children: [
@@ -8788,8 +8557,8 @@ const DependencyInfoModal = ({
               "div",
               {
                 style: {
-                  padding: `${theme2.space[4]}px`,
-                  borderBottom: `1px solid ${theme2.colors.border}`,
+                  padding: `${theme.space[4]}px`,
+                  borderBottom: `1px solid ${theme.colors.border}`,
                   display: "flex",
                   alignItems: "center",
                   justifyContent: "space-between"
@@ -8799,12 +8568,12 @@ const DependencyInfoModal = ({
                     "h2",
                     {
                       style: {
-                        fontSize: `${theme2.fontSizes[4]}px`,
-                        fontWeight: theme2.fontWeights.semibold,
-                        color: theme2.colors.text,
+                        fontSize: `${theme.fontSizes[4]}px`,
+                        fontWeight: theme.fontWeights.semibold,
+                        color: theme.colors.text,
                         display: "flex",
                         alignItems: "center",
-                        gap: `${theme2.space[2]}px`,
+                        gap: `${theme.space[2]}px`,
                         margin: 0
                       },
                       children: [
@@ -8820,9 +8589,9 @@ const DependencyInfoModal = ({
                       style: {
                         background: "none",
                         border: "none",
-                        color: theme2.colors.textSecondary,
+                        color: theme.colors.textSecondary,
                         cursor: "pointer",
-                        padding: `${theme2.space[1]}px`
+                        padding: `${theme.space[1]}px`
                       },
                       children: /* @__PURE__ */ jsx(X, { size: 20 })
                     }
@@ -8834,7 +8603,7 @@ const DependencyInfoModal = ({
               "div",
               {
                 style: {
-                  padding: `${theme2.space[4]}px`,
+                  padding: `${theme.space[4]}px`,
                   overflow: "auto",
                   flex: 1
                 },
@@ -8844,33 +8613,33 @@ const DependencyInfoModal = ({
                     {
                       icon: /* @__PURE__ */ jsx(Package, { size: 18 }),
                       title: "Dependency Types",
-                      theme: theme2,
+                      theme,
                       children: [
                         /* @__PURE__ */ jsx(
                           InfoItem,
                           {
-                            badge: { text: "prod", color: theme2.colors.primary },
+                            badge: { text: "prod", color: theme.colors.primary },
                             title: "Production Dependencies",
                             description: "Required for your application to run in production. These are bundled with your app and affect its size and security.",
-                            theme: theme2
+                            theme
                           }
                         ),
                         /* @__PURE__ */ jsx(
                           InfoItem,
                           {
-                            badge: { text: "dev", color: theme2.colors.secondary },
+                            badge: { text: "dev", color: theme.colors.secondary },
                             title: "Development Dependencies",
                             description: "Only needed during development (build tools, testing, linters). Not included in production builds.",
-                            theme: theme2
+                            theme
                           }
                         ),
                         /* @__PURE__ */ jsx(
                           InfoItem,
                           {
-                            badge: { text: "peer", color: theme2.colors.accent },
+                            badge: { text: "peer", color: theme.colors.accent },
                             title: "Peer Dependencies",
                             description: "Expected to be provided by the consumer of your package. Important for library authors to specify compatibility.",
-                            theme: theme2
+                            theme
                           }
                         )
                       ]
@@ -8881,24 +8650,24 @@ const DependencyInfoModal = ({
                     {
                       icon: /* @__PURE__ */ jsx(Scale, { size: 18 }),
                       title: "Common Licenses",
-                      theme: theme2,
+                      theme,
                       children: [
                         /* @__PURE__ */ jsx(
                           InfoItem,
                           {
-                            badge: { text: "MIT", color: theme2.colors.success },
+                            badge: { text: "MIT", color: theme.colors.success },
                             title: "Permissive Licenses (MIT, Apache, BSD)",
                             description: "Few restrictions. Can use in commercial projects. Must include copyright notice.",
-                            theme: theme2
+                            theme
                           }
                         ),
                         /* @__PURE__ */ jsx(
                           InfoItem,
                           {
-                            badge: { text: "GPL", color: theme2.colors.warning },
+                            badge: { text: "GPL", color: theme.colors.warning },
                             title: "Copyleft Licenses (GPL, LGPL, AGPL)",
                             description: "Requires sharing source code of derivative works. Can impact your project's licensing.",
-                            theme: theme2
+                            theme
                           }
                         )
                       ]
@@ -8913,18 +8682,18 @@ const DependencyInfoModal = ({
     }
   ) });
 };
-const Section = ({ icon, title, theme: theme2, children }) => /* @__PURE__ */ jsxs("div", { style: { marginBottom: `${theme2.space[5]}px` }, children: [
+const Section = ({ icon, title, theme, children }) => /* @__PURE__ */ jsxs("div", { style: { marginBottom: `${theme.space[5]}px` }, children: [
   /* @__PURE__ */ jsxs(
     "h3",
     {
       style: {
-        fontSize: `${theme2.fontSizes[2]}px`,
-        fontWeight: theme2.fontWeights.semibold,
-        color: theme2.colors.text,
-        marginBottom: `${theme2.space[3]}px`,
+        fontSize: `${theme.fontSizes[2]}px`,
+        fontWeight: theme.fontWeights.semibold,
+        color: theme.colors.text,
+        marginBottom: `${theme.space[3]}px`,
         display: "flex",
         alignItems: "center",
-        gap: `${theme2.space[2]}px`
+        gap: `${theme.space[2]}px`
       },
       children: [
         icon,
@@ -8938,20 +8707,20 @@ const Section = ({ icon, title, theme: theme2, children }) => /* @__PURE__ */ js
       style: {
         display: "flex",
         flexDirection: "column",
-        gap: `${theme2.space[2]}px`
+        gap: `${theme.space[2]}px`
       },
       children
     }
   )
 ] });
-const InfoItem = ({ badge, title, description, theme: theme2 }) => /* @__PURE__ */ jsxs(
+const InfoItem = ({ badge, title, description, theme }) => /* @__PURE__ */ jsxs(
   "div",
   {
     style: {
-      padding: `${theme2.space[3]}px`,
-      backgroundColor: theme2.colors.backgroundSecondary,
-      borderRadius: `${theme2.radii[2]}px`,
-      border: `1px solid ${theme2.colors.border}`
+      padding: `${theme.space[3]}px`,
+      backgroundColor: theme.colors.backgroundSecondary,
+      borderRadius: `${theme.radii[2]}px`,
+      border: `1px solid ${theme.colors.border}`
     },
     children: [
       /* @__PURE__ */ jsxs(
@@ -8960,18 +8729,18 @@ const InfoItem = ({ badge, title, description, theme: theme2 }) => /* @__PURE__
           style: {
             display: "flex",
             alignItems: "center",
-            gap: `${theme2.space[2]}px`,
-            marginBottom: `${theme2.space[1]}px`
+            gap: `${theme.space[2]}px`,
+            marginBottom: `${theme.space[1]}px`
           },
           children: [
             /* @__PURE__ */ jsx(
               "span",
               {
                 style: {
-                  padding: `${theme2.space[1]}px ${theme2.space[2]}px`,
-                  borderRadius: `${theme2.radii[1]}px`,
-                  fontSize: `${theme2.fontSizes[0]}px`,
-                  fontWeight: theme2.fontWeights.medium,
+                  padding: `${theme.space[1]}px ${theme.space[2]}px`,
+                  borderRadius: `${theme.radii[1]}px`,
+                  fontSize: `${theme.fontSizes[0]}px`,
+                  fontWeight: theme.fontWeights.medium,
                   backgroundColor: `${badge.color}20`,
                   color: badge.color
                 },
@@ -8982,9 +8751,9 @@ const InfoItem = ({ badge, title, description, theme: theme2 }) => /* @__PURE__
               "span",
               {
                 style: {
-                  fontSize: `${theme2.fontSizes[1]}px`,
-                  fontWeight: theme2.fontWeights.medium,
-                  color: theme2.colors.text
+                  fontSize: `${theme.fontSizes[1]}px`,
+                  fontWeight: theme.fontWeights.medium,
+                  color: theme.colors.text
                 },
                 children: title
               }
@@ -8996,9 +8765,9 @@ const InfoItem = ({ badge, title, description, theme: theme2 }) => /* @__PURE__
         "div",
         {
           style: {
-            fontSize: `${theme2.fontSizes[1]}px`,
-            color: theme2.colors.textSecondary,
-            lineHeight: theme2.lineHeights.relaxed
+            fontSize: `${theme.fontSizes[1]}px`,
+            color: theme.colors.textSecondary,
+            lineHeight: theme.lineHeights.relaxed
           },
           children: description
         }
@@ -9007,15 +8776,15 @@ const InfoItem = ({ badge, title, description, theme: theme2 }) => /* @__PURE__
   }
 );
 const DependencyRow = ({ dependency }) => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   const [isHovered, setIsHovered] = useState(false);
   const [copied, setCopied] = useState(false);
   const getDependencyTypeBadgeStyle = (type) => {
     const baseStyle = {
-      padding: `${theme2.space[1]}px ${theme2.space[2]}px`,
-      borderRadius: `${theme2.radii[1]}px`,
-      fontSize: `${theme2.fontSizes[0]}px`,
-      fontWeight: theme2.fontWeights.medium,
+      padding: `${theme.space[1]}px ${theme.space[2]}px`,
+      borderRadius: `${theme.radii[1]}px`,
+      fontSize: `${theme.fontSizes[0]}px`,
+      fontWeight: theme.fontWeights.medium,
       minWidth: "36px",
       textAlign: "center"
     };
@@ -9023,26 +8792,26 @@ const DependencyRow = ({ dependency }) => {
       case "production":
         return {
           ...baseStyle,
-          backgroundColor: `${theme2.colors.primary}20`,
-          color: theme2.colors.primary
+          backgroundColor: `${theme.colors.primary}20`,
+          color: theme.colors.primary
         };
       case "development":
         return {
           ...baseStyle,
-          backgroundColor: `${theme2.colors.secondary}20`,
-          color: theme2.colors.secondary
+          backgroundColor: `${theme.colors.secondary}20`,
+          color: theme.colors.secondary
         };
       case "peer":
         return {
           ...baseStyle,
-          backgroundColor: `${theme2.colors.accent}20`,
-          color: theme2.colors.accent
+          backgroundColor: `${theme.colors.accent}20`,
+          color: theme.colors.accent
         };
       default:
         return {
           ...baseStyle,
-          backgroundColor: theme2.colors.backgroundLight,
-          color: theme2.colors.textSecondary
+          backgroundColor: theme.colors.backgroundLight,
+          color: theme.colors.textSecondary
         };
     }
   };
@@ -9059,8 +8828,8 @@ const DependencyRow = ({ dependency }) => {
     }
   };
   const actionButtonStyle = {
-    padding: `${theme2.space[1]}px`,
-    borderRadius: `${theme2.radii[1]}px`,
+    padding: `${theme.space[1]}px`,
+    borderRadius: `${theme.radii[1]}px`,
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
@@ -9078,11 +8847,11 @@ const DependencyRow = ({ dependency }) => {
         display: "flex",
         alignItems: "center",
         justifyContent: "space-between",
-        padding: `${theme2.space[2]}px ${theme2.space[3]}px`,
-        backgroundColor: theme2.colors.background,
-        borderRadius: `${theme2.radii[1]}px`,
-        fontSize: `${theme2.fontSizes[1]}px`,
-        border: `1px solid ${theme2.colors.border}`,
+        padding: `${theme.space[2]}px ${theme.space[3]}px`,
+        backgroundColor: theme.colors.background,
+        borderRadius: `${theme.radii[1]}px`,
+        fontSize: `${theme.fontSizes[1]}px`,
+        border: `1px solid ${theme.colors.border}`,
         transition: "all 0.2s"
       },
       onMouseEnter: () => setIsHovered(true),
@@ -9094,7 +8863,7 @@ const DependencyRow = ({ dependency }) => {
             style: {
               display: "flex",
               alignItems: "center",
-              gap: `${theme2.space[2]}px`,
+              gap: `${theme.space[2]}px`,
               flex: 1,
               minWidth: 0
             },
@@ -9104,8 +8873,8 @@ const DependencyRow = ({ dependency }) => {
                 "span",
                 {
                   style: {
-                    fontWeight: theme2.fontWeights.medium,
-                    color: theme2.colors.text,
+                    fontWeight: theme.fontWeights.medium,
+                    color: theme.colors.text,
                     overflow: "hidden",
                     textOverflow: "ellipsis",
                     whiteSpace: "nowrap"
@@ -9121,7 +8890,7 @@ const DependencyRow = ({ dependency }) => {
                   rel: "noopener noreferrer",
                   style: {
                     ...actionButtonStyle,
-                    color: theme2.colors.textSecondary,
+                    color: theme.colors.textSecondary,
                     textDecoration: "none",
                     flexShrink: 0
                   },
@@ -9148,13 +8917,13 @@ const DependencyRow = ({ dependency }) => {
                   onClick: handleCopy,
                   style: {
                     ...actionButtonStyle,
-                    color: copied ? theme2.colors.success || "#10b981" : theme2.colors.textSecondary
+                    color: copied ? theme.colors.success || "#10b981" : theme.colors.textSecondary
                   },
                   title: copied ? "Copied!" : `Copy ${dependency.name}@${dependency.version}`,
                   children: copied ? /* @__PURE__ */ jsx(Check, { size: 12 }) : /* @__PURE__ */ jsx(Copy, { size: 12 })
                 }
               ),
-              /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary }, children: dependency.version })
+              /* @__PURE__ */ jsx("span", { style: { color: theme.colors.textSecondary }, children: dependency.version })
             ]
           }
         )
@@ -9169,7 +8938,7 @@ const FilterBar = ({
   onSearchChange,
   counts
 }) => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   const availableFilters = [
     ...counts.peer > 0 ? ["peer"] : [],
     ...counts.production > 0 ? ["production"] : [],
@@ -9182,7 +8951,7 @@ const FilterBar = ({
       style: {
         display: "flex",
         flexDirection: "column",
-        gap: `${theme2.space[2]}px`
+        gap: `${theme.space[2]}px`
       },
       children: [
         /* @__PURE__ */ jsxs(
@@ -9200,8 +8969,8 @@ const FilterBar = ({
                   size: 14,
                   style: {
                     position: "absolute",
-                    left: `${theme2.space[3]}px`,
-                    color: theme2.colors.textSecondary,
+                    left: `${theme.space[3]}px`,
+                    color: theme.colors.textSecondary,
                     pointerEvents: "none"
                   }
                 }
@@ -9215,13 +8984,13 @@ const FilterBar = ({
                   onChange: (e) => onSearchChange(e.target.value),
                   style: {
                     width: "100%",
-                    padding: `${theme2.space[2]}px ${theme2.space[5]}px`,
-                    borderRadius: `${theme2.radii[2]}px`,
-                    border: `1px solid ${theme2.colors.border}`,
-                    backgroundColor: theme2.colors.backgroundSecondary,
-                    color: theme2.colors.text,
-                    fontSize: `${theme2.fontSizes[1]}px`,
-                    fontFamily: theme2.fonts.body,
+                    padding: `${theme.space[2]}px ${theme.space[5]}px`,
+                    borderRadius: `${theme.radii[2]}px`,
+                    border: `1px solid ${theme.colors.border}`,
+                    backgroundColor: theme.colors.backgroundSecondary,
+                    color: theme.colors.text,
+                    fontSize: `${theme.fontSizes[1]}px`,
+                    fontFamily: theme.fonts.body,
                     outline: "none",
                     transition: "all 0.2s"
                   }
@@ -9233,24 +9002,24 @@ const FilterBar = ({
                   onClick: () => onSearchChange(""),
                   style: {
                     position: "absolute",
-                    right: `${theme2.space[2]}px`,
-                    padding: `${theme2.space[1]}px`,
+                    right: `${theme.space[2]}px`,
+                    padding: `${theme.space[1]}px`,
                     display: "flex",
                     alignItems: "center",
                     justifyContent: "center",
                     backgroundColor: "transparent",
                     border: "none",
                     cursor: "pointer",
-                    borderRadius: `${theme2.radii[1]}px`
+                    borderRadius: `${theme.radii[1]}px`
                   },
                   title: "Clear search",
-                  children: /* @__PURE__ */ jsx(X, { size: 14, color: theme2.colors.textSecondary })
+                  children: /* @__PURE__ */ jsx(X, { size: 14, color: theme.colors.textSecondary })
                 }
               )
             ]
           }
         ),
-        showFilters && /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: `${theme2.space[1]}px`, width: "100%" }, children: availableFilters.map((type) => {
+        showFilters && /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: `${theme.space[1]}px`, width: "100%" }, children: availableFilters.map((type) => {
           const isActive = activeFilters.has(type);
           return /* @__PURE__ */ jsxs(
             "button",
@@ -9258,14 +9027,14 @@ const FilterBar = ({
               onClick: () => onToggleFilter(type),
               style: {
                 flex: 1,
-                padding: `${theme2.space[1]}px ${theme2.space[2]}px`,
-                fontSize: `${theme2.fontSizes[0]}px`,
-                fontWeight: theme2.fontWeights.medium,
-                fontFamily: theme2.fonts.body,
-                borderRadius: `${theme2.radii[1]}px`,
-                border: `1px solid ${isActive ? theme2.colors.primary : theme2.colors.border}`,
-                backgroundColor: isActive ? `${theme2.colors.primary}20` : theme2.colors.backgroundSecondary,
-                color: isActive ? theme2.colors.primary : theme2.colors.text,
+                padding: `${theme.space[1]}px ${theme.space[2]}px`,
+                fontSize: `${theme.fontSizes[0]}px`,
+                fontWeight: theme.fontWeights.medium,
+                fontFamily: theme.fonts.body,
+                borderRadius: `${theme.radii[1]}px`,
+                border: `1px solid ${isActive ? theme.colors.primary : theme.colors.border}`,
+                backgroundColor: isActive ? `${theme.colors.primary}20` : theme.colors.backgroundSecondary,
+                color: isActive ? theme.colors.primary : theme.colors.text,
                 cursor: "pointer",
                 transition: "all 0.2s"
               },
@@ -9274,7 +9043,7 @@ const FilterBar = ({
                 /* @__PURE__ */ jsxs(
                   "span",
                   {
-                    style: { marginLeft: `${theme2.space[1]}px`, opacity: 0.7 },
+                    style: { marginLeft: `${theme.space[1]}px`, opacity: 0.7 },
                     children: [
                       "(",
                       counts[type],
@@ -9291,12 +9060,12 @@ const FilterBar = ({
     }
   );
 };
-const dependencyTypeOrder$1 = {
+const dependencyTypeOrder = {
   peer: 0,
   production: 1,
   development: 2
 };
-function extractDependencies$1(packageLayer) {
+function extractDependencies(packageLayer) {
   const { dependencies, devDependencies, peerDependencies } = packageLayer.packageData;
   const items2 = [];
   if (dependencies) {
@@ -9315,7 +9084,7 @@ function extractDependencies$1(packageLayer) {
     });
   }
   return items2.sort((a, b) => {
-    const typeCompare = dependencyTypeOrder$1[a.dependencyType] - dependencyTypeOrder$1[b.dependencyType];
+    const typeCompare = dependencyTypeOrder[a.dependencyType] - dependencyTypeOrder[b.dependencyType];
     if (typeCompare !== 0) return typeCompare;
     return a.name.localeCompare(b.name);
   });
@@ -9343,7 +9112,7 @@ function findInternalDependencies(pkg, allPackages) {
 }
 const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
   var _a;
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   const deps = pkg.packageData.dependencies || {};
   const devDeps = pkg.packageData.devDependencies || {};
   const peerDeps = pkg.packageData.peerDependencies || {};
@@ -9376,8 +9145,8 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
         flexDirection: "column",
         gap: "8px",
         padding: "12px",
-        backgroundColor: theme2.colors.backgroundSecondary,
-        border: `1px solid ${theme2.colors.border}`,
+        backgroundColor: theme.colors.backgroundSecondary,
+        border: `1px solid ${theme.colors.border}`,
         borderRadius: "8px",
         cursor: "pointer",
         textAlign: "left",
@@ -9385,12 +9154,12 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
         width: "100%"
       },
       onMouseEnter: (e) => {
-        e.currentTarget.style.borderColor = theme2.colors.accent;
-        e.currentTarget.style.backgroundColor = theme2.colors.backgroundTertiary;
+        e.currentTarget.style.borderColor = theme.colors.accent;
+        e.currentTarget.style.backgroundColor = theme.colors.backgroundTertiary;
       },
       onMouseLeave: (e) => {
-        e.currentTarget.style.borderColor = theme2.colors.border;
-        e.currentTarget.style.backgroundColor = theme2.colors.backgroundSecondary;
+        e.currentTarget.style.borderColor = theme.colors.border;
+        e.currentTarget.style.backgroundColor = theme.colors.backgroundSecondary;
       },
       children: [
         /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
@@ -9400,9 +9169,9 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
               "div",
               {
                 style: {
-                  fontSize: theme2.fontSizes[2],
+                  fontSize: theme.fontSizes[2],
                   fontWeight: 600,
-                  color: theme2.colors.text,
+                  color: theme.colors.text,
                   overflow: "hidden",
                   textOverflow: "ellipsis",
                   whiteSpace: "nowrap"
@@ -9414,8 +9183,8 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
               "div",
               {
                 style: {
-                  fontSize: theme2.fontSizes[0],
-                  color: theme2.colors.textSecondary
+                  fontSize: theme.fontSizes[0],
+                  color: theme.colors.textSecondary
                 },
                 children: [
                   pkg.packageData.path || "/",
@@ -9435,7 +9204,7 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
                 backgroundColor: packageRole.color + "20",
                 color: packageRole.color,
                 borderRadius: "4px",
-                fontSize: theme2.fontSizes[0],
+                fontSize: theme.fontSizes[0],
                 fontWeight: 500,
                 flexShrink: 0
               },
@@ -9445,7 +9214,7 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
               ]
             }
           ),
-          /* @__PURE__ */ jsx(ChevronRight, { size: 16, color: theme2.colors.textSecondary })
+          /* @__PURE__ */ jsx(ChevronRight, { size: 16, color: theme.colors.textSecondary })
         ] }),
         hasInternalDeps && /* @__PURE__ */ jsxs(
           "div",
@@ -9454,11 +9223,11 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
               display: "flex",
               flexDirection: "column",
               gap: "4px",
-              fontSize: theme2.fontSizes[0]
+              fontSize: theme.fontSizes[0]
             },
             children: [
               dependsOn.length > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "6px", flexWrap: "wrap" }, children: [
-                /* @__PURE__ */ jsxs("span", { style: { color: theme2.colors.textSecondary, display: "flex", alignItems: "center", gap: "2px" }, children: [
+                /* @__PURE__ */ jsxs("span", { style: { color: theme.colors.textSecondary, display: "flex", alignItems: "center", gap: "2px" }, children: [
                   /* @__PURE__ */ jsx(ArrowRight, { size: 10 }),
                   "uses"
                 ] }),
@@ -9467,8 +9236,8 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
                   {
                     style: {
                       padding: "2px 6px",
-                      backgroundColor: theme2.colors.accent + "15",
-                      color: theme2.colors.accent,
+                      backgroundColor: theme.colors.accent + "15",
+                      color: theme.colors.accent,
                       borderRadius: "4px",
                       fontWeight: 500
                     },
@@ -9478,14 +9247,14 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
                 ))
               ] }),
               usedBy.length > 0 && /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "6px", flexWrap: "wrap" }, children: [
-                /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary }, children: "used by" }),
+                /* @__PURE__ */ jsx("span", { style: { color: theme.colors.textSecondary }, children: "used by" }),
                 usedBy.map((dep) => /* @__PURE__ */ jsx(
                   "span",
                   {
                     style: {
                       padding: "2px 6px",
-                      backgroundColor: theme2.colors.textSecondary + "20",
-                      color: theme2.colors.textSecondary,
+                      backgroundColor: theme.colors.textSecondary + "20",
+                      color: theme.colors.textSecondary,
                       borderRadius: "4px",
                       fontWeight: 500
                     },
@@ -9503,8 +9272,8 @@ const PackageSummaryCard = ({ pkg, allPackages, onClick }) => {
             style: {
               display: "flex",
               gap: "12px",
-              fontSize: theme2.fontSizes[0],
-              color: theme2.colors.textSecondary
+              fontSize: theme.fontSizes[0],
+              color: theme.colors.textSecondary
             },
             children: [
               /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
@@ -9535,7 +9304,7 @@ const PackageCard = ({
   onPackageClick,
   standalone = false
 }) => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   const [activeTab, setActiveTab] = useState("commands");
   const [activeFilters, setActiveFilters] = useState(/* @__PURE__ */ new Set());
   const [searchQuery, setSearchQuery] = useState("");
@@ -9545,7 +9314,7 @@ const PackageCard = ({
     return Object.entries(pkg.configFiles).filter(([, config]) => config == null ? void 0 : config.exists).map(([name, config]) => ({ name, ...config }));
   }, [pkg.configFiles]);
   const commands = pkg.packageData.availableCommands || [];
-  const dependencyItems = useMemo(() => extractDependencies$1(pkg), [pkg]);
+  const dependencyItems = useMemo(() => extractDependencies(pkg), [pkg]);
   const depCounts = useMemo(() => ({
     all: dependencyItems.length,
     production: dependencyItems.filter((d) => d.dependencyType === "production").length,
@@ -9587,7 +9356,7 @@ const PackageCard = ({
             alignItems: "center",
             gap: "8px",
             padding: "12px 16px",
-            borderBottom: `1px solid ${theme2.colors.border}`
+            borderBottom: `1px solid ${theme.colors.border}`
           },
           children: [
             /* @__PURE__ */ jsx(PackageManagerIcon, { packageManager: pkg.packageData.packageManager, size: 18 }),
@@ -9596,9 +9365,9 @@ const PackageCard = ({
                 "div",
                 {
                   style: {
-                    fontSize: theme2.fontSizes[2],
+                    fontSize: theme.fontSizes[2],
                     fontWeight: 600,
-                    color: theme2.colors.text,
+                    color: theme.colors.text,
                     overflow: "hidden",
                     textOverflow: "ellipsis",
                     whiteSpace: "nowrap"
@@ -9610,8 +9379,8 @@ const PackageCard = ({
                 "div",
                 {
                   style: {
-                    fontSize: theme2.fontSizes[0],
-                    color: theme2.colors.textSecondary
+                    fontSize: theme.fontSizes[0],
+                    color: theme.colors.textSecondary
                   },
                   children: [
                     "v",
@@ -9629,11 +9398,11 @@ const PackageCard = ({
                   alignItems: "center",
                   gap: "4px",
                   padding: "4px 8px",
-                  backgroundColor: theme2.colors.backgroundTertiary,
-                  border: `1px solid ${theme2.colors.border}`,
+                  backgroundColor: theme.colors.backgroundTertiary,
+                  border: `1px solid ${theme.colors.border}`,
                   borderRadius: "4px",
-                  color: theme2.colors.textSecondary,
-                  fontSize: theme2.fontSizes[0],
+                  color: theme.colors.textSecondary,
+                  fontSize: theme.fontSizes[0],
                   cursor: "pointer"
                 },
                 title: "Open package folder",
@@ -9651,8 +9420,8 @@ const PackageCard = ({
         {
           style: {
             display: "flex",
-            backgroundColor: theme2.colors.backgroundTertiary,
-            borderBottom: `1px solid ${theme2.colors.border}`
+            backgroundColor: theme.colors.backgroundTertiary,
+            borderBottom: `1px solid ${theme.colors.border}`
           },
           children: [
             { id: "commands", label: "Commands", count: commands.length },
@@ -9665,11 +9434,11 @@ const PackageCard = ({
               style: {
                 flex: 1,
                 padding: "8px 12px",
-                backgroundColor: activeTab === tab.id ? theme2.colors.backgroundSecondary : "transparent",
+                backgroundColor: activeTab === tab.id ? theme.colors.backgroundSecondary : "transparent",
                 border: "none",
-                borderBottom: activeTab === tab.id ? `2px solid ${theme2.colors.accent}` : "2px solid transparent",
-                color: activeTab === tab.id ? theme2.colors.text : theme2.colors.textSecondary,
-                fontSize: theme2.fontSizes[1],
+                borderBottom: activeTab === tab.id ? `2px solid ${theme.colors.accent}` : "2px solid transparent",
+                color: activeTab === tab.id ? theme.colors.text : theme.colors.textSecondary,
+                fontSize: theme.fontSizes[1],
                 cursor: "pointer",
                 display: "flex",
                 alignItems: "center",
@@ -9682,10 +9451,10 @@ const PackageCard = ({
                   "span",
                   {
                     style: {
-                      backgroundColor: theme2.colors.backgroundTertiary,
+                      backgroundColor: theme.colors.backgroundTertiary,
                       padding: "1px 6px",
                       borderRadius: "10px",
-                      fontSize: theme2.fontSizes[0]
+                      fontSize: theme.fontSizes[0]
                     },
                     children: tab.count
                   }
@@ -9697,7 +9466,7 @@ const PackageCard = ({
         }
       ),
       /* @__PURE__ */ jsxs("div", { style: { flex: 1, padding: activeTab === "dependencies" ? "0" : "12px", overflow: "auto" }, children: [
-        activeTab === "commands" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: commands.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme2.colors.textSecondary, fontSize: theme2.fontSizes[1] }, children: "No commands available" }) : commands.map((cmd, idx) => /* @__PURE__ */ jsxs(
+        activeTab === "commands" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: commands.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme.colors.textSecondary, fontSize: theme.fontSizes[1] }, children: "No commands available" }) : commands.map((cmd, idx) => /* @__PURE__ */ jsxs(
           "button",
           {
             onClick: () => onCommandClick == null ? void 0 : onCommandClick(cmd, pkg.packageData.path),
@@ -9706,23 +9475,23 @@ const PackageCard = ({
               alignItems: "center",
               gap: "8px",
               padding: "8px 12px",
-              backgroundColor: theme2.colors.backgroundTertiary,
-              border: `1px solid ${theme2.colors.border}`,
+              backgroundColor: theme.colors.backgroundTertiary,
+              border: `1px solid ${theme.colors.border}`,
               borderRadius: "6px",
-              color: theme2.colors.text,
+              color: theme.colors.text,
               cursor: "pointer",
               textAlign: "left"
             },
             children: [
-              /* @__PURE__ */ jsx(Terminal, { size: 14, color: theme2.colors.accent }),
+              /* @__PURE__ */ jsx(Terminal, { size: 14, color: theme.colors.accent }),
               /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-                /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme2.fontSizes[1] }, children: cmd.name }),
+                /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme.fontSizes[1] }, children: cmd.name }),
                 /* @__PURE__ */ jsx(
                   "div",
                   {
                     style: {
-                      fontSize: theme2.fontSizes[0],
-                      color: theme2.colors.textSecondary,
+                      fontSize: theme.fontSizes[0],
+                      color: theme.colors.textSecondary,
                       fontFamily: "monospace",
                       overflow: "hidden",
                       textOverflow: "ellipsis",
@@ -9737,20 +9506,20 @@ const PackageCard = ({
                 {
                   style: {
                     padding: "2px 6px",
-                    backgroundColor: theme2.colors.accent + "20",
-                    color: theme2.colors.accent,
+                    backgroundColor: theme.colors.accent + "20",
+                    color: theme.colors.accent,
                     borderRadius: "4px",
-                    fontSize: theme2.fontSizes[0]
+                    fontSize: theme.fontSizes[0]
                   },
                   children: cmd.lensId
                 }
               ),
-              /* @__PURE__ */ jsx(ExternalLink, { size: 12, color: theme2.colors.textSecondary })
+              /* @__PURE__ */ jsx(ExternalLink, { size: 12, color: theme.colors.textSecondary })
             ]
           },
           idx
         )) }),
-        activeTab === "configs" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: configFiles.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme2.colors.textSecondary, fontSize: theme2.fontSizes[1] }, children: "No config files detected" }) : configFiles.map((config, idx) => /* @__PURE__ */ jsxs(
+        activeTab === "configs" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: configFiles.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme.colors.textSecondary, fontSize: theme.fontSizes[1] }, children: "No config files detected" }) : configFiles.map((config, idx) => /* @__PURE__ */ jsxs(
           "button",
           {
             onClick: () => onConfigClick == null ? void 0 : onConfigClick(config),
@@ -9759,23 +9528,23 @@ const PackageCard = ({
               alignItems: "center",
               gap: "8px",
               padding: "8px 12px",
-              backgroundColor: theme2.colors.backgroundTertiary,
-              border: `1px solid ${theme2.colors.border}`,
+              backgroundColor: theme.colors.backgroundTertiary,
+              border: `1px solid ${theme.colors.border}`,
               borderRadius: "6px",
-              color: theme2.colors.text,
+              color: theme.colors.text,
               cursor: "pointer",
               textAlign: "left"
             },
             children: [
-              /* @__PURE__ */ jsx(Settings, { size: 14, color: theme2.colors.textSecondary }),
+              /* @__PURE__ */ jsx(Settings, { size: 14, color: theme.colors.textSecondary }),
               /* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
-                /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme2.fontSizes[1] }, children: config.name }),
+                /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme.fontSizes[1] }, children: config.name }),
                 /* @__PURE__ */ jsx(
                   "div",
                   {
                     style: {
-                      fontSize: theme2.fontSizes[0],
-                      color: theme2.colors.textSecondary,
+                      fontSize: theme.fontSizes[0],
+                      color: theme.colors.textSecondary,
                       fontFamily: "monospace"
                     },
                     children: config.path
@@ -9787,10 +9556,10 @@ const PackageCard = ({
                 {
                   style: {
                     padding: "2px 6px",
-                    backgroundColor: theme2.colors.textSecondary + "20",
-                    color: theme2.colors.textSecondary,
+                    backgroundColor: theme.colors.textSecondary + "20",
+                    color: theme.colors.textSecondary,
                     borderRadius: "4px",
-                    fontSize: theme2.fontSizes[0]
+                    fontSize: theme.fontSizes[0]
                   },
                   children: "inline"
                 }
@@ -9805,8 +9574,8 @@ const PackageCard = ({
             {
               style: {
                 padding: "12px",
-                color: theme2.colors.textSecondary,
-                fontSize: theme2.fontSizes[1],
+                color: theme.colors.textSecondary,
+                fontSize: theme.fontSizes[1],
                 display: "flex",
                 alignItems: "center",
                 justifyContent: "center",
@@ -9818,7 +9587,7 @@ const PackageCard = ({
               ]
             }
           ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx("div", { style: { padding: "12px", borderBottom: `1px solid ${theme2.colors.border}` }, children: /* @__PURE__ */ jsx(
+            /* @__PURE__ */ jsx("div", { style: { padding: "12px", borderBottom: `1px solid ${theme.colors.border}` }, children: /* @__PURE__ */ jsx(
               FilterBar,
               {
                 activeFilters,
@@ -9833,8 +9602,8 @@ const PackageCard = ({
                 "div",
                 {
                   style: {
-                    fontSize: theme2.fontSizes[0],
-                    color: theme2.colors.textSecondary,
+                    fontSize: theme.fontSizes[0],
+                    color: theme.colors.textSecondary,
                     marginBottom: "8px"
                   },
                   children: [
@@ -9851,8 +9620,8 @@ const PackageCard = ({
                   style: {
                     padding: "12px",
                     textAlign: "center",
-                    color: theme2.colors.textSecondary,
-                    fontSize: theme2.fontSizes[1]
+                    color: theme.colors.textSecondary,
+                    fontSize: theme.fontSizes[1]
                   },
                   children: "No dependencies match your filters"
                 }
@@ -9880,9 +9649,9 @@ const PackageCard = ({
     "div",
     {
       style: {
-        backgroundColor: theme2.colors.backgroundSecondary,
+        backgroundColor: theme.colors.backgroundSecondary,
         borderRadius: "8px",
-        border: `1px solid ${theme2.colors.border}`,
+        border: `1px solid ${theme.colors.border}`,
         overflow: "hidden"
       },
       children: [
@@ -9899,18 +9668,18 @@ const PackageCard = ({
               backgroundColor: "transparent",
               border: "none",
               cursor: "pointer",
-              color: theme2.colors.text,
+              color: theme.colors.text,
               textAlign: "left"
             },
             children: [
-              isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { size: 16, color: theme2.colors.textSecondary }) : /* @__PURE__ */ jsx(ChevronRight, { size: 16, color: theme2.colors.textSecondary }),
+              isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { size: 16, color: theme.colors.textSecondary }) : /* @__PURE__ */ jsx(ChevronRight, { size: 16, color: theme.colors.textSecondary }),
               /* @__PURE__ */ jsx(PackageManagerIcon, { packageManager: pkg.packageData.packageManager, size: 18 }),
               /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
                 /* @__PURE__ */ jsx(
                   "div",
                   {
                     style: {
-                      fontSize: theme2.fontSizes[2],
+                      fontSize: theme.fontSizes[2],
                       fontWeight: 600,
                       overflow: "hidden",
                       textOverflow: "ellipsis",
@@ -9923,8 +9692,8 @@ const PackageCard = ({
                   "div",
                   {
                     style: {
-                      fontSize: theme2.fontSizes[0],
-                      color: theme2.colors.textSecondary
+                      fontSize: theme.fontSizes[0],
+                      color: theme.colors.textSecondary
                     },
                     children: [
                       "v",
@@ -9945,11 +9714,11 @@ const PackageCard = ({
                     alignItems: "center",
                     gap: "4px",
                     padding: "4px 8px",
-                    backgroundColor: theme2.colors.backgroundTertiary,
-                    border: `1px solid ${theme2.colors.border}`,
+                    backgroundColor: theme.colors.backgroundTertiary,
+                    border: `1px solid ${theme.colors.border}`,
                     borderRadius: "4px",
-                    color: theme2.colors.textSecondary,
-                    fontSize: theme2.fontSizes[0],
+                    color: theme.colors.textSecondary,
+                    fontSize: theme.fontSizes[0],
                     cursor: "pointer"
                   },
                   title: "Open package folder",
@@ -9962,14 +9731,14 @@ const PackageCard = ({
             ]
           }
         ),
-        isExpanded && /* @__PURE__ */ jsxs("div", { style: { borderTop: `1px solid ${theme2.colors.border}` }, children: [
+        isExpanded && /* @__PURE__ */ jsxs("div", { style: { borderTop: `1px solid ${theme.colors.border}` }, children: [
           /* @__PURE__ */ jsx(
             "div",
             {
               style: {
                 display: "flex",
-                backgroundColor: theme2.colors.backgroundTertiary,
-                borderBottom: `1px solid ${theme2.colors.border}`
+                backgroundColor: theme.colors.backgroundTertiary,
+                borderBottom: `1px solid ${theme.colors.border}`
               },
               children: [
                 { id: "commands", label: "Commands", count: commands.length },
@@ -9982,11 +9751,11 @@ const PackageCard = ({
                   style: {
                     flex: 1,
                     padding: "8px 12px",
-                    backgroundColor: activeTab === tab.id ? theme2.colors.backgroundSecondary : "transparent",
+                    backgroundColor: activeTab === tab.id ? theme.colors.backgroundSecondary : "transparent",
                     border: "none",
-                    borderBottom: activeTab === tab.id ? `2px solid ${theme2.colors.accent}` : "2px solid transparent",
-                    color: activeTab === tab.id ? theme2.colors.text : theme2.colors.textSecondary,
-                    fontSize: theme2.fontSizes[1],
+                    borderBottom: activeTab === tab.id ? `2px solid ${theme.colors.accent}` : "2px solid transparent",
+                    color: activeTab === tab.id ? theme.colors.text : theme.colors.textSecondary,
+                    fontSize: theme.fontSizes[1],
                     cursor: "pointer",
                     display: "flex",
                     alignItems: "center",
@@ -9999,10 +9768,10 @@ const PackageCard = ({
                       "span",
                       {
                         style: {
-                          backgroundColor: theme2.colors.backgroundTertiary,
+                          backgroundColor: theme.colors.backgroundTertiary,
                           padding: "1px 6px",
                           borderRadius: "10px",
-                          fontSize: theme2.fontSizes[0]
+                          fontSize: theme.fontSizes[0]
                         },
                         children: tab.count
                       }
@@ -10014,7 +9783,7 @@ const PackageCard = ({
             }
           ),
           /* @__PURE__ */ jsxs("div", { style: { padding: activeTab === "dependencies" ? "0" : "12px", maxHeight: "300px", overflow: "auto" }, children: [
-            activeTab === "commands" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: commands.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme2.colors.textSecondary, fontSize: theme2.fontSizes[1] }, children: "No commands available" }) : commands.map((cmd, idx) => /* @__PURE__ */ jsxs(
+            activeTab === "commands" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: commands.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme.colors.textSecondary, fontSize: theme.fontSizes[1] }, children: "No commands available" }) : commands.map((cmd, idx) => /* @__PURE__ */ jsxs(
               "button",
               {
                 onClick: () => onCommandClick == null ? void 0 : onCommandClick(cmd, pkg.packageData.path),
@@ -10023,23 +9792,23 @@ const PackageCard = ({
                   alignItems: "center",
                   gap: "8px",
                   padding: "8px 12px",
-                  backgroundColor: theme2.colors.backgroundTertiary,
-                  border: `1px solid ${theme2.colors.border}`,
+                  backgroundColor: theme.colors.backgroundTertiary,
+                  border: `1px solid ${theme.colors.border}`,
                   borderRadius: "6px",
-                  color: theme2.colors.text,
+                  color: theme.colors.text,
                   cursor: "pointer",
                   textAlign: "left"
                 },
                 children: [
-                  /* @__PURE__ */ jsx(Terminal, { size: 14, color: theme2.colors.accent }),
+                  /* @__PURE__ */ jsx(Terminal, { size: 14, color: theme.colors.accent }),
                   /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
-                    /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme2.fontSizes[1] }, children: cmd.name }),
+                    /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme.fontSizes[1] }, children: cmd.name }),
                     /* @__PURE__ */ jsx(
                       "div",
                       {
                         style: {
-                          fontSize: theme2.fontSizes[0],
-                          color: theme2.colors.textSecondary,
+                          fontSize: theme.fontSizes[0],
+                          color: theme.colors.textSecondary,
                           fontFamily: "monospace",
                           overflow: "hidden",
                           textOverflow: "ellipsis",
@@ -10054,20 +9823,20 @@ const PackageCard = ({
                     {
                       style: {
                         padding: "2px 6px",
-                        backgroundColor: theme2.colors.accent + "20",
-                        color: theme2.colors.accent,
+                        backgroundColor: theme.colors.accent + "20",
+                        color: theme.colors.accent,
                         borderRadius: "4px",
-                        fontSize: theme2.fontSizes[0]
+                        fontSize: theme.fontSizes[0]
                       },
                       children: cmd.lensId
                     }
                   ),
-                  /* @__PURE__ */ jsx(ExternalLink, { size: 12, color: theme2.colors.textSecondary })
+                  /* @__PURE__ */ jsx(ExternalLink, { size: 12, color: theme.colors.textSecondary })
                 ]
               },
               idx
             )) }),
-            activeTab === "configs" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: configFiles.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme2.colors.textSecondary, fontSize: theme2.fontSizes[1] }, children: "No config files detected" }) : configFiles.map((config, idx) => /* @__PURE__ */ jsxs(
+            activeTab === "configs" && /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "6px" }, children: configFiles.length === 0 ? /* @__PURE__ */ jsx("div", { style: { color: theme.colors.textSecondary, fontSize: theme.fontSizes[1] }, children: "No config files detected" }) : configFiles.map((config, idx) => /* @__PURE__ */ jsxs(
               "button",
               {
                 onClick: () => onConfigClick == null ? void 0 : onConfigClick(config),
@@ -10076,23 +9845,23 @@ const PackageCard = ({
                   alignItems: "center",
                   gap: "8px",
                   padding: "8px 12px",
-                  backgroundColor: theme2.colors.backgroundTertiary,
-                  border: `1px solid ${theme2.colors.border}`,
+                  backgroundColor: theme.colors.backgroundTertiary,
+                  border: `1px solid ${theme.colors.border}`,
                   borderRadius: "6px",
-                  color: theme2.colors.text,
+                  color: theme.colors.text,
                   cursor: "pointer",
                   textAlign: "left"
                 },
                 children: [
-                  /* @__PURE__ */ jsx(Settings, { size: 14, color: theme2.colors.textSecondary }),
+                  /* @__PURE__ */ jsx(Settings, { size: 14, color: theme.colors.textSecondary }),
                   /* @__PURE__ */ jsxs("div", { style: { flex: 1 }, children: [
-                    /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme2.fontSizes[1] }, children: config.name }),
+                    /* @__PURE__ */ jsx("div", { style: { fontWeight: 500, fontSize: theme.fontSizes[1] }, children: config.name }),
                     /* @__PURE__ */ jsx(
                       "div",
                       {
                         style: {
-                          fontSize: theme2.fontSizes[0],
-                          color: theme2.colors.textSecondary,
+                          fontSize: theme.fontSizes[0],
+                          color: theme.colors.textSecondary,
                           fontFamily: "monospace"
                         },
                         children: config.path
@@ -10104,10 +9873,10 @@ const PackageCard = ({
                     {
                       style: {
                         padding: "2px 6px",
-                        backgroundColor: theme2.colors.textSecondary + "20",
-                        color: theme2.colors.textSecondary,
+                        backgroundColor: theme.colors.textSecondary + "20",
+                        color: theme.colors.textSecondary,
                         borderRadius: "4px",
-                        fontSize: theme2.fontSizes[0]
+                        fontSize: theme.fontSizes[0]
                       },
                       children: "inline"
                     }
@@ -10122,8 +9891,8 @@ const PackageCard = ({
                 {
                   style: {
                     padding: "12px",
-                    color: theme2.colors.textSecondary,
-                    fontSize: theme2.fontSizes[1],
+                    color: theme.colors.textSecondary,
+                    fontSize: theme.fontSizes[1],
                     display: "flex",
                     alignItems: "center",
                     justifyContent: "center",
@@ -10135,7 +9904,7 @@ const PackageCard = ({
                   ]
                 }
               ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx("div", { style: { padding: "12px", borderBottom: `1px solid ${theme2.colors.border}` }, children: /* @__PURE__ */ jsx(
+                /* @__PURE__ */ jsx("div", { style: { padding: "12px", borderBottom: `1px solid ${theme.colors.border}` }, children: /* @__PURE__ */ jsx(
                   FilterBar,
                   {
                     activeFilters,
@@ -10150,8 +9919,8 @@ const PackageCard = ({
                     "div",
                     {
                       style: {
-                        fontSize: theme2.fontSizes[0],
-                        color: theme2.colors.textSecondary,
+                        fontSize: theme.fontSizes[0],
+                        color: theme.colors.textSecondary,
                         marginBottom: "8px"
                       },
                       children: [
@@ -10168,8 +9937,8 @@ const PackageCard = ({
                       style: {
                         padding: "12px",
                         textAlign: "center",
-                        color: theme2.colors.textSecondary,
-                        fontSize: theme2.fontSizes[1]
+                        color: theme.colors.textSecondary,
+                        fontSize: theme.fontSizes[1]
                       },
                       children: "No dependencies match your filters"
                     }
@@ -10204,7 +9973,7 @@ const PackageCompositionPanelContent = ({
   onConfigClick,
   onPackageClick
 }) => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   const [selectedPackageId, setSelectedPackageId] = useState(null);
   const sortedPackages = useMemo(() => {
     return [...packages].sort((a, b) => {
@@ -10224,7 +9993,7 @@ const PackageCompositionPanelContent = ({
         style: {
           padding: "20px",
           textAlign: "center",
-          color: theme2.colors.textSecondary
+          color: theme.colors.textSecondary
         },
         children: "Loading packages..."
       }
@@ -10237,7 +10006,7 @@ const PackageCompositionPanelContent = ({
         style: {
           padding: "20px",
           textAlign: "center",
-          color: theme2.colors.textSecondary
+          color: theme.colors.textSecondary
         },
         children: emptyMessage
       }
@@ -10295,15 +10064,15 @@ const PackageCompositionPanelContent = ({
                     {
                       style: {
                         padding: "12px 16px",
-                        borderBottom: `1px solid ${theme2.colors.border}`,
+                        borderBottom: `1px solid ${theme.colors.border}`,
                         display: "flex",
                         alignItems: "center",
                         gap: "8px",
                         flexShrink: 0
                       },
                       children: [
-                        /* @__PURE__ */ jsx(FileCode, { size: 16, color: theme2.colors.accent }),
-                        /* @__PURE__ */ jsxs("span", { style: { fontSize: theme2.fontSizes[1], color: theme2.colors.textSecondary }, children: [
+                        /* @__PURE__ */ jsx(FileCode, { size: 16, color: theme.colors.accent }),
+                        /* @__PURE__ */ jsxs("span", { style: { fontSize: theme.fontSizes[1], color: theme.colors.textSecondary }, children: [
                           packages.length,
                           " packages"
                         ] })
@@ -10351,7 +10120,7 @@ const PackageCompositionPanelContent = ({
                     {
                       style: {
                         padding: "8px 12px",
-                        borderBottom: `1px solid ${theme2.colors.border}`,
+                        borderBottom: `1px solid ${theme.colors.border}`,
                         display: "flex",
                         alignItems: "center",
                         gap: "8px",
@@ -10369,13 +10138,13 @@ const PackageCompositionPanelContent = ({
                             backgroundColor: "transparent",
                             border: "none",
                             borderRadius: "4px",
-                            color: theme2.colors.accent,
-                            fontSize: theme2.fontSizes[1],
+                            color: theme.colors.accent,
+                            fontSize: theme.fontSizes[1],
                             cursor: "pointer",
                             transition: "background-color 0.15s ease"
                           },
                           onMouseEnter: (e) => {
-                            e.currentTarget.style.backgroundColor = theme2.colors.backgroundTertiary;
+                            e.currentTarget.style.backgroundColor = theme.colors.backgroundTertiary;
                           },
                           onMouseLeave: (e) => {
                             e.currentTarget.style.backgroundColor = "transparent";
@@ -10411,14 +10180,14 @@ const PackageCompositionPanelContent = ({
   );
 };
 const PackageCompositionPanelPreview = () => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   return /* @__PURE__ */ jsxs(
     "div",
     {
       style: {
         padding: "12px",
         fontSize: "12px",
-        color: theme2.colors.text,
+        color: theme.colors.text,
         display: "flex",
         flexDirection: "column",
         gap: "6px"
@@ -10429,16 +10198,16 @@ const PackageCompositionPanelPreview = () => {
           /* @__PURE__ */ jsx("span", { children: "my-app" })
         ] }),
         /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "6px", paddingLeft: "8px" }, children: [
-          /* @__PURE__ */ jsx(Terminal, { size: 12, color: theme2.colors.textSecondary }),
-          /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary }, children: "5 commands" })
+          /* @__PURE__ */ jsx(Terminal, { size: 12, color: theme.colors.textSecondary }),
+          /* @__PURE__ */ jsx("span", { style: { color: theme.colors.textSecondary }, children: "5 commands" })
         ] }),
         /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "6px", paddingLeft: "8px" }, children: [
-          /* @__PURE__ */ jsx(Settings, { size: 12, color: theme2.colors.textSecondary }),
-          /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary }, children: "3 configs" })
+          /* @__PURE__ */ jsx(Settings, { size: 12, color: theme.colors.textSecondary }),
+          /* @__PURE__ */ jsx("span", { style: { color: theme.colors.textSecondary }, children: "3 configs" })
         ] }),
         /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "6px", paddingLeft: "8px" }, children: [
-          /* @__PURE__ */ jsx(Package, { size: 12, color: theme2.colors.textSecondary }),
-          /* @__PURE__ */ jsx("span", { style: { color: theme2.colors.textSecondary }, children: "12 deps" })
+          /* @__PURE__ */ jsx(Package, { size: 12, color: theme.colors.textSecondary }),
+          /* @__PURE__ */ jsx("span", { style: { color: theme.colors.textSecondary }, children: "12 deps" })
         ] })
       ]
     }
@@ -10457,382 +10226,6 @@ const PackageCompositionPanel = ({ context }) => {
     }
   );
 };
-const dependencyTypeOrder = {
-  peer: 0,
-  production: 1,
-  development: 2
-};
-function extractDependencies(packageLayer) {
-  const { dependencies, devDependencies, peerDependencies } = packageLayer.packageData;
-  const items2 = [];
-  if (dependencies) {
-    Object.entries(dependencies).forEach(([name, version]) => {
-      items2.push({ name, version, dependencyType: "production" });
-    });
-  }
-  if (devDependencies) {
-    Object.entries(devDependencies).forEach(([name, version]) => {
-      items2.push({ name, version, dependencyType: "development" });
-    });
-  }
-  if (peerDependencies) {
-    Object.entries(peerDependencies).forEach(([name, version]) => {
-      items2.push({ name, version, dependencyType: "peer" });
-    });
-  }
-  return items2.sort((a, b) => {
-    const typeCompare = dependencyTypeOrder[a.dependencyType] - dependencyTypeOrder[b.dependencyType];
-    if (typeCompare !== 0) return typeCompare;
-    return a.name.localeCompare(b.name);
-  });
-}
-const DependenciesPanelContent = ({
-  context
-}) => {
-  var _a;
-  const { theme: theme2 } = useTheme();
-  const [selectedPackagePath, setSelectedPackagePath] = useState(
-    null
-  );
-  const [activeFilters, setActiveFilters] = useState(/* @__PURE__ */ new Set());
-  const [searchQuery, setSearchQuery] = useState("");
-  const [showInfoModal, setShowInfoModal] = useState(false);
-  const packagesSlice = context.getSlice("packages");
-  const isLoading = context.isSliceLoading("packages");
-  const hasPackages = context.hasSlice("packages");
-  const packages = useMemo(() => {
-    var _a2;
-    return ((_a2 = packagesSlice == null ? void 0 : packagesSlice.data) == null ? void 0 : _a2.packages) ?? [];
-  }, [(_a = packagesSlice == null ? void 0 : packagesSlice.data) == null ? void 0 : _a.packages]);
-  const effectiveSelectedPath = useMemo(() => {
-    if (selectedPackagePath !== null) return selectedPackagePath;
-    if (packages.length === 1) return packages[0].packageData.path;
-    const rootPackage = packages.find((p) => p.packageData.path === "");
-    if (rootPackage) return "";
-    return null;
-  }, [selectedPackagePath, packages]);
-  const selectedPackage = useMemo(() => {
-    if (effectiveSelectedPath === null) return null;
-    return packages.find((p) => p.packageData.path === effectiveSelectedPath);
-  }, [effectiveSelectedPath, packages]);
-  const dependencyItems = useMemo(() => {
-    if (!selectedPackage) return [];
-    return extractDependencies(selectedPackage);
-  }, [selectedPackage]);
-  const counts = useMemo(() => {
-    return {
-      all: dependencyItems.length,
-      production: dependencyItems.filter((d) => d.dependencyType === "production").length,
-      development: dependencyItems.filter(
-        (d) => d.dependencyType === "development"
-      ).length,
-      peer: dependencyItems.filter((d) => d.dependencyType === "peer").length
-    };
-  }, [dependencyItems]);
-  const handleToggleFilter = (type) => {
-    setActiveFilters((prev) => {
-      const next = new Set(prev);
-      if (next.has(type)) {
-        next.delete(type);
-      } else {
-        next.add(type);
-      }
-      return next;
-    });
-  };
-  const filteredDependencies = useMemo(() => {
-    let filtered = [...dependencyItems];
-    if (searchQuery.trim()) {
-      const query = searchQuery.toLowerCase();
-      filtered = filtered.filter(
-        (dep) => dep.name.toLowerCase().includes(query)
-      );
-    }
-    const allTypes = ["production", "development", "peer"];
-    const availableTypes = allTypes.filter((t) => counts[t] > 0);
-    const isAllSelected = activeFilters.size === 0 || availableTypes.every((t) => activeFilters.has(t));
-    if (!isAllSelected && activeFilters.size > 0) {
-      filtered = filtered.filter((dep) => activeFilters.has(dep.dependencyType));
-    }
-    return filtered;
-  }, [dependencyItems, searchQuery, activeFilters, counts]);
-  if (isLoading) {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          padding: `${theme2.space[3]}px`,
-          height: "100%",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          color: theme2.colors.textSecondary,
-          backgroundColor: theme2.colors.background,
-          fontFamily: theme2.fonts.body
-        },
-        children: "Loading packages..."
-      }
-    );
-  }
-  if (!hasPackages || packages.length === 0) {
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        style: {
-          padding: `${theme2.space[3]}px`,
-          height: "100%",
-          display: "flex",
-          flexDirection: "column",
-          alignItems: "center",
-          justifyContent: "center",
-          gap: `${theme2.space[2]}px`,
-          color: theme2.colors.textSecondary,
-          backgroundColor: theme2.colors.background,
-          fontFamily: theme2.fonts.body
-        },
-        children: [
-          /* @__PURE__ */ jsx(Package, { size: 32 }),
-          /* @__PURE__ */ jsx("p", { style: { margin: 0 }, children: "No package data available" })
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      style: {
-        height: "100%",
-        display: "flex",
-        flexDirection: "column",
-        backgroundColor: theme2.colors.background,
-        color: theme2.colors.text,
-        fontFamily: theme2.fonts.body,
-        overflow: "hidden"
-      },
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flexShrink: 0,
-              padding: `${theme2.space[3]}px`,
-              paddingBottom: `${theme2.space[2]}px`,
-              display: "flex",
-              flexDirection: "column",
-              gap: `${theme2.space[2]}px`,
-              borderBottom: `1px solid ${theme2.colors.border}`
-            },
-            children: [
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "space-between"
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx(
-                      "h3",
-                      {
-                        style: {
-                          fontSize: `${theme2.fontSizes[2]}px`,
-                          fontWeight: theme2.fontWeights.semibold,
-                          color: theme2.colors.text,
-                          display: "flex",
-                          alignItems: "center",
-                          gap: `${theme2.space[2]}px`,
-                          margin: 0
-                        },
-                        children: packages.length > 1 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                          /* @__PURE__ */ jsx(Boxes, { size: 16 }),
-                          "Monorepo Dependencies",
-                          /* @__PURE__ */ jsxs(
-                            "span",
-                            {
-                              style: {
-                                fontSize: `${theme2.fontSizes[0]}px`,
-                                fontWeight: theme2.fontWeights.body,
-                                color: theme2.colors.textSecondary
-                              },
-                              children: [
-                                "(",
-                                packages.length,
-                                ")"
-                              ]
-                            }
-                          )
-                        ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                          /* @__PURE__ */ jsx(Package, { size: 16 }),
-                          "Dependencies"
-                        ] })
-                      }
-                    ),
-                    /* @__PURE__ */ jsxs(
-                      "button",
-                      {
-                        onClick: () => setShowInfoModal(true),
-                        style: {
-                          padding: `${theme2.space[1]}px ${theme2.space[2]}px`,
-                          fontSize: `${theme2.fontSizes[0]}px`,
-                          fontWeight: theme2.fontWeights.medium,
-                          fontFamily: theme2.fonts.body,
-                          borderRadius: `${theme2.radii[1]}px`,
-                          border: `1px solid ${theme2.colors.border}`,
-                          backgroundColor: theme2.colors.backgroundSecondary,
-                          color: theme2.colors.primary,
-                          cursor: "pointer",
-                          display: "flex",
-                          alignItems: "center",
-                          gap: `${theme2.space[1]}px`,
-                          transition: "all 0.2s"
-                        },
-                        children: [
-                          /* @__PURE__ */ jsx(CircleQuestionMark, { size: 12 }),
-                          "Learn More"
-                        ]
-                      }
-                    )
-                  ]
-                }
-              ),
-              packages.length > 1 && /* @__PURE__ */ jsx(
-                "select",
-                {
-                  value: effectiveSelectedPath ?? "__none__",
-                  onChange: (e) => setSelectedPackagePath(e.target.value === "__none__" ? null : e.target.value),
-                  style: {
-                    width: "100%",
-                    padding: `${theme2.space[2]}px`,
-                    borderRadius: `${theme2.radii[1]}px`,
-                    border: `1px solid ${theme2.colors.border}`,
-                    backgroundColor: theme2.colors.backgroundSecondary,
-                    color: theme2.colors.text,
-                    fontSize: `${theme2.fontSizes[1]}px`,
-                    fontFamily: theme2.fonts.body,
-                    cursor: "pointer"
-                  },
-                  children: packages.map((pkg) => /* @__PURE__ */ jsxs("option", { value: pkg.packageData.path, children: [
-                    pkg.packageData.name,
-                    " (",
-                    pkg.packageData.path || "root",
-                    ")"
-                  ] }, pkg.packageData.path || "__root__"))
-                }
-              ),
-              packages.length === 1 && selectedPackage && /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    fontSize: `${theme2.fontSizes[0]}px`,
-                    color: theme2.colors.textSecondary
-                  },
-                  children: [
-                    selectedPackage.packageData.name,
-                    " • ",
-                    dependencyItems.length,
-                    " dependencies"
-                  ]
-                }
-              ),
-              selectedPackage && dependencyItems.length > 0 && /* @__PURE__ */ jsx(
-                FilterBar,
-                {
-                  activeFilters,
-                  onToggleFilter: handleToggleFilter,
-                  searchQuery,
-                  onSearchChange: setSearchQuery,
-                  counts
-                }
-              )
-            ]
-          }
-        ),
-        selectedPackage && dependencyItems.length > 0 && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flex: 1,
-              overflow: "auto",
-              padding: `${theme2.space[2]}px ${theme2.space[3]}px ${theme2.space[3]}px`
-            },
-            children: [
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    fontSize: `${theme2.fontSizes[0]}px`,
-                    color: theme2.colors.textSecondary,
-                    marginBottom: `${theme2.space[2]}px`
-                  },
-                  children: [
-                    "Showing ",
-                    filteredDependencies.length,
-                    " of ",
-                    dependencyItems.length,
-                    " dependencies"
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    flexDirection: "column",
-                    gap: `${theme2.space[1]}px`
-                  },
-                  children: filteredDependencies.length === 0 ? /* @__PURE__ */ jsx(
-                    "div",
-                    {
-                      style: {
-                        padding: `${theme2.space[3]}px`,
-                        textAlign: "center",
-                        color: theme2.colors.textSecondary,
-                        fontSize: `${theme2.fontSizes[1]}px`
-                      },
-                      children: "No dependencies match your filters"
-                    }
-                  ) : filteredDependencies.map((dep) => /* @__PURE__ */ jsx(
-                    DependencyRow,
-                    {
-                      dependency: dep
-                    },
-                    `${dep.name}-${dep.dependencyType}`
-                  ))
-                }
-              )
-            ]
-          }
-        ),
-        !selectedPackage && packages.length > 1 && /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              flex: 1,
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center",
-              color: theme2.colors.textSecondary,
-              fontSize: `${theme2.fontSizes[1]}px`
-            },
-            children: "Select a package to view its dependencies"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          DependencyInfoModal,
-          {
-            isOpen: showInfoModal,
-            onClose: () => setShowInfoModal(false)
-          }
-        )
-      ]
-    }
-  );
-};
-const DependenciesPanel = (props) => {
-  return /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(DependenciesPanelContent, { ...props }) });
-};
 class LocalSearchService {
   constructor() {
     this.documentsMap = /* @__PURE__ */ new Map();
@@ -11002,7 +10395,7 @@ const SearchPanelContent = ({
   onDirectoryFiltersChange,
   selectedFile
 }) => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   const [searchQuery, setSearchQuery] = useState("");
   const [searchResults, setSearchResults] = useState([]);
   const [directoryFilter, setDirectoryFilter] = useState("");
@@ -11220,7 +10613,7 @@ const SearchPanelContent = ({
         "span",
         {
           style: {
-            backgroundColor: `${theme2.colors.primary}40`,
+            backgroundColor: `${theme.colors.primary}40`,
             fontWeight: "bold"
           },
           children: part
@@ -11230,15 +10623,15 @@ const SearchPanelContent = ({
     );
   };
   return /* @__PURE__ */ jsxs("div", { style: { display: "flex", flexDirection: "column", height: "100%" }, children: [
-    /* @__PURE__ */ jsxs("div", { style: { borderBottom: `1px solid ${theme2.colors.border}` }, children: [
+    /* @__PURE__ */ jsxs("div", { style: { borderBottom: `1px solid ${theme.colors.border}` }, children: [
       /* @__PURE__ */ jsxs("div", { style: { padding: "12px", paddingBottom: "8px", position: "relative" }, children: [
         /* @__PURE__ */ jsx(
           "div",
           {
             style: {
               marginBottom: "4px",
-              fontSize: theme2.fontSizes[0],
-              color: theme2.colors.textSecondary,
+              fontSize: theme.fontSizes[0],
+              color: theme.colors.textSecondary,
               display: "flex",
               alignItems: "center",
               justifyContent: "space-between"
@@ -11273,11 +10666,11 @@ const SearchPanelContent = ({
               style: {
                 flex: 1,
                 padding: "8px 12px",
-                fontSize: theme2.fontSizes[1],
+                fontSize: theme.fontSizes[1],
                 borderRadius: "4px",
-                border: `1px solid ${directoryFilter && showDirectoryDropdown ? theme2.colors.primary : theme2.colors.border}`,
-                backgroundColor: theme2.colors.backgroundSecondary || theme2.colors.background,
-                color: theme2.colors.text,
+                border: `1px solid ${directoryFilter && showDirectoryDropdown ? theme.colors.primary : theme.colors.border}`,
+                backgroundColor: theme.colors.backgroundSecondary || theme.colors.background,
+                color: theme.colors.text,
                 outline: "none"
               }
             }
@@ -11288,12 +10681,12 @@ const SearchPanelContent = ({
               onClick: () => setExcludeDirectory(!excludeDirectory),
               style: {
                 padding: "8px 12px",
-                fontSize: theme2.fontSizes[0],
+                fontSize: theme.fontSizes[0],
                 fontWeight: 500,
                 borderRadius: "4px",
-                border: `1px solid ${excludeDirectory ? theme2.colors.primary : theme2.colors.border}`,
-                backgroundColor: excludeDirectory ? `${theme2.colors.primary}20` : theme2.colors.backgroundSecondary || theme2.colors.background,
-                color: excludeDirectory ? theme2.colors.text : theme2.colors.textSecondary,
+                border: `1px solid ${excludeDirectory ? theme.colors.primary : theme.colors.border}`,
+                backgroundColor: excludeDirectory ? `${theme.colors.primary}20` : theme.colors.backgroundSecondary || theme.colors.background,
+                color: excludeDirectory ? theme.colors.text : theme.colors.textSecondary,
                 cursor: "pointer"
               },
               title: excludeDirectory ? "Excluding files in this directory" : "Including only files in this directory",
@@ -11310,9 +10703,9 @@ const SearchPanelContent = ({
               width: "calc(100% - 24px)",
               marginTop: "4px",
               borderRadius: "4px",
-              border: `1px solid ${theme2.colors.primary}`,
-              backgroundColor: theme2.colors.background,
-              boxShadow: `0 4px 6px -1px ${theme2.colors.border}40`,
+              border: `1px solid ${theme.colors.primary}`,
+              backgroundColor: theme.colors.background,
+              boxShadow: `0 4px 6px -1px ${theme.colors.border}40`,
               maxHeight: "256px",
               overflowY: "auto"
             },
@@ -11322,9 +10715,9 @@ const SearchPanelContent = ({
                 style: {
                   padding: "8px 12px",
                   cursor: "pointer",
-                  fontSize: theme2.fontSizes[1],
-                  backgroundColor: index === selectedDirectoryIndex ? `${theme2.colors.primary}20` : "transparent",
-                  color: index === selectedDirectoryIndex ? theme2.colors.text : theme2.colors.textSecondary
+                  fontSize: theme.fontSizes[1],
+                  backgroundColor: index === selectedDirectoryIndex ? `${theme.colors.primary}20` : "transparent",
+                  color: index === selectedDirectoryIndex ? theme.colors.text : theme.colors.textSecondary
                 },
                 onMouseEnter: () => setSelectedDirectoryIndex(index),
                 onClick: () => {
@@ -11349,10 +10742,10 @@ const SearchPanelContent = ({
               gap: "4px",
               padding: "4px 8px",
               borderRadius: "4px",
-              fontSize: theme2.fontSizes[0],
-              backgroundColor: filter.mode === "include" ? `${theme2.colors.primary}20` : `${theme2.colors.error}20`,
-              border: `1px solid ${filter.mode === "include" ? theme2.colors.primary : theme2.colors.error}`,
-              color: theme2.colors.text
+              fontSize: theme.fontSizes[0],
+              backgroundColor: filter.mode === "include" ? `${theme.colors.primary}20` : `${theme.colors.error}20`,
+              border: `1px solid ${filter.mode === "include" ? theme.colors.primary : theme.colors.error}`,
+              color: theme.colors.text
             },
             children: [
               /* @__PURE__ */ jsxs(
@@ -11377,7 +10770,7 @@ const SearchPanelContent = ({
                     background: "none",
                     border: "none",
                     cursor: "pointer",
-                    color: theme2.colors.textSecondary,
+                    color: theme.colors.textSecondary,
                     padding: 0,
                     display: "flex",
                     alignItems: "center"
@@ -11397,7 +10790,7 @@ const SearchPanelContent = ({
           style: {
             padding: "12px",
             paddingTop: "8px",
-            borderTop: `1px solid ${theme2.colors.border}40`
+            borderTop: `1px solid ${theme.colors.border}40`
           },
           children: [
             /* @__PURE__ */ jsxs("div", { style: { position: "relative" }, children: [
@@ -11414,11 +10807,11 @@ const SearchPanelContent = ({
                     width: "100%",
                     padding: "8px 12px",
                     paddingRight: "36px",
-                    fontSize: theme2.fontSizes[1],
+                    fontSize: theme.fontSizes[1],
                     borderRadius: "4px",
-                    border: `1px solid ${theme2.colors.border}`,
-                    backgroundColor: theme2.colors.backgroundSecondary || theme2.colors.background,
-                    color: theme2.colors.text,
+                    border: `1px solid ${theme.colors.border}`,
+                    backgroundColor: theme.colors.backgroundSecondary || theme.colors.background,
+                    color: theme.colors.text,
                     outline: "none",
                     boxSizing: "border-box"
                   }
@@ -11440,7 +10833,7 @@ const SearchPanelContent = ({
                       height: "16",
                       viewBox: "0 0 24 24",
                       fill: "none",
-                      stroke: theme2.colors.textSecondary,
+                      stroke: theme.colors.textSecondary,
                       strokeWidth: "2",
                       children: [
                         /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "8" }),
@@ -11456,8 +10849,8 @@ const SearchPanelContent = ({
               {
                 style: {
                   marginTop: "4px",
-                  fontSize: theme2.fontSizes[0],
-                  color: theme2.colors.textSecondary
+                  fontSize: theme.fontSizes[0],
+                  color: theme.colors.textSecondary
                 },
                 children: "Supports wildcards: *.tsx, test?.js"
               }
@@ -11487,7 +10880,7 @@ const SearchPanelContent = ({
             style: {
               padding: "40px 20px",
               textAlign: "center",
-              color: theme2.colors.textSecondary
+              color: theme.colors.textSecondary
             },
             children: "Loading file tree..."
           }
@@ -11509,7 +10902,7 @@ const SearchPanelContent = ({
                   height: "64",
                   viewBox: "0 0 24 24",
                   fill: "none",
-                  style: { color: theme2.colors.primary, opacity: 0.8 },
+                  style: { color: theme.colors.primary, opacity: 0.8 },
                   children: [
                     /* @__PURE__ */ jsx(
                       "circle",
@@ -11538,10 +10931,10 @@ const SearchPanelContent = ({
                 "h3",
                 {
                   style: {
-                    fontSize: theme2.fontSizes[3],
+                    fontSize: theme.fontSizes[3],
                     fontWeight: 600,
                     marginBottom: "8px",
-                    color: theme2.colors.text
+                    color: theme.colors.text
                   },
                   children: "Search files"
                 }
@@ -11550,26 +10943,26 @@ const SearchPanelContent = ({
                 "p",
                 {
                   style: {
-                    fontSize: theme2.fontSizes[1],
+                    fontSize: theme.fontSizes[1],
                     marginBottom: "16px",
-                    color: theme2.colors.textSecondary
+                    color: theme.colors.textSecondary
                   },
                   children: "Search through filenames to find what you need"
                 }
               ),
               /* @__PURE__ */ jsxs("div", { style: { textAlign: "left" }, children: [
                 /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "flex-start", gap: "8px", marginBottom: "8px" }, children: [
-                  /* @__PURE__ */ jsx("span", { style: { fontSize: theme2.fontSizes[0], color: theme2.colors.primary }, children: "💡" }),
+                  /* @__PURE__ */ jsx("span", { style: { fontSize: theme.fontSizes[0], color: theme.colors.primary }, children: "💡" }),
                   /* @__PURE__ */ jsxs("div", { children: [
-                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme2.fontSizes[0], fontWeight: 500, color: theme2.colors.text }, children: "Quick search" }),
-                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme2.fontSizes[0], color: theme2.colors.textSecondary }, children: "Type to instantly filter by filename" })
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme.fontSizes[0], fontWeight: 500, color: theme.colors.text }, children: "Quick search" }),
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme.fontSizes[0], color: theme.colors.textSecondary }, children: "Type to instantly filter by filename" })
                   ] })
                 ] }),
                 /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "flex-start", gap: "8px" }, children: [
-                  /* @__PURE__ */ jsx("span", { style: { fontSize: theme2.fontSizes[0], color: theme2.colors.primary }, children: "📁" }),
+                  /* @__PURE__ */ jsx("span", { style: { fontSize: theme.fontSizes[0], color: theme.colors.primary }, children: "📁" }),
                   /* @__PURE__ */ jsxs("div", { children: [
-                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme2.fontSizes[0], fontWeight: 500, color: theme2.colors.text }, children: "Filter by directory" }),
-                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme2.fontSizes[0], color: theme2.colors.textSecondary }, children: "Use the directory filter to narrow your search" })
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme.fontSizes[0], fontWeight: 500, color: theme.colors.text }, children: "Filter by directory" }),
+                    /* @__PURE__ */ jsx("div", { style: { fontSize: theme.fontSizes[0], color: theme.colors.textSecondary }, children: "Use the directory filter to narrow your search" })
                   ] })
                 ] })
               ] })
@@ -11593,7 +10986,7 @@ const SearchPanelContent = ({
                   height: "64",
                   viewBox: "0 0 24 24",
                   fill: "none",
-                  style: { color: theme2.colors.textSecondary, opacity: 0.5 },
+                  style: { color: theme.colors.textSecondary, opacity: 0.5 },
                   children: [
                     /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "8", stroke: "currentColor", strokeWidth: "2" }),
                     /* @__PURE__ */ jsx("path", { d: "m21 21-4.35-4.35", stroke: "currentColor", strokeWidth: "2" }),
@@ -11605,10 +10998,10 @@ const SearchPanelContent = ({
                 "h3",
                 {
                   style: {
-                    fontSize: theme2.fontSizes[2],
+                    fontSize: theme.fontSizes[2],
                     fontWeight: 500,
                     marginBottom: "8px",
-                    color: theme2.colors.text
+                    color: theme.colors.text
                   },
                   children: "No results found"
                 }
@@ -11617,13 +11010,13 @@ const SearchPanelContent = ({
                 "p",
                 {
                   style: {
-                    fontSize: theme2.fontSizes[1],
-                    color: theme2.colors.textSecondary
+                    fontSize: theme.fontSizes[1],
+                    color: theme.colors.textSecondary
                   },
                   children: [
                     "No files match",
                     " ",
-                    /* @__PURE__ */ jsxs("span", { style: { fontFamily: "monospace", color: theme2.colors.primary }, children: [
+                    /* @__PURE__ */ jsxs("span", { style: { fontFamily: "monospace", color: theme.colors.primary }, children: [
                       '"',
                       searchQuery,
                       '"'
@@ -11643,9 +11036,9 @@ const SearchPanelContent = ({
               style: {
                 padding: "8px 12px",
                 cursor: "pointer",
-                backgroundColor: isSelected ? `${theme2.colors.primary}25` : isCurrentFile ? `${theme2.colors.primary}15` : "transparent",
-                borderLeft: isCurrentFile ? `3px solid ${theme2.colors.primary}` : isSelected ? `3px solid ${theme2.colors.primary}80` : "3px solid transparent",
-                borderBottom: `1px solid ${theme2.colors.border}20`,
+                backgroundColor: isSelected ? `${theme.colors.primary}25` : isCurrentFile ? `${theme.colors.primary}15` : "transparent",
+                borderLeft: isCurrentFile ? `3px solid ${theme.colors.primary}` : isSelected ? `3px solid ${theme.colors.primary}80` : "3px solid transparent",
+                borderBottom: `1px solid ${theme.colors.border}20`,
                 transition: "background-color 0.15s"
               },
               onClick: () => onFileSelect == null ? void 0 : onFileSelect(result.relativePath),
@@ -11657,7 +11050,7 @@ const SearchPanelContent = ({
               },
               onMouseLeave: () => onSearchResultHover == null ? void 0 : onSearchResultHover(null),
               children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "flex-start", gap: "8px" }, children: [
-                /* @__PURE__ */ jsx("div", { style: { flexShrink: 0, marginTop: "2px" }, children: /* @__PURE__ */ jsx(FileText, { size: 14, color: theme2.colors.textSecondary }) }),
+                /* @__PURE__ */ jsx("div", { style: { flexShrink: 0, marginTop: "2px" }, children: /* @__PURE__ */ jsx(FileText, { size: 14, color: theme.colors.textSecondary }) }),
                 /* @__PURE__ */ jsx("div", { style: { flex: 1, minWidth: 0 }, children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "8px" }, children: [
                   /* @__PURE__ */ jsxs("div", { style: { flex: 1, minWidth: 0 }, children: [
                     /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
@@ -11665,9 +11058,9 @@ const SearchPanelContent = ({
                         "div",
                         {
                           style: {
-                            fontSize: theme2.fontSizes[1],
+                            fontSize: theme.fontSizes[1],
                             fontWeight: 500,
-                            color: theme2.colors.text
+                            color: theme.colors.text
                           },
                           children: highlightMatch(result.name, searchQuery)
                         }
@@ -11679,8 +11072,8 @@ const SearchPanelContent = ({
                             fontSize: "10px",
                             padding: "2px 6px",
                             borderRadius: "4px",
-                            backgroundColor: `${theme2.colors.primary}20`,
-                            color: theme2.colors.primary
+                            backgroundColor: `${theme.colors.primary}20`,
+                            color: theme.colors.primary
                           },
                           children: "CURRENT"
                         }
@@ -11690,9 +11083,9 @@ const SearchPanelContent = ({
                       "div",
                       {
                         style: {
-                          fontSize: theme2.fontSizes[0],
+                          fontSize: theme.fontSizes[0],
                           marginTop: "2px",
-                          color: theme2.colors.textSecondary,
+                          color: theme.colors.textSecondary,
                           overflow: "hidden",
                           textOverflow: "ellipsis",
                           whiteSpace: "nowrap"
@@ -11708,9 +11101,9 @@ const SearchPanelContent = ({
                         flexShrink: 0,
                         padding: "4px",
                         borderRadius: "4px",
-                        border: `1px solid ${copiedPath === result.path ? theme2.colors.success : theme2.colors.border}`,
-                        backgroundColor: copiedPath === result.path ? `${theme2.colors.success}20` : theme2.colors.backgroundSecondary || theme2.colors.background,
-                        color: copiedPath === result.path ? theme2.colors.success : theme2.colors.textSecondary,
+                        border: `1px solid ${copiedPath === result.path ? theme.colors.success : theme.colors.border}`,
+                        backgroundColor: copiedPath === result.path ? `${theme.colors.success}20` : theme.colors.backgroundSecondary || theme.colors.background,
+                        color: copiedPath === result.path ? theme.colors.success : theme.colors.textSecondary,
                         cursor: "pointer",
                         opacity: isSelected || isCurrentFile ? 0.7 : 0,
                         transition: "opacity 0.15s"
@@ -11744,10 +11137,10 @@ const SearchPanelContent = ({
       {
         style: {
           padding: "8px 12px",
-          borderTop: `1px solid ${theme2.colors.border}`,
-          fontSize: theme2.fontSizes[0],
-          color: theme2.colors.textSecondary,
-          backgroundColor: theme2.colors.backgroundSecondary || theme2.colors.background
+          borderTop: `1px solid ${theme.colors.border}`,
+          fontSize: theme.fontSizes[0],
+          color: theme.colors.textSecondary,
+          backgroundColor: theme.colors.backgroundSecondary || theme.colors.background
         },
         children: /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
           /* @__PURE__ */ jsxs("span", { children: [
@@ -11765,8 +11158,8 @@ const SearchPanelContent = ({
               style: {
                 padding: "2px 6px",
                 borderRadius: "4px",
-                backgroundColor: `${theme2.colors.primary}20`,
-                color: theme2.colors.textSecondary
+                backgroundColor: `${theme.colors.primary}20`,
+                color: theme.colors.textSecondary
               },
               children: [
                 directoryFilters.length,
@@ -11781,14 +11174,14 @@ const SearchPanelContent = ({
   ] });
 };
 const SearchPanelPreview = () => {
-  const { theme: theme2 } = useTheme();
+  const { theme } = useTheme();
   return /* @__PURE__ */ jsxs(
     "div",
     {
       style: {
         padding: "12px",
         fontSize: "12px",
-        color: theme2.colors.text,
+        color: theme.colors.text,
         display: "flex",
         flexDirection: "column",
         gap: "6px"
@@ -11800,9 +11193,9 @@ const SearchPanelPreview = () => {
             style: {
               padding: "6px 8px",
               borderRadius: "4px",
-              backgroundColor: theme2.colors.backgroundSecondary,
-              border: `1px solid ${theme2.colors.border}`,
-              color: theme2.colors.textSecondary,
+              backgroundColor: theme.colors.backgroundSecondary,
+              border: `1px solid ${theme.colors.border}`,
+              color: theme.colors.textSecondary,
               fontSize: "11px"
             },
             children: "Search files..."
@@ -11878,27 +11271,6 @@ const panels = [
       console.log("Package Composition Panel unmounting");
     }
   },
-  {
-    metadata: {
-      id: "industry-theme.dependencies",
-      name: "Dependencies",
-      icon: "Package",
-      version: "0.1.0",
-      author: "Industry Theme",
-      description: "View and explore package dependencies",
-      slices: ["packages"]
-    },
-    component: DependenciesPanel,
-    onMount: async (context) => {
-      console.log("Dependencies Panel mounted");
-      if (context.hasSlice("packages") && !context.isSliceLoading("packages")) {
-        await context.refresh("repository", "packages");
-      }
-    },
-    onUnmount: async (_context) => {
-      console.log("Dependencies Panel unmounting");
-    }
-  },
   {
     metadata: {
       id: "industry-theme.search",
@@ -11928,7 +11300,6 @@ const onPackageUnload = async () => {
   console.log("Repository Composition Panels package unloading");
 };
 export {
-  DependenciesPanel,
   GitChangesPanel,
   GitChangesPanelContent,
   GitChangesPanelPreview,