@ai-matrx/agents 0.8.0 → 0.9.1

package/dist/catalog/react/index.cjs

@@ -60,20 +60,25 @@ __export(react_exports, {
 module.exports = __toCommonJS(react_exports);
 
 // catalog/react/context.tsx
+var import_react2 = require("react");
+
+// catalog/shared/context.tsx
 var import_react = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
 var AgentCatalogContext = (0, import_react.createContext)(null);
-function AgentCatalogProvider({
+function AgentCatalogProviderCore({
   catalog,
+  platform,
   children,
   ...ports
 }) {
   const value = (0, import_react.useMemo)(
-    () => ({ catalog, ...ports }),
+    () => ({ catalog, platform, ...ports }),
     // The ports are plain values a host declares once; re-binding on identity
     // change is correct and cheap.
     [
       catalog,
+      platform,
       ports.navigate,
       ports.LinkComponent,
       ports.renderModelRef,
@@ -87,7 +92,7 @@ function useBinding() {
   const binding = (0, import_react.useContext)(AgentCatalogContext);
   if (!binding) {
     throw new Error(
-      "@ai-matrx/agents/catalog/react: no <AgentCatalogProvider> is mounted above this component. Create the catalog once with createAgentCatalog({ client, identity }) and mount <AgentCatalogProvider catalog={catalog}> at the top of your tree."
+      "@ai-matrx/agents/catalog: no <AgentCatalogProvider> is mounted above this component. Create the catalog once with createAgentCatalog({ client, identity }) and mount <AgentCatalogProvider catalog={catalog}> at the top of your tree."
     );
   }
   return binding;
@@ -97,29 +102,26 @@ function useAgentCatalog() {
 }
 function useAgentCatalogUiPorts() {
   const binding = useBinding();
+  const hostNavigate = binding.navigate;
+  const platformNavigate = binding.platform.navigate;
   const navigate = (0, import_react.useCallback)(
     (href) => {
-      if (binding.navigate) {
-        binding.navigate(href);
+      if (hostNavigate) {
+        hostNavigate(href);
         return;
       }
-      if (typeof window !== "undefined") window.location.assign(href);
+      platformNavigate(href);
     },
-    [binding.navigate]
+    [hostNavigate, platformNavigate]
   );
   return {
     navigate,
-    LinkComponent: binding.LinkComponent ?? DefaultLink,
-    renderModelRef: binding.renderModelRef ?? defaultRenderModelRef,
+    LinkComponent: binding.LinkComponent ?? binding.platform.LinkComponent,
+    renderModelRef: binding.renderModelRef ?? binding.platform.renderModelRef,
     openPeek: binding.openPeek,
     popoverContainer: binding.popoverContainer
   };
 }
-var DefaultLink = ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", { ...props, children });
-var defaultRenderModelRef = ({
-  modelId,
-  className
-}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className, children: modelId });
 function useAgentCatalogState(select) {
   const catalog = useAgentCatalog();
   const getSnapshot = (0, import_react.useCallback)(
@@ -133,8 +135,40 @@ function useAgentCatalogRows() {
 }
 var selectRows = (state) => state.rows;
 
-// catalog/react/useAgentConsumer.ts
-var import_react2 = require("react");
+// catalog/react/context.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var DefaultLink = ({ children, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("a", { ...props, children });
+var defaultRenderModelRef = ({
+  modelId,
+  className
+}) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className, children: modelId });
+var webNavigate = (href) => {
+  if (typeof window !== "undefined") window.location.assign(href);
+};
+var WEB_PLATFORM_DEFAULTS = {
+  navigate: webNavigate,
+  LinkComponent: DefaultLink,
+  renderModelRef: defaultRenderModelRef
+};
+function AgentCatalogProvider({
+  catalog,
+  children,
+  ...ports
+}) {
+  const platform = (0, import_react2.useMemo)(() => WEB_PLATFORM_DEFAULTS, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    AgentCatalogProviderCore,
+    {
+      catalog,
+      platform,
+      ...ports,
+      children
+    }
+  );
+}
+
+// catalog/shared/useAgentConsumer.ts
+var import_react3 = require("react");
 
 // catalog/types.ts
 function isMandateAgentId(id) {
@@ -165,19 +199,19 @@ var DEFAULT_AGENT_CONSUMER_STATE = {
   deepSearch: false
 };
 
-// catalog/react/useAgentConsumer.ts
+// catalog/shared/useAgentConsumer.ts
 var DEBOUNCE_MS = 250;
 var MIN_QUERY_LENGTH = 2;
 function useAgentConsumer(consumerId, options) {
   const catalog = useAgentCatalog();
-  const selectConsumer = (0, import_react2.useCallback)(
+  const selectConsumer = (0, import_react3.useCallback)(
     (state) => state.consumers[consumerId] ?? DEFAULT_AGENT_CONSUMER_STATE,
     [consumerId]
   );
   const consumer = useAgentCatalogState(selectConsumer);
-  const optionsRef = (0, import_react2.useRef)(options);
+  const optionsRef = (0, import_react3.useRef)(options);
   optionsRef.current = options;
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     const opts = optionsRef.current;
     catalog.registerConsumer(
       consumerId,
@@ -189,35 +223,35 @@ function useAgentConsumer(consumerId, options) {
       }
     };
   }, [consumerId, catalog]);
-  const setSearchTerm = (0, import_react2.useCallback)(
+  const setSearchTerm = (0, import_react3.useCallback)(
     (value) => catalog.setConsumerFilter(consumerId, { searchTerm: value }),
     [consumerId, catalog]
   );
-  const setDeepSearch = (0, import_react2.useCallback)(
+  const setDeepSearch = (0, import_react3.useCallback)(
     (value) => catalog.setConsumerFilter(consumerId, { deepSearch: value }),
     [consumerId, catalog]
   );
-  const setSortBy = (0, import_react2.useCallback)(
+  const setSortBy = (0, import_react3.useCallback)(
     (value) => catalog.setConsumerFilter(consumerId, { sortBy: value }),
     [consumerId, catalog]
   );
-  const setTab = (0, import_react2.useCallback)(
+  const setTab = (0, import_react3.useCallback)(
     (value) => catalog.setConsumerFilter(consumerId, { tab: value }),
     [consumerId, catalog]
   );
-  const setFavFilter = (0, import_react2.useCallback)(
+  const setFavFilter = (0, import_react3.useCallback)(
     (value) => catalog.setConsumerFilter(consumerId, { favFilter: value }),
     [consumerId, catalog]
   );
-  const setArchFilter = (0, import_react2.useCallback)(
+  const setArchFilter = (0, import_react3.useCallback)(
     (value) => catalog.setConsumerFilter(consumerId, { archFilter: value }),
     [consumerId, catalog]
   );
-  const setAccessFilter = (0, import_react2.useCallback)(
+  const setAccessFilter = (0, import_react3.useCallback)(
     (value) => catalog.setConsumerFilter(consumerId, { accessFilter: value }),
     [consumerId, catalog]
   );
-  const toggleCategory = (0, import_react2.useCallback)(
+  const toggleCategory = (0, import_react3.useCallback)(
     (cat) => {
       const current = catalog.getConsumer(consumerId).includedCats;
       const next = current.includes(cat) ? current.filter((c) => c !== cat) : [...current, cat];
@@ -225,7 +259,7 @@ function useAgentConsumer(consumerId, options) {
     },
     [consumerId, catalog]
   );
-  const toggleTag = (0, import_react2.useCallback)(
+  const toggleTag = (0, import_react3.useCallback)(
     (tag) => {
       const current = catalog.getConsumer(consumerId).includedTags;
       const next = current.includes(tag) ? current.filter((t) => t !== tag) : [...current, tag];
@@ -233,21 +267,21 @@ function useAgentConsumer(consumerId, options) {
     },
     [consumerId, catalog]
   );
-  const setIncludedCats = (0, import_react2.useCallback)(
+  const setIncludedCats = (0, import_react3.useCallback)(
     (next) => catalog.setConsumerFilter(consumerId, { includedCats: next }),
     [consumerId, catalog]
   );
-  const setIncludedTags = (0, import_react2.useCallback)(
+  const setIncludedTags = (0, import_react3.useCallback)(
     (next) => catalog.setConsumerFilter(consumerId, { includedTags: next }),
     [consumerId, catalog]
   );
-  const toggleFavoritesFirst = (0, import_react2.useCallback)(
+  const toggleFavoritesFirst = (0, import_react3.useCallback)(
     () => catalog.setConsumerFilter(consumerId, {
       favoritesFirst: !catalog.getConsumer(consumerId).favoritesFirst
     }),
     [consumerId, catalog]
   );
-  const loadMoreList = (0, import_react2.useCallback)(
+  const loadMoreList = (0, import_react3.useCallback)(
     () => catalog.setConsumerPage(
       consumerId,
       "list",
@@ -255,7 +289,7 @@ function useAgentConsumer(consumerId, options) {
     ),
     [consumerId, catalog]
   );
-  const loadMoreShared = (0, import_react2.useCallback)(
+  const loadMoreShared = (0, import_react3.useCallback)(
     () => catalog.setConsumerPage(
       consumerId,
       "shared",
@@ -263,16 +297,16 @@ function useAgentConsumer(consumerId, options) {
     ),
     [consumerId, catalog]
   );
-  const resetFilters = (0, import_react2.useCallback)(
+  const resetFilters = (0, import_react3.useCallback)(
     () => catalog.resetConsumerFilters(consumerId),
     [consumerId, catalog]
   );
-  const [isSearching, setIsSearching] = (0, import_react2.useState)(false);
-  const [matchedIds, setMatchedIds] = (0, import_react2.useState)(null);
-  const requestSeq = (0, import_react2.useRef)(0);
+  const [isSearching, setIsSearching] = (0, import_react3.useState)(false);
+  const [matchedIds, setMatchedIds] = (0, import_react3.useState)(null);
+  const requestSeq = (0, import_react3.useRef)(0);
   const query = consumer.searchTerm;
   const deep = consumer.deepSearch;
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     const q = query.trim();
     if (q.length < MIN_QUERY_LENGTH) {
       setIsSearching(false);
@@ -298,7 +332,7 @@ function useAgentConsumer(consumerId, options) {
     }, DEBOUNCE_MS);
     return () => clearTimeout(timer);
   }, [query, deep, catalog]);
-  (0, import_react2.useEffect)(() => {
+  (0, import_react3.useEffect)(() => {
     catalog.setConsumerServerSearch(consumerId, {
       matchedIds: matchedIds ?? [],
       isSearching
@@ -339,8 +373,8 @@ function useAgentConsumer(consumerId, options) {
   };
 }
 
-// catalog/react/useAgentListCore.ts
-var import_react3 = require("react");
+// catalog/shared/useAgentListCore.ts
+var import_react4 = require("react");
 
 // catalog/labels.ts
 function agentListEmptyLabel(tab, labels) {
@@ -434,7 +468,19 @@ function memoize2(fn) {
     return last;
   };
 }
+function compareAgentIds(a, b) {
+  const idA = a.id ?? "";
+  const idB = b.id ?? "";
+  if (idA < idB) return -1;
+  if (idA > idB) return 1;
+  return 0;
+}
 function applyAgentSortComparator(a, b, sortBy) {
+  const primary = compareAgentSortKey(a, b, sortBy);
+  if (!Number.isFinite(primary) || primary === 0) return compareAgentIds(a, b);
+  return primary;
+}
+function compareAgentSortKey(a, b, sortBy) {
   switch (sortBy) {
     case "name-asc":
       return (a.name ?? "").localeCompare(b.name ?? "");
@@ -610,25 +656,49 @@ var makeSelectFilteredAgents = (includeSystemInAll = false) => memoize2(
     return filterUserTypeAgents(userAgents, consumer);
   }
 );
+function agentMatchesArchiveFilter(agent, archFilter) {
+  if (archFilter === "active") return !agent.isArchived;
+  if (archFilter === "archived") return Boolean(agent.isArchived);
+  return true;
+}
+function countUserRows(agents, archFilter, predicate) {
+  let n = 0;
+  for (const a of agents) {
+    if (a.agentType !== "user") continue;
+    if (!agentMatchesArchiveFilter(a, archFilter)) continue;
+    if (predicate(a)) n += 1;
+  }
+  return n;
+}
+var isOwned = (a) => a.isOwner === true;
+var isShared = (a) => a.isOwner === false && a.accessLevel != null;
+var isAny = () => true;
+var isFavorite = (a) => Boolean(a.isFavorite);
+var selectAgentTabCounts = memoize2(
+  (agents, archFilter) => ({
+    mine: countUserRows(agents, archFilter, isOwned),
+    shared: countUserRows(agents, archFilter, isShared),
+    all: countUserRows(agents, archFilter, isAny),
+    system: selectBuiltinTypeAgents(agents).length
+  })
+);
 var selectTotalUserAgentsCount = memoize1(
-  (agents) => selectUserTypeAgents(agents).length
+  (agents) => countUserRows(agents, "active", isAny)
 );
 var selectTotalOwnedAgentsCount = memoize1(
-  (agents) => selectUserTypeAgents(agents).filter((a) => a.isOwner === true).length
+  (agents) => countUserRows(agents, "active", isOwned)
 );
 var selectTotalSharedAgentsCount = memoize1(
-  (agents) => selectUserTypeAgents(agents).filter(
-    (a) => a.isOwner === false && a.accessLevel != null
-  ).length
+  (agents) => countUserRows(agents, "active", isShared)
 );
 var selectTotalBuiltinAgentsCount = memoize1(
   (agents) => selectBuiltinTypeAgents(agents).length
 );
 var selectTotalFavoriteAgentsCount = memoize1(
-  (agents) => selectUserTypeAgents(agents).filter((a) => a.isFavorite).length
+  (agents) => countUserRows(agents, "active", isFavorite)
 );
 
-// catalog/react/useAgentListCore.ts
+// catalog/shared/useAgentListCore.ts
 var HOVER_GRACE_MS = 900;
 function coerceVisibleTab(current, allowed, initialTab) {
   if (allowed.length === 0) return null;
@@ -649,20 +719,21 @@ function useAgentListCore({
 }) {
   const catalog = useAgentCatalog();
   const { navigate } = useAgentCatalogUiPorts();
-  const hasFetchedRef = (0, import_react3.useRef)(false);
-  const [hoveredAgent, setHoveredAgent] = (0, import_react3.useState)(null);
-  const hoverLeaveTimerRef = (0, import_react3.useRef)(null);
-  const defaultTabAppliedRef = (0, import_react3.useRef)(false);
+  const hasFetchedRef = (0, import_react4.useRef)(false);
+  const [hoveredAgent, setHoveredAgent] = (0, import_react4.useState)(null);
+  const hoverLeaveTimerRef = (0, import_react4.useRef)(null);
+  const defaultTabAppliedRef = (0, import_react4.useRef)(false);
   const consumer = useAgentConsumer(consumerId, { unregisterOnUnmount: true });
   const rows = useAgentCatalogRows();
   const userId = catalog.getUserIdOrNull();
-  const ownedCount = selectTotalOwnedAgentsCount(rows);
-  const selectFiltered = (0, import_react3.useMemo)(
+  const tabCountsForFilter = selectAgentTabCounts(rows, consumer.state.archFilter);
+  const ownedCount = tabCountsForFilter.mine;
+  const selectFiltered = (0, import_react4.useMemo)(
     () => makeSelectFilteredAgents(includeSystemInAll),
     [includeSystemInAll]
   );
   const filteredAgents = selectFiltered(rows, consumer.state);
-  const excludedAgentIds = (0, import_react3.useMemo)(
+  const excludedAgentIds = (0, import_react4.useMemo)(
     () => new Set(excludeAgentIds),
     [excludeAgentIds]
   );
@@ -673,31 +744,26 @@ function useAgentListCore({
   const onSystemTab = consumer.tab === "system";
   const allCategories = onSystemTab ? selectAllSystemAgentCategories(rows) : selectAllAgentCategories(rows);
   const allTags = onSystemTab ? selectAllSystemAgentTags(rows) : selectAllAgentTags(rows);
-  const tabCounts = {
-    mine: ownedCount,
-    shared: selectTotalSharedAgentsCount(rows),
-    all: selectTotalUserAgentsCount(rows),
-    system: selectTotalBuiltinAgentsCount(rows)
-  };
+  const tabCounts = tabCountsForFilter;
   const isLoading = status === "loading";
   const agentsLoaded = status === "succeeded" || status === "failed";
-  const ensureLoaded = (0, import_react3.useCallback)(() => {
+  const ensureLoaded = (0, import_react4.useCallback)(() => {
     if (!hasFetchedRef.current) {
       hasFetchedRef.current = true;
       void catalog.ensureLoaded().catch(() => {
       });
     }
   }, [catalog]);
-  const selectDefaultRow = (0, import_react3.useCallback)(
+  const selectDefaultRow = (0, import_react4.useCallback)(
     (state) => defaultMandateKey ? state.defaultRows[defaultMandateKey] : void 0,
     [defaultMandateKey]
   );
   const defaultRow = useAgentCatalogState(selectDefaultRow);
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (!defaultMandateKey) return;
     catalog.ensureDefaultRow(defaultMandateKey);
   }, [catalog, defaultMandateKey]);
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (defaultTabAppliedRef.current) return;
     if (initialTab) {
       defaultTabAppliedRef.current = true;
@@ -730,7 +796,7 @@ function useAgentListCore({
     consumer.setTab
   ]);
   const allowedTabsKey = visibleTabs ? visibleTabs.join(",") : "";
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     if (!allowedTabsKey) return;
     const next = coerceVisibleTab(
       consumer.tab,
@@ -739,10 +805,10 @@ function useAgentListCore({
     );
     if (next) consumer.setTab(next);
   }, [allowedTabsKey, initialTab, consumer.tab, consumer.setTab]);
-  (0, import_react3.useEffect)(() => {
+  (0, import_react4.useEffect)(() => {
     ensureLoaded();
   }, [ensureLoaded]);
-  const handleSelectAgent = (0, import_react3.useCallback)(
+  const handleSelectAgent = (0, import_react4.useCallback)(
     (agent) => {
       if (onSelect) {
         onSelect(agent.id);
@@ -759,7 +825,7 @@ function useAgentListCore({
     [onSelect, navigateTo, navigate, catalog, consumerId]
   );
   const activeFilterCount = (consumer.sortBy !== "updated-desc" ? 1 : 0) + (consumer.includedCats.length > 0 ? 1 : 0) + (consumer.includedTags.length > 0 ? 1 : 0) + (consumer.favFilter !== "all" ? 1 : 0);
-  const handleAgentHover = (0, import_react3.useCallback)(
+  const handleAgentHover = (0, import_react4.useCallback)(
     (agent, panelOpen) => {
       if (panelOpen) return;
       if (hoverLeaveTimerRef.current) {
@@ -770,7 +836,7 @@ function useAgentListCore({
     },
     []
   );
-  const handleAgentHoverEnd = (0, import_react3.useCallback)(
+  const handleAgentHoverEnd = (0, import_react4.useCallback)(
     (agent, onClear) => {
       if (hoveredAgent?.id === agent.id) {
         hoverLeaveTimerRef.current = setTimeout(() => {
@@ -781,19 +847,19 @@ function useAgentListCore({
     },
     [hoveredAgent]
   );
-  const handleDetailPanelMouseEnter = (0, import_react3.useCallback)(() => {
+  const handleDetailPanelMouseEnter = (0, import_react4.useCallback)(() => {
     if (hoverLeaveTimerRef.current) {
       clearTimeout(hoverLeaveTimerRef.current);
       hoverLeaveTimerRef.current = null;
     }
   }, []);
-  const handleDetailPanelMouseLeave = (0, import_react3.useCallback)((onClear) => {
+  const handleDetailPanelMouseLeave = (0, import_react4.useCallback)((onClear) => {
     hoverLeaveTimerRef.current = setTimeout(() => {
       setHoveredAgent(null);
       onClear();
     }, HOVER_GRACE_MS);
   }, []);
-  (0, import_react3.useEffect)(
+  (0, import_react4.useEffect)(
     () => () => {
       if (hoverLeaveTimerRef.current) clearTimeout(hoverLeaveTimerRef.current);
     },
@@ -824,15 +890,111 @@ var selectStatus = (state) => state.status;
 
 // catalog/react/AgentListDropdown.tsx
 var import_design_system6 = require("@ai-matrx/design-system");
-var import_react6 = require("react");
+var import_react7 = require("react");
 
 // catalog/react/primitives.tsx
 var import_design_system = require("@ai-matrx/design-system");
 
+// catalog/shared/icon-paths.ts
+var SHAPES = {
+  star: {
+    paths: [
+      "M11.5 3.2a.6.6 0 0 1 1 0l2.3 4.7 5.2.8a.6.6 0 0 1 .3 1l-3.8 3.7.9 5.2a.6.6 0 0 1-.9.6L12 16.8l-4.6 2.4a.6.6 0 0 1-.9-.6l.9-5.2-3.8-3.7a.6.6 0 0 1 .3-1l5.2-.8Z"
+    ],
+    fillable: true
+  },
+  chevronRight: { paths: ["m9 18 6-6-6-6"] },
+  chevronDown: { paths: ["m6 9 6 6 6-6"] },
+  search: {
+    paths: ["m21 21-4.3-4.3"],
+    circles: [{ cx: 11, cy: 11, r: 8 }]
+  },
+  x: { paths: ["M18 6 6 18", "m6 6 12 12"] },
+  check: { paths: ["M20 6 9 17l-5-5"] },
+  arrowUpDown: {
+    paths: ["m21 16-4 4-4-4", "M17 20V4", "m3 8 4-4 4 4", "M7 4v16"]
+  },
+  folder: {
+    paths: [
+      "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"
+    ]
+  },
+  tag: {
+    paths: [
+      "M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z"
+    ],
+    circles: [{ cx: 7.5, cy: 7.5, r: 0.5, filled: true }]
+  },
+  rotateCcw: {
+    paths: [
+      "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",
+      "M3 3v5h5"
+    ]
+  },
+  loader: { paths: ["M21 12a9 9 0 1 1-6.219-8.56"] },
+  alertTriangle: {
+    paths: [
+      "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3",
+      "M12 9v4",
+      "M12 17h.01"
+    ]
+  },
+  /**
+   * The Orchestra marker (Lucide `music-4`): the glyph the Workflow Studio's
+   * picker used for a conductor, kept identical so the same agent wears the
+   * same mark in every client.
+   */
+  music4: {
+    paths: ["M9 18V5l12-2v13", "m9 9 12-2"],
+    circles: [
+      { cx: 6, cy: 18, r: 3 },
+      { cx: 18, cy: 16, r: 3 }
+    ]
+  },
+  clock: {
+    paths: ["M12 6v6l4 2"],
+    circles: [{ cx: 12, cy: 12, r: 10 }]
+  },
+  globe: {
+    paths: ["M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20", "M2 12h20"],
+    circles: [{ cx: 12, cy: 12, r: 10 }]
+  },
+  users: {
+    paths: [
+      "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2",
+      "M22 21v-2a4 4 0 0 0-3-3.87",
+      "M16 3.13a4 4 0 0 1 0 7.75"
+    ],
+    circles: [{ cx: 9, cy: 7, r: 4 }]
+  },
+  externalLink: {
+    paths: [
+      "M15 3h6v6",
+      "M10 14 21 3",
+      "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"
+    ]
+  },
+  messageCircle: { paths: ["M7.9 20A9 9 0 1 0 4 16.1L2 22Z"] },
+  rocket: {
+    paths: [
+      "M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91 0",
+      "m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2",
+      "M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0",
+      "M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5"
+    ]
+  },
+  circleCheck: {
+    paths: ["m9 12 2 2 4-4"],
+    circles: [{ cx: 12, cy: 12, r: 10 }]
+  }
+};
+var ICON_PATHS = SHAPES;
+var ICON_NAMES = Object.keys(ICON_PATHS);
+
 // catalog/react/icons.tsx
-var import_jsx_runtime2 = require("react/jsx-runtime");
+var import_jsx_runtime3 = require("react/jsx-runtime");
 function Svg({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -848,133 +1010,79 @@ function Svg({ children, ...props }) {
     }
   );
 }
+function Shape({ name, filled }) {
+  const shape = ICON_PATHS[name];
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+    shape.paths.map((d, index) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "path",
+      {
+        d,
+        ...filled && shape.fillable ? { fill: "currentColor" } : {}
+      },
+      `p${index}`
+    )),
+    (shape.circles ?? []).map((circle, index) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "circle",
+      {
+        cx: circle.cx,
+        cy: circle.cy,
+        r: circle.r,
+        ...circle.filled ? { fill: "currentColor" } : {}
+      },
+      `c${index}`
+    ))
+  ] });
+}
+function makeIcon(name) {
+  return function Icon(props) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Shape, { name, filled: false }) });
+  };
+}
 function StarIcon({
   filled = false,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, fill: filled ? "currentColor" : "none", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M11.5 3.2a.6.6 0 0 1 1 0l2.3 4.7 5.2.8a.6.6 0 0 1 .3 1l-3.8 3.7.9 5.2a.6.6 0 0 1-.9.6L12 16.8l-4.6 2.4a.6.6 0 0 1-.9-.6l.9-5.2-3.8-3.7a.6.6 0 0 1 .3-1l5.2-.8Z" }) });
-}
-function ChevronRightIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m9 18 6-6-6-6" }) });
-}
-function ChevronDownIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m6 9 6 6 6-6" }) });
-}
-function SearchIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "11", cy: "11", r: "8" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m21 21-4.3-4.3" })
-  ] });
-}
-function XIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M18 6 6 18" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m6 6 12 12" })
-  ] });
-}
-function CheckIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M20 6 9 17l-5-5" }) });
-}
-function ArrowUpDownIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m21 16-4 4-4-4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M17 20V4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m3 8 4-4 4 4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M7 4v16" })
-  ] });
-}
-function FolderIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }) });
-}
-function TagIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "7.5", cy: "7.5", r: ".5", fill: "currentColor" })
-  ] });
-}
-function RotateCcwIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M3 3v5h5" })
-  ] });
-}
-function LoaderIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Svg, { ...props, fill: filled ? "currentColor" : "none", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Shape, { name: "star", filled }) });
 }
+var ChevronRightIcon = makeIcon("chevronRight");
+var ChevronDownIcon = makeIcon("chevronDown");
+var SearchIcon = makeIcon("search");
+var XIcon = makeIcon("x");
+var CheckIcon = makeIcon("check");
+var ArrowUpDownIcon = makeIcon("arrowUpDown");
+var FolderIcon = makeIcon("folder");
+var TagIcon = makeIcon("tag");
+var RotateCcwIcon = makeIcon("rotateCcw");
+var LoaderIcon = makeIcon("loader");
+var UsersIcon = makeIcon("users");
+var ClockIcon = makeIcon("clock");
+var GlobeIcon = makeIcon("globe");
+var ExternalLinkIcon = makeIcon("externalLink");
+var MessageCircleIcon = makeIcon("messageCircle");
+var RocketIcon = makeIcon("rocket");
+var CircleCheckIcon = makeIcon("circleCheck");
+var AlertTriangleIcon = makeIcon("alertTriangle");
+var Music4Icon = makeIcon("music4");
 function MousePointerClickIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M14 4.1 12 6" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m5.1 8-2.9-.8" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m6 12-1.9 2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M7.2 2.2 8 5.1" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M9.037 9.69a.498.498 0 0 1 .653-.653l11 4.5a.5.5 0 0 1-.074.949l-4.349 1.041a1 1 0 0 0-.74.739l-1.04 4.35a.5.5 0 0 1-.95.074z" })
-  ] });
-}
-function UsersIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "9", cy: "7", r: "4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M22 21v-2a4 4 0 0 0-3-3.87" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })
-  ] });
-}
-function ClockIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 6v6l4 2" })
-  ] });
-}
-function GlobeIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M2 12h20" })
-  ] });
-}
-function ExternalLinkIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M15 3h6v6" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M10 14 21 3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" })
-  ] });
-}
-function MessageCircleIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(Svg, { ...props, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M7.9 20A9 9 0 1 0 4 16.1L2 22Z" }) });
-}
-function RocketIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91 0" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5" })
-  ] });
-}
-function AlertTriangleIcon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 9v4" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M12 17h.01" })
-  ] });
-}
-function Music4Icon(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Svg, { ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M9 18V5l12-2v13" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "m9 9 12-2" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "6", cy: "18", r: "3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("circle", { cx: "18", cy: "16", r: "3" })
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Svg, { ...props, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M14 4.1 12 6" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m5.1 8-2.9-.8" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "m6 12-1.9 2" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M7.2 2.2 8 5.1" }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("path", { d: "M9.037 9.69a.498.498 0 0 1 .653-.653l11 4.5a.5.5 0 0 1-.074.949l-4.349 1.041a1 1 0 0 0-.74.739l-1.04 4.35a.5.5 0 0 1-.95.074z" })
   ] });
 }
 
 // catalog/react/primitives.tsx
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var SearchInput = ({
   ref,
   value,
   onChange,
   placeholder
-}) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center gap-1.5 h-7 px-2 rounded-md bg-muted/40 border border-border/50", children: [
-  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(SearchIcon, { className: "w-3 h-3 text-muted-foreground shrink-0" }),
-  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+}) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center gap-1.5 h-7 px-2 rounded-md bg-muted/40 border border-border/50", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SearchIcon, { className: "w-3 h-3 text-muted-foreground shrink-0" }),
+  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     "input",
     {
       ref,
@@ -986,14 +1094,14 @@ var SearchInput = ({
       style: { fontSize: "16px" }
     }
   ),
-  value && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  value && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     "button",
     {
       type: "button",
       onClick: () => onChange(""),
       className: "text-muted-foreground hover:text-foreground",
       "aria-label": "Clear search",
-      children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(XIcon, { className: "w-3 h-3" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(XIcon, { className: "w-3 h-3" })
     }
   )
 ] });
