@oxy.so/bloom 2.10.0 → 2.11.0

package/lib/typescript/module/chat-screen/PinnedMessageBar.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { PinnedMessageBarProps } from './types';
+/**
+ * The strip under the header: which message is pinned, what it says, and a way
+ * to jump to it.
+ *
+ * An empty `pins` renders NOTHING — a bar reading "Pinned message" over no pin
+ * is a row of chrome claiming a state the conversation is not in.
+ *
+ * `index` is CLAMPED rather than trusted. The pins arrive from a list that can
+ * shrink under the caller (someone unpins the one you were looking at), and a
+ * bar that renders `undefined.preview` for one frame is a crash, not a state.
+ */
+declare function PinnedMessageBarComponent({ pins, index, onPressPin, onPressList, onDismiss, dismissIcon, formatTitle, listLabel, dismissLabel, accessibilityLabel, style, testID, }: PinnedMessageBarProps): import("react/jsx-runtime").JSX.Element | null;
+export declare const PinnedMessageBar: React.MemoExoticComponent<typeof PinnedMessageBarComponent>;
+export {};
+//# sourceMappingURL=PinnedMessageBar.d.ts.map

package/lib/typescript/module/chat-screen/PinnedMessageBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PinnedMessageBar.d.ts","sourceRoot":"","sources":["../../../../src/chat-screen/PinnedMessageBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAgBpC,OAAO,KAAK,EAAqB,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAwExE;;;;;;;;;;GAUG;AACH,iBAAS,yBAAyB,CAAC,EACjC,IAAI,EACJ,KAAS,EACT,UAAU,EACV,WAAW,EACX,SAAS,EACT,WAAqB,EACrB,WAA4B,EAC5B,SAAyC,EACzC,YAAY,EACZ,kBAAkB,EAClB,KAAK,EACL,MAAM,GACP,EAAE,qBAAqB,kDA4GvB;AAED,eAAO,MAAM,gBAAgB,6DAAkC,CAAC"}

