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

package/dist/es/components/Search/SearchResults/SearchResultItem.mjs

@@ -0,0 +1,130 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Timestamp } from "../../Message/Timestamp.mjs";
+import { Avatar } from "../../Avatar/Avatar.mjs";
+import { extractDisplayInfo } from "../../Avatar/utils.mjs";
+import { useSearchContext } from "../SearchContext.mjs";
+import { ChannelListItem } from "../../ChannelListItem/ChannelListItem.mjs";
+import { useWorkspaceNavigation } from "../../../context/WorkspaceNavigationContext.mjs";
+import { useCallback, useMemo } from "react";
+import { convertTimestampToDate, formatMessage } from "stream-chat";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchResultItem.tsx
+var messageFocusSignalSelector = (state) => ({ focusedMessageId: state.signal?.messageId });
+var ChannelSearchResultItem = ({ item, onSelect }) => {
+	const { openChannel } = useWorkspaceNavigation();
+	const { channelManager } = useChatContext();
+	return /* @__PURE__ */ jsx(ChannelListItem, {
+		channel: item,
+		className: "str-chat__search-result",
+		onSelect: useCallback((event) => {
+			if (onSelect) {
+				onSelect(event);
+				return;
+			}
+			openChannel(item, { event });
+			channelManager.ingestChannel(item);
+		}, [
+			item,
+			openChannel,
+			channelManager,
+			onSelect
+		])
+	});
+};
+var MessageSearchResultItem = ({ item, onSelect }) => {
+	const { channelManager, client } = useChatContext();
+	const { isChannelActive, openChannel } = useWorkspaceNavigation();
+	const channel = useMemo(() => {
+		const { channel: channelData } = item;
+		const type = channelData?.type ?? "unknown";
+		const id = channelData?.id ?? "unknown";
+		return client.channel(type, id);
+	}, [client, item]);
+	const channelOpenInSlot = isChannelActive(channel?.cid ?? void 0);
+	const { focusedMessageId } = useStateStore(channel?.messagePaginator.messageFocusSignal, messageFocusSignalSelector) ?? { focusedMessageId: void 0 };
+	const handleSelect = useCallback((event) => {
+		if (onSelect) {
+			onSelect(event);
+			return;
+		}
+		if (!channel) return;
+		openChannel(channel, { event });
+		channelManager.ingestChannel(channel);
+		channel.messagePaginator.jumpToMessage(item.id);
+	}, [
+		channel,
+		item,
+		openChannel,
+		channelManager,
+		onSelect
+	]);
+	const previewedMessage = useMemo(() => formatMessage(item), [item]);
+	if (!channel) return null;
+	return /* @__PURE__ */ jsx(ChannelListItem, {
+		active: channelOpenInSlot && focusedMessageId === item.id,
+		channel,
+		className: "str-chat__search-result",
+		onSelect: handleSelect,
+		previewedMessage
+	});
+};
+var UserSearchResultItem = ({ item, onSelect }) => {
+	const { channelManager, client } = useChatContext();
+	const { openChannel } = useWorkspaceNavigation();
+	const { directMessagingChannelType } = useSearchContext();
+	const { t } = useTranslationContext();
+	const { Avatar: Avatar$1 = Avatar, extractDisplayInfo: extractDisplayInfo$1 = extractDisplayInfo } = useComponentContext();
+	const onClick = useCallback((event) => {
+		if (onSelect) {
+			onSelect(event);
+			return;
+		}
+		const newChannel = client.channel(directMessagingChannelType, { members: [{ user_id: client.userId }, { user_id: item.id }] });
+		newChannel.watch();
+		openChannel(newChannel, { event });
+		channelManager.ingestChannel(newChannel);
+	}, [
+		client,
+		item,
+		openChannel,
+		channelManager,
+		directMessagingChannelType,
+		onSelect
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-result-container",
+		children: /* @__PURE__ */ jsxs("button", {
+			"aria-label": t("search.resultItem.selectUserChannel.ariaLabel", "Select User Channel: {{ name }}", { name: item.name || "" }),
+			className: "str-chat__search-result str-chat__search-result--user",
+			"data-testid": "search-result-user",
+			onClick,
+			role: "option",
+			children: [/* @__PURE__ */ jsx(Avatar$1, {
+				...extractDisplayInfo$1({ user: item }),
+				isOnline: item.online,
+				size: "xl"
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "str-chat__search-result-data",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "str-chat__search-result__display-name",
+					children: item.name || item.custom?.username || item.id
+				}), /* @__PURE__ */ jsx(Timestamp, {
+					customClass: "str-chat__search-result__last-active-timestamp",
+					timestamp: convertTimestampToDate(item.last_active)
+				})]
+			})]
+		})
+	});
+};
+var DefaultSearchResultItems = {
+	channels: ChannelSearchResultItem,
+	messages: MessageSearchResultItem,
+	users: UserSearchResultItem
+};
+//#endregion
+export { ChannelSearchResultItem, DefaultSearchResultItems, MessageSearchResultItem, UserSearchResultItem };
+
+//# sourceMappingURL=SearchResultItem.mjs.map