@@ -1004,7 +1112,7 @@ function FilterChip({
   focused,
   onClick
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
     "button",
     {
       type: "button",
@@ -1014,8 +1122,8 @@ function FilterChip({
         focused ? "bg-primary/15 text-primary border border-primary/30 ring-1 ring-primary/20" : active ? "bg-primary/10 text-primary border border-primary/20" : "text-muted-foreground hover:text-foreground hover:bg-muted/50 border border-transparent"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Icon, { className: "w-3 h-3" }),
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: label })
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { className: "w-3 h-3" }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: label })
       ]
     }
   );
@@ -1025,7 +1133,7 @@ function OptionRow({
   selected,
   onClick
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
     "button",
     {
       type: "button",
@@ -1036,8 +1144,8 @@ function OptionRow({
         selected && "text-primary font-medium"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "flex-1 text-left", children: label }),
-        selected && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CheckIcon, { className: "w-3.5 h-3.5 text-primary shrink-0" })
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "flex-1 text-left", children: label }),
+        selected && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CheckIcon, { className: "w-3.5 h-3.5 text-primary shrink-0" })
       ]
     }
   );
@@ -1047,24 +1155,24 @@ function CheckRow({
   checked,
   onClick
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
     "button",
     {
       type: "button",
       onClick,
       className: "flex items-center gap-2 w-full px-3 py-1.5 text-xs hover:bg-muted/50 active:bg-muted/70 transition-colors",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
           "div",
           {
             className: (0, import_design_system.cn)(
               "w-3.5 h-3.5 rounded-sm border flex items-center justify-center shrink-0 transition-colors",
               checked ? "bg-primary border-primary" : "border-muted-foreground/30"
             ),
-            children: checked && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(CheckIcon, { className: "w-2.5 h-2.5 text-primary-foreground" })
+            children: checked && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(CheckIcon, { className: "w-2.5 h-2.5 text-primary-foreground" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "flex-1 text-left truncate", children: label })
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "flex-1 text-left truncate", children: label })
       ]
     }
   );
