@iblai/iblai-js 2.14.0 → 2.15.0

package/dist/web-containers/source/next/index.esm.js

@@ -96763,6 +96763,7 @@ var analyticsAnalyticsCourses$3 = {
 	loading: "Loading...",
 	colCourseName: "Course Name",
 	colCourseId: "Course ID",
+	openCourseAriaLabel: "Open course {id} in a new tab",
 	colEnrollments: "Enrollments",
 	viewCourseAriaLabel: "View details for {name}",
 	goToFirstPage: "Go to first page",
@@ -96815,15 +96816,15 @@ var analyticsAnalyticsFinancialStats$3 = {
 	viewTraces: "Traces →",
 	costByLLMFooter: "{shown} models · ranked by cost"
 };
+var analyticsAgentScopeLink$3 = {
+	scopeToAgent: "View analytics for {name}"
+};
 var analyticsAnalyticsMemoryStats$3 = {
 	noPermission: "You do not have permission to view user memories.",
 	scopeLabel: "Memory scope",
 	scopeMentor: "This Agent",
 	scopeAllMentors: "All Agents",
 	scopeGlobal: "Global",
-	searchAgents: "Search Agents…",
-	searchAgentsTitle: "Search Agents",
-	clearAgentSearch: "Clear Agent Search",
 	contentPlaceholder: "Search memory content",
 	pickDateRange: "Pick a Date Range",
 	allCategories: "All Categories",
@@ -96968,6 +96969,7 @@ var analyticsAnalyticsPrograms$3 = {
 	loading: "Loading...",
 	programName: "Program Name",
 	programId: "Program ID",
+	openProgramAriaLabel: "Open program {id} in a new tab",
 	viewDetailsAriaLabel: "View details for {name}",
 	goToFirstPage: "Go to first page",
 	goToPreviousPage: "Go to previous page",
@@ -97047,7 +97049,6 @@ var analyticsAnalyticsTranscriptsStats$3 = {
 	labelModel: "Model:",
 	labelModelCard: "model:",
 	labelUser: "User:",
-	labelUserId: "user_id:",
 	roleUser: "User",
 	roleAgent: "Agent",
 	noMessages: "No messages in this conversation.",
@@ -102967,6 +102968,7 @@ var en = {
 	analyticsAnalyticsCourseDetail: analyticsAnalyticsCourseDetail$3,
 	analyticsAnalyticsCourses: analyticsAnalyticsCourses$3,
 	analyticsAnalyticsFinancialStats: analyticsAnalyticsFinancialStats$3,
+	analyticsAgentScopeLink: analyticsAgentScopeLink$3,
 	analyticsAnalyticsMemoryStats: analyticsAnalyticsMemoryStats$3,
 	analyticsAnalyticsMonetizationStats: analyticsAnalyticsMonetizationStats$3,
 	analyticsAnalyticsOverview: analyticsAnalyticsOverview$3,
@@ -103914,6 +103916,7 @@ var analyticsAnalyticsCourses$2 = {
 	loading: "Chargement...",
 	colCourseName: "Nom du cours",
 	colCourseId: "ID du cours",
+	openCourseAriaLabel: "Ouvrir le cours {id} dans un nouvel onglet",
 	colEnrollments: "Inscriptions",
 	viewCourseAriaLabel: "Voir les détails de {name}",
 	goToFirstPage: "Aller à la première page",
@@ -103966,15 +103969,15 @@ var analyticsAnalyticsFinancialStats$2 = {
 	viewTraces: "Traces →",
 	costByLLMFooter: "{shown} modèles · classés par coût"
 };
+var analyticsAgentScopeLink$2 = {
+	scopeToAgent: "Voir les analyses de {name}"
+};
 var analyticsAnalyticsMemoryStats$2 = {
 	noPermission: "Vous n'avez pas l'autorisation de consulter les mémoires des utilisateurs.",
 	scopeLabel: "Portée de la mémoire",
 	scopeMentor: "Cet agent",
 	scopeAllMentors: "Tous les agents",
 	scopeGlobal: "Global",
-	searchAgents: "Rechercher des agents…",
-	searchAgentsTitle: "Rechercher des agents",
-	clearAgentSearch: "Effacer la recherche d'agent",
 	contentPlaceholder: "Rechercher dans le contenu des mémoires",
 	pickDateRange: "Choisir une plage de dates",
 	allCategories: "Toutes les catégories",
@@ -104119,6 +104122,7 @@ var analyticsAnalyticsPrograms$2 = {
 	loading: "Chargement...",
 	programName: "Nom du programme",
 	programId: "ID du programme",
+	openProgramAriaLabel: "Ouvrir le programme {id} dans un nouvel onglet",
 	viewDetailsAriaLabel: "Voir les détails de {name}",
 	goToFirstPage: "Aller à la première page",
 	goToPreviousPage: "Aller à la page précédente",
@@ -104198,7 +104202,6 @@ var analyticsAnalyticsTranscriptsStats$2 = {
 	labelModel: "Modèle :",
 	labelModelCard: "modèle :",
 	labelUser: "Utilisateur :",
-	labelUserId: "ID utilisateur :",
 	roleUser: "Utilisateur",
 	roleAgent: "Agent",
 	noMessages: "Aucun message dans cette conversation.",
@@ -110118,6 +110121,7 @@ var fr = {
 	analyticsAnalyticsCourseDetail: analyticsAnalyticsCourseDetail$2,
 	analyticsAnalyticsCourses: analyticsAnalyticsCourses$2,
 	analyticsAnalyticsFinancialStats: analyticsAnalyticsFinancialStats$2,
+	analyticsAgentScopeLink: analyticsAgentScopeLink$2,
 	analyticsAnalyticsMemoryStats: analyticsAnalyticsMemoryStats$2,
 	analyticsAnalyticsMonetizationStats: analyticsAnalyticsMonetizationStats$2,
 	analyticsAnalyticsOverview: analyticsAnalyticsOverview$2,
@@ -111065,6 +111069,7 @@ var analyticsAnalyticsCourses$1 = {
 	loading: "Cargando...",
 	colCourseName: "Nombre del curso",
 	colCourseId: "ID del curso",
+	openCourseAriaLabel: "Abrir el curso {id} en una pestaña nueva",
 	colEnrollments: "Inscripciones",
 	viewCourseAriaLabel: "Ver detalles de {name}",
 	goToFirstPage: "Ir a la primera página",
@@ -111117,15 +111122,15 @@ var analyticsAnalyticsFinancialStats$1 = {
 	viewTraces: "Trazas →",
 	costByLLMFooter: "{shown} modelos · ordenados por costo"
 };
+var analyticsAgentScopeLink$1 = {
+	scopeToAgent: "Ver analíticas de {name}"
+};
 var analyticsAnalyticsMemoryStats$1 = {
 	noPermission: "No tienes permiso para ver los recuerdos de los usuarios.",
 	scopeLabel: "Alcance de la memoria",
 	scopeMentor: "Este agente",
 	scopeAllMentors: "Todos los agentes",
 	scopeGlobal: "Global",
-	searchAgents: "Buscar agentes…",
-	searchAgentsTitle: "Buscar agentes",
-	clearAgentSearch: "Borrar la búsqueda de agentes",
 	contentPlaceholder: "Buscar en el contenido de los recuerdos",
 	pickDateRange: "Elige un rango de fechas",
 	allCategories: "Todas las categorías",
@@ -111270,6 +111275,7 @@ var analyticsAnalyticsPrograms$1 = {
 	loading: "Cargando...",
 	programName: "Nombre del programa",
 	programId: "ID del programa",
+	openProgramAriaLabel: "Abrir el programa {id} en una pestaña nueva",
 	viewDetailsAriaLabel: "Ver detalles de {name}",
 	goToFirstPage: "Ir a la primera página",
 	goToPreviousPage: "Ir a la página anterior",
@@ -111349,7 +111355,6 @@ var analyticsAnalyticsTranscriptsStats$1 = {
 	labelModel: "Modelo:",
 	labelModelCard: "modelo:",
 	labelUser: "Usuario:",
-	labelUserId: "ID de usuario:",
 	roleUser: "Usuario",
 	roleAgent: "Agente",
 	noMessages: "No hay mensajes en esta conversación.",
@@ -117269,6 +117274,7 @@ var es = {
 	analyticsAnalyticsCourseDetail: analyticsAnalyticsCourseDetail$1,
 	analyticsAnalyticsCourses: analyticsAnalyticsCourses$1,
 	analyticsAnalyticsFinancialStats: analyticsAnalyticsFinancialStats$1,
+	analyticsAgentScopeLink: analyticsAgentScopeLink$1,
 	analyticsAnalyticsMemoryStats: analyticsAnalyticsMemoryStats$1,
 	analyticsAnalyticsMonetizationStats: analyticsAnalyticsMonetizationStats$1,
 	analyticsAnalyticsOverview: analyticsAnalyticsOverview$1,
@@ -118216,6 +118222,7 @@ var analyticsAnalyticsCourses = {
 	loading: "加载中...",
 	colCourseName: "课程名称",
 	colCourseId: "课程 ID",
+	openCourseAriaLabel: "在新标签页中打开课程 {id}",
 	colEnrollments: "注册人数",
 	viewCourseAriaLabel: "查看 {name} 的详情",
 	goToFirstPage: "跳转到第一页",
@@ -118268,15 +118275,15 @@ var analyticsAnalyticsFinancialStats = {
 	viewTraces: "追踪 →",
 	costByLLMFooter: "{shown} 个模型 · 按成本排序"
 };
+var analyticsAgentScopeLink = {
+	scopeToAgent: "查看 {name} 的分析"
+};
 var analyticsAnalyticsMemoryStats = {
 	noPermission: "您没有查看用户记忆的权限。",
 	scopeLabel: "记忆范围",
 	scopeMentor: "当前智能体",
 	scopeAllMentors: "所有智能体",
 	scopeGlobal: "全局",
-	searchAgents: "搜索智能体…",
-	searchAgentsTitle: "搜索智能体",
-	clearAgentSearch: "清除智能体搜索",
 	contentPlaceholder: "搜索记忆内容",
 	pickDateRange: "选择日期范围",
 	allCategories: "所有类别",
@@ -118421,6 +118428,7 @@ var analyticsAnalyticsPrograms = {
 	loading: "加载中...",
 	programName: "项目名称",
 	programId: "项目 ID",
+	openProgramAriaLabel: "在新标签页中打开项目 {id}",
 	viewDetailsAriaLabel: "查看 {name} 的详情",
 	goToFirstPage: "跳至第一页",
 	goToPreviousPage: "跳至上一页",
@@ -118500,7 +118508,6 @@ var analyticsAnalyticsTranscriptsStats = {
 	labelModel: "模型：",
 	labelModelCard: "模型：",
 	labelUser: "用户：",
-	labelUserId: "用户 ID：",
 	roleUser: "用户",
 	roleAgent: "智能体",
 	noMessages: "此对话中没有消息。",
@@ -124420,6 +124427,7 @@ var zh = {
 	analyticsAnalyticsCourseDetail: analyticsAnalyticsCourseDetail,
 	analyticsAnalyticsCourses: analyticsAnalyticsCourses,
 	analyticsAnalyticsFinancialStats: analyticsAnalyticsFinancialStats,
+	analyticsAgentScopeLink: analyticsAgentScopeLink,
 	analyticsAnalyticsMemoryStats: analyticsAnalyticsMemoryStats,
 	analyticsAnalyticsMonetizationStats: analyticsAnalyticsMonetizationStats,
 	analyticsAnalyticsOverview: analyticsAnalyticsOverview,
@@ -218122,7 +218130,7 @@ function MultiSearchSelect({ labels, selected, onSelect, onRemove, searchTerm, o
  */
 function useAgentSearch({ tenantKey, query, limit = 6, offset, starred, featured, category, subjects, llm, types, includeMainPublicMentors, orderDirection, skip = false, }) {
     var _a, _b, _c;
-    const { data, isLoading, isFetching, refetch } = useGetAiSearchMentorsQuery({
+    const { data, isLoading, isFetching, isUninitialized, refetch } = useGetAiSearchMentorsQuery({
         platform_key: tenantKey,
         query: query || undefined,
         limit,
@@ -218146,6 +218154,7 @@ function useAgentSearch({ tenantKey, query, limit = 6, offset, starred, featured
         totalPages: (_c = data === null || data === void 0 ? void 0 : data.total_pages) !== null && _c !== void 0 ? _c : 0,
         isLoading,
         isFetching,
+        isUninitialized,
         refetch,
     };
 }
@@ -226751,29 +226760,60 @@ function SpendLimitsSection({ tenantKey, labels: labelsOverride }) {
     return (jsxs(Fragment$1, { children: [jsxs("div", { "data-testid": "spend-limits-workspace-section", className: "rounded-lg border border-[#e5e5e5] bg-white shadow-[0_1px_2px_0_rgba(0,0,0,0.05)] dark:bg-zinc-900 dark:border-zinc-800", children: [jsx("div", { className: "flex flex-col gap-2 p-4 sm:flex-row sm:items-start sm:justify-between", children: jsxs("div", { className: "space-y-0.5", children: [jsx("h3", { className: "text-[16px] font-medium leading-6 text-[#101828] dark:text-gray-100", children: labels.tenantSections.workspace.title }), jsx("p", { className: "text-[13px] font-normal leading-5 text-[#4a5565] dark:text-gray-400", children: labels.tenantSections.workspace.description })] }) }), jsx("div", { className: "border-t border-[#e5e7eb] dark:border-zinc-800 px-4 py-3", children: isTenantCapLoading ? (jsx("div", { className: "flex items-center justify-center py-8", "data-testid": "tenant-cap-loading", children: jsx(Spinner, {}) })) : isTenantForbidden ? (jsxs("div", { className: "flex flex-col items-center gap-2 rounded-lg border border-gray-200 bg-gray-50 px-4 py-10 text-center", "data-testid": "spend-limits-denied", children: [jsx(ShieldAlert, { className: "h-6 w-6 text-gray-400" }), jsx("p", { className: "text-sm font-medium text-gray-900", children: labels.denied.title }), jsx("p", { className: "max-w-sm text-xs text-gray-600", children: labels.denied.description })] })) : (jsxs("div", { className: "space-y-4", children: [!tenantCap && (monthlySpend != null || totalSpend != null) && (jsxs("div", { className: "space-y-1", "data-testid": "workspace-actual-spend-stats", children: [jsxs("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2", children: [monthlySpend != null && (jsxs("div", { className: "space-y-0.5", children: [jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-[#6a7282] dark:text-gray-400", children: labels.tenantSections.noCapStats.spentThisMonth }), jsx("p", { className: "text-[18px] font-semibold leading-6 text-[#101828] dark:text-gray-100", "data-testid": "workspace-actual-spend-month", children: formatUsd$1(String(monthlySpend)) })] })), totalSpend != null && (jsxs("div", { className: "space-y-0.5", children: [jsx("p", { className: "text-[11px] font-medium uppercase tracking-wide text-[#6a7282] dark:text-gray-400", children: labels.tenantSections.noCapStats.spentAllTime }), jsx("p", { className: "text-[18px] font-semibold leading-6 text-[#101828] dark:text-gray-100", "data-testid": "workspace-actual-spend-total", children: formatUsd$1(String(totalSpend)) })] }))] }), jsx("p", { className: "text-[12px] font-normal leading-4 text-[#6a7282] dark:text-gray-500", children: labels.tenantSections.noCapStats.hint })] })), jsx(SpendCapForm, { labels: labels, cap: tenantCap, isSaving: isSavingTenantCap, isDeleting: isDeletingTenantCap, onSave: saveTenantCap, onDelete: () => setIsDeleteOpen(true), testId: "tenant-cap" })] })) })] }), jsx(Dialog, { open: isDeleteOpen, onOpenChange: () => setIsDeleteOpen(false), children: jsxs(DialogContent, { "aria-describedby": "tenant-cap-delete-description", "data-testid": "tenant-cap-delete-modal", children: [jsx(DialogHeader, { children: jsx(DialogTitle, { className: "ibl-dialog-title", children: labels.deleteModal.title }) }), jsx("div", { className: "my-5", id: "tenant-cap-delete-description", children: jsx("p", { className: "text-sm text-[#646464]", children: labels.deleteModal.description }) }), jsxs(DialogFooter, { className: "gap-3", children: [jsx(Button$1, { variant: "outline", onClick: () => setIsDeleteOpen(false), children: labels.deleteModal.cancel }), jsx(Button$1, { className: "bg-gradient-to-r from-[#2563EB] to-[#93C5FD] text-white hover:opacity-90", onClick: handleConfirmDelete, disabled: isDeletingTenantCap, "data-testid": "tenant-cap-delete-confirm", children: isDeletingTenantCap ? labels.form.removing : labels.deleteModal.confirm })] })] }) })] }));
 }
 
+/** SPAs whose users have coursework, so the profile leads with a Gradebook tab. */
+const GRADEBOOK_SPAS = ['lms', 'skills'];
+/**
+ * The customization `Profile` is opened with: whatever the host passed, with
+ * the Gradebook tab defaulted from the SPA it runs in. An explicit
+ * `showGradebookTab` always wins, so a host can force it either way.
+ */
+function profileCustomization(customization, currentSPA) {
+    var _a;
+    return {
+        ...customization,
+        showGradebookTab: (_a = customization === null || customization === void 0 ? void 0 : customization.showGradebookTab) !== null && _a !== void 0 ? _a : GRADEBOOK_SPAS.includes((currentSPA !== null && currentSPA !== void 0 ? currentSPA : '').trim().toLowerCase()),
+    };
+}
 /**
  * The shared `Profile` viewer in a dialog — the same modal the tenant
  * Management tab opens when a user row is clicked. Controlled variant for
  * hosts that trigger it from a whole table row.
+ *
+ * Radix portals the dialog into `document.body`, but a React portal still
+ * bubbles its events through the React tree — so without the guard below, a
+ * click *inside* the open profile would reach the row this dialog is rendered
+ * from and fire its `onClick` (e.g. opening the enrollment progress modal
+ * behind the profile). The wrapper is `display: contents`, so it adds nothing
+ * to the host's layout.
  */
-function UserProfileDialog({ tenantKey, username, isOpen, onClose }) {
+function UserProfileDialog({ tenantKey, username, isOpen, onClose, customization, currentSPA, }) {
     const t = useT();
     if (!isOpen)
         return null;
-    return (jsx(Dialog, { open: true, onOpenChange: onClose, children: jsxs(DialogContent, { autoFocus: false, className: "profile-component-dialog max-w-7xl w-[85vw] gap-0 overflow-hidden bg-white p-0", style: { height: '85vh', display: 'flex', flexDirection: 'column' }, "data-testid": "user-profile-link-dialog", children: [jsx(DialogTitle, { className: "sr-only", children: t('tabsUserstab.profileDialogTitle') }), jsx(DialogDescription, { className: "sr-only", children: t('tabsUserstab.profileDialogDescription') }), jsx(Profile, { tenant: tenantKey, tenants: [], username: username, onClose: onClose })] }) }));
+    return (jsx("span", { className: "contents", onClick: (event) => event.stopPropagation(), onMouseDown: (event) => event.stopPropagation(), onKeyDown: (event) => event.stopPropagation(), children: jsx(Dialog, { open: true, onOpenChange: onClose, children: jsxs(DialogContent, { autoFocus: false, className: "profile-component-dialog max-w-7xl w-[85vw] gap-0 overflow-hidden bg-white p-0", style: { height: '85vh', display: 'flex', flexDirection: 'column' }, "data-testid": "user-profile-link-dialog", children: [jsx(DialogTitle, { className: "sr-only", children: t('tabsUserstab.profileDialogTitle') }), jsx(DialogDescription, { className: "sr-only", children: t('tabsUserstab.profileDialogDescription') }), jsx(Profile, { tenant: tenantKey, tenants: [], username: username, onClose: onClose, customization: profileCustomization(customization, currentSPA), currentSPA: currentSPA })] }) }) }));
 }
 /**
  * Clickable user identity that opens the shared `Profile` viewer in a dialog
  * — the same modal the tenant Management tab opens when a user row is
- * clicked. Used by the per-user limits table and the user-limit modal.
+ * clicked. `Profile` drops into preview (read-only) mode on its own for anyone
+ * but the signed-in user. Used by the spend-cap tables and every analytics
+ * surface that names a user; safe inside clickable rows and cards, since
+ * neither its clicks nor its key presses reach the host's handlers.
  */
-function UserProfileLink({ tenantKey, username, display, className, testId, }) {
+function UserProfileLink({ tenantKey, username, display, className, testId, customization, currentSPA, }) {
     const t = useT();
     const [isOpen, setIsOpen] = React__default.useState(false);
+    if (!username) {
+        // `inline-block`, or `truncate`'s `overflow: hidden` has nothing to clip:
+        // an inline box takes its width from its own text.
+        return (jsx("span", { className: cn('inline-block max-w-full truncate', className), "data-testid": testId, children: display }));
+    }
     return (jsxs(Fragment$1, { children: [jsx("button", { type: "button", onClick: (event) => {
                     event.stopPropagation();
                     setIsOpen(true);
-                }, className: cn('max-w-full cursor-pointer truncate text-left hover:text-blue-600 hover:underline focus:text-blue-600 focus:outline-none', className), "aria-label": t('tabsUserstab.viewProfileAriaLabel', { name: display }), "data-testid": testId, children: display }), jsx(UserProfileDialog, { tenantKey: tenantKey, username: username, isOpen: isOpen, onClose: () => setIsOpen(false) })] }));
+                }, 
+                // Rows that open on Enter/Space would otherwise swallow the key press.
+                onKeyDown: (event) => event.stopPropagation(), className: cn('max-w-full cursor-pointer truncate text-left hover:text-blue-600 hover:underline focus:text-blue-600 focus:outline-none', className), "aria-label": t('tabsUserstab.viewProfileAriaLabel', { name: display }), "data-testid": testId, children: display }), jsx(UserProfileDialog, { tenantKey: tenantKey, username: username, isOpen: isOpen, onClose: () => setIsOpen(false), customization: customization, currentSPA: currentSPA })] }));
 }
 
 /**
@@ -258095,27 +258135,6 @@ function SheetDescription({ className, ...props }) {
     return (jsx(DialogPrimitive.Description, { "data-slot": "sheet-description", className: cn('text-muted-foreground text-sm', className), ...props }));
 }
 
-function MentorSelectionGrid({ selectedMentorIds, onMentorSelect, searchQuery, onSearchChange, tenantKey, itemsPerPage = 8, showSearch = true, minHeight = '400px', }) {
-    const t = useT();
-    const { agents: mentors, isLoading: isMentorsLoading, isFetching: isMentorsFetching, currentPage, totalPages, setSearchQuery: setMentorSearch, handlePageChange, } = useAgentSearchWithPagination({ tenantKey, itemsPerPage });
-    // Update search query with debounce effect handled by the hook
-    React__default.useEffect(() => {
-        setMentorSearch(searchQuery);
-    }, [searchQuery]);
-    const isMentorSelected = (mentorId) => {
-        return selectedMentorIds.includes(mentorId);
-    };
-    return (jsxs("div", { className: "space-y-4", children: [showSearch && (jsxs("div", { className: "relative", children: [isMentorsFetching ? (jsx(Spinner, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 transform text-gray-400" })) : (jsx(Search, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 transform text-gray-400" })), jsx(Input, { placeholder: t('mentorsMentorSelectionGrid.searchAgentsPlaceholder'), value: searchQuery, onChange: (e) => onSearchChange(e.target.value), className: "h-10 border-gray-200 pl-10 focus:border-blue-500 focus:ring-0" })] })), jsxs("div", { className: "space-y-4", children: [jsx("div", { className: "grid max-h-96 auto-rows-min grid-cols-1 items-start gap-3 overflow-y-auto rounded-lg border border-gray-200 p-4 md:max-h-none md:grid-cols-2", style: { minHeight }, children: isMentorsLoading ? (jsx("div", { className: "col-span-full py-8 text-center text-gray-500", children: t('mentorsMentorSelectionGrid.loadingAgents') })) : mentors.length === 0 ? (jsx("div", { className: "col-span-full py-8 text-center text-gray-500", children: t('mentorsMentorSelectionGrid.noAgentsFound') })) : (mentors.map((mentor) => {
-                            const isSelected = isMentorSelected(mentor.unique_id || '');
-                            const isAlreadyAdded = selectedMentorIds.includes(mentor.unique_id || '');
-                            return (jsxs("button", { onClick: () => onMentorSelect(mentor), className: `flex cursor-pointer items-center gap-3 rounded-lg border-2 p-3 transition-all ${isSelected
-                                    ? 'border-blue-500 bg-blue-50'
-                                    : isAlreadyAdded
-                                        ? 'bg-blue-25 border-blue-300'
-                                        : 'border-gray-200 hover:border-gray-300 hover:bg-gray-50'}`, children: [jsxs(Avatar, { className: "h-12 w-12 flex-shrink-0", children: [jsx(AvatarImage, { src: mentor.profile_image || '/placeholder.svg', alt: mentor.name }), jsx(AvatarFallback, { children: mentor.name.substring(0, 2) })] }), jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-start text-left", children: [jsx("h4", { className: "truncate text-sm font-medium text-gray-900", children: mentor.name }), jsx("p", { className: "line-clamp-2 text-xs text-gray-600", children: mentor.description })] }), isSelected && (jsx("div", { className: "flex-shrink-0", children: jsx("div", { className: "flex h-6 w-6 items-center justify-center rounded-full bg-blue-600", children: jsx(Check, { className: "h-4 w-4 text-white" }) }) })), isAlreadyAdded && !isSelected && (jsx("div", { className: "flex-shrink-0", children: jsx("div", { className: "flex h-6 w-6 items-center justify-center rounded-full bg-blue-400", children: jsx(Check, { className: "h-4 w-4 text-white" }) }) }))] }, mentor.unique_id));
-                        })) }), jsx(IblPagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: handlePageChange, disabled: isMentorsFetching || isMentorsLoading })] })] }));
-}
-
 const SkeletonMultiplier = ({ Skeleton, multiplier }) => {
     return (jsx(Fragment$1, { children: Array.from({ length: multiplier }).map((_, index) => (jsx(Skeleton, {}, index))) }));
 };
@@ -262507,6 +262526,27 @@ var minimumMentorAlert = /*#__PURE__*/Object.freeze({
     MinimumMentorAlert: MinimumMentorAlert
 });
 
+function MentorSelectionGrid({ selectedMentorIds, onMentorSelect, searchQuery, onSearchChange, tenantKey, itemsPerPage = 8, showSearch = true, minHeight = '400px', }) {
+    const t = useT();
+    const { agents: mentors, isLoading: isMentorsLoading, isFetching: isMentorsFetching, currentPage, totalPages, setSearchQuery: setMentorSearch, handlePageChange, } = useAgentSearchWithPagination({ tenantKey, itemsPerPage });
+    // Update search query with debounce effect handled by the hook
+    React__default.useEffect(() => {
+        setMentorSearch(searchQuery);
+    }, [searchQuery]);
+    const isMentorSelected = (mentorId) => {
+        return selectedMentorIds.includes(mentorId);
+    };
+    return (jsxs("div", { className: "space-y-4", children: [showSearch && (jsxs("div", { className: "relative", children: [isMentorsFetching ? (jsx(Spinner, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 transform text-gray-400" })) : (jsx(Search, { className: "absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 transform text-gray-400" })), jsx(Input, { placeholder: t('mentorsMentorSelectionGrid.searchAgentsPlaceholder'), value: searchQuery, onChange: (e) => onSearchChange(e.target.value), className: "h-10 border-gray-200 pl-10 focus:border-blue-500 focus:ring-0" })] })), jsxs("div", { className: "space-y-4", children: [jsx("div", { className: "grid max-h-96 auto-rows-min grid-cols-1 items-start gap-3 overflow-y-auto rounded-lg border border-gray-200 p-4 md:max-h-none md:grid-cols-2", style: { minHeight }, children: isMentorsLoading ? (jsx("div", { className: "col-span-full py-8 text-center text-gray-500", children: t('mentorsMentorSelectionGrid.loadingAgents') })) : mentors.length === 0 ? (jsx("div", { className: "col-span-full py-8 text-center text-gray-500", children: t('mentorsMentorSelectionGrid.noAgentsFound') })) : (mentors.map((mentor) => {
+                            const isSelected = isMentorSelected(mentor.unique_id || '');
+                            const isAlreadyAdded = selectedMentorIds.includes(mentor.unique_id || '');
+                            return (jsxs("button", { onClick: () => onMentorSelect(mentor), className: `flex cursor-pointer items-center gap-3 rounded-lg border-2 p-3 transition-all ${isSelected
+                                    ? 'border-blue-500 bg-blue-50'
+                                    : isAlreadyAdded
+                                        ? 'bg-blue-25 border-blue-300'
+                                        : 'border-gray-200 hover:border-gray-300 hover:bg-gray-50'}`, children: [jsxs(Avatar, { className: "h-12 w-12 flex-shrink-0", children: [jsx(AvatarImage, { src: mentor.profile_image || '/placeholder.svg', alt: mentor.name }), jsx(AvatarFallback, { children: mentor.name.substring(0, 2) })] }), jsxs("div", { className: "flex min-w-0 flex-1 flex-col justify-start text-left", children: [jsx("h4", { className: "truncate text-sm font-medium text-gray-900", children: mentor.name }), jsx("p", { className: "line-clamp-2 text-xs text-gray-600", children: mentor.description })] }), isSelected && (jsx("div", { className: "flex-shrink-0", children: jsx("div", { className: "flex h-6 w-6 items-center justify-center rounded-full bg-blue-600", children: jsx(Check, { className: "h-4 w-4 text-white" }) }) })), isAlreadyAdded && !isSelected && (jsx("div", { className: "flex-shrink-0", children: jsx("div", { className: "flex h-6 w-6 items-center justify-center rounded-full bg-blue-400", children: jsx(Check, { className: "h-4 w-4 text-white" }) }) }))] }, mentor.unique_id));
+                        })) }), jsx(IblPagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: handlePageChange, disabled: isMentorsFetching || isMentorsLoading })] })] }));
+}
+
 function CreateProjectModal$1({ isOpen, onClose, tenantKey, username, navigateToMentorInProject, }) {
     const t = useT();
     const dispatch = useDispatch();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iblai/iblai-js",
-  "version": "2.14.0",
+  "version": "2.15.0",
   "description": "Unified JavaScript SDK for IBL.ai — re-exports data-layer, web-containers, and web-utils under a single package",
   "type": "module",
   "engines": {
@@ -76,9 +76,9 @@
     "axios": "1.13.6",
     "dotenv": "16.6.1",
     "winston": "3.19.0",
-    "@iblai/data-layer": "1.16.0",
-    "@iblai/mcp": "1.13.1",
-    "@iblai/web-containers": "1.22.0",
+    "@iblai/mcp": "1.14.0",
+    "@iblai/data-layer": "1.17.0",
+    "@iblai/web-containers": "1.23.0",
     "@iblai/web-utils": "2.4.8"
   },
   "peerDependencies": {