@industry-theme/agent-panels 0.2.22 → 0.2.23

package/dist/index.d.ts

@@ -1,8 +1,10 @@
 import { type SkillsListPanelProps } from './panels/SkillsListPanel';
+import { SkillsBrowsePanel } from './panels/SkillsBrowsePanel';
 import { type SkillDetailPanelProps } from './panels/SkillDetailPanel';
 import type { PanelDefinition } from './types';
 import type { Skill } from './panels/skills/hooks/useSkillsData';
 export type { SkillsListPanelProps, SkillDetailPanelProps, Skill };
+export { SkillsBrowsePanel };
 /**
  * Export array of panel definitions.
  * This is the required export for panel extensions.

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AACtF,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAGzF,OAAO,KAAK,EAAE,eAAe,EAAqB,MAAM,SAAS,CAAC;AAClE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,qCAAqC,CAAC;AAGjE,YAAY,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,KAAK,EAAE,CAAC;AAEnE;;;GAGG;AACH,eAAO,MAAM,MAAM,EAAE,eAAe,EA6GnC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,aAAa,qBAGzB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,eAAe,qBAG3B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AACtF,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AAC/D,OAAO,EAAoB,KAAK,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAGzF,OAAO,KAAK,EAAE,eAAe,EAAqB,MAAM,SAAS,CAAC;AAClE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,qCAAqC,CAAC;AAGjE,YAAY,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,KAAK,EAAE,CAAC;AAGnE,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B;;;GAGG;AACH,eAAO,MAAM,MAAM,EAAE,eAAe,EAwInC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,aAAa,qBAGzB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,eAAe,qBAG3B,CAAC"}

package/dist/panels/SkillsBrowsePanel.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { PanelComponentProps } from '../types';
+/**
+ * SkillsBrowsePanel - A panel for browsing Agent Skills from GitHub repositories
+ *
+ * This panel shows:
+ * - List/grid of available skills from a GitHub repository
+ * - Search functionality to filter skills
+ * - Skill metadata (name, description, capabilities)
+ * - Click to select and emit events for detail views
+ *
+ * Note: This panel does NOT show global/installed skills - it's specifically for browsing remote repositories
+ */
+export declare const SkillsBrowsePanel: React.FC<PanelComponentProps>;
+//# sourceMappingURL=SkillsBrowsePanel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SkillsBrowsePanel.d.ts","sourceRoot":"","sources":["../../src/panels/SkillsBrowsePanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAIpE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAKpD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA4V3D,CAAC"}

package/dist/panels/skills/hooks/useSkillsBrowseData.d.ts

@@ -0,0 +1,18 @@
+import type { PanelContextValue } from '../../../types';
+import type { Skill } from './useSkillsData';
+interface UseSkillsBrowseDataParams {
+    context: PanelContextValue;
+}
+interface UseSkillsBrowseDataReturn {
+    skills: Skill[];
+    isLoading: boolean;
+    error: string | null;
+    refreshSkills: () => Promise<void>;
+}
+/**
+ * Hook to discover and read SKILL.md files from GitHub repositories
+ * This hook is specifically for browse mode and does NOT include global skills
+ */
+export declare const useSkillsBrowseData: ({ context, }: UseSkillsBrowseDataParams) => UseSkillsBrowseDataReturn;
+export {};
+//# sourceMappingURL=useSkillsBrowseData.d.ts.map

package/dist/panels/skills/hooks/useSkillsBrowseData.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSkillsBrowseData.d.ts","sourceRoot":"","sources":["../../../../src/panels/skills/hooks/useSkillsBrowseData.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAC;AAS7C,UAAU,yBAAyB;IACjC,OAAO,EAAE,iBAAiB,CAAC;CAC5B;AAED,UAAU,yBAAyB;IACjC,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACpC;AAED;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,cAEjC,yBAAyB,KAAG,yBAgG9B,CAAC"}

package/dist/panels/skills/hooks/useSkillsData.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useSkillsData.d.ts","sourceRoot":"","sources":["../../../../src/panels/skills/hooks/useSkillsData.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAExD,MAAM,MAAM,WAAW,GACnB,mBAAmB,GACnB,kBAAkB,GAClB,gBAAgB,GAChB,eAAe,GACf,eAAe,CAAC;AAEpB,MAAM,WAAW,aAAa;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;CAClB;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC5B,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,KAAK;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IAExB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IAEtB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAE5B,QAAQ,CAAC,EAAE,aAAa,CAAC;IAEzB,kBAAkB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAEzC,qBAAqB,EAAE,qBAAqB,CAAC;CAC9C;AAKD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,KAAK,EAAE,CAAC;CACjB;AAED,UAAU,mBAAmB;IAC3B,OAAO,EAAE,iBAAiB,CAAC;CAC5B;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACpC;AAsXD;;GAEG;AACH,eAAO,MAAM,aAAa,GAAI,cAE3B,mBAAmB,KAAG,mBAwHxB,CAAC"}
+{"version":3,"file":"useSkillsData.d.ts","sourceRoot":"","sources":["../../../../src/panels/skills/hooks/useSkillsData.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AASxD,MAAM,MAAM,WAAW,GACnB,mBAAmB,GACnB,kBAAkB,GAClB,gBAAgB,GAChB,eAAe,GACf,eAAe,CAAC;AAEpB,MAAM,WAAW,aAAa;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;CAClB;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAC5B,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B;AAED,MAAM,WAAW,qBAAqB;IACpC,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,OAAO,CAAC;IACtB,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,KAAK;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IAExB,eAAe,EAAE,MAAM,CAAC;IACxB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IAEtB,MAAM,EAAE,WAAW,CAAC;IACpB,QAAQ,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IAE5B,QAAQ,CAAC,EAAE,aAAa,CAAC;IAEzB,kBAAkB,CAAC,EAAE,iBAAiB,EAAE,CAAC;IAEzC,qBAAqB,EAAE,qBAAqB,CAAC;CAC9C;AAKD;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,MAAM,EAAE,KAAK,EAAE,CAAC;CACjB;AAED,UAAU,mBAAmB;IAC3B,OAAO,EAAE,iBAAiB,CAAC;CAC5B;AAED,UAAU,mBAAmB;IAC3B,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CACpC;AAqHD;;GAEG;AACH,eAAO,MAAM,aAAa,GAAI,cAE3B,mBAAmB,KAAG,mBAwHxB,CAAC"}

package/dist/panels/skills/utils/skillsUtils.d.ts

@@ -0,0 +1,37 @@
+import type { FileTree } from '@principal-ai/repository-abstraction';
+import type { Skill, SkillSource, FrontmatterValidation } from '../hooks/useSkillsData';
+/**
+ * Helper function to determine skill source and priority from path
+ */
+export declare const determineSkillSource: (path: string) => {
+    source: SkillSource;
+    priority: 1 | 2 | 3 | 4 | 5;
+};
+/**
+ * Helper function to find skill markdown files from the FileTree's allFiles array
+ * Looks for any .md files in .agent/skills/ or .claude/skills/ directories (local mode)
+ * or SKILL.md files anywhere in the tree (browser mode for GitHub repositories)
+ */
+export declare const findSkillFiles: (fileTree: FileTree, isBrowserMode?: boolean) => string[];
+/**
+ * Helper function to analyze skill folder structure
+ */
+export declare const analyzeSkillStructure: (fileTree: FileTree, skillPath: string) => {
+    skillFolderPath: string;
+    hasScripts: boolean;
+    hasReferences: boolean;
+    hasAssets: boolean;
+    scriptFiles: string[];
+    referenceFiles: string[];
+    assetFiles: string[];
+};
+/**
+ * Helper function to validate YAML frontmatter structure and required fields
+ * Now validates gracefully - considers skills valid even with missing required fields
+ */
+export declare const validateFrontmatter: (content: string) => FrontmatterValidation;
+/**
+ * Helper function to parse skill markdown content and extract metadata
+ */
+export declare const parseSkillContent: (content: string, path: string, fileTree: FileTree, fileSystemAdapter?: any, isBrowserMode?: boolean) => Promise<Skill>;
+//# sourceMappingURL=skillsUtils.d.ts.map

package/dist/panels/skills/utils/skillsUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"skillsUtils.d.ts","sourceRoot":"","sources":["../../../../src/panels/skills/utils/skillsUtils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AACrE,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAExF;;GAEG;AACH,eAAO,MAAM,oBAAoB,GAAI,MAAM,MAAM,KAAG;IAAE,MAAM,EAAE,WAAW,CAAC;IAAC,QAAQ,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;CAWrG,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,cAAc,GAAI,UAAU,QAAQ,EAAE,gBAAe,OAAe,KAAG,MAAM,EAyBzF,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,qBAAqB,GAAI,UAAU,QAAQ,EAAE,WAAW,MAAM;;;;;;;;CAkD1E,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,mBAAmB,GAAI,SAAS,MAAM,KAAG,qBAgErD,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAC5B,SAAS,MAAM,EACf,MAAM,MAAM,EACZ,UAAU,QAAQ,EAClB,oBAAoB,GAAG,EACvB,gBAAe,OAAe,KAC7B,OAAO,CAAC,KAAK,CA2Ef,CAAC"}

package/dist/panels.bundle.js

@@ -2618,7 +2618,6 @@ const __iconNode = [
   ]
 ];
 const Zap = createLucideIcon("zap", __iconNode);
-const EMPTY_SKILLS_ARRAY = [];
 const determineSkillSource = (path2) => {
   if (path2.includes(".agent/skills/")) {
     return { source: "project-universal", priority: 1 };
@@ -2758,15 +2757,15 @@ const parseSkillContent = async (content2, path2, fileTree, fileSystemAdapter, i
   }
   const structure = analyzeSkillStructure(fileTree, path2);
   const { source: source2, priority } = determineSkillSource(path2);
-  let metadata;
+  let metadata = void 0;
   if (!isBrowserMode && fileSystemAdapter && structure.skillFolderPath) {
     try {
       const metadataPath = `${structure.skillFolderPath}/.metadata.json`;
       const metadataContent = await fileSystemAdapter.readFile(metadataPath);
       metadata = JSON.parse(metadataContent);
-      console.log("[useSkillsData] Loaded metadata for skill:", skillDirName, metadata);
+      console.log("[skillsUtils] Loaded metadata for skill:", skillDirName, metadata);
     } catch (error) {
-      console.debug("[useSkillsData] No metadata file for skill:", skillDirName);
+      console.debug("[skillsUtils] No metadata file for skill:", skillDirName);
     }
   }
   const frontmatterValidation = validateFrontmatter(content2);
@@ -2785,6 +2784,7 @@ const parseSkillContent = async (content2, path2, fileTree, fileSystemAdapter, i
     frontmatterValidation
   };
 };
+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)) {
@@ -2859,14 +2859,14 @@ const useSkillsData = ({
   context
 }) => {
   var _a, _b, _c;
-  const [skills, setSkills] = useState(EMPTY_SKILLS_ARRAY);
+  const [skills, setSkills] = useState(EMPTY_SKILLS_ARRAY$1);
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState(null);
   const fileTreeSlice = context.getSlice("fileTree");
   const fileTree = fileTreeSlice == null ? void 0 : fileTreeSlice.data;
   const fileTreeSha = fileTree == null ? void 0 : fileTree.sha;
   const globalSkillsSlice = context.getSlice("globalSkills");
-  const globalSkills = ((_a = globalSkillsSlice == null ? void 0 : globalSkillsSlice.data) == null ? void 0 : _a.skills) ?? EMPTY_SKILLS_ARRAY;
+  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;
@@ -3779,6 +3779,425 @@ const SkillsListPanel = ({
     }
   );
 };
+const EMPTY_SKILLS_ARRAY = [];
+const useSkillsBrowseData = ({
+  context
+}) => {
+  var _a, _b;
+  const [skills, setSkills] = useState(EMPTY_SKILLS_ARRAY);
+  const [isLoading, setIsLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const fileTreeSlice = context.getSlice("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 lastLoadedSha = useRef(void 0);
+  const loadSkills = useCallback(async () => {
+    if (fileTreeSha === lastLoadedSha.current) {
+      console.log("[useSkillsBrowseData] Skipping reload - data unchanged (SHA:", fileTreeSha, ")");
+      return;
+    }
+    console.log("[useSkillsBrowseData] Loading skills from GitHub repo - SHA:", fileTreeSha);
+    setIsLoading(true);
+    setError(null);
+    try {
+      let repoSkills = [];
+      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;
+        }
+        console.log("[useSkillsBrowseData] GitHub repo detected:", repoPath);
+        const skillPaths = findSkillFiles(fileTree, true);
+        console.log("[useSkillsBrowseData] Found skill paths:", skillPaths);
+        const skillPromises = skillPaths.map(async (skillPath) => {
+          try {
+            const content2 = await fileSystem.readFile(skillPath);
+            return parseSkillContent(content2, skillPath, fileTree, fileSystem, true);
+          } catch (err) {
+            console.error(`[useSkillsBrowseData] Failed to read skill at ${skillPath}:`, err);
+            return null;
+          }
+        });
+        repoSkills = (await Promise.all(skillPromises)).filter(
+          (skill) => skill !== null
+        );
+      }
+      console.log("[useSkillsBrowseData] Total skills loaded:", repoSkills.length);
+      setSkills(repoSkills);
+      lastLoadedSha.current = fileTreeSha;
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to load skills";
+      setError(errorMessage);
+      console.error("[useSkillsBrowseData] Error loading skills:", err);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [fileTree, fileTreeSha, repoPath, fileSystem]);
+  const refreshSkills = useCallback(async () => {
+    lastLoadedSha.current = void 0;
+    await loadSkills();
+  }, [loadSkills]);
+  useEffect(() => {
+    loadSkills();
+  }, [loadSkills]);
+  return {
+    skills,
+    isLoading,
+    error,
+    refreshSkills
+  };
+};
+const SkillsBrowsePanel = ({
+  context,
+  events
+}) => {
+  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 });
+  gt("skills-browse", events, () => {
+    var _a;
+    return (_a = panelRef.current) == null ? void 0 : _a.focus();
+  });
+  useEffect(() => {
+    const unsubscribeInstalled = events.on("skill:installed", () => {
+      console.log("[SkillsBrowsePanel] Skill installed, refreshing...");
+      refreshSkills();
+    });
+    const unsubscribeUninstalled = events.on("skill:uninstalled", () => {
+      console.log("[SkillsBrowsePanel] Skill uninstalled, refreshing...");
+      refreshSkills();
+    });
+    return () => {
+      unsubscribeInstalled();
+      unsubscribeUninstalled();
+    };
+  }, [events, refreshSkills]);
+  const filteredSkills = useMemo(() => {
+    let filtered = skills;
+    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;
+      });
+    }
+    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: "skills-browse-panel",
+        timestamp: Date.now(),
+        payload: { skillId: skill.id, skill }
+      });
+    }
+  };
+  const handleRefresh = async () => {
+    setIsRefreshing(true);
+    if (events) {
+      events.emit({
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        type: "skills:refresh",
+        source: "skills-browse-panel",
+        timestamp: Date.now(),
+        payload: {}
+      });
+    }
+    try {
+      await refreshSkills();
+    } finally {
+      setIsRefreshing(false);
+    }
+  };
+  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: "Browse 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 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 })
+                        }
+                      )
+                    ]
+                  }
+                ),
+                /* @__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 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 skills from repository..."
+              }
+            ) : 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 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(
+              "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
+                  },
+                  skill.id
+                ))
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx("style", { children: `
+          @keyframes spin {
+            to { transform: rotate(360deg); }
+          }
+        ` })
+      ]
+    }
+  );
+};
 var MarkdownSourceType$1;
 ((MarkdownSourceType2) => {
   MarkdownSourceType2["WORKSPACE_FILE"] = "workspace_file";
@@ -51051,6 +51470,31 @@ const panels = [
       console.log("Skills List Panel unmounting");
     }
   },
+  {
+    metadata: {
+      id: "industry-theme.skills-browse",
+      name: "Browse Skills",
+      icon: "🔍",
+      version: "0.1.0",
+      author: "Principal ADE",
+      description: "Browse Agent Skills from GitHub repositories",
+      slices: ["fileTree"]
+      // Only needs fileTree, not globalSkills
+    },
+    component: SkillsBrowsePanel,
+    // Optional: Called when this specific panel is mounted
+    onMount: async (context) => {
+      var _a;
+      console.log(
+        "Skills Browse 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 Browse Panel unmounting");
+    }
+  },
   {
     metadata: {
       id: "industry-theme.skill-detail",
@@ -51134,6 +51578,7 @@ const onPackageUnload = async () => {
   console.log("Panel package unloading - Agent Panels Extension");
 };
 export {
+  SkillsBrowsePanel,
   onPackageLoad,
   onPackageUnload,
   panels