stream-chat-react 14.2.0 → 14.4.0

package/dist/cjs/emojis.js

@@ -1,232 +1,217 @@
-"use strict";
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const Picker = require("@emoji-mart/react");
-const useNotificationApi = require("./useNotificationApi.f2c7704d.js");
-const mergeWith = require("lodash.mergewith");
-const streamChat = require("stream-chat");
-const isShadowRoot = (node) => !!node.host;
-const defaultButtonClassName = "str-chat__emoji-picker-button";
-const classNames = {
-  pickerContainerClassName: "str-chat__message-textarea-emoji-picker-container",
-  wrapperClassName: "str-chat__message-textarea-emoji-picker"
+const require_useNotificationApi = require("./useNotificationApi.9ffe5761.js");
+let react = require("react");
+react = require_useNotificationApi.__toESM(react);
+let react_jsx_runtime = require("react/jsx-runtime");
+let stream_chat = require("stream-chat");
+let lodash_mergewith = require("lodash.mergewith");
+lodash_mergewith = require_useNotificationApi.__toESM(lodash_mergewith);
+let _emoji_mart_react = require("@emoji-mart/react");
+_emoji_mart_react = require_useNotificationApi.__toESM(_emoji_mart_react);
+//#region src/plugins/Emojis/EmojiPicker.tsx
+var Picker = _emoji_mart_react.default.default ?? _emoji_mart_react.default;
+var isShadowRoot = (node) => !!node.host;
+var defaultButtonClassName = "str-chat__emoji-picker-button";
+var classNames = {
+	pickerContainerClassName: "str-chat__message-textarea-emoji-picker-container",
+	wrapperClassName: "str-chat__message-textarea-emoji-picker"
+};
+var EmojiPicker = (props) => {
+	const { t } = require_useNotificationApi.useTranslationContext("EmojiPicker");
+	const { textareaRef } = require_useNotificationApi.useMessageComposerContext("EmojiPicker");
+	const { textComposer } = require_useNotificationApi.useMessageComposerController();
+	const isCooldownActive = require_useNotificationApi.useIsCooldownActive();
+	const [displayPicker, setDisplayPicker] = (0, react.useState)(false);
+	const [referenceElement, setReferenceElement] = (0, react.useState)(null);
+	const [popperElement, setPopperElement] = (0, react.useState)(null);
+	const { refs, strategy, x, y } = require_useNotificationApi.usePopoverPosition({
+		offset: 8,
+		placement: props.placement ?? "top-end"
+	});
+	(0, react.useEffect)(() => {
+		refs.setReference(referenceElement);
+	}, [referenceElement, refs]);
+	(0, react.useEffect)(() => {
+		refs.setFloating(popperElement);
+	}, [popperElement, refs]);
+	const { pickerContainerClassName, wrapperClassName } = classNames;
+	const { ButtonIconComponent = require_useNotificationApi.IconEmoji } = props;
+	const pickerStyle = props.pickerProps?.style;
+	(0, react.useEffect)(() => {
+		if (!popperElement || !referenceElement) return;
+		const handlePointerDown = (e) => {
+			const target = e.target;
+			const rootNode = target.getRootNode();
+			if (popperElement.contains(isShadowRoot(rootNode) ? rootNode.host : target) || referenceElement.contains(target)) return;
+			setDisplayPicker(false);
+		};
+		window.addEventListener("pointerdown", handlePointerDown);
+		return () => window.removeEventListener("pointerdown", handlePointerDown);
+	}, [referenceElement, popperElement]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: props.wrapperClassName ?? wrapperClassName,
+		children: [displayPicker && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: props.pickerContainerClassName ?? pickerContainerClassName,
+			ref: setPopperElement,
+			style: {
+				left: x ?? 0,
+				position: strategy,
+				top: y ?? 0
+			},
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Picker, {
+				data: async () => (await import("@emoji-mart/data")).default,
+				onEmojiSelect: (e) => {
+					const textarea = textareaRef.current;
+					if (!textarea) return;
+					textComposer.insertText({ text: e.native });
+					textarea.focus();
+					if (props.closeOnEmojiSelect) setDisplayPicker(false);
+				},
+				...props.pickerProps,
+				style: {
+					...pickerStyle,
+					"--shadow": "none"
+				}
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_useNotificationApi.Button, {
+			appearance: "ghost",
+			"aria-expanded": displayPicker,
+			"aria-label": t("aria/Emoji picker"),
+			circular: true,
+			className: props.buttonClassName ?? defaultButtonClassName,
+			disabled: isCooldownActive,
+			onClick: () => setDisplayPicker((cv) => !cv),
+			ref: setReferenceElement,
+			size: "sm",
+			type: "button",
+			variant: "secondary",
+			children: ButtonIconComponent && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ButtonIconComponent, {})
+		})]
+	});
+};
+//#endregion
+//#region src/plugins/Emojis/middleware/textComposerEmojiMiddleware.ts
+var EmojiSearchSource = class extends stream_chat.BaseSearchSource {
+	constructor(emojiSearchIndex, options) {
+		super(options);
+		this.type = "emoji";
+		this.emojiSearchIndex = emojiSearchIndex;
+	}
+	async query(searchQuery) {
+		if (searchQuery.length === 0) return {
+			items: [],
+			next: null
+		};
+		return {
+			items: (await this.emojiSearchIndex.search(searchQuery) ?? []).filter(Boolean).slice(0, 7).map(({ emoticons = [], id, name, native, skins = [] }) => {
+				const [firstSkin] = skins;
+				return {
+					emoticons,
+					id,
+					name,
+					native: native ?? firstSkin.native
+				};
+			}),
+			next: null
+		};
+	}
+	filterQueryResults(items) {
+		return items.map((item) => ({
+			...item,
+			...(0, stream_chat.getTokenizedSuggestionDisplayName)({
+				displayName: item.id,
+				searchToken: this.searchQuery
+			})
+		}));
+	}
 };