@@ -1073,23 +1181,23 @@ function SidePanelHeader({
   title,
   onClose
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-border shrink-0", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "text-xs font-semibold text-foreground", children: title }),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex items-center justify-between px-3 py-2 border-b border-border shrink-0", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "text-xs font-semibold text-foreground", children: title }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       "button",
       {
         type: "button",
         onClick: onClose,
         className: "w-5 h-5 rounded flex items-center justify-center text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors",
         "aria-label": "Close",
-        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(XIcon, { className: "w-3.5 h-3.5" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(XIcon, { className: "w-3.5 h-3.5" })
       }
     )
   ] });
 }
 
 // catalog/react/AgentCategoriesPanel.tsx
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 function AgentCategoriesPanel({
   consumer,
   allCategories,
@@ -1100,9 +1208,9 @@ function AgentCategoriesPanel({
   const filtered = allCategories.filter(
     (c) => !search || c.toLowerCase().includes(search.toLowerCase())
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-col h-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(SidePanelHeader, { title: "Categories", onClose }),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "px-2 pt-2 pb-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "flex flex-col h-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SidePanelHeader, { title: "Categories", onClose }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "px-2 pt-2 pb-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       SearchInput,
       {
         value: search,
@@ -1110,7 +1218,7 @@ function AgentCategoriesPanel({
         placeholder: "Filter categories..."
       }
     ) }),
-    consumer.includedCats.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+    consumer.includedCats.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
       "button",
       {
         type: "button",
@@ -1123,7 +1231,7 @@ function AgentCategoriesPanel({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "overflow-y-auto flex-1", children: filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "text-xs text-muted-foreground text-center py-6", children: "No categories" }) : filtered.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "overflow-y-auto flex-1", children: filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("p", { className: "text-xs text-muted-foreground text-center py-6", children: "No categories" }) : filtered.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
       CheckRow,
       {
         label: cat,
@@ -1140,30 +1248,30 @@ var import_design_system3 = require("@ai-matrx/design-system");
 
 // catalog/react/FavoriteAgentButton.tsx
 var import_design_system2 = require("@ai-matrx/design-system");
-var import_react4 = require("react");
-var import_jsx_runtime5 = require("react/jsx-runtime");
+var import_react5 = require("react");
+var import_jsx_runtime6 = require("react/jsx-runtime");
 function FavoriteAgentButton({
   id,
   variant = "card",
   disabled
 }) {
   const catalog = useAgentCatalog();
-  const select = (0, import_react4.useCallback)(
+  const select = (0, import_react5.useCallback)(
     (state) => state.byId[id],
     [id]
   );
   const record = useAgentCatalogState(select);
-  const isFavorite = record?.isFavorite ?? false;
+  const isFavorite2 = record?.isFavorite ?? false;
   const isOwner = record?.isOwner ?? true;
   const handleClick = (e) => {
     e.stopPropagation();
     if (disabled || !isOwner) return;
-    void catalog.setFavorite(id, !isFavorite).catch(() => {
+    void catalog.setFavorite(id, !isFavorite2).catch(() => {
     });
   };
-  const title = isOwner ? isFavorite ? "Remove from favorites" : "Add to favorites" : "Shared \u2014 cannot favorite";
+  const title = isOwner ? isFavorite2 ? "Remove from favorites" : "Add to favorites" : "Shared \u2014 cannot favorite";
   if (variant === "list") {
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
       "button",
       {
         type: "button",
@@ -1175,21 +1283,21 @@ function FavoriteAgentButton({
         onClick: handleClick,
         disabled: disabled || !isOwner,
         title,
-        "aria-label": isFavorite ? "Remove from favorites" : "Add to favorites",
-        children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+        "aria-label": isFavorite2 ? "Remove from favorites" : "Add to favorites",
+        children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
           StarIcon,
           {
-            filled: isFavorite,
+            filled: isFavorite2,
             className: (0, import_design_system2.cn)(
               "h-3.5 w-3.5 transition-all duration-150",
-              isFavorite ? "matrx-agent-star-on" : "text-muted-foreground/40 hover:matrx-agent-star-on"
+              isFavorite2 ? "matrx-agent-star-on" : "text-muted-foreground/40 hover:matrx-agent-star-on"
             )
           }
         )
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     "button",
     {
       type: "button",
@@ -1197,13 +1305,13 @@ function FavoriteAgentButton({
         "absolute top-2.5 right-2.5 z-10 p-0.5 rounded transition-all duration-150",
         "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary",
         disabled || !isOwner ? "cursor-not-allowed" : "hover:scale-110 cursor-pointer",
-        isFavorite ? "matrx-agent-star-on" : "text-muted-foreground/40 hover:matrx-agent-star-on"
+        isFavorite2 ? "matrx-agent-star-on" : "text-muted-foreground/40 hover:matrx-agent-star-on"
       ),
       onClick: handleClick,
       disabled: disabled || !isOwner,
       title,
-      "aria-label": isFavorite ? "Remove from favorites" : "Add to favorites",
-      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(StarIcon, { filled: isFavorite, className: "w-4 h-4 transition-all duration-150" })
+      "aria-label": isFavorite2 ? "Remove from favorites" : "Add to favorites",
+      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(StarIcon, { filled: isFavorite2, className: "w-4 h-4 transition-all duration-150" })
     }
   );
 }
@@ -1236,7 +1344,7 @@ function orchestraDelegatesLine(badge, limit = 3) {
 }
 
 // catalog/react/AgentDetailCard.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function AgentDetailCard({ agent, onSelect }) {
   const { LinkComponent, renderModelRef, openPeek } = useAgentCatalogUiPorts();
   const updatedDate = agent.updatedAt ? new Date(agent.updatedAt) : null;
@@ -1250,24 +1358,24 @@ function AgentDetailCard({ agent, onSelect }) {
       year: "numeric"
     });
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col h-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "px-4 pt-4 pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-start gap-3", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "w-9 h-9 rounded-lg bg-primary/10 flex items-center justify-center shrink-0" }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex-1 min-w-0", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h3", { className: "text-sm font-semibold text-foreground leading-tight truncate", children: agent.name || "Untitled" }),
-        agent.isFavorite && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex items-center gap-1 mt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[11px] matrx-agent-star-on", children: "Pinned to favorites" }) })
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col h-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "px-4 pt-4 pb-3", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-start gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "w-9 h-9 rounded-lg bg-primary/10 flex items-center justify-center shrink-0" }),
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex-1 min-w-0", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h3", { className: "text-sm font-semibold text-foreground leading-tight truncate", children: agent.name || "Untitled" }),
+        agent.isFavorite && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex items-center gap-1 mt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-[11px] matrx-agent-star-on", children: "Pinned to favorites" }) })
       ] }),
-      !isDefaultRow && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FavoriteAgentButton, { id: agent.id, variant: "list" })
+      !isDefaultRow && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FavoriteAgentButton, { id: agent.id, variant: "list" })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "h-px bg-border mx-3" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex-1 overflow-y-auto px-4 py-3 space-y-3", children: [
-      agent.orchestra && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "rounded-md border border-primary/20 bg-primary/5 px-2.5 py-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Music4Icon, { className: "w-3.5 h-3.5 text-primary shrink-0" }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[11px] font-medium text-primary", children: orchestraLabel(agent.orchestra) })
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "h-px bg-border mx-3" }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex-1 overflow-y-auto px-4 py-3 space-y-3", children: [
+      agent.orchestra && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "rounded-md border border-primary/20 bg-primary/5 px-2.5 py-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Music4Icon, { className: "w-3.5 h-3.5 text-primary shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-[11px] font-medium text-primary", children: orchestraLabel(agent.orchestra) })
         ] }),
