@industry-theme/agent-panels 0.2.23 → 0.2.24

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

@@ -1 +1 @@
-{"version":3,"file":"AgentDetailPanel.d.ts","sourceRoot":"","sources":["../../src/panels/AgentDetailPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAQpD,MAAM,WAAW,qBAAsB,SAAQ,mBAAmB;CAAG;AAOrE,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAgc5D,CAAC"}
+{"version":3,"file":"AgentDetailPanel.d.ts","sourceRoot":"","sources":["../../src/panels/AgentDetailPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAC3D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AASpD,MAAM,WAAW,qBAAsB,SAAQ,mBAAmB;CAAG;AAOrE,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAgc5D,CAAC"}

package/dist/panels/SkillsBrowsePanel.d.ts

@@ -1,5 +1,12 @@
 import React from 'react';
 import type { PanelComponentProps } from '../types';
+export interface SkillsBrowsePanelProps extends PanelComponentProps {
+    /**
+     * When true, shows the refresh button and enables refresh functionality.
+     * The host must support handling 'skills:refresh' events.
+     */
+    supportsRefresh?: boolean;
+}
 /**
  * SkillsBrowsePanel - A panel for browsing Agent Skills from GitHub repositories
  *
@@ -11,5 +18,5 @@ import type { PanelComponentProps } from '../types';
  *
  * Note: This panel does NOT show global/installed skills - it's specifically for browsing remote repositories
  */
-export declare const SkillsBrowsePanel: React.FC<PanelComponentProps>;
+export declare const SkillsBrowsePanel: React.FC<SkillsBrowsePanelProps>;
 //# sourceMappingURL=SkillsBrowsePanel.d.ts.map

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

@@ -1 +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"}
+{"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,MAAM,WAAW,sBAAuB,SAAQ,mBAAmB;IACjE;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED;;;;;;;;;;GAUG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA+V9D,CAAC"}

package/dist/panels/SkillsListPanel.d.ts

@@ -6,6 +6,11 @@ export interface SkillsListPanelProps extends PanelComponentProps {
      * - Changes "Project" filter label to "Git Repo"
      */
     browseMode?: boolean;
+    /**
+     * When true, shows the refresh button and enables refresh functionality.
+     * The host must support handling 'skills:refresh' events.
+     */
+    supportsRefresh?: boolean;
 }
 /**
  * SkillsListPanel - A panel for displaying Agent Skills from SKILL.md files

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

@@ -1 +1 @@
-{"version":3,"file":"SkillsListPanel.d.ts","sourceRoot":"","sources":["../../src/panels/SkillsListPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAIpE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAOpD,MAAM,WAAW,oBAAqB,SAAQ,mBAAmB;IAC/D;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA0b1D,CAAC"}
+{"version":3,"file":"SkillsListPanel.d.ts","sourceRoot":"","sources":["../../src/panels/SkillsListPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+C,MAAM,OAAO,CAAC;AAIpE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAOpD,MAAM,WAAW,oBAAqB,SAAQ,mBAAmB;IAC/D;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAic1D,CAAC"}

package/dist/panels/skills/components/SkillCard.d.ts

@@ -4,6 +4,11 @@ interface SkillCardProps {
     skill: Skill;
     onClick?: (skill: Skill) => void;
     isSelected?: boolean;
+    /**
+     * The current filter context ('project' or 'global')
+     * Used to determine which path to copy when skill has multiple installations
+     */
+    filterContext?: 'project' | 'global';
 }
 /**
  * SkillCard - Displays a single skill with its metadata

package/dist/panels/skills/components/SkillCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SkillCard.d.ts","sourceRoot":"","sources":["../../../../src/panels/skills/components/SkillCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,KAAK,EAAe,MAAM,wBAAwB,CAAC;AAEjE,UAAU,cAAc;IACtB,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAoED;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAoV9C,CAAC"}
+{"version":3,"file":"SkillCard.d.ts","sourceRoot":"","sources":["../../../../src/panels/skills/components/SkillCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,KAAK,EAAE,KAAK,EAAe,MAAM,wBAAwB,CAAC;AAEjE,UAAU,cAAc;IACtB,KAAK,EAAE,KAAK,CAAC;IACb,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CACtC;AAoED;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAkZ9C,CAAC"}

package/dist/panels.bundle.js

@@ -3002,16 +3002,35 @@ const abbreviateSourceName = (source2) => {
 const SkillCard = ({
   skill,
   onClick,
-  isSelected = false
+  isSelected = false,
+  filterContext
 }) => {
   var _a, _b, _c, _d, _e2, _f, _g, _h;
   const { theme: theme2 } = useTheme();
   const sourceConfig = getSourceConfig$1(skill.source);
   const [pathCopied, setPathCopied] = React2__default.useState(false);
+  const getPathToCopy = () => {
+    if (!filterContext || !skill.installedLocations || skill.installedLocations.length <= 1) {
+      return skill.path;
+    }
+    if (filterContext === "project") {
+      const projectInstallation = skill.installedLocations.find(
+        (loc) => loc.source === "project-universal" || loc.source === "project-claude" || loc.source === "project-other"
+      );
+      return (projectInstallation == null ? void 0 : projectInstallation.path) || skill.path;
+    } else if (filterContext === "global") {
+      const globalInstallation = skill.installedLocations.find(
+        (loc) => loc.source === "global-universal" || loc.source === "global-claude"
+      );
+      return (globalInstallation == null ? void 0 : globalInstallation.path) || skill.path;
+    }
+    return skill.path;
+  };
   const handleCopyPath = async (e) => {
     e.stopPropagation();
     try {
-      await navigator.clipboard.writeText(skill.path);
+      const pathToCopy = getPathToCopy();
+      await navigator.clipboard.writeText(pathToCopy);
       setPathCopied(true);
       setTimeout(() => setPathCopied(false), 2e3);
     } catch (err) {
@@ -3068,7 +3087,7 @@ const SkillCard = ({
               }
             ),
             /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "4px", alignItems: "center", flexWrap: "wrap" }, children: [
-              /* @__PURE__ */ jsxs(
+              !filterContext && /* @__PURE__ */ jsxs(
                 "div",
                 {
                   style: {
@@ -3092,8 +3111,12 @@ const SkillCard = ({
                 }
               ),
               ((_a = skill.metadata) == null ? void 0 : _a.owner) && ((_b = skill.metadata) == null ? void 0 : _b.repo) && /* @__PURE__ */ jsxs(
-                "div",
+                "a",
                 {
+                  href: skill.metadata.installedFrom || `https://github.com/${skill.metadata.owner}/${skill.metadata.repo}`,
+                  target: "_blank",
+                  rel: "noopener noreferrer",
+                  onClick: (e) => e.stopPropagation(),
                   style: {
                     display: "inline-flex",
                     alignItems: "center",
@@ -3106,13 +3129,25 @@ const SkillCard = ({
                     color: theme2.colors.textSecondary,
                     fontWeight: 500,
                     fontFamily: theme2.fonts.monospace,
-                    width: "fit-content"
+                    width: "fit-content",
+                    textDecoration: "none",
+                    cursor: "pointer",
+                    transition: "all 0.2s ease"
                   },
-                  title: `From: ${skill.metadata.installedFrom}
+                  title: `Click to open: ${skill.metadata.installedFrom || `https://github.com/${skill.metadata.owner}/${skill.metadata.repo}`}
 Installed: ${skill.metadata.installedAt ? new Date(skill.metadata.installedAt).toLocaleString() : "Unknown"}`,
+                  onMouseEnter: (e) => {
+                    e.currentTarget.style.backgroundColor = `${theme2.colors.textSecondary}25`;
+                    e.currentTarget.style.borderColor = `${theme2.colors.textSecondary}50`;
+                  },
+                  onMouseLeave: (e) => {
+                    e.currentTarget.style.backgroundColor = `${theme2.colors.textSecondary}15`;
+                    e.currentTarget.style.borderColor = `${theme2.colors.textSecondary}30`;
+                  },
                   children: [
                     /* @__PURE__ */ jsx(Github, { size: 10 }),
                     /* @__PURE__ */ jsxs("span", { children: [
+                      "From ",
                       skill.metadata.owner,
                       "/",
                       skill.metadata.repo
@@ -3145,8 +3180,21 @@ Installed: ${skill.metadata.installedAt ? new Date(skill.metadata.installedAt).t
                 }
               ),
               skill.installedLocations && skill.installedLocations.length > 1 && (() => {
-                const otherLocations = skill.installedLocations.filter((loc) => loc.path !== skill.path).map((loc) => abbreviateSourceName(loc.source));
-                const uniqueLocations = Array.from(new Set(otherLocations));
+                let otherLocations = [];
+                if (filterContext === "project") {
+                  otherLocations = skill.installedLocations.filter(
+                    (loc) => loc.source === "global-universal" || loc.source === "global-claude"
+                  );
+                } else if (filterContext === "global") {
+                  otherLocations = skill.installedLocations.filter(
+                    (loc) => loc.source === "project-universal" || loc.source === "project-claude" || loc.source === "project-other"
+                  );
+                } else {
+                  otherLocations = skill.installedLocations.filter((loc) => loc.path !== skill.path);
+                }
+                if (otherLocations.length === 0) return null;
+                const locationNames = otherLocations.map((loc) => abbreviateSourceName(loc.source));
+                const uniqueLocations = Array.from(new Set(locationNames));
                 const locationText = uniqueLocations.join(", ");
                 return /* @__PURE__ */ jsxs(
                   "div",
@@ -3165,7 +3213,7 @@ Installed: ${skill.metadata.installedAt ? new Date(skill.metadata.installedAt).t
                       width: "fit-content"
                     },
                     title: `Also installed in:
-${skill.installedLocations.filter((loc) => loc.path !== skill.path).map((loc) => `${abbreviateSourceName(loc.source)}: ${loc.path}`).join("\n")}`,
+${otherLocations.map((loc) => `${abbreviateSourceName(loc.source)}: ${loc.path}`).join("\n")}`,
                     children: [
                       /* @__PURE__ */ jsx(Package, { size: 10 }),
                       /* @__PURE__ */ jsxs("span", { children: [
@@ -3323,7 +3371,7 @@ ${skill.installedLocations.filter((loc) => loc.path !== skill.path).map((loc) =>
               transition: "all 0.2s ease",
               border: `1px solid ${pathCopied ? theme2.colors.success : "transparent"}`
             },
-            title: pathCopied ? "Copied!" : "Click to copy path",
+            title: pathCopied ? "Copied!" : `Click to copy: ${getPathToCopy()}`,
             onMouseEnter: (e) => {
               if (!pathCopied) {
                 e.currentTarget.style.background = theme2.colors.backgroundTertiary || theme2.colors.border;
@@ -3334,7 +3382,7 @@ ${skill.installedLocations.filter((loc) => loc.path !== skill.path).map((loc) =>
                 e.currentTarget.style.background = theme2.colors.backgroundSecondary;
               }
             },
-            children: pathCopied ? "Copied!" : skill.path
+            children: pathCopied ? "Copied!" : getPathToCopy()
           }
         )
       ]
@@ -3344,13 +3392,14 @@ ${skill.installedLocations.filter((loc) => loc.path !== skill.path).map((loc) =>
 const SkillsListPanel = ({
   context,
   events,
-  browseMode = false
+  browseMode = false,
+  supportsRefresh = false
 }) => {
   const { theme: theme2 } = useTheme();
   const panelRef = useRef(null);
   const [selectedSkillId, setSelectedSkillId] = useState(null);
   const [searchQuery, setSearchQuery] = useState("");
-  const [skillFilter, setSkillFilter] = useState("all");
+  const [skillFilter, setSkillFilter] = useState("project");
   const [isRefreshing, setIsRefreshing] = useState(false);
   const { skills, isLoading, error, refreshSkills } = useSkillsData({ context });
   gt("skills-list", events, () => {
@@ -3378,13 +3427,23 @@ const SkillsListPanel = ({
   const filteredSkills = useMemo(() => {
     let filtered = skills;
     if (skillFilter === "project") {
-      filtered = filtered.filter(
-        (skill) => skill.source === "project-universal" || skill.source === "project-claude" || skill.source === "project-other"
-      );
+      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) => skill.source === "global-universal" || skill.source === "global-claude"
-      );
+      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();
@@ -3412,7 +3471,7 @@ const SkillsListPanel = ({
       });
     }
   };
-  const handleRefresh = async () => {
+  const handleRefresh = () => {
     setIsRefreshing(true);
     if (events) {
       events.emit({
@@ -3423,11 +3482,9 @@ const SkillsListPanel = ({
         payload: {}
       });
     }
-    try {
-      await refreshSkills();
-    } finally {
+    setTimeout(() => {
       setIsRefreshing(false);
-    }
+    }, 800);
   };
   return /* @__PURE__ */ jsxs(
     "div",
@@ -3574,7 +3631,7 @@ const SkillsListPanel = ({
                     ]
                   }
                 ),
-                /* @__PURE__ */ jsx(
+                supportsRefresh && /* @__PURE__ */ jsx(
                   "button",
                   {
                     onClick: handleRefresh,
@@ -3584,7 +3641,7 @@ const SkillsListPanel = ({
                       border: `1px solid ${theme2.colors.border}`,
                       borderRadius: theme2.radii[1],
                       padding: "8px",
-                      cursor: isRefreshing ? "wait" : "pointer",
+                      cursor: isRefreshing || isLoading ? "default" : "pointer",
                       display: "flex",
                       alignItems: "center",
                       justifyContent: "center",
@@ -3616,33 +3673,12 @@ const SkillsListPanel = ({
               gap: "8px"
             },
             children: [
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  onClick: () => setSkillFilter("all"),
-                  style: {
-                    padding: "8px 16px",
-                    fontSize: theme2.fontSizes[1],
-                    fontFamily: theme2.fonts.body,
-                    border: `1px solid ${skillFilter === "all" ? theme2.colors.primary : theme2.colors.border}`,
-                    borderRadius: theme2.radii[1],
-                    background: skillFilter === "all" ? `${theme2.colors.primary}15` : theme2.colors.backgroundSecondary,
-                    color: skillFilter === "all" ? theme2.colors.primary : theme2.colors.text,
-                    cursor: "pointer",
-                    display: "flex",
-                    alignItems: "center",
-                    gap: "6px",
-                    fontWeight: skillFilter === "all" ? 600 : 400,
-                    transition: "all 0.2s ease"
-                  },
-                  children: "All Skills"
-                }
-              ),
               /* @__PURE__ */ jsx(
                 "button",
                 {
                   onClick: () => setSkillFilter("project"),
                   style: {
+                    flex: 1,
                     padding: "8px 16px",
                     fontSize: theme2.fontSizes[1],
                     fontFamily: theme2.fonts.body,
@@ -3653,6 +3689,7 @@ const SkillsListPanel = ({
                     cursor: "pointer",
                     display: "flex",
                     alignItems: "center",
+                    justifyContent: "center",
                     gap: "6px",
                     fontWeight: skillFilter === "project" ? 600 : 400,
                     transition: "all 0.2s ease"
@@ -3665,6 +3702,7 @@ const SkillsListPanel = ({
                 {
                   onClick: () => setSkillFilter("global"),
                   style: {
+                    flex: 1,
                     padding: "8px 16px",
                     fontSize: theme2.fontSizes[1],
                     fontFamily: theme2.fonts.body,
@@ -3675,6 +3713,7 @@ const SkillsListPanel = ({
                     cursor: "pointer",
                     display: "flex",
                     alignItems: "center",
+                    justifyContent: "center",
                     gap: "6px",
                     fontWeight: skillFilter === "global" ? 600 : 400,
                     transition: "all 0.2s ease"
@@ -3762,7 +3801,8 @@ const SkillsListPanel = ({
                   {
                     skill,
                     onClick: handleSkillClick,
-                    isSelected: selectedSkillId === skill.id
+                    isSelected: selectedSkillId === skill.id,
+                    filterContext: skillFilter
                   },
                   skill.id
                 ))
@@ -3855,7 +3895,8 @@ const useSkillsBrowseData = ({
 };
 const SkillsBrowsePanel = ({
   context,
-  events
+  events,
+  supportsRefresh = false
 }) => {
   const { theme: theme2 } = useTheme();
   const panelRef = useRef(null);
@@ -3909,7 +3950,7 @@ const SkillsBrowsePanel = ({
       });
     }
   };
-  const handleRefresh = async () => {
+  const handleRefresh = () => {
     setIsRefreshing(true);
     if (events) {
       events.emit({
@@ -3920,11 +3961,9 @@ const SkillsBrowsePanel = ({
         payload: {}
       });
     }
-    try {
-      await refreshSkills();
-    } finally {
+    setTimeout(() => {
       setIsRefreshing(false);
-    }
+    }, 800);
   };
   return /* @__PURE__ */ jsxs(
     "div",
@@ -4071,7 +4110,7 @@ const SkillsBrowsePanel = ({
                     ]
                   }
                 ),
-                /* @__PURE__ */ jsx(
+                supportsRefresh && /* @__PURE__ */ jsx(
                   "button",
                   {
                     onClick: handleRefresh,
@@ -4081,7 +4120,7 @@ const SkillsBrowsePanel = ({
                       border: `1px solid ${theme2.colors.border}`,
                       borderRadius: theme2.radii[1],
                       padding: "8px",
-                      cursor: isRefreshing ? "wait" : "pointer",
+                      cursor: isRefreshing || isLoading ? "default" : "pointer",
                       display: "flex",
                       alignItems: "center",
                       justifyContent: "center",