-const EmojiPicker = (props) => {
-  const { t } = useNotificationApi.useTranslationContext("EmojiPicker");
-  const { textareaRef } = useNotificationApi.useMessageComposerContext();
-  const { textComposer } = useNotificationApi.useMessageComposerController();
-  const isCooldownActive = useNotificationApi.useIsCooldownActive();
-  const [displayPicker, setDisplayPicker] = React.useState(false);
-  const [referenceElement, setReferenceElement] = React.useState(
-    null
-  );
-  const [popperElement, setPopperElement] = React.useState(null);
-  const { refs, strategy, x, y } = useNotificationApi.usePopoverPosition({
-    offset: 8,
-    placement: props.placement ?? "top-end"
-  });
-  React.useEffect(() => {
-    refs.setReference(referenceElement);
-  }, [referenceElement, refs]);
-  React.useEffect(() => {
-    refs.setFloating(popperElement);
-  }, [popperElement, refs]);
-  const { pickerContainerClassName, wrapperClassName } = classNames;
-  const { ButtonIconComponent = useNotificationApi.IconEmoji } = props;
-  const pickerStyle = props.pickerProps?.style;
-  React.useEffect(() => {
-    if (!popperElement || !referenceElement) return;
-    const handlePointerDown = (e) => {
-      const target = e.target;
-      const rootNode = target.getRootNode();
-      if (popperElement.contains(isShadowRoot(rootNode) ? rootNode.host : target) || referenceElement.contains(target)) {
-        return;
-      }
-      setDisplayPicker(false);
-    };
-    window.addEventListener("pointerdown", handlePointerDown);
-    return () => window.removeEventListener("pointerdown", handlePointerDown);
-  }, [referenceElement, popperElement]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: props.wrapperClassName ?? wrapperClassName, children: [
-    displayPicker && /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: props.pickerContainerClassName ?? pickerContainerClassName,
-        ref: setPopperElement,
-        style: { left: x ?? 0, position: strategy, top: y ?? 0 },
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          Picker,
-          {
-            data: async () => (await import("@emoji-mart/data")).default,
-            onEmojiSelect: (e) => {
-              const textarea = textareaRef.current;
-              if (!textarea) return;
-              textComposer.insertText({ text: e.native });
-              textarea.focus();
-              if (props.closeOnEmojiSelect) {
-                setDisplayPicker(false);
-              }
-            },
-            ...props.pickerProps,
-            style: { ...pickerStyle, "--shadow": "none" }
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      useNotificationApi.Button,
-      {
-        appearance: "ghost",
-        "aria-expanded": displayPicker,
-        "aria-label": t("aria/Emoji picker"),
-        circular: true,
-        className: props.buttonClassName ?? defaultButtonClassName,
-        disabled: isCooldownActive,
-        onClick: () => setDisplayPicker((cv) => !cv),
-        ref: setReferenceElement,
-        size: "sm",
-        type: "button",
-        variant: "secondary",
-        children: ButtonIconComponent && /* @__PURE__ */ jsxRuntime.jsx(ButtonIconComponent, {})
-      }
-    )
-  ] });
+var DEFAULT_OPTIONS = {
+	minChars: 1,
+	trigger: ":"
 };
