@ethora/chat-component 26.7.5 → 26.7.7

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

@@ -2,5 +2,22 @@ import { default as React } from 'react';
 interface FilePreviewModalProps {
     handleCloseModal: any;
 }
+/**
+ * Full-screen media viewer.
+ *
+ * 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.
+ *
+ * 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.
+ */
 declare const FilePreviewModal: React.FC<FilePreviewModalProps>;
 export default FilePreviewModal;

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

@@ -0,0 +1,35 @@
+import { default as React } from 'react';
+export declare const MIN_SCALE = 1;
+export declare const MAX_SCALE = 6;
+/** What a double-click / double-tap jumps to from the fitted view. */
+export declare const DOUBLE_TAP_SCALE = 2.5;
+export interface ImageLightboxHandle {
+    zoomIn: () => void;
+    zoomOut: () => void;
+    reset: () => void;
+}
+interface ImageLightboxProps {
+    src: string;
+    alt: string;
+    /** Swipe (touch) navigation; also used to report gesture direction. */
+    onSwipeLeft?: () => void;
+    onSwipeRight?: () => void;
+    onError?: React.ReactEventHandler<HTMLImageElement>;
+    /** Reported on every scale change so the chrome can label its controls. */
+    onScaleChange?: (scale: number) => void;
+}
+/**
+ * The zoom/pan surface of the media viewer.
+ *
+ * Zoom model: the `<img>` keeps `object-fit: contain`, so scale 1 is always
+ * "fitted to the viewport" whatever the image's aspect ratio, and everything
+ * above it is a CSS transform on top of that fit - no re-layout, no
+ * re-decode, and the fitted view is exactly what the viewer saw before this
+ * feature existed. Zooming is anchored on the pointer (or on the midpoint
+ * between two fingers), and the pan offset is clamped every time either the
+ * scale or the offset changes, using the image's natural aspect ratio
+ * against the viewport box, so the picture can never be dragged off screen:
+ * at scale 1 the only legal offset is (0, 0).
+ */
+declare const ImageLightbox: React.ForwardRefExoticComponent<ImageLightboxProps & React.RefAttributes<ImageLightboxHandle>>;
+export default ImageLightbox;

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

@@ -1,4 +1,15 @@
-declare const PdfViewer: ({ pdfUrl }: {
-    pdfUrl: any;
-}) => import("react/jsx-runtime").JSX.Element;
+import { default as React } from 'react';
+interface PdfViewerProps {
+    pdfUrl: string;
+}
+/**
+ * In-app PDF viewer.
+ *
+ * This used to be an iframe pointed at `mozilla.github.io/pdf.js/web/viewer.html`
+ * with the file URL in the query string, which meant every document a user
+ * 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).
+ */
+declare const PdfViewer: React.FC<PdfViewerProps>;
 export default PdfViewer;

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

@@ -5,5 +5,15 @@ interface ModalProps {
     modal?: string;
     setOpenModal: (value?: ModalType) => any;
 }
+/**
+ * Host for the store-driven modals that really are centred dialogs: the file
+ * preview / lightbox. The profile, user, settings, Manage Data and Visibility
+ * panels used to render here too, parked against the right edge of this same
+ * full-viewport overlay, which is exactly why they covered the conversation.
+ * They are rendered by `SidePanel` instead now, as a column of the chat's own
+ * flex row, so opening one shrinks the chat rather than hiding it. This
+ * component deliberately renders nothing for those types so they can never be
+ * painted twice.
+ */
 declare const Modal: React.FC<ModalProps>;
 export default Modal;

package/dist/components/Modals/Modal/ModalContent.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+import { ModalType } from '../../../types/types';
+/**
+ * The store-driven modal router, minus any opinion about WHERE the panel is
+ * painted.
+ *
+ * There are two hosts for it now and they place their content very
+ * differently: `Modal.tsx` paints a centred dialog on top of everything
+ * inside a scrim, while `SidePanel.tsx` paints a column that takes part in
+ * the chat's flex row (so opening a profile shrinks the chat instead of
+ * covering it). Everything else - which component is open, stepping a
+ * settings sub-panel back to Settings, Escape, and moving focus into a
+ * lazily-loaded chunk once it actually mounts - is identical, so it lives
+ * here once rather than being copied into both hosts.
+ */
+interface ModalContentProps {
+    modal: string;
+    setOpenModal: (value?: ModalType) => any;
+}
+declare const ModalContent: React.FC<ModalContentProps>;
+export default ModalContent;

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

