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.
@@ -17667,11 +17667,11 @@ __export(src_exports, {
17667
17667
  module.exports = __toCommonJS(src_exports);
17668
17668
 
17669
17669
  // src/components/Attachment/Attachment.tsx
17670
- var import_react255 = __toESM(require("react"));
17670
+ var import_react256 = __toESM(require("react"));
17671
17671
  var import_stream_chat11 = require("stream-chat");
17672
17672
 
17673
17673
  // src/components/Attachment/AttachmentContainer.tsx
17674
- var import_react254 = __toESM(require("react"));
17674
+ var import_react255 = __toESM(require("react"));
17675
17675
  var import_react_player2 = __toESM(require("react-player"));
17676
17676
  var import_clsx65 = __toESM(require("clsx"));
17677
17677
  var linkify = __toESM(require("linkifyjs"));
@@ -17803,13 +17803,14 @@ var withComponentContext = (Component2) => {
17803
17803
  var import_react10 = __toESM(require("react"));
17804
17804
 
17805
17805
  // src/components/Dialog/DialogManager.ts
17806
+ var import_nanoid = require("nanoid");
17806
17807
  var import_stream_chat = require("stream-chat");
17807
17808
  var DialogManager = class {
17808
17809
  constructor({ id } = {}) {
17809
17810
  this.state = new import_stream_chat.StateStore({
17810
17811
  dialogsById: {}
17811
17812
  });
17812
- this.id = id ?? (/* @__PURE__ */ new Date()).getTime().toString();
17813
+ this.id = id ?? (0, import_nanoid.nanoid)();
17813
17814
  }
17814
17815
  get openDialogCount() {
17815
17816
  return Object.values(this.state.getLatestValue().dialogsById).reduce(
@@ -18916,7 +18917,7 @@ var UnMemoizedAudio = (props) => {
18916
18917
  var Audio = import_react29.default.memo(UnMemoizedAudio);
18917
18918
 
18918
18919
  // src/components/Attachment/VoiceRecording.tsx
18919
- var import_react250 = __toESM(require("react"));
18920
+ var import_react251 = __toESM(require("react"));
18920
18921
 
18921
18922
  // src/components/ReactFileUtilities/FileIcon/FileIcon.tsx
18922
18923
  var import_react31 = __toESM(require("react"));
@@ -19878,8 +19879,8 @@ var FileIcon = (props) => {
19878
19879
 
19879
19880
  // src/components/ReactFileUtilities/UploadButton.tsx
19880
19881
  var import_clsx63 = __toESM(require("clsx"));
19881
- var import_nanoid5 = require("nanoid");
19882
- var import_react249 = __toESM(require("react"));
19882
+ var import_nanoid6 = require("nanoid");
19883
+ var import_react250 = __toESM(require("react"));
19883
19884
 
19884
19885
  // src/components/ReactFileUtilities/utils.ts
19885
19886
  var import_react32 = require("react");
@@ -19979,14 +19980,13 @@ var readFileAsArrayBuffer = (file) => new Promise((resolve, reject) => {
19979
19980
  });
19980
19981
 
19981
19982
  // src/components/MessageInput/AttachmentSelector.tsx
19982
- var import_nanoid3 = require("nanoid");
19983
- var import_react210 = __toESM(require("react"));
19983
+ var import_react211 = __toESM(require("react"));
19984
19984
 
19985
19985
  // src/components/MessageInput/icons.tsx
19986
19986
  var import_react33 = __toESM(require("react"));
19987
- var import_nanoid = require("nanoid");
19987
+ var import_nanoid2 = require("nanoid");
19988
19988
  var LoadingIndicatorIcon = ({ size = 20 }) => {
19989
- const id = (0, import_react33.useMemo)(() => (0, import_nanoid.nanoid)(), []);
19989
+ const id = (0, import_react33.useMemo)(() => (0, import_nanoid2.nanoid)(), []);
19990
19990
  return /* @__PURE__ */ import_react33.default.createElement("div", { className: "str-chat__loading-indicator" }, /* @__PURE__ */ import_react33.default.createElement(
19991
19991
  "svg",
19992
19992
  {
@@ -20155,7 +20155,7 @@ var PlayIcon = () => /* @__PURE__ */ import_react33.default.createElement(
20155
20155
  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" }));
20156
20156
 
20157
20157
  // src/components/MessageInput/hooks/useMessageComposer.ts
20158
- var import_react207 = require("react");
20158
+ var import_react208 = require("react");
20159
20159
  var import_stream_chat6 = require("stream-chat");
20160
20160
 
20161
20161
  // src/components/Threads/ThreadContext.tsx
@@ -32917,7 +32917,7 @@ var ThreadList = ({ virtuosoProps }) => {
32917
32917
  };
32918
32918
 
32919
32919
  // src/components/Thread/Thread.tsx
32920
- var import_react206 = __toESM(require("react"));
32920
+ var import_react207 = __toESM(require("react"));
32921
32921
  var import_clsx53 = __toESM(require("clsx"));
32922
32922
 
32923
32923
  // src/components/Message/FixedHeightMessage.tsx
@@ -38028,10 +38028,10 @@ var FixedHeightMessage = import_react109.default.memo(
38028
38028
  );
38029
38029
 
38030
38030
  // src/components/Message/Message.tsx
38031
- var import_react201 = __toESM(require("react"));
38031
+ var import_react202 = __toESM(require("react"));
38032
38032
 
38033
38033
  // src/components/Message/MessageSimple.tsx
38034
- var import_react200 = __toESM(require("react"));
38034
+ var import_react201 = __toESM(require("react"));
38035
38035
  var import_clsx52 = __toESM(require("clsx"));
38036
38036
 
38037
38037
  // src/components/MessageBounce/MessageBounceModal.tsx
@@ -40755,13 +40755,13 @@ var GiphyPreviewMessage = (props) => {
40755
40755
 
40756
40756
  // src/components/MessageList/MessageList.tsx
40757
40757
  var import_clsx49 = __toESM(require("clsx"));
40758
- var import_react188 = __toESM(require("react"));
40758
+ var import_react189 = __toESM(require("react"));
40759
40759
 
40760
40760
  // src/components/MessageList/hooks/MessageList/useEnrichedMessages.ts
40761
40761
  var import_react170 = require("react");
40762
40762
 
40763
40763
  // src/components/MessageList/utils.ts
40764
- var import_nanoid2 = require("nanoid");
40764
+ var import_nanoid3 = require("nanoid");
40765
40765
 
40766
40766
  // src/constants/messageTypes.ts
40767
40767
  var CUSTOM_MESSAGE_TYPE = {
@@ -43870,14 +43870,14 @@ var processMessages = (params) => {
43870
43870
  };
43871
43871
  var makeIntroMessage = () => ({
43872
43872
  customType: CUSTOM_MESSAGE_TYPE.intro,
43873
- id: (0, import_nanoid2.nanoid)()
43873
+ id: (0, import_nanoid3.nanoid)()
43874
43874
  });
43875
43875
  var makeDateMessageId = (date) => {
43876
43876
  let idSuffix;
43877
43877
  try {
43878
- idSuffix = !date ? (0, import_nanoid2.nanoid)() : date instanceof Date ? date.toISOString() : date;
43878
+ idSuffix = !date ? (0, import_nanoid3.nanoid)() : date instanceof Date ? date.toISOString() : date;
43879
43879
  } catch (e) {
43880
- idSuffix = (0, import_nanoid2.nanoid)();
43880
+ idSuffix = (0, import_nanoid3.nanoid)();
43881
43881
  }
43882
43882
  return `${CUSTOM_MESSAGE_TYPE.date}-${idSuffix}`;
43883
43883
  };
@@ -44815,6 +44815,14 @@ function defaultRenderMessages({
44815
44815
  return renderedMessages;
44816
44816
  }
44817
44817
 
44818
+ // src/components/UtilityComponents/useStableId.ts
44819
+ var import_nanoid4 = require("nanoid");
44820
+ var import_react188 = require("react");
44821
+ var useStableId = (key) => {
44822
+ const id = (0, import_react188.useMemo)(() => (0, import_nanoid4.nanoid)(), [key]);
44823
+ return id;
44824
+ };
44825
+
44818
44826
  // src/components/MessageList/MessageList.tsx
44819
44827
  var MessageListWithContext = (props) => {
44820
44828
  const {
@@ -44854,8 +44862,8 @@ var MessageListWithContext = (props) => {
44854
44862
  threadList = false,
44855
44863
  unsafeHTML = false
44856
44864
  } = props;
44857
- const [listElement, setListElement] = import_react188.default.useState(null);
44858
- const [ulElement, setUlElement] = import_react188.default.useState(null);
44865
+ const [listElement, setListElement] = import_react189.default.useState(null);
44866
+ const [ulElement, setUlElement] = import_react189.default.useState(null);
44859
44867
  const { customClasses } = useChatContext("MessageList");
44860
44868
  const {
44861
44869
  EmptyStateIndicator: EmptyStateIndicator2 = EmptyStateIndicator,
@@ -44944,24 +44952,24 @@ var MessageListWithContext = (props) => {
44944
44952
  threadList
44945
44953
  });
44946
44954
  const messageListClass = customClasses?.messageList || "str-chat__list";
44947
- const loadMore = import_react188.default.useCallback(() => {
44955
+ const loadMore = import_react189.default.useCallback(() => {
44948
44956
  if (loadMoreCallback) {
44949
44957
  loadMoreCallback(messageLimit);
44950
44958
  }
44951
44959
  }, [loadMoreCallback, messageLimit]);
44952
- const loadMoreNewer = import_react188.default.useCallback(() => {
44960
+ const loadMoreNewer = import_react189.default.useCallback(() => {
44953
44961
  if (loadMoreNewerCallback) {
44954
44962
  loadMoreNewerCallback(messageLimit);
44955
44963
  }
44956
44964
  }, [loadMoreNewerCallback, messageLimit]);
44957
- const scrollToBottomFromNotification = import_react188.default.useCallback(async () => {
44965
+ const scrollToBottomFromNotification = import_react189.default.useCallback(async () => {
44958
44966
  if (hasMoreNewer) {
44959
44967
  await jumpToLatestMessage();
44960
44968
  } else {
44961
44969
  scrollToBottom();
44962
44970
  }
44963
44971
  }, [scrollToBottom, hasMoreNewer]);
44964
- import_react188.default.useLayoutEffect(() => {
44972
+ import_react189.default.useLayoutEffect(() => {
44965
44973
  if (highlightedMessageId) {
44966
44974
  const element4 = ulElement?.querySelector(
44967
44975
  `[data-message-id='${highlightedMessageId}']`
@@ -44969,14 +44977,15 @@ var MessageListWithContext = (props) => {
44969
44977
  element4?.scrollIntoView({ block: "center" });
44970
44978
  }
44971
44979
  }, [highlightedMessageId]);
44980
+ const id = useStableId();
44972
44981
  const showEmptyStateIndicator = elements.length === 0 && !threadList;
44973
- const dialogManagerId = threadList ? "message-list-dialog-manager-thread" : "message-list-dialog-manager";
44974
- 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(
44982
+ const dialogManagerId = threadList ? `message-list-dialog-manager-thread-${id}` : `message-list-dialog-manager-${id}`;
44983
+ return /* @__PURE__ */ import_react189.default.createElement(MessageListContextProvider, { value: { listElement, scrollToBottom } }, /* @__PURE__ */ import_react189.default.createElement(MessageListMainPanel2, null, /* @__PURE__ */ import_react189.default.createElement(DialogManagerProvider, { id: dialogManagerId }, !threadList && showUnreadMessagesNotification && /* @__PURE__ */ import_react189.default.createElement(
44975
44984
  UnreadMessagesNotification2,
44976
44985
  {
44977
44986
  unreadCount: channelUnreadUiState?.unread_messages
44978
44987
  }
44979
- ), /* @__PURE__ */ import_react188.default.createElement(
44988
+ ), /* @__PURE__ */ import_react189.default.createElement(
44980
44989
  "div",
44981
44990
  {
44982
44991
  className: (0, import_clsx49.default)(messageListClass, customClasses?.threadList),
@@ -44984,7 +44993,7 @@ var MessageListWithContext = (props) => {
44984
44993
  ref: setListElement,
44985
44994
  tabIndex: 0
44986
44995
  },
44987
- showEmptyStateIndicator ? /* @__PURE__ */ import_react188.default.createElement(EmptyStateIndicator2, { listType: threadList ? "thread" : "message" }) : /* @__PURE__ */ import_react188.default.createElement(
44996
+ showEmptyStateIndicator ? /* @__PURE__ */ import_react189.default.createElement(EmptyStateIndicator2, { listType: threadList ? "thread" : "message" }) : /* @__PURE__ */ import_react189.default.createElement(
44988
44997
  InfiniteScroll,
44989
44998
  {
44990
44999
  className: "str-chat__message-list-scroll",
@@ -44993,17 +45002,17 @@ var MessageListWithContext = (props) => {
44993
45002
  hasPreviousPage: props.hasMore,
44994
45003
  head: props.head,
44995
45004
  isLoading: props.loadingMore,
44996
- 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 })),
45005
+ loader: /* @__PURE__ */ import_react189.default.createElement("div", { className: "str-chat__list__loading", key: "loading-indicator" }, props.loadingMore && /* @__PURE__ */ import_react189.default.createElement(LoadingIndicator2, { size: 20 })),
44997
45006
  loadNextPage: loadMoreNewer,
44998
45007
  loadPreviousPage: loadMore,
44999
45008
  threshold: loadMoreScrollThreshold,
45000
45009
  ...restInternalInfiniteScrollProps
45001
45010
  },
45002
- /* @__PURE__ */ import_react188.default.createElement("ul", { className: "str-chat__ul", ref: setUlElement }, elements),
45003
- /* @__PURE__ */ import_react188.default.createElement(TypingIndicator2, { threadList }),
45004
- /* @__PURE__ */ import_react188.default.createElement("div", { key: "bottom" })
45011
+ /* @__PURE__ */ import_react189.default.createElement("ul", { className: "str-chat__ul", ref: setUlElement }, elements),
45012
+ /* @__PURE__ */ import_react189.default.createElement(TypingIndicator2, { threadList }),
45013
+ /* @__PURE__ */ import_react189.default.createElement("div", { key: "bottom" })
45005
45014
  )
45006
- ))), /* @__PURE__ */ import_react188.default.createElement(
45015
+ ))), /* @__PURE__ */ import_react189.default.createElement(
45007
45016
  MessageListNotifications2,
45008
45017
  {
45009
45018
  hasNewMessages,
@@ -45028,7 +45037,7 @@ var MessageList = (props) => {
45028
45037
  // eslint-disable-line @typescript-eslint/no-unused-vars
45029
45038
  ...restChannelStateContext
45030
45039
  } = useChannelStateContext("MessageList");
45031
- return /* @__PURE__ */ import_react188.default.createElement(
45040
+ return /* @__PURE__ */ import_react189.default.createElement(
45032
45041
  MessageListWithContext,
45033
45042
  {
45034
45043
  jumpToLatestMessage,
@@ -45041,16 +45050,16 @@ var MessageList = (props) => {
45041
45050
  };
45042
45051
 
45043
45052
  // src/components/MessageList/ScrollToBottomButton.tsx
45044
- var import_react189 = __toESM(require("react"));
45053
+ var import_react190 = __toESM(require("react"));
45045
45054
  var import_clsx50 = __toESM(require("clsx"));
45046
45055
  var UnMemoizedScrollToBottomButton = (props) => {
45047
45056
  const { isMessageListScrolledToBottom, onClick, threadList } = props;
45048
45057
  const { channel: activeChannel, client } = useChatContext();
45049
45058
  const { thread } = useChannelStateContext();
45050
- const [countUnread, setCountUnread] = (0, import_react189.useState)(activeChannel?.countUnread() || 0);
45051
- const [replyCount, setReplyCount] = (0, import_react189.useState)(thread?.reply_count || 0);
45059
+ const [countUnread, setCountUnread] = (0, import_react190.useState)(activeChannel?.countUnread() || 0);
45060
+ const [replyCount, setReplyCount] = (0, import_react190.useState)(thread?.reply_count || 0);
45052
45061
  const observedEvent = threadList ? "message.updated" : "message.new";
45053
- (0, import_react189.useEffect)(() => {
45062
+ (0, import_react190.useEffect)(() => {
45054
45063
  const handleEvent = (event) => {
45055
45064
  const newMessageInAnotherChannel = event.cid !== activeChannel?.cid;
45056
45065
  const newMessageIsMine = event.user?.id === client.user?.id;
@@ -45072,14 +45081,14 @@ var UnMemoizedScrollToBottomButton = (props) => {
45072
45081
  client.off(observedEvent, handleEvent);
45073
45082
  };
45074
45083
  }, [activeChannel, isMessageListScrolledToBottom, observedEvent, replyCount, thread]);
45075
- (0, import_react189.useEffect)(() => {
45084
+ (0, import_react190.useEffect)(() => {
45076
45085
  if (isMessageListScrolledToBottom) {
45077
45086
  setCountUnread(0);
45078
45087
  setReplyCount(thread?.reply_count || 0);
45079
45088
  }
45080
45089
  }, [isMessageListScrolledToBottom, thread]);
45081
45090
  if (isMessageListScrolledToBottom) return null;
45082
- return /* @__PURE__ */ import_react189.default.createElement("div", { className: "str-chat__jump-to-latest-message" }, /* @__PURE__ */ import_react189.default.createElement(
45091
+ return /* @__PURE__ */ import_react190.default.createElement("div", { className: "str-chat__jump-to-latest-message" }, /* @__PURE__ */ import_react190.default.createElement(
45083
45092
  "button",
45084
45093
  {
45085
45094
  "aria-live": "polite",
@@ -45090,8 +45099,8 @@ var UnMemoizedScrollToBottomButton = (props) => {
45090
45099
  "data-testid": "message-notification",
45091
45100
  onClick
45092
45101
  },
45093
- /* @__PURE__ */ import_react189.default.createElement(ArrowDown, null),
45094
- countUnread > 0 && /* @__PURE__ */ import_react189.default.createElement(
45102
+ /* @__PURE__ */ import_react190.default.createElement(ArrowDown, null),
45103
+ countUnread > 0 && /* @__PURE__ */ import_react190.default.createElement(
45095
45104
  "div",
45096
45105
  {
45097
45106
  className: (0, import_clsx50.default)(
@@ -45104,23 +45113,23 @@ var UnMemoizedScrollToBottomButton = (props) => {
45104
45113
  )
45105
45114
  ));
45106
45115
  };
45107
- var ScrollToBottomButton = import_react189.default.memo(
45116
+ var ScrollToBottomButton = import_react190.default.memo(
45108
45117
  UnMemoizedScrollToBottomButton
45109
45118
  );
45110
45119
 
45111
45120
  // src/components/MessageList/VirtualizedMessageList.tsx
45112
- var import_react199 = __toESM(require("react"));
45121
+ var import_react200 = __toESM(require("react"));
45113
45122
  var import_react_virtuoso3 = require("react-virtuoso");
45114
45123
 
45115
45124
  // src/components/MessageList/hooks/VirtualizedMessageList/useNewMessageNotification.ts
45116
- var import_react190 = require("react");
45125
+ var import_react191 = require("react");
45117
45126
  function useNewMessageNotification(messages, currentUserId, hasMoreNewer) {
45118
- const [newMessagesNotification, setNewMessagesNotification] = (0, import_react190.useState)(false);
45119
- const [isMessageListScrolledToBottom, setIsMessageListScrolledToBottom] = (0, import_react190.useState)(true);
45120
- const didMount = (0, import_react190.useRef)(false);
45121
- const lastMessageId = (0, import_react190.useRef)("");
45122
- const atBottom = (0, import_react190.useRef)(false);
45123
- (0, import_react190.useEffect)(() => {
45127
+ const [newMessagesNotification, setNewMessagesNotification] = (0, import_react191.useState)(false);
45128
+ const [isMessageListScrolledToBottom, setIsMessageListScrolledToBottom] = (0, import_react191.useState)(true);
45129
+ const didMount = (0, import_react191.useRef)(false);
45130
+ const lastMessageId = (0, import_react191.useRef)("");
45131
+ const atBottom = (0, import_react191.useRef)(false);
45132
+ (0, import_react191.useEffect)(() => {
45124
45133
  if (hasMoreNewer) {
45125
45134
  setNewMessagesNotification(true);
45126
45135
  return;
@@ -45146,17 +45155,17 @@ function useNewMessageNotification(messages, currentUserId, hasMoreNewer) {
45146
45155
  }
45147
45156
 
45148
45157
  // src/components/MessageList/hooks/VirtualizedMessageList/usePrependMessagesCount.ts
45149
- var import_react191 = require("react");
45158
+ var import_react192 = require("react");
45150
45159
  var STATUSES_EXCLUDED_FROM_PREPEND = {
45151
45160
  failed: true,
45152
45161
  sending: true
45153
45162
  };
45154
45163
  function usePrependedMessagesCount(messages, hasDateSeparator) {
45155
45164
  const firstRealMessageIndex = hasDateSeparator ? 1 : 0;
45156
- const firstMessageOnFirstLoadedPage = (0, import_react191.useRef)(void 0);
45157
- const previousFirstMessageOnFirstLoadedPage = (0, import_react191.useRef)(void 0);
45158
- const previousNumItemsPrepended = (0, import_react191.useRef)(0);
45159
- const numItemsPrepended = (0, import_react191.useMemo)(() => {
45165
+ const firstMessageOnFirstLoadedPage = (0, import_react192.useRef)(void 0);
45166
+ const previousFirstMessageOnFirstLoadedPage = (0, import_react192.useRef)(void 0);
45167
+ const previousNumItemsPrepended = (0, import_react192.useRef)(0);
45168
+ const numItemsPrepended = (0, import_react192.useMemo)(() => {
45160
45169
  if (!messages || !messages.length) {
45161
45170
  previousNumItemsPrepended.current = 0;
45162
45171
  return 0;
@@ -45187,10 +45196,10 @@ function usePrependedMessagesCount(messages, hasDateSeparator) {
45187
45196
  }
45188
45197
 
45189
45198
  // src/components/MessageList/hooks/VirtualizedMessageList/useShouldForceScrollToBottom.ts
45190
- var import_react192 = require("react");
45199
+ var import_react193 = require("react");
45191
45200
  function useShouldForceScrollToBottom(messages, currentUserId) {
45192
- const lastFocusedOwnMessage = (0, import_react192.useRef)("");
45193
- const initialFocusRegistered = (0, import_react192.useRef)(false);
45201
+ const lastFocusedOwnMessage = (0, import_react193.useRef)("");
45202
+ const initialFocusRegistered = (0, import_react193.useRef)(false);
45194
45203
  function recheckForNewOwnMessage() {
45195
45204
  if (messages && messages.length > 0) {
45196
45205
  const lastMessage = messages[messages.length - 1];
@@ -45201,7 +45210,7 @@ function useShouldForceScrollToBottom(messages, currentUserId) {
45201
45210
  }
45202
45211
  return false;
45203
45212
  }
45204
- (0, import_react192.useEffect)(() => {
45213
+ (0, import_react193.useEffect)(() => {
45205
45214
  if (messages && messages.length && !initialFocusRegistered.current) {
45206
45215
  initialFocusRegistered.current = true;
45207
45216
  recheckForNewOwnMessage();
@@ -45211,11 +45220,11 @@ function useShouldForceScrollToBottom(messages, currentUserId) {
45211
45220
  }
45212
45221
 
45213
45222
  // src/components/MessageList/hooks/VirtualizedMessageList/useGiphyPreview.ts
45214
- var import_react193 = require("react");
45223
+ var import_react194 = require("react");
45215
45224
  var useGiphyPreview = (separateGiphyPreview) => {
45216
- const [giphyPreviewMessage, setGiphyPreviewMessage] = (0, import_react193.useState)();
45225
+ const [giphyPreviewMessage, setGiphyPreviewMessage] = (0, import_react194.useState)();
45217
45226
  const { client } = useChatContext("useGiphyPreview");
45218
- (0, import_react193.useEffect)(() => {
45227
+ (0, import_react194.useEffect)(() => {
45219
45228
  if (!separateGiphyPreview) return;
45220
45229
  const handleEvent = (event) => {
45221
45230
  const { message, user } = event;
@@ -45233,11 +45242,11 @@ var useGiphyPreview = (separateGiphyPreview) => {
45233
45242
  };
45234
45243
 
45235
45244
  // src/components/MessageList/hooks/VirtualizedMessageList/useMessageSetKey.ts
45236
- var import_react194 = require("react");
45245
+ var import_react195 = require("react");
45237
45246
  var useMessageSetKey = ({ messages }) => {
45238
- const [messageSetKey, setMessageSetKey] = (0, import_react194.useState)(+/* @__PURE__ */ new Date());
45239
- const firstMessageId = (0, import_react194.useRef)(void 0);
45240
- (0, import_react194.useEffect)(() => {
45247
+ const [messageSetKey, setMessageSetKey] = (0, import_react195.useState)(+/* @__PURE__ */ new Date());
45248
+ const firstMessageId = (0, import_react195.useRef)(void 0);
45249
+ (0, import_react195.useEffect)(() => {
45241
45250
  const continuousSet = messages?.find(
45242
45251
  (message) => message.id === firstMessageId.current
45243
45252
  );
@@ -45252,24 +45261,24 @@ var useMessageSetKey = ({ messages }) => {
45252
45261
  };
45253
45262
 
45254
45263
  // src/components/MessageList/hooks/VirtualizedMessageList/useScrollToBottomOnNewMessage.ts
45255
- var import_react195 = require("react");
45264
+ var import_react196 = require("react");
45256
45265
  var useScrollToBottomOnNewMessage = ({
45257
45266
  messages,
45258
45267
  scrollToBottom,
45259
45268
  scrollToLatestMessageOnFocus
45260
45269
  }) => {
45261
- const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = (0, import_react195.useState)(false);
45262
- const scrollToBottomIfConfigured = (0, import_react195.useRef)(void 0);
45270
+ const [newMessagesReceivedInBackground, setNewMessagesReceivedInBackground] = (0, import_react196.useState)(false);
45271
+ const scrollToBottomIfConfigured = (0, import_react196.useRef)(void 0);
45263
45272
  scrollToBottomIfConfigured.current = (event) => {
45264
45273
  if (!scrollToLatestMessageOnFocus || !newMessagesReceivedInBackground || event.target !== window) {
45265
45274
  return;
45266
45275
  }
45267
45276
  setTimeout(scrollToBottom, 100);
45268
45277
  };
45269
- (0, import_react195.useEffect)(() => {
45278
+ (0, import_react196.useEffect)(() => {
45270
45279
  setNewMessagesReceivedInBackground(true);
45271
45280
  }, [messages]);
45272
- (0, import_react195.useEffect)(() => {
45281
+ (0, import_react196.useEffect)(() => {
45273
45282
  const handleFocus = (event) => {
45274
45283
  scrollToBottomIfConfigured.current?.(event);
45275
45284
  };
@@ -45288,14 +45297,14 @@ var useScrollToBottomOnNewMessage = ({
45288
45297
  };
45289
45298
 
45290
45299
  // src/components/MessageList/hooks/VirtualizedMessageList/useUnreadMessagesNotificationVirtualized.ts
45291
- var import_react196 = require("react");
45300
+ var import_react197 = require("react");
45292
45301
  var useUnreadMessagesNotificationVirtualized = ({
45293
45302
  lastRead,
45294
45303
  showAlways,
45295
45304
  unreadCount
45296
45305
  }) => {
45297
- const [show, setShow] = (0, import_react196.useState)(false);
45298
- const toggleShowUnreadMessagesNotification = (0, import_react196.useCallback)(
45306
+ const [show, setShow] = (0, import_react197.useState)(false);
45307
+ const toggleShowUnreadMessagesNotification = (0, import_react197.useCallback)(
45299
45308
  (renderedMessages) => {
45300
45309
  if (!unreadCount) return;
45301
45310
  const firstRenderedMessage = renderedMessages[0];
@@ -45316,7 +45325,7 @@ var useUnreadMessagesNotificationVirtualized = ({
45316
45325
  },
45317
45326
  [lastRead, showAlways, unreadCount]
45318
45327
  );
45319
- (0, import_react196.useEffect)(() => {
45328
+ (0, import_react197.useEffect)(() => {
45320
45329
  if (!unreadCount) setShow(false);
45321
45330
  }, [unreadCount]);
45322
45331
  return { show, toggleShowUnreadMessagesNotification };
@@ -45325,7 +45334,7 @@ var useUnreadMessagesNotificationVirtualized = ({
45325
45334
  // src/components/MessageList/VirtualizedMessageListComponents.tsx
45326
45335
  var import_clsx51 = __toESM(require("clsx"));
45327
45336
  var import_lodash17 = __toESM(require("lodash.throttle"));
45328
- var import_react197 = __toESM(require("react"));
45337
+ var import_react198 = __toESM(require("react"));
45329
45338
  var PREPEND_OFFSET = 10 ** 7;
45330
45339
  function calculateItemIndex(virtuosoIndex, numItemsPrepended) {
45331
45340
  return virtuosoIndex + numItemsPrepended - PREPEND_OFFSET;
@@ -45343,10 +45352,10 @@ var makeItemsRenderedHandler = (renderedItemsActions, processedMessages) => (0,
45343
45352
  );
45344
45353
  }, 200);
45345
45354
  var Item = ({ context, ...props }) => {
45346
- if (!context) return /* @__PURE__ */ import_react197.default.createElement(import_react197.default.Fragment, null);
45355
+ if (!context) return /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null);
45347
45356
  const message = context.processedMessages[calculateItemIndex(props["data-item-index"], context.numItemsPrepended)];
45348
45357
  const groupStyles = context.messageGroupStyles[message.id];
45349
- return /* @__PURE__ */ import_react197.default.createElement(
45358
+ return /* @__PURE__ */ import_react198.default.createElement(
45350
45359
  "div",
45351
45360
  {
45352
45361
  ...props,
@@ -45360,13 +45369,13 @@ var Header = ({ context }) => {
45360
45369
  const { LoadingIndicator: LoadingIndicator2 = LoadingIndicator } = useComponentContext(
45361
45370
  "VirtualizedMessageListHeader"
45362
45371
  );
45363
- 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 })));
45372
+ return /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, context?.head, context?.loadingMore && LoadingIndicator2 && /* @__PURE__ */ import_react198.default.createElement("div", { className: "str-chat__virtual-list__loading" }, /* @__PURE__ */ import_react198.default.createElement(LoadingIndicator2, { size: 20 })));
45364
45373
  };
45365
45374
  var EmptyPlaceholder = ({ context }) => {
45366
45375
  const { EmptyStateIndicator: EmptyStateIndicator2 = EmptyStateIndicator } = useComponentContext(
45367
45376
  "VirtualizedMessageList"
45368
45377
  );
45369
- return /* @__PURE__ */ import_react197.default.createElement(import_react197.default.Fragment, null, EmptyStateIndicator2 && /* @__PURE__ */ import_react197.default.createElement(EmptyStateIndicator2, { listType: context?.threadList ? "thread" : "message" }));
45378
+ return /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, EmptyStateIndicator2 && /* @__PURE__ */ import_react198.default.createElement(EmptyStateIndicator2, { listType: context?.threadList ? "thread" : "message" }));
45370
45379
  };
45371
45380
  var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
45372
45381
  const {
@@ -45402,12 +45411,12 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
45402
45411
  return customMessageRenderer(messageList, streamMessageIndex);
45403
45412
  }
45404
45413
  const message = messageList[streamMessageIndex];
45405
- if (!message || isIntroMessage(message)) return /* @__PURE__ */ import_react197.default.createElement("div", { style: { height: "1px" } });
45414
+ if (!message || isIntroMessage(message)) return /* @__PURE__ */ import_react198.default.createElement("div", { style: { height: "1px" } });
45406
45415
  if (isDateSeparatorMessage(message)) {
45407
- return DateSeparator2 ? /* @__PURE__ */ import_react197.default.createElement(DateSeparator2, { date: message.date, unread: message.unread }) : null;
45416
+ return DateSeparator2 ? /* @__PURE__ */ import_react198.default.createElement(DateSeparator2, { date: message.date, unread: message.unread }) : null;
45408
45417
  }
45409
45418
  if (message.type === "system") {
45410
- return MessageSystem ? /* @__PURE__ */ import_react197.default.createElement(MessageSystem, { message }) : null;
45419
+ return MessageSystem ? /* @__PURE__ */ import_react198.default.createElement(MessageSystem, { message }) : null;
45411
45420
  }
45412
45421
  const maybePrevMessage = messageList[streamMessageIndex - 1];
45413
45422
  const maybeNextMessage = messageList[streamMessageIndex + 1];
@@ -45423,7 +45432,7 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
45423
45432
  previousMessage: streamMessageIndex ? messageList[streamMessageIndex - 1] : void 0,
45424
45433
  unreadMessageCount
45425
45434
  });
45426
- 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(
45435
+ return /* @__PURE__ */ import_react198.default.createElement(import_react198.default.Fragment, null, isFirstUnreadMessage && /* @__PURE__ */ import_react198.default.createElement("div", { className: "str-chat__unread-messages-separator-wrapper" }, /* @__PURE__ */ import_react198.default.createElement(UnreadMessagesSeparator2, { unreadCount: unreadMessageCount })), /* @__PURE__ */ import_react198.default.createElement(
45427
45436
  Message,
45428
45437
  {
45429
45438
  additionalMessageInputProps,
@@ -45450,12 +45459,12 @@ var messageRenderer = (virtuosoIndex, _data, virtuosoContext) => {
45450
45459
  };
45451
45460
 
45452
45461
  // src/context/VirtualizedMessageListContext.tsx
45453
- var import_react198 = __toESM(require("react"));
45454
- var VirtualizedMessageListContext = (0, import_react198.createContext)(void 0);
45462
+ var import_react199 = __toESM(require("react"));
45463
+ var VirtualizedMessageListContext = (0, import_react199.createContext)(void 0);
45455
45464
  var VirtualizedMessageListContextProvider = ({
45456
45465
  children,
45457
45466
  value
45458
- }) => /* @__PURE__ */ import_react198.default.createElement(
45467
+ }) => /* @__PURE__ */ import_react199.default.createElement(
45459
45468
  VirtualizedMessageListContext.Provider,
45460
45469
  {
45461
45470
  value
@@ -45470,7 +45479,7 @@ function captureResizeObserverExceededError(e) {
45470
45479
  }
45471
45480
  }
45472
45481
  function useCaptureResizeObserverExceededError() {
45473
- (0, import_react199.useEffect)(() => {
45482
+ (0, import_react200.useEffect)(() => {
45474
45483
  window.addEventListener("error", captureResizeObserverExceededError);
45475
45484
  return () => {
45476
45485
  window.removeEventListener("error", captureResizeObserverExceededError);
@@ -45554,15 +45563,15 @@ var VirtualizedMessageListWithContext = (props) => {
45554
45563
  } = useComponentContext("VirtualizedMessageList");
45555
45564
  const MessageUIComponent = MessageUIComponentFromProps || MessageUIComponentFromContext;
45556
45565
  const { client, customClasses } = useChatContext("VirtualizedMessageList");
45557
- const virtuoso = (0, import_react199.useRef)(null);
45558
- const lastRead = (0, import_react199.useMemo)(() => channel.lastRead?.(), [channel]);
45566
+ const virtuoso = (0, import_react200.useRef)(null);
45567
+ const lastRead = (0, import_react200.useMemo)(() => channel.lastRead?.(), [channel]);
45559
45568
  const { show: showUnreadMessagesNotification, toggleShowUnreadMessagesNotification } = useUnreadMessagesNotificationVirtualized({
45560
45569
  lastRead: channelUnreadUiState?.last_read,
45561
45570
  showAlways: !!showUnreadNotificationAlways,
45562
45571
  unreadCount: channelUnreadUiState?.unread_messages ?? 0
45563
45572
  });
45564
45573
  const { giphyPreviewMessage, setGiphyPreviewMessage } = useGiphyPreview(separateGiphyPreview);
45565
- const processedMessages = (0, import_react199.useMemo)(() => {
45574
+ const processedMessages = (0, import_react200.useMemo)(() => {
45566
45575
  if (typeof messages === "undefined") {
45567
45576
  return [];
45568
45577
  }
@@ -45594,12 +45603,12 @@ var VirtualizedMessageListWithContext = (props) => {
45594
45603
  returnAllReadData,
45595
45604
  userID: client.userID
45596
45605
  });
45597
- const lastReceivedMessageId = (0, import_react199.useMemo)(
45606
+ const lastReceivedMessageId = (0, import_react200.useMemo)(
45598
45607
  () => getLastReceived(processedMessages),
45599
45608
  [processedMessages]
45600
45609
  );
45601
45610
  const groupStylesFn = groupStyles || getGroupStyles;
45602
- const messageGroupStyles = (0, import_react199.useMemo)(
45611
+ const messageGroupStyles = (0, import_react200.useMemo)(
45603
45612
  () => processedMessages.reduce((acc, message, i) => {
45604
45613
  const style = groupStylesFn(
45605
45614
  message,
@@ -45632,7 +45641,7 @@ var VirtualizedMessageListWithContext = (props) => {
45632
45641
  messageListIsThread: !!threadList,
45633
45642
  wasMarkedUnread: !!channelUnreadUiState?.first_unread_message_id
45634
45643
  });
45635
- const scrollToBottom = (0, import_react199.useCallback)(async () => {
45644
+ const scrollToBottom = (0, import_react200.useCallback)(async () => {
45636
45645
  if (hasMoreNewer) {
45637
45646
  await jumpToLatestMessage();
45638
45647
  return;
@@ -45664,7 +45673,7 @@ var VirtualizedMessageListWithContext = (props) => {
45664
45673
  processedMessages,
45665
45674
  client.userID
45666
45675
  );
45667
- const handleItemsRendered = (0, import_react199.useMemo)(
45676
+ const handleItemsRendered = (0, import_react200.useMemo)(
45668
45677
  () => makeItemsRenderedHandler([toggleShowUnreadMessagesNotification], processedMessages),
45669
45678
  [processedMessages, toggleShowUnreadMessagesNotification]
45670
45679
  );
@@ -45677,7 +45686,7 @@ var VirtualizedMessageListWithContext = (props) => {
45677
45686
  }
45678
45687
  return isAtBottom ? stickToBottomScrollBehavior : false;
45679
45688
  };
45680
- const computeItemKey2 = (0, import_react199.useCallback)(
45689
+ const computeItemKey2 = (0, import_react200.useCallback)(
45681
45690
  (index3, _, { numItemsPrepended: numItemsPrepended2, processedMessages: processedMessages2 }) => processedMessages2[calculateItemIndex(index3, numItemsPrepended2)].id,
45682
45691
  []
45683
45692
  );
@@ -45694,7 +45703,7 @@ var VirtualizedMessageListWithContext = (props) => {
45694
45703
  loadMore?.(messageLimit);
45695
45704
  }
45696
45705
  };
45697
- (0, import_react199.useEffect)(() => {
45706
+ (0, import_react200.useEffect)(() => {
45698
45707
  let scrollTimeout;
45699
45708
  if (highlightedMessageId) {
45700
45709
  const index3 = findMessageIndex(processedMessages, highlightedMessageId);
@@ -45708,19 +45717,20 @@ var VirtualizedMessageListWithContext = (props) => {
45708
45717
  clearTimeout(scrollTimeout);
45709
45718
  };
45710
45719
  }, [highlightedMessageId, processedMessages]);
45720
+ const id = useStableId();
45711
45721
  if (!processedMessages) return null;
45712
- const dialogManagerId = threadList ? "virtualized-message-list-dialog-manager-thread" : "virtualized-message-list-dialog-manager";
45713
- 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(
45722
+ const dialogManagerId = threadList ? `virtualized-message-list-dialog-manager-thread-${id}` : `virtualized-message-list-dialog-manager-${id}`;
45723
+ return /* @__PURE__ */ import_react200.default.createElement(VirtualizedMessageListContextProvider, { value: { scrollToBottom } }, /* @__PURE__ */ import_react200.default.createElement(MessageListMainPanel2, null, /* @__PURE__ */ import_react200.default.createElement(DialogManagerProvider, { id: dialogManagerId }, !threadList && showUnreadMessagesNotification && /* @__PURE__ */ import_react200.default.createElement(
45714
45724
  UnreadMessagesNotification2,
45715
45725
  {
45716
45726
  unreadCount: channelUnreadUiState?.unread_messages
45717
45727
  }
45718
- ), /* @__PURE__ */ import_react199.default.createElement(
45728
+ ), /* @__PURE__ */ import_react200.default.createElement(
45719
45729
  "div",
45720
45730
  {
45721
45731
  className: customClasses?.virtualizedMessageList || "str-chat__virtual-list"
45722
45732
  },
45723
- /* @__PURE__ */ import_react199.default.createElement(
45733
+ /* @__PURE__ */ import_react200.default.createElement(
45724
45734
  import_react_virtuoso3.Virtuoso,
45725
45735
  {
45726
45736
  atBottomStateChange,
@@ -45786,7 +45796,7 @@ var VirtualizedMessageListWithContext = (props) => {
45786
45796
  ...defaultItemHeight ? { defaultItemHeight } : {}
45787
45797
  }
45788
45798
  )
45789
- )), TypingIndicator2 && /* @__PURE__ */ import_react199.default.createElement(TypingIndicator2, null)), /* @__PURE__ */ import_react199.default.createElement(
45799
+ )), TypingIndicator2 && /* @__PURE__ */ import_react200.default.createElement(TypingIndicator2, null)), /* @__PURE__ */ import_react200.default.createElement(
45790
45800
  MessageListNotifications2,
45791
45801
  {
45792
45802
  hasNewMessages: newMessagesNotification,
@@ -45798,7 +45808,7 @@ var VirtualizedMessageListWithContext = (props) => {
45798
45808
  threadList,
45799
45809
  unreadCount: threadList ? void 0 : channelUnreadUiState?.unread_messages
45800
45810
  }
45801
- ), giphyPreviewMessage && /* @__PURE__ */ import_react199.default.createElement(GiphyPreviewMessage2, { message: giphyPreviewMessage }));
45811
+ ), giphyPreviewMessage && /* @__PURE__ */ import_react200.default.createElement(GiphyPreviewMessage2, { message: giphyPreviewMessage }));
45802
45812
  };
45803
45813
  function VirtualizedMessageList(props) {
45804
45814
  const { jumpToLatestMessage, loadMore, loadMoreNewer } = useChannelActionContext(
@@ -45818,7 +45828,7 @@ function VirtualizedMessageList(props) {
45818
45828
  suppressAutoscroll
45819
45829
  } = useChannelStateContext("VirtualizedMessageList");
45820
45830
  const messages = props.messages || contextMessages;
45821
- return /* @__PURE__ */ import_react199.default.createElement(
45831
+ return /* @__PURE__ */ import_react200.default.createElement(
45822
45832
  VirtualizedMessageListWithContext,
45823
45833
  {
45824
45834
  channel,
@@ -45862,8 +45872,8 @@ var MessageSimpleWithContext = (props) => {
45862
45872
  } = props;
45863
45873
  const { client } = useChatContext("MessageSimple");
45864
45874
  const { t } = useTranslationContext("MessageSimple");
45865
- const [isBounceDialogOpen, setIsBounceDialogOpen] = (0, import_react200.useState)(false);
45866
- const [isEditedTimestampOpen, setEditedTimestampOpen] = (0, import_react200.useState)(false);
45875
+ const [isBounceDialogOpen, setIsBounceDialogOpen] = (0, import_react201.useState)(false);
45876
+ const [isEditedTimestampOpen, setEditedTimestampOpen] = (0, import_react201.useState)(false);
45867
45877
  const {
45868
45878
  Attachment: Attachment2 = Attachment,
45869
45879
  Avatar: Avatar2 = Avatar,
@@ -45883,7 +45893,7 @@ var MessageSimpleWithContext = (props) => {
45883
45893
  } = useComponentContext("MessageSimple");
45884
45894
  const hasAttachment = messageHasAttachments(message);
45885
45895
  const hasReactions = messageHasReactions(message);
45886
- const isAIGenerated = (0, import_react200.useMemo)(
45896
+ const isAIGenerated = (0, import_react201.useMemo)(
45887
45897
  () => isMessageAIGenerated?.(message),
45888
45898
  [isMessageAIGenerated, message]
45889
45899
  );
@@ -45891,10 +45901,10 @@ var MessageSimpleWithContext = (props) => {
45891
45901
  return null;
45892
45902
  }
45893
45903
  if (message.deleted_at || message.type === "deleted") {
45894
- return /* @__PURE__ */ import_react200.default.createElement(MessageDeleted2, { message });
45904
+ return /* @__PURE__ */ import_react201.default.createElement(MessageDeleted2, { message });
45895
45905
  }
45896
45906
  if (isMessageBlocked(message)) {
45897
- return /* @__PURE__ */ import_react200.default.createElement(MessageBlocked2, null);
45907
+ return /* @__PURE__ */ import_react201.default.createElement(MessageBlocked2, null);
45898
45908
  }
45899
45909
  const showMetadata = !groupedByUser || endOfGroup;
45900
45910
  const showReplyCountButton = !threadList && !!message.reply_count;
@@ -45928,14 +45938,14 @@ var MessageSimpleWithContext = (props) => {
45928
45938
  }
45929
45939
  );
45930
45940
  const poll = message.poll_id && client.polls.fromState(message.poll_id);
45931
- 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(
45941
+ return /* @__PURE__ */ import_react201.default.createElement(import_react201.default.Fragment, null, editing && /* @__PURE__ */ import_react201.default.createElement(EditMessageModal, { additionalMessageInputProps }), isBounceDialogOpen && /* @__PURE__ */ import_react201.default.createElement(
45932
45942
  MessageBounceModal,
45933
45943
  {
45934
45944
  MessageBouncePrompt: MessageBouncePrompt2,
45935
45945
  onClose: () => setIsBounceDialogOpen(false),
45936
45946
  open: isBounceDialogOpen
45937
45947
  }
45938
- ), /* @__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(
45948
+ ), /* @__PURE__ */ import_react201.default.createElement("div", { className: rootClassName2, key: message.id }, PinIndicator2 && /* @__PURE__ */ import_react201.default.createElement(PinIndicator2, null), message.user && /* @__PURE__ */ import_react201.default.createElement(
45939
45949
  Avatar2,
45940
45950
  {
45941
45951
  image: message.user.image,
@@ -45944,7 +45954,7 @@ var MessageSimpleWithContext = (props) => {
45944
45954
  onMouseOver: onUserHover,
45945
45955
  user: message.user
45946
45956
  }
45947
- ), /* @__PURE__ */ import_react200.default.createElement(
45957
+ ), /* @__PURE__ */ import_react201.default.createElement(
45948
45958
  "div",
45949
45959
  {
45950
45960
  className: (0, import_clsx52.default)("str-chat__message-inner", {
@@ -45954,37 +45964,37 @@ var MessageSimpleWithContext = (props) => {
45954
45964
  onClick: handleClick,
45955
45965
  onKeyUp: handleClick
45956
45966
  },
45957
- /* @__PURE__ */ import_react200.default.createElement(MessageActions2, null),
45958
- /* @__PURE__ */ import_react200.default.createElement("div", { className: "str-chat__message-reactions-host" }, hasReactions && /* @__PURE__ */ import_react200.default.createElement(ReactionsList2, { reverse: true })),
45959
- /* @__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(
45967
+ /* @__PURE__ */ import_react201.default.createElement(MessageActions2, null),
45968
+ /* @__PURE__ */ import_react201.default.createElement("div", { className: "str-chat__message-reactions-host" }, hasReactions && /* @__PURE__ */ import_react201.default.createElement(ReactionsList2, { reverse: true })),
45969
+ /* @__PURE__ */ import_react201.default.createElement("div", { className: "str-chat__message-bubble" }, poll && /* @__PURE__ */ import_react201.default.createElement(Poll, { poll }), message.attachments?.length && !message.quoted_message ? /* @__PURE__ */ import_react201.default.createElement(
45960
45970
  Attachment2,
45961
45971
  {
45962
45972
  actionHandler: handleAction,
45963
45973
  attachments: message.attachments
45964
45974
  }
45965
- ) : 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(
45975
+ ) : null, isAIGenerated ? /* @__PURE__ */ import_react201.default.createElement(StreamedMessageText2, { message, renderText: renderText2 }) : /* @__PURE__ */ import_react201.default.createElement(MessageText, { message, renderText: renderText2 }), message.mml && /* @__PURE__ */ import_react201.default.createElement(
45966
45976
  MML3,
45967
45977
  {
45968
45978
  actionHandler: handleAction,
45969
45979
  align: isMyMessage() ? "right" : "left",
45970
45980
  source: message.mml
45971
45981
  }
45972
- ), /* @__PURE__ */ import_react200.default.createElement(MessageErrorIcon, null))
45973
- ), showReplyCountButton && /* @__PURE__ */ import_react200.default.createElement(
45982
+ ), /* @__PURE__ */ import_react201.default.createElement(MessageErrorIcon, null))
45983
+ ), showReplyCountButton && /* @__PURE__ */ import_react201.default.createElement(
45974
45984
  MessageRepliesCountButton2,
45975
45985
  {
45976
45986
  onClick: handleOpenThread,
45977
45987
  reply_count: message.reply_count
45978
45988
  }
45979
- ), 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 }))));
45989
+ ), showMetadata && /* @__PURE__ */ import_react201.default.createElement("div", { className: "str-chat__message-metadata" }, /* @__PURE__ */ import_react201.default.createElement(MessageStatus2, null), !isMyMessage() && !!message.user && /* @__PURE__ */ import_react201.default.createElement("span", { className: "str-chat__message-simple-name" }, message.user.name || message.user.id), /* @__PURE__ */ import_react201.default.createElement(MessageTimestamp2, { customClass: "str-chat__message-simple-timestamp" }), isEdited && /* @__PURE__ */ import_react201.default.createElement("span", { className: "str-chat__mesage-simple-edited" }, t("Edited")), isEdited && /* @__PURE__ */ import_react201.default.createElement(MessageEditedTimestamp, { calendar: true, open: isEditedTimestampOpen }))));
45980
45990
  };
45981
- var MemoizedMessageSimple = import_react200.default.memo(
45991
+ var MemoizedMessageSimple = import_react201.default.memo(
45982
45992
  MessageSimpleWithContext,
45983
45993
  areMessageUIPropsEqual
45984
45994
  );
45985
45995
  var MessageSimple = (props) => {
45986
45996
  const messageContext = useMessageContext("MessageSimple");
45987
- return /* @__PURE__ */ import_react200.default.createElement(MemoizedMessageSimple, { ...messageContext, ...props });
45997
+ return /* @__PURE__ */ import_react201.default.createElement(MemoizedMessageSimple, { ...messageContext, ...props });
45988
45998
  };
45989
45999
 
45990
46000
  // src/components/Message/Message.tsx
@@ -46020,11 +46030,11 @@ var MessageWithContext = (props) => {
46020
46030
  canReply,
46021
46031
  isMyMessage
46022
46032
  } = userRoles;
46023
- const messageIsUnread = (0, import_react201.useMemo)(
46033
+ const messageIsUnread = (0, import_react202.useMemo)(
46024
46034
  () => !!(!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())),
46025
46035
  [client, isMyMessage, message.created_at, read]
46026
46036
  );
46027
- const messageActionsHandler = (0, import_react201.useCallback)(
46037
+ const messageActionsHandler = (0, import_react202.useCallback)(
46028
46038
  () => getMessageActions(messageActions, {
46029
46039
  canDelete,
46030
46040
  canEdit,
@@ -46078,9 +46088,9 @@ var MessageWithContext = (props) => {
46078
46088
  onUserHover,
46079
46089
  setEditingState: setEdit
46080
46090
  };
46081
- return /* @__PURE__ */ import_react201.default.createElement(MessageProvider, { value: messageContextValue }, /* @__PURE__ */ import_react201.default.createElement(MessageUIComponent, { groupedByUser }));
46091
+ return /* @__PURE__ */ import_react202.default.createElement(MessageProvider, { value: messageContextValue }, /* @__PURE__ */ import_react202.default.createElement(MessageUIComponent, { groupedByUser }));
46082
46092
  };
46083
- var MemoizedMessage = import_react201.default.memo(
46093
+ var MemoizedMessage = import_react202.default.memo(
46084
46094
  MessageWithContext,
46085
46095
  areMessagePropsEqual
46086
46096
  );
@@ -46147,7 +46157,7 @@ var Message = (props) => {
46147
46157
  notify: addNotification
46148
46158
  });
46149
46159
  const highlighted = highlightedMessageId === message.id;
46150
- return /* @__PURE__ */ import_react201.default.createElement(
46160
+ return /* @__PURE__ */ import_react202.default.createElement(
46151
46161
  MemoizedMessage,
46152
46162
  {
46153
46163
  additionalMessageInputProps: props.additionalMessageInputProps,
@@ -46197,13 +46207,13 @@ var Message = (props) => {
46197
46207
  };
46198
46208
 
46199
46209
  // src/components/Thread/ThreadHeader.tsx
46200
- var import_react203 = __toESM(require("react"));
46210
+ var import_react204 = __toESM(require("react"));
46201
46211
 
46202
46212
  // src/components/Thread/icons.tsx
46203
- var import_react202 = __toESM(require("react"));
46213
+ var import_react203 = __toESM(require("react"));
46204
46214
  var CloseIcon3 = ({ title }) => {
46205
46215
  const { t } = useTranslationContext("CloseIcon");
46206
- return /* @__PURE__ */ import_react202.default.createElement(
46216
+ return /* @__PURE__ */ import_react203.default.createElement(
46207
46217
  "svg",
46208
46218
  {
46209
46219
  "data-testid": "close-no-outline",
@@ -46211,8 +46221,8 @@ var CloseIcon3 = ({ title }) => {
46211
46221
  viewBox: "0 0 24 24",
46212
46222
  xmlns: "http://www.w3.org/2000/svg"
46213
46223
  },
46214
- /* @__PURE__ */ import_react202.default.createElement("title", null, title ?? t("Close")),
46215
- /* @__PURE__ */ import_react202.default.createElement(
46224
+ /* @__PURE__ */ import_react203.default.createElement("title", null, title ?? t("Close")),
46225
+ /* @__PURE__ */ import_react203.default.createElement(
46216
46226
  "path",
46217
46227
  {
46218
46228
  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",
@@ -46232,7 +46242,7 @@ var ThreadHeader = (props) => {
46232
46242
  overrideImage,
46233
46243
  overrideTitle
46234
46244
  });
46235
- 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(
46245
+ return /* @__PURE__ */ import_react204.default.createElement("div", { className: "str-chat__thread-header" }, /* @__PURE__ */ import_react204.default.createElement("div", { className: "str-chat__thread-header-details" }, /* @__PURE__ */ import_react204.default.createElement("div", { className: "str-chat__thread-header-title" }, t("Thread")), /* @__PURE__ */ import_react204.default.createElement("div", { className: "str-chat__thread-header-subtitle" }, displayTitle)), /* @__PURE__ */ import_react204.default.createElement(
46236
46246
  "button",
46237
46247
  {
46238
46248
  "aria-label": t("aria/Close thread"),
@@ -46240,31 +46250,31 @@ var ThreadHeader = (props) => {
46240
46250
  "data-testid": "close-button",
46241
46251
  onClick: closeThread
46242
46252
  },
46243
- /* @__PURE__ */ import_react203.default.createElement(CloseIcon3, null)
46253
+ /* @__PURE__ */ import_react204.default.createElement(CloseIcon3, null)
46244
46254
  ));
46245
46255
  };
46246
46256
 
46247
46257
  // src/components/Thread/ThreadHead.tsx
46248
- var import_react205 = __toESM(require("react"));
46258
+ var import_react206 = __toESM(require("react"));
46249
46259
 
46250
46260
  // src/components/Thread/ThreadStart.tsx
46251
- var import_react204 = __toESM(require("react"));
46261
+ var import_react205 = __toESM(require("react"));
46252
46262
  var ThreadStart = () => {
46253
46263
  const { thread } = useChannelStateContext("ThreadStart");
46254
46264
  const { t } = useTranslationContext("ThreadStart");
46255
46265
  if (!thread?.reply_count) return null;
46256
- return /* @__PURE__ */ import_react204.default.createElement("div", { className: "str-chat__thread-start" }, t("replyCount", { count: thread.reply_count }));
46266
+ return /* @__PURE__ */ import_react205.default.createElement("div", { className: "str-chat__thread-start" }, t("replyCount", { count: thread.reply_count }));
46257
46267
  };
46258
46268
 
46259
46269
  // src/components/Thread/ThreadHead.tsx
46260
46270
  var ThreadHead = (props) => {
46261
46271
  const { ThreadStart: ThreadStart2 = ThreadStart } = useComponentContext("ThreadHead");
46262
- 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));
46272
+ return /* @__PURE__ */ import_react206.default.createElement("div", { className: "str-chat__parent-message-li" }, /* @__PURE__ */ import_react206.default.createElement(Message, { initialMessage: true, threadList: true, ...props }), /* @__PURE__ */ import_react206.default.createElement(ThreadStart2, null));
46263
46273
  };
46264
46274
 
46265
46275
  // src/components/Thread/Thread.tsx
46266
- var LegacyThreadContext = import_react206.default.createContext({ legacyThread: void 0 });
46267
- var useLegacyThreadContext = () => (0, import_react206.useContext)(LegacyThreadContext);
46276
+ var LegacyThreadContext = import_react207.default.createContext({ legacyThread: void 0 });
46277
+ var useLegacyThreadContext = () => (0, import_react207.useContext)(LegacyThreadContext);
46268
46278
  var Thread = (props) => {
46269
46279
  const { channel, channelConfig, thread } = useChannelStateContext("Thread");
46270
46280
  const threadInstance = useThreadContext();
@@ -46272,7 +46282,7 @@ var Thread = (props) => {
46272
46282
  if (channelConfig?.replies === false) return null;
46273
46283
  return (
46274
46284
  // FIXME: TS is having trouble here as at least one of the two would always be defined
46275
- /* @__PURE__ */ import_react206.default.createElement(
46285
+ /* @__PURE__ */ import_react207.default.createElement(
46276
46286
  ThreadInner,
46277
46287
  {
46278
46288
  ...props,
@@ -46323,7 +46333,7 @@ var ThreadInner = (props) => {
46323
46333
  const FallbackMessage = virtualized && VirtualMessage ? VirtualMessage : ContextMessage;
46324
46334
  const MessageUIComponent = ThreadMessage || FallbackMessage;
46325
46335
  const ThreadMessageList = virtualized ? VirtualizedMessageList : MessageList;
46326
- (0, import_react206.useEffect)(() => {
46336
+ (0, import_react207.useEffect)(() => {
46327
46337
  if (threadInstance) return;
46328
46338
  if ((thread?.reply_count ?? 0) > 0) {
46329
46339
  loadMoreThread();
@@ -46346,7 +46356,7 @@ var ThreadInner = (props) => {
46346
46356
  const threadClass = customClasses?.thread || (0, import_clsx53.default)("str-chat__thread-container str-chat__thread", {
46347
46357
  "str-chat__thread--virtualized": virtualized
46348
46358
  });
46349
- const head = /* @__PURE__ */ import_react206.default.createElement(
46359
+ const head = /* @__PURE__ */ import_react207.default.createElement(
46350
46360
  ThreadHead2,
46351
46361
  {
46352
46362
  key: messageAsThread.id,
@@ -46357,14 +46367,14 @@ var ThreadInner = (props) => {
46357
46367
  );
46358
46368
  return (
46359
46369
  // Thread component needs a context which we can use for message composer
46360
- /* @__PURE__ */ import_react206.default.createElement(
46370
+ /* @__PURE__ */ import_react207.default.createElement(
46361
46371
  LegacyThreadContext.Provider,
46362
46372
  {
46363
46373
  value: {
46364
46374
  legacyThread: thread ?? void 0
46365
46375
  }
46366
46376
  },
46367
- /* @__PURE__ */ import_react206.default.createElement("div", { className: threadClass }, /* @__PURE__ */ import_react206.default.createElement(ThreadHeader2, { closeThread, thread: messageAsThread }), /* @__PURE__ */ import_react206.default.createElement(
46377
+ /* @__PURE__ */ import_react207.default.createElement("div", { className: threadClass }, /* @__PURE__ */ import_react207.default.createElement(ThreadHeader2, { closeThread, thread: messageAsThread }), /* @__PURE__ */ import_react207.default.createElement(
46368
46378
  ThreadMessageList,
46369
46379
  {
46370
46380
  disableDateSeparator: !enableDateSeparator,
@@ -46376,7 +46386,7 @@ var ThreadInner = (props) => {
46376
46386
  ...threadProps,
46377
46387
  ...virtualized ? additionalVirtualizedMessageListProps : additionalMessageListProps
46378
46388
  }
46379
- ), /* @__PURE__ */ import_react206.default.createElement(
46389
+ ), /* @__PURE__ */ import_react207.default.createElement(
46380
46390
  MessageInput,
46381
46391
  {
46382
46392
  focus: autoFocus,
@@ -46398,15 +46408,15 @@ var useMessageComposer = () => {
46398
46408
  const { editing, message: editedMessage } = useMessageContext();
46399
46409
  const { legacyThread: parentMessage } = useLegacyThreadContext();
46400
46410
  const threadInstance = useThreadContext();
46401
- const cachedEditedMessage = (0, import_react207.useMemo)(() => {
46411
+ const cachedEditedMessage = (0, import_react208.useMemo)(() => {
46402
46412
  if (!editedMessage) return void 0;
46403
46413
  return editedMessage;
46404
46414
  }, [editedMessage?.id]);
46405
- const cachedParentMessage = (0, import_react207.useMemo)(() => {
46415
+ const cachedParentMessage = (0, import_react208.useMemo)(() => {
46406
46416
  if (!parentMessage) return void 0;
46407
46417
  return parentMessage;
46408
46418
  }, [parentMessage?.id]);
46409
- const messageComposer = (0, import_react207.useMemo)(() => {
46419
+ const messageComposer = (0, import_react208.useMemo)(() => {
46410
46420
  if (editing && cachedEditedMessage) {
46411
46421
  const tag = import_stream_chat6.MessageComposer.constructTag(cachedEditedMessage);
46412
46422
  const cachedComposer = queueCache.get(tag);
@@ -46446,7 +46456,7 @@ var useMessageComposer = () => {
46446
46456
  ) && !queueCache.peek(messageComposer.tag)) {
46447
46457
  queueCache.add(messageComposer.tag, messageComposer);
46448
46458
  }
46449
- (0, import_react207.useEffect)(() => {
46459
+ (0, import_react208.useEffect)(() => {
46450
46460
  const unsubscribe = messageComposer.registerSubscriptions();
46451
46461
  return () => {
46452
46462
  unsubscribe();
@@ -46478,24 +46488,24 @@ var useAttachmentManagerState = () => {
46478
46488
  var CHANNEL_CONTAINER_ID = "str-chat__channel";
46479
46489
 
46480
46490
  // src/components/Dialog/DialogMenu.tsx
46481
- var import_react208 = __toESM(require("react"));
46491
+ var import_react209 = __toESM(require("react"));
46482
46492
  var import_clsx54 = __toESM(require("clsx"));
46483
46493
  var DialogMenuButton = ({
46484
46494
  children,
46485
46495
  className,
46486
46496
  ...props
46487
- }) => /* @__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));
46497
+ }) => /* @__PURE__ */ import_react209.default.createElement("button", { className: (0, import_clsx54.default)("str-chat__dialog-menu__button", className), ...props }, /* @__PURE__ */ import_react209.default.createElement("div", { className: "str-chat__dialog-menu__button-icon" }), /* @__PURE__ */ import_react209.default.createElement("div", { className: "str-chat__dialog-menu__button-text" }, children));
46488
46498
 
46489
46499
  // src/context/AttachmentSelectorContext.tsx
46490
- var import_react209 = __toESM(require("react"));
46491
- var AttachmentSelectorContext = (0, import_react209.createContext)({
46500
+ var import_react210 = __toESM(require("react"));
46501
+ var AttachmentSelectorContext = (0, import_react210.createContext)({
46492
46502
  fileInput: null
46493
46503
  });
46494
46504
  var AttachmentSelectorContextProvider = ({
46495
46505
  children,
46496
46506
  value
46497
- }) => /* @__PURE__ */ import_react209.default.createElement(AttachmentSelectorContext.Provider, { value }, children);
46498
- var useAttachmentSelectorContext = () => (0, import_react209.useContext)(AttachmentSelectorContext);
46507
+ }) => /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorContext.Provider, { value }, children);
46508
+ var useAttachmentSelectorContext = () => (0, import_react210.useContext)(AttachmentSelectorContext);
46499
46509
 
46500
46510
  // src/components/MessageInput/AttachmentSelector.tsx
46501
46511
  var SimpleAttachmentSelector = () => {
@@ -46503,10 +46513,10 @@ var SimpleAttachmentSelector = () => {
46503
46513
  AttachmentSelectorInitiationButtonContents,
46504
46514
  FileUploadIcon = UploadIcon
46505
46515
  } = useComponentContext();
46506
- const inputRef = (0, import_react210.useRef)(null);
46507
- const [labelElement, setLabelElement] = (0, import_react210.useState)(null);
46508
- const id = (0, import_react210.useMemo)(() => (0, import_nanoid3.nanoid)(), []);
46509
- (0, import_react210.useEffect)(() => {
46516
+ const inputRef = (0, import_react211.useRef)(null);
46517
+ const [labelElement, setLabelElement] = (0, import_react211.useState)(null);
46518
+ const id = useStableId();
46519
+ (0, import_react211.useEffect)(() => {
46510
46520
  if (!labelElement) return;
46511
46521
  const handleKeyUp = (event) => {
46512
46522
  if (![" ", "Enter"].includes(event.key) || !inputRef.current) return;
@@ -46518,7 +46528,7 @@ var SimpleAttachmentSelector = () => {
46518
46528
  labelElement.removeEventListener("keyup", handleKeyUp);
46519
46529
  };
46520
46530
  }, [labelElement]);
46521
- 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(
46531
+ return /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__file-input-container", "data-testid": "file-upload-button" }, /* @__PURE__ */ import_react211.default.createElement(UploadFileInput, { id, ref: inputRef }), /* @__PURE__ */ import_react211.default.createElement(
46522
46532
  "label",
46523
46533
  {
46524
46534
  className: "str-chat__file-input-label",
@@ -46526,25 +46536,25 @@ var SimpleAttachmentSelector = () => {
46526
46536
  ref: setLabelElement,
46527
46537
  tabIndex: 0
46528
46538
  },
46529
- AttachmentSelectorInitiationButtonContents ? /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorInitiationButtonContents, null) : /* @__PURE__ */ import_react210.default.createElement(FileUploadIcon, null)
46539
+ AttachmentSelectorInitiationButtonContents ? /* @__PURE__ */ import_react211.default.createElement(AttachmentSelectorInitiationButtonContents, null) : /* @__PURE__ */ import_react211.default.createElement(FileUploadIcon, null)
46530
46540
  ));
46531
46541
  };
46532
46542
  var AttachmentSelectorMenuInitButtonIcon = () => {
46533
46543
  const { AttachmentSelectorInitiationButtonContents, FileUploadIcon } = useComponentContext("SimpleAttachmentSelector");
46534
46544
  if (AttachmentSelectorInitiationButtonContents) {
46535
- return /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorInitiationButtonContents, null);
46545
+ return /* @__PURE__ */ import_react211.default.createElement(AttachmentSelectorInitiationButtonContents, null);
46536
46546
  }
46537
46547
  if (FileUploadIcon) {
46538
- return /* @__PURE__ */ import_react210.default.createElement(FileUploadIcon, null);
46548
+ return /* @__PURE__ */ import_react211.default.createElement(FileUploadIcon, null);
46539
46549
  }
46540
- return /* @__PURE__ */ import_react210.default.createElement("div", { className: "str-chat__attachment-selector__menu-button__icon" });
46550
+ return /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__attachment-selector__menu-button__icon" });
46541
46551
  };
46542
46552
  var DefaultAttachmentSelectorComponents = {
46543
46553
  File({ closeMenu }) {
46544
46554
  const { t } = useTranslationContext();
46545
46555
  const { fileInput } = useAttachmentSelectorContext();
46546
46556
  const { isUploadEnabled } = useAttachmentManagerState();
46547
- return /* @__PURE__ */ import_react210.default.createElement(
46557
+ return /* @__PURE__ */ import_react211.default.createElement(
46548
46558
  DialogMenuButton,
46549
46559
  {
46550
46560
  className: "str-chat__attachment-selector-actions-menu__button str-chat__attachment-selector-actions-menu__upload-file-button",
@@ -46559,7 +46569,7 @@ var DefaultAttachmentSelectorComponents = {
46559
46569
  },
46560
46570
  Poll({ closeMenu, openModalForAction }) {
46561
46571
  const { t } = useTranslationContext();
46562
- return /* @__PURE__ */ import_react210.default.createElement(
46572
+ return /* @__PURE__ */ import_react211.default.createElement(
46563
46573
  DialogMenuButton,
46564
46574
  {
46565
46575
  className: "str-chat__attachment-selector-actions-menu__button str-chat__attachment-selector-actions-menu__create-poll-button",
@@ -46607,8 +46617,8 @@ var AttachmentSelector = ({
46607
46617
  const menuDialogId = `attachment-actions-menu${isThreadInput ? "-thread" : ""}`;
46608
46618
  const menuDialog = useDialog({ id: menuDialogId });
46609
46619
  const menuDialogIsOpen = useDialogIsOpen(menuDialogId);
46610
- const [modalContentAction, setModalContentActionAction] = (0, import_react210.useState)();
46611
- const openModal = (0, import_react210.useCallback)(
46620
+ const [modalContentAction, setModalContentActionAction] = (0, import_react211.useState)();
46621
+ const openModal = (0, import_react211.useCallback)(
46612
46622
  (actionType) => {
46613
46623
  const action = actions.find((a) => a.type === actionType);
46614
46624
  if (!action?.ModalContent) return;
@@ -46616,19 +46626,19 @@ var AttachmentSelector = ({
46616
46626
  },
46617
46627
  [actions]
46618
46628
  );
46619
- const closeModal = (0, import_react210.useCallback)(() => setModalContentActionAction(void 0), []);
46620
- const [fileInput, setFileInput] = (0, import_react210.useState)(null);
46621
- const menuButtonRef = (0, import_react210.useRef)(null);
46622
- const getDefaultPortalDestination = (0, import_react210.useCallback)(
46629
+ const closeModal = (0, import_react211.useCallback)(() => setModalContentActionAction(void 0), []);
46630
+ const [fileInput, setFileInput] = (0, import_react211.useState)(null);
46631
+ const menuButtonRef = (0, import_react211.useRef)(null);
46632
+ const getDefaultPortalDestination = (0, import_react211.useCallback)(
46623
46633
  () => document.getElementById(CHANNEL_CONTAINER_ID),
46624
46634
  []
46625
46635
  );
46626
46636
  if (actions.length === 0) return null;
46627
46637
  if (actions.length === 1 && actions[0].type === "uploadFile")
46628
- return /* @__PURE__ */ import_react210.default.createElement(SimpleAttachmentSelector, null);
46638
+ return /* @__PURE__ */ import_react211.default.createElement(SimpleAttachmentSelector, null);
46629
46639
  const ModalContent = modalContentAction?.ModalContent;
46630
46640
  const modalIsOpen = !!ModalContent;
46631
- 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(
46641
+ return /* @__PURE__ */ import_react211.default.createElement(AttachmentSelectorContextProvider, { value: { fileInput } }, /* @__PURE__ */ import_react211.default.createElement("div", { className: "str-chat__attachment-selector" }, channelCapabilities["upload-file"] && /* @__PURE__ */ import_react211.default.createElement(UploadFileInput, { ref: setFileInput }), /* @__PURE__ */ import_react211.default.createElement(
46632
46642
  "button",
46633
46643
  {
46634
46644
  "aria-expanded": menuDialogIsOpen,
@@ -46639,8 +46649,8 @@ var AttachmentSelector = ({
46639
46649
  onClick: () => menuDialog?.toggle(),
46640
46650
  ref: menuButtonRef
46641
46651
  },
46642
- /* @__PURE__ */ import_react210.default.createElement(AttachmentSelectorMenuInitButtonIcon, null)
46643
- ), /* @__PURE__ */ import_react210.default.createElement(
46652
+ /* @__PURE__ */ import_react211.default.createElement(AttachmentSelectorMenuInitButtonIcon, null)
46653
+ ), /* @__PURE__ */ import_react211.default.createElement(
46644
46654
  DialogAnchor,
46645
46655
  {
46646
46656
  id: menuDialogId,
@@ -46649,13 +46659,13 @@ var AttachmentSelector = ({
46649
46659
  tabIndex: -1,
46650
46660
  trapFocus: true
46651
46661
  },
46652
- /* @__PURE__ */ import_react210.default.createElement(
46662
+ /* @__PURE__ */ import_react211.default.createElement(
46653
46663
  "div",
46654
46664
  {
46655
46665
  className: "str-chat__attachment-selector-actions-menu str-chat__dialog-menu",
46656
46666
  "data-testid": "attachment-selector-actions-menu"
46657
46667
  },
46658
- actions.map(({ ActionButton, type }) => /* @__PURE__ */ import_react210.default.createElement(
46668
+ actions.map(({ ActionButton, type }) => /* @__PURE__ */ import_react211.default.createElement(
46659
46669
  ActionButton,
46660
46670
  {
46661
46671
  closeMenu: menuDialog.close,
@@ -46664,30 +46674,30 @@ var AttachmentSelector = ({
46664
46674
  }
46665
46675
  ))
46666
46676
  )
46667
- ), /* @__PURE__ */ import_react210.default.createElement(
46677
+ ), /* @__PURE__ */ import_react211.default.createElement(
46668
46678
  Portal,
46669
46679
  {
46670
46680
  getPortalDestination: getModalPortalDestination ?? getDefaultPortalDestination,
46671
46681
  isOpen: modalIsOpen
46672
46682
  },
46673
- /* @__PURE__ */ import_react210.default.createElement(
46683
+ /* @__PURE__ */ import_react211.default.createElement(
46674
46684
  Modal,
46675
46685
  {
46676
46686
  className: "str-chat__create-poll-modal",
46677
46687
  onClose: closeModal,
46678
46688
  open: modalIsOpen
46679
46689
  },
46680
- ModalContent && /* @__PURE__ */ import_react210.default.createElement(ModalContent, { close: closeModal })
46690
+ ModalContent && /* @__PURE__ */ import_react211.default.createElement(ModalContent, { close: closeModal })
46681
46691
  )
46682
46692
  )));
46683
46693
  };
46684
46694
 
46685
46695
  // src/components/MessageInput/AttachmentPreviewList/AttachmentPreviewList.tsx
46686
- var import_react228 = __toESM(require("react"));
46696
+ var import_react229 = __toESM(require("react"));
46687
46697
  var import_stream_chat9 = require("stream-chat");
46688
46698
 
46689
46699
  // src/components/MessageInput/AttachmentPreviewList/UnsupportedAttachmentPreview.tsx
46690
- var import_react211 = __toESM(require("react"));
46700
+ var import_react212 = __toESM(require("react"));
46691
46701
  var import_stream_chat7 = require("stream-chat");
46692
46702
  var UnsupportedAttachmentPreview = ({
46693
46703
  attachment,
@@ -46696,14 +46706,14 @@ var UnsupportedAttachmentPreview = ({
46696
46706
  }) => {
46697
46707
  const { t } = useTranslationContext("UnsupportedAttachmentPreview");
46698
46708
  const title = attachment.title ?? t("Unsupported attachment");
46699
- return /* @__PURE__ */ import_react211.default.createElement(
46709
+ return /* @__PURE__ */ import_react212.default.createElement(
46700
46710
  "div",
46701
46711
  {
46702
46712
  className: "str-chat__attachment-preview-unsupported",
46703
46713
  "data-testid": "attachment-preview-unknown"
46704
46714
  },
46705
- /* @__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 })),
46706
- /* @__PURE__ */ import_react211.default.createElement(
46715
+ /* @__PURE__ */ import_react212.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react212.default.createElement(FileIcon, { filename: title, mimeType: attachment.mime_type })),
46716
+ /* @__PURE__ */ import_react212.default.createElement(
46707
46717
  "button",
46708
46718
  {
46709
46719
  "aria-label": t("aria/Remove attachment"),
@@ -46712,18 +46722,18 @@ var UnsupportedAttachmentPreview = ({
46712
46722
  disabled: attachment.localMetadata?.uploadState === "uploading",
46713
46723
  onClick: () => attachment.localMetadata?.id && removeAttachments([attachment.localMetadata?.id])
46714
46724
  },
46715
- /* @__PURE__ */ import_react211.default.createElement(CloseIcon, null)
46725
+ /* @__PURE__ */ import_react212.default.createElement(CloseIcon, null)
46716
46726
  ),
46717
- (0, import_stream_chat7.isLocalUploadAttachment)(attachment) && ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react211.default.createElement(
46727
+ (0, import_stream_chat7.isLocalUploadAttachment)(attachment) && ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react212.default.createElement(
46718
46728
  "button",
46719
46729
  {
46720
46730
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-file",
46721
46731
  "data-testid": "file-preview-item-retry-button",
46722
46732
  onClick: () => handleRetry(attachment)
46723
46733
  },
46724
- /* @__PURE__ */ import_react211.default.createElement(RetryIcon, null)
46734
+ /* @__PURE__ */ import_react212.default.createElement(RetryIcon, null)
46725
46735
  ),
46726
- /* @__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(
46736
+ /* @__PURE__ */ import_react212.default.createElement("div", { className: "str-chat__attachment-preview-metadata" }, /* @__PURE__ */ import_react212.default.createElement("div", { className: "str-chat__attachment-preview-title", title }, title), attachment.localMetadata?.uploadState === "finished" && !!attachment.asset_url && /* @__PURE__ */ import_react212.default.createElement(
46727
46737
  "a",
46728
46738
  {
46729
46739
  className: "str-chat__attachment-preview-file-download",
@@ -46732,16 +46742,16 @@ var UnsupportedAttachmentPreview = ({
46732
46742
  rel: "noreferrer",
46733
46743
  target: "_blank"
46734
46744
  },
46735
- /* @__PURE__ */ import_react211.default.createElement(DownloadIcon2, null)
46736
- ), attachment.localMetadata?.uploadState === "uploading" && /* @__PURE__ */ import_react211.default.createElement(LoadingIndicatorIcon, { size: 17 }))
46745
+ /* @__PURE__ */ import_react212.default.createElement(DownloadIcon2, null)
46746
+ ), attachment.localMetadata?.uploadState === "uploading" && /* @__PURE__ */ import_react212.default.createElement(LoadingIndicatorIcon, { size: 17 }))
46737
46747
  );
46738
46748
  };
46739
46749
 
46740
46750
  // src/components/MessageInput/AttachmentPreviewList/VoiceRecordingPreview.tsx
46741
- var import_react219 = __toESM(require("react"));
46751
+ var import_react220 = __toESM(require("react"));
46742
46752
 
46743
46753
  // src/components/MediaRecorder/RecordingPermissionDeniedNotification.tsx
46744
- var import_react212 = __toESM(require("react"));
46754
+ var import_react213 = __toESM(require("react"));
46745
46755
  var RecordingPermissionDeniedNotification = ({
46746
46756
  onClose,
46747
46757
  permissionName
@@ -46757,7 +46767,7 @@ var RecordingPermissionDeniedNotification = ({
46757
46767
  microphone: t("Allow access to microphone")
46758
46768
  }
46759
46769
  };
46760
- 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(
46770
+ return /* @__PURE__ */ import_react213.default.createElement("div", { className: "str-chat__recording-permission-denied-notification" }, /* @__PURE__ */ import_react213.default.createElement("div", { className: "str-chat__recording-permission-denied-notification__heading" }, permissionTranslations.heading[permissionName]), /* @__PURE__ */ import_react213.default.createElement("p", { className: "str-chat__recording-permission-denied-notification__message" }, permissionTranslations.body[permissionName]), /* @__PURE__ */ import_react213.default.createElement("div", { className: "str-chat__recording-permission-denied-notification__dismiss-button-container" }, /* @__PURE__ */ import_react213.default.createElement(
46761
46771
  "button",
46762
46772
  {
46763
46773
  className: "str-chat__recording-permission-denied-notification__dismiss-button",
@@ -46768,15 +46778,15 @@ var RecordingPermissionDeniedNotification = ({
46768
46778
  };
46769
46779
 
46770
46780
  // src/components/MediaRecorder/AudioRecorder/AudioRecorder.tsx
46771
- var import_react217 = __toESM(require("react"));
46781
+ var import_react218 = __toESM(require("react"));
46772
46782
 
46773
46783
  // src/components/MediaRecorder/AudioRecorder/AudioRecordingPreview.tsx
46774
- var import_react214 = __toESM(require("react"));
46784
+ var import_react215 = __toESM(require("react"));
46775
46785
 
46776
46786
  // src/components/MediaRecorder/AudioRecorder/RecordingTimer.tsx
46777
46787
  var import_clsx55 = __toESM(require("clsx"));
46778
- var import_react213 = __toESM(require("react"));
46779
- var RecordingTimer = ({ durationSeconds }) => /* @__PURE__ */ import_react213.default.createElement(
46788
+ var import_react214 = __toESM(require("react"));
46789
+ var RecordingTimer = ({ durationSeconds }) => /* @__PURE__ */ import_react214.default.createElement(
46780
46790
  "div",
46781
46791
  {
46782
46792
  className: (0, import_clsx55.default)("str-chat__recording-timer", {
@@ -46798,15 +46808,15 @@ var AudioRecordingPreview = ({
46798
46808
  mimeType
46799
46809
  });
46800
46810
  const displayedDuration = secondsElapsed || durationSeconds;
46801
- 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(
46811
+ return /* @__PURE__ */ import_react215.default.createElement(import_react215.default.Fragment, null, /* @__PURE__ */ import_react215.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react215.default.createElement("source", { src: props.src, type: mimeType })), /* @__PURE__ */ import_react215.default.createElement(
46802
46812
  "button",
46803
46813
  {
46804
46814
  className: "str-chat__audio_recorder__toggle-playback-button",
46805
46815
  "data-testid": "audio-recording-preview-toggle-play-btn",
46806
46816
  onClick: togglePlay
46807
46817
  },
46808
- isPlaying ? /* @__PURE__ */ import_react214.default.createElement(PauseIcon2, null) : /* @__PURE__ */ import_react214.default.createElement(PlayIcon, null)
46809
- ), /* @__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(
46818
+ isPlaying ? /* @__PURE__ */ import_react215.default.createElement(PauseIcon2, null) : /* @__PURE__ */ import_react215.default.createElement(PlayIcon, null)
46819
+ ), /* @__PURE__ */ import_react215.default.createElement(RecordingTimer, { durationSeconds: displayedDuration }), /* @__PURE__ */ import_react215.default.createElement("div", { className: "str-chat__wave-progress-bar__track-container" }, /* @__PURE__ */ import_react215.default.createElement(
46810
46820
  WaveProgressBar,
46811
46821
  {
46812
46822
  progress,
@@ -46817,24 +46827,24 @@ var AudioRecordingPreview = ({
46817
46827
  };
46818
46828
 
46819
46829
  // src/components/MediaRecorder/AudioRecorder/AudioRecordingInProgress.tsx
46820
- var import_react216 = __toESM(require("react"));
46830
+ var import_react217 = __toESM(require("react"));
46821
46831
 
46822
46832
  // src/components/MediaRecorder/AudioRecorder/hooks/useTimeElapsed.ts
46823
- var import_react215 = require("react");
46833
+ var import_react216 = require("react");
46824
46834
  var useTimeElapsed = ({ startOnMount } = {}) => {
46825
- const [secondsElapsed, setSecondsElapsed] = (0, import_react215.useState)(0);
46826
- const updateInterval = (0, import_react215.useRef)(void 0);
46827
- const startCounter = (0, import_react215.useCallback)(() => {
46835
+ const [secondsElapsed, setSecondsElapsed] = (0, import_react216.useState)(0);
46836
+ const updateInterval = (0, import_react216.useRef)(void 0);
46837
+ const startCounter = (0, import_react216.useCallback)(() => {
46828
46838
  if (updateInterval.current) return;
46829
46839
  updateInterval.current = setInterval(() => {
46830
46840
  setSecondsElapsed((prev) => prev + 1);
46831
46841
  }, 1e3);
46832
46842
  }, []);
46833
- const stopCounter = (0, import_react215.useCallback)(() => {
46843
+ const stopCounter = (0, import_react216.useCallback)(() => {
46834
46844
  clearInterval(updateInterval.current);
46835
46845
  updateInterval.current = void 0;
46836
46846
  }, []);
46837
- (0, import_react215.useEffect)(() => {
46847
+ (0, import_react216.useEffect)(() => {
46838
46848
  if (!startOnMount) return;
46839
46849
  startCounter();
46840
46850
  return () => {
@@ -46853,8 +46863,8 @@ var AudioRecordingWaveform = ({ maxDataPointsDrawn = 100 }) => {
46853
46863
  const {
46854
46864
  recordingController: { recorder }
46855
46865
  } = useMessageInputContext();
46856
- const [amplitudes, setAmplitudes] = (0, import_react216.useState)([]);
46857
- (0, import_react216.useEffect)(() => {
46866
+ const [amplitudes, setAmplitudes] = (0, import_react217.useState)([]);
46867
+ (0, import_react217.useEffect)(() => {
46858
46868
  if (!recorder?.amplitudeRecorder) return;
46859
46869
  const amplitudesSubscription = recorder.amplitudeRecorder.amplitudes.subscribe(setAmplitudes);
46860
46870
  return () => {
@@ -46862,7 +46872,7 @@ var AudioRecordingWaveform = ({ maxDataPointsDrawn = 100 }) => {
46862
46872
  };
46863
46873
  }, [recorder]);
46864
46874
  if (!recorder) return null;
46865
- 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(
46875
+ return /* @__PURE__ */ import_react217.default.createElement("div", { className: "str-chat__waveform-box-container" }, /* @__PURE__ */ import_react217.default.createElement("div", { className: "str-chat__audio_recorder__waveform-box" }, amplitudes.slice(-maxDataPointsDrawn).map((amplitude, i) => /* @__PURE__ */ import_react217.default.createElement(
46866
46876
  "div",
46867
46877
  {
46868
46878
  className: "str-chat__wave-progress-bar__amplitude-bar",
@@ -46878,7 +46888,7 @@ var AudioRecordingInProgress = () => {
46878
46888
  const {
46879
46889
  recordingController: { recorder }
46880
46890
  } = useMessageInputContext();
46881
- (0, import_react216.useEffect)(() => {
46891
+ (0, import_react217.useEffect)(() => {
46882
46892
  if (!recorder?.mediaRecorder) return;
46883
46893
  const { mediaRecorder } = recorder;
46884
46894
  if (mediaRecorder.state === "recording") {
@@ -46895,7 +46905,7 @@ var AudioRecordingInProgress = () => {
46895
46905
  mediaRecorder.removeEventListener("pause", stopCounter);
46896
46906
  };
46897
46907
  }, [recorder, startCounter, stopCounter]);
46898
- 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));
46908
+ return /* @__PURE__ */ import_react217.default.createElement(import_react217.default.Fragment, null, /* @__PURE__ */ import_react217.default.createElement(RecordingTimer, { durationSeconds: secondsElapsed }), /* @__PURE__ */ import_react217.default.createElement(AudioRecordingWaveform, null));
46899
46909
  };
46900
46910
 
46901
46911
  // src/components/MediaRecorder/observable/Subscription.ts
@@ -47075,7 +47085,7 @@ var BrowserPermission = class {
47075
47085
 
47076
47086
  // src/components/MediaRecorder/classes/MediaRecorderController.ts
47077
47087
  var import_fix_webm_duration = __toESM(require("fix-webm-duration"));
47078
- var import_nanoid4 = require("nanoid");
47088
+ var import_nanoid5 = require("nanoid");
47079
47089
 
47080
47090
  // src/utils/mergeDeep.ts
47081
47091
  var import_lodash18 = __toESM(require("lodash.mergewith"));
@@ -47353,7 +47363,7 @@ var MediaRecorderController = class {
47353
47363
  file_size: blob.size,
47354
47364
  localMetadata: {
47355
47365
  file,
47356
- id: (0, import_nanoid4.nanoid)()
47366
+ id: (0, import_nanoid5.nanoid)()
47357
47367
  },
47358
47368
  mime_type: blob.type,
47359
47369
  title: file.name,
@@ -47542,7 +47552,7 @@ var AudioRecorder = () => {
47542
47552
  recordingController: { completeRecording, recorder, recording, recordingState }
47543
47553
  } = messageInputContext;
47544
47554
  const isUploadingFile = recording?.localMetadata?.uploadState === "uploading";
47545
- const state = (0, import_react217.useMemo)(
47555
+ const state = (0, import_react218.useMemo)(
47546
47556
  () => ({
47547
47557
  paused: recordingState === "paused" /* PAUSED */,
47548
47558
  recording: recordingState === "recording" /* RECORDING */,
@@ -47551,7 +47561,7 @@ var AudioRecorder = () => {
47551
47561
  [recordingState]
47552
47562
  );
47553
47563
  if (!recorder) return null;
47554
- 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(
47564
+ return /* @__PURE__ */ import_react218.default.createElement("div", { className: "str-chat__audio_recorder-container" }, /* @__PURE__ */ import_react218.default.createElement("div", { className: "str-chat__audio_recorder", "data-testid": "audio-recorder" }, /* @__PURE__ */ import_react218.default.createElement(
47555
47565
  "button",
47556
47566
  {
47557
47567
  className: "str-chat__audio_recorder__cancel-button",
@@ -47559,8 +47569,8 @@ var AudioRecorder = () => {
47559
47569
  disabled: isUploadingFile,
47560
47570
  onClick: recorder.cancel
47561
47571
  },
47562
- /* @__PURE__ */ import_react217.default.createElement(BinIcon, null)
47563
- ), state.stopped && recording?.asset_url ? /* @__PURE__ */ import_react217.default.createElement(
47572
+ /* @__PURE__ */ import_react218.default.createElement(BinIcon, null)
47573
+ ), state.stopped && recording?.asset_url ? /* @__PURE__ */ import_react218.default.createElement(
47564
47574
  AudioRecordingPreview,
47565
47575
  {
47566
47576
  durationSeconds: recording.duration ?? 0,
@@ -47568,22 +47578,22 @@ var AudioRecorder = () => {
47568
47578
  src: recording.asset_url,
47569
47579
  waveformData: recording.waveform_data
47570
47580
  }
47571
- ) : state.paused || state.recording ? /* @__PURE__ */ import_react217.default.createElement(AudioRecordingInProgress, null) : null, state.paused && /* @__PURE__ */ import_react217.default.createElement(
47581
+ ) : state.paused || state.recording ? /* @__PURE__ */ import_react218.default.createElement(AudioRecordingInProgress, null) : null, state.paused && /* @__PURE__ */ import_react218.default.createElement(
47572
47582
  "button",
47573
47583
  {
47574
47584
  className: "str-chat__audio_recorder__resume-recording-button",
47575
47585
  onClick: recorder.resume
47576
47586
  },
47577
- /* @__PURE__ */ import_react217.default.createElement(MicIcon, null)
47578
- ), state.recording && /* @__PURE__ */ import_react217.default.createElement(
47587
+ /* @__PURE__ */ import_react218.default.createElement(MicIcon, null)
47588
+ ), state.recording && /* @__PURE__ */ import_react218.default.createElement(
47579
47589
  "button",
47580
47590
  {
47581
47591
  className: "str-chat__audio_recorder__pause-recording-button",
47582
47592
  "data-testid": "pause-recording-audio-button",
47583
47593
  onClick: recorder.pause
47584
47594
  },
47585
- /* @__PURE__ */ import_react217.default.createElement(PauseIcon2, null)
47586
- ), state.stopped ? /* @__PURE__ */ import_react217.default.createElement(
47595
+ /* @__PURE__ */ import_react218.default.createElement(PauseIcon2, null)
47596
+ ), state.stopped ? /* @__PURE__ */ import_react218.default.createElement(
47587
47597
  "button",
47588
47598
  {
47589
47599
  className: "str-chat__audio_recorder__complete-button",
@@ -47591,21 +47601,21 @@ var AudioRecorder = () => {
47591
47601
  disabled: isUploadingFile,
47592
47602
  onClick: completeRecording
47593
47603
  },
47594
- isUploadingFile ? /* @__PURE__ */ import_react217.default.createElement(LoadingIndicatorIcon, null) : /* @__PURE__ */ import_react217.default.createElement(SendIcon, null)
47595
- ) : /* @__PURE__ */ import_react217.default.createElement(
47604
+ isUploadingFile ? /* @__PURE__ */ import_react218.default.createElement(LoadingIndicatorIcon, null) : /* @__PURE__ */ import_react218.default.createElement(SendIcon, null)
47605
+ ) : /* @__PURE__ */ import_react218.default.createElement(
47596
47606
  "button",
47597
47607
  {
47598
47608
  className: "str-chat__audio_recorder__stop-button",
47599
47609
  "data-testid": "audio-recorder-stop-button",
47600
47610
  onClick: recorder.stop
47601
47611
  },
47602
- /* @__PURE__ */ import_react217.default.createElement(CheckSignIcon, null)
47612
+ /* @__PURE__ */ import_react218.default.createElement(CheckSignIcon, null)
47603
47613
  )));
47604
47614
  };
47605
47615
 
47606
47616
  // src/components/MediaRecorder/AudioRecorder/AudioRecordingButtons.tsx
47607
- var import_react218 = __toESM(require("react"));
47608
- var StartRecordingAudioButton = (props) => /* @__PURE__ */ import_react218.default.createElement(
47617
+ var import_react219 = __toESM(require("react"));
47618
+ var StartRecordingAudioButton = (props) => /* @__PURE__ */ import_react219.default.createElement(
47609
47619
  "button",
47610
47620
  {
47611
47621
  "aria-label": "Start recording audio",
@@ -47613,7 +47623,7 @@ var StartRecordingAudioButton = (props) => /* @__PURE__ */ import_react218.defau
47613
47623
  "data-testid": "start-recording-audio-button",
47614
47624
  ...props
47615
47625
  },
47616
- /* @__PURE__ */ import_react218.default.createElement(MicIcon, null)
47626
+ /* @__PURE__ */ import_react219.default.createElement(MicIcon, null)
47617
47627
  );
47618
47628
 
47619
47629
  // src/components/MessageInput/AttachmentPreviewList/VoiceRecordingPreview.tsx
@@ -47626,13 +47636,13 @@ var VoiceRecordingPreview = ({
47626
47636
  const { audioRef, isPlaying, secondsElapsed, togglePlay } = useAudioController({
47627
47637
  mimeType: attachment.mime_type
47628
47638
  });
47629
- return /* @__PURE__ */ import_react219.default.createElement(
47639
+ return /* @__PURE__ */ import_react220.default.createElement(
47630
47640
  "div",
47631
47641
  {
47632
47642
  className: "str-chat__attachment-preview-voice-recording",
47633
47643
  "data-testid": "attachment-preview-voice-recording"
47634
47644
  },
47635
- /* @__PURE__ */ import_react219.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react219.default.createElement(
47645
+ /* @__PURE__ */ import_react220.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react220.default.createElement(
47636
47646
  "source",
47637
47647
  {
47638
47648
  "data-testid": "audio-source",
@@ -47640,8 +47650,8 @@ var VoiceRecordingPreview = ({
47640
47650
  type: attachment.mime_type
47641
47651
  }
47642
47652
  )),
47643
- /* @__PURE__ */ import_react219.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }),
47644
- /* @__PURE__ */ import_react219.default.createElement(
47653
+ /* @__PURE__ */ import_react220.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }),
47654
+ /* @__PURE__ */ import_react220.default.createElement(
47645
47655
  "button",
47646
47656
  {
47647
47657
  "aria-label": t("aria/Remove attachment"),
@@ -47650,24 +47660,24 @@ var VoiceRecordingPreview = ({
47650
47660
  disabled: attachment.localMetadata?.uploadState === "uploading",
47651
47661
  onClick: () => attachment.localMetadata?.id && removeAttachments([attachment.localMetadata.id])
47652
47662
  },
47653
- /* @__PURE__ */ import_react219.default.createElement(CloseIcon, null)
47663
+ /* @__PURE__ */ import_react220.default.createElement(CloseIcon, null)
47654
47664
  ),
47655
- ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react219.default.createElement(
47665
+ ["blocked", "failed"].includes(attachment.localMetadata?.uploadState) && !!handleRetry && /* @__PURE__ */ import_react220.default.createElement(
47656
47666
  "button",
47657
47667
  {
47658
47668
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-file",
47659
47669
  "data-testid": "file-preview-item-retry-button",
47660
47670
  onClick: () => handleRetry(attachment)
47661
47671
  },
47662
- /* @__PURE__ */ import_react219.default.createElement(RetryIcon, null)
47672
+ /* @__PURE__ */ import_react220.default.createElement(RetryIcon, null)
47663
47673
  ),
47664
- /* @__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 })),
47665
- /* @__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 }))
47674
+ /* @__PURE__ */ import_react220.default.createElement("div", { className: "str-chat__attachment-preview-metadata" }, /* @__PURE__ */ import_react220.default.createElement("div", { className: "str-chat__attachment-preview-file-name", title: attachment.title }, attachment.title), typeof attachment.duration !== "undefined" && /* @__PURE__ */ import_react220.default.createElement(RecordingTimer, { durationSeconds: secondsElapsed || attachment.duration }), attachment.localMetadata?.uploadState === "uploading" && /* @__PURE__ */ import_react220.default.createElement(LoadingIndicatorIcon, { size: 17 })),
47675
+ /* @__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 }))
47666
47676
  );
47667
47677
  };
47668
47678
 
47669
47679
  // src/components/MessageInput/AttachmentPreviewList/FileAttachmentPreview.tsx
47670
- var import_react220 = __toESM(require("react"));
47680
+ var import_react221 = __toESM(require("react"));
47671
47681
  var FileAttachmentPreview = ({
47672
47682
  attachment,
47673
47683
  handleRetry,
@@ -47675,14 +47685,14 @@ var FileAttachmentPreview = ({
47675
47685
  }) => {
47676
47686
  const { t } = useTranslationContext("FilePreview");
47677
47687
  const uploadState = attachment.localMetadata?.uploadState;
47678
- return /* @__PURE__ */ import_react220.default.createElement(
47688
+ return /* @__PURE__ */ import_react221.default.createElement(
47679
47689
  "div",
47680
47690
  {
47681
47691
  className: "str-chat__attachment-preview-file",
47682
47692
  "data-testid": "attachment-preview-file"
47683
47693
  },
47684
- /* @__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 })),
47685
- /* @__PURE__ */ import_react220.default.createElement(
47694
+ /* @__PURE__ */ import_react221.default.createElement("div", { className: "str-chat__attachment-preview-file-icon" }, /* @__PURE__ */ import_react221.default.createElement(FileIcon, { filename: attachment.title, mimeType: attachment.mime_type })),
47695
+ /* @__PURE__ */ import_react221.default.createElement(
47686
47696
  "button",
47687
47697
  {
47688
47698
  "aria-label": t("aria/Remove attachment"),
@@ -47691,9 +47701,9 @@ var FileAttachmentPreview = ({
47691
47701
  disabled: uploadState === "uploading",
47692
47702
  onClick: () => attachment.localMetadata?.id && removeAttachments([attachment.localMetadata?.id])
47693
47703
  },
47694
- /* @__PURE__ */ import_react220.default.createElement(CloseIcon, null)
47704
+ /* @__PURE__ */ import_react221.default.createElement(CloseIcon, null)
47695
47705
  ),
47696
- ["blocked", "failed"].includes(uploadState) && !!handleRetry && /* @__PURE__ */ import_react220.default.createElement(
47706
+ ["blocked", "failed"].includes(uploadState) && !!handleRetry && /* @__PURE__ */ import_react221.default.createElement(
47697
47707
  "button",
47698
47708
  {
47699
47709
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-file",
@@ -47702,9 +47712,9 @@ var FileAttachmentPreview = ({
47702
47712
  handleRetry(attachment);
47703
47713
  }
47704
47714
  },
47705
- /* @__PURE__ */ import_react220.default.createElement(RetryIcon, null)
47715
+ /* @__PURE__ */ import_react221.default.createElement(RetryIcon, null)
47706
47716
  ),
47707
- /* @__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(
47717
+ /* @__PURE__ */ import_react221.default.createElement("div", { className: "str-chat__attachment-preview-file-end" }, /* @__PURE__ */ import_react221.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_react221.default.createElement(
47708
47718
  "a",
47709
47719
  {
47710
47720
  "aria-label": t("aria/Download attachment"),
@@ -47715,14 +47725,14 @@ var FileAttachmentPreview = ({
47715
47725
  target: "_blank",
47716
47726
  title: t("Download attachment {{ name }}", { name: attachment.title })
47717
47727
  },
47718
- /* @__PURE__ */ import_react220.default.createElement(DownloadIcon2, null)
47719
- ), uploadState === "uploading" && /* @__PURE__ */ import_react220.default.createElement(LoadingIndicatorIcon, { size: 17 }))
47728
+ /* @__PURE__ */ import_react221.default.createElement(DownloadIcon2, null)
47729
+ ), uploadState === "uploading" && /* @__PURE__ */ import_react221.default.createElement(LoadingIndicatorIcon, { size: 17 }))
47720
47730
  );
47721
47731
  };
47722
47732
 
47723
47733
  // src/components/MessageInput/AttachmentPreviewList/ImageAttachmentPreview.tsx
47724
47734
  var import_clsx56 = __toESM(require("clsx"));
47725
- var import_react221 = __toESM(require("react"));
47735
+ var import_react222 = __toESM(require("react"));
47726
47736
  var ImageAttachmentPreview = ({
47727
47737
  attachment,
47728
47738
  handleRetry,
@@ -47730,11 +47740,11 @@ var ImageAttachmentPreview = ({
47730
47740
  }) => {
47731
47741
  const { t } = useTranslationContext("ImagePreviewItem");
47732
47742
  const { BaseImage: BaseImage3 = BaseImage } = useComponentContext("ImagePreview");
47733
- const [previewError, setPreviewError] = (0, import_react221.useState)(false);
47743
+ const [previewError, setPreviewError] = (0, import_react222.useState)(false);
47734
47744
  const { id, uploadState } = attachment.localMetadata ?? {};
47735
- const handleLoadError = (0, import_react221.useCallback)(() => setPreviewError(true), []);
47745
+ const handleLoadError = (0, import_react222.useCallback)(() => setPreviewError(true), []);
47736
47746
  const assetUrl = attachment.image_url || attachment.localMetadata.previewUri;
47737
- return /* @__PURE__ */ import_react221.default.createElement(
47747
+ return /* @__PURE__ */ import_react222.default.createElement(
47738
47748
  "div",
47739
47749
  {
47740
47750
  className: (0, import_clsx56.default)("str-chat__attachment-preview-image", {
@@ -47742,7 +47752,7 @@ var ImageAttachmentPreview = ({
47742
47752
  }),
47743
47753
  "data-testid": "attachment-preview-image"
47744
47754
  },
47745
- /* @__PURE__ */ import_react221.default.createElement(
47755
+ /* @__PURE__ */ import_react222.default.createElement(
47746
47756
  "button",
47747
47757
  {
47748
47758
  "aria-label": t("aria/Remove attachment"),
@@ -47751,19 +47761,19 @@ var ImageAttachmentPreview = ({
47751
47761
  disabled: uploadState === "uploading",
47752
47762
  onClick: () => id && removeAttachments([id])
47753
47763
  },
47754
- /* @__PURE__ */ import_react221.default.createElement(CloseIcon, null)
47764
+ /* @__PURE__ */ import_react222.default.createElement(CloseIcon, null)
47755
47765
  ),
47756
- ["blocked", "failed"].includes(uploadState) && /* @__PURE__ */ import_react221.default.createElement(
47766
+ ["blocked", "failed"].includes(uploadState) && /* @__PURE__ */ import_react222.default.createElement(
47757
47767
  "button",
47758
47768
  {
47759
47769
  className: "str-chat__attachment-preview-error str-chat__attachment-preview-error-image",
47760
47770
  "data-testid": "image-preview-item-retry-button",
47761
47771
  onClick: () => handleRetry(attachment)
47762
47772
  },
47763
- /* @__PURE__ */ import_react221.default.createElement(RetryIcon, null)
47773
+ /* @__PURE__ */ import_react222.default.createElement(RetryIcon, null)
47764
47774
  ),
47765
- uploadState === "uploading" && /* @__PURE__ */ import_react221.default.createElement("div", { className: "str-chat__attachment-preview-image-loading" }, /* @__PURE__ */ import_react221.default.createElement(LoadingIndicatorIcon, { size: 17 })),
47766
- assetUrl && /* @__PURE__ */ import_react221.default.createElement(
47775
+ uploadState === "uploading" && /* @__PURE__ */ import_react222.default.createElement("div", { className: "str-chat__attachment-preview-image-loading" }, /* @__PURE__ */ import_react222.default.createElement(LoadingIndicatorIcon, { size: 17 })),
47776
+ assetUrl && /* @__PURE__ */ import_react222.default.createElement(
47767
47777
  BaseImage3,
47768
47778
  {
47769
47779
  alt: attachment.fallback,
@@ -47777,11 +47787,11 @@ var ImageAttachmentPreview = ({
47777
47787
  };
47778
47788
 
47779
47789
  // src/components/MessageInput/hooks/useCanCreatePoll.ts
47780
- var import_react222 = require("react");
47790
+ var import_react223 = require("react");
47781
47791
  var useCanCreatePoll = () => {
47782
47792
  const { pollComposer } = useMessageComposer();
47783
- const [canCreatePoll, setCanCreatePoll] = (0, import_react222.useState)(pollComposer.canCreatePoll);
47784
- (0, import_react222.useEffect)(
47793
+ const [canCreatePoll, setCanCreatePoll] = (0, import_react223.useState)(pollComposer.canCreatePoll);
47794
+ (0, import_react223.useEffect)(
47785
47795
  () => pollComposer.state.subscribe(() => {
47786
47796
  setCanCreatePoll(pollComposer.canCreatePoll);
47787
47797
  }),
@@ -47791,20 +47801,20 @@ var useCanCreatePoll = () => {
47791
47801
  };
47792
47802
 
47793
47803
  // src/components/MessageInput/hooks/useCooldownTimer.tsx
47794
- var import_react223 = require("react");
47804
+ var import_react224 = require("react");
47795
47805
  var useCooldownTimer = () => {
47796
47806
  const { client, latestMessageDatesByChannels } = useChatContext("useCooldownTimer");
47797
47807
  const { channel, messages = [] } = useChannelStateContext("useCooldownTimer");
47798
- const [cooldownRemaining, setCooldownRemaining] = (0, import_react223.useState)();
47808
+ const [cooldownRemaining, setCooldownRemaining] = (0, import_react224.useState)();
47799
47809
  const { cooldown: cooldownInterval = 0, own_capabilities } = channel.data || {};
47800
47810
  const skipCooldown = own_capabilities?.includes("skip-slow-mode");
47801
- const ownLatestMessageDate = (0, import_react223.useMemo)(
47811
+ const ownLatestMessageDate = (0, import_react224.useMemo)(
47802
47812
  () => latestMessageDatesByChannels[channel.cid] ?? [...messages].sort(
47803
47813
  (a, b) => b.created_at?.getTime() - a.created_at?.getTime()
47804
47814
  ).find((v) => v.user?.id === client.user?.id)?.created_at,
47805
47815
  [messages, client.user?.id, latestMessageDatesByChannels, channel.cid]
47806
47816
  );
47807
- (0, import_react223.useEffect)(() => {
47817
+ (0, import_react224.useEffect)(() => {
47808
47818
  const timeSinceOwnLastMessage = ownLatestMessageDate ? (
47809
47819
  // prevent negative values
47810
47820
  Math.max(0, ((/* @__PURE__ */ new Date()).getTime() - ownLatestMessageDate.getTime()) / 1e3)
@@ -47827,11 +47837,11 @@ var useCooldownTimer = () => {
47827
47837
  };
47828
47838
 
47829
47839
  // src/components/MessageInput/hooks/useTextareaRef.ts
47830
- var import_react224 = require("react");
47840
+ var import_react225 = require("react");
47831
47841
  var useTextareaRef = (props) => {
47832
47842
  const { focus } = props;
47833
- const textareaRef = (0, import_react224.useRef)(void 0);
47834
- (0, import_react224.useEffect)(() => {
47843
+ const textareaRef = (0, import_react225.useRef)(void 0);
47844
+ (0, import_react225.useEffect)(() => {
47835
47845
  if (focus && textareaRef.current) {
47836
47846
  textareaRef.current.focus();
47837
47847
  }
@@ -47842,7 +47852,7 @@ var useTextareaRef = (props) => {
47842
47852
  };
47843
47853
 
47844
47854
  // src/components/MessageInput/hooks/useSubmitHandler.ts
47845
- var import_react225 = require("react");
47855
+ var import_react226 = require("react");
47846
47856
  var import_stream_chat8 = require("stream-chat");
47847
47857
  var takeStateSnapshot = (messageComposer) => {
47848
47858
  const textComposerState = messageComposer.textComposer.state.getLatestValue();
@@ -47865,7 +47875,7 @@ var useSubmitHandler = (props) => {
47865
47875
  const { addNotification, editMessage, sendMessage } = useChannelActionContext("useSubmitHandler");
47866
47876
  const { t } = useTranslationContext("useSubmitHandler");
47867
47877
  const messageComposer = useMessageComposer();
47868
- const handleSubmit = (0, import_react225.useCallback)(
47878
+ const handleSubmit = (0, import_react226.useCallback)(
47869
47879
  async (event) => {
47870
47880
  event?.preventDefault();
47871
47881
  const composition = await messageComposer.compose();
@@ -47922,10 +47932,10 @@ var useSubmitHandler = (props) => {
47922
47932
  };
47923
47933
 
47924
47934
  // src/components/MessageInput/hooks/usePasteHandler.ts
47925
- var import_react226 = require("react");
47935
+ var import_react227 = require("react");
47926
47936
  var usePasteHandler = () => {
47927
47937
  const { attachmentManager, textComposer } = useMessageComposer();
47928
- const onPaste = (0, import_react226.useCallback)(
47938
+ const onPaste = (0, import_react227.useCallback)(
47929
47939
  (clipboardEvent) => {
47930
47940
  (async (event) => {
47931
47941
  const { items } = event.clipboardData;
@@ -47957,7 +47967,7 @@ var usePasteHandler = () => {
47957
47967
  };
47958
47968
 
47959
47969
  // src/components/MediaRecorder/hooks/useMediaRecorder.ts
47960
- var import_react227 = require("react");
47970
+ var import_react228 = require("react");
47961
47971
  var useMediaRecorder = ({
47962
47972
  asyncMessagesMultiSendEnabled,
47963
47973
  enabled,
@@ -47967,11 +47977,11 @@ var useMediaRecorder = ({
47967
47977
  }) => {
47968
47978
  const { t } = useTranslationContext("useMediaRecorder");
47969
47979
  const messageComposer = useMessageComposer();
47970
- const [recording, setRecording] = (0, import_react227.useState)();
47971
- const [recordingState, setRecordingState] = (0, import_react227.useState)();
47972
- const [permissionState, setPermissionState] = (0, import_react227.useState)();
47973
- const [isScheduledForSubmit, scheduleForSubmit] = (0, import_react227.useState)(false);
47974
- const recorder = (0, import_react227.useMemo)(
47980
+ const [recording, setRecording] = (0, import_react228.useState)();
47981
+ const [recordingState, setRecordingState] = (0, import_react228.useState)();
47982
+ const [permissionState, setPermissionState] = (0, import_react228.useState)();
47983
+ const [isScheduledForSubmit, scheduleForSubmit] = (0, import_react228.useState)(false);
47984
+ const recorder = (0, import_react228.useMemo)(
47975
47985
  () => enabled ? new MediaRecorderController({
47976
47986
  config: recordingConfig ?? {},
47977
47987
  generateRecordingTitle,
@@ -47979,7 +47989,7 @@ var useMediaRecorder = ({
47979
47989
  }) : void 0,
47980
47990
  [recordingConfig, enabled, generateRecordingTitle, t]
47981
47991
  );
47982
- const completeRecording = (0, import_react227.useCallback)(async () => {
47992
+ const completeRecording = (0, import_react228.useCallback)(async () => {
47983
47993
  if (!recorder) return;
47984
47994
  const recording2 = await recorder.stop();
47985
47995
  if (!recording2) return;
@@ -47989,12 +47999,12 @@ var useMediaRecorder = ({
47989
47999
  }
47990
48000
  recorder.cleanUp();
47991
48001
  }, [asyncMessagesMultiSendEnabled, messageComposer, recorder]);
47992
- (0, import_react227.useEffect)(() => {
48002
+ (0, import_react228.useEffect)(() => {
47993
48003
  if (!isScheduledForSubmit) return;
47994
48004
  handleSubmit();
47995
48005
  scheduleForSubmit(false);
47996
48006
  }, [handleSubmit, isScheduledForSubmit]);
47997
- (0, import_react227.useEffect)(() => {
48007
+ (0, import_react228.useEffect)(() => {
47998
48008
  if (!recorder) return;
47999
48009
  recorder.permission.watch();
48000
48010
  const recordingSubscription = recorder.recording.subscribe(setRecording);
@@ -48057,7 +48067,7 @@ var AttachmentPreviewList = ({
48057
48067
  const messageComposer = useMessageComposer();
48058
48068
  const { attachments } = useAttachmentManagerState();
48059
48069
  if (!attachments.length) return null;
48060
- return /* @__PURE__ */ import_react228.default.createElement("div", { className: "str-chat__attachment-preview-list" }, /* @__PURE__ */ import_react228.default.createElement(
48070
+ return /* @__PURE__ */ import_react229.default.createElement("div", { className: "str-chat__attachment-preview-list" }, /* @__PURE__ */ import_react229.default.createElement(
48061
48071
  "div",
48062
48072
  {
48063
48073
  className: "str-chat__attachment-list-scroll-container",
@@ -48066,7 +48076,7 @@ var AttachmentPreviewList = ({
48066
48076
  attachments.map((attachment) => {
48067
48077
  if ((0, import_stream_chat9.isScrapedContent)(attachment)) return null;
48068
48078
  if ((0, import_stream_chat9.isLocalVoiceRecordingAttachment)(attachment)) {
48069
- return /* @__PURE__ */ import_react228.default.createElement(
48079
+ return /* @__PURE__ */ import_react229.default.createElement(
48070
48080
  VoiceRecordingPreview2,
48071
48081
  {
48072
48082
  attachment,
@@ -48076,7 +48086,7 @@ var AttachmentPreviewList = ({
48076
48086
  }
48077
48087
  );
48078
48088
  } else if ((0, import_stream_chat9.isLocalAudioAttachment)(attachment)) {
48079
- return /* @__PURE__ */ import_react228.default.createElement(
48089
+ return /* @__PURE__ */ import_react229.default.createElement(
48080
48090
  AudioAttachmentPreview,
48081
48091
  {
48082
48092
  attachment,
@@ -48086,7 +48096,7 @@ var AttachmentPreviewList = ({
48086
48096
  }
48087
48097
  );
48088
48098
  } else if ((0, import_stream_chat9.isLocalVideoAttachment)(attachment)) {
48089
- return /* @__PURE__ */ import_react228.default.createElement(
48099
+ return /* @__PURE__ */ import_react229.default.createElement(
48090
48100
  VideoAttachmentPreview,
48091
48101
  {
48092
48102
  attachment,
@@ -48096,7 +48106,7 @@ var AttachmentPreviewList = ({
48096
48106
  }
48097
48107
  );
48098
48108
  } else if ((0, import_stream_chat9.isLocalImageAttachment)(attachment)) {
48099
- return /* @__PURE__ */ import_react228.default.createElement(
48109
+ return /* @__PURE__ */ import_react229.default.createElement(
48100
48110
  ImageAttachmentPreview2,
48101
48111
  {
48102
48112
  attachment,
@@ -48106,7 +48116,7 @@ var AttachmentPreviewList = ({
48106
48116
  }
48107
48117
  );
48108
48118
  } else if ((0, import_stream_chat9.isLocalFileAttachment)(attachment)) {
48109
- return /* @__PURE__ */ import_react228.default.createElement(
48119
+ return /* @__PURE__ */ import_react229.default.createElement(
48110
48120
  FileAttachmentPreview2,
48111
48121
  {
48112
48122
  attachment,
@@ -48116,7 +48126,7 @@ var AttachmentPreviewList = ({
48116
48126
  }
48117
48127
  );
48118
48128
  } else if ((0, import_stream_chat9.isLocalAttachment)(attachment)) {
48119
- return /* @__PURE__ */ import_react228.default.createElement(
48129
+ return /* @__PURE__ */ import_react229.default.createElement(
48120
48130
  UnsupportedAttachmentPreview2,
48121
48131
  {
48122
48132
  attachment,
@@ -48132,13 +48142,13 @@ var AttachmentPreviewList = ({
48132
48142
  };
48133
48143
 
48134
48144
  // src/components/MessageInput/CooldownTimer.tsx
48135
- var import_react230 = __toESM(require("react"));
48145
+ var import_react231 = __toESM(require("react"));
48136
48146
 
48137
48147
  // src/components/MessageInput/hooks/useTimer.ts
48138
- var import_react229 = require("react");
48148
+ var import_react230 = require("react");
48139
48149
  var useTimer = ({ startFrom }) => {
48140
- const [secondsLeft, setSecondsLeft] = (0, import_react229.useState)();
48141
- (0, import_react229.useEffect)(() => {
48150
+ const [secondsLeft, setSecondsLeft] = (0, import_react230.useState)();
48151
+ (0, import_react230.useEffect)(() => {
48142
48152
  let countdownTimeout;
48143
48153
  if (typeof secondsLeft === "number" && secondsLeft > 0) {
48144
48154
  countdownTimeout = setTimeout(() => {
@@ -48149,7 +48159,7 @@ var useTimer = ({ startFrom }) => {
48149
48159
  clearTimeout(countdownTimeout);
48150
48160
  };
48151
48161
  }, [secondsLeft]);
48152
- (0, import_react229.useEffect)(() => {
48162
+ (0, import_react230.useEffect)(() => {
48153
48163
  setSecondsLeft(startFrom ?? 0);
48154
48164
  }, [startFrom]);
48155
48165
  return secondsLeft;
@@ -48158,23 +48168,23 @@ var useTimer = ({ startFrom }) => {
48158
48168
  // src/components/MessageInput/CooldownTimer.tsx
48159
48169
  var CooldownTimer = ({ cooldownInterval }) => {
48160
48170
  const secondsLeft = useTimer({ startFrom: cooldownInterval });
48161
- return /* @__PURE__ */ import_react230.default.createElement("div", { className: "str-chat__message-input-cooldown", "data-testid": "cooldown-timer" }, secondsLeft);
48171
+ return /* @__PURE__ */ import_react231.default.createElement("div", { className: "str-chat__message-input-cooldown", "data-testid": "cooldown-timer" }, secondsLeft);
48162
48172
  };
48163
48173
 
48164
48174
  // src/components/MessageInput/EditMessageForm.tsx
48165
- var import_react248 = __toESM(require("react"));
48175
+ var import_react249 = __toESM(require("react"));
48166
48176
 
48167
48177
  // src/components/MessageInput/MessageInput.tsx
48168
- var import_react247 = __toESM(require("react"));
48178
+ var import_react248 = __toESM(require("react"));
48169
48179
 
48170
48180
  // src/components/MessageInput/MessageInputFlat.tsx
48171
- var import_react245 = __toESM(require("react"));
48181
+ var import_react246 = __toESM(require("react"));
48172
48182
 
48173
48183
  // src/components/MessageInput/SendButton.tsx
48174
- var import_react231 = __toESM(require("react"));
48184
+ var import_react232 = __toESM(require("react"));
48175
48185
  var SendButton = ({ sendMessage, ...rest }) => {
48176
48186
  const hasSendableData = useMessageComposerHasSendableData();
48177
- return /* @__PURE__ */ import_react231.default.createElement(
48187
+ return /* @__PURE__ */ import_react232.default.createElement(
48178
48188
  "button",
48179
48189
  {
48180
48190
  "aria-label": "Send",
@@ -48185,18 +48195,18 @@ var SendButton = ({ sendMessage, ...rest }) => {
48185
48195
  type: "button",
48186
48196
  ...rest
48187
48197
  },
48188
- /* @__PURE__ */ import_react231.default.createElement(SendIcon, null)
48198
+ /* @__PURE__ */ import_react232.default.createElement(SendIcon, null)
48189
48199
  );
48190
48200
  };
48191
48201
 
48192
48202
  // src/components/MessageInput/StopAIGenerationButton.tsx
48193
- var import_react232 = __toESM(require("react"));
48203
+ var import_react233 = __toESM(require("react"));
48194
48204
  var StopAIGenerationButton = ({
48195
48205
  onClick,
48196
48206
  ...restProps
48197
48207
  }) => {
48198
48208
  const { t } = useTranslationContext();
48199
- return /* @__PURE__ */ import_react232.default.createElement(
48209
+ return /* @__PURE__ */ import_react233.default.createElement(
48200
48210
  "button",
48201
48211
  {
48202
48212
  "aria-label": t("aria/Stop AI Generation"),
@@ -48209,7 +48219,7 @@ var StopAIGenerationButton = ({
48209
48219
  };
48210
48220
 
48211
48221
  // src/components/MessageInput/QuotedMessagePreview.tsx
48212
- var import_react233 = __toESM(require("react"));
48222
+ var import_react234 = __toESM(require("react"));
48213
48223
  var messageComposerStateStoreSelector = (state) => ({
48214
48224
  quotedMessage: state.quotedMessage
48215
48225
  });
@@ -48221,14 +48231,14 @@ var QuotedMessagePreviewHeader = () => {
48221
48231
  messageComposerStateStoreSelector
48222
48232
  );
48223
48233
  if (!quotedMessage) return null;
48224
- 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(
48234
+ return /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__quoted-message-preview-header" }, /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__quoted-message-reply-to-message" }, t("Reply to Message")), /* @__PURE__ */ import_react234.default.createElement(
48225
48235
  "button",
48226
48236
  {
48227
48237
  "aria-label": t("aria/Cancel Reply"),
48228
48238
  className: "str-chat__quoted-message-remove",
48229
48239
  onClick: () => messageComposer.setQuotedMessage(null)
48230
48240
  },
48231
- /* @__PURE__ */ import_react233.default.createElement(CloseIcon, null)
48241
+ /* @__PURE__ */ import_react234.default.createElement(CloseIcon, null)
48232
48242
  ));
48233
48243
  };
48234
48244
  var QuotedMessagePreview = ({
@@ -48242,27 +48252,27 @@ var QuotedMessagePreview = ({
48242
48252
  messageComposer.state,
48243
48253
  messageComposerStateStoreSelector
48244
48254
  );
48245
- const quotedMessageText = (0, import_react233.useMemo)(
48255
+ const quotedMessageText = (0, import_react234.useMemo)(
48246
48256
  () => quotedMessage?.i18n?.[`${userLanguage}_text`] || quotedMessage?.text,
48247
48257
  [quotedMessage?.i18n, quotedMessage?.text, userLanguage]
48248
48258
  );
48249
- const renderedText = (0, import_react233.useMemo)(
48259
+ const renderedText = (0, import_react234.useMemo)(
48250
48260
  () => renderText2(quotedMessageText, quotedMessage?.mentioned_users),
48251
48261
  [quotedMessage, quotedMessageText, renderText2]
48252
48262
  );
48253
- const quotedMessageAttachments = (0, import_react233.useMemo)(
48263
+ const quotedMessageAttachments = (0, import_react234.useMemo)(
48254
48264
  () => quotedMessage?.attachments?.length ? quotedMessage.attachments.slice(0, 1) : [],
48255
48265
  [quotedMessage]
48256
48266
  );
48257
48267
  const poll = quotedMessage?.poll_id && client.polls.fromState(quotedMessage.poll_id);
48258
48268
  if (!quotedMessageText && !quotedMessageAttachments.length && !poll) return null;
48259
- return /* @__PURE__ */ import_react233.default.createElement(
48269
+ return /* @__PURE__ */ import_react234.default.createElement(
48260
48270
  "div",
48261
48271
  {
48262
48272
  className: "str-chat__quoted-message-preview",
48263
48273
  "data-testid": "quoted-message-preview"
48264
48274
  },
48265
- quotedMessage?.user && /* @__PURE__ */ import_react233.default.createElement(
48275
+ quotedMessage?.user && /* @__PURE__ */ import_react234.default.createElement(
48266
48276
  Avatar2,
48267
48277
  {
48268
48278
  className: "str-chat__avatar--quoted-message-sender",
@@ -48271,7 +48281,7 @@ var QuotedMessagePreview = ({
48271
48281
  user: quotedMessage.user
48272
48282
  }
48273
48283
  ),
48274
- /* @__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(
48284
+ /* @__PURE__ */ import_react234.default.createElement("div", { className: "str-chat__quoted-message-bubble" }, poll ? /* @__PURE__ */ import_react234.default.createElement(Poll, { isQuoted: true, poll }) : /* @__PURE__ */ import_react234.default.createElement(import_react234.default.Fragment, null, !!quotedMessageAttachments.length && /* @__PURE__ */ import_react234.default.createElement(Attachment2, { attachments: quotedMessageAttachments, isQuoted: true }), /* @__PURE__ */ import_react234.default.createElement(
48275
48285
  "div",
48276
48286
  {
48277
48287
  className: "str-chat__quoted-message-text",
@@ -48284,7 +48294,7 @@ var QuotedMessagePreview = ({
48284
48294
 
48285
48295
  // src/components/MessageInput/LinkPreviewList.tsx
48286
48296
  var import_clsx57 = __toESM(require("clsx"));
48287
- var import_react234 = __toESM(require("react"));
48297
+ var import_react235 = __toESM(require("react"));
48288
48298
  var import_stream_chat10 = require("stream-chat");
48289
48299
  var linkPreviewsManagerStateSelector = (state) => ({
48290
48300
  linkPreviews: Array.from(state.previews.values()).filter(
@@ -48307,15 +48317,15 @@ var LinkPreviewList = () => {
48307
48317
  );
48308
48318
  const showLinkPreviews = linkPreviews.length > 0 && !quotedMessage;
48309
48319
  if (!showLinkPreviews) return null;
48310
- 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 })));
48320
+ return /* @__PURE__ */ import_react235.default.createElement("div", { className: "str-chat__link-preview-list" }, linkPreviews.map((linkPreview) => /* @__PURE__ */ import_react235.default.createElement(LinkPreviewCard, { key: linkPreview.og_scrape_url, linkPreview })));
48311
48321
  };
48312
48322
  var LinkPreviewCard = ({ linkPreview }) => {
48313
48323
  const { linkPreviewsManager } = useMessageComposer();
48314
48324
  const { handleEnter, handleLeave, tooltipVisible } = useEnterLeaveHandlers();
48315
- const [referenceElement, setReferenceElement] = (0, import_react234.useState)(null);
48325
+ const [referenceElement, setReferenceElement] = (0, import_react235.useState)(null);
48316
48326
  if (!import_stream_chat10.LinkPreviewsManager.previewIsLoaded(linkPreview) && !import_stream_chat10.LinkPreviewsManager.previewIsLoading(linkPreview))
48317
48327
  return null;
48318
- return /* @__PURE__ */ import_react234.default.createElement(
48328
+ return /* @__PURE__ */ import_react235.default.createElement(
48319
48329
  "div",
48320
48330
  {
48321
48331
  className: (0, import_clsx57.default)("str-chat__link-preview-card", {
@@ -48323,7 +48333,7 @@ var LinkPreviewCard = ({ linkPreview }) => {
48323
48333
  }),
48324
48334
  "data-testid": "link-preview-card"
48325
48335
  },
48326
- /* @__PURE__ */ import_react234.default.createElement(
48336
+ /* @__PURE__ */ import_react235.default.createElement(
48327
48337
  PopperTooltip,
48328
48338
  {
48329
48339
  offset: [0, 5],
@@ -48332,7 +48342,7 @@ var LinkPreviewCard = ({ linkPreview }) => {
48332
48342
  },
48333
48343
  linkPreview.og_scrape_url
48334
48344
  ),
48335
- /* @__PURE__ */ import_react234.default.createElement(
48345
+ /* @__PURE__ */ import_react235.default.createElement(
48336
48346
  "div",
48337
48347
  {
48338
48348
  className: "str-chat__link-preview-card__icon-container",
@@ -48340,10 +48350,10 @@ var LinkPreviewCard = ({ linkPreview }) => {
48340
48350
  onMouseLeave: handleLeave,
48341
48351
  ref: setReferenceElement
48342
48352
  },
48343
- /* @__PURE__ */ import_react234.default.createElement(LinkIcon, null)
48353
+ /* @__PURE__ */ import_react235.default.createElement(LinkIcon, null)
48344
48354
  ),
48345
- /* @__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)),
48346
- /* @__PURE__ */ import_react234.default.createElement(
48355
+ /* @__PURE__ */ import_react235.default.createElement("div", { className: "str-chat__link-preview-card__content" }, /* @__PURE__ */ import_react235.default.createElement("div", { className: "str-chat__link-preview-card__content-title" }, linkPreview.title), /* @__PURE__ */ import_react235.default.createElement("div", { className: "str-chat__link-preview-card__content-description" }, linkPreview.text)),
48356
+ /* @__PURE__ */ import_react235.default.createElement(
48347
48357
  "button",
48348
48358
  {
48349
48359
  className: "str-chat__link-preview-card__dismiss-button",
@@ -48351,49 +48361,49 @@ var LinkPreviewCard = ({ linkPreview }) => {
48351
48361
  onClick: () => linkPreviewsManager.dismissPreview(linkPreview.og_scrape_url),
48352
48362
  type: "button"
48353
48363
  },
48354
- /* @__PURE__ */ import_react234.default.createElement(CloseIcon, null)
48364
+ /* @__PURE__ */ import_react235.default.createElement(CloseIcon, null)
48355
48365
  )
48356
48366
  );
48357
48367
  };
48358
48368
 
48359
48369
  // src/components/TextareaComposer/SuggestionList/CommandItem.tsx
48360
- var import_react235 = __toESM(require("react"));
48370
+ var import_react236 = __toESM(require("react"));
48361
48371
  var CommandItem = (props) => {
48362
48372
  const { entity } = props;
48363
- 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));
48373
+ return /* @__PURE__ */ import_react236.default.createElement("div", { className: "str-chat__slash-command" }, /* @__PURE__ */ import_react236.default.createElement("span", { className: "str-chat__slash-command-header" }, /* @__PURE__ */ import_react236.default.createElement("strong", null, entity.name), " ", entity.args), /* @__PURE__ */ import_react236.default.createElement("br", null), /* @__PURE__ */ import_react236.default.createElement("span", { className: "str-chat__slash-command-description" }, entity.description));
48364
48374
  };
48365
48375
 
48366
48376
  // src/components/TextareaComposer/SuggestionList/EmoticonItem.tsx
48367
- var import_react236 = __toESM(require("react"));
48377
+ var import_react237 = __toESM(require("react"));
48368
48378
  var EmoticonItem = (props) => {
48369
48379
  const { entity } = props;
48370
48380
  const hasEntity = Object.keys(entity).length;
48371
48381
  if (!hasEntity) return null;
48372
48382
  const { parts, token } = entity.tokenizedDisplayName ?? {};
48373
48383
  const renderName = () => parts?.map(
48374
- (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)
48384
+ (part, i) => part.toLowerCase() === token ? /* @__PURE__ */ import_react237.default.createElement("span", { className: "str-chat__emoji-item--highlight", key: `part-${i}` }, part) : /* @__PURE__ */ import_react237.default.createElement("span", { className: "str-chat__emoji-item--part", key: `part-${i}` }, part)
48375
48385
  ) ?? null;
48376
- 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()));
48386
+ return /* @__PURE__ */ import_react237.default.createElement("div", { className: "str-chat__emoji-item" }, /* @__PURE__ */ import_react237.default.createElement("span", { className: "str-chat__emoji-item--entity" }, entity.native), /* @__PURE__ */ import_react237.default.createElement("span", { className: "str-chat__emoji-item--name" }, renderName()));
48377
48387
  };
48378
48388
 
48379
48389
  // src/components/TextareaComposer/SuggestionList/SuggestionList.tsx
48380
48390
  var import_clsx60 = __toESM(require("clsx"));
48381
- var import_react239 = __toESM(require("react"));
48391
+ var import_react240 = __toESM(require("react"));
48382
48392
 
48383
48393
  // src/components/TextareaComposer/SuggestionList/SuggestionListItem.tsx
48384
48394
  var import_clsx58 = __toESM(require("clsx"));
48385
- var import_react237 = __toESM(require("react"));
48386
- var SuggestionListItem = import_react237.default.forwardRef(function SuggestionListItem2({ className, component: Component2, focused, item: item2, onMouseEnter }, innerRef) {
48395
+ var import_react238 = __toESM(require("react"));
48396
+ var SuggestionListItem = import_react238.default.forwardRef(function SuggestionListItem2({ className, component: Component2, focused, item: item2, onMouseEnter }, innerRef) {
48387
48397
  const { textComposer } = useMessageComposer();
48388
- const containerRef = (0, import_react237.useRef)(null);
48389
- const handleSelect = (0, import_react237.useCallback)(() => {
48398
+ const containerRef = (0, import_react238.useRef)(null);
48399
+ const handleSelect = (0, import_react238.useCallback)(() => {
48390
48400
  textComposer.handleSelect(item2);
48391
48401
  }, [item2, textComposer]);
48392
- (0, import_react237.useLayoutEffect)(() => {
48402
+ (0, import_react238.useLayoutEffect)(() => {
48393
48403
  if (!focused) return;
48394
48404
  containerRef.current?.scrollIntoView({ behavior: "instant", block: "nearest" });
48395
48405
  }, [focused, containerRef]);
48396
- return /* @__PURE__ */ import_react237.default.createElement(
48406
+ return /* @__PURE__ */ import_react238.default.createElement(
48397
48407
  "li",
48398
48408
  {
48399
48409
  className: (0, import_clsx58.default)("str-chat__suggestion-list-item", className, {
@@ -48402,7 +48412,7 @@ var SuggestionListItem = import_react237.default.forwardRef(function SuggestionL
48402
48412
  onMouseEnter,
48403
48413
  ref: containerRef
48404
48414
  },
48405
- /* @__PURE__ */ import_react237.default.createElement(
48415
+ /* @__PURE__ */ import_react238.default.createElement(
48406
48416
  "button",
48407
48417
  {
48408
48418
  onClick: handleSelect,
@@ -48413,13 +48423,13 @@ var SuggestionListItem = import_react237.default.forwardRef(function SuggestionL
48413
48423
  },
48414
48424
  ref: innerRef
48415
48425
  },
48416
- /* @__PURE__ */ import_react237.default.createElement(Component2, { entity: item2, focused })
48426
+ /* @__PURE__ */ import_react238.default.createElement(Component2, { entity: item2, focused })
48417
48427
  )
48418
48428
  );
48419
48429
  });
48420
48430
 
48421
48431
  // src/components/TextareaComposer/SuggestionList/UserItem.tsx
48422
- var import_react238 = __toESM(require("react"));
48432
+ var import_react239 = __toESM(require("react"));
48423
48433
  var import_clsx59 = __toESM(require("clsx"));
48424
48434
  var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
48425
48435
  const hasEntity = !!Object.keys(entity).length;
@@ -48428,7 +48438,7 @@ var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
48428
48438
  const renderName = () => parts.map((part, i) => {
48429
48439
  const matches = part.toLowerCase() === token;
48430
48440
  const partWithHTMLSpacesAround = part.replace(/^\s+|\s+$/g, "\xA0");
48431
- return /* @__PURE__ */ import_react238.default.createElement(
48441
+ return /* @__PURE__ */ import_react239.default.createElement(
48432
48442
  "span",
48433
48443
  {
48434
48444
  className: (0, import_clsx59.default)({
@@ -48440,14 +48450,14 @@ var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
48440
48450
  partWithHTMLSpacesAround
48441
48451
  );
48442
48452
  });
48443
- return /* @__PURE__ */ import_react238.default.createElement("div", { className: "str-chat__user-item" }, /* @__PURE__ */ import_react238.default.createElement(
48453
+ return /* @__PURE__ */ import_react239.default.createElement("div", { className: "str-chat__user-item" }, /* @__PURE__ */ import_react239.default.createElement(
48444
48454
  Avatar2,
48445
48455
  {
48446
48456
  className: "str-chat__avatar--autocomplete-item",
48447
48457
  image: entity.image,
48448
48458
  name: entity.name || entity.id
48449
48459
  }
48450
- ), /* @__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" }, "@"));
48460
+ ), /* @__PURE__ */ import_react239.default.createElement("span", { className: "str-chat__user-item--name", "data-testid": "user-item-name" }, renderName()), /* @__PURE__ */ import_react239.default.createElement("div", { className: "str-chat__user-item-at" }, "@"));
48451
48461
  };
48452
48462
 
48453
48463
  // src/components/TextareaComposer/SuggestionList/SuggestionList.tsx
@@ -48458,9 +48468,9 @@ var searchSourceStateSelector = (nextValue) => ({
48458
48468
  items: nextValue.items ?? []
48459
48469
  });
48460
48470
  var defaultComponents = {
48461
- "/": (props) => /* @__PURE__ */ import_react239.default.createElement(CommandItem, { entity: props.entity }),
48462
- ":": (props) => /* @__PURE__ */ import_react239.default.createElement(EmoticonItem, { entity: props.entity }),
48463
- "@": (props) => /* @__PURE__ */ import_react239.default.createElement(UserItem, { entity: props.entity })
48471
+ "/": (props) => /* @__PURE__ */ import_react240.default.createElement(CommandItem, { entity: props.entity }),
48472
+ ":": (props) => /* @__PURE__ */ import_react240.default.createElement(EmoticonItem, { entity: props.entity }),
48473
+ "@": (props) => /* @__PURE__ */ import_react240.default.createElement(UserItem, { entity: props.entity })
48464
48474
  };
48465
48475
  var SuggestionList = ({
48466
48476
  className,
@@ -48475,9 +48485,9 @@ var SuggestionList = ({
48475
48485
  const { textComposer } = messageComposer;
48476
48486
  const { suggestions } = useStateStore(textComposer.state, textComposerStateSelector);
48477
48487
  const { items } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector) ?? {};
48478
- const [container, setContainer] = (0, import_react239.useState)(null);
48488
+ const [container, setContainer] = (0, import_react240.useState)(null);
48479
48489
  const component = suggestions?.trigger ? suggestionItemComponents[suggestions?.trigger] : void 0;
48480
- (0, import_react239.useEffect)(() => {
48490
+ (0, import_react240.useEffect)(() => {
48481
48491
  if (!closeOnClickOutside || !suggestions || !container) return;
48482
48492
  const handleClick = (event) => {
48483
48493
  if (container.contains(event.target)) return;
@@ -48489,19 +48499,19 @@ var SuggestionList = ({
48489
48499
  };
48490
48500
  }, [closeOnClickOutside, suggestions, container, textComposer]);
48491
48501
  if (!suggestions || !items?.length || !component) return null;
48492
- return /* @__PURE__ */ import_react239.default.createElement(
48502
+ return /* @__PURE__ */ import_react240.default.createElement(
48493
48503
  "div",
48494
48504
  {
48495
48505
  className: (0, import_clsx60.default)("str-chat__suggestion-list-container", containerClassName),
48496
48506
  ref: setContainer
48497
48507
  },
48498
- /* @__PURE__ */ import_react239.default.createElement(
48508
+ /* @__PURE__ */ import_react240.default.createElement(
48499
48509
  InfiniteScrollPaginator,
48500
48510
  {
48501
48511
  loadNextOnScrollToBottom: suggestions.searchSource.search,
48502
48512
  threshold: 100
48503
48513
  },
48504
- /* @__PURE__ */ import_react239.default.createElement(
48514
+ /* @__PURE__ */ import_react240.default.createElement(
48505
48515
  "ul",
48506
48516
  {
48507
48517
  className: (0, import_clsx60.default)(
@@ -48509,7 +48519,7 @@ var SuggestionList = ({
48509
48519
  className
48510
48520
  )
48511
48521
  },
48512
- items.map((item2, i) => /* @__PURE__ */ import_react239.default.createElement(
48522
+ items.map((item2, i) => /* @__PURE__ */ import_react240.default.createElement(
48513
48523
  AutocompleteSuggestionItem,
48514
48524
  {
48515
48525
  component,
@@ -48527,8 +48537,8 @@ var SuggestionList = ({
48527
48537
  // src/components/TextareaComposer/TextareaComposer.tsx
48528
48538
  var import_lodash19 = __toESM(require("lodash.debounce"));
48529
48539
  var import_clsx61 = __toESM(require("clsx"));
48530
- var import_react240 = require("react");
48531
- var import_react241 = __toESM(require("react"));
48540
+ var import_react241 = require("react");
48541
+ var import_react242 = __toESM(require("react"));
48532
48542
  var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"));
48533
48543
  var textComposerStateSelector2 = (state) => ({
48534
48544
  selection: state.selection,
@@ -48583,10 +48593,10 @@ var TextareaComposer = ({
48583
48593
  );
48584
48594
  const { enabled } = useStateStore(messageComposer.configState, configStateSelector);
48585
48595
  const { isLoadingItems } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector2) ?? {};
48586
- const containerRef = (0, import_react241.useRef)(null);
48587
- const [focusedItemIndex, setFocusedItemIndex] = (0, import_react241.useState)(0);
48588
- const [isComposing, setIsComposing] = (0, import_react241.useState)(false);
48589
- const changeHandler = (0, import_react241.useCallback)(
48596
+ const containerRef = (0, import_react242.useRef)(null);
48597
+ const [focusedItemIndex, setFocusedItemIndex] = (0, import_react242.useState)(0);
48598
+ const [isComposing, setIsComposing] = (0, import_react242.useState)(false);
48599
+ const changeHandler = (0, import_react242.useCallback)(
48590
48600
  (e) => {
48591
48601
  if (onChange) {
48592
48602
  onChange(e);
@@ -48603,13 +48613,13 @@ var TextareaComposer = ({
48603
48613
  },
48604
48614
  [onChange, textComposer, textareaRef]
48605
48615
  );
48606
- const onCompositionEnd = (0, import_react241.useCallback)(() => {
48616
+ const onCompositionEnd = (0, import_react242.useCallback)(() => {
48607
48617
  setIsComposing(false);
48608
48618
  }, []);
48609
- const onCompositionStart = (0, import_react241.useCallback)(() => {
48619
+ const onCompositionStart = (0, import_react242.useCallback)(() => {
48610
48620
  setIsComposing(true);
48611
48621
  }, []);
48612
- const keyDownHandler = (0, import_react241.useCallback)(
48622
+ const keyDownHandler = (0, import_react242.useCallback)(
48613
48623
  (event) => {
48614
48624
  if (onKeyDown) {
48615
48625
  onKeyDown(event);
@@ -48661,7 +48671,7 @@ var TextareaComposer = ({
48661
48671
  textareaRef
48662
48672
  ]
48663
48673
  );
48664
- const scrollHandler = (0, import_react241.useCallback)(
48674
+ const scrollHandler = (0, import_react242.useCallback)(
48665
48675
  (event) => {
48666
48676
  if (onScroll) {
48667
48677
  onScroll(event);
@@ -48671,7 +48681,7 @@ var TextareaComposer = ({
48671
48681
  },
48672
48682
  [onScroll, textComposer]
48673
48683
  );
48674
- const setSelectionDebounced = (0, import_react240.useMemo)(
48684
+ const setSelectionDebounced = (0, import_react241.useMemo)(
48675
48685
  () => (0, import_lodash19.default)(
48676
48686
  (e) => {
48677
48687
  onSelect?.(e);
@@ -48685,18 +48695,18 @@ var TextareaComposer = ({
48685
48695
  ),
48686
48696
  [onSelect, textComposer]
48687
48697
  );
48688
- (0, import_react241.useEffect)(() => {
48698
+ (0, import_react242.useEffect)(() => {
48689
48699
  if (textareaRef.current && !isComposing) {
48690
48700
  textareaRef.current.selectionStart = selection.start;
48691
48701
  textareaRef.current.selectionEnd = selection.end;
48692
48702
  }
48693
48703
  }, [text8, textareaRef, selection.start, selection.end, isComposing]);
48694
- (0, import_react241.useEffect)(() => {
48704
+ (0, import_react242.useEffect)(() => {
48695
48705
  if (textComposer.suggestions) {
48696
48706
  setFocusedItemIndex(0);
48697
48707
  }
48698
48708
  }, [textComposer.suggestions]);
48699
- return /* @__PURE__ */ import_react241.default.createElement(
48709
+ return /* @__PURE__ */ import_react242.default.createElement(
48700
48710
  "div",
48701
48711
  {
48702
48712
  className: (0, import_clsx61.default)(
@@ -48709,7 +48719,7 @@ var TextareaComposer = ({
48709
48719
  ),
48710
48720
  ref: containerRef
48711
48721
  },
48712
- /* @__PURE__ */ import_react241.default.createElement(
48722
+ /* @__PURE__ */ import_react242.default.createElement(
48713
48723
  import_react_textarea_autosize.default,
48714
48724
  {
48715
48725
  ...{ ...additionalTextareaProps, ...restTextareaProps },
@@ -48738,7 +48748,7 @@ var TextareaComposer = ({
48738
48748
  value: text8
48739
48749
  }
48740
48750
  ),
48741
- !isComposing && /* @__PURE__ */ import_react241.default.createElement(
48751
+ !isComposing && /* @__PURE__ */ import_react242.default.createElement(
48742
48752
  AutocompleteSuggestionList,
48743
48753
  {
48744
48754
  className: listClassName,
@@ -48751,10 +48761,10 @@ var TextareaComposer = ({
48751
48761
  };
48752
48762
 
48753
48763
  // src/components/AIStateIndicator/AIStateIndicator.tsx
48754
- var import_react243 = __toESM(require("react"));
48764
+ var import_react244 = __toESM(require("react"));
48755
48765
 
48756
48766
  // src/components/AIStateIndicator/hooks/useAIState.ts
48757
- var import_react242 = require("react");
48767
+ var import_react243 = require("react");
48758
48768
  var AIStates = {
48759
48769
  Error: "AI_STATE_ERROR",
48760
48770
  ExternalSources: "AI_STATE_EXTERNAL_SOURCES",
@@ -48763,8 +48773,8 @@ var AIStates = {
48763
48773
  Thinking: "AI_STATE_THINKING"
48764
48774
  };
48765
48775
  var useAIState = (channel) => {
48766
- const [aiState, setAiState] = (0, import_react242.useState)(AIStates.Idle);
48767
- (0, import_react242.useEffect)(() => {
48776
+ const [aiState, setAiState] = (0, import_react243.useState)(AIStates.Idle);
48777
+ (0, import_react243.useEffect)(() => {
48768
48778
  if (!channel) {
48769
48779
  return;
48770
48780
  }
@@ -48801,21 +48811,21 @@ var AIStateIndicator = ({
48801
48811
  [AIStates.Thinking]: t("Thinking..."),
48802
48812
  [AIStates.Generating]: t("Generating...")
48803
48813
  };
48804
- 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;
48814
+ return aiState in allowedStates ? /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__ai-state-indicator-container" }, /* @__PURE__ */ import_react244.default.createElement("p", { className: "str-chat__ai-state-indicator-text" }, allowedStates[aiState])) : null;
48805
48815
  };
48806
48816
 
48807
48817
  // src/components/MessageInput/WithDragAndDropUpload.tsx
48808
- var import_react244 = __toESM(require("react"));
48818
+ var import_react245 = __toESM(require("react"));
48809
48819
  var import_react_dropzone = require("react-dropzone");
48810
48820
  var import_clsx62 = __toESM(require("clsx"));
48811
- var DragAndDropUploadContext = import_react244.default.createContext({
48821
+ var DragAndDropUploadContext = import_react245.default.createContext({
48812
48822
  subscribeToDrop: null
48813
48823
  });
48814
- var useDragAndDropUploadContext = () => (0, import_react244.useContext)(DragAndDropUploadContext);
48824
+ var useDragAndDropUploadContext = () => (0, import_react245.useContext)(DragAndDropUploadContext);
48815
48825
  var useRegisterDropHandlers = () => {
48816
48826
  const { subscribeToDrop } = useDragAndDropUploadContext();
48817
48827
  const messageComposer = useMessageComposer();
48818
- (0, import_react244.useEffect)(() => {
48828
+ (0, import_react245.useEffect)(() => {
48819
48829
  const unsubscribe = subscribeToDrop?.(messageComposer.attachmentManager.uploadFiles);
48820
48830
  return unsubscribe;
48821
48831
  }, [subscribeToDrop, messageComposer]);
@@ -48830,7 +48840,7 @@ var WithDragAndDropUpload = ({
48830
48840
  component: Component2 = "div",
48831
48841
  style
48832
48842
  }) => {
48833
- const dropHandlersRef = (0, import_react244.useRef)(/* @__PURE__ */ new Set());
48843
+ const dropHandlersRef = (0, import_react245.useRef)(/* @__PURE__ */ new Set());
48834
48844
  const { t } = useTranslationContext();
48835
48845
  const messageInputContext = useMessageInputContext();
48836
48846
  const dragAndDropUploadContext = useDragAndDropUploadContext();
@@ -48841,20 +48851,20 @@ var WithDragAndDropUpload = ({
48841
48851
  attachmentManagerConfigStateSelector
48842
48852
  );
48843
48853
  const isWithinMessageInputContext = Object.keys(messageInputContext).length > 0;
48844
- const accept = (0, import_react244.useMemo)(
48854
+ const accept = (0, import_react245.useMemo)(
48845
48855
  () => acceptedFiles.reduce((mediaTypeMap, mediaType) => {
48846
48856
  mediaTypeMap[mediaType] ?? (mediaTypeMap[mediaType] = []);
48847
48857
  return mediaTypeMap;
48848
48858
  }, {}),
48849
48859
  [acceptedFiles]
48850
48860
  );
48851
- const subscribeToDrop = (0, import_react244.useCallback)((fn) => {
48861
+ const subscribeToDrop = (0, import_react245.useCallback)((fn) => {
48852
48862
  dropHandlersRef.current.add(fn);
48853
48863
  return () => {
48854
48864
  dropHandlersRef.current.delete(fn);
48855
48865
  };
48856
48866
  }, []);
48857
- const handleDrop = (0, import_react244.useCallback)((files) => {
48867
+ const handleDrop = (0, import_react245.useCallback)((files) => {
48858
48868
  dropHandlersRef.current.forEach((fn) => fn(files));
48859
48869
  }, []);
48860
48870
  const { getRootProps, isDragActive, isDragReject } = (0, import_react_dropzone.useDropzone)({
@@ -48867,24 +48877,24 @@ var WithDragAndDropUpload = ({
48867
48877
  onDrop: isWithinMessageInputContext ? messageComposer.attachmentManager.uploadFiles : handleDrop
48868
48878
  });
48869
48879
  if (dragAndDropUploadContext.subscribeToDrop !== null) {
48870
- return /* @__PURE__ */ import_react244.default.createElement(Component2, { className }, children);
48880
+ return /* @__PURE__ */ import_react245.default.createElement(Component2, { className }, children);
48871
48881
  }
48872
- return /* @__PURE__ */ import_react244.default.createElement(
48882
+ return /* @__PURE__ */ import_react245.default.createElement(
48873
48883
  DragAndDropUploadContext.Provider,
48874
48884
  {
48875
48885
  value: {
48876
48886
  subscribeToDrop
48877
48887
  }
48878
48888
  },
48879
- /* @__PURE__ */ import_react244.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react244.default.createElement(
48889
+ /* @__PURE__ */ import_react245.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react245.default.createElement(
48880
48890
  "div",
48881
48891
  {
48882
48892
  className: (0, import_clsx62.default)("str-chat__dropzone-container", {
48883
48893
  "str-chat__dropzone-container--not-accepted": isDragReject
48884
48894
  })
48885
48895
  },
48886
- !isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Drag your files here")),
48887
- isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Some of the files will not be accepted"))
48896
+ !isDragReject && /* @__PURE__ */ import_react245.default.createElement("p", null, t("Drag your files here")),
48897
+ isDragReject && /* @__PURE__ */ import_react245.default.createElement("p", null, t("Some of the files will not be accepted"))
48888
48898
  ), children)
48889
48899
  );
48890
48900
  };
@@ -48916,33 +48926,33 @@ var MessageInputFlat = () => {
48916
48926
  } = useComponentContext();
48917
48927
  const { channel } = useChatContext("MessageInputFlat");
48918
48928
  const { aiState } = useAIState(channel);
48919
- const stopGenerating = (0, import_react245.useCallback)(() => channel?.stopAIResponse(), [channel]);
48929
+ const stopGenerating = (0, import_react246.useCallback)(() => channel?.stopAIResponse(), [channel]);
48920
48930
  const [
48921
48931
  showRecordingPermissionDeniedNotification,
48922
48932
  setShowRecordingPermissionDeniedNotification
48923
- ] = (0, import_react245.useState)(false);
48924
- const closePermissionDeniedNotification = (0, import_react245.useCallback)(() => {
48933
+ ] = (0, import_react246.useState)(false);
48934
+ const closePermissionDeniedNotification = (0, import_react246.useCallback)(() => {
48925
48935
  setShowRecordingPermissionDeniedNotification(false);
48926
48936
  }, []);
48927
48937
  const { attachments } = useAttachmentManagerState();
48928
- if (recordingController.recordingState) return /* @__PURE__ */ import_react245.default.createElement(AudioRecorder2, null);
48938
+ if (recordingController.recordingState) return /* @__PURE__ */ import_react246.default.createElement(AudioRecorder2, null);
48929
48939
  const recordingEnabled = !!(recordingController.recorder && navigator.mediaDevices);
48930
48940
  const isRecording = !!recordingController.recordingState;
48931
48941
  const StopAIGenerationButton2 = StopAIGenerationButtonOverride === void 0 ? StopAIGenerationButton : StopAIGenerationButtonOverride;
48932
48942
  const shouldDisplayStopAIGeneration = [AIStates.Thinking, AIStates.Generating].includes(aiState) && !!StopAIGenerationButton2;
48933
- return /* @__PURE__ */ import_react245.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react245.default.createElement(
48943
+ return /* @__PURE__ */ import_react246.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react246.default.createElement(
48934
48944
  RecordingPermissionDeniedNotification2,
48935
48945
  {
48936
48946
  onClose: closePermissionDeniedNotification,
48937
48947
  permissionName: "microphone" /* MIC */
48938
48948
  }
48939
- ), /* @__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(
48949
+ ), /* @__PURE__ */ import_react246.default.createElement(LinkPreviewList2, null), /* @__PURE__ */ import_react246.default.createElement(QuotedMessagePreviewHeader, null), /* @__PURE__ */ import_react246.default.createElement("div", { className: "str-chat__message-input-inner" }, /* @__PURE__ */ import_react246.default.createElement(AttachmentSelector2, null), /* @__PURE__ */ import_react246.default.createElement("div", { className: "str-chat__message-textarea-container" }, /* @__PURE__ */ import_react246.default.createElement(QuotedMessagePreview2, null), /* @__PURE__ */ import_react246.default.createElement(AttachmentPreviewList2, null), /* @__PURE__ */ import_react246.default.createElement("div", { className: "str-chat__message-textarea-with-emoji-picker" }, /* @__PURE__ */ import_react246.default.createElement(TextareaComposer2, null), EmojiPicker && /* @__PURE__ */ import_react246.default.createElement(EmojiPicker, null))), shouldDisplayStopAIGeneration ? /* @__PURE__ */ import_react246.default.createElement(StopAIGenerationButton2, { onClick: stopGenerating }) : !hideSendButton && /* @__PURE__ */ import_react246.default.createElement(import_react246.default.Fragment, null, cooldownRemaining ? /* @__PURE__ */ import_react246.default.createElement(
48940
48950
  CooldownTimer2,
48941
48951
  {
48942
48952
  cooldownInterval: cooldownRemaining,
48943
48953
  setCooldownRemaining
48944
48954
  }
48945
- ) : /* @__PURE__ */ import_react245.default.createElement(import_react245.default.Fragment, null, /* @__PURE__ */ import_react245.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react245.default.createElement(
48955
+ ) : /* @__PURE__ */ import_react246.default.createElement(import_react246.default.Fragment, null, /* @__PURE__ */ import_react246.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react246.default.createElement(
48946
48956
  StartRecordingAudioButton2,
48947
48957
  {
48948
48958
  disabled: isRecording || !asyncMessagesMultiSendEnabled && attachments.some(
@@ -48957,7 +48967,7 @@ var MessageInputFlat = () => {
48957
48967
  };
48958
48968
 
48959
48969
  // src/components/MessageInput/hooks/useCreateMessageInputContext.ts
48960
- var import_react246 = require("react");
48970
+ var import_react247 = require("react");
48961
48971
  var useCreateMessageInputContext = (value) => {
48962
48972
  const {
48963
48973
  additionalTextareaProps,
@@ -48981,7 +48991,7 @@ var useCreateMessageInputContext = (value) => {
48981
48991
  textareaRef
48982
48992
  } = value;
48983
48993
  const parentId = parent?.id;
48984
- const messageInputContext = (0, import_react246.useMemo)(
48994
+ const messageInputContext = (0, import_react247.useMemo)(
48985
48995
  () => ({
48986
48996
  additionalTextareaProps,
48987
48997
  asyncMessagesMultiSendEnabled,
@@ -49033,13 +49043,13 @@ var MessageInputProvider = (props) => {
49033
49043
  emojiSearchIndex: props.emojiSearchIndex ?? emojiSearchIndex
49034
49044
  });
49035
49045
  const messageComposer = useMessageComposer();
49036
- (0, import_react247.useEffect)(
49046
+ (0, import_react248.useEffect)(
49037
49047
  () => () => {
49038
49048
  messageComposer.createDraft();
49039
49049
  },
49040
49050
  [messageComposer]
49041
49051
  );
49042
- (0, import_react247.useEffect)(() => {
49052
+ (0, import_react248.useEffect)(() => {
49043
49053
  const threadId = messageComposer.threadId;
49044
49054
  if (!threadId || !messageComposer.channel || !messageComposer.compositionIsEmpty)
49045
49055
  return;
@@ -49050,16 +49060,17 @@ var MessageInputProvider = (props) => {
49050
49060
  });
49051
49061
  }, [messageComposer]);
49052
49062
  useRegisterDropHandlers();
49053
- return /* @__PURE__ */ import_react247.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
49063
+ return /* @__PURE__ */ import_react248.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
49054
49064
  };
49055
49065
  var UnMemoizedMessageInput = (props) => {
49056
49066
  const { Input: PropInput } = props;
49057
49067
  const { Input: ContextInput } = useComponentContext("MessageInput");
49068
+ const id = useStableId();
49058
49069
  const Input3 = PropInput || ContextInput || MessageInputFlat;
49059
- const dialogManagerId = props.isThreadInput ? "message-input-dialog-manager-thread" : "message-input-dialog-manager";
49060
- return /* @__PURE__ */ import_react247.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react247.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react247.default.createElement(Input3, null)));
49070
+ const dialogManagerId = props.isThreadInput ? `message-input-dialog-manager-thread-${id}` : `message-input-dialog-manager-${id}`;
49071
+ return /* @__PURE__ */ import_react248.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react248.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react248.default.createElement(Input3, null)));
49061
49072
  };
49062
- var MessageInput = import_react247.default.memo(
49073
+ var MessageInput = import_react248.default.memo(
49063
49074
  UnMemoizedMessageInput
49064
49075
  );
49065
49076
 
@@ -49067,7 +49078,7 @@ var MessageInput = import_react247.default.memo(
49067
49078
  var EditMessageFormSendButton = () => {
49068
49079
  const { t } = useTranslationContext();
49069
49080
  const hasSendableData = useMessageComposerHasSendableData();
49070
- return /* @__PURE__ */ import_react248.default.createElement(
49081
+ return /* @__PURE__ */ import_react249.default.createElement(
49071
49082
  "button",
49072
49083
  {
49073
49084
  className: "str-chat__edit-message-send",
@@ -49082,26 +49093,26 @@ var EditMessageForm = () => {
49082
49093
  const { t } = useTranslationContext("EditMessageForm");
49083
49094
  const messageComposer = useMessageComposer();
49084
49095
  const { clearEditingState, handleSubmit } = useMessageInputContext("EditMessageForm");
49085
- const cancel = (0, import_react248.useCallback)(() => {
49096
+ const cancel = (0, import_react249.useCallback)(() => {
49086
49097
  clearEditingState?.();
49087
49098
  messageComposer.restore();
49088
49099
  }, [clearEditingState, messageComposer]);
49089
- (0, import_react248.useEffect)(() => {
49100
+ (0, import_react249.useEffect)(() => {
49090
49101
  const onKeyDown = (event) => {
49091
49102
  if (event.key === "Escape") cancel();
49092
49103
  };
49093
49104
  document.addEventListener("keydown", onKeyDown);
49094
49105
  return () => document.removeEventListener("keydown", onKeyDown);
49095
49106
  }, [cancel]);
49096
- return /* @__PURE__ */ import_react248.default.createElement(
49107
+ return /* @__PURE__ */ import_react249.default.createElement(
49097
49108
  "form",
49098
49109
  {
49099
49110
  autoComplete: "off",
49100
49111
  className: "str-chat__edit-message-form",
49101
49112
  onSubmit: handleSubmit
49102
49113
  },
49103
- /* @__PURE__ */ import_react248.default.createElement(MessageInputFlat, null),
49104
- /* @__PURE__ */ import_react248.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react248.default.createElement(
49114
+ /* @__PURE__ */ import_react249.default.createElement(MessageInputFlat, null),
49115
+ /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react249.default.createElement(
49105
49116
  "button",
49106
49117
  {
49107
49118
  className: "str-chat__edit-message-cancel",
@@ -49109,7 +49120,7 @@ var EditMessageForm = () => {
49109
49120
  onClick: cancel
49110
49121
  },
49111
49122
  t("Cancel")
49112
- ), /* @__PURE__ */ import_react248.default.createElement(EditMessageFormSendButton, null))
49123
+ ), /* @__PURE__ */ import_react249.default.createElement(EditMessageFormSendButton, null))
49113
49124
  );
49114
49125
  };
49115
49126
  var EditMessageModal = ({
@@ -49118,18 +49129,18 @@ var EditMessageModal = ({
49118
49129
  const { EditMessageInput = EditMessageForm } = useComponentContext();
49119
49130
  const { clearEditingState } = useMessageContext();
49120
49131
  const messageComposer = useMessageComposer();
49121
- const onEditModalClose = (0, import_react248.useCallback)(() => {
49132
+ const onEditModalClose = (0, import_react249.useCallback)(() => {
49122
49133
  clearEditingState();
49123
49134
  messageComposer.restore();
49124
49135
  }, [clearEditingState, messageComposer]);
49125
- return /* @__PURE__ */ import_react248.default.createElement(
49136
+ return /* @__PURE__ */ import_react249.default.createElement(
49126
49137
  Modal,
49127
49138
  {
49128
49139
  className: "str-chat__edit-message-modal",
49129
49140
  onClose: onEditModalClose,
49130
49141
  open: true
49131
49142
  },
49132
- /* @__PURE__ */ import_react248.default.createElement(
49143
+ /* @__PURE__ */ import_react249.default.createElement(
49133
49144
  MessageInput,
49134
49145
  {
49135
49146
  clearEditingState,
@@ -49146,12 +49157,12 @@ var attachmentManagerConfigStateSelector2 = (state) => ({
49146
49157
  acceptedFiles: state.attachments.acceptedFiles,
49147
49158
  maxNumberOfFilesPerMessage: state.attachments.maxNumberOfFilesPerMessage
49148
49159
  });
49149
- var UploadButton = (0, import_react249.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
49160
+ var UploadButton = (0, import_react250.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
49150
49161
  const handleInputChange = useHandleFileChangeWrapper(resetOnChange, onFileChange);
49151
- return /* @__PURE__ */ import_react249.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
49162
+ return /* @__PURE__ */ import_react250.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
49152
49163
  });
49153
49164
  var FileInput = UploadButton;
49154
- var UploadFileInput = (0, import_react249.forwardRef)(function UploadFileInput2({
49165
+ var UploadFileInput = (0, import_react250.forwardRef)(function UploadFileInput2({
49155
49166
  className,
49156
49167
  onFileChange: onFileChangeCustom,
49157
49168
  ...props
@@ -49165,15 +49176,15 @@ var UploadFileInput = (0, import_react249.forwardRef)(function UploadFileInput2(
49165
49176
  messageComposer.configState,
49166
49177
  attachmentManagerConfigStateSelector2
49167
49178
  );
49168
- const id = (0, import_react249.useMemo)(() => (0, import_nanoid5.nanoid)(), []);
49169
- const onFileChange = (0, import_react249.useCallback)(
49179
+ const id = (0, import_react250.useMemo)(() => (0, import_nanoid6.nanoid)(), []);
49180
+ const onFileChange = (0, import_react250.useCallback)(
49170
49181
  (files) => {
49171
49182
  attachmentManager.uploadFiles(files);
49172
49183
  onFileChangeCustom?.(files);
49173
49184
  },
49174
49185
  [onFileChangeCustom, attachmentManager]
49175
49186
  );
49176
- return /* @__PURE__ */ import_react249.default.createElement(
49187
+ return /* @__PURE__ */ import_react250.default.createElement(
49177
49188
  FileInput,
49178
49189
  {
49179
49190
  accept: acceptedFiles?.join(","),
@@ -49220,7 +49231,7 @@ var VoiceRecordingPlayer = ({
49220
49231
  });
49221
49232
  if (!asset_url) return null;
49222
49233
  const displayedDuration = secondsElapsed || duration;
49223
- 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(
49234
+ return /* @__PURE__ */ import_react251.default.createElement("div", { className: rootClassName, "data-testid": "voice-recording-widget" }, /* @__PURE__ */ import_react251.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react251.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: mime_type })), /* @__PURE__ */ import_react251.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, /* @__PURE__ */ import_react251.default.createElement(
49224
49235
  "div",
49225
49236
  {
49226
49237
  className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -49228,25 +49239,25 @@ var VoiceRecordingPlayer = ({
49228
49239
  title
49229
49240
  },
49230
49241
  title
49231
- ), /* @__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(
49242
+ ), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(displayedDuration) : /* @__PURE__ */ import_react251.default.createElement(
49232
49243
  FileSizeIndicator,
49233
49244
  {
49234
49245
  fileSize: attachment.file_size,
49235
49246
  maximumFractionDigits: 0
49236
49247
  }
49237
- )), /* @__PURE__ */ import_react250.default.createElement(
49248
+ )), /* @__PURE__ */ import_react251.default.createElement(
49238
49249
  WaveProgressBar,
49239
49250
  {
49240
49251
  progress,
49241
49252
  seek,
49242
49253
  waveformData: waveform_data || []
49243
49254
  }
49244
- ))), /* @__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 })));
49255
+ ))), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__right-section" }, isPlaying ? /* @__PURE__ */ import_react251.default.createElement(PlaybackRateButton, { disabled: !audioRef.current, onClick: increasePlaybackRate }, playbackRate.toFixed(1), "x") : /* @__PURE__ */ import_react251.default.createElement(FileIcon, { big: true, mimeType: mime_type, size: 40 })));
49245
49256
  };
49246
49257
  var QuotedVoiceRecording = ({ attachment }) => {
49247
49258
  const { t } = useTranslationContext();
49248
49259
  const title = attachment.title || t("Voice message");
49249
- 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(
49260
+ return /* @__PURE__ */ import_react251.default.createElement("div", { className: rootClassName, "data-testid": "quoted-voice-recording-widget" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, title && /* @__PURE__ */ import_react251.default.createElement(
49250
49261
  "div",
49251
49262
  {
49252
49263
  className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -49254,18 +49265,18 @@ var QuotedVoiceRecording = ({ attachment }) => {
49254
49265
  title
49255
49266
  },
49256
49267
  title
49257
- ), /* @__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(
49268
+ ), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(attachment.duration) : /* @__PURE__ */ import_react251.default.createElement(
49258
49269
  FileSizeIndicator,
49259
49270
  {
49260
49271
  fileSize: attachment.file_size,
49261
49272
  maximumFractionDigits: 0
49262
49273
  }
49263
- )))), /* @__PURE__ */ import_react250.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
49274
+ )))), /* @__PURE__ */ import_react251.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
49264
49275
  };
49265
- var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react250.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react250.default.createElement(VoiceRecordingPlayer, { attachment });
49276
+ var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react251.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react251.default.createElement(VoiceRecordingPlayer, { attachment });
49266
49277
 
49267
49278
  // src/components/Attachment/Card.tsx
49268
- var import_react251 = __toESM(require("react"));
49279
+ var import_react252 = __toESM(require("react"));
49269
49280
  var import_clsx64 = __toESM(require("clsx"));
49270
49281
  var import_react_player = __toESM(require("react-player"));
49271
49282
  var getHostFromURL = (url) => {
@@ -49277,26 +49288,26 @@ var getHostFromURL = (url) => {
49277
49288
  };
49278
49289
  var UnableToRenderCard = ({ type }) => {
49279
49290
  const { t } = useTranslationContext("Card");
49280
- return /* @__PURE__ */ import_react251.default.createElement(
49291
+ return /* @__PURE__ */ import_react252.default.createElement(
49281
49292
  "div",
49282
49293
  {
49283
49294
  className: (0, import_clsx64.default)("str-chat__message-attachment-card", {
49284
49295
  [`str-chat__message-attachment-card--${type}`]: type
49285
49296
  })
49286
49297
  },
49287
- /* @__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")))
49298
+ /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, t("this content could not be displayed")))
49288
49299
  );
49289
49300
  };
49290
49301
  var SourceLink = ({
49291
49302
  author_name,
49292
49303
  url
49293
- }) => /* @__PURE__ */ import_react251.default.createElement(
49304
+ }) => /* @__PURE__ */ import_react252.default.createElement(
49294
49305
  "div",
49295
49306
  {
49296
49307
  className: "str-chat__message-attachment-card--source-link",
49297
49308
  "data-testid": "card-source-link"
49298
49309
  },
49299
- /* @__PURE__ */ import_react251.default.createElement(
49310
+ /* @__PURE__ */ import_react252.default.createElement(
49300
49311
  SafeAnchor,
49301
49312
  {
49302
49313
  className: "str-chat__message-attachment-card--url",
@@ -49311,7 +49322,7 @@ var CardHeader3 = (props) => {
49311
49322
  const { asset_url, dimensions, image: image4, image_url, thumb_url, title, type } = props;
49312
49323
  let visual = null;
49313
49324
  if (asset_url && type === "video") {
49314
- visual = /* @__PURE__ */ import_react251.default.createElement(
49325
+ visual = /* @__PURE__ */ import_react252.default.createElement(
49315
49326
  import_react_player.default,
49316
49327
  {
49317
49328
  className: "react-player",
@@ -49322,7 +49333,7 @@ var CardHeader3 = (props) => {
49322
49333
  }
49323
49334
  );
49324
49335
  } else if (image4) {
49325
- visual = /* @__PURE__ */ import_react251.default.createElement(
49336
+ visual = /* @__PURE__ */ import_react252.default.createElement(
49326
49337
  ImageComponent,
49327
49338
  {
49328
49339
  dimensions,
@@ -49332,7 +49343,7 @@ var CardHeader3 = (props) => {
49332
49343
  }
49333
49344
  );
49334
49345
  }
49335
- return visual ? /* @__PURE__ */ import_react251.default.createElement(
49346
+ return visual ? /* @__PURE__ */ import_react252.default.createElement(
49336
49347
  "div",
49337
49348
  {
49338
49349
  className: "str-chat__message-attachment-card--header str-chat__message-attachment-card-react--header",
@@ -49344,7 +49355,7 @@ var CardHeader3 = (props) => {
49344
49355
  var CardContent = (props) => {
49345
49356
  const { author_name, og_scrape_url, text: text8, title, title_link, type } = props;
49346
49357
  const url = title_link || og_scrape_url;
49347
- 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), text8 && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, text8)));
49358
+ return /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, type === "audio" ? /* @__PURE__ */ import_react252.default.createElement(CardAudio, { og: props }) : /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-card--flex" }, url && /* @__PURE__ */ import_react252.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-card--title" }, title), text8 && /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, text8)));
49348
49359
  };
49349
49360
  var CardAudio = ({
49350
49361
  og: { asset_url, author_name, mime_type, og_scrape_url, text: text8, title, title_link }
@@ -49355,7 +49366,7 @@ var CardAudio = ({
49355
49366
  const url = title_link || og_scrape_url;
49356
49367
  const dataTestId = "card-audio-widget";
49357
49368
  const rootClassName2 = "str-chat__message-attachment-card-audio-widget";
49358
- 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), text8 && /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--description" }, text8)));
49369
+ return /* @__PURE__ */ import_react252.default.createElement("div", { className: rootClassName2, "data-testid": dataTestId }, asset_url && /* @__PURE__ */ import_react252.default.createElement(import_react252.default.Fragment, null, /* @__PURE__ */ import_react252.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react252.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: "audio/mp3" })), /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-card-audio-widget--first-row" }, /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--play-controls" }, /* @__PURE__ */ import_react252.default.createElement(PlayButton, { isPlaying, onClick: togglePlay })), /* @__PURE__ */ import_react252.default.createElement(ProgressBar, { onClick: seek, progress }))), /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--second-row" }, url && /* @__PURE__ */ import_react252.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--title" }, title), text8 && /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--description" }, text8)));
49359
49370
  };
49360
49371
  var UnMemoizedCard = (props) => {
49361
49372
  const { asset_url, giphy, image_url, thumb_url, title, title_link, type } = props;
@@ -49369,45 +49380,45 @@ var UnMemoizedCard = (props) => {
49369
49380
  dimensions.width = giphyVersion.width;
49370
49381
  }
49371
49382
  if (!title && !title_link && !asset_url && !image4) {
49372
- return /* @__PURE__ */ import_react251.default.createElement(UnableToRenderCard, null);
49383
+ return /* @__PURE__ */ import_react252.default.createElement(UnableToRenderCard, null);
49373
49384
  }
49374
- return /* @__PURE__ */ import_react251.default.createElement(
49385
+ return /* @__PURE__ */ import_react252.default.createElement(
49375
49386
  "div",
49376
49387
  {
49377
49388
  className: `str-chat__message-attachment-card str-chat__message-attachment-card--${type}`
49378
49389
  },
49379
- /* @__PURE__ */ import_react251.default.createElement(CardHeader3, { ...props, dimensions, image: image4 }),
49380
- /* @__PURE__ */ import_react251.default.createElement(CardContent, { ...props })
49390
+ /* @__PURE__ */ import_react252.default.createElement(CardHeader3, { ...props, dimensions, image: image4 }),
49391
+ /* @__PURE__ */ import_react252.default.createElement(CardContent, { ...props })
49381
49392
  );
49382
49393
  };
49383
- var Card3 = import_react251.default.memo(UnMemoizedCard);
49394
+ var Card3 = import_react252.default.memo(UnMemoizedCard);
49384
49395
 
49385
49396
  // src/components/Attachment/FileAttachment.tsx
49386
- var import_react252 = __toESM(require("react"));
49387
- 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(
49397
+ var import_react253 = __toESM(require("react"));
49398
+ var UnMemoizedFileAttachment = ({ attachment }) => /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__message-attachment-file--item", "data-testid": "attachment-file" }, /* @__PURE__ */ import_react253.default.createElement(FileIcon, { className: "str-chat__file-icon", mimeType: attachment.mime_type }), /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__message-attachment-file--item-text" }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__message-attachment-file--item-first-row" }, /* @__PURE__ */ import_react253.default.createElement(
49388
49399
  "div",
49389
49400
  {
49390
49401
  className: "str-chat__message-attachment-file--item-name",
49391
49402
  "data-testid": "file-title"
49392
49403
  },
49393
49404
  attachment.title
49394
- ), /* @__PURE__ */ import_react252.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react252.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
49395
- var FileAttachment = import_react252.default.memo(
49405
+ ), /* @__PURE__ */ import_react253.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react253.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
49406
+ var FileAttachment = import_react253.default.memo(
49396
49407
  UnMemoizedFileAttachment
49397
49408
  );
49398
49409
 
49399
49410
  // src/components/Attachment/UnsupportedAttachment.tsx
49400
- var import_react253 = __toESM(require("react"));
49411
+ var import_react254 = __toESM(require("react"));
49401
49412
  var UnsupportedAttachment = ({ attachment }) => {
49402
49413
  const { t } = useTranslationContext("UnsupportedAttachment");
49403
- return /* @__PURE__ */ import_react253.default.createElement(
49414
+ return /* @__PURE__ */ import_react254.default.createElement(
49404
49415
  "div",
49405
49416
  {
49406
49417
  className: "str-chat__message-attachment-unsupported",
49407
49418
  "data-testid": "attachment-unsupported"
49408
49419
  },
49409
- /* @__PURE__ */ import_react253.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
49410
- /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react253.default.createElement(
49420
+ /* @__PURE__ */ import_react254.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
49421
+ /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react254.default.createElement(
49411
49422
  "div",
49412
49423
  {
49413
49424
  className: "str-chat__message-attachment-unsupported__title",
@@ -49439,7 +49450,7 @@ var AttachmentWithinContainer = ({
49439
49450
  "str-chat__message-attachment-with-actions": extra === "actions"
49440
49451
  }
49441
49452
  );
49442
- return /* @__PURE__ */ import_react254.default.createElement("div", { className: classNames }, children);
49453
+ return /* @__PURE__ */ import_react255.default.createElement("div", { className: classNames }, children);
49443
49454
  };
49444
49455
  var AttachmentActionsContainer = ({
49445
49456
  actionHandler,
@@ -49447,7 +49458,7 @@ var AttachmentActionsContainer = ({
49447
49458
  AttachmentActions: AttachmentActions2 = AttachmentActions
49448
49459
  }) => {
49449
49460
  if (!attachment.actions?.length) return null;
49450
- return /* @__PURE__ */ import_react254.default.createElement(
49461
+ return /* @__PURE__ */ import_react255.default.createElement(
49451
49462
  AttachmentActions2,
49452
49463
  {
49453
49464
  ...attachment,
@@ -49478,10 +49489,10 @@ var GalleryContainer = ({
49478
49489
  attachment,
49479
49490
  Gallery: Gallery2 = Gallery
49480
49491
  }) => {
49481
- const imageElements = (0, import_react254.useRef)([]);
49492
+ const imageElements = (0, import_react255.useRef)([]);
49482
49493
  const { imageAttachmentSizeHandler } = useChannelStateContext();
49483
- const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react254.useState)([]);
49484
- (0, import_react254.useLayoutEffect)(() => {
49494
+ const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react255.useState)([]);
49495
+ (0, import_react255.useLayoutEffect)(() => {
49485
49496
  if (imageElements.current && imageElements.current.every((element4) => !!element4) && imageAttachmentSizeHandler) {
49486
49497
  const newConfigurations = [];
49487
49498
  imageElements.current.forEach((element4, i) => {
@@ -49498,15 +49509,15 @@ var GalleryContainer = ({
49498
49509
  attachment.images[i]?.image_url || attachment.images[i]?.thumb_url || ""
49499
49510
  )
49500
49511
  }));
49501
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react254.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
49512
+ return /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react255.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
49502
49513
  };
49503
49514
  var ImageContainer = (props) => {
49504
49515
  const { attachment, Image: Image4 = ImageComponent } = props;
49505
49516
  const componentType = "image";
49506
- const imageElement = (0, import_react254.useRef)(null);
49517
+ const imageElement = (0, import_react255.useRef)(null);
49507
49518
  const { imageAttachmentSizeHandler } = useChannelStateContext();
49508
- const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)(void 0);
49509
- (0, import_react254.useLayoutEffect)(() => {
49519
+ const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react255.useState)(void 0);
49520
+ (0, import_react255.useLayoutEffect)(() => {
49510
49521
  if (imageElement.current && imageAttachmentSizeHandler) {
49511
49522
  const config = imageAttachmentSizeHandler(attachment, imageElement.current);
49512
49523
  setAttachmentConfiguration(config);
@@ -49518,41 +49529,41 @@ var ImageContainer = (props) => {
49518
49529
  style: getCssDimensionsVariables(attachment.image_url || attachment.thumb_url || "")
49519
49530
  };
49520
49531
  if (attachment.actions && attachment.actions.length) {
49521
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }), /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props })));
49532
+ return /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react255.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }), /* @__PURE__ */ import_react255.default.createElement(AttachmentActionsContainer, { ...props })));
49522
49533
  }
49523
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }));
49534
+ return /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react255.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }));
49524
49535
  };
49525
49536
  var CardContainer = (props) => {
49526
49537
  const { attachment, Card: Card4 = Card3 } = props;
49527
49538
  const componentType = "card";
49528
49539
  if (attachment.actions && attachment.actions.length) {
49529
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react254.default.createElement(Card4, { ...attachment }), /* @__PURE__ */ import_react254.default.createElement(AttachmentActionsContainer, { ...props })));
49540
+ return /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react255.default.createElement(Card4, { ...attachment }), /* @__PURE__ */ import_react255.default.createElement(AttachmentActionsContainer, { ...props })));
49530
49541
  }
49531
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Card4, { ...attachment }));
49542
+ return /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react255.default.createElement(Card4, { ...attachment }));
49532
49543
  };
49533
49544
  var FileContainer = ({
49534
49545
  attachment,
49535
49546
  File: File2 = FileAttachment
49536
49547
  }) => {
49537
49548
  if (!attachment.asset_url) return null;
49538
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react254.default.createElement(File2, { attachment }));
49549
+ return /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react255.default.createElement(File2, { attachment }));
49539
49550
  };
49540
49551
  var AudioContainer = ({
49541
49552
  attachment,
49542
49553
  Audio: Audio2 = Audio
49543
- }) => /* @__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 })));
49554
+ }) => /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType: "audio" }, /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react255.default.createElement(Audio2, { og: attachment })));
49544
49555
  var VoiceRecordingContainer = ({
49545
49556
  attachment,
49546
49557
  isQuoted,
49547
49558
  VoiceRecording: VoiceRecording2 = VoiceRecording
49548
- }) => /* @__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 })));
49559
+ }) => /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType: "voiceRecording" }, /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react255.default.createElement(VoiceRecording2, { attachment, isQuoted })));
49549
49560
  var MediaContainer = (props) => {
49550
49561
  const { attachment, Media = import_react_player2.default } = props;
49551
49562
  const componentType = "media";
49552
49563
  const { shouldGenerateVideoThumbnail, videoAttachmentSizeHandler } = useChannelStateContext();
49553
- const videoElement = (0, import_react254.useRef)(null);
49554
- const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)();
49555
- (0, import_react254.useLayoutEffect)(() => {
49564
+ const videoElement = (0, import_react255.useRef)(null);
49565
+ const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react255.useState)();
49566
+ (0, import_react255.useLayoutEffect)(() => {
49556
49567
  if (videoElement.current && videoAttachmentSizeHandler) {
49557
49568
  const config = videoAttachmentSizeHandler(
49558
49569
  attachment,
@@ -49562,7 +49573,7 @@ var MediaContainer = (props) => {
49562
49573
  setAttachmentConfiguration(config);
49563
49574
  }
49564
49575
  }, [videoElement, videoAttachmentSizeHandler, attachment]);
49565
- const content3 = /* @__PURE__ */ import_react254.default.createElement(
49576
+ const content3 = /* @__PURE__ */ import_react255.default.createElement(
49566
49577
  "div",
49567
49578
  {
49568
49579
  className: "str-chat__player-wrapper",
@@ -49570,7 +49581,7 @@ var MediaContainer = (props) => {
49570
49581
  ref: videoElement,
49571
49582
  style: getCssDimensionsVariables(attachment.thumb_url || "")
49572
49583
  },
49573
- /* @__PURE__ */ import_react254.default.createElement(
49584
+ /* @__PURE__ */ import_react255.default.createElement(
49574
49585
  Media,
49575
49586
  {
49576
49587
  className: "react-player",
@@ -49582,12 +49593,12 @@ var MediaContainer = (props) => {
49582
49593
  }
49583
49594
  )
49584
49595
  );
49585
- 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);
49596
+ return attachment.actions?.length ? /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment" }, content3, /* @__PURE__ */ import_react255.default.createElement(AttachmentActionsContainer, { ...props }))) : /* @__PURE__ */ import_react255.default.createElement(AttachmentWithinContainer, { attachment, componentType }, content3);
49586
49597
  };
49587
49598
  var UnsupportedAttachmentContainer = ({
49588
49599
  attachment,
49589
49600
  UnsupportedAttachment: UnsupportedAttachment2 = UnsupportedAttachment
49590
- }) => /* @__PURE__ */ import_react254.default.createElement(import_react254.default.Fragment, null, /* @__PURE__ */ import_react254.default.createElement(UnsupportedAttachment2, { attachment }));
49601
+ }) => /* @__PURE__ */ import_react255.default.createElement(import_react255.default.Fragment, null, /* @__PURE__ */ import_react255.default.createElement(UnsupportedAttachment2, { attachment }));
49591
49602
 
49592
49603
  // src/components/Attachment/Attachment.tsx
49593
49604
  var CONTAINER_MAP = {
@@ -49610,12 +49621,12 @@ var ATTACHMENT_GROUPS_ORDER = [
49610
49621
  ];
49611
49622
  var Attachment = (props) => {
49612
49623
  const { attachments } = props;
49613
- const groupedAttachments = (0, import_react255.useMemo)(
49624
+ const groupedAttachments = (0, import_react256.useMemo)(
49614
49625
  () => renderGroupedAttachments(props),
49615
49626
  // eslint-disable-next-line react-hooks/exhaustive-deps
49616
49627
  [attachments]
49617
49628
  );
49618
- return /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
49629
+ return /* @__PURE__ */ import_react256.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
49619
49630
  (acc, groupName) => [...acc, ...groupedAttachments[groupName]],
49620
49631
  []
49621
49632
  ));
@@ -49632,7 +49643,7 @@ var renderGroupedAttachments = ({
49632
49643
  const attachmentType = getAttachmentType(attachment);
49633
49644
  const Container = CONTAINER_MAP[attachmentType];
49634
49645
  typeMap[attachmentType].push(
49635
- /* @__PURE__ */ import_react255.default.createElement(
49646
+ /* @__PURE__ */ import_react256.default.createElement(
49636
49647
  Container,
49637
49648
  {
49638
49649
  key: `${attachmentType}-${typeMap[attachmentType].length}`,
@@ -49659,7 +49670,7 @@ var renderGroupedAttachments = ({
49659
49670
  );
49660
49671
  if (uploadedImages.length > 1) {
49661
49672
  containers["gallery"] = [
49662
- /* @__PURE__ */ import_react255.default.createElement(
49673
+ /* @__PURE__ */ import_react256.default.createElement(
49663
49674
  GalleryContainer,
49664
49675
  {
49665
49676
  key: "gallery-container",
@@ -49673,7 +49684,7 @@ var renderGroupedAttachments = ({
49673
49684
  ];
49674
49685
  } else if (uploadedImages.length === 1) {
49675
49686
  containers["image"] = [
49676
- /* @__PURE__ */ import_react255.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
49687
+ /* @__PURE__ */ import_react256.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
49677
49688
  ];
49678
49689
  }
49679
49690
  return containers;
@@ -49694,7 +49705,7 @@ var getAttachmentType = (attachment) => {
49694
49705
  };
49695
49706
 
49696
49707
  // src/components/Channel/Channel.tsx
49697
- var import_react261 = __toESM(require("react"));
49708
+ var import_react262 = __toESM(require("react"));
49698
49709
  var import_clsx66 = __toESM(require("clsx"));
49699
49710
  var import_lodash20 = __toESM(require("lodash.debounce"));
49700
49711
  var import_lodash21 = __toESM(require("lodash.defaultsdeep"));
@@ -49875,7 +49886,7 @@ var initialState = {
49875
49886
  };
49876
49887
 
49877
49888
  // src/components/Channel/hooks/useCreateChannelStateContext.ts
49878
- var import_react256 = require("react");
49889
+ var import_react257 = require("react");
49879
49890
  var useCreateChannelStateContext = (value) => {
49880
49891
  const {
49881
49892
  channel,
@@ -49934,7 +49945,7 @@ var useCreateChannelStateContext = (value) => {
49934
49945
  const memoizedThreadMessageData = threadMessages.map(
49935
49946
  ({ 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}`
49936
49947
  ).join();
49937
- const channelStateContext = (0, import_react256.useMemo)(
49948
+ const channelStateContext = (0, import_react257.useMemo)(
49938
49949
  () => ({
49939
49950
  channel,
49940
49951
  channelCapabilities,
@@ -49998,11 +50009,11 @@ var useCreateChannelStateContext = (value) => {
49998
50009
  };
49999
50010
 
50000
50011
  // src/components/Channel/hooks/useCreateTypingContext.ts
50001
- var import_react257 = require("react");
50012
+ var import_react258 = require("react");
50002
50013
  var useCreateTypingContext = (value) => {
50003
50014
  const { typing } = value;
50004
50015
  const typingValue = Object.keys(typing || {}).join();
50005
- const typingContext = (0, import_react257.useMemo)(
50016
+ const typingContext = (0, import_react258.useMemo)(
50006
50017
  () => ({
50007
50018
  typing
50008
50019
  }),
@@ -50026,10 +50037,10 @@ var useEditMessageHandler = (doUpdateMessageRequest) => {
50026
50037
  };
50027
50038
 
50028
50039
  // src/components/Channel/hooks/useIsMounted.ts
50029
- var import_react258 = require("react");
50040
+ var import_react259 = require("react");
50030
50041
  var useIsMounted = () => {
50031
- const isMounted = (0, import_react258.useRef)(false);
50032
- (0, import_react258.useEffect)(() => {
50042
+ const isMounted = (0, import_react259.useRef)(false);
50043
+ (0, import_react259.useEffect)(() => {
50033
50044
  isMounted.current = true;
50034
50045
  return () => {
50035
50046
  isMounted.current = false;
@@ -50039,8 +50050,8 @@ var useIsMounted = () => {
50039
50050
  };
50040
50051
 
50041
50052
  // src/components/Channel/hooks/useMentionsHandlers.ts
50042
- var import_react259 = require("react");
50043
- var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react259.useCallback)(
50053
+ var import_react260 = require("react");
50054
+ var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react260.useCallback)(
50044
50055
  (event, mentioned_users) => {
50045
50056
  if (!onMentionsHover && !onMentionsClick || !(event.target instanceof HTMLElement)) {
50046
50057
  return;
@@ -50064,11 +50075,11 @@ var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react
50064
50075
  );
50065
50076
 
50066
50077
  // src/components/Channel/LoadingChannel.tsx
50067
- var import_react260 = __toESM(require("react"));
50068
- 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" }))));
50069
- 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" }));
50070
- 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" })));
50071
- 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));
50078
+ var import_react261 = __toESM(require("react"));
50079
+ var LoadingMessage = () => /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message" }, /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-avatar" }), /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-end" }, /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-sender" }), /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-last-row" }, /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-text" }), /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-date" }))));
50080
+ var LoadingMessageInput = () => /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-input-row" }, /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-input" }), /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-send" }));
50081
+ var LoadingChannelHeader = () => /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-header" }, /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-header-avatar" }), /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-header-end" }, /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-header-name" }), /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-header-info" })));
50082
+ var LoadingChannel = () => /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel" }, /* @__PURE__ */ import_react261.default.createElement(LoadingChannelHeader, null), /* @__PURE__ */ import_react261.default.createElement("div", { className: "str-chat__loading-channel-message-list" }, Array.from(Array(3)).map((_, i) => /* @__PURE__ */ import_react261.default.createElement(LoadingMessage, { key: `loading-message-${i}` }))), /* @__PURE__ */ import_react261.default.createElement(LoadingMessageInput, null));
50072
50083
 
50073
50084
  // src/components/Channel/hooks/useChannelContainerClasses.ts
50074
50085
  var useImageFlagEmojisOnWindowsClass = () => {
@@ -50089,12 +50100,12 @@ var useChannelContainerClasses = ({
50089
50100
  };
50090
50101
 
50091
50102
  // src/components/Channel/utils.ts
50092
- var import_nanoid6 = require("nanoid");
50103
+ var import_nanoid7 = require("nanoid");
50093
50104
  var makeAddNotifications = (setNotifications, notificationTimeouts) => (text8, type) => {
50094
50105
  if (typeof text8 !== "string" || type !== "success" && type !== "error") {
50095
50106
  return;
50096
50107
  }
50097
- const id = (0, import_nanoid6.nanoid)();
50108
+ const id = (0, import_nanoid7.nanoid)();
50098
50109
  setNotifications((prevNotifications) => [...prevNotifications, { id, text: text8, type }]);
50099
50110
  const timeout = setTimeout(
50100
50111
  () => setNotifications(
@@ -50255,7 +50266,7 @@ var ChannelContainer = ({
50255
50266
  customClasses
50256
50267
  });
50257
50268
  const className = (0, import_clsx66.default)(chatClass, theme, channelClass, additionalClassName);
50258
- return /* @__PURE__ */ import_react261.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
50269
+ return /* @__PURE__ */ import_react262.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
50259
50270
  };
50260
50271
  var UnMemoizedChannel = (props) => {
50261
50272
  const {
@@ -50267,15 +50278,15 @@ var UnMemoizedChannel = (props) => {
50267
50278
  const { channel: contextChannel, channelsQueryState } = useChatContext("Channel");
50268
50279
  const channel = propsChannel || contextChannel;
50269
50280
  if (channelsQueryState.queryInProgress === "reload" && LoadingIndicator2) {
50270
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
50281
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react262.default.createElement(LoadingIndicator2, null));
50271
50282
  }
50272
50283
  if (channelsQueryState.error && LoadingErrorIndicator2) {
50273
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
50284
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react262.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
50274
50285
  }
50275
50286
  if (!channel?.cid) {
50276
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
50287
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
50277
50288
  }
50278
- return /* @__PURE__ */ import_react261.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
50289
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
50279
50290
  };
50280
50291
  var ChannelInner = (props) => {
50281
50292
  const {
@@ -50295,7 +50306,7 @@ var ChannelInner = (props) => {
50295
50306
  onMentionsHover,
50296
50307
  skipMessageDataMemoization
50297
50308
  } = props;
50298
- const channelQueryOptions = (0, import_react261.useMemo)(
50309
+ const channelQueryOptions = (0, import_react262.useMemo)(
50299
50310
  () => (0, import_lodash21.default)(propChannelQueryOptions, {
50300
50311
  messages: { limit: DEFAULT_INITIAL_CHANNEL_PAGE_SIZE }
50301
50312
  }),
@@ -50306,12 +50317,12 @@ var ChannelInner = (props) => {
50306
50317
  const chatContainerClass = getChatContainerClass(customClasses?.chatContainer);
50307
50318
  const windowsEmojiClass = useImageFlagEmojisOnWindowsClass();
50308
50319
  const thread = useThreadContext();
50309
- const [channelConfig, setChannelConfig] = (0, import_react261.useState)(channel.getConfig());
50310
- const [notifications, setNotifications] = (0, import_react261.useState)([]);
50311
- const notificationTimeouts = (0, import_react261.useRef)([]);
50312
- const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react261.useState)();
50313
- const channelReducer = (0, import_react261.useMemo)(() => makeChannelReducer(), []);
50314
- const [state, dispatch] = (0, import_react261.useReducer)(
50320
+ const [channelConfig, setChannelConfig] = (0, import_react262.useState)(channel.getConfig());
50321
+ const [notifications, setNotifications] = (0, import_react262.useState)([]);
50322
+ const notificationTimeouts = (0, import_react262.useRef)([]);
50323
+ const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react262.useState)();
50324
+ const channelReducer = (0, import_react262.useMemo)(() => makeChannelReducer(), []);
50325
+ const [state, dispatch] = (0, import_react262.useReducer)(
50315
50326
  channelReducer,
50316
50327
  // channel.initialized === false if client.channel().query() was not called, e.g. ChannelList is not used
50317
50328
  // => Channel will call channel.watch() in useLayoutEffect => state.loading is used to signal the watch() call state
@@ -50323,10 +50334,10 @@ var ChannelInner = (props) => {
50323
50334
  );
50324
50335
  const jumpToMessageFromSearch = useSearchFocusedMessage();
50325
50336
  const isMounted = useIsMounted();
50326
- const originalTitle = (0, import_react261.useRef)("");
50327
- const lastRead = (0, import_react261.useRef)(void 0);
50328
- const online = (0, import_react261.useRef)(true);
50329
- const clearHighlightedMessageTimeoutId = (0, import_react261.useRef)(
50337
+ const originalTitle = (0, import_react262.useRef)("");
50338
+ const lastRead = (0, import_react262.useRef)(void 0);
50339
+ const online = (0, import_react262.useRef)(true);
50340
+ const clearHighlightedMessageTimeoutId = (0, import_react262.useRef)(
50330
50341
  null
50331
50342
  );
50332
50343
  const channelCapabilitiesArray = channel.data?.own_capabilities;
@@ -50338,14 +50349,14 @@ var ChannelInner = (props) => {
50338
50349
  trailing: true
50339
50350
  }
50340
50351
  );
50341
- const setChannelUnreadUiState = (0, import_react261.useMemo)(
50352
+ const setChannelUnreadUiState = (0, import_react262.useMemo)(
50342
50353
  () => (0, import_lodash22.default)(_setChannelUnreadUiState, 200, {
50343
50354
  leading: true,
50344
50355
  trailing: false
50345
50356
  }),
50346
50357
  []
50347
50358
  );
50348
- const markRead = (0, import_react261.useMemo)(
50359
+ const markRead = (0, import_react262.useMemo)(
50349
50360
  () => (0, import_lodash22.default)(
50350
50361
  async (options) => {
50351
50362
  const { updateChannelUiUnreadState = true } = options ?? {};
@@ -50448,7 +50459,7 @@ var ChannelInner = (props) => {
50448
50459
  }
50449
50460
  throttledCopyStateFromChannel();
50450
50461
  };
50451
- (0, import_react261.useLayoutEffect)(() => {
50462
+ (0, import_react262.useLayoutEffect)(() => {
50452
50463
  let errored = false;
50453
50464
  let done = false;
50454
50465
  (async () => {
@@ -50514,12 +50525,12 @@ var ChannelInner = (props) => {
50514
50525
  channelConfig?.read_events,
50515
50526
  initializeOnMount
50516
50527
  ]);
50517
- (0, import_react261.useEffect)(() => {
50528
+ (0, import_react262.useEffect)(() => {
50518
50529
  if (!state.thread) return;
50519
50530
  const message = state.messages?.find((m) => m.id === state.thread?.id);
50520
50531
  if (message) dispatch({ message, type: "setThread" });
50521
50532
  }, [state.messages, state.thread]);
50522
- const handleHighlightedMessageChange = (0, import_react261.useCallback)(
50533
+ const handleHighlightedMessageChange = (0, import_react262.useCallback)(
50523
50534
  ({
50524
50535
  highlightDuration,
50525
50536
  highlightedMessageId
@@ -50542,15 +50553,15 @@ var ChannelInner = (props) => {
50542
50553
  },
50543
50554
  [channel, searchController]
50544
50555
  );
50545
- (0, import_react261.useEffect)(() => {
50556
+ (0, import_react262.useEffect)(() => {
50546
50557
  if (!jumpToMessageFromSearch?.id) return;
50547
50558
  handleHighlightedMessageChange({ highlightedMessageId: jumpToMessageFromSearch.id });
50548
50559
  }, [jumpToMessageFromSearch, handleHighlightedMessageChange]);
50549
- const addNotification = (0, import_react261.useMemo)(
50560
+ const addNotification = (0, import_react262.useMemo)(
50550
50561
  () => makeAddNotifications(setNotifications, notificationTimeouts.current),
50551
50562
  []
50552
50563
  );
50553
- const loadMoreFinished = (0, import_react261.useCallback)(
50564
+ const loadMoreFinished = (0, import_react262.useCallback)(
50554
50565
  (0, import_lodash20.default)(
50555
50566
  (hasMore, messages) => {
50556
50567
  if (!isMounted.current) return;
@@ -50611,7 +50622,7 @@ var ChannelInner = (props) => {
50611
50622
  });
50612
50623
  return queryResponse.messages.length;
50613
50624
  };
50614
- const jumpToMessage = (0, import_react261.useCallback)(
50625
+ const jumpToMessage = (0, import_react262.useCallback)(
50615
50626
  async (messageId, messageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
50616
50627
  dispatch({ loadingMore: true, type: "setLoadingMore" });
50617
50628
  await channel.state.loadMessageIntoState(messageId, void 0, messageLimit);
@@ -50623,14 +50634,14 @@ var ChannelInner = (props) => {
50623
50634
  },
50624
50635
  [channel, handleHighlightedMessageChange, loadMoreFinished]
50625
50636
  );
50626
- const jumpToLatestMessage = (0, import_react261.useCallback)(async () => {
50637
+ const jumpToLatestMessage = (0, import_react262.useCallback)(async () => {
50627
50638
  await channel.state.loadMessageIntoState("latest");
50628
50639
  loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
50629
50640
  dispatch({
50630
50641
  type: "jumpToLatestMessage"
50631
50642
  });
50632
50643
  }, [channel, loadMoreFinished]);
50633
- const jumpToFirstUnreadMessage = (0, import_react261.useCallback)(
50644
+ const jumpToFirstUnreadMessage = (0, import_react262.useCallback)(
50634
50645
  async (queryMessageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
50635
50646
  if (!channelUnreadUiState?.unread_messages) return;
50636
50647
  let lastReadMessageId = channelUnreadUiState?.last_read_message_id;
@@ -50753,7 +50764,7 @@ var ChannelInner = (props) => {
50753
50764
  channelUnreadUiState
50754
50765
  ]
50755
50766
  );
50756
- const deleteMessage = (0, import_react261.useCallback)(
50767
+ const deleteMessage = (0, import_react262.useCallback)(
50757
50768
  async (message) => {
50758
50769
  if (!message?.id) {
50759
50770
  throw new Error("Cannot delete a message - missing message ID.");
@@ -50871,7 +50882,7 @@ var ChannelInner = (props) => {
50871
50882
  event?.preventDefault();
50872
50883
  dispatch({ type: "closeThread" });
50873
50884
  };
50874
- const loadMoreThreadFinished = (0, import_react261.useCallback)(
50885
+ const loadMoreThreadFinished = (0, import_react262.useCallback)(
50875
50886
  (0, import_lodash20.default)(
50876
50887
  (threadHasMore, threadMessages) => {
50877
50888
  dispatch({
@@ -50926,7 +50937,7 @@ var ChannelInner = (props) => {
50926
50937
  videoAttachmentSizeHandler: props.videoAttachmentSizeHandler || getVideoAttachmentConfiguration,
50927
50938
  watcher_count: state.watcherCount
50928
50939
  });
50929
- const channelActionContextValue = (0, import_react261.useMemo)(
50940
+ const channelActionContextValue = (0, import_react262.useMemo)(
50930
50941
  () => ({
50931
50942
  addNotification,
50932
50943
  closeThread,
@@ -50963,7 +50974,7 @@ var ChannelInner = (props) => {
50963
50974
  setChannelUnreadUiState
50964
50975
  ]
50965
50976
  );
50966
- const componentContextValue = (0, import_react261.useMemo)(
50977
+ const componentContextValue = (0, import_react262.useMemo)(
50967
50978
  () => ({
50968
50979
  Attachment: props.Attachment,
50969
50980
  AttachmentPreviewList: props.AttachmentPreviewList,
@@ -51095,26 +51106,26 @@ var ChannelInner = (props) => {
51095
51106
  typing
51096
51107
  });
51097
51108
  if (state.error) {
51098
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: state.error }));
51109
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react262.default.createElement(LoadingErrorIndicator2, { error: state.error }));
51099
51110
  }
51100
51111
  if (state.loading) {
51101
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
51112
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react262.default.createElement(LoadingIndicator2, null));
51102
51113
  }
51103
51114
  if (!channel.watch) {
51104
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement("div", null, t("Channel Missing")));
51115
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react262.default.createElement("div", null, t("Channel Missing")));
51105
51116
  }
51106
- 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))))));
51117
+ return /* @__PURE__ */ import_react262.default.createElement(ChannelContainer, { className: windowsEmojiClass }, /* @__PURE__ */ import_react262.default.createElement(ChannelStateProvider, { value: channelStateContextValue }, /* @__PURE__ */ import_react262.default.createElement(ChannelActionProvider, { value: channelActionContextValue }, /* @__PURE__ */ import_react262.default.createElement(WithComponents, { overrides: componentContextValue }, /* @__PURE__ */ import_react262.default.createElement(TypingProvider, { value: typingContextValue }, /* @__PURE__ */ import_react262.default.createElement("div", { className: (0, import_clsx66.default)(chatContainerClass) }, children))))));
51107
51118
  };
51108
- var Channel = import_react261.default.memo(UnMemoizedChannel);
51119
+ var Channel = import_react262.default.memo(UnMemoizedChannel);
51109
51120
 
51110
51121
  // src/components/ChannelHeader/ChannelHeader.tsx
51111
- var import_react263 = __toESM(require("react"));
51122
+ var import_react264 = __toESM(require("react"));
51112
51123
 
51113
51124
  // src/components/ChannelHeader/icons.tsx
51114
- var import_react262 = __toESM(require("react"));
51125
+ var import_react263 = __toESM(require("react"));
51115
51126
  var MenuIcon2 = ({ title }) => {
51116
51127
  const { t } = useTranslationContext("MenuIcon");
51117
- 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(
51128
+ return /* @__PURE__ */ import_react263.default.createElement("svg", { "data-testid": "menu-icon", viewBox: "0 0 448 512", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react263.default.createElement("title", null, title ?? t("Menu")), /* @__PURE__ */ import_react263.default.createElement(
51118
51129
  "path",
51119
51130
  {
51120
51131
  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",
@@ -51141,15 +51152,15 @@ var ChannelHeader = (props) => {
51141
51152
  overrideTitle
51142
51153
  });
51143
51154
  const { member_count, subtitle } = channel?.data || {};
51144
- return /* @__PURE__ */ import_react263.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react263.default.createElement(
51155
+ return /* @__PURE__ */ import_react264.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react264.default.createElement(
51145
51156
  "button",
51146
51157
  {
51147
51158
  "aria-label": t("aria/Menu"),
51148
51159
  className: "str-chat__header-hamburger",
51149
51160
  onClick: openMobileNav
51150
51161
  },
51151
- /* @__PURE__ */ import_react263.default.createElement(MenuIcon3, null)
51152
- ), /* @__PURE__ */ import_react263.default.createElement(
51162
+ /* @__PURE__ */ import_react264.default.createElement(MenuIcon3, null)
51163
+ ), /* @__PURE__ */ import_react264.default.createElement(
51153
51164
  Avatar2,
51154
51165
  {
51155
51166
  className: "str-chat__avatar--channel-header",
@@ -51157,36 +51168,36 @@ var ChannelHeader = (props) => {
51157
51168
  image: displayImage,
51158
51169
  name: displayTitle
51159
51170
  }
51160
- ), /* @__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", {
51171
+ ), /* @__PURE__ */ import_react264.default.createElement("div", { className: "str-chat__channel-header-end" }, /* @__PURE__ */ import_react264.default.createElement("p", { className: "str-chat__channel-header-title" }, displayTitle, " ", live && /* @__PURE__ */ import_react264.default.createElement("span", { className: "str-chat__header-livestream-livelabel" }, t("live"))), subtitle && /* @__PURE__ */ import_react264.default.createElement("p", { className: "str-chat__channel-header-subtitle" }, subtitle), /* @__PURE__ */ import_react264.default.createElement("p", { className: "str-chat__channel-header-info" }, !live && !!member_count && member_count > 0 && /* @__PURE__ */ import_react264.default.createElement(import_react264.default.Fragment, null, t("{{ memberCount }} members", {
51161
51172
  memberCount: member_count
51162
51173
  }), ",", " "), t("{{ watcherCount }} online", { watcherCount: watcher_count }))));
51163
51174
  };
51164
51175
 
51165
51176
  // src/components/Chat/Chat.tsx
51166
- var import_react267 = __toESM(require("react"));
51177
+ var import_react268 = __toESM(require("react"));
51167
51178
  var import_stream_chat13 = require("stream-chat");
51168
51179
 
51169
51180
  // src/components/Chat/hooks/useChat.ts
51170
- var import_react264 = require("react");
51181
+ var import_react265 = require("react");
51171
51182
  var useChat = ({
51172
51183
  client,
51173
51184
  defaultLanguage = "en",
51174
51185
  i18nInstance,
51175
51186
  initialNavOpen
51176
51187
  }) => {
51177
- const [translators, setTranslators] = (0, import_react264.useState)({
51188
+ const [translators, setTranslators] = (0, import_react265.useState)({
51178
51189
  t: (key) => key,
51179
51190
  tDateTimeParser: defaultDateTimeParser,
51180
51191
  userLanguage: "en"
51181
51192
  });
51182
- const [channel, setChannel] = (0, import_react264.useState)();
51183
- const [mutes, setMutes] = (0, import_react264.useState)([]);
51184
- const [navOpen, setNavOpen] = (0, import_react264.useState)(initialNavOpen);
51185
- const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react264.useState)({});
51193
+ const [channel, setChannel] = (0, import_react265.useState)();
51194
+ const [mutes, setMutes] = (0, import_react265.useState)([]);
51195
+ const [navOpen, setNavOpen] = (0, import_react265.useState)(initialNavOpen);
51196
+ const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react265.useState)({});
51186
51197
  const clientMutes = client.user?.mutes ?? [];
51187
51198
  const closeMobileNav = () => setNavOpen(false);
51188
51199
  const openMobileNav = () => setTimeout(() => setNavOpen(true), 100);
51189
- const appSettings = (0, import_react264.useRef)(null);
51200
+ const appSettings = (0, import_react265.useRef)(null);
51190
51201
  const getAppSettings = () => {
51191
51202
  if (appSettings.current) {
51192
51203
  return appSettings.current;
@@ -51194,9 +51205,9 @@ var useChat = ({
51194
51205
  appSettings.current = client.getAppSettings();
51195
51206
  return appSettings.current;
51196
51207
  };
51197
- (0, import_react264.useEffect)(() => {
51208
+ (0, import_react265.useEffect)(() => {
51198
51209
  if (!client) return;
51199
- const version = "13.0.3";
51210
+ const version = "13.0.5";
51200
51211
  const userAgent = client.getUserAgent();
51201
51212
  if (!userAgent.includes("stream-chat-react")) {
51202
51213
  client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
@@ -51208,7 +51219,7 @@ var useChat = ({
51208
51219
  client.polls.unregisterSubscriptions();
51209
51220
  };
51210
51221
  }, [client]);
51211
- (0, import_react264.useEffect)(() => {
51222
+ (0, import_react265.useEffect)(() => {
51212
51223
  setMutes(clientMutes);
51213
51224
  const handleEvent = (event) => {
51214
51225
  setMutes(event.me?.mutes || []);
@@ -51216,7 +51227,7 @@ var useChat = ({
51216
51227
  client.on("notification.mutes_updated", handleEvent);
51217
51228
  return () => client.off("notification.mutes_updated", handleEvent);
51218
51229
  }, [clientMutes?.length]);
51219
- (0, import_react264.useEffect)(() => {
51230
+ (0, import_react265.useEffect)(() => {
51220
51231
  let userLanguage = client.user?.language;
51221
51232
  if (!userLanguage) {
51222
51233
  const browserLanguage = window.navigator.language.slice(0, 2);
@@ -51233,7 +51244,7 @@ var useChat = ({
51233
51244
  });
51234
51245
  });
51235
51246
  }, [i18nInstance]);
51236
- const setActiveChannel = (0, import_react264.useCallback)(
51247
+ const setActiveChannel = (0, import_react265.useCallback)(
51237
51248
  async (activeChannel, watchers = {}, event) => {
51238
51249
  if (event && event.preventDefault) event.preventDefault();
51239
51250
  if (activeChannel && Object.keys(watchers).length) {
@@ -51244,7 +51255,7 @@ var useChat = ({
51244
51255
  },
51245
51256
  []
51246
51257
  );
51247
- (0, import_react264.useEffect)(() => {
51258
+ (0, import_react265.useEffect)(() => {
51248
51259
  setLatestMessageDatesByChannels({});
51249
51260
  }, [client.user?.id]);
51250
51261
  return {
@@ -51261,7 +51272,7 @@ var useChat = ({
51261
51272
  };
51262
51273
 
51263
51274
  // src/components/Chat/hooks/useCreateChatContext.ts
51264
- var import_react265 = require("react");
51275
+ var import_react266 = require("react");
51265
51276
  var useCreateChatContext = (value) => {
51266
51277
  const {
51267
51278
  channel,
@@ -51286,7 +51297,7 @@ var useCreateChatContext = (value) => {
51286
51297
  const clientValues = `${client.clientID}${Object.keys(client.activeChannels).length}${Object.keys(client.listeners).length}${client.mutedChannels.length}
51287
51298
  ${client.user?.id}`;
51288
51299
  const mutedUsersLength = mutes.length;
51289
- const chatContext = (0, import_react265.useMemo)(
51300
+ const chatContext = (0, import_react266.useMemo)(
51290
51301
  () => ({
51291
51302
  channel,
51292
51303
  channelsQueryState,
@@ -51321,10 +51332,10 @@ var useCreateChatContext = (value) => {
51321
51332
  };
51322
51333
 
51323
51334
  // src/components/Chat/hooks/useChannelsQueryState.ts
51324
- var import_react266 = require("react");
51335
+ var import_react267 = require("react");
51325
51336
  var useChannelsQueryState = () => {
51326
- const [error, setError] = (0, import_react266.useState)(null);
51327
- const [queryInProgress, setQueryInProgress] = (0, import_react266.useState)("uninitialized");
51337
+ const [error, setError] = (0, import_react267.useState)(null);
51338
+ const [queryInProgress, setQueryInProgress] = (0, import_react267.useState)("uninitialized");
51328
51339
  return {
51329
51340
  error,
51330
51341
  queryInProgress,
@@ -51359,7 +51370,7 @@ var Chat = (props) => {
51359
51370
  translators
51360
51371
  } = useChat({ client, defaultLanguage, i18nInstance, initialNavOpen });
51361
51372
  const channelsQueryState = useChannelsQueryState();
51362
- const searchController = (0, import_react267.useMemo)(
51373
+ const searchController = (0, import_react268.useMemo)(
51363
51374
  () => customChannelSearchController ?? new import_stream_chat13.SearchController({
51364
51375
  sources: [
51365
51376
  new import_stream_chat13.ChannelSearchSource(client),
@@ -51387,11 +51398,11 @@ var Chat = (props) => {
51387
51398
  useImageFlagEmojisOnWindows
51388
51399
  });
51389
51400
  if (!translators.t) return null;
51390
- return /* @__PURE__ */ import_react267.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react267.default.createElement(TranslationProvider, { value: translators }, children));
51401
+ return /* @__PURE__ */ import_react268.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react268.default.createElement(TranslationProvider, { value: translators }, children));
51391
51402
  };
51392
51403
 
51393
51404
  // src/components/Chat/hooks/useCreateChatClient.ts
51394
- var import_react268 = require("react");
51405
+ var import_react269 = require("react");
51395
51406
  var import_stream_chat14 = require("stream-chat");
51396
51407
  var useCreateChatClient = ({
51397
51408
  apiKey,
@@ -51399,13 +51410,13 @@ var useCreateChatClient = ({
51399
51410
  tokenOrProvider,
51400
51411
  userData
51401
51412
  }) => {
51402
- const [chatClient, setChatClient] = (0, import_react268.useState)(null);
51403
- const [cachedUserData, setCachedUserData] = (0, import_react268.useState)(userData);
51413
+ const [chatClient, setChatClient] = (0, import_react269.useState)(null);
51414
+ const [cachedUserData, setCachedUserData] = (0, import_react269.useState)(userData);
51404
51415
  if (userData.id !== cachedUserData.id) {
51405
51416
  setCachedUserData(userData);
51406
51417
  }
51407
- const [cachedOptions] = (0, import_react268.useState)(options);
51408
- (0, import_react268.useEffect)(() => {
51418
+ const [cachedOptions] = (0, import_react269.useState)(options);
51419
+ (0, import_react269.useEffect)(() => {
51409
51420
  const client = new import_stream_chat14.StreamChat(apiKey, void 0, cachedOptions);
51410
51421
  let didUserConnectInterrupt = false;
51411
51422
  const connectionPromise = client.connectUser(cachedUserData, tokenOrProvider).then(() => {
@@ -51423,12 +51434,12 @@ var useCreateChatClient = ({
51423
51434
  };
51424
51435
 
51425
51436
  // src/components/Window/Window.tsx
51426
- var import_react269 = __toESM(require("react"));
51437
+ var import_react270 = __toESM(require("react"));
51427
51438
  var import_clsx67 = __toESM(require("clsx"));
51428
51439
  var UnMemoizedWindow = (props) => {
51429
51440
  const { children, thread: propThread } = props;
51430
51441
  const { thread: contextThread } = useChannelStateContext("Window");
51431
- return /* @__PURE__ */ import_react269.default.createElement(
51442
+ return /* @__PURE__ */ import_react270.default.createElement(
51432
51443
  "div",
51433
51444
  {
51434
51445
  className: (0, import_clsx67.default)("str-chat__main-panel", {
@@ -51438,7 +51449,7 @@ var UnMemoizedWindow = (props) => {
51438
51449
  children
51439
51450
  );
51440
51451
  };
51441
- var Window = import_react269.default.memo(UnMemoizedWindow);
51452
+ var Window = import_react270.default.memo(UnMemoizedWindow);
51442
51453
  /*! Bundled license information:
51443
51454
 
51444
51455
  is-buffer/index.js: