npm - @linktr.ee/messaging-react - Versions diffs - 3.3.3 → 3.3.5 - Mend

@linktr.ee/messaging-react 3.3.3 → 3.3.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (43) hide show

package/dist/{index-BcHUpyyw.js → index-D7eRkXoG.js} RENAMED Viewed

@@ -1,9 +1,9 @@
 import { jsx as n, jsxs as h, Fragment as te } from "react/jsx-runtime";
-import z, { createContext as Ge, useContext as Te, useCallback as W, useState as D, useRef as H, useEffect as Y, useId as En, useMemo as ee, Suspense as He } from "react";
+import $, { createContext as Ge, useContext as Te, useCallback as W, useState as P, useRef as H, useEffect as Y, useId as En, useMemo as ee, Suspense as He } from "react";
 import { StreamChatService as Sn } from "@linktr.ee/messaging-core";
 import { Chat as In, DateSeparator as Tn, useChannelStateContext as ce, useChatContext as Ye, areMessageUIPropsEqual as An, useMessageReminder as Mn, useComponentContext as Ut, Attachment as Rn, EditMessageModal as Ln, MessageBlocked as Dn, MessageBouncePrompt as Pn, MessageDeleted as On, MessageIsThreadReplyInChannelButtonIndicator as zn, MessageRepliesCountButton as $n, ReminderNotification as Fn, StreamedMessageText as Bn, messageHasAttachments as Un, messageHasReactions as jn, isDateSeparatorMessage as Vn, isMessageBlocked as Gn, isMessageBounced as Hn, MessageBounceModal as Yn, MessageText as Tt, Poll as qn, MessageErrorIcon as Wn, useMessageContext as pe, useMessageComposer as Xn, useStateStore as Kn, MessageInput as Jn, useMessageInputContext as Zn, useMessageComposerHasSendableData as Qn, AttachmentPreviewList as es, QuotedMessagePreview as ts, TextareaComposer as ns, MessageTimestamp as Le, AIStates as De, useTypingContext as ss, useAIState as as, Channel as rs, WithComponents as is, Window as os, MessageList as ls, ChannelList as cs } from "stream-chat-react";
 import { StarIcon as Fe, DotsThreeIcon as ds, SpinnerGapIcon as Ce, SignOutIcon as us, ProhibitInsetIcon as At, FlagIcon as jt, FileIcon as Vt, ImageIcon as ms, SpeakerHighIcon as hs, VideoCameraIcon as Gt, FileMdIcon as fs, FileTextIcon as gs, FileZipIcon as bs, FilePptIcon as ps, FileCsvIcon as vs, FileXlsIcon as xs, FileDocIcon as ws, FilePdfIcon as Ns, CircleNotchIcon as ge, PlayIcon as Be, PauseIcon as _s, LinkIcon as ys, DownloadSimpleIcon as be, GiftIcon as Cs, ThumbsUpIcon as ks, ThumbsDownIcon as Es, TrashSimpleIcon as Ss, XIcon as Ae, ArrowUpIcon as Is, SparkleIcon as Ue, ProhibitIcon as Ts, ArrowLeftIcon as Mt, PencilSimpleIcon as As, CaretLeftIcon as Ms, CaretRightIcon as Rs } from "@phosphor-icons/react";