@@ -3,6 +3,15 @@ interface ModalBoxProps {
     title: string;
     handleCloseModal: () => void;
     children: ReactNode;
+    /**
+     * True while the caller is keeping this mounted only to let the exit
+     * animation finish (see `useExitTransition` at the call site - typically
+     * `{shouldRender && <ModalBox isClosing={isExiting} .../>}`). Every close
+     * trigger here (X button, Escape, outside click) still just calls
+     * `handleCloseModal` immediately: the caller decides how long to keep
+     * rendering, this component only decides how it looks while that happens.
+     */
+    isClosing?: boolean;
 }
 export declare const ModalBox: FC<ModalBoxProps>;
 export {};

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

@@ -1,3 +1,8 @@
 import { default as React, FC } from 'react';
 export declare const Report: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
-export declare const ModalReportChat: FC;
+interface ModalReportChatProps {
+    /** Forwarded to `ModalBox` - see its `isClosing` doc. */
+    isClosing?: boolean;
+}
+export declare const ModalReportChat: FC<ModalReportChatProps>;
+export {};

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

@@ -11,6 +11,14 @@ interface ModalWrapperProps {
     setTextarea?: (value: string) => void;
     handleCloseModal: () => void;
     handleClick: () => void;
+    /**
+     * True while the caller is keeping this mounted only so the exit
+     * animation can finish - see `ModalBox`'s `isClosing` doc for the pattern
+     * (a `useExitTransition` at the `{shouldRender && <ModalWrapper .../>}`
+     * call site). Buttons here still call `handleCloseModal`/`handleClick`
+     * immediately either way.
+     */
+    isClosing?: boolean;
 }
 export declare const ModalWrapper: FC<ModalWrapperProps>;
 export {};

package/dist/components/Modals/NewChatModal/styledNewChatComponents.d.ts

@@ -0,0 +1,12 @@
+export declare const ChatTypeGroup: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ChatTypeIndicator: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $index: number;
+    $count: number;
+}>> & string;
+export declare const ChatTypeOption: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    active: boolean;
+}>> & string;
+export declare const InlineUsersWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $expanded: boolean;
+}>> & string;
+export declare const InlineUsersInner: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/Modals/SettingsModals/SharedStyledComponents.d.ts

@@ -11,11 +11,23 @@ export declare const RowWrapper: import('styled-components/dist/types').IStyledC
 export declare const SharedSettingsLabelData: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<Omit<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>, "ref"> & {
     ref?: import('react').Ref<HTMLSpanElement>;
 }, never>> & string;
+/**
+ * A settings action rendered as its own outlined row rather than an inline
+ * link, so "download my data" / "delete my account" read as deliberate,
+ * separately-weighted decisions - not just more text in the card. The
+ * border colour is caller-driven (primary for a normal action, the danger
+ * token for the destructive one), everything else - radius, padding,
+ * weight, the hover/focus feedback - comes from the shared tokens so both
+ * read as the same kind of control.
+ */
 export declare const SharedSettingsStyledButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<ButtonProps & import('react').RefAttributes<HTMLButtonElement>, "ref"> & {
     ref?: import('react').Ref<HTMLButtonElement>;
 }, {
     borderColor: string;
 }>> & string & Omit<import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>, keyof import('react').Component<any, {}, any>>;
+/** A quiet, boxed disclosure - the read-only counterpart to the button
+ * above, so a fact ("your data may be retained on-chain") doesn't compete
+ * visually with an action the person can take. */
 export declare const SharedSettingsInfoPanel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     bgColor: string;
 }>> & string;

package/dist/components/Modals/SettingsModals/Visibility/StyledComponents.d.ts

@@ -4,5 +4,5 @@ export declare const Description: import('styled-components/dist/types').IStyled
 export declare const RadioGroup: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const RadioLabel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>> & string;
 export declare const RadioInput: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {
-    radioColor?: string;
+    $radioColor?: string;
 }>> & string;

package/dist/components/Modals/SideDrawer/DrawerProfileParts.d.ts

