@sesionario/blocks 1.40.0 → 1.41.0-rc.1

package/dist/index.cjs

@@ -7228,14 +7228,26 @@ function ChatMessageList({
   messages,
   currentUserId,
   emptyTitle = "Sin mensajes",
-  emptyDescription = "Escribe para iniciar la conversaci\xF3n."
+  emptyDescription = "Escribe para iniciar la conversaci\xF3n.",
+  compactEmpty = false
 }) {
   if (messages.length === 0) {
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-2 p-6 text-center", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircleDashedIcon, { className: "size-8 text-muted-foreground" }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: emptyTitle }),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: emptyDescription })
-    ] });
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: compactEmpty ? "flex h-full flex-col items-center justify-center gap-1 px-4 py-3 text-center" : "flex h-full flex-col items-center justify-center gap-2 p-6 text-center",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            lucideReact.MessageCircleDashedIcon,
+            {
+              className: compactEmpty ? "size-5 text-muted-foreground" : "size-8 text-muted-foreground"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-medium", children: emptyTitle }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground", children: emptyDescription })
+        ]
+      }
+    );
   }
   return /* @__PURE__ */ jsxRuntime.jsx(MessageScrollerProvider, { autoScroll: true, children: /* @__PURE__ */ jsxRuntime.jsxs(MessageScroller, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(MessageScrollerViewport, { children: /* @__PURE__ */ jsxRuntime.jsx(MessageScrollerContent, { className: "gap-4 p-4", children: messages.map((m) => {
@@ -7578,7 +7590,7 @@ function ThreadPanel({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 border-b px-2 py-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 border-b bg-primary/10 px-2 py-2", children: [
           showBack && onBack ? /* @__PURE__ */ jsxRuntime.jsx(
             Button,
             {
@@ -7590,7 +7602,24 @@ function ThreadPanel({
               children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, { className: "size-4" })
             }
           ) : null,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: "flex size-8 shrink-0 items-center justify-center overflow-hidden rounded-full bg-primary text-[11px] font-semibold text-primary-foreground",
+              style: thread.avatarUrl ? void 0 : avatarFallbackStyle(thread.title),
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                SafeImage,
+                {
+                  src: thread.avatarUrl,
+                  alt: "",
+                  className: "size-full object-cover",
+                  fallback: getInitials(thread.eyebrow ?? thread.title)
+                }
+              )
+            }
+          ),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1 px-1", children: [
+            thread.eyebrow ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-[11px] font-semibold tracking-wide text-primary", children: thread.eyebrow }) : null,
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-sm font-semibold", children: thread.title }),
             thread.subtitle ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-xs text-muted-foreground", children: thread.subtitle }) : null
           ] }),
@@ -7611,7 +7640,8 @@ function ThreadPanel({
           {
             messages,
             currentUserId,
-            emptyDescription: labels.emptyThread
+            emptyDescription: labels.emptyThread,
+            compactEmpty: true
           }
         ) }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t p-3", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -7662,7 +7692,7 @@ function ListPanel({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between border-b bg-primary/10 px-3 py-2", children: [
           /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold", children: labels.listTitle }),
           /* @__PURE__ */ jsxRuntime.jsx(
             Button,
@@ -7699,7 +7729,7 @@ function ListPanel({
             }
           )
         ] }) }) : null,
-        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "min-h-0 flex-1 overflow-y-auto p-1", children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("li", { className: "px-3 py-8 text-center text-sm text-muted-foreground", children: labels.emptyList }) : filtered.map((item) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "min-h-0 flex-1 overflow-y-auto p-1", children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("li", { className: "px-3 py-4 text-center text-xs text-muted-foreground", children: labels.emptyList }) : filtered.map((item) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsxs(
           "button",
           {
             type: "button",
@@ -7723,6 +7753,7 @@ function ListPanel({
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "min-w-0 flex-1", children: [
+                item.eyebrow ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block truncate text-[11px] font-semibold tracking-wide text-primary", children: item.eyebrow }) : null,
                 /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block truncate text-sm font-medium", children: item.title }),
                 item.subtitle ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block truncate text-xs text-muted-foreground", children: item.subtitle }) : null
               ] }),
@@ -7848,6 +7879,8 @@ function SupportMessengerProvider({
         key: item.key,
         title: item.title,
         subtitle: item.subtitle,
+        eyebrow: item.eyebrow,
+        avatarUrl: item.avatarUrl,
         conversationId: item.conversationId,
         open: item.open
       });