@ethora/chat-component 26.9.6 → 26.10.1

package/dist/{VisibilityModal-BPsNiMzJ.js → VisibilityModal-CIl7rkBM.js}

@@ -1,7 +1,7 @@
 import { jsxs as r, jsx as s } from "react/jsx-runtime";
 import { useState as b, useEffect as x } from "react";
-import { x as o, a as L, p as P, u as z, aG as D, aH as I } from "./main-rJpE4hh-.js";
-import { S as N, D as C, a as $, b as k, e as w, f as p } from "./SideDrawer-WneDrrWG.js";
+import { E as o, a as L, x as P, u as R, aR as D, aS as z } from "./main-CUB_w8AZ.js";
+import { S as I, D as C, a as $, b as k, e as S, f as p } from "./SideDrawer-CQPOf0ek.js";
 o.div``;
 o.div`
   font-size: 16px;
@@ -13,7 +13,7 @@ o.p`
   color: var(--ethora-color-text-muted, #6b7280);
   margin-bottom: 32px;
 `;
-const O = o.div`
+const w = o.div`
   display: flex;
   flex-direction: column;
   gap: 6px;
@@ -25,7 +25,7 @@ const O = o.div`
 `, u = o.input`
   accent-color: ${({ $radioColor: i }) => i || "var(--ethora-color-primary, #0052CD)"};
   margin: 0px;
-`, R = o.div`
+`, N = o.div`
   padding: 10px 15px;
   margin-top: 16px;
   color: ${({ type: i }) => i === "success" ? "#10b981" : "#ef4444"};
@@ -39,12 +39,12 @@ const O = o.div`
     background: ${({ type: i }) => i === "success" ? "rgba(16, 185, 129, 0.15)" : "rgba(242, 118, 107, 0.15)"};
     border-color: ${({ type: i }) => i === "success" ? "var(--ethora-color-success, #10b981)" : "var(--ethora-color-danger, #ef4444)"};
   }
-`, H = ({
+`, M = ({
   handleCloseModal: i
 }) => {
-  const S = L(), e = P(), { user: n, config: l } = z(
+  const O = L(), e = P(), { user: n, config: l } = R(
     (t) => t.chatSettingStore
-  ), g = (t) => S(I(t)), [a, m] = b(n?.isProfileOpen), [c, v] = b(n?.isAssetsOpen), [f, y] = b(null), d = (t, A) => {
+  ), g = (t) => O(z(t)), [a, m] = b(n?.isProfileOpen), [c, v] = b(n?.isAssetsOpen), [f, y] = b(null), d = (t, A) => {
     y({ message: t, type: A }), setTimeout(() => y(null), 3e3);
   };
   return x(() => {
@@ -56,7 +56,7 @@ const O = o.div`
       g(t.user), d(e("notification.saved"), "success");
     }).catch(() => d(e("toast.error"), "error"));
   }, [c]), /* @__PURE__ */ r(
-    N,
+    I,
     {
       title: e("settings.visibility.title"),
       onClose: i,
@@ -64,7 +64,7 @@ const O = o.div`
       children: [
         /* @__PURE__ */ r(C, { children: [
           /* @__PURE__ */ s($, { children: e("settings.visibility.profileLabel") }),
-          /* @__PURE__ */ s(k, { children: /* @__PURE__ */ s(w, { children: /* @__PURE__ */ r(O, { children: [
+          /* @__PURE__ */ s(k, { children: /* @__PURE__ */ s(S, { children: /* @__PURE__ */ r(w, { children: [
             /* @__PURE__ */ r(h, { children: [
               /* @__PURE__ */ s(
                 u,
@@ -97,7 +97,7 @@ const O = o.div`
         ] }),
         /* @__PURE__ */ r(C, { children: [
           /* @__PURE__ */ s($, { children: e("settings.visibility.documentsLabel") }),
-          /* @__PURE__ */ s(k, { children: /* @__PURE__ */ s(w, { children: /* @__PURE__ */ r(O, { children: [
+          /* @__PURE__ */ s(k, { children: /* @__PURE__ */ s(S, { children: /* @__PURE__ */ r(w, { children: [
             /* @__PURE__ */ r(h, { children: [
               /* @__PURE__ */ s(
                 u,
@@ -128,11 +128,11 @@ const O = o.div`
             /* @__PURE__ */ s(p, { children: e("settings.visibility.individualDescription") })
           ] }) }) })
         ] }),
-        f && /* @__PURE__ */ s(R, { type: f.type, children: f.message })
+        f && /* @__PURE__ */ s(N, { type: f.type, children: f.message })
       ]
     }
   );
 };
 export {
-  H as default
+  M as default
 };

package/dist/assets/icons.d.ts

@@ -148,10 +148,9 @@ export declare const InSendingIcon: ({ fill, color, ...props }: {
     fill?: string;
     color?: string;
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const DoubleTick: ({ fill, color, ...props }: {
+export declare const DoubleTick: ({ stroke, ...props }: {
     [x: string]: any;
-    fill?: string;
-    color?: string;
+    stroke?: string;
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const RedCross: ({ color, ...props }: {
     [x: string]: any;

package/dist/components/Files/fileCategory.d.ts

@@ -7,7 +7,9 @@ export type FileCategory = 'media' | 'documents' | 'audio';
  * with thumbnails); audio/* gets its own chip; everything else falls back
  * to "Documents".
  */
-export declare function getFileCategory(mimetype?: string | null): FileCategory;
-export declare function isPreviewable(file: Pick<ApiFile, 'mimetype'>): boolean;
+export declare function getFileCategory(mimetype?: string | null, name?: string | null): FileCategory;
+export declare function isPreviewable(file: Pick<ApiFile, 'mimetype'> & {
+    originalname?: string;
+}): boolean;
 /** Human-readable byte size, e.g. formatBytes(1536) -> "1.5 KB". */
 export declare function formatBytes(bytes?: number | null): string;

package/dist/components/InputComponents/MentionDropdown.d.ts

@@ -8,6 +8,8 @@ interface MentionDropdownProps {
     onSelect: (candidate: MentionCandidate) => void;
     onShowAll: () => void;
     onHoverIndex: (index: number) => void;
+    /** More people are still being loaded in the background. */
+    loading?: boolean;
 }
 export declare const MentionDropdown: React.FC<MentionDropdownProps>;
 export default MentionDropdown;

package/dist/components/MainComponents/AlbumGrid.d.ts

@@ -0,0 +1,22 @@
+import { default as React } from 'react';
+import { IAttachment, ModalFile } from '../../types/types';
+export interface AlbumGridItem {
+    attachment: IAttachment;
+    /** Position in the message's `attachments`, used for retry. */
+    index: number;
+}
+interface AlbumGridProps {
+    items: AlbumGridItem[];
+    /** Called with the failed tile's index when the user asks to retry it. */
+    onRetry?: (index: number) => void;
+    /** Who posted the album and when, handed to the viewer header. */
+    sender?: ModalFile['sender'];
+    date?: string;
+}
+/**
+ * Photo/video album for a message with several media files. Layout comes
+ * from getAlbumLayout; a tile tap opens that file in the preview modal, and
+ * a tile still in flight or failed shows its state over the thumbnail.
+ */
+declare const AlbumGrid: React.FC<AlbumGridProps>;
+export default AlbumGrid;

package/dist/components/MainComponents/AttachmentList.d.ts

@@ -1,12 +1,12 @@
 import { default as React } from 'react';
-import { IAttachment } from '../../types/types';
+import { IAttachment, ModalFile } from '../../types/types';
 interface AttachmentListProps {
     attachments: IAttachment[];
-    /** See CustomMessageImage's `onUnavailable` - only wired to the full-width
-     * single-image renderer (AttachmentRow), not the multi-file grid tiles,
-     * since one dead thumbnail there shouldn't tombstone a message that still
-     * has other live attachments. */
-    onUnavailable?: () => void;
+    /** Re-sends the file at this index of `attachments` after a failed upload. */
+    onRetryAttachment?: (index: number) => void;
+    /** Who posted the message and when; the viewer header shows both. */
+    sender?: ModalFile['sender'];
+    date?: string;
 }
 declare const AttachmentList: React.FC<AttachmentListProps>;
 export default AttachmentList;

package/dist/components/MainComponents/ImageUnavailable.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+export interface ImageUnavailableArtProps {
+    /** Rendered width and height in CSS pixels. The viewBox scales crisply. */
+    size?: number;
+}
+export declare const ImageUnavailableArt: React.FC<ImageUnavailableArtProps>;
+export interface ImageUnavailableStateProps {
+    /**
+     * Compact: the glyph only, about 28px, for album grid tiles. Full: the
+     * illustration, the caption and a hint, for a solo bubble or the viewer.
+     */
+    compact?: boolean;
+    /**
+     * Shows a "Try again" action. The picture sits inside the bubble's open
+     * button, so the action is a span with button semantics, not a <button>.
+     */
+    onRetry?: () => void;
+}
+/** Self-contained "could not load" state that fills its positioned parent. */
+export declare const ImageUnavailableState: React.FC<ImageUnavailableStateProps>;
+export default ImageUnavailableState;

package/dist/components/MainComponents/MediaUploadOverlay.d.ts

@@ -0,0 +1,31 @@
+import { default as React } from 'react';
+/** How long the scrim takes to fade once the upload is done. */
+export declare const SCRIM_FADE_MS = 180;
+/** The circular-arrow retry mark, shared by the failed tile and the "+N" badge. */
+export declare const RetryIcon: React.FC<{
+    size?: number;
+}>;
+/**
+ * Thin circular progress ring. The SVG is a fixed 40px square with a
+ * viewBox, so it can never stretch; the arc is drawn by moving the dash
+ * offset from the full circumference (empty) down to zero (complete).
+ */
+export declare const ProgressRing: React.FC<{
+    percent: number;
+    children?: React.ReactNode;
+}>;
+interface MediaUploadOverlayProps {
+    /** `uploading` covers "waiting for the siblings" too; `failed` is a retry prompt. */
+    status: 'uploading' | 'failed';
+    progress?: number;
+    /** Upload is done: fade the scrim out instead of leaving it up. */
+    leaving?: boolean;
+}
+/**
+ * State layer over an outgoing attachment: a frosted scrim with a progress
+ * ring while it goes up, and a tinted scrim with a retry glyph once it has
+ * failed. The parent owns the click, so this stays pointer-transparent and
+ * can sit inside a button without nesting interactive elements.
+ */
+export declare const MediaUploadOverlay: React.FC<MediaUploadOverlayProps>;
+export default MediaUploadOverlay;

package/dist/components/MainComponents/MessageContainer.d.ts

@@ -6,6 +6,7 @@ interface MessageContainerProps {
         isUser: boolean;
         $isUser?: boolean;
         isReply: boolean;
+        isLastInGroup?: boolean;
     }>;
     message: IMessage;
     activeMessage: IMessage;
@@ -13,6 +14,8 @@ interface MessageContainerProps {
     xmppUsername: string;
     isReply: boolean;
     showDateLabel: boolean;
+    /** False when the next row is the same sender's message (a run continues). */
+    isLastInGroup?: boolean;
     className?: string;
 }
 export declare const MessageContainer: React.NamedExoticComponent<MessageContainerProps>;

package/dist/components/MainComponents/scrollAnchor.d.ts

@@ -0,0 +1,19 @@
+export interface AnchorRowRect {
+    id: string;
+    top: number;
+    bottom: number;
+}
+export interface ScrollAnchor {
+    id: string;
+    /** Row top relative to the scroller's top edge. */
+    offset: number;
+}
+/**
+ * The row to hold still while content changes around it: the first row that
+ * is fully inside the viewport, or, when none is (a row taller than the
+ * viewport, or the viewport cuts every row), the first one that intersects it.
+ * `rows` must be in document order.
+ */
+export declare function pickAnchorRow(viewTop: number, viewBottom: number, rows: AnchorRowRect[]): ScrollAnchor | null;
+/** How far scrollTop must move for the anchor row to sit at its old offset. */
+export declare function anchorScrollDelta(anchor: ScrollAnchor, rowTop: number, viewTop: number): number;

package/dist/components/MainComponents/useJumpToMessage.d.ts

@@ -1,16 +1,16 @@
 import { MutableRefObject, RefObject } from 'react';
+import { PendingJump } from '../../roomStore/roomsSlice';
 import { IMessage } from '../../types/types';
+import { findMessageIndex } from '../../helpers/jumpThread';
+export { findMessageIndex };
+export declare const NEAR_LIVE_MESSAGES = 300;
 /**
- * Index of the message a jump names.
- *
- * By id first (message.id is the MAM stanza id for history, xmppId the client
- * message id). When the request has no id at all, which is common for archive
- * rows, by content: same text, sent within a few seconds of the same time.
+ * How the attempt to open a window around the target went:
+ *  - found: the window is in the store; the list now renders it;
+ *  - missing: the server answered and the target is not in its archive;
+ *  - unavailable: could not ask (no archive id, request failed): page instead.
  */
-export declare const findMessageIndex: (messages: IMessage[], ids: string[], content?: {
-    createdAt?: string;
-    body?: string;
-}) => number;
+export type WindowFetchResult = 'found' | 'missing' | 'unavailable';
 /** What the server said about one page of older history. */
 export interface OlderPage {
     /** False when the request failed or timed out. */
@@ -47,6 +47,38 @@ interface Options {
      * bottom, undoing the jump the moment the target loads.
      */
     isUserScrolledUpRef: MutableRefObject<boolean>;
+    /** `messages` is a jump window around an earlier target, not the live list. */
+    jumpWindowActive?: boolean;
+    /**
+     * Opens a window around a far target (and puts it in the store). Omitted
+     * where windows do not apply (threads); the paging path is used then.
+     */
+    fetchWindow?: (jump: PendingJump) => Promise<WindowFetchResult>;
+    /**
+     * Which list this instance is. A jump is fulfilled by exactly one list: the
+     * main list, or the thread its target is a reply in. The other instances
+     * stay inert for it, so one of them cannot give up (and show the archived
+     * card) while the owner is still working.
+     */
+    scope?: 'main' | {
+        threadId: string;
+    };
+    /**
+     * The room's messages BEFORE the main list's filter (which hides thread
+     * replies). Lets the main list recognise a target that is a thread reply.
+     */
+    allMessages?: IMessage[];
+    /**
+     * Opens the thread a reply target belongs to (main list only). Resolves true
+     * when the thread is open and owns the jump from now on.
+     */
+    resolveReply?: (jump: PendingJump, reply: IMessage) => Promise<boolean>;
+    /**
+     * The room is still opening (joining, loading its first history). While it
+     * is, a request that cannot be answered yet is waited out, not counted as a
+     * failure: the card is for "the server answered and the message is absent".
+     */
+    roomOpening?: boolean;
 }
 /**
  * Fulfils a pending "scroll to this message" request for this room.
@@ -59,5 +91,4 @@ interface Options {
  *     up, bounded by MAX_HISTORY_PAGES and by the end of the archive.
  * If it cannot be reached, say so rather than leaving the tap looking dead.
  */
-export declare function useJumpToMessage({ roomJID, messages, visibleCount, setRenderWindow, fetchOlderPage, containerRef, historyComplete, isUserScrolledUpRef, }: Options): void;
-export {};
+export declare function useJumpToMessage({ roomJID, messages, visibleCount, setRenderWindow, fetchOlderPage, containerRef, historyComplete, isUserScrolledUpRef, jumpWindowActive, fetchWindow, scope, allMessages, resolveReply, roomOpening, }: Options): void;

package/dist/components/MainComponents/useScrollAnchor.d.ts

@@ -0,0 +1,29 @@
+import { RefObject } from 'react';
+/** The reader counts as still after this long without scrolling. */
+export declare const ANCHOR_IDLE_MS = 100;
+interface Options {
+    containerRef: RefObject<HTMLElement>;
+    /** The element whose height changes as rows grow. */
+    flowRef: RefObject<HTMLElement>;
+    /** Identity changes whenever the mounted rows can change. */
+    rows: unknown;
+    /** True when the reader follows the bottom: nothing is anchored then. */
+    isStuckToBottom: () => boolean;
+}
+/**
+ * Keeps the rows the reader is looking at perfectly still while content is
+ * added or resized above or below them (older history prepended, a jump
+ * window paged either way, the render window widened, rows trimmed).
+ *
+ * - Just before a commit that can change the rows, the anchor is captured from
+ *   the live DOM (the render phase still sees the previous layout).
+ * - The layout effect puts it back before paint, by the anchor ROW's own
+ *   movement, so a row that gained a date divider or header is absorbed too.
+ * - Rows keep changing height after a commit (images, embeds, waveforms).
+ *   Whenever the content resizes and the reader has been still for
+ *   ANCHOR_IDLE_MS, the anchor is re-applied by a ResizeObserver. The anchor
+ *   is re-taken ANCHOR_IDLE_MS after any scroll this hook did not make (the
+ *   reader, a jump) and dropped while that scroll is going on.
+ */
+export declare function useScrollAnchor({ containerRef, flowRef, rows, isStuckToBottom, }: Options): void;
+export {};

package/dist/components/MessageBubble/MediaCaption.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { MentionClickHandler } from '../../helpers/parseMessageBody';
+interface MediaCaptionProps {
+    /** The message: its caption, or the text a legacy sender put in `body`. */
+    message: object;
+    onMentionClick?: MentionClickHandler;
+}
+declare const MediaCaption: React.FC<MediaCaptionProps>;
+export default MediaCaption;

package/dist/components/MessageBubble/MessageAvatarPhoto.d.ts

@@ -0,0 +1,17 @@
+import { default as React, CSSProperties } from 'react';
+interface MessageAvatarPhotoProps {
+    /** Sender photo URL; empty renders the initials circle alone. */
+    src?: string | null;
+    /** Display name, used for the initials. */
+    username?: string;
+    style?: CSSProperties;
+}
+/**
+ * Sender avatar in a message bubble. The initials circle is always rendered
+ * (no layout shift, nothing waits on the network); the photo is layered over
+ * it and faded in once it has loaded. A photo that fails to load leaves the
+ * initials, where the old bare <img> showed a broken-image glyph. A sender
+ * with many bubbles shares one load through useAvatarImage's cache.
+ */
+export declare const MessageAvatarPhoto: React.FC<MessageAvatarPhotoProps>;
+export {};

package/dist/components/MessageBubble/MessageReaction.d.ts

@@ -5,6 +5,12 @@ interface MessageReactionProps {
     reaction: Record<string, ReactionMessage>;
     changeReaction: (reaction: string) => void;
     userName?: string;
+    /**
+     * Reports how far the chip rows hang below the bubble's bottom edge, in px,
+     * whenever their rendered height changes (one row hangs REACTION_HANG_PX).
+     * The message row uses it to reserve room for every wrapped row.
+     */
+    onHangChange?: (hangPx: number) => void;
 }
 export declare const MessageReaction: FC<MessageReactionProps>;
 export {};

package/dist/components/MessageBubble/QuickReplies.d.ts

@@ -1,9 +1,11 @@
 import { default as React } from 'react';
 import { QuickReply } from '../../helpers/quickReplies';
+import { ChatColorScheme } from '../../types/types';
 interface QuickRepliesProps {
     replies: QuickReply[];
     messageId: string;
     accentColor?: string;
+    colorScheme?: ChatColorScheme;
     /** Already answered - the chips are gone for good. */
     answered?: boolean;
     onSelect: (reply: QuickReply, questionId: string) => void;

package/dist/components/Modals/FilePreviewModal/FilePreviewModal.d.ts

@@ -7,17 +7,15 @@ interface FilePreviewModalProps {
  *
  * Images get a real lightbox: previous/next across every image loaded for
  * the room (see helpers/roomImageGallery for exactly what that set is),
- * wheel/pinch zoom with bounded panning, double-click/double-tap to toggle
- * fit, arrow-key and swipe navigation. Video, PDF and unsupported files take
- * the same paths they always did and get no navigation chrome, so opening a
- * PDF is the experience it was before.
+ * a thumbnail strip, wheel/pinch zoom with bounded panning, double-click or
+ * double-tap to toggle fit, arrow and swipe navigation, and a blurred
+ * low-resolution stand-in while the full picture loads. Video, audio, PDF and
+ * other files each get their own view; none of them get gallery chrome.
  *
- * Escape, initial focus and focus restore are NOT handled here: the modal
- * layer (Modals/Modal/Modal.tsx) already runs `useModalDismiss` around every
- * entry in MODAL_COMPONENTS, this one included. Adding a second Escape
- * listener would double-handle the key and fight that hook's focus restore,
- * so the only key listener below is for the arrows, and it explicitly leaves
- * every other key (Escape included) alone.
+ * Escape and initial focus are handled by useModalDismiss at the modal layer
+ * (Modals/Modal/ModalContent.tsx), which also restores focus to the opener on
+ * close. This component adds the Tab trap and the arrow and zoom keys, and it
+ * leaves Escape alone so the key is not handled twice.
  */
 declare const FilePreviewModal: React.FC<FilePreviewModalProps>;
 export default FilePreviewModal;

package/dist/components/Modals/FilePreviewModal/ImageLightbox.d.ts

@@ -11,6 +11,10 @@ export interface ImageLightboxHandle {
 interface ImageLightboxProps {
     src: string;
     alt: string;
+    /** Low-res stand-in painted blurred until `src` has loaded. */
+    previewSrc?: string;
+    /** Visually hidden label for the loading spinner (screen readers). */
+    loadingLabel?: string;
     /** Swipe (touch) navigation; also used to report gesture direction. */
     onSwipeLeft?: () => void;
     onSwipeRight?: () => void;

package/dist/components/Modals/FilePreviewModal/PdfView.d.ts

@@ -10,6 +10,10 @@ interface PdfViewerProps {
  * opened was handed to a third-party host - and broke outright whenever that
  * page changed or was unreachable. Rendering locally keeps the file URL
  * inside the app and works offline-ish (the PDF itself still has to load).
+ *
+ * All pages stack in one scroll container. Every page has a placeholder sized
+ * from its real aspect, but only the few near the viewport render a canvas,
+ * so a 200-page document costs about as much as a 7-page one.
  */
 declare const PdfViewer: React.FC<PdfViewerProps>;
 export default PdfViewer;

package/dist/components/Modals/FilePreviewModal/ViewerChrome.d.ts

@@ -0,0 +1,64 @@
+import { default as React } from 'react';
+export declare const VIEWER_TEXT = "#f5f7fa";
+export declare const VIEWER_MUTED = "rgba(245, 247, 250, 0.68)";
+export declare const VIEWER_SURFACE = "rgba(255, 255, 255, 0.08)";
+export declare const VIEWER_SURFACE_HOVER = "rgba(255, 255, 255, 0.18)";
+export declare const ViewerSurface: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $closing: boolean;
+}>> & string;
+export declare const TopBar: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+export declare const TopIdentity: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SenderText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SenderName: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const SubLine: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const ActionGroup: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const IconButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+export declare const Stage: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const MediaFrame: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $fit: "media" | "content";
+}>> & string;
+export declare const NavButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    $side: "left" | "right";
+}>> & string;
+export declare const BottomBar: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ThumbStrip: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Thumb: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    $active: boolean;
+}>> & string;
+export declare const ThumbImage: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, never>> & string;
+/** Small play triangle over a video's thumbnail. */
+export declare const ThumbPlayBadge: () => import("react/jsx-runtime").JSX.Element;
+/** Stand-in thumbnail for a video that has no poster image. */
+export declare const ThumbVideoGlyph: () => import("react/jsx-runtime").JSX.Element;
+export declare const ControlRow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Counter: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const ZoomGroup: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+interface ErrorPanelProps {
+    onRetry: () => void;
+    onDownload: () => void;
+}
+/** Shown in place of an image that cannot be loaded. No remote fallback image. */
+export declare const ErrorPanel: React.FC<ErrorPanelProps>;
+interface FileCardProps {
+    fileName: string;
+    unsupportedText: string;
+    onDownload: () => void;
+}
+/** Large card for files the viewer cannot render (anything but image/video/audio/PDF). */
+export declare const FileCard: React.FC<FileCardProps>;
+interface AudioCardProps {
+    fileName: string;
+    src: string;
+}
+/** Audio gets a native player inside a card, so it reads as a clip, not a broken image. */
+export declare const AudioCard: React.FC<AudioCardProps>;
+export declare const ExternalLinkGlyph: () => import("react/jsx-runtime").JSX.Element;
+export declare const RetryGlyph: () => import("react/jsx-runtime").JSX.Element;
+export declare const DownloadGlyph: () => import("react/jsx-runtime").JSX.Element;
+export declare const FileGlyph: () => import("react/jsx-runtime").JSX.Element;
+export declare const AudioGlyph: () => import("react/jsx-runtime").JSX.Element;
+/** Format a message timestamp for the viewer header; empty when unknown. */
+export declare const formatViewerDate: (iso?: string) => string;
+/** Returns the URL with a retry marker, so a retry is not served from the failed cache entry. */
+export declare const withRetryMarker: (url: string, attempt: number) => string;
+export {};

package/dist/components/Modals/MessageSearchModal/MessageHitResults.d.ts

@@ -1,5 +1,10 @@
 import { default as React } from 'react';
 import { MessageSearchHit } from '../../../networking/api-requests/messageSearch.api';
+/**
+ * Secondary pill button used for "Show more" and "Retry" under search
+ * results, in the search panel and in the room list.
+ */
+export declare const SecondaryPillButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
 /**
  * What a tap on a search hit does, shared by the search panel and the room
  * list's search box: switch to the hit's room and ask it to scroll to, load

package/dist/components/Modals/styledModalComponents.d.ts

@@ -9,8 +9,6 @@ export declare const ModalContainer: import('styled-components/dist/types').ISty
 export declare const ModalTitle: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
 /** Small uppercase-weight label above a field/list inside a modal - e.g. "Select Users (max 20)". */
 export declare const ModalSectionLabel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-/** 48px-min-height row used for members/blocked-users/etc. lists inside modals. */
-export declare const ModalListRow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const ModalDescription: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
 export declare const GroupContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const ModalContainerFullScreen: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
@@ -24,15 +22,9 @@ export declare const HeaderRight: import('styled-components/dist/types').IStyled
 export declare const CenterContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Omit<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & {
     ref?: import('react').Ref<HTMLDivElement>;
 }, never>> & string;
-export declare const ProfileImage: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const UserInfo: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const UserName: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const UserStatus: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const BorderedContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const LabelData: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const Label: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
 export declare const ActionButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Omit<ButtonProps & import('react').RefAttributes<HTMLButtonElement>, "ref"> & {
     ref?: import('react').Ref<HTMLButtonElement>;
 }, never>> & string & Omit<import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>, keyof import('react').Component<any, {}, any>>;
-export declare const EmptySection: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const Divider: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/RoomComponents/LastMessageItem.d.ts

@@ -2,6 +2,8 @@ import { FC } from 'react';
 import { LastMessage } from '../../types/types';
 interface LastMessageItemProps {
     lastMessage: LastMessage;
+    /** The room is end-to-end encrypted: media shows an icon and label only. */
+    sealed?: boolean;
 }
 declare const LastMessageItem: FC<LastMessageItemProps>;
 export default LastMessageItem;

package/dist/components/RoomComponents/styled/LastMessageMedia.d.ts

@@ -0,0 +1,19 @@
+import { FC } from 'react';
+import { MediaPreview } from '../../../helpers/lastMessagePreview';
+/** Edge of the thumbnail tile, and so the height of a thumbnail row. */
+export declare const MEDIA_THUMB_PX = 18;
+interface LastMessageMediaProps {
+    preview: MediaPreview;
+    /** Sender line, already resolved by ChatRoomItem; empty omits it. */
+    name?: string;
+}
+/**
+ * Room-list preview for a media last message: a thumbnail (images, videos
+ * with a poster) or an inline icon, then a localized label. Thumbnails come
+ * from the message's own preview URL only, with the viewer's file token
+ * appended; a thumbnail that fails (a secure URL that 404s, an expired
+ * token) drops to the icon instead of a broken image, and nothing is ever
+ * fetched from a placeholder host.
+ */
+declare const LastMessageMedia: FC<LastMessageMediaProps>;
+export default LastMessageMedia;

package/dist/components/RoomComponents/styled/LastTextMessage.d.ts

@@ -1,6 +1,6 @@
 import { FC } from 'react';
 import { LastMessage } from '../../../types/types';
-interface LastMessageEmojiProps extends Pick<LastMessage, 'user' | 'body'> {
+interface LastTextMessageProps extends Pick<LastMessage, 'user' | 'body'> {
 }
-declare const LastTextMessage: FC<LastMessageEmojiProps>;
+declare const LastTextMessage: FC<LastTextMessageProps>;
 export default LastTextMessage;