@sesionario/blocks 1.40.0 → 1.41.0-rc.1

package/dist/index.d.cts

@@ -1264,8 +1264,10 @@ type ChatMessageListProps = {
     currentUserId: string | null;
     emptyTitle?: string;
     emptyDescription?: string;
+    /** Tighter empty state for the support dock. */
+    compactEmpty?: boolean;
 };
-declare function ChatMessageList({ messages, currentUserId, emptyTitle, emptyDescription, }: ChatMessageListProps): React.JSX.Element;
+declare function ChatMessageList({ messages, currentUserId, emptyTitle, emptyDescription, compactEmpty, }: ChatMessageListProps): React.JSX.Element;
 
 type MessageComposerProps = Omit<React.ComponentProps<"textarea">, "children" | "onSubmit"> & EmojiFieldSharedProps & {
     /** Label for the submit button (e.g. "Enviar"). */
@@ -1343,6 +1345,8 @@ type SupportMessengerItem = {
     key: string;
     title: string;
     subtitle?: string;
+    /** Short name shown above the title (support desk persona). */
+    eyebrow?: string;
     avatarUrl?: string | null;
     unreadCount?: number;
     conversationId?: string | null;
@@ -1369,6 +1373,8 @@ type OpenThreadRequest = {
     key: string;
     title: string;
     subtitle?: string;
+    eyebrow?: string;
+    avatarUrl?: string | null;
     conversationId?: string | null;
     open?: FindOrCreateConversationInput;
 };

package/dist/index.d.ts

@@ -1264,8 +1264,10 @@ type ChatMessageListProps = {
     currentUserId: string | null;
     emptyTitle?: string;
     emptyDescription?: string;
+    /** Tighter empty state for the support dock. */
+    compactEmpty?: boolean;
 };
-declare function ChatMessageList({ messages, currentUserId, emptyTitle, emptyDescription, }: ChatMessageListProps): React.JSX.Element;
+declare function ChatMessageList({ messages, currentUserId, emptyTitle, emptyDescription, compactEmpty, }: ChatMessageListProps): React.JSX.Element;
 
 type MessageComposerProps = Omit<React.ComponentProps<"textarea">, "children" | "onSubmit"> & EmojiFieldSharedProps & {
     /** Label for the submit button (e.g. "Enviar"). */
@@ -1343,6 +1345,8 @@ type SupportMessengerItem = {
     key: string;
     title: string;
     subtitle?: string;
+    /** Short name shown above the title (support desk persona). */
+    eyebrow?: string;
     avatarUrl?: string | null;
     unreadCount?: number;
     conversationId?: string | null;
@@ -1369,6 +1373,8 @@ type OpenThreadRequest = {
     key: string;
     title: string;
     subtitle?: string;
+    eyebrow?: string;
+    avatarUrl?: string | null;
     conversationId?: string | null;
     open?: FindOrCreateConversationInput;
 };

package/dist/index.js

@@ -7197,14 +7197,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__ */ jsxs("div", { className: "flex h-full flex-col items-center justify-center gap-2 p-6 text-center", children: [
-      /* @__PURE__ */ jsx(MessageCircleDashedIcon, { className: "size-8 text-muted-foreground" }),
-      /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: emptyTitle }),
-      /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: emptyDescription })
-    ] });
+    return /* @__PURE__ */ 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__ */ jsx(
+            MessageCircleDashedIcon,
+            {
+              className: compactEmpty ? "size-5 text-muted-foreground" : "size-8 text-muted-foreground"
+            }
+          ),
+          /* @__PURE__ */ jsx("p", { className: "text-sm font-medium", children: emptyTitle }),
+          /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: emptyDescription })
+        ]
+      }
+    );
   }
   return /* @__PURE__ */ jsx(MessageScrollerProvider, { autoScroll: true, children: /* @__PURE__ */ jsxs(MessageScroller, { children: [
     /* @__PURE__ */ jsx(MessageScrollerViewport, { children: /* @__PURE__ */ jsx(MessageScrollerContent, { className: "gap-4 p-4", children: messages.map((m) => {
@@ -7547,7 +7559,7 @@ function ThreadPanel({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 border-b px-2 py-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 border-b bg-primary/10 px-2 py-2", children: [
           showBack && onBack ? /* @__PURE__ */ jsx(
             Button,
             {
@@ -7559,7 +7571,24 @@ function ThreadPanel({
               children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4" })
             }
           ) : null,
+          /* @__PURE__ */ 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__ */ jsx(
+                SafeImage,
+                {
+                  src: thread.avatarUrl,
+                  alt: "",
+                  className: "size-full object-cover",
+                  fallback: getInitials(thread.eyebrow ?? thread.title)
+                }
+              )
+            }
+          ),
           /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 px-1", children: [
+            thread.eyebrow ? /* @__PURE__ */ jsx("p", { className: "truncate text-[11px] font-semibold tracking-wide text-primary", children: thread.eyebrow }) : null,
             /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-semibold", children: thread.title }),
             thread.subtitle ? /* @__PURE__ */ jsx("p", { className: "truncate text-xs text-muted-foreground", children: thread.subtitle }) : null
           ] }),
@@ -7580,7 +7609,8 @@ function ThreadPanel({
           {
             messages,
             currentUserId,
-            emptyDescription: labels.emptyThread
+            emptyDescription: labels.emptyThread,
+            compactEmpty: true
           }
         ) }),
         /* @__PURE__ */ jsx("div", { className: "border-t p-3", children: /* @__PURE__ */ jsx(
@@ -7631,7 +7661,7 @@ function ListPanel({
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b px-3 py-2", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-b bg-primary/10 px-3 py-2", children: [
           /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold", children: labels.listTitle }),
           /* @__PURE__ */ jsx(
             Button,
@@ -7668,7 +7698,7 @@ function ListPanel({
             }
           )
         ] }) }) : null,
-        /* @__PURE__ */ jsx("ul", { className: "min-h-0 flex-1 overflow-y-auto p-1", children: filtered.length === 0 ? /* @__PURE__ */ jsx("li", { className: "px-3 py-8 text-center text-sm text-muted-foreground", children: labels.emptyList }) : filtered.map((item) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+        /* @__PURE__ */ jsx("ul", { className: "min-h-0 flex-1 overflow-y-auto p-1", children: filtered.length === 0 ? /* @__PURE__ */ jsx("li", { className: "px-3 py-4 text-center text-xs text-muted-foreground", children: labels.emptyList }) : filtered.map((item) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
           "button",
           {
             type: "button",
@@ -7692,6 +7722,7 @@ function ListPanel({
                 }
               ),
               /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
+                item.eyebrow ? /* @__PURE__ */ jsx("span", { className: "block truncate text-[11px] font-semibold tracking-wide text-primary", children: item.eyebrow }) : null,
                 /* @__PURE__ */ jsx("span", { className: "block truncate text-sm font-medium", children: item.title }),
                 item.subtitle ? /* @__PURE__ */ jsx("span", { className: "block truncate text-xs text-muted-foreground", children: item.subtitle }) : null
               ] }),
@@ -7817,6 +7848,8 @@ function SupportMessengerProvider({
         key: item.key,
         title: item.title,
         subtitle: item.subtitle,
+        eyebrow: item.eyebrow,
+        avatarUrl: item.avatarUrl,
         conversationId: item.conversationId,
         open: item.open
       });