package/lib/typescript/module/chat-screen/ScrollToBottomButton.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { JumpToMentionButtonProps, ScrollToBottomButtonProps } from './types';
+/** The round "back to the newest message" button, with its unread tally. */
+declare function ScrollToBottomButtonComponent({ visible, unreadCount, badgeMax, onPress, accessibilityLabel, size, style, testID, }: ScrollToBottomButtonProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * The `@` companion: the same button for the mentions you have not read. It is a
+ * SEPARATE control rather than a mode of the one above, because "newest" and
+ * "the message that named me" are different destinations and a user scrolled
+ * far up wants both offered at once.
+ */
+declare function JumpToMentionButtonComponent({ visible, count, badgeMax, onPress, accessibilityLabel, size, style, testID, }: JumpToMentionButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare const ScrollToBottomButton: React.MemoExoticComponent<typeof ScrollToBottomButtonComponent>;
+export declare const JumpToMentionButton: React.MemoExoticComponent<typeof JumpToMentionButtonComponent>;
+export {};
+//# sourceMappingURL=ScrollToBottomButton.d.ts.map

package/lib/typescript/module/chat-screen/ScrollToBottomButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollToBottomButton.d.ts","sourceRoot":"","sources":["../../../../src/chat-screen/ScrollToBottomButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAQpC,OAAO,KAAK,EAEV,wBAAwB,EACxB,yBAAyB,EAC1B,MAAM,SAAS,CAAC;AA2EjB,4EAA4E;AAC5E,iBAAS,6BAA6B,CAAC,EACrC,OAAc,EACd,WAAe,EACf,QAAQ,EACR,OAAO,EACP,kBAAsD,EACtD,IAAI,EACJ,KAAK,EACL,MAAM,GACP,EAAE,yBAAyB,2CAc3B;AAED;;;;;GAKG;AACH,iBAAS,4BAA4B,CAAC,EACpC,OAAc,EACd,KAAS,EACT,QAAQ,EACR,OAAO,EACP,kBAAqD,EACrD,IAAI,EACJ,KAAK,EACL,MAAM,GACP,EAAE,wBAAwB,2CAc1B;AAED,eAAO,MAAM,oBAAoB,iEAAsC,CAAC;AAGxE,eAAO,MAAM,mBAAmB,gEAAqC,CAAC"}

package/lib/typescript/module/chat-screen/index.d.ts

@@ -0,0 +1,13 @@
+export { ChatBackground } from './ChatBackground';
+export { ChatDateHeader } from './ChatDateHeader';
+export { ChatEmptyState } from './ChatEmptyState';
+export { ChatHeader } from './ChatHeader';
+export { ChatInfoPanel } from './ChatInfoPanel';
+export { ChatMemberRow } from './ChatMemberRow';
+export { ChatSplitLayout } from './ChatSplitLayout';
+export { PinnedMessageBar } from './PinnedMessageBar';
+export { JumpToMentionButton, ScrollToBottomButton } from './ScrollToBottomButton';
+export { chatBackgroundExtremes, chatBackgroundReferenceSurfaces, CHAT_COMPACT_BREAKPOINT, CHAT_HEADER_HEIGHT, CHAT_INFO_PANE_WIDTH, CHAT_LIST_PANE_WIDTH, CHAT_SPLIT_BREAKPOINT, MAX_PIN_SEGMENTS, resolveChatScreenPaint, } from './shared';
+export type { ChatScreenPaint } from './shared';
+export type { ChatBackgroundProps, ChatBackgroundVariant, ChatDateHeaderPlacement, ChatDateHeaderProps, ChatEmptyStateProps, ChatHeaderMarker, ChatHeaderProps, ChatHeaderStatusTone, ChatIconComponent, ChatInfoAction, ChatInfoPanelProps, ChatInfoPanelVariant, ChatInfoTab, ChatMember, ChatMemberRole, ChatMemberRowProps, ChatPane, ChatPinnedMessage, ChatSplitLayoutProps, JumpToMentionButtonProps, PinnedMessageBarProps, ScrollToBottomButtonProps, } from './types';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/chat-screen/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/chat-screen/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AACnF,OAAO,EACL,sBAAsB,EACtB,+BAA+B,EAC/B,uBAAuB,EACvB,kBAAkB,EAClB,oBAAoB,EACpB,oBAAoB,EACpB,qBAAqB,EACrB,gBAAgB,EAChB,sBAAsB,GACvB,MAAM,UAAU,CAAC;AAClB,YAAY,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAChD,YAAY,EACV,mBAAmB,EACnB,qBAAqB,EACrB,uBAAuB,EACvB,mBAAmB,EACnB,mBAAmB,EACnB,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACpB,iBAAiB,EACjB,cAAc,EACd,kBAAkB,EAClB,oBAAoB,EACpB,WAAW,EACX,UAAU,EACV,cAAc,EACd,kBAAkB,EAClB,QAAQ,EACR,iBAAiB,EACjB,oBAAoB,EACpB,wBAAwB,EACxB,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,SAAS,CAAC"}

package/lib/typescript/module/chat-screen/shared.d.ts

@@ -0,0 +1,177 @@
+import { type ImageSourcePropType } from 'react-native';
+import { type Ramp } from '../button/shared';
+import type { Theme } from '../theme/types';
+import type { ChatBackgroundVariant } from './types';
+/** `true` on every platform that is not the web. */
+export declare const IS_NATIVE: boolean;
+/**
+ * Below this the chat header takes its compact form — a back button, tighter
+ * gutters. It is the width at which a desktop list pane stops fitting beside a
+ * conversation, which is the same question "is there anywhere to go back to".
+ */
+export declare const CHAT_COMPACT_BREAKPOINT = 1024;
+/** Below this `ChatSplitLayout` shows ONE pane instead of two or three. */
+export declare const CHAT_SPLIT_BREAKPOINT = 900;
+/** The header's row height, both forms. */
+export declare const CHAT_HEADER_HEIGHT = 60;
+/** Default widths of the two fixed panes. */
+export declare const CHAT_LIST_PANE_WIDTH = 340;
+export declare const CHAT_INFO_PANE_WIDTH = 380;
+/** The pattern's default ink opacity — also what `chatBackgroundExtremes` assumes. */
+export declare const DEFAULT_PATTERN_OPACITY = 0.5;
+/** Beyond this many pins the accent bar draws one solid rule, not segments. */
+export declare const MAX_PIN_SEGMENTS = 8;
+/** The pattern tile's side, in SVG user units AND in px (it is 1:1). */
+export declare const CHAT_PATTERN_TILE = 120;
+/**
+ * Everything this family paints, resolved from the theme onto Bloom's ramps.
+ *
+ * Two families of surface, and they are not interchangeable:
+ *
+ *   - CHROME (`surface`) — the header, the pinned bar, the info panel. These sit
+ *     in the page, so they take the card colour and separate from it with a
+ *     hairline.
+ *   - FLOATING (`floating*`) — the date pill and the two round jump buttons, which
+ *     hover OVER a wallpaper Bloom does not own. Those come from
+ *     `floating/menu-palette.ts`, the same recipe every menu and tooltip uses,
+ *     so a pill over a photo is the same material as a menu over a page.
+ */
+export interface ChatScreenPaint {
+    isDark: boolean;
+    accent: Ramp;
+    neutral: Ramp;
+    /** The chrome surface: header, pinned bar, info panel. */
+    surface: string;
+    /** A quieter fill inside the chrome — a section, a search field, a thumbnail. */
+    surfaceSubtle: string;
+    /** The transcript page, under the wallpaper. */
+    page: string;
+    /** Hairlines and separators. */
+    border: string;
+    text: string;
+    textSecondary: string;
+    textTertiary: string;
+    accentColor: string;
+    onAccent: string;
+    /** A 10%-ish accent wash — an action tile, a role badge. */
+    accentSubtle: string;
+    /**
+     * The pinned bar's UNVISITED segments. A step off the accent ramp rather than
+     * `accentSubtle`: a 14% wash of the accent over white is invisible at 3px
+     * wide, so the rule read as "one pin" however many there were.
+     */
+    accentTrack: string;
+    destructive: string;
+    destructiveSubtle: string;
+    /** Floating surfaces (date pill, jump buttons) and their hairline/shadow. */
+    floatingSurface: string;
+    floatingBorder: string;
+    floatingShadow: string;
+    /** The wallpaper pattern's ink. */
+    patternTint: string;
+    /** The wallpaper gradient's stops, off the accent ramp. */
+    gradient: readonly [string, string, string];
+    /** The colour an image wallpaper is dimmed TOWARD. */
+    imageDim: string;
+    /** How hard, `0`–`1`. */
+    imageDimOpacity: number;
+}
+export declare function resolveChatScreenPaint(theme: Theme): ChatScreenPaint;
+export declare function useChatScreenPaint(): ChatScreenPaint;
+/**
+ * The lightest and the darkest colour a wallpaper variant can paint.
+ *
+ * This is the only honest way to talk about contrast over a wallpaper. Bubbles,
+ * the date pill and the jump buttons are all OPAQUE, so the wallpaper never gets
+ * between a fill and its own text — what it can do is stop a bubble being told
+ * apart from the page behind it. So the number to measure is the SEPARATION
+ * between a surface and the worst pixel the wallpaper can put behind it, and for
+ * that you need the extremes, not an average.
+ *
+ * `image` is the interesting case: a consumer photo has no knowable extremes, so
+ * the dimming overlay supplies them. White and black dimmed toward
+ * `imageDim` at `imageDimOpacity` ARE the bounds, which is the whole reason the
+ * overlay is not optional.
+ */
+export declare function chatBackgroundExtremes(paint: ChatScreenPaint, variant: ChatBackgroundVariant): {
+    lightest: string;
+    darkest: string;
+};
+/**
+ * The tile the `pattern` wallpaper repeats: four glyphs written directly in tile
+ * coordinates (0–{@link CHAT_PATTERN_TILE}) rather than placed with transforms.
+ * `react-native-svg`'s per-element transform props are deprecated and the string
+ * form has to agree across two renderers; baked coordinates have nothing to
+ * disagree about.
+ */
+export declare const CHAT_PATTERN_GLYPHS: readonly string[];
+/**
+ * The two opaque bubble fills a wallpaper is measured AGAINST: an incoming
+ * bubble (the chrome surface) and an outgoing one (the accent fill).
+ *
+ * Named here rather than inside the gate so the table in `docs/chat-screen.mdx`
+ * and the number the test asserts come from ONE definition — a gate that picks
+ * its own reference surfaces is measuring the gate.
+ *
+ * The FLOATING surfaces (the date pill, the two jump buttons) are deliberately
+ * NOT in this set, and that is not an exemption: their separation from a
+ * wallpaper reaches 1.00 in the worst case — a dark patterned wallpaper is the
+ * pill's own surface colour — which is exactly why every one of them carries a
+ * 1px `floatingBorder` hairline. A bubble has no such rule to fall back on, so
+ * it is the thing the extremes have to clear.
+ */
+export declare function chatBackgroundReferenceSurfaces(paint: ChatScreenPaint): string[];
+/** A URL/URI string that needs no `ImageResolver`. */
+export declare function isUrl(value: string): boolean;
+/**
+ * Turns the `string | ImageSourcePropType` a caller may pass into something RN's
+ * `Image` accepts, sending a bare ID through the registered `ImageResolver`.
+ * `Avatar` already does this for itself, so this is for the plain images —
+ * covers, pin thumbnails, the wallpaper.
+ */
+export declare function useResolvedImageSource(source: string | ImageSourcePropType | null | undefined, variant?: string): ImageSourcePropType | undefined;
+/** Default English strings. Every one of them is overridable by a prop. */
+export declare const CHAT_SCREEN_LABELS: {
+    readonly back: "Back";
+    readonly call: "Call";
+    readonly videoCall: "Video call";
+    readonly search: "Search in conversation";
+    readonly more: "More options";
+    readonly connecting: "Connecting…";
+    readonly verified: "Verified";
+    readonly bot: "Bot";
+    readonly channel: "Channel";
+    readonly clearSelection: "Clear selection";
+    readonly forward: "Forward";
+    readonly delete: "Delete";
+    readonly copy: "Copy";
+    readonly pin: "Pin";
+    readonly pinnedList: "Show pinned messages";
+    readonly pinnedClose: "Hide the pinned bar";
+    readonly pinnedUnpin: "Unpin this message";
+    readonly pinnedSingle: "Pinned message";
+    readonly scrollToBottom: "Scroll to latest messages";
+    readonly jumpToMention: "Jump to mention";
+    readonly emptyTitle: "No messages yet";
+    readonly info: "Info";
+    readonly close: "Close";
+    readonly members: "Members";
+    readonly addMember: "Add members";
+    readonly memberSearch: "Search members";
+    readonly noMembers: "No members found";
+    readonly owner: "Owner";
+    readonly admin: "Admin";
+    readonly resizeList: "Resize the conversation list";
+};
+/** `"Pinned message"` for one pin, `"Pinned message #2"` for several. */
+export declare function formatPinTitle(index: number, total: number): string;
+/** `"3 selected"`. */
+export declare function formatSelectedCount(count: number): string;
+/**
+ * A `data-*` attribute for the web only, as react-native-web's `dataSet` prop —
+ * a browser hook for a puppeteer gate to read, and nothing native has to carry.
+ */
+export declare function dataHook(name: string, value?: string): Record<string, unknown>;
+/** Clamps `value` into `[min, max]`, tolerating a reversed or absent range. */
+export declare function clamp(value: number, min: number, max: number): number;
+//# sourceMappingURL=shared.d.ts.map

package/lib/typescript/module/chat-screen/shared.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared.d.ts","sourceRoot":"","sources":["../../../../src/chat-screen/shared.ts"],"names":[],"mappings":"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"}

package/lib/typescript/module/chat-screen/types.d.ts

@@ -0,0 +1,422 @@
+import type { ReactNode } from 'react';
+import type { ImageSourcePropType, StyleProp, TextStyle, ViewStyle } from 'react-native';
+import type { PresenceStatus } from '../chat-indicators/types';
+import type { ChatIconComponent } from '../chat-indicators/types';
+export type { ChatIconComponent };
+/**
+ * The small glyph after the title. `verified` is the accent badge, `bot` and
+ * `channel` are quiet secondary glyphs — a bot is not an endorsement, so it is
+ * deliberately NOT painted in the accent.
+ */
+export type ChatHeaderMarker = 'verified' | 'bot' | 'channel';
+/** How loud the status line is. `accent` is for "online"; `muted` for the rest. */
+export type ChatHeaderStatusTone = 'muted' | 'accent';
+export interface ChatHeaderProps {
+    /** The conversation's name. */
+    title: string;
+    /** The glyph after the title. Omit for a plain title. */
+    marker?: ChatHeaderMarker;
+    /**
+     * Names the marker for assistive tech. Defaults to "Verified" / "Bot" /
+     * "Channel" — pass a translated one. An empty string hides the glyph, for a
+     * header whose own text already says it.
+     */
+    markerLabel?: string;
+    /**
+     * The second line: `"online"`, `"last seen recently"`,
+     * `"5 members, 2 online"`. A pre-formatted STRING — nothing here reads a
+     * clock or counts a roster.
+     */
+    status?: string;
+    /** `accent` for a live status, `muted` (default) for everything else. */
+    statusTone?: ChatHeaderStatusTone;
+    /**
+     * "Ana is typing…". Drawn as `TypingDots` with this as its label, and it WINS
+     * over {@link ChatHeaderProps.status} — someone typing is newer news than
+     * when they were last seen.
+     */
+    typingLabel?: string;
+    /**
+     * The transport is down. Replaces both of the above — a "last seen" line
+     * rendered while the socket is closed is a claim the app cannot currently
+     * make.
+     */
+    connecting?: boolean;
+    /** The text of the connecting line. Default `"Connecting…"`. */
+    connectingLabel?: string;
+    /**
+     * The identity mark. Pass a node for a group (an `AvatarGroup`, a stacked
+     * pair); omit it and the header builds an `AvatarPresence` from
+     * `avatarSource` / `avatarName` / `presence`.
+     */
+    avatar?: ReactNode;
+    /** A URL, an `ImageResolver` id, or an RN image source. */
+    avatarSource?: string | ImageSourcePropType | null;
+    /** Initials fallback and the avatar's tint seed. Defaults to `title`. */
+    avatarName?: string;
+    /** Draws a presence dot on the avatar. */
+    presence?: PresenceStatus;
+    /** Names the presence dot. Default: the English word for the status. */
+    presenceLabel?: string;
+    /** Avatar diameter. Default `40`. */
+    avatarSize?: number;
+    /** Back navigation. Drawn on the compact layout only (see `showBack`). */
+    onPressBack?: () => void;
+    /**
+     * Forces the back button on or off. Default: on when `onPressBack` is set AND
+     * the header is compact (below `lg`, or on native, where there is no
+     * persistent list pane to go back TO on screen).
+     */
+    showBack?: boolean;
+    /** Names the back button. Default `"Back"`. */
+    backLabel?: string;
+    /** Opens the info panel. Wraps the avatar + title block in a button. */
+    onPressHeader?: () => void;
+    /** Names that button. Defaults to `title`. */
+    openInfoLabel?: string;
+    onPressCall?: () => void;
+    onPressVideoCall?: () => void;
+    onPressSearch?: () => void;
+    onPressMore?: () => void;
+    callLabel?: string;
+    videoCallLabel?: string;
+    searchLabel?: string;
+    moreLabel?: string;
+    /**
+     * Replaces the "more" button — return your own trigger (a `DropdownMenu`
+     * wrapping one, say). The menu's CONTENTS are the app's, so the header never
+     * owns them.
+     */
+    renderMore?: () => ReactNode;
+    /** Extra controls, after the built-in ones. */
+    actions?: ReactNode;
+    /**
+     * Selection mode. Any value above `0` REPLACES the whole header: the identity
+     * block, the status line and every call/search control go away, and the row
+     * becomes a count plus the actions below. The two cannot coexist — a call
+     * button next to "3 selected" is an invitation to lose a selection.
+     */
+    selectionCount?: number;
+    /** Leaves selection mode. */
+    onClearSelection?: () => void;
+    onForward?: () => void;
+    onDelete?: () => void;
+    onCopy?: () => void;
+    onPin?: () => void;
+    clearSelectionLabel?: string;
+    forwardLabel?: string;
+    deleteLabel?: string;
+    copyLabel?: string;
+    pinLabel?: string;
+    /** Replaces the built-in selection actions entirely. */
+    selectionActions?: ReactNode;
+    /** The count line. Default `` `${n} selected` ``. */
+    formatSelectionCount?: (count: number) => string;
+    /**
+     * Forces the compact layout (back button, tighter gutters). Default: derived
+     * from the window width against `CHAT_COMPACT_BREAKPOINT`, and always `true`
+     * on native.
+     */
+    compact?: boolean;
+    /** Draws the bottom hairline. Default `true`. */
+    divider?: boolean;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+export interface ChatPinnedMessage {
+    /** Stable key, and what `onPressPin` reports. */
+    id: string;
+    /** The message's one-line preview. */
+    preview: string;
+    /** Who wrote it, drawn before the preview. Optional. */
+    author?: string;
+    /** A thumbnail for a media message: a URL, an `ImageResolver` id or a source. */
+    thumbnail?: string | ImageSourcePropType | null;
+}
+export interface PinnedMessageBarProps {
+    /** The pinned messages, newest last. Empty renders NOTHING. */
+    pins: ChatPinnedMessage[];
+    /** Which one is shown. Clamped into range. Default `0`. */
+    index?: number;
+    /** Jump to the pinned message. */
+    onPressPin?: (pin: ChatPinnedMessage, index: number) => void;
+    /** Opens the full list of pins. Omit to hide the list button. */
+    onPressList?: () => void;
+    /** Closes the bar, or unpins — `dismissIcon` says which. Omit to hide it. */
+    onDismiss?: () => void;
+    /** `close` (default) hides the bar; `unpin` removes the pin. */
+    dismissIcon?: 'close' | 'unpin';
+    /**
+     * The title line. Default: `"Pinned message"` for a single pin and
+     * `` `Pinned message #${index + 1}` `` for several.
+     */
+    formatTitle?: (index: number, total: number) => string;
+    listLabel?: string;
+    dismissLabel?: string;
+    /** Names the jump button. Default: the title line plus the preview. */
+    accessibilityLabel?: string;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * `plain` — the page colour. `pattern` — a repeated glyph tile drawn in SVG and
+ * tinted from the theme. `gradient` — a two-stop wash off the accent ramp.
+ * `image` — a consumer image under a dimming overlay.
+ */
+export type ChatBackgroundVariant = 'plain' | 'pattern' | 'gradient' | 'image';
+export interface ChatBackgroundProps {
+    /** Default `plain`. */
+    variant?: ChatBackgroundVariant;
+    /** The wallpaper image. `variant="image"` only. */
+    source?: string | ImageSourcePropType | null;
+    /**
+     * How hard the image is dimmed, `0`–`1`. Default `0.55` in light, `0.62` in
+     * dark. This is what keeps an unknown photo from swallowing a bubble, so
+     * lowering it is a legibility decision, not a taste one.
+     */
+    overlayOpacity?: number;
+    /** Overrides the pattern's ink. Default: a faint step off the neutral ramp. */
+    tint?: string;
+    /** The pattern's opacity. Default `0.5`. */
+    patternOpacity?: number;
+    /** Overrides the gradient stops. 2+ colours. */
+    colors?: string[];
+    /** The transcript. Drawn above the wallpaper. */
+    children?: ReactNode;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+export interface ScrollToBottomButtonProps {
+    /** `false` renders NOTHING — no hidden button parked in the focus order. */
+    visible?: boolean;
+    /** Unread messages below the fold. `0` draws no badge. */
+    unreadCount?: number;
+    /** Above this the badge reads `"99+"`. Default `99`. */
+    badgeMax?: number;
+    onPress?: () => void;
+    /**
+     * Names the button. Default `"Scroll to latest messages"`; the unread count
+     * is announced by the badge, which carries its own name.
+     */
+    accessibilityLabel?: string;
+    /** Diameter. Default `44`. */
+    size?: number;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+export interface JumpToMentionButtonProps extends Omit<ScrollToBottomButtonProps, 'unreadCount' | 'accessibilityLabel'> {
+    /** How many mentions are waiting. `0` draws no badge. */
+    count?: number;
+    /** Default `"Jump to mention"`. */
+    accessibilityLabel?: string;
+}
+/**
+ * `floating` (default) pins the pill over the transcript; `inline` puts it in
+ * flow, as a separator between two days.
+ */
+export type ChatDateHeaderPlacement = 'floating' | 'inline';
+export interface ChatDateHeaderProps {
+    /** Pre-formatted: `"Today"`, `"Yesterday"`, `"14 March"`. */
+    label: string;
+    /**
+     * Default `true`. `false` fades the pill to nothing and takes it out of the
+     * accessibility tree; it is not focusable either way, so it stays mounted and
+     * the label never re-announces as it fades.
+     */
+    visible?: boolean;
+    /** Default `floating`. */
+    placement?: ChatDateHeaderPlacement;
+    /** Distance from the top of the transcript, `floating` only. Default `8`. */
+    offset?: number;
+    style?: StyleProp<ViewStyle>;
+    textStyle?: StyleProp<TextStyle>;
+    testID?: string;
+}
+export interface ChatEmptyStateProps {
+    /** Default `"No messages yet"`. */
+    title?: string;
+    /** The line under it. Optional. */
+    description?: string;
+    /** An illustration, a large avatar, anything. Drawn above the title. */
+    illustration?: ReactNode;
+    /**
+     * The notice under the block — "Messages are end-to-end encrypted", say.
+     * There is NO default: a security claim is the app's to make, and a component
+     * that ships one by default makes it on behalf of apps that cannot keep it.
+     */
+    notice?: string;
+    /**
+     * The glyph before the notice. Defaults to a padlock when `notice` is set;
+     * `false` draws none.
+     */
+    noticeIcon?: ChatIconComponent | false;
+    /** A call to action under the notice — a Button, a Chip row. */
+    action?: ReactNode;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/** `pane` is the desktop right-hand column; `screen` is the mobile full page. */
+export type ChatInfoPanelVariant = 'pane' | 'screen';
+/** One tile in the panel's action row. */
+export interface ChatInfoAction {
+    key: string;
+    label: string;
+    icon: ChatIconComponent;
+    onPress?: () => void;
+    /** `negative` paints it in the error colour. Default `default`. */
+    tone?: 'default' | 'negative';
+    disabled?: boolean;
+    /** Names it when the visible label is not enough. */
+    accessibilityLabel?: string;
+}
+/** One pane of the shared-content strip. The GRID inside it is the caller's. */
+export interface ChatInfoTab {
+    value: string;
+    label: string;
+    icon?: ChatIconComponent;
+    /** Drawn as a count beside the label. `0` draws nothing. */
+    count?: number;
+    content?: ReactNode;
+}
+/** `owner` and `admin` draw a badge; `member` draws none. */
+export type ChatMemberRole = 'owner' | 'admin' | 'member';
+export interface ChatMember {
+    id: string;
+    name: string;
+    /** A URL, an `ImageResolver` id or an RN image source. */
+    source?: string | ImageSourcePropType | null;
+    status?: PresenceStatus;
+    role?: ChatMemberRole;
+    /** The second line — a handle, "last seen recently", a phone number. */
+    subtitle?: string;
+}
+export interface ChatMemberRowProps {
+    member: ChatMember;
+    onPress?: (member: ChatMember) => void;
+    /** The badge text per role. Default `{ owner: 'Owner', admin: 'Admin' }`. */
+    roleLabels?: Partial<Record<ChatMemberRole, string>>;
+    /** Avatar diameter. Default `40`. */
+    avatarSize?: number;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+export interface ChatInfoPanelProps {
+    /** Default `pane`. */
+    variant?: ChatInfoPanelVariant;
+    /** Pane width. Default `380`. Ignored by `screen`. */
+    width?: number;
+    /** The panel's own title bar text. Default `"Info"`. */
+    title?: string;
+    /** Closes the panel. Omit to hide the close button. */
+    onClose?: () => void;
+    closeLabel?: string;
+    /** Extra controls in the title bar (an edit button, a menu trigger). */
+    headerActions?: ReactNode;
+    /**
+     * A cover image behind the identity block — a group photo, a banner. Pass a
+     * node for full control, or `coverSource` for the plain case.
+     */
+    cover?: ReactNode;
+    coverSource?: string | ImageSourcePropType | null;
+    /** Cover height. Default `160`. */
+    coverHeight?: number;
+    /** Replaces the built-in avatar. */
+    avatar?: ReactNode;
+    avatarSource?: string | ImageSourcePropType | null;
+    presence?: PresenceStatus;
+    /** Avatar diameter. Default `96` (`72` over a cover). */
+    avatarSize?: number;
+    name?: string;
+    /** `@handle`, a phone number — drawn under the name. */
+    handle?: string;
+    /** A short description. */
+    bio?: string;
+    /** A third line under the bio — "last seen recently", "created 12 March". */
+    meta?: string;
+    /** The action row. Empty or omitted draws no row. */
+    actions?: ChatInfoAction[];
+    /**
+     * The settings block. A SLOT, not a schema: a notifications switch, a
+     * disappearing-messages picker and a theme row each need state and semantics
+     * the panel cannot own. Compose it from `SettingsListGroup` /
+     * `SettingsListItem` — `docs/chat-screen.mdx` has the worked example.
+     */
+    settings?: ReactNode;
+    /** Heading above the settings block. */
+    settingsTitle?: string;
+    /** Shared content. The panes' contents come from the caller. */
+    tabs?: ChatInfoTab[];
+    /** Controlled selected tab. */
+    tab?: string;
+    onTabChange?: (value: string) => void;
+    /** Uncontrolled initial tab. Defaults to the first tab. */
+    defaultTab?: string;
+    /** The roster. Empty or omitted draws no members section. */
+    members?: ChatMember[];
+    membersTitle?: string;
+    onPressMember?: (member: ChatMember) => void;
+    roleLabels?: Partial<Record<ChatMemberRole, string>>;
+    /** Draws the roster search field. Default: `true` once there are 8+ members. */
+    memberSearch?: boolean;
+    /**
+     * Controlled search text. WITH it the panel filters nothing — the caller owns
+     * the result set (a server search, a fuzzy match). WITHOUT it the panel keeps
+     * its own query and filters by name.
+     */
+    memberQuery?: string;
+    onMemberQueryChange?: (query: string) => void;
+    memberSearchPlaceholder?: string;
+    /** Adds the "Add members" row. */
+    onAddMember?: () => void;
+    addMemberLabel?: string;
+    /** Drawn when the roster (or the filtered roster) is empty. */
+    membersEmptyLabel?: string;
+    /** Leave / Block / Report. Painted in the negative tone, at the bottom. */
+    destructiveActions?: ChatInfoAction[];
+    /** Anything else, appended after the destructive rows. */
+    children?: ReactNode;
+    /** The panel scrolls its own content. Default `true`. */
+    scrollable?: boolean;
+    style?: StyleProp<ViewStyle>;
+    contentStyle?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/** Which single pane a narrow layout shows. */
+export type ChatPane = 'list' | 'conversation' | 'info';
+export interface ChatSplitLayoutProps {
+    /** The conversation list. */
+    list: ReactNode;
+    /** The conversation itself. */
+    children: ReactNode;
+    /** The info panel. Omit for two panes. */
+    info?: ReactNode;
+    /**
+     * Which pane a NARROW layout shows. Default `conversation`. Asking for
+     * `info` with no `info` node falls back to the conversation rather than
+     * rendering an empty screen.
+     */
+    pane?: ChatPane;
+    /** Controlled list-pane width. */
+    listWidth?: number;
+    /** Reported while the grip is dragged and when it is released. */
+    onListWidthChange?: (width: number) => void;
+    /** Uncontrolled starting width. Default `340`. */
+    defaultListWidth?: number;
+    /** Default `280`. */
+    minWidth?: number;
+    /** Default `480`. */
+    maxWidth?: number;
+    /** Info pane width. Default `380`. */
+    infoWidth?: number;
+    /** Draws the resize grip. Default `true`. */
+    resizable?: boolean;
+    /** Names the grip. Default `"Resize the conversation list"`. */
+    resizeLabel?: string;
+    /** Below this width the layout shows one pane. Default `900`. */
+    breakpoint?: number;
+    /** Forces the one-pane layout. Default: measured, seeded from the window. */
+    compact?: boolean;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+//# sourceMappingURL=types.d.ts.map