@@ -0,0 +1,42 @@
+/**
+ * The identity block at the top of a profile-style drawer: avatar, then the
+ * name. It carries no section heading on purpose - it IS the heading for the
+ * panel, and a "Profile" label above a face reads as filler.
+ *
+ * Shared by the user profile and the room profile so the two panels open with
+ * the same shape.
+ */
+export declare const ProfileHero: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+/**
+ * The one bold, largest line in the entire panel family: deliberately so.
+ * Everything else in these drawers tops out at semibold (section labels,
+ * header title, row labels), so this is the only place `font-weight-bold`
+ * is used - it is what makes the hero read as the peak of the hierarchy
+ * instead of just another slightly-bigger label.
+ */
+export declare const ProfileHeroName: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ProfileHeroSubtitle: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+/** Stack of full-width action buttons, one per row. */
+export declare const ProfileActions: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+/**
+ * Room/profile description, set directly under the hero with no "Description"
+ * label above it - the About section heading already says what this is.
+ * When there is no description yet, `$empty` swaps in a muted italic tone so
+ * the placeholder line reads as an unwritten blank rather than a failed
+ * value, without changing the copy or the layout.
+ */
+export declare const DrawerDescriptionText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {
+    $empty?: boolean;
+}>> & string;
+/** Small icon+label tag for a single fact (chat type, visibility, ...). */
+export declare const DrawerFactPill: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+/**
+ * A deliberate blank state - icon, title, optional hint - for "nothing here
+ * yet" spots (no files, no members) that used to be a single line of grey
+ * text sitting in a box and reading like something had gone wrong.
+ */
+export declare const DrawerEmptyState: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $compact?: boolean;
+}>> & string;
+export declare const DrawerEmptyStateTitle: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const DrawerEmptyStateHint: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

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

@@ -0,0 +1,64 @@
+import { FC, ReactNode } from 'react';
+export declare const DrawerPanel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $closing?: boolean;
+}>> & string;
+/** A labelled group: small caps heading, then a bordered card of rows. */
+export declare const DrawerSection: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
+export declare const DrawerSectionTitle: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
+/** The surface a section's rows sit on. */
+export declare const DrawerCard: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+/** Padded block inside a card, for free-form content rather than a row list. */
+export declare const DrawerCardBody: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+/** Section heading with a trailing control (e.g. "Files" ... "Show all"). */
+export declare const SectionHeaderRow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+/**
+ * Text-only affordance for "Show more" / "Show all". A real <button>, so it
+ * is reachable by keyboard and announced as a button - the panels used to
+ * fake this with a div carrying role="button" and hand-rolled key handling.
+ */
+export declare const ShowMoreButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+/** Hairline between two rows of the same card. */
+export declare const DrawerRowDivider: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+/**
+ * Filled, borderless search field - matches the room list's and the Files
+ * tab's own search bars (bg-subtle fill, no border) rather than the boxed,
+ * bordered field the member search used to be, which sat inside a bordered
+ * `DrawerCard` and read as a box nested in another box. Not built on the
+ * shared `InputComponents/Search` component: that one adds its own visible
+ * border and isn't in this pass's file list, so this is a local, purpose-fit
+ * equivalent that shares the same visual language as the other search bars
+ * in the app.
+ */
+export declare const DrawerSearchBar: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const DrawerSearchInput: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, never>> & string;
+/**
+ * Flat row list with no surrounding card border - used where the rows
+ * themselves (via hover/press state) already read as one group, e.g. the
+ * member list, so it doesn't also need a bounding box drawn around it.
+ */
+export declare const DrawerList: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const DrawerLabel: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const DrawerHint: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+interface DrawerNavRowProps {
+    label: string;
+    hint?: string;
+    onClick: () => void;
+}
+/** One "opens another panel" row inside a `DrawerCard`. */
+export declare const DrawerNavRow: FC<DrawerNavRowProps>;
+export interface SideDrawerProps {
+    /** Heading text; also the dialog's accessible name. */
+    title: string;
+    /** Invoked by the back button and by Escape. */
+    onClose: () => void;
+    /** Controls in the header's trailing slot (edit, overflow menu, QR, ...). */
+    headerActions?: ReactNode;
+    /**
+     * Label for the leading button. Sub-panels step back to their parent, so
+     * they read as "Back"; a top-level panel reads as "Close".
+     */
+    backLabel?: string;
+    children: ReactNode;
+}
+declare const SideDrawer: FC<SideDrawerProps>;
+export default SideDrawer;

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