package/dist/es/components/Search/SearchResults/SearchResultItem.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchResultItem.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchResultItem.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport type { ComponentType } from 'react';\nimport { convertTimestampToDate, formatMessage } from 'stream-chat';\nimport type {\n  Channel,\n  ChannelResponse,\n  MessageFocusSignalState,\n  MessageResponse,\n  UserResponse,\n} from 'stream-chat';\n\nimport { useSearchContext } from '../SearchContext';\nimport { Avatar as DefaultAvatar } from '../../../components/Avatar';\nimport { extractDisplayInfo as defaultExtractDisplayInfo } from '../../../components/Avatar/utils';\nimport { ChannelListItem } from '../../../components/ChannelListItem';\nimport {\n  useChatContext,\n  useComponentContext,\n  useTranslationContext,\n  useWorkspaceNavigation,\n} from '../../../context';\nimport { Timestamp } from '../../../components/Message/Timestamp';\nimport { useStateStore } from '../../../store';\n\ntype SearchResultMessage = MessageResponse & { channel?: ChannelResponse };\n\nconst messageFocusSignalSelector = (state: MessageFocusSignalState) => ({\n  focusedMessageId: state.signal?.messageId,\n});\n\nexport type ChannelSearchResultItemProps = {\n  item: Channel;\n  /** Overrides selection, exactly like `ChannelListItem`'s `onSelect`: when provided it runs\n   *  instead of the default (open the channel into a layout slot). */\n  onSelect?: (event: React.MouseEvent) => void;\n};\n\nexport const ChannelSearchResultItem = ({\n  item,\n  onSelect,\n}: ChannelSearchResultItemProps) => {\n  const { openChannel } = useWorkspaceNavigation();\n  const { channelManager } = useChatContext();\n\n  const handleSelect = useCallback(\n    (event: React.MouseEvent) => {\n      if (onSelect) {\n        onSelect(event);\n        return;\n      }\n      // Default: open the channel in the workspace, forwarding the event so a consumer overriding\n      // `openChannel` (e.g. via ChatView's `deriveWorkspaceNavigation`) can honor ⌘/ctrl-click.\n      openChannel(item, { event });\n      // Route the channel into the list(s) that should own it (the channel manager dedupes by cid,\n      // inserts in sort order, and honors ownership/filters) so it appears without a re-query.\n      channelManager.ingestChannel(item);\n    },\n    [item, openChannel, channelManager, onSelect],\n  );\n\n  return (\n    <ChannelListItem\n      channel={item}\n      className='str-chat__search-result'\n      onSelect={handleSelect}\n    />\n  );\n};\n\nexport type ChannelByMessageSearchResultItemProps = {\n  item: SearchResultMessage;\n  /** Overrides selection (see `ChannelSearchResultItem`); when provided it runs instead of the\n   *  default (jump to the message and open its channel). */\n  onSelect?: (event: React.MouseEvent) => void;\n};\n\nexport const MessageSearchResultItem = ({\n  item,\n  onSelect,\n}: ChannelByMessageSearchResultItemProps) => {\n  const { channelManager, client } = useChatContext();\n  const { isChannelActive, openChannel } = useWorkspaceNavigation();\n\n  const channel = useMemo(() => {\n    const { channel: channelData } = item;\n    const type = channelData?.type ?? 'unknown';\n    const id = channelData?.id ?? 'unknown';\n    return client.channel(type, id);\n  }, [client, item]);\n\n  const channelOpenInSlot = isChannelActive(channel?.cid ?? undefined);\n  const { focusedMessageId } = useStateStore(\n    channel?.messagePaginator.messageFocusSignal,\n    messageFocusSignalSelector,\n  ) ?? { focusedMessageId: undefined };\n\n  const handleSelect = useCallback(\n    (event: React.MouseEvent) => {\n      if (onSelect) {\n        onSelect(event);\n        return;\n      }\n      if (!channel) return;\n      openChannel(channel, { event });\n      channelManager.ingestChannel(channel);\n      void channel.messagePaginator.jumpToMessage(item.id);\n    },\n    [channel, item, openChannel, channelManager, onSelect],\n  );\n\n  // Preview the matched message itself (not the channel's latest) by overriding `previewedMessage`.\n  const previewedMessage = useMemo(() => formatMessage(item), [item]);\n\n  if (!channel) return null;\n\n  return (\n    <ChannelListItem\n      active={channelOpenInSlot && focusedMessageId === item.id}\n      channel={channel}\n      className='str-chat__search-result'\n      onSelect={handleSelect}\n      previewedMessage={previewedMessage}\n    />\n  );\n};\n\nexport type UserSearchResultItemProps = {\n  item: UserResponse;\n  /** Overrides selection (see `ChannelSearchResultItem`); when provided it runs instead of the\n   *  default (open a direct-messaging channel with the user). */\n  onSelect?: (event: React.MouseEvent) => void;\n};\n\nexport const UserSearchResultItem = ({ item, onSelect }: UserSearchResultItemProps) => {\n  const { channelManager, client } = useChatContext();\n  const { openChannel } = useWorkspaceNavigation();\n  const { directMessagingChannelType } = useSearchContext();\n  const { t } = useTranslationContext();\n  const { Avatar = DefaultAvatar, extractDisplayInfo = defaultExtractDisplayInfo } =\n    useComponentContext();\n\n  const onClick = useCallback(\n    (event: React.MouseEvent) => {\n      if (onSelect) {\n        onSelect(event);\n        return;\n      }\n      const newChannel = client.channel(directMessagingChannelType, {\n        members: [{ user_id: client.userId as string }, { user_id: item.id }],\n      });\n      newChannel.watch();\n      // Default: open the DM channel in the workspace, forwarding the event so a consumer overriding\n      // `openChannel` can honor ⌘/ctrl-click.\n      openChannel(newChannel, { event });\n      channelManager.ingestChannel(newChannel);\n    },\n    [client, item, openChannel, channelManager, directMessagingChannelType, onSelect],\n  );\n\n  return (\n    <div className='str-chat__search-result-container'>\n      <button\n        aria-label={t(\n          'search.resultItem.selectUserChannel.ariaLabel',\n          'Select User Channel: {{ name }}',\n          {\n            name: item.name || '',\n          },\n        )}\n        className='str-chat__search-result str-chat__search-result--user'\n        data-testid='search-result-user'\n        onClick={onClick}\n        role='option'\n      >\n        <Avatar\n          {...extractDisplayInfo({ user: item })}\n          isOnline={item.online}\n          size='xl'\n        />\n        <div className='str-chat__search-result-data'>\n          <div className='str-chat__search-result__display-name'>\n            {/* @ts-expect-error username is not typed */}\n            {item.name || item.custom?.username || item.id}\n          </div>\n          <Timestamp\n            customClass='str-chat__search-result__last-active-timestamp'\n            timestamp={convertTimestampToDate(item.last_active)}\n          />\n        </div>\n      </button>\n    </div>\n  );\n};\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type SearchResultItemComponents = Record<string, ComponentType<{ item: any }>>;\n\nexport const DefaultSearchResultItems: SearchResultItemComponents = {\n  channels: ChannelSearchResultItem,\n  messages: MessageSearchResultItem,\n  users: UserSearchResultItem,\n};\n"],"mappings":";;;;;;;;;;;;;;AA0BA,IAAM,8BAA8B,WAAoC,EACtE,kBAAkB,MAAM,QAAQ,UAClC;AASA,IAAa,2BAA2B,EACtC,MACA,eACkC;CAClC,MAAM,EAAE,gBAAgB,uBAAuB;CAC/C,MAAM,EAAE,mBAAmB,eAAe;CAkB1C,OACE,oBAAC,iBAAD;EACE,SAAS;EACT,WAAU;EACV,UApBiB,aAClB,UAA4B;GAC3B,IAAI,UAAU;IACZ,SAAS,KAAK;IACd;GACF;GAGA,YAAY,MAAM,EAAE,MAAM,CAAC;GAG3B,eAAe,cAAc,IAAI;EACnC,GACA;GAAC;GAAM;GAAa;GAAgB;EAAQ,CAOhC;CACX,CAAA;AAEL;AASA,IAAa,2BAA2B,EACtC,MACA,eAC2C;CAC3C,MAAM,EAAE,gBAAgB,WAAW,eAAe;CAClD,MAAM,EAAE,iBAAiB,gBAAgB,uBAAuB;CAEhE,MAAM,UAAU,cAAc;EAC5B,MAAM,EAAE,SAAS,gBAAgB;EACjC,MAAM,OAAO,aAAa,QAAQ;EAClC,MAAM,KAAK,aAAa,MAAM;EAC9B,OAAO,OAAO,QAAQ,MAAM,EAAE;CAChC,GAAG,CAAC,QAAQ,IAAI,CAAC;CAEjB,MAAM,oBAAoB,gBAAgB,SAAS,OAAO,KAAA,CAAS;CACnE,MAAM,EAAE,qBAAqB,cAC3B,SAAS,iBAAiB,oBAC1B,0BACF,KAAK,EAAE,kBAAkB,KAAA,EAAU;CAEnC,MAAM,eAAe,aAClB,UAA4B;EAC3B,IAAI,UAAU;GACZ,SAAS,KAAK;GACd;EACF;EACA,IAAI,CAAC,SAAS;EACd,YAAY,SAAS,EAAE,MAAM,CAAC;EAC9B,eAAe,cAAc,OAAO;EACpC,QAAa,iBAAiB,cAAc,KAAK,EAAE;CACrD,GACA;EAAC;EAAS;EAAM;EAAa;EAAgB;CAAQ,CACvD;CAGA,MAAM,mBAAmB,cAAc,cAAc,IAAI,GAAG,CAAC,IAAI,CAAC;CAElE,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,oBAAC,iBAAD;EACE,QAAQ,qBAAqB,qBAAqB,KAAK;EAC9C;EACT,WAAU;EACV,UAAU;EACQ;CACnB,CAAA;AAEL;AASA,IAAa,wBAAwB,EAAE,MAAM,eAA0C;CACrF,MAAM,EAAE,gBAAgB,WAAW,eAAe;CAClD,MAAM,EAAE,gBAAgB,uBAAuB;CAC/C,MAAM,EAAE,+BAA+B,iBAAiB;CACxD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,QAAA,WAAS,QAAe,oBAAA,uBAAqB,uBACnD,oBAAoB;CAEtB,MAAM,UAAU,aACb,UAA4B;EAC3B,IAAI,UAAU;GACZ,SAAS,KAAK;GACd;EACF;EACA,MAAM,aAAa,OAAO,QAAQ,4BAA4B,EAC5D,SAAS,CAAC,EAAE,SAAS,OAAO,OAAiB,GAAG,EAAE,SAAS,KAAK,GAAG,CAAC,EACtE,CAAC;EACD,WAAW,MAAM;EAGjB,YAAY,YAAY,EAAE,MAAM,CAAC;EACjC,eAAe,cAAc,UAAU;CACzC,GACA;EAAC;EAAQ;EAAM;EAAa;EAAgB;EAA4B;CAAQ,CAClF;CAEA,OACE,oBAAC,OAAD;EAAK,WAAU;YACb,qBAAC,UAAD;GACE,cAAY,EACV,iDACA,mCACA,EACE,MAAM,KAAK,QAAQ,GACrB,CACF;GACA,WAAU;GACV,eAAY;GACH;GACT,MAAK;aAXP,CAaE,oBAAC,UAAD;IACE,GAAI,qBAAmB,EAAE,MAAM,KAAK,CAAC;IACrC,UAAU,KAAK;IACf,MAAK;GACN,CAAA,GACD,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,oBAAC,OAAD;KAAK,WAAU;eAEZ,KAAK,QAAQ,KAAK,QAAQ,YAAY,KAAK;IACzC,CAAA,GACL,oBAAC,WAAD;KACE,aAAY;KACZ,WAAW,uBAAuB,KAAK,WAAW;IACnD,CAAA,CACE;KACC;;CACL,CAAA;AAET;AAKA,IAAa,2BAAuD;CAClE,UAAU;CACV,UAAU;CACV,OAAO;AACT"}

package/dist/es/components/Search/SearchResults/SearchResults.mjs

@@ -0,0 +1,37 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { useSearchContext } from "../SearchContext.mjs";
+import { useAnnounceSearchResultCount } from "../hooks/useAnnounceSearchResultCount.mjs";
+import { useSearchResultsKeyboardNavigation } from "../hooks/useSearchResultsKeyboardNavigation.mjs";
+import { SearchSourceResults } from "./SearchSourceResults.mjs";
+import { SearchResultsHeader } from "./SearchResultsHeader.mjs";
+import { SearchResultsPresearch } from "./SearchResultsPresearch.mjs";
+import { useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchResults.tsx
+var searchControllerStateSelector = (nextValue) => ({
+	activeSources: nextValue.sources.filter((s) => s.isActive),
+	isActive: nextValue.isActive,
+	searchQuery: nextValue.searchQuery
+});
+var SearchResults = () => {
+	const { t } = useTranslationContext();
+	const { SearchResultsHeader: SearchResultsHeader$1 = SearchResultsHeader, SearchResultsPresearch: SearchResultsPresearch$1 = SearchResultsPresearch, SearchSourceResults: SearchSourceResults$1 = SearchSourceResults } = useComponentContext();
+	const { searchController } = useSearchContext();
+	const { activeSources, isActive, searchQuery } = useStateStore(searchController.state, searchControllerStateSelector);
+	const resultsRef = useRef(null);
+	const { onKeyDown } = useSearchResultsKeyboardNavigation(resultsRef);
+	useAnnounceSearchResultCount(resultsRef, isActive && !!searchQuery, activeSources);
+	return !isActive ? null : /* @__PURE__ */ jsxs("div", {
+		"aria-label": t("search.results.searchResults.ariaLabel", "Search results"),
+		className: "str-chat__search-results",
+		onKeyDown,
+		ref: resultsRef,
+		children: [/* @__PURE__ */ jsx(SearchResultsHeader$1, {}), !searchQuery ? /* @__PURE__ */ jsx(SearchResultsPresearch$1, { activeSources }) : activeSources.map((source) => /* @__PURE__ */ jsx(SearchSourceResults$1, { searchSource: source }, source.type))]
+	});
+};
+//#endregion
+export { SearchResults };
+
+//# sourceMappingURL=SearchResults.mjs.map

package/dist/es/components/Search/SearchResults/SearchResults.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchResults.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchResults.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport type { SearchControllerState } from 'stream-chat';\n\nimport { SearchSourceResults as DefaultSourceSearchResults } from './SearchSourceResults';\nimport { SearchResultsHeader as DefaultSearchResultsHeader } from './SearchResultsHeader';\nimport { SearchResultsPresearch as DefaultSearchResultsPresearch } from './SearchResultsPresearch';\nimport { useSearchContext } from '../SearchContext';\nimport {\n  useAnnounceSearchResultCount,\n  useSearchResultsKeyboardNavigation,\n} from '../hooks';\nimport { useComponentContext, useTranslationContext } from '../../../context';\nimport { useStateStore } from '../../../store';\n\nconst searchControllerStateSelector = (nextValue: SearchControllerState) => ({\n  activeSources: nextValue.sources.filter((s) => s.isActive),\n  isActive: nextValue.isActive,\n  searchQuery: nextValue.searchQuery,\n});\n\nexport const SearchResults = () => {\n  const { t } = useTranslationContext();\n  const {\n    SearchResultsHeader = DefaultSearchResultsHeader,\n    SearchResultsPresearch = DefaultSearchResultsPresearch,\n    SearchSourceResults = DefaultSourceSearchResults,\n  } = useComponentContext();\n  const { searchController } = useSearchContext();\n  const { activeSources, isActive, searchQuery } = useStateStore(\n    searchController.state,\n    searchControllerStateSelector,\n  );\n\n  const resultsRef = useRef<HTMLDivElement | null>(null);\n  const { onKeyDown } = useSearchResultsKeyboardNavigation(resultsRef);\n  // Announce the number of listed results once the list settles (only while a query is in progress,\n  // not during presearch); the end-of-list status rides along in that same announcement.\n  useAnnounceSearchResultCount(resultsRef, isActive && !!searchQuery, activeSources);\n\n  return !isActive ? null : (\n    <div\n      aria-label={t('search.results.searchResults.ariaLabel', 'Search results')}\n      className='str-chat__search-results'\n      onKeyDown={onKeyDown}\n      ref={resultsRef}\n    >\n      <SearchResultsHeader />\n      {!searchQuery ? (\n        <SearchResultsPresearch activeSources={activeSources} />\n      ) : (\n        activeSources.map((source) => (\n          <SearchSourceResults key={source.type} searchSource={source} />\n        ))\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAcA,IAAM,iCAAiC,eAAsC;CAC3E,eAAe,UAAU,QAAQ,QAAQ,MAAM,EAAE,QAAQ;CACzD,UAAU,UAAU;CACpB,aAAa,UAAU;AACzB;AAEA,IAAa,sBAAsB;CACjC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EACJ,qBAAA,wBAAsB,qBACtB,wBAAA,2BAAyB,wBACzB,qBAAA,wBAAsB,wBACpB,oBAAoB;CACxB,MAAM,EAAE,qBAAqB,iBAAiB;CAC9C,MAAM,EAAE,eAAe,UAAU,gBAAgB,cAC/C,iBAAiB,OACjB,6BACF;CAEA,MAAM,aAAa,OAA8B,IAAI;CACrD,MAAM,EAAE,cAAc,mCAAmC,UAAU;CAGnE,6BAA6B,YAAY,YAAY,CAAC,CAAC,aAAa,aAAa;CAEjF,OAAO,CAAC,WAAW,OACjB,qBAAC,OAAD;EACE,cAAY,EAAE,0CAA0C,gBAAgB;EACxE,WAAU;EACC;EACX,KAAK;YAJP,CAME,oBAAC,uBAAD,CAAsB,CAAA,GACrB,CAAC,cACA,oBAAC,0BAAD,EAAuC,cAAgB,CAAA,IAEvD,cAAc,KAAK,WACjB,oBAAC,uBAAD,EAAuC,cAAc,OAAS,GAApC,OAAO,IAA6B,CAC/D,CAEA;;AAET"}

package/dist/es/components/Search/SearchResults/SearchResultsHeader.mjs

@@ -0,0 +1,55 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { asDynamicKey } from "../../../i18n/utils.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Button } from "../../Button/Button.mjs";
+import { useSearchContext } from "../SearchContext.mjs";
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+//#region src/components/Search/SearchResults/SearchResultsHeader.tsx
+var searchSourceStateSelector = (nextValue) => ({ isActive: nextValue.isActive });
+var SearchSourceFilterButton = ({ source }) => {
+	const { t } = useTranslationContext();
+	const { searchController } = useSearchContext();
+	const { isActive } = useStateStore(source.state, searchSourceStateSelector);
+	const label = `search-results-header-filter-source-button-label--${source.type}`;
+	const buttonContent = useMemo(() => ({
+		"search-results-header-filter-source-button-label--channels": t("search.resultsHeader.filterSource.channels", "channels"),
+		"search-results-header-filter-source-button-label--messages": t("search.resultsHeader.filterSource.messages", "messages"),
+		"search-results-header-filter-source-button-label--users": t("search.resultsHeader.filterSource.users", "users")
+	}), [t])[label] ?? t(asDynamicKey(label));
+	return /* @__PURE__ */ jsx(Button, {
+		appearance: "outline",
+		"aria-label": t("search.resultsHeader.ariaLabel", "Search results header filter button for: {{ source }}", { source: buttonContent }),
+		"aria-pressed": isActive,
+		className: clsx("str-chat__search-results-header__filter-source-button", { "str-chat__search-results-header__filter-source-button--active": isActive }),
+		onClick: () => {
+			if (source.isActive) searchController.deactivateSource(source.type);
+			else {
+				searchController.activateSource(source.type);
+				if (searchController.searchQuery && !source.items?.length) source.search(searchController.searchQuery);
+			}
+		},
+		size: "xs",
+		variant: "secondary",
+		children: buttonContent
+	}, label);
+};
+var SearchResultsHeader = () => {
+	const { filterButtonsContainerRef, searchController } = useSearchContext();
+	if (searchController.sources.length < 2) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-results-header",
+		"data-testid": "search-results-header",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "str-chat__search-results-header__filter-source-buttons",
+			"data-testid": "filter-source-buttons",
+			ref: filterButtonsContainerRef,
+			children: searchController.sources.map((source) => /* @__PURE__ */ jsx(SearchSourceFilterButton, { source }, source.type))
+		})
+	});
+};
+//#endregion
+export { SearchResultsHeader };
+
+//# sourceMappingURL=SearchResultsHeader.mjs.map

package/dist/es/components/Search/SearchResults/SearchResultsHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchResultsHeader.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchResultsHeader.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { useMemo } from 'react';\nimport type { SearchSource, SearchSourceState } from 'stream-chat';\n\nimport { useSearchContext } from '../SearchContext';\nimport { useTranslationContext } from '../../../context';\nimport { useStateStore } from '../../../store';\nimport { Button } from '../../../components';\nimport { asDynamicKey } from '../../../i18n/utils';\n\nconst searchSourceStateSelector = (nextValue: SearchSourceState) => ({\n  isActive: nextValue.isActive,\n});\n\ntype SearchSourceFilterButtonProps = {\n  source: SearchSource;\n};\n\nconst SearchSourceFilterButton = ({ source }: SearchSourceFilterButtonProps) => {\n  const { t } = useTranslationContext();\n  const { searchController } = useSearchContext();\n  const { isActive } = useStateStore(source.state, searchSourceStateSelector);\n  const label = `search-results-header-filter-source-button-label--${source.type}`;\n\n  const knownLabels = useMemo<Record<string, string>>(\n    () => ({\n      'search-results-header-filter-source-button-label--channels': t(\n        'search.resultsHeader.filterSource.channels',\n        'channels',\n      ),\n      'search-results-header-filter-source-button-label--messages': t(\n        'search.resultsHeader.filterSource.messages',\n        'messages',\n      ),\n      'search-results-header-filter-source-button-label--users': t(\n        'search.resultsHeader.filterSource.users',\n        'users',\n      ),\n    }),\n    [t],\n  );\n\n  const buttonContent = knownLabels[label] ?? t(asDynamicKey(label));\n  return (\n    <Button\n      appearance='outline'\n      aria-label={t(\n        'search.resultsHeader.ariaLabel',\n        'Search results header filter button for: {{ source }}',\n        {\n          source: buttonContent,\n        },\n      )}\n      aria-pressed={isActive}\n      className={clsx('str-chat__search-results-header__filter-source-button', {\n        'str-chat__search-results-header__filter-source-button--active': isActive,\n      })}\n      key={label}\n      onClick={() => {\n        if (source.isActive) {\n          searchController.deactivateSource(source.type);\n        } else {\n          searchController.activateSource(source.type);\n          if (searchController.searchQuery && !source.items?.length)\n            source.search(searchController.searchQuery);\n        }\n      }}\n      size='xs'\n      variant='secondary'\n    >\n      {buttonContent}\n    </Button>\n  );\n};\n\nexport const SearchResultsHeader = () => {\n  const { filterButtonsContainerRef, searchController } = useSearchContext();\n\n  // render nothing if there's only one source (can't change filters)\n  if (searchController.sources.length < 2) return null;\n\n  return (\n    <div className='str-chat__search-results-header' data-testid='search-results-header'>\n      <div\n        className='str-chat__search-results-header__filter-source-buttons'\n        data-testid='filter-source-buttons'\n        ref={filterButtonsContainerRef}\n      >\n        {searchController.sources.map((source) => (\n          <SearchSourceFilterButton key={source.type} source={source} />\n        ))}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;AAUA,IAAM,6BAA6B,eAAkC,EACnE,UAAU,UAAU,SACtB;AAMA,IAAM,4BAA4B,EAAE,aAA4C;CAC9E,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,qBAAqB,iBAAiB;CAC9C,MAAM,EAAE,aAAa,cAAc,OAAO,OAAO,yBAAyB;CAC1E,MAAM,QAAQ,qDAAqD,OAAO;CAoB1E,MAAM,gBAlBc,eACX;EACL,8DAA8D,EAC5D,8CACA,UACF;EACA,8DAA8D,EAC5D,8CACA,UACF;EACA,2DAA2D,EACzD,2CACA,OACF;CACF,IACA,CAAC,CAAC,CAGkB,CAAA,CAAY,UAAU,EAAE,aAAa,KAAK,CAAC;CACjE,OACE,oBAAC,QAAD;EACE,YAAW;EACX,cAAY,EACV,kCACA,yDACA,EACE,QAAQ,cACV,CACF;EACA,gBAAc;EACd,WAAW,KAAK,yDAAyD,EACvE,iEAAiE,SACnE,CAAC;EAED,eAAe;GACb,IAAI,OAAO,UACT,iBAAiB,iBAAiB,OAAO,IAAI;QACxC;IACL,iBAAiB,eAAe,OAAO,IAAI;IAC3C,IAAI,iBAAiB,eAAe,CAAC,OAAO,OAAO,QACjD,OAAO,OAAO,iBAAiB,WAAW;GAC9C;EACF;EACA,MAAK;EACL,SAAQ;YAEP;CACK,GAdD,KAcC;AAEZ;AAEA,IAAa,4BAA4B;CACvC,MAAM,EAAE,2BAA2B,qBAAqB,iBAAiB;CAGzE,IAAI,iBAAiB,QAAQ,SAAS,GAAG,OAAO;CAEhD,OACE,oBAAC,OAAD;EAAK,WAAU;EAAkC,eAAY;YAC3D,oBAAC,OAAD;GACE,WAAU;GACV,eAAY;GACZ,KAAK;aAEJ,iBAAiB,QAAQ,KAAK,WAC7B,oBAAC,0BAAD,EAAoD,OAAS,GAA9B,OAAO,IAAuB,CAC9D;EACE,CAAA;CACF,CAAA;AAET"}

package/dist/es/components/Search/SearchResults/SearchResultsPresearch.mjs

@@ -0,0 +1,15 @@
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchResultsPresearch.tsx
+var SearchResultsPresearch = () => {
+	const { t } = useTranslationContext();
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-results-presearch",
+		children: t("search.resultsPresearch.startTypingSearch.text", "Start typing to search")
+	});
+};
+//#endregion
+export { SearchResultsPresearch };
+
+//# sourceMappingURL=SearchResultsPresearch.mjs.map