-        agent.orchestra.tagline && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-1 text-xs text-foreground/80 leading-relaxed", children: agent.orchestra.tagline }),
-        orchestraDelegatesLine(agent.orchestra) && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        agent.orchestra.tagline && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "mt-1 text-xs text-foreground/80 leading-relaxed", children: agent.orchestra.tagline }),
+        orchestraDelegatesLine(agent.orchestra) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
           "p",
           {
             className: "mt-1 text-[11px] text-muted-foreground",
@@ -1275,22 +1383,22 @@ function AgentDetailCard({ agent, onSelect }) {
             children: orchestraDelegatesLine(agent.orchestra)
           }
         ),
-        orchestraDepthLine(agent.orchestra) && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mt-0.5 text-[11px] text-muted-foreground", children: orchestraDepthLine(agent.orchestra) })
+        orchestraDepthLine(agent.orchestra) && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "mt-0.5 text-[11px] text-muted-foreground", children: orchestraDepthLine(agent.orchestra) })
       ] }),
-      agent.description && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-[11px] font-medium text-muted-foreground uppercase tracking-wider mb-1", children: "Description" }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-xs text-foreground/80 leading-relaxed", children: agent.description })
+      agent.description && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-[11px] font-medium text-muted-foreground uppercase tracking-wider mb-1", children: "Description" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "text-xs text-foreground/80 leading-relaxed", children: agent.description })
       ] }),