@@ -0,0 +1,31 @@
+import { default as React } from 'react';
+import { ModalType } from '../../../types/types';
+/**
+ * The chat's third column: chat profile, user profile, settings, Manage Data
+ * and Visibility.
+ *
+ * These used to be children of the modal overlay layer - a fixed,
+ * full-viewport `ModalBackground` with the panel parked against its right
+ * edge - so opening one dropped a 400px panel ON TOP of the conversation and
+ * the message you were reading disappeared underneath it. This component is
+ * rendered as a sibling of the chat pane inside `ChatWrapper`'s flex row
+ * instead, so the panel occupies real layout space and the chat simply gets
+ * narrower, the way Telegram Web behaves.
+ *
+ * Which panel is open is still the store's `activeModal` and is still routed
+ * through `MODAL_COMPONENTS`; `ModalContent` is the shared router both this
+ * and `Modal` use, so there is exactly one source of truth.
+ *
+ * Below the mobile breakpoint the column goes back to covering everything:
+ * three columns cannot fit on a phone, and the panel being the whole screen
+ * is the behaviour that was already there. `ChatWrapperInnerBox` is
+ * positioned, so `inset: 0` here is the chat's own box, not the host page.
+ */
+export declare const SIDE_PANEL_WIDTH_PX = 400;
+export declare const SIDE_PANEL_BREAKPOINT_PX = 767;
+interface SidePanelProps {
+    modal?: string;
+    setOpenModal: (value?: ModalType) => any;
+}
+declare const SidePanel: React.FC<SidePanelProps>;
+export default SidePanel;

package/dist/components/Modals/UserProfileModal/EditUserModal.d.ts

@@ -4,5 +4,9 @@ interface EditUserModalProps {
     modalUser: any;
     config: any;
 }
-declare const EditUserModal: React.FC<EditUserModalProps>;
+/** What the parent drawer's header Save button calls. */
+export interface EditUserModalHandle {
+    save: () => Promise<void>;
+}
+declare const EditUserModal: React.ForwardRefExoticComponent<EditUserModalProps & React.RefAttributes<EditUserModalHandle>>;
 export default EditUserModal;

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

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+type ModalComponent = React.FC<{
+    handleCloseModal: () => void;
+}>;
+export declare const MODAL_COMPONENTS: Record<string, React.LazyExoticComponent<ModalComponent>>;
+export {};

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

@@ -0,0 +1,37 @@
+/**
+ * Exit-animation variants of the shared modal primitives from
+ * `styledModalComponents.tsx` (owned by another agent right now - see
+ * CLAUDE.md coordination notes, not edited here). `styled(Component)`
+ * composition lets these add a `$closing` branch without touching that
+ * file: styled-components injects the extending component's class after the
+ * base one, so its rules win the cascade for the same element.
+ *
+ * Used by `Modal.tsx`, `NewChatModal.tsx` and `ModalWrapper.tsx` to fade/
+ * scale a modal out instead of letting it vanish when it unmounts.
+ */
+/**
+ * `$closing` fades the scrim back out.
+ *
+ * This used to skip the fade in the backdrop's old `$drawer` mode, where the
+ * scrim was transparent and had nothing to fade. That mode is gone: the
+ * profile and settings panels are a layout column now (see SidePanel), so the
+ * only things left behind this backdrop are real centred dialogs, and they all
+ * want the fade.
+ */
+export declare const PresenceModalBackground: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<Omit<import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "$anchorTop"> & {
+    $anchorTop?: boolean;
+}, "ref"> & {
+    ref?: import('react').Ref<HTMLDivElement>;
+}, {
+    $closing?: boolean;
+}>> & string;
+export declare const PresenceModalContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<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"> & {
+    ref?: import('react').Ref<HTMLDivElement>;
+}>, never>, never>, {
+    $closing?: boolean;
+}>> & string;
+export declare const PresenceModalContainerFullScreen: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<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"> & {
+    ref?: import('react').Ref<HTMLDivElement>;
+}>, never>, never>, {
+    $closing?: boolean;
+}>> & string;

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

@@ -1,11 +1,21 @@
 import { ButtonProps } from '../styled/Button';
-export declare const ModalBackground: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ModalBackground: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $anchorTop?: boolean;
+}>> & string;
 export declare const CloseButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
-export declare const ModalContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const ModalContainer: 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"> & {
+    ref?: import('react').Ref<HTMLDivElement>;
+}>, never>, never>> & string;
 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('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"> & {
+    ref?: import('react').Ref<HTMLDivElement>;
+}>, never>, never>> & string;
 export declare const HeaderContainer: 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;

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