package/dist/es/components/Search/SearchResults/SearchResultsPresearch.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchResultsPresearch.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchResultsPresearch.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useTranslationContext } from '../../../context';\n\nimport type { SearchSource } from 'stream-chat';\n\nexport type SearchResultsPresearchProps = {\n  activeSources: SearchSource[];\n};\n\nexport const SearchResultsPresearch = () => {\n  const { t } = useTranslationContext();\n  return (\n    <div className='str-chat__search-results-presearch'>\n      {t('search.resultsPresearch.startTypingSearch.text', 'Start typing to search')}\n    </div>\n  );\n};\n"],"mappings":";;;;AAUA,IAAa,+BAA+B;CAC1C,MAAM,EAAE,MAAM,sBAAsB;CACpC,OACE,oBAAC,OAAD;EAAK,WAAU;YACZ,EAAE,kDAAkD,wBAAwB;CAC1E,CAAA;AAET"}

package/dist/es/components/Search/SearchResults/SearchSourceResultList.mjs

@@ -0,0 +1,31 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { InfiniteScrollPaginator } from "../../InfiniteScrollPaginator/InfiniteScrollPaginator.mjs";
+import { DefaultSearchResultItems } from "./SearchResultItem.mjs";
+import { useSearchSourceResultsContext } from "../SearchSourceResultsContext.mjs";
+import { SearchSourceResultListFooter } from "./SearchSourceResultListFooter.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchSourceResultList.tsx
+var searchSourceStateSelector = (nextValue) => ({ items: nextValue.items });
+var SearchSourceResultList = ({ loadMoreDebounceMs = 100, loadMoreThresholdPx = 80, SearchResultItems = DefaultSearchResultItems }) => {
+	const { SearchSourceResultListFooter: SearchSourceResultListFooter$1 = SearchSourceResultListFooter } = useComponentContext();
+	const { searchSource } = useSearchSourceResultsContext();
+	const { items } = useStateStore(searchSource.state, searchSourceStateSelector);
+	const SearchResultItem = SearchResultItems[searchSource.type];
+	if (!SearchResultItem) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-source-result-list",
+		"data-testid": "search-source-result-list",
+		children: /* @__PURE__ */ jsxs(InfiniteScrollPaginator, {
+			loadNextDebounceMs: loadMoreDebounceMs,
+			loadNextOnScrollToBottom: searchSource.search,
+			threshold: loadMoreThresholdPx,
+			children: [items?.map((item, i) => /* @__PURE__ */ jsx(SearchResultItem, { item }, `source-search-result-${searchSource.type}-${i}`)), /* @__PURE__ */ jsx(SearchSourceResultListFooter$1, {})]
+		})
+	});
+};
+//#endregion
+export { SearchSourceResultList };
+
+//# sourceMappingURL=SearchSourceResultList.mjs.map