-class EmojiSearchSource extends streamChat.BaseSearchSource {
-  constructor(emojiSearchIndex, options) {
-    super(options);
-    this.type = "emoji";
-    this.emojiSearchIndex = emojiSearchIndex;
-  }
-  async query(searchQuery) {
-    if (searchQuery.length === 0) {
-      return { items: [], next: null };
-    }
-    const emojis = await this.emojiSearchIndex.search(searchQuery) ?? [];
-    return {
-      items: emojis.filter(Boolean).slice(0, 7).map(({ emoticons = [], id, name, native, skins = [] }) => {
-        const [firstSkin] = skins;
-        return {
-          emoticons,
-          id,
-          name,
-          native: native ?? firstSkin.native
-        };
-      }),
-      next: null
-      // todo: generate cursor
-    };
-  }
-  filterQueryResults(items) {
-    return items.map((item) => ({
-      ...item,
-      ...streamChat.getTokenizedSuggestionDisplayName({
-        displayName: item.id,
-        searchToken: this.searchQuery
-      })
-    }));
-  }
-}
-const DEFAULT_OPTIONS = { minChars: 1, trigger: ":" };
-const createTextComposerEmojiMiddleware = (emojiSearchIndex, options) => {
-  const finalOptions = mergeWith(DEFAULT_OPTIONS, options ?? {});
-  const emojiSearchSource = new EmojiSearchSource(emojiSearchIndex);
-  emojiSearchSource.activate();
-  return {
-    id: "stream-io/emoji-middleware",
-    // eslint-disable-next-line sort-keys
-    handlers: {
-      onChange: async ({ complete, forward, next, state }) => {
-        if (!state.selection) return forward();
-        const triggerWithToken = streamChat.getTriggerCharWithToken({
-          acceptTrailingSpaces: false,
-          text: state.text.slice(0, state.selection.end),
-          trigger: finalOptions.trigger
-        });
-        const triggerWasRemoved = !triggerWithToken || triggerWithToken.length < finalOptions.minChars;
-        if (triggerWasRemoved) {
-          const hasSuggestionsForTrigger = state.suggestions?.trigger === finalOptions.trigger;
-          const newState = { ...state };
-          if (hasSuggestionsForTrigger && newState.suggestions) {
-            delete newState.suggestions;
-          }
-          return next(newState);
-        }
-        const newSearchTriggerred = triggerWithToken && triggerWithToken === finalOptions.trigger;
-        if (newSearchTriggerred) {
-          emojiSearchSource.resetStateAndActivate();
-        }
-        const textWithReplacedWord = await streamChat.replaceWordWithEntity({
-          caretPosition: state.selection.end,
-          getEntityString: async (word) => {
-            const { items } = await emojiSearchSource.query(word);
-            const emoji = items.filter(Boolean).slice(0, 10).find(({ emoticons }) => !!emoticons?.includes(word));
-            if (!emoji) return null;
-            const [firstSkin] = emoji.skins ?? [];
-            return emoji.native ?? firstSkin.native;
-          },
-          text: state.text
-        });
-        if (textWithReplacedWord !== state.text) {
-          return complete({
-            ...state,
-            suggestions: void 0,
-            // to prevent the TextComposerMiddlewareExecutor to run the first page query
-            text: textWithReplacedWord
-          });
-        }
-        return complete({
-          ...state,
-          suggestions: {
-            query: triggerWithToken.slice(1),
-            searchSource: emojiSearchSource,
-            trigger: finalOptions.trigger
-          }
-        });
-      },
-      onSuggestionItemSelect: ({ complete, forward, state }) => {
-        const { selectedSuggestion } = state.change ?? {};
-        if (!selectedSuggestion || state.suggestions?.trigger !== finalOptions.trigger)
-          return forward();
-        emojiSearchSource.resetStateAndActivate();
-        return complete({
-          ...state,
-          ...streamChat.insertItemWithTrigger({
-            insertText: `${"native" in selectedSuggestion ? selectedSuggestion.native : ""} `,
-            selection: state.selection,
-            text: state.text,
-            trigger: finalOptions.trigger
-          }),
-          suggestions: void 0
-          // Clear suggestions after selection
-        });
-      }
-    }
-  };
+/**
+* TextComposer middleware for mentions
+* Usage:
+*
+*  const textComposer = new TextComposer(options);
+*
+*  textComposer.use(new createTextComposerEmojiMiddleware(emojiSearchIndex, {
+*   minChars: 2
+*  }));
+*
+* @param emojiSearchIndex
+* @param {{
+*     minChars: number;
+*     trigger: string;
+*   }} options
+* @returns
+*/
+var createTextComposerEmojiMiddleware = (emojiSearchIndex, options) => {
+	const finalOptions = (0, lodash_mergewith.default)(DEFAULT_OPTIONS, options ?? {});
+	const emojiSearchSource = new EmojiSearchSource(emojiSearchIndex);
+	emojiSearchSource.activate();
+	return {
+		id: "stream-io/emoji-middleware",
+		handlers: {
+			onChange: async ({ complete, forward, next, state }) => {
+				if (!state.selection) return forward();
+				const triggerWithToken = (0, stream_chat.getTriggerCharWithToken)({
+					acceptTrailingSpaces: false,
+					text: state.text.slice(0, state.selection.end),
+					trigger: finalOptions.trigger
+				});
+				if (!triggerWithToken || triggerWithToken.length < finalOptions.minChars) {
+					const hasSuggestionsForTrigger = state.suggestions?.trigger === finalOptions.trigger;
+					const newState = { ...state };
+					if (hasSuggestionsForTrigger && newState.suggestions) delete newState.suggestions;
+					return next(newState);
+				}
+				if (triggerWithToken && triggerWithToken === finalOptions.trigger) emojiSearchSource.resetStateAndActivate();
+				const textWithReplacedWord = await (0, stream_chat.replaceWordWithEntity)({
+					caretPosition: state.selection.end,
+					getEntityString: async (word) => {
+						const { items } = await emojiSearchSource.query(word);
+						const emoji = items.filter(Boolean).slice(0, 10).find(({ emoticons }) => !!emoticons?.includes(word));
+						if (!emoji) return null;
+						const [firstSkin] = emoji.skins ?? [];
+						return emoji.native ?? firstSkin.native;
+					},
+					text: state.text
+				});
+				if (textWithReplacedWord !== state.text) return complete({
+					...state,
+					suggestions: void 0,
+					text: textWithReplacedWord
+				});
+				return complete({
+					...state,
+					suggestions: {
+						query: triggerWithToken.slice(1),
+						searchSource: emojiSearchSource,
+						trigger: finalOptions.trigger
+					}
+				});
+			},
+			onSuggestionItemSelect: ({ complete, forward, state }) => {
+				const { selectedSuggestion } = state.change ?? {};
+				if (!selectedSuggestion || state.suggestions?.trigger !== finalOptions.trigger) return forward();
+				emojiSearchSource.resetStateAndActivate();
+				return complete({
+					...state,
+					...(0, stream_chat.insertItemWithTrigger)({
+						insertText: `${"native" in selectedSuggestion ? selectedSuggestion.native : ""} `,
+						selection: state.selection,
+						text: state.text,
+						trigger: finalOptions.trigger
+					}),
+					suggestions: void 0
+				});
+			}
+		}
+	};
 };
+//#endregion
 exports.EmojiPicker = EmojiPicker;
 exports.createTextComposerEmojiMiddleware = createTextComposerEmojiMiddleware;
-//# sourceMappingURL=emojis.js.map
+
+//# sourceMappingURL=emojis.js.map

package/dist/cjs/emojis.js.map

@@ -1 +1 @@
-{"version":3,"file":"emojis.js","sources":["../../src/plugins/Emojis/EmojiPicker.tsx","../../src/plugins/Emojis/middleware/textComposerEmojiMiddleware.ts"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport Picker from '@emoji-mart/react';\n\nimport { useMessageComposerContext, useTranslationContext } from '../../context';\nimport {\n  Button,\n  IconEmoji,\n  type PopperLikePlacement,\n  useMessageComposerController,\n} from '../../components';\nimport { usePopoverPosition } from '../../components/Dialog/hooks/usePopoverPosition';\nimport { useIsCooldownActive } from '../../components/MessageComposer/hooks/useIsCooldownActive';\n\nconst isShadowRoot = (node: Node): node is ShadowRoot => !!(node as ShadowRoot).host;\n\nexport type EmojiPickerProps = {\n  ButtonIconComponent?: React.ComponentType;\n  buttonClassName?: string;\n  pickerContainerClassName?: string;\n  wrapperClassName?: string;\n  closeOnEmojiSelect?: boolean;\n  /**\n   * Untyped [properties](https://github.com/missive/emoji-mart/tree/v5.5.2#options--props) to be\n   * passed down to the [emoji-mart `Picker`](https://github.com/missive/emoji-mart/tree/v5.5.2#-picker) component\n   */\n  pickerProps?: Partial<{ theme: 'auto' | 'light' | 'dark' } & Record<string, unknown>>;\n  /**\n   * Floating UI placement (default: 'top-end') for the picker popover\n   */\n  placement?: PopperLikePlacement;\n};\n\nconst defaultButtonClassName = 'str-chat__emoji-picker-button';\n\nconst classNames: Pick<\n  EmojiPickerProps,\n  'pickerContainerClassName' | 'wrapperClassName'\n> = {\n  pickerContainerClassName: 'str-chat__message-textarea-emoji-picker-container',\n  wrapperClassName: 'str-chat__message-textarea-emoji-picker',\n};\n\nexport const EmojiPicker = (props: EmojiPickerProps) => {\n  const { t } = useTranslationContext('EmojiPicker');\n  const { textareaRef } = useMessageComposerContext('EmojiPicker');\n  const { textComposer } = useMessageComposerController();\n  const isCooldownActive = useIsCooldownActive();\n  const [displayPicker, setDisplayPicker] = useState(false);\n  const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(\n    null,\n  );\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n  const { refs, strategy, x, y } = usePopoverPosition({\n    offset: 8,\n    placement: props.placement ?? 'top-end',\n  });\n\n  useEffect(() => {\n    refs.setReference(referenceElement);\n  }, [referenceElement, refs]);\n  useEffect(() => {\n    refs.setFloating(popperElement);\n  }, [popperElement, refs]);\n\n  const { pickerContainerClassName, wrapperClassName } = classNames;\n\n  const { ButtonIconComponent = IconEmoji } = props;\n  const pickerStyle = props.pickerProps?.style as React.CSSProperties | undefined;\n\n  useEffect(() => {\n    if (!popperElement || !referenceElement) return;\n\n    const handlePointerDown = (e: PointerEvent) => {\n      const target = e.target as HTMLElement;\n\n      const rootNode = target.getRootNode();\n\n      if (\n        popperElement.contains(isShadowRoot(rootNode) ? rootNode.host : target) ||\n        referenceElement.contains(target)\n      ) {\n        return;\n      }\n\n      setDisplayPicker(false);\n    };\n\n    window.addEventListener('pointerdown', handlePointerDown);\n    return () => window.removeEventListener('pointerdown', handlePointerDown);\n  }, [referenceElement, popperElement]);\n\n  return (\n    <div className={props.wrapperClassName ?? wrapperClassName}>\n      {displayPicker && (\n        <div\n          className={props.pickerContainerClassName ?? pickerContainerClassName}\n          ref={setPopperElement}\n          style={{ left: x ?? 0, position: strategy, top: y ?? 0 }}\n        >\n          <Picker\n            data={async () => (await import('@emoji-mart/data')).default}\n            onEmojiSelect={(e: { native: string }) => {\n              const textarea = textareaRef.current;\n              if (!textarea) return;\n              textComposer.insertText({ text: e.native });\n              textarea.focus();\n              if (props.closeOnEmojiSelect) {\n                setDisplayPicker(false);\n              }\n            }}\n            {...props.pickerProps}\n            style={{ ...pickerStyle, '--shadow': 'none' }}\n          />\n        </div>\n      )}\n      <Button\n        appearance='ghost'\n        aria-expanded={displayPicker}\n        aria-label={t('aria/Emoji picker')}\n        circular\n        className={props.buttonClassName ?? defaultButtonClassName}\n        disabled={isCooldownActive}\n        onClick={() => setDisplayPicker((cv) => !cv)}\n        ref={setReferenceElement}\n        size='sm'\n        type='button'\n        variant='secondary'\n      >\n        {ButtonIconComponent && <ButtonIconComponent />}\n      </Button>\n    </div>\n  );\n};\n","import mergeWith from 'lodash.mergewith';\nimport type {\n  Middleware,\n  SearchSourceOptions,\n  SearchSourceType,\n  TextComposerMiddlewareExecutorState,\n  TextComposerMiddlewareOptions,\n  TextComposerSuggestion,\n} from 'stream-chat';\nimport {\n  BaseSearchSource,\n  getTokenizedSuggestionDisplayName,\n  getTriggerCharWithToken,\n  insertItemWithTrigger,\n  replaceWordWithEntity,\n} from 'stream-chat';\nimport type {\n  EmojiSearchIndex,\n  EmojiSearchIndexResult,\n} from '../../../components/MessageComposer';\n\nexport type EmojiSuggestion<T extends EmojiSearchIndexResult = EmojiSearchIndexResult> =\n  TextComposerSuggestion<T>;\n\nclass EmojiSearchSource<\n  T extends TextComposerSuggestion<EmojiSearchIndexResult>,\n> extends BaseSearchSource<T> {\n  readonly type: SearchSourceType = 'emoji';\n  private emojiSearchIndex: EmojiSearchIndex;\n\n  constructor(emojiSearchIndex: EmojiSearchIndex, options?: SearchSourceOptions) {\n    super(options);\n    this.emojiSearchIndex = emojiSearchIndex;\n  }\n\n  async query(searchQuery: string) {\n    if (searchQuery.length === 0) {\n      return { items: [] as T[], next: null };\n    }\n    const emojis = (await this.emojiSearchIndex.search(searchQuery)) ?? [];\n\n    // emojiIndex.search sometimes returns undefined values, so filter those out first\n    return {\n      items: emojis\n        .filter(Boolean)\n        .slice(0, 7)\n        .map(({ emoticons = [], id, name, native, skins = [] }) => {\n          const [firstSkin] = skins;\n\n          return {\n            emoticons,\n            id,\n            name,\n            native: native ?? firstSkin.native,\n          };\n        }) as T[],\n      next: null, // todo: generate cursor\n    };\n  }\n\n  protected filterQueryResults(items: T[]): T[] | Promise<T[]> {\n    return items.map((item) => ({\n      ...item,\n      ...getTokenizedSuggestionDisplayName({\n        displayName: item.id,\n        searchToken: this.searchQuery,\n      }),\n    }));\n  }\n}\n\nconst DEFAULT_OPTIONS: TextComposerMiddlewareOptions = { minChars: 1, trigger: ':' };\n\nexport type EmojiMiddleware<T extends EmojiSearchIndexResult = EmojiSearchIndexResult> =\n  Middleware<\n    TextComposerMiddlewareExecutorState<EmojiSuggestion<T>>,\n    'onChange' | 'onSuggestionItemSelect'\n  >;\n\n/**\n * TextComposer middleware for mentions\n * Usage:\n *\n *  const textComposer = new TextComposer(options);\n *\n *  textComposer.use(new createTextComposerEmojiMiddleware(emojiSearchIndex, {\n *   minChars: 2\n *  }));\n *\n * @param emojiSearchIndex\n * @param {{\n *     minChars: number;\n *     trigger: string;\n *   }} options\n * @returns\n */\nexport const createTextComposerEmojiMiddleware = (\n  emojiSearchIndex: EmojiSearchIndex,\n  options?: Partial<TextComposerMiddlewareOptions>,\n): EmojiMiddleware => {\n  const finalOptions = mergeWith(DEFAULT_OPTIONS, options ?? {});\n  const emojiSearchSource = new EmojiSearchSource(emojiSearchIndex);\n  emojiSearchSource.activate();\n\n  return {\n    id: 'stream-io/emoji-middleware',\n    // eslint-disable-next-line sort-keys\n    handlers: {\n      onChange: async ({ complete, forward, next, state }) => {\n        if (!state.selection) return forward();\n\n        const triggerWithToken = getTriggerCharWithToken({\n          acceptTrailingSpaces: false,\n          text: state.text.slice(0, state.selection.end),\n          trigger: finalOptions.trigger,\n        });\n\n        const triggerWasRemoved =\n          !triggerWithToken || triggerWithToken.length < finalOptions.minChars;\n\n        if (triggerWasRemoved) {\n          const hasSuggestionsForTrigger =\n            state.suggestions?.trigger === finalOptions.trigger;\n          const newState = { ...state };\n          if (hasSuggestionsForTrigger && newState.suggestions) {\n            delete newState.suggestions;\n          }\n          return next(newState);\n        }\n\n        const newSearchTriggerred =\n          triggerWithToken && triggerWithToken === finalOptions.trigger;\n\n        if (newSearchTriggerred) {\n          emojiSearchSource.resetStateAndActivate();\n        }\n\n        const textWithReplacedWord = await replaceWordWithEntity({\n          caretPosition: state.selection.end,\n          getEntityString: async (word: string) => {\n            const { items } = await emojiSearchSource.query(word);\n\n            const emoji = items\n              .filter(Boolean)\n              .slice(0, 10)\n              .find(({ emoticons }) => !!emoticons?.includes(word));\n\n            if (!emoji) return null;\n\n            const [firstSkin] = emoji.skins ?? [];\n\n            return emoji.native ?? firstSkin.native;\n          },\n          text: state.text,\n        });\n\n        if (textWithReplacedWord !== state.text) {\n          return complete({\n            ...state,\n            suggestions: undefined, // to prevent the TextComposerMiddlewareExecutor to run the first page query\n            text: textWithReplacedWord,\n          });\n        }\n\n        return complete({\n          ...state,\n          suggestions: {\n            query: triggerWithToken.slice(1),\n            searchSource: emojiSearchSource,\n            trigger: finalOptions.trigger,\n          },\n        });\n      },\n      onSuggestionItemSelect: ({ complete, forward, state }) => {\n        const { selectedSuggestion } = state.change ?? {};\n        if (!selectedSuggestion || state.suggestions?.trigger !== finalOptions.trigger)\n          return forward();\n\n        emojiSearchSource.resetStateAndActivate();\n        return complete({\n          ...state,\n          ...insertItemWithTrigger({\n            insertText: `${'native' in selectedSuggestion ? selectedSuggestion.native : ''} `,\n            selection: state.selection,\n            text: state.text,\n            trigger: finalOptions.trigger,\n          }),\n          suggestions: undefined, // Clear suggestions after selection\n        });\n      },\n    },\n  };\n};\n"],"names":["useTranslationContext","useMessageComposerContext","useMessageComposerController","useIsCooldownActive","useState","usePopoverPosition","useEffect","IconEmoji","jsxs","jsx","Button","BaseSearchSource","getTokenizedSuggestionDisplayName","getTriggerCharWithToken","replaceWordWithEntity","insertItemWithTrigger"],"mappings":"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"}
+{"version":3,"file":"emojis.js","names":[],"sources":["../../src/plugins/Emojis/EmojiPicker.tsx","../../src/plugins/Emojis/middleware/textComposerEmojiMiddleware.ts"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport PickerImport from '@emoji-mart/react';\n\nimport { useMessageComposerContext, useTranslationContext } from '../../context';\nimport {\n  Button,\n  IconEmoji,\n  type PopperLikePlacement,\n  useMessageComposerController,\n} from '../../components';\nimport { usePopoverPosition } from '../../components/Dialog/hooks/usePopoverPosition';\nimport { useIsCooldownActive } from '../../components/MessageComposer/hooks/useIsCooldownActive';\n\n// @emoji-mart/react ships as CJS with the component on `exports.default`. Under\n// spec-strict ESM interop (e.g. Vite 8 / Rolldown, native Node ESM) a default\n// import yields the module namespace `{ default }` instead of the component,\n// which makes React throw \"Element type is invalid ... got: object\". Unwrap the\n// default defensively so it works regardless of interop.\nconst Picker =\n  (PickerImport as unknown as { default?: typeof PickerImport }).default ?? PickerImport;\n\nconst isShadowRoot = (node: Node): node is ShadowRoot => !!(node as ShadowRoot).host;\n\nexport type EmojiPickerProps = {\n  ButtonIconComponent?: React.ComponentType;\n  buttonClassName?: string;\n  pickerContainerClassName?: string;\n  wrapperClassName?: string;\n  closeOnEmojiSelect?: boolean;\n  /**\n   * Untyped [properties](https://github.com/missive/emoji-mart/tree/v5.5.2#options--props) to be\n   * passed down to the [emoji-mart `Picker`](https://github.com/missive/emoji-mart/tree/v5.5.2#-picker) component\n   */\n  pickerProps?: Partial<{ theme: 'auto' | 'light' | 'dark' } & Record<string, unknown>>;\n  /**\n   * Floating UI placement (default: 'top-end') for the picker popover\n   */\n  placement?: PopperLikePlacement;\n};\n\nconst defaultButtonClassName = 'str-chat__emoji-picker-button';\n\nconst classNames: Pick<\n  EmojiPickerProps,\n  'pickerContainerClassName' | 'wrapperClassName'\n> = {\n  pickerContainerClassName: 'str-chat__message-textarea-emoji-picker-container',\n  wrapperClassName: 'str-chat__message-textarea-emoji-picker',\n};\n\nexport const EmojiPicker = (props: EmojiPickerProps) => {\n  const { t } = useTranslationContext('EmojiPicker');\n  const { textareaRef } = useMessageComposerContext('EmojiPicker');\n  const { textComposer } = useMessageComposerController();\n  const isCooldownActive = useIsCooldownActive();\n  const [displayPicker, setDisplayPicker] = useState(false);\n  const [referenceElement, setReferenceElement] = useState<HTMLButtonElement | null>(\n    null,\n  );\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n  const { refs, strategy, x, y } = usePopoverPosition({\n    offset: 8,\n    placement: props.placement ?? 'top-end',\n  });\n\n  useEffect(() => {\n    refs.setReference(referenceElement);\n  }, [referenceElement, refs]);\n  useEffect(() => {\n    refs.setFloating(popperElement);\n  }, [popperElement, refs]);\n\n  const { pickerContainerClassName, wrapperClassName } = classNames;\n\n  const { ButtonIconComponent = IconEmoji } = props;\n  const pickerStyle = props.pickerProps?.style as React.CSSProperties | undefined;\n\n  useEffect(() => {\n    if (!popperElement || !referenceElement) return;\n\n    const handlePointerDown = (e: PointerEvent) => {\n      const target = e.target as HTMLElement;\n\n      const rootNode = target.getRootNode();\n\n      if (\n        popperElement.contains(isShadowRoot(rootNode) ? rootNode.host : target) ||\n        referenceElement.contains(target)\n      ) {\n        return;\n      }\n\n      setDisplayPicker(false);\n    };\n\n    window.addEventListener('pointerdown', handlePointerDown);\n    return () => window.removeEventListener('pointerdown', handlePointerDown);\n  }, [referenceElement, popperElement]);\n\n  return (\n    <div className={props.wrapperClassName ?? wrapperClassName}>\n      {displayPicker && (\n        <div\n          className={props.pickerContainerClassName ?? pickerContainerClassName}\n          ref={setPopperElement}\n          style={{ left: x ?? 0, position: strategy, top: y ?? 0 }}\n        >\n          <Picker\n            data={async () => (await import('@emoji-mart/data')).default}\n            onEmojiSelect={(e: { native: string }) => {\n              const textarea = textareaRef.current;\n              if (!textarea) return;\n              textComposer.insertText({ text: e.native });\n              textarea.focus();\n              if (props.closeOnEmojiSelect) {\n                setDisplayPicker(false);\n              }\n            }}\n            {...props.pickerProps}\n            style={{ ...pickerStyle, '--shadow': 'none' }}\n          />\n        </div>\n      )}\n      <Button\n        appearance='ghost'\n        aria-expanded={displayPicker}\n        aria-label={t('aria/Emoji picker')}\n        circular\n        className={props.buttonClassName ?? defaultButtonClassName}\n        disabled={isCooldownActive}\n        onClick={() => setDisplayPicker((cv) => !cv)}\n        ref={setReferenceElement}\n        size='sm'\n        type='button'\n        variant='secondary'\n      >\n        {ButtonIconComponent && <ButtonIconComponent />}\n      </Button>\n    </div>\n  );\n};\n","import mergeWith from 'lodash.mergewith';\nimport type {\n  Middleware,\n  SearchSourceOptions,\n  SearchSourceType,\n  TextComposerMiddlewareExecutorState,\n  TextComposerMiddlewareOptions,\n  TextComposerSuggestion,\n} from 'stream-chat';\nimport {\n  BaseSearchSource,\n  getTokenizedSuggestionDisplayName,\n  getTriggerCharWithToken,\n  insertItemWithTrigger,\n  replaceWordWithEntity,\n} from 'stream-chat';\nimport type {\n  EmojiSearchIndex,\n  EmojiSearchIndexResult,\n} from '../../../components/MessageComposer';\n\nexport type EmojiSuggestion<T extends EmojiSearchIndexResult = EmojiSearchIndexResult> =\n  TextComposerSuggestion<T>;\n\nclass EmojiSearchSource<\n  T extends TextComposerSuggestion<EmojiSearchIndexResult>,\n> extends BaseSearchSource<T> {\n  readonly type: SearchSourceType = 'emoji';\n  private emojiSearchIndex: EmojiSearchIndex;\n\n  constructor(emojiSearchIndex: EmojiSearchIndex, options?: SearchSourceOptions) {\n    super(options);\n    this.emojiSearchIndex = emojiSearchIndex;\n  }\n\n  async query(searchQuery: string) {\n    if (searchQuery.length === 0) {\n      return { items: [] as T[], next: null };\n    }\n    const emojis = (await this.emojiSearchIndex.search(searchQuery)) ?? [];\n\n    // emojiIndex.search sometimes returns undefined values, so filter those out first\n    return {\n      items: emojis\n        .filter(Boolean)\n        .slice(0, 7)\n        .map(({ emoticons = [], id, name, native, skins = [] }) => {\n          const [firstSkin] = skins;\n\n          return {\n            emoticons,\n            id,\n            name,\n            native: native ?? firstSkin.native,\n          };\n        }) as T[],\n      next: null, // todo: generate cursor\n    };\n  }\n\n  protected filterQueryResults(items: T[]): T[] | Promise<T[]> {\n    return items.map((item) => ({\n      ...item,\n      ...getTokenizedSuggestionDisplayName({\n        displayName: item.id,\n        searchToken: this.searchQuery,\n      }),\n    }));\n  }\n}\n\nconst DEFAULT_OPTIONS: TextComposerMiddlewareOptions = { minChars: 1, trigger: ':' };\n\nexport type EmojiMiddleware<T extends EmojiSearchIndexResult = EmojiSearchIndexResult> =\n  Middleware<\n    TextComposerMiddlewareExecutorState<EmojiSuggestion<T>>,\n    'onChange' | 'onSuggestionItemSelect'\n  >;\n\n/**\n * TextComposer middleware for mentions\n * Usage:\n *\n *  const textComposer = new TextComposer(options);\n *\n *  textComposer.use(new createTextComposerEmojiMiddleware(emojiSearchIndex, {\n *   minChars: 2\n *  }));\n *\n * @param emojiSearchIndex\n * @param {{\n *     minChars: number;\n *     trigger: string;\n *   }} options\n * @returns\n */\nexport const createTextComposerEmojiMiddleware = (\n  emojiSearchIndex: EmojiSearchIndex,\n  options?: Partial<TextComposerMiddlewareOptions>,\n): EmojiMiddleware => {\n  const finalOptions = mergeWith(DEFAULT_OPTIONS, options ?? {});\n  const emojiSearchSource = new EmojiSearchSource(emojiSearchIndex);\n  emojiSearchSource.activate();\n\n  return {\n    id: 'stream-io/emoji-middleware',\n    // eslint-disable-next-line sort-keys\n    handlers: {\n      onChange: async ({ complete, forward, next, state }) => {\n        if (!state.selection) return forward();\n\n        const triggerWithToken = getTriggerCharWithToken({\n          acceptTrailingSpaces: false,\n          text: state.text.slice(0, state.selection.end),\n          trigger: finalOptions.trigger,\n        });\n\n        const triggerWasRemoved =\n          !triggerWithToken || triggerWithToken.length < finalOptions.minChars;\n\n        if (triggerWasRemoved) {\n          const hasSuggestionsForTrigger =\n            state.suggestions?.trigger === finalOptions.trigger;\n          const newState = { ...state };\n          if (hasSuggestionsForTrigger && newState.suggestions) {\n            delete newState.suggestions;\n          }\n          return next(newState);\n        }\n\n        const newSearchTriggerred =\n          triggerWithToken && triggerWithToken === finalOptions.trigger;\n\n        if (newSearchTriggerred) {\n          emojiSearchSource.resetStateAndActivate();\n        }\n\n        const textWithReplacedWord = await replaceWordWithEntity({\n          caretPosition: state.selection.end,\n          getEntityString: async (word: string) => {\n            const { items } = await emojiSearchSource.query(word);\n\n            const emoji = items\n              .filter(Boolean)\n              .slice(0, 10)\n              .find(({ emoticons }) => !!emoticons?.includes(word));\n\n            if (!emoji) return null;\n\n            const [firstSkin] = emoji.skins ?? [];\n\n            return emoji.native ?? firstSkin.native;\n          },\n          text: state.text,\n        });\n\n        if (textWithReplacedWord !== state.text) {\n          return complete({\n            ...state,\n            suggestions: undefined, // to prevent the TextComposerMiddlewareExecutor to run the first page query\n            text: textWithReplacedWord,\n          });\n        }\n\n        return complete({\n          ...state,\n          suggestions: {\n            query: triggerWithToken.slice(1),\n            searchSource: emojiSearchSource,\n            trigger: finalOptions.trigger,\n          },\n        });\n      },\n      onSuggestionItemSelect: ({ complete, forward, state }) => {\n        const { selectedSuggestion } = state.change ?? {};\n        if (!selectedSuggestion || state.suggestions?.trigger !== finalOptions.trigger)\n          return forward();\n\n        emojiSearchSource.resetStateAndActivate();\n        return complete({\n          ...state,\n          ...insertItemWithTrigger({\n            insertText: `${'native' in selectedSuggestion ? selectedSuggestion.native : ''} `,\n            selection: state.selection,\n            text: state.text,\n            trigger: finalOptions.trigger,\n          }),\n          suggestions: undefined, // Clear suggestions after selection\n        });\n      },\n    },\n  };\n};\n"],"mappings":"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"}