-import C from "classnames";
+import y from "classnames";
 import { MessageActions as Ls, DefaultDropdownActionButton as Ht } from "stream-chat-react/experimental";
 import { LinkPreviewsManager as Rt } from "stream-chat";
 const Yt = Ge({
@@ -25,8 +25,8 @@ const Yt = Ge({
   debug: i = !1
 }) => {
   const o = W(
-    (E, ...A) => {
-      i && console.log(`🔥 [MessagingProvider] ${E}`, ...A);
+    (k, ...T) => {
+      i && console.log(`🔥 [MessagingProvider] ${k}`, ...T);
     },
     [i]
   );
@@ -36,14 +36,14 @@ const Yt = Ge({
     serviceConfig: !!s,
     capabilities: Object.keys(r)
   });
-  const [l, d] = D(null), [m, b] = D(null), [u, f] = D(!1), [c, g] = D(!1), [v, p] = D(null), N = H(!1), x = H({
+  const [l, d] = P(null), [m, b] = P(null), [u, f] = P(!1), [c, g] = P(!1), [p, v] = P(null), N = H(!1), x = H({
     userId: t == null ? void 0 : t.id,
     apiKey: a,
     serviceConfig: s,
     capabilities: r
-  }), T = H(0);
-  T.current++, o("📊 RENDER INFO", {
-    renderCount: T.current,
+  }), S = H(0);
+  S.current++, o("📊 RENDER INFO", {
+    renderCount: S.current,
     currentProps: { userId: t == null ? void 0 : t.id, apiKey: (a == null ? void 0 : a.substring(0, 8)) + "..." },
     propChanges: {
       userChanged: x.current.userId !== (t == null ? void 0 : t.id),
@@ -57,9 +57,9 @@ const Yt = Ge({
     serviceConfig: s,
     capabilities: r
   }, Y(() => {
-    const E = T.current;
+    const k = S.current;
     if (o("🔧 SERVICE INIT EFFECT TRIGGERED", {
-      renderCount: E,
+      renderCount: k,
       apiKey: !!a,
       serviceConfig: !!s,
       dependencies: {
@@ -70,34 +70,34 @@ const Yt = Ge({
       }
     }), !a || !s) {
       o("⚠️ SERVICE INIT SKIPPED", {
-        renderCount: E,
+        renderCount: k,
         reason: "Missing apiKey or serviceConfig"
       });
       return;
     }
     o("🚀 CREATING NEW SERVICE", {
-      renderCount: E,
+      renderCount: k,
       apiKey: (a == null ? void 0 : a.substring(0, 8)) + "...",
       serviceConfigChanged: x.current.serviceConfig !== s
     });
-    const A = new Sn({
+    const T = new Sn({
       ...s,
       apiKey: a,
       debug: i
     });
-    return d(A), o("✅ SERVICE SET", {
-      renderCount: E,
-      serviceInstance: !!A
+    return d(T), o("✅ SERVICE SET", {
+      renderCount: k,
+      serviceInstance: !!T
     }), () => {
       o("🧹 SERVICE CLEANUP", {
-        renderCount: E,
+        renderCount: k,
         reason: "Effect cleanup"
-      }), A.disconnectUser().catch(console.error);
+      }), T.disconnectUser().catch(console.error);
     };
   }, [a, s, i, o]);
-  const S = H(null);
+  const E = H(null);
   Y(() => {
-    var A, y;
+    var T, _;
     if (o("🔗 USER CONNECTION EFFECT TRIGGERED", {
       hasService: !!l,
       hasUser: !!t,
@@ -113,7 +113,7 @@ const Yt = Ge({
       o("⚠️ USER CONNECTION SKIPPED", "Already connecting");
       return;
     }
-    if (((A = S.current) == null ? void 0 : A.serviceId) === l && ((y = S.current) == null ? void 0 : y.userId) === t.id) {
+    if (((T = E.current) == null ? void 0 : T.serviceId) === l && ((_ = E.current) == null ? void 0 : _.userId) === t.id) {
       o(
         "⚠️ USER CONNECTION SKIPPED",
         "Already connected this user with this service"
@@ -121,19 +121,19 @@ const Yt = Ge({
       return;
     }
     (async () => {
-      o("🚀 STARTING USER CONNECTION", { userId: t.id }), N.current = !0, g(!0), p(null);
+      o("🚀 STARTING USER CONNECTION", { userId: t.id }), N.current = !0, g(!0), v(null);
       try {
         o("📞 CALLING SERVICE.CONNECTUSER", { userId: t.id });
-        const _ = await l.connectUser(t);
-        b(_), f(!0), S.current = { serviceId: l, userId: t.id }, o("✅ USER CONNECTION SUCCESS", {
+        const I = await l.connectUser(t);
+        b(I), f(!0), E.current = { serviceId: l, userId: t.id }, o("✅ USER CONNECTION SUCCESS", {
           userId: t.id,
-          clientId: _.userID
+          clientId: I.userID
         });
-      } catch (_) {
-        const I = _ instanceof Error ? _.message : "Connection failed";
-        p(I), o("❌ USER CONNECTION ERROR", {
+      } catch (I) {
+        const R = I instanceof Error ? I.message : "Connection failed";
+        v(R), o("❌ USER CONNECTION ERROR", {
           userId: t.id,
-          error: I
+          error: R
         });
       } finally {
         g(!1), N.current = !1, o("🔄 USER CONNECTION FINISHED", {
@@ -149,12 +149,12 @@ const Yt = Ge({
     l && u ? (o(
       "🧹 CLEANUP EFFECT TRIGGERED",
       "Cleaning up connection on unmount"
-    ), S.current = null, l.disconnectUser().catch(console.error)) : o("🔇 CLEANUP EFFECT SKIPPED", {
+    ), E.current = null, l.disconnectUser().catch(console.error)) : o("🔇 CLEANUP EFFECT SKIPPED", {
       hasService: !!l,
       isConnected: u
     });
   }), [l, u, o]);
-  const R = W(async () => {
+  const M = W(async () => {
     if (o("🔄 REFRESH CONNECTION CALLED", {
       hasService: !!l,
       hasUser: !!t
@@ -165,49 +165,49 @@ const Yt = Ge({
     o("🚀 STARTING CONNECTION REFRESH", { userId: t.id }), g(!0);
     try {
       o("🔌 DISCONNECTING FOR REFRESH"), await l.disconnectUser(), o("📞 RECONNECTING FOR REFRESH");
-      const E = await l.connectUser(t);
-      b(E), f(!0), p(null), o("✅ CONNECTION REFRESH SUCCESS", { userId: t.id });
-    } catch (E) {
-      const A = E instanceof Error ? E.message : "Refresh failed";
-      p(A), o("❌ CONNECTION REFRESH ERROR", {
+      const k = await l.connectUser(t);
+      b(k), f(!0), v(null), o("✅ CONNECTION REFRESH SUCCESS", { userId: t.id });
+    } catch (k) {
+      const T = k instanceof Error ? k.message : "Refresh failed";
+      v(T), o("❌ CONNECTION REFRESH ERROR", {
         userId: t.id,
-        error: A
+        error: T
       });
     } finally {
       g(!1), o("🔄 CONNECTION REFRESH FINISHED", { userId: t.id });
     }
-  }, [l, t, o]), O = z.useMemo(() => (o("💫 CONTEXT VALUE MEMOIZATION", {
+  }, [l, t, o]), D = $.useMemo(() => (o("💫 CONTEXT VALUE MEMOIZATION", {
     hasService: !!l,
     hasClient: !!m,
     isConnected: u,
     isLoading: c,
-    hasError: !!v,
+    hasError: !!p,
     capabilitiesKeys: Object.keys(r)
   }), {
     service: l,
     client: m,
     isConnected: u,
     isLoading: c,
-    error: v,
+    error: p,
     capabilities: r,
-    refreshConnection: R,
+    refreshConnection: M,
     debug: i
   }), [
     l,
     m,
     u,
     c,
-    v,
+    p,
     r,
-    R,
+    M,
     i,
     o
   ]);
   return o("🔄 RENDER END", {
-    renderCount: T.current,
+    renderCount: S.current,
     willRenderChat: !!(m && u),
-    contextValueReady: !!O
-  }), /* @__PURE__ */ n(Yt.Provider, { value: O, children: m && u ? /* @__PURE__ */ n(
+    contextValueReady: !!D
+  }), /* @__PURE__ */ n(Yt.Provider, { value: D, children: m && u ? /* @__PURE__ */ n(
     In,
     {
       client: m,
@@ -219,7 +219,7 @@ const Yt = Ge({
   ) : e });
 }, Ds = () => qe(), qt = (e) => {
   var a, r;
-  const [t, s] = D(
+  const [t, s] = P(
     !!((r = (a = e == null ? void 0 : e.state) == null ? void 0 : a.membership) != null && r.pinned_at)
   );
   return Y(() => {
@@ -310,7 +310,7 @@ const ae = ({
     "div",
     {
       "aria-hidden": "true",
-      className: C(
+      className: y(
         "avatar-fallback flex h-full w-full items-center justify-center bg-[#E6E5E3] font-semibold select-none transition-colors",
         m
       ),
@@ -320,7 +320,7 @@ const ae = ({
   return /* @__PURE__ */ h(
     "div",
     {
-      className: C(
+      className: y(
         "relative flex-shrink-0 !bg-transparent",
         a
       ),
@@ -342,7 +342,7 @@ const ae = ({
           "div",
           {
             "data-testid": "avatar-ring",
-            className: C(
+            className: y(
               "h-full w-full",
               "bg-transparent"
             ),
@@ -374,75 +374,73 @@ const ae = ({
   onActionComplete: m,
   logLabel: b = "useChannelModerationActions"
 }) => {
-  var y;
-  const { service: u, debug: f } = qe(), [c, g] = D(!1), [v, p] = D(!1), [N, x] = D(!1), [T, S] = D(!1);
+  var F;
+  const { service: u, debug: f } = qe(), c = (F = t == null ? void 0 : t.user) == null ? void 0 : F.id, g = !!(a && s && u && c), [p, v] = P(!1), [N, x] = P(null), [S, E] = P(!1), [M, D] = P(!1), k = g && ((N == null ? void 0 : N.participantId) !== c || (N == null ? void 0 : N.service) !== u);
   return Y(() => {
-    var L;
-    if (!a || !s || !u || !((L = t == null ? void 0 : t.user) != null && L.id)) {
-      g(!1), p(!1);
+    if (!g || !u || !c) {
+      v(!1), x(null);
       return;
     }
-    let _ = !1;
-    const I = t.user.id;
-    return p(!0), (async () => {
+    let A = !1;
+    return (async () => {
       try {
-        const M = await u.getBlockedUsers();
-        if (_) return;
-        g(
-          M.some(
-            (j) => j.blocked_user_id === I
+        const L = await u.getBlockedUsers();
+        if (A) return;
+        v(
+          L.some(
+            (z) => z.blocked_user_id === c
           )
         );
-      } catch (M) {
-        _ || console.error(`[${b}] Failed to check blocked status:`, M);
+      } catch (L) {
+        A || console.error(`[${b}] Failed to check blocked status:`, L);
       } finally {
-        _ || p(!1);
+        A || x({ participantId: c, service: u });
       }
     })(), () => {
-      _ = !0;
+      A = !0;
     };
-  }, [a, u, (y = t == null ? void 0 : t.user) == null ? void 0 : y.id, s, b]), {
-    isParticipantBlocked: c,
-    isCheckingBlockedStatus: v,
-    isLeaving: N,
-    isUpdatingBlockStatus: T,
+  }, [g, u, c, b]), {
+    isParticipantBlocked: p,
+    isCheckingBlockedStatus: k,
+    isLeaving: S,
+    isUpdatingBlockStatus: M,
     handleLeaveConversation: async () => {
-      var _;
-      if (!N) {
-        o == null || o(), f && console.log(`[${b}] Leave conversation`, e.cid), x(!0);
+      var A;
+      if (!S) {
+        o == null || o(), f && console.log(`[${b}] Leave conversation`, e.cid), E(!0);
         try {
-          const I = ((_ = e._client) == null ? void 0 : _.userID) ?? null;
-          await e.hide(I, !1), r && await r(e), m == null || m();
-        } catch (I) {
-          console.error(`[${b}] Failed to leave conversation`, I);
+          const L = ((A = e._client) == null ? void 0 : A.userID) ?? null;
+          await e.hide(L, !1), r && await r(e), m == null || m();
+        } catch (L) {
+          console.error(`[${b}] Failed to leave conversation`, L);
         } finally {
-          x(!1);
+          E(!1);
         }
       }
     },
     handleBlockUser: async () => {
-      var _, I, L;
-      if (!(T || !u)) {
-        l == null || l(), f && console.log(`[${b}] Block member`, (_ = t == null ? void 0 : t.user) == null ? void 0 : _.id), S(!0);
+      var A, L, z;
+      if (!(M || !u)) {
+        l == null || l(), f && console.log(`[${b}] Block member`, (A = t == null ? void 0 : t.user) == null ? void 0 : A.id), D(!0);
         try {
-          await u.blockUser((I = t == null ? void 0 : t.user) == null ? void 0 : I.id), i && await i((L = t == null ? void 0 : t.user) == null ? void 0 : L.id), m == null || m();
-        } catch (M) {
-          console.error(`[${b}] Failed to block member`, M);
+          await u.blockUser((L = t == null ? void 0 : t.user) == null ? void 0 : L.id), i && await i((z = t == null ? void 0 : t.user) == null ? void 0 : z.id), m == null || m();
+        } catch (V) {
+          console.error(`[${b}] Failed to block member`, V);
         } finally {
-          S(!1);
+          D(!1);
         }
       }
     },
     handleUnblockUser: async () => {
-      var _, I, L;
-      if (!(T || !u)) {
-        l == null || l(), f && console.log(`[${b}] Unblock member`, (_ = t == null ? void 0 : t.user) == null ? void 0 : _.id), S(!0);
+      var A, L, z;
+      if (!(M || !u)) {
+        l == null || l(), f && console.log(`[${b}] Unblock member`, (A = t == null ? void 0 : t.user) == null ? void 0 : A.id), D(!0);
         try {
-          await u.unBlockUser((I = t == null ? void 0 : t.user) == null ? void 0 : I.id), i && await i((L = t == null ? void 0 : t.user) == null ? void 0 : L.id), m == null || m();
-        } catch (M) {
-          console.error(`[${b}] Failed to unblock member`, M);
+          await u.unBlockUser((L = t == null ? void 0 : t.user) == null ? void 0 : L.id), i && await i((z = t == null ? void 0 : t.user) == null ? void 0 : z.id), m == null || m();
+        } catch (V) {
+          console.error(`[${b}] Failed to unblock member`, V);
         } finally {
-          S(!1);
+          D(!1);
         }
       }
     },
@@ -459,7 +457,7 @@ const ae = ({
   "button",
   {
     type: "button",
-    className: C(
+    className: y(
       "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",
       e === "danger" ? "text-danger hover:bg-danger/50" : "text-charcoal hover:bg-sand",
       t
@@ -481,15 +479,15 @@ const ae = ({
   customChannelActions: b,
   triggerClassName: u
 }) => {
-  const [f, c] = D(!1), g = H(null), v = En(), p = W(() => c(!1), []), {
+  const [f, c] = P(!1), g = H(null), p = En(), v = W(() => c(!1), []), {
     isParticipantBlocked: N,
     isCheckingBlockedStatus: x,
-    isLeaving: T,
-    isUpdatingBlockStatus: S,
-    handleLeaveConversation: R,
-    handleBlockUser: O,
-    handleUnblockUser: E,
-    handleReportUser: A
+    isLeaving: S,
+    isUpdatingBlockStatus: E,
+    handleLeaveConversation: M,
+    handleBlockUser: D,
+    handleUnblockUser: k,
+    handleReportUser: T
   } = Bs({
     channel: e,
     participant: t,
@@ -500,18 +498,18 @@ const ae = ({
     onDeleteConversationClick: l,
     onBlockParticipantClick: d,
     onReportParticipantClick: m,
-    onActionComplete: p,
+    onActionComplete: v,
     logLabel: "ChannelActionsMenu"
   });
   return Y(() => {
     if (!f) return;
-    const _ = (L) => {
-      g.current && !g.current.contains(L.target) && c(!1);
-    }, I = (L) => {
-      L.key === "Escape" && c(!1);
+    const I = (F) => {
+      g.current && !g.current.contains(F.target) && c(!1);
+    }, R = (F) => {
+      F.key === "Escape" && c(!1);
     };
-    return document.addEventListener("mousedown", _), document.addEventListener("keydown", I), () => {
-      document.removeEventListener("mousedown", _), document.removeEventListener("keydown", I);
+    return document.addEventListener("mousedown", I), document.addEventListener("keydown", R), () => {
+      document.removeEventListener("mousedown", I), document.removeEventListener("keydown", R);
     };
   }, [f]), !t || !(s || a || r || !!b) ? null : /* @__PURE__ */ h("div", { ref: g, className: "relative", children: [
     /* @__PURE__ */ h(
@@ -521,8 +519,8 @@ const ae = ({
         type: "button",
         "aria-haspopup": "true",
         "aria-expanded": f,
-        "aria-controls": f ? v : void 0,
-        onClick: () => c((_) => !_),
+        "aria-controls": f ? p : void 0,
+        onClick: () => c((I) => !I),
         children: [
           /* @__PURE__ */ n(ds, { className: "size-5 text-black/90" }),
           /* @__PURE__ */ n("span", { className: "sr-only", children: "More options" })
@@ -532,9 +530,9 @@ const ae = ({
     f && /* @__PURE__ */ n(
       "div",
       {
-        id: v,
+        id: p,
         "aria-label": "Conversation options",
-        className: C(
+        className: y(
           "absolute right-0 top-full z-50 mt-2 w-56 overflow-hidden",
           "rounded-lg border border-sand bg-white p-1 shadow-max-elevation-light"
         ),
@@ -542,11 +540,11 @@ const ae = ({
           s && /* @__PURE__ */ n("li", { children: /* @__PURE__ */ h(
             he,
             {
-              onClick: R,
-              disabled: T,
-              "aria-busy": T,
+              onClick: M,
+              disabled: S,
+              "aria-busy": S,
               children: [
-                T ? /* @__PURE__ */ n(Ce, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ n(us, { className: "h-5 w-5" }),
+                S ? /* @__PURE__ */ n(Ce, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ n(us, { className: "h-5 w-5" }),
                 /* @__PURE__ */ n("span", { children: "Delete Conversation" })
               ]
             }
@@ -561,27 +559,27 @@ const ae = ({
           ) : N ? /* @__PURE__ */ h(
             he,
             {
-              onClick: E,
-              disabled: S,
-              "aria-busy": S,
+              onClick: k,
+              disabled: E,
+              "aria-busy": E,
               children: [
-                S ? /* @__PURE__ */ n(Ce, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ n(At, { className: "h-5 w-5" }),
+                E ? /* @__PURE__ */ n(Ce, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ n(At, { className: "h-5 w-5" }),
                 /* @__PURE__ */ n("span", { children: "Unblock" })
               ]
             }
           ) : /* @__PURE__ */ h(
             he,
             {
-              onClick: O,
-              disabled: S,
-              "aria-busy": S,
+              onClick: D,
+              disabled: E,
+              "aria-busy": E,
               children: [
-                S ? /* @__PURE__ */ n(Ce, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ n(At, { className: "h-5 w-5" }),
+                E ? /* @__PURE__ */ n(Ce, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ n(At, { className: "h-5 w-5" }),
                 /* @__PURE__ */ n("span", { children: "Block" })
               ]
             }
           ) }),
-          r && /* @__PURE__ */ n("li", { children: /* @__PURE__ */ h(he, { variant: "danger", onClick: A, children: [
+          r && /* @__PURE__ */ n("li", { children: /* @__PURE__ */ h(he, { variant: "danger", onClick: T, children: [
             /* @__PURE__ */ n(jt, { className: "h-5 w-5" }),
             /* @__PURE__ */ n("span", { children: "Report" })
           ] }) }),
@@ -632,7 +630,7 @@ function Xt({
   const s = e == null ? void 0 : e.text, a = Gs(t);
   return a ? ((r = e == null ? void 0 : e.i18n) == null ? void 0 : r[`${a}_text`]) ?? s : s;
 }
-const Hs = z.lazy(() => import("./Card-DchJqvYq.js")), Ys = z.lazy(() => import("./Card-DmPpcrSU.js")), qs = z.lazy(() => import("./Card-B7AF5uOB.js")), We = () => /* @__PURE__ */ n(
+const Hs = $.lazy(() => import("./Card-CVZzYmYW.js")), Ys = $.lazy(() => import("./Card-DzjYyrie.js")), qs = $.lazy(() => import("./Card-B9QrjooN.js")), We = () => /* @__PURE__ */ n(
   "div",
   {
     className: "w-[280px] min-h-[200px] animate-pulse rounded-md bg-black/[0.06] shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_1px_2px_rgba(0,0,0,0.04),0_8px_32px_rgba(0,0,0,0.1)]",
@@ -678,7 +676,7 @@ function ea(e) {
   return t !== "document" ? Zs[t] : Qs[Zt(e)];
 }
 function le(e, t) {
-  return z.createElement(ea(e), t);
+  return $.createElement(ea(e), t);
 }
 const ta = (e) => {
   var t, s;
@@ -695,66 +693,66 @@ const ta = (e) => {
   muted: d = !1,
   onContainerClick: m
 }) => {
-  const b = ne(t), u = H(null), f = H(null), c = H(null), g = H(r), [v, p] = D(a), [N, x] = D(0), [T, S] = D(!1), [R, O] = D(!1), [E, A] = D(!1), [y, _] = D(!1), [I, L] = D(!0), [M, j] = D(null), V = W(() => {
-    A(!1), p(!0);
-  }, []), G = W((w) => {
-    const k = f.current;
-    if (!k) return 0;
-    const B = k.getBoundingClientRect();
+  const b = ne(t), u = H(null), f = H(null), c = H(null), g = H(r), [p, v] = P(a), [N, x] = P(0), [S, E] = P(!1), [M, D] = P(!1), [k, T] = P(!1), [_, I] = P(!1), [R, F] = P(!0), [A, L] = P(null), z = W(() => {
+    T(!1), v(!0);
+  }, []), V = W((w) => {
+    const C = f.current;
+    if (!C) return 0;
+    const j = C.getBoundingClientRect();
     return Math.max(
       0,
-      Math.min(1, (ta(w) - B.left) / B.width)
+      Math.min(1, (ta(w) - j.left) / j.width)
     );
-  }, []), $ = W((w) => {
-    const k = u.current;
-    k && k.duration && (k.currentTime = w * k.duration);
-  }, []), F = (w) => {
-    w.stopPropagation(), S(!0);
-    const k = G(w);
-    x(k), $(k);
+  }, []), B = W((w) => {
+    const C = u.current;
+    C && C.duration && (C.currentTime = w * C.duration);
+  }, []), U = (w) => {
+    w.stopPropagation(), E(!0);
+    const C = V(w);
+    x(C), B(C);
   };
   Y(() => {
-    r !== void 0 && r !== g.current && (g.current = r, p(r));
+    r !== void 0 && r !== g.current && (g.current = r, v(r));
   }, [r]), Y(() => {
-    if (!v) {
+    if (!p) {
       c.current !== null && (cancelAnimationFrame(c.current), c.current = null);
       return;
     }
     const w = () => {
-      const k = u.current;
-      k && k.duration && !T && x(k.currentTime / k.duration), c.current = requestAnimationFrame(w);
+      const C = u.current;
+      C && C.duration && !S && x(C.currentTime / C.duration), c.current = requestAnimationFrame(w);
     };
     return c.current = requestAnimationFrame(w), () => {
       c.current !== null && cancelAnimationFrame(c.current);
     };
-  }, [v, T]), Y(() => {
+  }, [p, S]), Y(() => {
     const w = u.current;
-    w && (v ? w.play().catch((k) => {
-      p(!1), A(!0);
+    w && (p ? w.play().catch((C) => {
+      v(!1), T(!0);
     }) : w.pause());
-  }, [v]), Y(() => {
-    if (!T) return;
-    const w = (B) => x(G(B)), k = (B) => {
-      S(!1), $(G(B));
+  }, [p]), Y(() => {
+    if (!S) return;
+    const w = (j) => x(V(j)), C = (j) => {
+      E(!1), B(V(j));
     };
-    return window.addEventListener("mousemove", w), window.addEventListener("mouseup", k), window.addEventListener("touchmove", w, { passive: !0 }), window.addEventListener("touchend", k), () => {
-      window.removeEventListener("mousemove", w), window.removeEventListener("mouseup", k), window.removeEventListener("touchmove", w), window.removeEventListener("touchend", k);
+    return window.addEventListener("mousemove", w), window.addEventListener("mouseup", C), window.addEventListener("touchmove", w, { passive: !0 }), window.addEventListener("touchend", C), () => {
+      window.removeEventListener("mousemove", w), window.removeEventListener("mouseup", C), window.removeEventListener("touchmove", w), window.removeEventListener("touchend", C);
     };
-  }, [T, G, $]);
-  const X = M ? { aspectRatio: String(M) } : void 0, U = M ? "" : " aspect-video", P = Math.round(N * 100);
+  }, [S, V, B]);
+  const X = A ? { aspectRatio: String(A) } : void 0, G = A ? "" : " aspect-video", O = Math.round(N * 100);
   return /* @__PURE__ */ h(
     "div",
     {
       role: "button",
       tabIndex: 0,
-      className: `relative cursor-pointer overflow-hidden bg-black ${U}`,
+      className: `relative cursor-pointer overflow-hidden bg-black ${G}`,
       style: X,
       onClick: (w) => {
         if (m) {
           m(w);
           return;
         }
-        E || o && p((k) => !k);
+        k || o && v((C) => !C);
       },
       onKeyDown: (w) => {
         if (!(w.key !== "Enter" && w.key !== " ")) {
@@ -762,11 +760,11 @@ const ta = (e) => {
             m(w);
             return;
           }
-          E || o && p((k) => !k);
+          k || o && v((C) => !C);
         }
       },
       children: [
-        s && (b === "audio" || I) && /* @__PURE__ */ n(
+        s && (b === "audio" || R) && /* @__PURE__ */ n(
           "img",
           {
             src: s,
@@ -774,7 +772,7 @@ const ta = (e) => {
             className: "absolute inset-0 h-full w-full object-cover"
           }
         ),
-        !s && (b === "audio" || I) && /* @__PURE__ */ n("div", { className: "absolute inset-0 flex items-center justify-center", children: le(t, {
+        !s && (b === "audio" || R) && /* @__PURE__ */ n("div", { className: "absolute inset-0 flex items-center justify-center", children: le(t, {
           className: "size-12 text-black/20",
           weight: "regular"
         }) }),
@@ -786,14 +784,14 @@ const ta = (e) => {
             loop: i,
             muted: d,
             style: { width: "100%", height: "100%" },
-            onLoadStart: () => _(!0),
+            onLoadStart: () => I(!0),
             onCanPlay: () => {
-              _(!1), L(!1);
+              I(!1), F(!1);
             },
-            onWaiting: () => _(!0),
-            onPlay: () => A(!1),
+            onWaiting: () => I(!0),
+            onPlay: () => T(!1),
             onEnded: () => {
-              i || (p(!1), x(0));
+              i || (v(!1), x(0));
             },
             children: /* @__PURE__ */ n("track", { kind: "captions" })
           }
@@ -806,30 +804,30 @@ const ta = (e) => {
             muted: d,
             playsInline: !0,
             style: { width: "100%", height: "100%" },
-            onLoadStart: () => _(!0),
+            onLoadStart: () => I(!0),
             onCanPlay: () => {
-              _(!1), L(!1);
+              I(!1), F(!1);
             },
-            onWaiting: () => _(!0),
-            onPlay: () => A(!1),
+            onWaiting: () => I(!0),
+            onPlay: () => T(!1),
             onLoadedMetadata: () => {
               const w = u.current;
-              w instanceof HTMLVideoElement && w.videoWidth && w.videoHeight && j(w.videoWidth / w.videoHeight);
+              w instanceof HTMLVideoElement && w.videoWidth && w.videoHeight && L(w.videoWidth / w.videoHeight);
             },
             onEnded: () => {
-              i || (p(!1), x(0));
+              i || (v(!1), x(0));
             },
             children: /* @__PURE__ */ n("track", { kind: "captions" })
           }
         ) }),
-        y && !E && /* @__PURE__ */ n("div", { className: "absolute inset-0 z-10 flex items-center justify-center", children: /* @__PURE__ */ n(
+        _ && !k && /* @__PURE__ */ n("div", { className: "absolute inset-0 z-10 flex items-center justify-center", children: /* @__PURE__ */ n(
           ge,
           {
             className: "size-8 animate-spin text-white/80",
             weight: "bold"
           }
         ) }),
-        E && !o && /* @__PURE__ */ n(
+        k && !o && /* @__PURE__ */ n(
           "div",
           {
             className: "absolute inset-0 z-30 flex cursor-pointer items-center justify-center bg-black/35",
@@ -837,10 +835,10 @@ const ta = (e) => {
             tabIndex: 0,
             "aria-label": "Play preview",
             onClick: (w) => {
-              w.stopPropagation(), V();
+              w.stopPropagation(), z();
             },
             onKeyDown: (w) => {
-              w.key !== "Enter" && w.key !== " " || (w.preventDefault(), w.stopPropagation(), V());
+              w.key !== "Enter" && w.key !== " " || (w.preventDefault(), w.stopPropagation(), z());
             },
             children: /* @__PURE__ */ n("span", { className: "flex size-16 items-center justify-center rounded-full bg-white/20 text-white backdrop-blur-sm", children: /* @__PURE__ */ n(Be, { className: "size-9 translate-x-0.5", weight: "fill" }) })
           }
@@ -850,23 +848,23 @@ const ta = (e) => {
           {
             role: "slider",
             "aria-label": "Playback position",
-            "aria-valuenow": P,
+            "aria-valuenow": O,
             "aria-valuemin": 0,
             "aria-valuemax": 100,
             tabIndex: 0,
             ref: f,
             className: "relative flex h-4 w-full cursor-pointer items-center",
-            onMouseDown: F,
-            onTouchStart: F,
+            onMouseDown: U,
+            onTouchStart: U,
             onClick: (w) => w.stopPropagation(),
             onKeyDown: (w) => {
-              w.key === "ArrowRight" && $(Math.min(1, N + 0.05)), w.key === "ArrowLeft" && $(Math.max(0, N - 0.05));
+              w.key === "ArrowRight" && B(Math.min(1, N + 0.05)), w.key === "ArrowLeft" && B(Math.max(0, N - 0.05));
             },
             children: /* @__PURE__ */ n("div", { className: "w-full overflow-hidden rounded-full bg-white/30 h-1", children: /* @__PURE__ */ n(
               "div",
               {
                 className: "h-full rounded-full bg-white",
-                style: { width: `${P}%` }
+                style: { width: `${O}%` }
               }
             ) })
           }
@@ -877,11 +875,11 @@ const ta = (e) => {
             {
               type: "button",
               onClick: (w) => {
-                w.stopPropagation(), p((k) => !k);
+                w.stopPropagation(), v((C) => !C);
               },
               className: "shrink-0 text-white",
-              "aria-label": v ? "Pause" : "Play",
-              children: v ? /* @__PURE__ */ n(_s, { className: "size-5", weight: "fill" }) : /* @__PURE__ */ n(Be, { className: "size-5 translate-x-px", weight: "fill" })
+              "aria-label": p ? "Pause" : "Play",
+              children: p ? /* @__PURE__ */ n(_s, { className: "size-5", weight: "fill" }) : /* @__PURE__ */ n(Be, { className: "size-5 translate-x-px", weight: "fill" })
             }
           ),
           /* @__PURE__ */ h(
@@ -889,30 +887,30 @@ const ta = (e) => {
             {
               role: "slider",
               "aria-label": "Playback position",
-              "aria-valuenow": P,
+              "aria-valuenow": O,
               "aria-valuemin": 0,
               "aria-valuemax": 100,
               tabIndex: 0,
               ref: f,
               className: "relative flex h-4 w-full cursor-pointer items-center",
-              onMouseDown: F,
-              onTouchStart: F,
+              onMouseDown: U,
+              onTouchStart: U,
               onClick: (w) => w.stopPropagation(),
-              onMouseEnter: () => O(!0),
-              onMouseLeave: () => O(!1),
+              onMouseEnter: () => D(!0),
+              onMouseLeave: () => D(!1),
               onKeyDown: (w) => {
-                w.key === "ArrowRight" && $(Math.min(1, N + 0.05)), w.key === "ArrowLeft" && $(Math.max(0, N - 0.05));
+                w.key === "ArrowRight" && B(Math.min(1, N + 0.05)), w.key === "ArrowLeft" && B(Math.max(0, N - 0.05));
               },
               children: [
                 /* @__PURE__ */ n(
                   "div",
                   {
-                    className: `w-full overflow-hidden rounded-full bg-white/30 transition-all duration-200 ${R || T ? "h-1.5" : "h-1"}`,
+                    className: `w-full overflow-hidden rounded-full bg-white/30 transition-all duration-200 ${M || S ? "h-1.5" : "h-1"}`,
                     children: /* @__PURE__ */ n(
                       "div",
                       {
                         className: "h-full rounded-full bg-white",
-                        style: { width: `${P}%` }
+                        style: { width: `${O}%` }
                       }
                     )
                   }
@@ -920,8 +918,8 @@ const ta = (e) => {
                 /* @__PURE__ */ n(
                   "div",
                   {
-                    className: `absolute size-3 -translate-x-1/2 rounded-full bg-white shadow transition-[opacity,transform] duration-200 ${R || T ? "scale-100 opacity-100" : "scale-0 opacity-0"}`,
-                    style: { left: `${P}%` }
+                    className: `absolute size-3 -translate-x-1/2 rounded-full bg-white shadow transition-[opacity,transform] duration-200 ${M || S ? "scale-100 opacity-100" : "scale-0 opacity-0"}`,
+                    style: { left: `${O}%` }
                   }
                 )
               ]
@@ -940,7 +938,7 @@ const ta = (e) => {
   mediaPlayerProps: i,
   containedImage: o = !1
 }) => {
-  const l = ne(e), [d, m] = D(!1);
+  const l = ne(e), [d, m] = P(!1);
   return t && (l === "video" || l === "audio") ? /* @__PURE__ */ n(
     na,
     {
@@ -1031,7 +1029,7 @@ const ta = (e) => {
     {
       ref: b,
       "data-testid": u,
-      className: C(
+      className: y(
         "relative w-[280px] select-none overflow-hidden rounded-[24px] shadow-[0_0_0_1px_rgba(0,0,0,0.04),0_4px_8px_rgba(0,0,0,0.06)]",
         f ? "bg-[#121110]" : "bg-white"
       ),
@@ -1043,7 +1041,7 @@ const ta = (e) => {
           c.trim() !== "" && /* @__PURE__ */ n(
             "p",
             {
-              className: C("mb-0.5 truncate text-base font-medium", {
+              className: y("mb-0.5 truncate text-base font-medium", {
                 "text-black": !f,
                 "text-white/30": f && g,
                 "text-white": f && !g
@@ -1053,7 +1051,7 @@ const ta = (e) => {
           ),
           /* @__PURE__ */ h("div", { className: "flex flex-wrap items-center gap-1", children: [
             le(r, {
-              className: C(
+              className: y(
                 "size-5 shrink-0",
                 f ? "text-white/55" : "text-black/55"
               ),
@@ -1062,7 +1060,7 @@ const ta = (e) => {
             i != null && i !== "" && /* @__PURE__ */ n(
               "span",
               {
-                className: C(
+                className: y(
                   "text-xs font-medium",
                   f ? "text-white/55" : "text-black/55"
                 ),
@@ -1099,7 +1097,7 @@ function la(e) {
   return e ? "text-white/20" : "text-black/20";
 }
 const Ke = ({ attachment: e, isMyMessage: t }) => {
-  const { title: s, text: a, image_url: r, og_scrape_url: i, title_link: o } = e, l = i ?? o, d = typeof l == "string" && l.trim() !== "" ? l : void 0, m = /* @__PURE__ */ h(z.Fragment, { children: [
+  const { title: s, text: a, image_url: r, og_scrape_url: i, title_link: o } = e, l = i ?? o, d = typeof l == "string" && l.trim() !== "" ? l : void 0, m = /* @__PURE__ */ h($.Fragment, { children: [
     /* @__PURE__ */ n("div", { className: "p-2", children: r ? /* @__PURE__ */ n(
       "img",
       {
@@ -1145,7 +1143,7 @@ const da = ({
   url: e,
   filename: t
 }) => {
-  const [s, a] = D(!1);
+  const [s, a] = P(!1);
   return /* @__PURE__ */ n(
     "button",
     {
@@ -1161,7 +1159,7 @@ const da = ({
       },
       disabled: s,
       className: "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full bg-[#121110] px-4 text-sm font-medium leading-none text-white hover:bg-[#2a2928] disabled:opacity-70",
-      children: s ? /* @__PURE__ */ n(ge, { className: "size-4 animate-spin text-white", weight: "bold" }) : /* @__PURE__ */ h(z.Fragment, { children: [
+      children: s ? /* @__PURE__ */ n(ge, { className: "size-4 animate-spin text-white", weight: "bold" }) : /* @__PURE__ */ h($.Fragment, { children: [
         /* @__PURE__ */ n(be, { className: "size-4 text-white", weight: "bold" }),
         "Download"
       ] })
@@ -1171,13 +1169,13 @@ const da = ({
 function Ze(e) {
   var u, f, c, g;
   const t = (u = e.attachments) == null ? void 0 : u.find(
-    (v) => v.type === "video" && v.asset_url
+    (p) => p.type === "video" && p.asset_url
   ), s = (f = e.attachments) == null ? void 0 : f.find(
-    (v) => v.type === "image" && v.image_url
+    (p) => p.type === "image" && p.image_url
   ), a = (c = e.attachments) == null ? void 0 : c.find(
-    (v) => v.type === "audio" && v.asset_url
+    (p) => p.type === "audio" && p.asset_url
   ), r = (g = e.attachments) == null ? void 0 : g.find(
-    (v) => v.type === "file" && v.asset_url
+    (p) => p.type === "file" && p.asset_url
   ), i = t ?? s ?? a ?? r, o = (t == null ? void 0 : t.asset_url) ?? (s == null ? void 0 : s.image_url) ?? (a == null ? void 0 : a.asset_url) ?? (r == null ? void 0 : r.asset_url);
   if (!o) return null;
   const l = (i == null ? void 0 : i.mime_type) ?? ((i == null ? void 0 : i.type) === "image" ? "image/jpeg" : (i == null ? void 0 : i.type) === "video" ? "video/mp4" : (i == null ? void 0 : i.type) === "audio" ? "audio/mpeg" : "application/octet-stream"), d = i == null ? void 0 : i.title, m = i == null ? void 0 : i.file_size, b = t == null ? void 0 : t.thumb_url;
@@ -1376,7 +1374,7 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
     "button",
     {
       type: "button",
-      className: C("message-vote-button focus-ring", {
+      className: y("message-vote-button focus-ring", {
         "message-vote-button--selected": e === "up"
       }),
       onClick: t,
@@ -1390,7 +1388,7 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
     "button",
     {
       type: "button",
-      className: C("message-vote-button focus-ring", {
+      className: y("message-vote-button focus-ring", {
         "message-vote-button--selected": e === "down"
       }),
       onClick: s,
@@ -1417,21 +1415,21 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
     isMyMessage: f,
     message: c,
     renderText: g,
-    threadList: v,
-    viewerLanguage: p
-  } = e, { client: N } = Ye("CustomMessage"), { channel: x } = ce("CustomMessage"), { isUnlocking: T, onUnlockClick: S, onFetchSource: R, onDownloadClick: O } = ba("LockedAttachment"), [E, A] = D(!1), y = Mn(c.id), { selected: _, voteUp: I, voteDown: L } = Vs(c), {
-    Attachment: M = Rn,
-    EditMessageModal: j = Ln,
-    MessageActions: V,
-    MessageBlocked: G = Dn,
-    MessageBouncePrompt: $ = Pn,
-    MessageDeleted: F = On,
+    threadList: p,
+    viewerLanguage: v
+  } = e, { client: N } = Ye("CustomMessage"), { channel: x } = ce("CustomMessage"), { isUnlocking: S, onUnlockClick: E, onFetchSource: M, onDownloadClick: D } = ba("LockedAttachment"), [k, T] = P(!1), _ = Mn(c.id), { selected: I, voteUp: R, voteDown: F } = Vs(c), {
+    Attachment: A = Rn,
+    EditMessageModal: L = Ln,
+    MessageActions: z,
+    MessageBlocked: V = Dn,
+    MessageBouncePrompt: B = Pn,
+    MessageDeleted: U = On,
     MessageIsThreadReplyInChannelButtonIndicator: X = zn,
-    MessageRepliesCountButton: U = $n,
-    ReminderNotification: P = Fn,
+    MessageRepliesCountButton: G = $n,
+    ReminderNotification: O = Fn,
     StreamedMessageText: w = Bn,
-    PinIndicator: k
-  } = Ut("CustomMessage"), B = Un(c), q = jn(c), _e = ee(
+    PinIndicator: C
+  } = Ut("CustomMessage"), j = Un(c), q = jn(c), _e = ee(
     () => u == null ? void 0 : u(c),
     [u, c]
   ), K = ee(() => {
@@ -1440,26 +1438,26 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
     const St = ye.filter((It) => !("type" in It) || !nn(It));
     return St.length === ye.length ? ye : St;
   }, [c]), re = ee(() => {
-    const me = Xt({ message: c, viewerLanguage: p });
+    const me = Xt({ message: c, viewerLanguage: v });
     return me === c.text ? c : { ...c, text: me };
-  }, [c, p]);
+  }, [c, v]);
   if (Vn(c))
     return null;
   if (c.deleted_at || c.type === "deleted")
-    return /* @__PURE__ */ n(F, { message: c });
+    return /* @__PURE__ */ n(U, { message: c });
   if (Gn(c))
-    return /* @__PURE__ */ n(G, {});
-  const J = !v && !!c.reply_count, se = !v && c.show_in_channel && c.parent_id, Q = c.status === "failed" && ((ht = c.error) == null ? void 0 : ht.status) !== 403, lt = Hn(c);
+    return /* @__PURE__ */ n(V, {});
+  const J = !p && !!c.reply_count, se = !p && c.show_in_channel && c.parent_id, Q = c.status === "failed" && ((ht = c.error) == null ? void 0 : ht.status) !== 403, lt = Hn(c);
   let ie;
-  Q ? ie = () => m(c) : lt && (ie = () => A(!0));
-  const de = f(), kn = C(
+  Q ? ie = () => m(c) : lt && (ie = () => T(!0));
+  const de = f(), kn = y(
     "str-chat__message str-chat__message-simple",
     `str-chat__message--${c.type}`,
     `str-chat__message--${c.status}`,
     de ? "str-chat__message--me str-chat__message-simple--me" : "str-chat__message--other",
     c.text ? "str-chat__message--has-text" : "has-no-text",
     {
-      "str-chat__message--has-attachment": B,
+      "str-chat__message--has-attachment": j,
       "str-chat__message--highlighted": b,
       "str-chat__message--pinned pinned-message": c.pinned,
       "str-chat__message--with-reactions": q,
@@ -1472,17 +1470,17 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
   ), ct = c.poll_id && N.polls.fromState(c.poll_id), dt = Na(c), ue = ke(c), ut = wa(c), Re = !!(K != null && K.length && !c.quoted_message), mt = ue && de && Re;
   return /* @__PURE__ */ h(te, { children: [
     a && /* @__PURE__ */ n(
-      j,
+      L,
       {
         additionalMessageInputProps: t
       }
     ),
-    E && /* @__PURE__ */ n(
+    k && /* @__PURE__ */ n(
       Yn,
       {
-        MessageBouncePrompt: $,
-        onClose: () => A(!1),
-        open: E
+        MessageBouncePrompt: B,
+        onClose: () => T(!1),
+        open: k
       }
     ),
     /* @__PURE__ */ h(
@@ -1491,8 +1489,8 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
         className: kn,
         "data-message-id": c.id,
         children: [
-          k && /* @__PURE__ */ n(k, {}),
-          !!y && /* @__PURE__ */ n(P, { reminder: y }),
+          C && /* @__PURE__ */ n(C, {}),
+          !!_ && /* @__PURE__ */ n(O, { reminder: _ }),
           c.user && /* @__PURE__ */ n(
             ae,
             {
@@ -1508,7 +1506,7 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
           /* @__PURE__ */ n(
             "div",
             {
-              className: C("str-chat__message-inner", {
+              className: y("str-chat__message-inner", {
                 "str-chat__simple-message--error-failed": Q || lt
               }),
               "data-testid": "message-inner",
@@ -1524,7 +1522,7 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
               },
               children: ut ? /* @__PURE__ */ h("div", { className: "str-chat__message-bubble-wrapper", children: [
                 de ? /* @__PURE__ */ h("div", { className: "flex items-center gap-2", children: [
-                  V && /* @__PURE__ */ n(V, {}),
+                  z && /* @__PURE__ */ n(z, {}),
                   /* @__PURE__ */ n(
                     Ot.Sent,
                     {
@@ -1534,8 +1532,8 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
                       amountText: (vt = c.metadata) == null ? void 0 : vt.amount_text,
                       detail: (xt = c.metadata) == null ? void 0 : xt.attachment_detail,
                       paymentStatus: (wt = c.metadata) == null ? void 0 : wt.payment_status,
-                      onPreviewClick: () => S == null ? void 0 : S(c, x),
-                      onFetchSource: async () => await (R == null ? void 0 : R(c, x))
+                      onPreviewClick: () => E == null ? void 0 : E(c, x),
+                      onFetchSource: async () => await (M == null ? void 0 : M(c, x))
                     }
                   )
                 ] }) : /* @__PURE__ */ h("div", { className: "flex items-center gap-2", children: [
@@ -1548,13 +1546,13 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
                       amountText: (Ct = c.metadata) == null ? void 0 : Ct.amount_text,
                       detail: (kt = c.metadata) == null ? void 0 : kt.attachment_detail,
                       paymentStatus: (Et = c.metadata) == null ? void 0 : Et.payment_status,
-                      isUnlocking: T(c.id),
-                      onUnlockClick: () => S == null ? void 0 : S(c, x),
-                      onFetchSource: async () => await (R == null ? void 0 : R(c, x)),
-                      onDownloadClick: () => O == null ? void 0 : O(c, x)
+                      isUnlocking: S(c.id),
+                      onUnlockClick: () => E == null ? void 0 : E(c, x),
+                      onFetchSource: async () => await (M == null ? void 0 : M(c, x)),
+                      onDownloadClick: () => D == null ? void 0 : D(c, x)
                     }
                   ),
-                  V && /* @__PURE__ */ n(V, {})
+                  z && /* @__PURE__ */ n(z, {})
                 ] }),
                 c.text && /* @__PURE__ */ n("div", { className: "str-chat__message-bubble", children: /* @__PURE__ */ n(
                   Tt,
@@ -1577,7 +1575,7 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
                 ),
                 ct && /* @__PURE__ */ n(qn, { poll: ct }),
                 K != null && K.length && !c.quoted_message ? /* @__PURE__ */ n(
-                  M,
+                  A,
                   {
                     actionHandler: l,
                     attachments: K
@@ -1612,14 +1610,14 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
             s && ue && /* @__PURE__ */ n(
               _a,
               {
-                selected: _,
-                onVoteUp: I,
-                onVoteDown: L
+                selected: I,
+                onVoteUp: R,
+                onVoteDown: F
               }
             )
           ] }),
           J && /* @__PURE__ */ n(
-            U,
+            G,
             {
               onClick: d,
               reply_count: c.reply_count
@@ -1631,7 +1629,7 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
       c.id
     )
   ] });
-}, Ca = z.memo(
+}, Ca = $.memo(
   ya,
   (e, t) => e.chatbotVotingEnabled !== t.chatbotVotingEnabled || e.viewerLanguage !== t.viewerLanguage ? !1 : An(e, t)
 ), ka = (e) => {
@@ -1674,11 +1672,7 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
       ]
     }
   );
-}, Ta = (e) => ({
-  linkPreviews: Array.from(e.previews.values()).filter(
-    (t) => Rt.previewIsLoaded(t) || Rt.previewIsLoading(t)
-  )
-}), Aa = ({
+}, Ta = ({
   link: e,
   onDismiss: t
 }) => {
@@ -1718,22 +1712,26 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
       ]
     }
   );
-}, Ma = () => {
+}, Aa = (e) => ({
+  linkPreviews: Array.from(e.previews.values()).filter(
+    (t) => Rt.previewIsLoaded(t) || Rt.previewIsLoading(t)
+  )
+}), Ma = () => {
   const { linkPreviewsManager: e } = Xn(), { linkPreviews: t } = Kn(
     e.state,
-    Ta
+    Aa
   ), s = (r) => {
     e.dismissPreview(r);
   };
   return t.length > 0 ? /* @__PURE__ */ n("div", { className: "flex flex-col items-center w-full gap-2 mb-4", children: t.map((r) => /* @__PURE__ */ n(
-    Aa,
+    Ta,
     {
       link: r,
       onDismiss: s
     },
     r.og_scrape_url
   )) }) : null;
-}, ln = z.createContext(!1), Ra = ({ sendMessage: e, disabled: t, ...s }) => /* @__PURE__ */ n(
+}, ln = $.createContext(!1), Ra = ({ sendMessage: e, disabled: t, ...s }) => /* @__PURE__ */ n(
   "button",
   {
     ...s,
@@ -1932,16 +1930,16 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
   De.Generating,
   De.ExternalSources
 ]), Ha = ({ threadList: e }) => {
-  var g, v;
+  var g, p;
   const { channel: t, channelConfig: s, thread: a } = ce(), { client: r } = Ye(), { typing: i = {} } = ss(), { aiState: o } = as(t), l = Te(cn);
   if (!e && l && Ga.has(o)) {
-    const p = Ya(t, (g = r.user) == null ? void 0 : g.id);
+    const v = Ya(t, (g = r.user) == null ? void 0 : g.id);
     return /* @__PURE__ */ n(
       Ft,
       {
-        avatarId: (p == null ? void 0 : p.id) ?? "ai-agent",
-        avatarName: (p == null ? void 0 : p.name) ?? (p == null ? void 0 : p.id) ?? "Agent",
-        avatarImage: p == null ? void 0 : p.image,
+        avatarId: (v == null ? void 0 : v.id) ?? "ai-agent",
+        avatarName: (v == null ? void 0 : v.name) ?? (v == null ? void 0 : v.id) ?? "Agent",
+        avatarImage: v == null ? void 0 : v.image,
         testId: "typing-indicator-ai"
       }
     );
@@ -1949,19 +1947,19 @@ const pa = ({ size: e = 15 }) => /* @__PURE__ */ n(
   if ((s == null ? void 0 : s.typing_events) === !1)
     return null;
   const m = e ? [] : Object.values(i).filter(
-    ({ parent_id: p, user: N }) => {
+    ({ parent_id: v, user: N }) => {
       var x;
-      return (N == null ? void 0 : N.id) !== ((x = r.user) == null ? void 0 : x.id) && !p;
+      return (N == null ? void 0 : N.id) !== ((x = r.user) == null ? void 0 : x.id) && !v;
     }
   ), b = e ? Object.values(i).filter(
-    ({ parent_id: p, user: N }) => {
+    ({ parent_id: v, user: N }) => {
       var x;
-      return (N == null ? void 0 : N.id) !== ((x = r.user) == null ? void 0 : x.id) && p === (a == null ? void 0 : a.id);
+      return (N == null ? void 0 : N.id) !== ((x = r.user) == null ? void 0 : x.id) && v === (a == null ? void 0 : a.id);
     }
   ) : [], u = e ? b : m;
   if (!u.length)
     return null;
-  const f = (v = u[0]) == null ? void 0 : v.user, c = f != null && f.id && t.state.members[f.id] ? t.state.members[f.id].user : void 0;
+  const f = (p = u[0]) == null ? void 0 : p.user, c = f != null && f.id && t.state.members[f.id] ? t.state.members[f.id].user : void 0;
   return /* @__PURE__ */ n(
     Ft,
     {
@@ -2024,7 +2022,7 @@ function Ya(e, t) {
 const qa = () => null, Wa = ({ className: e, message: t }) => /* @__PURE__ */ h(
   "div",
   {
-    className: C("flex items-center justify-center h-full", e),
+    className: y("flex items-center justify-center h-full", e),
     children: [
       /* @__PURE__ */ h("svg", { viewBox: "0 0 100 100", className: "size-8 fill-pebble", stroke: "none", children: [
         /* @__PURE__ */ n("circle", { cx: "6", cy: "50", r: "6", children: /* @__PURE__ */ n(
@@ -2064,7 +2062,7 @@ const qa = () => null, Wa = ({ className: e, message: t }) => /* @__PURE__ */ h(
       t && /* @__PURE__ */ n("span", { className: "text-stone", children: t })
     ]
   }
-), Ee = z.memo(() => /* @__PURE__ */ n("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ h("div", { className: "flex items-center", children: [
+), Ee = $.memo(() => /* @__PURE__ */ n("div", { className: "messaging-loading-state flex items-center justify-center h-full", children: /* @__PURE__ */ h("div", { className: "flex items-center", children: [
   /* @__PURE__ */ n(Wa, { className: "w-6 h-6" }),
   /* @__PURE__ */ n("span", { className: "text-sm text-stone", children: "Loading messages" })
 ] }) }));
@@ -2085,23 +2083,23 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
   customChannelActions: f,
   showActionsMenu: c = !0
 }) => {
-  var S, R, O, E, A;
-  const { channel: g } = ce(), v = z.useMemo(() => {
-    var I, L;
-    const y = (I = g._client) == null ? void 0 : I.userID;
-    return y ? Object.values(((L = g.state) == null ? void 0 : L.members) || {}).find(
-      (M) => {
-        var j;
-        return ((j = M.user) == null ? void 0 : j.id) && M.user.id !== y;
+  var E, M, D, k, T;
+  const { channel: g } = ce(), p = $.useMemo(() => {
+    var R, F;
+    const _ = (R = g._client) == null ? void 0 : R.userID;
+    return _ ? Object.values(((F = g.state) == null ? void 0 : F.members) || {}).find(
+      (A) => {
+        var L;
+        return ((L = A.user) == null ? void 0 : L.id) && A.user.id !== _;
       }
     ) : void 0;
-  }, [(S = g._client) == null ? void 0 : S.userID, (R = g.state) == null ? void 0 : R.members]), p = Wt(v == null ? void 0 : v.user), N = (O = v == null ? void 0 : v.user) == null ? void 0 : O.image, x = qt(g), T = async () => {
+  }, [(E = g._client) == null ? void 0 : E.userID, (M = g.state) == null ? void 0 : M.members]), v = Wt(p == null ? void 0 : p.user), N = (D = p == null ? void 0 : p.user) == null ? void 0 : D.image, x = qt(g), S = async () => {
     try {
       x ? await g.unpin() : await g.pin();
-    } catch (y) {
+    } catch (_) {
       console.error(
         "[CustomChannelHeader] Failed to update pinned status:",
-        y
+        _
       );
     }
   };
@@ -2110,7 +2108,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
       /* @__PURE__ */ n("div", { className: "flex items-center gap-2", children: t && /* @__PURE__ */ n(
         "button",
         {
-          className: C(
+          className: y(
             oe,
             "messaging-channel-view-back-button-mobile bg-[#F1F0EE]"
           ),
@@ -2125,15 +2123,15 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
         /* @__PURE__ */ n(
           ae,
           {
-            id: ((E = v == null ? void 0 : v.user) == null ? void 0 : E.id) || g.id || "unknown",
-            name: p,
+            id: ((k = p == null ? void 0 : p.user) == null ? void 0 : k.id) || g.id || "unknown",
+            name: v,
             image: N,
             starred: s && x,
             dmAgentEnabled: a,
             size: 48
           }
         ),
-        /* @__PURE__ */ n("p", { className: "text-center text-xs font-medium text-black/90", children: p }),
+        /* @__PURE__ */ n("p", { className: "text-center text-xs font-medium text-black/90", children: v }),
         a && /* @__PURE__ */ h("div", { className: "flex items-center gap-1 text-[10px] leading-3 text-black/55", children: [
           /* @__PURE__ */ n(Ue, { className: "size-3 shrink-0 text-black/55" }),
           /* @__PURE__ */ n("span", { children: Bt })
@@ -2144,13 +2142,13 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
           "button",
           {
             className: oe,
-            onClick: T,
+            onClick: S,
             type: "button",
             "aria-label": x ? "Unstar conversation" : "Star conversation",
             children: /* @__PURE__ */ n(
               Fe,
               {
-                className: C("size-5", {
+                className: y("size-5", {
                   "text-yellow-600": x,
                   "text-black/90": !x
                 }),
@@ -2163,7 +2161,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
           Pt,
           {
             channel: g,
-            participant: v,
+            participant: p,
             showDeleteConversation: o,
             showBlockParticipant: l,
             showReportParticipant: d,
@@ -2173,7 +2171,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
             onBlockParticipantClick: b,
             onReportParticipantClick: u,
             customChannelActions: f,
-            triggerClassName: C(oe, "bg-[#F1F0EE]")
+            triggerClassName: y(oe, "bg-[#F1F0EE]")
           }
         )
       ] })
@@ -2183,7 +2181,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
         t && e && /* @__PURE__ */ n(
           "button",
           {
-            className: C(
+            className: y(
               oe,
               "messaging-channel-view-back-button-desktop"
             ),
@@ -2196,8 +2194,8 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
         /* @__PURE__ */ n(
           ae,
           {
-            id: ((A = v == null ? void 0 : v.user) == null ? void 0 : A.id) || g.id || "unknown",
-            name: p,
+            id: ((T = p == null ? void 0 : p.user) == null ? void 0 : T.id) || g.id || "unknown",
+            name: v,
             image: N,
             starred: s && x,
             dmAgentEnabled: a,
@@ -2205,7 +2203,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
           }
         ),
         /* @__PURE__ */ h("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ n("h1", { className: "font-medium text-black/90 truncate", children: p }),
+          /* @__PURE__ */ n("h1", { className: "font-medium text-black/90 truncate", children: v }),
           a && /* @__PURE__ */ h("div", { className: "mt-0.5 flex items-center gap-1 text-[10px] leading-3 text-black/55", children: [
             /* @__PURE__ */ n(Ue, { className: "size-3 shrink-0 text-black/55" }),
             /* @__PURE__ */ n("span", { className: "truncate", children: Bt })
@@ -2217,13 +2215,13 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
           "button",
           {
             className: oe,
-            onClick: T,
+            onClick: S,
             type: "button",
             "aria-label": x ? "Unstar conversation" : "Star conversation",
             children: /* @__PURE__ */ n(
               Fe,
               {
-                className: C("size-6", {
+                className: y("size-6", {
                   "text-yellow-600": x,
                   "text-black/90": !x
                 }),
@@ -2236,7 +2234,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
           Pt,
           {
             channel: g,
-            participant: v,
+            participant: p,
             showDeleteConversation: o,
             showBlockParticipant: l,
             showReportParticipant: d,
@@ -2268,51 +2266,51 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
   showReportParticipant: f = !0,
   composerDisabled: c = !1,
   composerDisabledReason: g,
-  showStarButton: v = !1,
-  chatbotVotingEnabled: p = !1,
+  showStarButton: p = !1,
+  chatbotVotingEnabled: v = !1,
   renderChannelBanner: N,
   customChannelActions: x,
-  renderMessage: T,
-  dmAgentEnabled: S = !1,
-  viewerLanguage: R,
-  showChannelInfo: O = !0
+  renderMessage: S,
+  dmAgentEnabled: E = !1,
+  viewerLanguage: M,
+  showChannelInfo: D = !0
 }) => {
-  var j, V, G, $, F, X;
-  const { channel: E } = ce(), A = z.useMemo(() => {
-    var w, k;
-    const U = (w = E._client) == null ? void 0 : w.userID;
-    return U ? Object.values(((k = E.state) == null ? void 0 : k.members) || {}).find(
-      (B) => {
+  var L, z, V, B, U, X;
+  const { channel: k } = ce(), T = $.useMemo(() => {
+    var w, C;
+    const G = (w = k._client) == null ? void 0 : w.userID;
+    return G ? Object.values(((C = k.state) == null ? void 0 : C.members) || {}).find(
+      (j) => {
         var q;
-        return ((q = B.user) == null ? void 0 : q.id) && B.user.id !== U;
+        return ((q = j.user) == null ? void 0 : q.id) && j.user.id !== G;
       }
     ) : void 0;
-  }, [(j = E._client) == null ? void 0 : j.userID, (V = E.state) == null ? void 0 : V.members]), y = z.useMemo(() => {
-    var w, k;
-    const U = (w = E._client) == null ? void 0 : w.userID;
-    return U ? Object.values(((k = E.state) == null ? void 0 : k.members) || {}).find((B) => {
+  }, [(L = k._client) == null ? void 0 : L.userID, (z = k.state) == null ? void 0 : z.members]), _ = $.useMemo(() => {
+    var w, C;
+    const G = (w = k._client) == null ? void 0 : w.userID;
+    return G ? Object.values(((C = k.state) == null ? void 0 : C.members) || {}).find((j) => {
       var q;
-      return ((q = B.user) == null ? void 0 : q.id) === U;
+      return ((q = j.user) == null ? void 0 : q.id) === G;
     }) : void 0;
-  }, [(G = E._client) == null ? void 0 : G.userID, ($ = E.state) == null ? void 0 : $.members]), _ = ((F = y == null ? void 0 : y.user) == null ? void 0 : F.is_account) ?? (y == null ? void 0 : y.is_account), I = ((X = A == null ? void 0 : A.user) == null ? void 0 : X.is_account) ?? (A == null ? void 0 : A.is_account), L = S && _ === !1 && I === !0, M = W(
-    (U) => {
-      const { message: P } = pe("ChannelView"), w = /* @__PURE__ */ n(
+  }, [(V = k._client) == null ? void 0 : V.userID, (B = k.state) == null ? void 0 : B.members]), I = ((U = _ == null ? void 0 : _.user) == null ? void 0 : U.is_account) ?? (_ == null ? void 0 : _.is_account), R = ((X = T == null ? void 0 : T.user) == null ? void 0 : X.is_account) ?? (T == null ? void 0 : T.is_account), F = E && I === !1 && R === !0, A = W(
+    (G) => {
+      const { message: O } = pe("ChannelView"), w = /* @__PURE__ */ n(
         ka,
         {
-          ...U,
-          chatbotVotingEnabled: p,
-          viewerLanguage: R
+          ...G,
+          chatbotVotingEnabled: v,
+          viewerLanguage: M
         }
       );
-      return !T || !P ? w : T(w, P);
+      return !S || !O ? w : S(w, O);
     },
-    [p, T, R]
+    [v, S, M]
   );
   return /* @__PURE__ */ n(te, { children: /* @__PURE__ */ n(
     is,
     {
       overrides: {
-        Message: M,
+        Message: A,
         MessageActions: Ia
       },
       children: /* @__PURE__ */ h(os, { children: [
@@ -2321,9 +2319,9 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
           {
             onBack: e,
             showBackButton: t,
-            showActionsMenu: O,
-            showStarButton: v,
-            dmAgentEnabled: L,
+            showActionsMenu: D,
+            showStarButton: p,
+            dmAgentEnabled: F,
             onLeaveConversation: i,
             onBlockParticipant: o,
             showDeleteConversation: l,
@@ -2335,7 +2333,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
             customChannelActions: x
           }
         ) }, "lt-channel-header"),
-        N ? /* @__PURE__ */ n(z.Fragment, { children: N() }, "lt-channel-banner") : null,
+        N ? /* @__PURE__ */ n($.Fragment, { children: N() }, "lt-channel-banner") : null,
         /* @__PURE__ */ n(
           "div",
           {
@@ -2344,14 +2342,14 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
           },
           "lt-channel-message-list"
         ),
-        r ? /* @__PURE__ */ n(z.Fragment, { children: r(E) }, "lt-channel-conversation-footer") : null,
+        r ? /* @__PURE__ */ n($.Fragment, { children: r(k) }, "lt-channel-conversation-footer") : null,
         /* @__PURE__ */ n(
           Da,
           {
             ...s && {
-              renderActions: () => s == null ? void 0 : s(E)
+              renderActions: () => s == null ? void 0 : s(k)
             },
-            renderFooter: () => a == null ? void 0 : a(E),
+            renderFooter: () => a == null ? void 0 : a(k),
             disabled: c,
             disabledReason: g
           },
@@ -2360,7 +2358,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
       ] })
     }
   ) });
-}, dn = z.memo(
+}, dn = $.memo(
   ({
     channel: e,
     onBack: t,
@@ -2377,59 +2375,59 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
     onBlockParticipantClick: f,
     onReportParticipantClick: c,
     showBlockParticipant: g = !0,
-    showReportParticipant: v = !0,
-    composerDisabled: p = !1,
+    showReportParticipant: p = !0,
+    composerDisabled: v = !1,
     composerDisabledReason: N,
     dmAgentEnabled: x,
-    messageMetadata: T,
-    onMessageSent: S,
-    showStarButton: R = !1,
-    chatbotVotingEnabled: O = !1,
-    renderChannelBanner: E,
-    customChannelActions: A,
-    renderMessage: y,
-    onMessageLinkClick: _,
-    sendButton: I,
-    attachmentPreviewList: L,
-    viewerLanguage: M,
-    showChannelInfo: j = !0
+    messageMetadata: S,
+    onMessageSent: E,
+    showStarButton: M = !1,
+    chatbotVotingEnabled: D = !1,
+    renderChannelBanner: k,
+    customChannelActions: T,
+    renderMessage: _,
+    onMessageLinkClick: I,
+    sendButton: R,
+    attachmentPreviewList: F,
+    viewerLanguage: A,
+    showChannelInfo: L = !0
   }) => {
-    const V = W(
-      async ($, F, X) => {
+    const z = W(
+      async (B, U, X) => {
         var q;
-        const U = ((q = e.data) == null ? void 0 : q.chatbot_paused) === !0, P = x && !U, w = {
-          ...F,
-          ...P && { silent: !0 },
-          ...T && {
+        const G = ((q = e.data) == null ? void 0 : q.chatbot_paused) === !0, O = x && !G, w = {
+          ...U,
+          ...O && { silent: !0 },
+          ...S && {
             metadata: {
-              ...F.metadata ?? {},
-              ...T
+              ...U.metadata ?? {},
+              ...S
             }
           }
-        }, k = {
+        }, C = {
           ...X,
-          ...P && { skip_push: !0 }
-        }, B = await e.sendMessage(w, k);
-        return S == null || S(B), B;
+          ...O && { skip_push: !0 }
+        }, j = await e.sendMessage(w, C);
+        return E == null || E(j), j;
       },
-      [e, x, T, S]
-    ), G = H(null);
+      [e, x, S, E]
+    ), V = H(null);
     return Y(() => {
-      if (!_) return;
-      const $ = G.current;
-      if (!$) return;
-      const F = (X) => {
-        const U = X.target, P = U == null ? void 0 : U.closest("a[href]"), w = P == null ? void 0 : P.getAttribute("href");
+      if (!I) return;
+      const B = V.current;
+      if (!B) return;
+      const U = (X) => {
+        const G = X.target, O = G == null ? void 0 : G.closest("a[href]"), w = O == null ? void 0 : O.getAttribute("href");
         if (!w) return;
-        const k = P == null ? void 0 : P.closest("[data-message-id]"), B = k == null ? void 0 : k.getAttribute("data-message-id"), q = B ? e.state.messages.find((_e) => _e.id === B) : void 0;
-        _(w, q);
+        const C = O == null ? void 0 : O.closest("[data-message-id]"), j = C == null ? void 0 : C.getAttribute("data-message-id"), q = j ? e.state.messages.find((_e) => _e.id === j) : void 0;
+        I(w, q);
       };
-      return $.addEventListener("click", F), () => $.removeEventListener("click", F);
-    }, [_, e]), /* @__PURE__ */ n(
+      return B.addEventListener("click", U), () => B.removeEventListener("click", U);
+    }, [I, e]), /* @__PURE__ */ n(
       "div",
       {
-        ref: G,
-        className: C(
+        ref: V,
+        className: y(
           "messaging-channel-view h-full flex flex-col",
           d
         ),
@@ -2442,9 +2440,9 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
             LoadingIndicator: Ee,
             DateSeparator: Us,
             TypingIndicator: Ha,
-            doSendMessageRequest: V,
-            ...I ? { SendButton: I } : {},
-            ...L ? { AttachmentPreviewList: L } : {},
+            doSendMessageRequest: z,
+            ...R ? { SendButton: R } : {},
+            ...F ? { AttachmentPreviewList: F } : {},
             children: /* @__PURE__ */ n(
               Ka,
               {
@@ -2461,17 +2459,17 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
                 onBlockParticipantClick: f,
                 onReportParticipantClick: c,
                 showBlockParticipant: g,
-                showReportParticipant: v,
-                composerDisabled: p,
+                showReportParticipant: p,
+                composerDisabled: v,
                 composerDisabledReason: N,
-                showStarButton: R,
+                showStarButton: M,
                 dmAgentEnabled: x,
-                chatbotVotingEnabled: O,
-                renderChannelBanner: E,
-                customChannelActions: A,
-                renderMessage: y,
-                viewerLanguage: M,
-                showChannelInfo: j
+                chatbotVotingEnabled: D,
+                renderChannelBanner: k,
+                customChannelActions: T,
+                renderMessage: _,
+                viewerLanguage: A,
+                showChannelInfo: L
               }
             )
           }
@@ -2481,7 +2479,7 @@ const oe = "size-10 rounded-full hover:bg-[#E5E4E1] flex items-center justify-ce
   }
 );
 dn.displayName = "ChannelView";
-const fe = z.memo(({ message: e, onBack: t }) => /* @__PURE__ */ n("div", { className: "messaging-error-state flex items-center justify-center h-full p-8", children: /* @__PURE__ */ h("div", { className: "text-center max-w-sm", children: [
+const fe = $.memo(({ message: e, onBack: t }) => /* @__PURE__ */ n("div", { className: "messaging-error-state flex items-center justify-center h-full p-8", children: /* @__PURE__ */ h("div", { className: "text-center max-w-sm", children: [
   /* @__PURE__ */ n("div", { className: "w-24 h-24 bg-danger-alt/20 rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ n("span", { className: "text-4xl", children: "⚠️" }) }),
   /* @__PURE__ */ n("h2", { className: "font-semibold text-charcoal mb-2", children: "Oops!" }),
   /* @__PURE__ */ n("p", { className: "text-stone text-sm mb-6", children: e }),
@@ -2512,73 +2510,73 @@ const yi = ({
   chatbotVotingEnabled: f = !1,
   viewerLanguage: c,
   renderChannelBanner: g,
-  customChannelActions: v,
-  renderMessage: p,
+  customChannelActions: p,
+  renderMessage: v,
   onMessageLinkClick: N,
   showChannelInfo: x
 }) => {
   const {
-    client: T,
-    isConnected: S,
-    isLoading: R,
-    error: O,
-    refreshConnection: E,
-    service: A,
-    debug: y
-  } = Ds(), [_, I] = D(null), [L, M] = D(null), [j, V] = D(!1), { showDeleteConversation: G = !0 } = e, $ = H(o);
-  $.current = o;
-  const F = H(a);
-  F.current = a;
-  const X = H(null), U = H(null);
+    client: S,
+    isConnected: E,
+    isLoading: M,
+    error: D,
+    refreshConnection: k,
+    service: T,
+    debug: _
+  } = Ds(), [I, R] = P(null), [F, A] = P(null), [L, z] = P(!1), { showDeleteConversation: V = !0 } = e, B = H(o);
+  B.current = o;
+  const U = H(a);
+  U.current = a;
+  const X = H(null), G = H(null);
   Y(() => {
-    U.current = _;
-  }, [_]), Y(() => {
-    if (!T || !S) return;
-    const k = T.userID;
-    if (!k) return;
-    const B = `${k}::${i}`;
-    if (X.current === B) return;
-    X.current = B;
+    G.current = I;
+  }, [I]), Y(() => {
+    if (!S || !E) return;
+    const C = S.userID;
+    if (!C) return;
+    const j = `${C}::${i}`;
+    if (X.current === j) return;
+    X.current = j;
     const q = () => {
-      X.current === B && (X.current = null);
+      X.current === j && (X.current = null);
     };
     (async () => {
       var K, re;
       try {
-        y && console.log(
+        _ && console.log(
           "[MessagingShell] Loading initial conversation with:",
           i
         );
-        const J = await T.queryChannels(
+        const J = await S.queryChannels(
           {
             type: "messaging",
-            members: { $eq: [k, i] }
+            members: { $eq: [C, i] }
           },
           {},
           { limit: 1 }
         );
         if (J.length > 0) {
-          I(J[0]), M(null), (K = F.current) == null || K.call(F, J[0]), y && console.log(
+          R(J[0]), A(null), (K = U.current) == null || K.call(U, J[0]), _ && console.log(
             "[MessagingShell] Initial conversation loaded:",
             J[0].id
           );
           return;
         }
-        const se = $.current;
-        if (!se || !A) {
-          q(), M("No conversation found with this account"), y && console.log(
+        const se = B.current;
+        if (!se || !T) {
+          q(), A("No conversation found with this account"), _ && console.log(
             "[MessagingShell] No conversation found for:",
             i
           );
           return;
         }
         try {
-          const Q = await A.startChannelWithParticipant({
+          const Q = await T.startChannelWithParticipant({
             id: se.id,
             name: se.name,
             phone: se.phone
           });
-          I(Q), M(null), (re = F.current) == null || re.call(F, Q), y && console.log(
+          R(Q), A(null), (re = U.current) == null || re.call(U, Q), _ && console.log(
             "[MessagingShell] Channel created and loaded:",
             Q.id
           );
@@ -2586,51 +2584,51 @@ const yi = ({
           console.error(
             "[MessagingShell] Failed to create conversation:",
             Q
-          ), q(), M("Failed to create conversation");
+          ), q(), A("Failed to create conversation");
         }
       } catch (J) {
         console.error(
           "[MessagingShell] Failed to load initial conversation:",
           J
-        ), q(), U.current || M("Failed to load conversation");
+        ), q(), G.current || A("Failed to load conversation");
       }
     })();
-  }, [i, T, S, A, y]);
-  const P = H(r);
-  P.current = r;
+  }, [i, S, E, T, _]);
+  const O = H(r);
+  O.current = r;
   const w = W(() => {
-    var k;
-    I(null), V(!0), (k = P.current) == null || k.call(P);
+    var C;
+    R(null), z(!0), (C = O.current) == null || C.call(O);
   }, []);
-  return R ? /* @__PURE__ */ n(Ee, {}) : O ? /* @__PURE__ */ n(fe, { message: O, onBack: E }) : !S || !T ? /* @__PURE__ */ n(
+  return M ? /* @__PURE__ */ n(Ee, {}) : D ? /* @__PURE__ */ n(fe, { message: D, onBack: k }) : !E || !S ? /* @__PURE__ */ n(
     fe,
     {
       message: "Not connected to messaging service",
-      onBack: E
+      onBack: k
     }
-  ) : L ? /* @__PURE__ */ n(fe, { message: L }) : j && !_ ? /* @__PURE__ */ n(fe, { message: "Conversation ended" }) : _ ? /* @__PURE__ */ n("div", { className: "messaging-shell h-full bg-background-primary overflow-hidden", children: /* @__PURE__ */ n("div", { className: "flex h-full min-h-0 flex-col", children: /* @__PURE__ */ n(
+  ) : F ? /* @__PURE__ */ n(fe, { message: F }) : L && !I ? /* @__PURE__ */ n(fe, { message: "Conversation ended" }) : I ? /* @__PURE__ */ n("div", { className: "messaging-shell h-full bg-background-primary overflow-hidden", children: /* @__PURE__ */ n("div", { className: "flex h-full min-h-0 flex-col", children: /* @__PURE__ */ n(
     dn,
     {
-      channel: _,
+      channel: I,
       renderMessageInputActions: t,
       renderConversationFooter: s,
       renderChannelBanner: g,
       onLeaveConversation: w,
       onBlockParticipant: w,
       CustomChannelEmptyState: l,
-      showDeleteConversation: G,
+      showDeleteConversation: V,
       onBlockParticipantClick: d,
       onReportParticipantClick: m,
       dmAgentEnabled: b,
       onMessageSent: u,
       chatbotVotingEnabled: f,
       viewerLanguage: c,
-      customChannelActions: v,
-      renderMessage: p,
+      customChannelActions: p,
+      renderMessage: v,
       onMessageLinkClick: N,
       showChannelInfo: x
     },
-    _.id
+    I.id
   ) }) }) : /* @__PURE__ */ n(Ee, {});
 };
 function Ja(e) {
@@ -2639,14 +2637,14 @@ function Ja(e) {
     for (const s of t)
       e.state.addMessageSorted(s.message);
 }
-const un = z.createContext({
+const un = $.createContext({
   selectedChannel: void 0,
   onChannelSelect: () => {
   },
   debug: !1,
   renderMessagePreview: void 0,
   viewerLanguage: void 0
-}), Za = un.Provider, Qa = () => z.useContext(un), er = (e, t) => {
+}), Za = un.Provider, Qa = () => $.useContext(un), er = (e, t) => {
   const s = new Date(
     Date.UTC(e.getUTCFullYear(), e.getUTCMonth(), e.getUTCDate())
   ), r = new Date(
@@ -2667,9 +2665,9 @@ const un = z.createContext({
     day: "numeric",
     year: "2-digit"
   });
-}, mn = z.memo(
+}, mn = $.memo(
   ({ channel: e, unread: t }) => {
-    var O, E, A;
+    var D, k, T;
     const {
       selectedChannel: s,
       onChannelSelect: a,
@@ -2678,39 +2676,39 @@ const un = z.createContext({
       viewerLanguage: o
     } = Qa(), l = (s == null ? void 0 : s.id) === (e == null ? void 0 : e.id), d = () => {
       e && a(e);
-    }, m = (y) => {
-      const _ = y.key === "Enter" || y.key === " ", I = y.repeat;
-      !_ || I || (y.preventDefault(), d());
-    }, u = Object.values(((O = e == null ? void 0 : e.state) == null ? void 0 : O.members) || {}).find(
-      (y) => {
-        var _, I;
-        return ((_ = y.user) == null ? void 0 : _.id) && y.user.id !== ((I = e == null ? void 0 : e._client) == null ? void 0 : I.userID);
+    }, m = (_) => {
+      const I = _.key === "Enter" || _.key === " ", R = _.repeat;
+      !I || R || (_.preventDefault(), d());
+    }, u = Object.values(((D = e == null ? void 0 : e.state) == null ? void 0 : D.members) || {}).find(
+      (_) => {
+        var I, R;
+        return ((I = _.user) == null ? void 0 : I.id) && _.user.id !== ((R = e == null ? void 0 : e._client) == null ? void 0 : R.userID);
       }
-    ), f = Wt(u == null ? void 0 : u.user), c = (E = u == null ? void 0 : u.user) == null ? void 0 : E.image, g = (() => {
-      var _;
-      const y = (_ = e == null ? void 0 : e.state) == null ? void 0 : _.messages;
-      if (y != null && y.length) {
-        for (let I = y.length - 1; I >= 0; I--)
-          if (y[I].type !== "system") return y[I];
+    ), f = Wt(u == null ? void 0 : u.user), c = (k = u == null ? void 0 : u.user) == null ? void 0 : k.image, g = (() => {
+      var I;
+      const _ = (I = e == null ? void 0 : e.state) == null ? void 0 : I.messages;
+      if (_ != null && _.length) {
+        for (let R = _.length - 1; R >= 0; R--)
+          if (_[R].type !== "system") return _[R];
       }
-    })(), p = (() => {
-      var j, V, G, $;
-      const y = Xt({
+    })(), v = (() => {
+      var L, z, V, B;
+      const _ = Xt({
         message: g,
         viewerLanguage: o
       });
-      if (((j = g == null ? void 0 : g.metadata) == null ? void 0 : j.custom_type) === "MESSAGE_TIP") return y ? `💵 ${y}` : "💵 Sent a tip";
-      if (((V = g == null ? void 0 : g.metadata) == null ? void 0 : V.custom_type) === "MESSAGE_PAID") return y ? `💰 ${y}` : "💰 Sent a message";
-      if (((G = g == null ? void 0 : g.metadata) == null ? void 0 : G.custom_type) === "MESSAGE_ATTACHMENT") return y ? `📎 ${y}` : "📎 Sent an attachment";
-      if (y) return y;
-      const M = ($ = g == null ? void 0 : g.attachments) == null ? void 0 : $[0];
-      return M ? M.og_scrape_url ? M.og_scrape_url : M.type === "image" ? "📷 Sent an image" : M.type === "video" ? "🎥 Sent a video" : M.type === "audio" ? "🎵 Sent audio" : M.type === "file" ? "📎 Sent a file" : "📎 Sent an attachment" : "No messages yet";
-    })(), N = g != null && g.created_at ? tr(new Date(g.created_at)) : "", x = g ? ke(g) : !1, T = i ? i(g, p) : `${x ? "✨ " : ""}${p}`, S = qt(e), R = t ?? 0;
+      if (((L = g == null ? void 0 : g.metadata) == null ? void 0 : L.custom_type) === "MESSAGE_TIP") return _ ? `💵 ${_}` : "💵 Sent a tip";
+      if (((z = g == null ? void 0 : g.metadata) == null ? void 0 : z.custom_type) === "MESSAGE_PAID") return _ ? `💰 ${_}` : "💰 Sent a message";
+      if (((V = g == null ? void 0 : g.metadata) == null ? void 0 : V.custom_type) === "MESSAGE_ATTACHMENT") return _ ? `📎 ${_}` : "📎 Sent an attachment";
+      if (_) return _;
+      const A = (B = g == null ? void 0 : g.attachments) == null ? void 0 : B[0];
+      return A ? A.og_scrape_url ? A.og_scrape_url : A.type === "image" ? "📷 Sent an image" : A.type === "video" ? "🎥 Sent a video" : A.type === "audio" ? "🎵 Sent audio" : A.type === "file" ? "📎 Sent a file" : "📎 Sent an attachment" : "No messages yet";
+    })(), N = g != null && g.created_at ? tr(new Date(g.created_at)) : "", x = g ? ke(g) : !1, S = i ? i(g, v) : `${x ? "✨ " : ""}${v}`, E = qt(e), M = t ?? 0;
     return r && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
       channelId: e == null ? void 0 : e.id,
       isSelected: l,
       participantName: f,
-      unreadCount: R,
+      unreadCount: M,
       hasTimestamp: !!N
     }), /* @__PURE__ */ n(
       "div",
@@ -2719,7 +2717,7 @@ const un = z.createContext({
         tabIndex: 0,
         onClick: d,
         onKeyDown: m,
-        className: C(
+        className: y(
           "group w-full px-4 py-3 transition-colors text-left max-w-full overflow-hidden focus-ring rounded-[12px] [&+&]:mt-2",
           {
             "bg-black/[0.04]": l,
@@ -2730,11 +2728,11 @@ const un = z.createContext({
           /* @__PURE__ */ n(
             ae,
             {
-              id: ((A = u == null ? void 0 : u.user) == null ? void 0 : A.id) || e.id || "unknown",
+              id: ((T = u == null ? void 0 : u.user) == null ? void 0 : T.id) || e.id || "unknown",
               name: f,
               image: c,
               size: 48,
-              starred: S
+              starred: E
             }
           ),
           /* @__PURE__ */ h("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
@@ -2742,11 +2740,11 @@ const un = z.createContext({
               /* @__PURE__ */ h(
                 "h3",
                 {
-                  className: C(
+                  className: y(
                     "text-sm font-medium truncate text-[#191918]"
                   ),
                   children: [
-                    S && /* @__PURE__ */ n("span", { className: "sr-only", children: "Starred conversation. " }),
+                    E && /* @__PURE__ */ n("span", { className: "sr-only", children: "Starred conversation. " }),
                     f
                   ]
                 }
@@ -2754,8 +2752,8 @@ const un = z.createContext({
               N && /* @__PURE__ */ n("span", { className: "text-xs text-[#717070] flex-shrink-0", children: N })
             ] }),
             /* @__PURE__ */ h("div", { className: "flex items-center justify-between gap-2 min-w-0", children: [
-              /* @__PURE__ */ n("p", { className: "text-sm text-[#717070] flex-1 line-clamp-1", children: T }),
-              R > 0 && /* @__PURE__ */ n("span", { className: "bg-[#7f22fe] text-white text-[10px] rounded-full h-4 flex items-center justify-center p-1 min-w-4 text-center flex-shrink-0", children: R > 99 ? "99+" : R })
+              /* @__PURE__ */ n("p", { className: "text-sm text-[#717070] flex-1 line-clamp-1", children: S }),
+              M > 0 && /* @__PURE__ */ n("span", { className: "bg-[#7f22fe] text-white text-[10px] rounded-full h-4 flex items-center justify-center p-1 min-w-4 text-center flex-shrink-0", children: M > 99 ? "99+" : M })
             ] })
           ] })
         ] })
@@ -2764,7 +2762,7 @@ const un = z.createContext({
   }
 );
 mn.displayName = "CustomChannelPreview";
-const nr = { last_message_at: -1 }, sr = z.memo(
+const nr = { last_message_at: -1 }, sr = $.memo(
   ({
     onChannelSelect: e,
     selectedChannel: t,
@@ -2777,12 +2775,12 @@ const nr = { last_message_at: -1 }, sr = z.memo(
     renderMessagePreview: d,
     viewerLanguage: m
   }) => {
-    const b = z.useRef(0);
+    const b = $.useRef(0);
     b.current++;
-    const { debug: u = !1 } = qe(), f = z.useCallback(
+    const { debug: u = !1 } = qe(), f = $.useCallback(
       (g) => {
-        for (const v of g)
-          Ja(v);
+        for (const p of g)
+          Ja(p);
         return r ? r(g) : g;
       },
       [r]
@@ -2792,7 +2790,7 @@ const nr = { last_message_at: -1 }, sr = z.memo(
       selectedChannelId: t == null ? void 0 : t.id,
       filters: s
     });
-    const c = z.useMemo(
+    const c = $.useMemo(
       () => ({
         selectedChannel: t,
         onChannelSelect: e,
@@ -2811,7 +2809,7 @@ const nr = { last_message_at: -1 }, sr = z.memo(
     return /* @__PURE__ */ n(
       "div",
       {
-        className: C(
+        className: y(
           "messaging-channel-list h-full flex flex-col min-w-0 overflow-hidden",
           o
         ),
@@ -2849,7 +2847,7 @@ const ir = {
   dark: "bg-white text-[#121110] hover:bg-white/90",
   light: "bg-[#121110] text-white hover:bg-[#2a2928]"
 }, or = ({ variant: e, cta: t }) => {
-  const s = C(
+  const s = y(
     "mt-2 inline-flex h-10 w-full items-center justify-center rounded-full px-4 text-sm font-medium leading-none transition-colors",
     ir[e]
   ), a = Qe(t.href);
@@ -2896,10 +2894,10 @@ const ir = {
 }) => {
   const d = e === "dark", m = t ?? (d ? s : void 0) ?? "", b = m.trim() !== "", u = a != null && a.trim() !== "", f = typeof r == "string" ? r.trim() : "", c = f !== "", g = o != null;
   if (!b && !u && !c && !g) return null;
-  const p = C(
+  const v = y(
     "truncate text-base font-medium leading-6",
     d && !t ? cr : lr[e]
-  ), N = C(
+  ), N = y(
     "truncate text-xs leading-4",
     dr[e]
   );
@@ -2909,7 +2907,7 @@ const ir = {
         /* @__PURE__ */ h("div", { className: "flex min-w-0 flex-col gap-1", children: [
           b && /* @__PURE__ */ h("div", { className: "flex min-w-0 items-center gap-2", children: [
             i ? /* @__PURE__ */ n("span", { className: "shrink-0", children: i }) : null,
-            /* @__PURE__ */ n("p", { className: C("min-w-0", p), children: m })
+            /* @__PURE__ */ n("p", { className: y("min-w-0", v), children: m })
           ] }),
           u && /* @__PURE__ */ n("p", { className: N, children: a })
         ] }),
@@ -2919,7 +2917,7 @@ const ir = {
     ] }),
     o && /* @__PURE__ */ n(or, { variant: e, cta: o })
   ] });
-}, ur = C(
+}, ur = y(
   "relative block w-[280px] select-none overflow-hidden rounded-md",
   // 1px hairline border that sits flush with the card chrome — matches
   // the messaging design system's "small border around link attachments"
@@ -2937,7 +2935,7 @@ const ir = {
   bgClassName: l,
   "data-testid": d
 }) => {
-  const m = s != null || a != null, b = C(
+  const m = s != null || a != null, b = y(
     ur,
     l ?? (e === "dark" ? "bg-[#121110]" : "bg-white"),
     // `focus-ring` is a design-system utility from the component-library
@@ -2968,7 +2966,7 @@ const ir = {
       onClick: a,
       "aria-label": r,
       "data-testid": d,
-      className: C(b, "text-left"),
+      className: y(b, "text-left"),
       children: [
         t,
         u
@@ -3018,7 +3016,7 @@ const ir = {
   ) }) : /* @__PURE__ */ h(
     "div",
     {
-      className: C(
+      className: y(
         "relative h-[180px] w-full overflow-hidden",
         d && "bg-black"
       ),
@@ -3045,7 +3043,7 @@ const ir = {
         ) : /* @__PURE__ */ n(
           "div",
           {
-            className: C(
+            className: y(
               "flex h-full w-full items-center justify-center",
               mr[e]
             ),
@@ -3083,7 +3081,7 @@ const ir = {
       className: "flex size-6 items-center justify-center rounded-full bg-[#121110] text-white",
       children: /* @__PURE__ */ n(Ae, { className: "size-3", weight: "bold" })
     }
-  ) : void 0, v = u ? /* @__PURE__ */ n(
+  ) : void 0, p = u ? /* @__PURE__ */ n(
     "button",
     {
       type: "button",
@@ -3131,7 +3129,7 @@ const ir = {
             url: a,
             appIcon: d,
             cta: m,
-            trailingAction: v
+            trailingAction: p
           }
         )
       ]
@@ -3149,11 +3147,11 @@ const ir = {
   cta: d,
   onClick: m
 }) => {
-  const b = hn(a, i), u = Qe(s), f = d == null && u != null && !b ? u : void 0, c = d == null && !b ? m : void 0, g = Me(a, i) ? tt : void 0, v = d && m ? {
+  const b = hn(a, i), u = Qe(s), f = d == null && u != null && !b ? u : void 0, c = d == null && !b ? m : void 0, g = Me(a, i) ? tt : void 0, p = d && m ? {
     ...d,
     onClick: () => {
-      var p;
-      m(), (p = d.onClick) == null || p.call(d);
+      var v;
+      m(), (v = d.onClick) == null || v.call(d);
     }
   } : d;
   return /* @__PURE__ */ h(
@@ -3184,7 +3182,7 @@ const ir = {
             description: t,
             url: s,
             appIcon: l,
-            cta: v
+            cta: p
           }
         )
       ]
@@ -3278,7 +3276,7 @@ const ir = {
     {
       "data-testid": o,
       "data-group-position": a,
-      className: C(
+      className: y(
         // 280px-wide bubble — matches the mobile chat attachment width
         // and keeps the document / image / audio bubbles visually
         // consistent inside the conversation timeline. The 8px / 16px
@@ -3298,7 +3296,7 @@ const ir = {
         l ? /* @__PURE__ */ n(
           "p",
           {
-            className: C(
+            className: y(
               // No `text-*` / `font-*` overrides here — caption inherits
               // the same font family + size as `.str-chat__message-text`
               // so it matches the surrounding `CustomMessage` bubbles.
@@ -3327,7 +3325,7 @@ const ir = {
       a.stopPropagation(), e();
     },
     "aria-label": s,
-    className: C(
+    className: y(
       "flex size-6 items-center justify-center rounded-full text-white",
       t === "overlay" ? "bg-[#121110]/85 backdrop-blur" : "bg-white/15 hover:bg-white/25"
     ),
@@ -3461,13 +3459,13 @@ const Rr = {
   const d = s ?? t ?? "File", m = Mr(a, t, r), b = /* @__PURE__ */ n(
     "div",
     {
-      className: C(
+      className: y(
         "flex size-10 shrink-0 items-center justify-center rounded-sm",
         Lr[e]
       ),
       "aria-hidden": !0,
       children: le(a, {
-        className: C("size-6", Dr[e]),
+        className: y("size-6", Dr[e]),
         weight: "regular"
       })
     }
@@ -3476,7 +3474,7 @@ const Rr = {
     m ? /* @__PURE__ */ n(
       "p",
       {
-        className: C(
+        className: y(
           "truncate text-xs leading-4",
           Rr[e]
         ),
@@ -3489,7 +3487,7 @@ const Rr = {
       type: "button",
       onClick: i,
       "aria-label": o,
-      className: C(
+      className: y(
         "flex min-w-0 flex-1 items-center gap-3 rounded-sm text-left transition-colors",
         e === "dark" ? "hover:bg-white/[0.04]" : "hover:bg-black/[0.04]"
       ),
@@ -3569,19 +3567,19 @@ const Pr = ({
     mimeType: r,
     title: i,
     items: o
-  }), g = (p) => {
-    if ((m == null ? void 0 : m(p)) === !1) return;
-    const N = c[p];
+  }), g = (v) => {
+    if ((m == null ? void 0 : m(v)) === !1) return;
+    const N = c[v];
     if (!N) return;
     const x = N.filename ?? Z(N.src);
     gn(N.src, x);
   };
   if (c.length === 0)
     return null;
-  const v = /* @__PURE__ */ n(
+  const p = /* @__PURE__ */ n(
     "span",
     {
-      className: C(
+      className: y(
         "flex size-8 items-center justify-center rounded-full",
         u === "dark" ? "text-white/70" : "text-black/70"
       ),
@@ -3596,16 +3594,16 @@ const Pr = ({
       text: l,
       groupPosition: d,
       "data-testid": "file-attachment",
-      children: /* @__PURE__ */ n("div", { className: "flex flex-col gap-2", children: c.map((p, N) => /* @__PURE__ */ n(
+      children: /* @__PURE__ */ n("div", { className: "flex flex-col gap-2", children: c.map((v, N) => /* @__PURE__ */ n(
         Or,
         {
           variant: u,
-          item: p,
+          item: v,
           index: N,
           onActivate: g,
-          trailingAction: f && N === 0 ? /* @__PURE__ */ n(xe, { onClick: b, variant: "inline" }) : v
+          trailingAction: f && N === 0 ? /* @__PURE__ */ n(xe, { onClick: b, variant: "inline" }) : p
         },
-        `${p.src}-${N}`
+        `${v.src}-${N}`
       )) })
     }
   );
@@ -3648,7 +3646,7 @@ const Pr = ({
   tone: i = "dark",
   onTriggered: o
 }) => {
-  const [l, d] = D(!1), m = W(
+  const [l, d] = P(!1), m = W(
     (c) => {
       c.stopPropagation(), !l && (d(!0), gn(e, t).catch(() => {
       }).finally(() => {
@@ -3656,7 +3654,7 @@ const Pr = ({
       }));
     },
     [l, e, t, o]
-  ), b = r ?? s !== "pill", f = { className: C(
+  ), b = r ?? s !== "pill", f = { className: y(
     s === "pill" ? "size-4" : "size-5",
     "shrink-0"
   ), weight: "bold" };
@@ -3667,7 +3665,7 @@ const Pr = ({
       onClick: m,
       disabled: l,
       "aria-label": a,
-      className: C(
+      className: y(
         "flex size-8 shrink-0 items-center justify-center rounded-full transition-colors disabled:opacity-70",
         {
           dark: "text-white/70 hover:bg-white/[0.08] hover:text-white",
@@ -3707,7 +3705,7 @@ const Pr = ({
       onClick: m,
       disabled: l,
       "aria-label": b ? a : void 0,
-      className: C(
+      className: y(
         "mt-3 inline-flex h-10 w-full items-center justify-center gap-2 rounded-full px-4 text-sm font-medium leading-none transition-colors disabled:opacity-70",
         i === "dark" ? "bg-[#121110] text-white hover:bg-[#2a2928]" : "bg-white text-[#121110] hover:bg-white/90"
       ),
@@ -3729,7 +3727,7 @@ const Pr = ({
   initialIndex: t,
   open: s
 }) => {
-  const a = $e(t, 0, Math.max(e - 1, 0)), [r, i] = D(a);
+  const a = $e(t, 0, Math.max(e - 1, 0)), [r, i] = P(a);
   Y(() => {
     s && i($e(t, 0, Math.max(e - 1, 0)));
   }, [s, t, e]), Y(() => {
@@ -3904,14 +3902,14 @@ const Pr = ({
   const r = e.length;
   if (r === 0) return null;
   const i = e.slice(0, Math.min(r, s)), o = r - i.length, l = (d, m, b) => {
-    const u = C(Ur, "h-full w-full");
+    const u = y(Ur, "h-full w-full");
     return t ? /* @__PURE__ */ h(
       "button",
       {
         type: "button",
         onClick: () => t(m),
         "aria-label": d.ariaLabel ?? `Open media ${m + 1}`,
-        className: C(u, "cursor-zoom-in"),
+        className: y(u, "cursor-zoom-in"),
         children: [
           d.content,
           b
@@ -3923,10 +3921,10 @@ const Pr = ({
       b
     ] }, m);
   };
-  return i.length === 1 ? /* @__PURE__ */ n("div", { className: C("aspect-square w-full", a), children: l(i[0], 0) }) : i.length === 2 ? /* @__PURE__ */ n(
+  return i.length === 1 ? /* @__PURE__ */ n("div", { className: y("aspect-square w-full", a), children: l(i[0], 0) }) : i.length === 2 ? /* @__PURE__ */ n(
     "div",
     {
-      className: C(
+      className: y(
         "grid aspect-[16/9] w-full grid-cols-2 gap-0.5",
         a
       ),
@@ -3935,7 +3933,7 @@ const Pr = ({
   ) : i.length === 3 ? /* @__PURE__ */ h(
     "div",
     {
-      className: C(
+      className: y(
         "grid aspect-[4/3] w-full grid-cols-2 grid-rows-2 gap-0.5",
         a
       ),
@@ -3948,7 +3946,7 @@ const Pr = ({
   ) : /* @__PURE__ */ n(
     "div",
     {
-      className: C(
+      className: y(
         "grid aspect-[4/3] w-full grid-cols-2 grid-rows-2 gap-0.5",
         a
       ),
@@ -3966,7 +3964,7 @@ const Pr = ({
     }
   );
 }, Ne = (e) => {
-  const [t, s] = D(!1), [a, r] = D(0), i = W(
+  const [t, s] = P(!1), [a, r] = P(0), i = W(
     (l) => {
       (e == null ? void 0 : e(l)) !== !1 && (r(l), s(!0));
     },
@@ -4048,8 +4046,8 @@ const Pr = ({
   );
   if (m.length === 0)
     return null;
-  const v = m.map(
-    (p, N) => jr(p, N, m.length, l)
+  const p = m.map(
+    (v, N) => jr(v, N, m.length, l)
   );
   return /* @__PURE__ */ h(
     ve,
@@ -4059,7 +4057,7 @@ const Pr = ({
       groupPosition: o,
       "data-testid": "image-attachment",
       children: [
-        /* @__PURE__ */ n("div", { className: "relative", children: /* @__PURE__ */ n(vn, { tiles: v, onTileActivate: c }) }),
+        /* @__PURE__ */ n("div", { className: "relative", children: /* @__PURE__ */ n(vn, { tiles: p, onTileActivate: c }) }),
         /* @__PURE__ */ n(
           pn,
           {
@@ -4166,9 +4164,9 @@ const Pr = ({
   onClick: d,
   onDismiss: m
 }) => {
-  const b = we(e), u = Jr({ src: t, filename: s, fileSize: a, title: r, items: i }), { viewerOpen: f, viewerIndex: c, handleActivate: g, closeViewer: v } = Ne(
+  const b = we(e), u = Jr({ src: t, filename: s, fileSize: a, title: r, items: i }), { viewerOpen: f, viewerIndex: c, handleActivate: g, closeViewer: p } = Ne(
     d
-  ), p = e === "composer" && !!m;
+  ), v = e === "composer" && !!m;
   if (u.length === 0)
     return null;
   const N = u.map((x) => ({
@@ -4183,14 +4181,14 @@ const Pr = ({
       groupPosition: l,
       "data-testid": "pdf-attachment",
       children: [
-        /* @__PURE__ */ n("div", { className: "flex flex-col gap-2", children: u.map((x, T) => {
-          const S = x.filename ?? Z(x.src), R = p && T === 0 ? /* @__PURE__ */ n(xe, { onClick: m, variant: "inline" }) : e === "composer" ? void 0 : /* @__PURE__ */ n(
+        /* @__PURE__ */ n("div", { className: "flex flex-col gap-2", children: u.map((x, S) => {
+          const E = x.filename ?? Z(x.src), M = v && S === 0 ? /* @__PURE__ */ n(xe, { onClick: m, variant: "inline" }) : e === "composer" ? void 0 : /* @__PURE__ */ n(
             bn,
             {
               url: x.src,
-              filename: S,
+              filename: E,
               variant: "inline",
-              label: `Download ${S}`,
+              label: `Download ${E}`,
               tone: b
             }
           );
@@ -4199,11 +4197,11 @@ const Pr = ({
             {
               variant: b,
               item: x,
-              index: T,
+              index: S,
               onActivate: g,
-              trailingAction: R
+              trailingAction: M
             },
-            `${x.src}-${T}`
+            `${x.src}-${S}`
           );
         }) }),
         /* @__PURE__ */ n(
@@ -4212,7 +4210,7 @@ const Pr = ({
             open: f,
             items: N,
             initialIndex: c,
-            onClose: v
+            onClose: p
           }
         )
       ]
@@ -4351,12 +4349,12 @@ const Pr = ({
   preload: d,
   onClick: m
 }) => {
-  const b = ri({ src: t, poster: s, mimeType: a, preload: d, items: i }), u = we(e), { viewerOpen: f, viewerIndex: c, handleActivate: g, closeViewer: v } = Ne(
+  const b = ri({ src: t, poster: s, mimeType: a, preload: d, items: i }), u = we(e), { viewerOpen: f, viewerIndex: c, handleActivate: g, closeViewer: p } = Ne(
     m
   );
   if (b.length === 0)
     return null;
-  const p = b.map(
+  const v = b.map(
     (N, x) => ai(N, x, b.length)
   );
   return /* @__PURE__ */ h(
@@ -4370,7 +4368,7 @@ const Pr = ({
         /* @__PURE__ */ n("div", { className: "relative", children: /* @__PURE__ */ n(
           vn,
           {
-            tiles: p,
+            tiles: v,
             onTileActivate: g,
             className: "overflow-hidden rounded-md"
           }
@@ -4381,7 +4379,7 @@ const Pr = ({
             open: f,
             items: yn(b, r),
             initialIndex: c,
-            onClose: v
+            onClose: p
           }
         )
       ]
@@ -4409,7 +4407,7 @@ const Pr = ({
     onClick: t,
     disabled: s,
     style: { backgroundColor: "#E6E5E3" },
-    className: C(
+    className: y(
       "w-full text-center p-4 rounded-xl text-charcoal font-medium transition-colors focus-ring",
       {
         "hover:brightness-95 active:brightness-90": !s,
@@ -4496,4 +4494,4 @@ export {
   Wt as y,
   ba as z
 };
-//# sourceMappingURL=index-BcHUpyyw.js.map
+//# sourceMappingURL=index-D7eRkXoG.js.map