package/dist/es/components/Search/SearchResults/SearchSourceResultList.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchSourceResultList.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchSourceResultList.tsx"],"sourcesContent":["import React from 'react';\nimport type { ComponentType } from 'react';\nimport type { SearchSourceState, SearchSourceType } from 'stream-chat';\n\nimport { DefaultSearchResultItems } from './SearchResultItem';\nimport { SearchSourceResultListFooter as DefaultSearchSourceResultListFooter } from './SearchSourceResultListFooter';\nimport { useSearchSourceResultsContext } from '../SearchSourceResultsContext';\nimport { InfiniteScrollPaginator } from '../../../components/InfiniteScrollPaginator/InfiniteScrollPaginator';\nimport { useComponentContext } from '../../../context';\nimport { useStateStore } from '../../../store';\nimport type { SearchResultItemComponents } from './SearchResultItem';\n\nconst searchSourceStateSelector = (nextValue: SearchSourceState) => ({\n  items: nextValue.items,\n});\n\nexport type SearchSourceResultListProps = {\n  loadMoreDebounceMs?: number;\n  loadMoreThresholdPx?: number;\n  SearchResultItems?: SearchResultItemComponents;\n};\n\nexport const SearchSourceResultList = ({\n  loadMoreDebounceMs = 100,\n  loadMoreThresholdPx = 80,\n  SearchResultItems = DefaultSearchResultItems,\n}: SearchSourceResultListProps) => {\n  const { SearchSourceResultListFooter = DefaultSearchSourceResultListFooter } =\n    useComponentContext();\n\n  const { searchSource } = useSearchSourceResultsContext();\n  const { items } = useStateStore(searchSource.state, searchSourceStateSelector);\n\n  const SearchResultItem = SearchResultItems[\n    searchSource.type as SearchSourceType\n  ] as ComponentType<{ item: unknown }>;\n\n  if (!SearchResultItem) return null;\n\n  return (\n    <div\n      className='str-chat__search-source-result-list'\n      data-testid='search-source-result-list'\n    >\n      <InfiniteScrollPaginator\n        loadNextDebounceMs={loadMoreDebounceMs}\n        loadNextOnScrollToBottom={searchSource.search}\n        threshold={loadMoreThresholdPx}\n      >\n        {items?.map((item, i) => (\n          <SearchResultItem\n            item={item}\n            key={`source-search-result-${searchSource.type}-${i}`}\n          />\n        ))}\n        <SearchSourceResultListFooter />\n      </InfiniteScrollPaginator>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;AAYA,IAAM,6BAA6B,eAAkC,EACnE,OAAO,UAAU,MACnB;AAQA,IAAa,0BAA0B,EACrC,qBAAqB,KACrB,sBAAsB,IACtB,oBAAoB,+BACa;CACjC,MAAM,EAAE,8BAAA,iCAA+B,iCACrC,oBAAoB;CAEtB,MAAM,EAAE,iBAAiB,8BAA8B;CACvD,MAAM,EAAE,UAAU,cAAc,aAAa,OAAO,yBAAyB;CAE7E,MAAM,mBAAmB,kBACvB,aAAa;CAGf,IAAI,CAAC,kBAAkB,OAAO;CAE9B,OACE,oBAAC,OAAD;EACE,WAAU;EACV,eAAY;YAEZ,qBAAC,yBAAD;GACE,oBAAoB;GACpB,0BAA0B,aAAa;GACvC,WAAW;aAHb,CAKG,OAAO,KAAK,MAAM,MACjB,oBAAC,kBAAD,EACQ,KAEP,GADM,wBAAwB,aAAa,KAAK,GAAG,GACnD,CACF,GACD,oBAAC,gCAAD,CAA+B,CAAA,CACR;;CACtB,CAAA;AAET"}

package/dist/es/components/Search/SearchResults/SearchSourceResultListFooter.mjs

@@ -0,0 +1,31 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { useSearchSourceResultsContext } from "../SearchSourceResultsContext.mjs";
+import { SearchSourceResultsLoadingIndicator } from "./SearchSourceResultsLoadingIndicator.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchSourceResultListFooter.tsx
+var searchSourceStateSelector = (value) => ({
+	hasNext: value.hasNext,
+	isLoading: value.isLoading
+});
+var SearchSourceResultListFooter = () => {
+	const { t } = useTranslationContext();
+	const { SearchSourceResultsLoadingIndicator: SearchSourceResultsLoadingIndicator$1 = SearchSourceResultsLoadingIndicator } = useComponentContext();
+	const { searchSource } = useSearchSourceResultsContext();
+	const { hasNext, isLoading } = useStateStore(searchSource.state, searchSourceStateSelector);
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-source-result-list__footer",
+		"data-testid": "search-footer",
+		children: isLoading ? /* @__PURE__ */ jsx(SearchSourceResultsLoadingIndicator$1, {}) : !hasNext ? /* @__PURE__ */ jsx("div", {
+			"aria-hidden": "true",
+			className: "str-chat__search-source-results---empty",
+			children: t("common.resultsLoaded.label", "All results loaded")
+		}) : null
+	});
+};
+//#endregion
+export { SearchSourceResultListFooter };
+
+//# sourceMappingURL=SearchSourceResultListFooter.mjs.map

package/dist/es/components/Search/SearchResults/SearchSourceResultListFooter.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchSourceResultListFooter.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchSourceResultListFooter.tsx"],"sourcesContent":["import React from 'react';\nimport type { SearchSourceState } from 'stream-chat';\n\nimport { SearchSourceResultsLoadingIndicator as DefaultSearchSourceResultsLoadingIndicator } from './SearchSourceResultsLoadingIndicator';\nimport { useSearchSourceResultsContext } from '../SearchSourceResultsContext';\nimport { useComponentContext, useTranslationContext } from '../../../context';\nimport { useStateStore } from '../../../store';\n\nconst searchSourceStateSelector = (value: SearchSourceState) => ({\n  hasNext: value.hasNext,\n  isLoading: value.isLoading,\n});\n\nexport const SearchSourceResultListFooter = () => {\n  const { t } = useTranslationContext();\n  const {\n    SearchSourceResultsLoadingIndicator = DefaultSearchSourceResultsLoadingIndicator,\n  } = useComponentContext();\n  const { searchSource } = useSearchSourceResultsContext();\n  const { hasNext, isLoading } = useStateStore(\n    searchSource.state,\n    searchSourceStateSelector,\n  );\n\n  // The \"all results loaded\" end-of-list status is announced (combined with the result count) by\n  // `useAnnounceSearchResultCount`; here it is visual only.\n  return (\n    <div\n      className='str-chat__search-source-result-list__footer'\n      data-testid='search-footer'\n    >\n      {isLoading ? (\n        <SearchSourceResultsLoadingIndicator />\n      ) : !hasNext ? (\n        // Hidden from assistive tech: the end-of-list status is announced (combined with the result\n        // count) by `useAnnounceSearchResultCount`, so the text is not read as a navigable result.\n        <div aria-hidden='true' className='str-chat__search-source-results---empty'>\n          {t('common.resultsLoaded.label', 'All results loaded')}\n        </div>\n      ) : null}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;AAQA,IAAM,6BAA6B,WAA8B;CAC/D,SAAS,MAAM;CACf,WAAW,MAAM;AACnB;AAEA,IAAa,qCAAqC;CAChD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EACJ,qCAAA,wCAAsC,wCACpC,oBAAoB;CACxB,MAAM,EAAE,iBAAiB,8BAA8B;CACvD,MAAM,EAAE,SAAS,cAAc,cAC7B,aAAa,OACb,yBACF;CAIA,OACE,oBAAC,OAAD;EACE,WAAU;EACV,eAAY;YAEX,YACC,oBAAC,uCAAD,CAAsC,CAAA,IACpC,CAAC,UAGH,oBAAC,OAAD;GAAK,eAAY;GAAO,WAAU;aAC/B,EAAE,8BAA8B,oBAAoB;EAClD,CAAA,IACH;CACD,CAAA;AAET"}

package/dist/es/components/Search/SearchResults/SearchSourceResults.mjs

@@ -0,0 +1,30 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { SearchSourceResultsContextProvider } from "../SearchSourceResultsContext.mjs";
+import { SearchSourceResultList } from "./SearchSourceResultList.mjs";
+import { SearchSourceResultsEmpty } from "./SearchSourceResultsEmpty.mjs";
+import { SearchSourceResultsHeader } from "./SearchSourceResultsHeader.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchSourceResults.tsx
+var searchSourceStateSelector = (nextValue) => ({
+	isLoading: nextValue.isLoading,
+	items: nextValue.items
+});
+var SearchSourceResults = ({ searchSource }) => {
+	const { SearchSourceResultList: SearchSourceResultList$1 = SearchSourceResultList, SearchSourceResultsEmpty: SearchSourceResultsEmpty$1 = SearchSourceResultsEmpty, SearchSourceResultsHeader: SearchSourceResultsHeader$1 = SearchSourceResultsHeader } = useComponentContext();
+	const { isLoading, items } = useStateStore(searchSource.state, searchSourceStateSelector);
+	if (!items && !isLoading) return null;
+	return /* @__PURE__ */ jsx(SearchSourceResultsContextProvider, {
+		value: { searchSource },
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "str-chat__search-source-results",
+			"data-testid": "search-source-results",
+			children: [/* @__PURE__ */ jsx(SearchSourceResultsHeader$1, {}), items?.length || isLoading ? /* @__PURE__ */ jsx(SearchSourceResultList$1, {}) : /* @__PURE__ */ jsx(SearchSourceResultsEmpty$1, {})]
+		})
+	});
+};
+//#endregion
+export { SearchSourceResults };
+
+//# sourceMappingURL=SearchSourceResults.mjs.map

