@linktr.ee/messaging-react 1.8.4 → 1.8.5

package/dist/index.js

@@ -1,9 +1,9 @@
-import { jsx as e, jsxs as d, Fragment as le } from "react/jsx-runtime";
+import { jsx as e, jsxs as u, Fragment as le } from "react/jsx-runtime";
 import D from "classnames";
-import q, { createContext as Ie, useContext as Se, useCallback as P, useState as C, useRef as G, useEffect as H } from "react";
+import q, { createContext as Ie, useContext as Se, useCallback as P, useState as w, useRef as $, useEffect as G } from "react";
 import { StreamChatService as Re } from "@linktr.ee/messaging-core";
 import { Chat as ke, ChannelList as Te, Channel as De, useChannelStateContext as me, Window as Fe, MessageList as Me, MessageInput as Ue } from "stream-chat-react";
-import { XIcon as he, ArrowLeftIcon as Pe, DotsThreeIcon as Oe, SpinnerGapIcon as ee, SignOutIcon as pe, ProhibitInsetIcon as ie, FlagIcon as Le, MagnifyingGlassIcon as je, ChatCircleDotsIcon as ce } from "@phosphor-icons/react";
+import { XIcon as he, ArrowLeftIcon as Pe, DotsThreeIcon as pe, SpinnerGapIcon as ee, SignOutIcon as Oe, ProhibitInsetIcon as ie, FlagIcon as Le, MagnifyingGlassIcon as je, ChatCircleDotsIcon as ce } from "@phosphor-icons/react";
 const fe = Ie({
   service: null,
   client: null,
@@ -21,29 +21,29 @@ const fe = Ie({
   serviceConfig: n,
   apiKey: r,
   capabilities: a = {},
-  customization: c = {},
-  debug: i = !1
+  customization: d = {},
+  debug: c = !1
 }) => {
   const l = P(
-    (v, ...F) => {
-      i && console.log(`🔥 [MessagingProvider] ${v}`, ...F);
+    (b, ...F) => {
+      c && console.log(`🔥 [MessagingProvider] ${b}`, ...F);
     },
-    [i]
+    [c]
   );
   l("🔄 RENDER START", {
     userId: s == null ? void 0 : s.id,
     apiKey: (r == null ? void 0 : r.substring(0, 8)) + "...",
     serviceConfig: !!n,
     capabilities: Object.keys(a),
-    customization: Object.keys(c)
+    customization: Object.keys(d)
   });
-  const [o, E] = C(null), [b, u] = C(null), [f, I] = C(!1), [x, w] = C(!1), [m, k] = C(null), S = G(!1), y = G({
+  const [o, E] = w(null), [v, m] = w(null), [g, R] = w(!1), [x, C] = w(!1), [h, k] = w(null), I = $(!1), y = $({
     userId: s == null ? void 0 : s.id,
     apiKey: r,
     serviceConfig: n,
     capabilities: a,
-    customization: c
-  }), T = G(0);
+    customization: d
+  }), T = $(0);
   T.current++, l("📊 RENDER INFO", {
     renderCount: T.current,
     currentProps: { userId: s == null ? void 0 : s.id, apiKey: (r == null ? void 0 : r.substring(0, 8)) + "..." },
@@ -52,18 +52,18 @@ const fe = Ie({
       apiKeyChanged: y.current.apiKey !== r,
       serviceConfigChanged: y.current.serviceConfig !== n,
       capabilitiesChanged: y.current.capabilities !== a,
-      customizationChanged: y.current.customization !== c
+      customizationChanged: y.current.customization !== d
     }
   }), y.current = {
     userId: s == null ? void 0 : s.id,
     apiKey: r,
     serviceConfig: n,
     capabilities: a,
-    customization: c
-  }, H(() => {
-    const v = T.current;
+    customization: d
+  }, G(() => {
+    const b = T.current;
     if (l("🔧 SERVICE INIT EFFECT TRIGGERED", {
-      renderCount: v,
+      renderCount: b,
       apiKey: !!r,
       serviceConfig: !!n,
       dependencies: {
@@ -74,46 +74,46 @@ const fe = Ie({
       }
     }), !r || !n) {
       l("⚠️ SERVICE INIT SKIPPED", {
-        renderCount: v,
+        renderCount: b,
         reason: "Missing apiKey or serviceConfig"
       });
       return;
     }
     l("🚀 CREATING NEW SERVICE", {
-      renderCount: v,
+      renderCount: b,
       apiKey: (r == null ? void 0 : r.substring(0, 8)) + "...",
       serviceConfigChanged: y.current.serviceConfig !== n
     });
     const F = new Re({
       ...n,
       apiKey: r,
-      debug: i
+      debug: c
     });
     return E(F), l("✅ SERVICE SET", {
-      renderCount: v,
+      renderCount: b,
       serviceInstance: !!F
     }), () => {
       l("🧹 SERVICE CLEANUP", {
-        renderCount: v,
+        renderCount: b,
         reason: "Effect cleanup"
       }), F.disconnectUser().catch(console.error);
     };
-  }, [r, n, i, l]);
-  const U = G(null);
-  H(() => {
+  }, [r, n, c, l]);
+  const U = $(null);
+  G(() => {
     var F, z;
     if (l("🔗 USER CONNECTION EFFECT TRIGGERED", {
       hasService: !!o,
       hasUser: !!s,
       userId: s == null ? void 0 : s.id,
-      isConnecting: S.current,
-      isConnected: f,
+      isConnecting: I.current,
+      isConnected: g,
       dependencies: { service: !!o, userId: s == null ? void 0 : s.id }
     }), !o || !s) {
       l("⚠️ USER CONNECTION SKIPPED", "Missing service or user");
       return;
     }
-    if (S.current) {
+    if (I.current) {
       l("⚠️ USER CONNECTION SKIPPED", "Already connecting");
       return;
     }
@@ -125,40 +125,40 @@ const fe = Ie({
       return;
     }
     (async () => {
-      l("🚀 STARTING USER CONNECTION", { userId: s.id }), S.current = !0, w(!0), k(null);
+      l("🚀 STARTING USER CONNECTION", { userId: s.id }), I.current = !0, C(!0), k(null);
       try {
         l("📞 CALLING SERVICE.CONNECTUSER", { userId: s.id });
         const M = await o.connectUser(s);
-        u(M), I(!0), U.current = { serviceId: o, userId: s.id }, l("✅ USER CONNECTION SUCCESS", {
+        m(M), R(!0), U.current = { serviceId: o, userId: s.id }, l("✅ USER CONNECTION SUCCESS", {
           userId: s.id,
           clientId: M.userID
         });
       } catch (M) {
-        const A = M instanceof Error ? M.message : "Connection failed";
-        k(A), l("❌ USER CONNECTION ERROR", {
+        const B = M instanceof Error ? M.message : "Connection failed";
+        k(B), l("❌ USER CONNECTION ERROR", {
           userId: s.id,
-          error: A
+          error: B
         });
       } finally {
-        w(!1), S.current = !1, l("🔄 USER CONNECTION FINISHED", {
+        C(!1), I.current = !1, l("🔄 USER CONNECTION FINISHED", {
           userId: s.id,
-          isConnected: f
+          isConnected: g
         });
       }
     })();
-  }, [o, s, l, f]), H(() => (l("🔌 CLEANUP EFFECT REGISTERED", {
+  }, [o, s, l, g]), G(() => (l("🔌 CLEANUP EFFECT REGISTERED", {
     hasService: !!o,
-    isConnected: f
+    isConnected: g
   }), () => {
-    o && f ? (l(
+    o && g ? (l(
       "🧹 CLEANUP EFFECT TRIGGERED",
       "Cleaning up connection on unmount"
     ), U.current = null, o.disconnectUser().catch(console.error)) : l("🔇 CLEANUP EFFECT SKIPPED", {
       hasService: !!o,
-      isConnected: f
+      isConnected: g
     });
-  }), [o, f, l]);
-  const h = P(async () => {
+  }), [o, g, l]);
+  const i = P(async () => {
     if (l("🔄 REFRESH CONNECTION CALLED", {
       hasService: !!o,
       hasUser: !!s
@@ -166,67 +166,67 @@ const fe = Ie({
       l("⚠️ REFRESH CONNECTION SKIPPED", "Missing service or user");
       return;
     }
-    l("🚀 STARTING CONNECTION REFRESH", { userId: s.id }), w(!0);
+    l("🚀 STARTING CONNECTION REFRESH", { userId: s.id }), C(!0);
     try {
       l("🔌 DISCONNECTING FOR REFRESH"), await o.disconnectUser(), l("📞 RECONNECTING FOR REFRESH");
-      const v = await o.connectUser(s);
-      u(v), I(!0), k(null), l("✅ CONNECTION REFRESH SUCCESS", { userId: s.id });
-    } catch (v) {
-      const F = v instanceof Error ? v.message : "Refresh failed";
+      const b = await o.connectUser(s);
+      m(b), R(!0), k(null), l("✅ CONNECTION REFRESH SUCCESS", { userId: s.id });
+    } catch (b) {
+      const F = b instanceof Error ? b.message : "Refresh failed";
       k(F), l("❌ CONNECTION REFRESH ERROR", {
         userId: s.id,
         error: F
       });
     } finally {
-      w(!1), l("🔄 CONNECTION REFRESH FINISHED", { userId: s.id });
+      C(!1), l("🔄 CONNECTION REFRESH FINISHED", { userId: s.id });
     }
-  }, [o, s, l]), g = q.useMemo(() => (l("💫 CONTEXT VALUE MEMOIZATION", {
+  }, [o, s, l]), f = q.useMemo(() => (l("💫 CONTEXT VALUE MEMOIZATION", {
     hasService: !!o,
-    hasClient: !!b,
-    isConnected: f,
+    hasClient: !!v,
+    isConnected: g,
     isLoading: x,
-    hasError: !!m,
+    hasError: !!h,
     capabilitiesKeys: Object.keys(a),
-    customizationKeys: Object.keys(c)
+    customizationKeys: Object.keys(d)
   }), {
     service: o,
-    client: b,
-    isConnected: f,
+    client: v,
+    isConnected: g,
     isLoading: x,
-    error: m,
+    error: h,
     capabilities: a,
-    customization: c,
-    refreshConnection: h,
-    debug: i
+    customization: d,
+    refreshConnection: i,
+    debug: c
   }), [
     o,
-    b,
-    f,
+    v,
+    g,
     x,
-    m,
-    a,
-    c,
     h,
+    a,
+    d,
     i,
+    c,
     l
   ]);
   return l("🔄 RENDER END", {
     renderCount: T.current,
-    willRenderChat: !!(b && f),
-    contextValueReady: !!g
-  }), /* @__PURE__ */ e(fe.Provider, { value: g, children: b && f ? /* @__PURE__ */ e(ke, { client: b, children: t }) : t });
-}, Be = () => se(), Ae = (t, s) => {
+    willRenderChat: !!(v && g),
+    contextValueReady: !!f
+  }), /* @__PURE__ */ e(fe.Provider, { value: f, children: v && g ? /* @__PURE__ */ e(ke, { client: v, children: t }) : t });
+}, _e = () => se(), Be = (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));
-}, $e = (t) => {
+}, Ae = (t) => {
   const s = /* @__PURE__ */ new Date();
   if (Math.floor((s.getTime() - t.getTime()) / 1e3) < 60)
     return "Just now";
-  const r = Ae(t, s);
+  const r = Be(t, s);
   return r === 0 ? t.toLocaleTimeString([], {
     hour: "numeric",
     minute: "2-digit"
@@ -263,7 +263,7 @@ const fe = Ie({
   "🍈"
   // Melon
 ];
-function Ge(t) {
+function $e(t) {
   let s = 0;
   for (let n = 0; n < t.length; n++) {
     const r = t.charCodeAt(n);
@@ -271,8 +271,8 @@ function Ge(t) {
   }
   return Math.abs(s);
 }
-function He(t) {
-  const n = Ge(t) % de.length;
+function Ge(t) {
+  const n = $e(t) % de.length;
   return de[n];
 }
 const J = ({
@@ -281,7 +281,7 @@ const J = ({
   size: n = 40,
   className: r
 }) => {
-  const a = He(t), i = n < 32 ? "text-xs" : n < 56 ? "text-sm" : "text-lg";
+  const a = Ge(t), c = n < 32 ? "text-xs" : n < 56 ? "text-sm" : "text-lg";
   return /* @__PURE__ */ e(
     "div",
     {
@@ -306,69 +306,74 @@ const J = ({
           "aria-hidden": "true",
           className: D(
             "avatar-fallback flex h-full w-full items-center justify-center font-semibold bg-[#E6E5E3] select-none transition-colors",
-            i
+            c
           ),
           children: a
         }
       )
     }
   );
-}, _e = ({ channel: t, selectedChannel: s, onChannelSelect: n, debug: r = !1, unread: a }) => {
-  var w, m, k, S, y, T;
-  const c = (s == null ? void 0 : s.id) === (t == null ? void 0 : t.id), i = () => {
+}, He = ({ channel: t, selectedChannel: s, onChannelSelect: n, debug: r = !1, unread: a }) => {
+  var h, k, I, y, T, U;
+  const d = (s == null ? void 0 : s.id) === (t == null ? void 0 : t.id), c = () => {
     t && n(t);
-  }, o = Object.values(((w = t == null ? void 0 : t.state) == null ? void 0 : w.members) || {}).find(
-    (U) => {
-      var h, g;
-      return ((h = U.user) == null ? void 0 : h.id) && U.user.id !== ((g = t == null ? void 0 : t._client) == null ? void 0 : g.userID);
+  }, o = Object.values(((h = t == null ? void 0 : t.state) == null ? void 0 : h.members) || {}).find(
+    (i) => {
+      var f, b;
+      return ((f = i.user) == null ? void 0 : f.id) && i.user.id !== ((b = t == null ? void 0 : t._client) == null ? void 0 : b.userID);
     }
-  ), E = ((m = o == null ? void 0 : o.user) == null ? void 0 : m.name) || "Conversation", b = (k = o == null ? void 0 : o.user) == null ? void 0 : k.image, u = (y = (S = t == null ? void 0 : t.state) == null ? void 0 : S.messages) == null ? void 0 : y[t.state.messages.length - 1], f = (u == null ? void 0 : u.text) || "No messages yet", I = u != null && u.created_at ? $e(new Date(u.created_at)) : "", x = a ?? 0;
+  ), E = ((k = o == null ? void 0 : o.user) == null ? void 0 : k.name) || "Conversation", v = (I = o == null ? void 0 : o.user) == null ? void 0 : I.image, m = (T = (y = t == null ? void 0 : t.state) == null ? void 0 : y.messages) == null ? void 0 : T[t.state.messages.length - 1], R = (() => {
+    var f;
+    if (m != null && m.text) return m.text;
+    const i = (f = m == null ? void 0 : m.attachments) == null ? void 0 : f[0];
+    return i != null && i.asset_url ? i.asset_url : i != null && i.image_url ? i.image_url : i != null && i.og_scrape_url ? i.og_scrape_url : i != null && i.thumb_url ? i.thumb_url : "No messages yet";
+  })(), x = m != null && m.created_at ? Ae(new Date(m.created_at)) : "", C = a ?? 0;
   return r && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
     channelId: t == null ? void 0 : t.id,
-    isSelected: c,
+    isSelected: d,
     participantName: E,
-    unreadCount: x,
-    hasTimestamp: !!I
+    unreadCount: C,
+    hasTimestamp: !!x
   }), /* @__PURE__ */ e(
     "button",
     {
       type: "button",
-      onClick: i,
+      onClick: c,
       className: D(
         "group w-full px-4 py-3 transition-colors border-b border-sand text-left max-w-full overflow-hidden focus-ring",
         {
-          "bg-primary-alt/10 border-l-4 border-l-primary": c,
-          "hover:bg-sand": !c
+          "bg-primary-alt/10 border-l-4 border-l-primary": d,
+          "hover:bg-sand": !d
         }
       ),
-      children: /* @__PURE__ */ d("div", { className: "flex items-start gap-3", children: [
+      children: /* @__PURE__ */ u("div", { className: "flex items-start gap-3", children: [
         /* @__PURE__ */ e(
           J,
           {
-            id: ((T = o == null ? void 0 : o.user) == null ? void 0 : T.id) || t.id || "unknown",
+            id: ((U = o == null ? void 0 : o.user) == null ? void 0 : U.id) || t.id || "unknown",
             name: E,
-            image: b,
+            image: v,
             size: 44,
             className: "[&_.avatar-fallback]:group-hover:bg-[#eeeeee]"
           }
         ),
-        /* @__PURE__ */ d("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
-          /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-2", children: [
+        /* @__PURE__ */ u("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
+          /* @__PURE__ */ u("div", { className: "flex items-center justify-between gap-2", children: [
             /* @__PURE__ */ e(
               "h3",
               {
                 className: D(
                   "text-sm font-medium truncate",
-                  c ? "text-primary" : "text-charcoal"
+                  d ? "text-primary" : "text-charcoal"
                 ),
                 children: E
               }
             ),
-            I && /* @__PURE__ */ e("span", { className: "text-xs text-stone flex-shrink-0", children: I })
+            x && /* @__PURE__ */ e("span", { className: "text-xs text-stone flex-shrink-0", children: x })
           ] }),
-          /* @__PURE__ */ d("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: f }),
-            x > 0 && /* @__PURE__ */ e("span", { className: "bg-primary text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: x > 99 ? "99+" : x })
+          /* @__PURE__ */ u("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: R }),
+            C > 0 && /* @__PURE__ */ e("span", { className: "bg-primary text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: C > 99 ? "99+" : C })
           ] })
         ] })
       ] })
@@ -382,8 +387,8 @@ const J = ({
 }) => {
   const a = q.useRef(0);
   a.current++;
-  const { debug: c = !1 } = se();
-  return c && console.log("📺 [ChannelList] 🔄 RENDER START", {
+  const { debug: d = !1 } = se();
+  return d && console.log("📺 [ChannelList] 🔄 RENDER START", {
     renderCount: a.current,
     selectedChannelId: s == null ? void 0 : s.id,
     filters: n
@@ -394,7 +399,7 @@ const J = ({
         "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: (c && console.log("📺 [ChannelList] 🎬 RENDERING STREAM CHANNEL LIST", {
+      children: /* @__PURE__ */ e("div", { className: "flex-1 overflow-hidden min-w-0", children: (d && console.log("📺 [ChannelList] 🎬 RENDERING STREAM CHANNEL LIST", {
         renderCount: a.current,
         filters: n
       }), /* @__PURE__ */ e(
@@ -403,19 +408,19 @@ const J = ({
           filters: n,
           sort: { last_message_at: -1 },
           options: { limit: 30 },
-          Preview: (i) => {
+          Preview: (c) => {
             var l, o;
-            return c && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
-              channelId: (l = i.channel) == null ? void 0 : l.id,
+            return d && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
+              channelId: (l = c.channel) == null ? void 0 : l.id,
               selectedChannelId: s == null ? void 0 : s.id,
-              isSelected: (s == null ? void 0 : s.id) === ((o = i.channel) == null ? void 0 : o.id)
+              isSelected: (s == null ? void 0 : s.id) === ((o = c.channel) == null ? void 0 : o.id)
             }), /* @__PURE__ */ e(
-              _e,
+              He,
               {
-                ...i,
+                ...c,
                 selectedChannel: s,
                 onChannelSelect: t,
-                debug: c
+                debug: d
               }
             );
           }
@@ -443,7 +448,7 @@ const J = ({
   }
 );
 function oe({ label: t, className: s, children: n, ...r }) {
-  return /* @__PURE__ */ d(
+  return /* @__PURE__ */ u(
     "button",
     {
       type: "button",
@@ -466,22 +471,22 @@ function oe({ label: t, className: s, children: n, ...r }) {
 function ge({ onClick: t }) {
   return /* @__PURE__ */ e(oe, { label: "Close", onClick: t, className: "p-1", children: /* @__PURE__ */ e(he, { className: "h-5 w-5 text-stone", weight: "bold" }) });
 }
-const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ d("div", { className: "text-center max-w-sm", children: [
+const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ u("div", { className: "text-center max-w-sm", children: [
   /* @__PURE__ */ e("h2", { className: "font-semibold text-charcoal mb-2", children: "No messages yet 👀" }),
   /* @__PURE__ */ e("p", { className: "text-stone text-xs", children: "Share to social media to generate more conversations" })
-] }) }), We = ({ renderActions: t }) => /* @__PURE__ */ d("div", { className: "message-input flex items-center gap-2 p-4", children: [
+] }) }), We = ({ renderActions: t }) => /* @__PURE__ */ u("div", { className: "message-input flex items-center gap-2 p-4", children: [
   t && t(),
   /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e(Ue, { focus: !0, maxRows: 4 }) })
 ] }), ze = ({ onBack: t, showBackButton: s, onShowInfo: n, canShowInfo: r }) => {
-  var o, E, b, u;
-  const { channel: a } = me(), c = q.useMemo(() => Object.values(a.state.members || {}).find(
-    (I) => {
+  var o, E, v, m;
+  const { channel: a } = me(), d = q.useMemo(() => Object.values(a.state.members || {}).find(
+    (R) => {
       var x;
-      return ((x = I.user) == null ? void 0 : x.id) && I.user.id !== a._client.userID;
+      return ((x = R.user) == null ? void 0 : x.id) && R.user.id !== a._client.userID;
     }
-  ), [a._client.userID, a.state.members]), i = ((o = c == null ? void 0 : c.user) == null ? void 0 : o.name) || ((E = c == null ? void 0 : c.user) == null ? void 0 : E.id) || "Unknown member", l = (b = c == null ? void 0 : c.user) == null ? void 0 : b.image;
-  return /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-3 min-h-12", children: [
-    /* @__PURE__ */ d("div", { className: "flex items-center gap-3 min-w-0", children: [
+  ), [a._client.userID, a.state.members]), c = ((o = d == null ? void 0 : d.user) == null ? void 0 : o.name) || ((E = d == null ? void 0 : d.user) == null ? void 0 : E.id) || "Unknown member", l = (v = d == null ? void 0 : d.user) == null ? void 0 : v.image;
+  return /* @__PURE__ */ u("div", { className: "flex items-center justify-between gap-3 min-h-12", children: [
+    /* @__PURE__ */ u("div", { className: "flex items-center gap-3 min-w-0", children: [
       s && t && /* @__PURE__ */ e(
         "button",
         {
@@ -495,15 +500,15 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
       /* @__PURE__ */ e(
         J,
         {
-          id: ((u = c == null ? void 0 : c.user) == null ? void 0 : u.id) || a.id || "unknown",
-          name: i,
+          id: ((m = d == null ? void 0 : d.user) == null ? void 0 : m.id) || a.id || "unknown",
+          name: c,
           image: l,
           size: 40
         }
       ),
-      /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e("h1", { className: "text-lg font-semibold text-charcoal truncate", children: i }) })
+      /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e("h1", { className: "text-lg font-semibold text-charcoal truncate", children: c }) })
     ] }),
-    r && n && /* @__PURE__ */ e(oe, { label: "Chat info", onClick: n, children: /* @__PURE__ */ e(Oe, { className: "h-6 w-6 text-charcoal", weight: "bold" }) })
+    r && n && /* @__PURE__ */ e(oe, { label: "Chat info", onClick: n, children: /* @__PURE__ */ e(pe, { className: "h-6 w-6 text-charcoal", weight: "bold" }) })
   ] });
 }, qe = ({
   isOpen: t,
@@ -511,71 +516,71 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
   participant: n,
   channel: r,
   followerStatusLabel: a,
-  onLeaveConversation: c,
-  onBlockParticipant: i
+  onLeaveConversation: d,
+  onBlockParticipant: c
 }) => {
-  var M, A, Y, _, V, Q, W;
-  const { service: l, debug: o } = se(), E = G(null), [b, u] = C(!1), [f, I] = C(!1), [x, w] = C(!1);
-  H(() => {
-    const R = E.current;
-    R && (t ? R.showModal() : R.close());
+  var M, B, Y, H, V, Q, W;
+  const { service: l, debug: o } = se(), E = $(null), [v, m] = w(!1), [g, R] = w(!1), [x, C] = w(!1);
+  G(() => {
+    const S = E.current;
+    S && (t ? S.showModal() : S.close());
   }, [t]);
-  const m = P(async () => {
-    var R;
-    if (!(!l || !((R = n == null ? void 0 : n.user) != null && R.id)))
+  const h = P(async () => {
+    var S;
+    if (!(!l || !((S = n == null ? void 0 : n.user) != null && S.id)))
       try {
         const j = (await l.getBlockedUsers()).some(
-          (B) => {
+          (_) => {
             var X;
-            return B.blocked_user_id === ((X = n == null ? void 0 : n.user) == null ? void 0 : X.id);
+            return _.blocked_user_id === ((X = n == null ? void 0 : n.user) == null ? void 0 : X.id);
           }
         );
-        u(j);
-      } catch (p) {
+        m(j);
+      } catch (O) {
         console.error(
           "[ChannelInfoDialog] Failed to check blocked status:",
-          p
+          O
         );
       }
   }, [l, (M = n == null ? void 0 : n.user) == null ? void 0 : M.id]);
-  H(() => {
-    t && m();
-  }, [t, m]);
+  G(() => {
+    t && h();
+  }, [t, h]);
   const k = async () => {
-    var R;
-    if (!f) {
-      o && console.log("[ChannelInfoDialog] Leave conversation", r.cid), I(!0);
+    var S;
+    if (!g) {
+      o && console.log("[ChannelInfoDialog] Leave conversation", r.cid), R(!0);
       try {
-        const p = ((R = r._client) == null ? void 0 : R.userID) ?? null;
-        await r.hide(p, !1), c && await c(r), s();
-      } catch (p) {
-        console.error("[ChannelInfoDialog] Failed to leave conversation", p);
+        const O = ((S = r._client) == null ? void 0 : S.userID) ?? null;
+        await r.hide(O, !1), d && await d(r), s();
+      } catch (O) {
+        console.error("[ChannelInfoDialog] Failed to leave conversation", O);
       } finally {
-        I(!1);
+        R(!1);
       }
     }
-  }, S = async () => {
-    var R, p, j;
+  }, I = async () => {
+    var S, O, j;
     if (!(x || !l)) {
-      o && console.log("[ChannelInfoDialog] Block member", (R = n == null ? void 0 : n.user) == null ? void 0 : R.id), w(!0);
+      o && console.log("[ChannelInfoDialog] Block member", (S = n == null ? void 0 : n.user) == null ? void 0 : S.id), C(!0);
       try {
-        await l.blockUser((p = n == null ? void 0 : n.user) == null ? void 0 : p.id), i && await i((j = n == null ? void 0 : n.user) == null ? void 0 : j.id), s();
-      } catch (B) {
-        console.error("[ChannelInfoDialog] Failed to block member", B);
+        await l.blockUser((O = n == null ? void 0 : n.user) == null ? void 0 : O.id), c && await c((j = n == null ? void 0 : n.user) == null ? void 0 : j.id), s();
+      } catch (_) {
+        console.error("[ChannelInfoDialog] Failed to block member", _);
       } finally {
-        w(!1);
+        C(!1);
       }
     }
   }, y = async () => {
-    var R, p, j;
+    var S, O, j;
     if (!(x || !l)) {
-      o && console.log("[ChannelInfoDialog] Unblock member", (R = n == null ? void 0 : n.user) == null ? void 0 : R.id), w(!0);
+      o && console.log("[ChannelInfoDialog] Unblock member", (S = n == null ? void 0 : n.user) == null ? void 0 : S.id), C(!0);
       try {
-        await l.unBlockUser((p = n == null ? void 0 : n.user) == null ? void 0 : p.id), i && await i((j = n == null ? void 0 : n.user) == null ? void 0 : j.id), s();
-      } catch (B) {
-        console.error("[ChannelInfoDialog] Failed to unblock member", B);
+        await l.unBlockUser((O = n == null ? void 0 : n.user) == null ? void 0 : O.id), c && await c((j = n == null ? void 0 : n.user) == null ? void 0 : j.id), s();
+      } catch (_) {
+        console.error("[ChannelInfoDialog] Failed to unblock member", _);
       } finally {
-        w(!1);
+        C(!1);
       }
     }
   }, T = () => {
@@ -586,7 +591,7 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
     );
   };
   if (!n) return null;
-  const U = ((A = n.user) == null ? void 0 : A.name) || ((Y = n.user) == null ? void 0 : Y.id) || "Unknown member", h = (_ = n.user) == null ? void 0 : _.image, g = (V = n.user) == null ? void 0 : V.email, v = (Q = n.user) == null ? void 0 : Q.username, F = g || (v ? `linktr.ee/${v}` : void 0), z = ((W = n.user) == null ? void 0 : W.id) || "unknown";
+  const U = ((B = n.user) == null ? void 0 : B.name) || ((Y = n.user) == null ? void 0 : Y.id) || "Unknown member", i = (H = n.user) == null ? void 0 : H.image, f = (V = n.user) == null ? void 0 : V.email, b = (Q = n.user) == null ? void 0 : Q.username, F = f || (b ? `linktr.ee/${b}` : void 0), z = ((W = n.user) == null ? void 0 : W.id) || "unknown";
   return (
     // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
     /* @__PURE__ */ e(
@@ -595,32 +600,32 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
         ref: E,
         className: "mes-dialog",
         onClose: s,
-        onClick: (R) => {
-          R.target === E.current && s();
+        onClick: (S) => {
+          S.target === E.current && s();
         },
-        children: /* @__PURE__ */ d("div", { className: "ml-auto flex h-full w-full flex-col bg-white shadow-max-elevation-light", children: [
-          /* @__PURE__ */ d("div", { className: "flex items-center justify-between border-b border-sand px-4 py-3", children: [
+        children: /* @__PURE__ */ u("div", { className: "ml-auto flex h-full w-full flex-col bg-white shadow-max-elevation-light", children: [
+          /* @__PURE__ */ u("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(ge, { onClick: s })
           ] }),
-          /* @__PURE__ */ d("div", { className: "flex-1 px-2 overflow-y-auto w-full", children: [
+          /* @__PURE__ */ u("div", { className: "flex-1 px-2 overflow-y-auto w-full", children: [
             /* @__PURE__ */ e(
               "div",
               {
                 className: "flex flex-col items-center gap-3 self-stretch px-4 py-2 mt-6 rounded-lg border border-black/[0.04]",
                 style: { backgroundColor: "#FBFAF9" },
-                children: /* @__PURE__ */ d("div", { className: "flex items-center gap-3 w-full", children: [
+                children: /* @__PURE__ */ u("div", { className: "flex items-center gap-3 w-full", children: [
                   /* @__PURE__ */ e(
                     J,
                     {
                       id: z,
                       name: U,
-                      image: h,
+                      image: i,
                       size: 88,
                       className: "!rounded-full"
                     }
                   ),
-                  /* @__PURE__ */ d("div", { className: "flex flex-col min-w-0 flex-1", children: [
+                  /* @__PURE__ */ u("div", { className: "flex flex-col min-w-0 flex-1", children: [
                     /* @__PURE__ */ e("p", { className: "truncate text-base font-semibold text-charcoal", children: U }),
                     F && /* @__PURE__ */ e("p", { className: "truncate text-sm text-[#00000055]", children: F }),
                     a && /* @__PURE__ */ e(
@@ -641,20 +646,20 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
                 ] })
               }
             ),
-            /* @__PURE__ */ d("ul", { className: "flex flex-col gap-2 mt-2", children: [
-              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
+            /* @__PURE__ */ u("ul", { className: "flex flex-col gap-2 mt-2", children: [
+              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ u(
                 K,
                 {
                   onClick: k,
-                  disabled: f,
-                  "aria-busy": f,
+                  disabled: g,
+                  "aria-busy": g,
                   children: [
-                    f ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(pe, { className: "h-5 w-5" }),
+                    g ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(Oe, { className: "h-5 w-5" }),
                     /* @__PURE__ */ e("span", { children: "Delete Conversation" })
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("li", { children: b ? /* @__PURE__ */ d(
+              /* @__PURE__ */ e("li", { children: v ? /* @__PURE__ */ u(
                 K,
                 {
                   onClick: y,
@@ -665,10 +670,10 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
                     /* @__PURE__ */ e("span", { children: "Unblock" })
                   ]
                 }
-              ) : /* @__PURE__ */ d(
+              ) : /* @__PURE__ */ u(
                 K,
                 {
-                  onClick: S,
+                  onClick: I,
                   disabled: x,
                   "aria-busy": x,
                   children: [
@@ -677,7 +682,7 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
                   ]
                 }
               ) }),
-              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(K, { variant: "danger", onClick: T, children: [
+              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ u(K, { variant: "danger", onClick: T, children: [
                 /* @__PURE__ */ e(Le, { className: "h-5 w-5" }),
                 /* @__PURE__ */ e("span", { children: "Report" })
               ] }) })
@@ -693,40 +698,40 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
   renderMessageInputActions: n,
   onLeaveConversation: r,
   onBlockParticipant: a,
-  CustomChannelEmptyState: c = xe
+  CustomChannelEmptyState: d = xe
 }) => {
-  var f, I;
-  const { channel: i } = me(), [l, o] = C(!1), E = (((I = (f = i == null ? void 0 : i.state) == null ? void 0 : f.messages) == null ? void 0 : I.length) ?? 0) > 0, b = q.useMemo(() => Object.values(i.state.members || {}).find(
-    (w) => {
-      var m;
-      return ((m = w.user) == null ? void 0 : m.id) && w.user.id !== i._client.userID;
+  var g, R;
+  const { channel: c } = me(), [l, o] = w(!1), E = (((R = (g = c == null ? void 0 : c.state) == null ? void 0 : g.messages) == null ? void 0 : R.length) ?? 0) > 0, v = q.useMemo(() => Object.values(c.state.members || {}).find(
+    (C) => {
+      var h;
+      return ((h = C.user) == null ? void 0 : h.id) && C.user.id !== c._client.userID;
     }
-  ), [i._client.userID, i.state.members]), u = q.useMemo(() => {
-    const x = i.data ?? {};
+  ), [c._client.userID, c.state.members]), m = q.useMemo(() => {
+    const x = c.data ?? {};
     if (x.followerStatus)
       return String(x.followerStatus);
     if (x.isFollower !== void 0)
       return x.isFollower ? "Subscribed to you" : "Not subscribed";
-  }, [i.data]);
-  return /* @__PURE__ */ d(le, { children: [
-    /* @__PURE__ */ d(Fe, { children: [
+  }, [c.data]);
+  return /* @__PURE__ */ u(le, { children: [
+    /* @__PURE__ */ u(Fe, { children: [
       /* @__PURE__ */ e("div", { className: "border-b border-sand bg-white px-4 py-3", children: /* @__PURE__ */ e(
         ze,
         {
           onBack: t,
           showBackButton: s,
           onShowInfo: () => o(!0),
-          canShowInfo: !!b
+          canShowInfo: !!v
         }
       ) }),
-      /* @__PURE__ */ d("div", { className: "flex-1 overflow-hidden relative", children: [
+      /* @__PURE__ */ u("div", { className: "flex-1 overflow-hidden relative", children: [
         /* @__PURE__ */ e(Me, { hideDeletedMessages: !0, hideNewMessageSeparator: !1 }),
-        !E && c && /* @__PURE__ */ e("div", { className: "absolute inset-0 w-full h-full bg-white", children: /* @__PURE__ */ e(c, {}) })
+        !E && d && /* @__PURE__ */ e("div", { className: "absolute inset-0 w-full h-full bg-white", children: /* @__PURE__ */ e(d, {}) })
       ] }),
       /* @__PURE__ */ e(
         We,
         {
-          renderActions: () => n == null ? void 0 : n(i)
+          renderActions: () => n == null ? void 0 : n(c)
         }
       )
     ] }),
@@ -735,9 +740,9 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
       {
         isOpen: l,
         onClose: () => o(!1),
-        participant: b,
-        channel: i,
-        followerStatusLabel: u,
+        participant: v,
+        channel: c,
+        followerStatusLabel: m,
         onLeaveConversation: r,
         onBlockParticipant: a
       }
@@ -749,15 +754,15 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
   showBackButton: n = !1,
   renderMessageInputActions: r,
   onLeaveConversation: a,
-  onBlockParticipant: c,
-  className: i,
+  onBlockParticipant: d,
+  className: c,
   CustomChannelEmptyState: l = xe
 }) => /* @__PURE__ */ e(
   "div",
   {
     className: D(
       "messaging-channel-view h-full flex flex-col",
-      i
+      c
     ),
     children: /* @__PURE__ */ e(De, { channel: t, children: /* @__PURE__ */ e(
       Ye,
@@ -766,7 +771,7 @@ const xe = () => /* @__PURE__ */ e("div", { className: "messaging-channel-empty-
         showBackButton: n,
         renderMessageInputActions: r,
         onLeaveConversation: a,
-        onBlockParticipant: c,
+        onBlockParticipant: d,
         CustomChannelEmptyState: l
       }
     ) })
@@ -777,8 +782,8 @@ function Qe({
   setSearchQuery: s,
   placeholder: n
 }) {
-  const r = G(null);
-  return /* @__PURE__ */ d("div", { className: "relative", children: [
+  const r = $(null);
+  return /* @__PURE__ */ u("div", { className: "relative", children: [
     /* @__PURE__ */ e(
       je,
       {
@@ -817,67 +822,67 @@ const Xe = ({
   onClose: n,
   existingParticipantIds: r = /* @__PURE__ */ new Set(),
   participantLabel: a = "participants",
-  searchPlaceholder: c = "Search participants...",
-  className: i
+  searchPlaceholder: d = "Search participants...",
+  className: c
 }) => {
-  const { debug: l } = se(), [o, E] = C(""), [b, u] = C([]), [f, I] = C(!1), [x, w] = C(null), [m, k] = C(
+  const { debug: l } = se(), [o, E] = w(""), [v, m] = w([]), [g, R] = w(!1), [x, C] = w(null), [h, k] = w(
     null
-  ), S = G(!1);
-  H(() => {
+  ), I = $(!1);
+  G(() => {
     if (t.loading) {
       l && console.log(
         "[ParticipantPicker] Waiting for participant source to finish loading..."
       );
       return;
     }
-    if (S.current) return;
+    if (I.current) return;
     (async () => {
-      l && console.log("[ParticipantPicker] Loading initial participants..."), I(!0), w(null);
+      l && console.log("[ParticipantPicker] Loading initial participants..."), R(!0), C(null);
       try {
-        const g = await t.loadParticipants({
+        const f = await t.loadParticipants({
           search: "",
           // Load all participants initially
           limit: 100
         });
-        u(g.participants), S.current = !0, l && console.log(
+        m(f.participants), I.current = !0, l && console.log(
           "[ParticipantPicker] Participants loaded successfully:",
-          g.participants.length
+          f.participants.length
         );
-      } catch (g) {
-        const v = g instanceof Error ? g.message : "Failed to load participants";
-        w(v), console.error("[ParticipantPicker] Failed to load participants:", g);
+      } catch (f) {
+        const b = f instanceof Error ? f.message : "Failed to load participants";
+        C(b), console.error("[ParticipantPicker] Failed to load participants:", f);
       } finally {
-        I(!1);
+        R(!1);
       }
     })();
   }, [t.loading, l]);
-  const y = b.filter((h) => !r.has(h.id)).filter((h) => {
-    var v;
+  const y = v.filter((i) => !r.has(i.id)).filter((i) => {
+    var b;
     if (!o) return !0;
-    const g = o.toLowerCase();
-    return h.name.toLowerCase().includes(g) || ((v = h.email) == null ? void 0 : v.toLowerCase().includes(g)) || !1;
+    const f = o.toLowerCase();
+    return i.name.toLowerCase().includes(f) || ((b = i.email) == null ? void 0 : b.toLowerCase().includes(f)) || !1;
   }), T = P(
-    async (h) => {
-      if (!m) {
-        k(h.id);
+    async (i) => {
+      if (!h) {
+        k(i.id);
         try {
-          await s(h);
-        } catch (g) {
-          console.error("[ParticipantPicker] Failed to start chat:", g), k(null);
+          await s(i);
+        } catch (f) {
+          console.error("[ParticipantPicker] Failed to start chat:", f), k(null);
         }
       }
     },
-    [s, m]
-  ), U = (h, g) => {
-    (h.key === "Enter" || h.key === " ") && (h.preventDefault(), T(g));
+    [s, h]
+  ), U = (i, f) => {
+    (i.key === "Enter" || i.key === " ") && (i.preventDefault(), T(f));
   };
-  return /* @__PURE__ */ d("div", { className: D("flex flex-col h-full", i), children: [
-    /* @__PURE__ */ d("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: [
-      /* @__PURE__ */ d("div", { className: "flex items-center justify-between mb-3", children: [
+  return /* @__PURE__ */ u("div", { className: D("flex flex-col h-full", c), children: [
+    /* @__PURE__ */ u("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: [
+      /* @__PURE__ */ u("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(ge, { onClick: n })
       ] }),
-      /* @__PURE__ */ d("p", { className: "text-xs text-stone mb-3", children: [
+      /* @__PURE__ */ u("p", { className: "text-xs text-stone mb-3", children: [
         "Select a ",
         a.slice(0, -1),
         " to start messaging (",
@@ -890,77 +895,77 @@ const Xe = ({
         {
           searchQuery: o,
           setSearchQuery: E,
-          placeholder: c
+          placeholder: d
         }
       )
     ] }),
-    x && /* @__PURE__ */ d("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
+    x && /* @__PURE__ */ u("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
       "Error loading ",
       a,
       ": ",
       x
     ] }),
-    /* @__PURE__ */ e("div", { className: "flex-1 overflow-auto", children: f && y.length === 0 ? /* @__PURE__ */ e("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ d("div", { className: "flex items-center space-x-2", children: [
+    /* @__PURE__ */ e("div", { className: "flex-1 overflow-auto", children: g && y.length === 0 ? /* @__PURE__ */ e("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ u("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__ */ d("span", { className: "text-sm text-stone", children: [
+      /* @__PURE__ */ u("span", { className: "text-sm text-stone", children: [
         "Loading ",
         a,
         "..."
       ] })
-    ] }) }) : y.length === 0 ? /* @__PURE__ */ d("div", { className: "p-6 text-center", children: [
+    ] }) }) : y.length === 0 ? /* @__PURE__ */ u("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(ce, { className: "h-8 w-8 text-charcoal" }) }),
-      /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: o ? `No ${a} found` : b.length > 0 ? `Already chatting with all ${a}` : `No ${a} yet` }),
-      /* @__PURE__ */ e("p", { className: "text-xs text-stone", children: o ? "Try a different search term" : b.length > 0 ? `You have existing conversations with all your ${a}` : `${a.charAt(0).toUpperCase() + a.slice(1)} will appear here` })
-    ] }) : /* @__PURE__ */ d("ul", { className: "space-y-0", children: [
-      y.map((h) => {
-        const g = h.name || h.email || h.id, v = h.email && h.name ? h.email : h.phone;
+      /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: o ? `No ${a} found` : v.length > 0 ? `Already chatting with all ${a}` : `No ${a} yet` }),
+      /* @__PURE__ */ e("p", { className: "text-xs text-stone", children: o ? "Try a different search term" : v.length > 0 ? `You have existing conversations with all your ${a}` : `${a.charAt(0).toUpperCase() + a.slice(1)} will appear here` })
+    ] }) : /* @__PURE__ */ u("ul", { className: "space-y-0", children: [
+      y.map((i) => {
+        const f = i.name || i.email || i.id, b = i.email && i.name ? i.email : i.phone;
         return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: () => T(h),
-            onKeyDown: (F) => U(F, h),
+            onClick: () => T(i),
+            onKeyDown: (F) => U(F, i),
             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__ */ d("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ d("div", { className: "flex items-center space-x-3 flex-1 min-w-0", children: [
+            children: /* @__PURE__ */ u("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ u("div", { className: "flex items-center space-x-3 flex-1 min-w-0", children: [
                 /* @__PURE__ */ e(
                   J,
                   {
-                    id: h.id,
-                    name: g,
-                    image: h.image,
+                    id: i.id,
+                    name: f,
+                    image: i.image,
                     size: 40
                   }
                 ),
-                /* @__PURE__ */ d("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-charcoal truncate", children: g }),
-                  v && /* @__PURE__ */ e("p", { className: "text-xs text-stone truncate", children: v })
+                /* @__PURE__ */ u("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-charcoal truncate", children: f }),
+                  b && /* @__PURE__ */ e("p", { className: "text-xs text-stone truncate", children: b })
                 ] })
               ] }),
-              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: m === h.id ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ e(ce, { className: "h-5 w-5 text-stone" }) })
+              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: h === i.id ? /* @__PURE__ */ e(ee, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ e(ce, { className: "h-5 w-5 text-stone" }) })
             ] })
           }
-        ) }, h.id);
+        ) }, i.id);
       }),
-      f && /* @__PURE__ */ e("li", { className: "p-4 flex justify-center", children: /* @__PURE__ */ d("div", { className: "flex items-center space-x-2", children: [
+      g && /* @__PURE__ */ e("li", { className: "p-4 flex justify-center", children: /* @__PURE__ */ u("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__ */ e("span", { className: "text-sm text-stone", children: "Loading more..." })
       ] }) })
     ] }) })
   ] });
-}, Ze = ({ hasChannels: t, onStartConversation: s, participantLabel: n }) => /* @__PURE__ */ e("div", { className: "messaging-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ d("div", { className: "text-center max-w-sm", children: [
+}, Ze = ({ hasChannels: t, onStartConversation: s, participantLabel: n }) => /* @__PURE__ */ e("div", { className: "messaging-empty-state flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ u("div", { className: "text-center max-w-sm", children: [
   /* @__PURE__ */ e("div", { className: "w-24 h-24 bg-primary-alt/10 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", children: "Welcome to Messages" }),
-  /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t ? /* @__PURE__ */ d(le, { children: [
+  /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t ? /* @__PURE__ */ u(le, { children: [
     "Choose a conversation from the list or",
     " ",
-    s && /* @__PURE__ */ d(ue, { onClick: s, children: [
+    s && /* @__PURE__ */ u(ue, { onClick: s, children: [
       "start a new conversation with a ",
       n.slice(0, -1),
       "."
     ] })
-  ] }) : s && /* @__PURE__ */ d(le, { children: [
-    /* @__PURE__ */ d(ue, { onClick: s, children: [
+  ] }) : s && /* @__PURE__ */ u(le, { children: [
+    /* @__PURE__ */ u(ue, { onClick: s, children: [
       "Start a new conversation with one of your ",
       n
     ] }),
@@ -978,7 +983,7 @@ const Xe = ({
     className: "inline-flex items-center gap-1 text-sm font-medium text-primary hover:text-primary-alt focus:outline-none focus:ring-2 focus:ring-primary",
     children: s
   }
-), re = ({ message: t, onBack: s }) => /* @__PURE__ */ e("div", { className: "messaging-error-state flex items-center justify-center h-full p-8", children: /* @__PURE__ */ d("div", { className: "text-center max-w-sm", children: [
+), re = ({ message: t, onBack: s }) => /* @__PURE__ */ e("div", { className: "messaging-error-state flex items-center justify-center h-full p-8", children: /* @__PURE__ */ u("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!" }),
   /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t }),
@@ -991,12 +996,12 @@ const Xe = ({
       children: "Go Back"
     }
   )
-] }) }), Ke = ({ className: t, message: s }) => /* @__PURE__ */ d(
+] }) }), Ke = ({ className: t, message: s }) => /* @__PURE__ */ u(
   "div",
   {
     className: D("flex items-center justify-center h-full", t),
     children: [
-      /* @__PURE__ */ d("svg", { viewBox: "0 0 100 100", className: "size-8 fill-pebble", stroke: "none", children: [
+      /* @__PURE__ */ u("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(
           "animateTransform",
           {
@@ -1034,7 +1039,7 @@ const Xe = ({
       s && /* @__PURE__ */ e("span", { className: "text-stone", children: s })
     ]
   }
-), es = () => /* @__PURE__ */ e("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ d("div", { className: "flex items-center", children: [
+), es = () => /* @__PURE__ */ e("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ u("div", { className: "flex items-center", children: [
   /* @__PURE__ */ e(Ke, { className: "w-6 h-6" }),
   /* @__PURE__ */ e("span", { className: "text-sm text-stone", children: "Loading messages" })
 ] }) }), cs = ({
@@ -1043,26 +1048,26 @@ const Xe = ({
   renderMessageInputActions: n,
   onChannelSelect: r,
   onParticipantSelect: a,
-  initialParticipantFilter: c,
-  initialParticipantData: i,
+  initialParticipantFilter: d,
+  initialParticipantData: c,
   CustomChannelEmptyState: l,
   showChannelList: o = !0,
   filters: E
 }) => {
   const {
-    service: b,
-    client: u,
-    isConnected: f,
-    isLoading: I,
+    service: v,
+    client: m,
+    isConnected: g,
+    isLoading: R,
     error: x,
-    refreshConnection: w,
-    debug: m
-  } = Be(), [k, S] = C(null), [y, T] = C(!1), [U, h] = C(!1), [g, v] = C(/* @__PURE__ */ new Set()), [F, z] = C(0), [M, A] = C(!1), [Y, _] = C(null), V = G(null), {
+    refreshConnection: C,
+    debug: h
+  } = _e(), [k, I] = w(null), [y, T] = w(!1), [U, i] = w(!1), [f, b] = w(/* @__PURE__ */ new Set()), [F, z] = w(0), [M, B] = w(!1), [Y, H] = w(null), V = $(null), {
     showStartConversation: Q = !1,
     participantSource: W,
-    participantLabel: R = "participants"
-  } = t, p = q.useMemo(() => {
-    const N = u == null ? void 0 : u.userID;
+    participantLabel: S = "participants"
+  } = t, O = q.useMemo(() => {
+    const N = m == null ? void 0 : m.userID;
     return {
       ...{
         type: "messaging",
@@ -1074,164 +1079,164 @@ const Xe = ({
       },
       ...E
     };
-  }, [E, u == null ? void 0 : u.userID]), j = G(null), B = P(async () => {
-    if (!u || !f) return;
-    const N = u.userID;
+  }, [E, m == null ? void 0 : m.userID]), j = $(null), _ = P(async () => {
+    if (!m || !g) return;
+    const N = m.userID;
     if (N)
       try {
-        m && console.log("[MessagingShell] Syncing channels for user:", N);
-        const L = await u.queryChannels(
+        h && console.log("[MessagingShell] Syncing channels for user:", N);
+        const L = await m.queryChannels(
           {
             type: "messaging",
             members: { $in: [N] }
           },
           {},
           { limit: 100 }
-        ), O = /* @__PURE__ */ new Set();
-        L.forEach(($) => {
-          const Ee = $.state.members;
+        ), p = /* @__PURE__ */ new Set();
+        L.forEach((A) => {
+          const Ee = A.state.members;
           Object.values(Ee).forEach((ye) => {
             var ae;
             const te = (ae = ye.user) == null ? void 0 : ae.id;
-            te && te !== N && O.add(te);
+            te && te !== N && p.add(te);
           });
-        }), v(O), T(L.length > 0), j.current = N, m && console.log("[MessagingShell] Channels synced successfully:", {
+        }), b(p), T(L.length > 0), j.current = N, h && console.log("[MessagingShell] Channels synced successfully:", {
           channelCount: L.length,
-          memberCount: O.size
+          memberCount: p.size
         });
       } catch (L) {
         console.error("[MessagingShell] Failed to sync channels:", L);
       }
-  }, [u, f, m]);
-  H(() => {
-    if (!u || !f) return;
-    const N = u.userID;
-    N && j.current !== N && B();
-  }, [u, f, B]), H(() => {
-    if (!c || !u || !f) return;
+  }, [m, g, h]);
+  G(() => {
+    if (!m || !g) return;
+    const N = m.userID;
+    N && j.current !== N && _();
+  }, [m, g, _]), G(() => {
+    if (!d || !m || !g) return;
     (async () => {
-      const L = u.userID;
+      const L = m.userID;
       if (L)
         try {
-          m && console.log(
+          h && console.log(
             "[MessagingShell] Loading initial conversation with:",
-            c
+            d
           );
-          const O = await u.queryChannels(
+          const p = await m.queryChannels(
             {
               type: "messaging",
-              members: { $eq: [L, c] }
+              members: { $eq: [L, d] }
             },
             {},
             { limit: 1 }
           );
-          if (O.length > 0)
-            S(O[0]), A(!0), _(null), r && r(O[0]), m && console.log(
+          if (p.length > 0)
+            I(p[0]), B(!0), H(null), r && r(p[0]), h && console.log(
               "[MessagingShell] Initial conversation loaded:",
-              O[0].id
+              p[0].id
             );
-          else if (i && b) {
-            m && console.log(
+          else if (c && v) {
+            h && console.log(
               "[MessagingShell] No conversation found, creating one for:",
-              i
+              c
             );
             try {
-              const $ = await b.startChannelWithParticipant({
-                id: i.id,
-                name: i.name,
-                email: i.email,
-                phone: i.phone
+              const A = await v.startChannelWithParticipant({
+                id: c.id,
+                name: c.name,
+                email: c.email,
+                phone: c.phone
               });
-              S($), A(!0), _(null), r && r($), m && console.log(
+              I(A), B(!0), H(null), r && r(A), h && console.log(
                 "[MessagingShell] Channel created and loaded:",
-                $.id
+                A.id
               );
-            } catch ($) {
+            } catch (A) {
               console.error(
                 "[MessagingShell] Failed to create conversation:",
-                $
-              ), _("Failed to create conversation");
+                A
+              ), H("Failed to create conversation");
             }
           } else
-            _(
+            H(
               "No conversation found with this account"
-            ), m && console.log(
+            ), h && console.log(
               "[MessagingShell] No conversation found for:",
-              c
+              d
             );
-        } catch (O) {
+        } catch (p) {
           console.error(
             "[MessagingShell] Failed to load initial conversation:",
-            O
-          ), _("Failed to load conversation");
+            p
+          ), H("Failed to load conversation");
         }
     })();
   }, [
+    d,
     c,
-    i,
-    u,
-    f,
-    b,
     m,
+    g,
+    v,
+    h,
     r
   ]);
   const X = P(
     (N) => {
-      S(N), r == null || r(N);
+      I(N), r == null || r(N);
     },
     [r]
   ), Ne = P(() => {
-    M || S(null);
+    M || I(null);
   }, [M]), be = P(() => {
     var N;
-    W && (z((L) => L + 1), h(!0), (N = V.current) == null || N.showModal());
+    W && (z((L) => L + 1), i(!0), (N = V.current) == null || N.showModal());
   }, [W]), ve = P(
     async (N) => {
       var L;
-      if (b)
+      if (v)
         try {
-          m && console.log(
+          h && console.log(
             "[MessagingShell] Starting conversation with:",
             N.id
           );
-          const O = await b.startChannelWithParticipant({
+          const p = await v.startChannelWithParticipant({
             id: N.id,
             name: N.name,
             email: N.email,
             phone: N.phone
           });
           try {
-            await O.show();
-          } catch ($) {
-            console.warn("[MessagingShell] Failed to unhide channel:", $);
+            await p.show();
+          } catch (A) {
+            console.warn("[MessagingShell] Failed to unhide channel:", A);
           }
-          S(O), h(!1), (L = V.current) == null || L.close(), a == null || a(N);
-        } catch (O) {
-          console.error("[MessagingShell] Failed to start conversation:", O);
+          I(p), i(!1), (L = V.current) == null || L.close(), a == null || a(N);
+        } catch (p) {
+          console.error("[MessagingShell] Failed to start conversation:", p);
         }
     },
-    [b, a, m]
+    [v, a, h]
   ), ne = P(() => {
     var N;
-    h(!1), (N = V.current) == null || N.close();
+    i(!1), (N = V.current) == null || N.close();
   }, []), Ce = P(
     async (N) => {
-      m && console.log("[MessagingShell] Leaving conversation:", N.id), S(null), A(!1), j.current = null, await B();
+      h && console.log("[MessagingShell] Leaving conversation:", N.id), I(null), B(!1), j.current = null, await _();
     },
-    [B, m]
+    [_, h]
   ), we = P(
     async (N) => {
-      m && console.log("[MessagingShell] Blocking participant:", N), S(null), A(!1), j.current = null, await B();
+      h && console.log("[MessagingShell] Blocking participant:", N), I(null), B(!1), j.current = null, await _();
     },
-    [B, m]
+    [_, h]
   ), Z = !!k;
-  return I ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(es, {}) }) : x ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(re, { message: x, onBack: w }) }) : !f || !u ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(
+  return R ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(es, {}) }) : x ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(re, { message: x, onBack: C }) }) : !g || !m ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(
     re,
     {
       message: "Not connected to messaging service",
-      onBack: w
+      onBack: C
     }
-  ) }) : Y ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(re, { message: Y }) }) : /* @__PURE__ */ d(
+  ) }) : Y ? /* @__PURE__ */ e("div", { className: D("h-full", s), children: /* @__PURE__ */ e(re, { message: Y }) }) : /* @__PURE__ */ u(
     "div",
     {
       className: D(
@@ -1239,7 +1244,7 @@ const Xe = ({
         s
       ),
       children: [
-        /* @__PURE__ */ d("div", { className: "flex h-full min-h-0", children: [
+        /* @__PURE__ */ u("div", { className: "flex h-full min-h-0", children: [
           /* @__PURE__ */ e(
             "div",
             {
@@ -1259,7 +1264,7 @@ const Xe = ({
                 {
                   onChannelSelect: X,
                   selectedChannel: k || void 0,
-                  filters: p
+                  filters: O
                 }
               )
             }
@@ -1293,7 +1298,7 @@ const Xe = ({
                 {
                   hasChannels: y,
                   onStartConversation: Q ? be : void 0,
-                  participantLabel: R
+                  participantLabel: S
                 }
               )
             }
@@ -1315,9 +1320,9 @@ const Xe = ({
                 participantSource: W,
                 onSelectParticipant: ve,
                 onClose: ne,
-                existingParticipantIds: g,
-                participantLabel: R,
-                searchPlaceholder: `Search ${R}...`
+                existingParticipantIds: f,
+                participantLabel: S,
+                searchPlaceholder: `Search ${S}...`
               },
               F
             ) })
@@ -1354,21 +1359,21 @@ const Xe = ({
   loadingFaqId: n,
   headerText: r,
   className: a,
-  avatarImage: c,
-  avatarName: i
+  avatarImage: d,
+  avatarName: c
 }) => {
   const l = t.filter((o) => o.enabled).sort((o, E) => (o.order ?? 0) - (E.order ?? 0));
-  return l.length === 0 ? null : /* @__PURE__ */ e("div", { className: D("px-4 py-6", a), children: /* @__PURE__ */ d("div", { className: "flex gap-3 items-end", children: [
-    (c || i) && /* @__PURE__ */ e("div", { className: "flex-none", children: /* @__PURE__ */ e(
+  return l.length === 0 ? null : /* @__PURE__ */ e("div", { className: D("px-4 py-6", a), children: /* @__PURE__ */ u("div", { className: "flex gap-3 items-end", children: [
+    (d || c) && /* @__PURE__ */ e("div", { className: "flex-none", children: /* @__PURE__ */ e(
       J,
       {
-        id: i || "account",
-        name: i || "Account",
-        image: c,
+        id: c || "account",
+        name: c || "Account",
+        image: d,
         size: 24
       }
     ) }),
-    /* @__PURE__ */ d(
+    /* @__PURE__ */ u(
       "div",
       {
         className: "flex-1 rounded-lg p-4 space-y-3",
@@ -1389,43 +1394,43 @@ const Xe = ({
     )
   ] }) });
 }, us = (t, s = {}) => {
-  const { initialSearch: n = "", pageSize: r = 20 } = s, [a, c] = C([]), [i, l] = C(!1), [o, E] = C(null), [b, u] = C(n), [f, I] = C(!0), [x, w] = C(), m = P(async (T = !1, U) => {
-    if (i) return;
-    const h = U !== void 0 ? U : b;
+  const { initialSearch: n = "", pageSize: r = 20 } = s, [a, d] = w([]), [c, l] = w(!1), [o, E] = w(null), [v, m] = w(n), [g, R] = w(!0), [x, C] = w(), h = P(async (T = !1, U) => {
+    if (c) return;
+    const i = U !== void 0 ? U : v;
     l(!0), E(null);
     try {
-      const g = await t.loadParticipants({
-        search: h || void 0,
+      const f = await t.loadParticipants({
+        search: i || void 0,
         limit: r,
         cursor: T ? void 0 : x
       });
-      c(
-        (v) => T ? g.participants : [...v, ...g.participants]
-      ), I(g.hasMore), w(g.nextCursor);
-    } catch (g) {
-      const v = g instanceof Error ? g.message : "Failed to load participants";
-      E(v), console.error("[useParticipants] Load error:", g);
+      d(
+        (b) => T ? f.participants : [...b, ...f.participants]
+      ), R(f.hasMore), C(f.nextCursor);
+    } catch (f) {
+      const b = f instanceof Error ? f.message : "Failed to load participants";
+      E(b), console.error("[useParticipants] Load error:", f);
     } finally {
       l(!1);
     }
-  }, [t, b, x, r, i]), k = P(() => {
-    f && !i && m(!1);
-  }, [f, i, m]), S = P((T) => {
-    u(T), w(void 0), m(!0, T);
-  }, [m]), y = P(() => {
-    w(void 0), m(!0);
-  }, [m]);
-  return H(() => {
-    m(!0);
+  }, [t, v, x, r, c]), k = P(() => {
+    g && !c && h(!1);
+  }, [g, c, h]), I = P((T) => {
+    m(T), C(void 0), h(!0, T);
+  }, [h]), y = P(() => {
+    C(void 0), h(!0);
+  }, [h]);
+  return G(() => {
+    h(!0);
   }, [t.loadParticipants]), {
     participants: a,
-    loading: i,
+    loading: c,
     error: o,
-    searchQuery: b,
-    hasMore: f,
+    searchQuery: v,
+    hasMore: g,
     totalCount: t.totalCount,
     loadMore: k,
-    search: S,
+    search: I,
     refresh: y
   };
 };
@@ -1439,8 +1444,8 @@ export {
   is as MessagingProvider,
   cs as MessagingShell,
   Xe as ParticipantPicker,
-  $e as formatRelativeTime,
-  Be as useMessaging,
+  Ae as formatRelativeTime,
+  _e as useMessaging,
   us as useParticipants
 };
 //# sourceMappingURL=index.js.map