stream-chat-react 13.0.3 → 13.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20474,11 +20474,11 @@ __export(src_exports, {
20474
20474
  module.exports = __toCommonJS(src_exports);
20475
20475
 
20476
20476
  // src/components/Attachment/Attachment.tsx
20477
- var import_react254 = __toESM(require("react"));
20477
+ var import_react255 = __toESM(require("react"));
20478
20478
  var import_stream_chat11 = require("stream-chat");
20479
20479
 
20480
20480
  // src/components/Attachment/AttachmentContainer.tsx
20481
- var import_react253 = __toESM(require("react"));
20481
+ var import_react254 = __toESM(require("react"));
20482
20482
  var import_react_player2 = __toESM(require("react-player"));
20483
20483
  var import_clsx65 = __toESM(require("clsx"));
20484
20484
  var linkify = __toESM(require("linkifyjs"));
@@ -20610,13 +20610,14 @@ var withComponentContext = (Component2) => {
20610
20610
  var import_react10 = __toESM(require("react"));
20611
20611
 
20612
20612
  // src/components/Dialog/DialogManager.ts
20613
+ var import_nanoid = require("nanoid");
20613
20614
  var import_stream_chat = require("stream-chat");
20614
20615
  var DialogManager = class {
20615
20616
  constructor({ id } = {}) {
20616
20617
  this.state = new import_stream_chat.StateStore({
20617
20618
  dialogsById: {}
20618
20619
  });
20619
- this.id = id ?? (/* @__PURE__ */ new Date()).getTime().toString();
20620
+ this.id = id ?? (0, import_nanoid.nanoid)();
20620
20621
  }
20621
20622
  get openDialogCount() {
20622
20623
  return Object.values(this.state.getLatestValue().dialogsById).reduce(
@@ -21723,7 +21724,7 @@ var UnMemoizedAudio = (props) => {
21723
21724
  var Audio = import_react29.default.memo(UnMemoizedAudio);
21724
21725
 
21725
21726
  // src/components/Attachment/VoiceRecording.tsx
21726
- var import_react249 = __toESM(require("react"));
21727
+ var import_react250 = __toESM(require("react"));
21727
21728
 
21728
21729
  // src/components/ReactFileUtilities/FileIcon/FileIcon.tsx
21729
21730
  var import_react31 = __toESM(require("react"));
@@ -22685,8 +22686,8 @@ var FileIcon = (props) => {
22685
22686
 
22686
22687
  // src/components/ReactFileUtilities/UploadButton.tsx
22687
22688
  var import_clsx63 = __toESM(require("clsx"));
22688
- var import_nanoid5 = require("nanoid");
22689
- var import_react248 = __toESM(require("react"));
22689
+ var import_nanoid6 = require("nanoid");
22690
+ var import_react249 = __toESM(require("react"));
22690
22691
 
22691
22692
  // src/components/ReactFileUtilities/utils.ts
22692
22693
  var import_react32 = require("react");
@@ -22786,14 +22787,13 @@ var readFileAsArrayBuffer = (file) => new Promise((resolve, reject) => {
22786
22787
  });
22787
22788
 
22788
22789
  // src/components/MessageInput/AttachmentSelector.tsx
22789
- var import_nanoid3 = require("nanoid");
22790
- var import_react209 = __toESM(require("react"));
22790
+ var import_react210 = __toESM(require("react"));
22791
22791
 
22792
22792
  // src/components/MessageInput/icons.tsx
22793
22793
  var import_react33 = __toESM(require("react"));
22794
- var import_nanoid = require("nanoid");
22794
+ var import_nanoid2 = require("nanoid");
22795
22795
  var LoadingIndicatorIcon = ({ size = 20 }) => {
22796
- const id = (0, import_react33.useMemo)(() => (0, import_nanoid.nanoid)(), []);
22796
+ const id = (0, import_react33.useMemo)(() => (0, import_nanoid2.nanoid)(), []);
22797
22797
  return /* @__PURE__ */ import_react33.default.createElement("div", { className: "str-chat__loading-indicator" }, /* @__PURE__ */ import_react33.default.createElement(
22798
22798
  "svg",
22799
22799
  {
@@ -22962,7 +22962,7 @@ var PlayIcon = () => /* @__PURE__ */ import_react33.default.createElement(
22962
22962
  var CheckSignIcon = () => /* @__PURE__ */ import_react33.default.createElement("svg", { fill: "currentColor", viewBox: "0 0 18 14", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react33.default.createElement("path", { d: "M5.79457 10.875L2.32457 7.40502C1.93457 7.01502 1.30457 7.01502 0.91457 7.40502C0.52457 7.79502 0.52457 8.42502 0.91457 8.81502L5.09457 12.995C5.48457 13.385 6.11457 13.385 6.50457 12.995L17.0846 2.41502C17.4746 2.02502 17.4746 1.39502 17.0846 1.00502C16.6946 0.615024 16.0646 0.615024 15.6746 1.00502L5.79457 10.875Z" }));
22963
22963
 
22964
22964
  // src/components/MessageInput/hooks/useMessageComposer.ts
22965
- var import_react206 = require("react");
22965
+ var import_react207 = require("react");
22966
22966
  var import_stream_chat6 = require("stream-chat");
22967
22967
 
22968
22968
  // src/components/Threads/ThreadContext.tsx
@@ -37594,7 +37594,7 @@ var ThreadList = ({ virtuosoProps }) => {
37594
37594
  };
37595
37595
 
37596
37596
  // src/components/Thread/Thread.tsx
37597
- var import_react205 = __toESM(require("react"));
37597
+ var import_react206 = __toESM(require("react"));
37598
37598
  var import_clsx53 = __toESM(require("clsx"));
37599
37599
 
37600
37600
  // src/components/Message/FixedHeightMessage.tsx
@@ -42705,10 +42705,10 @@ var FixedHeightMessage = import_react108.default.memo(
42705
42705
  );
42706
42706
 
42707
42707
  // src/components/Message/Message.tsx
42708
- var import_react200 = __toESM(require("react"));
42708
+ var import_react201 = __toESM(require("react"));
42709
42709
 
42710
42710
  // src/components/Message/MessageSimple.tsx
42711
- var import_react199 = __toESM(require("react"));
42711
+ var import_react200 = __toESM(require("react"));
42712
42712
  var import_clsx52 = __toESM(require("clsx"));
42713
42713
 
42714
42714
  // src/components/MessageBounce/MessageBounceModal.tsx
@@ -45432,13 +45432,13 @@ var GiphyPreviewMessage = (props) => {
45432
45432
 
45433
45433
  // src/components/MessageList/MessageList.tsx
45434
45434
  var import_clsx49 = __toESM(require("clsx"));
45435
- var import_react187 = __toESM(require("react"));
45435
+ var import_react188 = __toESM(require("react"));
45436
45436
 
45437
45437
  // src/components/MessageList/hooks/MessageList/useEnrichedMessages.ts
45438
45438
  var import_react169 = require("react");
45439
45439
 
45440
45440
  // src/components/MessageList/utils.ts
45441
- var import_nanoid2 = require("nanoid");
45441
+ var import_nanoid3 = require("nanoid");
45442
45442
 
45443
45443
  // src/constants/messageTypes.ts
45444
45444
  var CUSTOM_MESSAGE_TYPE = {
@@ -48547,14 +48547,14 @@ var processMessages = (params) => {
48547
48547
  };
48548
48548
  var makeIntroMessage = () => ({
48549
48549
  customType: CUSTOM_MESSAGE_TYPE.intro,
48550
- id: (0, import_nanoid2.nanoid)()
48550
+ id: (0, import_nanoid3.nanoid)()
48551
48551
  });
48552
48552
  var makeDateMessageId = (date) => {
48553
48553
  let idSuffix;
48554
48554
  try {
48555
- idSuffix = !date ? (0, import_nanoid2.nanoid)() : date instanceof Date ? date.toISOString() : date;
48555
+ idSuffix = !date ? (0, import_nanoid3.nanoid)() : date instanceof Date ? date.toISOString() : date;
48556
48556
  } catch (e) {
48557
- idSuffix = (0, import_nanoid2.nanoid)();
48557
+ idSuffix = (0, import_nanoid3.nanoid)();
48558
48558
  }
48559
48559
  return `${CUSTOM_MESSAGE_TYPE.date}-${idSuffix}`;
48560
48560
  };
@@ -49492,6 +49492,14 @@ function defaultRenderMessages({
49492
49492
  return renderedMessages;
49493
49493
  }
49494
49494
 
49495
+ // src/components/UtilityComponents/useStableId.ts
49496
+ var import_nanoid4 = require("nanoid");
49497
+ var import_react187 = require("react");
49498
+ var useStableId = (key) => {
49499
+ const id = (0, import_react187.useMemo)(() => (0, import_nanoid4.nanoid)(), [key]);
49500
+ return id;
49501
+ };
49502
+
49495
49503
  // src/components/MessageList/MessageList.tsx
49496
49504
  var MessageListWithContext = (props) => {
49497
49505
  const {
@@ -49531,8 +49539,8 @@ var MessageListWithContext = (props) => {
49531
49539
  threadList = false,
49532
49540
  unsafeHTML = false
49533
49541
  } = props;
49534
- const [listElement, setListElement] = import_react187.default.useState(null);
49535
- const [ulElement, setUlElement] = import_react187.default.useState(null);
49542
+ const [listElement, setListElement] = import_react188.default.useState(null);
49543
+ const [ulElement, setUlElement] = import_react188.default.useState(null);
49536
49544
  const { customClasses } = useChatContext("MessageList");
49537
49545
  const {
49538
49546
  EmptyStateIndicator: EmptyStateIndicator2 = EmptyStateIndicator,
@@ -49621,24 +49629,24 @@ var MessageListWithContext = (props) => {
49621
49629
  threadList
49622
49630
  });
49623
49631
  const messageListClass = customClasses?.messageList || "str-chat__list";
49624
- const loadMore = import_react187.default.useCallback(() => {
49632
+ const loadMore = import_react188.default.useCallback(() => {
49625
49633
  if (loadMoreCallback) {
49626
49634
  loadMoreCallback(messageLimit);
49627
49635
  }
49628
49636
  }, [loadMoreCallback, messageLimit]);
49629
- const loadMoreNewer = import_react187.default.useCallback(() => {
49637
+ const loadMoreNewer = import_react188.default.useCallback(() => {
49630
49638
  if (loadMoreNewerCallback) {
49631
49639
  loadMoreNewerCallback(messageLimit);
49632
49640
  }
49633
49641
  }, [loadMoreNewerCallback, messageLimit]);
49634
- const scrollToBottomFromNotification = import_react187.default.useCallback(async () => {
49642
+ const scrollToBottomFromNotification = import_react188.default.useCallback(async () => {
49635
49643
  if (hasMoreNewer) {
49636
49644
  await jumpToLatestMessage();
49637
49645
  } else {
49638
49646
  scrollToBottom();
49639
49647
  }
49640
49648
  }, [scrollToBottom, hasMoreNewer]);
49641
- import_react187.default.useLayoutEffect(() => {
49649
+ import_react188.default.useLayoutEffect(() => {
49642
49650
  if (highlightedMessageId) {
49643
49651
  const element3 = ulElement?.querySelector(
49644
49652
  `[data-message-id='${highlightedMessageId}']`
@@ -49646,14 +49654,15 @@ var MessageListWithContext = (props) => {
49646
49654
  element3?.scrollIntoView({ block: "center" });
49647
49655
  }
49648
49656
  }, [highlightedMessageId]);
49657
+ const id = useStableId();
49649
49658
  const showEmptyStateIndicator = elements.length === 0 && !threadList;
49650
- const dialogManagerId = threadList ? "message-list-dialog-manager-thread" : "message-list-dialog-manager";
49651
- return /* @__PURE__ */ import_react187.default.createElement(MessageListContextProvider, { value: { listElement, scrollToBottom } }, /* @__PURE__ */ import_react187.default.createElement(MessageListMainPanel2, null, /* @__PURE__ */ import_react187.default.createElement(DialogManagerProvider, { id: dialogManagerId }, !threadList && showUnreadMessagesNotification && /* @__PURE__ */ import_react187.default.createElement(
49659
+ const dialogManagerId = threadList ? `message-list-dialog-manager-thread-${id}` : `message-list-dialog-manager-${id}`;
49660
+ return /* @__PURE__ */ import_react188.default.createElement(MessageListContextProvider, { value: { listElement, scrollToBottom } }, /* @__PURE__ */ import_react188.default.createElement(MessageListMainPanel2, null, /* @__PURE__ */ import_react188.default.createElement(DialogManagerProvider, { id: dialogManagerId }, !threadList && showUnreadMessagesNotification && /* @__PURE__ */ import_react188.default.createElement(
49652
49661
  UnreadMessagesNotification2,
49653
49662
  {
49654
49663
  unreadCount: channelUnreadUiState?.unread_messages
49655
49664
  }
49656
- ), /* @__PURE__ */ import_react187.default.createElement(
49665
+ ), /* @__PURE__ */ import_react188.default.createElement(
49657
49666
  "div",
49658
49667
  {
49659
49668
  className: (0, import_clsx49.default)(messageListClass, customClasses?.threadList),
@@ -49661,7 +49670,7 @@ var MessageListWithContext = (props) => {
49661
49670
  ref: setListElement,
49662
49671
  tabIndex: 0
49663
49672
  },
49664
- showEmptyStateIndicator ? /* @__PURE__ */ import_react187.default.createElement(EmptyStateIndicator2, { listType: threadList ? "thread" : "message" }) : /* @__PURE__ */ import_react187.default.createElement(
49673
+ showEmptyStateIndicator ? /* @__PURE__ */ import_react188.default.createElement(EmptyStateIndicator2, { listType: threadList ? "thread" : "message" }) : /* @__PURE__ */ import_react188.default.createElement(
49665
49674
  InfiniteScroll,
49666
49675
  {
49667
49676
  className: "str-chat__message-list-scroll",
@@ -49670,17 +49679,17 @@ var MessageListWithContext = (props) => {
49670
49679
  hasPreviousPage: props.hasMore,
49671
49680
  head: props.head,
49672
49681
  isLoading: props.loadingMore,
49673
- loader: /* @__PURE__ */ import_react187.default.createElement("div", { className: "str-chat__list__loading", key: "loading-indicator" }, props.loadingMore && /* @__PURE__ */ import_react187.default.createElement(LoadingIndicator2, { size: 20 })),
49682
+ loader: /* @__PURE__ */ import_react188.default.createElement("div", { className: "str-chat__list__loading", key: "loading-indicator" }, props.loadingMore && /* @__PURE__ */ import_react188.default.createElement(LoadingIndicator2, { size: 20 })),
49674
49683
  loadNextPage: loadMoreNewer,
49675
49684
  loadPreviousPage: loadMore,
49676
49685
  threshold: loadMoreScrollThreshold,
49677
49686
  ...restInternalInfiniteScrollProps
49678
49687
  },
49679
- /* @__PURE__ */ import_react187.default.createElement("ul", { className: "str-chat__ul", ref: setUlElement }, elements),
49680
- /* @__PURE__ */ import_react187.default.createElement(TypingIndicator2, { threadList }),
49681
- /* @__PURE__ */ import_react187.default.createElement("div", { key: "bottom" })
49688
+ /* @__PURE__ */ import_react188.default.createElement("ul", { className: "str-chat__ul", ref: setUlElement }, elements),
49689
+ /* @__PURE__ */ import_react188.default.createElement(TypingIndicator2, { threadList }),
49690
+ /* @__PURE__ */ import_react188.default.createElement("div", { key: "bottom" })
49682
49691
  )
49683
- ))), /* @__PURE__ */ import_react187.default.createElement(
49692
+ ))), /* @__PURE__ */ import_react188.default.createElement(
49684
49693
  MessageListNotifications2,
49685
49694
  {
49686
49695
  hasNewMessages,
@@ -49705,7 +49714,7 @@ var MessageList = (props) => {
49705
49714
  // eslint-disable-line @typescript-eslint/no-unused-vars
49706
49715
  ...restChannelStateContext
49707
49716
  } = useChannelStateContext("MessageList");
49708
- return /* @__PURE__ */ import_react187.default.createElement(
49717
+ return /* @__PURE__ */ import_react188.default.createElement(
49709
49718
  MessageListWithContext,
49710
49719
  {
49711
49720
  jumpToLatestMessage,
@@ -49718,16 +49727,16 @@ var MessageList = (props) => {
49718
49727
  };
49719
49728
 
49720
49729
  // src/components/MessageList/ScrollToBottomButton.tsx
49721
- var import_react188 = __toESM(require("react"));
49730
+ var import_react189 = __toESM(require("react"));
49722
49731
  var import_clsx50 = __toESM(require("clsx"));
49723
49732
  var UnMemoizedScrollToBottomButton = (props) => {
49724
49733
  const { isMessageListScrolledToBottom, onClick, threadList } = props;
49725
49734
  const { channel: activeChannel, client } = useChatContext();
49726
49735
  const { thread } = useChannelStateContext();
49727
- const [countUnread, setCountUnread] = (0, import_react188.useState)(activeChannel?.countUnread() || 0);
49728
- const [replyCount, setReplyCount] = (0, import_react188.useState)(thread?.reply_count || 0);
49736
+ const [countUnread, setCountUnread] = (0, import_react189.useState)(activeChannel?.countUnread() || 0);
49737
+ const [replyCount, setReplyCount] = (0, import_react189.useState)(thread?.reply_count || 0);
49729
49738
  const observedEvent = threadList ? "message.updated" : "message.new";
49730
- (0, import_react188.useEffect)(() => {
49739
+ (0, import_react189.useEffect)(() => {
49731
49740
  const handleEvent = (event) => {
49732
49741
  const newMessageInAnotherChannel = event.cid !== activeChannel?.cid;
49733
49742
  const newMessageIsMine = event.user?.id === client.user?.id;
@@ -49749,14 +49758,14 @@ var UnMemoizedScrollToBottomButton = (props) => {
49749
49758
  client.off(observedEvent, handleEvent);
49750
49759
  };
49751
49760
  }, [activeChannel, isMessageListScrolledToBottom, observedEvent, replyCount, thread]);
49752
- (0, import_react188.useEffect)(() => {
49761
+ (0, import_react189.useEffect)(() => {
49753
49762
  if (isMessageListScrolledToBottom) {
49754
49763
  setCountUnread(0);
49755
49764
  setReplyCount(thread?.reply_count || 0);
49756
49765
  }
49757
49766
  }, [isMessageListScrolledToBottom, thread]);
49758
49767
  if (isMessageListScrolledToBottom) return null;
49759
- return /* @__PURE__ */ import_react188.default.createElement("div", { className: "str-chat__jump-to-latest-message" }, /* @__PURE__ */ import_react188.default.createElement(
49768
+ return /* @__PURE__ */ import_react189.default.createElement("div", { className: "str-chat__jump-to-latest-message" }, /* @__PURE__ */ import_react189.default.createElement(
49760
49769
  "button",
49761
49770
  {
49762
49771
  "aria-live": "polite",
@@ -49767,8 +49776,8 @@ var UnMemoizedScrollToBottomButton = (props) => {
49767
49776
  "data-testid": "message-notification",
49768
49777
  onClick
49769
49778
  },
49770
- /* @__PURE__ */ import_react188.default.createElement(ArrowDown, null),
49771
- countUnread > 0 && /* @__PURE__ */ import_react188.default.createElement(
49779
+ /* @__PURE__ */ import_react189.default.createElement(ArrowDown, null),
49780
+ countUnread > 0 && /* @__PURE__ */ import_react189.default.createElement(
49772
49781
  "div",
49773
49782
  {
49774
49783
  className: (0, import_clsx50.default)(
@@ -49781,23 +49790,23 @@ var UnMemoizedScrollToBottomButton = (props) => {
49781
49790
  )
49782
49791
  ));
49783
49792
  };
49784
- var ScrollToBottomButton = import_react188.default.memo(
49793
+ var ScrollToBottomButton = import_react189.default.memo(
49785
49794
  UnMemoizedScrollToBottomButton
49786
49795
  );
49787
49796
 
49788
49797
  // src/components/MessageList/VirtualizedMessageList.tsx
49789
- var import_react198 = __toESM(require("react"));
49798
+ var import_react199 = __toESM(require("react"));
49790
49799
  var import_react_virtuoso2 = require("react-virtuoso");
49791
49800
 
49792
49801
  // src/components/MessageList/hooks/VirtualizedMessageList/useNewMessageNotification.ts
49793
- var import_react189 = require("react");
49802
+ var import_react190 = require("react");
49794
49803
  function useNewMessageNotification(messages, currentUserId, hasMoreNewer) {
49795
- const [newMessagesNotification, setNewMessagesNotification] = (0, import_react189.useState)(false);
49796
- const [isMessageListScrolledToBottom, setIsMessageListScrolledToBottom] = (0, import_react189.useState)(true);
49797
- const didMount = (0, import_react189.useRef)(false);
49798
- const lastMessageId = (0, import_react189.useRef)("");
49799
- const atBottom = (0, import_react189.useRef)(false);
49800
- (0, import_react189.useEffect)(() => {
49804
+ const [newMessagesNotification, setNewMessagesNotification] = (0, import_react190.useState)(false);
49805
+ const [isMessageListScrolledToBottom, setIsMessageListScrolledToBottom] = (0, import_react190.useState)(true);
49806
+ const didMount = (0, import_react190.useRef)(false);
49807
+ const lastMessageId = (0, import_react190.useRef)("");
49808
+ const atBottom = (0, import_react190.useRef)(false);
49809
+ (0, import_react190.useEffect)(() => {
49801
49810
  if (hasMoreNewer) {
49802
49811
  setNewMessagesNotification(true);
49803
49812
  return;
@@ -49823,17 +49832,17 @@ function useNewMessageNotification(messages, currentUserId, hasMoreNewer) {
49823
49832
  }
49824
49833
 
49825
49834
  // src/components/MessageList/hooks/VirtualizedMessageList/usePrependMessagesCount.ts
49826
- var import_react190 = require("react");
49835
+ var import_react191 = require("react");
49827
49836
  var STATUSES_EXCLUDED_FROM_PREPEND = {
49828
49837
  failed: true,
49829
49838
  sending: true
49830
49839
  };
49831
49840
  function usePrependedMessagesCount(messages, hasDateSeparator) {
49832
49841
  const firstRealMessageIndex = hasDateSeparator ? 1 : 0;
49833
- const firstMessageOnFirstLoadedPage = (0, import_react190.useRef)(void 0);
49834
- const previousFirstMessageOnFirstLoadedPage = (0, import_react190.useRef)(void 0);
49835
- const previousNumItemsPrepended = (0, import_react190.useRef)(0);
49836
- const numItemsPrepended = (0, import_react190.useMemo)(() => {
49842
+ const firstMessageOnFirstLoadedPage = (0, import_react191.useRef)(void 0);
49843
+ const previousFirstMessageOnFirstLoadedPage = (0, import_react191.useRef)(void 0);
49844
+ const previousNumItemsPrepended = (0, import_react191.useRef)(0);
49845
+ const numItemsPrepended = (0, import_react191.useMemo)(() => {
49837
49846
  if (!messages || !messages.length) {
49838
49847
  previousNumItemsPrepended.current = 0;
49839
49848
  return 0;
@@ -49864,10 +49873,10 @@ function usePrependedMessagesCount(messages, hasDateSeparator) {
49864
49873
  }
49865
49874
 
49866
49875
  // src/components/MessageList/hooks/VirtualizedMessageList/useShouldForceScrollToBottom.ts
49867
- var import_react191 = require("react");
49876
+ var import_react192 = require("react");
49868
49877
  function useShouldForceScrollToBottom(messages, currentUserId) {
49869
- const lastFocusedOwnMessage = (0, import_react191.useRef)("");
49870
- const initialFocusRegistered = (0, import_react191.useRef)(false);
49878
+ const lastFocusedOwnMessage = (0, import_react192.useRef)("");
49879
+ const initialFocusRegistered = (0, import_react192.useRef)(false);
49871
49880
  function recheckForNewOwnMessage() {
49872
49881
  if (messages && messages.length > 0) {
49873
49882
  const lastMessage = messages[messages.length - 1];
@@ -49878,7 +49887,7 @@ function useShouldForceScrollToBottom(messages, currentUserId) {
49878
49887
  }
49879
49888
  return false;
49880
49889
  }
49881
- (0, import_react191.useEffect)(() => {
49890
+ (0, import_react192.useEffect)(() => {
49882
49891
  if (messages && messages.length && !initialFocusRegistered.current) {
49883
49892
  initialFocusRegistered.current = true;
49884
49893
  recheckForNewOwnMessage();
@@ -49888,11 +49897,11 @@ function useShouldForceScrollToBottom(messages, currentUserId) {
49888
49897
  }
49889
49898
 
49890
49899
  // src/components/MessageList/hooks/VirtualizedMessageList/useGiphyPreview.ts
49891
- var import_react192 = require("react");
49900
+ var import_react193 = require("react");
49892
49901
  var useGiphyPreview = (separateGiphyPreview) => {
49893
- const [giphyPreviewMessage, setGiphyPreviewMessage] = (0, import_react192.useState)();
49902
+ const [giphyPreviewMessage, setGiphyPreviewMessage] = (0, import_react193.useState)();
49894
49903
  const { client } = useChatContext("useGiphyPreview");
49895
- (0, import_react192.useEffect)(() => {
49904
+ (0, import_react193.useEffect)(() => {
49896
49905
  if (!separateGiphyPreview) return;
49897
49906
  const handleEvent = (event) => {
49898
49907
  const { message, user } = event;
@@ -49910,11 +49919,11 @@ var useGiphyPreview = (separateGiphyPreview) => {
49910
49919
  };
49911
49920
 
49912
49921
  // src/components/MessageList/hooks/VirtualizedMessageList/useMessageSetKey.ts
49913
- var import_react193 = require("react");
49922
+ var import_react194 = require("react");
49914
49923
  var useMessageSetKey = ({ messages }) => {
49915
- const [messageSetKey, setMessageSetKey] = (0, import_react193.useState)(+/* @__PURE__ */ new Date());
49916
- const firstMessageId = (0, import_react193.useRef)(void 0);
49917
- (0, import_react193.useEffect)(() => {
49924
+ const [messageSetKey, setMessageSetKey] = (0, import_react194.useState)(+/* @__PURE__ */ new Date());
49925
+ const firstMessageId = (0, import_react194.useRef)(void 0);
49926
+ (0, import_react194.useEffect)(() => {
49918
49927
  const continuousSet = messages?.find(
49919
49928
  (message) => message.id === firstMessageId.current
49920
49929
  );
@@ -49929,24 +49938,24 @@ var useMessageSetKey = ({ messages }) => {
49929
49938
  };
49930
49939
 
49931
49940
  // src/components/MessageList/hooks/VirtualizedMessageList/useScrollToBottomOnNewMessage.ts
49932
- var import_react194 = require("react");
49941
+ var import_react195 = require("react");
49933
49942
  var useScrollToBottomOnNewMessage = ({
49934
49943
  messages,
49935
49944
  scrollToBottom,
49936
49945
  scrollToLatestMessageOnFocus
49937
49946
  }) => {
49938
- const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = (0, import_react194.useState)(false);
49939
- const scrollToBottomIfConfigured = (0, import_react194.useRef)(void 0);
49947
+ const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = (0, import_react195.useState)(false);
49948
+ const scrollToBottomIfConfigured = (0, import_react195.useRef)(void 0);
49940
49949
  scrollToBottomIfConfigured.current = (event) => {
49941
49950
  if (!scrollToLatestMessageOnFocus || !newMessagesReceivedInBackground || event.target !== window) {
49942
49951
  return;
49943
49952
  }
49944
49953
  setTimeout(scrollToBottom, 100);
49945
49954
  };
49946
- (0, import_react194.useEffect)(() => {
49955
+ (0, import_react195.useEffect)(() => {
49947
49956
  setNewMessagesReceivedInBackground(true);
49948
49957
  }, [messages]);
49949
- (0, import_react194.useEffect)(() => {
49958
+ (0, import_react195.useEffect)(() => {
49950
49959
  const handleFocus = (event) => {
49951
49960
  scrollToBottomIfConfigured.current?.(event);
49952
49961
  };
@@ -49965,14 +49974,14 @@ var useScrollToBottomOnNewMessage = ({
49965
49974
  };
49966
49975
 
49967
49976
  // src/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.ts
49968
- var import_react195 = require("react");
49977
+ var import_react196 = require("react");
49969
49978
  var useUnreadMessagesNotificationVirtualized = ({
49970
49979
  lastRead,
49971
49980
  showAlways,
49972
49981
  unreadCount
49973
49982
  }) => {
49974
- const [show, setShow] = (0, import_react195.useState)(false);
49975
- const toggleShowUnreadMessagesNotification = (0, import_react195.useCallback)(
49983
+ const [show, setShow] = (0, import_react196.useState)(false);
49984
+ const toggleShowUnreadMessagesNotification = (0, import_react196.useCallback)(
49976
49985
  (renderedMessages) => {
49977
49986
  if (!unreadCount) return;
49978
49987
  const firstRenderedMessage = renderedMessages[0];
@@ -49993,7 +50002,7 @@ var useUnreadMessagesNotificationVirtualized = ({
49993
50002
  },
49994
50003
  [lastRead, showAlways, unreadCount]
49995
50004
  );
49996
- (0, import_react195.useEffect)(() => {
50005
+ (0, import_react196.useEffect)(() => {
49997
50006
  if (!unreadCount) setShow(false);
49998
50007
  }, [unreadCount]);
49999
50008
  return { show, toggleShowUnreadMessagesNotification };
@@ -50002,7 +50011,7 @@ var useUnreadMessagesNotificationVirtualized = ({
50002
50011
  // src/components/MessageList/VirtualizedMessageListComponents.tsx
50003
50012
  var import_clsx51 = __toESM(require("clsx"));
50004
50013
  var import_lodash17 = __toESM(require("lodash.throttle"));
50005
- var import_react196 = __toESM(require("react"));
50014
+ var import_react197 = __toESM(require("react"));
50006
50015
  var PREPEND_OFFSET = 10 ** 7;
50007
50016
  function calculateItemIndex(virtuosoIndex, numItemsPrepended) {
50008
50017
  return virtuosoIndex + numItemsPrepended - PREPEND_OFFSET;
@@ -50020,10 +50029,10 @@ var makeItemsRenderedHandler = (renderedItemsActions, processedMessages) => (0,
50020
50029
  );
50021
50030
  }, 200);
50022
50031
  var Item = ({ context, ...props }) => {
50023
- if (!context) return /* @__PURE__ */ import_react196.default.createElement(import_react196.default.Fragment, null);
50032
+ if (!context) return /* @__PURE__ */ import_react197.default.createElement(import_react197.default.Fragment, null);
50024
50033
  const message = context.processedMessages[calculateItemIndex(props["data-item-index"], context.numItemsPrepended)];
50025
50034
  const groupStyles = context.messageGroupStyles[message.id];
50026
- return /* @__PURE__ */ import_react196.default.createElement(
50035
+ return /* @__PURE__ */ import_react197.default.createElement(
50027
50036
  "div",
50028
50037
  {
50029
50038
  ...props,
@@ -50037,13 +50046,13 @@ var Header = ({ context }) => {
50037
50046
  const { LoadingIndicator: LoadingIndicator2 = LoadingIndicator } = useComponentContext(
50038
50047
  "VirtualizedMessageListHeader"
50039
50048
  );
50040
- return /* @__PURE__ */ import_react196.default.createElement(import_react196.default.Fragment, null, context?.head, context?.loadingMore && LoadingIndicator2 && /* @__PURE__ */ import_react196.default.createElement("div", { className: "str-chat__virtual-list__loading" }, /* @__PURE__ */ import_react196.default.createElement(LoadingIndicator2, { size: 20 })));
50049
+ return /* @__PURE__ */ import_react197.default.createElement(import_react197.default.Fragment, null, context?.head, context?.loadingMore && LoadingIndicator2 && /* @__PURE__ */ import_react197.default.createElement("div", { className: "str-chat__virtual-list__loading" }, /* @__PURE__ */ import_react197.default.createElement(LoadingIndicator2, { size: 20 })));
50041
50050
  };
50042
50051
  var EmptyPlaceholder = ({ context }) => {
50043
50052
  const { EmptyStateIndicator: EmptyStateIndicator2 = EmptyStateIndicator } = useComponentContext(
50044
50053
  "VirtualizedMessageList"
50045
50054
  );
50046
- return /* @__PURE__ */ import_react196.default.createElement(import_react196.default.Fragment, null, EmptyStateIndicator2 && /* @__PURE__ */ import_react196.default.createElement(EmptyStateIndicator2, { listType: context?.threadList ? "thread" : "message" }));
50055
+ return /* @__PURE__ */ import_react197.default.createElement(import_react197.default.Fragment, null, EmptyStateIndicator2 && /* @__PURE__ */ import_react197.default.createElement(EmptyStateIndicator2, { listType: context?.threadList ? "thread" : "message" }));
50047
50056
  };
50048
50057
  var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
50049
50058
  const {
@@ -50079,12 +50088,12 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
50079
50088
  return customMessageRenderer(messageList, streamMessageIndex);
50080
50089
  }
50081
50090
  const message = messageList[streamMessageIndex];
50082
- if (!message || isIntroMessage(message)) return /* @__PURE__ */ import_react196.default.createElement("div", { style: { height: "1px" } });
50091
+ if (!message || isIntroMessage(message)) return /* @__PURE__ */ import_react197.default.createElement("div", { style: { height: "1px" } });
50083
50092
  if (isDateSeparatorMessage(message)) {
50084
- return DateSeparator2 ? /* @__PURE__ */ import_react196.default.createElement(DateSeparator2, { date: message.date, unread: message.unread }) : null;
50093
+ return DateSeparator2 ? /* @__PURE__ */ import_react197.default.createElement(DateSeparator2, { date: message.date, unread: message.unread }) : null;
50085
50094
  }
50086
50095
  if (message.type === "system") {
50087
- return MessageSystem ? /* @__PURE__ */ import_react196.default.createElement(MessageSystem, { message }) : null;
50096
+ return MessageSystem ? /* @__PURE__ */ import_react197.default.createElement(MessageSystem, { message }) : null;
50088
50097
  }
50089
50098
  const maybePrevMessage = messageList[streamMessageIndex - 1];
50090
50099
  const maybeNextMessage = messageList[streamMessageIndex + 1];
@@ -50100,7 +50109,7 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
50100
50109
  previousMessage: streamMessageIndex ? messageList[streamMessageIndex - 1] : void 0,
50101
50110
  unreadMessageCount
50102
50111
  });
50103
- return /* @__PURE__ */ import_react196.default.createElement(import_react196.default.Fragment, null, isFirstUnreadMessage && /* @__PURE__ */ import_react196.default.createElement("div", { className: "str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react196.default.createElement(UnreadMessagesSeparator2, { unreadCount: unreadMessageCount })), /* @__PURE__ */ import_react196.default.createElement(
50112
+ return /* @__PURE__ */ import_react197.default.createElement(import_react197.default.Fragment, null, isFirstUnreadMessage && /* @__PURE__ */ import_react197.default.createElement("div", { className: "str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react197.default.createElement(UnreadMessagesSeparator2, { unreadCount: unreadMessageCount })), /* @__PURE__ */ import_react197.default.createElement(
50104
50113
  Message,
50105
50114
  {
50106
50115
  additionalMessageInputProps,
@@ -50127,12 +50136,12 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
50127
50136
  };
50128
50137
 
50129
50138
  // src/context/VirtualizedMessageListContext.tsx
50130
- var import_react197 = __toESM(require("react"));
50131
- var VirtualizedMessageListContext = (0, import_react197.createContext)(void 0);
50139
+ var import_react198 = __toESM(require("react"));
50140
+ var VirtualizedMessageListContext = (0, import_react198.createContext)(void 0);
50132
50141
  var VirtualizedMessageListContextProvider = ({
50133
50142
  children,
50134
50143
  value
50135
- }) => /* @__PURE__ */ import_react197.default.createElement(
50144
+ }) => /* @__PURE__ */ import_react198.default.createElement(
50136
50145
  VirtualizedMessageListContext.Provider,
50137
50146
  {
50138
50147
  value
@@ -50147,7 +50156,7 @@ function captureResizeObserverExceededError(e) {
50147
50156
  }
50148
50157
  }
50149
50158
  function useCaptureResizeObserverExceededError() {
50150
- (0, import_react198.useEffect)(() => {
50159
+ (0, import_react199.useEffect)(() => {
50151
50160
  window.addEventListener("error", captureResizeObserverExceededError);
50152
50161
  return () => {
50153
50162
  window.removeEventListener("error", captureResizeObserverExceededError);
@@ -50231,15 +50240,15 @@ var VirtualizedMessageListWithContext = (props) => {
50231
50240
  } = useComponentContext("VirtualizedMessageList");
50232
50241
  const MessageUIComponent = MessageUIComponentFromProps || MessageUIComponentFromContext;
50233
50242
  const { client, customClasses } = useChatContext("VirtualizedMessageList");
50234
- const virtuoso = (0, import_react198.useRef)(null);
50235
- const lastRead = (0, import_react198.useMemo)(() => channel.lastRead?.(), [channel]);
50243
+ const virtuoso = (0, import_react199.useRef)(null);
50244
+ const lastRead = (0, import_react199.useMemo)(() => channel.lastRead?.(), [channel]);
50236
50245
  const { show: showUnreadMessagesNotification, toggleShowUnreadMessagesNotification } = useUnreadMessagesNotificationVirtualized({
50237
50246
  lastRead: channelUnreadUiState?.last_read,
50238
50247
  showAlways: !!showUnreadNotificationAlways,
50239
50248
  unreadCount: channelUnreadUiState?.unread_messages ?? 0
50240
50249
  });
50241
50250
  const { giphyPreviewMessage, setGiphyPreviewMessage } = useGiphyPreview(separateGiphyPreview);
50242
- const processedMessages = (0, import_react198.useMemo)(() => {
50251
+ const processedMessages = (0, import_react199.useMemo)(() => {
50243
50252
  if (typeof messages === "undefined") {
50244
50253
  return [];
50245
50254
  }
@@ -50271,12 +50280,12 @@ var VirtualizedMessageListWithContext = (props) => {
50271
50280
  returnAllReadData,
50272
50281
  userID: client.userID
50273
50282
  });
50274
- const lastReceivedMessageId = (0, import_react198.useMemo)(
50283
+ const lastReceivedMessageId = (0, import_react199.useMemo)(
50275
50284
  () => getLastReceived(processedMessages),
50276
50285
  [processedMessages]
50277
50286
  );
50278
50287
  const groupStylesFn = groupStyles || getGroupStyles;
50279
- const messageGroupStyles = (0, import_react198.useMemo)(
50288
+ const messageGroupStyles = (0, import_react199.useMemo)(
50280
50289
  () => processedMessages.reduce((acc, message, i) => {
50281
50290
  const style = groupStylesFn(
50282
50291
  message,
@@ -50309,7 +50318,7 @@ var VirtualizedMessageListWithContext = (props) => {
50309
50318
  messageListIsThread: !!threadList,
50310
50319
  wasMarkedUnread: !!channelUnreadUiState?.first_unread_message_id
50311
50320
  });
50312
- const scrollToBottom = (0, import_react198.useCallback)(async () => {
50321
+ const scrollToBottom = (0, import_react199.useCallback)(async () => {
50313
50322
  if (hasMoreNewer) {
50314
50323
  await jumpToLatestMessage();
50315
50324
  return;
@@ -50341,7 +50350,7 @@ var VirtualizedMessageListWithContext = (props) => {
50341
50350
  processedMessages,
50342
50351
  client.userID
50343
50352
  );
50344
- const handleItemsRendered = (0, import_react198.useMemo)(
50353
+ const handleItemsRendered = (0, import_react199.useMemo)(
50345
50354
  () => makeItemsRenderedHandler([toggleShowUnreadMessagesNotification], processedMessages),
50346
50355
  [processedMessages, toggleShowUnreadMessagesNotification]
50347
50356
  );
@@ -50354,7 +50363,7 @@ var VirtualizedMessageListWithContext = (props) => {
50354
50363
  }
50355
50364
  return isAtBottom ? stickToBottomScrollBehavior : false;
50356
50365
  };
50357
- const computeItemKey2 = (0, import_react198.useCallback)(
50366
+ const computeItemKey2 = (0, import_react199.useCallback)(
50358
50367
  (index3, _, { numItemsPrepended: numItemsPrepended2, processedMessages: processedMessages2 }) => processedMessages2[calculateItemIndex(index3, numItemsPrepended2)].id,
50359
50368
  []
50360
50369
  );
@@ -50371,7 +50380,7 @@ var VirtualizedMessageListWithContext = (props) => {
50371
50380
  loadMore?.(messageLimit);
50372
50381
  }
50373
50382
  };
50374
- (0, import_react198.useEffect)(() => {
50383
+ (0, import_react199.useEffect)(() => {
50375
50384
  let scrollTimeout;
50376
50385
  if (highlightedMessageId) {
50377
50386
  const index3 = findMessageIndex(processedMessages, highlightedMessageId);
@@ -50385,19 +50394,20 @@ var VirtualizedMessageListWithContext = (props) => {
50385
50394
  clearTimeout(scrollTimeout);
50386
50395
  };
50387
50396
  }, [highlightedMessageId, processedMessages]);
50397
+ const id = useStableId();
50388
50398
  if (!processedMessages) return null;
50389
- const dialogManagerId = threadList ? "virtualized-message-list-dialog-manager-thread" : "virtualized-message-list-dialog-manager";
50390
- return /* @__PURE__ */ import_react198.default.createElement(VirtualizedMessageListContextProvider, { value: { scrollToBottom } }, /* @__PURE__ */ import_react198.default.createElement(MessageListMainPanel2, null, /* @__PURE__ */ import_react198.default.createElement(DialogManagerProvider, { id: dialogManagerId }, !threadList && showUnreadMessagesNotification && /* @__PURE__ */ import_react198.default.createElement(
50399
+ const dialogManagerId = threadList ? `virtualized-message-list-dialog-manager-thread-${id}` : `virtualized-message-list-dialog-manager-${id}`;
50400
+ return /* @__PURE__ */ import_react199.default.createElement(VirtualizedMessageListContextProvider, { value: { scrollToBottom } }, /* @__PURE__ */ import_react199.default.createElement(MessageListMainPanel2, null, /* @__PURE__ */ import_react199.default.createElement(DialogManagerProvider, { id: dialogManagerId }, !threadList && showUnreadMessagesNotification && /* @__PURE__ */ import_react199.default.createElement(
50391
50401
  UnreadMessagesNotification2,
50392
50402
  {
50393
50403
  unreadCount: channelUnreadUiState?.unread_messages
50394
50404
  }
50395
- ), /* @__PURE__ */ import_react198.default.createElement(
50405
+ ), /* @__PURE__ */ import_react199.default.createElement(
50396
50406
  "div",
50397
50407
  {
50398
50408
  className: customClasses?.virtualizedMessageList || "str-chat__virtual-list"
50399
50409
  },
50400
- /* @__PURE__ */ import_react198.default.createElement(
50410
+ /* @__PURE__ */ import_react199.default.createElement(
50401
50411
  import_react_virtuoso2.Virtuoso,
50402
50412
  {
50403
50413
  atBottomStateChange,
@@ -50463,7 +50473,7 @@ var VirtualizedMessageListWithContext = (props) => {
50463
50473
  ...defaultItemHeight ? { defaultItemHeight } : {}
50464
50474
  }
50465
50475
  )
50466
- )), TypingIndicator2 && /* @__PURE__ */ import_react198.default.createElement(TypingIndicator2, null)), /* @__PURE__ */ import_react198.default.createElement(
50476
+ )), TypingIndicator2 && /* @__PURE__ */ import_react199.default.createElement(TypingIndicator2, null)), /* @__PURE__ */ import_react199.default.createElement(
50467
50477
  MessageListNotifications2,
50468
50478
  {
50469
50479
  hasNewMessages: newMessagesNotification,
@@ -50475,7 +50485,7 @@ var VirtualizedMessageListWithContext = (props) => {
50475
50485
  threadList,
50476
50486
  unreadCount: threadList ? void 0 : channelUnreadUiState?.unread_messages
50477
50487
  }
50478
- ), giphyPreviewMessage && /* @__PURE__ */ import_react198.default.createElement(GiphyPreviewMessage2, { message: giphyPreviewMessage }));
50488
+ ), giphyPreviewMessage && /* @__PURE__ */ import_react199.default.createElement(GiphyPreviewMessage2, { message: giphyPreviewMessage }));
50479
50489
  };
50480
50490
  function VirtualizedMessageList(props) {
50481
50491
  const { jumpToLatestMessage, loadMore, loadMoreNewer } = useChannelActionContext(
@@ -50495,7 +50505,7 @@ function VirtualizedMessageList(props) {
50495
50505
  suppressAutoscroll
50496
50506
  } = useChannelStateContext("VirtualizedMessageList");
50497
50507
  const messages = props.messages || contextMessages;
50498
- return /* @__PURE__ */ import_react198.default.createElement(
50508
+ return /* @__PURE__ */ import_react199.default.createElement(
50499
50509
  VirtualizedMessageListWithContext,
50500
50510
  {
50501
50511
  channel,
@@ -50539,8 +50549,8 @@ var MessageSimpleWithContext = (props) => {
50539
50549
  } = props;
50540
50550
  const { client } = useChatContext("MessageSimple");
50541
50551
  const { t } = useTranslationContext("MessageSimple");
50542
- const [isBounceDialogOpen, setIsBounceDialogOpen] = (0, import_react199.useState)(false);
50543
- const [isEditedTimestampOpen, setEditedTimestampOpen] = (0, import_react199.useState)(false);
50552
+ const [isBounceDialogOpen, setIsBounceDialogOpen] = (0, import_react200.useState)(false);
50553
+ const [isEditedTimestampOpen, setEditedTimestampOpen] = (0, import_react200.useState)(false);
50544
50554
  const {
50545
50555
  Attachment: Attachment2 = Attachment,
50546
50556
  Avatar: Avatar2 = Avatar,
@@ -50560,7 +50570,7 @@ var MessageSimpleWithContext = (props) => {
50560
50570
  } = useComponentContext("MessageSimple");
50561
50571
  const hasAttachment = messageHasAttachments(message);
50562
50572
  const hasReactions = messageHasReactions(message);
50563
- const isAIGenerated = (0, import_react199.useMemo)(
50573
+ const isAIGenerated = (0, import_react200.useMemo)(
50564
50574
  () => isMessageAIGenerated?.(message),
50565
50575
  [isMessageAIGenerated, message]
50566
50576
  );
@@ -50568,10 +50578,10 @@ var MessageSimpleWithContext = (props) => {
50568
50578
  return null;
50569
50579
  }
50570
50580
  if (message.deleted_at || message.type === "deleted") {
50571
- return /* @__PURE__ */ import_react199.default.createElement(MessageDeleted2, { message });
50581
+ return /* @__PURE__ */ import_react200.default.createElement(MessageDeleted2, { message });
50572
50582
  }
50573
50583
  if (isMessageBlocked(message)) {
50574
- return /* @__PURE__ */ import_react199.default.createElement(MessageBlocked2, null);
50584
+ return /* @__PURE__ */ import_react200.default.createElement(MessageBlocked2, null);
50575
50585
  }
50576
50586
  const showMetadata = !groupedByUser || endOfGroup;
50577
50587
  const showReplyCountButton = !threadList && !!message.reply_count;
@@ -50605,14 +50615,14 @@ var MessageSimpleWithContext = (props) => {
50605
50615
  }
50606
50616
  );
50607
50617
  const poll = message.poll_id && client.polls.fromState(message.poll_id);
50608
- return /* @__PURE__ */ import_react199.default.createElement(import_react199.default.Fragment, null, editing && /* @__PURE__ */ import_react199.default.createElement(EditMessageModal, { additionalMessageInputProps }), isBounceDialogOpen && /* @__PURE__ */ import_react199.default.createElement(
50618
+ return /* @__PURE__ */ import_react200.default.createElement(import_react200.default.Fragment, null, editing && /* @__PURE__ */ import_react200.default.createElement(EditMessageModal, { additionalMessageInputProps }), isBounceDialogOpen && /* @__PURE__ */ import_react200.default.createElement(
50609
50619
  MessageBounceModal,
50610
50620
  {
50611
50621
  MessageBouncePrompt: MessageBouncePrompt2,
50612
50622
  onClose: () => setIsBounceDialogOpen(false),
50613
50623
  open: isBounceDialogOpen
50614
50624
  }
50615
- ), /* @__PURE__ */ import_react199.default.createElement("div", { className: rootClassName2, key: message.id }, PinIndicator2 && /* @__PURE__ */ import_react199.default.createElement(PinIndicator2, null), message.user && /* @__PURE__ */ import_react199.default.createElement(
50625
+ ), /* @__PURE__ */ import_react200.default.createElement("div", { className: rootClassName2, key: message.id }, PinIndicator2 && /* @__PURE__ */ import_react200.default.createElement(PinIndicator2, null), message.user && /* @__PURE__ */ import_react200.default.createElement(
50616
50626
  Avatar2,
50617
50627
  {
50618
50628
  image: message.user.image,
@@ -50621,7 +50631,7 @@ var MessageSimpleWithContext = (props) => {
50621
50631
  onMouseOver: onUserHover,
50622
50632
  user: message.user
50623
50633
  }
50624
- ), /* @__PURE__ */ import_react199.default.createElement(
50634
+ ), /* @__PURE__ */ import_react200.default.createElement(
50625
50635
  "div",
50626
50636
  {
50627
50637
  className: (0, import_clsx52.default)("str-chat__message-inner", {
@@ -50631,37 +50641,37 @@ var MessageSimpleWithContext = (props) => {
50631
50641
  onClick: handleClick,
50632
50642
  onKeyUp: handleClick
50633
50643
  },
50634
- /* @__PURE__ */ import_react199.default.createElement(MessageActions2, null),
50635
- /* @__PURE__ */ import_react199.default.createElement("div", { className: "str-chat__message-reactions-host" }, hasReactions && /* @__PURE__ */ import_react199.default.createElement(ReactionsList2, { reverse: true })),
50636
- /* @__PURE__ */ import_react199.default.createElement("div", { className: "str-chat__message-bubble" }, poll && /* @__PURE__ */ import_react199.default.createElement(Poll, { poll }), message.attachments?.length && !message.quoted_message ? /* @__PURE__ */ import_react199.default.createElement(
50644
+ /* @__PURE__ */ import_react200.default.createElement(MessageActions2, null),
50645
+ /* @__PURE__ */ import_react200.default.createElement("div", { className: "str-chat__message-reactions-host" }, hasReactions && /* @__PURE__ */ import_react200.default.createElement(ReactionsList2, { reverse: true })),
50646
+ /* @__PURE__ */ import_react200.default.createElement("div", { className: "str-chat__message-bubble" }, poll && /* @__PURE__ */ import_react200.default.createElement(Poll, { poll }), message.attachments?.length && !message.quoted_message ? /* @__PURE__ */ import_react200.default.createElement(
50637
50647
  Attachment2,
50638
50648
  {
50639
50649
  actionHandler: handleAction,
50640
50650
  attachments: message.attachments
50641
50651
  }
50642
- ) : null, isAIGenerated ? /* @__PURE__ */ import_react199.default.createElement(StreamedMessageText2, { message, renderText: renderText2 }) : /* @__PURE__ */ import_react199.default.createElement(MessageText, { message, renderText: renderText2 }), message.mml && /* @__PURE__ */ import_react199.default.createElement(
50652
+ ) : null, isAIGenerated ? /* @__PURE__ */ import_react200.default.createElement(StreamedMessageText2, { message, renderText: renderText2 }) : /* @__PURE__ */ import_react200.default.createElement(MessageText, { message, renderText: renderText2 }), message.mml && /* @__PURE__ */ import_react200.default.createElement(
50643
50653
  MML,
50644
50654
  {
50645
50655
  actionHandler: handleAction,
50646
50656
  align: isMyMessage() ? "right" : "left",
50647
50657
  source: message.mml
50648
50658
  }
50649
- ), /* @__PURE__ */ import_react199.default.createElement(MessageErrorIcon, null))
50650
- ), showReplyCountButton && /* @__PURE__ */ import_react199.default.createElement(
50659
+ ), /* @__PURE__ */ import_react200.default.createElement(MessageErrorIcon, null))
50660
+ ), showReplyCountButton && /* @__PURE__ */ import_react200.default.createElement(
50651
50661
  MessageRepliesCountButton2,
50652
50662
  {
50653
50663
  onClick: handleOpenThread,
50654
50664
  reply_count: message.reply_count
50655
50665
  }
50656
- ), showMetadata && /* @__PURE__ */ import_react199.default.createElement("div", { className: "str-chat__message-metadata" }, /* @__PURE__ */ import_react199.default.createElement(MessageStatus2, null), !isMyMessage() && !!message.user && /* @__PURE__ */ import_react199.default.createElement("span", { className: "str-chat__message-simple-name" }, message.user.name || message.user.id), /* @__PURE__ */ import_react199.default.createElement(MessageTimestamp2, { customClass: "str-chat__message-simple-timestamp" }), isEdited && /* @__PURE__ */ import_react199.default.createElement("span", { className: "str-chat__mesage-simple-edited" }, t("Edited")), isEdited && /* @__PURE__ */ import_react199.default.createElement(MessageEditedTimestamp, { calendar: true, open: isEditedTimestampOpen }))));
50666
+ ), showMetadata && /* @__PURE__ */ import_react200.default.createElement("div", { className: "str-chat__message-metadata" }, /* @__PURE__ */ import_react200.default.createElement(MessageStatus2, null), !isMyMessage() && !!message.user && /* @__PURE__ */ import_react200.default.createElement("span", { className: "str-chat__message-simple-name" }, message.user.name || message.user.id), /* @__PURE__ */ import_react200.default.createElement(MessageTimestamp2, { customClass: "str-chat__message-simple-timestamp" }), isEdited && /* @__PURE__ */ import_react200.default.createElement("span", { className: "str-chat__mesage-simple-edited" }, t("Edited")), isEdited && /* @__PURE__ */ import_react200.default.createElement(MessageEditedTimestamp, { calendar: true, open: isEditedTimestampOpen }))));
50657
50667
  };
50658
- var MemoizedMessageSimple = import_react199.default.memo(
50668
+ var MemoizedMessageSimple = import_react200.default.memo(
50659
50669
  MessageSimpleWithContext,
50660
50670
  areMessageUIPropsEqual
50661
50671
  );
50662
50672
  var MessageSimple = (props) => {
50663
50673
  const messageContext = useMessageContext("MessageSimple");
50664
- return /* @__PURE__ */ import_react199.default.createElement(MemoizedMessageSimple, { ...messageContext, ...props });
50674
+ return /* @__PURE__ */ import_react200.default.createElement(MemoizedMessageSimple, { ...messageContext, ...props });
50665
50675
  };
50666
50676
 
50667
50677
  // src/components/Message/Message.tsx
@@ -50697,11 +50707,11 @@ var MessageWithContext = (props) => {
50697
50707
  canReply,
50698
50708
  isMyMessage
50699
50709
  } = userRoles;
50700
- const messageIsUnread = (0, import_react200.useMemo)(
50710
+ const messageIsUnread = (0, import_react201.useMemo)(
50701
50711
  () => !!(!isMyMessage && client.user?.id && read && (!read[client.user.id] || message?.created_at && new Date(message.created_at).getTime() > read[client.user.id].last_read.getTime())),
50702
50712
  [client, isMyMessage, message.created_at, read]
50703
50713
  );
50704
- const messageActionsHandler = (0, import_react200.useCallback)(
50714
+ const messageActionsHandler = (0, import_react201.useCallback)(
50705
50715
  () => getMessageActions(messageActions, {
50706
50716
  canDelete,
50707
50717
  canEdit,
@@ -50755,9 +50765,9 @@ var MessageWithContext = (props) => {
50755
50765
  onUserHover,
50756
50766
  setEditingState: setEdit
50757
50767
  };
50758
- return /* @__PURE__ */ import_react200.default.createElement(MessageProvider, { value: messageContextValue }, /* @__PURE__ */ import_react200.default.createElement(MessageUIComponent, { groupedByUser }));
50768
+ return /* @__PURE__ */ import_react201.default.createElement(MessageProvider, { value: messageContextValue }, /* @__PURE__ */ import_react201.default.createElement(MessageUIComponent, { groupedByUser }));
50759
50769
  };
50760
- var MemoizedMessage = import_react200.default.memo(
50770
+ var MemoizedMessage = import_react201.default.memo(
50761
50771
  MessageWithContext,
50762
50772
  areMessagePropsEqual
50763
50773
  );
@@ -50824,7 +50834,7 @@ var Message = (props) => {
50824
50834
  notify: addNotification
50825
50835
  });
50826
50836
  const highlighted = highlightedMessageId === message.id;
50827
- return /* @__PURE__ */ import_react200.default.createElement(
50837
+ return /* @__PURE__ */ import_react201.default.createElement(
50828
50838
  MemoizedMessage,
50829
50839
  {
50830
50840
  additionalMessageInputProps: props.additionalMessageInputProps,
@@ -50874,13 +50884,13 @@ var Message = (props) => {
50874
50884
  };
50875
50885
 
50876
50886
  // src/components/Thread/ThreadHeader.tsx
50877
- var import_react202 = __toESM(require("react"));
50887
+ var import_react203 = __toESM(require("react"));
50878
50888
 
50879
50889
  // src/components/Thread/icons.tsx
50880
- var import_react201 = __toESM(require("react"));
50890
+ var import_react202 = __toESM(require("react"));
50881
50891
  var CloseIcon3 = ({ title }) => {
50882
50892
  const { t } = useTranslationContext("CloseIcon");
50883
- return /* @__PURE__ */ import_react201.default.createElement(
50893
+ return /* @__PURE__ */ import_react202.default.createElement(
50884
50894
  "svg",
50885
50895
  {
50886
50896
  "data-testid": "close-no-outline",
@@ -50888,8 +50898,8 @@ var CloseIcon3 = ({ title }) => {
50888
50898
  viewBox: "0 0 24 24",
50889
50899
  xmlns: "http://www.w3.org/2000/svg"
50890
50900
  },
50891
- /* @__PURE__ */ import_react201.default.createElement("title", null, title ?? t("Close")),
50892
- /* @__PURE__ */ import_react201.default.createElement(
50901
+ /* @__PURE__ */ import_react202.default.createElement("title", null, title ?? t("Close")),
50902
+ /* @__PURE__ */ import_react202.default.createElement(
50893
50903
  "path",
50894
50904
  {
50895
50905
  d: "M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z",
@@ -50909,7 +50919,7 @@ var ThreadHeader = (props) => {
50909
50919
  overrideImage,
50910
50920
  overrideTitle
50911
50921
  });
50912
- return /* @__PURE__ */ import_react202.default.createElement("div", { className: "str-chat__thread-header" }, /* @__PURE__ */ import_react202.default.createElement("div", { className: "str-chat__thread-header-details" }, /* @__PURE__ */ import_react202.default.createElement("div", { className: "str-chat__thread-header-title" }, t("Thread")), /* @__PURE__ */ import_react202.default.createElement("div", { className: "str-chat__thread-header-subtitle" }, displayTitle)), /* @__PURE__ */ import_react202.default.createElement(
50922
+ return /* @__PURE__ */ import_react203.default.createElement("div", { className: "str-chat__thread-header" }, /* @__PURE__ */ import_react203.default.createElement("div", { className: "str-chat__thread-header-details" }, /* @__PURE__ */ import_react203.default.createElement("div", { className: "str-chat__thread-header-title" }, t("Thread")), /* @__PURE__ */ import_react203.default.createElement("div", { className: "str-chat__thread-header-subtitle" }, displayTitle)), /* @__PURE__ */ import_react203.default.createElement(
50913
50923
  "button",
50914
50924
  {
50915
50925
  "aria-label": t("aria/Close thread"),
@@ -50917,31 +50927,31 @@ var ThreadHeader = (props) => {
50917
50927
  "data-testid": "close-button",
50918
50928
  onClick: closeThread
50919
50929
  },
50920
- /* @__PURE__ */ import_react202.default.createElement(CloseIcon3, null)
50930
+ /* @__PURE__ */ import_react203.default.createElement(CloseIcon3, null)
50921
50931
  ));
50922
50932
  };
50923
50933
 
50924
50934
  // src/components/Thread/ThreadHead.tsx
50925
- var import_react204 = __toESM(require("react"));
50935
+ var import_react205 = __toESM(require("react"));
50926
50936
 
50927
50937
  // src/components/Thread/ThreadStart.tsx
50928
- var import_react203 = __toESM(require("react"));
50938
+ var import_react204 = __toESM(require("react"));
50929
50939
  var ThreadStart = () => {
50930
50940
  const { thread } = useChannelStateContext("ThreadStart");
50931
50941
  const { t } = useTranslationContext("ThreadStart");
50932
50942
  if (!thread?.reply_count) return null;
50933
- return /* @__PURE__ */ import_react203.default.createElement("div", { className: "str-chat__thread-start" }, t("replyCount", { count: thread.reply_count }));
50943
+ return /* @__PURE__ */ import_react204.default.createElement("div", { className: "str-chat__thread-start" }, t("replyCount", { count: thread.reply_count }));
50934
50944
  };
50935
50945
 
50936
50946
  // src/components/Thread/ThreadHead.tsx
50937
50947
  var ThreadHead = (props) => {
50938
50948
  const { ThreadStart: ThreadStart2 = ThreadStart } = useComponentContext("ThreadHead");
50939
- return /* @__PURE__ */ import_react204.default.createElement("div", { className: "str-chat__parent-message-li" }, /* @__PURE__ */ import_react204.default.createElement(Message, { initialMessage: true, threadList: true, ...props }), /* @__PURE__ */ import_react204.default.createElement(ThreadStart2, null));
50949
+ return /* @__PURE__ */ import_react205.default.createElement("div", { className: "str-chat__parent-message-li" }, /* @__PURE__ */ import_react205.default.createElement(Message, { initialMessage: true, threadList: true, ...props }), /* @__PURE__ */ import_react205.default.createElement(ThreadStart2, null));
50940
50950
  };
50941
50951
 
50942
50952
  // src/components/Thread/Thread.tsx
50943
- var LegacyThreadContext = import_react205.default.createContext({ legacyThread: void 0 });
50944
- var useLegacyThreadContext = () => (0, import_react205.useContext)(LegacyThreadContext);
50953
+ var LegacyThreadContext = import_react206.default.createContext({ legacyThread: void 0 });
50954
+ var useLegacyThreadContext = () => (0, import_react206.useContext)(LegacyThreadContext);
50945
50955
  var Thread = (props) => {
50946
50956
  const { channel, channelConfig, thread } = useChannelStateContext("Thread");
50947
50957
  const threadInstance = useThreadContext();
@@ -50949,7 +50959,7 @@ var Thread = (props) => {
50949
50959
  if (channelConfig?.replies === false) return null;
50950
50960
  return (
50951
50961
  // FIXME: TS is having trouble here as at least one of the two would always be defined
50952
- /* @__PURE__ */ import_react205.default.createElement(
50962
+ /* @__PURE__ */ import_react206.default.createElement(
50953
50963
  ThreadInner,
50954
50964
  {
50955
50965
  ...props,
@@ -51000,7 +51010,7 @@ var ThreadInner = (props) => {
51000
51010
  const FallbackMessage = virtualized && VirtualMessage ? VirtualMessage : ContextMessage;
51001
51011
  const MessageUIComponent = ThreadMessage || FallbackMessage;
51002
51012
  const ThreadMessageList = virtualized ? VirtualizedMessageList : MessageList;
51003
- (0, import_react205.useEffect)(() => {
51013
+ (0, import_react206.useEffect)(() => {
51004
51014
  if (threadInstance) return;
51005
51015
  if ((thread?.reply_count ?? 0) > 0) {
51006
51016
  loadMoreThread();
@@ -51023,7 +51033,7 @@ var ThreadInner = (props) => {
51023
51033
  const threadClass = customClasses?.thread || (0, import_clsx53.default)("str-chat__thread-container str-chat__thread", {
51024
51034
  "str-chat__thread--virtualized": virtualized
51025
51035
  });
51026
- const head = /* @__PURE__ */ import_react205.default.createElement(
51036
+ const head = /* @__PURE__ */ import_react206.default.createElement(
51027
51037
  ThreadHead2,
51028
51038
  {
51029
51039
  key: messageAsThread.id,
@@ -51034,14 +51044,14 @@ var ThreadInner = (props) => {
51034
51044
  );
51035
51045
  return (
51036
51046
  // Thread component needs a context which we can use for message composer
51037
- /* @__PURE__ */ import_react205.default.createElement(
51047
+ /* @__PURE__ */ import_react206.default.createElement(
51038
51048
  LegacyThreadContext.Provider,
51039
51049
  {
51040
51050
  value: {
51041
51051
  legacyThread: thread ?? void 0
51042
51052
  }
51043
51053
  },
51044
- /* @__PURE__ */ import_react205.default.createElement("div", { className: threadClass }, /* @__PURE__ */ import_react205.default.createElement(ThreadHeader2, { closeThread, thread: messageAsThread }), /* @__PURE__ */ import_react205.default.createElement(
51054
+ /* @__PURE__ */ import_react206.default.createElement("div", { className: threadClass }, /* @__PURE__ */ import_react206.default.createElement(ThreadHeader2, { closeThread, thread: messageAsThread }), /* @__PURE__ */ import_react206.default.createElement(
51045
51055
  ThreadMessageList,
51046
51056
  {
51047
51057
  disableDateSeparator: !enableDateSeparator,
@@ -51053,7 +51063,7 @@ var ThreadInner = (props) => {
51053
51063
  ...threadProps,
51054
51064
  ...virtualized ? additionalVirtualizedMessageListProps : additionalMessageListProps
51055
51065
  }
51056
- ), /* @__PURE__ */ import_react205.default.createElement(
51066
+ ), /* @__PURE__ */ import_react206.default.createElement(
51057
51067
  MessageInput,
51058
51068
  {
51059
51069
  focus: autoFocus,
@@ -51075,15 +51085,15 @@ var useMessageComposer = () => {
51075
51085
  const { editing, message: editedMessage } = useMessageContext();
51076
51086
  const { legacyThread: parentMessage } = useLegacyThreadContext();
51077
51087
  const threadInstance = useThreadContext();
51078
- const cachedEditedMessage = (0, import_react206.useMemo)(() => {
51088
+ const cachedEditedMessage = (0, import_react207.useMemo)(() => {
51079
51089
  if (!editedMessage) return void 0;
51080
51090
  return editedMessage;
51081
51091
  }, [editedMessage?.id]);
51082
- const cachedParentMessage = (0, import_react206.useMemo)(() => {
51092
+ const cachedParentMessage = (0, import_react207.useMemo)(() => {
51083
51093
  if (!parentMessage) return void 0;
51084
51094
  return parentMessage;
51085
51095
  }, [parentMessage?.id]);
51086
- const messageComposer = (0, import_react206.useMemo)(() => {
51096
+ const messageComposer = (0, import_react207.useMemo)(() => {
51087
51097
  if (editing && cachedEditedMessage) {
51088
51098
  const tag = import_stream_chat6.MessageComposer.constructTag(cachedEditedMessage);
51089
51099
  const cachedComposer = queueCache.get(tag);
@@ -51123,7 +51133,7 @@ var useMessageComposer = () => {
51123
51133
  ) && !queueCache.peek(messageComposer.tag)) {
51124
51134
  queueCache.add(messageComposer.tag, messageComposer);
51125
51135
  }
51126
- (0, import_react206.useEffect)(() => {
51136
+ (0, import_react207.useEffect)(() => {
51127
51137
  const unsubscribe = messageComposer.registerSubscriptions();
51128
51138
  return () => {
51129
51139
  unsubscribe();
@@ -51155,24 +51165,24 @@ var useAttachmentManagerState = () => {
51155
51165
  var CHANNEL_CONTAINER_ID = "str-chat__channel";
51156
51166
 
51157
51167
  // src/components/Dialog/DialogMenu.tsx
51158
- var import_react207 = __toESM(require("react"));
51168
+ var import_react208 = __toESM(require("react"));
51159
51169
  var import_clsx54 = __toESM(require("clsx"));
51160
51170
  var DialogMenuButton = ({
51161
51171
  children,
51162
51172
  className,
51163
51173
  ...props
51164
- }) => /* @__PURE__ */ import_react207.default.createElement("button", { className: (0, import_clsx54.default)("str-chat__dialog-menu__button", className), ...props }, /* @__PURE__ */ import_react207.default.createElement("div", { className: "str-chat__dialog-menu__button-icon" }), /* @__PURE__ */ import_react207.default.createElement("div", { className: "str-chat__dialog-menu__button-text" }, children));
51174
+ }) => /* @__PURE__ */ import_react208.default.createElement("button", { className: (0, import_clsx54.default)("str-chat__dialog-menu__button", className), ...props }, /* @__PURE__ */ import_react208.default.createElement("div", { className: "str-chat__dialog-menu__button-icon" }), /* @__PURE__ */ import_react208.default.createElement("div", { className: "str-chat__dialog-menu__button-text" }, children));
51165
51175
 
51166
51176
  // src/context/AttachmentSelectorContext.tsx
51167
- var import_react208 = __toESM(require("react"));
51168
- var AttachmentSelectorContext = (0, import_react208.createContext)({
51177
+ var import_react209 = __toESM(require("react"));
51178
+ var AttachmentSelectorContext = (0, import_react209.createContext)({
51169
51179
  fileInput: null
51170
51180
  });
51171
51181
  var AttachmentSelectorContextProvider = ({
51172
51182
  children,
51173
51183
  value
51174
- }) => /* @__PURE__ */ import_react208.default.createElement(AttachmentSelectorContext.Provider, { value }, children);
51175
- var useAttachmentSelectorContext = () => (0, import_react208.useContext)(AttachmentSelectorContext);
51184
+ }) => /* @__PURE__ */ import_react209.default.createElement(AttachmentSelectorContext.Provider, { value }, children);
51185
+ var useAttachmentSelectorContext = () => (0, import_react209.useContext)(AttachmentSelectorContext);
51176
51186
 
51177
51187
  // src/components/MessageInput/AttachmentSelector.tsx
51178
51188
  var SimpleAttachmentSelector = () => {
@@ -51180,10 +51190,10 @@ var SimpleAttachmentSelector = () => {
51180
51190
  AttachmentSelectorInitiationButtonContents,
51181
51191
  FileUploadIcon = UploadIcon
51182
51192
  } = useComponentContext();
51183
- const inputRef = (0, import_react209.useRef)(null);
51184
- const [labelElement, setLabelElement] = (0, import_react209.useState)(null);
51185
- const id = (0, import_react209.useMemo)(() => (0, import_nanoid3.nanoid)(), []);
51186
- (0, import_react209.useEffect)(() => {
51193
+ const inputRef = (0, import_react210.useRef)(null);
51194
+ const [labelElement, setLabelElement] = (0, import_react210.useState)(null);
51195
+ const id = useStableId();
51196
+ (0, import_react210.useEffect)(() => {
51187
51197
  if (!labelElement) return;
51188
51198
  const handleKeyUp = (event) => {
51189
51199
  if (![" ", "Enter"].includes(event.key) || !inputRef.current) return;
@@ -51195,7 +51205,7 @@ var SimpleAttachmentSelector = () => {
51195
51205
  labelElement.removeEventListener("keyup", handleKeyUp);
51196
51206
  };
51197
51207
  }, [labelElement]);
51198
- return /* @__PURE__ */ import_react209.default.createElement("div", { className: "str-chat__file-input-container", "data-testid": "file-upload-button" }, /* @__PURE__ */ import_react209.default.createElement(UploadFileInput, { id, ref: inputRef }), /* @__PURE__ */ import_react209.default.createElement(
51208
+ return /* @__PURE__ */ import_react210.default.createElement("div", { className: "str-chat__file-input-container", "data-testid": "file-upload-button" }, /* @__PURE__ */ import_react210.default.createElement(UploadFileInput, { id, ref: inputRef }), /* @__PURE__ */ import_react210.default.createElement(
51199
51209
  "label",
51200
51210
  {
51201
51211
  className: "str-chat__file-input-label",
@@ -51203,25 +51213,25 @@ var SimpleAttachmentSelector = () => {
51203
51213
  ref: setLabelElement,
51204
51214
  tabIndex: 0
51205
51215
  },
51206
- AttachmentSelectorInitiationButtonContents ? /* @__PURE__ */ import_react209.default.createElement(AttachmentSelectorInitiationButtonContents, null) : /* @__PURE__ */ import_react209.default.createElement(FileUploadIcon, null)
51216
+ AttachmentSelectorInitiationButtonContents ? /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorInitiationButtonContents, null) : /* @__PURE__ */ import_react210.default.createElement(FileUploadIcon, null)
51207
51217
  ));
51208
51218
  };
51209
51219
  var AttachmentSelectorMenuInitButtonIcon = () => {
51210
51220
  const { AttachmentSelectorInitiationButtonContents, FileUploadIcon } = useComponentContext("SimpleAttachmentSelector");
51211
51221
  if (AttachmentSelectorInitiationButtonContents) {
51212
- return /* @__PURE__ */ import_react209.default.createElement(AttachmentSelectorInitiationButtonContents, null);
51222
+ return /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorInitiationButtonContents, null);
51213
51223
  }
51214
51224
  if (FileUploadIcon) {
51215
- return /* @__PURE__ */ import_react209.default.createElement(FileUploadIcon, null);
51225
+ return /* @__PURE__ */ import_react210.default.createElement(FileUploadIcon, null);
51216
51226
  }
51217
- return /* @__PURE__ */ import_react209.default.createElement("div", { className: "str-chat__attachment-selector__menu-button__icon" });
51227
+ return /* @__PURE__ */ import_react210.default.createElement("div", { className: "str-chat__attachment-selector__menu-button__icon" });
51218
51228
  };
51219
51229
  var DefaultAttachmentSelectorComponents = {
51220
51230
  File({ closeMenu }) {
51221
51231
  const { t } = useTranslationContext();
51222
51232
  const { fileInput } = useAttachmentSelectorContext();
51223
51233
  const { isUploadEnabled } = useAttachmentManagerState();
51224
- return /* @__PURE__ */ import_react209.default.createElement(
51234
+ return /* @__PURE__ */ import_react210.default.createElement(
51225
51235
  DialogMenuButton,
51226
51236
  {
51227
51237
  className: "str-chat__attachment-selector-actions-menu__button str-chat__attachment-selector-actions-menu__upload-file-button",
@@ -51236,7 +51246,7 @@ var DefaultAttachmentSelectorComponents = {
51236
51246
  },
51237
51247
  Poll({ closeMenu, openModalForAction }) {
51238
51248
  const { t } = useTranslationContext();
51239
- return /* @__PURE__ */ import_react209.default.createElement(
51249
+ return /* @__PURE__ */ import_react210.default.createElement(
51240
51250
  DialogMenuButton,
51241
51251
  {
51242
51252
  className: "str-chat__attachment-selector-actions-menu__button str-chat__attachment-selector-actions-menu__create-poll-button",
@@ -51284,8 +51294,8 @@ var AttachmentSelector = ({
51284
51294
  const menuDialogId = `attachment-actions-menu${isThreadInput ? "-thread" : ""}`;
51285
51295
  const menuDialog = useDialog({ id: menuDialogId });
51286
51296
  const menuDialogIsOpen = useDialogIsOpen(menuDialogId);
51287
- const [modalContentAction, setModalContentActionAction] = (0, import_react209.useState)();
51288
- const openModal = (0, import_react209.useCallback)(
51297
+ const [modalContentAction, setModalContentActionAction] = (0, import_react210.useState)();
51298
+ const openModal = (0, import_react210.useCallback)(
51289
51299
  (actionType) => {
51290
51300
  const action = actions.find((a) => a.type === actionType);
51291
51301
  if (!action?.ModalContent) return;
@@ -51293,19 +51303,19 @@ var AttachmentSelector = ({
51293
51303
  },
51294
51304
  [actions]
51295
51305
  );
51296
- const closeModal = (0, import_react209.useCallback)(() => setModalContentActionAction(void 0), []);
51297
- const [fileInput, setFileInput] = (0, import_react209.useState)(null);
51298
- const menuButtonRef = (0, import_react209.useRef)(null);
51299
- const getDefaultPortalDestination = (0, import_react209.useCallback)(
51306
+ const closeModal = (0, import_react210.useCallback)(() => setModalContentActionAction(void 0), []);
51307
+ const [fileInput, setFileInput] = (0, import_react210.useState)(null);
51308
+ const menuButtonRef = (0, import_react210.useRef)(null);
51309
+ const getDefaultPortalDestination = (0, import_react210.useCallback)(
51300
51310
  () => document.getElementById(CHANNEL_CONTAINER_ID),
51301
51311
  []
51302
51312
  );
51303
51313
  if (actions.length === 0) return null;
51304
51314
  if (actions.length === 1 && actions[0].type === "uploadFile")
51305
- return /* @__PURE__ */ import_react209.default.createElement(SimpleAttachmentSelector, null);
51315
+ return /* @__PURE__ */ import_react210.default.createElement(SimpleAttachmentSelector, null);
51306
51316
  const ModalContent = modalContentAction?.ModalContent;
51307
51317
  const modalIsOpen = !!ModalContent;
51308
- return /* @__PURE__ */ import_react209.default.createElement(AttachmentSelectorContextProvider, { value: { fileInput } }, /* @__PURE__ */ import_react209.default.createElement("div", { className: "str-chat__attachment-selector" }, channelCapabilities["upload-file"] && /* @__PURE__ */ import_react209.default.createElement(UploadFileInput, { ref: setFileInput }), /* @__PURE__ */ import_react209.default.createElement(
51318
+ return /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorContextProvider, { value: { fileInput } }, /* @__PURE__ */ import_react210.default.createElement("div", { className: "str-chat__attachment-selector" }, channelCapabilities["upload-file"] && /* @__PURE__ */ import_react210.default.createElement(UploadFileInput, { ref: setFileInput }), /* @__PURE__ */ import_react210.default.createElement(
51309
51319
  "button",
51310
51320
  {
51311
51321
  "aria-expanded": menuDialogIsOpen,
@@ -51316,8 +51326,8 @@ var AttachmentSelector = ({
51316
51326
  onClick: () => menuDialog?.toggle(),
51317
51327
  ref: menuButtonRef
51318
51328
  },
51319
- /* @__PURE__ */ import_react209.default.createElement(AttachmentSelectorMenuInitButtonIcon, null)
51320
- ), /* @__PURE__ */ import_react209.default.createElement(
51329
+ /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorMenuInitButtonIcon, null)
51330
+ ), /* @__PURE__ */ import_react210.default.createElement(
51321
51331
  DialogAnchor,
51322
51332
  {
51323
51333
  id: menuDialogId,
@@ -51326,13 +51336,13 @@ var AttachmentSelector = ({
51326
51336
  tabIndex: -1,
51327
51337
  trapFocus: true
51328
51338
  },
51329
- /* @__PURE__ */ import_react209.default.createElement(
51339
+ /* @__PURE__ */ import_react210.default.createElement(
51330
51340
  "div",
51331
51341
  {
51332
51342
  className: "str-chat__attachment-selector-actions-menu str-chat__dialog-menu",
51333
51343
  "data-testid": "attachment-selector-actions-menu"
51334
51344
  },
51335
- actions.map(({ ActionButton, type }) => /* @__PURE__ */ import_react209.default.createElement(
51345
+ actions.map(({ ActionButton, type }) => /* @__PURE__ */ import_react210.default.createElement(
51336
51346
  ActionButton,
51337
51347
  {
51338
51348
  closeMenu: menuDialog.close,
@@ -51341,30 +51351,30 @@ var AttachmentSelector = ({
51341
51351
  }
51342
51352
  ))
51343
51353
  )
51344
- ), /* @__PURE__ */ import_react209.default.createElement(
51354
+ ), /* @__PURE__ */ import_react210.default.createElement(
51345
51355
  Portal,
51346
51356
  {
51347
51357
  getPortalDestination: getModalPortalDestination ?? getDefaultPortalDestination,
51348
51358
  isOpen: modalIsOpen
51349
51359
  },
51350
- /* @__PURE__ */ import_react209.default.createElement(
51360
+ /* @__PURE__ */ import_react210.default.createElement(
51351
51361
  Modal,
51352
51362
  {
51353
51363
  className: "str-chat__create-poll-modal",
51354
51364
  onClose: closeModal,
51355
51365
  open: modalIsOpen
51356
51366
  },
51357
- ModalContent && /* @__PURE__ */ import_react209.default.createElement(ModalContent, { close: closeModal })
51367
+ ModalContent && /* @__PURE__ */ import_react210.default.createElement(ModalContent, { close: closeModal })
51358
51368
  )
51359
51369
  )));
51360
51370
  };
51361
51371
 
51362
51372
  // src/components/MessageInput/AttachmentPreviewList/AttachmentPreviewList.tsx
51363
- var import_react227 = __toESM(require("react"));
51373
+ var import_react228 = __toESM(require("react"));
51364
51374
  var import_stream_chat9 = require("stream-chat");
51365
51375
 
51366
51376
  // src/components/MessageInput/AttachmentPreviewList/UnsupportedAttachmentPreview.tsx
51367
- var import_react210 = __toESM(require("react"));
51377
+ var import_react211 = __toESM(require("react"));
51368
51378
  var import_stream_chat7 = require("stream-chat");
51369
51379
  var UnsupportedAttachmentPreview = ({
51370
51380
  attachment,
@@ -51373,14 +51383,14 @@ var UnsupportedAttachmentPreview = ({
51373
51383
  }) => {
51374
51384
  const { t } = useTranslationContext("UnsupportedAttachmentPreview");
51375
51385
  const title = attachment.title ?? t("Unsupported attachment");
51376
- return /* @__PURE__ */ import_react210.default.createElement(
51386
+ return /* @__PURE__ */ import_react211.default.createElement(
51377
51387
  "div",
51378
51388
  {
51379
51389
  className: "str-chat__attachment-preview-unsupported",
51380
51390
  "data-testid": "attachment-preview-unknown"
51381
51391
  },
51382
- /* @__PURE__ */ import_react210.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react210.default.createElement(FileIcon, { filename: title, mimeType: attachment.mime_type })),
51383
- /* @__PURE__ */ import_react210.default.createElement(
51392
+ /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react211.default.createElement(FileIcon, { filename: title, mimeType: attachment.mime_type })),
51393
+ /* @__PURE__ */ import_react211.default.createElement(
51384
51394
  "button",
51385
51395
  {
51386
51396
  "aria-label": t("aria/Remove attachment"),
@@ -51389,18 +51399,18 @@ var UnsupportedAttachmentPreview = ({
51389
51399
  disabled: attachment.localMetadata?.uploadState === "uploading",
51390
51400
  onClick: () => attachment.localMetadata?.id && removeAttachments([attachment.localMetadata?.id])
51391
51401
  },
51392
- /* @__PURE__ */ import_react210.default.createElement(CloseIcon, null)
51402
+ /* @__PURE__ */ import_react211.default.createElement(CloseIcon, null)
51393
51403
  ),
51394
- (0, import_stream_chat7.isLocalUploadAttachment)(attachment) && ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react210.default.createElement(
51404
+ (0, import_stream_chat7.isLocalUploadAttachment)(attachment) && ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react211.default.createElement(
51395
51405
  "button",
51396
51406
  {
51397
51407
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-file",
51398
51408
  "data-testid": "file-preview-item-retry-button",
51399
51409
  onClick: () => handleRetry(attachment)
51400
51410
  },
51401
- /* @__PURE__ */ import_react210.default.createElement(RetryIcon, null)
51411
+ /* @__PURE__ */ import_react211.default.createElement(RetryIcon, null)
51402
51412
  ),
51403
- /* @__PURE__ */ import_react210.default.createElement("div", { className: "str-chat__attachment-preview-metadata" }, /* @__PURE__ */ import_react210.default.createElement("div", { className: "str-chat__attachment-preview-title", title }, title), attachment.localMetadata?.uploadState === "finished" && !!attachment.asset_url && /* @__PURE__ */ import_react210.default.createElement(
51413
+ /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__attachment-preview-metadata" }, /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__attachment-preview-title", title }, title), attachment.localMetadata?.uploadState === "finished" && !!attachment.asset_url && /* @__PURE__ */ import_react211.default.createElement(
51404
51414
  "a",
51405
51415
  {
51406
51416
  className: "str-chat__attachment-preview-file-download",
@@ -51409,16 +51419,16 @@ var UnsupportedAttachmentPreview = ({
51409
51419
  rel: "noreferrer",
51410
51420
  target: "_blank"
51411
51421
  },
51412
- /* @__PURE__ */ import_react210.default.createElement(DownloadIcon2, null)
51413
- ), attachment.localMetadata?.uploadState === "uploading" && /* @__PURE__ */ import_react210.default.createElement(LoadingIndicatorIcon, { size: 17 }))
51422
+ /* @__PURE__ */ import_react211.default.createElement(DownloadIcon2, null)
51423
+ ), attachment.localMetadata?.uploadState === "uploading" && /* @__PURE__ */ import_react211.default.createElement(LoadingIndicatorIcon, { size: 17 }))
51414
51424
  );
51415
51425
  };
51416
51426
 
51417
51427
  // src/components/MessageInput/AttachmentPreviewList/VoiceRecordingPreview.tsx
51418
- var import_react218 = __toESM(require("react"));
51428
+ var import_react219 = __toESM(require("react"));
51419
51429
 
51420
51430
  // src/components/MediaRecorder/RecordingPermissionDeniedNotification.tsx
51421
- var import_react211 = __toESM(require("react"));
51431
+ var import_react212 = __toESM(require("react"));
51422
51432
  var RecordingPermissionDeniedNotification = ({
51423
51433
  onClose,
51424
51434
  permissionName
@@ -51434,7 +51444,7 @@ var RecordingPermissionDeniedNotification = ({
51434
51444
  microphone: t("Allow access to microphone")
51435
51445
  }
51436
51446
  };
51437
- return /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__recording-permission-denied-notification" }, /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__recording-permission-denied-notification__heading" }, permissionTranslations.heading[permissionName]), /* @__PURE__ */ import_react211.default.createElement("p", { className: "str-chat__recording-permission-denied-notification__message" }, permissionTranslations.body[permissionName]), /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__recording-permission-denied-notification__dismiss-button-container" }, /* @__PURE__ */ import_react211.default.createElement(
51447
+ return /* @__PURE__ */ import_react212.default.createElement("div", { className: "str-chat__recording-permission-denied-notification" }, /* @__PURE__ */ import_react212.default.createElement("div", { className: "str-chat__recording-permission-denied-notification__heading" }, permissionTranslations.heading[permissionName]), /* @__PURE__ */ import_react212.default.createElement("p", { className: "str-chat__recording-permission-denied-notification__message" }, permissionTranslations.body[permissionName]), /* @__PURE__ */ import_react212.default.createElement("div", { className: "str-chat__recording-permission-denied-notification__dismiss-button-container" }, /* @__PURE__ */ import_react212.default.createElement(
51438
51448
  "button",
51439
51449
  {
51440
51450
  className: "str-chat__recording-permission-denied-notification__dismiss-button",
@@ -51445,15 +51455,15 @@ var RecordingPermissionDeniedNotification = ({
51445
51455
  };
51446
51456
 
51447
51457
  // src/components/MediaRecorder/AudioRecorder/AudioRecorder.tsx
51448
- var import_react216 = __toESM(require("react"));
51458
+ var import_react217 = __toESM(require("react"));
51449
51459
 
51450
51460
  // src/components/MediaRecorder/AudioRecorder/AudioRecordingPreview.tsx
51451
- var import_react213 = __toESM(require("react"));
51461
+ var import_react214 = __toESM(require("react"));
51452
51462
 
51453
51463
  // src/components/MediaRecorder/AudioRecorder/RecordingTimer.tsx
51454
51464
  var import_clsx55 = __toESM(require("clsx"));
51455
- var import_react212 = __toESM(require("react"));
51456
- var RecordingTimer = ({ durationSeconds }) => /* @__PURE__ */ import_react212.default.createElement(
51465
+ var import_react213 = __toESM(require("react"));
51466
+ var RecordingTimer = ({ durationSeconds }) => /* @__PURE__ */ import_react213.default.createElement(
51457
51467
  "div",
51458
51468
  {
51459
51469
  className: (0, import_clsx55.default)("str-chat__recording-timer", {
@@ -51475,15 +51485,15 @@ var AudioRecordingPreview = ({
51475
51485
  mimeType
51476
51486
  });
51477
51487
  const displayedDuration = secondsElapsed || durationSeconds;
51478
- return /* @__PURE__ */ import_react213.default.createElement(import_react213.default.Fragment, null, /* @__PURE__ */ import_react213.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react213.default.createElement("source", { src: props.src, type: mimeType })), /* @__PURE__ */ import_react213.default.createElement(
51488
+ return /* @__PURE__ */ import_react214.default.createElement(import_react214.default.Fragment, null, /* @__PURE__ */ import_react214.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react214.default.createElement("source", { src: props.src, type: mimeType })), /* @__PURE__ */ import_react214.default.createElement(
51479
51489
  "button",
51480
51490
  {
51481
51491
  className: "str-chat__audio_recorder__toggle-playback-button",
51482
51492
  "data-testid": "audio-recording-preview-toggle-play-btn",
51483
51493
  onClick: togglePlay
51484
51494
  },
51485
- isPlaying ? /* @__PURE__ */ import_react213.default.createElement(PauseIcon2, null) : /* @__PURE__ */ import_react213.default.createElement(PlayIcon, null)
51486
- ), /* @__PURE__ */ import_react213.default.createElement(RecordingTimer, { durationSeconds: displayedDuration }), /* @__PURE__ */ import_react213.default.createElement("div", { className: "str-chat__wave-progress-bar__track-container" }, /* @__PURE__ */ import_react213.default.createElement(
51495
+ isPlaying ? /* @__PURE__ */ import_react214.default.createElement(PauseIcon2, null) : /* @__PURE__ */ import_react214.default.createElement(PlayIcon, null)
51496
+ ), /* @__PURE__ */ import_react214.default.createElement(RecordingTimer, { durationSeconds: displayedDuration }), /* @__PURE__ */ import_react214.default.createElement("div", { className: "str-chat__wave-progress-bar__track-container" }, /* @__PURE__ */ import_react214.default.createElement(
51487
51497
  WaveProgressBar,
51488
51498
  {
51489
51499
  progress,
@@ -51494,24 +51504,24 @@ var AudioRecordingPreview = ({
51494
51504
  };
51495
51505
 
51496
51506
  // src/components/MediaRecorder/AudioRecorder/AudioRecordingInProgress.tsx
51497
- var import_react215 = __toESM(require("react"));
51507
+ var import_react216 = __toESM(require("react"));
51498
51508
 
51499
51509
  // src/components/MediaRecorder/AudioRecorder/hooks/useTimeElapsed.ts
51500
- var import_react214 = require("react");
51510
+ var import_react215 = require("react");
51501
51511
  var useTimeElapsed = ({ startOnMount } = {}) => {
51502
- const [secondsElapsed, setSecondsElapsed] = (0, import_react214.useState)(0);
51503
- const updateInterval = (0, import_react214.useRef)(void 0);
51504
- const startCounter = (0, import_react214.useCallback)(() => {
51512
+ const [secondsElapsed, setSecondsElapsed] = (0, import_react215.useState)(0);
51513
+ const updateInterval = (0, import_react215.useRef)(void 0);
51514
+ const startCounter = (0, import_react215.useCallback)(() => {
51505
51515
  if (updateInterval.current) return;
51506
51516
  updateInterval.current = setInterval(() => {
51507
51517
  setSecondsElapsed((prev) => prev + 1);
51508
51518
  }, 1e3);
51509
51519
  }, []);
51510
- const stopCounter = (0, import_react214.useCallback)(() => {
51520
+ const stopCounter = (0, import_react215.useCallback)(() => {
51511
51521
  clearInterval(updateInterval.current);
51512
51522
  updateInterval.current = void 0;
51513
51523
  }, []);
51514
- (0, import_react214.useEffect)(() => {
51524
+ (0, import_react215.useEffect)(() => {
51515
51525
  if (!startOnMount) return;
51516
51526
  startCounter();
51517
51527
  return () => {
@@ -51530,8 +51540,8 @@ var AudioRecordingWaveform = ({ maxDataPointsDrawn = 100 }) => {
51530
51540
  const {
51531
51541
  recordingController: { recorder }
51532
51542
  } = useMessageInputContext();
51533
- const [amplitudes, setAmplitudes] = (0, import_react215.useState)([]);
51534
- (0, import_react215.useEffect)(() => {
51543
+ const [amplitudes, setAmplitudes] = (0, import_react216.useState)([]);
51544
+ (0, import_react216.useEffect)(() => {
51535
51545
  if (!recorder?.amplitudeRecorder) return;
51536
51546
  const amplitudesSubscription = recorder.amplitudeRecorder.amplitudes.subscribe(setAmplitudes);
51537
51547
  return () => {
@@ -51539,7 +51549,7 @@ var AudioRecordingWaveform = ({ maxDataPointsDrawn = 100 }) => {
51539
51549
  };
51540
51550
  }, [recorder]);
51541
51551
  if (!recorder) return null;
51542
- return /* @__PURE__ */ import_react215.default.createElement("div", { className: "str-chat__waveform-box-container" }, /* @__PURE__ */ import_react215.default.createElement("div", { className: "str-chat__audio_recorder__waveform-box" }, amplitudes.slice(-maxDataPointsDrawn).map((amplitude, i) => /* @__PURE__ */ import_react215.default.createElement(
51552
+ return /* @__PURE__ */ import_react216.default.createElement("div", { className: "str-chat__waveform-box-container" }, /* @__PURE__ */ import_react216.default.createElement("div", { className: "str-chat__audio_recorder__waveform-box" }, amplitudes.slice(-maxDataPointsDrawn).map((amplitude, i) => /* @__PURE__ */ import_react216.default.createElement(
51543
51553
  "div",
51544
51554
  {
51545
51555
  className: "str-chat__wave-progress-bar__amplitude-bar",
@@ -51555,7 +51565,7 @@ var AudioRecordingInProgress = () => {
51555
51565
  const {
51556
51566
  recordingController: { recorder }
51557
51567
  } = useMessageInputContext();
51558
- (0, import_react215.useEffect)(() => {
51568
+ (0, import_react216.useEffect)(() => {
51559
51569
  if (!recorder?.mediaRecorder) return;
51560
51570
  const { mediaRecorder } = recorder;
51561
51571
  if (mediaRecorder.state === "recording") {
@@ -51572,7 +51582,7 @@ var AudioRecordingInProgress = () => {
51572
51582
  mediaRecorder.removeEventListener("pause", stopCounter);
51573
51583
  };
51574
51584
  }, [recorder, startCounter, stopCounter]);
51575
- return /* @__PURE__ */ import_react215.default.createElement(import_react215.default.Fragment, null, /* @__PURE__ */ import_react215.default.createElement(RecordingTimer, { durationSeconds: secondsElapsed }), /* @__PURE__ */ import_react215.default.createElement(AudioRecordingWaveform, null));
51585
+ return /* @__PURE__ */ import_react216.default.createElement(import_react216.default.Fragment, null, /* @__PURE__ */ import_react216.default.createElement(RecordingTimer, { durationSeconds: secondsElapsed }), /* @__PURE__ */ import_react216.default.createElement(AudioRecordingWaveform, null));
51576
51586
  };
51577
51587
 
51578
51588
  // src/components/MediaRecorder/observable/Subscription.ts
@@ -51752,7 +51762,7 @@ var BrowserPermission = class {
51752
51762
 
51753
51763
  // src/components/MediaRecorder/classes/MediaRecorderController.ts
51754
51764
  var import_fix_webm_duration = __toESM(require("fix-webm-duration"));
51755
- var import_nanoid4 = require("nanoid");
51765
+ var import_nanoid5 = require("nanoid");
51756
51766
 
51757
51767
  // src/utils/mergeDeep.ts
51758
51768
  var import_lodash18 = __toESM(require("lodash.mergewith"));
@@ -52030,7 +52040,7 @@ var MediaRecorderController = class {
52030
52040
  file_size: blob.size,
52031
52041
  localMetadata: {
52032
52042
  file,
52033
- id: (0, import_nanoid4.nanoid)()
52043
+ id: (0, import_nanoid5.nanoid)()
52034
52044
  },
52035
52045
  mime_type: blob.type,
52036
52046
  title: file.name,
@@ -52219,7 +52229,7 @@ var AudioRecorder = () => {
52219
52229
  recordingController: { completeRecording, recorder, recording, recordingState }
52220
52230
  } = messageInputContext;
52221
52231
  const isUploadingFile = recording?.localMetadata?.uploadState === "uploading";
52222
- const state = (0, import_react216.useMemo)(
52232
+ const state = (0, import_react217.useMemo)(
52223
52233
  () => ({
52224
52234
  paused: recordingState === "paused" /* PAUSED */,
52225
52235
  recording: recordingState === "recording" /* RECORDING */,
@@ -52228,7 +52238,7 @@ var AudioRecorder = () => {
52228
52238
  [recordingState]
52229
52239
  );
52230
52240
  if (!recorder) return null;
52231
- return /* @__PURE__ */ import_react216.default.createElement("div", { className: "str-chat__audio_recorder-container" }, /* @__PURE__ */ import_react216.default.createElement("div", { className: "str-chat__audio_recorder", "data-testid": "audio-recorder" }, /* @__PURE__ */ import_react216.default.createElement(
52241
+ return /* @__PURE__ */ import_react217.default.createElement("div", { className: "str-chat__audio_recorder-container" }, /* @__PURE__ */ import_react217.default.createElement("div", { className: "str-chat__audio_recorder", "data-testid": "audio-recorder" }, /* @__PURE__ */ import_react217.default.createElement(
52232
52242
  "button",
52233
52243
  {
52234
52244
  className: "str-chat__audio_recorder__cancel-button",
@@ -52236,8 +52246,8 @@ var AudioRecorder = () => {
52236
52246
  disabled: isUploadingFile,
52237
52247
  onClick: recorder.cancel
52238
52248
  },
52239
- /* @__PURE__ */ import_react216.default.createElement(BinIcon, null)
52240
- ), state.stopped && recording?.asset_url ? /* @__PURE__ */ import_react216.default.createElement(
52249
+ /* @__PURE__ */ import_react217.default.createElement(BinIcon, null)
52250
+ ), state.stopped && recording?.asset_url ? /* @__PURE__ */ import_react217.default.createElement(
52241
52251
  AudioRecordingPreview,
52242
52252
  {
52243
52253
  durationSeconds: recording.duration ?? 0,
@@ -52245,22 +52255,22 @@ var AudioRecorder = () => {
52245
52255
  src: recording.asset_url,
52246
52256
  waveformData: recording.waveform_data
52247
52257
  }
52248
- ) : state.paused || state.recording ? /* @__PURE__ */ import_react216.default.createElement(AudioRecordingInProgress, null) : null, state.paused && /* @__PURE__ */ import_react216.default.createElement(
52258
+ ) : state.paused || state.recording ? /* @__PURE__ */ import_react217.default.createElement(AudioRecordingInProgress, null) : null, state.paused && /* @__PURE__ */ import_react217.default.createElement(
52249
52259
  "button",
52250
52260
  {
52251
52261
  className: "str-chat__audio_recorder__resume-recording-button",
52252
52262
  onClick: recorder.resume
52253
52263
  },
52254
- /* @__PURE__ */ import_react216.default.createElement(MicIcon, null)
52255
- ), state.recording && /* @__PURE__ */ import_react216.default.createElement(
52264
+ /* @__PURE__ */ import_react217.default.createElement(MicIcon, null)
52265
+ ), state.recording && /* @__PURE__ */ import_react217.default.createElement(
52256
52266
  "button",
52257
52267
  {
52258
52268
  className: "str-chat__audio_recorder__pause-recording-button",
52259
52269
  "data-testid": "pause-recording-audio-button",
52260
52270
  onClick: recorder.pause
52261
52271
  },
52262
- /* @__PURE__ */ import_react216.default.createElement(PauseIcon2, null)
52263
- ), state.stopped ? /* @__PURE__ */ import_react216.default.createElement(
52272
+ /* @__PURE__ */ import_react217.default.createElement(PauseIcon2, null)
52273
+ ), state.stopped ? /* @__PURE__ */ import_react217.default.createElement(
52264
52274
  "button",
52265
52275
  {
52266
52276
  className: "str-chat__audio_recorder__complete-button",
@@ -52268,21 +52278,21 @@ var AudioRecorder = () => {
52268
52278
  disabled: isUploadingFile,
52269
52279
  onClick: completeRecording
52270
52280
  },
52271
- isUploadingFile ? /* @__PURE__ */ import_react216.default.createElement(LoadingIndicatorIcon, null) : /* @__PURE__ */ import_react216.default.createElement(SendIcon, null)
52272
- ) : /* @__PURE__ */ import_react216.default.createElement(
52281
+ isUploadingFile ? /* @__PURE__ */ import_react217.default.createElement(LoadingIndicatorIcon, null) : /* @__PURE__ */ import_react217.default.createElement(SendIcon, null)
52282
+ ) : /* @__PURE__ */ import_react217.default.createElement(
52273
52283
  "button",
52274
52284
  {
52275
52285
  className: "str-chat__audio_recorder__stop-button",
52276
52286
  "data-testid": "audio-recorder-stop-button",
52277
52287
  onClick: recorder.stop
52278
52288
  },
52279
- /* @__PURE__ */ import_react216.default.createElement(CheckSignIcon, null)
52289
+ /* @__PURE__ */ import_react217.default.createElement(CheckSignIcon, null)
52280
52290
  )));
52281
52291
  };
52282
52292
 
52283
52293
  // src/components/MediaRecorder/AudioRecorder/AudioRecordingButtons.tsx
52284
- var import_react217 = __toESM(require("react"));
52285
- var StartRecordingAudioButton = (props) => /* @__PURE__ */ import_react217.default.createElement(
52294
+ var import_react218 = __toESM(require("react"));
52295
+ var StartRecordingAudioButton = (props) => /* @__PURE__ */ import_react218.default.createElement(
52286
52296
  "button",
52287
52297
  {
52288
52298
  "aria-label": "Start recording audio",
@@ -52290,7 +52300,7 @@ var StartRecordingAudioButton = (props) => /* @__PURE__ */ import_react217.defau
52290
52300
  "data-testid": "start-recording-audio-button",
52291
52301
  ...props
52292
52302
  },
52293
- /* @__PURE__ */ import_react217.default.createElement(MicIcon, null)
52303
+ /* @__PURE__ */ import_react218.default.createElement(MicIcon, null)
52294
52304
  );
52295
52305
 
52296
52306
  // src/components/MessageInput/AttachmentPreviewList/VoiceRecordingPreview.tsx
@@ -52303,13 +52313,13 @@ var VoiceRecordingPreview = ({
52303
52313
  const { audioRef, isPlaying, secondsElapsed, togglePlay } = useAudioController({
52304
52314
  mimeType: attachment.mime_type
52305
52315
  });
52306
- return /* @__PURE__ */ import_react218.default.createElement(
52316
+ return /* @__PURE__ */ import_react219.default.createElement(
52307
52317
  "div",
52308
52318
  {
52309
52319
  className: "str-chat__attachment-preview-voice-recording",
52310
52320
  "data-testid": "attachment-preview-voice-recording"
52311
52321
  },
52312
- /* @__PURE__ */ import_react218.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react218.default.createElement(
52322
+ /* @__PURE__ */ import_react219.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react219.default.createElement(
52313
52323
  "source",
52314
52324
  {
52315
52325
  "data-testid": "audio-source",
@@ -52317,8 +52327,8 @@ var VoiceRecordingPreview = ({
52317
52327
  type: attachment.mime_type
52318
52328
  }
52319
52329
  )),
52320
- /* @__PURE__ */ import_react218.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }),
52321
- /* @__PURE__ */ import_react218.default.createElement(
52330
+ /* @__PURE__ */ import_react219.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }),
52331
+ /* @__PURE__ */ import_react219.default.createElement(
52322
52332
  "button",
52323
52333
  {
52324
52334
  "aria-label": t("aria/Remove attachment"),
@@ -52327,24 +52337,24 @@ var VoiceRecordingPreview = ({
52327
52337
  disabled: attachment.localMetadata?.uploadState === "uploading",
52328
52338
  onClick: () => attachment.localMetadata?.id && removeAttachments([attachment.localMetadata.id])
52329
52339
  },
52330
- /* @__PURE__ */ import_react218.default.createElement(CloseIcon, null)
52340
+ /* @__PURE__ */ import_react219.default.createElement(CloseIcon, null)
52331
52341
  ),
52332
- ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react218.default.createElement(
52342
+ ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react219.default.createElement(
52333
52343
  "button",
52334
52344
  {
52335
52345
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-file",
52336
52346
  "data-testid": "file-preview-item-retry-button",
52337
52347
  onClick: () => handleRetry(attachment)
52338
52348
  },
52339
- /* @__PURE__ */ import_react218.default.createElement(RetryIcon, null)
52349
+ /* @__PURE__ */ import_react219.default.createElement(RetryIcon, null)
52340
52350
  ),
52341
- /* @__PURE__ */ import_react218.default.createElement("div", { className: "str-chat__attachment-preview-metadata" }, /* @__PURE__ */ import_react218.default.createElement("div", { className: "str-chat__attachment-preview-file-name", title: attachment.title }, attachment.title), typeof attachment.duration !== "undefined" && /* @__PURE__ */ import_react218.default.createElement(RecordingTimer, { durationSeconds: secondsElapsed || attachment.duration }), attachment.localMetadata?.uploadState === "uploading" && /* @__PURE__ */ import_react218.default.createElement(LoadingIndicatorIcon, { size: 17 })),
52342
- /* @__PURE__ */ import_react218.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react218.default.createElement(FileIcon, { filename: attachment.title, mimeType: attachment.mime_type }))
52351
+ /* @__PURE__ */ import_react219.default.createElement("div", { className: "str-chat__attachment-preview-metadata" }, /* @__PURE__ */ import_react219.default.createElement("div", { className: "str-chat__attachment-preview-file-name", title: attachment.title }, attachment.title), typeof attachment.duration !== "undefined" && /* @__PURE__ */ import_react219.default.createElement(RecordingTimer, { durationSeconds: secondsElapsed || attachment.duration }), attachment.localMetadata?.uploadState === "uploading" && /* @__PURE__ */ import_react219.default.createElement(LoadingIndicatorIcon, { size: 17 })),
52352
+ /* @__PURE__ */ import_react219.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react219.default.createElement(FileIcon, { filename: attachment.title, mimeType: attachment.mime_type }))
52343
52353
  );
52344
52354
  };
52345
52355
 
52346
52356
  // src/components/MessageInput/AttachmentPreviewList/FileAttachmentPreview.tsx
52347
- var import_react219 = __toESM(require("react"));
52357
+ var import_react220 = __toESM(require("react"));
52348
52358
  var FileAttachmentPreview = ({
52349
52359
  attachment,
52350
52360
  handleRetry,
@@ -52352,14 +52362,14 @@ var FileAttachmentPreview = ({
52352
52362
  }) => {
52353
52363
  const { t } = useTranslationContext("FilePreview");
52354
52364
  const uploadState = attachment.localMetadata?.uploadState;
52355
- return /* @__PURE__ */ import_react219.default.createElement(
52365
+ return /* @__PURE__ */ import_react220.default.createElement(
52356
52366
  "div",
52357
52367
  {
52358
52368
  className: "str-chat__attachment-preview-file",
52359
52369
  "data-testid": "attachment-preview-file"
52360
52370
  },
52361
- /* @__PURE__ */ import_react219.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react219.default.createElement(FileIcon, { filename: attachment.title, mimeType: attachment.mime_type })),
52362
- /* @__PURE__ */ import_react219.default.createElement(
52371
+ /* @__PURE__ */ import_react220.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react220.default.createElement(FileIcon, { filename: attachment.title, mimeType: attachment.mime_type })),
52372
+ /* @__PURE__ */ import_react220.default.createElement(
52363
52373
  "button",
52364
52374
  {
52365
52375
  "aria-label": t("aria/Remove attachment"),
@@ -52368,9 +52378,9 @@ var FileAttachmentPreview = ({
52368
52378
  disabled: uploadState === "uploading",
52369
52379
  onClick: () => attachment.localMetadata?.id && removeAttachments([attachment.localMetadata?.id])
52370
52380
  },
52371
- /* @__PURE__ */ import_react219.default.createElement(CloseIcon, null)
52381
+ /* @__PURE__ */ import_react220.default.createElement(CloseIcon, null)
52372
52382
  ),
52373
- ["blocked", "failed"].includes(uploadState) && !!handleRetry && /* @__PURE__ */ import_react219.default.createElement(
52383
+ ["blocked", "failed"].includes(uploadState) && !!handleRetry && /* @__PURE__ */ import_react220.default.createElement(
52374
52384
  "button",
52375
52385
  {
52376
52386
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-file",
@@ -52379,9 +52389,9 @@ var FileAttachmentPreview = ({
52379
52389
  handleRetry(attachment);
52380
52390
  }
52381
52391
  },
52382
- /* @__PURE__ */ import_react219.default.createElement(RetryIcon, null)
52392
+ /* @__PURE__ */ import_react220.default.createElement(RetryIcon, null)
52383
52393
  ),
52384
- /* @__PURE__ */ import_react219.default.createElement("div", { className: "str-chat__attachment-preview-file-end" }, /* @__PURE__ */ import_react219.default.createElement("div", { className: "str-chat__attachment-preview-file-name", title: attachment.title }, attachment.title), (typeof uploadState === "undefined" || uploadState === "finished") && !!attachment.asset_url && /* @__PURE__ */ import_react219.default.createElement(
52394
+ /* @__PURE__ */ import_react220.default.createElement("div", { className: "str-chat__attachment-preview-file-end" }, /* @__PURE__ */ import_react220.default.createElement("div", { className: "str-chat__attachment-preview-file-name", title: attachment.title }, attachment.title), (typeof uploadState === "undefined" || uploadState === "finished") && !!attachment.asset_url && /* @__PURE__ */ import_react220.default.createElement(
52385
52395
  "a",
52386
52396
  {
52387
52397
  "aria-label": t("aria/Download attachment"),
@@ -52392,14 +52402,14 @@ var FileAttachmentPreview = ({
52392
52402
  target: "_blank",
52393
52403
  title: t("Download attachment {{ name }}", { name: attachment.title })
52394
52404
  },
52395
- /* @__PURE__ */ import_react219.default.createElement(DownloadIcon2, null)
52396
- ), uploadState === "uploading" && /* @__PURE__ */ import_react219.default.createElement(LoadingIndicatorIcon, { size: 17 }))
52405
+ /* @__PURE__ */ import_react220.default.createElement(DownloadIcon2, null)
52406
+ ), uploadState === "uploading" && /* @__PURE__ */ import_react220.default.createElement(LoadingIndicatorIcon, { size: 17 }))
52397
52407
  );
52398
52408
  };
52399
52409
 
52400
52410
  // src/components/MessageInput/AttachmentPreviewList/ImageAttachmentPreview.tsx
52401
52411
  var import_clsx56 = __toESM(require("clsx"));
52402
- var import_react220 = __toESM(require("react"));
52412
+ var import_react221 = __toESM(require("react"));
52403
52413
  var ImageAttachmentPreview = ({
52404
52414
  attachment,
52405
52415
  handleRetry,
@@ -52407,11 +52417,11 @@ var ImageAttachmentPreview = ({
52407
52417
  }) => {
52408
52418
  const { t } = useTranslationContext("ImagePreviewItem");
52409
52419
  const { BaseImage: BaseImage3 = BaseImage } = useComponentContext("ImagePreview");
52410
- const [previewError, setPreviewError] = (0, import_react220.useState)(false);
52420
+ const [previewError, setPreviewError] = (0, import_react221.useState)(false);
52411
52421
  const { id, uploadState } = attachment.localMetadata ?? {};
52412
- const handleLoadError = (0, import_react220.useCallback)(() => setPreviewError(true), []);
52422
+ const handleLoadError = (0, import_react221.useCallback)(() => setPreviewError(true), []);
52413
52423
  const assetUrl = attachment.image_url || attachment.localMetadata.previewUri;
52414
- return /* @__PURE__ */ import_react220.default.createElement(
52424
+ return /* @__PURE__ */ import_react221.default.createElement(
52415
52425
  "div",
52416
52426
  {
52417
52427
  className: (0, import_clsx56.default)("str-chat__attachment-preview-image", {
@@ -52419,7 +52429,7 @@ var ImageAttachmentPreview = ({
52419
52429
  }),
52420
52430
  "data-testid": "attachment-preview-image"
52421
52431
  },
52422
- /* @__PURE__ */ import_react220.default.createElement(
52432
+ /* @__PURE__ */ import_react221.default.createElement(
52423
52433
  "button",
52424
52434
  {
52425
52435
  "aria-label": t("aria/Remove attachment"),
@@ -52428,19 +52438,19 @@ var ImageAttachmentPreview = ({
52428
52438
  disabled: uploadState === "uploading",
52429
52439
  onClick: () => id && removeAttachments([id])
52430
52440
  },
52431
- /* @__PURE__ */ import_react220.default.createElement(CloseIcon, null)
52441
+ /* @__PURE__ */ import_react221.default.createElement(CloseIcon, null)
52432
52442
  ),
52433
- ["blocked", "failed"].includes(uploadState) && /* @__PURE__ */ import_react220.default.createElement(
52443
+ ["blocked", "failed"].includes(uploadState) && /* @__PURE__ */ import_react221.default.createElement(
52434
52444
  "button",
52435
52445
  {
52436
52446
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-image",
52437
52447
  "data-testid": "image-preview-item-retry-button",
52438
52448
  onClick: () => handleRetry(attachment)
52439
52449
  },
52440
- /* @__PURE__ */ import_react220.default.createElement(RetryIcon, null)
52450
+ /* @__PURE__ */ import_react221.default.createElement(RetryIcon, null)
52441
52451
  ),
52442
- uploadState === "uploading" && /* @__PURE__ */ import_react220.default.createElement("div", { className: "str-chat__attachment-preview-image-loading" }, /* @__PURE__ */ import_react220.default.createElement(LoadingIndicatorIcon, { size: 17 })),
52443
- assetUrl && /* @__PURE__ */ import_react220.default.createElement(
52452
+ uploadState === "uploading" && /* @__PURE__ */ import_react221.default.createElement("div", { className: "str-chat__attachment-preview-image-loading" }, /* @__PURE__ */ import_react221.default.createElement(LoadingIndicatorIcon, { size: 17 })),
52453
+ assetUrl && /* @__PURE__ */ import_react221.default.createElement(
52444
52454
  BaseImage3,
52445
52455
  {
52446
52456
  alt: attachment.fallback,
@@ -52454,11 +52464,11 @@ var ImageAttachmentPreview = ({
52454
52464
  };
52455
52465
 
52456
52466
  // src/components/MessageInput/hooks/useCanCreatePoll.ts
52457
- var import_react221 = require("react");
52467
+ var import_react222 = require("react");
52458
52468
  var useCanCreatePoll = () => {
52459
52469
  const { pollComposer } = useMessageComposer();
52460
- const [canCreatePoll, setCanCreatePoll] = (0, import_react221.useState)(pollComposer.canCreatePoll);
52461
- (0, import_react221.useEffect)(
52470
+ const [canCreatePoll, setCanCreatePoll] = (0, import_react222.useState)(pollComposer.canCreatePoll);
52471
+ (0, import_react222.useEffect)(
52462
52472
  () => pollComposer.state.subscribe(() => {
52463
52473
  setCanCreatePoll(pollComposer.canCreatePoll);
52464
52474
  }),
@@ -52468,20 +52478,20 @@ var useCanCreatePoll = () => {
52468
52478
  };
52469
52479
 
52470
52480
  // src/components/MessageInput/hooks/useCooldownTimer.tsx
52471
- var import_react222 = require("react");
52481
+ var import_react223 = require("react");
52472
52482
  var useCooldownTimer = () => {
52473
52483
  const { client, latestMessageDatesByChannels } = useChatContext("useCooldownTimer");
52474
52484
  const { channel, messages = [] } = useChannelStateContext("useCooldownTimer");
52475
- const [cooldownRemaining, setCooldownRemaining] = (0, import_react222.useState)();
52485
+ const [cooldownRemaining, setCooldownRemaining] = (0, import_react223.useState)();
52476
52486
  const { cooldown: cooldownInterval = 0, own_capabilities } = channel.data || {};
52477
52487
  const skipCooldown = own_capabilities?.includes("skip-slow-mode");
52478
- const ownLatestMessageDate = (0, import_react222.useMemo)(
52488
+ const ownLatestMessageDate = (0, import_react223.useMemo)(
52479
52489
  () => latestMessageDatesByChannels[channel.cid] ?? [...messages].sort(
52480
52490
  (a, b) => b.created_at?.getTime() - a.created_at?.getTime()
52481
52491
  ).find((v) => v.user?.id === client.user?.id)?.created_at,
52482
52492
  [messages, client.user?.id, latestMessageDatesByChannels, channel.cid]
52483
52493
  );
52484
- (0, import_react222.useEffect)(() => {
52494
+ (0, import_react223.useEffect)(() => {
52485
52495
  const timeSinceOwnLastMessage = ownLatestMessageDate ? (
52486
52496
  // prevent negative values
52487
52497
  Math.max(0, ((/* @__PURE__ */ new Date()).getTime() - ownLatestMessageDate.getTime()) / 1e3)
@@ -52504,11 +52514,11 @@ var useCooldownTimer = () => {
52504
52514
  };
52505
52515
 
52506
52516
  // src/components/MessageInput/hooks/useTextareaRef.ts
52507
- var import_react223 = require("react");
52517
+ var import_react224 = require("react");
52508
52518
  var useTextareaRef = (props) => {
52509
52519
  const { focus } = props;
52510
- const textareaRef = (0, import_react223.useRef)(void 0);
52511
- (0, import_react223.useEffect)(() => {
52520
+ const textareaRef = (0, import_react224.useRef)(void 0);
52521
+ (0, import_react224.useEffect)(() => {
52512
52522
  if (focus && textareaRef.current) {
52513
52523
  textareaRef.current.focus();
52514
52524
  }
@@ -52519,7 +52529,7 @@ var useTextareaRef = (props) => {
52519
52529
  };
52520
52530
 
52521
52531
  // src/components/MessageInput/hooks/useSubmitHandler.ts
52522
- var import_react224 = require("react");
52532
+ var import_react225 = require("react");
52523
52533
  var import_stream_chat8 = require("stream-chat");
52524
52534
  var takeStateSnapshot = (messageComposer) => {
52525
52535
  const textComposerState = messageComposer.textComposer.state.getLatestValue();
@@ -52542,7 +52552,7 @@ var useSubmitHandler = (props) => {
52542
52552
  const { addNotification, editMessage, sendMessage } = useChannelActionContext("useSubmitHandler");
52543
52553
  const { t } = useTranslationContext("useSubmitHandler");
52544
52554
  const messageComposer = useMessageComposer();
52545
- const handleSubmit = (0, import_react224.useCallback)(
52555
+ const handleSubmit = (0, import_react225.useCallback)(
52546
52556
  async (event) => {
52547
52557
  event?.preventDefault();
52548
52558
  const composition = await messageComposer.compose();
@@ -52599,10 +52609,10 @@ var useSubmitHandler = (props) => {
52599
52609
  };
52600
52610
 
52601
52611
  // src/components/MessageInput/hooks/usePasteHandler.ts
52602
- var import_react225 = require("react");
52612
+ var import_react226 = require("react");
52603
52613
  var usePasteHandler = () => {
52604
52614
  const { attachmentManager, textComposer } = useMessageComposer();
52605
- const onPaste = (0, import_react225.useCallback)(
52615
+ const onPaste = (0, import_react226.useCallback)(
52606
52616
  (clipboardEvent) => {
52607
52617
  (async (event) => {
52608
52618
  const { items } = event.clipboardData;
@@ -52634,7 +52644,7 @@ var usePasteHandler = () => {
52634
52644
  };
52635
52645
 
52636
52646
  // src/components/MediaRecorder/hooks/useMediaRecorder.ts
52637
- var import_react226 = require("react");
52647
+ var import_react227 = require("react");
52638
52648
  var useMediaRecorder = ({
52639
52649
  asyncMessagesMultiSendEnabled,
52640
52650
  enabled,
@@ -52644,11 +52654,11 @@ var useMediaRecorder = ({
52644
52654
  }) => {
52645
52655
  const { t } = useTranslationContext("useMediaRecorder");
52646
52656
  const messageComposer = useMessageComposer();
52647
- const [recording, setRecording] = (0, import_react226.useState)();
52648
- const [recordingState, setRecordingState] = (0, import_react226.useState)();
52649
- const [permissionState, setPermissionState] = (0, import_react226.useState)();
52650
- const [isScheduledForSubmit, scheduleForSubmit] = (0, import_react226.useState)(false);
52651
- const recorder = (0, import_react226.useMemo)(
52657
+ const [recording, setRecording] = (0, import_react227.useState)();
52658
+ const [recordingState, setRecordingState] = (0, import_react227.useState)();
52659
+ const [permissionState, setPermissionState] = (0, import_react227.useState)();
52660
+ const [isScheduledForSubmit, scheduleForSubmit] = (0, import_react227.useState)(false);
52661
+ const recorder = (0, import_react227.useMemo)(
52652
52662
  () => enabled ? new MediaRecorderController({
52653
52663
  config: recordingConfig ?? {},
52654
52664
  generateRecordingTitle,
@@ -52656,7 +52666,7 @@ var useMediaRecorder = ({
52656
52666
  }) : void 0,
52657
52667
  [recordingConfig, enabled, generateRecordingTitle, t]
52658
52668
  );
52659
- const completeRecording = (0, import_react226.useCallback)(async () => {
52669
+ const completeRecording = (0, import_react227.useCallback)(async () => {
52660
52670
  if (!recorder) return;
52661
52671
  const recording2 = await recorder.stop();
52662
52672
  if (!recording2) return;
@@ -52666,12 +52676,12 @@ var useMediaRecorder = ({
52666
52676
  }
52667
52677
  recorder.cleanUp();
52668
52678
  }, [asyncMessagesMultiSendEnabled, messageComposer, recorder]);
52669
- (0, import_react226.useEffect)(() => {
52679
+ (0, import_react227.useEffect)(() => {
52670
52680
  if (!isScheduledForSubmit) return;
52671
52681
  handleSubmit();
52672
52682
  scheduleForSubmit(false);
52673
52683
  }, [handleSubmit, isScheduledForSubmit]);
52674
- (0, import_react226.useEffect)(() => {
52684
+ (0, import_react227.useEffect)(() => {
52675
52685
  if (!recorder) return;
52676
52686
  recorder.permission.watch();
52677
52687
  const recordingSubscription = recorder.recording.subscribe(setRecording);
@@ -52734,7 +52744,7 @@ var AttachmentPreviewList = ({
52734
52744
  const messageComposer = useMessageComposer();
52735
52745
  const { attachments } = useAttachmentManagerState();
52736
52746
  if (!attachments.length) return null;
52737
- return /* @__PURE__ */ import_react227.default.createElement("div", { className: "str-chat__attachment-preview-list" }, /* @__PURE__ */ import_react227.default.createElement(
52747
+ return /* @__PURE__ */ import_react228.default.createElement("div", { className: "str-chat__attachment-preview-list" }, /* @__PURE__ */ import_react228.default.createElement(
52738
52748
  "div",
52739
52749
  {
52740
52750
  className: "str-chat__attachment-list-scroll-container",
@@ -52743,7 +52753,7 @@ var AttachmentPreviewList = ({
52743
52753
  attachments.map((attachment) => {
52744
52754
  if ((0, import_stream_chat9.isScrapedContent)(attachment)) return null;
52745
52755
  if ((0, import_stream_chat9.isLocalVoiceRecordingAttachment)(attachment)) {
52746
- return /* @__PURE__ */ import_react227.default.createElement(
52756
+ return /* @__PURE__ */ import_react228.default.createElement(
52747
52757
  VoiceRecordingPreview2,
52748
52758
  {
52749
52759
  attachment,
@@ -52753,7 +52763,7 @@ var AttachmentPreviewList = ({
52753
52763
  }
52754
52764
  );
52755
52765
  } else if ((0, import_stream_chat9.isLocalAudioAttachment)(attachment)) {
52756
- return /* @__PURE__ */ import_react227.default.createElement(
52766
+ return /* @__PURE__ */ import_react228.default.createElement(
52757
52767
  AudioAttachmentPreview,
52758
52768
  {
52759
52769
  attachment,
@@ -52763,7 +52773,7 @@ var AttachmentPreviewList = ({
52763
52773
  }
52764
52774
  );
52765
52775
  } else if ((0, import_stream_chat9.isLocalVideoAttachment)(attachment)) {
52766
- return /* @__PURE__ */ import_react227.default.createElement(
52776
+ return /* @__PURE__ */ import_react228.default.createElement(
52767
52777
  VideoAttachmentPreview,
52768
52778
  {
52769
52779
  attachment,
@@ -52773,7 +52783,7 @@ var AttachmentPreviewList = ({
52773
52783
  }
52774
52784
  );
52775
52785
  } else if ((0, import_stream_chat9.isLocalImageAttachment)(attachment)) {
52776
- return /* @__PURE__ */ import_react227.default.createElement(
52786
+ return /* @__PURE__ */ import_react228.default.createElement(
52777
52787
  ImageAttachmentPreview2,
52778
52788
  {
52779
52789
  attachment,
@@ -52783,7 +52793,7 @@ var AttachmentPreviewList = ({
52783
52793
  }
52784
52794
  );
52785
52795
  } else if ((0, import_stream_chat9.isLocalFileAttachment)(attachment)) {
52786
- return /* @__PURE__ */ import_react227.default.createElement(
52796
+ return /* @__PURE__ */ import_react228.default.createElement(
52787
52797
  FileAttachmentPreview2,
52788
52798
  {
52789
52799
  attachment,
@@ -52793,7 +52803,7 @@ var AttachmentPreviewList = ({
52793
52803
  }
52794
52804
  );
52795
52805
  } else if ((0, import_stream_chat9.isLocalAttachment)(attachment)) {
52796
- return /* @__PURE__ */ import_react227.default.createElement(
52806
+ return /* @__PURE__ */ import_react228.default.createElement(
52797
52807
  UnsupportedAttachmentPreview2,
52798
52808
  {
52799
52809
  attachment,
@@ -52809,13 +52819,13 @@ var AttachmentPreviewList = ({
52809
52819
  };
52810
52820
 
52811
52821
  // src/components/MessageInput/CooldownTimer.tsx
52812
- var import_react229 = __toESM(require("react"));
52822
+ var import_react230 = __toESM(require("react"));
52813
52823
 
52814
52824
  // src/components/MessageInput/hooks/useTimer.ts
52815
- var import_react228 = require("react");
52825
+ var import_react229 = require("react");
52816
52826
  var useTimer = ({ startFrom }) => {
52817
- const [secondsLeft, setSecondsLeft] = (0, import_react228.useState)();
52818
- (0, import_react228.useEffect)(() => {
52827
+ const [secondsLeft, setSecondsLeft] = (0, import_react229.useState)();
52828
+ (0, import_react229.useEffect)(() => {
52819
52829
  let countdownTimeout;
52820
52830
  if (typeof secondsLeft === "number" && secondsLeft > 0) {
52821
52831
  countdownTimeout = setTimeout(() => {
@@ -52826,7 +52836,7 @@ var useTimer = ({ startFrom }) => {
52826
52836
  clearTimeout(countdownTimeout);
52827
52837
  };
52828
52838
  }, [secondsLeft]);
52829
- (0, import_react228.useEffect)(() => {
52839
+ (0, import_react229.useEffect)(() => {
52830
52840
  setSecondsLeft(startFrom ?? 0);
52831
52841
  }, [startFrom]);
52832
52842
  return secondsLeft;
@@ -52835,23 +52845,23 @@ var useTimer = ({ startFrom }) => {
52835
52845
  // src/components/MessageInput/CooldownTimer.tsx
52836
52846
  var CooldownTimer = ({ cooldownInterval }) => {
52837
52847
  const secondsLeft = useTimer({ startFrom: cooldownInterval });
52838
- return /* @__PURE__ */ import_react229.default.createElement("div", { className: "str-chat__message-input-cooldown", "data-testid": "cooldown-timer" }, secondsLeft);
52848
+ return /* @__PURE__ */ import_react230.default.createElement("div", { className: "str-chat__message-input-cooldown", "data-testid": "cooldown-timer" }, secondsLeft);
52839
52849
  };
52840
52850
 
52841
52851
  // src/components/MessageInput/EditMessageForm.tsx
52842
- var import_react247 = __toESM(require("react"));
52852
+ var import_react248 = __toESM(require("react"));
52843
52853
 
52844
52854
  // src/components/MessageInput/MessageInput.tsx
52845
- var import_react246 = __toESM(require("react"));
52855
+ var import_react247 = __toESM(require("react"));
52846
52856
 
52847
52857
  // src/components/MessageInput/MessageInputFlat.tsx
52848
- var import_react244 = __toESM(require("react"));
52858
+ var import_react245 = __toESM(require("react"));
52849
52859
 
52850
52860
  // src/components/MessageInput/SendButton.tsx
52851
- var import_react230 = __toESM(require("react"));
52861
+ var import_react231 = __toESM(require("react"));
52852
52862
  var SendButton = ({ sendMessage, ...rest }) => {
52853
52863
  const hasSendableData = useMessageComposerHasSendableData();
52854
- return /* @__PURE__ */ import_react230.default.createElement(
52864
+ return /* @__PURE__ */ import_react231.default.createElement(
52855
52865
  "button",
52856
52866
  {
52857
52867
  "aria-label": "Send",
@@ -52862,18 +52872,18 @@ var SendButton = ({ sendMessage, ...rest }) => {
52862
52872
  type: "button",
52863
52873
  ...rest
52864
52874
  },
52865
- /* @__PURE__ */ import_react230.default.createElement(SendIcon, null)
52875
+ /* @__PURE__ */ import_react231.default.createElement(SendIcon, null)
52866
52876
  );
52867
52877
  };
52868
52878
 
52869
52879
  // src/components/MessageInput/StopAIGenerationButton.tsx
52870
- var import_react231 = __toESM(require("react"));
52880
+ var import_react232 = __toESM(require("react"));
52871
52881
  var StopAIGenerationButton = ({
52872
52882
  onClick,
52873
52883
  ...restProps
52874
52884
  }) => {
52875
52885
  const { t } = useTranslationContext();
52876
- return /* @__PURE__ */ import_react231.default.createElement(
52886
+ return /* @__PURE__ */ import_react232.default.createElement(
52877
52887
  "button",
52878
52888
  {
52879
52889
  "aria-label": t("aria/Stop AI Generation"),
@@ -52886,7 +52896,7 @@ var StopAIGenerationButton = ({
52886
52896
  };
52887
52897
 
52888
52898
  // src/components/MessageInput/QuotedMessagePreview.tsx
52889
- var import_react232 = __toESM(require("react"));
52899
+ var import_react233 = __toESM(require("react"));
52890
52900
  var messageComposerStateStoreSelector = (state) => ({
52891
52901
  quotedMessage: state.quotedMessage
52892
52902
  });
@@ -52898,14 +52908,14 @@ var QuotedMessagePreviewHeader = () => {
52898
52908
  messageComposerStateStoreSelector
52899
52909
  );
52900
52910
  if (!quotedMessage) return null;
52901
- return /* @__PURE__ */ import_react232.default.createElement("div", { className: "str-chat__quoted-message-preview-header" }, /* @__PURE__ */ import_react232.default.createElement("div", { className: "str-chat__quoted-message-reply-to-message" }, t("Reply to Message")), /* @__PURE__ */ import_react232.default.createElement(
52911
+ return /* @__PURE__ */ import_react233.default.createElement("div", { className: "str-chat__quoted-message-preview-header" }, /* @__PURE__ */ import_react233.default.createElement("div", { className: "str-chat__quoted-message-reply-to-message" }, t("Reply to Message")), /* @__PURE__ */ import_react233.default.createElement(
52902
52912
  "button",
52903
52913
  {
52904
52914
  "aria-label": t("aria/Cancel Reply"),
52905
52915
  className: "str-chat__quoted-message-remove",
52906
52916
  onClick: () => messageComposer.setQuotedMessage(null)
52907
52917
  },
52908
- /* @__PURE__ */ import_react232.default.createElement(CloseIcon, null)
52918
+ /* @__PURE__ */ import_react233.default.createElement(CloseIcon, null)
52909
52919
  ));
52910
52920
  };
52911
52921
  var QuotedMessagePreview = ({
@@ -52919,27 +52929,27 @@ var QuotedMessagePreview = ({
52919
52929
  messageComposer.state,
52920
52930
  messageComposerStateStoreSelector
52921
52931
  );
52922
- const quotedMessageText = (0, import_react232.useMemo)(
52932
+ const quotedMessageText = (0, import_react233.useMemo)(
52923
52933
  () => quotedMessage?.i18n?.[`${userLanguage}_text`] || quotedMessage?.text,
52924
52934
  [quotedMessage?.i18n, quotedMessage?.text, userLanguage]
52925
52935
  );
52926
- const renderedText = (0, import_react232.useMemo)(
52936
+ const renderedText = (0, import_react233.useMemo)(
52927
52937
  () => renderText2(quotedMessageText, quotedMessage?.mentioned_users),
52928
52938
  [quotedMessage, quotedMessageText, renderText2]
52929
52939
  );
52930
- const quotedMessageAttachments = (0, import_react232.useMemo)(
52940
+ const quotedMessageAttachments = (0, import_react233.useMemo)(
52931
52941
  () => quotedMessage?.attachments?.length ? quotedMessage.attachments.slice(0, 1) : [],
52932
52942
  [quotedMessage]
52933
52943
  );
52934
52944
  const poll = quotedMessage?.poll_id && client.polls.fromState(quotedMessage.poll_id);
52935
52945
  if (!quotedMessageText && !quotedMessageAttachments.length && !poll) return null;
52936
- return /* @__PURE__ */ import_react232.default.createElement(
52946
+ return /* @__PURE__ */ import_react233.default.createElement(
52937
52947
  "div",
52938
52948
  {
52939
52949
  className: "str-chat__quoted-message-preview",
52940
52950
  "data-testid": "quoted-message-preview"
52941
52951
  },
52942
- quotedMessage?.user && /* @__PURE__ */ import_react232.default.createElement(
52952
+ quotedMessage?.user && /* @__PURE__ */ import_react233.default.createElement(
52943
52953
  Avatar2,
52944
52954
  {
52945
52955
  className: "str-chat__avatar--quoted-message-sender",
@@ -52948,7 +52958,7 @@ var QuotedMessagePreview = ({
52948
52958
  user: quotedMessage.user
52949
52959
  }
52950
52960
  ),
52951
- /* @__PURE__ */ import_react232.default.createElement("div", { className: "str-chat__quoted-message-bubble" }, poll ? /* @__PURE__ */ import_react232.default.createElement(Poll, { isQuoted: true, poll }) : /* @__PURE__ */ import_react232.default.createElement(import_react232.default.Fragment, null, !!quotedMessageAttachments.length && /* @__PURE__ */ import_react232.default.createElement(Attachment2, { attachments: quotedMessageAttachments, isQuoted: true }), /* @__PURE__ */ import_react232.default.createElement(
52961
+ /* @__PURE__ */ import_react233.default.createElement("div", { className: "str-chat__quoted-message-bubble" }, poll ? /* @__PURE__ */ import_react233.default.createElement(Poll, { isQuoted: true, poll }) : /* @__PURE__ */ import_react233.default.createElement(import_react233.default.Fragment, null, !!quotedMessageAttachments.length && /* @__PURE__ */ import_react233.default.createElement(Attachment2, { attachments: quotedMessageAttachments, isQuoted: true }), /* @__PURE__ */ import_react233.default.createElement(
52952
52962
  "div",
52953
52963
  {
52954
52964
  className: "str-chat__quoted-message-text",
@@ -52961,7 +52971,7 @@ var QuotedMessagePreview = ({
52961
52971
 
52962
52972
  // src/components/MessageInput/LinkPreviewList.tsx
52963
52973
  var import_clsx57 = __toESM(require("clsx"));
52964
- var import_react233 = __toESM(require("react"));
52974
+ var import_react234 = __toESM(require("react"));
52965
52975
  var import_stream_chat10 = require("stream-chat");
52966
52976
  var linkPreviewsManagerStateSelector = (state) => ({
52967
52977
  linkPreviews: Array.from(state.previews.values()).filter(
@@ -52984,15 +52994,15 @@ var LinkPreviewList = () => {
52984
52994
  );
52985
52995
  const showLinkPreviews = linkPreviews.length > 0 && !quotedMessage;
52986
52996
  if (!showLinkPreviews) return null;
52987
- return /* @__PURE__ */ import_react233.default.createElement("div", { className: "str-chat__link-preview-list" }, linkPreviews.map((linkPreview) => /* @__PURE__ */ import_react233.default.createElement(LinkPreviewCard, { key: linkPreview.og_scrape_url, linkPreview })));
52997
+ return /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__link-preview-list" }, linkPreviews.map((linkPreview) => /* @__PURE__ */ import_react234.default.createElement(LinkPreviewCard, { key: linkPreview.og_scrape_url, linkPreview })));
52988
52998
  };
52989
52999
  var LinkPreviewCard = ({ linkPreview }) => {
52990
53000
  const { linkPreviewsManager } = useMessageComposer();
52991
53001
  const { handleEnter, handleLeave, tooltipVisible } = useEnterLeaveHandlers();
52992
- const [referenceElement, setReferenceElement] = (0, import_react233.useState)(null);
53002
+ const [referenceElement, setReferenceElement] = (0, import_react234.useState)(null);
52993
53003
  if (!import_stream_chat10.LinkPreviewsManager.previewIsLoaded(linkPreview) && !import_stream_chat10.LinkPreviewsManager.previewIsLoading(linkPreview))
52994
53004
  return null;
52995
- return /* @__PURE__ */ import_react233.default.createElement(
53005
+ return /* @__PURE__ */ import_react234.default.createElement(
52996
53006
  "div",
52997
53007
  {
52998
53008
  className: (0, import_clsx57.default)("str-chat__link-preview-card", {
@@ -53000,7 +53010,7 @@ var LinkPreviewCard = ({ linkPreview }) => {
53000
53010
  }),
53001
53011
  "data-testid": "link-preview-card"
53002
53012
  },
53003
- /* @__PURE__ */ import_react233.default.createElement(
53013
+ /* @__PURE__ */ import_react234.default.createElement(
53004
53014
  PopperTooltip,
53005
53015
  {
53006
53016
  offset: [0, 5],
@@ -53009,7 +53019,7 @@ var LinkPreviewCard = ({ linkPreview }) => {
53009
53019
  },
53010
53020
  linkPreview.og_scrape_url
53011
53021
  ),
53012
- /* @__PURE__ */ import_react233.default.createElement(
53022
+ /* @__PURE__ */ import_react234.default.createElement(
53013
53023
  "div",
53014
53024
  {
53015
53025
  className: "str-chat__link-preview-card__icon-container",
@@ -53017,10 +53027,10 @@ var LinkPreviewCard = ({ linkPreview }) => {
53017
53027
  onMouseLeave: handleLeave,
53018
53028
  ref: setReferenceElement
53019
53029
  },
53020
- /* @__PURE__ */ import_react233.default.createElement(LinkIcon, null)
53030
+ /* @__PURE__ */ import_react234.default.createElement(LinkIcon, null)
53021
53031
  ),
53022
- /* @__PURE__ */ import_react233.default.createElement("div", { className: "str-chat__link-preview-card__content" }, /* @__PURE__ */ import_react233.default.createElement("div", { className: "str-chat__link-preview-card__content-title" }, linkPreview.title), /* @__PURE__ */ import_react233.default.createElement("div", { className: "str-chat__link-preview-card__content-description" }, linkPreview.text)),
53023
- /* @__PURE__ */ import_react233.default.createElement(
53032
+ /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__link-preview-card__content" }, /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__link-preview-card__content-title" }, linkPreview.title), /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__link-preview-card__content-description" }, linkPreview.text)),
53033
+ /* @__PURE__ */ import_react234.default.createElement(
53024
53034
  "button",
53025
53035
  {
53026
53036
  className: "str-chat__link-preview-card__dismiss-button",
@@ -53028,49 +53038,49 @@ var LinkPreviewCard = ({ linkPreview }) => {
53028
53038
  onClick: () => linkPreviewsManager.dismissPreview(linkPreview.og_scrape_url),
53029
53039
  type: "button"
53030
53040
  },
53031
- /* @__PURE__ */ import_react233.default.createElement(CloseIcon, null)
53041
+ /* @__PURE__ */ import_react234.default.createElement(CloseIcon, null)
53032
53042
  )
53033
53043
  );
53034
53044
  };
53035
53045
 
53036
53046
  // src/components/TextareaComposer/SuggestionList/CommandItem.tsx
53037
- var import_react234 = __toESM(require("react"));
53047
+ var import_react235 = __toESM(require("react"));
53038
53048
  var CommandItem = (props) => {
53039
53049
  const { entity } = props;
53040
- return /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__slash-command" }, /* @__PURE__ */ import_react234.default.createElement("span", { className: "str-chat__slash-command-header" }, /* @__PURE__ */ import_react234.default.createElement("strong", null, entity.name), " ", entity.args), /* @__PURE__ */ import_react234.default.createElement("br", null), /* @__PURE__ */ import_react234.default.createElement("span", { className: "str-chat__slash-command-description" }, entity.description));
53050
+ return /* @__PURE__ */ import_react235.default.createElement("div", { className: "str-chat__slash-command" }, /* @__PURE__ */ import_react235.default.createElement("span", { className: "str-chat__slash-command-header" }, /* @__PURE__ */ import_react235.default.createElement("strong", null, entity.name), " ", entity.args), /* @__PURE__ */ import_react235.default.createElement("br", null), /* @__PURE__ */ import_react235.default.createElement("span", { className: "str-chat__slash-command-description" }, entity.description));
53041
53051
  };
53042
53052
 
53043
53053
  // src/components/TextareaComposer/SuggestionList/EmoticonItem.tsx
53044
- var import_react235 = __toESM(require("react"));
53054
+ var import_react236 = __toESM(require("react"));
53045
53055
  var EmoticonItem = (props) => {
53046
53056
  const { entity } = props;
53047
53057
  const hasEntity = Object.keys(entity).length;
53048
53058
  if (!hasEntity) return null;
53049
53059
  const { parts, token } = entity.tokenizedDisplayName ?? {};
53050
53060
  const renderName = () => parts?.map(
53051
- (part, i) => part.toLowerCase() === token ? /* @__PURE__ */ import_react235.default.createElement("span", { className: "str-chat__emoji-item--highlight", key: `part-${i}` }, part) : /* @__PURE__ */ import_react235.default.createElement("span", { className: "str-chat__emoji-item--part", key: `part-${i}` }, part)
53061
+ (part, i) => part.toLowerCase() === token ? /* @__PURE__ */ import_react236.default.createElement("span", { className: "str-chat__emoji-item--highlight", key: `part-${i}` }, part) : /* @__PURE__ */ import_react236.default.createElement("span", { className: "str-chat__emoji-item--part", key: `part-${i}` }, part)
53052
53062
  ) ?? null;
53053
- return /* @__PURE__ */ import_react235.default.createElement("div", { className: "str-chat__emoji-item" }, /* @__PURE__ */ import_react235.default.createElement("span", { className: "str-chat__emoji-item--entity" }, entity.native), /* @__PURE__ */ import_react235.default.createElement("span", { className: "str-chat__emoji-item--name" }, renderName()));
53063
+ return /* @__PURE__ */ import_react236.default.createElement("div", { className: "str-chat__emoji-item" }, /* @__PURE__ */ import_react236.default.createElement("span", { className: "str-chat__emoji-item--entity" }, entity.native), /* @__PURE__ */ import_react236.default.createElement("span", { className: "str-chat__emoji-item--name" }, renderName()));
53054
53064
  };
53055
53065
 
53056
53066
  // src/components/TextareaComposer/SuggestionList/SuggestionList.tsx
53057
53067
  var import_clsx60 = __toESM(require("clsx"));
53058
- var import_react238 = __toESM(require("react"));
53068
+ var import_react239 = __toESM(require("react"));
53059
53069
 
53060
53070
  // src/components/TextareaComposer/SuggestionList/SuggestionListItem.tsx
53061
53071
  var import_clsx58 = __toESM(require("clsx"));
53062
- var import_react236 = __toESM(require("react"));
53063
- var SuggestionListItem = import_react236.default.forwardRef(function SuggestionListItem2({ className, component: Component2, focused, item, onMouseEnter }, innerRef) {
53072
+ var import_react237 = __toESM(require("react"));
53073
+ var SuggestionListItem = import_react237.default.forwardRef(function SuggestionListItem2({ className, component: Component2, focused, item, onMouseEnter }, innerRef) {
53064
53074
  const { textComposer } = useMessageComposer();
53065
- const containerRef = (0, import_react236.useRef)(null);
53066
- const handleSelect = (0, import_react236.useCallback)(() => {
53075
+ const containerRef = (0, import_react237.useRef)(null);
53076
+ const handleSelect = (0, import_react237.useCallback)(() => {
53067
53077
  textComposer.handleSelect(item);
53068
53078
  }, [item, textComposer]);
53069
- (0, import_react236.useLayoutEffect)(() => {
53079
+ (0, import_react237.useLayoutEffect)(() => {
53070
53080
  if (!focused) return;
53071
53081
  containerRef.current?.scrollIntoView({ behavior: "instant", block: "nearest" });
53072
53082
  }, [focused, containerRef]);
53073
- return /* @__PURE__ */ import_react236.default.createElement(
53083
+ return /* @__PURE__ */ import_react237.default.createElement(
53074
53084
  "li",
53075
53085
  {
53076
53086
  className: (0, import_clsx58.default)("str-chat__suggestion-list-item", className, {
@@ -53079,7 +53089,7 @@ var SuggestionListItem = import_react236.default.forwardRef(function SuggestionL
53079
53089
  onMouseEnter,
53080
53090
  ref: containerRef
53081
53091
  },
53082
- /* @__PURE__ */ import_react236.default.createElement(
53092
+ /* @__PURE__ */ import_react237.default.createElement(
53083
53093
  "button",
53084
53094
  {
53085
53095
  onClick: handleSelect,
@@ -53090,13 +53100,13 @@ var SuggestionListItem = import_react236.default.forwardRef(function SuggestionL
53090
53100
  },
53091
53101
  ref: innerRef
53092
53102
  },
53093
- /* @__PURE__ */ import_react236.default.createElement(Component2, { entity: item, focused })
53103
+ /* @__PURE__ */ import_react237.default.createElement(Component2, { entity: item, focused })
53094
53104
  )
53095
53105
  );
53096
53106
  });
53097
53107
 
53098
53108
  // src/components/TextareaComposer/SuggestionList/UserItem.tsx
53099
- var import_react237 = __toESM(require("react"));
53109
+ var import_react238 = __toESM(require("react"));
53100
53110
  var import_clsx59 = __toESM(require("clsx"));
53101
53111
  var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
53102
53112
  const hasEntity = !!Object.keys(entity).length;
@@ -53105,7 +53115,7 @@ var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
53105
53115
  const renderName = () => parts.map((part, i) => {
53106
53116
  const matches = part.toLowerCase() === token;
53107
53117
  const partWithHTMLSpacesAround = part.replace(/^\s+|\s+$/g, "\xA0");
53108
- return /* @__PURE__ */ import_react237.default.createElement(
53118
+ return /* @__PURE__ */ import_react238.default.createElement(
53109
53119
  "span",
53110
53120
  {
53111
53121
  className: (0, import_clsx59.default)({
@@ -53117,14 +53127,14 @@ var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
53117
53127
  partWithHTMLSpacesAround
53118
53128
  );
53119
53129
  });
53120
- return /* @__PURE__ */ import_react237.default.createElement("div", { className: "str-chat__user-item" }, /* @__PURE__ */ import_react237.default.createElement(
53130
+ return /* @__PURE__ */ import_react238.default.createElement("div", { className: "str-chat__user-item" }, /* @__PURE__ */ import_react238.default.createElement(
53121
53131
  Avatar2,
53122
53132
  {
53123
53133
  className: "str-chat__avatar--autocomplete-item",
53124
53134
  image: entity.image,
53125
53135
  name: entity.name || entity.id
53126
53136
  }
53127
- ), /* @__PURE__ */ import_react237.default.createElement("span", { className: "str-chat__user-item--name", "data-testid": "user-item-name" }, renderName()), /* @__PURE__ */ import_react237.default.createElement("div", { className: "str-chat__user-item-at" }, "@"));
53137
+ ), /* @__PURE__ */ import_react238.default.createElement("span", { className: "str-chat__user-item--name", "data-testid": "user-item-name" }, renderName()), /* @__PURE__ */ import_react238.default.createElement("div", { className: "str-chat__user-item-at" }, "@"));
53128
53138
  };
53129
53139
 
53130
53140
  // src/components/TextareaComposer/SuggestionList/SuggestionList.tsx
@@ -53135,9 +53145,9 @@ var searchSourceStateSelector = (nextValue) => ({
53135
53145
  items: nextValue.items ?? []
53136
53146
  });
53137
53147
  var defaultComponents = {
53138
- "/": (props) => /* @__PURE__ */ import_react238.default.createElement(CommandItem, { entity: props.entity }),
53139
- ":": (props) => /* @__PURE__ */ import_react238.default.createElement(EmoticonItem, { entity: props.entity }),
53140
- "@": (props) => /* @__PURE__ */ import_react238.default.createElement(UserItem, { entity: props.entity })
53148
+ "/": (props) => /* @__PURE__ */ import_react239.default.createElement(CommandItem, { entity: props.entity }),
53149
+ ":": (props) => /* @__PURE__ */ import_react239.default.createElement(EmoticonItem, { entity: props.entity }),
53150
+ "@": (props) => /* @__PURE__ */ import_react239.default.createElement(UserItem, { entity: props.entity })
53141
53151
  };
53142
53152
  var SuggestionList = ({
53143
53153
  className,
@@ -53152,9 +53162,9 @@ var SuggestionList = ({
53152
53162
  const { textComposer } = messageComposer;
53153
53163
  const { suggestions } = useStateStore(textComposer.state, textComposerStateSelector);
53154
53164
  const { items } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector) ?? {};
53155
- const [container, setContainer] = (0, import_react238.useState)(null);
53165
+ const [container, setContainer] = (0, import_react239.useState)(null);
53156
53166
  const component = suggestions?.trigger ? suggestionItemComponents[suggestions?.trigger] : void 0;
53157
- (0, import_react238.useEffect)(() => {
53167
+ (0, import_react239.useEffect)(() => {
53158
53168
  if (!closeOnClickOutside || !suggestions || !container) return;
53159
53169
  const handleClick = (event) => {
53160
53170
  if (container.contains(event.target)) return;
@@ -53166,19 +53176,19 @@ var SuggestionList = ({
53166
53176
  };
53167
53177
  }, [closeOnClickOutside, suggestions, container, textComposer]);
53168
53178
  if (!suggestions || !items?.length || !component) return null;
53169
- return /* @__PURE__ */ import_react238.default.createElement(
53179
+ return /* @__PURE__ */ import_react239.default.createElement(
53170
53180
  "div",
53171
53181
  {
53172
53182
  className: (0, import_clsx60.default)("str-chat__suggestion-list-container", containerClassName),
53173
53183
  ref: setContainer
53174
53184
  },
53175
- /* @__PURE__ */ import_react238.default.createElement(
53185
+ /* @__PURE__ */ import_react239.default.createElement(
53176
53186
  InfiniteScrollPaginator,
53177
53187
  {
53178
53188
  loadNextOnScrollToBottom: suggestions.searchSource.search,
53179
53189
  threshold: 100
53180
53190
  },
53181
- /* @__PURE__ */ import_react238.default.createElement(
53191
+ /* @__PURE__ */ import_react239.default.createElement(
53182
53192
  "ul",
53183
53193
  {
53184
53194
  className: (0, import_clsx60.default)(
@@ -53186,7 +53196,7 @@ var SuggestionList = ({
53186
53196
  className
53187
53197
  )
53188
53198
  },
53189
- items.map((item, i) => /* @__PURE__ */ import_react238.default.createElement(
53199
+ items.map((item, i) => /* @__PURE__ */ import_react239.default.createElement(
53190
53200
  AutocompleteSuggestionItem,
53191
53201
  {
53192
53202
  component,
@@ -53204,8 +53214,8 @@ var SuggestionList = ({
53204
53214
  // src/components/TextareaComposer/TextareaComposer.tsx
53205
53215
  var import_lodash19 = __toESM(require("lodash.debounce"));
53206
53216
  var import_clsx61 = __toESM(require("clsx"));
53207
- var import_react239 = require("react");
53208
- var import_react240 = __toESM(require("react"));
53217
+ var import_react240 = require("react");
53218
+ var import_react241 = __toESM(require("react"));
53209
53219
  var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"));
53210
53220
  var textComposerStateSelector2 = (state) => ({
53211
53221
  selection: state.selection,
@@ -53260,10 +53270,10 @@ var TextareaComposer = ({
53260
53270
  );
53261
53271
  const { enabled } = useStateStore(messageComposer.configState, configStateSelector);
53262
53272
  const { isLoadingItems } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector2) ?? {};
53263
- const containerRef = (0, import_react240.useRef)(null);
53264
- const [focusedItemIndex, setFocusedItemIndex] = (0, import_react240.useState)(0);
53265
- const [isComposing, setIsComposing] = (0, import_react240.useState)(false);
53266
- const changeHandler = (0, import_react240.useCallback)(
53273
+ const containerRef = (0, import_react241.useRef)(null);
53274
+ const [focusedItemIndex, setFocusedItemIndex] = (0, import_react241.useState)(0);
53275
+ const [isComposing, setIsComposing] = (0, import_react241.useState)(false);
53276
+ const changeHandler = (0, import_react241.useCallback)(
53267
53277
  (e) => {
53268
53278
  if (onChange) {
53269
53279
  onChange(e);
@@ -53280,13 +53290,13 @@ var TextareaComposer = ({
53280
53290
  },
53281
53291
  [onChange, textComposer, textareaRef]
53282
53292
  );
53283
- const onCompositionEnd = (0, import_react240.useCallback)(() => {
53293
+ const onCompositionEnd = (0, import_react241.useCallback)(() => {
53284
53294
  setIsComposing(false);
53285
53295
  }, []);
53286
- const onCompositionStart = (0, import_react240.useCallback)(() => {
53296
+ const onCompositionStart = (0, import_react241.useCallback)(() => {
53287
53297
  setIsComposing(true);
53288
53298
  }, []);
53289
- const keyDownHandler = (0, import_react240.useCallback)(
53299
+ const keyDownHandler = (0, import_react241.useCallback)(
53290
53300
  (event) => {
53291
53301
  if (onKeyDown) {
53292
53302
  onKeyDown(event);
@@ -53338,7 +53348,7 @@ var TextareaComposer = ({
53338
53348
  textareaRef
53339
53349
  ]
53340
53350
  );
53341
- const scrollHandler = (0, import_react240.useCallback)(
53351
+ const scrollHandler = (0, import_react241.useCallback)(
53342
53352
  (event) => {
53343
53353
  if (onScroll) {
53344
53354
  onScroll(event);
@@ -53348,7 +53358,7 @@ var TextareaComposer = ({
53348
53358
  },
53349
53359
  [onScroll, textComposer]
53350
53360
  );
53351
- const setSelectionDebounced = (0, import_react239.useMemo)(
53361
+ const setSelectionDebounced = (0, import_react240.useMemo)(
53352
53362
  () => (0, import_lodash19.default)(
53353
53363
  (e) => {
53354
53364
  onSelect?.(e);
@@ -53362,18 +53372,18 @@ var TextareaComposer = ({
53362
53372
  ),
53363
53373
  [onSelect, textComposer]
53364
53374
  );
53365
- (0, import_react240.useEffect)(() => {
53375
+ (0, import_react241.useEffect)(() => {
53366
53376
  if (textareaRef.current && !isComposing) {
53367
53377
  textareaRef.current.selectionStart = selection.start;
53368
53378
  textareaRef.current.selectionEnd = selection.end;
53369
53379
  }
53370
53380
  }, [text7, textareaRef, selection.start, selection.end, isComposing]);
53371
- (0, import_react240.useEffect)(() => {
53381
+ (0, import_react241.useEffect)(() => {
53372
53382
  if (textComposer.suggestions) {
53373
53383
  setFocusedItemIndex(0);
53374
53384
  }
53375
53385
  }, [textComposer.suggestions]);
53376
- return /* @__PURE__ */ import_react240.default.createElement(
53386
+ return /* @__PURE__ */ import_react241.default.createElement(
53377
53387
  "div",
53378
53388
  {
53379
53389
  className: (0, import_clsx61.default)(
@@ -53386,7 +53396,7 @@ var TextareaComposer = ({
53386
53396
  ),
53387
53397
  ref: containerRef
53388
53398
  },
53389
- /* @__PURE__ */ import_react240.default.createElement(
53399
+ /* @__PURE__ */ import_react241.default.createElement(
53390
53400
  import_react_textarea_autosize.default,
53391
53401
  {
53392
53402
  ...{ ...additionalTextareaProps, ...restTextareaProps },
@@ -53415,7 +53425,7 @@ var TextareaComposer = ({
53415
53425
  value: text7
53416
53426
  }
53417
53427
  ),
53418
- !isComposing && /* @__PURE__ */ import_react240.default.createElement(
53428
+ !isComposing && /* @__PURE__ */ import_react241.default.createElement(
53419
53429
  AutocompleteSuggestionList,
53420
53430
  {
53421
53431
  className: listClassName,
@@ -53428,10 +53438,10 @@ var TextareaComposer = ({
53428
53438
  };
53429
53439
 
53430
53440
  // src/components/AIStateIndicator/AIStateIndicator.tsx
53431
- var import_react242 = __toESM(require("react"));
53441
+ var import_react243 = __toESM(require("react"));
53432
53442
 
53433
53443
  // src/components/AIStateIndicator/hooks/useAIState.ts
53434
- var import_react241 = require("react");
53444
+ var import_react242 = require("react");
53435
53445
  var AIStates = {
53436
53446
  Error: "AI_STATE_ERROR",
53437
53447
  ExternalSources: "AI_STATE_EXTERNAL_SOURCES",
@@ -53440,8 +53450,8 @@ var AIStates = {
53440
53450
  Thinking: "AI_STATE_THINKING"
53441
53451
  };
53442
53452
  var useAIState = (channel) => {
53443
- const [aiState, setAiState] = (0, import_react241.useState)(AIStates.Idle);
53444
- (0, import_react241.useEffect)(() => {
53453
+ const [aiState, setAiState] = (0, import_react242.useState)(AIStates.Idle);
53454
+ (0, import_react242.useEffect)(() => {
53445
53455
  if (!channel) {
53446
53456
  return;
53447
53457
  }
@@ -53478,21 +53488,21 @@ var AIStateIndicator = ({
53478
53488
  [AIStates.Thinking]: t("Thinking..."),
53479
53489
  [AIStates.Generating]: t("Generating...")
53480
53490
  };
53481
- return aiState in allowedStates ? /* @__PURE__ */ import_react242.default.createElement("div", { className: "str-chat__ai-state-indicator-container" }, /* @__PURE__ */ import_react242.default.createElement("p", { className: "str-chat__ai-state-indicator-text" }, allowedStates[aiState])) : null;
53491
+ return aiState in allowedStates ? /* @__PURE__ */ import_react243.default.createElement("div", { className: "str-chat__ai-state-indicator-container" }, /* @__PURE__ */ import_react243.default.createElement("p", { className: "str-chat__ai-state-indicator-text" }, allowedStates[aiState])) : null;
53482
53492
  };
53483
53493
 
53484
53494
  // src/components/MessageInput/WithDragAndDropUpload.tsx
53485
- var import_react243 = __toESM(require("react"));
53495
+ var import_react244 = __toESM(require("react"));
53486
53496
  var import_react_dropzone = require("react-dropzone");
53487
53497
  var import_clsx62 = __toESM(require("clsx"));
53488
- var DragAndDropUploadContext = import_react243.default.createContext({
53498
+ var DragAndDropUploadContext = import_react244.default.createContext({
53489
53499
  subscribeToDrop: null
53490
53500
  });
53491
- var useDragAndDropUploadContext = () => (0, import_react243.useContext)(DragAndDropUploadContext);
53501
+ var useDragAndDropUploadContext = () => (0, import_react244.useContext)(DragAndDropUploadContext);
53492
53502
  var useRegisterDropHandlers = () => {
53493
53503
  const { subscribeToDrop } = useDragAndDropUploadContext();
53494
53504
  const messageComposer = useMessageComposer();
53495
- (0, import_react243.useEffect)(() => {
53505
+ (0, import_react244.useEffect)(() => {
53496
53506
  const unsubscribe = subscribeToDrop?.(messageComposer.attachmentManager.uploadFiles);
53497
53507
  return unsubscribe;
53498
53508
  }, [subscribeToDrop, messageComposer]);
@@ -53507,7 +53517,7 @@ var WithDragAndDropUpload = ({
53507
53517
  component: Component2 = "div",
53508
53518
  style
53509
53519
  }) => {
53510
- const dropHandlersRef = (0, import_react243.useRef)(/* @__PURE__ */ new Set());
53520
+ const dropHandlersRef = (0, import_react244.useRef)(/* @__PURE__ */ new Set());
53511
53521
  const { t } = useTranslationContext();
53512
53522
  const messageInputContext = useMessageInputContext();
53513
53523
  const dragAndDropUploadContext = useDragAndDropUploadContext();
@@ -53518,20 +53528,20 @@ var WithDragAndDropUpload = ({
53518
53528
  attachmentManagerConfigStateSelector
53519
53529
  );
53520
53530
  const isWithinMessageInputContext = Object.keys(messageInputContext).length > 0;
53521
- const accept = (0, import_react243.useMemo)(
53531
+ const accept = (0, import_react244.useMemo)(
53522
53532
  () => acceptedFiles.reduce((mediaTypeMap, mediaType) => {
53523
53533
  mediaTypeMap[mediaType] ?? (mediaTypeMap[mediaType] = []);
53524
53534
  return mediaTypeMap;
53525
53535
  }, {}),
53526
53536
  [acceptedFiles]
53527
53537
  );
53528
- const subscribeToDrop = (0, import_react243.useCallback)((fn) => {
53538
+ const subscribeToDrop = (0, import_react244.useCallback)((fn) => {
53529
53539
  dropHandlersRef.current.add(fn);
53530
53540
  return () => {
53531
53541
  dropHandlersRef.current.delete(fn);
53532
53542
  };
53533
53543
  }, []);
53534
- const handleDrop = (0, import_react243.useCallback)((files) => {
53544
+ const handleDrop = (0, import_react244.useCallback)((files) => {
53535
53545
  dropHandlersRef.current.forEach((fn) => fn(files));
53536
53546
  }, []);
53537
53547
  const { getRootProps, isDragActive, isDragReject } = (0, import_react_dropzone.useDropzone)({
@@ -53544,24 +53554,24 @@ var WithDragAndDropUpload = ({
53544
53554
  onDrop: isWithinMessageInputContext ? messageComposer.attachmentManager.uploadFiles : handleDrop
53545
53555
  });
53546
53556
  if (dragAndDropUploadContext.subscribeToDrop !== null) {
53547
- return /* @__PURE__ */ import_react243.default.createElement(Component2, { className }, children);
53557
+ return /* @__PURE__ */ import_react244.default.createElement(Component2, { className }, children);
53548
53558
  }
53549
- return /* @__PURE__ */ import_react243.default.createElement(
53559
+ return /* @__PURE__ */ import_react244.default.createElement(
53550
53560
  DragAndDropUploadContext.Provider,
53551
53561
  {
53552
53562
  value: {
53553
53563
  subscribeToDrop
53554
53564
  }
53555
53565
  },
53556
- /* @__PURE__ */ import_react243.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react243.default.createElement(
53566
+ /* @__PURE__ */ import_react244.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react244.default.createElement(
53557
53567
  "div",
53558
53568
  {
53559
53569
  className: (0, import_clsx62.default)("str-chat__dropzone-container", {
53560
53570
  "str-chat__dropzone-container--not-accepted": isDragReject
53561
53571
  })
53562
53572
  },
53563
- !isDragReject && /* @__PURE__ */ import_react243.default.createElement("p", null, t("Drag your files here")),
53564
- isDragReject && /* @__PURE__ */ import_react243.default.createElement("p", null, t("Some of the files will not be accepted"))
53573
+ !isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Drag your files here")),
53574
+ isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Some of the files will not be accepted"))
53565
53575
  ), children)
53566
53576
  );
53567
53577
  };
@@ -53593,33 +53603,33 @@ var MessageInputFlat = () => {
53593
53603
  } = useComponentContext();
53594
53604
  const { channel } = useChatContext("MessageInputFlat");
53595
53605
  const { aiState } = useAIState(channel);
53596
- const stopGenerating = (0, import_react244.useCallback)(() => channel?.stopAIResponse(), [channel]);
53606
+ const stopGenerating = (0, import_react245.useCallback)(() => channel?.stopAIResponse(), [channel]);
53597
53607
  const [
53598
53608
  showRecordingPermissionDeniedNotification,
53599
53609
  setShowRecordingPermissionDeniedNotification
53600
- ] = (0, import_react244.useState)(false);
53601
- const closePermissionDeniedNotification = (0, import_react244.useCallback)(() => {
53610
+ ] = (0, import_react245.useState)(false);
53611
+ const closePermissionDeniedNotification = (0, import_react245.useCallback)(() => {
53602
53612
  setShowRecordingPermissionDeniedNotification(false);
53603
53613
  }, []);
53604
53614
  const { attachments } = useAttachmentManagerState();
53605
- if (recordingController.recordingState) return /* @__PURE__ */ import_react244.default.createElement(AudioRecorder2, null);
53615
+ if (recordingController.recordingState) return /* @__PURE__ */ import_react245.default.createElement(AudioRecorder2, null);
53606
53616
  const recordingEnabled = !!(recordingController.recorder && navigator.mediaDevices);
53607
53617
  const isRecording = !!recordingController.recordingState;
53608
53618
  const StopAIGenerationButton2 = StopAIGenerationButtonOverride === void 0 ? StopAIGenerationButton : StopAIGenerationButtonOverride;
53609
53619
  const shouldDisplayStopAIGeneration = [AIStates.Thinking, AIStates.Generating].includes(aiState) && !!StopAIGenerationButton2;
53610
- return /* @__PURE__ */ import_react244.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react244.default.createElement(
53620
+ return /* @__PURE__ */ import_react245.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react245.default.createElement(
53611
53621
  RecordingPermissionDeniedNotification2,
53612
53622
  {
53613
53623
  onClose: closePermissionDeniedNotification,
53614
53624
  permissionName: "microphone" /* MIC */
53615
53625
  }
53616
- ), /* @__PURE__ */ import_react244.default.createElement(LinkPreviewList2, null), /* @__PURE__ */ import_react244.default.createElement(QuotedMessagePreviewHeader, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-input-inner" }, /* @__PURE__ */ import_react244.default.createElement(AttachmentSelector2, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-textarea-container" }, /* @__PURE__ */ import_react244.default.createElement(QuotedMessagePreview2, null), /* @__PURE__ */ import_react244.default.createElement(AttachmentPreviewList2, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-textarea-with-emoji-picker" }, /* @__PURE__ */ import_react244.default.createElement(TextareaComposer2, null), EmojiPicker && /* @__PURE__ */ import_react244.default.createElement(EmojiPicker, null))), shouldDisplayStopAIGeneration ? /* @__PURE__ */ import_react244.default.createElement(StopAIGenerationButton2, { onClick: stopGenerating }) : !hideSendButton && /* @__PURE__ */ import_react244.default.createElement(import_react244.default.Fragment, null, cooldownRemaining ? /* @__PURE__ */ import_react244.default.createElement(
53626
+ ), /* @__PURE__ */ import_react245.default.createElement(LinkPreviewList2, null), /* @__PURE__ */ import_react245.default.createElement(QuotedMessagePreviewHeader, null), /* @__PURE__ */ import_react245.default.createElement("div", { className: "str-chat__message-input-inner" }, /* @__PURE__ */ import_react245.default.createElement(AttachmentSelector2, null), /* @__PURE__ */ import_react245.default.createElement("div", { className: "str-chat__message-textarea-container" }, /* @__PURE__ */ import_react245.default.createElement(QuotedMessagePreview2, null), /* @__PURE__ */ import_react245.default.createElement(AttachmentPreviewList2, null), /* @__PURE__ */ import_react245.default.createElement("div", { className: "str-chat__message-textarea-with-emoji-picker" }, /* @__PURE__ */ import_react245.default.createElement(TextareaComposer2, null), EmojiPicker && /* @__PURE__ */ import_react245.default.createElement(EmojiPicker, null))), shouldDisplayStopAIGeneration ? /* @__PURE__ */ import_react245.default.createElement(StopAIGenerationButton2, { onClick: stopGenerating }) : !hideSendButton && /* @__PURE__ */ import_react245.default.createElement(import_react245.default.Fragment, null, cooldownRemaining ? /* @__PURE__ */ import_react245.default.createElement(
53617
53627
  CooldownTimer2,
53618
53628
  {
53619
53629
  cooldownInterval: cooldownRemaining,
53620
53630
  setCooldownRemaining
53621
53631
  }
53622
- ) : /* @__PURE__ */ import_react244.default.createElement(import_react244.default.Fragment, null, /* @__PURE__ */ import_react244.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react244.default.createElement(
53632
+ ) : /* @__PURE__ */ import_react245.default.createElement(import_react245.default.Fragment, null, /* @__PURE__ */ import_react245.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react245.default.createElement(
53623
53633
  StartRecordingAudioButton2,
53624
53634
  {
53625
53635
  disabled: isRecording || !asyncMessagesMultiSendEnabled && attachments.some(
@@ -53634,7 +53644,7 @@ var MessageInputFlat = () => {
53634
53644
  };
53635
53645
 
53636
53646
  // src/components/MessageInput/hooks/useCreateMessageInputContext.ts
53637
- var import_react245 = require("react");
53647
+ var import_react246 = require("react");
53638
53648
  var useCreateMessageInputContext = (value) => {
53639
53649
  const {
53640
53650
  additionalTextareaProps,
@@ -53658,7 +53668,7 @@ var useCreateMessageInputContext = (value) => {
53658
53668
  textareaRef
53659
53669
  } = value;
53660
53670
  const parentId = parent?.id;
53661
- const messageInputContext = (0, import_react245.useMemo)(
53671
+ const messageInputContext = (0, import_react246.useMemo)(
53662
53672
  () => ({
53663
53673
  additionalTextareaProps,
53664
53674
  asyncMessagesMultiSendEnabled,
@@ -53710,13 +53720,13 @@ var MessageInputProvider = (props) => {
53710
53720
  emojiSearchIndex: props.emojiSearchIndex ?? emojiSearchIndex
53711
53721
  });
53712
53722
  const messageComposer = useMessageComposer();
53713
- (0, import_react246.useEffect)(
53723
+ (0, import_react247.useEffect)(
53714
53724
  () => () => {
53715
53725
  messageComposer.createDraft();
53716
53726
  },
53717
53727
  [messageComposer]
53718
53728
  );
53719
- (0, import_react246.useEffect)(() => {
53729
+ (0, import_react247.useEffect)(() => {
53720
53730
  const threadId = messageComposer.threadId;
53721
53731
  if (!threadId || !messageComposer.channel || !messageComposer.compositionIsEmpty)
53722
53732
  return;
@@ -53727,16 +53737,17 @@ var MessageInputProvider = (props) => {
53727
53737
  });
53728
53738
  }, [messageComposer]);
53729
53739
  useRegisterDropHandlers();
53730
- return /* @__PURE__ */ import_react246.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
53740
+ return /* @__PURE__ */ import_react247.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
53731
53741
  };
53732
53742
  var UnMemoizedMessageInput = (props) => {
53733
53743
  const { Input: PropInput } = props;
53734
53744
  const { Input: ContextInput } = useComponentContext("MessageInput");
53745
+ const id = useStableId();
53735
53746
  const Input = PropInput || ContextInput || MessageInputFlat;
53736
- const dialogManagerId = props.isThreadInput ? "message-input-dialog-manager-thread" : "message-input-dialog-manager";
53737
- return /* @__PURE__ */ import_react246.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react246.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react246.default.createElement(Input, null)));
53747
+ const dialogManagerId = props.isThreadInput ? `message-input-dialog-manager-thread-${id}` : `message-input-dialog-manager-${id}`;
53748
+ return /* @__PURE__ */ import_react247.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react247.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react247.default.createElement(Input, null)));
53738
53749
  };
53739
- var MessageInput = import_react246.default.memo(
53750
+ var MessageInput = import_react247.default.memo(
53740
53751
  UnMemoizedMessageInput
53741
53752
  );
53742
53753
 
@@ -53744,7 +53755,7 @@ var MessageInput = import_react246.default.memo(
53744
53755
  var EditMessageFormSendButton = () => {
53745
53756
  const { t } = useTranslationContext();
53746
53757
  const hasSendableData = useMessageComposerHasSendableData();
53747
- return /* @__PURE__ */ import_react247.default.createElement(
53758
+ return /* @__PURE__ */ import_react248.default.createElement(
53748
53759
  "button",
53749
53760
  {
53750
53761
  className: "str-chat__edit-message-send",
@@ -53759,26 +53770,26 @@ var EditMessageForm = () => {
53759
53770
  const { t } = useTranslationContext("EditMessageForm");
53760
53771
  const messageComposer = useMessageComposer();
53761
53772
  const { clearEditingState, handleSubmit } = useMessageInputContext("EditMessageForm");
53762
- const cancel = (0, import_react247.useCallback)(() => {
53773
+ const cancel = (0, import_react248.useCallback)(() => {
53763
53774
  clearEditingState?.();
53764
53775
  messageComposer.restore();
53765
53776
  }, [clearEditingState, messageComposer]);
53766
- (0, import_react247.useEffect)(() => {
53777
+ (0, import_react248.useEffect)(() => {
53767
53778
  const onKeyDown = (event) => {
53768
53779
  if (event.key === "Escape") cancel();
53769
53780
  };
53770
53781
  document.addEventListener("keydown", onKeyDown);
53771
53782
  return () => document.removeEventListener("keydown", onKeyDown);
53772
53783
  }, [cancel]);
53773
- return /* @__PURE__ */ import_react247.default.createElement(
53784
+ return /* @__PURE__ */ import_react248.default.createElement(
53774
53785
  "form",
53775
53786
  {
53776
53787
  autoComplete: "off",
53777
53788
  className: "str-chat__edit-message-form",
53778
53789
  onSubmit: handleSubmit
53779
53790
  },
53780
- /* @__PURE__ */ import_react247.default.createElement(MessageInputFlat, null),
53781
- /* @__PURE__ */ import_react247.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react247.default.createElement(
53791
+ /* @__PURE__ */ import_react248.default.createElement(MessageInputFlat, null),
53792
+ /* @__PURE__ */ import_react248.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react248.default.createElement(
53782
53793
  "button",
53783
53794
  {
53784
53795
  className: "str-chat__edit-message-cancel",
@@ -53786,7 +53797,7 @@ var EditMessageForm = () => {
53786
53797
  onClick: cancel
53787
53798
  },
53788
53799
  t("Cancel")
53789
- ), /* @__PURE__ */ import_react247.default.createElement(EditMessageFormSendButton, null))
53800
+ ), /* @__PURE__ */ import_react248.default.createElement(EditMessageFormSendButton, null))
53790
53801
  );
53791
53802
  };
53792
53803
  var EditMessageModal = ({
@@ -53795,18 +53806,18 @@ var EditMessageModal = ({
53795
53806
  const { EditMessageInput = EditMessageForm } = useComponentContext();
53796
53807
  const { clearEditingState } = useMessageContext();
53797
53808
  const messageComposer = useMessageComposer();
53798
- const onEditModalClose = (0, import_react247.useCallback)(() => {
53809
+ const onEditModalClose = (0, import_react248.useCallback)(() => {
53799
53810
  clearEditingState();
53800
53811
  messageComposer.restore();
53801
53812
  }, [clearEditingState, messageComposer]);
53802
- return /* @__PURE__ */ import_react247.default.createElement(
53813
+ return /* @__PURE__ */ import_react248.default.createElement(
53803
53814
  Modal,
53804
53815
  {
53805
53816
  className: "str-chat__edit-message-modal",
53806
53817
  onClose: onEditModalClose,
53807
53818
  open: true
53808
53819
  },
53809
- /* @__PURE__ */ import_react247.default.createElement(
53820
+ /* @__PURE__ */ import_react248.default.createElement(
53810
53821
  MessageInput,
53811
53822
  {
53812
53823
  clearEditingState,
@@ -53823,12 +53834,12 @@ var attachmentManagerConfigStateSelector2 = (state) => ({
53823
53834
  acceptedFiles: state.attachments.acceptedFiles,
53824
53835
  maxNumberOfFilesPerMessage: state.attachments.maxNumberOfFilesPerMessage
53825
53836
  });
53826
- var UploadButton = (0, import_react248.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
53837
+ var UploadButton = (0, import_react249.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
53827
53838
  const handleInputChange = useHandleFileChangeWrapper(resetOnChange, onFileChange);
53828
- return /* @__PURE__ */ import_react248.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
53839
+ return /* @__PURE__ */ import_react249.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
53829
53840
  });
53830
53841
  var FileInput = UploadButton;
53831
- var UploadFileInput = (0, import_react248.forwardRef)(function UploadFileInput2({
53842
+ var UploadFileInput = (0, import_react249.forwardRef)(function UploadFileInput2({
53832
53843
  className,
53833
53844
  onFileChange: onFileChangeCustom,
53834
53845
  ...props
@@ -53842,15 +53853,15 @@ var UploadFileInput = (0, import_react248.forwardRef)(function UploadFileInput2(
53842
53853
  messageComposer.configState,
53843
53854
  attachmentManagerConfigStateSelector2
53844
53855
  );
53845
- const id = (0, import_react248.useMemo)(() => (0, import_nanoid5.nanoid)(), []);
53846
- const onFileChange = (0, import_react248.useCallback)(
53856
+ const id = (0, import_react249.useMemo)(() => (0, import_nanoid6.nanoid)(), []);
53857
+ const onFileChange = (0, import_react249.useCallback)(
53847
53858
  (files) => {
53848
53859
  attachmentManager.uploadFiles(files);
53849
53860
  onFileChangeCustom?.(files);
53850
53861
  },
53851
53862
  [onFileChangeCustom, attachmentManager]
53852
53863
  );
53853
- return /* @__PURE__ */ import_react248.default.createElement(
53864
+ return /* @__PURE__ */ import_react249.default.createElement(
53854
53865
  FileInput,
53855
53866
  {
53856
53867
  accept: acceptedFiles?.join(","),
@@ -53897,7 +53908,7 @@ var VoiceRecordingPlayer = ({
53897
53908
  });
53898
53909
  if (!asset_url) return null;
53899
53910
  const displayedDuration = secondsElapsed || duration;
53900
- return /* @__PURE__ */ import_react249.default.createElement("div", { className: rootClassName, "data-testid": "voice-recording-widget" }, /* @__PURE__ */ import_react249.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react249.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: mime_type })), /* @__PURE__ */ import_react249.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, /* @__PURE__ */ import_react249.default.createElement(
53911
+ return /* @__PURE__ */ import_react250.default.createElement("div", { className: rootClassName, "data-testid": "voice-recording-widget" }, /* @__PURE__ */ import_react250.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react250.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: mime_type })), /* @__PURE__ */ import_react250.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, /* @__PURE__ */ import_react250.default.createElement(
53901
53912
  "div",
53902
53913
  {
53903
53914
  className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -53905,25 +53916,25 @@ var VoiceRecordingPlayer = ({
53905
53916
  title
53906
53917
  },
53907
53918
  title
53908
- ), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(displayedDuration) : /* @__PURE__ */ import_react249.default.createElement(
53919
+ ), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(displayedDuration) : /* @__PURE__ */ import_react250.default.createElement(
53909
53920
  FileSizeIndicator,
53910
53921
  {
53911
53922
  fileSize: attachment.file_size,
53912
53923
  maximumFractionDigits: 0
53913
53924
  }
53914
- )), /* @__PURE__ */ import_react249.default.createElement(
53925
+ )), /* @__PURE__ */ import_react250.default.createElement(
53915
53926
  WaveProgressBar,
53916
53927
  {
53917
53928
  progress,
53918
53929
  seek,
53919
53930
  waveformData: waveform_data || []
53920
53931
  }
53921
- ))), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__right-section" }, isPlaying ? /* @__PURE__ */ import_react249.default.createElement(PlaybackRateButton, { disabled: !audioRef.current, onClick: increasePlaybackRate }, playbackRate.toFixed(1), "x") : /* @__PURE__ */ import_react249.default.createElement(FileIcon, { big: true, mimeType: mime_type, size: 40 })));
53932
+ ))), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__right-section" }, isPlaying ? /* @__PURE__ */ import_react250.default.createElement(PlaybackRateButton, { disabled: !audioRef.current, onClick: increasePlaybackRate }, playbackRate.toFixed(1), "x") : /* @__PURE__ */ import_react250.default.createElement(FileIcon, { big: true, mimeType: mime_type, size: 40 })));
53922
53933
  };
53923
53934
  var QuotedVoiceRecording = ({ attachment }) => {
53924
53935
  const { t } = useTranslationContext();
53925
53936
  const title = attachment.title || t("Voice message");
53926
- return /* @__PURE__ */ import_react249.default.createElement("div", { className: rootClassName, "data-testid": "quoted-voice-recording-widget" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, title && /* @__PURE__ */ import_react249.default.createElement(
53937
+ return /* @__PURE__ */ import_react250.default.createElement("div", { className: rootClassName, "data-testid": "quoted-voice-recording-widget" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, title && /* @__PURE__ */ import_react250.default.createElement(
53927
53938
  "div",
53928
53939
  {
53929
53940
  className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -53931,18 +53942,18 @@ var QuotedVoiceRecording = ({ attachment }) => {
53931
53942
  title
53932
53943
  },
53933
53944
  title
53934
- ), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(attachment.duration) : /* @__PURE__ */ import_react249.default.createElement(
53945
+ ), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(attachment.duration) : /* @__PURE__ */ import_react250.default.createElement(
53935
53946
  FileSizeIndicator,
53936
53947
  {
53937
53948
  fileSize: attachment.file_size,
53938
53949
  maximumFractionDigits: 0
53939
53950
  }
53940
- )))), /* @__PURE__ */ import_react249.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
53951
+ )))), /* @__PURE__ */ import_react250.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
53941
53952
  };
53942
- var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react249.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react249.default.createElement(VoiceRecordingPlayer, { attachment });
53953
+ var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react250.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react250.default.createElement(VoiceRecordingPlayer, { attachment });
53943
53954
 
53944
53955
  // src/components/Attachment/Card.tsx
53945
- var import_react250 = __toESM(require("react"));
53956
+ var import_react251 = __toESM(require("react"));
53946
53957
  var import_clsx64 = __toESM(require("clsx"));
53947
53958
  var import_react_player = __toESM(require("react-player"));
53948
53959
  var getHostFromURL = (url) => {
@@ -53954,26 +53965,26 @@ var getHostFromURL = (url) => {
53954
53965
  };
53955
53966
  var UnableToRenderCard = ({ type }) => {
53956
53967
  const { t } = useTranslationContext("Card");
53957
- return /* @__PURE__ */ import_react250.default.createElement(
53968
+ return /* @__PURE__ */ import_react251.default.createElement(
53958
53969
  "div",
53959
53970
  {
53960
53971
  className: (0, import_clsx64.default)("str-chat__message-attachment-card", {
53961
53972
  [`str-chat__message-attachment-card--${type}`]: type
53962
53973
  })
53963
53974
  },
53964
- /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, t("this content could not be displayed")))
53975
+ /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, t("this content could not be displayed")))
53965
53976
  );
53966
53977
  };
53967
53978
  var SourceLink = ({
53968
53979
  author_name,
53969
53980
  url
53970
- }) => /* @__PURE__ */ import_react250.default.createElement(
53981
+ }) => /* @__PURE__ */ import_react251.default.createElement(
53971
53982
  "div",
53972
53983
  {
53973
53984
  className: "str-chat__message-attachment-card--source-link",
53974
53985
  "data-testid": "card-source-link"
53975
53986
  },
53976
- /* @__PURE__ */ import_react250.default.createElement(
53987
+ /* @__PURE__ */ import_react251.default.createElement(
53977
53988
  SafeAnchor,
53978
53989
  {
53979
53990
  className: "str-chat__message-attachment-card--url",
@@ -53988,7 +53999,7 @@ var CardHeader = (props) => {
53988
53999
  const { asset_url, dimensions, image: image3, image_url, thumb_url, title, type } = props;
53989
54000
  let visual = null;
53990
54001
  if (asset_url && type === "video") {
53991
- visual = /* @__PURE__ */ import_react250.default.createElement(
54002
+ visual = /* @__PURE__ */ import_react251.default.createElement(
53992
54003
  import_react_player.default,
53993
54004
  {
53994
54005
  className: "react-player",
@@ -53999,7 +54010,7 @@ var CardHeader = (props) => {
53999
54010
  }
54000
54011
  );
54001
54012
  } else if (image3) {
54002
- visual = /* @__PURE__ */ import_react250.default.createElement(
54013
+ visual = /* @__PURE__ */ import_react251.default.createElement(
54003
54014
  ImageComponent,
54004
54015
  {
54005
54016
  dimensions,
@@ -54009,7 +54020,7 @@ var CardHeader = (props) => {
54009
54020
  }
54010
54021
  );
54011
54022
  }
54012
- return visual ? /* @__PURE__ */ import_react250.default.createElement(
54023
+ return visual ? /* @__PURE__ */ import_react251.default.createElement(
54013
54024
  "div",
54014
54025
  {
54015
54026
  className: "str-chat__message-attachment-card--header str-chat__message-attachment-card-react--header",
@@ -54021,7 +54032,7 @@ var CardHeader = (props) => {
54021
54032
  var CardContent = (props) => {
54022
54033
  const { author_name, og_scrape_url, text: text7, title, title_link, type } = props;
54023
54034
  const url = title_link || og_scrape_url;
54024
- return /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, type === "audio" ? /* @__PURE__ */ import_react250.default.createElement(CardAudio, { og: props }) : /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--flex" }, url && /* @__PURE__ */ import_react250.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--title" }, title), text7 && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, text7)));
54035
+ return /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, type === "audio" ? /* @__PURE__ */ import_react251.default.createElement(CardAudio, { og: props }) : /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--flex" }, url && /* @__PURE__ */ import_react251.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--title" }, title), text7 && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, text7)));
54025
54036
  };
54026
54037
  var CardAudio = ({
54027
54038
  og: { asset_url, author_name, mime_type, og_scrape_url, text: text7, title, title_link }
@@ -54032,7 +54043,7 @@ var CardAudio = ({
54032
54043
  const url = title_link || og_scrape_url;
54033
54044
  const dataTestId = "card-audio-widget";
54034
54045
  const rootClassName2 = "str-chat__message-attachment-card-audio-widget";
54035
- return /* @__PURE__ */ import_react250.default.createElement("div", { className: rootClassName2, "data-testid": dataTestId }, asset_url && /* @__PURE__ */ import_react250.default.createElement(import_react250.default.Fragment, null, /* @__PURE__ */ import_react250.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react250.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: "audio/mp3" })), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card-audio-widget--first-row" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--play-controls" }, /* @__PURE__ */ import_react250.default.createElement(PlayButton, { isPlaying, onClick: togglePlay })), /* @__PURE__ */ import_react250.default.createElement(ProgressBar, { onClick: seek, progress }))), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--second-row" }, url && /* @__PURE__ */ import_react250.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--title" }, title), text7 && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--description" }, text7)));
54046
+ return /* @__PURE__ */ import_react251.default.createElement("div", { className: rootClassName2, "data-testid": dataTestId }, asset_url && /* @__PURE__ */ import_react251.default.createElement(import_react251.default.Fragment, null, /* @__PURE__ */ import_react251.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react251.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: "audio/mp3" })), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card-audio-widget--first-row" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--play-controls" }, /* @__PURE__ */ import_react251.default.createElement(PlayButton, { isPlaying, onClick: togglePlay })), /* @__PURE__ */ import_react251.default.createElement(ProgressBar, { onClick: seek, progress }))), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--second-row" }, url && /* @__PURE__ */ import_react251.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--title" }, title), text7 && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--description" }, text7)));
54036
54047
  };
54037
54048
  var UnMemoizedCard = (props) => {
54038
54049
  const { asset_url, giphy, image_url, thumb_url, title, title_link, type } = props;
@@ -54046,45 +54057,45 @@ var UnMemoizedCard = (props) => {
54046
54057
  dimensions.width = giphyVersion.width;
54047
54058
  }
54048
54059
  if (!title && !title_link && !asset_url && !image3) {
54049
- return /* @__PURE__ */ import_react250.default.createElement(UnableToRenderCard, null);
54060
+ return /* @__PURE__ */ import_react251.default.createElement(UnableToRenderCard, null);
54050
54061
  }
54051
- return /* @__PURE__ */ import_react250.default.createElement(
54062
+ return /* @__PURE__ */ import_react251.default.createElement(
54052
54063
  "div",
54053
54064
  {
54054
54065
  className: `str-chat__message-attachment-card str-chat__message-attachment-card--${type}`
54055
54066
  },
54056
- /* @__PURE__ */ import_react250.default.createElement(CardHeader, { ...props, dimensions, image: image3 }),
54057
- /* @__PURE__ */ import_react250.default.createElement(CardContent, { ...props })
54067
+ /* @__PURE__ */ import_react251.default.createElement(CardHeader, { ...props, dimensions, image: image3 }),
54068
+ /* @__PURE__ */ import_react251.default.createElement(CardContent, { ...props })
54058
54069
  );
54059
54070
  };
54060
- var Card = import_react250.default.memo(UnMemoizedCard);
54071
+ var Card = import_react251.default.memo(UnMemoizedCard);
54061
54072
 
54062
54073
  // src/components/Attachment/FileAttachment.tsx
54063
- var import_react251 = __toESM(require("react"));
54064
- var UnMemoizedFileAttachment = ({ attachment }) => /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item", "data-testid": "attachment-file" }, /* @__PURE__ */ import_react251.default.createElement(FileIcon, { className: "str-chat__file-icon", mimeType: attachment.mime_type }), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item-text" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item-first-row" }, /* @__PURE__ */ import_react251.default.createElement(
54074
+ var import_react252 = __toESM(require("react"));
54075
+ var UnMemoizedFileAttachment = ({ attachment }) => /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-file--item", "data-testid": "attachment-file" }, /* @__PURE__ */ import_react252.default.createElement(FileIcon, { className: "str-chat__file-icon", mimeType: attachment.mime_type }), /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-file--item-text" }, /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-file--item-first-row" }, /* @__PURE__ */ import_react252.default.createElement(
54065
54076
  "div",
54066
54077
  {
54067
54078
  className: "str-chat__message-attachment-file--item-name",
54068
54079
  "data-testid": "file-title"
54069
54080
  },
54070
54081
  attachment.title
54071
- ), /* @__PURE__ */ import_react251.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react251.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
54072
- var FileAttachment = import_react251.default.memo(
54082
+ ), /* @__PURE__ */ import_react252.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react252.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
54083
+ var FileAttachment = import_react252.default.memo(
54073
54084
  UnMemoizedFileAttachment
54074
54085
  );
54075
54086
 
54076
54087
  // src/components/Attachment/UnsupportedAttachment.tsx
54077
- var import_react252 = __toESM(require("react"));
54088
+ var import_react253 = __toESM(require("react"));
54078
54089
  var UnsupportedAttachment = ({ attachment }) => {
54079
54090
  const { t } = useTranslationContext("UnsupportedAttachment");
54080
- return /* @__PURE__ */ import_react252.default.createElement(
54091
+ return /* @__PURE__ */ import_react253.default.createElement(
54081
54092
  "div",
54082
54093
  {
54083
54094
  className: "str-chat__message-attachment-unsupported",
54084
54095
  "data-testid": "attachment-unsupported"
54085
54096
  },
54086
- /* @__PURE__ */ import_react252.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
54087
- /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react252.default.createElement(
54097
+ /* @__PURE__ */ import_react253.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
54098
+ /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react253.default.createElement(
54088
54099
  "div",
54089
54100
  {
54090
54101
  className: "str-chat__message-attachment-unsupported__title",
@@ -54116,7 +54127,7 @@ var AttachmentWithinContainer = ({
54116
54127
  "str-chat__message-attachment-with-actions": extra === "actions"
54117
54128
  }
54118
54129
  );
54119
- return /* @__PURE__ */ import_react253.default.createElement("div", { className: classNames }, children);
54130
+ return /* @__PURE__ */ import_react254.default.createElement("div", { className: classNames }, children);
54120
54131
  };
54121
54132
  var AttachmentActionsContainer = ({
54122
54133
  actionHandler,
@@ -54124,7 +54135,7 @@ var AttachmentActionsContainer = ({
54124
54135
  AttachmentActions: AttachmentActions2 = AttachmentActions
54125
54136
  }) => {
54126
54137
  if (!attachment.actions?.length) return null;
54127
- return /* @__PURE__ */ import_react253.default.createElement(
54138
+ return /* @__PURE__ */ import_react254.default.createElement(
54128
54139
  AttachmentActions2,
54129
54140
  {
54130
54141
  ...attachment,
@@ -54155,10 +54166,10 @@ var GalleryContainer = ({
54155
54166
  attachment,
54156
54167
  Gallery: Gallery2 = Gallery
54157
54168
  }) => {
54158
- const imageElements = (0, import_react253.useRef)([]);
54169
+ const imageElements = (0, import_react254.useRef)([]);
54159
54170
  const { imageAttachmentSizeHandler } = useChannelStateContext();
54160
- const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react253.useState)([]);
54161
- (0, import_react253.useLayoutEffect)(() => {
54171
+ const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react254.useState)([]);
54172
+ (0, import_react254.useLayoutEffect)(() => {
54162
54173
  if (imageElements.current && imageElements.current.every((element3) => !!element3) && imageAttachmentSizeHandler) {
54163
54174
  const newConfigurations = [];
54164
54175
  imageElements.current.forEach((element3, i) => {
@@ -54175,15 +54186,15 @@ var GalleryContainer = ({
54175
54186
  attachment.images[i]?.image_url || attachment.images[i]?.thumb_url || ""
54176
54187
  )
54177
54188
  }));
54178
- return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react253.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
54189
+ return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react254.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
54179
54190
  };
54180
54191
  var ImageContainer = (props) => {
54181
54192
  const { attachment, Image: Image2 = ImageComponent } = props;
54182
54193
  const componentType = "image";
54183
- const imageElement = (0, import_react253.useRef)(null);
54194
+ const imageElement = (0, import_react254.useRef)(null);
54184
54195
  const { imageAttachmentSizeHandler } = useChannelStateContext();
54185
- const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react253.useState)(void 0);
54186
- (0, import_react253.useLayoutEffect)(() => {
54196
+ const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)(void 0);
54197
+ (0, import_react254.useLayoutEffect)(() => {
54187
54198
  if (imageElement.current && imageAttachmentSizeHandler) {
54188
54199
  const config = imageAttachmentSizeHandler(attachment, imageElement.current);
54189
54200
  setAttachmentConfiguration(config);
@@ -54195,41 +54206,41 @@ var ImageContainer = (props) => {
54195
54206
  style: getCssDimensionsVariables(attachment.image_url || attachment.thumb_url || "")
54196
54207
  };
54197
54208
  if (attachment.actions && attachment.actions.length) {
54198
- return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Image2, { ...imageConfig, innerRef: imageElement }), /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props })));
54209
+ return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Image2, { ...imageConfig, innerRef: imageElement }), /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props })));
54199
54210
  }
54200
- return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement(Image2, { ...imageConfig, innerRef: imageElement }));
54211
+ return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Image2, { ...imageConfig, innerRef: imageElement }));
54201
54212
  };
54202
54213
  var CardContainer = (props) => {
54203
54214
  const { attachment, Card: Card2 = Card } = props;
54204
54215
  const componentType = "card";
54205
54216
  if (attachment.actions && attachment.actions.length) {
54206
- return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Card2, { ...attachment }), /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props })));
54217
+ return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Card2, { ...attachment }), /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props })));
54207
54218
  }
54208
- return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement(Card2, { ...attachment }));
54219
+ return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Card2, { ...attachment }));
54209
54220
  };
54210
54221
  var FileContainer = ({
54211
54222
  attachment,
54212
54223
  File: File2 = FileAttachment
54213
54224
  }) => {
54214
54225
  if (!attachment.asset_url) return null;
54215
- return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react253.default.createElement(File2, { attachment }));
54226
+ return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react254.default.createElement(File2, { attachment }));
54216
54227
  };
54217
54228
  var AudioContainer = ({
54218
54229
  attachment,
54219
54230
  Audio: Audio2 = Audio
54220
- }) => /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "audio" }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Audio2, { og: attachment })));
54231
+ }) => /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "audio" }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Audio2, { og: attachment })));
54221
54232
  var VoiceRecordingContainer = ({
54222
54233
  attachment,
54223
54234
  isQuoted,
54224
54235
  VoiceRecording: VoiceRecording2 = VoiceRecording
54225
- }) => /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "voiceRecording" }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(VoiceRecording2, { attachment, isQuoted })));
54236
+ }) => /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "voiceRecording" }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(VoiceRecording2, { attachment, isQuoted })));
54226
54237
  var MediaContainer = (props) => {
54227
54238
  const { attachment, Media = import_react_player2.default } = props;
54228
54239
  const componentType = "media";
54229
54240
  const { shouldGenerateVideoThumbnail, videoAttachmentSizeHandler } = useChannelStateContext();
54230
- const videoElement = (0, import_react253.useRef)(null);
54231
- const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react253.useState)();
54232
- (0, import_react253.useLayoutEffect)(() => {
54241
+ const videoElement = (0, import_react254.useRef)(null);
54242
+ const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)();
54243
+ (0, import_react254.useLayoutEffect)(() => {
54233
54244
  if (videoElement.current && videoAttachmentSizeHandler) {
54234
54245
  const config = videoAttachmentSizeHandler(
54235
54246
  attachment,
@@ -54239,7 +54250,7 @@ var MediaContainer = (props) => {
54239
54250
  setAttachmentConfiguration(config);
54240
54251
  }
54241
54252
  }, [videoElement, videoAttachmentSizeHandler, attachment]);
54242
- const content3 = /* @__PURE__ */ import_react253.default.createElement(
54253
+ const content3 = /* @__PURE__ */ import_react254.default.createElement(
54243
54254
  "div",
54244
54255
  {
54245
54256
  className: "str-chat__player-wrapper",
@@ -54247,7 +54258,7 @@ var MediaContainer = (props) => {
54247
54258
  ref: videoElement,
54248
54259
  style: getCssDimensionsVariables(attachment.thumb_url || "")
54249
54260
  },
54250
- /* @__PURE__ */ import_react253.default.createElement(
54261
+ /* @__PURE__ */ import_react254.default.createElement(
54251
54262
  Media,
54252
54263
  {
54253
54264
  className: "react-player",
@@ -54259,12 +54270,12 @@ var MediaContainer = (props) => {
54259
54270
  }
54260
54271
  )
54261
54272
  );
54262
- return attachment.actions?.length ? /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, content3, /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props }))) : /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, content3);
54273
+ return attachment.actions?.length ? /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, content3, /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props }))) : /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, content3);
54263
54274
  };
54264
54275
  var UnsupportedAttachmentContainer = ({
54265
54276
  attachment,
54266
54277
  UnsupportedAttachment: UnsupportedAttachment2 = UnsupportedAttachment
54267
- }) => /* @__PURE__ */ import_react253.default.createElement(import_react253.default.Fragment, null, /* @__PURE__ */ import_react253.default.createElement(UnsupportedAttachment2, { attachment }));
54278
+ }) => /* @__PURE__ */ import_react254.default.createElement(import_react254.default.Fragment, null, /* @__PURE__ */ import_react254.default.createElement(UnsupportedAttachment2, { attachment }));
54268
54279
 
54269
54280
  // src/components/Attachment/Attachment.tsx
54270
54281
  var CONTAINER_MAP = {
@@ -54287,12 +54298,12 @@ var ATTACHMENT_GROUPS_ORDER = [
54287
54298
  ];
54288
54299
  var Attachment = (props) => {
54289
54300
  const { attachments } = props;
54290
- const groupedAttachments = (0, import_react254.useMemo)(
54301
+ const groupedAttachments = (0, import_react255.useMemo)(
54291
54302
  () => renderGroupedAttachments(props),
54292
54303
  // eslint-disable-next-line react-hooks/exhaustive-deps
54293
54304
  [attachments]
54294
54305
  );
54295
- return /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
54306
+ return /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
54296
54307
  (acc, groupName) => [...acc, ...groupedAttachments[groupName]],
54297
54308
  []
54298
54309
  ));
@@ -54309,7 +54320,7 @@ var renderGroupedAttachments = ({
54309
54320
  const attachmentType = getAttachmentType(attachment);
54310
54321
  const Container = CONTAINER_MAP[attachmentType];
54311
54322
  typeMap[attachmentType].push(
54312
- /* @__PURE__ */ import_react254.default.createElement(
54323
+ /* @__PURE__ */ import_react255.default.createElement(
54313
54324
  Container,
54314
54325
  {
54315
54326
  key: `${attachmentType}-${typeMap[attachmentType].length}`,
@@ -54336,7 +54347,7 @@ var renderGroupedAttachments = ({
54336
54347
  );
54337
54348
  if (uploadedImages.length > 1) {
54338
54349
  containers["gallery"] = [
54339
- /* @__PURE__ */ import_react254.default.createElement(
54350
+ /* @__PURE__ */ import_react255.default.createElement(
54340
54351
  GalleryContainer,
54341
54352
  {
54342
54353
  key: "gallery-container",
@@ -54350,7 +54361,7 @@ var renderGroupedAttachments = ({
54350
54361
  ];
54351
54362
  } else if (uploadedImages.length === 1) {
54352
54363
  containers["image"] = [
54353
- /* @__PURE__ */ import_react254.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
54364
+ /* @__PURE__ */ import_react255.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
54354
54365
  ];
54355
54366
  }
54356
54367
  return containers;
@@ -54371,7 +54382,7 @@ var getAttachmentType = (attachment) => {
54371
54382
  };
54372
54383
 
54373
54384
  // src/components/Channel/Channel.tsx
54374
- var import_react260 = __toESM(require("react"));
54385
+ var import_react261 = __toESM(require("react"));
54375
54386
  var import_clsx66 = __toESM(require("clsx"));
54376
54387
  var import_lodash20 = __toESM(require("lodash.debounce"));
54377
54388
  var import_lodash21 = __toESM(require("lodash.defaultsdeep"));
@@ -54552,7 +54563,7 @@ var initialState = {
54552
54563
  };
54553
54564
 
54554
54565
  // src/components/Channel/hooks/useCreateChannelStateContext.ts
54555
- var import_react255 = require("react");
54566
+ var import_react256 = require("react");
54556
54567
  var useCreateChannelStateContext = (value) => {
54557
54568
  const {
54558
54569
  channel,
@@ -54611,7 +54622,7 @@ var useCreateChannelStateContext = (value) => {
54611
54622
  const memoizedThreadMessageData = threadMessages.map(
54612
54623
  ({ deleted_at, latest_reactions, pinned, status, updated_at, user }) => `${deleted_at}${latest_reactions ? latest_reactions.map(({ type }) => type).join() : ""}${pinned}${status}${updated_at && (isDayOrMoment(updated_at) || isDate(updated_at)) ? updated_at.toISOString() : updated_at || ""}${user?.updated_at}`
54613
54624
  ).join();
54614
- const channelStateContext = (0, import_react255.useMemo)(
54625
+ const channelStateContext = (0, import_react256.useMemo)(
54615
54626
  () => ({
54616
54627
  channel,
54617
54628
  channelCapabilities,
@@ -54675,11 +54686,11 @@ var useCreateChannelStateContext = (value) => {
54675
54686
  };
54676
54687
 
54677
54688
  // src/components/Channel/hooks/useCreateTypingContext.ts
54678
- var import_react256 = require("react");
54689
+ var import_react257 = require("react");
54679
54690
  var useCreateTypingContext = (value) => {
54680
54691
  const { typing } = value;
54681
54692
  const typingValue = Object.keys(typing || {}).join();
54682
- const typingContext = (0, import_react256.useMemo)(
54693
+ const typingContext = (0, import_react257.useMemo)(
54683
54694
  () => ({
54684
54695
  typing
54685
54696
  }),
@@ -54703,10 +54714,10 @@ var useEditMessageHandler = (doUpdateMessageRequest) => {
54703
54714
  };
54704
54715
 
54705
54716
  // src/components/Channel/hooks/useIsMounted.ts
54706
- var import_react257 = require("react");
54717
+ var import_react258 = require("react");
54707
54718
  var useIsMounted = () => {
54708
- const isMounted = (0, import_react257.useRef)(false);
54709
- (0, import_react257.useEffect)(() => {
54719
+ const isMounted = (0, import_react258.useRef)(false);
54720
+ (0, import_react258.useEffect)(() => {
54710
54721
  isMounted.current = true;
54711
54722
  return () => {
54712
54723
  isMounted.current = false;
@@ -54716,8 +54727,8 @@ var useIsMounted = () => {
54716
54727
  };
54717
54728
 
54718
54729
  // src/components/Channel/hooks/useMentionsHandlers.ts
54719
- var import_react258 = require("react");
54720
- var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react258.useCallback)(
54730
+ var import_react259 = require("react");
54731
+ var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react259.useCallback)(
54721
54732
  (event, mentioned_users) => {
54722
54733
  if (!onMentionsHover && !onMentionsClick || !(event.target instanceof HTMLElement)) {
54723
54734
  return;
@@ -54741,11 +54752,11 @@ var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react
54741
54752
  );
54742
54753
 
54743
54754
  // src/components/Channel/LoadingChannel.tsx
54744
- var import_react259 = __toESM(require("react"));
54745
- var LoadingMessage = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-avatar" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-end" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-sender" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-last-row" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-text" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-date" }))));
54746
- var LoadingMessageInput = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-input-row" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-input" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-send" }));
54747
- var LoadingChannelHeader = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-avatar" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-end" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-name" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-info" })));
54748
- var LoadingChannel = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel" }, /* @__PURE__ */ import_react259.default.createElement(LoadingChannelHeader, null), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-list" }, Array.from(Array(3)).map((_, i) => /* @__PURE__ */ import_react259.default.createElement(LoadingMessage, { key: `loading-message-${i}` }))), /* @__PURE__ */ import_react259.default.createElement(LoadingMessageInput, null));
54755
+ var import_react260 = __toESM(require("react"));
54756
+ var LoadingMessage = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-avatar" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-end" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-sender" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-last-row" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-text" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-date" }))));
54757
+ var LoadingMessageInput = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-input-row" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-input" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-send" }));
54758
+ var LoadingChannelHeader = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-avatar" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-end" }, /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-name" }), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-header-info" })));
54759
+ var LoadingChannel = () => /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel" }, /* @__PURE__ */ import_react260.default.createElement(LoadingChannelHeader, null), /* @__PURE__ */ import_react260.default.createElement("div", { className: "str-chat__loading-channel-message-list" }, Array.from(Array(3)).map((_, i) => /* @__PURE__ */ import_react260.default.createElement(LoadingMessage, { key: `loading-message-${i}` }))), /* @__PURE__ */ import_react260.default.createElement(LoadingMessageInput, null));
54749
54760
 
54750
54761
  // src/components/Channel/hooks/useChannelContainerClasses.ts
54751
54762
  var useImageFlagEmojisOnWindowsClass = () => {
@@ -54766,12 +54777,12 @@ var useChannelContainerClasses = ({
54766
54777
  };
54767
54778
 
54768
54779
  // src/components/Channel/utils.ts
54769
- var import_nanoid6 = require("nanoid");
54780
+ var import_nanoid7 = require("nanoid");
54770
54781
  var makeAddNotifications = (setNotifications, notificationTimeouts) => (text7, type) => {
54771
54782
  if (typeof text7 !== "string" || type !== "success" && type !== "error") {
54772
54783
  return;
54773
54784
  }
54774
- const id = (0, import_nanoid6.nanoid)();
54785
+ const id = (0, import_nanoid7.nanoid)();
54775
54786
  setNotifications((prevNotifications) => [...prevNotifications, { id, text: text7, type }]);
54776
54787
  const timeout = setTimeout(
54777
54788
  () => setNotifications(
@@ -54932,7 +54943,7 @@ var ChannelContainer = ({
54932
54943
  customClasses
54933
54944
  });
54934
54945
  const className = (0, import_clsx66.default)(chatClass, theme, channelClass, additionalClassName);
54935
- return /* @__PURE__ */ import_react260.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
54946
+ return /* @__PURE__ */ import_react261.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
54936
54947
  };
54937
54948
  var UnMemoizedChannel = (props) => {
54938
54949
  const {
@@ -54944,15 +54955,15 @@ var UnMemoizedChannel = (props) => {
54944
54955
  const { channel: contextChannel, channelsQueryState } = useChatContext("Channel");
54945
54956
  const channel = propsChannel || contextChannel;
54946
54957
  if (channelsQueryState.queryInProgress === "reload" && LoadingIndicator2) {
54947
- return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingIndicator2, null));
54958
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
54948
54959
  }
54949
54960
  if (channelsQueryState.error && LoadingErrorIndicator2) {
54950
- return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
54961
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
54951
54962
  }
54952
54963
  if (!channel?.cid) {
54953
- return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
54964
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
54954
54965
  }
54955
- return /* @__PURE__ */ import_react260.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
54966
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
54956
54967
  };
54957
54968
  var ChannelInner = (props) => {
54958
54969
  const {
@@ -54972,7 +54983,7 @@ var ChannelInner = (props) => {
54972
54983
  onMentionsHover,
54973
54984
  skipMessageDataMemoization
54974
54985
  } = props;
54975
- const channelQueryOptions = (0, import_react260.useMemo)(
54986
+ const channelQueryOptions = (0, import_react261.useMemo)(
54976
54987
  () => (0, import_lodash21.default)(propChannelQueryOptions, {
54977
54988
  messages: { limit: DEFAULT_INITIAL_CHANNEL_PAGE_SIZE }
54978
54989
  }),
@@ -54983,12 +54994,12 @@ var ChannelInner = (props) => {
54983
54994
  const chatContainerClass = getChatContainerClass(customClasses?.chatContainer);
54984
54995
  const windowsEmojiClass = useImageFlagEmojisOnWindowsClass();
54985
54996
  const thread = useThreadContext();
54986
- const [channelConfig, setChannelConfig] = (0, import_react260.useState)(channel.getConfig());
54987
- const [notifications, setNotifications] = (0, import_react260.useState)([]);
54988
- const notificationTimeouts = (0, import_react260.useRef)([]);
54989
- const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react260.useState)();
54990
- const channelReducer = (0, import_react260.useMemo)(() => makeChannelReducer(), []);
54991
- const [state, dispatch] = (0, import_react260.useReducer)(
54997
+ const [channelConfig, setChannelConfig] = (0, import_react261.useState)(channel.getConfig());
54998
+ const [notifications, setNotifications] = (0, import_react261.useState)([]);
54999
+ const notificationTimeouts = (0, import_react261.useRef)([]);
55000
+ const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react261.useState)();
55001
+ const channelReducer = (0, import_react261.useMemo)(() => makeChannelReducer(), []);
55002
+ const [state, dispatch] = (0, import_react261.useReducer)(
54992
55003
  channelReducer,
54993
55004
  // channel.initialized === false if client.channel().query() was not called, e.g. ChannelList is not used
54994
55005
  // => Channel will call channel.watch() in useLayoutEffect => state.loading is used to signal the watch() call state
@@ -55000,10 +55011,10 @@ var ChannelInner = (props) => {
55000
55011
  );
55001
55012
  const jumpToMessageFromSearch = useSearchFocusedMessage();
55002
55013
  const isMounted = useIsMounted();
55003
- const originalTitle = (0, import_react260.useRef)("");
55004
- const lastRead = (0, import_react260.useRef)(void 0);
55005
- const online = (0, import_react260.useRef)(true);
55006
- const clearHighlightedMessageTimeoutId = (0, import_react260.useRef)(
55014
+ const originalTitle = (0, import_react261.useRef)("");
55015
+ const lastRead = (0, import_react261.useRef)(void 0);
55016
+ const online = (0, import_react261.useRef)(true);
55017
+ const clearHighlightedMessageTimeoutId = (0, import_react261.useRef)(
55007
55018
  null
55008
55019
  );
55009
55020
  const channelCapabilitiesArray = channel.data?.own_capabilities;
@@ -55015,14 +55026,14 @@ var ChannelInner = (props) => {
55015
55026
  trailing: true
55016
55027
  }
55017
55028
  );
55018
- const setChannelUnreadUiState = (0, import_react260.useMemo)(
55029
+ const setChannelUnreadUiState = (0, import_react261.useMemo)(
55019
55030
  () => (0, import_lodash22.default)(_setChannelUnreadUiState, 200, {
55020
55031
  leading: true,
55021
55032
  trailing: false
55022
55033
  }),
55023
55034
  []
55024
55035
  );
55025
- const markRead = (0, import_react260.useMemo)(
55036
+ const markRead = (0, import_react261.useMemo)(
55026
55037
  () => (0, import_lodash22.default)(
55027
55038
  async (options) => {
55028
55039
  const { updateChannelUiUnreadState = true } = options ?? {};
@@ -55125,7 +55136,7 @@ var ChannelInner = (props) => {
55125
55136
  }
55126
55137
  throttledCopyStateFromChannel();
55127
55138
  };
55128
- (0, import_react260.useLayoutEffect)(() => {
55139
+ (0, import_react261.useLayoutEffect)(() => {
55129
55140
  let errored = false;
55130
55141
  let done = false;
55131
55142
  (async () => {
@@ -55191,12 +55202,12 @@ var ChannelInner = (props) => {
55191
55202
  channelConfig?.read_events,
55192
55203
  initializeOnMount
55193
55204
  ]);
55194
- (0, import_react260.useEffect)(() => {
55205
+ (0, import_react261.useEffect)(() => {
55195
55206
  if (!state.thread) return;
55196
55207
  const message = state.messages?.find((m) => m.id === state.thread?.id);
55197
55208
  if (message) dispatch({ message, type: "setThread" });
55198
55209
  }, [state.messages, state.thread]);
55199
- const handleHighlightedMessageChange = (0, import_react260.useCallback)(
55210
+ const handleHighlightedMessageChange = (0, import_react261.useCallback)(
55200
55211
  ({
55201
55212
  highlightDuration,
55202
55213
  highlightedMessageId
@@ -55219,15 +55230,15 @@ var ChannelInner = (props) => {
55219
55230
  },
55220
55231
  [channel, searchController]
55221
55232
  );
55222
- (0, import_react260.useEffect)(() => {
55233
+ (0, import_react261.useEffect)(() => {
55223
55234
  if (!jumpToMessageFromSearch?.id) return;
55224
55235
  handleHighlightedMessageChange({ highlightedMessageId: jumpToMessageFromSearch.id });
55225
55236
  }, [jumpToMessageFromSearch, handleHighlightedMessageChange]);
55226
- const addNotification = (0, import_react260.useMemo)(
55237
+ const addNotification = (0, import_react261.useMemo)(
55227
55238
  () => makeAddNotifications(setNotifications, notificationTimeouts.current),
55228
55239
  []
55229
55240
  );
55230
- const loadMoreFinished = (0, import_react260.useCallback)(
55241
+ const loadMoreFinished = (0, import_react261.useCallback)(
55231
55242
  (0, import_lodash20.default)(
55232
55243
  (hasMore, messages) => {
55233
55244
  if (!isMounted.current) return;
@@ -55288,7 +55299,7 @@ var ChannelInner = (props) => {
55288
55299
  });
55289
55300
  return queryResponse.messages.length;
55290
55301
  };
55291
- const jumpToMessage = (0, import_react260.useCallback)(
55302
+ const jumpToMessage = (0, import_react261.useCallback)(
55292
55303
  async (messageId, messageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
55293
55304
  dispatch({ loadingMore: true, type: "setLoadingMore" });
55294
55305
  await channel.state.loadMessageIntoState(messageId, void 0, messageLimit);
@@ -55300,14 +55311,14 @@ var ChannelInner = (props) => {
55300
55311
  },
55301
55312
  [channel, handleHighlightedMessageChange, loadMoreFinished]
55302
55313
  );
55303
- const jumpToLatestMessage = (0, import_react260.useCallback)(async () => {
55314
+ const jumpToLatestMessage = (0, import_react261.useCallback)(async () => {
55304
55315
  await channel.state.loadMessageIntoState("latest");
55305
55316
  loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
55306
55317
  dispatch({
55307
55318
  type: "jumpToLatestMessage"
55308
55319
  });
55309
55320
  }, [channel, loadMoreFinished]);
55310
- const jumpToFirstUnreadMessage = (0, import_react260.useCallback)(
55321
+ const jumpToFirstUnreadMessage = (0, import_react261.useCallback)(
55311
55322
  async (queryMessageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
55312
55323
  if (!channelUnreadUiState?.unread_messages) return;
55313
55324
  let lastReadMessageId = channelUnreadUiState?.last_read_message_id;
@@ -55430,7 +55441,7 @@ var ChannelInner = (props) => {
55430
55441
  channelUnreadUiState
55431
55442
  ]
55432
55443
  );
55433
- const deleteMessage = (0, import_react260.useCallback)(
55444
+ const deleteMessage = (0, import_react261.useCallback)(
55434
55445
  async (message) => {
55435
55446
  if (!message?.id) {
55436
55447
  throw new Error("Cannot delete a message - missing message ID.");
@@ -55548,7 +55559,7 @@ var ChannelInner = (props) => {
55548
55559
  event?.preventDefault();
55549
55560
  dispatch({ type: "closeThread" });
55550
55561
  };
55551
- const loadMoreThreadFinished = (0, import_react260.useCallback)(
55562
+ const loadMoreThreadFinished = (0, import_react261.useCallback)(
55552
55563
  (0, import_lodash20.default)(
55553
55564
  (threadHasMore, threadMessages) => {
55554
55565
  dispatch({
@@ -55603,7 +55614,7 @@ var ChannelInner = (props) => {
55603
55614
  videoAttachmentSizeHandler: props.videoAttachmentSizeHandler || getVideoAttachmentConfiguration,
55604
55615
  watcher_count: state.watcherCount
55605
55616
  });
55606
- const channelActionContextValue = (0, import_react260.useMemo)(
55617
+ const channelActionContextValue = (0, import_react261.useMemo)(
55607
55618
  () => ({
55608
55619
  addNotification,
55609
55620
  closeThread,
@@ -55640,7 +55651,7 @@ var ChannelInner = (props) => {
55640
55651
  setChannelUnreadUiState
55641
55652
  ]
55642
55653
  );
55643
- const componentContextValue = (0, import_react260.useMemo)(
55654
+ const componentContextValue = (0, import_react261.useMemo)(
55644
55655
  () => ({
55645
55656
  Attachment: props.Attachment,
55646
55657
  AttachmentPreviewList: props.AttachmentPreviewList,
@@ -55772,26 +55783,26 @@ var ChannelInner = (props) => {
55772
55783
  typing
55773
55784
  });
55774
55785
  if (state.error) {
55775
- return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingErrorIndicator2, { error: state.error }));
55786
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: state.error }));
55776
55787
  }
55777
55788
  if (state.loading) {
55778
- return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingIndicator2, null));
55789
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
55779
55790
  }
55780
55791
  if (!channel.watch) {
55781
- return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement("div", null, t("Channel Missing")));
55792
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement("div", null, t("Channel Missing")));
55782
55793
  }
55783
- return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, { className: windowsEmojiClass }, /* @__PURE__ */ import_react260.default.createElement(ChannelStateProvider, { value: channelStateContextValue }, /* @__PURE__ */ import_react260.default.createElement(ChannelActionProvider, { value: channelActionContextValue }, /* @__PURE__ */ import_react260.default.createElement(WithComponents, { overrides: componentContextValue }, /* @__PURE__ */ import_react260.default.createElement(TypingProvider, { value: typingContextValue }, /* @__PURE__ */ import_react260.default.createElement("div", { className: (0, import_clsx66.default)(chatContainerClass) }, children))))));
55794
+ return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, { className: windowsEmojiClass }, /* @__PURE__ */ import_react261.default.createElement(ChannelStateProvider, { value: channelStateContextValue }, /* @__PURE__ */ import_react261.default.createElement(ChannelActionProvider, { value: channelActionContextValue }, /* @__PURE__ */ import_react261.default.createElement(WithComponents, { overrides: componentContextValue }, /* @__PURE__ */ import_react261.default.createElement(TypingProvider, { value: typingContextValue }, /* @__PURE__ */ import_react261.default.createElement("div", { className: (0, import_clsx66.default)(chatContainerClass) }, children))))));
55784
55795
  };
55785
- var Channel = import_react260.default.memo(UnMemoizedChannel);
55796
+ var Channel = import_react261.default.memo(UnMemoizedChannel);
55786
55797
 
55787
55798
  // src/components/ChannelHeader/ChannelHeader.tsx
55788
- var import_react262 = __toESM(require("react"));
55799
+ var import_react263 = __toESM(require("react"));
55789
55800
 
55790
55801
  // src/components/ChannelHeader/icons.tsx
55791
- var import_react261 = __toESM(require("react"));
55802
+ var import_react262 = __toESM(require("react"));
55792
55803
  var MenuIcon2 = ({ title }) => {
55793
55804
  const { t } = useTranslationContext("MenuIcon");
55794
- return /* @__PURE__ */ import_react261.default.createElement("svg", { "data-testid": "menu-icon", viewBox: "0 0 448 512", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react261.default.createElement("title", null, title ?? t("Menu")), /* @__PURE__ */ import_react261.default.createElement(
55805
+ return /* @__PURE__ */ import_react262.default.createElement("svg", { "data-testid": "menu-icon", viewBox: "0 0 448 512", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react262.default.createElement("title", null, title ?? t("Menu")), /* @__PURE__ */ import_react262.default.createElement(
55795
55806
  "path",
55796
55807
  {
55797
55808
  d: "M0 88C0 74.75 10.75 64 24 64H424C437.3 64 448 74.75 448 88C448 101.3 437.3 112 424 112H24C10.75 112 0 101.3 0 88zM0 248C0 234.7 10.75 224 24 224H424C437.3 224 448 234.7 448 248C448 261.3 437.3 272 424 272H24C10.75 272 0 261.3 0 248zM424 432H24C10.75 432 0 421.3 0 408C0 394.7 10.75 384 24 384H424C437.3 384 448 394.7 448 408C448 421.3 437.3 432 424 432z",
@@ -55818,15 +55829,15 @@ var ChannelHeader = (props) => {
55818
55829
  overrideTitle
55819
55830
  });
55820
55831
  const { member_count, subtitle } = channel?.data || {};
55821
- return /* @__PURE__ */ import_react262.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react262.default.createElement(
55832
+ return /* @__PURE__ */ import_react263.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react263.default.createElement(
55822
55833
  "button",
55823
55834
  {
55824
55835
  "aria-label": t("aria/Menu"),
55825
55836
  className: "str-chat__header-hamburger",
55826
55837
  onClick: openMobileNav
55827
55838
  },
55828
- /* @__PURE__ */ import_react262.default.createElement(MenuIcon3, null)
55829
- ), /* @__PURE__ */ import_react262.default.createElement(
55839
+ /* @__PURE__ */ import_react263.default.createElement(MenuIcon3, null)
55840
+ ), /* @__PURE__ */ import_react263.default.createElement(
55830
55841
  Avatar2,
55831
55842
  {
55832
55843
  className: "str-chat__avatar--channel-header",
@@ -55834,36 +55845,36 @@ var ChannelHeader = (props) => {
55834
55845
  image: displayImage,
55835
55846
  name: displayTitle
55836
55847
  }
55837
- ), /* @__PURE__ */ import_react262.default.createElement("div", { className: "str-chat__channel-header-end" }, /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-title" }, displayTitle, " ", live && /* @__PURE__ */ import_react262.default.createElement("span", { className: "str-chat__header-livestream-livelabel" }, t("live"))), subtitle && /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-subtitle" }, subtitle), /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-info" }, !live && !!member_count && member_count > 0 && /* @__PURE__ */ import_react262.default.createElement(import_react262.default.Fragment, null, t("{{ memberCount }} members", {
55848
+ ), /* @__PURE__ */ import_react263.default.createElement("div", { className: "str-chat__channel-header-end" }, /* @__PURE__ */ import_react263.default.createElement("p", { className: "str-chat__channel-header-title" }, displayTitle, " ", live && /* @__PURE__ */ import_react263.default.createElement("span", { className: "str-chat__header-livestream-livelabel" }, t("live"))), subtitle && /* @__PURE__ */ import_react263.default.createElement("p", { className: "str-chat__channel-header-subtitle" }, subtitle), /* @__PURE__ */ import_react263.default.createElement("p", { className: "str-chat__channel-header-info" }, !live && !!member_count && member_count > 0 && /* @__PURE__ */ import_react263.default.createElement(import_react263.default.Fragment, null, t("{{ memberCount }} members", {
55838
55849
  memberCount: member_count
55839
55850
  }), ",", " "), t("{{ watcherCount }} online", { watcherCount: watcher_count }))));
55840
55851
  };
55841
55852
 
55842
55853
  // src/components/Chat/Chat.tsx
55843
- var import_react266 = __toESM(require("react"));
55854
+ var import_react267 = __toESM(require("react"));
55844
55855
  var import_stream_chat13 = require("stream-chat");
55845
55856
 
55846
55857
  // src/components/Chat/hooks/useChat.ts
55847
- var import_react263 = require("react");
55858
+ var import_react264 = require("react");
55848
55859
  var useChat = ({
55849
55860
  client,
55850
55861
  defaultLanguage = "en",
55851
55862
  i18nInstance,
55852
55863
  initialNavOpen
55853
55864
  }) => {
55854
- const [translators, setTranslators] = (0, import_react263.useState)({
55865
+ const [translators, setTranslators] = (0, import_react264.useState)({
55855
55866
  t: (key) => key,
55856
55867
  tDateTimeParser: defaultDateTimeParser,
55857
55868
  userLanguage: "en"
55858
55869
  });
55859
- const [channel, setChannel] = (0, import_react263.useState)();
55860
- const [mutes, setMutes] = (0, import_react263.useState)([]);
55861
- const [navOpen, setNavOpen] = (0, import_react263.useState)(initialNavOpen);
55862
- const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react263.useState)({});
55870
+ const [channel, setChannel] = (0, import_react264.useState)();
55871
+ const [mutes, setMutes] = (0, import_react264.useState)([]);
55872
+ const [navOpen, setNavOpen] = (0, import_react264.useState)(initialNavOpen);
55873
+ const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react264.useState)({});
55863
55874
  const clientMutes = client.user?.mutes ?? [];
55864
55875
  const closeMobileNav = () => setNavOpen(false);
55865
55876
  const openMobileNav = () => setTimeout(() => setNavOpen(true), 100);
55866
- const appSettings = (0, import_react263.useRef)(null);
55877
+ const appSettings = (0, import_react264.useRef)(null);
55867
55878
  const getAppSettings = () => {
55868
55879
  if (appSettings.current) {
55869
55880
  return appSettings.current;
@@ -55871,9 +55882,9 @@ var useChat = ({
55871
55882
  appSettings.current = client.getAppSettings();
55872
55883
  return appSettings.current;
55873
55884
  };
55874
- (0, import_react263.useEffect)(() => {
55885
+ (0, import_react264.useEffect)(() => {
55875
55886
  if (!client) return;
55876
- const version = "13.0.3";
55887
+ const version = "13.0.5";
55877
55888
  const userAgent = client.getUserAgent();
55878
55889
  if (!userAgent.includes("stream-chat-react")) {
55879
55890
  client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
@@ -55885,7 +55896,7 @@ var useChat = ({
55885
55896
  client.polls.unregisterSubscriptions();
55886
55897
  };
55887
55898
  }, [client]);
55888
- (0, import_react263.useEffect)(() => {
55899
+ (0, import_react264.useEffect)(() => {
55889
55900
  setMutes(clientMutes);
55890
55901
  const handleEvent = (event) => {
55891
55902
  setMutes(event.me?.mutes || []);
@@ -55893,7 +55904,7 @@ var useChat = ({
55893
55904
  client.on("notification.mutes_updated", handleEvent);
55894
55905
  return () => client.off("notification.mutes_updated", handleEvent);
55895
55906
  }, [clientMutes?.length]);
55896
- (0, import_react263.useEffect)(() => {
55907
+ (0, import_react264.useEffect)(() => {
55897
55908
  let userLanguage = client.user?.language;
55898
55909
  if (!userLanguage) {
55899
55910
  const browserLanguage = window.navigator.language.slice(0, 2);
@@ -55910,7 +55921,7 @@ var useChat = ({
55910
55921
  });
55911
55922
  });
55912
55923
  }, [i18nInstance]);
55913
- const setActiveChannel = (0, import_react263.useCallback)(
55924
+ const setActiveChannel = (0, import_react264.useCallback)(
55914
55925
  async (activeChannel, watchers = {}, event) => {
55915
55926
  if (event && event.preventDefault) event.preventDefault();
55916
55927
  if (activeChannel && Object.keys(watchers).length) {
@@ -55921,7 +55932,7 @@ var useChat = ({
55921
55932
  },
55922
55933
  []
55923
55934
  );
55924
- (0, import_react263.useEffect)(() => {
55935
+ (0, import_react264.useEffect)(() => {
55925
55936
  setLatestMessageDatesByChannels({});
55926
55937
  }, [client.user?.id]);
55927
55938
  return {
@@ -55938,7 +55949,7 @@ var useChat = ({
55938
55949
  };
55939
55950
 
55940
55951
  // src/components/Chat/hooks/useCreateChatContext.ts
55941
- var import_react264 = require("react");
55952
+ var import_react265 = require("react");
55942
55953
  var useCreateChatContext = (value) => {
55943
55954
  const {
55944
55955
  channel,
@@ -55963,7 +55974,7 @@ var useCreateChatContext = (value) => {
55963
55974
  const clientValues = `${client.clientID}${Object.keys(client.activeChannels).length}${Object.keys(client.listeners).length}${client.mutedChannels.length}
55964
55975
  ${client.user?.id}`;
55965
55976
  const mutedUsersLength = mutes.length;
55966
- const chatContext = (0, import_react264.useMemo)(
55977
+ const chatContext = (0, import_react265.useMemo)(
55967
55978
  () => ({
55968
55979
  channel,
55969
55980
  channelsQueryState,
@@ -55998,10 +56009,10 @@ var useCreateChatContext = (value) => {
55998
56009
  };
55999
56010
 
56000
56011
  // src/components/Chat/hooks/useChannelsQueryState.ts
56001
- var import_react265 = require("react");
56012
+ var import_react266 = require("react");
56002
56013
  var useChannelsQueryState = () => {
56003
- const [error, setError] = (0, import_react265.useState)(null);
56004
- const [queryInProgress, setQueryInProgress] = (0, import_react265.useState)("uninitialized");
56014
+ const [error, setError] = (0, import_react266.useState)(null);
56015
+ const [queryInProgress, setQueryInProgress] = (0, import_react266.useState)("uninitialized");
56005
56016
  return {
56006
56017
  error,
56007
56018
  queryInProgress,
@@ -56036,7 +56047,7 @@ var Chat = (props) => {
56036
56047
  translators
56037
56048
  } = useChat({ client, defaultLanguage, i18nInstance, initialNavOpen });
56038
56049
  const channelsQueryState = useChannelsQueryState();
56039
- const searchController = (0, import_react266.useMemo)(
56050
+ const searchController = (0, import_react267.useMemo)(
56040
56051
  () => customChannelSearchController ?? new import_stream_chat13.SearchController({
56041
56052
  sources: [
56042
56053
  new import_stream_chat13.ChannelSearchSource(client),
@@ -56064,11 +56075,11 @@ var Chat = (props) => {
56064
56075
  useImageFlagEmojisOnWindows
56065
56076
  });
56066
56077
  if (!translators.t) return null;
56067
- return /* @__PURE__ */ import_react266.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react266.default.createElement(TranslationProvider, { value: translators }, children));
56078
+ return /* @__PURE__ */ import_react267.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react267.default.createElement(TranslationProvider, { value: translators }, children));
56068
56079
  };
56069
56080
 
56070
56081
  // src/components/Chat/hooks/useCreateChatClient.ts
56071
- var import_react267 = require("react");
56082
+ var import_react268 = require("react");
56072
56083
  var import_stream_chat14 = require("stream-chat");
56073
56084
  var useCreateChatClient = ({
56074
56085
  apiKey,
@@ -56076,13 +56087,13 @@ var useCreateChatClient = ({
56076
56087
  tokenOrProvider,
56077
56088
  userData
56078
56089
  }) => {
56079
- const [chatClient, setChatClient] = (0, import_react267.useState)(null);
56080
- const [cachedUserData, setCachedUserData] = (0, import_react267.useState)(userData);
56090
+ const [chatClient, setChatClient] = (0, import_react268.useState)(null);
56091
+ const [cachedUserData, setCachedUserData] = (0, import_react268.useState)(userData);
56081
56092
  if (userData.id !== cachedUserData.id) {
56082
56093
  setCachedUserData(userData);
56083
56094
  }
56084
- const [cachedOptions] = (0, import_react267.useState)(options);
56085
- (0, import_react267.useEffect)(() => {
56095
+ const [cachedOptions] = (0, import_react268.useState)(options);
56096
+ (0, import_react268.useEffect)(() => {
56086
56097
  const client = new import_stream_chat14.StreamChat(apiKey, void 0, cachedOptions);
56087
56098
  let didUserConnectInterrupt = false;
56088
56099
  const connectionPromise = client.connectUser(cachedUserData, tokenOrProvider).then(() => {
@@ -56100,12 +56111,12 @@ var useCreateChatClient = ({
56100
56111
  };
56101
56112
 
56102
56113
  // src/components/Window/Window.tsx
56103
- var import_react268 = __toESM(require("react"));
56114
+ var import_react269 = __toESM(require("react"));
56104
56115
  var import_clsx67 = __toESM(require("clsx"));
56105
56116
  var UnMemoizedWindow = (props) => {
56106
56117
  const { children, thread: propThread } = props;
56107
56118
  const { thread: contextThread } = useChannelStateContext("Window");
56108
- return /* @__PURE__ */ import_react268.default.createElement(
56119
+ return /* @__PURE__ */ import_react269.default.createElement(
56109
56120
  "div",
56110
56121
  {
56111
56122
  className: (0, import_clsx67.default)("str-chat__main-panel", {
@@ -56115,7 +56126,7 @@ var UnMemoizedWindow = (props) => {
56115
56126
  children
56116
56127
  );
56117
56128
  };
56118
- var Window = import_react268.default.memo(UnMemoizedWindow);
56129
+ var Window = import_react269.default.memo(UnMemoizedWindow);
56119
56130
  // Annotate the CommonJS export names for ESM import in node:
56120
56131
  0 && (module.exports = {
56121
56132
  ACTIONS_NOT_WORKING_IN_THREAD,