-      agent.category && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(FolderIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-xs text-foreground/80", children: agent.category })
+      agent.category && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(FolderIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-xs text-foreground/80", children: agent.category })
       ] }),
-      agent.tags && agent.tags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-1.5 mb-1.5", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TagIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[11px] font-medium text-muted-foreground", children: "Tags" })
+      agent.tags && agent.tags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-1.5 mb-1.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TagIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-[11px] font-medium text-muted-foreground", children: "Tags" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex flex-wrap gap-1", children: agent.tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex flex-wrap gap-1", children: agent.tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
           "span",
           {
             className: "inline-flex items-center h-5 px-1.5 rounded text-[10px] font-medium bg-muted text-muted-foreground",
@@ -1299,40 +1407,40 @@ function AgentDetailCard({ agent, onSelect }) {
           tag
         )) })
       ] }),
-      agent.accessLevel && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2", children: [
-        agent.isOwner === false ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(UsersIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(GlobeIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex flex-col", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-xs text-foreground/80 capitalize", children: agent.accessLevel === "owner" ? "You own this" : `Shared \u2014 ${agent.accessLevel}` }),
-          agent.sharedByEmail && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "text-[10px] text-muted-foreground", children: [
+      agent.accessLevel && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2", children: [
+        agent.isOwner === false ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(UsersIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(GlobeIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-xs text-foreground/80 capitalize", children: agent.accessLevel === "owner" ? "You own this" : `Shared \u2014 ${agent.accessLevel}` }),
+          agent.sharedByEmail && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "text-[10px] text-muted-foreground", children: [
             "by ",
             agent.sharedByEmail
           ] })
         ] })
       ] }),
-      agent.modelId && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex items-center gap-2", children: renderModelRef({
+      agent.modelId && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex items-center gap-2", children: renderModelRef({
         modelId: agent.modelId,
         className: "max-w-full text-xs text-foreground/80"
       }) }),
-      (updatedDate || createdDate) && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "pt-1 space-y-1", children: [
-        updatedDate && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ClockIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "text-[11px] text-muted-foreground", children: [
+      (updatedDate || createdDate) && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "pt-1 space-y-1", children: [
+        updatedDate && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ClockIcon, { className: "w-3.5 h-3.5 text-muted-foreground shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "text-[11px] text-muted-foreground", children: [
             "Updated ",
             formatDate(updatedDate)
           ] })
         ] }),
-        createdDate && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ClockIcon, { className: "w-3.5 h-3.5 text-muted-foreground/50 shrink-0" }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "text-[11px] text-muted-foreground/70", children: [
+        createdDate && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ClockIcon, { className: "w-3.5 h-3.5 text-muted-foreground/50 shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("span", { className: "text-[11px] text-muted-foreground/70", children: [
             "Created ",
             formatDate(createdDate)
           ] })
         ] })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "h-px bg-border mx-3 mt-auto" }),
-    /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "px-3 py-2 shrink-0 flex items-center gap-1.5", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "h-px bg-border mx-3 mt-auto" }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "px-3 py-2 shrink-0 flex items-center gap-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
         "button",
         {
           type: "button",
@@ -1341,7 +1449,7 @@ function AgentDetailCard({ agent, onSelect }) {
           children: "Select"
         }
       ),
