stream-chat-react 14.11.1 → 15.0.0-rc.1

package/dist/es/components/ChannelListItem/utils.a11y.mjs

@@ -0,0 +1,135 @@
+import { getDateString } from "../../i18n/utils.mjs";
+import { activeLabelPart, composeAccessibleLabel, unreadCountLabelPart } from "../../a11y/accessibleLabel.mjs";
+import { MessageDeliveryStatus } from "./hooks/useMessageDeliveryStatus.mjs";
+import { getLatestMessagePreviewText } from "./utils.mjs";
+import { convertTimestampToDate } from "stream-chat";
+//#region src/components/ChannelListItem/utils.a11y.ts
+/**
+* The default, named label parts. Each is independently overridable via
+* {@link ChannelListItemLabelConfig.parts}. The active (currently open) state is announced here (not
+* left to the row's `aria-selected` alone, which is not reliably spoken across screen readers for an
+* option with a custom name); `aria-selected` is kept on the active row for listbox semantics.
+*/
+var defaultChannelListItemLabelParts = {
+	active: activeLabelPart,
+	attachments: ({ latestMessage, t }) => {
+		const count = latestMessage?.attachments?.filter((attachment) => !attachment.og_scrape_url).length ?? 0;
+		if (count === 0 || count === 1 && !latestMessage?.text) return void 0;
+		return t("channelListItem.attachmentCount.ariaLabel", {
+			count,
+			defaultValue_one: "{{ count }} attachment",
+			defaultValue_other: "{{ count }} attachments"
+		});
+	},
+	deliveryStatus: ({ messageDeliveryStatus, t }) => {
+		if (!messageDeliveryStatus) return void 0;
+		return t("channelListItem.deliveryStatus.ariaLabel", "Delivery status: {{ deliveryStatus }}", { deliveryStatus: {
+			[MessageDeliveryStatus.SENT]: t("channelListItem.sent.ariaLabel", "Sent"),
+			[MessageDeliveryStatus.DELIVERED]: t("channelListItem.delivered.ariaLabel", "Delivered"),
+			[MessageDeliveryStatus.READ]: t("channelListItem.read.ariaLabel", "Read")
+		}[messageDeliveryStatus] });
+	},
+	lastMessage: ({ channel, client, isMessageAIGenerated, latestMessage, t, userLanguage }) => {
+		const preview = getLatestMessagePreviewText(channel, t, userLanguage, isMessageAIGenerated, latestMessage);
+		if (!latestMessage) return preview;
+		const sender = !!client.userID && latestMessage.user?.id === client.userID ? t("common.you.label", "You") : latestMessage.user?.name;
+		return sender ? t("channelListItem.lastMessage.withSenderAndMessagePreview.ariaLabel", "Last message from {{ sender }}: {{ messagePreview }}", {
+			messagePreview: preview,
+			sender
+		}) : t("channelListItem.lastMessage.withMessagePreview.ariaLabel", "Last message: {{ messagePreview }}", { messagePreview: preview });
+	},
+	linkPreview: ({ latestMessage, t }) => {
+		const link = latestMessage?.attachments?.find((attachment) => attachment.og_scrape_url);
+		if (!link) return void 0;
+		return link.title ? t("channelListItem.sharedLinkTitle.ariaLabel", "Shared a link with title: {{ linkTitle }}", { linkTitle: link.title }) : t("channelListItem.sharedLink.ariaLabel", "Shared a link");
+	},
+	name: ({ displayTitle }) => displayTitle || void 0,
+	time: ({ latestMessage, t, tDateTimeParser }) => {
+		const createdAt = latestMessage?.created_at;
+		if (createdAt == null) return void 0;
+		const when = getDateString({
+			messageCreatedAt: convertTimestampToDate(createdAt)?.toISOString(),
+			t,
+			tDateTimeParser,
+			timestampTranslationKey: "timestamp.ChannelPreviewTimestamp"
+		});
+		return when ? t("common.lastActivity.ariaLabel", "Last activity: {{ time }}", { time: String(when) }) : void 0;
+	},
+	unreadCount: unreadCountLabelPart
+};
+/** Default order the parts are assembled in (reading order). */
+var DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER = [
+	"name",
+	"active",
+	"unreadCount",
+	"lastMessage",
+	"attachments",
+	"linkPreview",
+	"deliveryStatus",
+	"time"
+];
+/**
+* Composes a single, coherent accessible name for a channel list row from named parts. The default
+* reading order is name → unread → last message (sender + preview) → delivery status → time.
+*
+* ## Customizing the label
+*
+* The label is generated by `ChannelListItemUI`, which accepts an `accessibleLabelConfig` prop. To
+* customize it, supply your own `ChannelListItemUI` through `ComponentContext` (the same way the
+* component is overridden) and forward the config — no new plumbing:
+*
+* ```tsx
+* const MyChannelPreview = (props) => (
+*   <DefaultChannelListItemUI {...props} accessibleLabelConfig={accessibleLabelConfig} />
+* );
+* // <ComponentProvider value={{ ChannelListItemUI: MyChannelPreview }}> … </ComponentProvider>
+* ```
+*
+* ### Adding custom parts (e.g. Pinned, Muted, Frozen)
+*
+* - {@link ChannelListItemLabelConfig.parts} is merged over {@link defaultChannelListItemLabelParts},
+*   so a new key is *added* and a same-named key *overrides* the default.
+* - A part returns its segment string, or `undefined`/`''` to be omitted (so e.g. "Pinned" is only
+*   spoken when actually pinned).
+* - {@link ChannelListItemLabelConfig.order} decides which parts are included AND their sequence —
+*   **a part not listed in `order` is never rendered**, even if defined. Spread
+*   {@link DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER} to keep the defaults and insert your own.
+* - Each part receives {@link ChannelListItemLabelData}. `active`/`unreadCount`/
+*   `messageDeliveryStatus` are passed directly and `latestMessage` is pre-resolved by the composer
+*   (see its doc); everything else (mute/pin state, `frozen`, member count, custom `channel.data`) is
+*   read off `channel`. The SDK does not ship `Pinned`/`Muted`/`Frozen` strings, so return plain
+*   strings or your own keys. `t` only accepts keys in {@link TranslationKey}; wrap your own in
+*   {@link asDynamicKey} (exported from `stream-chat-react`) and pass the English copy as the
+*   second argument, exactly as SDK call sites do.
+*
+* ```tsx
+* const accessibleLabelConfig: ChannelListItemLabelConfig = {
+*   parts: {
+*     pinned: ({ channel, t }) =>
+*       channel.state.membership?.pinned_at
+*         ? t(asDynamicKey('myApp.channelList.pinned'), 'Pinned')
+*         : undefined,
+*     muted: ({ channel, t }) =>
+*       channel.muteStatus().muted
+*         ? t(asDynamicKey('myApp.channelList.muted'), 'Muted')
+*         : undefined,
+*     frozen: ({ channel, t }) =>
+*       channel.data?.frozen ? t(asDynamicKey('myApp.channelList.frozen'), 'Frozen') : undefined,
+*   },
+*   order: ['name', 'pinned', 'muted', 'frozen', ...DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER.slice(1)],
+* };
+* // → "General. Pinned. Muted. 3 unread messages. Last message from Alice: hi. 2 days ago"
+* ```
+*
+* For full control, set {@link ChannelListItemLabelConfig.build} (return the entire string), or
+* write a custom `ChannelListItemUI` that calls this function directly — importing
+* {@link defaultChannelListItemLabelParts} to reuse the built-ins.
+*/
+var composeChannelListItemAccessibleLabel = (data, config = {}) => composeAccessibleLabel({
+	...data,
+	latestMessage: data.latestMessage ?? data.channel.messagePaginator.aggregateState.getLatestValue().lastMessage ?? void 0
+}, defaultChannelListItemLabelParts, DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER, config);
+//#endregion
+export { DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER, composeChannelListItemAccessibleLabel, defaultChannelListItemLabelParts };
+
+//# sourceMappingURL=utils.a11y.mjs.map

