@industry-theme/agent-panels 0.2.46 → 0.2.47

package/dist/panels.bundle.js

@@ -2795,133 +2795,62 @@ const parseSkillContent = async (content2, path2, fileTree, fileSystemAdapter, i
   };
 };
 const EMPTY_SKILLS_ARRAY$1 = [];
-const getDeduplicationKey = (skill) => {
-  var _a, _b, _c;
-  if (((_a = skill.metadata) == null ? void 0 : _a.owner) && ((_b = skill.metadata) == null ? void 0 : _b.repo) && ((_c = skill.metadata) == null ? void 0 : _c.skillPath)) {
-    return `github:${skill.metadata.owner}/${skill.metadata.repo}/${skill.metadata.skillPath}`;
-  }
-  const normalizedName = skill.name.toLowerCase().replace(/\s+/g, "-");
-  return `name:${normalizedName}`;
-};
-const comparePriority = (skill1, skill2) => {
-  var _a, _b;
-  if (skill1.priority !== skill2.priority) {
-    return skill1.priority < skill2.priority;
-  }
-  const time1 = ((_a = skill1.metadata) == null ? void 0 : _a.installedAt) ? new Date(skill1.metadata.installedAt).getTime() : 0;
-  const time2 = ((_b = skill2.metadata) == null ? void 0 : _b.installedAt) ? new Date(skill2.metadata.installedAt).getTime() : 0;
-  return time1 > time2;
-};
-const skillToInstallation = (skill) => ({
-  path: skill.path,
-  source: skill.source,
-  priority: skill.priority,
-  skillFolderPath: skill.skillFolderPath,
-  metadata: skill.metadata
-});
-const deduplicateSkills = (skills, isBrowserMode = false) => {
-  if (isBrowserMode) {
-    return skills;
-  }
-  if (skills.length === 0) {
-    return skills;
-  }
-  const skillGroups = /* @__PURE__ */ new Map();
-  for (const skill of skills) {
-    const key = getDeduplicationKey(skill);
-    const group = skillGroups.get(key) || [];
-    group.push(skill);
-    skillGroups.set(key, group);
-  }
-  const deduplicatedSkills = [];
-  for (const group of skillGroups.values()) {
-    if (group.length === 1) {
-      deduplicatedSkills.push({
-        ...group[0],
-        installedLocations: [skillToInstallation(group[0])]
-      });
-      continue;
-    }
-    const sortedByPriority = [...group].sort(
-      (a, b) => comparePriority(a, b) ? -1 : 1
-    );
-    const primary = sortedByPriority[0];
-    const installations = group.map(skillToInstallation);
-    installations.sort((a, b) => a.priority - b.priority);
-    deduplicatedSkills.push({
-      ...primary,
-      installedLocations: installations
-    });
-  }
-  return deduplicatedSkills;
-};
-const useSkillsData = ({
+const useSkillsBrowseData = ({
   context
 }) => {
-  var _a, _b, _c;
+  var _a, _b;
   const [skills, setSkills] = useState(EMPTY_SKILLS_ARRAY$1);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
   const fileTreeSlice = context.fileTree;
   const fileTree = fileTreeSlice == null ? void 0 : fileTreeSlice.data;
   const fileTreeSha = fileTree == null ? void 0 : fileTree.sha;
-  const globalSkillsSlice = context.globalSkills;
-  const globalSkills = ((_a = globalSkillsSlice == null ? void 0 : globalSkillsSlice.data) == null ? void 0 : _a.skills) ?? EMPTY_SKILLS_ARRAY$1;
-  const globalSkillsCount = globalSkills.length;
-  const repoPath = (_b = context.currentScope.repository) == null ? void 0 : _b.path;
-  const fileSystem = (_c = context.adapters) == null ? void 0 : _c.fileSystem;
+  const repoPath = (_a = context.currentScope.repository) == null ? void 0 : _a.path;
+  const fileSystem = (_b = context.adapters) == null ? void 0 : _b.fileSystem;
   const lastLoadedSha = useRef(void 0);
-  const lastGlobalSkillsCount = useRef(0);
   const loadSkills = useCallback(async () => {
-    if (fileTreeSha === lastLoadedSha.current && globalSkillsCount === lastGlobalSkillsCount.current) {
+    if (fileTreeSha === lastLoadedSha.current) {
       return;
     }
     setIsLoading(true);
     setError(null);
     try {
-      let localSkills = [];
-      let isBrowserMode = false;
+      let repoSkills = [];
       if (fileTree && (fileSystem == null ? void 0 : fileSystem.readFile) && repoPath) {
-        isBrowserMode = !repoPath.startsWith("/");
-        console.log("[useSkillsData] fileTree:", fileTree);
-        console.log("[useSkillsData] typeof fileTree:", typeof fileTree);
-        console.log("[useSkillsData] fileTree keys:", Object.keys(fileTree));
-        console.log("[useSkillsData] Browser mode:", isBrowserMode);
-        const skillPaths = findSkillFiles(fileTree, isBrowserMode);
-        console.log("[useSkillsData] Found skill paths:", skillPaths);
+        const isGithubRepo = !repoPath.startsWith("/");
+        if (!isGithubRepo) {
+          console.warn("[useSkillsBrowseData] Not a GitHub repo, skipping skill load");
+          setSkills(EMPTY_SKILLS_ARRAY$1);
+          lastLoadedSha.current = fileTreeSha;
+          setIsLoading(false);
+          return;
+        }
+        const skillPaths = findSkillFiles(fileTree, true);
         const skillPromises = skillPaths.map(async (skillPath) => {
           try {
-            const fullPath = isBrowserMode ? skillPath : `${repoPath}/${skillPath}`;
-            const content2 = await fileSystem.readFile(fullPath);
-            return parseSkillContent(content2, skillPath, fileTree, fileSystem, isBrowserMode);
+            const content2 = await fileSystem.readFile(skillPath);
+            return parseSkillContent(content2, skillPath, fileTree, fileSystem, true);
           } catch (err) {
-            console.error(`Failed to read skill at ${skillPath}:`, err);
+            console.error(`[useSkillsBrowseData] Failed to read skill at ${skillPath}:`, err);
             return null;
           }
         });
-        localSkills = (await Promise.all(skillPromises)).filter(
+        repoSkills = (await Promise.all(skillPromises)).filter(
           (skill) => skill !== null
         );
       }
-      console.log("[useSkillsData] Global skills:", globalSkills);
-      const allSkills = [...localSkills, ...globalSkills];
-      console.log("[useSkillsData] Total skills before deduplication:", allSkills.length);
-      const deduplicatedSkills = deduplicateSkills(allSkills, isBrowserMode);
-      console.log("[useSkillsData] Total skills after deduplication:", deduplicatedSkills.length);
-      setSkills(deduplicatedSkills);
+      setSkills(repoSkills);
       lastLoadedSha.current = fileTreeSha;
-      lastGlobalSkillsCount.current = globalSkillsCount;
     } catch (err) {
       const errorMessage = err instanceof Error ? err.message : "Failed to load skills";
       setError(errorMessage);
-      console.error("Error loading skills:", err);
+      console.error("[useSkillsBrowseData] Error loading skills:", err);
     } finally {
       setIsLoading(false);
     }
-  }, [fileTree, fileTreeSha, globalSkills, globalSkillsCount, repoPath, fileSystem]);
+  }, [fileTree, fileTreeSha, repoPath, fileSystem]);
   const refreshSkills = useCallback(async () => {
     lastLoadedSha.current = void 0;
-    lastGlobalSkillsCount.current = -1;
     await loadSkills();
   }, [loadSkills]);
   useEffect(() => {
@@ -3528,21 +3457,30 @@ ${otherLocations.map((loc) => `${abbreviateSourceName(loc.source)}: ${loc.path}`
     }
   );
 };
-const SkillsListPanel = ({
+const SkillsBrowsePanel = ({
   context,
   events,
-  browseMode = false,
   supportsRefresh = false
 }) => {
-  var _a;
+  var _a, _b;
   const { theme: theme2 } = useTheme();
   const panelRef = useRef(null);
   const [selectedSkillId, setSelectedSkillId] = useState(null);
   const [searchQuery, setSearchQuery] = useState("");
-  const [skillFilter, setSkillFilter] = useState("project");
   const [isRefreshing, setIsRefreshing] = useState(false);
-  const { skills, isLoading, error, refreshSkills } = useSkillsData({ context });
-  gt("skills-list", events, () => {
+  const { skills, isLoading, error, refreshSkills } = useSkillsBrowseData({ context });
+  const fileTreeSlice = context.fileTree;
+  const fileTree = fileTreeSlice == null ? void 0 : fileTreeSlice.data;
+  const sourceInfo = (_a = fileTree == null ? void 0 : fileTree.metadata) == null ? void 0 : _a.sourceInfo;
+  const owner = sourceInfo == null ? void 0 : sourceInfo.owner;
+  const repo = sourceInfo == null ? void 0 : sourceInfo.repo;
+  const globalSkillsSlice = context.globalSkills;
+  const installedSkillNames = useMemo(() => {
+    var _a2;
+    const globalSkills = ((_a2 = globalSkillsSlice == null ? void 0 : globalSkillsSlice.data) == null ? void 0 : _a2.skills) || [];
+    return new Set(globalSkills.map((skill) => skill.name));
+  }, [(_b = globalSkillsSlice == null ? void 0 : globalSkillsSlice.data) == null ? void 0 : _b.skills]);
+  gt("skills-browse", events, () => {
     var _a2;
     return (_a2 = panelRef.current) == null ? void 0 : _a2.focus();
   });
@@ -3558,52 +3496,29 @@ const SkillsListPanel = ({
       unsubscribeUninstalled();
     };
   }, [events, refreshSkills]);
-  const hasRepository = useMemo(() => {
-    var _a2;
-    return !!((_a2 = context.fileTree) == null ? void 0 : _a2.data);
-  }, [(_a = context.fileTree) == null ? void 0 : _a.data]);
   const filteredSkills = useMemo(() => {
     let filtered = skills;
-    if (skillFilter === "project") {
-      filtered = filtered.filter((skill) => {
-        if (skill.installedLocations && skill.installedLocations.length > 0) {
-          return skill.installedLocations.some(
-            (loc) => loc.source === "project-universal" || loc.source === "project-claude" || loc.source === "project-other"
-          );
-        }
-        return skill.source === "project-universal" || skill.source === "project-claude" || skill.source === "project-other";
-      });
-    } else if (skillFilter === "global") {
-      filtered = filtered.filter((skill) => {
-        if (skill.installedLocations && skill.installedLocations.length > 0) {
-          return skill.installedLocations.some(
-            (loc) => loc.source === "global-universal" || loc.source === "global-claude"
-          );
-        }
-        return skill.source === "global-universal" || skill.source === "global-claude";
-      });
-    }
     if (searchQuery.trim()) {
       const query = searchQuery.toLowerCase().trim();
       filtered = filtered.filter((skill) => {
-        var _a2, _b;
+        var _a2, _b2;
         if (skill.name.toLowerCase().includes(query)) return true;
         if ((_a2 = skill.description) == null ? void 0 : _a2.toLowerCase().includes(query)) return true;
-        if ((_b = skill.capabilities) == null ? void 0 : _b.some((cap2) => cap2.toLowerCase().includes(query)))
+        if ((_b2 = skill.capabilities) == null ? void 0 : _b2.some((cap2) => cap2.toLowerCase().includes(query)))
           return true;
         if (skill.path.toLowerCase().includes(query)) return true;
         return false;
       });
     }
     return filtered;
-  }, [skills, searchQuery, skillFilter]);
+  }, [skills, searchQuery]);
   const handleSkillClick = (skill) => {
     setSelectedSkillId(skill.id);
     if (events) {
       events.emit({
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         type: "skill:selected",
-        source: "skills-list-panel",
+        source: "skills-browse-panel",
         timestamp: Date.now(),
         payload: { skillId: skill.id, skill }
       });
@@ -3615,7 +3530,7 @@ const SkillsListPanel = ({
       events.emit({
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         type: "skills:refresh",
-        source: "skills-list-panel",
+        source: "skills-browse-panel",
         timestamp: Date.now(),
         payload: {}
       });
@@ -3656,7 +3571,50 @@ const SkillsListPanel = ({
             },
             children: [
               /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [
-                /* @__PURE__ */ jsx(
+                owner && repo ? /* @__PURE__ */ jsxs(
+                  "a",
+                  {
+                    href: `https://github.com/${owner}/${repo}`,
+                    target: "_blank",
+                    rel: "noopener noreferrer",
+                    style: {
+                      textDecoration: "none",
+                      display: "flex",
+                      flexDirection: "column",
+                      gap: "2px"
+                    },
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        "h2",
+                        {
+                          style: {
+                            margin: 0,
+                            fontSize: theme2.fontSizes[4],
+                            color: theme2.colors.text,
+                            fontFamily: theme2.fonts.monospace,
+                            lineHeight: 1.2
+                          },
+                          onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
+                          onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
+                          children: String(repo || "")
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          style: {
+                            fontSize: theme2.fontSizes[1],
+                            color: theme2.colors.textSecondary,
+                            fontFamily: theme2.fonts.monospace
+                          },
+                          onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
+                          onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
+                          children: String(owner || "")
+                        }
+                      )
+                    ]
+                  }
+                ) : /* @__PURE__ */ jsx(
                   "h2",
                   {
                     style: {
@@ -3676,7 +3634,7 @@ const SkillsListPanel = ({
                         },
                         onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
                         onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
-                        children: "Agent Skills"
+                        children: "Browse Skills"
                       }
                     )
                   }
@@ -3802,66 +3760,6 @@ const SkillsListPanel = ({
             ]
           }
         ),
-        hasRepository && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flexShrink: 0,
-              display: "flex",
-              gap: "8px"
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  onClick: () => setSkillFilter("project"),
-                  style: {
-                    flex: 1,
-                    padding: "8px 16px",
-                    fontSize: theme2.fontSizes[1],
-                    fontFamily: theme2.fonts.body,
-                    border: `1px solid ${skillFilter === "project" ? theme2.colors.primary : theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    background: skillFilter === "project" ? `${theme2.colors.primary}15` : theme2.colors.backgroundSecondary,
-                    color: skillFilter === "project" ? theme2.colors.primary : theme2.colors.text,
-                    cursor: "pointer",
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    gap: "6px",
-                    fontWeight: skillFilter === "project" ? 600 : 400,
-                    transition: "all 0.2s ease"
-                  },
-                  children: browseMode ? "Git Repo" : "Project"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  onClick: () => setSkillFilter("global"),
-                  style: {
-                    flex: 1,
-                    padding: "8px 16px",
-                    fontSize: theme2.fontSizes[1],
-                    fontFamily: theme2.fonts.body,
-                    border: `1px solid ${skillFilter === "global" ? theme2.colors.primary : theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    background: skillFilter === "global" ? `${theme2.colors.primary}15` : theme2.colors.backgroundSecondary,
-                    color: skillFilter === "global" ? theme2.colors.primary : theme2.colors.text,
-                    cursor: "pointer",
-                    display: "flex",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    gap: "6px",
-                    fontWeight: skillFilter === "global" ? 600 : 400,
-                    transition: "all 0.2s ease"
-                  },
-                  children: "Global"
-                }
-              )
-            ]
-          }
-        ),
         error && /* @__PURE__ */ jsxs(
           "div",
           {
@@ -3902,7 +3800,7 @@ const SkillsListPanel = ({
                   color: theme2.colors.textSecondary,
                   fontSize: theme2.fontSizes[2]
                 },
-                children: "Loading skills..."
+                children: "Loading skills from repository..."
               }
             ) : filteredSkills.length === 0 ? /* @__PURE__ */ jsxs(
               "div",
@@ -3920,8 +3818,8 @@ const SkillsListPanel = ({
                 children: [
                   /* @__PURE__ */ jsx(FileCode, { size: 48, color: theme2.colors.border }),
                   /* @__PURE__ */ jsxs("div", { style: { textAlign: "center" }, children: [
-                    /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: theme2.fontSizes[2] }, children: searchQuery ? "No skills match your search" : "No skills found" }),
-                    /* @__PURE__ */ jsx("p", { style: { margin: "8px 0 0 0", fontSize: theme2.fontSizes[1] }, children: searchQuery ? "Try a different search term" : "Add SKILL.md files to your repository to get started" })
+                    /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: theme2.fontSizes[2] }, children: searchQuery ? "No skills match your search" : "No skills found in this repository" }),
+                    /* @__PURE__ */ jsx("p", { style: { margin: "8px 0 0 0", fontSize: theme2.fontSizes[1] }, children: searchQuery ? "Try a different search term" : "This repository does not contain any SKILL.md files" })
                   ] })
                 ]
               }
@@ -3940,7 +3838,7 @@ const SkillsListPanel = ({
                     skill,
                     onClick: handleSkillClick,
                     isSelected: selectedSkillId === skill.id,
-                    filterContext: skillFilter
+                    isInstalled: installedSkillNames.has(skill.name)
                   },
                   skill.id
                 ))
@@ -3958,62 +3856,133 @@ const SkillsListPanel = ({
   );
 };
 const EMPTY_SKILLS_ARRAY = [];
-const useSkillsBrowseData = ({
+const getDeduplicationKey = (skill) => {
+  var _a, _b, _c;
+  if (((_a = skill.metadata) == null ? void 0 : _a.owner) && ((_b = skill.metadata) == null ? void 0 : _b.repo) && ((_c = skill.metadata) == null ? void 0 : _c.skillPath)) {
+    return `github:${skill.metadata.owner}/${skill.metadata.repo}/${skill.metadata.skillPath}`;
+  }
+  const normalizedName = skill.name.toLowerCase().replace(/\s+/g, "-");
+  return `name:${normalizedName}`;
+};
+const comparePriority = (skill1, skill2) => {
+  var _a, _b;
+  if (skill1.priority !== skill2.priority) {
+    return skill1.priority < skill2.priority;
+  }
+  const time1 = ((_a = skill1.metadata) == null ? void 0 : _a.installedAt) ? new Date(skill1.metadata.installedAt).getTime() : 0;
+  const time2 = ((_b = skill2.metadata) == null ? void 0 : _b.installedAt) ? new Date(skill2.metadata.installedAt).getTime() : 0;
+  return time1 > time2;
+};
+const skillToInstallation = (skill) => ({
+  path: skill.path,
+  source: skill.source,
+  priority: skill.priority,
+  skillFolderPath: skill.skillFolderPath,
+  metadata: skill.metadata
+});
+const deduplicateSkills = (skills, isBrowserMode = false) => {
+  if (isBrowserMode) {
+    return skills;
+  }
+  if (skills.length === 0) {
+    return skills;
+  }
+  const skillGroups = /* @__PURE__ */ new Map();
+  for (const skill of skills) {
+    const key = getDeduplicationKey(skill);
+    const group = skillGroups.get(key) || [];
+    group.push(skill);
+    skillGroups.set(key, group);
+  }
+  const deduplicatedSkills = [];
+  for (const group of skillGroups.values()) {
+    if (group.length === 1) {
+      deduplicatedSkills.push({
+        ...group[0],
+        installedLocations: [skillToInstallation(group[0])]
+      });
+      continue;
+    }
+    const sortedByPriority = [...group].sort(
+      (a, b) => comparePriority(a, b) ? -1 : 1
+    );
+    const primary = sortedByPriority[0];
+    const installations = group.map(skillToInstallation);
+    installations.sort((a, b) => a.priority - b.priority);
+    deduplicatedSkills.push({
+      ...primary,
+      installedLocations: installations
+    });
+  }
+  return deduplicatedSkills;
+};
+const useSkillsData = ({
   context
 }) => {
-  var _a, _b;
+  var _a, _b, _c;
   const [skills, setSkills] = useState(EMPTY_SKILLS_ARRAY);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
   const fileTreeSlice = context.fileTree;
   const fileTree = fileTreeSlice == null ? void 0 : fileTreeSlice.data;
   const fileTreeSha = fileTree == null ? void 0 : fileTree.sha;
-  const repoPath = (_a = context.currentScope.repository) == null ? void 0 : _a.path;
-  const fileSystem = (_b = context.adapters) == null ? void 0 : _b.fileSystem;
+  const globalSkillsSlice = context.globalSkills;
+  const globalSkills = ((_a = globalSkillsSlice == null ? void 0 : globalSkillsSlice.data) == null ? void 0 : _a.skills) ?? EMPTY_SKILLS_ARRAY;
+  const globalSkillsCount = globalSkills.length;
+  const repoPath = (_b = context.currentScope.repository) == null ? void 0 : _b.path;
+  const fileSystem = (_c = context.adapters) == null ? void 0 : _c.fileSystem;
   const lastLoadedSha = useRef(void 0);
+  const lastGlobalSkillsCount = useRef(0);
   const loadSkills = useCallback(async () => {
-    if (fileTreeSha === lastLoadedSha.current) {
+    if (fileTreeSha === lastLoadedSha.current && globalSkillsCount === lastGlobalSkillsCount.current) {
       return;
     }
     setIsLoading(true);
     setError(null);
     try {
-      let repoSkills = [];
+      let localSkills = [];
+      let isBrowserMode = false;
       if (fileTree && (fileSystem == null ? void 0 : fileSystem.readFile) && repoPath) {
-        const isGithubRepo = !repoPath.startsWith("/");
-        if (!isGithubRepo) {
-          console.warn("[useSkillsBrowseData] Not a GitHub repo, skipping skill load");
-          setSkills(EMPTY_SKILLS_ARRAY);
-          lastLoadedSha.current = fileTreeSha;
-          setIsLoading(false);
-          return;
-        }
-        const skillPaths = findSkillFiles(fileTree, true);
+        isBrowserMode = !repoPath.startsWith("/");
+        console.log("[useSkillsData] fileTree:", fileTree);
+        console.log("[useSkillsData] typeof fileTree:", typeof fileTree);
+        console.log("[useSkillsData] fileTree keys:", Object.keys(fileTree));
+        console.log("[useSkillsData] Browser mode:", isBrowserMode);
+        const skillPaths = findSkillFiles(fileTree, isBrowserMode);
+        console.log("[useSkillsData] Found skill paths:", skillPaths);
         const skillPromises = skillPaths.map(async (skillPath) => {
           try {
-            const content2 = await fileSystem.readFile(skillPath);
-            return parseSkillContent(content2, skillPath, fileTree, fileSystem, true);
+            const fullPath = isBrowserMode ? skillPath : `${repoPath}/${skillPath}`;
+            const content2 = await fileSystem.readFile(fullPath);
+            return parseSkillContent(content2, skillPath, fileTree, fileSystem, isBrowserMode);
           } catch (err) {
-            console.error(`[useSkillsBrowseData] Failed to read skill at ${skillPath}:`, err);
+            console.error(`Failed to read skill at ${skillPath}:`, err);
             return null;
           }
         });
-        repoSkills = (await Promise.all(skillPromises)).filter(
+        localSkills = (await Promise.all(skillPromises)).filter(
           (skill) => skill !== null
         );
       }
-      setSkills(repoSkills);
+      console.log("[useSkillsData] Global skills:", globalSkills);
+      const allSkills = [...localSkills, ...globalSkills];
+      console.log("[useSkillsData] Total skills before deduplication:", allSkills.length);
+      const deduplicatedSkills = deduplicateSkills(allSkills, isBrowserMode);
+      console.log("[useSkillsData] Total skills after deduplication:", deduplicatedSkills.length);
+      setSkills(deduplicatedSkills);
       lastLoadedSha.current = fileTreeSha;
+      lastGlobalSkillsCount.current = globalSkillsCount;
     } catch (err) {
       const errorMessage = err instanceof Error ? err.message : "Failed to load skills";
       setError(errorMessage);
-      console.error("[useSkillsBrowseData] Error loading skills:", err);
+      console.error("Error loading skills:", err);
     } finally {
       setIsLoading(false);
     }
-  }, [fileTree, fileTreeSha, repoPath, fileSystem]);
+  }, [fileTree, fileTreeSha, globalSkills, globalSkillsCount, repoPath, fileSystem]);
   const refreshSkills = useCallback(async () => {
     lastLoadedSha.current = void 0;
+    lastGlobalSkillsCount.current = -1;
     await loadSkills();
   }, [loadSkills]);
   useEffect(() => {
@@ -4026,32 +3995,20 @@ const useSkillsBrowseData = ({
     refreshSkills
   };
 };
-const SkillsBrowsePanel = ({
+const GlobalSkillsPanel = ({
   context,
   events,
   supportsRefresh = false
 }) => {
-  var _a, _b;
   const { theme: theme2 } = useTheme();
   const panelRef = useRef(null);
   const [selectedSkillId, setSelectedSkillId] = useState(null);
   const [searchQuery, setSearchQuery] = useState("");
   const [isRefreshing, setIsRefreshing] = useState(false);
-  const { skills, isLoading, error, refreshSkills } = useSkillsBrowseData({ context });
-  const fileTreeSlice = context.fileTree;
-  const fileTree = fileTreeSlice == null ? void 0 : fileTreeSlice.data;
-  const sourceInfo = (_a = fileTree == null ? void 0 : fileTree.metadata) == null ? void 0 : _a.sourceInfo;
-  const owner = sourceInfo == null ? void 0 : sourceInfo.owner;
-  const repo = sourceInfo == null ? void 0 : sourceInfo.repo;
-  const globalSkillsSlice = context.globalSkills;
-  const installedSkillNames = useMemo(() => {
-    var _a2;
-    const globalSkills = ((_a2 = globalSkillsSlice == null ? void 0 : globalSkillsSlice.data) == null ? void 0 : _a2.skills) || [];
-    return new Set(globalSkills.map((skill) => skill.name));
-  }, [(_b = globalSkillsSlice == null ? void 0 : globalSkillsSlice.data) == null ? void 0 : _b.skills]);
-  gt("skills-browse", events, () => {
-    var _a2;
-    return (_a2 = panelRef.current) == null ? void 0 : _a2.focus();
+  const { skills, isLoading, error, refreshSkills } = useSkillsData({ context });
+  gt("global-skills", events, () => {
+    var _a;
+    return (_a = panelRef.current) == null ? void 0 : _a.focus();
   });
   useEffect(() => {
     const unsubscribeInstalled = events.on("skill:installed", () => {
@@ -4066,14 +4023,21 @@ const SkillsBrowsePanel = ({
     };
   }, [events, refreshSkills]);
   const filteredSkills = useMemo(() => {
-    let filtered = skills;
+    let filtered = skills.filter((skill) => {
+      if (skill.installedLocations && skill.installedLocations.length > 0) {
+        return skill.installedLocations.some(
+          (loc) => loc.source === "global-universal" || loc.source === "global-claude"
+        );
+      }
+      return skill.source === "global-universal" || skill.source === "global-claude";
+    });
     if (searchQuery.trim()) {
       const query = searchQuery.toLowerCase().trim();
       filtered = filtered.filter((skill) => {
-        var _a2, _b2;
+        var _a, _b;
         if (skill.name.toLowerCase().includes(query)) return true;
-        if ((_a2 = skill.description) == null ? void 0 : _a2.toLowerCase().includes(query)) return true;
-        if ((_b2 = skill.capabilities) == null ? void 0 : _b2.some((cap2) => cap2.toLowerCase().includes(query)))
+        if ((_a = skill.description) == null ? void 0 : _a.toLowerCase().includes(query)) return true;
+        if ((_b = skill.capabilities) == null ? void 0 : _b.some((cap2) => cap2.toLowerCase().includes(query)))
           return true;
         if (skill.path.toLowerCase().includes(query)) return true;
         return false;
@@ -4087,7 +4051,7 @@ const SkillsBrowsePanel = ({
       events.emit({
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         type: "skill:selected",
-        source: "skills-browse-panel",
+        source: "global-skills-panel",
         timestamp: Date.now(),
         payload: { skillId: skill.id, skill }
       });
@@ -4099,7 +4063,7 @@ const SkillsBrowsePanel = ({
       events.emit({
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         type: "skills:refresh",
-        source: "skills-browse-panel",
+        source: "global-skills-panel",
         timestamp: Date.now(),
         payload: {}
       });
@@ -4140,50 +4104,7 @@ const SkillsBrowsePanel = ({
             },
             children: [
               /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [
-                owner && repo ? /* @__PURE__ */ jsxs(
-                  "a",
-                  {
-                    href: `https://github.com/${owner}/${repo}`,
-                    target: "_blank",
-                    rel: "noopener noreferrer",
-                    style: {
-                      textDecoration: "none",
-                      display: "flex",
-                      flexDirection: "column",
-                      gap: "2px"
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        "h2",
-                        {
-                          style: {
-                            margin: 0,
-                            fontSize: theme2.fontSizes[4],
-                            color: theme2.colors.text,
-                            fontFamily: theme2.fonts.monospace,
-                            lineHeight: 1.2
-                          },
-                          onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
-                          onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
-                          children: String(repo || "")
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        "div",
-                        {
-                          style: {
-                            fontSize: theme2.fontSizes[1],
-                            color: theme2.colors.textSecondary,
-                            fontFamily: theme2.fonts.monospace
-                          },
-                          onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
-                          onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
-                          children: String(owner || "")
-                        }
-                      )
-                    ]
-                  }
-                ) : /* @__PURE__ */ jsx(
+                /* @__PURE__ */ jsx(
                   "h2",
                   {
                     style: {
@@ -4203,7 +4124,7 @@ const SkillsBrowsePanel = ({
                         },
                         onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
                         onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
-                        children: "Browse Skills"
+                        children: "Global Skills"
                       }
                     )
                   }
@@ -4254,7 +4175,7 @@ const SkillsBrowsePanel = ({
                         "input",
                         {
                           type: "text",
-                          placeholder: "Search skills...",
+                          placeholder: "Search global skills...",
                           value: searchQuery,
                           onChange: (e) => setSearchQuery(e.target.value),
                           style: {
@@ -4369,7 +4290,7 @@ const SkillsBrowsePanel = ({
                   color: theme2.colors.textSecondary,
                   fontSize: theme2.fontSizes[2]
                 },
-                children: "Loading skills from repository..."
+                children: "Loading global skills..."
               }
             ) : filteredSkills.length === 0 ? /* @__PURE__ */ jsxs(
               "div",
@@ -4387,8 +4308,8 @@ const SkillsBrowsePanel = ({
                 children: [
                   /* @__PURE__ */ jsx(FileCode, { size: 48, color: theme2.colors.border }),
                   /* @__PURE__ */ jsxs("div", { style: { textAlign: "center" }, children: [
-                    /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: theme2.fontSizes[2] }, children: searchQuery ? "No skills match your search" : "No skills found in this repository" }),
-                    /* @__PURE__ */ jsx("p", { style: { margin: "8px 0 0 0", fontSize: theme2.fontSizes[1] }, children: searchQuery ? "Try a different search term" : "This repository does not contain any SKILL.md files" })
+                    /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: theme2.fontSizes[2] }, children: searchQuery ? "No global skills match your search" : "No global skills found" }),
+                    /* @__PURE__ */ jsx("p", { style: { margin: "8px 0 0 0", fontSize: theme2.fontSizes[1] }, children: searchQuery ? "Try a different search term" : "Install skills from repositories to see them here" })
                   ] })
                 ]
               }
@@ -4407,7 +4328,7 @@ const SkillsBrowsePanel = ({
                     skill,
                     onClick: handleSkillClick,
                     isSelected: selectedSkillId === skill.id,
-                    isInstalled: installedSkillNames.has(skill.name)
+                    filterContext: "global"
                   },
                   skill.id
                 ))
@@ -4424,553 +4345,203 @@ const SkillsBrowsePanel = ({
     }
   );
 };
-const GlobalSkillsPanel = ({
-  context,
-  events,
-  supportsRefresh = false
-}) => {
-  const { theme: theme2 } = useTheme();
-  const panelRef = useRef(null);
-  const [selectedSkillId, setSelectedSkillId] = useState(null);
-  const [searchQuery, setSearchQuery] = useState("");
-  const [isRefreshing, setIsRefreshing] = useState(false);
-  const { skills, isLoading, error, refreshSkills } = useSkillsData({ context });
-  gt("global-skills", events, () => {
-    var _a;
-    return (_a = panelRef.current) == null ? void 0 : _a.focus();
-  });
-  useEffect(() => {
-    const unsubscribeInstalled = events.on("skill:installed", () => {
-      refreshSkills();
-    });
-    const unsubscribeUninstalled = events.on("skill:uninstalled", () => {
-      refreshSkills();
-    });
-    return () => {
-      unsubscribeInstalled();
-      unsubscribeUninstalled();
-    };
-  }, [events, refreshSkills]);
-  const filteredSkills = useMemo(() => {
-    let filtered = skills.filter((skill) => {
-      if (skill.installedLocations && skill.installedLocations.length > 0) {
-        return skill.installedLocations.some(
-          (loc) => loc.source === "global-universal" || loc.source === "global-claude"
-        );
+var MarkdownSourceType$1;
+((MarkdownSourceType2) => {
+  MarkdownSourceType2["WORKSPACE_FILE"] = "workspace_file";
+  MarkdownSourceType2["REMOTE_FILE"] = "remote_file";
+  MarkdownSourceType2["GITHUB_FILE"] = "github_file";
+  MarkdownSourceType2["DRAFT"] = "draft";
+  MarkdownSourceType2["GITHUB_ISSUE"] = "github_issue";
+  MarkdownSourceType2["GITHUB_PULL_REQUEST"] = "github_pull_request";
+  MarkdownSourceType2["GITHUB_GIST"] = "github_gist";
+})(MarkdownSourceType$1 || (MarkdownSourceType$1 = {}));
+class SkillParseError extends Error {
+  constructor(message, cause) {
+    super(message);
+    __publicField(this, "cause");
+    this.cause = cause;
+    this.name = "SkillParseError";
+  }
+}
+function extractFrontmatter(content2) {
+  const trimmed = content2.trim();
+  if (!trimmed.startsWith("---")) {
+    throw new SkillParseError("SKILL.md must start with YAML frontmatter (---)");
+  }
+  const afterFirstDelimiter = trimmed.slice(3);
+  const closingIndex = afterFirstDelimiter.indexOf(`
+---`);
+  if (closingIndex === -1) {
+    throw new SkillParseError("SKILL.md frontmatter is not properly closed with ---");
+  }
+  const frontmatter = afterFirstDelimiter.slice(0, closingIndex).trim();
+  const body = afterFirstDelimiter.slice(closingIndex + 4).trim();
+  return { frontmatter, body };
+}
+function parseYamlFrontmatter(yaml2) {
+  const result = {};
+  const lines = yaml2.split(`
+`);
+  let currentObject = null;
+  let currentList = null;
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+    const trimmed = line.trim();
+    if (!trimmed || trimmed.startsWith("#")) {
+      continue;
+    }
+    const lineIndent = line.search(/\S/);
+    if (trimmed.startsWith("- ")) {
+      const value = trimmed.slice(2).trim();
+      if (currentList) {
+        currentList.push(value);
       }
-      return skill.source === "global-universal" || skill.source === "global-claude";
+      continue;
+    }
+    const colonIndex = line.indexOf(":");
+    if (colonIndex > 0) {
+      const key = line.slice(0, colonIndex).trim();
+      const value = line.slice(colonIndex + 1).trim();
+      if (lineIndent === 0) {
+        currentList = null;
+        currentObject = null;
+        if (!value) {
+          if (i + 1 < lines.length) {
+            const nextLine = lines[i + 1];
+            const nextTrimmed = nextLine.trim();
+            if (nextTrimmed.startsWith("- ")) {
+              currentList = [];
+              result[key] = currentList;
+            } else if (nextLine.search(/\S/) > 0 && nextLine.includes(":")) {
+              currentObject = {};
+              result[key] = currentObject;
+            }
+          }
+        } else {
+          const cleanValue = value.replace(/^["']|["']$/g, "");
+          result[key] = cleanValue;
+        }
+      } else if (lineIndent > 0 && currentObject) {
+        const cleanValue = value.replace(/^["']|["']$/g, "");
+        currentObject[key] = cleanValue;
+      }
+    }
+  }
+  return result;
+}
+function parseSkillMetadataGraceful(metadata) {
+  const warnings = [];
+  const partialMetadata = {};
+  if (!metadata.name || typeof metadata.name !== "string" || !metadata.name.trim()) {
+    warnings.push({
+      field: "name",
+      message: 'Required field "name" is missing or empty'
     });
-    if (searchQuery.trim()) {
-      const query = searchQuery.toLowerCase().trim();
-      filtered = filtered.filter((skill) => {
-        var _a, _b;
-        if (skill.name.toLowerCase().includes(query)) return true;
-        if ((_a = skill.description) == null ? void 0 : _a.toLowerCase().includes(query)) return true;
-        if ((_b = skill.capabilities) == null ? void 0 : _b.some((cap2) => cap2.toLowerCase().includes(query)))
-          return true;
-        if (skill.path.toLowerCase().includes(query)) return true;
-        return false;
+  } else {
+    partialMetadata.name = metadata.name;
+  }
+  if (!metadata.description || typeof metadata.description !== "string" || !metadata.description.trim()) {
+    warnings.push({
+      field: "description",
+      message: 'Required field "description" is missing or empty'
+    });
+  } else {
+    partialMetadata.description = metadata.description;
+  }
+  if (metadata.license !== void 0) {
+    if (typeof metadata.license !== "string") {
+      warnings.push({
+        field: "license",
+        message: 'Field "license" must be a string'
       });
+    } else {
+      partialMetadata.license = metadata.license;
     }
-    return filtered;
-  }, [skills, searchQuery]);
-  const handleSkillClick = (skill) => {
-    setSelectedSkillId(skill.id);
-    if (events) {
-      events.emit({
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        type: "skill:selected",
-        source: "global-skills-panel",
-        timestamp: Date.now(),
-        payload: { skillId: skill.id, skill }
+  }
+  if (metadata.compatibility !== void 0) {
+    if (typeof metadata.compatibility !== "string") {
+      warnings.push({
+        field: "compatibility",
+        message: 'Field "compatibility" must be a string'
       });
+    } else {
+      partialMetadata.compatibility = metadata.compatibility;
     }
-  };
-  const handleRefresh = () => {
-    setIsRefreshing(true);
-    if (events) {
-      events.emit({
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        type: "skills:refresh",
-        source: "global-skills-panel",
-        timestamp: Date.now(),
-        payload: {}
+  }
+  if (metadata["allowed-tools"] !== void 0) {
+    if (typeof metadata["allowed-tools"] === "string") {
+      const toolsString = metadata["allowed-tools"];
+      partialMetadata["allowed-tools"] = toolsString.trim() ? toolsString.trim().split(/\s+/) : [];
+    } else {
+      warnings.push({
+        field: "allowed-tools",
+        message: 'Field "allowed-tools" must be a space-delimited string'
       });
     }
-    setTimeout(() => {
-      setIsRefreshing(false);
-    }, 800);
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: panelRef,
-      tabIndex: -1,
-      style: {
-        padding: "clamp(12px, 3vw, 20px)",
-        fontFamily: theme2.fonts.body,
-        height: "100%",
-        boxSizing: "border-box",
-        display: "flex",
-        flexDirection: "column",
-        gap: "16px",
-        overflow: "hidden",
-        backgroundColor: theme2.colors.background,
-        color: theme2.colors.text,
-        outline: "none"
-      },
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flexShrink: 0,
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "space-between",
-              gap: "12px",
-              flexWrap: "wrap"
-            },
-            children: [
-              /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [
-                /* @__PURE__ */ jsx(
-                  "h2",
-                  {
-                    style: {
-                      margin: 0,
-                      fontSize: theme2.fontSizes[4],
-                      color: theme2.colors.text
-                    },
-                    children: /* @__PURE__ */ jsx(
-                      "a",
-                      {
-                        href: "https://agentskills.io/",
-                        target: "_blank",
-                        rel: "noopener noreferrer",
-                        style: {
-                          color: "inherit",
-                          textDecoration: "none"
-                        },
-                        onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
-                        onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
-                        children: "Global Skills"
-                      }
-                    )
-                  }
-                ),
-                !isLoading && /* @__PURE__ */ jsxs(
-                  "span",
-                  {
-                    style: {
-                      fontSize: theme2.fontSizes[1],
-                      color: theme2.colors.textSecondary,
-                      background: theme2.colors.backgroundSecondary,
-                      padding: "4px 10px",
-                      borderRadius: theme2.radii[1]
-                    },
-                    children: [
-                      filteredSkills.length,
-                      " ",
-                      filteredSkills.length === 1 ? "skill" : "skills"
-                    ]
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px", flex: "1 1 200px", maxWidth: "400px" }, children: [
-                /* @__PURE__ */ jsxs(
-                  "div",
-                  {
-                    style: {
-                      position: "relative",
-                      flex: 1,
-                      minWidth: "150px"
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        Search,
-                        {
-                          size: 16,
-                          color: theme2.colors.textSecondary,
-                          style: {
-                            position: "absolute",
-                            left: "10px",
-                            top: "50%",
-                            transform: "translateY(-50%)",
-                            pointerEvents: "none"
-                          }
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        "input",
-                        {
-                          type: "text",
-                          placeholder: "Search global skills...",
-                          value: searchQuery,
-                          onChange: (e) => setSearchQuery(e.target.value),
-                          style: {
-                            width: "100%",
-                            padding: "8px 32px 8px 32px",
-                            fontSize: theme2.fontSizes[1],
-                            fontFamily: theme2.fonts.body,
-                            border: `1px solid ${theme2.colors.border}`,
-                            borderRadius: theme2.radii[2],
-                            background: theme2.colors.backgroundSecondary,
-                            color: theme2.colors.text,
-                            outline: "none",
-                            boxSizing: "border-box"
-                          }
-                        }
-                      ),
-                      searchQuery && /* @__PURE__ */ jsx(
-                        "button",
-                        {
-                          onClick: () => setSearchQuery(""),
-                          style: {
-                            position: "absolute",
-                            right: "6px",
-                            top: "50%",
-                            transform: "translateY(-50%)",
-                            background: "transparent",
-                            border: "none",
-                            padding: "4px",
-                            cursor: "pointer",
-                            display: "flex",
-                            alignItems: "center",
-                            justifyContent: "center",
-                            color: theme2.colors.textSecondary
-                          },
-                          "aria-label": "Clear search",
-                          children: /* @__PURE__ */ jsx(X, { size: 14 })
-                        }
-                      )
-                    ]
-                  }
-                ),
-                supportsRefresh && /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    onClick: handleRefresh,
-                    disabled: isRefreshing || isLoading,
-                    style: {
-                      background: theme2.colors.backgroundSecondary,
-                      border: `1px solid ${theme2.colors.border}`,
-                      borderRadius: theme2.radii[1],
-                      padding: "8px",
-                      cursor: isRefreshing || isLoading ? "default" : "pointer",
-                      display: "flex",
-                      alignItems: "center",
-                      justifyContent: "center",
-                      transition: "all 0.2s ease"
-                    },
-                    title: "Refresh skills",
-                    children: /* @__PURE__ */ jsx(
-                      RefreshCw,
-                      {
-                        size: 16,
-                        color: theme2.colors.textSecondary,
-                        style: {
-                          animation: isRefreshing ? "spin 1s linear infinite" : "none"
-                        }
-                      }
-                    )
-                  }
-                )
-              ] })
-            ]
-          }
-        ),
-        error && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flexShrink: 0,
-              padding: "12px",
-              background: `${theme2.colors.error}20`,
-              border: `1px solid ${theme2.colors.error}`,
-              borderRadius: theme2.radii[2],
-              display: "flex",
-              alignItems: "center",
-              gap: "8px",
-              color: theme2.colors.error,
-              fontSize: theme2.fontSizes[1]
-            },
-            children: [
-              /* @__PURE__ */ jsx(CircleAlert, { size: 16 }),
-              /* @__PURE__ */ jsx("span", { children: error })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              flex: 1,
-              overflowY: "auto",
-              minHeight: 0
-            },
-            children: isLoading ? /* @__PURE__ */ jsx(
-              "div",
-              {
-                style: {
-                  height: "100%",
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  color: theme2.colors.textSecondary,
-                  fontSize: theme2.fontSizes[2]
-                },
-                children: "Loading global skills..."
-              }
-            ) : filteredSkills.length === 0 ? /* @__PURE__ */ jsxs(
-              "div",
-              {
-                style: {
-                  height: "100%",
-                  display: "flex",
-                  flexDirection: "column",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  gap: "16px",
-                  color: theme2.colors.textSecondary,
-                  padding: "24px"
-                },
-                children: [
-                  /* @__PURE__ */ jsx(FileCode, { size: 48, color: theme2.colors.border }),
-                  /* @__PURE__ */ jsxs("div", { style: { textAlign: "center" }, children: [
-                    /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: theme2.fontSizes[2] }, children: searchQuery ? "No global skills match your search" : "No global skills found" }),
-                    /* @__PURE__ */ jsx("p", { style: { margin: "8px 0 0 0", fontSize: theme2.fontSizes[1] }, children: searchQuery ? "Try a different search term" : "Install skills from repositories to see them here" })
-                  ] })
-                ]
-              }
-            ) : /* @__PURE__ */ jsx(
-              "div",
-              {
-                style: {
-                  display: "grid",
-                  gridTemplateColumns: "repeat(auto-fill, minmax(250px, 1fr))",
-                  gap: "16px",
-                  padding: "4px"
-                },
-                children: filteredSkills.map((skill) => /* @__PURE__ */ jsx(
-                  SkillCard,
-                  {
-                    skill,
-                    onClick: handleSkillClick,
-                    isSelected: selectedSkillId === skill.id,
-                    filterContext: "global"
-                  },
-                  skill.id
-                ))
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx("style", { children: `
-          @keyframes spin {
-            to { transform: rotate(360deg); }
-          }
-        ` })
-      ]
-    }
-  );
-};
-var MarkdownSourceType$1;
-((MarkdownSourceType2) => {
-  MarkdownSourceType2["WORKSPACE_FILE"] = "workspace_file";
-  MarkdownSourceType2["REMOTE_FILE"] = "remote_file";
-  MarkdownSourceType2["GITHUB_FILE"] = "github_file";
-  MarkdownSourceType2["DRAFT"] = "draft";
-  MarkdownSourceType2["GITHUB_ISSUE"] = "github_issue";
-  MarkdownSourceType2["GITHUB_PULL_REQUEST"] = "github_pull_request";
-  MarkdownSourceType2["GITHUB_GIST"] = "github_gist";
-})(MarkdownSourceType$1 || (MarkdownSourceType$1 = {}));
-class SkillParseError extends Error {
-  constructor(message, cause) {
-    super(message);
-    __publicField(this, "cause");
-    this.cause = cause;
-    this.name = "SkillParseError";
-  }
-}
-function extractFrontmatter(content2) {
-  const trimmed = content2.trim();
-  if (!trimmed.startsWith("---")) {
-    throw new SkillParseError("SKILL.md must start with YAML frontmatter (---)");
-  }
-  const afterFirstDelimiter = trimmed.slice(3);
-  const closingIndex = afterFirstDelimiter.indexOf(`
----`);
-  if (closingIndex === -1) {
-    throw new SkillParseError("SKILL.md frontmatter is not properly closed with ---");
-  }
-  const frontmatter = afterFirstDelimiter.slice(0, closingIndex).trim();
-  const body = afterFirstDelimiter.slice(closingIndex + 4).trim();
-  return { frontmatter, body };
-}
-function parseYamlFrontmatter(yaml2) {
-  const result = {};
-  const lines = yaml2.split(`
-`);
-  let currentObject = null;
-  let currentList = null;
-  for (let i = 0; i < lines.length; i++) {
-    const line = lines[i];
-    const trimmed = line.trim();
-    if (!trimmed || trimmed.startsWith("#")) {
-      continue;
-    }
-    const lineIndent = line.search(/\S/);
-    if (trimmed.startsWith("- ")) {
-      const value = trimmed.slice(2).trim();
-      if (currentList) {
-        currentList.push(value);
-      }
-      continue;
-    }
-    const colonIndex = line.indexOf(":");
-    if (colonIndex > 0) {
-      const key = line.slice(0, colonIndex).trim();
-      const value = line.slice(colonIndex + 1).trim();
-      if (lineIndent === 0) {
-        currentList = null;
-        currentObject = null;
-        if (!value) {
-          if (i + 1 < lines.length) {
-            const nextLine = lines[i + 1];
-            const nextTrimmed = nextLine.trim();
-            if (nextTrimmed.startsWith("- ")) {
-              currentList = [];
-              result[key] = currentList;
-            } else if (nextLine.search(/\S/) > 0 && nextLine.includes(":")) {
-              currentObject = {};
-              result[key] = currentObject;
-            }
-          }
-        } else {
-          const cleanValue = value.replace(/^["']|["']$/g, "");
-          result[key] = cleanValue;
-        }
-      } else if (lineIndent > 0 && currentObject) {
-        const cleanValue = value.replace(/^["']|["']$/g, "");
-        currentObject[key] = cleanValue;
-      }
-    }
-  }
-  return result;
-}
-function parseSkillMetadataGraceful(metadata) {
-  const warnings = [];
-  const partialMetadata = {};
-  if (!metadata.name || typeof metadata.name !== "string" || !metadata.name.trim()) {
-    warnings.push({
-      field: "name",
-      message: 'Required field "name" is missing or empty'
-    });
-  } else {
-    partialMetadata.name = metadata.name;
-  }
-  if (!metadata.description || typeof metadata.description !== "string" || !metadata.description.trim()) {
-    warnings.push({
-      field: "description",
-      message: 'Required field "description" is missing or empty'
-    });
-  } else {
-    partialMetadata.description = metadata.description;
-  }
-  if (metadata.license !== void 0) {
-    if (typeof metadata.license !== "string") {
-      warnings.push({
-        field: "license",
-        message: 'Field "license" must be a string'
-      });
-    } else {
-      partialMetadata.license = metadata.license;
-    }
-  }
-  if (metadata.compatibility !== void 0) {
-    if (typeof metadata.compatibility !== "string") {
-      warnings.push({
-        field: "compatibility",
-        message: 'Field "compatibility" must be a string'
-      });
-    } else {
-      partialMetadata.compatibility = metadata.compatibility;
-    }
-  }
-  if (metadata["allowed-tools"] !== void 0) {
-    if (typeof metadata["allowed-tools"] === "string") {
-      const toolsString = metadata["allowed-tools"];
-      partialMetadata["allowed-tools"] = toolsString.trim() ? toolsString.trim().split(/\s+/) : [];
-    } else {
-      warnings.push({
-        field: "allowed-tools",
-        message: 'Field "allowed-tools" must be a space-delimited string'
-      });
-    }
-  }
-  if (metadata.metadata !== void 0) {
-    if (typeof metadata.metadata !== "object" || Array.isArray(metadata.metadata)) {
-      warnings.push({
-        field: "metadata",
-        message: 'Field "metadata" must be an object'
-      });
-    } else {
-      partialMetadata.metadata = metadata.metadata;
-    }
-  }
-  return { metadata: partialMetadata, warnings };
-}
-function parseSkillMarkdownGraceful(content2) {
-  try {
-    const { frontmatter, body } = extractFrontmatter(content2);
-    let rawMetadata;
-    try {
-      rawMetadata = parseYamlFrontmatter(frontmatter);
-    } catch (error) {
-      return {
-        metadata: {},
-        body,
-        raw: content2,
-        warnings: [{
-          field: "frontmatter",
-          message: `Failed to parse YAML frontmatter: ${error instanceof Error ? error.message : String(error)}`
-        }]
-      };
-    }
-    const { metadata, warnings } = parseSkillMetadataGraceful(rawMetadata);
-    return {
-      metadata,
-      body,
-      raw: content2,
-      warnings
-    };
-  } catch (error) {
-    return {
-      metadata: {},
-      body: content2,
-      raw: content2,
-      warnings: [{
-        field: "structure",
-        message: error instanceof Error ? error.message : "Failed to parse SKILL.md structure"
-      }]
-    };
-  }
-}
-const VOID = -1;
-const PRIMITIVE = 0;
-const ARRAY = 1;
-const OBJECT = 2;
-const DATE = 3;
-const REGEXP = 4;
-const MAP = 5;
-const SET = 6;
-const ERROR = 7;
-const BIGINT = 8;
-const env = typeof self === "object" ? self : globalThis;
-const deserializer = ($2, _) => {
-  const as = (out, index2) => {
-    $2.set(index2, out);
-    return out;
+  }
+  if (metadata.metadata !== void 0) {
+    if (typeof metadata.metadata !== "object" || Array.isArray(metadata.metadata)) {
+      warnings.push({
+        field: "metadata",
+        message: 'Field "metadata" must be an object'
+      });
+    } else {
+      partialMetadata.metadata = metadata.metadata;
+    }
+  }
+  return { metadata: partialMetadata, warnings };
+}
+function parseSkillMarkdownGraceful(content2) {
+  try {
+    const { frontmatter, body } = extractFrontmatter(content2);
+    let rawMetadata;
+    try {
+      rawMetadata = parseYamlFrontmatter(frontmatter);
+    } catch (error) {
+      return {
+        metadata: {},
+        body,
+        raw: content2,
+        warnings: [{
+          field: "frontmatter",
+          message: `Failed to parse YAML frontmatter: ${error instanceof Error ? error.message : String(error)}`
+        }]
+      };
+    }
+    const { metadata, warnings } = parseSkillMetadataGraceful(rawMetadata);
+    return {
+      metadata,
+      body,
+      raw: content2,
+      warnings
+    };
+  } catch (error) {
+    return {
+      metadata: {},
+      body: content2,
+      raw: content2,
+      warnings: [{
+        field: "structure",
+        message: error instanceof Error ? error.message : "Failed to parse SKILL.md structure"
+      }]
+    };
+  }
+}
+const VOID = -1;
+const PRIMITIVE = 0;
+const ARRAY = 1;
+const OBJECT = 2;
+const DATE = 3;
+const REGEXP = 4;
+const MAP = 5;
+const SET = 6;
+const ERROR = 7;
+const BIGINT = 8;
+const env = typeof self === "object" ? self : globalThis;
+const deserializer = ($2, _) => {
+  const as = (out, index2) => {
+    $2.set(index2, out);
+    return out;
   };
   const unpair = (index2) => {
     if ($2.has(index2))
@@ -50846,887 +50417,6 @@ const useSubagentsData = ({
     refreshSubagents
   };
 };
-const getSourceBadge$1 = (source2) => {
-  switch (source2) {
-    case "project-root":
-      return {
-        label: "Root",
-        icon: /* @__PURE__ */ jsx(FileText, { size: 12 }),
-        color: "#10b981",
-        bgColor: "#10b98120"
-      };
-    case "project-nested":
-      return {
-        label: "Nested",
-        icon: /* @__PURE__ */ jsx(FolderTree, { size: 12 }),
-        color: "#3b82f6",
-        bgColor: "#3b82f620"
-      };
-    case "global-universal":
-      return {
-        label: "Global",
-        icon: /* @__PURE__ */ jsx(Folder, { size: 12 }),
-        color: "#8b5cf6",
-        bgColor: "#8b5cf620"
-      };
-  }
-};
-const AgentCard = ({ agent, onClick, isSelected }) => {
-  var _a;
-  const { theme: theme2 } = useTheme();
-  const sourceBadge = getSourceBadge$1(agent.source);
-  const [pathCopied, setPathCopied] = React2__default.useState(false);
-  const preview = ((_a = agent.content.split("\n").find((line) => line.trim() && !line.startsWith("#"))) == null ? void 0 : _a.substring(0, 150)) || "No description available";
-  const handleCopyPath = async (e) => {
-    e.stopPropagation();
-    try {
-      await navigator.clipboard.writeText(agent.path);
-      setPathCopied(true);
-      setTimeout(() => setPathCopied(false), 2e3);
-    } catch (err) {
-      console.error("Failed to copy path:", err);
-    }
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      onClick: () => onClick(agent),
-      style: {
-        padding: "16px",
-        background: isSelected ? `${theme2.colors.primary}10` : theme2.colors.backgroundSecondary,
-        border: `1px solid ${isSelected ? theme2.colors.primary : theme2.colors.border}`,
-        borderRadius: theme2.radii[2],
-        cursor: "pointer",
-        transition: "all 0.2s ease",
-        display: "flex",
-        flexDirection: "column",
-        gap: "12px"
-      },
-      onMouseEnter: (e) => {
-        if (!isSelected) {
-          e.currentTarget.style.borderColor = theme2.colors.textSecondary;
-        }
-      },
-      onMouseLeave: (e) => {
-        if (!isSelected) {
-          e.currentTarget.style.borderColor = theme2.colors.border;
-        }
-      },
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              display: "flex",
-              alignItems: "flex-start",
-              justifyContent: "space-between",
-              gap: "8px"
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "h3",
-                {
-                  style: {
-                    margin: 0,
-                    fontSize: theme2.fontSizes[2],
-                    color: theme2.colors.text,
-                    fontWeight: 600,
-                    flex: 1
-                  },
-                  children: agent.name
-                }
-              ),
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "4px",
-                    padding: "4px 8px",
-                    fontSize: theme2.fontSizes[0],
-                    color: sourceBadge.color,
-                    background: sourceBadge.bgColor,
-                    border: `1px solid ${sourceBadge.color}40`,
-                    borderRadius: theme2.radii[1],
-                    flexShrink: 0
-                  },
-                  children: [
-                    sourceBadge.icon,
-                    /* @__PURE__ */ jsx("span", { children: sourceBadge.label })
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            onClick: handleCopyPath,
-            style: {
-              fontSize: theme2.fontSizes[0],
-              color: pathCopied ? theme2.colors.success : theme2.colors.textMuted,
-              fontFamily: theme2.fonts.monospace,
-              background: pathCopied ? `${theme2.colors.success}15` : theme2.colors.background,
-              padding: "4px 8px",
-              borderRadius: theme2.radii[1],
-              overflow: "hidden",
-              textOverflow: "ellipsis",
-              whiteSpace: "nowrap",
-              cursor: "pointer",
-              transition: "all 0.2s ease",
-              border: `1px solid ${pathCopied ? theme2.colors.success : "transparent"}`
-            },
-            title: pathCopied ? "Copied!" : `Click to copy: ${agent.path}`,
-            onMouseEnter: (e) => {
-              if (!pathCopied) {
-                e.currentTarget.style.background = theme2.colors.backgroundTertiary || theme2.colors.border;
-              }
-            },
-            onMouseLeave: (e) => {
-              if (!pathCopied) {
-                e.currentTarget.style.background = theme2.colors.background;
-              }
-            },
-            children: pathCopied ? "Copied!" : agent.path
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              fontSize: theme2.fontSizes[1],
-              color: theme2.colors.textSecondary,
-              lineHeight: 1.5,
-              overflow: "hidden",
-              textOverflow: "ellipsis",
-              display: "-webkit-box",
-              WebkitLineClamp: 3,
-              WebkitBoxOrient: "vertical"
-            },
-            children: preview
-          }
-        ),
-        agent.sections && Object.keys(agent.sections).length > 0 && /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              display: "flex",
-              flexWrap: "wrap",
-              gap: "6px",
-              marginTop: "4px"
-            },
-            children: Object.keys(agent.sections).map((section) => /* @__PURE__ */ jsx(
-              "span",
-              {
-                style: {
-                  fontSize: theme2.fontSizes[0],
-                  padding: "2px 8px",
-                  background: theme2.colors.background,
-                  border: `1px solid ${theme2.colors.border}`,
-                  borderRadius: theme2.radii[1],
-                  color: theme2.colors.textSecondary,
-                  textTransform: "capitalize"
-                },
-                children: section
-              },
-              section
-            ))
-          }
-        )
-      ]
-    }
-  );
-};
-const getSourceBadge = (source2) => {
-  switch (source2) {
-    case "project-claude":
-      return {
-        label: "Project",
-        icon: /* @__PURE__ */ jsx(Folder, { size: 12 }),
-        color: "#06b6d4",
-        bgColor: "#06b6d420"
-      };
-    case "global-claude":
-      return {
-        label: "Global",
-        icon: /* @__PURE__ */ jsx(Globe, { size: 12 }),
-        color: "#8b5cf6",
-        bgColor: "#8b5cf620"
-      };
-  }
-};
-const getModelColor = (model) => {
-  switch (model) {
-    case "opus":
-      return "#f59e0b";
-    case "sonnet":
-      return "#10b981";
-    case "haiku":
-      return "#3b82f6";
-    case "inherit":
-      return "#6b7280";
-    default:
-      return "#10b981";
-  }
-};
-const SubagentCard = ({ subagent, onClick, isSelected }) => {
-  const { theme: theme2 } = useTheme();
-  const sourceBadge = getSourceBadge(subagent.source);
-  const modelColor = getModelColor(subagent.frontmatter.model);
-  const hasTools = subagent.frontmatter.tools;
-  const toolsArray = hasTools ? hasTools.split(",").map((t) => t.trim()) : null;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      onClick: () => onClick(subagent),
-      style: {
-        padding: "16px",
-        background: isSelected ? `${theme2.colors.primary}10` : theme2.colors.backgroundSecondary,
-        border: `1px solid ${isSelected ? theme2.colors.primary : theme2.colors.border}`,
-        borderRadius: theme2.radii[2],
-        cursor: "pointer",
-        transition: "all 0.2s ease",
-        display: "flex",
-        flexDirection: "column",
-        gap: "12px"
-      },
-      onMouseEnter: (e) => {
-        if (!isSelected) {
-          e.currentTarget.style.borderColor = theme2.colors.textSecondary;
-        }
-      },
-      onMouseLeave: (e) => {
-        if (!isSelected) {
-          e.currentTarget.style.borderColor = theme2.colors.border;
-        }
-      },
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              display: "flex",
-              alignItems: "flex-start",
-              justifyContent: "space-between",
-              gap: "8px"
-            },
-            children: [
-              /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px", flex: 1 }, children: [
-                /* @__PURE__ */ jsx(Bot, { size: 18, color: theme2.colors.primary }),
-                /* @__PURE__ */ jsx(
-                  "h3",
-                  {
-                    style: {
-                      margin: 0,
-                      fontSize: theme2.fontSizes[2],
-                      color: theme2.colors.text,
-                      fontWeight: 600
-                    },
-                    children: subagent.name
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "4px",
-                    padding: "4px 8px",
-                    fontSize: theme2.fontSizes[0],
-                    color: sourceBadge.color,
-                    background: sourceBadge.bgColor,
-                    border: `1px solid ${sourceBadge.color}40`,
-                    borderRadius: theme2.radii[1],
-                    flexShrink: 0
-                  },
-                  children: [
-                    sourceBadge.icon,
-                    /* @__PURE__ */ jsx("span", { children: sourceBadge.label })
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              fontSize: theme2.fontSizes[1],
-              color: theme2.colors.textSecondary,
-              lineHeight: 1.5
-            },
-            children: subagent.frontmatter.description
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              fontSize: theme2.fontSizes[0],
-              color: theme2.colors.textSecondary,
-              fontFamily: theme2.fonts.monospace,
-              wordBreak: "break-all",
-              opacity: 0.7
-            },
-            children: subagent.path
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              display: "flex",
-              flexWrap: "wrap",
-              gap: "6px",
-              marginTop: "4px"
-            },
-            children: [
-              subagent.frontmatter.model && /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "4px",
-                    fontSize: theme2.fontSizes[0],
-                    padding: "3px 8px",
-                    background: `${modelColor}20`,
-                    border: `1px solid ${modelColor}40`,
-                    borderRadius: theme2.radii[1],
-                    color: modelColor
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx(Zap, { size: 11 }),
-                    /* @__PURE__ */ jsx("span", { children: subagent.frontmatter.model })
-                  ]
-                }
-              ),
-              toolsArray && /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "4px",
-                    fontSize: theme2.fontSizes[0],
-                    padding: "3px 8px",
-                    background: theme2.colors.background,
-                    border: `1px solid ${theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    color: theme2.colors.textSecondary
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx(Wrench, { size: 11 }),
-                    /* @__PURE__ */ jsxs("span", { children: [
-                      toolsArray.length,
-                      " ",
-                      toolsArray.length === 1 ? "tool" : "tools"
-                    ] })
-                  ]
-                }
-              ),
-              subagent.frontmatter.permissionMode && subagent.frontmatter.permissionMode !== "default" && /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    fontSize: theme2.fontSizes[0],
-                    padding: "3px 8px",
-                    background: theme2.colors.background,
-                    border: `1px solid ${theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    color: theme2.colors.textSecondary
-                  },
-                  children: subagent.frontmatter.permissionMode
-                }
-              )
-            ]
-          }
-        )
-      ]
-    }
-  );
-};
-const AgentsListPanel = ({
-  context,
-  events
-}) => {
-  const { theme: theme2 } = useTheme();
-  const panelRef = useRef(null);
-  const [selectedItemId, setSelectedItemId] = useState(null);
-  const [searchQuery, setSearchQuery] = useState("");
-  const [agentFilter, setAgentFilter] = useState("all");
-  const [isRefreshing, setIsRefreshing] = useState(false);
-  const {
-    agents,
-    isLoading: agentsLoading,
-    error: agentsError
-  } = useAgentsData({ context });
-  const {
-    subagents,
-    isLoading: subagentsLoading,
-    error: subagentsError
-  } = useSubagentsData({ context });
-  const isLoading = agentsLoading || subagentsLoading;
-  const error = agentsError || subagentsError;
-  gt("agents-list", events, () => {
-    var _a;
-    return (_a = panelRef.current) == null ? void 0 : _a.focus();
-  });
-  const allItems = useMemo(() => {
-    const items = [];
-    agents.forEach((agent) => {
-      items.push({ type: "agent", data: agent });
-    });
-    subagents.forEach((subagent) => {
-      items.push({ type: "subagent", data: subagent });
-    });
-    return items;
-  }, [agents, subagents]);
-  const filteredItems = useMemo(() => {
-    let filtered = allItems;
-    if (agentFilter === "documentation") {
-      filtered = filtered.filter((item) => item.type === "agent");
-    } else if (agentFilter === "subagents") {
-      filtered = filtered.filter((item) => item.type === "subagent");
-    }
-    if (searchQuery.trim()) {
-      const query = searchQuery.toLowerCase().trim();
-      filtered = filtered.filter((item) => {
-        if (item.type === "agent") {
-          const agent = item.data;
-          if (agent.name.toLowerCase().includes(query)) return true;
-          if (agent.path.toLowerCase().includes(query)) return true;
-          if (agent.content.toLowerCase().includes(query)) return true;
-          return false;
-        } else {
-          const subagent = item.data;
-          if (subagent.name.toLowerCase().includes(query)) return true;
-          if (subagent.path.toLowerCase().includes(query)) return true;
-          if (subagent.frontmatter.description.toLowerCase().includes(query)) return true;
-          if (subagent.prompt.toLowerCase().includes(query)) return true;
-          return false;
-        }
-      });
-    }
-    return filtered;
-  }, [allItems, searchQuery, agentFilter]);
-  const handleItemClick = (item) => {
-    const itemId = item.type === "agent" ? item.data.id : item.data.id;
-    setSelectedItemId(itemId);
-    if (events) {
-      events.emit({
-        type: item.type === "agent" ? "agent:selected" : "subagent:selected",
-        source: "agents-list-panel",
-        timestamp: Date.now(),
-        payload: {
-          id: itemId,
-          type: item.type,
-          data: item.data
-        }
-      });
-    }
-  };
-  const handleRefresh = async () => {
-    setIsRefreshing(true);
-    try {
-      if (events) {
-        events.emit({
-          type: "agents:refresh",
-          source: "agents-list-panel",
-          timestamp: Date.now(),
-          payload: {}
-        });
-      }
-      await new Promise((resolve) => setTimeout(resolve, 600));
-    } finally {
-      setIsRefreshing(false);
-    }
-  };
-  const agentsCount = agents.length;
-  const subagentsCount = subagents.length;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: panelRef,
-      tabIndex: -1,
-      style: {
-        padding: "clamp(12px, 3vw, 20px)",
-        fontFamily: theme2.fonts.body,
-        height: "100%",
-        boxSizing: "border-box",
-        display: "flex",
-        flexDirection: "column",
-        gap: "16px",
-        overflow: "hidden",
-        backgroundColor: theme2.colors.background,
-        color: theme2.colors.text,
-        outline: "none"
-      },
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flexShrink: 0,
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "space-between",
-              gap: "12px",
-              flexWrap: "wrap"
-            },
-            children: [
-              /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px" }, children: [
-                /* @__PURE__ */ jsx(
-                  "h2",
-                  {
-                    style: {
-                      margin: 0,
-                      fontSize: theme2.fontSizes[4],
-                      color: theme2.colors.text
-                    },
-                    children: /* @__PURE__ */ jsx(
-                      "a",
-                      {
-                        href: "https://agents.md/",
-                        target: "_blank",
-                        rel: "noopener noreferrer",
-                        style: {
-                          color: "inherit",
-                          textDecoration: "none"
-                        },
-                        onMouseEnter: (e) => e.currentTarget.style.textDecoration = "underline",
-                        onMouseLeave: (e) => e.currentTarget.style.textDecoration = "none",
-                        children: "Agents"
-                      }
-                    )
-                  }
-                ),
-                !isLoading && /* @__PURE__ */ jsxs(
-                  "span",
-                  {
-                    style: {
-                      fontSize: theme2.fontSizes[1],
-                      color: theme2.colors.textSecondary,
-                      background: theme2.colors.backgroundSecondary,
-                      padding: "4px 10px",
-                      borderRadius: theme2.radii[1]
-                    },
-                    children: [
-                      filteredItems.length,
-                      " ",
-                      filteredItems.length === 1 ? "item" : "items"
-                    ]
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "12px", flex: "1 1 200px", maxWidth: "400px" }, children: [
-                /* @__PURE__ */ jsxs(
-                  "div",
-                  {
-                    style: {
-                      position: "relative",
-                      flex: 1,
-                      minWidth: "150px"
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        Search,
-                        {
-                          size: 16,
-                          color: theme2.colors.textSecondary,
-                          style: {
-                            position: "absolute",
-                            left: "10px",
-                            top: "50%",
-                            transform: "translateY(-50%)",
-                            pointerEvents: "none"
-                          }
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        "input",
-                        {
-                          type: "text",
-                          placeholder: "Search agents...",
-                          value: searchQuery,
-                          onChange: (e) => setSearchQuery(e.target.value),
-                          style: {
-                            width: "100%",
-                            padding: "8px 32px 8px 32px",
-                            fontSize: theme2.fontSizes[1],
-                            fontFamily: theme2.fonts.body,
-                            border: `1px solid ${theme2.colors.border}`,
-                            borderRadius: theme2.radii[2],
-                            background: theme2.colors.backgroundSecondary,
-                            color: theme2.colors.text,
-                            outline: "none",
-                            boxSizing: "border-box"
-                          }
-                        }
-                      ),
-                      searchQuery && /* @__PURE__ */ jsx(
-                        "button",
-                        {
-                          onClick: () => setSearchQuery(""),
-                          style: {
-                            position: "absolute",
-                            right: "6px",
-                            top: "50%",
-                            transform: "translateY(-50%)",
-                            background: "transparent",
-                            border: "none",
-                            padding: "4px",
-                            cursor: "pointer",
-                            display: "flex",
-                            alignItems: "center",
-                            justifyContent: "center",
-                            color: theme2.colors.textSecondary
-                          },
-                          "aria-label": "Clear search",
-                          children: /* @__PURE__ */ jsx(X, { size: 14 })
-                        }
-                      )
-                    ]
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "button",
-                  {
-                    onClick: handleRefresh,
-                    disabled: isRefreshing || isLoading,
-                    style: {
-                      background: theme2.colors.backgroundSecondary,
-                      border: `1px solid ${theme2.colors.border}`,
-                      borderRadius: theme2.radii[1],
-                      padding: "8px",
-                      cursor: isRefreshing ? "wait" : "pointer",
-                      display: "flex",
-                      alignItems: "center",
-                      justifyContent: "center",
-                      transition: "all 0.2s ease"
-                    },
-                    title: "Refresh agents",
-                    children: /* @__PURE__ */ jsx(
-                      RefreshCw,
-                      {
-                        size: 16,
-                        color: theme2.colors.textSecondary,
-                        style: {
-                          animation: isRefreshing ? "spin 1s linear infinite" : "none"
-                        }
-                      }
-                    )
-                  }
-                )
-              ] })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flexShrink: 0,
-              display: "flex",
-              gap: "8px"
-            },
-            children: [
-              /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  onClick: () => setAgentFilter("all"),
-                  style: {
-                    padding: "8px 16px",
-                    fontSize: theme2.fontSizes[1],
-                    fontFamily: theme2.fonts.body,
-                    border: `1px solid ${agentFilter === "all" ? theme2.colors.primary : theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    background: agentFilter === "all" ? `${theme2.colors.primary}15` : theme2.colors.backgroundSecondary,
-                    color: agentFilter === "all" ? theme2.colors.primary : theme2.colors.text,
-                    cursor: "pointer",
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "6px",
-                    fontWeight: agentFilter === "all" ? 600 : 400,
-                    transition: "all 0.2s ease"
-                  },
-                  children: [
-                    "All (",
-                    agentsCount + subagentsCount,
-                    ")"
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  onClick: () => setAgentFilter("documentation"),
-                  style: {
-                    padding: "8px 16px",
-                    fontSize: theme2.fontSizes[1],
-                    fontFamily: theme2.fonts.body,
-                    border: `1px solid ${agentFilter === "documentation" ? theme2.colors.primary : theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    background: agentFilter === "documentation" ? `${theme2.colors.primary}15` : theme2.colors.backgroundSecondary,
-                    color: agentFilter === "documentation" ? theme2.colors.primary : theme2.colors.text,
-                    cursor: "pointer",
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "6px",
-                    fontWeight: agentFilter === "documentation" ? 600 : 400,
-                    transition: "all 0.2s ease"
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx(BookOpen, { size: 14 }),
-                    "Docs (",
-                    agentsCount,
-                    ")"
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  onClick: () => setAgentFilter("subagents"),
-                  style: {
-                    padding: "8px 16px",
-                    fontSize: theme2.fontSizes[1],
-                    fontFamily: theme2.fonts.body,
-                    border: `1px solid ${agentFilter === "subagents" ? theme2.colors.primary : theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    background: agentFilter === "subagents" ? `${theme2.colors.primary}15` : theme2.colors.backgroundSecondary,
-                    color: agentFilter === "subagents" ? theme2.colors.primary : theme2.colors.text,
-                    cursor: "pointer",
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "6px",
-                    fontWeight: agentFilter === "subagents" ? 600 : 400,
-                    transition: "all 0.2s ease"
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx(Bot, { size: 14 }),
-                    "Subagents (",
-                    subagentsCount,
-                    ")"
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        error && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flexShrink: 0,
-              padding: "12px",
-              background: `${theme2.colors.error}20`,
-              border: `1px solid ${theme2.colors.error}`,
-              borderRadius: theme2.radii[2],
-              display: "flex",
-              alignItems: "center",
-              gap: "8px",
-              color: theme2.colors.error,
-              fontSize: theme2.fontSizes[1]
-            },
-            children: [
-              /* @__PURE__ */ jsx(CircleAlert, { size: 16 }),
-              /* @__PURE__ */ jsx("span", { children: error })
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              flex: 1,
-              overflowY: "auto",
-              minHeight: 0
-            },
-            children: isLoading ? /* @__PURE__ */ jsx(
-              "div",
-              {
-                style: {
-                  height: "100%",
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  color: theme2.colors.textSecondary,
-                  fontSize: theme2.fontSizes[2]
-                },
-                children: "Loading agents..."
-              }
-            ) : filteredItems.length === 0 ? /* @__PURE__ */ jsxs(
-              "div",
-              {
-                style: {
-                  height: "100%",
-                  display: "flex",
-                  flexDirection: "column",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  gap: "16px",
-                  color: theme2.colors.textSecondary,
-                  padding: "24px"
-                },
-                children: [
-                  /* @__PURE__ */ jsx(FileCode, { size: 48, color: theme2.colors.border }),
-                  /* @__PURE__ */ jsxs("div", { style: { textAlign: "center" }, children: [
-                    /* @__PURE__ */ jsx("p", { style: { margin: 0, fontSize: theme2.fontSizes[2] }, children: searchQuery ? "No agents match your search" : "No agents found" }),
-                    /* @__PURE__ */ jsx("p", { style: { margin: "8px 0 0 0", fontSize: theme2.fontSizes[1] }, children: searchQuery ? "Try a different search term" : "Add AGENTS.md or create subagents in .claude/agents/ to get started" })
-                  ] })
-                ]
-              }
-            ) : /* @__PURE__ */ jsx(
-              "div",
-              {
-                style: {
-                  display: "grid",
-                  gridTemplateColumns: "repeat(auto-fill, minmax(250px, 1fr))",
-                  gap: "16px",
-                  padding: "4px"
-                },
-                children: filteredItems.map((item) => {
-                  if (item.type === "agent") {
-                    return /* @__PURE__ */ jsx(
-                      AgentCard,
-                      {
-                        agent: item.data,
-                        onClick: () => handleItemClick(item),
-                        isSelected: selectedItemId === item.data.id
-                      },
-                      item.data.id
-                    );
-                  } else {
-                    return /* @__PURE__ */ jsx(
-                      SubagentCard,
-                      {
-                        subagent: item.data,
-                        onClick: () => handleItemClick(item),
-                        isSelected: selectedItemId === item.data.id
-                      },
-                      item.data.id
-                    );
-                  }
-                })
-              }
-            )
-          }
-        ),
-        /* @__PURE__ */ jsx("style", { children: `
-          @keyframes spin {
-            to { transform: rotate(360deg); }
-          }
-        ` })
-      ]
-    }
-  );
-};
 const AgentDetailPanel = ({
   context,
   events
@@ -52214,6 +50904,411 @@ const AgentDetailPanel = ({
   }
   return null;
 };
+const getSourceBadge$1 = (source2) => {
+  switch (source2) {
+    case "project-root":
+      return {
+        label: "Root",
+        icon: /* @__PURE__ */ jsx(FileText, { size: 12 }),
+        color: "#10b981",
+        bgColor: "#10b98120"
+      };
+    case "project-nested":
+      return {
+        label: "Nested",
+        icon: /* @__PURE__ */ jsx(FolderTree, { size: 12 }),
+        color: "#3b82f6",
+        bgColor: "#3b82f620"
+      };
+    case "global-universal":
+      return {
+        label: "Global",
+        icon: /* @__PURE__ */ jsx(Folder, { size: 12 }),
+        color: "#8b5cf6",
+        bgColor: "#8b5cf620"
+      };
+  }
+};
+const AgentCard = ({ agent, onClick, isSelected }) => {
+  var _a;
+  const { theme: theme2 } = useTheme();
+  const sourceBadge = getSourceBadge$1(agent.source);
+  const [pathCopied, setPathCopied] = React2__default.useState(false);
+  const preview = ((_a = agent.content.split("\n").find((line) => line.trim() && !line.startsWith("#"))) == null ? void 0 : _a.substring(0, 150)) || "No description available";
+  const handleCopyPath = async (e) => {
+    e.stopPropagation();
+    try {
+      await navigator.clipboard.writeText(agent.path);
+      setPathCopied(true);
+      setTimeout(() => setPathCopied(false), 2e3);
+    } catch (err) {
+      console.error("Failed to copy path:", err);
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      onClick: () => onClick(agent),
+      style: {
+        padding: "16px",
+        background: isSelected ? `${theme2.colors.primary}10` : theme2.colors.backgroundSecondary,
+        border: `1px solid ${isSelected ? theme2.colors.primary : theme2.colors.border}`,
+        borderRadius: theme2.radii[2],
+        cursor: "pointer",
+        transition: "all 0.2s ease",
+        display: "flex",
+        flexDirection: "column",
+        gap: "12px"
+      },
+      onMouseEnter: (e) => {
+        if (!isSelected) {
+          e.currentTarget.style.borderColor = theme2.colors.textSecondary;
+        }
+      },
+      onMouseLeave: (e) => {
+        if (!isSelected) {
+          e.currentTarget.style.borderColor = theme2.colors.border;
+        }
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "flex-start",
+              justifyContent: "space-between",
+              gap: "8px"
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "h3",
+                {
+                  style: {
+                    margin: 0,
+                    fontSize: theme2.fontSizes[2],
+                    color: theme2.colors.text,
+                    fontWeight: 600,
+                    flex: 1
+                  },
+                  children: agent.name
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "4px",
+                    padding: "4px 8px",
+                    fontSize: theme2.fontSizes[0],
+                    color: sourceBadge.color,
+                    background: sourceBadge.bgColor,
+                    border: `1px solid ${sourceBadge.color}40`,
+                    borderRadius: theme2.radii[1],
+                    flexShrink: 0
+                  },
+                  children: [
+                    sourceBadge.icon,
+                    /* @__PURE__ */ jsx("span", { children: sourceBadge.label })
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            onClick: handleCopyPath,
+            style: {
+              fontSize: theme2.fontSizes[0],
+              color: pathCopied ? theme2.colors.success : theme2.colors.textMuted,
+              fontFamily: theme2.fonts.monospace,
+              background: pathCopied ? `${theme2.colors.success}15` : theme2.colors.background,
+              padding: "4px 8px",
+              borderRadius: theme2.radii[1],
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
+              cursor: "pointer",
+              transition: "all 0.2s ease",
+              border: `1px solid ${pathCopied ? theme2.colors.success : "transparent"}`
+            },
+            title: pathCopied ? "Copied!" : `Click to copy: ${agent.path}`,
+            onMouseEnter: (e) => {
+              if (!pathCopied) {
+                e.currentTarget.style.background = theme2.colors.backgroundTertiary || theme2.colors.border;
+              }
+            },
+            onMouseLeave: (e) => {
+              if (!pathCopied) {
+                e.currentTarget.style.background = theme2.colors.background;
+              }
+            },
+            children: pathCopied ? "Copied!" : agent.path
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              fontSize: theme2.fontSizes[1],
+              color: theme2.colors.textSecondary,
+              lineHeight: 1.5,
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              display: "-webkit-box",
+              WebkitLineClamp: 3,
+              WebkitBoxOrient: "vertical"
+            },
+            children: preview
+          }
+        ),
+        agent.sections && Object.keys(agent.sections).length > 0 && /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexWrap: "wrap",
+              gap: "6px",
+              marginTop: "4px"
+            },
+            children: Object.keys(agent.sections).map((section) => /* @__PURE__ */ jsx(
+              "span",
+              {
+                style: {
+                  fontSize: theme2.fontSizes[0],
+                  padding: "2px 8px",
+                  background: theme2.colors.background,
+                  border: `1px solid ${theme2.colors.border}`,
+                  borderRadius: theme2.radii[1],
+                  color: theme2.colors.textSecondary,
+                  textTransform: "capitalize"
+                },
+                children: section
+              },
+              section
+            ))
+          }
+        )
+      ]
+    }
+  );
+};
+const getSourceBadge = (source2) => {
+  switch (source2) {
+    case "project-claude":
+      return {
+        label: "Project",
+        icon: /* @__PURE__ */ jsx(Folder, { size: 12 }),
+        color: "#06b6d4",
+        bgColor: "#06b6d420"
+      };
+    case "global-claude":
+      return {
+        label: "Global",
+        icon: /* @__PURE__ */ jsx(Globe, { size: 12 }),
+        color: "#8b5cf6",
+        bgColor: "#8b5cf620"
+      };
+  }
+};
+const getModelColor = (model) => {
+  switch (model) {
+    case "opus":
+      return "#f59e0b";
+    case "sonnet":
+      return "#10b981";
+    case "haiku":
+      return "#3b82f6";
+    case "inherit":
+      return "#6b7280";
+    default:
+      return "#10b981";
+  }
+};
+const SubagentCard = ({ subagent, onClick, isSelected }) => {
+  const { theme: theme2 } = useTheme();
+  const sourceBadge = getSourceBadge(subagent.source);
+  const modelColor = getModelColor(subagent.frontmatter.model);
+  const hasTools = subagent.frontmatter.tools;
+  const toolsArray = hasTools ? hasTools.split(",").map((t) => t.trim()) : null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      onClick: () => onClick(subagent),
+      style: {
+        padding: "16px",
+        background: isSelected ? `${theme2.colors.primary}10` : theme2.colors.backgroundSecondary,
+        border: `1px solid ${isSelected ? theme2.colors.primary : theme2.colors.border}`,
+        borderRadius: theme2.radii[2],
+        cursor: "pointer",
+        transition: "all 0.2s ease",
+        display: "flex",
+        flexDirection: "column",
+        gap: "12px"
+      },
+      onMouseEnter: (e) => {
+        if (!isSelected) {
+          e.currentTarget.style.borderColor = theme2.colors.textSecondary;
+        }
+      },
+      onMouseLeave: (e) => {
+        if (!isSelected) {
+          e.currentTarget.style.borderColor = theme2.colors.border;
+        }
+      },
+      children: [
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "flex-start",
+              justifyContent: "space-between",
+              gap: "8px"
+            },
+            children: [
+              /* @__PURE__ */ jsxs("div", { style: { display: "flex", alignItems: "center", gap: "8px", flex: 1 }, children: [
+                /* @__PURE__ */ jsx(Bot, { size: 18, color: theme2.colors.primary }),
+                /* @__PURE__ */ jsx(
+                  "h3",
+                  {
+                    style: {
+                      margin: 0,
+                      fontSize: theme2.fontSizes[2],
+                      color: theme2.colors.text,
+                      fontWeight: 600
+                    },
+                    children: subagent.name
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "4px",
+                    padding: "4px 8px",
+                    fontSize: theme2.fontSizes[0],
+                    color: sourceBadge.color,
+                    background: sourceBadge.bgColor,
+                    border: `1px solid ${sourceBadge.color}40`,
+                    borderRadius: theme2.radii[1],
+                    flexShrink: 0
+                  },
+                  children: [
+                    sourceBadge.icon,
+                    /* @__PURE__ */ jsx("span", { children: sourceBadge.label })
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              fontSize: theme2.fontSizes[1],
+              color: theme2.colors.textSecondary,
+              lineHeight: 1.5
+            },
+            children: subagent.frontmatter.description
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              fontSize: theme2.fontSizes[0],
+              color: theme2.colors.textSecondary,
+              fontFamily: theme2.fonts.monospace,
+              wordBreak: "break-all",
+              opacity: 0.7
+            },
+            children: subagent.path
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexWrap: "wrap",
+              gap: "6px",
+              marginTop: "4px"
+            },
+            children: [
+              subagent.frontmatter.model && /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "4px",
+                    fontSize: theme2.fontSizes[0],
+                    padding: "3px 8px",
+                    background: `${modelColor}20`,
+                    border: `1px solid ${modelColor}40`,
+                    borderRadius: theme2.radii[1],
+                    color: modelColor
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(Zap, { size: 11 }),
+                    /* @__PURE__ */ jsx("span", { children: subagent.frontmatter.model })
+                  ]
+                }
+              ),
+              toolsArray && /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "4px",
+                    fontSize: theme2.fontSizes[0],
+                    padding: "3px 8px",
+                    background: theme2.colors.background,
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderRadius: theme2.radii[1],
+                    color: theme2.colors.textSecondary
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(Wrench, { size: 11 }),
+                    /* @__PURE__ */ jsxs("span", { children: [
+                      toolsArray.length,
+                      " ",
+                      toolsArray.length === 1 ? "tool" : "tools"
+                    ] })
+                  ]
+                }
+              ),
+              subagent.frontmatter.permissionMode && subagent.frontmatter.permissionMode !== "default" && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    fontSize: theme2.fontSizes[0],
+                    padding: "3px 8px",
+                    background: theme2.colors.background,
+                    border: `1px solid ${theme2.colors.border}`,
+                    borderRadius: theme2.radii[1],
+                    color: theme2.colors.textSecondary
+                  },
+                  children: subagent.frontmatter.permissionMode
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
 const AgenticResourcesPanel = ({
   context,
   events
@@ -52221,6 +51316,8 @@ const AgenticResourcesPanel = ({
   var _a;
   const { theme: theme2 } = useTheme();
   const panelRef = useRef(null);
+  const hasLoadedAgentsRef = useRef(false);
+  const hasLoadedSkillsRef = useRef(false);
   const [mode, setMode] = useState("agents");
   const [selectedItemId, setSelectedItemId] = useState(null);
   const [searchQuery, setSearchQuery] = useState("");
@@ -52243,7 +51340,15 @@ const AgenticResourcesPanel = ({
     error: skillsError,
     refreshSkills
   } = useSkillsData({ context });
-  const isLoading = mode === "agents" ? agentsLoading || subagentsLoading : skillsLoading;
+  if (!agentsLoading && !subagentsLoading && !hasLoadedAgentsRef.current) {
+    hasLoadedAgentsRef.current = true;
+  }
+  if (!skillsLoading && !hasLoadedSkillsRef.current) {
+    hasLoadedSkillsRef.current = true;
+  }
+  const showAgentsLoading = (agentsLoading || subagentsLoading) && !hasLoadedAgentsRef.current;
+  const showSkillsLoading = skillsLoading && !hasLoadedSkillsRef.current;
+  const isLoading = mode === "agents" ? showAgentsLoading : showSkillsLoading;
   const error = mode === "agents" ? agentsError || subagentsError : skillsError;
   gt("agentic-resources", events, () => {
     var _a2;
@@ -52872,31 +51977,6 @@ const AgenticResourcesPanel = ({
   );
 };
 const panels = [
-  {
-    metadata: {
-      id: "industry-theme.skills-list",
-      name: "Skills List",
-      icon: "⚡",
-      version: "0.1.0",
-      author: "Principal ADE",
-      description: "Display and manage Agent Skills from SKILL.md files",
-      slices: ["fileTree", "globalSkills"]
-      // Data slices this panel depends on
-    },
-    component: SkillsListPanel,
-    // Optional: Called when this specific panel is mounted
-    onMount: async (context) => {
-      var _a;
-      console.log(
-        "Skills List Panel mounted",
-        (_a = context.currentScope.repository) == null ? void 0 : _a.path
-      );
-    },
-    // Optional: Called when this specific panel is unmounted
-    onUnmount: async (_context) => {
-      console.log("Skills List Panel unmounting");
-    }
-  },
   {
     metadata: {
       id: "industry-theme.skills-browse",
@@ -52972,31 +52052,6 @@ const panels = [
       console.log("Skill Detail Panel unmounting");
     }
   },
-  {
-    metadata: {
-      id: "industry-theme.agents-list",
-      name: "Agents List",
-      icon: "🤖",
-      version: "0.1.0",
-      author: "Principal ADE",
-      description: "Display AGENTS.md documentation and Claude Code subagents",
-      slices: ["fileTree", "globalAgents", "globalSubagents"]
-      // Data slices this panel depends on
-    },
-    component: AgentsListPanel,
-    // Optional: Called when this specific panel is mounted
-    onMount: async (context) => {
-      var _a;
-      console.log(
-        "Agents List Panel mounted",
-        (_a = context.currentScope.repository) == null ? void 0 : _a.path
-      );
-    },
-    // Optional: Called when this specific panel is unmounted
-    onUnmount: async (_context) => {
-      console.log("Agents List Panel unmounting");
-    }
-  },
   {
     metadata: {
       id: "industry-theme.agent-detail",