@nivaro/react 0.3.40 → 0.3.42

package/dist/shared/components/chat/RoomParts.js

@@ -1,23 +1,24 @@
-import { jsxs as r, jsx as e, Fragment as _ } from "react/jsx-runtime";
-import { Users as P, Link2 as B, ChevronLeft as R, Sparkles as F, Pin as E, X as G, FileText as H, ExternalLink as Q } from "lucide-react";
-import { useState as g, useRef as V, useEffect as Y } from "react";
-import { useNivaroClient as q } from "../../context.js";
-import { safeLinkKind as C } from "../../lib/safe-href.js";
-import { cn as m, formatFileSize as J, formatRelative as D } from "../../lib/utils.js";
-import { Popover as K, PopoverTrigger as X, PopoverContent as Z } from "../ui/popover.js";
-import { openDmWith as A, useChatThread as ee, canOpenDm as te } from "./chat-core.js";
-import { useRoomInfo as I, useRoomSummary as U, useRoomShared as ae } from "./chat-hooks.js";
-function xe({
-  room: i,
+import { jsxs as r, jsx as e, Fragment as $ } from "react/jsx-runtime";
+import { Users as U, Link2 as J, ChevronLeft as Q, Sparkles as W, Pin as K, X, FileText as Z, ExternalLink as A } from "lucide-react";
+import { useState as f, useRef as ee, useEffect as te } from "react";
+import { useNivaroClient as ae } from "../../context.js";
+import { safeLinkKind as T } from "../../lib/safe-href.js";
+import { cn as m, formatFileSize as re, formatRelative as F } from "../../lib/utils.js";
+import { Popover as le, PopoverTrigger as se, PopoverContent as ne } from "../ui/popover.js";
+import { openDmWith as de, useChatThread as ie, useDebouncedMemberQuery as ce, usePagedMembers as oe, canOpenDm as me } from "./chat-core.js";
+import { useRoomInfo as B, useRoomSummary as j, useRoomShared as xe } from "./chat-hooks.js";
+import { MemberSearchBox as he, memberCountLabel as pe, MemberOnlineDot as ue, MemberLoadMore as be } from "./MemberPaging.js";
+function $e({
+  room: d,
   rootId: l,
   th: n,
-  onClose: d,
+  onClose: c,
   renderRow: o,
   renderComposer: x,
   renderOutbox: s
 }) {
-  const { root: u, replies: h, loading: y } = ee(i, l), a = U(), [c, k] = g(null), b = V(null);
-  return Y(() => {
+  const { root: u, replies: h, loading: v } = ie(d, l), a = j(), [i, k] = f(null), b = ee(null);
+  return te(() => {
     var p;
     (p = b.current) == null || p.scrollIntoView({ block: "end" });
   }, [h.length]), /* @__PURE__ */ r(
@@ -31,10 +32,10 @@ function xe({
             "button",
             {
               type: "button",
-              onClick: d,
+              onClick: c,
               className: "rounded-md p-1 text-slate-400 hover:bg-slate-100 hover:text-slate-600 dark:hover:bg-white/10 dark:hover:text-slate-100",
               "aria-label": "Back to the conversation",
-              children: /* @__PURE__ */ e(R, { className: "h-4 w-4", strokeWidth: 2 })
+              children: /* @__PURE__ */ e(Q, { className: "h-4 w-4", strokeWidth: 2 })
             }
           ),
           /* @__PURE__ */ r("p", { className: "flex-1 text-[13px] font-semibold text-slate-800 dark:text-slate-100", children: [
@@ -51,7 +52,7 @@ function xe({
               type: "button",
               disabled: a.isPending,
               onClick: () => a.mutate(
-                { room: i, thread: l },
+                { room: d, thread: l },
                 { onSuccess: (p) => k(p.summary ?? "Not enough to summarize yet.") }
               ),
               className: m(
@@ -60,24 +61,24 @@ function xe({
               ),
               "data-chat-thread-summarize": !0,
               children: [
-                /* @__PURE__ */ e(F, { className: "h-3.5 w-3.5" }),
+                /* @__PURE__ */ e(W, { className: "h-3.5 w-3.5" }),
                 a.isPending ? "Summarizing…" : "Summarize"
               ]
             }
           )
         ] }),
-        c && /* @__PURE__ */ e(
+        i && /* @__PURE__ */ e(
           "div",
           {
             className: m(
               "shrink-0 border-b px-3 py-2 text-[11.5px] leading-snug text-slate-700 dark:text-slate-200",
               n.divider
             ),
-            children: c
+            children: i
           }
         ),
         /* @__PURE__ */ r("div", { className: "min-h-0 flex-1 space-y-2.5 overflow-y-auto px-3 py-3", children: [
-          y ? /* @__PURE__ */ e("p", { className: "py-6 text-center text-[12px] text-slate-500", children: "Loading…" }) : /* @__PURE__ */ r(_, { children: [
+          v ? /* @__PURE__ */ e("p", { className: "py-6 text-center text-[12px] text-slate-500", children: "Loading…" }) : /* @__PURE__ */ r($, { children: [
             u && /* @__PURE__ */ e("div", { className: m("border-b pb-2.5", n.divider), children: o(u, { inThread: !0 }) }),
             h.map((p) => /* @__PURE__ */ e("div", { children: o(p, { inThread: !0 }) }, p.id)),
             s(l)
@@ -89,26 +90,26 @@ function xe({
     }
   );
 }
-function he({
-  description: i,
+function Le({
+  description: d,
   links: l,
   th: n,
-  navigate: d
+  navigate: c
 }) {
-  const [o, x] = g(!1);
-  return !i && !(l != null && l.length) ? null : /* @__PURE__ */ r("div", { className: m("shrink-0 border-b px-3 py-1.5", n.divider), "data-chat-channel-intro": !0, children: [
+  const [o, x] = f(!1);
+  return !d && !(l != null && l.length) ? null : /* @__PURE__ */ r("div", { className: m("shrink-0 border-b px-3 py-1.5", n.divider), "data-chat-channel-intro": !0, children: [
     /* @__PURE__ */ r("div", { className: "flex items-start gap-2", children: [
-      i && /* @__PURE__ */ e(
+      d && /* @__PURE__ */ e(
         "p",
         {
           className: m(
             "min-w-0 flex-1 text-[11.5px] leading-snug text-slate-600 dark:text-slate-300",
             !o && "line-clamp-1"
           ),
-          children: i
+          children: d
         }
       ),
-      i && i.length > 80 && /* @__PURE__ */ e(
+      d && d.length > 80 && /* @__PURE__ */ e(
         "button",
         {
           type: "button",
@@ -118,19 +119,19 @@ function he({
         }
       )
     ] }),
-    !!(l != null && l.length) && /* @__PURE__ */ e("div", { className: "mt-1 flex flex-wrap gap-1.5", children: l.filter((s) => C(s.url) !== null).map((s) => /* @__PURE__ */ r(
+    !!(l != null && l.length) && /* @__PURE__ */ e("div", { className: "mt-1 flex flex-wrap gap-1.5", children: l.filter((s) => T(s.url) !== null).map((s) => /* @__PURE__ */ r(
       "a",
       {
         href: s.url,
-        target: C(s.url) === "internal" ? void 0 : "_blank",
+        target: T(s.url) === "internal" ? void 0 : "_blank",
         rel: "noopener noreferrer",
         onClick: (u) => {
-          C(s.url) === "internal" && d && (u.preventDefault(), d(s.url));
+          T(s.url) === "internal" && c && (u.preventDefault(), c(s.url));
         },
         className: "inline-flex max-w-[200px] items-center gap-1 rounded-full border border-slate-200 bg-white px-2 py-0.5 text-[11px] text-slate-700 hover:border-slate-300 dark:border-border dark:bg-card dark:text-slate-200",
         "data-chat-channel-link": !0,
         children: [
-          /* @__PURE__ */ e(B, { className: "h-3 w-3 shrink-0 opacity-60" }),
+          /* @__PURE__ */ e(J, { className: "h-3 w-3 shrink-0 opacity-60" }),
           /* @__PURE__ */ e("span", { className: "truncate", children: s.label })
         ]
       },
@@ -138,18 +139,18 @@ function he({
     )) })
   ] });
 }
-function pe({
-  note: i,
+function Me({
+  note: d,
   channelName: l,
   onDismiss: n,
-  th: d
+  th: c
 }) {
   return /* @__PURE__ */ e(
     "div",
     {
       className: m(
         "mx-3 mt-3 rounded-xl border px-3 py-2.5",
-        d.divider,
+        c.divider,
         "bg-slate-50 dark:bg-muted/40"
       ),
       "data-chat-welcome": !0,
@@ -159,7 +160,7 @@ function pe({
             "Welcome to ",
             l
           ] }),
-          /* @__PURE__ */ e("p", { className: "mt-0.5 whitespace-pre-wrap text-[11.5px] leading-snug text-slate-600 dark:text-slate-300", children: i })
+          /* @__PURE__ */ e("p", { className: "mt-0.5 whitespace-pre-wrap text-[11.5px] leading-snug text-slate-600 dark:text-slate-300", children: d })
         ] }),
         /* @__PURE__ */ e(
           "button",
@@ -175,12 +176,12 @@ function pe({
     }
   );
 }
-function ue({
-  onJump: i,
+function ze({
+  onJump: d,
   onDone: l
 }) {
-  const [n, d] = g("");
-  return /* @__PURE__ */ r(_, { children: [
+  const [n, c] = f("");
+  return /* @__PURE__ */ r($, { children: [
     /* @__PURE__ */ e("p", { className: "pb-1.5 text-[12px] font-semibold text-slate-800 dark:text-slate-100", children: "Jump to a date" }),
     /* @__PURE__ */ e(
       "input",
@@ -188,7 +189,7 @@ function ue({
         type: "date",
         value: n,
         max: (/* @__PURE__ */ new Date()).toISOString().slice(0, 10),
-        onChange: (o) => d(o.target.value),
+        onChange: (o) => c(o.target.value),
         className: "h-8 w-full rounded-md border border-slate-200 bg-white px-2 text-[12px] outline-none dark:border-border dark:bg-background dark:text-slate-100",
         "aria-label": "Date"
       }
@@ -203,7 +204,7 @@ function ue({
         type: "button",
         onClick: () => {
           const s = new Date(Date.now() - x * 864e5);
-          s.setHours(0, 0, 0, 0), i(s.toISOString()), l == null || l();
+          s.setHours(0, 0, 0, 0), d(s.toISOString()), l == null || l();
         },
         className: "flex-1 rounded-md border border-slate-200 px-1 py-1 text-[10.5px] text-slate-600 hover:bg-muted dark:border-border dark:text-slate-300",
         children: o
@@ -217,7 +218,7 @@ function ue({
         disabled: !n,
         onClick: () => {
           const [o, x, s] = n.split("-").map(Number);
-          i(new Date(o, x - 1, s).toISOString()), l == null || l();
+          d(new Date(o, x - 1, s).toISOString()), l == null || l();
         },
         className: "mt-2 h-8 w-full rounded-md bg-nvr-cyan text-[12px] font-medium text-white disabled:opacity-40",
         children: "Go"
@@ -225,20 +226,25 @@ function ue({
     )
   ] });
 }
-function be({
-  room: i,
+function Te({
+  room: d,
   label: l,
   th: n,
-  pins: d,
+  pins: c,
   onClose: o,
   onOpenMessage: x,
   renderAvatar: s,
   onUnpin: u,
   navigate: h
 }) {
-  const y = q(), a = I(i), [c, k] = g("members"), b = ae(i, c === "files" || c === "links"), [p, M] = g(""), w = p.trim().toLowerCase(), $ = w ? b.files.filter((t) => `${t.name} ${t.sender_name ?? ""}`.toLowerCase().includes(w)) : b.files, L = w ? b.links.filter((t) => `${t.url} ${t.sender_name ?? ""}`.toLowerCase().includes(w)) : b.links, v = U(), [S, W] = g(""), [z, T] = g(null), j = [
+  const v = ae(), a = B(d), [i, k] = f("members"), b = xe(d, i === "files" || i === "links"), [p, q] = f(""), S = p.trim().toLowerCase(), O = S ? b.files.filter((t) => `${t.name} ${t.sender_name ?? ""}`.toLowerCase().includes(S)) : b.files, P = S ? b.links.filter((t) => `${t.url} ${t.sender_name ?? ""}`.toLowerCase().includes(S)) : b.links, [L, E] = f(""), G = ce(L, 250), _ = L.trim().toLowerCase(), w = !!a && a.members.length >= a.member_count, y = oe(
+    d,
+    `/chat/rooms/${encodeURIComponent(d)}/members`,
+    G,
+    i === "members" && !!a && !w
+  ), M = w ? _ ? a.members.filter((t) => t.name.toLowerCase().includes(_.replace(/^@/, ""))) : a.members : y.members, H = w ? M.length : y.total, C = j(), [z, V] = f(""), [D, R] = f(null), Y = [
     ["members", `Members${a ? ` · ${a.member_count}` : ""}`],
-    ["pinned", `Pinned${d.length ? ` · ${d.length}` : ""}`],
+    ["pinned", `Pinned${c.length ? ` · ${c.length}` : ""}`],
     ["files", `Files${a != null && a.file_count ? ` · ${a.file_count}` : ""}`],
     ["links", "Links"]
   ];
@@ -256,7 +262,7 @@ function be({
               onClick: o,
               className: "rounded-md p-1 text-slate-400 hover:bg-slate-100 hover:text-slate-600 dark:hover:bg-white/10 dark:hover:text-slate-100",
               "aria-label": "Back to the conversation",
-              children: /* @__PURE__ */ e(R, { className: "h-4 w-4", strokeWidth: 2 })
+              children: /* @__PURE__ */ e(Q, { className: "h-4 w-4", strokeWidth: 2 })
             }
           ),
           /* @__PURE__ */ e("p", { className: "min-w-0 flex-1 truncate text-[13px] font-semibold text-slate-800 dark:text-slate-100", children: l })
@@ -302,15 +308,15 @@ function be({
                 "button",
                 {
                   type: "button",
-                  disabled: v.isPending,
-                  onClick: () => v.mutate(
+                  disabled: C.isPending,
+                  onClick: () => C.mutate(
                     {
-                      room: i,
+                      room: d,
                       since: new Date(Date.now() - N * 864e5).toISOString()
                     },
                     {
-                      onSuccess: (f) => T(
-                        f.summary ?? `Only ${f.count} messages — nothing to summarize.`
+                      onSuccess: (g) => R(
+                        g.summary ?? `Only ${g.count} messages — nothing to summarize.`
                       )
                     }
                   ),
@@ -323,8 +329,8 @@ function be({
                 "input",
                 {
                   type: "date",
-                  value: S,
-                  onChange: (t) => W(t.target.value),
+                  value: z,
+                  onChange: (t) => V(t.target.value),
                   className: "h-6 rounded-md border border-slate-200 bg-white px-1.5 text-[11px] outline-none dark:border-border dark:bg-background dark:text-slate-100",
                   "aria-label": "Summarize since"
                 }
@@ -333,14 +339,14 @@ function be({
                 "button",
                 {
                   type: "button",
-                  disabled: !S || v.isPending,
+                  disabled: !z || C.isPending,
                   onClick: () => {
-                    const [t, N, f] = S.split("-").map(Number);
-                    v.mutate(
-                      { room: i, since: new Date(t, N - 1, f).toISOString() },
+                    const [t, N, g] = z.split("-").map(Number);
+                    C.mutate(
+                      { room: d, since: new Date(t, N - 1, g).toISOString() },
                       {
-                        onSuccess: (O) => T(
-                          O.summary ?? `Only ${O.count} messages — nothing to summarize.`
+                        onSuccess: (I) => R(
+                          I.summary ?? `Only ${I.count} messages — nothing to summarize.`
                         )
                       }
                     );
@@ -350,25 +356,25 @@ function be({
                     n.accentText
                   ),
                   children: [
-                    /* @__PURE__ */ e(F, { className: "h-3 w-3" }),
+                    /* @__PURE__ */ e(W, { className: "h-3 w-3" }),
                     " ",
-                    v.isPending ? "Summarizing…" : "Since then"
+                    C.isPending ? "Summarizing…" : "Since then"
                   ]
                 }
               )
             ] }),
-            z && /* @__PURE__ */ e("p", { className: "mt-2 text-[11.5px] leading-snug text-slate-700 dark:text-slate-200", children: z })
+            D && /* @__PURE__ */ e("p", { className: "mt-2 text-[11.5px] leading-snug text-slate-700 dark:text-slate-200", children: D })
           ] }),
-          /* @__PURE__ */ e("div", { className: m("flex gap-1 border-b px-2 pt-1.5", n.divider), role: "tablist", children: j.map(([t, N]) => /* @__PURE__ */ e(
+          /* @__PURE__ */ e("div", { className: m("flex gap-1 border-b px-2 pt-1.5", n.divider), role: "tablist", children: Y.map(([t, N]) => /* @__PURE__ */ e(
             "button",
             {
               type: "button",
               role: "tab",
-              "aria-selected": c === t,
+              "aria-selected": i === t,
               onClick: () => k(t),
               className: m(
                 "-mb-px border-b-2 px-2 pb-1.5 text-[11.5px] font-medium",
-                c === t ? "border-slate-800 text-slate-800 dark:border-slate-100 dark:text-slate-100" : "border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400"
+                i === t ? "border-slate-800 text-slate-800 dark:border-slate-100 dark:text-slate-100" : "border-transparent text-slate-500 hover:text-slate-700 dark:text-slate-400"
               ),
               "data-chat-info-tab": t,
               children: N
@@ -376,16 +382,40 @@ function be({
             t
           )) }),
           /* @__PURE__ */ r("div", { className: "px-3 py-2", children: [
-            c === "members" && (a != null && a.members.length ? /* @__PURE__ */ e("ul", { className: "space-y-1", children: a.members.map((t) => /* @__PURE__ */ r("li", { className: "flex items-center gap-2 py-0.5", children: [
-              s(t.id, t.name),
-              /* @__PURE__ */ r("span", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ e("span", { className: "block truncate text-[12px] text-slate-800 dark:text-slate-100", children: t.name }),
-                t.title && /* @__PURE__ */ e("span", { className: "block truncate text-[10.5px] text-slate-500", children: t.title })
+            i === "members" && /* @__PURE__ */ r($, { children: [
+              a && a.member_count > 10 && /* @__PURE__ */ r("div", { className: "mb-2 space-y-1", children: [
+                /* @__PURE__ */ e(he, { value: L, onChange: E }),
+                /* @__PURE__ */ e(
+                  "p",
+                  {
+                    className: "text-[10.5px] tabular-nums text-slate-500 dark:text-slate-400",
+                    "data-chat-member-count": !0,
+                    children: pe(H, !!_)
+                  }
+                )
               ] }),
-              t.online && /* @__PURE__ */ e("span", { className: "text-[10.5px] text-emerald-700 dark:text-emerald-400", children: "Online" })
-            ] }, t.id)) }) : /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: a ? "Anyone who can open this room can read it." : "Loading…" })),
-            c === "pinned" && (d.length ? /* @__PURE__ */ e("ul", { className: "space-y-1.5", children: d.map((t) => /* @__PURE__ */ r("li", { className: "flex items-start gap-1.5 text-[11.5px]", children: [
-              /* @__PURE__ */ e(E, { className: "mt-0.5 h-3 w-3 shrink-0 text-slate-400" }),
+              M.length ? /* @__PURE__ */ e("ul", { className: "space-y-1", children: M.map((t) => /* @__PURE__ */ r("li", { className: "flex items-center gap-2 py-0.5", children: [
+                s(t.id, t.name),
+                /* @__PURE__ */ r("span", { className: "min-w-0 flex-1", children: [
+                  /* @__PURE__ */ e("span", { className: "block truncate text-[12px] text-slate-800 dark:text-slate-100", children: t.name }),
+                  t.title && /* @__PURE__ */ e("span", { className: "block truncate text-[10.5px] text-slate-500", children: t.title })
+                ] }),
+                t.online && /* @__PURE__ */ r("span", { className: "flex items-center gap-1 text-[10.5px] text-emerald-700 dark:text-emerald-400", children: [
+                  /* @__PURE__ */ e(ue, { online: !0 }),
+                  "Online"
+                ] })
+              ] }, t.id)) }) : /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: !a || !w && y.loading ? "Loading…" : _ ? "No one matches." : "Anyone who can open this room can read it." }),
+              !w && /* @__PURE__ */ e(
+                be,
+                {
+                  hasMore: y.hasMore,
+                  loading: y.loadingMore,
+                  onLoad: y.loadMore
+                }
+              )
+            ] }),
+            i === "pinned" && (c.length ? /* @__PURE__ */ e("ul", { className: "space-y-1.5", children: c.map((t) => /* @__PURE__ */ r("li", { className: "flex items-start gap-1.5 text-[11.5px]", children: [
+              /* @__PURE__ */ e(K, { className: "mt-0.5 h-3 w-3 shrink-0 text-slate-400" }),
               /* @__PURE__ */ r(
                 "button",
                 {
@@ -408,31 +438,31 @@ function be({
                   onClick: () => u(t.id),
                   className: "shrink-0 text-slate-400 hover:text-red-500",
                   "aria-label": "Unpin",
-                  children: /* @__PURE__ */ e(G, { className: "h-3 w-3" })
+                  children: /* @__PURE__ */ e(X, { className: "h-3 w-3" })
                 }
               )
             ] }, t.pin_id)) }) : /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: "Nothing pinned. Hover a message and use the pin to keep it here." })),
-            (c === "files" || c === "links") && /* @__PURE__ */ e(
+            (i === "files" || i === "links") && /* @__PURE__ */ e(
               "input",
               {
                 value: p,
-                onChange: (t) => M(t.target.value),
-                placeholder: c === "files" ? "Search files or people" : "Search links or people",
+                onChange: (t) => q(t.target.value),
+                placeholder: i === "files" ? "Search files or people" : "Search links or people",
                 "aria-label": "Search shared items",
                 "data-chat-shared-search": !0,
                 className: "mb-2 h-7 w-full rounded-md border border-slate-200 bg-transparent px-2 text-[11.5px] outline-none focus:border-slate-400 dark:border-slate-700"
               }
             ),
-            c === "files" && (b.loading ? /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: "Loading…" }) : $.length ? /* @__PURE__ */ e("ul", { className: "space-y-1", children: $.map((t) => /* @__PURE__ */ r(
+            i === "files" && (b.loading ? /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: "Loading…" }) : O.length ? /* @__PURE__ */ e("ul", { className: "space-y-1", children: O.map((t) => /* @__PURE__ */ r(
               "li",
               {
                 className: "flex items-center gap-2 text-[11.5px]",
                 children: [
-                  /* @__PURE__ */ e(H, { className: "h-3.5 w-3.5 shrink-0 text-slate-400" }),
+                  /* @__PURE__ */ e(Z, { className: "h-3.5 w-3.5 shrink-0 text-slate-400" }),
                   /* @__PURE__ */ e(
                     "a",
                     {
-                      href: y.fileUrl(t.file_id),
+                      href: v.fileUrl(t.file_id),
                       target: "_blank",
                       rel: "noopener noreferrer",
                       className: "min-w-0 flex-1 truncate text-slate-800 hover:underline dark:text-slate-100",
@@ -441,8 +471,8 @@ function be({
                   ),
                   /* @__PURE__ */ r("span", { className: "shrink-0 text-[10.5px] text-slate-500", children: [
                     t.sender_name ? `${t.sender_name} · ` : "",
-                    t.size != null ? `${J(t.size)} · ` : "",
-                    D(t.date_created)
+                    t.size != null ? `${re(t.size)} · ` : "",
+                    F(t.date_created)
                   ] }),
                   /* @__PURE__ */ e(
                     "button",
@@ -457,12 +487,12 @@ function be({
               },
               `${t.message_id}:${t.file_id}`
             )) }) : /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: "No files shared here yet." })),
-            c === "links" && (b.loading ? /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: "Loading…" }) : L.length ? /* @__PURE__ */ e("ul", { className: "space-y-1", children: L.map((t) => /* @__PURE__ */ r(
+            i === "links" && (b.loading ? /* @__PURE__ */ e("p", { className: "py-4 text-center text-[11.5px] text-slate-500", children: "Loading…" }) : P.length ? /* @__PURE__ */ e("ul", { className: "space-y-1", children: P.map((t) => /* @__PURE__ */ r(
               "li",
               {
                 className: "flex items-center gap-2 text-[11.5px]",
                 children: [
-                  /* @__PURE__ */ e(Q, { className: "h-3.5 w-3.5 shrink-0 text-slate-400" }),
+                  /* @__PURE__ */ e(A, { className: "h-3.5 w-3.5 shrink-0 text-slate-400" }),
                   /* @__PURE__ */ e(
                     "a",
                     {
@@ -471,8 +501,8 @@ function be({
                       rel: "noopener noreferrer",
                       onClick: (N) => {
                         try {
-                          const f = new URL(t.url);
-                          f.origin === window.location.origin && h && (N.preventDefault(), h(`${f.pathname}${f.search}`));
+                          const g = new URL(t.url);
+                          g.origin === window.location.origin && h && (N.preventDefault(), h(`${g.pathname}${g.search}`));
                         } catch {
                         }
                       },
@@ -482,7 +512,7 @@ function be({
                   ),
                   /* @__PURE__ */ r("span", { className: "shrink-0 text-[10.5px] text-slate-500", children: [
                     t.sender_name ?? "",
-                    t.date_created ? ` · ${D(t.date_created)}` : ""
+                    t.date_created ? ` · ${F(t.date_created)}` : ""
                   ] }),
                   /* @__PURE__ */ e(
                     "button",
@@ -503,31 +533,31 @@ function be({
     }
   );
 }
-function fe({
-  room: i,
+function Oe({
+  room: d,
   renderAvatar: l,
   me: n
 }) {
-  const d = I(i), [o, x] = g(!1);
-  if (!d) return null;
-  const s = `${d.member_count} ${d.member_count === 1 ? "member" : "members"} · ${d.online_count} online`;
-  if (!d.members.length)
+  const c = B(d), [o, x] = f(!1);
+  if (!c) return null;
+  const s = `${c.member_count} ${c.member_count === 1 ? "member" : "members"} · ${c.online_count} online`;
+  if (!c.members.length)
     return /* @__PURE__ */ r(
       "p",
       {
         className: "flex items-center gap-1 truncate text-[11px] text-slate-500 dark:text-slate-400",
         "data-chat-member-count": !0,
         children: [
-          /* @__PURE__ */ e(P, { className: "h-3 w-3" }),
+          /* @__PURE__ */ e(U, { className: "h-3 w-3" }),
           s
         ]
       }
     );
-  const u = n ? n.toUpperCase() : null, h = [...d.members].sort(
-    (a, c) => Number(c.online) - Number(a.online) || a.name.localeCompare(c.name)
-  ), y = te();
-  return /* @__PURE__ */ r(K, { open: o, onOpenChange: x, children: [
-    /* @__PURE__ */ e(X, { asChild: !0, children: /* @__PURE__ */ r(
+  const u = n ? n.toUpperCase() : null, h = [...c.members].sort(
+    (a, i) => Number(i.online) - Number(a.online) || a.name.localeCompare(i.name)
+  ), v = me();
+  return /* @__PURE__ */ r(le, { open: o, onOpenChange: x, children: [
+    /* @__PURE__ */ e(se, { asChild: !0, children: /* @__PURE__ */ r(
       "button",
       {
         type: "button",
@@ -535,20 +565,20 @@ function fe({
         "aria-label": `${s} — show members`,
         "data-chat-member-count": !0,
         children: [
-          /* @__PURE__ */ e(P, { className: "h-3 w-3 shrink-0" }),
+          /* @__PURE__ */ e(U, { className: "h-3 w-3 shrink-0" }),
           /* @__PURE__ */ e("span", { className: "truncate", children: s })
         ]
       }
     ) }),
-    /* @__PURE__ */ r(Z, { align: "start", className: "w-[260px] p-0", "data-chat-member-popover": !0, children: [
+    /* @__PURE__ */ r(ne, { align: "start", className: "w-[260px] p-0", "data-chat-member-popover": !0, children: [
       /* @__PURE__ */ e("p", { className: "border-b border-slate-100 px-3 py-2 text-[11.5px] font-semibold text-slate-800 dark:border-border dark:text-slate-100", children: s }),
       /* @__PURE__ */ e("ul", { className: "max-h-[320px] overflow-y-auto p-1", children: h.map((a) => {
-        const c = !!u && a.id.toUpperCase() === u, k = /* @__PURE__ */ r(_, { children: [
+        const i = !!u && a.id.toUpperCase() === u, k = /* @__PURE__ */ r($, { children: [
           l == null ? void 0 : l(a.id, a.name),
           /* @__PURE__ */ r("span", { className: "min-w-0 flex-1", children: [
             /* @__PURE__ */ r("span", { className: "block truncate text-[12px] text-slate-800 dark:text-slate-100", children: [
               a.name,
-              c && /* @__PURE__ */ e("span", { className: "ml-1 text-slate-500 dark:text-slate-400", children: "(you)" })
+              i && /* @__PURE__ */ e("span", { className: "ml-1 text-slate-500 dark:text-slate-400", children: "(you)" })
             ] }),
             a.title && /* @__PURE__ */ e("span", { className: "block truncate text-[10.5px] text-slate-500 dark:text-slate-400", children: a.title })
           ] }),
@@ -563,12 +593,12 @@ function fe({
             }
           )
         ] });
-        return /* @__PURE__ */ e("li", { "data-chat-member": a.online ? "online" : "offline", children: y && !c ? /* @__PURE__ */ e(
+        return /* @__PURE__ */ e("li", { "data-chat-member": a.online ? "online" : "offline", children: v && !i ? /* @__PURE__ */ e(
           "button",
           {
             type: "button",
             onClick: () => {
-              x(!1), A(a.id, a.name);
+              x(!1), de(a.id, a.name);
             },
             title: `Message ${a.name}`,
             className: "flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left hover:bg-muted",
@@ -580,10 +610,10 @@ function fe({
   ] });
 }
 export {
-  he as ChannelIntro,
-  ue as JumpToDateForm,
-  fe as MemberCountLine,
-  be as RoomInfoDrawer,
-  xe as ThreadPane,
-  pe as WelcomeNote
+  Le as ChannelIntro,
+  ze as JumpToDateForm,
+  Oe as MemberCountLine,
+  Te as RoomInfoDrawer,
+  $e as ThreadPane,
+  Me as WelcomeNote
 };