package/dist/es/components/ChannelListItem/utils.a11y.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.a11y.mjs","names":[],"sources":["../../../../src/components/ChannelListItem/utils.a11y.ts"],"sourcesContent":["import type { Channel, LocalMessage, StreamChat } from 'stream-chat';\n\nimport type { ChatContextValue } from '../../context';\nimport type { TranslationContextValue } from '../../context/TranslationContext';\nimport {\n  type AccessibleLabelConfig,\n  type AccessibleLabelPart,\n  activeLabelPart,\n  composeAccessibleLabel,\n  unreadCountLabelPart,\n} from '../../a11y/accessibleLabel';\nimport { getDateString } from '../../i18n/utils';\nimport { MessageDeliveryStatus } from './hooks/useMessageDeliveryStatus';\nimport { getLatestMessagePreviewText } from './utils';\nimport { convertTimestampToDate } from 'stream-chat';\n\n/**\n * Everything a label part needs. Gathered by `ChannelListItemUI` from its props + contexts and\n * handed to each {@link ChannelListItemLabelPart}.\n */\nexport type ChannelListItemLabelData = {\n  /** Whether the row is the active (currently open) channel. */\n  active?: boolean;\n  /** The channel whose latest message is summarized. */\n  channel: Channel;\n  /** Client, used to detect whether the latest message is the current user's own. */\n  client: StreamChat;\n  /** Channel display name. */\n  displayTitle?: string;\n  isMessageAIGenerated?: ChatContextValue['isMessageAIGenerated'];\n  /**\n   * The channel's latest message. {@link composeChannelListItemAccessibleLabel} resolves this once\n   * (to the last entry of `channel.state.latestMessages` when omitted) and passes the SAME message\n   * to every part, so all segments (sender, preview, attachments, time) describe one message.\n   */\n  latestMessage?: LocalMessage;\n  /** Delivery/read status of the latest message when it is the current user's own. */\n  messageDeliveryStatus?: MessageDeliveryStatus;\n  t: TranslationContextValue['t'];\n  tDateTimeParser: TranslationContextValue['tDateTimeParser'];\n  /** Unread count for the channel. */\n  unreadCount?: number;\n  userLanguage?: TranslationContextValue['userLanguage'];\n};\n\n/** Produces one segment of the accessible name; return `undefined`/empty to omit it. */\nexport type ChannelListItemLabelPart = AccessibleLabelPart<ChannelListItemLabelData>;\n\n/**\n * The default, named label parts. Each is independently overridable via\n * {@link ChannelListItemLabelConfig.parts}. The active (currently open) state is announced here (not\n * left to the row's `aria-selected` alone, which is not reliably spoken across screen readers for an\n * option with a custom name); `aria-selected` is kept on the active row for listbox semantics.\n */\nexport const defaultChannelListItemLabelParts = {\n  active: activeLabelPart,\n  // Announced alongside the last message text: the number of attachments. Link previews are\n  // excluded (the linkPreview part announces those). A single attachment with no text is skipped\n  // here because the lastMessage part already conveys it as \"Attachment <type>\".\n  attachments: ({ latestMessage, t }) => {\n    const count =\n      latestMessage?.attachments?.filter((attachment) => !attachment.og_scrape_url)\n        .length ?? 0;\n    if (count === 0 || (count === 1 && !latestMessage?.text)) return undefined;\n    return t('channelListItem.attachmentCount.ariaLabel', {\n      count,\n      defaultValue_one: '{{ count }} attachment',\n      defaultValue_other: '{{ count }} attachments',\n    });\n  },\n  deliveryStatus: ({ messageDeliveryStatus, t }) => {\n    if (!messageDeliveryStatus) return undefined;\n    const statusLabelByStatus: Record<MessageDeliveryStatus, string> = {\n      [MessageDeliveryStatus.SENT]: t('channelListItem.sent.ariaLabel', 'Sent'),\n      [MessageDeliveryStatus.DELIVERED]: t(\n        'channelListItem.delivered.ariaLabel',\n        'Delivered',\n      ),\n      [MessageDeliveryStatus.READ]: t('channelListItem.read.ariaLabel', 'Read'),\n    };\n    return t(\n      'channelListItem.deliveryStatus.ariaLabel',\n      'Delivery status: {{ deliveryStatus }}',\n      {\n        deliveryStatus: statusLabelByStatus[messageDeliveryStatus],\n      },\n    );\n  },\n  lastMessage: ({\n    channel,\n    client,\n    isMessageAIGenerated,\n    latestMessage,\n    t,\n    userLanguage,\n  }) => {\n    const preview = getLatestMessagePreviewText(\n      channel,\n      t,\n      userLanguage,\n      isMessageAIGenerated,\n      // `latestMessage` is pre-resolved by the composer, so the announced preview describes the same\n      // message as the sender/status/time segments.\n      latestMessage,\n    );\n    // Empty channel: announce there are no messages (\"Nothing yet...\").\n    if (!latestMessage) return preview;\n    const isOwn = !!client.userID && latestMessage.user?.id === client.userID;\n    // Use the sender's name (or \"You\" for the current user). When the name is unknown we omit the\n    // sender rather than reading out a raw user id.\n    const sender = isOwn ? t('common.you.label', 'You') : latestMessage.user?.name;\n    return sender\n      ? t(\n          'channelListItem.lastMessage.withSenderAndMessagePreview.ariaLabel',\n          'Last message from {{ sender }}: {{ messagePreview }}',\n          {\n            messagePreview: preview,\n            sender,\n          },\n        )\n      : t(\n          'channelListItem.lastMessage.withMessagePreview.ariaLabel',\n          'Last message: {{ messagePreview }}',\n          { messagePreview: preview },\n        );\n  },\n  linkPreview: ({ latestMessage, t }) => {\n    const link = latestMessage?.attachments?.find(\n      (attachment) => attachment.og_scrape_url,\n    );\n    if (!link) return undefined;\n    return link.title\n      ? t(\n          'channelListItem.sharedLinkTitle.ariaLabel',\n          'Shared a link with title: {{ linkTitle }}',\n          { linkTitle: link.title },\n        )\n      : t('channelListItem.sharedLink.ariaLabel', 'Shared a link');\n  },\n  name: ({ displayTitle }) => displayTitle || undefined,\n  time: ({ latestMessage, t, tDateTimeParser }) => {\n    const createdAt = latestMessage?.created_at;\n    if (createdAt == null) return undefined;\n    const when = getDateString({\n      messageCreatedAt: convertTimestampToDate(createdAt)?.toISOString(),\n      t,\n      tDateTimeParser,\n      timestampTranslationKey: 'timestamp.ChannelPreviewTimestamp',\n    });\n    // Prefix the time so it is clearly its own segment (not read as part of the preceding\n    // delivery-status segment).\n    return when\n      ? t('common.lastActivity.ariaLabel', 'Last activity: {{ time }}', {\n          time: String(when),\n        })\n      : undefined;\n  },\n  unreadCount: unreadCountLabelPart,\n} satisfies Record<string, ChannelListItemLabelPart>;\n\n/** Default order the parts are assembled in (reading order). */\nexport const DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER = [\n  'name',\n  'active',\n  'unreadCount',\n  'lastMessage',\n  'attachments',\n  'linkPreview',\n  'deliveryStatus',\n  'time',\n] as const;\n\nexport type ChannelListItemLabelConfig = AccessibleLabelConfig<ChannelListItemLabelData>;\n\n/**\n * Composes a single, coherent accessible name for a channel list row from named parts. The default\n * reading order is name → unread → last message (sender + preview) → delivery status → time.\n *\n * ## Customizing the label\n *\n * The label is generated by `ChannelListItemUI`, which accepts an `accessibleLabelConfig` prop. To\n * customize it, supply your own `ChannelListItemUI` through `ComponentContext` (the same way the\n * component is overridden) and forward the config — no new plumbing:\n *\n * ```tsx\n * const MyChannelPreview = (props) => (\n *   <DefaultChannelListItemUI {...props} accessibleLabelConfig={accessibleLabelConfig} />\n * );\n * // <ComponentProvider value={{ ChannelListItemUI: MyChannelPreview }}> … </ComponentProvider>\n * ```\n *\n * ### Adding custom parts (e.g. Pinned, Muted, Frozen)\n *\n * - {@link ChannelListItemLabelConfig.parts} is merged over {@link defaultChannelListItemLabelParts},\n *   so a new key is *added* and a same-named key *overrides* the default.\n * - A part returns its segment string, or `undefined`/`''` to be omitted (so e.g. \"Pinned\" is only\n *   spoken when actually pinned).\n * - {@link ChannelListItemLabelConfig.order} decides which parts are included AND their sequence —\n *   **a part not listed in `order` is never rendered**, even if defined. Spread\n *   {@link DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER} to keep the defaults and insert your own.\n * - Each part receives {@link ChannelListItemLabelData}. `active`/`unreadCount`/\n *   `messageDeliveryStatus` are passed directly and `latestMessage` is pre-resolved by the composer\n *   (see its doc); everything else (mute/pin state, `frozen`, member count, custom `channel.data`) is\n *   read off `channel`. The SDK does not ship `Pinned`/`Muted`/`Frozen` strings, so return plain\n *   strings or your own keys. `t` only accepts keys in {@link TranslationKey}; wrap your own in\n *   {@link asDynamicKey} (exported from `stream-chat-react`) and pass the English copy as the\n *   second argument, exactly as SDK call sites do.\n *\n * ```tsx\n * const accessibleLabelConfig: ChannelListItemLabelConfig = {\n *   parts: {\n *     pinned: ({ channel, t }) =>\n *       channel.state.membership?.pinned_at\n *         ? t(asDynamicKey('myApp.channelList.pinned'), 'Pinned')\n *         : undefined,\n *     muted: ({ channel, t }) =>\n *       channel.muteStatus().muted\n *         ? t(asDynamicKey('myApp.channelList.muted'), 'Muted')\n *         : undefined,\n *     frozen: ({ channel, t }) =>\n *       channel.data?.frozen ? t(asDynamicKey('myApp.channelList.frozen'), 'Frozen') : undefined,\n *   },\n *   order: ['name', 'pinned', 'muted', 'frozen', ...DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER.slice(1)],\n * };\n * // → \"General. Pinned. Muted. 3 unread messages. Last message from Alice: hi. 2 days ago\"\n * ```\n *\n * For full control, set {@link ChannelListItemLabelConfig.build} (return the entire string), or\n * write a custom `ChannelListItemUI` that calls this function directly — importing\n * {@link defaultChannelListItemLabelParts} to reuse the built-ins.\n */\nexport const composeChannelListItemAccessibleLabel = (\n  data: ChannelListItemLabelData,\n  config: ChannelListItemLabelConfig = {},\n): string =>\n  composeAccessibleLabel(\n    // Resolve the latest message ONCE here so every part is handed the same message (sender,\n    // preview, attachments, link, time all stay in sync) instead of each re-deriving the channel's\n    // latest — which only stayed consistent as long as the duplicated fallbacks matched.\n    {\n      ...data,\n      latestMessage:\n        data.latestMessage ??\n        data.channel.messagePaginator.aggregateState.getLatestValue().lastMessage ??\n        undefined,\n    },\n    defaultChannelListItemLabelParts,\n    DEFAULT_CHANNEL_LIST_ITEM_LABEL_ORDER,\n    config,\n  );\n"],"mappings":";;;;;;;;;;;;AAsDA,IAAa,mCAAmC;CAC9C,QAAQ;CAIR,cAAc,EAAE,eAAe,QAAQ;EACrC,MAAM,QACJ,eAAe,aAAa,QAAQ,eAAe,CAAC,WAAW,aAAa,CAAC,CAC1E,UAAU;EACf,IAAI,UAAU,KAAM,UAAU,KAAK,CAAC,eAAe,MAAO,OAAO,KAAA;EACjE,OAAO,EAAE,6CAA6C;GACpD;GACA,kBAAkB;GAClB,oBAAoB;EACtB,CAAC;CACH;CACA,iBAAiB,EAAE,uBAAuB,QAAQ;EAChD,IAAI,CAAC,uBAAuB,OAAO,KAAA;EASnC,OAAO,EACL,4CACA,yCACA,EACE,gBAAgB;IAXjB,sBAAsB,OAAO,EAAE,kCAAkC,MAAM;IACvE,sBAAsB,YAAY,EACjC,uCACA,WACF;IACC,sBAAsB,OAAO,EAAE,kCAAkC,MAAM;EAMtD,EAAoB,uBACtC,CACF;CACF;CACA,cAAc,EACZ,SACA,QACA,sBACA,eACA,GACA,mBACI;EACJ,MAAM,UAAU,4BACd,SACA,GACA,cACA,sBAGA,aACF;EAEA,IAAI,CAAC,eAAe,OAAO;EAI3B,MAAM,SAHQ,CAAC,CAAC,OAAO,UAAU,cAAc,MAAM,OAAO,OAAO,SAG5C,EAAE,oBAAoB,KAAK,IAAI,cAAc,MAAM;EAC1E,OAAO,SACH,EACE,qEACA,wDACA;GACE,gBAAgB;GAChB;EACF,CACF,IACA,EACE,4DACA,sCACA,EAAE,gBAAgB,QAAQ,CAC5B;CACN;CACA,cAAc,EAAE,eAAe,QAAQ;EACrC,MAAM,OAAO,eAAe,aAAa,MACtC,eAAe,WAAW,aAC7B;EACA,IAAI,CAAC,MAAM,OAAO,KAAA;EAClB,OAAO,KAAK,QACR,EACE,6CACA,6CACA,EAAE,WAAW,KAAK,MAAM,CAC1B,IACA,EAAE,wCAAwC,eAAe;CAC/D;CACA,OAAO,EAAE,mBAAmB,gBAAgB,KAAA;CAC5C,OAAO,EAAE,eAAe,GAAG,sBAAsB;EAC/C,MAAM,YAAY,eAAe;EACjC,IAAI,aAAa,MAAM,OAAO,KAAA;EAC9B,MAAM,OAAO,cAAc;GACzB,kBAAkB,uBAAuB,SAAS,CAAC,EAAE,YAAY;GACjE;GACA;GACA,yBAAyB;EAC3B,CAAC;EAGD,OAAO,OACH,EAAE,iCAAiC,6BAA6B,EAC9D,MAAM,OAAO,IAAI,EACnB,CAAC,IACD,KAAA;CACN;CACA,aAAa;AACf;;AAGA,IAAa,wCAAwC;CACnD;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6DA,IAAa,yCACX,MACA,SAAqC,CAAC,MAEtC,uBAIE;CACE,GAAG;CACH,eACE,KAAK,iBACL,KAAK,QAAQ,iBAAiB,eAAe,eAAe,CAAC,CAAC,eAC9D,KAAA;AACJ,GACA,kCACA,uCACA,MACF"}

package/dist/es/components/ChannelListItem/utils.mjs

@@ -0,0 +1,196 @@
+import { extractDisplayInfo } from "../Avatar/utils.mjs";
+import { getTranslatedMessageText } from "../../context/MessageTranslationViewContext.mjs";
+import { isMessageDeleted } from "../Message/utils.mjs";
+import { htmlToTextPlugin } from "../Message/renderText/remarkPlugins/htmlToTextPlugin.mjs";
+import { imageToLink } from "../Message/renderText/remarkPlugins/imageToLink.mjs";
+import { plusPlusToEmphasis } from "../Message/renderText/remarkPlugins/plusPlusToEmphasis.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+import ReactMarkdown from "react-markdown";
+import { toString } from "mdast-util-to-string";
+import remarkParse from "remark-parse";
+import { unified } from "unified";
+import remarkGfm from "remark-gfm";
+//#region src/components/ChannelListItem/utils.tsx
+var remarkPlugins = [
+	htmlToTextPlugin,
+	[remarkGfm, { singleTilde: false }],
+	plusPlusToEmphasis,
+	imageToLink
+];
+var renderPreviewText = (text) => /* @__PURE__ */ jsx(ReactMarkdown, {
+	remarkPlugins,
+	skipHtml: true,
+	children: text
+});
+var createPlainTextProcessor = () => unified().use(remarkParse).use(remarkPlugins);
+var plainTextProcessor;
+var stripMarkdownToText = (text) => {
+	try {
+		const processor = plainTextProcessor ??= createPlainTextProcessor();
+		return toString(processor.runSync(processor.parse(text))) || text;
+	} catch {
+		return text;
+	}
+};
+var getLatestPollVote = (latestVotesByOption) => {
+	let latestVote;
+	for (const optionVotes of Object.values(latestVotesByOption)) optionVotes.forEach((vote) => {
+		if (latestVote && latestVote.updated_at >= vote.created_at) return;
+		latestVote = vote;
+	});
+	return latestVote;
+};
+/**
+* Resolves the channel's latest-message preview once: the localized DISPLAY string, a `kind`
+* discriminant, and the bits announcements need (poll question, attachment type). Single source of
+* truth for the display variant ({@link getLatestMessagePreview}) and the announcement variant
+* ({@link getLatestMessagePreviewText}), so the translation lookup and branching run once per call.
+*/
+var getLatestMessagePreviewParts = (channel, t, userLanguage = "en", latestMessageArg) => {
+	const latestMessage = latestMessageArg ?? channel.messagePaginator.aggregateState.getLatestValue().lastMessage ?? void 0;
+	const previewTextToRender = getTranslatedMessageText({
+		language: userLanguage,
+		message: latestMessage
+	}) || latestMessage?.text;
+	const poll = latestMessage?.poll;
+	if (!latestMessage) return {
+		isUserMessageText: false,
+		kind: "empty",
+		latestMessage,
+		text: t("common.nothingYet.text", "Nothing yet...")
+	};
+	if (isMessageDeleted(latestMessage)) return {
+		isUserMessageText: false,
+		kind: "deleted",
+		latestMessage,
+		text: t("common.messageDeleted.text", "Message deleted")
+	};
+	if (poll) if (!poll.vote_count) {
+		const createdBy = poll.created_by?.id === channel.getClient().userID ? t("common.you.label", "You") : poll.created_by?.name ?? t("common.poll.label", "Poll");
+		return {
+			isUserMessageText: false,
+			kind: "poll",
+			latestMessage,
+			pollName: poll.name,
+			text: t("channelListItem.created.text", "📊 {{createdBy}} created: {{ pollName}}", {
+				createdBy,
+				pollName: poll.name
+			})
+		};
+	} else {
+		const latestVote = getLatestPollVote(poll.latest_votes_by_option);
+		const option = latestVote && poll.options.find((opt) => opt.id === latestVote.option_id);
+		if (option && latestVote) return {
+			isUserMessageText: false,
+			kind: "poll",
+			latestMessage,
+			pollName: poll.name,
+			text: t("channelListItem.voted.text", "📊 {{votedBy}} voted: {{pollOptionText}}", {
+				pollOptionText: option.text,
+				votedBy: latestVote?.user?.id === channel.getClient().userID ? t("common.you.label", "You") : latestVote.user?.name ?? t("common.poll.label", "Poll")
+			})
+		};
+	}
+	if (previewTextToRender) return {
+		isUserMessageText: true,
+		kind: "text",
+		latestMessage,
+		text: previewTextToRender
+	};
+	if (latestMessage.command) return {
+		isUserMessageText: false,
+		kind: "command",
+		latestMessage,
+		text: `/${latestMessage.command}`
+	};
+	if (latestMessage.attachments?.length) return {
+		isUserMessageText: false,
+		kind: "attachment",
+		latestMessage,
+		text: t("channelListItem.attachment.text", "🏙 Attachment...")
+	};
+	if (latestMessage.shared_location) return {
+		isUserMessageText: false,
+		kind: "location",
+		latestMessage,
+		text: t("channelListItem.sharedLocation.text", "📍Shared location")
+	};
+	return {
+		isUserMessageText: false,
+		kind: "text",
+		latestMessage,
+		text: t("common.emptyMessage.text", "Empty message...")
+	};
+};
+/**
+* Maps a known attachment `type` to a localized, human-readable word (e.g. "image" → "Image"). The
+* cases are literal `t()` calls so the catalog generator sees them -- `i18next-cli` and the `aria/`
+* prefix are both gone. Unknown/custom types return `undefined`, so the announcement falls back to a
+* generic "Attachment".
+*/
+var getAttachmentTypeLabel = (type, t) => {
+	switch (type) {
+		case "audio": return t("channelListItem.audio.ariaLabel", "audio");
+		case "file": return t("channelListItem.file.ariaLabel", "file");
+		case "giphy": return t("channelListItem.gif.ariaLabel", "GIF");
+		case "image": return t("channelListItem.image.ariaLabel", "image");
+		case "video": return t("channelListItem.video.ariaLabel", "video");
+		case "voiceRecording": return t("channelListItem.voiceMessage.ariaLabel", "voice message");
+		default: return;
+	}
+};
+/**
+* The text announced for the channel's latest message (for an accessible name / live region).
+* Non-text content gets a concise, screen-reader-friendly phrasing that may differ from the visible
+* preview: a poll announces its question, an attachment its type, a shared location and a deleted
+* message a plain phrase. User-message text is stripped of markdown so the words are read, not the
+* syntax (AI-generated text is returned verbatim, matching the display path).
+*/
+var getLatestMessagePreviewText = (channel, t, userLanguage = "en", isMessageAIGenerated, latestMessage) => {
+	const { isUserMessageText, kind, latestMessage: resolvedLatestMessage, pollName, text } = getLatestMessagePreviewParts(channel, t, userLanguage, latestMessage);
+	switch (kind) {
+		case "poll": return t("channelListItem.poll.ariaLabel", "Poll: {{ pollName }}", { pollName: pollName ?? "" });
+		case "attachment": {
+			const realAttachments = resolvedLatestMessage?.attachments?.filter((attachment) => !attachment.og_scrape_url) ?? [];
+			if (realAttachments.length > 1) return t("channelListItem.messageAttachments.ariaLabel", "Message with attachments");
+			const typeLabel = getAttachmentTypeLabel(realAttachments[0]?.type, t);
+			return typeLabel ? t("channelListItem.attachment.withAttachmentType.ariaLabel", "Attachment {{ attachmentType }}", { attachmentType: typeLabel }) : t("channelListItem.attachment.ariaLabel", "Attachment");
+		}
+		case "location": return t("channelListItem.sharedLocation.ariaLabel", "Shared location");
+		case "empty": return t("channelListItem.noMessagesChat.ariaLabel", "There are no messages in this chat.");
+		case "text": return isUserMessageText && resolvedLatestMessage && !isMessageAIGenerated?.(resolvedLatestMessage) ? stripMarkdownToText(text) : text;
+		default: return text;
+	}
+};
+var getLatestMessagePreview = (channel, t, userLanguage = "en", isMessageAIGenerated, latestMessage) => {
+	const { isUserMessageText, latestMessage: resolvedLatestMessage, text } = getLatestMessagePreviewParts(channel, t, userLanguage, latestMessage);
+	return isUserMessageText && resolvedLatestMessage && !isMessageAIGenerated?.(resolvedLatestMessage) ? renderPreviewText(text) : text;
+};
+/**
+* Channel display image: channel.data.custom.image, or for DM (2 members) the other member's user.image.
+*/
+var getChannelDisplayImage = (channel, currentUserId) => {
+	const image = channel.data?.custom?.image;
+	if (image && typeof image === "string") return image;
+	const memberList = Object.values(channel.state.members);
+	if (memberList.length === 2) {
+		const image = memberList.find((m) => m.user?.id !== currentUserId)?.user?.image;
+		if (image && typeof image === "string") return image;
+	}
+};
+var getGroupChannelDisplayInfo = (channel) => {
+	const members = Object.values(channel.state.members);
+	if (members.length <= 2) return;
+	const memberList = [];
+	for (const member of members) {
+		const { user } = member;
+		if (!user?.name && !user?.image) continue;
+		memberList.push(extractDisplayInfo(member));
+	}
+	return { members: memberList };
+};
+//#endregion
+export { getChannelDisplayImage, getGroupChannelDisplayInfo, getLatestMessagePreview, getLatestMessagePreviewText, renderPreviewText };
+
+//# sourceMappingURL=utils.mjs.map

package/dist/es/components/ChannelListItem/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","names":[],"sources":["../../../../src/components/ChannelListItem/utils.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport React from 'react';\nimport ReactMarkdown from 'react-markdown';\nimport type { Channel, LocalMessage, PollVoteResponseData } from 'stream-chat';\nimport { toString as mdastToString } from 'mdast-util-to-string';\nimport remarkParse from 'remark-parse';\nimport { unified } from 'unified';\n\nimport type { ChatContextValue } from '../../context';\nimport { getTranslatedMessageText } from '../../context/MessageTranslationViewContext';\nimport type { TranslationContextValue } from '../../context/TranslationContext';\nimport type { PluggableList } from 'unified';\nimport { htmlToTextPlugin, imageToLink, plusPlusToEmphasis } from '../Message';\nimport { isMessageDeleted } from '../Message/utils';\nimport remarkGfm from 'remark-gfm';\nimport { extractDisplayInfo } from '../Avatar/utils';\n\nconst remarkPlugins: PluggableList = [\n  htmlToTextPlugin,\n  [remarkGfm, { singleTilde: false }],\n  plusPlusToEmphasis,\n  imageToLink,\n];\n\nexport const renderPreviewText = (text: string) => (\n  <ReactMarkdown remarkPlugins={remarkPlugins} skipHtml>\n    {text}\n  </ReactMarkdown>\n);\n\n// Strips markdown to plain text for screen-reader announcements, using the SAME remark plugins as\n// the visible preview so the announced text matches what is shown (e.g. \"**hi**\" -> \"hi\"). The\n// processor is built lazily (not at module load) so importing this file never evaluates\n// `remarkPlugins` — mirroring `renderPreviewText`, and avoiding import-time failures in test files\n// that mock the plugin modules. Falls back to the raw text if processing throws.\nconst createPlainTextProcessor = () => unified().use(remarkParse).use(remarkPlugins);\nlet plainTextProcessor: ReturnType<typeof createPlainTextProcessor> | undefined;\n\nconst stripMarkdownToText = (text: string): string => {\n  try {\n    const processor = (plainTextProcessor ??= createPlainTextProcessor());\n    return mdastToString(processor.runSync(processor.parse(text))) || text;\n  } catch {\n    return text;\n  }\n};\n\nconst getLatestPollVote = (\n  latestVotesByOption: Record<string, PollVoteResponseData[]>,\n) => {\n  let latestVote: PollVoteResponseData | undefined;\n  for (const optionVotes of Object.values(latestVotesByOption)) {\n    optionVotes.forEach((vote) => {\n      if (latestVote && latestVote.updated_at >= vote.created_at) return;\n      latestVote = vote;\n    });\n  }\n\n  return latestVote;\n};\n\ntype LatestMessagePreviewKind =\n  | 'attachment'\n  | 'command'\n  | 'deleted'\n  | 'empty'\n  | 'location'\n  | 'poll'\n  | 'text';\n\ntype LatestMessagePreviewParts = {\n  /**\n   * True only for the plain user-message-text branch — the one the display variant renders as\n   * markdown (unless AI-generated). Every other branch (deleted/poll/attachment/etc.) is a\n   * localized phrase used verbatim.\n   */\n  isUserMessageText: boolean;\n  /** What the latest message is, so consumers can phrase it (display vs. announcement) differently. */\n  kind: LatestMessagePreviewKind;\n  latestMessage?: LocalMessage;\n  /** Poll question, for the `poll` kind. */\n  pollName?: string;\n  /** The localized DISPLAY preview as a plain string. */\n  text: string;\n};\n\n/**\n * Resolves the channel's latest-message preview once: the localized DISPLAY string, a `kind`\n * discriminant, and the bits announcements need (poll question, attachment type). Single source of\n * truth for the display variant ({@link getLatestMessagePreview}) and the announcement variant\n * ({@link getLatestMessagePreviewText}), so the translation lookup and branching run once per call.\n */\nconst getLatestMessagePreviewParts = (\n  channel: Channel,\n  t: TranslationContextValue['t'],\n  userLanguage: TranslationContextValue['userLanguage'] = 'en',\n  latestMessageArg?: LocalMessage,\n): LatestMessagePreviewParts => {\n  // Prefer an explicitly supplied message so the preview stays consistent with the sender/status/\n  // time a caller derives from the same message; fall back to the channel's latest.\n  const latestMessage =\n    latestMessageArg ??\n    channel.messagePaginator.aggregateState.getLatestValue().lastMessage ??\n    undefined;\n\n  const previewTextToRender =\n    getTranslatedMessageText({ language: userLanguage, message: latestMessage }) ||\n    latestMessage?.text;\n  const poll = latestMessage?.poll;\n\n  if (!latestMessage) {\n    return {\n      isUserMessageText: false,\n      kind: 'empty',\n      latestMessage,\n      text: t('common.nothingYet.text', 'Nothing yet...'),\n    };\n  }\n\n  if (isMessageDeleted(latestMessage)) {\n    return {\n      isUserMessageText: false,\n      kind: 'deleted',\n      latestMessage,\n      text: t('common.messageDeleted.text', 'Message deleted'),\n    };\n  }\n\n  if (poll) {\n    if (!poll.vote_count) {\n      const createdBy =\n        poll.created_by?.id === channel.getClient().userID\n          ? t('common.you.label', 'You')\n          : (poll.created_by?.name ?? t('common.poll.label', 'Poll'));\n      return {\n        isUserMessageText: false,\n        kind: 'poll',\n        latestMessage,\n        pollName: poll.name,\n        text: t(\n          'channelListItem.created.text',\n          '📊 {{createdBy}} created: {{ pollName}}',\n          {\n            createdBy,\n            pollName: poll.name,\n          },\n        ),\n      };\n    } else {\n      const latestVote = getLatestPollVote(\n        poll.latest_votes_by_option as Record<string, PollVoteResponseData[]>,\n      );\n      const option =\n        latestVote && poll.options.find((opt) => opt.id === latestVote.option_id);\n\n      if (option && latestVote) {\n        return {\n          isUserMessageText: false,\n          kind: 'poll',\n          latestMessage,\n          pollName: poll.name,\n          text: t(\n            'channelListItem.voted.text',\n            '📊 {{votedBy}} voted: {{pollOptionText}}',\n            {\n              pollOptionText: option.text,\n              votedBy:\n                latestVote?.user?.id === channel.getClient().userID\n                  ? t('common.you.label', 'You')\n                  : (latestVote.user?.name ?? t('common.poll.label', 'Poll')),\n            },\n          ),\n        };\n      }\n    }\n  }\n\n  if (previewTextToRender) {\n    return {\n      isUserMessageText: true,\n      kind: 'text',\n      latestMessage,\n      text: previewTextToRender,\n    };\n  }\n\n  if (latestMessage.command) {\n    return {\n      isUserMessageText: false,\n      kind: 'command',\n      latestMessage,\n      text: `/${latestMessage.command}`,\n    };\n  }\n\n  if (latestMessage.attachments?.length) {\n    return {\n      isUserMessageText: false,\n      kind: 'attachment',\n      latestMessage,\n      text: t('channelListItem.attachment.text', '🏙 Attachment...'),\n    };\n  }\n\n  if (latestMessage.shared_location) {\n    return {\n      isUserMessageText: false,\n      kind: 'location',\n      latestMessage,\n      text: t('channelListItem.sharedLocation.text', '📍Shared location'),\n    };\n  }\n\n  return {\n    isUserMessageText: false,\n    kind: 'text',\n    latestMessage,\n    text: t('common.emptyMessage.text', 'Empty message...'),\n  };\n};\n\n/**\n * Maps a known attachment `type` to a localized, human-readable word (e.g. \"image\" → \"Image\"). The\n * cases are literal `t()` calls so the catalog generator sees them -- `i18next-cli` and the `aria/`\n * prefix are both gone. Unknown/custom types return `undefined`, so the announcement falls back to a\n * generic \"Attachment\".\n */\nconst getAttachmentTypeLabel = (\n  type: string | undefined,\n  t: TranslationContextValue['t'],\n): string | undefined => {\n  switch (type) {\n    case 'audio':\n      return t('channelListItem.audio.ariaLabel', 'audio');\n    case 'file':\n      return t('channelListItem.file.ariaLabel', 'file');\n    case 'giphy':\n      return t('channelListItem.gif.ariaLabel', 'GIF');\n    case 'image':\n      return t('channelListItem.image.ariaLabel', 'image');\n    case 'video':\n      return t('channelListItem.video.ariaLabel', 'video');\n    case 'voiceRecording':\n      return t('channelListItem.voiceMessage.ariaLabel', 'voice message');\n    default:\n      return undefined;\n  }\n};\n\n/**\n * The text announced for the channel's latest message (for an accessible name / live region).\n * Non-text content gets a concise, screen-reader-friendly phrasing that may differ from the visible\n * preview: a poll announces its question, an attachment its type, a shared location and a deleted\n * message a plain phrase. User-message text is stripped of markdown so the words are read, not the\n * syntax (AI-generated text is returned verbatim, matching the display path).\n */\nexport const getLatestMessagePreviewText = (\n  channel: Channel,\n  t: TranslationContextValue['t'],\n  userLanguage: TranslationContextValue['userLanguage'] = 'en',\n  isMessageAIGenerated?: ChatContextValue['isMessageAIGenerated'],\n  latestMessage?: LocalMessage,\n): string => {\n  const {\n    isUserMessageText,\n    kind,\n    latestMessage: resolvedLatestMessage,\n    pollName,\n    text,\n  } = getLatestMessagePreviewParts(channel, t, userLanguage, latestMessage);\n\n  switch (kind) {\n    case 'poll':\n      return t('channelListItem.poll.ariaLabel', 'Poll: {{ pollName }}', {\n        pollName: pollName ?? '',\n      });\n    case 'attachment': {\n      // Link previews are announced separately (see the `linkPreview` label part); decide by the\n      // count of real attachments. Multiple → a generic phrase (the count is announced alongside);\n      // a single one → its localized type.\n      const realAttachments =\n        resolvedLatestMessage?.attachments?.filter(\n          (attachment) => !attachment.og_scrape_url,\n        ) ?? [];\n      if (realAttachments.length > 1)\n        return t(\n          'channelListItem.messageAttachments.ariaLabel',\n          'Message with attachments',\n        );\n      const typeLabel = getAttachmentTypeLabel(realAttachments[0]?.type, t);\n      return typeLabel\n        ? t(\n            'channelListItem.attachment.withAttachmentType.ariaLabel',\n            'Attachment {{ attachmentType }}',\n            { attachmentType: typeLabel },\n          )\n        : t('channelListItem.attachment.ariaLabel', 'Attachment');\n    }\n    case 'location':\n      return t('channelListItem.sharedLocation.ariaLabel', 'Shared location');\n    case 'empty':\n      // The visible preview says \"Nothing yet...\"; spell it out for assistive tech.\n      return t(\n        'channelListItem.noMessagesChat.ariaLabel',\n        'There are no messages in this chat.',\n      );\n    case 'text':\n      // `resolvedLatestMessage` guard is redundant at runtime (isUserMessageText implies it) but\n      // narrows the optional type for `isMessageAIGenerated`.\n      return isUserMessageText &&\n        resolvedLatestMessage &&\n        !isMessageAIGenerated?.(resolvedLatestMessage)\n        ? stripMarkdownToText(text)\n        : text;\n    default:\n      // 'deleted' (\"Message deleted\") and 'command' (\"/cmd\") read as-is.\n      return text;\n  }\n};\n\nexport const getLatestMessagePreview = (\n  channel: Channel,\n  t: TranslationContextValue['t'],\n  userLanguage: TranslationContextValue['userLanguage'] = 'en',\n  isMessageAIGenerated?: ChatContextValue['isMessageAIGenerated'],\n  latestMessage?: LocalMessage,\n): ReactNode => {\n  const {\n    isUserMessageText,\n    latestMessage: resolvedLatestMessage,\n    text,\n  } = getLatestMessagePreviewParts(channel, t, userLanguage, latestMessage);\n\n  // Only the plain user-message text is rendered as markdown — unless it is AI-generated, which is\n  // returned verbatim. Every other branch is a localized phrase used as-is. (guard is redundant at\n  // runtime but narrows the optional type for `isMessageAIGenerated`.)\n  return isUserMessageText &&\n    resolvedLatestMessage &&\n    !isMessageAIGenerated?.(resolvedLatestMessage)\n    ? renderPreviewText(text)\n    : text;\n};\n\nexport type GroupChannelDisplayInfoMember = {\n  imageUrl?: string;\n  userName?: string;\n};\n\nexport type GroupChannelDisplayInfo = {\n  members: GroupChannelDisplayInfoMember[];\n  /** When members.length > 4, count for the \"+N\" badge (members.length - 2). */\n  overflowCount?: number;\n};\n\n/**\n * Channel display image: channel.data.custom.image, or for DM (2 members) the other member's user.image.\n */\nexport const getChannelDisplayImage = (\n  channel: Channel,\n  currentUserId?: string,\n): string | undefined => {\n  const image = channel.data?.custom?.image;\n  if (image && typeof image === 'string') return image;\n\n  const memberList = Object.values(channel.state.members);\n  if (memberList.length === 2) {\n    const other = memberList.find((m) => m.user?.id !== currentUserId);\n    const image = other?.user?.image;\n    if (image && typeof image === 'string') return image;\n  }\n  return undefined;\n};\n\nexport const getGroupChannelDisplayInfo = (\n  channel: Channel,\n): GroupChannelDisplayInfo | undefined => {\n  const members = Object.values(channel.state.members);\n  if (members.length <= 2) return;\n\n  const memberList: GroupChannelDisplayInfoMember[] = [];\n  for (const member of members) {\n    const { user } = member;\n\n    if (!user?.name && !user?.image) continue;\n\n    memberList.push(extractDisplayInfo(member));\n  }\n  return {\n    members: memberList,\n  };\n};\n"],"mappings":"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"}

package/dist/es/components/Chat/Chat.mjs

@@ -0,0 +1,89 @@
+import { ChatProvider } from "../../context/ChatContext.mjs";
+import { useComponentContext } from "../../context/ComponentContext.mjs";
+import { useOpenedDialogCount } from "../Dialog/hooks/useDialog.mjs";
+import { ModalDialogManagerProvider, modalDialogManagerId } from "../../context/DialogManagerContext.mjs";
+import { TranslationProvider } from "../../context/TranslationContext.mjs";
+import { AriaLiveAnnouncerProvider } from "../Accessibility/AriaLiveAnnouncerProvider.mjs";
+import { AriaLiveOutlet } from "../Accessibility/AriaLiveOutlet.mjs";
+import { NotificationConfigurationProvider } from "../Notifications/NotificationConfigurationContext.mjs";
+import { getNotificationTargetPanels } from "../Notifications/notificationTarget.mjs";
+import { NotificationAnnouncer } from "../Accessibility/NotificationAnnouncer.mjs";
+import { useStreami18n } from "../../i18n/useStreami18n.mjs";
+import { SharedAudioPlaybackProvider } from "../AudioPlayback/WithAudioPlayback.mjs";
+import { useChat } from "./hooks/useChat.mjs";
+import { useReportLostConnectionSystemNotification } from "./hooks/useReportLostConnectionSystemNotification.mjs";
+import { useCreateChatContext } from "./hooks/useCreateChatContext.mjs";
+import { useMemo } from "react";
+import { ChannelSearchSource, MessageSearchSource, SearchController, UserSearchSource } from "stream-chat";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Chat/Chat.tsx
+var NetworkConnectionNotificationReporter = () => {
+	useReportLostConnectionSystemNotification();
+	return null;
+};
+var createDefaultNotificationDisplayFilter = (modalManagerHasOpenDialog) => ({ notification, panel }) => {
+	if (getNotificationTargetPanels(notification).includes("modal")) {
+		if (modalManagerHasOpenDialog) return panel === "modal";
+		return panel !== "modal";
+	}
+	if (!modalManagerHasOpenDialog) return true;
+	return panel === "modal";
+};
+var ModalNotificationConfiguration = ({ children, notificationDisplayFilter }) => {
+	const modalManagerHasOpenDialog = useOpenedDialogCount({ dialogManagerId: modalDialogManagerId }) > 0;
+	return /* @__PURE__ */ jsx(NotificationConfigurationProvider, {
+		displayFilter: useMemo(() => notificationDisplayFilter ?? createDefaultNotificationDisplayFilter(modalManagerHasOpenDialog), [modalManagerHasOpenDialog, notificationDisplayFilter]),
+		children
+	});
+};
+/**
+* Wrapper component for a StreamChat application. Chat needs to be placed around any other chat components
+* as it provides the ChatContext.
+*/
+var Chat = (props) => {
+	const { children, client, customClasses, i18nInstance, isMessageAIGenerated, notificationDisplayFilter, searchController: customChannelSearchController, theme = "messaging light", useImageFlagEmojisOnWindows = false } = props;
+	const { getAppSettings, mutes } = useChat({ client });
+	const translators = useStreami18n({
+		client,
+		i18nInstance
+	});
+	const searchController = useMemo(() => customChannelSearchController ?? new SearchController({
+		client,
+		sources: [
+			new ChannelSearchSource(client),
+			new UserSearchSource(client),
+			new MessageSearchSource(client)
+		]
+	}), [client, customChannelSearchController]);
+	const chatContextValue = useCreateChatContext({
+		channelManager: client.channelManager,
+		client,
+		customClasses,
+		getAppSettings,
+		isMessageAIGenerated,
+		mutes,
+		searchController,
+		theme,
+		useImageFlagEmojisOnWindows
+	});
+	const { NotificationAnnouncer: NotificationAnnouncer$1 = NotificationAnnouncer } = useComponentContext();
+	return /* @__PURE__ */ jsx(ChatProvider, {
+		value: chatContextValue,
+		children: /* @__PURE__ */ jsx(TranslationProvider, {
+			value: translators,
+			children: /* @__PURE__ */ jsx(AriaLiveAnnouncerProvider, { children: /* @__PURE__ */ jsx(ModalDialogManagerProvider, { children: /* @__PURE__ */ jsxs(ModalNotificationConfiguration, {
+				notificationDisplayFilter,
+				children: [
+					/* @__PURE__ */ jsx(NetworkConnectionNotificationReporter, {}),
+					/* @__PURE__ */ jsx(NotificationAnnouncer$1, {}),
+					/* @__PURE__ */ jsx(SharedAudioPlaybackProvider, { children }),
+					/* @__PURE__ */ jsx(AriaLiveOutlet, { portal: true })
+				]
+			}) }) })
+		})
+	});
+};
+//#endregion
+export { Chat };
+
+//# sourceMappingURL=Chat.mjs.map

package/dist/es/components/Chat/Chat.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chat.mjs","names":[],"sources":["../../../../src/components/Chat/Chat.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport React, { useMemo } from 'react';\nimport type { StreamChat } from 'stream-chat';\nimport {\n  ChannelSearchSource,\n  MessageSearchSource,\n  SearchController,\n  UserSearchSource,\n} from 'stream-chat';\n\nimport {\n  AriaLiveAnnouncerProvider,\n  AriaLiveOutlet,\n  NotificationAnnouncer as DefaultNotificationAnnouncer,\n} from '../Accessibility';\nimport { useOpenedDialogCount } from '../Dialog';\nimport {\n  getNotificationTargetPanels,\n  NotificationConfigurationProvider,\n  type NotificationDisplayFilter,\n} from '../Notifications';\nimport { useChat } from './hooks/useChat';\nimport { useStreami18n } from '../../i18n/useStreami18n';\nimport { useReportLostConnectionSystemNotification } from './hooks/useReportLostConnectionSystemNotification';\nimport { useCreateChatContext } from './hooks/useCreateChatContext';\nimport type { CustomClasses } from '../../context/ChatContext';\nimport { SharedAudioPlaybackProvider } from '../AudioPlayback/WithAudioPlayback';\nimport { ChatProvider } from '../../context/ChatContext';\nimport { useComponentContext } from '../../context/ComponentContext';\nimport { TranslationProvider } from '../../context/TranslationContext';\nimport {\n  type MessageContextValue,\n  modalDialogManagerId,\n  ModalDialogManagerProvider,\n} from '../../context';\nimport type { Streami18n } from '../../i18n/Streami18n';\n\nconst NetworkConnectionNotificationReporter = () => {\n  useReportLostConnectionSystemNotification();\n  return null;\n};\n\nconst createDefaultNotificationDisplayFilter =\n  (modalManagerHasOpenDialog: boolean): NotificationDisplayFilter =>\n  ({ notification, panel }) => {\n    const targetPanels = getNotificationTargetPanels(notification);\n\n    if (targetPanels.includes('modal')) {\n      // While a modal is open, keep modal-tagged notifications inside it (not behind it).\n      if (modalManagerHasOpenDialog) return panel === 'modal';\n      // The modal that emitted this notification has since closed — a common shape is a dialog that\n      // closes optimistically and only then emits a confirmation (e.g. \"Poll sent\"). Its `modal`\n      // NotificationList is already unmounted, so without a fallback the notification would be a\n      // dead letter (announced by the aria-live announcer, but rendered nowhere). Fall back to its\n      // other target panel(s): panel routing has already matched `panel` to one of the\n      // notification's targets, so any non-`modal` panel reaching here is a valid home.\n      return panel !== 'modal';\n    }\n\n    if (!modalManagerHasOpenDialog) return true;\n\n    return panel === 'modal';\n  };\n\nconst ModalNotificationConfiguration = ({\n  children,\n  notificationDisplayFilter,\n}: PropsWithChildren<{\n  notificationDisplayFilter?: NotificationDisplayFilter;\n}>) => {\n  const openedModalDialogCount = useOpenedDialogCount({\n    dialogManagerId: modalDialogManagerId,\n  });\n  const modalManagerHasOpenDialog = openedModalDialogCount > 0;\n  const displayFilter = useMemo<NotificationDisplayFilter>(\n    () =>\n      notificationDisplayFilter ??\n      createDefaultNotificationDisplayFilter(modalManagerHasOpenDialog),\n    [modalManagerHasOpenDialog, notificationDisplayFilter],\n  );\n\n  return (\n    <NotificationConfigurationProvider displayFilter={displayFilter}>\n      {children}\n    </NotificationConfigurationProvider>\n  );\n};\n\nexport type ChatProps = {\n  /** The StreamChat client object */\n  client: StreamChat;\n  /** Object containing custom CSS classnames to override the library's default container CSS */\n  customClasses?: CustomClasses;\n  /** Instance of Stream i18n */\n  i18nInstance?: Streami18n;\n  /** Instance of SearchController class that allows to control all the search operations. */\n  searchController?: SearchController;\n  /** Controls whether a notification can be displayed by a NotificationList. */\n  notificationDisplayFilter?: NotificationDisplayFilter;\n  /** Used for injecting className/s to the Channel and ChannelList components */\n  theme?: string;\n  /**\n   * Windows 10 does not support country flag emojis out of the box. It chooses to render these emojis as characters instead. Stream\n   * Chat can override this behavior by loading a custom web font that will render images instead (PNGs or SVGs depending on the platform).\n   * Set this prop to true if you want to use these custom emojis for Windows users.\n   *\n   * Note: requires importing `stream-chat-react/css/v2/emoji-replacement.css` style sheet\n   */\n  useImageFlagEmojisOnWindows?: boolean;\n} & Partial<Pick<MessageContextValue, 'isMessageAIGenerated'>>;\n\n/**\n * Wrapper component for a StreamChat application. Chat needs to be placed around any other chat components\n * as it provides the ChatContext.\n */\nexport const Chat = (props: PropsWithChildren<ChatProps>) => {\n  const {\n    children,\n    client,\n    customClasses,\n    i18nInstance,\n    isMessageAIGenerated,\n    notificationDisplayFilter,\n    searchController: customChannelSearchController,\n    theme = 'messaging light',\n    useImageFlagEmojisOnWindows = false,\n  } = props;\n\n  const { getAppSettings, mutes } = useChat({ client });\n  const translators = useStreami18n({ client, i18nInstance });\n\n  const searchController = useMemo(\n    () =>\n      customChannelSearchController ??\n      new SearchController({\n        client,\n        sources: [\n          new ChannelSearchSource(client),\n          new UserSearchSource(client),\n          new MessageSearchSource(client),\n        ],\n      }),\n    [client, customChannelSearchController],\n  );\n\n  const chatContextValue = useCreateChatContext({\n    channelManager: client.channelManager,\n    client,\n    customClasses,\n    getAppSettings,\n    isMessageAIGenerated,\n    mutes,\n    searchController,\n    theme,\n    useImageFlagEmojisOnWindows,\n  });\n  const { NotificationAnnouncer = DefaultNotificationAnnouncer } = useComponentContext();\n\n  return (\n    <ChatProvider value={chatContextValue}>\n      <TranslationProvider value={translators}>\n        <AriaLiveAnnouncerProvider>\n          <ModalDialogManagerProvider>\n            <ModalNotificationConfiguration\n              notificationDisplayFilter={notificationDisplayFilter}\n            >\n              <NetworkConnectionNotificationReporter />\n              <NotificationAnnouncer />\n              <SharedAudioPlaybackProvider>{children}</SharedAudioPlaybackProvider>\n              <AriaLiveOutlet portal />\n            </ModalNotificationConfiguration>\n          </ModalDialogManagerProvider>\n        </AriaLiveAnnouncerProvider>\n      </TranslationProvider>\n    </ChatProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAqCA,IAAM,8CAA8C;CAClD,0CAA0C;CAC1C,OAAO;AACT;AAEA,IAAM,0CACH,+BACA,EAAE,cAAc,YAAY;CAG3B,IAFqB,4BAA4B,YAE7C,CAAA,CAAa,SAAS,OAAO,GAAG;EAElC,IAAI,2BAA2B,OAAO,UAAU;EAOhD,OAAO,UAAU;CACnB;CAEA,IAAI,CAAC,2BAA2B,OAAO;CAEvC,OAAO,UAAU;AACnB;AAEF,IAAM,kCAAkC,EACtC,UACA,gCAGK;CAIL,MAAM,4BAHyB,qBAAqB,EAClD,iBAAiB,qBACnB,CACkC,IAAyB;CAQ3D,OACE,oBAAC,mCAAD;EAAkD,eAR9B,cAElB,6BACA,uCAAuC,yBAAyB,GAClE,CAAC,2BAA2B,yBAAyB,CAIH;EAC/C;CACgC,CAAA;AAEvC;;;;;AA6BA,IAAa,QAAQ,UAAwC;CAC3D,MAAM,EACJ,UACA,QACA,eACA,cACA,sBACA,2BACA,kBAAkB,+BAClB,QAAQ,mBACR,8BAA8B,UAC5B;CAEJ,MAAM,EAAE,gBAAgB,UAAU,QAAQ,EAAE,OAAO,CAAC;CACpD,MAAM,cAAc,cAAc;EAAE;EAAQ;CAAa,CAAC;CAE1D,MAAM,mBAAmB,cAErB,iCACA,IAAI,iBAAiB;EACnB;EACA,SAAS;GACP,IAAI,oBAAoB,MAAM;GAC9B,IAAI,iBAAiB,MAAM;GAC3B,IAAI,oBAAoB,MAAM;EAChC;CACF,CAAC,GACH,CAAC,QAAQ,6BAA6B,CACxC;CAEA,MAAM,mBAAmB,qBAAqB;EAC5C,gBAAgB,OAAO;EACvB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CACD,MAAM,EAAE,uBAAA,0BAAwB,0BAAiC,oBAAoB;CAErF,OACE,oBAAC,cAAD;EAAc,OAAO;YACnB,oBAAC,qBAAD;GAAqB,OAAO;aAC1B,oBAAC,2BAAD,EAAA,UACE,oBAAC,4BAAD,EAAA,UACE,qBAAC,gCAAD;IAC6B;cAD7B;KAGE,oBAAC,uCAAD,CAAwC,CAAA;KACxC,oBAAC,yBAAD,CAAwB,CAAA;KACxB,oBAAC,6BAAD,EAA8B,SAAsC,CAAA;KACpE,oBAAC,gBAAD,EAAgB,QAAA,KAAQ,CAAA;IACM;MACN,CAAA,EACH,CAAA;EACR,CAAA;CACT,CAAA;AAElB"}

package/dist/es/components/Chat/hooks/useChat.mjs

@@ -0,0 +1,44 @@
+import { useEffect, useRef, useState } from "react";
+//#region src/components/Chat/hooks/useChat.ts
+var useChat = ({ client }) => {
+	const [mutes, setMutes] = useState([]);
+	const clientMutes = client.user?.mutes ?? [];
+	const appSettings = useRef(null);
+	const getAppSettings = () => {
+		if (appSettings.current) return appSettings.current;
+		appSettings.current = client.getAppSettings();
+		return appSettings.current;
+	};
+	useEffect(() => {
+		if (!client) return;
+		const version = "15.0.0-rc.1";
+		const userAgent = client.getUserAgent();
+		if (!userAgent.includes("stream-chat-react")) client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
+		client.threads.registerSubscriptions();
+		client.polls.registerSubscriptions();
+		client.reminders.registerSubscriptions();
+		client.reminders.initTimers();
+		return () => {
+			client.threads.unregisterSubscriptions();
+			client.polls.unregisterSubscriptions();
+			client.reminders.unregisterSubscriptions();
+			client.reminders.clearTimers();
+		};
+	}, [client]);
+	useEffect(() => {
+		setMutes(clientMutes);
+		const handleEvent = (event) => {
+			setMutes(event.me.mutes);
+		};
+		const subscription = client.on("notification.mutes_updated", handleEvent);
+		return () => subscription.unsubscribe();
+	}, [clientMutes?.length]);
+	return {
+		getAppSettings,
+		mutes
+	};
+};
+//#endregion
+export { useChat };
+
+//# sourceMappingURL=useChat.mjs.map

package/dist/es/components/Chat/hooks/useChat.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useChat.mjs","names":[],"sources":["../../../../../src/components/Chat/hooks/useChat.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type {\n  EventPayload,\n  OwnUserResponse,\n  StreamChat,\n  UserMuteResponse,\n} from 'stream-chat';\n\nexport type UseChatParams = {\n  client: StreamChat;\n};\n\nexport const useChat = ({ client }: UseChatParams) => {\n  const [mutes, setMutes] = useState<Array<UserMuteResponse>>([]);\n\n  const clientMutes = (client.user as OwnUserResponse)?.mutes ?? [];\n\n  const appSettings = useRef<ReturnType<StreamChat['getAppSettings']> | null>(null);\n\n  const getAppSettings = () => {\n    if (appSettings.current) {\n      return appSettings.current;\n    }\n    appSettings.current = client.getAppSettings();\n    return appSettings.current;\n  };\n\n  useEffect(() => {\n    if (!client) return;\n\n    const version = process.env.STREAM_CHAT_REACT_VERSION;\n\n    const userAgent = client.getUserAgent();\n    if (!userAgent.includes('stream-chat-react')) {\n      // result looks like: 'stream-chat-react-2.3.2-stream-chat-javascript-client-browser-2.2.2'\n      // the upper-case text between double underscores is replaced with the actual semantic version of the library\n      client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);\n    }\n\n    client.threads.registerSubscriptions();\n    client.polls.registerSubscriptions();\n    client.reminders.registerSubscriptions();\n    client.reminders.initTimers();\n\n    return () => {\n      client.threads.unregisterSubscriptions();\n      client.polls.unregisterSubscriptions();\n      client.reminders.unregisterSubscriptions();\n      client.reminders.clearTimers();\n    };\n  }, [client]);\n\n  useEffect(() => {\n    setMutes(clientMutes);\n\n    const handleEvent = (event: EventPayload<'notification.mutes_updated'>) => {\n      setMutes(event.me.mutes);\n    };\n\n    const subscription = client.on('notification.mutes_updated', handleEvent);\n    return () => subscription.unsubscribe();\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [clientMutes?.length]);\n\n  return {\n    getAppSettings,\n    mutes,\n  };\n};\n"],"mappings":";;AAaA,IAAa,WAAW,EAAE,aAA4B;CACpD,MAAM,CAAC,OAAO,YAAY,SAAkC,CAAC,CAAC;CAE9D,MAAM,cAAe,OAAO,MAA0B,SAAS,CAAC;CAEhE,MAAM,cAAc,OAAwD,IAAI;CAEhF,MAAM,uBAAuB;EAC3B,IAAI,YAAY,SACd,OAAO,YAAY;EAErB,YAAY,UAAU,OAAO,eAAe;EAC5C,OAAO,YAAY;CACrB;CAEA,gBAAgB;EACd,IAAI,CAAC,QAAQ;EAEb,MAAM,UAAA;EAEN,MAAM,YAAY,OAAO,aAAa;EACtC,IAAI,CAAC,UAAU,SAAS,mBAAmB,GAGzC,OAAO,aAAa,qBAAqB,QAAQ,GAAG,WAAW;EAGjE,OAAO,QAAQ,sBAAsB;EACrC,OAAO,MAAM,sBAAsB;EACnC,OAAO,UAAU,sBAAsB;EACvC,OAAO,UAAU,WAAW;EAE5B,aAAa;GACX,OAAO,QAAQ,wBAAwB;GACvC,OAAO,MAAM,wBAAwB;GACrC,OAAO,UAAU,wBAAwB;GACzC,OAAO,UAAU,YAAY;EAC/B;CACF,GAAG,CAAC,MAAM,CAAC;CAEX,gBAAgB;EACd,SAAS,WAAW;EAEpB,MAAM,eAAe,UAAsD;GACzE,SAAS,MAAM,GAAG,KAAK;EACzB;EAEA,MAAM,eAAe,OAAO,GAAG,8BAA8B,WAAW;EACxE,aAAa,aAAa,YAAY;CAExC,GAAG,CAAC,aAAa,MAAM,CAAC;CAExB,OAAO;EACL;EACA;CACF;AACF"}

package/dist/es/components/Chat/hooks/useCreateChatClient.mjs

@@ -0,0 +1,36 @@
+import { useEffect, useState } from "react";
+import { StreamChat } from "stream-chat";
+//#region src/components/Chat/hooks/useCreateChatClient.ts
+/**
+* React hook to create, connect and return `StreamChat` client.
+*/
+var useCreateChatClient = ({ apiKey, options, tokenOrProvider, userData }) => {
+	const [chatClient, setChatClient] = useState(null);
+	const [cachedUserData, setCachedUserData] = useState(userData);
+	if (userData.id !== cachedUserData.id) setCachedUserData(userData);
+	const [cachedOptions] = useState(options);
+	useEffect(() => {
+		const client = new StreamChat(apiKey, cachedOptions);
+		let didUserConnectInterrupt = false;
+		const connectionPromise = client.connectUser(cachedUserData, tokenOrProvider).then(() => {
+			if (!didUserConnectInterrupt) setChatClient(client);
+		});
+		return () => {
+			didUserConnectInterrupt = true;
+			setChatClient(null);
+			connectionPromise.then(() => client.disconnectUser()).then(() => {
+				console.log(`Connection for user "${cachedUserData.id}" has been closed`);
+			});
+		};
+	}, [
+		apiKey,
+		cachedUserData,
+		cachedOptions,
+		tokenOrProvider
+	]);
+	return chatClient;
+};
+//#endregion
+export { useCreateChatClient };
+
+//# sourceMappingURL=useCreateChatClient.mjs.map

package/dist/es/components/Chat/hooks/useCreateChatClient.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCreateChatClient.mjs","names":[],"sources":["../../../../../src/components/Chat/hooks/useCreateChatClient.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { StreamChat } from 'stream-chat';\n\nimport type { ClientUser, StreamChatOptions, TokenOrProvider } from 'stream-chat';\n\n/**\n * React hook to create, connect and return `StreamChat` client.\n */\nexport const useCreateChatClient = ({\n  apiKey,\n  options,\n  tokenOrProvider,\n  userData,\n}: {\n  apiKey: string;\n  tokenOrProvider: TokenOrProvider;\n  userData: ClientUser;\n  options?: StreamChatOptions;\n}) => {\n  const [chatClient, setChatClient] = useState<StreamChat | null>(null);\n  const [cachedUserData, setCachedUserData] = useState(userData);\n\n  if (userData.id !== cachedUserData.id) {\n    setCachedUserData(userData);\n  }\n\n  const [cachedOptions] = useState(options);\n\n  useEffect(() => {\n    const client = new StreamChat(apiKey, cachedOptions);\n    let didUserConnectInterrupt = false;\n\n    const connectionPromise = client\n      .connectUser(cachedUserData, tokenOrProvider)\n      .then(() => {\n        if (!didUserConnectInterrupt) setChatClient(client);\n      });\n\n    return () => {\n      didUserConnectInterrupt = true;\n      setChatClient(null);\n      connectionPromise\n        .then(() => client.disconnectUser())\n        .then(() => {\n          console.log(`Connection for user \"${cachedUserData.id}\" has been closed`);\n        });\n    };\n  }, [apiKey, cachedUserData, cachedOptions, tokenOrProvider]);\n\n  return chatClient;\n};\n"],"mappings":";;;;;;AASA,IAAa,uBAAuB,EAClC,QACA,SACA,iBACA,eAMI;CACJ,MAAM,CAAC,YAAY,iBAAiB,SAA4B,IAAI;CACpE,MAAM,CAAC,gBAAgB,qBAAqB,SAAS,QAAQ;CAE7D,IAAI,SAAS,OAAO,eAAe,IACjC,kBAAkB,QAAQ;CAG5B,MAAM,CAAC,iBAAiB,SAAS,OAAO;CAExC,gBAAgB;EACd,MAAM,SAAS,IAAI,WAAW,QAAQ,aAAa;EACnD,IAAI,0BAA0B;EAE9B,MAAM,oBAAoB,OACvB,YAAY,gBAAgB,eAAe,CAAC,CAC5C,WAAW;GACV,IAAI,CAAC,yBAAyB,cAAc,MAAM;EACpD,CAAC;EAEH,aAAa;GACX,0BAA0B;GAC1B,cAAc,IAAI;GAClB,kBACG,WAAW,OAAO,eAAe,CAAC,CAAC,CACnC,WAAW;IACV,QAAQ,IAAI,wBAAwB,eAAe,GAAG,kBAAkB;GAC1E,CAAC;EACL;CACF,GAAG;EAAC;EAAQ;EAAgB;EAAe;CAAe,CAAC;CAE3D,OAAO;AACT"}

package/dist/es/components/Chat/hooks/useCreateChatContext.mjs

@@ -0,0 +1,30 @@
+import { useMemo } from "react";
+//#region src/components/Chat/hooks/useCreateChatContext.ts
+var useCreateChatContext = (value) => {
+	const { channelManager, client, customClasses, getAppSettings, isMessageAIGenerated, mutes, searchController, theme, useImageFlagEmojisOnWindows } = value;
+	const clientValues = `${client.clientID}${Object.keys(client.activeChannels).length}${Object.keys(client.listeners).length}${client.mutedChannels.length}
+  ${client.user?.id}`;
+	const mutedUsersLength = mutes.length;
+	return useMemo(() => ({
+		channelManager,
+		client,
+		customClasses,
+		getAppSettings,
+		isMessageAIGenerated,
+		mutes,
+		searchController,
+		theme,
+		useImageFlagEmojisOnWindows
+	}), [
+		channelManager,
+		clientValues,
+		getAppSettings,
+		searchController,
+		mutedUsersLength,
+		isMessageAIGenerated
+	]);
+};
+//#endregion
+export { useCreateChatContext };
+
+//# sourceMappingURL=useCreateChatContext.mjs.map