stream-chat-react 14.11.0 → 14.12.0

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

@@ -0,0 +1,113 @@
+import { useChannelListContext } from "../../../context/ChannelListContext.mjs";
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Avatar } from "../../Avatar/Avatar.mjs";
+import { extractDisplayInfo } from "../../Avatar/utils.mjs";
+import { Timestamp } from "../../Message/Timestamp.mjs";
+import { useSearchContext } from "../SearchContext.mjs";
+import { ChannelListItem } from "../../ChannelListItem/ChannelListItem.mjs";
+import { useCallback, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import uniqBy from "lodash.uniqby";
+//#region src/components/Search/SearchResults/SearchResultItem.tsx
+var ChannelSearchResultItem = ({ item }) => {
+	const { setActiveChannel } = useChatContext();
+	const { setChannels } = useChannelListContext();
+	return /* @__PURE__ */ jsx(ChannelListItem, {
+		channel: item,
+		className: "str-chat__search-result",
+		onSelect: useCallback(() => {
+			setActiveChannel(item);
+			setChannels?.((channels) => uniqBy([item, ...channels], "cid"));
+		}, [
+			item,
+			setActiveChannel,
+			setChannels
+		])
+	});
+};
+var MessageSearchResultItem = ({ item }) => {
+	const { channel: activeChannel, client, searchController, setActiveChannel } = useChatContext();
+	const { setChannels } = useChannelListContext();
+	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 onSelect = useCallback(async () => {
+		if (!channel) return;
+		await channel.state.loadMessageIntoState(item.id, void 0, 25);
+		searchController._internalState.partialNext({ focusedMessage: item });
+		setActiveChannel(channel);
+		setChannels?.((channels) => uniqBy([channel, ...channels], "cid"));
+	}, [
+		channel,
+		item,
+		searchController,
+		setActiveChannel,
+		setChannels
+	]);
+	const getLatestMessagePreview = useCallback(() => item.text, [item]);
+	if (!channel) return null;
+	return /* @__PURE__ */ jsx(ChannelListItem, {
+		active: channel.cid === activeChannel?.cid && item.id === searchController._internalState.getLatestValue().focusedMessage?.id,
+		channel,
+		className: "str-chat__search-result",
+		getLatestMessagePreview,
+		onSelect
+	});
+};
+var UserSearchResultItem = ({ item }) => {
+	const { client, setActiveChannel } = useChatContext();
+	const { setChannels } = useChannelListContext();
+	const { directMessagingChannelType } = useSearchContext();
+	const { t } = useTranslationContext();
+	const { Avatar: Avatar$1 = Avatar, extractDisplayInfo: extractDisplayInfo$1 = extractDisplayInfo } = useComponentContext();
+	const onClick = useCallback(() => {
+		const newChannel = client.channel(directMessagingChannelType, { members: [client.userID, item.id] });
+		newChannel.watch();
+		setActiveChannel(newChannel);
+		setChannels?.((channels) => uniqBy([newChannel, ...channels], "cid"));
+	}, [
+		client,
+		item,
+		setActiveChannel,
+		setChannels,
+		directMessagingChannelType
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		className: "str-chat__search-result-container",
+		children: /* @__PURE__ */ jsxs("button", {
+			"aria-label": t("aria/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.username || item.id
+				}), /* @__PURE__ */ jsx(Timestamp, {
+					customClass: "str-chat__search-result__last-active-timestamp",
+					timestamp: 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 uniqBy from 'lodash.uniqby';\nimport type { ComponentType } from 'react';\nimport type { Channel, MessageResponse, User } 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  useChannelListContext,\n  useChatContext,\n  useComponentContext,\n  useTranslationContext,\n} from '../../../context';\nimport { DEFAULT_JUMP_TO_PAGE_SIZE } from '../../../constants/limits';\nimport { Timestamp } from '../../../components/Message/Timestamp';\n\nexport type ChannelSearchResultItemProps = {\n  item: Channel;\n};\n\nexport const ChannelSearchResultItem = ({ item }: ChannelSearchResultItemProps) => {\n  const { setActiveChannel } = useChatContext();\n  const { setChannels } = useChannelListContext();\n\n  const onSelect = useCallback(() => {\n    setActiveChannel(item);\n    setChannels?.((channels) => uniqBy([item, ...channels], 'cid'));\n  }, [item, setActiveChannel, setChannels]);\n\n  return (\n    <ChannelListItem\n      channel={item}\n      className='str-chat__search-result'\n      onSelect={onSelect}\n    />\n  );\n};\n\nexport type ChannelByMessageSearchResultItemProps = {\n  item: MessageResponse;\n};\n\nexport const MessageSearchResultItem = ({\n  item,\n}: ChannelByMessageSearchResultItemProps) => {\n  const {\n    channel: activeChannel,\n    client,\n    searchController,\n    setActiveChannel,\n  } = useChatContext();\n  const { setChannels } = useChannelListContext();\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 onSelect = useCallback(async () => {\n    if (!channel) return;\n    await channel.state.loadMessageIntoState(\n      item.id,\n      undefined,\n      DEFAULT_JUMP_TO_PAGE_SIZE,\n    );\n    // FIXME: message focus should be handled by yet non-existent msg list controller in client packaged\n    searchController._internalState.partialNext({ focusedMessage: item });\n    setActiveChannel(channel);\n    setChannels?.((channels) => uniqBy([channel, ...channels], 'cid'));\n  }, [channel, item, searchController, setActiveChannel, setChannels]);\n\n  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n  const getLatestMessagePreview = useCallback(() => item.text!, [item]);\n\n  if (!channel) return null;\n\n  return (\n    <ChannelListItem\n      active={\n        channel.cid === activeChannel?.cid &&\n        item.id === searchController._internalState.getLatestValue().focusedMessage?.id\n      }\n      channel={channel}\n      className='str-chat__search-result'\n      getLatestMessagePreview={getLatestMessagePreview}\n      onSelect={onSelect}\n    />\n  );\n};\n\nexport type UserSearchResultItemProps = {\n  item: User;\n};\n\nexport const UserSearchResultItem = ({ item }: UserSearchResultItemProps) => {\n  const { client, setActiveChannel } = useChatContext();\n  const { setChannels } = useChannelListContext();\n  const { directMessagingChannelType } = useSearchContext();\n  const { t } = useTranslationContext();\n  const { Avatar = DefaultAvatar, extractDisplayInfo = defaultExtractDisplayInfo } =\n    useComponentContext();\n\n  const onClick = useCallback(() => {\n    const newChannel = client.channel(directMessagingChannelType, {\n      members: [client.userID as string, item.id],\n    });\n    newChannel.watch();\n    setActiveChannel(newChannel);\n    setChannels?.((channels) => uniqBy([newChannel, ...channels], 'cid'));\n  }, [client, item, setActiveChannel, setChannels, directMessagingChannelType]);\n\n  return (\n    <div className='str-chat__search-result-container'>\n      <button\n        aria-label={t('aria/Select User Channel: {{ name }}', {\n          name: item.name || '',\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            {item.name || item.username || item.id}\n          </div>\n          <Timestamp\n            customClass='str-chat__search-result__last-active-timestamp'\n            timestamp={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":";;;;;;;;;;;;;AAsBA,IAAa,2BAA2B,EAAE,WAAyC;CACjF,MAAM,EAAE,qBAAqB,eAAe;CAC5C,MAAM,EAAE,gBAAgB,sBAAsB;CAO9C,OACE,oBAAC,iBAAD;EACE,SAAS;EACT,WAAU;EACA,UATG,kBAAkB;GACjC,iBAAiB,IAAI;GACrB,eAAe,aAAa,OAAO,CAAC,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC;EAChE,GAAG;GAAC;GAAM;GAAkB;EAAW,CAMzB;CACX,CAAA;AAEL;AAMA,IAAa,2BAA2B,EACtC,WAC2C;CAC3C,MAAM,EACJ,SAAS,eACT,QACA,kBACA,qBACE,eAAe;CACnB,MAAM,EAAE,gBAAgB,sBAAsB;CAE9C,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,WAAW,YAAY,YAAY;EACvC,IAAI,CAAC,SAAS;EACd,MAAM,QAAQ,MAAM,qBAClB,KAAK,IACL,KAAA,GAAA,EAEF;EAEA,iBAAiB,eAAe,YAAY,EAAE,gBAAgB,KAAK,CAAC;EACpE,iBAAiB,OAAO;EACxB,eAAe,aAAa,OAAO,CAAC,SAAS,GAAG,QAAQ,GAAG,KAAK,CAAC;CACnE,GAAG;EAAC;EAAS;EAAM;EAAkB;EAAkB;CAAW,CAAC;CAGnE,MAAM,0BAA0B,kBAAkB,KAAK,MAAO,CAAC,IAAI,CAAC;CAEpE,IAAI,CAAC,SAAS,OAAO;CAErB,OACE,oBAAC,iBAAD;EACE,QACE,QAAQ,QAAQ,eAAe,OAC/B,KAAK,OAAO,iBAAiB,eAAe,eAAe,CAAC,CAAC,gBAAgB;EAEtE;EACT,WAAU;EACe;EACf;CACX,CAAA;AAEL;AAMA,IAAa,wBAAwB,EAAE,WAAsC;CAC3E,MAAM,EAAE,QAAQ,qBAAqB,eAAe;CACpD,MAAM,EAAE,gBAAgB,sBAAsB;CAC9C,MAAM,EAAE,+BAA+B,iBAAiB;CACxD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,QAAA,WAAS,QAAe,oBAAA,uBAAqB,uBACnD,oBAAoB;CAEtB,MAAM,UAAU,kBAAkB;EAChC,MAAM,aAAa,OAAO,QAAQ,4BAA4B,EAC5D,SAAS,CAAC,OAAO,QAAkB,KAAK,EAAE,EAC5C,CAAC;EACD,WAAW,MAAM;EACjB,iBAAiB,UAAU;EAC3B,eAAe,aAAa,OAAO,CAAC,YAAY,GAAG,QAAQ,GAAG,KAAK,CAAC;CACtE,GAAG;EAAC;EAAQ;EAAM;EAAkB;EAAa;CAA0B,CAAC;CAE5E,OACE,oBAAC,OAAD;EAAK,WAAU;YACb,qBAAC,UAAD;GACE,cAAY,EAAE,wCAAwC,EACpD,MAAM,KAAK,QAAQ,GACrB,CAAC;GACD,WAAU;GACV,eAAY;GACH;GACT,MAAK;aAPP,CASE,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;eACZ,KAAK,QAAQ,KAAK,YAAY,KAAK;IACjC,CAAA,GACL,oBAAC,WAAD;KACE,aAAY;KACZ,WAAW,KAAK;IACjB,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 { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { useAnnounceSearchResultCount } from "../hooks/useAnnounceSearchResultCount.mjs";
+import { useSearchResultsKeyboardNavigation } from "../hooks/useSearchResultsKeyboardNavigation.mjs";
+import { useSearchContext } from "../SearchContext.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("ResultsContainer");
+	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("aria/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('ResultsContainer');\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('aria/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,kBAAkB;CACtD,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,qBAAqB;EACnC,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,54 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.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-results-header-filter-source-button-label--channels"),
+		"search-results-header-filter-source-button-label--messages": t("search-results-header-filter-source-button-label--messages"),
+		"search-results-header-filter-source-button-label--users": t("search-results-header-filter-source-button-label--users")
+	}), [t])[label] ?? t(label);
+	return /* @__PURE__ */ jsx(Button, {
+		appearance: "outline",
+		"aria-label": t("aria/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';\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-results-header-filter-source-button-label--channels',\n      ),\n      'search-results-header-filter-source-button-label--messages': t(\n        'search-results-header-filter-source-button-label--messages',\n      ),\n      'search-results-header-filter-source-button-label--users': t(\n        'search-results-header-filter-source-button-label--users',\n      ),\n    }),\n    [t],\n  );\n\n  const buttonContent = knownLabels[label] ?? t(label);\n  return (\n    <Button\n      appearance='outline'\n      aria-label={t('aria/Search results header filter button for: {{ source }}', {\n        source: buttonContent,\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":";;;;;;;;AASA,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;CAiB1E,MAAM,gBAfc,eACX;EACL,8DAA8D,EAC5D,4DACF;EACA,8DAA8D,EAC5D,4DACF;EACA,2DAA2D,EACzD,yDACF;CACF,IACA,CAAC,CAAC,CAGkB,CAAA,CAAY,UAAU,EAAE,KAAK;CACnD,OACE,oBAAC,QAAD;EACE,YAAW;EACX,cAAY,EAAE,8DAA8D,EAC1E,QAAQ,cACV,CAAC;EACD,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("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('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,wBAAwB;CACxB,CAAA;AAET"}

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

@@ -0,0 +1,31 @@
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useStateStore } from "../../../store/hooks/useStateStore.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 { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useStateStore } from "../../../store/hooks/useStateStore.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("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('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,oBAAoB;EACpB,CAAA,IACH;CACD,CAAA;AAET"}

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

@@ -0,0 +1,30 @@
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { useStateStore } from "../../../store/hooks/useStateStore.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("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'>{t('No results found')}</div>\n  );\n};\n"],"mappings":";;;;AAGA,IAAa,iCAAiC;CAC5C,MAAM,EAAE,MAAM,sBAAsB;CACpC,OACE,oBAAC,OAAD;EAAK,WAAU;YAAyC,EAAE,kBAAkB;CAAO,CAAA;AAEvF"}

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("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('Searching for {{ searchSourceType }}...', {\n        searchSourceType: searchSource.type,\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,EAAE,2CAA2C,EAC5C,kBAAkB,aAAa,KACjC,CAAC;CACE,CAAA;AAET"}

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

@@ -0,0 +1,18 @@
+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 = () => {
+	return useContext(SearchSourceResultsContext);
+};
+//#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';\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  const contextValue = useContext(SearchSourceResultsContext);\n  return contextValue as unknown as SearchSourceResultsContextValue;\n};\n"],"mappings":";;;AAQA,IAAa,6BAA6B,cAExC,KAAA,CAAS;;;;AAKX,IAAa,sCAAsC,EACjD,UACA,YAIA,oBAAC,2BAA2B,UAA5B;CACS;CAEN;AACkC,CAAA;AAGvC,IAAa,sCAAsC;CAEjD,OADqB,WAAW,0BACzB;AACT"}

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/useSearchFocusedMessage.mjs

@@ -0,0 +1,13 @@
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+//#region src/components/Search/hooks/useSearchFocusedMessage.ts
+var searchControllerStateSelector = (nextValue) => ({ focusedMessage: nextValue.focusedMessage });
+var useSearchFocusedMessage = () => {
+	const { searchController } = useChatContext("Channel");
+	const { focusedMessage } = useStateStore(searchController._internalState, searchControllerStateSelector);
+	return focusedMessage;
+};
+//#endregion
+export { useSearchFocusedMessage };
+
+//# sourceMappingURL=useSearchFocusedMessage.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useSearchFocusedMessage.mjs","names":[],"sources":["../../../../../src/components/Search/hooks/useSearchFocusedMessage.ts"],"sourcesContent":["import type { InternalSearchControllerState } from 'stream-chat';\nimport { useChatContext } from '../../../context';\nimport { useStateStore } from '../../../store';\n\nconst searchControllerStateSelector = (nextValue: InternalSearchControllerState) => ({\n  focusedMessage: nextValue.focusedMessage,\n});\n\nexport const useSearchFocusedMessage = () => {\n  const { searchController } = useChatContext('Channel');\n  const { focusedMessage } = useStateStore(\n    searchController._internalState,\n    searchControllerStateSelector,\n  );\n\n  return focusedMessage;\n};\n"],"mappings":";;;AAIA,IAAM,iCAAiC,eAA8C,EACnF,gBAAgB,UAAU,eAC5B;AAEA,IAAa,gCAAgC;CAC3C,MAAM,EAAE,qBAAqB,eAAe,SAAS;CACrD,MAAM,EAAE,mBAAmB,cACzB,iBAAiB,gBACjB,6BACF;CAEA,OAAO;AACT"}

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"}