@@ -2,7 +2,6 @@ import { default as React } from 'react';
 import { IConfig, IRoom } from '../../types/types';
 interface ChatRoomItemProps {
     chat: IRoom;
-    index: number;
     isChatActive: boolean;
     performClick: (chat: IRoom) => void;
     config: IConfig;

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

@@ -5,7 +5,6 @@ interface OnlineUsersPopoverProps {
     onlineUsernames: string[];
     members?: RoomMember[];
     myXmppUsername: string;
-    isChatActive?: boolean;
 }
 declare const OnlineUsersPopover: React.FC<OnlineUsersPopoverProps>;
 export default OnlineUsersPopover;

package/dist/components/UsersList/StyledComponents.d.ts

@@ -1,4 +1,8 @@
 export declare const ScrollableContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const UserItem: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const UserItem: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $selected?: boolean;
+}>> & string;
+export declare const UserItemInfo: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const Checkbox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, 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 EmptyState: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/UsersList/UsersList.d.ts

@@ -6,6 +6,29 @@ interface UsersListProps {
     headerElement?: boolean;
     style?: any;
     filter?: RoomMember[];
+    /**
+     * When set, sources rows from this list instead of the global `usersSet`
+     * (e.g. the current room's members for the @-mention picker) rather than
+     * every user the client has ever seen.
+     */
+    members?: RoomMember[];
+    /**
+     * Excludes one user (by bare-jid local part, or the raw id) from the list -
+     * used by the mention picker to hide the current reader from their own
+     * mention candidates.
+     */
+    excludeUserId?: string;
+    /**
+     * Single-select mode: a row click calls `onSingleSelect` immediately
+     * instead of toggling the multi-select checkbox array, and no checkbox is
+     * rendered. Used by MentionPickerModal, which reuses this windowed list
+     * for a "pick one person" flow instead of building a separate one.
+     */
+    singleSelect?: boolean;
+    onSingleSelect?: (user: RoomMember) => void;
+    /** Overrides the default "Select Users (max 20)" heading - used by
+     * MentionPickerModal so the reused list reads as a mention picker. */
+    titleOverride?: string;
 }
 declare const UsersList: React.FC<UsersListProps>;
 export default UsersList;

package/dist/components/styled/Button.d.ts

@@ -4,8 +4,18 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
     EndIcon?: ReactElement;
     StartIcon?: ReactElement;
     loading?: boolean;
+    /**
+     * @deprecated No-op. `CustomButton`'s styles never actually read this
+     * prop, so it has had no visual effect for as long as it's existed - many
+     * call sites pass it expecting the default (unstyled-looking) button they
+     * already get from `variant="default"`. Kept accepted here only so those
+     * call sites keep compiling/rendering exactly as before; implementing it
+     * for real would change their visuals. Use `variant` instead.
+     */
     unstyled?: boolean;
-    variant?: 'default' | 'filled' | 'outlined';
+    variant?: 'default' | 'filled' | 'outlined' | 'ghost';
+    /** Recolors the button around the danger token for destructive actions. Optional, defaults to the existing brand-blue styling. */
+    tone?: 'default' | 'danger';
     children?: React.ReactNode;
 }
 declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/styled/ChatWrapperBox.d.ts

@@ -1 +1,3 @@
-export declare const ChatWrapperBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+import { default as React } from 'react';
+export declare const ChatWrapperBox: React.ForwardRefExoticComponent<Omit<import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export declare const ChatWrapperInnerBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/components/styled/PdfMessage.d.ts

@@ -0,0 +1,13 @@
+import { default as React } from 'react';
+interface PdfMessageProps {
+    fileURL: string;
+    fileName: string;
+    mimetype?: string;
+    size?: string;
+    /** Server-side preview, when the storage produced one. Wins over pdf.js. */
+    locationPreview?: string;
+    /** Denser layout used when the message carries more than one file. */
+    compact?: boolean;
+}
+declare const PdfMessage: React.FC<PdfMessageProps>;
+export default PdfMessage;

package/dist/components/styled/RoomListComponents/index.d.ts

@@ -15,4 +15,25 @@ export declare const LastMessage: import('styled-components/dist/types').IStyled
 export declare const UserCount: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     active: boolean;
 }>> & 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;
+export declare const Divider: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $hidden?: boolean;
+}>> & string;
+export declare const AnimatedRow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $delay?: number;
+    $skipAnimation?: boolean;
+}>> & string;
+export declare const TabsContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const TabIndicator: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $index: number;
+    $count: number;
+}>> & string;
+export declare const TabButton: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
+    active: boolean;
+}>> & string;
+export declare const TabContent: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SkeletonRow: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SkeletonAvatar: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SkeletonLines: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const SkeletonLine: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $width?: string;
+}>> & string;