@linktr.ee/messaging-react 1.11.5-rc-1765005296 → 1.11.5-rc-1765086958

package/dist/index.js

@@ -1,11 +1,11 @@
-import { jsx as e, jsxs as i, Fragment as fe } from "react/jsx-runtime";
-import p from "classnames";
-import L, { createContext as De, useContext as Me, useCallback as M, useState as v, useRef as $, useEffect as G } from "react";
-import { StreamChatService as Fe } from "@linktr.ee/messaging-core";
-import { Chat as Pe, ChannelList as Te, useMessageComposer as Le, useStateStore as Ue, MessageInput as Oe, useMessageInputContext as je, useMessageComposerHasSendableData as Be, SimpleAttachmentSelector as Ae, QuotedMessagePreview as ze, AttachmentPreviewList as $e, TextareaComposer as Ge, MessageTimestamp as He, Channel as Ve, useChannelStateContext as ge, Window as We, MessageList as Ze } from "stream-chat-react";
-import { XIcon as ae, ArrowUpIcon as qe, ArrowLeftIcon as ie, DotsThreeIcon as ce, SpinnerGapIcon as se, SignOutIcon as Ye, ProhibitInsetIcon as de, FlagIcon as Je, MagnifyingGlassIcon as Qe, ChatCircleDotsIcon as ue } from "@phosphor-icons/react";
-import { LinkPreviewsManager as me } from "stream-chat";
-const xe = De({
+import { jsx as e, jsxs as i, Fragment as ge } from "react/jsx-runtime";
+import R from "classnames";
+import L, { createContext as Fe, useContext as Pe, useCallback as _, useState as v, useRef as z, useEffect as G } from "react";
+import { StreamChatService as Te } from "@linktr.ee/messaging-core";
+import { Chat as Le, ChannelList as Ue, useMessageComposer as Oe, useStateStore as je, MessageInput as Be, useMessageInputContext as Ae, useMessageComposerHasSendableData as ze, SimpleAttachmentSelector as $e, QuotedMessagePreview as Ge, AttachmentPreviewList as He, TextareaComposer as Ve, MessageTimestamp as We, Channel as Ze, useChannelStateContext as xe, Window as qe, MessageList as Ye } from "stream-chat-react";
+import { XIcon as oe, ArrowUpIcon as Je, ArrowLeftIcon as ce, DotsThreeIcon as de, SpinnerGapIcon as se, SignOutIcon as Qe, ProhibitInsetIcon as ue, FlagIcon as Xe, MagnifyingGlassIcon as Ke, ChatCircleDotsIcon as me } from "@phosphor-icons/react";
+import { LinkPreviewsManager as he } from "stream-chat";
+const Ce = Fe({
   service: null,
   client: null,
   isConnected: !1,
@@ -15,7 +15,7 @@ const xe = De({
   refreshConnection: async () => {
   },
   debug: !1
-}), ne = () => Me(xe), ks = ({
+}), ne = () => Pe(Ce), Ss = ({
   children: t,
   user: s,
   serviceConfig: n,
@@ -23,9 +23,9 @@ const xe = De({
   capabilities: a = {},
   debug: o = !1
 }) => {
-  const l = M(
-    (u, ...x) => {
-      o && console.log(`🔥 [MessagingProvider] ${u}`, ...x);
+  const l = _(
+    (m, ...N) => {
+      o && console.log(`🔥 [MessagingProvider] ${m}`, ...N);
     },
     [o]
   );
@@ -35,14 +35,14 @@ const xe = De({
     serviceConfig: !!n,
     capabilities: Object.keys(a)
   });
-  const [c, m] = v(null), [g, y] = v(null), [h, f] = v(!1), [S, b] = v(!1), [w, E] = v(null), N = $(!1), I = $({
+  const [d, h] = v(null), [b, k] = v(null), [u, f] = v(!1), [g, w] = v(!1), [y, E] = v(null), C = z(!1), I = z({
     userId: s == null ? void 0 : s.id,
     apiKey: r,
     serviceConfig: n,
     capabilities: a
-  }), k = $(0);
-  k.current++, l("📊 RENDER INFO", {
-    renderCount: k.current,
+  }), p = z(0);
+  p.current++, l("📊 RENDER INFO", {
+    renderCount: p.current,
     currentProps: { userId: s == null ? void 0 : s.id, apiKey: (r == null ? void 0 : r.substring(0, 8)) + "..." },
     propChanges: {
       userChanged: I.current.userId !== (s == null ? void 0 : s.id),
@@ -56,9 +56,9 @@ const xe = De({
     serviceConfig: n,
     capabilities: a
   }, G(() => {
-    const u = k.current;
+    const m = p.current;
     if (l("🔧 SERVICE INIT EFFECT TRIGGERED", {
-      renderCount: u,
+      renderCount: m,
       apiKey: !!r,
       serviceConfig: !!n,
       dependencies: {
@@ -69,50 +69,50 @@ const xe = De({
       }
     }), !r || !n) {
       l("⚠️ SERVICE INIT SKIPPED", {
-        renderCount: u,
+        renderCount: m,
         reason: "Missing apiKey or serviceConfig"
       });
       return;
     }
     l("🚀 CREATING NEW SERVICE", {
-      renderCount: u,
+      renderCount: m,
       apiKey: (r == null ? void 0 : r.substring(0, 8)) + "...",
       serviceConfigChanged: I.current.serviceConfig !== n
     });
-    const x = new Fe({
+    const N = new Te({
       ...n,
       apiKey: r,
       debug: o
     });
-    return m(x), l("✅ SERVICE SET", {
-      renderCount: u,
-      serviceInstance: !!x
+    return h(N), l("✅ SERVICE SET", {
+      renderCount: m,
+      serviceInstance: !!N
     }), () => {
       l("🧹 SERVICE CLEANUP", {
-        renderCount: u,
+        renderCount: m,
         reason: "Effect cleanup"
-      }), x.disconnectUser().catch(console.error);
+      }), N.disconnectUser().catch(console.error);
     };
   }, [r, n, o, l]);
-  const R = $(null);
+  const S = z(null);
   G(() => {
-    var x, A;
+    var N, A;
     if (l("🔗 USER CONNECTION EFFECT TRIGGERED", {
-      hasService: !!c,
+      hasService: !!d,
       hasUser: !!s,
       userId: s == null ? void 0 : s.id,
-      isConnecting: N.current,
-      isConnected: h,
-      dependencies: { service: !!c, userId: s == null ? void 0 : s.id }
-    }), !c || !s) {
+      isConnecting: C.current,
+      isConnected: u,
+      dependencies: { service: !!d, userId: s == null ? void 0 : s.id }
+    }), !d || !s) {
       l("⚠️ USER CONNECTION SKIPPED", "Missing service or user");
       return;
     }
-    if (N.current) {
+    if (C.current) {
       l("⚠️ USER CONNECTION SKIPPED", "Already connecting");
       return;
     }
-    if (((x = R.current) == null ? void 0 : x.serviceId) === c && ((A = R.current) == null ? void 0 : A.userId) === s.id) {
+    if (((N = S.current) == null ? void 0 : N.serviceId) === d && ((A = S.current) == null ? void 0 : A.userId) === s.id) {
       l(
         "⚠️ USER CONNECTION SKIPPED",
         "Already connected this user with this service"
@@ -120,114 +120,114 @@ const xe = De({
       return;
     }
     (async () => {
-      l("🚀 STARTING USER CONNECTION", { userId: s.id }), N.current = !0, b(!0), E(null);
+      l("🚀 STARTING USER CONNECTION", { userId: s.id }), C.current = !0, w(!0), E(null);
       try {
         l("📞 CALLING SERVICE.CONNECTUSER", { userId: s.id });
-        const z = await c.connectUser(s);
-        y(z), f(!0), R.current = { serviceId: c, userId: s.id }, l("✅ USER CONNECTION SUCCESS", {
+        const j = await d.connectUser(s);
+        k(j), f(!0), S.current = { serviceId: d, userId: s.id }, l("✅ USER CONNECTION SUCCESS", {
           userId: s.id,
-          clientId: z.userID
+          clientId: j.userID
         });
-      } catch (z) {
-        const Z = z instanceof Error ? z.message : "Connection failed";
-        E(Z), l("❌ USER CONNECTION ERROR", {
+      } catch (j) {
+        const H = j instanceof Error ? j.message : "Connection failed";
+        E(H), l("❌ USER CONNECTION ERROR", {
           userId: s.id,
-          error: Z
+          error: H
         });
       } finally {
-        b(!1), N.current = !1, l("🔄 USER CONNECTION FINISHED", {
+        w(!1), C.current = !1, l("🔄 USER CONNECTION FINISHED", {
           userId: s.id,
-          isConnected: h
+          isConnected: u
         });
       }
     })();
-  }, [c, s, l, h]), G(() => (l("🔌 CLEANUP EFFECT REGISTERED", {
-    hasService: !!c,
-    isConnected: h
+  }, [d, s, l, u]), G(() => (l("🔌 CLEANUP EFFECT REGISTERED", {
+    hasService: !!d,
+    isConnected: u
   }), () => {
-    c && h ? (l(
+    d && u ? (l(
       "🧹 CLEANUP EFFECT TRIGGERED",
       "Cleaning up connection on unmount"
-    ), R.current = null, c.disconnectUser().catch(console.error)) : l("🔇 CLEANUP EFFECT SKIPPED", {
-      hasService: !!c,
-      isConnected: h
+    ), S.current = null, d.disconnectUser().catch(console.error)) : l("🔇 CLEANUP EFFECT SKIPPED", {
+      hasService: !!d,
+      isConnected: u
     });
-  }), [c, h, l]);
-  const F = M(async () => {
+  }), [d, u, l]);
+  const P = _(async () => {
     if (l("🔄 REFRESH CONNECTION CALLED", {
-      hasService: !!c,
+      hasService: !!d,
       hasUser: !!s
-    }), !c || !s) {
+    }), !d || !s) {
       l("⚠️ REFRESH CONNECTION SKIPPED", "Missing service or user");
       return;
     }
-    l("🚀 STARTING CONNECTION REFRESH", { userId: s.id }), b(!0);
+    l("🚀 STARTING CONNECTION REFRESH", { userId: s.id }), w(!0);
     try {
-      l("🔌 DISCONNECTING FOR REFRESH"), await c.disconnectUser(), l("📞 RECONNECTING FOR REFRESH");
-      const u = await c.connectUser(s);
-      y(u), f(!0), E(null), l("✅ CONNECTION REFRESH SUCCESS", { userId: s.id });
-    } catch (u) {
-      const x = u instanceof Error ? u.message : "Refresh failed";
-      E(x), l("❌ CONNECTION REFRESH ERROR", {
+      l("🔌 DISCONNECTING FOR REFRESH"), await d.disconnectUser(), l("📞 RECONNECTING FOR REFRESH");
+      const m = await d.connectUser(s);
+      k(m), f(!0), E(null), l("✅ CONNECTION REFRESH SUCCESS", { userId: s.id });
+    } catch (m) {
+      const N = m instanceof Error ? m.message : "Refresh failed";
+      E(N), l("❌ CONNECTION REFRESH ERROR", {
         userId: s.id,
-        error: x
+        error: N
       });
     } finally {
-      b(!1), l("🔄 CONNECTION REFRESH FINISHED", { userId: s.id });
+      w(!1), l("🔄 CONNECTION REFRESH FINISHED", { userId: s.id });
     }
-  }, [c, s, l]), d = L.useMemo(() => (l("💫 CONTEXT VALUE MEMOIZATION", {
-    hasService: !!c,
-    hasClient: !!g,
-    isConnected: h,
-    isLoading: S,
-    hasError: !!w,
+  }, [d, s, l]), c = L.useMemo(() => (l("💫 CONTEXT VALUE MEMOIZATION", {
+    hasService: !!d,
+    hasClient: !!b,
+    isConnected: u,
+    isLoading: g,
+    hasError: !!y,
     capabilitiesKeys: Object.keys(a)
   }), {
-    service: c,
-    client: g,
-    isConnected: h,
-    isLoading: S,
-    error: w,
+    service: d,
+    client: b,
+    isConnected: u,
+    isLoading: g,
+    error: y,
     capabilities: a,
-    refreshConnection: F,
+    refreshConnection: P,
     debug: o
   }), [
-    c,
+    d,
+    b,
+    u,
     g,
-    h,
-    S,
-    w,
+    y,
     a,
-    F,
+    P,
     o,
     l
   ]);
   return l("🔄 RENDER END", {
-    renderCount: k.current,
-    willRenderChat: !!(g && h),
-    contextValueReady: !!d
-  }), /* @__PURE__ */ e(xe.Provider, { value: d, children: g && h ? /* @__PURE__ */ e(
-    Pe,
+    renderCount: p.current,
+    willRenderChat: !!(b && u),
+    contextValueReady: !!c
+  }), /* @__PURE__ */ e(Ce.Provider, { value: c, children: b && u ? /* @__PURE__ */ e(
+    Le,
     {
-      client: g,
+      client: b,
       customClasses: {
         channelList: "str-chat__channel-list str-chat__channel-list-react bg-transparent lg:border-r-2 border-r-0 border-[#0000000A]"
       },
       children: t
     }
   ) : t });
-}, Xe = () => ne(), Ke = (t, s) => {
+}, es = () => ne(), ss = (t, s) => {
   const n = new Date(
     Date.UTC(t.getUTCFullYear(), t.getUTCMonth(), t.getUTCDate())
   ), a = new Date(
     Date.UTC(s.getUTCFullYear(), s.getUTCMonth(), s.getUTCDate())
   ).getTime() - n.getTime();
   return Math.floor(a / (1e3 * 60 * 60 * 24));
-}, es = (t) => {
+}, ts = (t) => {
   const s = /* @__PURE__ */ new Date();
   if (Math.floor((s.getTime() - t.getTime()) / 1e3) < 60)
     return "Just now";
-  const r = Ke(t, s);
+  const r = ss(t, s);
   return r === 0 ? t.toLocaleTimeString([], {
     hour: "numeric",
     minute: "2-digit"
@@ -236,7 +236,7 @@ const xe = De({
     day: "numeric",
     year: "2-digit"
   });
-}, he = [
+}, fe = [
   "🍎",
   // Apple
   "🍌",
@@ -264,7 +264,7 @@ const xe = De({
   "🍈"
   // Melon
 ];
-function ss(t) {
+function ns(t) {
   let s = 0;
   for (let n = 0; n < t.length; n++) {
     const r = t.charCodeAt(n);
@@ -272,29 +272,29 @@ function ss(t) {
   }
   return Math.abs(s);
 }
-function ts(t) {
-  const n = ss(t) % he.length;
-  return he[n];
+function rs(t) {
+  const n = ns(t) % fe.length;
+  return fe[n];
 }
-const q = ({
+const Z = ({
   id: t,
   image: s,
   size: n = 40,
   className: r,
   shape: a = "squircle"
 }) => {
-  const o = ts(t), c = n < 32 ? "text-xs" : n < 56 ? "text-sm" : "text-lg", m = a === "circle" ? { borderRadius: "50%" } : {
+  const o = rs(t), d = n < 32 ? "text-xs" : n < 56 ? "text-sm" : "text-lg", h = a === "circle" ? { borderRadius: "50%" } : {
     borderRadius: "33%",
     "corner-shape": "superellipse(1.3)"
   };
   return /* @__PURE__ */ e(
     "div",
     {
-      className: p("flex-shrink-0 overflow-hidden", r),
+      className: R("flex-shrink-0 overflow-hidden", r),
       style: {
         width: `${n}px`,
         height: `${n}px`,
-        ...m
+        ...h
       },
       children: s ? /* @__PURE__ */ e(
         "img",
@@ -307,43 +307,43 @@ const q = ({
         "div",
         {
           "aria-hidden": "true",
-          className: p(
+          className: R(
             "avatar-fallback flex h-full w-full items-center justify-center font-semibold bg-[#E6E5E3] select-none transition-colors",
-            c
+            d
           ),
           children: o
         }
       )
     }
   );
-}, Ce = L.memo(
+}, Ne = L.memo(
   ({ channel: t, selectedChannel: s, onChannelSelect: n, debug: r = !1, unread: a }) => {
-    var E, N, I, k, R, F;
+    var E, C, I, p, S, P;
     const o = (s == null ? void 0 : s.id) === (t == null ? void 0 : t.id), l = () => {
       t && n(t);
-    }, m = Object.values(((E = t == null ? void 0 : t.state) == null ? void 0 : E.members) || {}).find(
-      (d) => {
-        var u, x;
-        return ((u = d.user) == null ? void 0 : u.id) && d.user.id !== ((x = t == null ? void 0 : t._client) == null ? void 0 : x.userID);
+    }, h = Object.values(((E = t == null ? void 0 : t.state) == null ? void 0 : E.members) || {}).find(
+      (c) => {
+        var m, N;
+        return ((m = c.user) == null ? void 0 : m.id) && c.user.id !== ((N = t == null ? void 0 : t._client) == null ? void 0 : N.userID);
       }
-    ), g = ((N = m == null ? void 0 : m.user) == null ? void 0 : N.name) || "Conversation", y = (I = m == null ? void 0 : m.user) == null ? void 0 : I.image, h = (R = (k = t == null ? void 0 : t.state) == null ? void 0 : k.messages) == null ? void 0 : R[t.state.messages.length - 1], S = (() => {
-      var u;
-      if (h != null && h.text) return h.text;
-      const d = (u = h == null ? void 0 : h.attachments) == null ? void 0 : u[0];
-      return d != null && d.asset_url ? d.asset_url : d != null && d.image_url ? d.image_url : d != null && d.og_scrape_url ? d.og_scrape_url : d != null && d.thumb_url ? d.thumb_url : "No messages yet";
-    })(), b = h != null && h.created_at ? es(new Date(h.created_at)) : "", w = a ?? 0;
+    ), b = ((C = h == null ? void 0 : h.user) == null ? void 0 : C.name) || "Conversation", k = (I = h == null ? void 0 : h.user) == null ? void 0 : I.image, u = (S = (p = t == null ? void 0 : t.state) == null ? void 0 : p.messages) == null ? void 0 : S[t.state.messages.length - 1], g = (() => {
+      var m;
+      if (u != null && u.text) return u.text;
+      const c = (m = u == null ? void 0 : u.attachments) == null ? void 0 : m[0];
+      return c != null && c.asset_url ? c.asset_url : c != null && c.image_url ? c.image_url : c != null && c.og_scrape_url ? c.og_scrape_url : c != null && c.thumb_url ? c.thumb_url : "No messages yet";
+    })(), w = u != null && u.created_at ? ts(new Date(u.created_at)) : "", y = a ?? 0;
     return r && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
       channelId: t == null ? void 0 : t.id,
       isSelected: o,
-      participantName: g,
-      unreadCount: w,
-      hasTimestamp: !!b
+      participantName: b,
+      unreadCount: y,
+      hasTimestamp: !!w
     }), /* @__PURE__ */ e(
       "button",
       {
         type: "button",
         onClick: l,
-        className: p(
+        className: R(
           "group w-full px-4 py-3 transition-colors text-left max-w-full overflow-hidden focus-ring",
           {
             "bg-primary-alt/10 border-l-4 border-l-primary": o,
@@ -352,11 +352,11 @@ const q = ({
         ),
         children: /* @__PURE__ */ i("div", { className: "flex items-start gap-3", children: [
           /* @__PURE__ */ e(
-            q,
+            Z,
             {
-              id: ((F = m == null ? void 0 : m.user) == null ? void 0 : F.id) || t.id || "unknown",
-              name: g,
-              image: y,
+              id: ((P = h == null ? void 0 : h.user) == null ? void 0 : P.id) || t.id || "unknown",
+              name: b,
+              image: k,
               size: 44,
               className: "[&_.avatar-fallback]:group-hover:bg-[#eeeeee]"
             }
@@ -366,18 +366,18 @@ const q = ({
               /* @__PURE__ */ e(
                 "h3",
                 {
-                  className: p(
+                  className: R(
                     "text-sm font-medium truncate",
                     o ? "text-primary" : "text-charcoal"
                   ),
-                  children: g
+                  children: b
                 }
               ),
-              b && /* @__PURE__ */ e("span", { className: "text-xs text-stone flex-shrink-0", children: b })
+              w && /* @__PURE__ */ e("span", { className: "text-xs text-stone flex-shrink-0", children: w })
             ] }),
             /* @__PURE__ */ i("div", { className: "flex items-center justify-between gap-2 min-w-0", children: [
-              /* @__PURE__ */ e("p", { className: "text-xs text-stone mr-2 flex-1 line-clamp-2", children: S }),
-              w > 0 && /* @__PURE__ */ e("span", { className: "bg-[#7f22fe] text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: w > 99 ? "99+" : w })
+              /* @__PURE__ */ e("p", { className: "text-xs text-stone mr-2 flex-1 line-clamp-2", children: g }),
+              y > 0 && /* @__PURE__ */ e("span", { className: "bg-[#7f22fe] text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: y > 99 ? "99+" : y })
             ] })
           ] })
         ] })
@@ -385,8 +385,8 @@ const q = ({
     );
   }
 );
-Ce.displayName = "CustomChannelPreview";
-const Ne = L.memo(
+Ne.displayName = "CustomChannelPreview";
+const be = L.memo(
   ({
     onChannelSelect: t,
     selectedChannel: s,
@@ -402,10 +402,10 @@ const Ne = L.memo(
       selectedChannelId: s == null ? void 0 : s.id,
       filters: n
     });
-    const c = L.useMemo(() => (g) => /* @__PURE__ */ e(
-      Ce,
+    const d = L.useMemo(() => (b) => /* @__PURE__ */ e(
+      Ne,
       {
-        ...g,
+        ...b,
         selectedChannel: s,
         onChannelSelect: t,
         debug: l
@@ -414,17 +414,17 @@ const Ne = L.memo(
     return /* @__PURE__ */ e(
       "div",
       {
-        className: p(
+        className: R(
           "messaging-channel-list h-full flex flex-col min-w-0 overflow-hidden",
           r
         ),
         children: /* @__PURE__ */ e("div", { className: "flex-1 overflow-hidden min-w-0", children: /* @__PURE__ */ e(
-          Te,
+          Ue,
           {
             filters: n,
             sort: { last_message_at: -1 },
             options: { limit: 30 },
-            Preview: c,
+            Preview: d,
             EmptyStateIndicator: a
           },
           JSON.stringify(n)
@@ -433,7 +433,7 @@ const Ne = L.memo(
     );
   }
 );
-Ne.displayName = "ChannelList";
+be.displayName = "ChannelList";
 const ee = ({
   variant: t = "default",
   className: s,
@@ -443,7 +443,7 @@ const ee = ({
   "button",
   {
     type: "button",
-    className: p(
+    className: R(
       "flex w-full items-center gap-3 rounded-lg px-4 py-3 text-left text-sm transition-colors focus-ring disabled:cursor-not-allowed disabled:opacity-60",
       t === "danger" ? "text-danger hover:bg-danger/50" : "text-charcoal hover:bg-sand",
       s
@@ -452,12 +452,12 @@ const ee = ({
     children: n
   }
 );
-function be({ label: t, className: s, children: n, ...r }) {
+function ve({ label: t, className: s, children: n, ...r }) {
   return /* @__PURE__ */ i(
     "button",
     {
       type: "button",
-      className: p(
+      className: R(
         "rounded-full p-2 transition-colors focus-ring",
         {
           "cursor-not-allowed opacity-50": r.disabled,
@@ -473,14 +473,14 @@ function be({ label: t, className: s, children: n, ...r }) {
     }
   );
 }
-function ve({ onClick: t }) {
-  return /* @__PURE__ */ e(be, { label: "Close", onClick: t, className: "p-1", children: /* @__PURE__ */ e(ae, { className: "h-5 w-5 text-stone", weight: "bold" }) });
+function we({ onClick: t }) {
+  return /* @__PURE__ */ e(ve, { label: "Close", onClick: t, className: "p-1", children: /* @__PURE__ */ e(oe, { className: "h-5 w-5 text-stone", weight: "bold" }) });
 }
-const ns = (t) => ({
+const ls = (t) => ({
   linkPreviews: Array.from(t.previews.values()).filter(
-    (s) => me.previewIsLoaded(s) || me.previewIsLoading(s)
+    (s) => he.previewIsLoaded(s) || he.previewIsLoading(s)
   )
-}), rs = ({
+}), as = ({
   link: t,
   onDismiss: s
 }) => {
@@ -510,7 +510,7 @@ const ns = (t) => ({
             },
             className: "absolute right-4 top-4 flex size-6 items-center justify-center rounded-full border border-white/40 bg-white/70 backdrop-blur-2xl",
             "aria-label": "Close link preview",
-            children: /* @__PURE__ */ e(ae, { className: "size-4 text-black/90" })
+            children: /* @__PURE__ */ e(oe, { className: "size-4 text-black/90" })
           }
         ),
         /* @__PURE__ */ i("div", { className: "p-2", children: [
@@ -520,32 +520,32 @@ const ns = (t) => ({
       ]
     }
   );
-}, ls = () => {
-  const { linkPreviewsManager: t } = Le(), { linkPreviews: s } = Ue(
+}, os = () => {
+  const { linkPreviewsManager: t } = Oe(), { linkPreviews: s } = je(
     t.state,
-    ns
+    ls
   ), n = (a) => {
     t.dismissPreview(a);
   };
   return s.length > 0 ? /* @__PURE__ */ e("div", { className: "str-chat__link-preview-list p-0 gap-2 mb-4", children: s.map((a) => /* @__PURE__ */ e(
-    rs,
+    as,
     {
       link: a,
       onDismiss: n
     },
     a.og_scrape_url
   )) }) : null;
-}, as = () => {
-  const { handleSubmit: t } = je(), s = Be();
-  return /* @__PURE__ */ i(fe, { children: [
-    /* @__PURE__ */ e("div", { className: "left-container", children: /* @__PURE__ */ e(Ae, {}) }),
+}, is = () => {
+  const { handleSubmit: t } = Ae(), s = ze();
+  return /* @__PURE__ */ i(ge, { children: [
+    /* @__PURE__ */ e("div", { className: "left-container", children: /* @__PURE__ */ e($e, {}) }),
     /* @__PURE__ */ i("div", { className: "central-container min-w-0 w-full p-2 bg-white rounded-[1.5rem] shadow-[0_4px_16px_0_rgba(0,0,0,0.08),0_1px_2px_0_rgba(0,0,0,0.04),0_0_0_1px_rgba(0,0,0,0.04)]", children: [
-      /* @__PURE__ */ e(ze, {}),
-      /* @__PURE__ */ e(ls, {}),
-      /* @__PURE__ */ e($e, {}),
+      /* @__PURE__ */ e(Ge, {}),
+      /* @__PURE__ */ e(os, {}),
+      /* @__PURE__ */ e(He, {}),
       /* @__PURE__ */ i("div", { className: "flex", children: [
         /* @__PURE__ */ e("div", { className: "w-full ml-2 mr-4 self-center leading-[0]", children: /* @__PURE__ */ e(
-          Ge,
+          Ve,
           {
             className: "w-full resize-none outline-none leading-6",
             maxRows: 4
@@ -560,18 +560,18 @@ const ns = (t) => ({
             disabled: !s,
             onClick: t,
             type: "button",
-            children: /* @__PURE__ */ e(qe, { className: "size-4" })
+            children: /* @__PURE__ */ e(Je, { className: "size-4" })
           }
         )
       ] })
     ] })
   ] });
-}, os = ({
+}, cs = ({
   renderActions: t
 }) => /* @__PURE__ */ i("div", { className: "message-input flex items-center gap-2 p-4", children: [
   t && (t == null ? void 0 : t()),
-  /* @__PURE__ */ e(Oe, { Input: as })
-] }), is = (t) => {
+  /* @__PURE__ */ e(Be, { Input: is })
+] }), ds = (t) => {
   const s = t.message.hide_date === !0;
   return /* @__PURE__ */ i("div", { className: "str-chat__message--system", "data-testid": "message-system", children: [
     /* @__PURE__ */ i("div", { className: "str-chat__message--system__text", children: [
@@ -579,37 +579,39 @@ const ns = (t) => ({
       /* @__PURE__ */ e("p", { children: t.message.text }),
       /* @__PURE__ */ e("div", { className: "str-chat__message--system__line" })
     ] }),
-    !s && /* @__PURE__ */ e(He, { message: t.message })
+    !s && /* @__PURE__ */ e(We, { message: t.message })
   ] });
-}, cs = () => null, ds = ({ onBack: t, showBackButton: s, onShowInfo: n, canShowInfo: r }) => {
-  var m, g, y, h, f;
-  const { channel: a } = ge(), o = L.useMemo(() => Object.values(a.state.members || {}).find(
-    (b) => {
-      var w;
-      return ((w = b.user) == null ? void 0 : w.id) && b.user.id !== a._client.userID;
+}, us = () => null, ms = ({ onBack: t, showBackButton: s, onShowInfo: n, canShowInfo: r }) => {
+  var h, b, k, u, f;
+  const { channel: a } = xe(), o = L.useMemo(() => Object.values(a.state.members || {}).find(
+    (w) => {
+      var y;
+      return ((y = w.user) == null ? void 0 : y.id) && w.user.id !== a._client.userID;
     }
-  ), [a._client.userID, a.state.members]), l = ((m = o == null ? void 0 : o.user) == null ? void 0 : m.name) || ((g = o == null ? void 0 : o.user) == null ? void 0 : g.id) || "Unknown member", c = (y = o == null ? void 0 : o.user) == null ? void 0 : y.image;
+  ), [a._client.userID, a.state.members]), l = ((h = o == null ? void 0 : o.user) == null ? void 0 : h.name) || ((b = o == null ? void 0 : o.user) == null ? void 0 : b.id) || "Unknown member", d = (k = o == null ? void 0 : o.user) == null ? void 0 : k.image;
   return /* @__PURE__ */ i("div", { className: "@container", children: [
     /* @__PURE__ */ i("div", { className: "flex justify-between items-center @lg:hidden", children: [
       /* @__PURE__ */ e(
         "button",
         {
-          className: p(
+          className: R(
             "size-10 rounded-full bg-[#F1F0EE] flex items-center justify-center",
             !s && "invisible"
           ),
           onClick: t || (() => {
           }),
-          children: /* @__PURE__ */ e(ie, { className: "size-5 text-black/90" })
+          type: "button",
+          "aria-label": "Back to conversations",
+          children: /* @__PURE__ */ e(ce, { className: "size-5 text-black/90" })
         }
       ),
       /* @__PURE__ */ i("div", { className: "flex flex-col gap-1 items-center", children: [
         /* @__PURE__ */ e(
-          q,
+          Z,
           {
-            id: ((h = o == null ? void 0 : o.user) == null ? void 0 : h.id) || a.id || "unknown",
+            id: ((u = o == null ? void 0 : o.user) == null ? void 0 : u.id) || a.id || "unknown",
             name: l,
-            image: c,
+            image: d,
             size: 40
           }
         ),
@@ -618,12 +620,13 @@ const ns = (t) => ({
       /* @__PURE__ */ e(
         "button",
         {
-          className: p(
+          className: R(
             "size-10 rounded-full bg-[#F1F0EE] flex items-center justify-center"
           ),
-          onClick: n || (() => {
-          }),
-          children: /* @__PURE__ */ e(ce, { className: "size-5 text-black/90" })
+          onClick: n,
+          type: "button",
+          "aria-label": "Show info",
+          children: /* @__PURE__ */ e(de, { className: "size-5 text-black/90" })
         }
       )
     ] }),
@@ -636,15 +639,15 @@ const ns = (t) => ({
             onClick: t,
             className: "size-10 rounded-full bg-[#F1F0EE] flex items-center justify-center",
             "aria-label": "Back to conversations",
-            children: /* @__PURE__ */ e(ie, { className: "size-5 text-black/90" })
+            children: /* @__PURE__ */ e(ce, { className: "size-5 text-black/90" })
           }
         ),
         /* @__PURE__ */ e(
-          q,
+          Z,
           {
             id: ((f = o == null ? void 0 : o.user) == null ? void 0 : f.id) || a.id || "unknown",
             name: l,
-            image: c,
+            image: d,
             size: 40
           }
         ),
@@ -653,17 +656,17 @@ const ns = (t) => ({
       r && n && /* @__PURE__ */ e(
         "button",
         {
-          className: p(
+          className: R(
             "size-10 rounded-full bg-[#F1F0EE] flex items-center justify-center"
           ),
           onClick: n,
-          children: /* @__PURE__ */ e(ce, { className: "size-5 text-black/90" })
+          children: /* @__PURE__ */ e(de, { className: "size-5 text-black/90" })
         }
       )
     ] })
   ] });
-}, us = ({
-  isOpen: t,
+}, hs = ({
+  dialogRef: t,
   onClose: s,
   participant: n,
   channel: r,
@@ -671,71 +674,66 @@ const ns = (t) => ({
   onLeaveConversation: o,
   onBlockParticipant: l
 }) => {
-  var Z, B, V, Y, H, W, J;
-  const { service: c, debug: m } = ne(), g = $(null), [y, h] = v(!1), [f, S] = v(!1), [b, w] = v(!1);
-  G(() => {
-    const _ = g.current;
-    _ && (t ? _.showModal() : _.close());
-  }, [t]);
-  const E = M(async () => {
-    var _;
-    if (!(!c || !((_ = n == null ? void 0 : n.user) != null && _.id)))
+  var j, H, Y, re, O, V, q;
+  const { service: d, debug: h } = ne(), [b, k] = v(!1), [u, f] = v(!1), [g, w] = v(!1), y = _(async () => {
+    var D;
+    if (!(!d || !((D = n == null ? void 0 : n.user) != null && D.id)))
       try {
-        const U = (await c.getBlockedUsers()).some(
-          (O) => {
-            var Q;
-            return O.blocked_user_id === ((Q = n == null ? void 0 : n.user) == null ? void 0 : Q.id);
+        const B = (await d.getBlockedUsers()).some(
+          ($) => {
+            var J;
+            return $.blocked_user_id === ((J = n == null ? void 0 : n.user) == null ? void 0 : J.id);
           }
         );
-        h(U);
-      } catch (P) {
+        k(B);
+      } catch (M) {
         console.error(
           "[ChannelInfoDialog] Failed to check blocked status:",
-          P
+          M
         );
       }
-  }, [c, (Z = n == null ? void 0 : n.user) == null ? void 0 : Z.id]);
+  }, [d, (j = n == null ? void 0 : n.user) == null ? void 0 : j.id]);
   G(() => {
-    t && E();
-  }, [t, E]);
-  const N = async () => {
-    var _;
-    if (!f) {
-      m && console.log("[ChannelInfoDialog] Leave conversation", r.cid), S(!0);
+    y();
+  }, [y]);
+  const E = async () => {
+    var D;
+    if (!u) {
+      h && console.log("[ChannelInfoDialog] Leave conversation", r.cid), f(!0);
       try {
-        const P = ((_ = r._client) == null ? void 0 : _.userID) ?? null;
-        await r.hide(P, !1), o && await o(r), s();
-      } catch (P) {
-        console.error("[ChannelInfoDialog] Failed to leave conversation", P);
+        const M = ((D = r._client) == null ? void 0 : D.userID) ?? null;
+        await r.hide(M, !1), o && await o(r), s();
+      } catch (M) {
+        console.error("[ChannelInfoDialog] Failed to leave conversation", M);
       } finally {
-        S(!1);
+        f(!1);
       }
     }
-  }, I = async () => {
-    var _, P, U;
-    if (!(b || !c)) {
-      m && console.log("[ChannelInfoDialog] Block member", (_ = n == null ? void 0 : n.user) == null ? void 0 : _.id), w(!0);
+  }, C = async () => {
+    var D, M, B;
+    if (!(g || !d)) {
+      h && console.log("[ChannelInfoDialog] Block member", (D = n == null ? void 0 : n.user) == null ? void 0 : D.id), w(!0);
       try {
-        await c.blockUser((P = n == null ? void 0 : n.user) == null ? void 0 : P.id), l && await l((U = n == null ? void 0 : n.user) == null ? void 0 : U.id), s();
-      } catch (O) {
-        console.error("[ChannelInfoDialog] Failed to block member", O);
+        await d.blockUser((M = n == null ? void 0 : n.user) == null ? void 0 : M.id), l && await l((B = n == null ? void 0 : n.user) == null ? void 0 : B.id), s();
+      } catch ($) {
+        console.error("[ChannelInfoDialog] Failed to block member", $);
       } finally {
         w(!1);
       }
     }
-  }, k = async () => {
-    var _, P, U;
-    if (!(b || !c)) {
-      m && console.log("[ChannelInfoDialog] Unblock member", (_ = n == null ? void 0 : n.user) == null ? void 0 : _.id), w(!0);
+  }, I = async () => {
+    var D, M, B;
+    if (!(g || !d)) {
+      h && console.log("[ChannelInfoDialog] Unblock member", (D = n == null ? void 0 : n.user) == null ? void 0 : D.id), w(!0);
       try {
-        await c.unBlockUser((P = n == null ? void 0 : n.user) == null ? void 0 : P.id), l && await l((U = n == null ? void 0 : n.user) == null ? void 0 : U.id), s();
-      } catch (O) {
-        console.error("[ChannelInfoDialog] Failed to unblock member", O);
+        await d.unBlockUser((M = n == null ? void 0 : n.user) == null ? void 0 : M.id), l && await l((B = n == null ? void 0 : n.user) == null ? void 0 : B.id), s();
+      } catch ($) {
+        console.error("[ChannelInfoDialog] Failed to unblock member", $);
       } finally {
         w(!1);
       }
     }
-  }, R = () => {
+  }, p = () => {
     s(), window.open(
       "https://linktr.ee/s/about/trust-center/report",
       "_blank",
@@ -743,22 +741,22 @@ const ns = (t) => ({
     );
   };
   if (!n) return null;
-  const F = ((B = n.user) == null ? void 0 : B.name) || ((V = n.user) == null ? void 0 : V.id) || "Unknown member", d = (Y = n.user) == null ? void 0 : Y.image, u = (H = n.user) == null ? void 0 : H.email, x = (W = n.user) == null ? void 0 : W.username, A = u || (x ? `linktr.ee/${x}` : void 0), z = ((J = n.user) == null ? void 0 : J.id) || "unknown";
+  const S = ((H = n.user) == null ? void 0 : H.name) || ((Y = n.user) == null ? void 0 : Y.id) || "Unknown member", P = (re = n.user) == null ? void 0 : re.image, c = (O = n.user) == null ? void 0 : O.email, m = (V = n.user) == null ? void 0 : V.username, N = c || (m ? `linktr.ee/${m}` : void 0), A = ((q = n.user) == null ? void 0 : q.id) || "unknown";
   return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
     /* @__PURE__ */ e(
       "dialog",
       {
-        ref: g,
+        ref: t,
         className: "mes-dialog group",
         onClose: s,
-        onClick: (_) => {
-          _.target === g.current && s();
+        onClick: (D) => {
+          D.target === t.current && s();
         },
         children: /* @__PURE__ */ i("div", { className: "ml-auto flex h-full w-full flex-col bg-white shadow-none transition-shadow duration-200 group-open:shadow-max-elevation-light", children: [
           /* @__PURE__ */ i("div", { className: "flex items-center justify-between border-b border-sand px-4 py-3", children: [
             /* @__PURE__ */ e("h2", { className: "text-base font-semibold text-charcoal", children: "Chat info" }),
-            /* @__PURE__ */ e(ve, { onClick: s })
+            /* @__PURE__ */ e(we, { onClick: s })
           ] }),
           /* @__PURE__ */ i("div", { className: "flex-1 px-2 overflow-y-auto w-full", children: [
             /* @__PURE__ */ e(
@@ -768,18 +766,18 @@ const ns = (t) => ({
                 style: { backgroundColor: "#FBFAF9" },
                 children: /* @__PURE__ */ i("div", { className: "flex items-center gap-3 w-full", children: [
                   /* @__PURE__ */ e(
-                    q,
+                    Z,
                     {
-                      id: z,
-                      name: F,
-                      image: d,
+                      id: A,
+                      name: S,
+                      image: P,
                       size: 88,
                       shape: "circle"
                     }
                   ),
                   /* @__PURE__ */ i("div", { className: "flex flex-col min-w-0 flex-1", children: [
-                    /* @__PURE__ */ e("p", { className: "truncate text-base font-semibold text-charcoal", children: F }),
-                    A && /* @__PURE__ */ e("p", { className: "truncate text-sm text-[#00000055]", children: A }),
+                    /* @__PURE__ */ e("p", { className: "truncate text-base font-semibold text-charcoal", children: S }),
+                    N && /* @__PURE__ */ e("p", { className: "truncate text-sm text-[#00000055]", children: N }),
                     a && /* @__PURE__ */ e(
                       "span",
                       {
@@ -802,40 +800,40 @@ const ns = (t) => ({
               /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(
                 ee,
                 {
-                  onClick: N,
-                  disabled: f,
-                  "aria-busy": f,
+                  onClick: E,
+                  disabled: u,
+                  "aria-busy": u,
                   children: [
-                    f ? /* @__PURE__ */ e(se, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(Ye, { className: "h-5 w-5" }),
+                    u ? /* @__PURE__ */ e(se, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(Qe, { className: "h-5 w-5" }),
                     /* @__PURE__ */ e("span", { children: "Delete Conversation" })
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("li", { children: y ? /* @__PURE__ */ i(
+              /* @__PURE__ */ e("li", { children: b ? /* @__PURE__ */ i(
                 ee,
                 {
-                  onClick: k,
-                  disabled: b,
-                  "aria-busy": b,
+                  onClick: I,
+                  disabled: g,
+                  "aria-busy": g,
                   children: [
-                    b ? /* @__PURE__ */ e(se, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(de, { className: "h-5 w-5" }),
+                    g ? /* @__PURE__ */ e(se, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(ue, { className: "h-5 w-5" }),
                     /* @__PURE__ */ e("span", { children: "Unblock" })
                   ]
                 }
               ) : /* @__PURE__ */ i(
                 ee,
                 {
-                  onClick: I,
-                  disabled: b,
-                  "aria-busy": b,
+                  onClick: C,
+                  disabled: g,
+                  "aria-busy": g,
                   children: [
-                    b ? /* @__PURE__ */ e(se, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(de, { className: "h-5 w-5" }),
+                    g ? /* @__PURE__ */ e(se, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(ue, { className: "h-5 w-5" }),
                     /* @__PURE__ */ e("span", { children: "Block" })
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(ee, { variant: "danger", onClick: R, children: [
-                /* @__PURE__ */ e(Je, { className: "h-5 w-5" }),
+              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(ee, { variant: "danger", onClick: p, children: [
+                /* @__PURE__ */ e(Xe, { className: "h-5 w-5" }),
                 /* @__PURE__ */ e("span", { children: "Report" })
               ] }) })
             ] })
@@ -844,38 +842,44 @@ const ns = (t) => ({
       }
     )
   );
-}, ms = ({
+}, fs = ({
   onBack: t,
   showBackButton: s,
   renderMessageInputActions: n,
   onLeaveConversation: r,
   onBlockParticipant: a
 }) => {
-  const { channel: o } = ge(), [l, c] = v(!1), m = L.useMemo(() => Object.values(o.state.members || {}).find(
-    (h) => {
-      var f;
-      return ((f = h.user) == null ? void 0 : f.id) && h.user.id !== o._client.userID;
+  const { channel: o } = xe(), l = z(null), d = L.useMemo(() => Object.values(o.state.members || {}).find(
+    (f) => {
+      var g;
+      return ((g = f.user) == null ? void 0 : g.id) && f.user.id !== o._client.userID;
     }
-  ), [o._client.userID, o.state.members]), g = L.useMemo(() => {
-    const y = o.data ?? {};
-    if (y.followerStatus)
-      return String(y.followerStatus);
-    if (y.isFollower !== void 0)
-      return y.isFollower ? "Subscribed to you" : "Not subscribed";
-  }, [o.data]);
-  return /* @__PURE__ */ i(fe, { children: [
-    /* @__PURE__ */ i(We, { children: [
+  ), [o._client.userID, o.state.members]), h = L.useMemo(() => {
+    const u = o.data ?? {};
+    if (u.followerStatus)
+      return String(u.followerStatus);
+    if (u.isFollower !== void 0)
+      return u.isFollower ? "Subscribed to you" : "Not subscribed";
+  }, [o.data]), b = _(() => {
+    var u;
+    (u = l.current) == null || u.showModal();
+  }, []), k = _(() => {
+    var u;
+    (u = l.current) == null || u.close();
+  }, []);
+  return /* @__PURE__ */ i(ge, { children: [
+    /* @__PURE__ */ i(qe, { children: [
       /* @__PURE__ */ e("div", { className: "p-4", children: /* @__PURE__ */ e(
-        ds,
+        ms,
         {
           onBack: t,
           showBackButton: s,
-          onShowInfo: () => c(!0),
-          canShowInfo: !!m
+          onShowInfo: b,
+          canShowInfo: !!d
         }
       ) }),
       /* @__PURE__ */ e("div", { className: "flex-1 overflow-hidden relative", children: /* @__PURE__ */ e(
-        Ze,
+        Ye,
         {
           hideDeletedMessages: !0,
           hideNewMessageSeparator: !1,
@@ -883,26 +887,26 @@ const ns = (t) => ({
         }
       ) }),
       /* @__PURE__ */ e(
-        os,
+        cs,
         {
           renderActions: () => n == null ? void 0 : n(o)
         }
       )
     ] }),
     /* @__PURE__ */ e(
-      us,
+      hs,
       {
-        isOpen: l,
-        onClose: () => c(!1),
-        participant: m,
+        dialogRef: l,
+        onClose: k,
+        participant: d,
         channel: o,
-        followerStatusLabel: g,
+        followerStatusLabel: h,
         onLeaveConversation: r,
         onBlockParticipant: a
       }
     )
   ] });
-}, we = L.memo(
+}, ye = L.memo(
   ({
     channel: t,
     onBack: s,
@@ -911,29 +915,29 @@ const ns = (t) => ({
     onLeaveConversation: a,
     onBlockParticipant: o,
     className: l,
-    CustomChannelEmptyState: c = cs
+    CustomChannelEmptyState: d = us
   }) => /* @__PURE__ */ e(
     "div",
     {
-      className: p(
+      className: R(
         "messaging-channel-view h-full flex flex-col",
         l
       ),
       children: /* @__PURE__ */ e(
-        Ve,
+        Ze,
         {
           channel: t,
-          MessageSystem: is,
-          EmptyStateIndicator: c,
+          MessageSystem: ds,
+          EmptyStateIndicator: d,
           children: /* @__PURE__ */ e(
-            ms,
+            fs,
             {
               onBack: s,
               showBackButton: n,
               renderMessageInputActions: r,
               onLeaveConversation: a,
               onBlockParticipant: o,
-              CustomChannelEmptyState: c
+              CustomChannelEmptyState: d
             }
           )
         }
@@ -941,16 +945,16 @@ const ns = (t) => ({
     }
   )
 );
-we.displayName = "ChannelView";
-function hs({
+ye.displayName = "ChannelView";
+function gs({
   searchQuery: t,
   setSearchQuery: s,
   placeholder: n
 }) {
-  const r = $(null);
+  const r = z(null);
   return /* @__PURE__ */ i("div", { className: "relative", children: [
     /* @__PURE__ */ e(
-      Qe,
+      Ke,
       {
         className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-stone",
         weight: "bold"
@@ -968,7 +972,7 @@ function hs({
       }
     ),
     t && /* @__PURE__ */ e(
-      be,
+      ve,
       {
         label: "Clear search",
         onClick: () => {
@@ -976,12 +980,12 @@ function hs({
           s(""), (a = r.current) == null || a.focus();
         },
         className: "absolute right-3 top-1/2 -translate-y-1/2 p-1 text-stone hover:text-charcoal",
-        children: /* @__PURE__ */ e(ae, { className: "h-4 w-4", weight: "bold" })
+        children: /* @__PURE__ */ e(oe, { className: "h-4 w-4", weight: "bold" })
       }
     )
   ] });
 }
-const fs = ({
+const xs = ({
   participantSource: t,
   onSelectParticipant: s,
   onClose: n,
@@ -990,127 +994,127 @@ const fs = ({
   searchPlaceholder: o = "Search participants...",
   className: l
 }) => {
-  const { debug: c } = ne(), [m, g] = v(""), [y, h] = v([]), [f, S] = v(!1), [b, w] = v(null), [E, N] = v(
+  const { debug: d } = ne(), [h, b] = v(""), [k, u] = v([]), [f, g] = v(!1), [w, y] = v(null), [E, C] = v(
     null
-  ), I = $(!1);
+  ), I = z(!1);
   G(() => {
     if (t.loading) {
-      c && console.log(
+      d && console.log(
         "[ParticipantPicker] Waiting for participant source to finish loading..."
       );
       return;
     }
     if (I.current) return;
     (async () => {
-      c && console.log("[ParticipantPicker] Loading initial participants..."), S(!0), w(null);
+      d && console.log("[ParticipantPicker] Loading initial participants..."), g(!0), y(null);
       try {
-        const u = await t.loadParticipants({
+        const m = await t.loadParticipants({
           search: "",
           // Load all participants initially
           limit: 100
         });
-        h(u.participants), I.current = !0, c && console.log(
+        u(m.participants), I.current = !0, d && console.log(
           "[ParticipantPicker] Participants loaded successfully:",
-          u.participants.length
+          m.participants.length
         );
-      } catch (u) {
-        const x = u instanceof Error ? u.message : "Failed to load participants";
-        w(x), console.error("[ParticipantPicker] Failed to load participants:", u);
+      } catch (m) {
+        const N = m instanceof Error ? m.message : "Failed to load participants";
+        y(N), console.error("[ParticipantPicker] Failed to load participants:", m);
       } finally {
-        S(!1);
+        g(!1);
       }
     })();
-  }, [t.loading, c]);
-  const k = y.filter((d) => !r.has(d.id)).filter((d) => {
-    var x;
-    if (!m) return !0;
-    const u = m.toLowerCase();
-    return d.name.toLowerCase().includes(u) || ((x = d.email) == null ? void 0 : x.toLowerCase().includes(u)) || !1;
-  }), R = M(
-    async (d) => {
+  }, [t.loading, d]);
+  const p = k.filter((c) => !r.has(c.id)).filter((c) => {
+    var N;
+    if (!h) return !0;
+    const m = h.toLowerCase();
+    return c.name.toLowerCase().includes(m) || ((N = c.email) == null ? void 0 : N.toLowerCase().includes(m)) || !1;
+  }), S = _(
+    async (c) => {
       if (!E) {
-        N(d.id);
+        C(c.id);
         try {
-          await s(d);
-        } catch (u) {
-          console.error("[ParticipantPicker] Failed to start chat:", u), N(null);
+          await s(c);
+        } catch (m) {
+          console.error("[ParticipantPicker] Failed to start chat:", m), C(null);
         }
       }
     },
     [s, E]
-  ), F = (d, u) => {
-    (d.key === "Enter" || d.key === " ") && (d.preventDefault(), R(u));
+  ), P = (c, m) => {
+    (c.key === "Enter" || c.key === " ") && (c.preventDefault(), S(m));
   };
-  return /* @__PURE__ */ i("div", { className: p("flex flex-col h-full", l), children: [
+  return /* @__PURE__ */ i("div", { className: R("flex flex-col h-full", l), children: [
     /* @__PURE__ */ i("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: [
       /* @__PURE__ */ i("div", { className: "flex items-center justify-between mb-3", children: [
         /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-charcoal", children: "Start a new Conversation" }),
-        /* @__PURE__ */ e(ve, { onClick: n })
+        /* @__PURE__ */ e(we, { onClick: n })
       ] }),
       /* @__PURE__ */ i("p", { className: "text-xs text-stone mb-3", children: [
         "Select a ",
         a.slice(0, -1),
         " to start messaging (",
-        k.length,
+        p.length,
         " available)",
         t.totalCount !== void 0 && ` • ${t.totalCount} ${a} total`
       ] }),
       /* @__PURE__ */ e(
-        hs,
+        gs,
         {
-          searchQuery: m,
-          setSearchQuery: g,
+          searchQuery: h,
+          setSearchQuery: b,
           placeholder: o
         }
       )
     ] }),
-    b && /* @__PURE__ */ i("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
+    w && /* @__PURE__ */ i("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
       "Error loading ",
       a,
       ": ",
-      b
+      w
     ] }),
-    /* @__PURE__ */ e("div", { className: "flex-1 overflow-auto", children: f && k.length === 0 ? /* @__PURE__ */ e("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
+    /* @__PURE__ */ e("div", { className: "flex-1 overflow-auto", children: f && p.length === 0 ? /* @__PURE__ */ e("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
       /* @__PURE__ */ e("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
       /* @__PURE__ */ i("span", { className: "text-sm text-stone", children: [
         "Loading ",
         a,
         "..."
       ] })
-    ] }) }) : k.length === 0 ? /* @__PURE__ */ i("div", { className: "p-6 text-center", children: [
-      /* @__PURE__ */ e("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-sand", children: /* @__PURE__ */ e(ue, { className: "h-8 w-8 text-charcoal" }) }),
-      /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: m ? `No ${a} found` : y.length > 0 ? `Already chatting with all ${a}` : `No ${a} yet` }),
-      /* @__PURE__ */ e("p", { className: "text-xs text-stone", children: m ? "Try a different search term" : y.length > 0 ? `You have existing conversations with all your ${a}` : `${a.charAt(0).toUpperCase() + a.slice(1)} will appear here` })
+    ] }) }) : p.length === 0 ? /* @__PURE__ */ i("div", { className: "p-6 text-center", children: [
+      /* @__PURE__ */ e("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-sand", children: /* @__PURE__ */ e(me, { className: "h-8 w-8 text-charcoal" }) }),
+      /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: h ? `No ${a} found` : k.length > 0 ? `Already chatting with all ${a}` : `No ${a} yet` }),
+      /* @__PURE__ */ e("p", { className: "text-xs text-stone", children: h ? "Try a different search term" : k.length > 0 ? `You have existing conversations with all your ${a}` : `${a.charAt(0).toUpperCase() + a.slice(1)} will appear here` })
     ] }) : /* @__PURE__ */ i("ul", { className: "space-y-0", children: [
-      k.map((d) => {
-        const u = d.name || d.email || d.id, x = d.email && d.name ? d.email : d.phone;
+      p.map((c) => {
+        const m = c.name || c.email || c.id, N = c.email && c.name ? c.email : c.phone;
         return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: () => R(d),
-            onKeyDown: (A) => F(A, d),
+            onClick: () => S(c),
+            onKeyDown: (A) => P(A, c),
             className: "w-full px-4 py-3 hover:bg-sand transition-colors border-b border-sand text-left focus:outline-none focus:ring-2 focus:ring-black",
             children: /* @__PURE__ */ i("div", { className: "flex items-center justify-between", children: [
               /* @__PURE__ */ i("div", { className: "flex items-center space-x-3 flex-1 min-w-0", children: [
                 /* @__PURE__ */ e(
-                  q,
+                  Z,
                   {
-                    id: d.id,
-                    name: u,
-                    image: d.image,
+                    id: c.id,
+                    name: m,
+                    image: c.image,
                     size: 40
                   }
                 ),
                 /* @__PURE__ */ i("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-charcoal truncate", children: u }),
-                  x && /* @__PURE__ */ e("p", { className: "text-xs text-stone truncate", children: x })
+                  /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-charcoal truncate", children: m }),
+                  N && /* @__PURE__ */ e("p", { className: "text-xs text-stone truncate", children: N })
                 ] })
               ] }),
-              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: E === d.id ? /* @__PURE__ */ e(se, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ e(ue, { className: "h-5 w-5 text-stone" }) })
+              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: E === c.id ? /* @__PURE__ */ e(se, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ e(me, { className: "h-5 w-5 text-stone" }) })
             ] })
           }
-        ) }, d.id);
+        ) }, c.id);
       }),
       f && /* @__PURE__ */ e("li", { className: "p-4 flex justify-center", children: /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
         /* @__PURE__ */ e("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
@@ -1118,7 +1122,7 @@ const fs = ({
       ] }) })
     ] }) })
   ] });
-}, gs = ({ className: t }) => /* @__PURE__ */ i(
+}, Cs = ({ className: t }) => /* @__PURE__ */ i(
   "svg",
   {
     width: "140",
@@ -1252,16 +1256,16 @@ const fs = ({
       ] })
     ]
   }
-), ye = L.memo(
-  ({ hasChannels: t }) => /* @__PURE__ */ e("div", { className: "messaging-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ i("div", { className: "flex flex-col items-center max-w-sm text-center", children: [
-    /* @__PURE__ */ e(gs, {}),
-    !t && /* @__PURE__ */ i("div", { className: "mt-8", children: [
+), Ee = L.memo(
+  ({ hasChannels: t, channelsLoaded: s }) => /* @__PURE__ */ e("div", { className: "messaging-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ i("div", { className: "flex flex-col items-center max-w-sm text-center", children: [
+    /* @__PURE__ */ e(Cs, {}),
+    s && !t && /* @__PURE__ */ i("div", { className: "mt-8", children: [
       /* @__PURE__ */ e("h2", { className: "font-medium text-black text-[18px] mb-2", children: "Your inbox is empty" }),
       /* @__PURE__ */ e("p", { className: "text-[#676B5F] text-sm mb-6", children: "Share with your followers to start receiving messages" })
     ] })
   ] }) })
 );
-ye.displayName = "EmptyState";
+Ee.displayName = "EmptyState";
 const te = L.memo(({ message: t, onBack: s }) => /* @__PURE__ */ e("div", { className: "messaging-error-state flex items-center justify-center h-full p-8", children: /* @__PURE__ */ i("div", { className: "text-center max-w-sm", children: [
   /* @__PURE__ */ e("div", { className: "w-24 h-24 bg-danger-alt/20 rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ e("span", { className: "text-4xl", children: "⚠️" }) }),
   /* @__PURE__ */ e("h2", { className: "font-semibold text-charcoal mb-2", children: "Oops!" }),
@@ -1277,10 +1281,10 @@ const te = L.memo(({ message: t, onBack: s }) => /* @__PURE__ */ e("div", { clas
   )
 ] }) }));
 te.displayName = "ErrorState";
-const xs = ({ className: t, message: s }) => /* @__PURE__ */ i(
+const Ns = ({ className: t, message: s }) => /* @__PURE__ */ i(
   "div",
   {
-    className: p("flex items-center justify-center h-full", t),
+    className: R("flex items-center justify-center h-full", t),
     children: [
       /* @__PURE__ */ i("svg", { viewBox: "0 0 100 100", className: "size-8 fill-pebble", stroke: "none", children: [
         /* @__PURE__ */ e("circle", { cx: "6", cy: "50", r: "6", children: /* @__PURE__ */ e(
@@ -1320,12 +1324,12 @@ const xs = ({ className: t, message: s }) => /* @__PURE__ */ i(
       s && /* @__PURE__ */ e("span", { className: "text-stone", children: s })
     ]
   }
-), Ee = L.memo(() => /* @__PURE__ */ e("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ i("div", { className: "flex items-center", children: [
-  /* @__PURE__ */ e(xs, { className: "w-6 h-6" }),
+), Ie = L.memo(() => /* @__PURE__ */ e("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ i("div", { className: "flex items-center", children: [
+  /* @__PURE__ */ e(Ns, { className: "w-6 h-6" }),
   /* @__PURE__ */ e("span", { className: "text-sm text-stone", children: "Loading messages" })
 ] }) }));
-Ee.displayName = "LoadingState";
-const Ss = ({
+Ie.displayName = "LoadingState";
+const Rs = ({
   capabilities: t = {},
   className: s,
   renderMessageInputActions: n,
@@ -1333,101 +1337,101 @@ const Ss = ({
   onParticipantSelect: a,
   initialParticipantFilter: o,
   initialParticipantData: l,
-  CustomChannelEmptyState: c,
-  showChannelList: m = !0,
-  filters: g,
-  channelListCustomEmptyStateIndicator: y
+  CustomChannelEmptyState: d,
+  showChannelList: h = !0,
+  filters: b,
+  channelListCustomEmptyStateIndicator: k
 }) => {
   const {
-    service: h,
+    service: u,
     client: f,
-    isConnected: S,
-    isLoading: b,
-    error: w,
+    isConnected: g,
+    isLoading: w,
+    error: y,
     refreshConnection: E,
-    debug: N
-  } = Xe(), [I, k] = v(null), [R, F] = v(!1), [d, u] = v(!1), [x, A] = v(/* @__PURE__ */ new Set()), [z, Z] = v(0), [B, V] = v(!1), [Y, H] = v(null), W = $(null), { participantSource: J, participantLabel: _ = "participants" } = t, P = L.useMemo(() => {
-    const C = f == null ? void 0 : f.userID;
+    debug: C
+  } = es(), [I, p] = v(null), [S, P] = v(!1), [c, m] = v(!1), [N, A] = v(!1), [j, H] = v(/* @__PURE__ */ new Set()), [Y, re] = v(0), [O, V] = v(!1), [q, D] = v(null), M = z(null), { participantSource: B, participantLabel: $ = "participants" } = t, J = L.useMemo(() => {
+    const x = f == null ? void 0 : f.userID;
     return {
       ...{
         type: "messaging",
         last_message_at: { $exists: !0 },
-        ...C && {
-          members: { $in: [C] },
+        ...x && {
+          members: { $in: [x] },
           hidden: !1
         }
       },
-      ...g
+      ...b
     };
-  }, [g, f == null ? void 0 : f.userID]), U = $(null), O = M(async () => {
-    if (!f || !S) return;
-    const C = f.userID;
-    if (C)
+  }, [b, f == null ? void 0 : f.userID]), Q = z(null), W = _(async () => {
+    if (!f || !g) return;
+    const x = f.userID;
+    if (x)
       try {
-        N && console.log("[MessagingShell] Syncing channels for user:", C);
-        const j = await f.queryChannels(
+        C && console.log("[MessagingShell] Syncing channels for user:", x);
+        const U = await f.queryChannels(
           {
             type: "messaging",
-            members: { $in: [C] }
+            members: { $in: [x] }
           },
           {},
           { limit: 100 }
-        ), D = /* @__PURE__ */ new Set();
-        j.forEach((T) => {
-          const re = T.state.members;
-          Object.values(re).forEach((_e) => {
-            var oe;
-            const le = (oe = _e.user) == null ? void 0 : oe.id;
-            le && le !== C && D.add(le);
+        ), F = /* @__PURE__ */ new Set();
+        U.forEach((T) => {
+          const le = T.state.members;
+          Object.values(le).forEach((Me) => {
+            var ie;
+            const ae = (ie = Me.user) == null ? void 0 : ie.id;
+            ae && ae !== x && F.add(ae);
           });
-        }), A((T) => T.size === D.size && [...T].every((re) => D.has(re)) ? T : D), F(j.length > 0), U.current = C, N && console.log("[MessagingShell] Channels synced successfully:", {
-          channelCount: j.length,
-          memberCount: D.size
+        }), H((T) => T.size === F.size && [...T].every((le) => F.has(le)) ? T : F), P(U.length > 0), m(!0), Q.current = x, C && console.log("[MessagingShell] Channels synced successfully:", {
+          channelCount: U.length,
+          memberCount: F.size
         });
-      } catch (j) {
-        console.error("[MessagingShell] Failed to sync channels:", j);
+      } catch (U) {
+        console.error("[MessagingShell] Failed to sync channels:", U);
       }
-  }, [f, S, N]);
+  }, [f, g, C]);
   G(() => {
-    if (!f || !S) return;
-    const C = f.userID;
-    C && U.current !== C && O();
-  }, [f, S, O]), G(() => {
-    if (!o || !f || !S) return;
+    if (!f || !g) return;
+    const x = f.userID;
+    x && Q.current !== x && W();
+  }, [f, g, W]), G(() => {
+    if (!o || !f || !g) return;
     (async () => {
-      const j = f.userID;
-      if (j)
+      const U = f.userID;
+      if (U)
         try {
-          N && console.log(
+          C && console.log(
             "[MessagingShell] Loading initial conversation with:",
             o
           );
-          const D = await f.queryChannels(
+          const F = await f.queryChannels(
             {
               type: "messaging",
-              members: { $eq: [j, o] }
+              members: { $eq: [U, o] }
             },
             {},
             { limit: 1 }
           );
-          if (D.length > 0)
-            k(D[0]), V(!0), H(null), r && r(D[0]), N && console.log(
+          if (F.length > 0)
+            p(F[0]), V(!0), D(null), r && r(F[0]), C && console.log(
               "[MessagingShell] Initial conversation loaded:",
-              D[0].id
+              F[0].id
             );
-          else if (l && h) {
-            N && console.log(
+          else if (l && u) {
+            C && console.log(
               "[MessagingShell] No conversation found, creating one for:",
               l
             );
             try {
-              const T = await h.startChannelWithParticipant({
+              const T = await u.startChannelWithParticipant({
                 id: l.id,
                 name: l.name,
                 email: l.email,
                 phone: l.phone
               });
-              k(T), V(!0), H(null), r && r(T), N && console.log(
+              p(T), V(!0), D(null), r && r(T), C && console.log(
                 "[MessagingShell] Channel created and loaded:",
                 T.id
               );
@@ -1435,93 +1439,93 @@ const Ss = ({
               console.error(
                 "[MessagingShell] Failed to create conversation:",
                 T
-              ), H("Failed to create conversation");
+              ), D("Failed to create conversation");
             }
           } else
-            H(
+            D(
               "No conversation found with this account"
-            ), N && console.log(
+            ), C && console.log(
               "[MessagingShell] No conversation found for:",
               o
             );
-        } catch (D) {
+        } catch (F) {
           console.error(
             "[MessagingShell] Failed to load initial conversation:",
-            D
-          ), H("Failed to load conversation");
+            F
+          ), D("Failed to load conversation");
         }
     })();
   }, [
     o,
     l,
     f,
-    S,
-    h,
-    N,
+    g,
+    u,
+    C,
     r
   ]);
-  const Q = M(
-    (C) => {
-      k(C), r == null || r(C);
+  const pe = _(
+    (x) => {
+      p(x), r == null || r(x);
     },
     [r]
-  ), Ie = M(() => {
-    B || k(null);
-  }, [B]), ke = M(
-    async (C) => {
-      var j;
-      if (h)
+  ), ke = _(() => {
+    O || p(null);
+  }, [O]), Se = _(
+    async (x) => {
+      var U;
+      if (u)
         try {
-          N && console.log(
+          C && console.log(
             "[MessagingShell] Starting conversation with:",
-            C.id
+            x.id
           );
-          const D = await h.startChannelWithParticipant({
-            id: C.id,
-            name: C.name,
-            email: C.email,
-            phone: C.phone
+          const F = await u.startChannelWithParticipant({
+            id: x.id,
+            name: x.name,
+            email: x.email,
+            phone: x.phone
           });
           try {
-            await D.show();
+            await F.show();
           } catch (T) {
             console.warn("[MessagingShell] Failed to unhide channel:", T);
           }
-          k(D), u(!1), (j = W.current) == null || j.close(), a == null || a(C);
-        } catch (D) {
-          console.error("[MessagingShell] Failed to start conversation:", D);
+          p(F), A(!1), (U = M.current) == null || U.close(), a == null || a(x);
+        } catch (F) {
+          console.error("[MessagingShell] Failed to start conversation:", F);
         }
     },
-    [h, a, N]
-  ), X = M(() => {
-    var C;
-    u(!1), (C = W.current) == null || C.close();
-  }, []), Se = M(
-    (C) => {
-      C.target === W.current && X();
+    [u, a, C]
+  ), X = _(() => {
+    var x;
+    A(!1), (x = M.current) == null || x.close();
+  }, []), Re = _(
+    (x) => {
+      x.target === M.current && X();
     },
     [X]
-  ), pe = M(
-    async (C) => {
-      N && console.log("[MessagingShell] Leaving conversation:", C.id), k(null), V(!1), U.current = null, await O();
+  ), De = _(
+    async (x) => {
+      C && console.log("[MessagingShell] Leaving conversation:", x.id), p(null), V(!1), Q.current = null, await W();
     },
-    [O, N]
-  ), Re = M(
-    async (C) => {
-      N && console.log("[MessagingShell] Blocking participant:", C), k(null), V(!1), U.current = null, await O();
+    [W, C]
+  ), _e = _(
+    async (x) => {
+      C && console.log("[MessagingShell] Blocking participant:", x), p(null), V(!1), Q.current = null, await W();
     },
-    [O, N]
+    [W, C]
   ), K = !!I;
-  return b ? /* @__PURE__ */ e("div", { className: p("h-full", s), children: /* @__PURE__ */ e(Ee, {}) }) : w ? /* @__PURE__ */ e("div", { className: p("h-full", s), children: /* @__PURE__ */ e(te, { message: w, onBack: E }) }) : !S || !f ? /* @__PURE__ */ e("div", { className: p("h-full", s), children: /* @__PURE__ */ e(
+  return w ? /* @__PURE__ */ e("div", { className: R("h-full", s), children: /* @__PURE__ */ e(Ie, {}) }) : y ? /* @__PURE__ */ e("div", { className: R("h-full", s), children: /* @__PURE__ */ e(te, { message: y, onBack: E }) }) : !g || !f ? /* @__PURE__ */ e("div", { className: R("h-full", s), children: /* @__PURE__ */ e(
     te,
     {
       message: "Not connected to messaging service",
       onBack: E
     }
-  ) }) : Y ? /* @__PURE__ */ e("div", { className: p("h-full", s), children: /* @__PURE__ */ e(te, { message: Y }) }) : /* @__PURE__ */ i(
+  ) }) : q ? /* @__PURE__ */ e("div", { className: R("h-full", s), children: /* @__PURE__ */ e(te, { message: q }) }) : /* @__PURE__ */ i(
     "div",
     {
-      className: p(
+      className: R(
         "messaging-shell h-full bg-background-secondary overflow-hidden",
         s
       ),
@@ -1530,24 +1534,24 @@ const Ss = ({
           /* @__PURE__ */ e(
             "div",
             {
-              className: p(
+              className: R(
                 "messaging-channel-list-sidebar min-h-0 min-w-0 lg:flex lg:flex-col",
                 {
                   // Explicitly hidden via prop or in direct conversation mode
-                  "!hidden": m === !1 || B,
+                  "!hidden": h === !1 || O,
                   // Normal mode: hide on mobile when channel selected, show on desktop
-                  "hidden lg:flex lg:w-80 lg:min-w-[280px] lg:max-w-[360px]": m !== !1 && !B && K,
+                  "hidden lg:flex lg:w-80 lg:min-w-[280px] lg:max-w-[360px]": h !== !1 && !O && K,
                   // Normal mode: show when no channel selected
-                  "flex flex-col w-full lg:flex-1 lg:max-w-2xl": m !== !1 && !B && !K
+                  "flex flex-col w-full lg:flex-1 lg:max-w-2xl": h !== !1 && !O && !K
                 }
               ),
               children: /* @__PURE__ */ e(
-                Ne,
+                be,
                 {
-                  onChannelSelect: Q,
+                  onChannelSelect: pe,
                   selectedChannel: I || void 0,
-                  filters: P,
-                  customEmptyStateIndicator: y
+                  filters: J,
+                  customEmptyStateIndicator: k
                 }
               )
             }
@@ -1555,57 +1559,63 @@ const Ss = ({
           /* @__PURE__ */ e(
             "div",
             {
-              className: p(
+              className: R(
                 "messaging-conversation-view flex-1 flex-col min-w-0 min-h-0",
                 {
                   // In direct conversation mode, always show (full width)
-                  flex: B || K,
+                  flex: O || K,
                   // Normal mode: hide on mobile when no channel selected
-                  "hidden lg:flex": !B && !K
+                  "hidden lg:flex": !O && !K
                 }
               ),
               children: I ? /* @__PURE__ */ e("div", { className: "flex-1 min-h-0 flex flex-col", children: /* @__PURE__ */ e(
-                we,
+                ye,
                 {
                   channel: I,
-                  onBack: Ie,
-                  showBackButton: !B,
+                  onBack: ke,
+                  showBackButton: !O,
                   renderMessageInputActions: n,
-                  onLeaveConversation: pe,
-                  onBlockParticipant: Re,
-                  CustomChannelEmptyState: c
+                  onLeaveConversation: De,
+                  onBlockParticipant: _e,
+                  CustomChannelEmptyState: d
                 },
                 I.id
-              ) }) : /* @__PURE__ */ e(ye, { hasChannels: R })
+              ) }) : /* @__PURE__ */ e(
+                Ee,
+                {
+                  hasChannels: S,
+                  channelsLoaded: c
+                }
+              )
             }
           )
         ] }),
-        J && // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
+        B && // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
         /* @__PURE__ */ e(
           "dialog",
           {
-            ref: W,
+            ref: M,
             className: "mes-dialog",
-            onClick: Se,
+            onClick: Re,
             onClose: X,
             children: /* @__PURE__ */ e("div", { className: "h-full w-full bg-white shadow-max-elevation-light", children: /* @__PURE__ */ e(
-              fs,
+              xs,
               {
-                participantSource: J,
-                onSelectParticipant: ke,
+                participantSource: B,
+                onSelectParticipant: Se,
                 onClose: X,
-                existingParticipantIds: x,
-                participantLabel: _,
-                searchPlaceholder: `Search ${_}...`
+                existingParticipantIds: j,
+                participantLabel: $,
+                searchPlaceholder: `Search ${$}...`
               },
-              z
+              Y
             ) })
           }
         )
       ]
     }
   );
-}, Cs = ({
+}, bs = ({
   question: t,
   onClick: s,
   loading: n = !1,
@@ -1617,7 +1627,7 @@ const Ss = ({
     onClick: s,
     disabled: n,
     style: { backgroundColor: "#E6E5E3" },
-    className: p(
+    className: R(
       "w-full text-center p-4 rounded-xl text-charcoal font-medium transition-colors",
       {
         "hover:brightness-95 active:brightness-90": !n,
@@ -1627,7 +1637,7 @@ const Ss = ({
     ),
     children: t
   }
-), ps = ({
+), Ds = ({
   faqs: t,
   onFaqClick: s,
   loadingFaqId: n,
@@ -1636,10 +1646,10 @@ const Ss = ({
   avatarImage: o,
   avatarName: l
 }) => {
-  const c = t.filter((m) => m.enabled).sort((m, g) => (m.order ?? 0) - (g.order ?? 0));
-  return c.length === 0 ? null : /* @__PURE__ */ e("div", { className: a, children: /* @__PURE__ */ i("div", { className: "flex gap-3 items-end", children: [
+  const d = t.filter((h) => h.enabled).sort((h, b) => (h.order ?? 0) - (b.order ?? 0));
+  return d.length === 0 ? null : /* @__PURE__ */ e("div", { className: a, children: /* @__PURE__ */ i("div", { className: "flex gap-3 items-end", children: [
     (o || l) && /* @__PURE__ */ e("div", { className: "flex-none", children: /* @__PURE__ */ e(
-      q,
+      Z,
       {
         id: l || "account",
         name: l || "Account",
@@ -1655,72 +1665,72 @@ const Ss = ({
         style: { backgroundColor: "#F1F0EE" },
         children: [
           r && /* @__PURE__ */ e("p", { className: "text-md text-charcoal mb-4", children: r }),
-          c.map((m) => /* @__PURE__ */ e(
-            Cs,
+          d.map((h) => /* @__PURE__ */ e(
+            bs,
             {
-              question: m.question,
-              onClick: () => s(m.id),
-              loading: n === m.id
+              question: h.question,
+              onClick: () => s(h.id),
+              loading: n === h.id
             },
-            m.id
+            h.id
           ))
         ]
       }
     )
   ] }) });
-}, Rs = (t, s = {}) => {
-  const { initialSearch: n = "", pageSize: r = 20 } = s, [a, o] = v([]), [l, c] = v(!1), [m, g] = v(null), [y, h] = v(n), [f, S] = v(!0), [b, w] = v(), E = M(async (R = !1, F) => {
+}, _s = (t, s = {}) => {
+  const { initialSearch: n = "", pageSize: r = 20 } = s, [a, o] = v([]), [l, d] = v(!1), [h, b] = v(null), [k, u] = v(n), [f, g] = v(!0), [w, y] = v(), E = _(async (S = !1, P) => {
     if (l) return;
-    const d = F !== void 0 ? F : y;
-    c(!0), g(null);
+    const c = P !== void 0 ? P : k;
+    d(!0), b(null);
     try {
-      const u = await t.loadParticipants({
-        search: d || void 0,
+      const m = await t.loadParticipants({
+        search: c || void 0,
         limit: r,
-        cursor: R ? void 0 : b
+        cursor: S ? void 0 : w
       });
       o(
-        (x) => R ? u.participants : [...x, ...u.participants]
-      ), S(u.hasMore), w(u.nextCursor);
-    } catch (u) {
-      const x = u instanceof Error ? u.message : "Failed to load participants";
-      g(x), console.error("[useParticipants] Load error:", u);
+        (N) => S ? m.participants : [...N, ...m.participants]
+      ), g(m.hasMore), y(m.nextCursor);
+    } catch (m) {
+      const N = m instanceof Error ? m.message : "Failed to load participants";
+      b(N), console.error("[useParticipants] Load error:", m);
     } finally {
-      c(!1);
+      d(!1);
     }
-  }, [t, y, b, r, l]), N = M(() => {
+  }, [t, k, w, r, l]), C = _(() => {
     f && !l && E(!1);
-  }, [f, l, E]), I = M((R) => {
-    h(R), w(void 0), E(!0, R);
-  }, [E]), k = M(() => {
-    w(void 0), E(!0);
+  }, [f, l, E]), I = _((S) => {
+    u(S), y(void 0), E(!0, S);
+  }, [E]), p = _(() => {
+    y(void 0), E(!0);
   }, [E]);
   return G(() => {
     E(!0);
   }, [t.loadParticipants]), {
     participants: a,
     loading: l,
-    error: m,
-    searchQuery: y,
+    error: h,
+    searchQuery: k,
     hasMore: f,
     totalCount: t.totalCount,
-    loadMore: N,
+    loadMore: C,
     search: I,
-    refresh: k
+    refresh: p
   };
 };
 export {
-  q as Avatar,
-  cs as ChannelEmptyState,
-  Ne as ChannelList,
-  we as ChannelView,
-  ps as FaqList,
-  Cs as FaqListItem,
-  ks as MessagingProvider,
-  Ss as MessagingShell,
-  fs as ParticipantPicker,
-  es as formatRelativeTime,
-  Xe as useMessaging,
-  Rs as useParticipants
+  Z as Avatar,
+  us as ChannelEmptyState,
+  be as ChannelList,
+  ye as ChannelView,
+  Ds as FaqList,
+  bs as FaqListItem,
+  Ss as MessagingProvider,
+  Rs as MessagingShell,
+  xs as ParticipantPicker,
+  ts as formatRelativeTime,
+  es as useMessaging,
+  _s as useParticipants
 };
 //# sourceMappingURL=index.js.map