@algenium/blocks 1.2.0-rc.1 → 1.2.0-rc.2

package/dist/index.js

@@ -6118,7 +6118,8 @@ function ChatSidebarProvider({
         if (conv && conv.rooms.length === 1) {
           setActiveRoomId(conv.rooms[0].id);
           setView("chat");
-        } else if (conv && conv.rooms.length > 1) {
+        } else {
+          setActiveRoomId(null);
           setView("list");
         }
       }
@@ -6792,17 +6793,35 @@ function ChatSidebar({
     selectRoom,
     back
   } = useChatSidebar();
+  useEffect(() => {
+    if (!isOpen || typeof window === "undefined") return;
+    const mq = window.matchMedia("(max-width: 639px)");
+    const apply = () => {
+      if (mq.matches) document.body.style.overflow = "hidden";
+      else document.body.style.overflow = "";
+    };
+    apply();
+    mq.addEventListener("change", apply);
+    return () => {
+      mq.removeEventListener("change", apply);
+      document.body.style.overflow = "";
+    };
+  }, [isOpen]);
   if (!isOpen) return null;
   const getRoomTypeLabel = (type) => {
     if (roomTypeLabel) return roomTypeLabel(type);
     return roomTypeLabels[type] ?? type;
   };
   const activeConversation = activeCaseId ? conversations.find((c) => c.caseId === activeCaseId) : null;
-  return /* @__PURE__ */ jsx(
+  const panel = /* @__PURE__ */ jsx(
     "div",
     {
       className: cn(
-        "flex h-full w-[360px] flex-col border-l bg-background xl:w-[400px]",
+        "flex min-h-0 flex-col bg-background",
+        // Below sm (~640px): fullscreen overlay drawer above sticky app headers (often z-50)
+        "fixed inset-0 z-[100] w-full max-w-none border-0 shadow-none",
+        // sm+: docked right sidebar in the app shell flex row
+        "sm:relative sm:inset-auto sm:z-auto sm:h-full sm:w-[360px] sm:max-w-[360px] sm:shrink-0 sm:border-l sm:shadow-none xl:w-[400px] xl:max-w-[400px]",
         className
       ),
       children: view === "list" ? /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -6897,6 +6916,17 @@ function ChatSidebar({
       ] })
     }
   );
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "fixed inset-0 z-[90] bg-black/50 sm:hidden",
+        "aria-hidden": true,
+        onClick: close
+      }
+    ),
+    panel
+  ] });
 }
 function formatRelativeTime(dateStr) {
   const date = new Date(dateStr);