package/dist/es/components/Search/SearchResults/SearchSourceResults.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchSourceResults.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchSourceResults.tsx"],"sourcesContent":["import React from 'react';\nimport type { SearchSource, SearchSourceState } from 'stream-chat';\n\nimport { SearchSourceResultList as DefaultSearchSourceResultList } from './SearchSourceResultList';\nimport { SearchSourceResultsEmpty as DefaultSearchSourceResultsEmpty } from './SearchSourceResultsEmpty';\nimport { SearchSourceResultsHeader as DefaultSearchSourceResultsHeader } from './SearchSourceResultsHeader';\nimport { SearchSourceResultsContextProvider } from '../SearchSourceResultsContext';\nimport { useComponentContext } from '../../../context';\nimport { useStateStore } from '../../../store';\n\nconst searchSourceStateSelector = (nextValue: SearchSourceState) => ({\n  isLoading: nextValue.isLoading,\n  items: nextValue.items,\n});\n\nexport type SearchSourceResultsProps = { searchSource: SearchSource };\n\nexport const SearchSourceResults = ({ searchSource }: SearchSourceResultsProps) => {\n  const {\n    SearchSourceResultList = DefaultSearchSourceResultList,\n    SearchSourceResultsEmpty = DefaultSearchSourceResultsEmpty,\n    SearchSourceResultsHeader = DefaultSearchSourceResultsHeader,\n  } = useComponentContext();\n  const { isLoading, items } = useStateStore(\n    searchSource.state,\n    searchSourceStateSelector,\n  );\n\n  if (!items && !isLoading) return null;\n\n  return (\n    <SearchSourceResultsContextProvider value={{ searchSource }}>\n      <div\n        className='str-chat__search-source-results'\n        data-testid='search-source-results'\n      >\n        <SearchSourceResultsHeader />\n        {items?.length || isLoading ? (\n          <SearchSourceResultList />\n        ) : (\n          <SearchSourceResultsEmpty />\n        )}\n      </div>\n    </SearchSourceResultsContextProvider>\n  );\n};\n"],"mappings":";;;;;;;;;AAUA,IAAM,6BAA6B,eAAkC;CACnE,WAAW,UAAU;CACrB,OAAO,UAAU;AACnB;AAIA,IAAa,uBAAuB,EAAE,mBAA6C;CACjF,MAAM,EACJ,wBAAA,2BAAyB,wBACzB,0BAAA,6BAA2B,0BAC3B,2BAAA,8BAA4B,8BAC1B,oBAAoB;CACxB,MAAM,EAAE,WAAW,UAAU,cAC3B,aAAa,OACb,yBACF;CAEA,IAAI,CAAC,SAAS,CAAC,WAAW,OAAO;CAEjC,OACE,oBAAC,oCAAD;EAAoC,OAAO,EAAE,aAAa;YACxD,qBAAC,OAAD;GACE,WAAU;GACV,eAAY;aAFd,CAIE,oBAAC,6BAAD,CAA4B,CAAA,GAC3B,OAAO,UAAU,YAChB,oBAAC,0BAAD,CAAyB,CAAA,IAEzB,oBAAC,4BAAD,CAA2B,CAAA,CAE1B;;CAC6B,CAAA;AAExC"}

package/dist/es/components/Search/SearchResults/SearchSourceResultsEmpty.mjs

@@ -0,0 +1,15 @@
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchSourceResultsEmpty.tsx
+var SearchSourceResultsEmpty = () => {
+	const { t } = useTranslationContext();
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-source-results-empty",
+		children: t("search.sourceResults.noResultsFound.text", "No results found")
+	});
+};
+//#endregion
+export { SearchSourceResultsEmpty };
+
+//# sourceMappingURL=SearchSourceResultsEmpty.mjs.map

package/dist/es/components/Search/SearchResults/SearchSourceResultsEmpty.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchSourceResultsEmpty.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchSourceResultsEmpty.tsx"],"sourcesContent":["import React from 'react';\nimport { useTranslationContext } from '../../../context';\n\nexport const SearchSourceResultsEmpty = () => {\n  const { t } = useTranslationContext();\n  return (\n    <div className='str-chat__search-source-results-empty'>\n      {t('search.sourceResults.noResultsFound.text', 'No results found')}\n    </div>\n  );\n};\n"],"mappings":";;;;AAGA,IAAa,iCAAiC;CAC5C,MAAM,EAAE,MAAM,sBAAsB;CACpC,OACE,oBAAC,OAAD;EAAK,WAAU;YACZ,EAAE,4CAA4C,kBAAkB;CAC9D,CAAA;AAET"}

package/dist/es/components/Search/SearchResults/SearchSourceResultsHeader.mjs