-      openPeek && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      openPeek && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
         "button",
         {
           type: "button",
@@ -1352,11 +1460,11 @@ function AgentDetailCard({ agent, onSelect }) {
           title: "Sneak Peek",
           "aria-label": "Sneak Peek",
           className: iconButtonClass,
-          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(RocketIcon, { className: "w-3.5 h-3.5" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(RocketIcon, { className: "w-3.5 h-3.5" })
         }
       ),
-      !isDefaultRow && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      !isDefaultRow && /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
           LinkComponent,
           {
             href: `/chat/a/${agent.id}`,
@@ -1364,10 +1472,10 @@ function AgentDetailCard({ agent, onSelect }) {
             title: "Open in chat",
             "aria-label": "Open in chat",
             className: iconButtonClass,
-            children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(MessageCircleIcon, { className: "w-3.5 h-3.5" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(MessageCircleIcon, { className: "w-3.5 h-3.5" })
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
           LinkComponent,
           {
             href: `/agents/go/${agent.id}`,
@@ -1380,7 +1488,7 @@ function AgentDetailCard({ agent, onSelect }) {
               iconButtonClass,
               "hover:text-foreground"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ExternalLinkIcon, { className: "w-3.5 h-3.5" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(ExternalLinkIcon, { className: "w-3.5 h-3.5" })
           }
         )
       ] })
@@ -1390,14 +1498,14 @@ function AgentDetailCard({ agent, onSelect }) {
 var iconButtonClass = "flex items-center justify-center h-7 w-7 rounded-md border border-border bg-background text-muted-foreground hover:text-primary hover:bg-muted/50 transition-colors shrink-0";
 
 // catalog/react/AgentListContent.tsx
-var import_react5 = require("react");
+var import_react6 = require("react");
 
 // catalog/react/types.ts
 var PANEL_HEIGHT = "528px";
 var LIST_MAX_HEIGHT = "min(528px, var(--radix-popper-available-height, 528px))";
 
 // catalog/react/AgentFilterBar.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function AgentFilterBar({
   consumer,
   allCategories,
@@ -1408,8 +1516,8 @@ function AgentFilterBar({
   onFilterChipClick,
   onReset
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex items-center gap-1 px-2 pb-1.5 overflow-x-auto matrx-agent-scrollbar-none shrink-0", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "flex items-center gap-1 px-2 pb-1.5 overflow-x-auto matrx-agent-scrollbar-none shrink-0", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       FilterChip,
       {
         icon: ArrowUpDownIcon,
@@ -1419,7 +1527,7 @@ function AgentFilterBar({
         onClick: () => onFilterChipClick("sort")
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       FilterChip,
       {
         icon: StarIcon,
@@ -1431,7 +1539,7 @@ function AgentFilterBar({
         }
       }
     ),
-    allCategories.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    allCategories.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       FilterChip,
       {
         icon: FolderIcon,
@@ -1441,7 +1549,7 @@ function AgentFilterBar({
         onClick: () => onFilterChipClick("categories")
       }
     ),
-    allTags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    allTags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       FilterChip,
       {
         icon: TagIcon,
@@ -1451,14 +1559,14 @@ function AgentFilterBar({
         onClick: () => onFilterChipClick("tags")
       }
     ),
-    activeFilterCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    activeFilterCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
       "button",
       {
         type: "button",
         onClick: onReset,
         "aria-label": "Reset filters",
         className: "flex items-center gap-0.5 h-6 px-1.5 rounded text-[11px] text-muted-foreground hover:text-foreground hover:bg-muted/50 transition-colors shrink-0",
-        children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(RotateCcwIcon, { className: "w-3 h-3" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(RotateCcwIcon, { className: "w-3 h-3" })
       }
     )
   ] });
@@ -1466,7 +1574,7 @@ function AgentFilterBar({
 
 // catalog/react/AgentListTabs.tsx
 var import_design_system4 = require("@ai-matrx/design-system");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function AgentListTabs({
   consumer,
   tabCounts,
@@ -1480,7 +1588,7 @@ function AgentListTabs({
     { value: "all", label: "All", countKey: "all" },
     { value: "system", label: labels.publicTab, countKey: "system" }
   ];
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     "div",
     {
       className: "flex items-center gap-0.5 px-2 pb-1 overflow-x-auto matrx-agent-scrollbar-none shrink-0",
@@ -1490,7 +1598,7 @@ function AgentListTabs({
         const label = value === "system" ? systemTabLabel ?? baseLabel : baseLabel;
         const active = consumer.tab === value;
         const count = tabCounts[countKey];
-        return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+        return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
           "button",
           {
             type: "button",
@@ -1502,8 +1610,8 @@ function AgentListTabs({
               active ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: label }),
-              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: label }),
+              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
                 "span",
                 {
                   className: (0, import_design_system4.cn)("tabular-nums opacity-70", active && "opacity-90"),
@@ -1521,7 +1629,7 @@ function AgentListTabs({
 
 // catalog/react/AgentRow.tsx
 var import_design_system5 = require("@ai-matrx/design-system");
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function AgentRow({
   agent,
   isActive,
@@ -1536,9 +1644,10 @@ function AgentRow({
   const { LinkComponent } = useAgentCatalogUiPorts();
   const { labels } = useAgentCatalog();
   const rowHref = href ?? `/agents/go/${agent.id}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
     "div",
     {
+      "data-testid": `agent-row-${agent.id}`,
       className: (0, import_design_system5.cn)(
         "flex items-center w-full text-left transition-colors group",
         "hover:bg-muted/50 active:bg-muted/70",
@@ -1548,7 +1657,7 @@ function AgentRow({
       onMouseEnter: isMobile ? void 0 : onHover,
       onMouseLeave: isMobile ? void 0 : onHoverEnd,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
           LinkComponent,
           {
             href: rowHref,
@@ -1559,8 +1668,8 @@ function AgentRow({
             },
             className: "flex items-center gap-2 flex-1 min-w-0 px-3 py-2",
             children: [
-              agent.isFavorite && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(StarIcon, { filled: true, className: "w-3 h-3 matrx-agent-star-on shrink-0" }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+              agent.isFavorite && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(StarIcon, { filled: true, className: "w-3 h-3 matrx-agent-star-on shrink-0" }),
+              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
                 "span",
                 {
                   className: (0, import_design_system5.cn)(
@@ -1570,22 +1679,22 @@ function AgentRow({
                   children: agent.name || "Untitled"
                 }
               ),
-              agent.orchestra && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+              agent.orchestra && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
                 "span",
                 {
                   className: "flex shrink-0 items-center gap-0.5 rounded-sm bg-primary/10 px-1 py-px text-[9px] font-medium text-primary",
                   title: orchestraDelegatesLine(agent.orchestra) ?? orchestraLabel(agent.orchestra),
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Music4Icon, { className: "w-2.5 h-2.5" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Music4Icon, { className: "w-2.5 h-2.5" }),
                     agent.orchestra.memberCount
                   ]
                 }
               ),
-              agent.agentType === "builtin" ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-[9px] font-medium text-primary bg-primary/10 px-1 py-px rounded shrink-0 ml-auto", children: labels.systemBadge }) : agent.isOwner === false ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "text-[9px] text-muted-foreground bg-muted px-1 py-px rounded shrink-0 ml-auto", children: "shared" }) : null
+              agent.agentType === "builtin" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[9px] font-medium text-primary bg-primary/10 px-1 py-px rounded shrink-0 ml-auto", children: labels.systemBadge }) : agent.isOwner === false ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[9px] text-muted-foreground bg-muted px-1 py-px rounded shrink-0 ml-auto", children: "shared" }) : null
             ]
           }
         ),
-        isMobile && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        isMobile && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           "button",
           {
             type: "button",
@@ -1595,7 +1704,7 @@ function AgentRow({
               onDetailPress();
             },
             className: "flex items-center justify-center w-10 h-full shrink-0 text-muted-foreground/40 active:text-muted-foreground",
-            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(ChevronRightIcon, { className: "w-4 h-4" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ChevronRightIcon, { className: "w-4 h-4" })
           }
         )
       ]
@@ -1604,7 +1713,7 @@ function AgentRow({
 }
 
 // catalog/react/AgentListContent.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function AgentListContent({
   agents,
   isLoading,
@@ -1632,8 +1741,8 @@ function AgentListContent({
   listOpen = false
 }) {
   const catalog = useAgentCatalog();
-  const listScrollRef = (0, import_react5.useRef)(null);
-  (0, import_react5.useEffect)(() => {
+  const listScrollRef = (0, import_react6.useRef)(null);
+  (0, import_react6.useEffect)(() => {
     if (listOpen && pinnedAgent) {
       listScrollRef.current?.scrollTo({ top: 0 });
     }
@@ -1641,8 +1750,8 @@ function AgentListContent({
   const { labels } = catalog;
   const emptyLabel = agentListEmptyLabel(consumer.tab, labels);
   const defaultAgent = defaultRow?.row ?? null;
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col h-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "px-2 pt-2 pb-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col h-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "px-2 pt-2 pb-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       SearchInput,
       {
         ref: inputRef,
@@ -1651,7 +1760,7 @@ function AgentListContent({
         placeholder: labels.searchPlaceholder
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       AgentListTabs,
       {
         consumer,
@@ -1660,7 +1769,7 @@ function AgentListContent({
         visibleTabs
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
       AgentFilterBar,
       {
         consumer,
@@ -1673,46 +1782,46 @@ function AgentListContent({
         onReset
       }
     ),
-    defaultRow?.drift && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    defaultRow?.drift && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
       "div",
       {
         role: "status",
         className: "matrx-agent-drift-banner mx-2 mb-1.5 flex items-start gap-2 rounded-md px-2 py-1.5 shrink-0",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AlertTriangleIcon, { className: "w-3.5 h-3.5 shrink-0 mt-px" }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[11px] leading-snug flex-1", children: defaultRow.drift }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(AlertTriangleIcon, { className: "w-3.5 h-3.5 shrink-0 mt-px" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-[11px] leading-snug flex-1", children: defaultRow.drift }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
             "button",
             {
               type: "button",
               "aria-label": "Dismiss",
               onClick: () => catalog.dismissDefaultRowDrift(defaultRow.mandateKey),
               className: "shrink-0 opacity-70 hover:opacity-100",
-              children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(XIcon, { className: "w-3 h-3" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(XIcon, { className: "w-3 h-3" })
             }
           )
         ]
       }
     ),
-    defaultRow?.error && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    defaultRow?.error && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
       "div",
       {
         role: "alert",
         className: "matrx-agent-drift-banner mx-2 mb-1.5 flex items-start gap-2 rounded-md px-2 py-1.5 shrink-0",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(AlertTriangleIcon, { className: "w-3.5 h-3.5 shrink-0 mt-px" }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[11px] leading-snug flex-1", children: defaultRow.error })
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(AlertTriangleIcon, { className: "w-3.5 h-3.5 shrink-0 mt-px" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-[11px] leading-snug flex-1", children: defaultRow.error })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "h-px bg-border shrink-0" }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { ref: listScrollRef, className: "overflow-y-auto flex-1 min-h-0", children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center justify-center py-8 gap-2 text-muted-foreground", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(LoaderIcon, { className: "w-4 h-4 matrx-agent-spin" }),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-xs", children: labels.loading })
-    ] }) : agents.length === 0 && !pinnedAgent && !defaultAgent ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex flex-col items-center py-8 text-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-xs", children: emptyLabel }) }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "py-0.5", children: [
-      defaultAgent && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "px-3 pt-1.5 pb-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[10px] font-medium uppercase tracking-wide text-muted-foreground", children: "Default" }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "h-px bg-border shrink-0" }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { ref: listScrollRef, className: "overflow-y-auto flex-1 min-h-0", children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex items-center justify-center py-8 gap-2 text-muted-foreground", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(LoaderIcon, { className: "w-4 h-4 matrx-agent-spin" }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-xs", children: labels.loading })
+    ] }) : agents.length === 0 && !pinnedAgent && !defaultAgent ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex flex-col items-center py-8 text-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-xs", children: emptyLabel }) }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "py-0.5", children: [
+      defaultAgent && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "px-3 pt-1.5 pb-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-[10px] font-medium uppercase tracking-wide text-muted-foreground", children: "Default" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
           AgentRow,
           {
             agent: defaultAgent,
@@ -1727,11 +1836,11 @@ function AgentListContent({
           },
           `default-${defaultAgent.id}`
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "mx-2 my-0.5 h-px bg-border" })
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "mx-2 my-0.5 h-px bg-border" })
       ] }),
-      pinnedAgent && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "px-3 pt-1.5 pb-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-[10px] font-medium uppercase tracking-wide text-muted-foreground", children: labels.currentAgentHeading }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      pinnedAgent && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "px-3 pt-1.5 pb-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-[10px] font-medium uppercase tracking-wide text-muted-foreground", children: labels.currentAgentHeading }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
           AgentRow,
           {
             agent: pinnedAgent,
@@ -1746,9 +1855,9 @@ function AgentListContent({
           },
           `pinned-${pinnedAgent.id}`
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "mx-2 my-0.5 h-px bg-border" })
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "mx-2 my-0.5 h-px bg-border" })
       ] }),
-      agents.map((agent) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      agents.map((agent) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         AgentRow,
         {
           agent,
@@ -1763,16 +1872,16 @@ function AgentListContent({
         },
         agent.id
       )),
-      agents.length === 0 && (pinnedAgent || defaultAgent) && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "flex flex-col items-center py-4 text-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "text-xs", children: emptyLabel }) })
+      agents.length === 0 && (pinnedAgent || defaultAgent) && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex flex-col items-center py-4 text-muted-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "text-xs", children: emptyLabel }) })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "h-px bg-border shrink-0" }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex items-center justify-between px-2.5 py-1.5 shrink-0", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: "text-[10px] text-muted-foreground tabular-nums", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "h-px bg-border shrink-0" }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex items-center justify-between px-2.5 py-1.5 shrink-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "text-[10px] text-muted-foreground tabular-nums", children: [
         agents.length,
         " agent",
         agents.length !== 1 ? "s" : ""
       ] }),
-      consumer.searchTerm && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      consumer.searchTerm && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         "button",
         {
           type: "button",
@@ -1786,7 +1895,7 @@ function AgentListContent({
 }
 
 // catalog/react/AgentMobileSubView.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 function AgentMobileSubView({
   view,
   consumer,
@@ -1799,20 +1908,20 @@ function AgentMobileSubView({
   onBack
 }) {
   const title = view === "sort" ? "Sort" : view === "categories" ? "Categories" : "Tags";
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
       "button",
       {
         type: "button",
         onClick: onBack,
         className: "flex items-center gap-1.5 px-3 py-2.5 text-sm font-medium text-primary hover:bg-muted/30 transition-colors border-b border-border shrink-0",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ChevronRightIcon, { className: "w-4 h-4 rotate-180" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(ChevronRightIcon, { className: "w-4 h-4 rotate-180" }),
           title
         ]
       }
     ),
-    view === "sort" && SORT_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    view === "sort" && SORT_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
       OptionRow,
       {
         label: opt.label,
@@ -1824,8 +1933,8 @@ function AgentMobileSubView({
       },
       opt.value
     )),
-    view === "categories" && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "px-2 pt-2 pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    view === "categories" && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "px-2 pt-2 pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         SearchInput,
         {
           value: catSearch,
@@ -1833,7 +1942,7 @@ function AgentMobileSubView({
           placeholder: "Filter categories..."
         }
       ) }),
-      consumer.includedCats.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+      consumer.includedCats.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
         "button",
         {
           type: "button",
@@ -1846,9 +1955,9 @@ function AgentMobileSubView({
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "overflow-y-auto max-h-[300px]", children: allCategories.filter(
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "overflow-y-auto max-h-[300px]", children: allCategories.filter(
         (c) => !catSearch || c.toLowerCase().includes(catSearch.toLowerCase())
-      ).map((cat) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      ).map((cat) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         CheckRow,
         {
           label: cat,
@@ -1858,8 +1967,8 @@ function AgentMobileSubView({
         cat
       )) })
     ] }),
-    view === "tags" && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "px-2 pt-2 pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+    view === "tags" && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "px-2 pt-2 pb-1", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         SearchInput,
         {
           value: tagSearch,
@@ -1867,7 +1976,7 @@ function AgentMobileSubView({
           placeholder: "Filter tags..."
         }
       ) }),
-      consumer.includedTags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+      consumer.includedTags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
         "button",
         {
           type: "button",
@@ -1880,9 +1989,9 @@ function AgentMobileSubView({
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "overflow-y-auto max-h-[300px]", children: allTags.filter(
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "overflow-y-auto max-h-[300px]", children: allTags.filter(
         (t) => !tagSearch || t.toLowerCase().includes(tagSearch.toLowerCase())
-      ).map((tag) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      ).map((tag) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         CheckRow,
         {
           label: tag,
@@ -1896,11 +2005,11 @@ function AgentMobileSubView({
 }
 
 // catalog/react/AgentSortPanel.tsx
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 function AgentSortPanel({ consumer, onClose }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex flex-col h-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(SidePanelHeader, { title: "Sort By", onClose }),
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "overflow-y-auto flex-1", children: SORT_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col h-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SidePanelHeader, { title: "Sort By", onClose }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "overflow-y-auto flex-1", children: SORT_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
       OptionRow,
       {
         label: opt.label,
@@ -1913,7 +2022,7 @@ function AgentSortPanel({ consumer, onClose }) {
 }
 
 // catalog/react/AgentTagsPanel.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function AgentTagsPanel({
   consumer,
   allTags,
@@ -1924,9 +2033,9 @@ function AgentTagsPanel({
   const filtered = allTags.filter(
     (t) => !search || t.toLowerCase().includes(search.toLowerCase())
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex flex-col h-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SidePanelHeader, { title: "Tags", onClose }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "px-2 pt-2 pb-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex flex-col h-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(SidePanelHeader, { title: "Tags", onClose }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "px-2 pt-2 pb-1 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       SearchInput,
       {
         value: search,
@@ -1934,7 +2043,7 @@ function AgentTagsPanel({
         placeholder: "Filter tags..."
       }
     ) }),
-    consumer.includedTags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+    consumer.includedTags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
       "button",
       {
         type: "button",
@@ -1947,7 +2056,7 @@ function AgentTagsPanel({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "overflow-y-auto flex-1", children: filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("p", { className: "text-xs text-muted-foreground text-center py-6", children: "No tags" }) : filtered.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "overflow-y-auto flex-1", children: filtered.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-xs text-muted-foreground text-center py-6", children: "No tags" }) : filtered.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
       CheckRow,
       {
         label: tag,
@@ -1960,7 +2069,7 @@ function AgentTagsPanel({
 }
 
 // catalog/react/AgentListDropdown.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 var CONSUMER_ID = "agent-list-dropdown";
 function AgentListDropdown({
   onSelect,
@@ -1985,13 +2094,13 @@ function AgentListDropdown({
   const isMobile = (0, import_design_system6.useIsMobile)();
   const { labels } = useAgentCatalog();
   const { popoverContainer } = useAgentCatalogUiPorts();
-  const [open, setOpen] = (0, import_react6.useState)(false);
-  const [rightPanel, setRightPanel] = (0, import_react6.useState)(null);
-  const [catSearch, setCatSearch] = (0, import_react6.useState)("");
-  const [tagSearch, setTagSearch] = (0, import_react6.useState)("");
-  const [mobileDetailAgent, setMobileDetailAgent] = (0, import_react6.useState)(null);
-  const [mobileSubView, setMobileSubView] = (0, import_react6.useState)(null);
-  const inputRef = (0, import_react6.useRef)(null);
+  const [open, setOpen] = (0, import_react7.useState)(false);
+  const [rightPanel, setRightPanel] = (0, import_react7.useState)(null);
+  const [catSearch, setCatSearch] = (0, import_react7.useState)("");
+  const [tagSearch, setTagSearch] = (0, import_react7.useState)("");
+  const [mobileDetailAgent, setMobileDetailAgent] = (0, import_react7.useState)(null);
+  const [mobileSubView, setMobileSubView] = (0, import_react7.useState)(null);
+  const inputRef = (0, import_react7.useRef)(null);
   const {
     agents,
     isLoading,
@@ -2054,7 +2163,7 @@ function AgentListDropdown({
       setRightPanel(rightPanel === panel ? null : panel);
     }
   };
-  const handleAgentHover = (0, import_react6.useCallback)(
+  const handleAgentHover = (0, import_react7.useCallback)(
     (agent) => {
       if (isMobile) return;
       const filterPanelOpen = rightPanel === "sort" || rightPanel === "categories" || rightPanel === "tags";
@@ -2063,7 +2172,7 @@ function AgentListDropdown({
     },
     [isMobile, rightPanel, coreAgentHover]
   );
-  const handleAgentHoverEnd = (0, import_react6.useCallback)(
+  const handleAgentHoverEnd = (0, import_react7.useCallback)(
     (agent) => {
       if (isMobile) return;
       if (rightPanel !== "detail") return;
@@ -2071,16 +2180,16 @@ function AgentListDropdown({
     },
     [isMobile, rightPanel, coreAgentHoverEnd]
   );
-  const handleDetailPanelMouseLeave = (0, import_react6.useCallback)(() => {
+  const handleDetailPanelMouseLeave = (0, import_react7.useCallback)(() => {
     coreDetailMouseLeave(() => setRightPanel(null));
   }, [coreDetailMouseLeave]);
-  const resolveAgentHref = (0, import_react6.useMemo)(() => {
+  const resolveAgentHref = (0, import_react7.useMemo)(() => {
     if (resolveAgentHrefProp) return resolveAgentHrefProp;
     if (!navigateTo) return void 0;
     return (agent) => navigateTo.replace("{id}", agent.id);
   }, [navigateTo, resolveAgentHrefProp]);
   const hasRightPanel = rightPanel !== null;
-  const triggerButton = triggerSlot ?? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  const triggerButton = triggerSlot ?? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
     "button",
     {
       type: "button",
@@ -2092,22 +2201,22 @@ function AgentListDropdown({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "min-w-0 max-w-[200px] flex-1 truncate text-left", children: displayLabel }),
-        activeFilterCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "flex items-center justify-center w-4 h-4 rounded-md bg-primary text-primary-foreground text-[10px]", children: activeFilterCount }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChevronDownIcon, { className: "w-3 h-3 text-muted-foreground/60" })
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "min-w-0 max-w-[200px] flex-1 truncate text-left", children: displayLabel }),
+        activeFilterCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "flex items-center justify-center w-4 h-4 rounded-md bg-primary text-primary-foreground text-[10px]", children: activeFilterCount }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ChevronDownIcon, { className: "w-3 h-3 text-muted-foreground/60" })
       ]
     }
   );
   const wrapTrigger = (Trigger) => {
     if (!showAssignedTooltip) {
-      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Trigger, { asChild: true, children: triggerButton });
+      return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Trigger, { asChild: true, children: triggerButton });
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_design_system6.Tooltip, { ...open ? { open: false } : {}, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_design_system6.TooltipTrigger, { asChild: true, children: triggerButton }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_design_system6.TooltipContent, { side: "bottom", className: "max-w-xs", children: displayLabel })
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_design_system6.Tooltip, { ...open ? { open: false } : {}, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_design_system6.TooltipTrigger, { asChild: true, children: triggerButton }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_design_system6.TooltipContent, { side: "bottom", className: "max-w-xs", children: displayLabel })
     ] });
   };
-  const listPanel = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  const listPanel = /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     AgentListContent,
     {
       agents,
@@ -2139,31 +2248,31 @@ function AgentListDropdown({
     }
   );
   if (isMobile) {
-    return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_design_system6.Drawer, { open, onOpenChange: handleOpen, children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_design_system6.Drawer, { open, onOpenChange: handleOpen, children: [
       wrapTrigger(import_design_system6.DrawerTrigger),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_design_system6.DrawerContent, { className: "h-[85dvh]", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_design_system6.DrawerTitle, { className: "sr-only", children: "Select Agent" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex flex-col overflow-hidden flex-1 min-h-0", children: mobileDetailAgent ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex flex-col overflow-hidden", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_design_system6.DrawerContent, { className: "h-[85dvh]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_design_system6.DrawerTitle, { className: "sr-only", children: "Select Agent" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-col overflow-hidden flex-1 min-h-0", children: mobileDetailAgent ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex flex-col overflow-hidden", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
             "button",
             {
               type: "button",
               onClick: () => setMobileDetailAgent(null),
               className: "flex items-center gap-1.5 px-3 py-2.5 text-sm font-medium text-primary hover:bg-muted/30 transition-colors border-b border-border shrink-0",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ChevronRightIcon, { className: "w-4 h-4 rotate-180" }),
+                /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ChevronRightIcon, { className: "w-4 h-4 rotate-180" }),
                 "Back"
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
             AgentDetailCard,
             {
               agent: mobileDetailAgent,
               onSelect: () => handleSelectAgent(mobileDetailAgent)
             }
           ) })
-        ] }) : mobileSubView ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        ] }) : mobileSubView ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
           AgentMobileSubView,
           {
             view: mobileSubView,
@@ -2184,9 +2293,9 @@ function AgentListDropdown({
       ] })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_design_system6.Popover, { open, onOpenChange: handleOpen, modal: false, children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_design_system6.Popover, { open, onOpenChange: handleOpen, modal: false, children: [
     wrapTrigger(import_design_system6.PopoverTrigger),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       import_design_system6.PopoverContent,
       {
         ...contentSide ? { side: contentSide } : {},
@@ -2197,30 +2306,30 @@ function AgentListDropdown({
         ...popoverContainer ? { container: popoverContainer } : {},
         className: "p-0 overflow-hidden w-[680px]",
         style: { height: PANEL_HEIGHT, maxHeight: LIST_MAX_HEIGHT },
-        children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex h-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex flex-col min-w-0 w-[340px] shrink-0 border-r border-border", children: listPanel }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex h-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-col min-w-0 w-[340px] shrink-0 border-r border-border", children: listPanel }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
             "div",
             {
               className: "h-full w-[340px] shrink-0 overflow-hidden flex flex-col",
               onMouseEnter: rightPanel === "detail" ? handleDetailPanelMouseEnter : void 0,
               onMouseLeave: rightPanel === "detail" ? handleDetailPanelMouseLeave : void 0,
               children: [
-                rightPanel === "detail" && hoveredAgent && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "h-full matrx-agent-fade-in", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                rightPanel === "detail" && hoveredAgent && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "h-full matrx-agent-fade-in", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                   AgentDetailCard,
                   {
                     agent: hoveredAgent,
                     onSelect: () => handleSelectAgent(hoveredAgent)
                   }
                 ) }, hoveredAgent.id),
-                rightPanel === "sort" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                rightPanel === "sort" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                   AgentSortPanel,
                   {
                     consumer,
                     onClose: () => setRightPanel(null)
                   }
                 ),
-                rightPanel === "categories" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                rightPanel === "categories" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                   AgentCategoriesPanel,
                   {
                     consumer,
@@ -2233,7 +2342,7 @@ function AgentListDropdown({
                     }
                   }
                 ),
-                rightPanel === "tags" && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                rightPanel === "tags" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                   AgentTagsPanel,
                   {
                     consumer,
@@ -2246,9 +2355,9 @@ function AgentListDropdown({
                     }
                   }
                 ),
-                !hasRightPanel && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "flex flex-1 flex-col items-center justify-center gap-2 px-6 text-center", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MousePointerClickIcon, { className: "h-6 w-6 text-muted-foreground/40" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-xs text-muted-foreground/70 leading-relaxed", children: labels.hoverHint })
+                !hasRightPanel && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "flex flex-1 flex-col items-center justify-center gap-2 px-6 text-center", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(MousePointerClickIcon, { className: "h-6 w-6 text-muted-foreground/40" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("p", { className: "text-xs text-muted-foreground/70 leading-relaxed", children: labels.hoverHint })
                 ] })
               ]
             }
@@ -2261,8 +2370,8 @@ function AgentListDropdown({
 
 // catalog/react/AgentListInlinePicker.tsx
 var import_design_system7 = require("@ai-matrx/design-system");
-var import_react7 = require("react");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_react8 = require("react");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function AgentListInlinePicker({
   consumerId,
   onSelect,
@@ -2278,11 +2387,11 @@ function AgentListInlinePicker({
   excludeAgentIds,
   defaultMandateKey
 }) {
-  const inputRef = (0, import_react7.useRef)(null);
-  const [catSearch, setCatSearch] = (0, import_react7.useState)("");
-  const [tagSearch, setTagSearch] = (0, import_react7.useState)("");
-  const [mobileDetailAgent, setMobileDetailAgent] = (0, import_react7.useState)(null);
-  const [mobileSubView, setMobileSubView] = (0, import_react7.useState)(null);
+  const inputRef = (0, import_react8.useRef)(null);
+  const [catSearch, setCatSearch] = (0, import_react8.useState)("");
+  const [tagSearch, setTagSearch] = (0, import_react8.useState)("");
+  const [mobileDetailAgent, setMobileDetailAgent] = (0, import_react8.useState)(null);
+  const [mobileSubView, setMobileSubView] = (0, import_react8.useState)(null);
   const {
     agents,
     isLoading,
@@ -2310,7 +2419,7 @@ function AgentListInlinePicker({
     ...excludeAgentIds ? { excludeAgentIds } : {},
     ...defaultMandateKey ? { defaultMandateKey } : {}
   });
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     ensureLoaded();
     if (!autoFocusSearch) return void 0;
     const timer = setTimeout(() => inputRef.current?.focus(), 50);
@@ -2326,20 +2435,20 @@ function AgentListInlinePicker({
   };
   const isMobile = true;
   if (mobileDetailAgent) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: (0, import_design_system7.cn)("flex h-full min-h-0 flex-col", className), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: (0, import_design_system7.cn)("flex h-full min-h-0 flex-col", className), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
         "button",
         {
           type: "button",
           onClick: () => setMobileDetailAgent(null),
           className: "flex shrink-0 items-center gap-1.5 border-b border-border px-3 py-2 text-sm font-medium text-primary transition-colors hover:bg-muted/30",
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(ChevronRightIcon, { className: "h-4 w-4 rotate-180" }),
+            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(ChevronRightIcon, { className: "h-4 w-4 rotate-180" }),
             "Back"
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
         AgentDetailCard,
         {
           agent: mobileDetailAgent,
@@ -2349,7 +2458,7 @@ function AgentListInlinePicker({
     ] });
   }
   if (mobileSubView) {
-    return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: (0, import_design_system7.cn)("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_design_system7.cn)("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       AgentMobileSubView,
       {
         view: mobileSubView,
@@ -2368,7 +2477,7 @@ function AgentListInlinePicker({
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: (0, import_design_system7.cn)("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: (0, import_design_system7.cn)("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     AgentListContent,
     {
       agents,