@linktr.ee/messaging-react 1.0.1 → 1.1.0-ks-migrate-styles-1760927135

package/dist/index.js

@@ -1,101 +1,10 @@
-import { jsxs as d, jsx as t, Fragment as oe } from "react/jsx-runtime";
-import * as e from "react";
-import _, { createContext as de, useContext as we, useState as A, useRef as $, useEffect as B, useCallback as H } from "react";
+import { jsx as e, jsxs as i, Fragment as se } from "react/jsx-runtime";
 import L from "classnames";
-import { Chat as Ae, useChatContext as Ze, ChannelList as ve, Channel as Me, Window as pe, MessageList as ye, useChannelStateContext as Ie, MessageInput as Re } from "stream-chat-react";
-import { StreamChatService as Fe } from "@linktr.ee/messaging-core";
-const Le = de({
-  color: "currentColor",
-  size: "1em",
-  weight: "regular",
-  mirrored: !1
-}), D = e.forwardRef(
-  (n, a) => {
-    const {
-      alt: l,
-      color: o,
-      size: c,
-      weight: m,
-      mirrored: u,
-      children: r,
-      weights: s,
-      ...w
-    } = n, {
-      color: N = "currentColor",
-      size: g,
-      weight: i = "regular",
-      mirrored: C = !1,
-      ...x
-    } = e.useContext(Le);
-    return /* @__PURE__ */ e.createElement(
-      "svg",
-      {
-        ref: a,
-        xmlns: "http://www.w3.org/2000/svg",
-        width: c ?? g,
-        height: c ?? g,
-        fill: o ?? N,
-        viewBox: "0 0 256 256",
-        transform: u || C ? "scale(-1, 1)" : void 0,
-        ...x,
-        ...w
-      },
-      !!l && /* @__PURE__ */ e.createElement("title", null, l),
-      r,
-      s.get(m ?? i)
-    );
-  }
-);
-D.displayName = "IconBase";
-const Ve = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M232.49,55.51l-32-32a12,12,0,0,0-17,0l-96,96A12,12,0,0,0,84,128v32a12,12,0,0,0,12,12h32a12,12,0,0,0,8.49-3.51l96-96A12,12,0,0,0,232.49,55.51ZM192,49l15,15L196,75,181,60Zm-69,99H108V133l56-56,15,15Zm105-7.43V208a20,20,0,0,1-20,20H48a20,20,0,0,1-20-20V48A20,20,0,0,1,48,28h67.43a12,12,0,0,1,0,24H52V204H204V140.57a12,12,0,0,1,24,0Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M200,88l-72,72H96V128l72-72Z", opacity: "0.2" }), /* @__PURE__ */ e.createElement("path", { d: "M229.66,58.34l-32-32a8,8,0,0,0-11.32,0l-96,96A8,8,0,0,0,88,128v32a8,8,0,0,0,8,8h32a8,8,0,0,0,5.66-2.34l96-96A8,8,0,0,0,229.66,58.34ZM124.69,152H104V131.31l64-64L188.69,88ZM200,76.69,179.31,56,192,43.31,212.69,64ZM224,128v80a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h80a8,8,0,0,1,0,16H48V208H208V128a8,8,0,0,1,16,0Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,128v80a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h80a8,8,0,0,1,0,16H48V208H208V128a8,8,0,0,1,16,0Zm5.66-58.34-96,96A8,8,0,0,1,128,168H96a8,8,0,0,1-8-8V128a8,8,0,0,1,2.34-5.66l96-96a8,8,0,0,1,11.32,0l32,32A8,8,0,0,1,229.66,69.66Zm-17-5.66L192,43.31,179.31,56,200,76.69Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M228.24,59.76l-32-32a6,6,0,0,0-8.48,0l-96,96A6,6,0,0,0,90,128v32a6,6,0,0,0,6,6h32a6,6,0,0,0,4.24-1.76l96-96A6,6,0,0,0,228.24,59.76ZM125.51,154H102V130.49l66-66L191.51,88ZM200,79.51,176.49,56,192,40.49,215.51,64ZM222,128v80a14,14,0,0,1-14,14H48a14,14,0,0,1-14-14V48A14,14,0,0,1,48,34h80a6,6,0,0,1,0,12H48a2,2,0,0,0-2,2V208a2,2,0,0,0,2,2H208a2,2,0,0,0,2-2V128a6,6,0,0,1,12,0Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M229.66,58.34l-32-32a8,8,0,0,0-11.32,0l-96,96A8,8,0,0,0,88,128v32a8,8,0,0,0,8,8h32a8,8,0,0,0,5.66-2.34l96-96A8,8,0,0,0,229.66,58.34ZM124.69,152H104V131.31l64-64L188.69,88ZM200,76.69,179.31,56,192,43.31,212.69,64ZM224,128v80a16,16,0,0,1-16,16H48a16,16,0,0,1-16-16V48A16,16,0,0,1,48,32h80a8,8,0,0,1,0,16H48V208H208V128a8,8,0,0,1,16,0Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M226.83,61.17l-32-32a4,4,0,0,0-5.66,0l-96,96A4,4,0,0,0,92,128v32a4,4,0,0,0,4,4h32a4,4,0,0,0,2.83-1.17l96-96A4,4,0,0,0,226.83,61.17ZM126.34,156H100V129.66l68-68L194.34,88ZM200,82.34,173.66,56,192,37.66,218.34,64ZM220,128v80a12,12,0,0,1-12,12H48a12,12,0,0,1-12-12V48A12,12,0,0,1,48,36h80a4,4,0,0,1,0,8H48a4,4,0,0,0-4,4V208a4,4,0,0,0,4,4H208a4,4,0,0,0,4-4V128a4,4,0,0,1,8,0Z" }))
-  ]
-]), me = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: Ve }));
-me.displayName = "NotePencilIcon";
-function J({ label: n, className: a, children: l, ...o }) {
-  return /* @__PURE__ */ d(
-    "button",
-    {
-      type: "button",
-      className: L(
-        "rounded-full p-2 transition-colors focus-ring",
-        {
-          "cursor-not-allowed opacity-50": o.disabled,
-          "hover:bg-sand": !o.disabled
-        },
-        a
-      ),
-      ...o,
-      children: [
-        /* @__PURE__ */ t("span", { className: "sr-only", children: n }),
-        l
-      ]
-    }
-  );
-}
-const he = de({
+import $, { createContext as ue, useContext as me, useCallback as U, useState as w, useRef as A, useEffect as B } from "react";
+import { StreamChatService as he } from "@linktr.ee/messaging-core";
+import { Chat as fe, useChatContext as ge, ChannelList as xe, Channel as Ne, Window as Ce, MessageList as be, useChannelStateContext as ve, MessageInput as we } from "stream-chat-react";
+import { NotePencilIcon as Ee, XIcon as oe, ArrowLeftIcon as Ie, DotsThreeIcon as ye, SpinnerGapIcon as Q, SignOutIcon as Se, ProhibitInsetIcon as te, FlagIcon as Re, MagnifyingGlassIcon as ke, ChatCircleDotsIcon as ne } from "@phosphor-icons/react";
+const ae = ue({
   service: null,
   client: null,
   isConnected: !1,
@@ -106,1086 +15,941 @@ const he = de({
   refreshConnection: async () => {
   },
   debug: !1
-}), K = () => we(he), s1 = ({
-  children: n,
-  user: a,
-  serviceConfig: l,
-  apiKey: o,
-  capabilities: c = {},
+}), Z = () => me(ae), Xe = ({
+  children: t,
+  user: s,
+  serviceConfig: n,
+  apiKey: l,
+  capabilities: a = {},
   customization: m = {},
-  debug: u = !1
+  debug: d = !1
 }) => {
-  const r = (b, ...M) => {
-    u && console.log(`🔥 [MessagingProvider] ${b}`, ...M);
-  };
+  const r = U(
+    (N, ...S) => {
+      d && console.log(`🔥 [MessagingProvider] ${N}`, ...S);
+    },
+    [d]
+  );
   r("🔄 RENDER START", {
-    userId: a == null ? void 0 : a.id,
-    apiKey: (o == null ? void 0 : o.substring(0, 8)) + "...",
-    serviceConfig: !!l,
-    capabilities: Object.keys(c),
+    userId: s == null ? void 0 : s.id,
+    apiKey: (l == null ? void 0 : l.substring(0, 8)) + "...",
+    serviceConfig: !!n,
+    capabilities: Object.keys(a),
     customization: Object.keys(m)
   });
-  const [s, w] = A(null), [N, g] = A(null), [i, C] = A(!1), [x, p] = A(!1), [Z, V] = A(null), R = $(!1), v = $({ userId: a == null ? void 0 : a.id, apiKey: o, serviceConfig: l, capabilities: c, customization: m }), y = $(0);
-  y.current++, r("📊 RENDER INFO", {
-    renderCount: y.current,
-    currentProps: { userId: a == null ? void 0 : a.id, apiKey: (o == null ? void 0 : o.substring(0, 8)) + "..." },
+  const [o, b] = w(null), [x, g] = w(null), [c, C] = w(!1), [v, y] = w(!1), [I, P] = w(null), p = A(!1), E = A({
+    userId: s == null ? void 0 : s.id,
+    apiKey: l,
+    serviceConfig: n,
+    capabilities: a,
+    customization: m
+  }), R = A(0);
+  R.current++, r("📊 RENDER INFO", {
+    renderCount: R.current,
+    currentProps: { userId: s == null ? void 0 : s.id, apiKey: (l == null ? void 0 : l.substring(0, 8)) + "..." },
     propChanges: {
-      userChanged: v.current.userId !== (a == null ? void 0 : a.id),
-      apiKeyChanged: v.current.apiKey !== o,
-      serviceConfigChanged: v.current.serviceConfig !== l,
-      capabilitiesChanged: v.current.capabilities !== c,
-      customizationChanged: v.current.customization !== m
+      userChanged: E.current.userId !== (s == null ? void 0 : s.id),
+      apiKeyChanged: E.current.apiKey !== l,
+      serviceConfigChanged: E.current.serviceConfig !== n,
+      capabilitiesChanged: E.current.capabilities !== a,
+      customizationChanged: E.current.customization !== m
     }
-  }), v.current = { userId: a == null ? void 0 : a.id, apiKey: o, serviceConfig: l, capabilities: c, customization: m }, B(() => {
-    const b = y.current;
+  }), E.current = {
+    userId: s == null ? void 0 : s.id,
+    apiKey: l,
+    serviceConfig: n,
+    capabilities: a,
+    customization: m
+  }, B(() => {
+    const N = R.current;
     if (r("🔧 SERVICE INIT EFFECT TRIGGERED", {
-      renderCount: b,
-      apiKey: !!o,
-      serviceConfig: !!l,
+      renderCount: N,
+      apiKey: !!l,
+      serviceConfig: !!n,
       dependencies: {
-        apiKey: (o == null ? void 0 : o.substring(0, 8)) + "...",
-        serviceConfigRef: l,
-        serviceConfigStable: v.current.serviceConfig === l,
-        apiKeyStable: v.current.apiKey === o
+        apiKey: (l == null ? void 0 : l.substring(0, 8)) + "...",
+        serviceConfigRef: n,
+        serviceConfigStable: E.current.serviceConfig === n,
+        apiKeyStable: E.current.apiKey === l
       }
-    }), !o || !l) {
-      r("⚠️ SERVICE INIT SKIPPED", { renderCount: b, reason: "Missing apiKey or serviceConfig" });
+    }), !l || !n) {
+      r("⚠️ SERVICE INIT SKIPPED", {
+        renderCount: N,
+        reason: "Missing apiKey or serviceConfig"
+      });
       return;
     }
     r("🚀 CREATING NEW SERVICE", {
-      renderCount: b,
-      apiKey: (o == null ? void 0 : o.substring(0, 8)) + "...",
-      serviceConfigChanged: v.current.serviceConfig !== l
+      renderCount: N,
+      apiKey: (l == null ? void 0 : l.substring(0, 8)) + "...",
+      serviceConfigChanged: E.current.serviceConfig !== n
     });
-    const M = new Fe({
-      ...l,
-      apiKey: o,
-      debug: u
+    const S = new he({
+      ...n,
+      apiKey: l,
+      debug: d
     });
-    return w(M), r("✅ SERVICE SET", { renderCount: b, serviceInstance: !!M }), () => {
-      r("🧹 SERVICE CLEANUP", { renderCount: b, reason: "Effect cleanup" }), M.disconnectUser().catch(console.error);
+    return b(S), r("✅ SERVICE SET", {
+      renderCount: N,
+      serviceInstance: !!S
+    }), () => {
+      r("🧹 SERVICE CLEANUP", {
+        renderCount: N,
+        reason: "Effect cleanup"
+      }), S.disconnectUser().catch(console.error);
     };
-  }, [o, l]);
-  const F = $(null);
+  }, [l, n, d, r]);
+  const T = A(null);
   B(() => {
-    var M, U;
+    var S, j;
     if (r("🔗 USER CONNECTION EFFECT TRIGGERED", {
-      hasService: !!s,
-      hasUser: !!a,
-      userId: a == null ? void 0 : a.id,
-      isConnecting: R.current,
-      isConnected: i,
-      dependencies: { service: !!s, userId: a == null ? void 0 : a.id }
-    }), !s || !a) {
+      hasService: !!o,
+      hasUser: !!s,
+      userId: s == null ? void 0 : s.id,
+      isConnecting: p.current,
+      isConnected: c,
+      dependencies: { service: !!o, userId: s == null ? void 0 : s.id }
+    }), !o || !s) {
       r("⚠️ USER CONNECTION SKIPPED", "Missing service or user");
       return;
     }
-    if (R.current) {
+    if (p.current) {
       r("⚠️ USER CONNECTION SKIPPED", "Already connecting");
       return;
     }
-    if (((M = F.current) == null ? void 0 : M.serviceId) === s && ((U = F.current) == null ? void 0 : U.userId) === a.id) {
-      r("⚠️ USER CONNECTION SKIPPED", "Already connected this user with this service");
+    if (((S = T.current) == null ? void 0 : S.serviceId) === o && ((j = T.current) == null ? void 0 : j.userId) === s.id) {
+      r(
+        "⚠️ USER CONNECTION SKIPPED",
+        "Already connected this user with this service"
+      );
       return;
     }
     (async () => {
-      r("🚀 STARTING USER CONNECTION", { userId: a.id }), R.current = !0, p(!0), V(null);
+      r("🚀 STARTING USER CONNECTION", { userId: s.id }), p.current = !0, y(!0), P(null);
       try {
-        r("📞 CALLING SERVICE.CONNECTUSER", { userId: a.id });
-        const k = await s.connectUser(a);
-        g(k), C(!0), F.current = { serviceId: s, userId: a.id }, r("✅ USER CONNECTION SUCCESS", { userId: a.id, clientId: k.userID });
-      } catch (k) {
-        const P = k instanceof Error ? k.message : "Connection failed";
-        V(P), r("❌ USER CONNECTION ERROR", { userId: a.id, error: P });
+        r("📞 CALLING SERVICE.CONNECTUSER", { userId: s.id });
+        const F = await o.connectUser(s);
+        g(F), C(!0), T.current = { serviceId: o, userId: s.id }, r("✅ USER CONNECTION SUCCESS", {
+          userId: s.id,
+          clientId: F.userID
+        });
+      } catch (F) {
+        const H = F instanceof Error ? F.message : "Connection failed";
+        P(H), r("❌ USER CONNECTION ERROR", {
+          userId: s.id,
+          error: H
+        });
       } finally {
-        p(!1), R.current = !1, r("🔄 USER CONNECTION FINISHED", { userId: a.id, isConnected: i });
+        y(!1), p.current = !1, r("🔄 USER CONNECTION FINISHED", {
+          userId: s.id,
+          isConnected: c
+        });
       }
     })();
-  }, [s, a]), B(() => (r("🔌 CLEANUP EFFECT REGISTERED", { hasService: !!s, isConnected: i }), () => {
-    s && i ? (r("🧹 CLEANUP EFFECT TRIGGERED", "Cleaning up connection on unmount"), F.current = null, s.disconnectUser().catch(console.error)) : r("🔇 CLEANUP EFFECT SKIPPED", { hasService: !!s, isConnected: i });
-  }), [s, i]);
-  const f = H(async () => {
-    if (r("🔄 REFRESH CONNECTION CALLED", { hasService: !!s, hasUser: !!a }), !s || !a) {
+  }, [o, s, r, c]), B(() => (r("🔌 CLEANUP EFFECT REGISTERED", {
+    hasService: !!o,
+    isConnected: c
+  }), () => {
+    o && c ? (r(
+      "🧹 CLEANUP EFFECT TRIGGERED",
+      "Cleaning up connection on unmount"
+    ), T.current = null, o.disconnectUser().catch(console.error)) : r("🔇 CLEANUP EFFECT SKIPPED", {
+      hasService: !!o,
+      isConnected: c
+    });
+  }), [o, c, r]);
+  const u = U(async () => {
+    if (r("🔄 REFRESH CONNECTION CALLED", {
+      hasService: !!o,
+      hasUser: !!s
+    }), !o || !s) {
       r("⚠️ REFRESH CONNECTION SKIPPED", "Missing service or user");
       return;
     }
-    r("🚀 STARTING CONNECTION REFRESH", { userId: a.id }), p(!0);
+    r("🚀 STARTING CONNECTION REFRESH", { userId: s.id }), y(!0);
     try {
-      r("🔌 DISCONNECTING FOR REFRESH"), await s.disconnectUser(), r("📞 RECONNECTING FOR REFRESH");
-      const b = await s.connectUser(a);
-      g(b), C(!0), V(null), r("✅ CONNECTION REFRESH SUCCESS", { userId: a.id });
-    } catch (b) {
-      const M = b instanceof Error ? b.message : "Refresh failed";
-      V(M), r("❌ CONNECTION REFRESH ERROR", { userId: a.id, error: M });
+      r("🔌 DISCONNECTING FOR REFRESH"), await o.disconnectUser(), r("📞 RECONNECTING FOR REFRESH");
+      const N = await o.connectUser(s);
+      g(N), C(!0), P(null), r("✅ CONNECTION REFRESH SUCCESS", { userId: s.id });
+    } catch (N) {
+      const S = N instanceof Error ? N.message : "Refresh failed";
+      P(S), r("❌ CONNECTION REFRESH ERROR", {
+        userId: s.id,
+        error: S
+      });
     } finally {
-      p(!1), r("🔄 CONNECTION REFRESH FINISHED", { userId: a.id });
+      y(!1), r("🔄 CONNECTION REFRESH FINISHED", { userId: s.id });
     }
-  }, [s, a]), h = _.useMemo(() => (r("💫 CONTEXT VALUE MEMOIZATION", {
-    hasService: !!s,
-    hasClient: !!N,
-    isConnected: i,
-    isLoading: x,
-    hasError: !!Z,
-    capabilitiesKeys: Object.keys(c),
+  }, [o, s, r]), f = $.useMemo(() => (r("💫 CONTEXT VALUE MEMOIZATION", {
+    hasService: !!o,
+    hasClient: !!x,
+    isConnected: c,
+    isLoading: v,
+    hasError: !!I,
+    capabilitiesKeys: Object.keys(a),
     customizationKeys: Object.keys(m)
   }), {
-    service: s,
-    client: N,
-    isConnected: i,
-    isLoading: x,
-    error: Z,
-    capabilities: c,
+    service: o,
+    client: x,
+    isConnected: c,
+    isLoading: v,
+    error: I,
+    capabilities: a,
     customization: m,
-    refreshConnection: f,
-    debug: u
-  }), [s, N, i, x, Z, c, m, f, u]);
+    refreshConnection: u,
+    debug: d
+  }), [
+    o,
+    x,
+    c,
+    v,
+    I,
+    a,
+    m,
+    u,
+    d,
+    r
+  ]);
   return r("🔄 RENDER END", {
-    renderCount: y.current,
-    willRenderChat: !!(N && i),
-    contextValueReady: !!h
-  }), /* @__PURE__ */ t(he.Provider, { value: h, children: N && i ? /* @__PURE__ */ t(Ae, { client: N, children: n }) : n });
-};
-function He(n) {
-  const a = [
-    { bgColor: "bg-primary bg-opacity-20", textColor: "text-primary" },
+    renderCount: R.current,
+    willRenderChat: !!(x && c),
+    contextValueReady: !!f
+  }), /* @__PURE__ */ e(ae.Provider, { value: f, children: x && c ? /* @__PURE__ */ e(fe, { client: x, children: t }) : t });
+}, Pe = () => Z();
+function q({ label: t, className: s, children: n, ...l }) {
+  return /* @__PURE__ */ i(
+    "button",
+    {
+      type: "button",
+      className: L(
+        "rounded-full p-2 transition-colors focus-ring",
+        {
+          "cursor-not-allowed opacity-50": l.disabled,
+          "hover:bg-sand": !l.disabled
+        },
+        s
+      ),
+      ...l,
+      children: [
+        /* @__PURE__ */ e("span", { className: "sr-only", children: t }),
+        n
+      ]
+    }
+  );
+}
+function Te(t) {
+  const s = [
+    { bgColor: "bg-primary/20", textColor: "text-primary" },
     // #8129D9 - purple
-    { bgColor: "bg-forest bg-opacity-20", textColor: "text-forest" },
+    { bgColor: "bg-forest/20", textColor: "text-forest" },
     // #254f1a - dark green
-    { bgColor: "bg-iris bg-opacity-20", textColor: "text-iris" },
+    { bgColor: "bg-iris/20", textColor: "text-iris" },
     // #061492 - dark blue
-    { bgColor: "bg-shade bg-opacity-20", textColor: "text-shade" },
+    { bgColor: "bg-shade/20", textColor: "text-shade" },
     // #1e2330 - dark blue-gray
-    { bgColor: "bg-dahlia bg-opacity-20", textColor: "text-dahlia" },
+    { bgColor: "bg-dahlia/20", textColor: "text-dahlia" },
     // #502274 - dark purple
-    { bgColor: "bg-orchid bg-opacity-20", textColor: "text-orchid" },
+    { bgColor: "bg-orchid/20", textColor: "text-orchid" },
     // #d717e7 - magenta
-    { bgColor: "bg-currant bg-opacity-20", textColor: "text-currant" },
+    { bgColor: "bg-currant/20", textColor: "text-currant" },
     // #780016 - dark red
-    { bgColor: "bg-apple bg-opacity-20", textColor: "text-apple" },
+    { bgColor: "bg-apple/20", textColor: "text-apple" },
     // #c41500 - red
-    { bgColor: "bg-rose bg-opacity-20", textColor: "text-rose" },
+    { bgColor: "bg-rose/20", textColor: "text-rose" },
     // #fc3e4b - pink
-    { bgColor: "bg-root bg-opacity-20", textColor: "text-root" },
+    { bgColor: "bg-root/20", textColor: "text-root" },
     // #4c2e05 - brown
-    { bgColor: "bg-poppy bg-opacity-20", textColor: "text-poppy" },
+    { bgColor: "bg-poppy/20", textColor: "text-poppy" },
     // #ff6c02 - orange
-    { bgColor: "bg-moss bg-opacity-20", textColor: "text-moss" }
+    { bgColor: "bg-moss/20", textColor: "text-moss" }
     // #70764d - olive green
   ];
-  let l = 0;
-  for (let c = 0; c < n.length; c++)
-    l = (l << 5) - l + n.charCodeAt(c), l = l & l;
-  const o = Math.abs(l) % a.length;
-  return a[o];
+  let n = 0;
+  for (let a = 0; a < t.length; a++)
+    n = (n << 5) - n + t.charCodeAt(a), n = n & n;
+  const l = Math.abs(n) % s.length;
+  return s[l];
 }
-const ee = ({
-  id: n,
-  name: a,
-  image: l,
-  size: o = 40,
-  className: c
+const Y = ({
+  id: t,
+  name: s,
+  image: n,
+  size: l = 40,
+  className: a
 }) => {
-  const { bgColor: m, textColor: u } = He(n), r = a.charAt(0).toUpperCase(), w = o < 32 ? "text-xs" : o < 56 ? "text-sm" : "text-lg";
-  return /* @__PURE__ */ t(
+  const { bgColor: m, textColor: d } = Te(t), r = s.charAt(0).toUpperCase(), b = l < 32 ? "text-xs" : l < 56 ? "text-sm" : "text-lg";
+  return /* @__PURE__ */ e(
     "div",
     {
       className: L(
         "flex-shrink-0 overflow-hidden rounded-full",
-        c
+        a
       ),
-      style: { width: `${o}px`, height: `${o}px` },
-      children: l ? /* @__PURE__ */ t(
+      style: { width: `${l}px`, height: `${l}px` },
+      children: n ? /* @__PURE__ */ e(
         "img",
         {
-          src: l,
+          src: n,
           alt: "",
           className: "h-full w-full object-cover aspect-square"
         }
-      ) : /* @__PURE__ */ t(
+      ) : /* @__PURE__ */ e(
         "div",
         {
           className: L(
             "flex h-full w-full items-center justify-center font-semibold",
             m,
-            u,
-            w
+            d,
+            b
           ),
           children: r
         }
       )
     }
   );
-}, Se = ({ channel: n, selectedChannel: a, onChannelSelect: l, debug: o = !1, ...c }) => {
-  var p, Z, V, R, v, y, F;
-  const m = (a == null ? void 0 : a.id) === (n == null ? void 0 : n.id), u = () => {
-    n && l(n);
-  }, s = Object.values(((p = n == null ? void 0 : n.state) == null ? void 0 : p.members) || {}).find(
-    (f) => {
-      var h, b;
-      return ((h = f.user) == null ? void 0 : h.id) && f.user.id !== ((b = n == null ? void 0 : n._client) == null ? void 0 : b.userID);
+}, De = ({ channel: t, selectedChannel: s, onChannelSelect: n, debug: l = !1 }) => {
+  var v, y, I, P, p, E, R;
+  const a = (s == null ? void 0 : s.id) === (t == null ? void 0 : t.id), m = () => {
+    t && n(t);
+  }, r = Object.values(((v = t == null ? void 0 : t.state) == null ? void 0 : v.members) || {}).find(
+    (T) => {
+      var u, f;
+      return ((u = T.user) == null ? void 0 : u.id) && T.user.id !== ((f = t == null ? void 0 : t._client) == null ? void 0 : f.userID);
     }
-  ), w = ((Z = s == null ? void 0 : s.user) == null ? void 0 : Z.name) || "Conversation", N = (V = s == null ? void 0 : s.user) == null ? void 0 : V.image;
-  w.charAt(0).toUpperCase();
-  const g = (v = (R = n == null ? void 0 : n.state) == null ? void 0 : R.messages) == null ? void 0 : v[n.state.messages.length - 1], i = (g == null ? void 0 : g.text) || "No messages yet", C = g != null && g.created_at ? new Date(g.created_at).toLocaleTimeString([], {
+  ), o = ((y = r == null ? void 0 : r.user) == null ? void 0 : y.name) || "Conversation", b = (I = r == null ? void 0 : r.user) == null ? void 0 : I.image, x = (p = (P = t == null ? void 0 : t.state) == null ? void 0 : P.messages) == null ? void 0 : p[t.state.messages.length - 1], g = (x == null ? void 0 : x.text) || "No messages yet", c = x != null && x.created_at ? new Date(x.created_at).toLocaleTimeString([], {
     hour: "2-digit",
     minute: "2-digit"
-  }) : "", x = ((y = n == null ? void 0 : n.state) == null ? void 0 : y.unreadCount) || 0;
-  return o && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
-    channelId: n == null ? void 0 : n.id,
-    isSelected: m,
-    participantName: w,
-    unread: x,
-    hasTimestamp: !!C
-  }), /* @__PURE__ */ t(
+  }) : "", C = ((E = t == null ? void 0 : t.state) == null ? void 0 : E.unreadCount) || 0;
+  return l && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
+    channelId: t == null ? void 0 : t.id,
+    isSelected: a,
+    participantName: o,
+    unread: C,
+    hasTimestamp: !!c
+  }), /* @__PURE__ */ e(
     "button",
     {
       type: "button",
-      onClick: u,
+      onClick: m,
       className: L(
         "w-full px-4 py-3 transition-colors border-b border-sand text-left max-w-full overflow-hidden focus-ring",
         {
-          "bg-primary-alt bg-opacity-10 border-l-4 border-l-primary": m,
-          "hover:bg-sand": !m
+          "bg-primary-alt/10 border-l-4 border-l-primary": a,
+          "hover:bg-sand": !a
         }
       ),
-      children: /* @__PURE__ */ d("div", { className: "flex items-start gap-3", children: [
-        /* @__PURE__ */ t(
-          ee,
+      children: /* @__PURE__ */ i("div", { className: "flex items-start gap-3", children: [
+        /* @__PURE__ */ e(
+          Y,
           {
-            id: ((F = s == null ? void 0 : s.user) == null ? void 0 : F.id) || n.id || "unknown",
-            name: w,
-            image: N,
+            id: ((R = r == null ? void 0 : r.user) == null ? void 0 : R.id) || t.id || "unknown",
+            name: o,
+            image: b,
             size: 44
           }
         ),
-        /* @__PURE__ */ d("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
-          /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-2", children: [
-            /* @__PURE__ */ t(
+        /* @__PURE__ */ i("div", { className: "flex-1 min-w-0 flex flex-col gap-1", children: [
+          /* @__PURE__ */ i("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ e(
               "h3",
               {
                 className: L(
                   "text-sm font-medium truncate",
-                  m ? "text-primary" : "text-charcoal"
+                  a ? "text-primary" : "text-charcoal"
                 ),
-                children: w
+                children: o
               }
             ),
-            C && /* @__PURE__ */ t("span", { className: "text-xs text-stone flex-shrink-0", children: C })
+            c && /* @__PURE__ */ e("span", { className: "text-xs text-stone flex-shrink-0", children: c })
           ] }),
-          /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-2 min-w-0", children: [
-            /* @__PURE__ */ t("p", { className: "text-xs text-stone mr-2 flex-1 line-clamp-2", children: i }),
-            x > 0 && /* @__PURE__ */ t("span", { className: "bg-primary text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: x > 99 ? "99+" : x })
+          /* @__PURE__ */ i("div", { className: "flex items-center justify-between gap-2 min-w-0", children: [
+            /* @__PURE__ */ e("p", { className: "text-xs text-stone mr-2 flex-1 line-clamp-2", children: g }),
+            C > 0 && /* @__PURE__ */ e("span", { className: "bg-primary text-white text-xs px-2 py-0.5 rounded-full min-w-[20px] text-center flex-shrink-0", children: C > 99 ? "99+" : C })
           ] })
         ] })
       ] })
     }
   );
-}, ke = ({
-  onChannelSelect: n,
-  selectedChannel: a,
-  showStartConversation: l = !1,
-  onStartConversation: o,
-  participantLabel: c = "participants",
+}, pe = ({
+  onChannelSelect: t,
+  selectedChannel: s,
+  showStartConversation: n = !1,
+  onStartConversation: l,
+  participantLabel: a = "participants",
   className: m
 }) => {
-  var N;
-  const u = _.useRef(0);
-  u.current++;
-  const { debug: r = !1 } = K();
+  var x;
+  const d = $.useRef(0);
+  d.current++;
+  const { debug: r = !1 } = Z();
   r && console.log("📺 [ChannelList] 🔄 RENDER START", {
-    renderCount: u.current,
-    selectedChannelId: a == null ? void 0 : a.id,
-    showStartConversation: l,
-    participantLabel: c
+    renderCount: d.current,
+    selectedChannelId: s == null ? void 0 : s.id,
+    showStartConversation: n,
+    participantLabel: a
   });
-  const { client: s } = Ze();
+  const { client: o } = ge();
   r && console.log("📺 [ChannelList] 📡 CHAT CONTEXT", {
-    renderCount: u.current,
-    hasClient: !!s,
-    clientUserId: s == null ? void 0 : s.userID,
-    clientConnected: (N = s == null ? void 0 : s.wsConnection) == null ? void 0 : N.isHealthy
+    renderCount: d.current,
+    hasClient: !!o,
+    clientUserId: o == null ? void 0 : o.userID,
+    clientConnected: (x = o == null ? void 0 : o.wsConnection) == null ? void 0 : x.isHealthy
   });
-  const w = _.useMemo(() => {
-    const g = s.userID, i = g ? { type: "messaging", members: { $in: [g] }, hidden: !1 } : { type: "messaging" };
+  const b = $.useMemo(() => {
+    const g = o.userID, c = g ? { type: "messaging", members: { $in: [g] }, hidden: !1 } : { type: "messaging" };
     return r && console.log("📺 [ChannelList] 🔍 FILTERS MEMOIZED", {
-      renderCount: u.current,
+      renderCount: d.current,
       userId: g,
-      filters: i
-    }), i;
-  }, [s.userID, r]);
-  return /* @__PURE__ */ d("div", { className: L("h-full flex flex-col min-w-0 overflow-hidden", m), children: [
-    /* @__PURE__ */ t("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-3 min-h-10 min-w-0", children: [
-      /* @__PURE__ */ t("h2", { className: "text-lg font-semibold text-charcoal", children: "Conversations" }),
-      /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: l && o && /* @__PURE__ */ t(
-        J,
-        {
-          label: "Start a new conversation",
-          onClick: o,
-          className: "inline-flex size-10 items-center justify-center",
-          children: /* @__PURE__ */ t(me, { className: "h-5 w-5" })
-        }
-      ) })
-    ] }) }),
-    /* @__PURE__ */ t("div", { className: "flex-1 overflow-hidden min-w-0", children: (r && console.log("📺 [ChannelList] 🎬 RENDERING STREAM CHANNEL LIST", {
-      renderCount: u.current,
-      filters: w,
-      hasClient: !!s,
-      clientUserId: s == null ? void 0 : s.userID
-    }), /* @__PURE__ */ t(
-      ve,
-      {
-        filters: w,
-        sort: { last_message_at: -1 },
-        options: { limit: 30 },
-        Preview: (g) => {
-          var i, C;
-          return r && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
-            channelId: (i = g.channel) == null ? void 0 : i.id,
-            selectedChannelId: a == null ? void 0 : a.id,
-            isSelected: (a == null ? void 0 : a.id) === ((C = g.channel) == null ? void 0 : C.id)
-          }), /* @__PURE__ */ t(
-            Se,
+      filters: c
+    }), c;
+  }, [o.userID, r]);
+  return /* @__PURE__ */ i(
+    "div",
+    {
+      className: L(
+        "h-full flex flex-col min-w-0 overflow-hidden",
+        m
+      ),
+      children: [
+        /* @__PURE__ */ e("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: /* @__PURE__ */ i("div", { className: "flex items-center justify-between gap-3 min-h-10 min-w-0", children: [
+          /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-charcoal", children: "Conversations" }),
+          /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: n && l && /* @__PURE__ */ e(
+            q,
             {
-              ...g,
-              selectedChannel: a,
-              onChannelSelect: n,
-              debug: r
+              label: "Start a new conversation",
+              onClick: l,
+              className: "inline-flex size-10 items-center justify-center",
+              children: /* @__PURE__ */ e(Ee, { className: "h-5 w-5" })
             }
-          );
-        }
-      }
-    )) })
-  ] });
-}, Pe = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M40.14,46.88A12,12,0,0,0,36,56V224a12,12,0,0,0,24,0V181.72c22.84-17.12,42.1-9.12,70.68,5,16.23,8,34.74,17.2,54.8,17.2,14.72,0,30.28-4.94,46.38-18.88A12,12,0,0,0,236,176V56a12,12,0,0,0-19.86-9.07c-24.71,21.41-44.53,13.31-74.82-1.68C113.19,31.27,78.17,13.94,40.14,46.88ZM212,170.26c-22.84,17.13-42.1,9.11-70.68-5C118.16,153.76,90.33,140,60,153.87V61.69c22.84-17.12,42.1-9.12,70.68,5,16.23,8,34.74,17.2,54.8,17.2A63,63,0,0,0,212,78.08Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "path",
-      {
-        d: "M224,56V176c-64,55.43-112-55.43-176,0V56C112,.57,160,111.43,224,56Z",
-        opacity: "0.2"
-      }
-    ), /* @__PURE__ */ e.createElement("path", { d: "M42.76,50A8,8,0,0,0,40,56V224a8,8,0,0,0,16,0V179.77c26.79-21.16,49.87-9.75,76.45,3.41,16.4,8.11,34.06,16.85,53,16.85,13.93,0,28.54-4.75,43.82-18a8,8,0,0,0,2.76-6V56A8,8,0,0,0,218.76,50c-28,24.23-51.72,12.49-79.21-1.12C111.07,34.76,78.78,18.79,42.76,50ZM216,172.25c-26.79,21.16-49.87,9.74-76.45-3.41-25-12.35-52.81-26.13-83.55-8.4V59.79c26.79-21.16,49.87-9.75,76.45,3.4,25,12.35,52.82,26.13,83.55,8.4Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M232,56V176a8,8,0,0,1-2.76,6c-15.28,13.23-29.89,18-43.82,18-18.91,0-36.57-8.74-53-16.85C105.87,170,82.79,158.61,56,179.77V224a8,8,0,0,1-16,0V56a8,8,0,0,1,2.77-6h0c36-31.18,68.31-15.21,96.79-1.12C167,62.46,190.79,74.2,218.76,50A8,8,0,0,1,232,56Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M44.08,51.37A6,6,0,0,0,42,55.9V224a6,6,0,0,0,12,0V178.78c28.08-22.79,51.88-11,79.34,2.57,16.12,8,33.49,16.58,52,16.58,13.57,0,27.76-4.6,42.56-17.42A6,6,0,0,0,230,176V55.9a6,6,0,0,0-9.93-4.54c-29,25.12-53.28,13.09-81.41-.84C110.77,36.71,79,21.16,44.08,51.37ZM218,173.17c-28.08,22.8-51.88,11-79.34-2.58C113.4,158.08,85.09,144.07,54,164V58.72c28.08-22.8,51.88-11,79.34,2.56C158.6,73.79,186.91,87.8,218,67.91Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M42.76,50A8,8,0,0,0,40,56V224a8,8,0,0,0,16,0V179.77c26.79-21.16,49.87-9.75,76.45,3.41,16.4,8.11,34.06,16.85,53,16.85,13.93,0,28.54-4.75,43.82-18a8,8,0,0,0,2.76-6V56A8,8,0,0,0,218.76,50c-28,24.23-51.72,12.49-79.21-1.12C111.07,34.76,78.78,18.79,42.76,50ZM216,172.25c-26.79,21.16-49.87,9.74-76.45-3.41-25-12.35-52.81-26.13-83.55-8.4V59.79c26.79-21.16,49.87-9.75,76.45,3.4,25,12.35,52.82,26.13,83.55,8.4Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M45.39,53.06a4,4,0,0,0-1.39,3V224a4,4,0,0,0,8,0V177.87c29.41-24.39,55.08-11.69,82.23,1.73,16.5,8.17,33.33,16.5,51.13,16.5,13.14,0,26.81-4.55,41.26-17.06a4,4,0,0,0,1.38-3v-120a4,4,0,0,0-6.62-3c-30,26-56,13.07-83.61-.57C109.07,38.28,79.4,23.62,45.39,53.06ZM220,174.17c-29.41,24.4-55.08,11.7-82.23-1.73-26.82-13.27-54.5-27-85.77-4.66V57.92c29.41-24.4,55.08-11.7,82.23,1.73,26.82,13.27,54.5,27,85.77,4.66Z" }))
-  ]
-]), ue = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: Pe }));
-ue.displayName = "FlagIcon";
-const Te = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M168.49,151.51a12,12,0,0,1-17,17l-64-64a12,12,0,0,1,17-17ZM236,128A108,108,0,1,1,128,20,108.12,108.12,0,0,1,236,128Zm-24,0a84,84,0,1,0-84,84A84.09,84.09,0,0,0,212,128Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z", opacity: "0.2" }), /* @__PURE__ */ e.createElement("path", { d: "M165.66,154.34a8,8,0,0,1-11.32,11.32l-64-64a8,8,0,0,1,11.32-11.32ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm37.66,141.66a8,8,0,0,1-11.32,0l-64-64a8,8,0,0,1,11.32-11.32l64,64A8,8,0,0,1,165.66,165.66Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M164.24,155.76a6,6,0,1,1-8.48,8.48l-64-64a6,6,0,0,1,8.48-8.48ZM230,128A102,102,0,1,1,128,26,102.12,102.12,0,0,1,230,128Zm-12,0a90,90,0,1,0-90,90A90.1,90.1,0,0,0,218,128Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M165.66,154.34a8,8,0,0,1-11.32,11.32l-64-64a8,8,0,0,1,11.32-11.32ZM232,128A104,104,0,1,1,128,24,104.11,104.11,0,0,1,232,128Zm-16,0a88,88,0,1,0-88,88A88.1,88.1,0,0,0,216,128Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M162.83,157.17a4,4,0,0,1-5.66,5.66l-64-64a4,4,0,0,1,5.66-5.66ZM228,128A100,100,0,1,1,128,28,100.11,100.11,0,0,1,228,128Zm-8,0a92,92,0,1,0-92,92A92.1,92.1,0,0,0,220,128Z" }))
-  ]
-]), ne = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: Te }));
-ne.displayName = "ProhibitInsetIcon";
-const De = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M124,216a12,12,0,0,1-12,12H48a12,12,0,0,1-12-12V40A12,12,0,0,1,48,28h64a12,12,0,0,1,0,24H60V204h52A12,12,0,0,1,124,216Zm108.49-96.49-40-40a12,12,0,0,0-17,17L195,116H112a12,12,0,0,0,0,24h83l-19.52,19.51a12,12,0,0,0,17,17l40-40A12,12,0,0,0,232.49,119.51Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "path",
-      {
-        d: "M224,56V200a16,16,0,0,1-16,16H48V40H208A16,16,0,0,1,224,56Z",
-        opacity: "0.2"
-      }
-    ), /* @__PURE__ */ e.createElement("path", { d: "M120,216a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8h64a8,8,0,0,1,0,16H56V208h56A8,8,0,0,1,120,216Zm109.66-93.66-40-40a8,8,0,0,0-11.32,11.32L204.69,120H112a8,8,0,0,0,0,16h92.69l-26.35,26.34a8,8,0,0,0,11.32,11.32l40-40A8,8,0,0,0,229.66,122.34Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M120,216a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8h64a8,8,0,0,1,0,16H56V208h56A8,8,0,0,1,120,216Zm109.66-93.66-40-40A8,8,0,0,0,176,88v32H112a8,8,0,0,0,0,16h64v32a8,8,0,0,0,13.66,5.66l40-40A8,8,0,0,0,229.66,122.34Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M118,216a6,6,0,0,1-6,6H48a6,6,0,0,1-6-6V40a6,6,0,0,1,6-6h64a6,6,0,0,1,0,12H54V210h58A6,6,0,0,1,118,216Zm110.24-92.24-40-40a6,6,0,0,0-8.48,8.48L209.51,122H112a6,6,0,0,0,0,12h97.51l-29.75,29.76a6,6,0,1,0,8.48,8.48l40-40A6,6,0,0,0,228.24,123.76Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M120,216a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V40a8,8,0,0,1,8-8h64a8,8,0,0,1,0,16H56V208h56A8,8,0,0,1,120,216Zm109.66-93.66-40-40a8,8,0,0,0-11.32,11.32L204.69,120H112a8,8,0,0,0,0,16h92.69l-26.35,26.34a8,8,0,0,0,11.32,11.32l40-40A8,8,0,0,0,229.66,122.34Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M116,216a4,4,0,0,1-4,4H48a4,4,0,0,1-4-4V40a4,4,0,0,1,4-4h64a4,4,0,0,1,0,8H52V212h60A4,4,0,0,1,116,216Zm110.83-90.83-40-40a4,4,0,0,0-5.66,5.66L214.34,124H112a4,4,0,0,0,0,8H214.34l-33.17,33.17a4,4,0,0,0,5.66,5.66l40-40A4,4,0,0,0,226.83,125.17Z" }))
-  ]
-]), ge = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: De }));
-ge.displayName = "SignOutIcon";
-const Oe = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M140,32V64a12,12,0,0,1-24,0V32a12,12,0,0,1,24,0Zm84,84H192a12,12,0,0,0,0,24h32a12,12,0,0,0,0-24Zm-42.26,48.77a12,12,0,1,0-17,17l22.63,22.63a12,12,0,0,0,17-17ZM128,180a12,12,0,0,0-12,12v32a12,12,0,0,0,24,0V192A12,12,0,0,0,128,180ZM74.26,164.77,51.63,187.4a12,12,0,0,0,17,17l22.63-22.63a12,12,0,1,0-17-17ZM76,128a12,12,0,0,0-12-12H32a12,12,0,0,0,0,24H64A12,12,0,0,0,76,128ZM68.6,51.63a12,12,0,1,0-17,17L74.26,91.23a12,12,0,0,0,17-17Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,128a96,96,0,1,1-96-96A96,96,0,0,1,224,128Z", opacity: "0.2" }), /* @__PURE__ */ e.createElement("path", { d: "M136,32V64a8,8,0,0,1-16,0V32a8,8,0,0,1,16,0Zm88,88H192a8,8,0,0,0,0,16h32a8,8,0,0,0,0-16Zm-45.09,47.6a8,8,0,0,0-11.31,11.31l22.62,22.63a8,8,0,0,0,11.32-11.32ZM128,184a8,8,0,0,0-8,8v32a8,8,0,0,0,16,0V192A8,8,0,0,0,128,184ZM77.09,167.6,54.46,190.22a8,8,0,0,0,11.32,11.32L88.4,178.91A8,8,0,0,0,77.09,167.6ZM72,128a8,8,0,0,0-8-8H32a8,8,0,0,0,0,16H64A8,8,0,0,0,72,128ZM65.78,54.46A8,8,0,0,0,54.46,65.78L77.09,88.4A8,8,0,0,0,88.4,77.09Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24ZM48,136a8,8,0,0,1,0-16H72a8,8,0,0,1,0,16Zm46.06,37.25-17,17a8,8,0,0,1-11.32-11.32l17-17a8,8,0,0,1,11.31,11.31Zm0-79.19a8,8,0,0,1-11.31,0l-17-17A8,8,0,0,1,77.09,65.77l17,17A8,8,0,0,1,94.06,94.06ZM136,208a8,8,0,0,1-16,0V184a8,8,0,0,1,16,0Zm0-136a8,8,0,0,1-16,0V48a8,8,0,0,1,16,0Zm54.23,118.23a8,8,0,0,1-11.32,0l-17-17a8,8,0,0,1,11.31-11.31l17,17A8,8,0,0,1,190.23,190.23ZM208,136H184a8,8,0,0,1,0-16h24a8,8,0,0,1,0,16Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M134,32V64a6,6,0,0,1-12,0V32a6,6,0,0,1,12,0Zm90,90H192a6,6,0,0,0,0,12h32a6,6,0,0,0,0-12Zm-46.5,47A6,6,0,0,0,169,177.5l22.63,22.62a6,6,0,0,0,8.48-8.48ZM128,186a6,6,0,0,0-6,6v32a6,6,0,0,0,12,0V192A6,6,0,0,0,128,186ZM78.5,169,55.88,191.64a6,6,0,1,0,8.48,8.48L87,177.5A6,6,0,1,0,78.5,169ZM70,128a6,6,0,0,0-6-6H32a6,6,0,0,0,0,12H64A6,6,0,0,0,70,128ZM64.36,55.88a6,6,0,0,0-8.48,8.48L78.5,87A6,6,0,1,0,87,78.5Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M136,32V64a8,8,0,0,1-16,0V32a8,8,0,0,1,16,0Zm88,88H192a8,8,0,0,0,0,16h32a8,8,0,0,0,0-16Zm-45.09,47.6a8,8,0,0,0-11.31,11.31l22.62,22.63a8,8,0,0,0,11.32-11.32ZM128,184a8,8,0,0,0-8,8v32a8,8,0,0,0,16,0V192A8,8,0,0,0,128,184ZM77.09,167.6,54.46,190.22a8,8,0,0,0,11.32,11.32L88.4,178.91A8,8,0,0,0,77.09,167.6ZM72,128a8,8,0,0,0-8-8H32a8,8,0,0,0,0,16H64A8,8,0,0,0,72,128ZM65.78,54.46A8,8,0,0,0,54.46,65.78L77.09,88.4A8,8,0,0,0,88.4,77.09Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M132,32V64a4,4,0,0,1-8,0V32a4,4,0,0,1,8,0Zm92,92H192a4,4,0,0,0,0,8h32a4,4,0,0,0,0-8Zm-47.92,46.43a4,4,0,1,0-5.65,5.65l22.62,22.63a4,4,0,0,0,5.66-5.66ZM128,188a4,4,0,0,0-4,4v32a4,4,0,0,0,8,0V192A4,4,0,0,0,128,188ZM79.92,170.43,57.29,193.05A4,4,0,0,0,63,198.71l22.62-22.63a4,4,0,1,0-5.65-5.65ZM68,128a4,4,0,0,0-4-4H32a4,4,0,0,0,0,8H64A4,4,0,0,0,68,128ZM63,57.29A4,4,0,0,0,57.29,63L79.92,85.57a4,4,0,1,0,5.65-5.65Z" }))
-  ]
-]), W = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: Oe }));
-W.displayName = "SpinnerGapIcon";
-const Ue = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M228,128a12,12,0,0,1-12,12H69l51.52,51.51a12,12,0,0,1-17,17l-72-72a12,12,0,0,1,0-17l72-72a12,12,0,0,1,17,17L69,116H216A12,12,0,0,1,228,128Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M112,56V200L40,128Z", opacity: "0.2" }), /* @__PURE__ */ e.createElement("path", { d: "M216,120H120V56a8,8,0,0,0-13.66-5.66l-72,72a8,8,0,0,0,0,11.32l72,72A8,8,0,0,0,120,200V136h96a8,8,0,0,0,0-16ZM104,180.69,51.31,128,104,75.31Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,128a8,8,0,0,1-8,8H120v64a8,8,0,0,1-13.66,5.66l-72-72a8,8,0,0,1,0-11.32l72-72A8,8,0,0,1,120,56v64h96A8,8,0,0,1,224,128Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M222,128a6,6,0,0,1-6,6H54.49l61.75,61.76a6,6,0,1,1-8.48,8.48l-72-72a6,6,0,0,1,0-8.48l72-72a6,6,0,0,1,8.48,8.48L54.49,122H216A6,6,0,0,1,222,128Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,128a8,8,0,0,1-8,8H59.31l58.35,58.34a8,8,0,0,1-11.32,11.32l-72-72a8,8,0,0,1,0-11.32l72-72a8,8,0,0,1,11.32,11.32L59.31,120H216A8,8,0,0,1,224,128Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M220,128a4,4,0,0,1-4,4H49.66l65.17,65.17a4,4,0,0,1-5.66,5.66l-72-72a4,4,0,0,1,0-5.66l72-72a4,4,0,0,1,5.66,5.66L49.66,124H216A4,4,0,0,1,220,128Z" }))
-  ]
-]), fe = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: Ue }));
-fe.displayName = "ArrowLeftIcon";
-const $e = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M144,128a16,16,0,1,1-16-16A16,16,0,0,1,144,128ZM60,112a16,16,0,1,0,16,16A16,16,0,0,0,60,112Zm136,0a16,16,0,1,0,16,16A16,16,0,0,0,196,112Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "path",
-      {
-        d: "M240,96v64a16,16,0,0,1-16,16H32a16,16,0,0,1-16-16V96A16,16,0,0,1,32,80H224A16,16,0,0,1,240,96Z",
-        opacity: "0.2"
-      }
-    ), /* @__PURE__ */ e.createElement("path", { d: "M140,128a12,12,0,1,1-12-12A12,12,0,0,1,140,128Zm56-12a12,12,0,1,0,12,12A12,12,0,0,0,196,116ZM60,116a12,12,0,1,0,12,12A12,12,0,0,0,60,116Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M224,80H32A16,16,0,0,0,16,96v64a16,16,0,0,0,16,16H224a16,16,0,0,0,16-16V96A16,16,0,0,0,224,80ZM60,140a12,12,0,1,1,12-12A12,12,0,0,1,60,140Zm68,0a12,12,0,1,1,12-12A12,12,0,0,1,128,140Zm68,0a12,12,0,1,1,12-12A12,12,0,0,1,196,140Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M138,128a10,10,0,1,1-10-10A10,10,0,0,1,138,128ZM60,118a10,10,0,1,0,10,10A10,10,0,0,0,60,118Zm136,0a10,10,0,1,0,10,10A10,10,0,0,0,196,118Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M140,128a12,12,0,1,1-12-12A12,12,0,0,1,140,128Zm56-12a12,12,0,1,0,12,12A12,12,0,0,0,196,116ZM60,116a12,12,0,1,0,12,12A12,12,0,0,0,60,116Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M136,128a8,8,0,1,1-8-8A8,8,0,0,1,136,128Zm-76-8a8,8,0,1,0,8,8A8,8,0,0,0,60,120Zm136,0a8,8,0,1,0,8,8A8,8,0,0,0,196,120Z" }))
-  ]
-]), Ee = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: $e }));
-Ee.displayName = "DotsThreeIcon";
-const je = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M208.49,191.51a12,12,0,0,1-17,17L128,145,64.49,208.49a12,12,0,0,1-17-17L111,128,47.51,64.49a12,12,0,0,1,17-17L128,111l63.51-63.52a12,12,0,0,1,17,17L145,128Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "path",
-      {
-        d: "M216,56V200a16,16,0,0,1-16,16H56a16,16,0,0,1-16-16V56A16,16,0,0,1,56,40H200A16,16,0,0,1,216,56Z",
-        opacity: "0.2"
-      }
-    ), /* @__PURE__ */ e.createElement("path", { d: "M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M208,32H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM181.66,170.34a8,8,0,0,1-11.32,11.32L128,139.31,85.66,181.66a8,8,0,0,1-11.32-11.32L116.69,128,74.34,85.66A8,8,0,0,1,85.66,74.34L128,116.69l42.34-42.35a8,8,0,0,1,11.32,11.32L139.31,128Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M204.24,195.76a6,6,0,1,1-8.48,8.48L128,136.49,60.24,204.24a6,6,0,0,1-8.48-8.48L119.51,128,51.76,60.24a6,6,0,0,1,8.48-8.48L128,119.51l67.76-67.75a6,6,0,0,1,8.48,8.48L136.49,128Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M205.66,194.34a8,8,0,0,1-11.32,11.32L128,139.31,61.66,205.66a8,8,0,0,1-11.32-11.32L116.69,128,50.34,61.66A8,8,0,0,1,61.66,50.34L128,116.69l66.34-66.35a8,8,0,0,1,11.32,11.32L139.31,128Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M202.83,197.17a4,4,0,0,1-5.66,5.66L128,133.66,58.83,202.83a4,4,0,0,1-5.66-5.66L122.34,128,53.17,58.83a4,4,0,0,1,5.66-5.66L128,122.34l69.17-69.17a4,4,0,1,1,5.66,5.66L133.66,128Z" }))
-  ]
-]), re = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: je }));
-re.displayName = "XIcon";
-function xe({ onClick: n }) {
-  return /* @__PURE__ */ t(J, { label: "Close", onClick: n, className: "p-1", children: /* @__PURE__ */ t(re, { className: "h-5 w-5 text-stone", weight: "bold" }) });
-}
-const Y = ({
-  variant: n = "default",
-  className: a,
-  children: l,
-  ...o
-}) => /* @__PURE__ */ t(
+          ) })
+        ] }) }),
+        /* @__PURE__ */ e("div", { className: "flex-1 overflow-hidden min-w-0", children: (r && console.log("📺 [ChannelList] 🎬 RENDERING STREAM CHANNEL LIST", {
+          renderCount: d.current,
+          filters: b,
+          hasClient: !!o,
+          clientUserId: o == null ? void 0 : o.userID
+        }), /* @__PURE__ */ e(
+          xe,
+          {
+            filters: b,
+            sort: { last_message_at: -1 },
+            options: { limit: 30 },
+            Preview: (g) => {
+              var c, C;
+              return r && console.log("📺 [ChannelList] 📋 CHANNEL PREVIEW RENDER", {
+                channelId: (c = g.channel) == null ? void 0 : c.id,
+                selectedChannelId: s == null ? void 0 : s.id,
+                isSelected: (s == null ? void 0 : s.id) === ((C = g.channel) == null ? void 0 : C.id)
+              }), /* @__PURE__ */ e(
+                De,
+                {
+                  ...g,
+                  selectedChannel: s,
+                  onChannelSelect: t,
+                  debug: r
+                }
+              );
+            }
+          }
+        )) })
+      ]
+    }
+  );
+}, X = ({
+  variant: t = "default",
+  className: s,
+  children: n,
+  ...l
+}) => /* @__PURE__ */ e(
   "button",
   {
     type: "button",
     className: L(
       "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",
-      n === "danger" ? "text-danger hover:bg-danger/50" : "text-charcoal hover:bg-sand",
-      a
+      t === "danger" ? "text-danger hover:bg-danger/50" : "text-charcoal hover:bg-sand",
+      s
     ),
-    ...o,
-    children: l
+    ...l,
+    children: n
   }
-), Be = ({ renderActions: n }) => /* @__PURE__ */ d("div", { className: "message-input flex items-center gap-2 p-4", children: [
-  n && n(),
-  /* @__PURE__ */ t("div", { className: "flex-1", children: /* @__PURE__ */ t(Re, { focus: !0, maxRows: 4 }) })
-] }), Ge = ({ onBack: n, showBackButton: a, onShowInfo: l, canShowInfo: o }) => {
-  var s, w, N, g;
-  const { channel: c } = Ie(), m = _.useMemo(() => Object.values(c.state.members || {}).find(
+);
+function ie({ onClick: t }) {
+  return /* @__PURE__ */ e(q, { label: "Close", onClick: t, className: "p-1", children: /* @__PURE__ */ e(oe, { className: "h-5 w-5 text-stone", weight: "bold" }) });
+}
+const Oe = ({ renderActions: t }) => /* @__PURE__ */ i("div", { className: "message-input flex items-center gap-2 p-4", children: [
+  t && t(),
+  /* @__PURE__ */ e("div", { className: "flex-1", children: /* @__PURE__ */ e(we, { focus: !0, maxRows: 4 }) })
+] }), Ue = ({ onBack: t, showBackButton: s, onShowInfo: n, canShowInfo: l }) => {
+  var o, b, x, g;
+  const { channel: a } = ve(), m = $.useMemo(() => Object.values(a.state.members || {}).find(
     (C) => {
-      var x;
-      return ((x = C.user) == null ? void 0 : x.id) && C.user.id !== c._client.userID;
+      var v;
+      return ((v = C.user) == null ? void 0 : v.id) && C.user.id !== a._client.userID;
     }
-  ), [c._client.userID, c.state.members]), u = ((s = m == null ? void 0 : m.user) == null ? void 0 : s.name) || ((w = m == null ? void 0 : m.user) == null ? void 0 : w.id) || "Unknown member", r = (N = m == null ? void 0 : m.user) == null ? void 0 : N.image;
-  return /* @__PURE__ */ d("div", { className: "flex items-center justify-between gap-3 min-h-12", children: [
-    /* @__PURE__ */ d("div", { className: "flex items-center gap-3 min-w-0", children: [
-      a && n && /* @__PURE__ */ t(
+  ), [a._client.userID, a.state.members]), d = ((o = m == null ? void 0 : m.user) == null ? void 0 : o.name) || ((b = m == null ? void 0 : m.user) == null ? void 0 : b.id) || "Unknown member", r = (x = m == null ? void 0 : m.user) == null ? void 0 : x.image;
+  return /* @__PURE__ */ i("div", { className: "flex items-center justify-between gap-3 min-h-12", children: [
+    /* @__PURE__ */ i("div", { className: "flex items-center gap-3 min-w-0", children: [
+      s && t && /* @__PURE__ */ e(
         "button",
         {
           type: "button",
-          onClick: n,
+          onClick: t,
           className: "inline-flex items-center justify-center w-8 h-8 rounded-lg hover:bg-sand focus:outline-none focus:ring-2 focus:ring-primary transition-colors lg:hidden",
           "aria-label": "Back to channel list",
-          children: /* @__PURE__ */ t(fe, { className: "h-5 w-5 text-stone", weight: "bold" })
+          children: /* @__PURE__ */ e(Ie, { className: "h-5 w-5 text-stone", weight: "bold" })
         }
       ),
-      /* @__PURE__ */ t(
-        ee,
+      /* @__PURE__ */ e(
+        Y,
         {
-          id: ((g = m == null ? void 0 : m.user) == null ? void 0 : g.id) || c.id || "unknown",
-          name: u,
+          id: ((g = m == null ? void 0 : m.user) == null ? void 0 : g.id) || a.id || "unknown",
+          name: d,
           image: r,
           size: 40
         }
       ),
-      /* @__PURE__ */ t("div", { className: "min-w-0", children: /* @__PURE__ */ t("h1", { className: "text-lg font-semibold text-charcoal truncate", children: u }) })
+      /* @__PURE__ */ e("div", { className: "min-w-0", children: /* @__PURE__ */ e("h1", { className: "text-lg font-semibold text-charcoal truncate", children: d }) })
     ] }),
-    o && l && /* @__PURE__ */ t(
-      J,
-      {
-        label: "Chat info",
-        onClick: l,
-        children: /* @__PURE__ */ t(Ee, { className: "h-6 w-6 text-charcoal", weight: "bold" })
-      }
-    )
+    l && n && /* @__PURE__ */ e(q, { label: "Chat info", onClick: n, children: /* @__PURE__ */ e(ye, { className: "h-6 w-6 text-charcoal", weight: "bold" }) })
   ] });
-}, _e = ({ isOpen: n, onClose: a, participant: l, channel: o, followerStatusLabel: c, onLeaveConversation: m, onBlockParticipant: u }) => {
-  var k, P, X, Q, z, q, G;
-  const { service: r, debug: s } = K(), w = $(null), [N, g] = A(!1), [i, C] = A(!1), [x, p] = A(!1);
+}, Le = ({
+  isOpen: t,
+  onClose: s,
+  participant: n,
+  channel: l,
+  followerStatusLabel: a,
+  onLeaveConversation: m,
+  onBlockParticipant: d
+}) => {
+  var F, H, V, _, W, G, z;
+  const { service: r, debug: o } = Z(), b = A(null), [x, g] = w(!1), [c, C] = w(!1), [v, y] = w(!1);
   B(() => {
-    const I = w.current;
-    I && (n ? I.showModal() : I.close());
-  }, [n]);
-  const Z = H(async () => {
-    var I;
-    if (!(!r || !((I = l == null ? void 0 : l.user) != null && I.id)))
+    const k = b.current;
+    k && (t ? k.showModal() : k.close());
+  }, [t]);
+  const I = U(async () => {
+    var k;
+    if (!(!r || !((k = n == null ? void 0 : n.user) != null && k.id)))
       try {
-        const T = (await r.getBlockedUsers()).some(
-          (E) => E.blocked_user_id === l.user.id
+        const h = (await r.getBlockedUsers()).some(
+          (O) => {
+            var M;
+            return O.blocked_user_id === ((M = n == null ? void 0 : n.user) == null ? void 0 : M.id);
+          }
+        );
+        g(h);
+      } catch (D) {
+        console.error(
+          "[ChannelInfoDialog] Failed to check blocked status:",
+          D
         );
-        g(T);
-      } catch (S) {
-        console.error("[ChannelInfoDialog] Failed to check blocked status:", S);
       }
-  }, [r, (k = l == null ? void 0 : l.user) == null ? void 0 : k.id]);
+  }, [r, (F = n == null ? void 0 : n.user) == null ? void 0 : F.id]);
   B(() => {
-    n && Z();
-  }, [n, Z]);
-  const V = async () => {
-    var I;
-    if (!i) {
-      s && console.log("[ChannelInfoDialog] Leave conversation", o.cid), C(!0);
+    t && I();
+  }, [t, I]);
+  const P = async () => {
+    var k;
+    if (!c) {
+      o && console.log("[ChannelInfoDialog] Leave conversation", l.cid), C(!0);
       try {
-        const S = ((I = o._client) == null ? void 0 : I.userID) ?? null;
-        await o.hide(S, !1), m && await m(o), a();
-      } catch (S) {
-        console.error("[ChannelInfoDialog] Failed to leave conversation", S);
+        const D = ((k = l._client) == null ? void 0 : k.userID) ?? null;
+        await l.hide(D, !1), m && await m(l), s();
+      } catch (D) {
+        console.error("[ChannelInfoDialog] Failed to leave conversation", D);
       } finally {
         C(!1);
       }
     }
-  }, R = async () => {
-    var I, S, T;
-    if (!(x || !r)) {
-      s && console.log("[ChannelInfoDialog] Block member", (I = l == null ? void 0 : l.user) == null ? void 0 : I.id), p(!0);
+  }, p = async () => {
+    var k, D, h;
+    if (!(v || !r)) {
+      o && console.log("[ChannelInfoDialog] Block member", (k = n == null ? void 0 : n.user) == null ? void 0 : k.id), y(!0);
       try {
-        await r.blockUser((S = l == null ? void 0 : l.user) == null ? void 0 : S.id), u && await u((T = l == null ? void 0 : l.user) == null ? void 0 : T.id), a();
-      } catch (E) {
-        console.error("[ChannelInfoDialog] Failed to block member", E);
+        await r.blockUser((D = n == null ? void 0 : n.user) == null ? void 0 : D.id), d && await d((h = n == null ? void 0 : n.user) == null ? void 0 : h.id), s();
+      } catch (O) {
+        console.error("[ChannelInfoDialog] Failed to block member", O);
       } finally {
-        p(!1);
+        y(!1);
       }
     }
-  }, v = async () => {
-    var I, S, T;
-    if (!(x || !r)) {
-      s && console.log("[ChannelInfoDialog] Unblock member", (I = l == null ? void 0 : l.user) == null ? void 0 : I.id), p(!0);
+  }, E = async () => {
+    var k, D, h;
+    if (!(v || !r)) {
+      o && console.log("[ChannelInfoDialog] Unblock member", (k = n == null ? void 0 : n.user) == null ? void 0 : k.id), y(!0);
       try {
-        await r.unBlockUser((S = l == null ? void 0 : l.user) == null ? void 0 : S.id), u && await u((T = l == null ? void 0 : l.user) == null ? void 0 : T.id), a();
-      } catch (E) {
-        console.error("[ChannelInfoDialog] Failed to unblock member", E);
+        await r.unBlockUser((D = n == null ? void 0 : n.user) == null ? void 0 : D.id), d && await d((h = n == null ? void 0 : n.user) == null ? void 0 : h.id), s();
+      } catch (O) {
+        console.error("[ChannelInfoDialog] Failed to unblock member", O);
       } finally {
-        p(!1);
+        y(!1);
       }
     }
-  }, y = () => {
-    a(), window.open(
+  }, R = () => {
+    s(), window.open(
       "https://linktr.ee/s/about/trust-center/report",
       "_blank",
       "noopener,noreferrer"
     );
   };
-  if (!l) return null;
-  const F = ((P = l.user) == null ? void 0 : P.name) || ((X = l.user) == null ? void 0 : X.id) || "Unknown member", f = (Q = l.user) == null ? void 0 : Q.image, h = (z = l.user) == null ? void 0 : z.email, b = (q = l.user) == null ? void 0 : q.username, M = h || (b ? `linktr.ee/${b}` : void 0), U = ((G = l.user) == null ? void 0 : G.id) || "unknown";
-  return /* @__PURE__ */ t(
-    "dialog",
-    {
-      ref: w,
-      className: "mes-dialog",
-      onClose: a,
-      onClick: (I) => {
-        I.target === w.current && a();
-      },
-      children: /* @__PURE__ */ d("div", { className: "ml-auto flex h-full w-full flex-col bg-white shadow-max-elevation-light", children: [
-        /* @__PURE__ */ d("div", { className: "flex items-center justify-between border-b border-sand px-4 py-3", children: [
-          /* @__PURE__ */ t("h2", { className: "text-base font-semibold text-charcoal", children: "Chat info" }),
-          /* @__PURE__ */ t(xe, { onClick: a })
-        ] }),
-        /* @__PURE__ */ d("div", { className: "flex-1 overflow-y-auto px-6 py-6", children: [
-          /* @__PURE__ */ t("div", { className: "rounded-2xl bg-chalk p-4", children: /* @__PURE__ */ d("div", { className: "flex items-center gap-4", children: [
-            /* @__PURE__ */ t(
-              ee,
-              {
-                id: U,
-                name: F,
-                image: f,
-                size: 64
-              }
-            ),
-            /* @__PURE__ */ d("div", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ t("p", { className: "truncate text-base font-semibold text-charcoal", children: F }),
-              M && /* @__PURE__ */ t("p", { className: "truncate text-sm text-stone", children: M }),
-              c && /* @__PURE__ */ t("span", { className: "mt-2 inline-flex items-center rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-700", children: c })
+  if (!n) return null;
+  const T = ((H = n.user) == null ? void 0 : H.name) || ((V = n.user) == null ? void 0 : V.id) || "Unknown member", u = (_ = n.user) == null ? void 0 : _.image, f = (W = n.user) == null ? void 0 : W.email, N = (G = n.user) == null ? void 0 : G.username, S = f || (N ? `linktr.ee/${N}` : void 0), j = ((z = n.user) == null ? void 0 : z.id) || "unknown";
+  return (
+    // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
+    /* @__PURE__ */ e(
+      "dialog",
+      {
+        ref: b,
+        className: "mes-dialog",
+        onClose: s,
+        onClick: (k) => {
+          k.target === b.current && s();
+        },
+        children: /* @__PURE__ */ i("div", { className: "ml-auto flex h-full w-full flex-col bg-white shadow-max-elevation-light", children: [
+          /* @__PURE__ */ i("div", { className: "flex items-center justify-between border-b border-sand px-4 py-3", children: [
+            /* @__PURE__ */ e("h2", { className: "text-base font-semibold text-charcoal", children: "Chat info" }),
+            /* @__PURE__ */ e(ie, { onClick: s })
+          ] }),
+          /* @__PURE__ */ i("div", { className: "flex-1 overflow-y-auto px-6 py-6", children: [
+            /* @__PURE__ */ e("div", { className: "rounded-2xl bg-chalk p-4", children: /* @__PURE__ */ i("div", { className: "flex items-center gap-4", children: [
+              /* @__PURE__ */ e(
+                Y,
+                {
+                  id: j,
+                  name: T,
+                  image: u,
+                  size: 64
+                }
+              ),
+              /* @__PURE__ */ i("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ e("p", { className: "truncate text-base font-semibold text-charcoal", children: T }),
+                S && /* @__PURE__ */ e("p", { className: "truncate text-sm text-stone", children: S }),
+                a && /* @__PURE__ */ e("span", { className: "mt-2 inline-flex items-center rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-700", children: a })
+              ] })
+            ] }) }),
+            /* @__PURE__ */ i("ul", { className: "flex flex-col gap-2 mt-2", children: [
+              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(
+                X,
+                {
+                  onClick: P,
+                  disabled: c,
+                  "aria-busy": c,
+                  children: [
+                    c ? /* @__PURE__ */ e(Q, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(Se, { className: "h-5 w-5" }),
+                    /* @__PURE__ */ e("span", { children: "Leave Conversation" })
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ e("li", { children: x ? /* @__PURE__ */ i(
+                X,
+                {
+                  onClick: E,
+                  disabled: v,
+                  "aria-busy": v,
+                  children: [
+                    v ? /* @__PURE__ */ e(Q, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(te, { className: "h-5 w-5" }),
+                    /* @__PURE__ */ e("span", { children: "Unblock" })
+                  ]
+                }
+              ) : /* @__PURE__ */ i(
+                X,
+                {
+                  onClick: p,
+                  disabled: v,
+                  "aria-busy": v,
+                  children: [
+                    v ? /* @__PURE__ */ e(Q, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ e(te, { className: "h-5 w-5" }),
+                    /* @__PURE__ */ e("span", { children: "Block" })
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ e("li", { children: /* @__PURE__ */ i(X, { variant: "danger", onClick: R, children: [
+                /* @__PURE__ */ e(Re, { className: "h-5 w-5" }),
+                /* @__PURE__ */ e("span", { children: "Report" })
+              ] }) })
             ] })
-          ] }) }),
-          /* @__PURE__ */ d("ul", { className: "flex flex-col gap-2 mt-2", children: [
-            /* @__PURE__ */ t("li", { children: /* @__PURE__ */ d(
-              Y,
-              {
-                onClick: V,
-                disabled: i,
-                "aria-busy": i,
-                children: [
-                  i ? /* @__PURE__ */ t(W, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ t(ge, { className: "h-5 w-5" }),
-                  /* @__PURE__ */ t("span", { children: "Leave Conversation" })
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ t("li", { children: N ? /* @__PURE__ */ d(
-              Y,
-              {
-                onClick: v,
-                disabled: x,
-                "aria-busy": x,
-                children: [
-                  x ? /* @__PURE__ */ t(W, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ t(ne, { className: "h-5 w-5" }),
-                  /* @__PURE__ */ t("span", { children: "Unblock" })
-                ]
-              }
-            ) : /* @__PURE__ */ d(
-              Y,
-              {
-                onClick: R,
-                disabled: x,
-                "aria-busy": x,
-                children: [
-                  x ? /* @__PURE__ */ t(W, { className: "h-5 w-5 animate-spin" }) : /* @__PURE__ */ t(ne, { className: "h-5 w-5" }),
-                  /* @__PURE__ */ t("span", { children: "Block" })
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ t("li", { children: /* @__PURE__ */ d(Y, { variant: "danger", onClick: y, children: [
-              /* @__PURE__ */ t(ue, { className: "h-5 w-5" }),
-              /* @__PURE__ */ t("span", { children: "Report" })
-            ] }) })
           ] })
         ] })
-      ] })
-    }
+      }
+    )
   );
-}, ze = ({
-  channel: n,
-  onBack: a,
-  showBackButton: l = !1,
-  renderMessageInputActions: o,
-  onLeaveConversation: c,
+}, Fe = ({
+  channel: t,
+  onBack: s,
+  showBackButton: n = !1,
+  renderMessageInputActions: l,
+  onLeaveConversation: a,
   onBlockParticipant: m,
-  className: u
+  className: d
 }) => {
-  const [r, s] = A(!1), w = _.useMemo(() => Object.values(n.state.members || {}).find(
-    (i) => {
+  const [r, o] = w(!1), b = $.useMemo(() => Object.values(t.state.members || {}).find(
+    (c) => {
       var C;
-      return ((C = i.user) == null ? void 0 : C.id) && i.user.id !== n._client.userID;
+      return ((C = c.user) == null ? void 0 : C.id) && c.user.id !== t._client.userID;
     }
-  ), [n._client.userID, n.state.members]), N = _.useMemo(() => {
-    const g = n.data ?? {};
+  ), [t._client.userID, t.state.members]), x = $.useMemo(() => {
+    const g = t.data ?? {};
     return g.followerStatus ? String(g.followerStatus) : g.isFollower ? "Subscribed to you" : void 0;
-  }, [n.data]);
-  return /* @__PURE__ */ d("div", { className: L("h-full flex flex-col", u), children: [
-    /* @__PURE__ */ t(Me, { channel: n, children: /* @__PURE__ */ d(pe, { children: [
-      /* @__PURE__ */ t("div", { className: "border-b border-sand bg-white px-4 py-3", children: /* @__PURE__ */ t(
-        Ge,
+  }, [t.data]);
+  return /* @__PURE__ */ i("div", { className: L("h-full flex flex-col", d), children: [
+    /* @__PURE__ */ e(Ne, { channel: t, children: /* @__PURE__ */ i(Ce, { children: [
+      /* @__PURE__ */ e("div", { className: "border-b border-sand bg-white px-4 py-3", children: /* @__PURE__ */ e(
+        Ue,
         {
-          onBack: a,
-          showBackButton: l,
-          onShowInfo: () => s(!0),
-          canShowInfo: !!w
+          onBack: s,
+          showBackButton: n,
+          onShowInfo: () => o(!0),
+          canShowInfo: !!b
         }
       ) }),
-      /* @__PURE__ */ t("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ t(ye, { hideDeletedMessages: !0, hideNewMessageSeparator: !1 }) }),
-      /* @__PURE__ */ t(
-        Be,
+      /* @__PURE__ */ e("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ e(be, { hideDeletedMessages: !0, hideNewMessageSeparator: !1 }) }),
+      /* @__PURE__ */ e(
+        Oe,
         {
-          renderActions: () => o == null ? void 0 : o(n)
+          renderActions: () => l == null ? void 0 : l(t)
         }
       )
     ] }) }),
-    /* @__PURE__ */ t(
-      _e,
+    /* @__PURE__ */ e(
+      Le,
       {
         isOpen: r,
-        onClose: () => s(!1),
-        participant: w,
-        channel: n,
-        followerStatusLabel: N,
-        onLeaveConversation: c,
+        onClose: () => o(!1),
+        participant: b,
+        channel: t,
+        followerStatusLabel: x,
+        onLeaveConversation: a,
         onBlockParticipant: m
       }
     )
   ] });
-}, We = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M120,128a16,16,0,1,1-16-16A16,16,0,0,1,120,128Zm32-16a16,16,0,1,0,16,16A16,16,0,0,0,152,112Zm84,16A108,108,0,0,1,78.77,224.15L46.34,235A20,20,0,0,1,21,209.66l10.81-32.43A108,108,0,1,1,236,128Zm-24,0A84,84,0,1,0,55.27,170.06a12,12,0,0,1,1,9.81l-9.93,29.79,29.79-9.93a12.1,12.1,0,0,1,3.8-.62,12,12,0,0,1,6,1.62A84,84,0,0,0,212,128Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
-      "path",
-      {
-        d: "M224,128A96,96,0,0,1,79.93,211.11h0L42.54,223.58a8,8,0,0,1-10.12-10.12l12.47-37.39h0A96,96,0,1,1,224,128Z",
-        opacity: "0.2"
-      }
-    ), /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,0,0,36.18,176.88L24.83,210.93a16,16,0,0,0,20.24,20.24l34.05-11.35A104,104,0,1,0,128,24Zm0,192a87.87,87.87,0,0,1-44.06-11.81,8,8,0,0,0-4-1.08,7.85,7.85,0,0,0-2.53.42L40,216,52.47,178.6a8,8,0,0,0-.66-6.54A88,88,0,1,1,128,216Zm12-88a12,12,0,1,1-12-12A12,12,0,0,1,140,128Zm-44,0a12,12,0,1,1-12-12A12,12,0,0,1,96,128Zm88,0a12,12,0,1,1-12-12A12,12,0,0,1,184,128Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M128,24A104,104,0,0,0,36.18,176.88L24.83,210.93a16,16,0,0,0,20.24,20.24l34.05-11.35A104,104,0,1,0,128,24ZM84,140a12,12,0,1,1,12-12A12,12,0,0,1,84,140Zm44,0a12,12,0,1,1,12-12A12,12,0,0,1,128,140Zm44,0a12,12,0,1,1,12-12A12,12,0,0,1,172,140Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M138,128a10,10,0,1,1-10-10A10,10,0,0,1,138,128ZM84,118a10,10,0,1,0,10,10A10,10,0,0,0,84,118Zm88,0a10,10,0,1,0,10,10A10,10,0,0,0,172,118Zm58,10A102,102,0,0,1,79.31,217.65L44.44,229.27a14,14,0,0,1-17.71-17.71l11.62-34.87A102,102,0,1,1,230,128Zm-12,0A90,90,0,1,0,50.08,173.06a6,6,0,0,1,.5,4.91L38.12,215.35a2,2,0,0,0,2.53,2.53L78,205.42a6.2,6.2,0,0,1,1.9-.31,6.09,6.09,0,0,1,3,.81A90,90,0,0,0,218,128Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M140,128a12,12,0,1,1-12-12A12,12,0,0,1,140,128ZM84,116a12,12,0,1,0,12,12A12,12,0,0,0,84,116Zm88,0a12,12,0,1,0,12,12A12,12,0,0,0,172,116Zm60,12A104,104,0,0,1,79.12,219.82L45.07,231.17a16,16,0,0,1-20.24-20.24l11.35-34.05A104,104,0,1,1,232,128Zm-16,0A88,88,0,1,0,51.81,172.06a8,8,0,0,1,.66,6.54L40,216,77.4,203.53a7.85,7.85,0,0,1,2.53-.42,8,8,0,0,1,4,1.08A88,88,0,0,0,216,128Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M136,128a8,8,0,1,1-8-8A8,8,0,0,1,136,128Zm-52-8a8,8,0,1,0,8,8A8,8,0,0,0,84,120Zm88,0a8,8,0,1,0,8,8A8,8,0,0,0,172,120Zm56,8A100,100,0,0,1,79.5,215.47l-35.69,11.9a12,12,0,0,1-15.18-15.18l11.9-35.69A100,100,0,1,1,228,128Zm-8,0A92,92,0,1,0,48.35,174.07a4,4,0,0,1,.33,3.27L36.22,214.72a4,4,0,0,0,5.06,5.06l37.38-12.46a3.93,3.93,0,0,1,1.27-.21,4.05,4.05,0,0,1,2,.54A92,92,0,0,0,220,128Z" }))
-  ]
-]), le = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: We }));
-le.displayName = "ChatCircleDotsIcon";
-const Xe = /* @__PURE__ */ new Map([
-  [
-    "bold",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M232.49,215.51,185,168a92.12,92.12,0,1,0-17,17l47.53,47.54a12,12,0,0,0,17-17ZM44,112a68,68,0,1,1,68,68A68.07,68.07,0,0,1,44,112Z" }))
-  ],
-  [
-    "duotone",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M192,112a80,80,0,1,1-80-80A80,80,0,0,1,192,112Z", opacity: "0.2" }), /* @__PURE__ */ e.createElement("path", { d: "M229.66,218.34,179.6,168.28a88.21,88.21,0,1,0-11.32,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z" }))
-  ],
-  [
-    "fill",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M168,112a56,56,0,1,1-56-56A56,56,0,0,1,168,112Zm61.66,117.66a8,8,0,0,1-11.32,0l-50.06-50.07a88,88,0,1,1,11.32-11.31l50.06,50.06A8,8,0,0,1,229.66,229.66ZM112,184a72,72,0,1,0-72-72A72.08,72.08,0,0,0,112,184Z" }))
-  ],
-  [
-    "light",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M228.24,219.76l-51.38-51.38a86.15,86.15,0,1,0-8.48,8.48l51.38,51.38a6,6,0,0,0,8.48-8.48ZM38,112a74,74,0,1,1,74,74A74.09,74.09,0,0,1,38,112Z" }))
-  ],
-  [
-    "regular",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M229.66,218.34l-50.07-50.06a88.11,88.11,0,1,0-11.31,11.31l50.06,50.07a8,8,0,0,0,11.32-11.32ZM40,112a72,72,0,1,1,72,72A72.08,72.08,0,0,1,40,112Z" }))
-  ],
-  [
-    "thin",
-    /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("path", { d: "M226.83,221.17l-52.7-52.7a84.1,84.1,0,1,0-5.66,5.66l52.7,52.7a4,4,0,0,0,5.66-5.66ZM36,112a76,76,0,1,1,76,76A76.08,76.08,0,0,1,36,112Z" }))
-  ]
-]), be = e.forwardRef((n, a) => /* @__PURE__ */ e.createElement(D, { ref: a, ...n, weights: Xe }));
-be.displayName = "MagnifyingGlassIcon";
-function Qe({
-  searchQuery: n,
-  setSearchQuery: a,
-  placeholder: l
+};
+function Me({
+  searchQuery: t,
+  setSearchQuery: s,
+  placeholder: n
 }) {
-  const o = $(null);
-  return /* @__PURE__ */ d("div", { className: "relative", children: [
-    /* @__PURE__ */ t(
-      be,
+  const l = A(null);
+  return /* @__PURE__ */ i("div", { className: "relative", children: [
+    /* @__PURE__ */ e(
+      ke,
       {
         className: "pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-stone",
         weight: "bold"
       }
     ),
-    /* @__PURE__ */ t(
+    /* @__PURE__ */ e(
       "input",
       {
-        ref: o,
+        ref: l,
         type: "text",
-        placeholder: l,
-        value: n,
-        onChange: (c) => a(c.target.value),
+        placeholder: n,
+        value: t,
+        onChange: (a) => s(a.target.value),
         className: "w-full pl-10 pr-10 py-3 text-sm border border-sand rounded-xl focus:outline-none focus:ring-2 focus:ring-black focus:border-transparent"
       }
     ),
-    n && /* @__PURE__ */ t(
-      J,
+    t && /* @__PURE__ */ e(
+      q,
       {
         label: "Clear search",
         onClick: () => {
-          var c;
-          a(""), (c = o.current) == null || c.focus();
+          var a;
+          s(""), (a = l.current) == null || a.focus();
         },
         className: "absolute right-3 top-1/2 -translate-y-1/2 p-1 text-stone hover:text-charcoal",
-        children: /* @__PURE__ */ t(re, { className: "h-4 w-4", weight: "bold" })
+        children: /* @__PURE__ */ e(oe, { className: "h-4 w-4", weight: "bold" })
       }
     )
   ] });
 }
-const qe = ({
-  participantSource: n,
-  onSelectParticipant: a,
-  onClose: l,
-  existingParticipantIds: o = /* @__PURE__ */ new Set(),
-  participantLabel: c = "participants",
+const je = ({
+  participantSource: t,
+  onSelectParticipant: s,
+  onClose: n,
+  existingParticipantIds: l = /* @__PURE__ */ new Set(),
+  participantLabel: a = "participants",
   searchPlaceholder: m = "Search participants...",
-  className: u
+  className: d
 }) => {
-  const { debug: r } = K(), [s, w] = A(""), [N, g] = A([]), [i, C] = A(!1), [x, p] = A(null), [Z, V] = A(null), R = $(!1);
+  const { debug: r } = Z(), [o, b] = w(""), [x, g] = w([]), [c, C] = w(!1), [v, y] = w(null), [I, P] = w(
+    null
+  ), p = A(!1);
   B(() => {
-    if (n.loading) {
-      r && console.log("[ParticipantPicker] Waiting for participant source to finish loading...");
+    if (t.loading) {
+      r && console.log(
+        "[ParticipantPicker] Waiting for participant source to finish loading..."
+      );
       return;
     }
-    if (R.current) return;
+    if (p.current) return;
     (async () => {
-      r && console.log("[ParticipantPicker] Loading initial participants..."), C(!0), p(null);
+      r && console.log("[ParticipantPicker] Loading initial participants..."), C(!0), y(null);
       try {
-        const h = await n.loadParticipants({
+        const f = await t.loadParticipants({
           search: "",
           // Load all participants initially
           limit: 100
         });
-        g(h.participants), R.current = !0, r && console.log("[ParticipantPicker] Participants loaded successfully:", h.participants.length);
-      } catch (h) {
-        const b = h instanceof Error ? h.message : "Failed to load participants";
-        p(b), console.error("[ParticipantPicker] Failed to load participants:", h);
+        g(f.participants), p.current = !0, r && console.log(
+          "[ParticipantPicker] Participants loaded successfully:",
+          f.participants.length
+        );
+      } catch (f) {
+        const N = f instanceof Error ? f.message : "Failed to load participants";
+        y(N), console.error("[ParticipantPicker] Failed to load participants:", f);
       } finally {
         C(!1);
       }
     })();
-  }, [n.loading, r]);
-  const v = N.filter((f) => !o.has(f.id)).filter((f) => {
-    var b;
-    if (!s) return !0;
-    const h = s.toLowerCase();
-    return f.name.toLowerCase().includes(h) || ((b = f.email) == null ? void 0 : b.toLowerCase().includes(h)) || !1;
-  }), y = H(async (f) => {
-    if (!Z) {
-      V(f.id);
-      try {
-        await a(f);
-      } catch (h) {
-        console.error("[ParticipantPicker] Failed to start chat:", h), V(null);
+  }, [t.loading, r]);
+  const E = x.filter((u) => !l.has(u.id)).filter((u) => {
+    var N;
+    if (!o) return !0;
+    const f = o.toLowerCase();
+    return u.name.toLowerCase().includes(f) || ((N = u.email) == null ? void 0 : N.toLowerCase().includes(f)) || !1;
+  }), R = U(
+    async (u) => {
+      if (!I) {
+        P(u.id);
+        try {
+          await s(u);
+        } catch (f) {
+          console.error("[ParticipantPicker] Failed to start chat:", f), P(null);
+        }
       }
-    }
-  }, [a, Z]), F = (f, h) => {
-    (f.key === "Enter" || f.key === " ") && (f.preventDefault(), y(h));
+    },
+    [s, I]
+  ), T = (u, f) => {
+    (u.key === "Enter" || u.key === " ") && (u.preventDefault(), R(f));
   };
-  return /* @__PURE__ */ d("div", { className: L("flex flex-col h-full", u), children: [
-    /* @__PURE__ */ d("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: [
-      /* @__PURE__ */ d("div", { className: "flex items-center justify-between mb-3", children: [
-        /* @__PURE__ */ t("h2", { className: "text-lg font-semibold text-charcoal", children: "Start a new Conversation" }),
-        /* @__PURE__ */ t(xe, { onClick: l })
+  return /* @__PURE__ */ i("div", { className: L("flex flex-col h-full", d), children: [
+    /* @__PURE__ */ i("div", { className: "px-4 py-4 border-b border-sand bg-chalk", children: [
+      /* @__PURE__ */ i("div", { className: "flex items-center justify-between mb-3", children: [
+        /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-charcoal", children: "Start a new Conversation" }),
+        /* @__PURE__ */ e(ie, { onClick: n })
       ] }),
-      /* @__PURE__ */ d("p", { className: "text-xs text-stone mb-3", children: [
+      /* @__PURE__ */ i("p", { className: "text-xs text-stone mb-3", children: [
         "Select a ",
-        c.slice(0, -1),
+        a.slice(0, -1),
         " to start messaging (",
-        v.length,
+        E.length,
         " available)",
-        n.totalCount !== void 0 && ` • ${n.totalCount} ${c} total`
+        t.totalCount !== void 0 && ` • ${t.totalCount} ${a} total`
       ] }),
-      /* @__PURE__ */ t(
-        Qe,
+      /* @__PURE__ */ e(
+        Me,
         {
-          searchQuery: s,
-          setSearchQuery: w,
+          searchQuery: o,
+          setSearchQuery: b,
           placeholder: m
         }
       )
     ] }),
-    x && /* @__PURE__ */ d("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
+    v && /* @__PURE__ */ i("div", { className: "p-4 text-sm text-danger bg-danger-alt", children: [
       "Error loading ",
-      c,
+      a,
       ": ",
-      x
+      v
     ] }),
-    /* @__PURE__ */ t("div", { className: "flex-1 overflow-auto", children: i && v.length === 0 ? /* @__PURE__ */ t("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ d("div", { className: "flex items-center space-x-2", children: [
-      /* @__PURE__ */ t("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
-      /* @__PURE__ */ d("span", { className: "text-sm text-stone", children: [
+    /* @__PURE__ */ e("div", { className: "flex-1 overflow-auto", children: c && E.length === 0 ? /* @__PURE__ */ e("div", { className: "h-32 flex items-center justify-center", children: /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
+      /* @__PURE__ */ e("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
+      /* @__PURE__ */ i("span", { className: "text-sm text-stone", children: [
         "Loading ",
-        c,
+        a,
         "..."
       ] })
-    ] }) }) : v.length === 0 ? /* @__PURE__ */ d("div", { className: "p-6 text-center", children: [
-      /* @__PURE__ */ t("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-sand", children: /* @__PURE__ */ t(le, { className: "h-8 w-8 text-charcoal" }) }),
-      /* @__PURE__ */ t("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: s ? `No ${c} found` : N.length > 0 ? `Already chatting with all ${c}` : `No ${c} yet` }),
-      /* @__PURE__ */ t("p", { className: "text-xs text-stone", children: s ? "Try a different search term" : N.length > 0 ? `You have existing conversations with all your ${c}` : `${c.charAt(0).toUpperCase() + c.slice(1)} will appear here` })
-    ] }) : /* @__PURE__ */ d("ul", { className: "space-y-0", children: [
-      v.map((f) => {
-        const h = f.name || f.email || f.id, b = f.email && f.name ? f.email : f.phone;
-        return /* @__PURE__ */ t("li", { children: /* @__PURE__ */ t(
+    ] }) }) : E.length === 0 ? /* @__PURE__ */ i("div", { className: "p-6 text-center", children: [
+      /* @__PURE__ */ e("div", { className: "mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-sand", children: /* @__PURE__ */ e(ne, { className: "h-8 w-8 text-charcoal" }) }),
+      /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-charcoal mb-2", children: o ? `No ${a} found` : x.length > 0 ? `Already chatting with all ${a}` : `No ${a} yet` }),
+      /* @__PURE__ */ e("p", { className: "text-xs text-stone", children: o ? "Try a different search term" : x.length > 0 ? `You have existing conversations with all your ${a}` : `${a.charAt(0).toUpperCase() + a.slice(1)} will appear here` })
+    ] }) : /* @__PURE__ */ i("ul", { className: "space-y-0", children: [
+      E.map((u) => {
+        const f = u.name || u.email || u.id, N = u.email && u.name ? u.email : u.phone;
+        return /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: () => y(f),
-            onKeyDown: (M) => F(M, f),
+            onClick: () => R(u),
+            onKeyDown: (S) => T(S, u),
             className: "w-full px-4 py-3 hover:bg-sand transition-colors border-b border-sand text-left focus:outline-none focus:ring-2 focus:ring-black",
-            children: /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
-              /* @__PURE__ */ d("div", { className: "flex items-center space-x-3 flex-1 min-w-0", children: [
-                /* @__PURE__ */ t(
-                  ee,
+            children: /* @__PURE__ */ i("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ i("div", { className: "flex items-center space-x-3 flex-1 min-w-0", children: [
+                /* @__PURE__ */ e(
+                  Y,
                   {
-                    id: f.id,
-                    name: h,
-                    image: f.image,
+                    id: u.id,
+                    name: f,
+                    image: u.image,
                     size: 40
                   }
                 ),
-                /* @__PURE__ */ d("div", { className: "flex-1 min-w-0", children: [
-                  /* @__PURE__ */ t("h4", { className: "text-sm font-medium text-charcoal truncate", children: h }),
-                  b && /* @__PURE__ */ t("p", { className: "text-xs text-stone truncate", children: b })
+                /* @__PURE__ */ i("div", { className: "flex-1 min-w-0", children: [
+                  /* @__PURE__ */ e("h4", { className: "text-sm font-medium text-charcoal truncate", children: f }),
+                  N && /* @__PURE__ */ e("p", { className: "text-xs text-stone truncate", children: N })
                 ] })
               ] }),
-              /* @__PURE__ */ t("div", { className: "flex-shrink-0", children: Z === f.id ? /* @__PURE__ */ t(W, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ t(le, { className: "h-5 w-5 text-stone" }) })
+              /* @__PURE__ */ e("div", { className: "flex-shrink-0", children: I === u.id ? /* @__PURE__ */ e(Q, { className: "h-5 w-5 text-primary animate-spin" }) : /* @__PURE__ */ e(ne, { className: "h-5 w-5 text-stone" }) })
             ] })
           }
-        ) }, f.id);
+        ) }, u.id);
       }),
-      i && /* @__PURE__ */ t("li", { className: "p-4 flex justify-center", children: /* @__PURE__ */ d("div", { className: "flex items-center space-x-2", children: [
-        /* @__PURE__ */ t("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
-        /* @__PURE__ */ t("span", { className: "text-sm text-stone", children: "Loading more..." })
+      c && /* @__PURE__ */ e("li", { className: "p-4 flex justify-center", children: /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
+        /* @__PURE__ */ e("div", { className: "w-4 h-4 animate-spin rounded-full border-2 border-primary border-t-transparent" }),
+        /* @__PURE__ */ e("span", { className: "text-sm text-stone", children: "Loading more..." })
       ] }) })
     ] }) })
   ] });
-}, Ye = () => K(), Je = ({ hasChannels: n, onStartConversation: a, participantLabel: l }) => /* @__PURE__ */ t("div", { className: "flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ d("div", { className: "text-center max-w-sm", children: [
-  /* @__PURE__ */ t("div", { className: "w-24 h-24 bg-primary-alt bg-opacity-10 rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ t("span", { className: "text-4xl", children: "💬" }) }),
-  /* @__PURE__ */ t("h2", { className: "font-semibold text-charcoal", children: "Welcome to Messages" }),
-  /* @__PURE__ */ t("p", { className: "text-stone text-sm mb-6", children: n ? /* @__PURE__ */ d(oe, { children: [
+}, Ae = ({ hasChannels: t, onStartConversation: s, participantLabel: n }) => /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-full p-8 text-balance", children: /* @__PURE__ */ i("div", { className: "text-center max-w-sm", children: [
+  /* @__PURE__ */ e("div", { className: "w-24 h-24 bg-primary-alt/10 rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ e("span", { className: "text-4xl", children: "💬" }) }),
+  /* @__PURE__ */ e("h2", { className: "font-semibold text-charcoal", children: "Welcome to Messages" }),
+  /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t ? /* @__PURE__ */ i(se, { children: [
     "Choose a conversation from the list or",
     " ",
-    a && /* @__PURE__ */ d(ce, { onClick: a, children: [
+    s && /* @__PURE__ */ i(re, { onClick: s, children: [
       "start a new conversation with a ",
-      l.slice(0, -1),
+      n.slice(0, -1),
       "."
     ] })
-  ] }) : a && /* @__PURE__ */ d(oe, { children: [
-    /* @__PURE__ */ d(ce, { onClick: a, children: [
+  ] }) : s && /* @__PURE__ */ i(se, { children: [
+    /* @__PURE__ */ i(re, { onClick: s, children: [
       "Start a new conversation with one of your ",
-      l
+      n
     ] }),
     " ",
     "to begin messaging."
   ] }) })
-] }) }), ce = ({ onClick: n, children: a }) => /* @__PURE__ */ t(
+] }) }), re = ({
+  onClick: t,
+  children: s
+}) => /* @__PURE__ */ e(
   "button",
   {
     type: "button",
-    onClick: n,
+    onClick: t,
     className: "inline-flex items-center gap-1 text-sm font-medium text-primary hover:text-primary-alt focus:outline-none focus:ring-2 focus:ring-primary",
-    children: a
+    children: s
   }
-), Ke = ({ className: n, message: a }) => /* @__PURE__ */ d(
+), le = ({ error: t, onRetry: s }) => /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-full p-8", children: /* @__PURE__ */ i("div", { className: "text-center max-w-md", children: [
+  /* @__PURE__ */ e("div", { className: "w-24 h-24 bg-danger-alt rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ e("span", { className: "text-4xl", children: "⚠️" }) }),
+  /* @__PURE__ */ e("h2", { className: "text-xl font-semibold text-charcoal mb-3", children: "Connection Error" }),
+  /* @__PURE__ */ e("p", { className: "text-stone text-sm mb-6", children: t }),
+  s && /* @__PURE__ */ e(
+    "button",
+    {
+      type: "button",
+      onClick: s,
+      className: "inline-flex items-center px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary-alt focus:outline-none focus:ring-2 focus:ring-primary transition-colors",
+      children: "Try Again"
+    }
+  )
+] }) }), Be = ({ className: t, message: s }) => /* @__PURE__ */ i(
   "div",
   {
-    className: L("flex items-center justify-center h-full", n),
+    className: L("flex items-center justify-center h-full", t),
     children: [
-      /* @__PURE__ */ d("svg", { viewBox: "0 0 100 100", className: "size-8 fill-pebble", stroke: "none", children: [
-        /* @__PURE__ */ t("circle", { cx: "6", cy: "50", r: "6", children: /* @__PURE__ */ t(
+      /* @__PURE__ */ i("svg", { viewBox: "0 0 100 100", className: "size-8 fill-pebble", stroke: "none", children: [
+        /* @__PURE__ */ e("circle", { cx: "6", cy: "50", r: "6", children: /* @__PURE__ */ e(
           "animateTransform",
           {
             attributeName: "transform",
@@ -1196,7 +960,7 @@ const qe = ({
             begin: "0.1"
           }
         ) }),
-        /* @__PURE__ */ t("circle", { cx: "30", cy: "50", r: "6", children: /* @__PURE__ */ t(
+        /* @__PURE__ */ e("circle", { cx: "30", cy: "50", r: "6", children: /* @__PURE__ */ e(
           "animateTransform",
           {
             attributeName: "transform",
@@ -1207,7 +971,7 @@ const qe = ({
             begin: "0.2"
           }
         ) }),
-        /* @__PURE__ */ t("circle", { cx: "54", cy: "50", r: "6", children: /* @__PURE__ */ t(
+        /* @__PURE__ */ e("circle", { cx: "54", cy: "50", r: "6", children: /* @__PURE__ */ e(
           "animateTransform",
           {
             attributeName: "transform",
@@ -1219,246 +983,248 @@ const qe = ({
           }
         ) })
       ] }),
-      a && /* @__PURE__ */ t("span", { className: "text-stone", children: a })
+      s && /* @__PURE__ */ e("span", { className: "text-stone", children: s })
     ]
   }
-), e1 = () => /* @__PURE__ */ t("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ d("div", { className: "flex items-center", children: [
-  /* @__PURE__ */ t(Ke, { className: "w-6 h-6" }),
-  /* @__PURE__ */ t("span", { className: "text-sm text-stone", children: "Loading messages" })
-] }) }), ie = ({ error: n, onRetry: a }) => /* @__PURE__ */ t("div", { className: "flex items-center justify-center h-full p-8", children: /* @__PURE__ */ d("div", { className: "text-center max-w-md", children: [
-  /* @__PURE__ */ t("div", { className: "w-24 h-24 bg-danger-alt rounded-full flex items-center justify-center mx-auto mb-6", children: /* @__PURE__ */ t("span", { className: "text-4xl", children: "⚠️" }) }),
-  /* @__PURE__ */ t("h2", { className: "text-xl font-semibold text-charcoal mb-3", children: "Connection Error" }),
-  /* @__PURE__ */ t("p", { className: "text-stone text-sm mb-6", children: n }),
-  a && /* @__PURE__ */ t(
-    "button",
-    {
-      type: "button",
-      onClick: a,
-      className: "inline-flex items-center px-4 py-2 bg-primary text-white rounded-lg hover:bg-primary-alt focus:outline-none focus:ring-2 focus:ring-primary transition-colors",
-      children: "Try Again"
-    }
-  )
-] }) }), o1 = ({
-  capabilities: n = {},
-  customization: a = {},
-  className: l,
-  renderMessageInputActions: o,
-  onChannelSelect: c,
-  onParticipantSelect: m
+), He = () => /* @__PURE__ */ e("div", { className: "flex items-center justify-center h-full", children: /* @__PURE__ */ i("div", { className: "flex items-center", children: [
+  /* @__PURE__ */ e(Be, { className: "w-6 h-6" }),
+  /* @__PURE__ */ e("span", { className: "text-sm text-stone", children: "Loading messages" })
+] }) }), Qe = ({
+  capabilities: t = {},
+  className: s,
+  renderMessageInputActions: n,
+  onChannelSelect: l,
+  onParticipantSelect: a
 }) => {
   const {
-    service: u,
-    client: r,
-    isConnected: s,
-    isLoading: w,
-    error: N,
-    refreshConnection: g,
-    debug: i
-  } = Ye(), [C, x] = A(null), [p, Z] = A(!1), [V, R] = A(!1), [v, y] = A(/* @__PURE__ */ new Set()), [F, f] = A(0), h = $(null), {
-    showStartConversation: b = !1,
-    participantSource: M,
-    participantLabel: U = "participants"
-  } = n, k = $(null), P = H(async () => {
-    if (!r || !s) return;
-    const E = r.userID;
-    if (E)
+    service: m,
+    client: d,
+    isConnected: r,
+    isLoading: o,
+    error: b,
+    refreshConnection: x,
+    debug: g
+  } = Pe(), [c, C] = w(null), [v, y] = w(!1), [I, P] = w(!1), [p, E] = w(/* @__PURE__ */ new Set()), [R, T] = w(0), u = A(null), {
+    showStartConversation: f = !1,
+    participantSource: N,
+    participantLabel: S = "participants"
+  } = t, j = A(null), F = U(async () => {
+    if (!d || !r) return;
+    const h = d.userID;
+    if (h)
       try {
-        i && console.log("[MessagingShell] Syncing channels for user:", E);
-        const O = await r.queryChannels(
+        g && console.log("[MessagingShell] Syncing channels for user:", h);
+        const O = await d.queryChannels(
           {
             type: "messaging",
-            members: { $in: [E] }
+            members: { $in: [h] }
           },
           {},
           { limit: 100 }
-        ), j = /* @__PURE__ */ new Set();
-        O.forEach((te) => {
-          const Ne = te.state.members || {};
-          Object.values(Ne).forEach((Ce) => {
-            var se;
-            const ae = (se = Ce.user) == null ? void 0 : se.id;
-            ae && ae !== E && j.add(ae);
+        ), M = /* @__PURE__ */ new Set();
+        O.forEach((J) => {
+          const ce = J.state.members;
+          Object.values(ce).forEach((de) => {
+            var ee;
+            const K = (ee = de.user) == null ? void 0 : ee.id;
+            K && K !== h && M.add(K);
           });
-        }), y(j), Z(O.length > 0), k.current = E, i && console.log("[MessagingShell] Channels synced successfully:", {
+        }), E(M), y(O.length > 0), j.current = h, g && console.log("[MessagingShell] Channels synced successfully:", {
           channelCount: O.length,
-          memberCount: j.size
+          memberCount: M.size
         });
       } catch (O) {
         console.error("[MessagingShell] Failed to sync channels:", O);
       }
-  }, [r, s, i]);
+  }, [d, r, g]);
   B(() => {
-    if (!r || !s) return;
-    const E = r.userID;
-    E && k.current !== E && P();
-  }, [r, s, P]);
-  const X = H((E) => {
-    x(E), c == null || c(E);
-  }, [c]), Q = H(() => {
-    x(null);
-  }, []), z = H(() => {
-    var E;
-    M && (f((O) => O + 1), R(!0), (E = h.current) == null || E.showModal());
-  }, [M]), q = H(async (E) => {
-    var O;
-    if (u)
-      try {
-        i && console.log("[MessagingShell] Starting conversation with:", E.id);
-        const j = await u.startChannelWithFollower({
-          id: E.id,
-          name: E.name,
-          email: E.email,
-          phone: E.phone
-        });
+    if (!d || !r) return;
+    const h = d.userID;
+    h && j.current !== h && F();
+  }, [d, r, F]);
+  const H = U(
+    (h) => {
+      C(h), l == null || l(h);
+    },
+    [l]
+  ), V = U(() => {
+    C(null);
+  }, []), _ = U(() => {
+    var h;
+    N && (T((O) => O + 1), P(!0), (h = u.current) == null || h.showModal());
+  }, [N]), W = U(
+    async (h) => {
+      var O;
+      if (m)
         try {
-          await j.show();
-        } catch (te) {
-          console.warn("[MessagingShell] Failed to unhide channel:", te);
+          g && console.log(
+            "[MessagingShell] Starting conversation with:",
+            h.id
+          );
+          const M = await m.startChannelWithFollower({
+            id: h.id,
+            name: h.name,
+            email: h.email,
+            phone: h.phone
+          });
+          try {
+            await M.show();
+          } catch (J) {
+            console.warn("[MessagingShell] Failed to unhide channel:", J);
+          }
+          C(M), P(!1), (O = u.current) == null || O.close(), a == null || a(h);
+        } catch (M) {
+          console.error("[MessagingShell] Failed to start conversation:", M);
         }
-        x(j), R(!1), (O = h.current) == null || O.close(), m == null || m(E);
-      } catch (j) {
-        console.error("[MessagingShell] Failed to start conversation:", j);
-      }
-  }, [u, m, i]), G = H(() => {
-    var E;
-    R(!1), (E = h.current) == null || E.close();
-  }, []), I = H(async (E) => {
-    i && console.log("[MessagingShell] Leaving conversation:", E.id), x(null), k.current = null, await P();
-  }, [P, i]), S = H(async (E) => {
-    i && console.log("[MessagingShell] Blocking participant:", E), x(null), k.current = null, await P();
-  }, [P, i]), T = !!C;
-  return w ? /* @__PURE__ */ t("div", { className: L("h-full", l), children: /* @__PURE__ */ t(e1, {}) }) : N ? /* @__PURE__ */ t("div", { className: L("h-full", l), children: /* @__PURE__ */ t(ie, { error: N, onRetry: g }) }) : !s || !r ? /* @__PURE__ */ t("div", { className: L("h-full", l), children: /* @__PURE__ */ t(
-    ie,
+    },
+    [m, a, g]
+  ), G = U(() => {
+    var h;
+    P(!1), (h = u.current) == null || h.close();
+  }, []), z = U(
+    async (h) => {
+      g && console.log("[MessagingShell] Leaving conversation:", h.id), C(null), j.current = null, await F();
+    },
+    [F, g]
+  ), k = U(
+    async (h) => {
+      g && console.log("[MessagingShell] Blocking participant:", h), C(null), j.current = null, await F();
+    },
+    [F, g]
+  ), D = !!c;
+  return o ? /* @__PURE__ */ e("div", { className: L("h-full", s), children: /* @__PURE__ */ e(He, {}) }) : b ? /* @__PURE__ */ e("div", { className: L("h-full", s), children: /* @__PURE__ */ e(le, { error: b, onRetry: x }) }) : !r || !d ? /* @__PURE__ */ e("div", { className: L("h-full", s), children: /* @__PURE__ */ e(
+    le,
     {
       error: "Not connected to messaging service",
-      onRetry: g
+      onRetry: x
     }
-  ) }) : /* @__PURE__ */ d("div", { className: L("h-full bg-white overflow-hidden", l), children: [
-    /* @__PURE__ */ d("div", { className: "flex h-full min-h-0", children: [
-      /* @__PURE__ */ t(
+  ) }) : /* @__PURE__ */ i("div", { className: L("h-full bg-white overflow-hidden", s), children: [
+    /* @__PURE__ */ i("div", { className: "flex h-full min-h-0", children: [
+      /* @__PURE__ */ e(
         "div",
         {
           className: L(
             "min-h-0 min-w-0 bg-white lg:bg-chalk lg:flex lg:flex-col lg:border-r lg:border-sand",
             {
-              "hidden lg:flex lg:w-80 lg:min-w-[280px] lg:max-w-[360px]": T,
-              "flex flex-col w-full lg:flex-1 lg:max-w-2xl": !T
+              "hidden lg:flex lg:w-80 lg:min-w-[280px] lg:max-w-[360px]": D,
+              "flex flex-col w-full lg:flex-1 lg:max-w-2xl": !D
             }
           ),
-          children: /* @__PURE__ */ t(
-            ke,
+          children: /* @__PURE__ */ e(
+            pe,
             {
-              onChannelSelect: X,
-              selectedChannel: C || void 0,
-              showStartConversation: b && !!M,
-              onStartConversation: z,
-              participantLabel: U
+              onChannelSelect: H,
+              selectedChannel: c || void 0,
+              showStartConversation: f && !!N,
+              onStartConversation: _,
+              participantLabel: S
             }
           )
         }
       ),
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ e(
         "div",
         {
           className: L("flex-1 flex-col min-w-0 min-h-0", {
-            "hidden lg:flex": !T,
-            flex: T
+            "hidden lg:flex": !D,
+            flex: D
           }),
-          children: C ? /* @__PURE__ */ t("div", { className: "flex-1 min-h-0 flex flex-col", children: /* @__PURE__ */ t(
-            ze,
+          children: c ? /* @__PURE__ */ e("div", { className: "flex-1 min-h-0 flex flex-col", children: /* @__PURE__ */ e(
+            Fe,
             {
-              channel: C,
-              onBack: Q,
+              channel: c,
+              onBack: V,
               showBackButton: !0,
-              renderMessageInputActions: o,
-              onLeaveConversation: I,
-              onBlockParticipant: S
+              renderMessageInputActions: n,
+              onLeaveConversation: z,
+              onBlockParticipant: k
             },
-            C.id
-          ) }) : /* @__PURE__ */ t(
-            Je,
+            c.id
+          ) }) : /* @__PURE__ */ e(
+            Ae,
             {
-              hasChannels: p,
-              onStartConversation: b ? z : void 0,
-              participantLabel: U
+              hasChannels: v,
+              onStartConversation: f ? _ : void 0,
+              participantLabel: S
             }
           )
         }
       )
     ] }),
-    M && /* @__PURE__ */ t(
+    N && // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-noninteractive-element-interactions
+    /* @__PURE__ */ e(
       "dialog",
       {
-        ref: h,
+        ref: u,
         className: "mes-dialog",
-        onClick: (E) => {
-          E.target === h.current && G();
+        onClick: (h) => {
+          h.target === u.current && G();
         },
         onClose: G,
-        children: /* @__PURE__ */ t("div", { className: "h-full w-full bg-white shadow-max-elevation-light", children: /* @__PURE__ */ t(
-          qe,
+        children: /* @__PURE__ */ e("div", { className: "h-full w-full bg-white shadow-max-elevation-light", children: /* @__PURE__ */ e(
+          je,
           {
-            participantSource: M,
-            onSelectParticipant: q,
+            participantSource: N,
+            onSelectParticipant: W,
             onClose: G,
-            existingParticipantIds: v,
-            participantLabel: U,
-            searchPlaceholder: `Search ${U}...`
+            existingParticipantIds: p,
+            participantLabel: S,
+            searchPlaceholder: `Search ${S}...`
           },
-          F
+          R
         ) })
       }
     )
   ] });
-}, c1 = (n, a = {}) => {
-  const { initialSearch: l = "", pageSize: o = 20 } = a, [c, m] = A([]), [u, r] = A(!1), [s, w] = A(null), [N, g] = A(l), [i, C] = A(!0), [x, p] = A(), Z = H(async (y = !1, F) => {
-    if (u) return;
-    const f = F !== void 0 ? F : N;
-    r(!0), w(null);
+}, Ze = (t, s = {}) => {
+  const { initialSearch: n = "", pageSize: l = 20 } = s, [a, m] = w([]), [d, r] = w(!1), [o, b] = w(null), [x, g] = w(n), [c, C] = w(!0), [v, y] = w(), I = U(async (R = !1, T) => {
+    if (d) return;
+    const u = T !== void 0 ? T : x;
+    r(!0), b(null);
     try {
-      const h = await n.loadParticipants({
-        search: f || void 0,
-        limit: o,
-        cursor: y ? void 0 : x
+      const f = await t.loadParticipants({
+        search: u || void 0,
+        limit: l,
+        cursor: R ? void 0 : v
       });
       m(
-        (b) => y ? h.participants : [...b, ...h.participants]
-      ), C(h.hasMore), p(h.nextCursor);
-    } catch (h) {
-      const b = h instanceof Error ? h.message : "Failed to load participants";
-      w(b), console.error("[useParticipants] Load error:", h);
+        (N) => R ? f.participants : [...N, ...f.participants]
+      ), C(f.hasMore), y(f.nextCursor);
+    } catch (f) {
+      const N = f instanceof Error ? f.message : "Failed to load participants";
+      b(N), console.error("[useParticipants] Load error:", f);
     } finally {
       r(!1);
     }
-  }, [n, N, x, o, u]), V = H(() => {
-    i && !u && Z(!1);
-  }, [i, u, Z]), R = H((y) => {
-    g(y), p(void 0), Z(!0, y);
-  }, [Z]), v = H(() => {
-    p(void 0), Z(!0);
-  }, [Z]);
+  }, [t, x, v, l, d]), P = U(() => {
+    c && !d && I(!1);
+  }, [c, d, I]), p = U((R) => {
+    g(R), y(void 0), I(!0, R);
+  }, [I]), E = U(() => {
+    y(void 0), I(!0);
+  }, [I]);
   return B(() => {
-    Z(!0);
-  }, [n.loadParticipants]), {
-    participants: c,
-    loading: u,
-    error: s,
-    searchQuery: N,
-    hasMore: i,
-    totalCount: n.totalCount,
-    loadMore: V,
-    search: R,
-    refresh: v
+    I(!0);
+  }, [t.loadParticipants]), {
+    participants: a,
+    loading: d,
+    error: o,
+    searchQuery: x,
+    hasMore: c,
+    totalCount: t.totalCount,
+    loadMore: P,
+    search: p,
+    refresh: E
   };
 };
 export {
-  ee as Avatar,
-  ke as ChannelList,
-  ze as ChannelView,
-  s1 as MessagingProvider,
-  o1 as MessagingShell,
-  qe as ParticipantPicker,
-  Ye as useMessaging,
-  c1 as useParticipants
+  Y as Avatar,
+  pe as ChannelList,
+  Fe as ChannelView,
+  Xe as MessagingProvider,
+  Qe as MessagingShell,
+  je as ParticipantPicker,
+  Pe as useMessaging,
+  Ze as useParticipants
 };
 //# sourceMappingURL=index.js.map