@@ -0,0 +1,6 @@
+//#region src/components/Search/SearchResults/SearchSourceResultsHeader.tsx
+var SearchSourceResultsHeader = () => null;
+//#endregion
+export { SearchSourceResultsHeader };
+
+//# sourceMappingURL=SearchSourceResultsHeader.mjs.map

package/dist/es/components/Search/SearchResults/SearchSourceResultsHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchSourceResultsHeader.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchSourceResultsHeader.tsx"],"sourcesContent":["export const SearchSourceResultsHeader = () => null;\n"],"mappings":";AAAA,IAAa,kCAAkC"}

package/dist/es/components/Search/SearchResults/SearchSourceResultsLoadingIndicator.mjs

@@ -0,0 +1,18 @@
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { useSearchSourceResultsContext } from "../SearchSourceResultsContext.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Search/SearchResults/SearchSourceResultsLoadingIndicator.tsx
+var SearchSourceResultsLoadingIndicator = () => {
+	const { t } = useTranslationContext();
+	const { searchSource } = useSearchSourceResultsContext();
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-source-results__loading-indicator",
+		"data-testid": "search-loading-indicator",
+		children: t("search.sourceResults.searching.text", "Searching for {{ searchSourceType }}...", { searchSourceType: searchSource.type })
+	});
+};
+//#endregion
+export { SearchSourceResultsLoadingIndicator };
+
+//# sourceMappingURL=SearchSourceResultsLoadingIndicator.mjs.map

package/dist/es/components/Search/SearchResults/SearchSourceResultsLoadingIndicator.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchSourceResultsLoadingIndicator.mjs","names":[],"sources":["../../../../../src/components/Search/SearchResults/SearchSourceResultsLoadingIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport { useTranslationContext } from '../../../context';\nimport { useSearchSourceResultsContext } from '../SearchSourceResultsContext';\n\nexport const SearchSourceResultsLoadingIndicator = () => {\n  const { t } = useTranslationContext();\n  const { searchSource } = useSearchSourceResultsContext();\n  return (\n    <div\n      className='str-chat__search-source-results__loading-indicator'\n      data-testid='search-loading-indicator'\n    >\n      {t(\n        'search.sourceResults.searching.text',\n        'Searching for {{ searchSourceType }}...',\n        {\n          searchSourceType: searchSource.type,\n        },\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;;AAIA,IAAa,4CAA4C;CACvD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,iBAAiB,8BAA8B;CACvD,OACE,oBAAC,OAAD;EACE,WAAU;EACV,eAAY;YAEX,EACC,uCACA,2CACA,EACE,kBAAkB,aAAa,KACjC,CACF;CACG,CAAA;AAET"}

package/dist/es/components/Search/SearchSourceResultsContext.mjs

@@ -0,0 +1,17 @@
+import { requireContext } from "../../context/requireContext.mjs";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Search/SearchSourceResultsContext.tsx
+var SearchSourceResultsContext = createContext(void 0);
+/**
+* Context provider for components rendered within the `SearchSourceResults`
+*/
+var SearchSourceResultsContextProvider = ({ children, value }) => /* @__PURE__ */ jsx(SearchSourceResultsContext.Provider, {
+	value,
+	children
+});
+var useSearchSourceResultsContext = () => requireContext(useContext(SearchSourceResultsContext), "useSearchSourceResultsContext", "SearchSourceResultsProvider");
+//#endregion
+export { SearchSourceResultsContext, SearchSourceResultsContextProvider, useSearchSourceResultsContext };
+
+//# sourceMappingURL=SearchSourceResultsContext.mjs.map

package/dist/es/components/Search/SearchSourceResultsContext.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchSourceResultsContext.mjs","names":[],"sources":["../../../../src/components/Search/SearchSourceResultsContext.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport React, { createContext, useContext } from 'react';\nimport type { SearchSource } from 'stream-chat';\nimport { requireContext } from '../../context/requireContext';\n\nexport type SearchSourceResultsContextValue = {\n  searchSource: SearchSource;\n};\n\nexport const SearchSourceResultsContext = createContext<\n  SearchSourceResultsContextValue | undefined\n>(undefined);\n\n/**\n * Context provider for components rendered within the `SearchSourceResults`\n */\nexport const SearchSourceResultsContextProvider = ({\n  children,\n  value,\n}: PropsWithChildren<{\n  value: SearchSourceResultsContextValue;\n}>) => (\n  <SearchSourceResultsContext.Provider\n    value={value as unknown as SearchSourceResultsContextValue}\n  >\n    {children}\n  </SearchSourceResultsContext.Provider>\n);\n\nexport const useSearchSourceResultsContext = () =>\n  requireContext(\n    useContext(SearchSourceResultsContext),\n    'useSearchSourceResultsContext',\n    'SearchSourceResultsProvider',\n  );\n"],"mappings":";;;;AASA,IAAa,6BAA6B,cAExC,KAAA,CAAS;;;;AAKX,IAAa,sCAAsC,EACjD,UACA,YAIA,oBAAC,2BAA2B,UAA5B;CACS;CAEN;AACkC,CAAA;AAGvC,IAAa,sCACX,eACE,WAAW,0BAA0B,GACrC,iCACA,6BACF"}

package/dist/es/components/Search/hooks/useAnnounceSearchResultCount.mjs

@@ -0,0 +1,57 @@
+import { useInteractionAnnouncements } from "../../Accessibility/hooks/useInteractionAnnouncements.mjs";
+import { useMutationObserver } from "../../UtilityComponents/hooks/useMutationObserver.mjs";
+import { useRef } from "react";
+//#region src/components/Search/hooks/useAnnounceSearchResultCount.ts
+var OPTION_SELECTOR = "[role=\"option\"]";
+/**
+* Announces how many items are listed in the search results — and, when the list is fully loaded,
+* folds the "all results loaded" end-of-list status into that SAME announcement.
+*
+* The count is taken from the rendered options (`[role="option"]`) in `containerRef`, observed with
+* {@link useMutationObserver} — so it is source-agnostic (works across channels/messages/users and
+* any custom result component) and reflects exactly what the user sees. Delivery goes through the
+* shared {@link useInteractionAnnouncements} registry (`search.resultCount`), which debounces the
+* value so it lands once results settle (after the screen reader's typing echo) instead of on every
+* change.
+*
+* `allResultsLoaded` is derived (when the announcement fires) from the active sources' latest state:
+* true only when every active source has no next page and is not loading. Carrying it in the count
+* message — rather than as a separate live-region announcement — keeps the end-of-list status from
+* competing with (and superseding) the count.
+*
+* The observer fires on every subtree mutation, but the announcement is made only when the
+* `count`/`allResultsLoaded` SIGNATURE changes — so an in-place action (e.g. muting a channel in a
+* result, which re-renders the row without changing the count) does not re-announce. It also bails
+* while inactive: gated on `active` (an in-progress search with a query) so it never fires during
+* presearch, and the pending (debounced) count is cancelled — and the signature reset — when search
+* is exited, so a stale count is not spoken after the results are gone.
+*/
+var useAnnounceSearchResultCount = (containerRef, active, activeSources = []) => {
+	const { announceInteraction, cancelInteraction } = useInteractionAnnouncements();
+	const lastSignatureRef = useRef(null);
+	useMutationObserver(containerRef, () => {
+		if (!active) return;
+		const count = containerRef.current?.querySelectorAll(OPTION_SELECTOR).length ?? 0;
+		const allResultsLoaded = activeSources.length > 0 && activeSources.every((source) => {
+			const { hasNext, isLoading } = source.state.getLatestValue();
+			return !hasNext && !isLoading;
+		});
+		const signature = `${count}|${allResultsLoaded}`;
+		if (signature === lastSignatureRef.current) return;
+		lastSignatureRef.current = signature;
+		announceInteraction("search.resultCount", {
+			allResultsLoaded,
+			count
+		});
+	}, {
+		enabled: active,
+		onDisconnect: () => {
+			lastSignatureRef.current = null;
+			cancelInteraction("search.resultCount");
+		}
+	});
+};
+//#endregion
+export { useAnnounceSearchResultCount };
+
+//# sourceMappingURL=useAnnounceSearchResultCount.mjs.map

package/dist/es/components/Search/hooks/useAnnounceSearchResultCount.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAnnounceSearchResultCount.mjs","names":[],"sources":["../../../../../src/components/Search/hooks/useAnnounceSearchResultCount.ts"],"sourcesContent":["import { useRef } from 'react';\nimport type { RefObject } from 'react';\nimport type { SearchSource } from 'stream-chat';\n\nimport { useInteractionAnnouncements } from '../../Accessibility';\nimport { useMutationObserver } from '../../UtilityComponents/hooks/useMutationObserver';\n\nconst OPTION_SELECTOR = '[role=\"option\"]';\n\n/**\n * Announces how many items are listed in the search results — and, when the list is fully loaded,\n * folds the \"all results loaded\" end-of-list status into that SAME announcement.\n *\n * The count is taken from the rendered options (`[role=\"option\"]`) in `containerRef`, observed with\n * {@link useMutationObserver} — so it is source-agnostic (works across channels/messages/users and\n * any custom result component) and reflects exactly what the user sees. Delivery goes through the\n * shared {@link useInteractionAnnouncements} registry (`search.resultCount`), which debounces the\n * value so it lands once results settle (after the screen reader's typing echo) instead of on every\n * change.\n *\n * `allResultsLoaded` is derived (when the announcement fires) from the active sources' latest state:\n * true only when every active source has no next page and is not loading. Carrying it in the count\n * message — rather than as a separate live-region announcement — keeps the end-of-list status from\n * competing with (and superseding) the count.\n *\n * The observer fires on every subtree mutation, but the announcement is made only when the\n * `count`/`allResultsLoaded` SIGNATURE changes — so an in-place action (e.g. muting a channel in a\n * result, which re-renders the row without changing the count) does not re-announce. It also bails\n * while inactive: gated on `active` (an in-progress search with a query) so it never fires during\n * presearch, and the pending (debounced) count is cancelled — and the signature reset — when search\n * is exited, so a stale count is not spoken after the results are gone.\n */\nexport const useAnnounceSearchResultCount = (\n  containerRef: RefObject<HTMLElement | null>,\n  active: boolean,\n  activeSources: SearchSource[] = [],\n) => {\n  const { announceInteraction, cancelInteraction } = useInteractionAnnouncements();\n  const lastSignatureRef = useRef<string | null>(null);\n\n  useMutationObserver(\n    containerRef,\n    () => {\n      if (!active) return;\n      const count = containerRef.current?.querySelectorAll(OPTION_SELECTOR).length ?? 0;\n      const allResultsLoaded =\n        activeSources.length > 0 &&\n        activeSources.every((source) => {\n          const { hasNext, isLoading } = source.state.getLatestValue();\n          return !hasNext && !isLoading;\n        });\n\n      // Announce only when the meaningful state changes, not on every re-render of a result row.\n      const signature = `${count}|${allResultsLoaded}`;\n      if (signature === lastSignatureRef.current) return;\n      lastSignatureRef.current = signature;\n\n      announceInteraction('search.resultCount', { allResultsLoaded, count });\n    },\n    {\n      enabled: active,\n      onDisconnect: () => {\n        lastSignatureRef.current = null;\n        cancelInteraction('search.resultCount');\n      },\n    },\n  );\n};\n"],"mappings":";;;;AAOA,IAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;AAyBxB,IAAa,gCACX,cACA,QACA,gBAAgC,CAAC,MAC9B;CACH,MAAM,EAAE,qBAAqB,sBAAsB,4BAA4B;CAC/E,MAAM,mBAAmB,OAAsB,IAAI;CAEnD,oBACE,oBACM;EACJ,IAAI,CAAC,QAAQ;EACb,MAAM,QAAQ,aAAa,SAAS,iBAAiB,eAAe,CAAC,CAAC,UAAU;EAChF,MAAM,mBACJ,cAAc,SAAS,KACvB,cAAc,OAAO,WAAW;GAC9B,MAAM,EAAE,SAAS,cAAc,OAAO,MAAM,eAAe;GAC3D,OAAO,CAAC,WAAW,CAAC;EACtB,CAAC;EAGH,MAAM,YAAY,GAAG,MAAM,GAAG;EAC9B,IAAI,cAAc,iBAAiB,SAAS;EAC5C,iBAAiB,UAAU;EAE3B,oBAAoB,sBAAsB;GAAE;GAAkB;EAAM,CAAC;CACvE,GACA;EACE,SAAS;EACT,oBAAoB;GAClB,iBAAiB,UAAU;GAC3B,kBAAkB,oBAAoB;EACxC;CACF,CACF;AACF"}

package/dist/es/components/Search/hooks/useSearchQueriesInProgress.mjs

@@ -0,0 +1,24 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useEffect, useState } from "react";
+//#region src/components/Search/hooks/useSearchQueriesInProgress.ts
+var searchControllerStateSelector = (value) => ({ sources: value.sources });
+var useSearchQueriesInProgress = (searchController) => {
+	const [queriesInProgress, setQueriesInProgress] = useState([]);
+	const { sources } = useStateStore(searchController.state, searchControllerStateSelector);
+	useEffect(() => {
+		const subscriptions = sources.map((source) => source.state.subscribeWithSelector((value) => ({ isLoading: value.isLoading }), ({ isLoading }) => {
+			setQueriesInProgress((prev) => {
+				if (isLoading) return prev.concat(source.type);
+				return prev.filter((type) => type !== source.type);
+			});
+		}));
+		return () => {
+			subscriptions.forEach((unsubscribe) => unsubscribe());
+		};
+	}, [sources]);
+	return queriesInProgress;
+};
+//#endregion
+export { useSearchQueriesInProgress };
+
+//# sourceMappingURL=useSearchQueriesInProgress.mjs.map

package/dist/es/components/Search/hooks/useSearchQueriesInProgress.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSearchQueriesInProgress.mjs","names":[],"sources":["../../../../../src/components/Search/hooks/useSearchQueriesInProgress.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport type { SearchController, SearchControllerState, SearchSource } from 'stream-chat';\n\nimport { useStateStore } from '../../../store';\n\nconst searchControllerStateSelector = (value: SearchControllerState) => ({\n  sources: value.sources,\n});\n\nexport type UseSearchQueriesInProgressParams = {\n  searchController: SearchController;\n};\n\nexport const useSearchQueriesInProgress = (searchController: SearchController) => {\n  const [queriesInProgress, setQueriesInProgress] = useState<string[]>([]);\n  const { sources } = useStateStore(\n    searchController.state,\n    searchControllerStateSelector,\n  );\n\n  useEffect(() => {\n    const subscriptions = sources.map((source: SearchSource) =>\n      source.state.subscribeWithSelector(\n        (value) => ({ isLoading: value.isLoading }),\n        ({ isLoading }) => {\n          setQueriesInProgress((prev) => {\n            if (isLoading) return prev.concat(source.type);\n            return prev.filter((type) => type !== source.type);\n          });\n        },\n      ),\n    );\n\n    return () => {\n      subscriptions.forEach((unsubscribe) => unsubscribe());\n    };\n  }, [sources]);\n  return queriesInProgress;\n};\n"],"mappings":";;;AAKA,IAAM,iCAAiC,WAAkC,EACvE,SAAS,MAAM,QACjB;AAMA,IAAa,8BAA8B,qBAAuC;CAChF,MAAM,CAAC,mBAAmB,wBAAwB,SAAmB,CAAC,CAAC;CACvE,MAAM,EAAE,YAAY,cAClB,iBAAiB,OACjB,6BACF;CAEA,gBAAgB;EACd,MAAM,gBAAgB,QAAQ,KAAK,WACjC,OAAO,MAAM,uBACV,WAAW,EAAE,WAAW,MAAM,UAAU,KACxC,EAAE,gBAAgB;GACjB,sBAAsB,SAAS;IAC7B,IAAI,WAAW,OAAO,KAAK,OAAO,OAAO,IAAI;IAC7C,OAAO,KAAK,QAAQ,SAAS,SAAS,OAAO,IAAI;GACnD,CAAC;EACH,CACF,CACF;EAEA,aAAa;GACX,cAAc,SAAS,gBAAgB,YAAY,CAAC;EACtD;CACF,GAAG,CAAC,OAAO,CAAC;CACZ,OAAO;AACT"}