stream-chat-react 13.0.0-rc.1 → 13.0.0-rc.2

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.
@@ -17666,11 +17666,11 @@ __export(src_exports, {
17666
17666
  module.exports = __toCommonJS(src_exports);
17667
17667
 
17668
17668
  // src/components/Attachment/Attachment.tsx
17669
- var import_react255 = __toESM(require("react"));
17669
+ var import_react254 = __toESM(require("react"));
17670
17670
  var import_stream_chat10 = require("stream-chat");
17671
17671
 
17672
17672
  // src/components/Attachment/AttachmentContainer.tsx
17673
- var import_react254 = __toESM(require("react"));
17673
+ var import_react253 = __toESM(require("react"));
17674
17674
  var import_react_player2 = __toESM(require("react-player"));
17675
17675
  var import_clsx65 = __toESM(require("clsx"));
17676
17676
  var linkify = __toESM(require("linkifyjs"));
@@ -18915,7 +18915,7 @@ var UnMemoizedAudio = (props) => {
18915
18915
  var Audio = import_react29.default.memo(UnMemoizedAudio);
18916
18916
 
18917
18917
  // src/components/Attachment/VoiceRecording.tsx
18918
- var import_react250 = __toESM(require("react"));
18918
+ var import_react249 = __toESM(require("react"));
18919
18919
 
18920
18920
  // src/components/ReactFileUtilities/FileIcon/FileIcon.tsx
18921
18921
  var import_react31 = __toESM(require("react"));
@@ -19878,7 +19878,7 @@ var FileIcon = (props) => {
19878
19878
  // src/components/ReactFileUtilities/UploadButton.tsx
19879
19879
  var import_clsx63 = __toESM(require("clsx"));
19880
19880
  var import_nanoid5 = require("nanoid");
19881
- var import_react249 = __toESM(require("react"));
19881
+ var import_react248 = __toESM(require("react"));
19882
19882
 
19883
19883
  // src/components/ReactFileUtilities/utils.ts
19884
19884
  var import_react32 = require("react");
@@ -48138,13 +48138,13 @@ var CooldownTimer = ({ cooldownInterval }) => {
48138
48138
  };
48139
48139
 
48140
48140
  // src/components/MessageInput/EditMessageForm.tsx
48141
- var import_react248 = __toESM(require("react"));
48141
+ var import_react247 = __toESM(require("react"));
48142
48142
 
48143
48143
  // src/components/MessageInput/MessageInput.tsx
48144
- var import_react247 = __toESM(require("react"));
48144
+ var import_react246 = __toESM(require("react"));
48145
48145
 
48146
48146
  // src/components/MessageInput/MessageInputFlat.tsx
48147
- var import_react245 = __toESM(require("react"));
48147
+ var import_react244 = __toESM(require("react"));
48148
48148
 
48149
48149
  // src/components/MessageInput/SendButton.tsx
48150
48150
  var import_react231 = __toESM(require("react"));
@@ -48354,23 +48354,22 @@ var EmoticonItem = (props) => {
48354
48354
 
48355
48355
  // src/components/TextareaComposer/SuggestionList/SuggestionList.tsx
48356
48356
  var import_clsx60 = __toESM(require("clsx"));
48357
- var import_react240 = __toESM(require("react"));
48357
+ var import_react239 = __toESM(require("react"));
48358
48358
 
48359
48359
  // src/components/TextareaComposer/SuggestionList/SuggestionListItem.tsx
48360
48360
  var import_clsx58 = __toESM(require("clsx"));
48361
- var import_react237 = require("react");
48362
- var import_react238 = __toESM(require("react"));
48363
- var SuggestionListItem = import_react238.default.forwardRef(function SuggestionListItem2({ className, component: Component2, focused, item: item2, onMouseEnter }, innerRef) {
48361
+ var import_react237 = __toESM(require("react"));
48362
+ var SuggestionListItem = import_react237.default.forwardRef(function SuggestionListItem2({ className, component: Component2, focused, item: item2, onMouseEnter }, innerRef) {
48364
48363
  const { textComposer } = useMessageComposer();
48365
- const containerRef = (0, import_react238.useRef)(null);
48366
- const handleSelect = (0, import_react238.useCallback)(() => {
48364
+ const containerRef = (0, import_react237.useRef)(null);
48365
+ const handleSelect = (0, import_react237.useCallback)(() => {
48367
48366
  textComposer.handleSelect(item2);
48368
48367
  }, [item2, textComposer]);
48369
48368
  (0, import_react237.useLayoutEffect)(() => {
48370
48369
  if (!focused) return;
48371
48370
  containerRef.current?.scrollIntoView({ behavior: "instant", block: "nearest" });
48372
48371
  }, [focused, containerRef]);
48373
- return /* @__PURE__ */ import_react238.default.createElement(
48372
+ return /* @__PURE__ */ import_react237.default.createElement(
48374
48373
  "li",
48375
48374
  {
48376
48375
  className: (0, import_clsx58.default)("str-chat__suggestion-list-item", className, {
@@ -48379,7 +48378,7 @@ var SuggestionListItem = import_react238.default.forwardRef(function SuggestionL
48379
48378
  onMouseEnter,
48380
48379
  ref: containerRef
48381
48380
  },
48382
- /* @__PURE__ */ import_react238.default.createElement(
48381
+ /* @__PURE__ */ import_react237.default.createElement(
48383
48382
  "button",
48384
48383
  {
48385
48384
  onClick: handleSelect,
@@ -48390,13 +48389,13 @@ var SuggestionListItem = import_react238.default.forwardRef(function SuggestionL
48390
48389
  },
48391
48390
  ref: innerRef
48392
48391
  },
48393
- /* @__PURE__ */ import_react238.default.createElement(Component2, { entity: item2, focused })
48392
+ /* @__PURE__ */ import_react237.default.createElement(Component2, { entity: item2, focused })
48394
48393
  )
48395
48394
  );
48396
48395
  });
48397
48396
 
48398
48397
  // src/components/TextareaComposer/SuggestionList/UserItem.tsx
48399
- var import_react239 = __toESM(require("react"));
48398
+ var import_react238 = __toESM(require("react"));
48400
48399
  var import_clsx59 = __toESM(require("clsx"));
48401
48400
  var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
48402
48401
  const hasEntity = !!Object.keys(entity).length;
@@ -48405,7 +48404,7 @@ var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
48405
48404
  const renderName = () => parts.map((part, i) => {
48406
48405
  const matches = part.toLowerCase() === token;
48407
48406
  const partWithHTMLSpacesAround = part.replace(/^\s+|\s+$/g, "\xA0");
48408
- return /* @__PURE__ */ import_react239.default.createElement(
48407
+ return /* @__PURE__ */ import_react238.default.createElement(
48409
48408
  "span",
48410
48409
  {
48411
48410
  className: (0, import_clsx59.default)({
@@ -48417,14 +48416,14 @@ var UserItem = ({ Avatar: Avatar2 = Avatar, entity }) => {
48417
48416
  partWithHTMLSpacesAround
48418
48417
  );
48419
48418
  });
48420
- return /* @__PURE__ */ import_react239.default.createElement("div", { className: "str-chat__user-item" }, /* @__PURE__ */ import_react239.default.createElement(
48419
+ return /* @__PURE__ */ import_react238.default.createElement("div", { className: "str-chat__user-item" }, /* @__PURE__ */ import_react238.default.createElement(
48421
48420
  Avatar2,
48422
48421
  {
48423
48422
  className: "str-chat__avatar--autocomplete-item",
48424
48423
  image: entity.image,
48425
48424
  name: entity.name || entity.id
48426
48425
  }
48427
- ), /* @__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" }, "@"));
48426
+ ), /* @__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" }, "@"));
48428
48427
  };
48429
48428
 
48430
48429
  // src/components/TextareaComposer/SuggestionList/SuggestionList.tsx
@@ -48435,25 +48434,26 @@ var searchSourceStateSelector = (nextValue) => ({
48435
48434
  items: nextValue.items ?? []
48436
48435
  });
48437
48436
  var defaultComponents = {
48438
- "/": CommandItem,
48439
- ":": EmoticonItem,
48440
- "@": UserItem
48437
+ "/": (props) => /* @__PURE__ */ import_react239.default.createElement(CommandItem, { entity: props.entity }),
48438
+ ":": (props) => /* @__PURE__ */ import_react239.default.createElement(EmoticonItem, { entity: props.entity }),
48439
+ "@": (props) => /* @__PURE__ */ import_react239.default.createElement(UserItem, { entity: props.entity })
48441
48440
  };
48442
48441
  var SuggestionList = ({
48443
48442
  className,
48444
48443
  closeOnClickOutside = true,
48445
48444
  containerClassName,
48446
48445
  focusedItemIndex,
48447
- setFocusedItemIndex
48446
+ setFocusedItemIndex,
48447
+ suggestionItemComponents = defaultComponents
48448
48448
  }) => {
48449
48449
  const { AutocompleteSuggestionItem = SuggestionListItem } = useComponentContext();
48450
48450
  const messageComposer = useMessageComposer();
48451
48451
  const { textComposer } = messageComposer;
48452
48452
  const { suggestions } = useStateStore(textComposer.state, textComposerStateSelector);
48453
48453
  const { items } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector) ?? {};
48454
- const [container, setContainer] = (0, import_react240.useState)(null);
48455
- const component = suggestions?.trigger && defaultComponents[suggestions?.trigger];
48456
- (0, import_react240.useEffect)(() => {
48454
+ const [container, setContainer] = (0, import_react239.useState)(null);
48455
+ const component = suggestions?.trigger ? suggestionItemComponents[suggestions?.trigger] : void 0;
48456
+ (0, import_react239.useEffect)(() => {
48457
48457
  if (!closeOnClickOutside || !suggestions || !container) return;
48458
48458
  const handleClick = (event) => {
48459
48459
  if (container.contains(event.target)) return;
@@ -48465,19 +48465,19 @@ var SuggestionList = ({
48465
48465
  };
48466
48466
  }, [closeOnClickOutside, suggestions, container, textComposer]);
48467
48467
  if (!suggestions || !items?.length || !component) return null;
48468
- return /* @__PURE__ */ import_react240.default.createElement(
48468
+ return /* @__PURE__ */ import_react239.default.createElement(
48469
48469
  "div",
48470
48470
  {
48471
48471
  className: (0, import_clsx60.default)("str-chat__suggestion-list-container", containerClassName),
48472
48472
  ref: setContainer
48473
48473
  },
48474
- /* @__PURE__ */ import_react240.default.createElement(
48474
+ /* @__PURE__ */ import_react239.default.createElement(
48475
48475
  InfiniteScrollPaginator,
48476
48476
  {
48477
48477
  loadNextOnScrollToBottom: suggestions.searchSource.search,
48478
48478
  threshold: 100
48479
48479
  },
48480
- /* @__PURE__ */ import_react240.default.createElement(
48480
+ /* @__PURE__ */ import_react239.default.createElement(
48481
48481
  "ul",
48482
48482
  {
48483
48483
  className: (0, import_clsx60.default)(
@@ -48485,7 +48485,7 @@ var SuggestionList = ({
48485
48485
  className
48486
48486
  )
48487
48487
  },
48488
- items.map((item2, i) => /* @__PURE__ */ import_react240.default.createElement(
48488
+ items.map((item2, i) => /* @__PURE__ */ import_react239.default.createElement(
48489
48489
  AutocompleteSuggestionItem,
48490
48490
  {
48491
48491
  component,
@@ -48502,7 +48502,7 @@ var SuggestionList = ({
48502
48502
 
48503
48503
  // src/components/TextareaComposer/TextareaComposer.tsx
48504
48504
  var import_clsx61 = __toESM(require("clsx"));
48505
- var import_react241 = __toESM(require("react"));
48505
+ var import_react240 = __toESM(require("react"));
48506
48506
  var import_react_textarea_autosize = __toESM(require("react-textarea-autosize"));
48507
48507
  var textComposerStateSelector2 = (state) => ({
48508
48508
  selection: state.selection,
@@ -48558,10 +48558,10 @@ var TextareaComposer = ({
48558
48558
  );
48559
48559
  const { enabled } = useStateStore(messageComposer.configState, configStateSelector);
48560
48560
  const { isLoadingItems } = useStateStore(suggestions?.searchSource.state, searchSourceStateSelector2) ?? {};
48561
- const containerRef = (0, import_react241.useRef)(null);
48562
- const [focusedItemIndex, setFocusedItemIndex] = (0, import_react241.useState)(0);
48563
- const [isComposing, setIsComposing] = (0, import_react241.useState)(false);
48564
- const changeHandler = (0, import_react241.useCallback)(
48561
+ const containerRef = (0, import_react240.useRef)(null);
48562
+ const [focusedItemIndex, setFocusedItemIndex] = (0, import_react240.useState)(0);
48563
+ const [isComposing, setIsComposing] = (0, import_react240.useState)(false);
48564
+ const changeHandler = (0, import_react240.useCallback)(
48565
48565
  (e) => {
48566
48566
  if (onChange) {
48567
48567
  onChange(e);
@@ -48578,13 +48578,13 @@ var TextareaComposer = ({
48578
48578
  },
48579
48579
  [onChange, textComposer, textareaRef]
48580
48580
  );
48581
- const onCompositionEnd = (0, import_react241.useCallback)(() => {
48581
+ const onCompositionEnd = (0, import_react240.useCallback)(() => {
48582
48582
  setIsComposing(false);
48583
48583
  }, []);
48584
- const onCompositionStart = (0, import_react241.useCallback)(() => {
48584
+ const onCompositionStart = (0, import_react240.useCallback)(() => {
48585
48585
  setIsComposing(true);
48586
48586
  }, []);
48587
- const keyDownHandler = (0, import_react241.useCallback)(
48587
+ const keyDownHandler = (0, import_react240.useCallback)(
48588
48588
  (event) => {
48589
48589
  if (onKeyDown) {
48590
48590
  onKeyDown(event);
@@ -48638,7 +48638,7 @@ var TextareaComposer = ({
48638
48638
  textareaRef
48639
48639
  ]
48640
48640
  );
48641
- const scrollHandler = (0, import_react241.useCallback)(
48641
+ const scrollHandler = (0, import_react240.useCallback)(
48642
48642
  (event) => {
48643
48643
  if (onScroll) {
48644
48644
  onScroll(event);
@@ -48648,18 +48648,18 @@ var TextareaComposer = ({
48648
48648
  },
48649
48649
  [onScroll, textComposer]
48650
48650
  );
48651
- (0, import_react241.useEffect)(() => {
48651
+ (0, import_react240.useEffect)(() => {
48652
48652
  if (textareaRef.current && !isComposing) {
48653
48653
  textareaRef.current.selectionStart = selection.start;
48654
48654
  textareaRef.current.selectionEnd = selection.end;
48655
48655
  }
48656
48656
  }, [text8, textareaRef, selection.start, selection.end, isComposing]);
48657
- (0, import_react241.useEffect)(() => {
48657
+ (0, import_react240.useEffect)(() => {
48658
48658
  if (textComposer.suggestions) {
48659
48659
  setFocusedItemIndex(0);
48660
48660
  }
48661
48661
  }, [textComposer.suggestions]);
48662
- return /* @__PURE__ */ import_react241.default.createElement(
48662
+ return /* @__PURE__ */ import_react240.default.createElement(
48663
48663
  "div",
48664
48664
  {
48665
48665
  className: (0, import_clsx61.default)(
@@ -48672,7 +48672,7 @@ var TextareaComposer = ({
48672
48672
  ),
48673
48673
  ref: containerRef
48674
48674
  },
48675
- /* @__PURE__ */ import_react241.default.createElement(
48675
+ /* @__PURE__ */ import_react240.default.createElement(
48676
48676
  import_react_textarea_autosize.default,
48677
48677
  {
48678
48678
  ...restProps,
@@ -48699,7 +48699,7 @@ var TextareaComposer = ({
48699
48699
  value: text8
48700
48700
  }
48701
48701
  ),
48702
- !isComposing && /* @__PURE__ */ import_react241.default.createElement(
48702
+ !isComposing && /* @__PURE__ */ import_react240.default.createElement(
48703
48703
  AutocompleteSuggestionList,
48704
48704
  {
48705
48705
  className: listClassName,
@@ -48712,10 +48712,10 @@ var TextareaComposer = ({
48712
48712
  };
48713
48713
 
48714
48714
  // src/components/AIStateIndicator/AIStateIndicator.tsx
48715
- var import_react243 = __toESM(require("react"));
48715
+ var import_react242 = __toESM(require("react"));
48716
48716
 
48717
48717
  // src/components/AIStateIndicator/hooks/useAIState.ts
48718
- var import_react242 = require("react");
48718
+ var import_react241 = require("react");
48719
48719
  var AIStates = {
48720
48720
  Error: "AI_STATE_ERROR",
48721
48721
  ExternalSources: "AI_STATE_EXTERNAL_SOURCES",
@@ -48724,8 +48724,8 @@ var AIStates = {
48724
48724
  Thinking: "AI_STATE_THINKING"
48725
48725
  };
48726
48726
  var useAIState = (channel) => {
48727
- const [aiState, setAiState] = (0, import_react242.useState)(AIStates.Idle);
48728
- (0, import_react242.useEffect)(() => {
48727
+ const [aiState, setAiState] = (0, import_react241.useState)(AIStates.Idle);
48728
+ (0, import_react241.useEffect)(() => {
48729
48729
  if (!channel) {
48730
48730
  return;
48731
48731
  }
@@ -48762,21 +48762,21 @@ var AIStateIndicator = ({
48762
48762
  [AIStates.Thinking]: t("Thinking..."),
48763
48763
  [AIStates.Generating]: t("Generating...")
48764
48764
  };
48765
- 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;
48765
+ return aiState in allowedStates ? /* @__PURE__ */ import_react242.default.createElement("div", { className: "str-chat__ai-state-indicator-container" }, /* @__PURE__ */ import_react242.default.createElement("p", { className: "str-chat__ai-state-indicator-text" }, allowedStates[aiState])) : null;
48766
48766
  };
48767
48767
 
48768
48768
  // src/components/MessageInput/WithDragAndDropUpload.tsx
48769
- var import_react244 = __toESM(require("react"));
48769
+ var import_react243 = __toESM(require("react"));
48770
48770
  var import_react_dropzone = require("react-dropzone");
48771
48771
  var import_clsx62 = __toESM(require("clsx"));
48772
- var DragAndDropUploadContext = import_react244.default.createContext({
48772
+ var DragAndDropUploadContext = import_react243.default.createContext({
48773
48773
  subscribeToDrop: null
48774
48774
  });
48775
- var useDragAndDropUploadContext = () => (0, import_react244.useContext)(DragAndDropUploadContext);
48775
+ var useDragAndDropUploadContext = () => (0, import_react243.useContext)(DragAndDropUploadContext);
48776
48776
  var useRegisterDropHandlers = () => {
48777
48777
  const { subscribeToDrop } = useDragAndDropUploadContext();
48778
48778
  const messageComposer = useMessageComposer();
48779
- (0, import_react244.useEffect)(() => {
48779
+ (0, import_react243.useEffect)(() => {
48780
48780
  const unsubscribe = subscribeToDrop?.(messageComposer.attachmentManager.uploadFiles);
48781
48781
  return unsubscribe;
48782
48782
  }, [subscribeToDrop, messageComposer]);
@@ -48791,7 +48791,7 @@ var WithDragAndDropUpload = ({
48791
48791
  component: Component2 = "div",
48792
48792
  style
48793
48793
  }) => {
48794
- const dropHandlersRef = (0, import_react244.useRef)(/* @__PURE__ */ new Set());
48794
+ const dropHandlersRef = (0, import_react243.useRef)(/* @__PURE__ */ new Set());
48795
48795
  const { t } = useTranslationContext();
48796
48796
  const messageInputContext = useMessageInputContext();
48797
48797
  const dragAndDropUploadContext = useDragAndDropUploadContext();
@@ -48802,20 +48802,20 @@ var WithDragAndDropUpload = ({
48802
48802
  attachmentManagerConfigStateSelector
48803
48803
  );
48804
48804
  const isWithinMessageInputContext = Object.keys(messageInputContext).length > 0;
48805
- const accept = (0, import_react244.useMemo)(
48805
+ const accept = (0, import_react243.useMemo)(
48806
48806
  () => acceptedFiles.reduce((mediaTypeMap, mediaType) => {
48807
48807
  mediaTypeMap[mediaType] ?? (mediaTypeMap[mediaType] = []);
48808
48808
  return mediaTypeMap;
48809
48809
  }, {}),
48810
48810
  [acceptedFiles]
48811
48811
  );
48812
- const subscribeToDrop = (0, import_react244.useCallback)((fn) => {
48812
+ const subscribeToDrop = (0, import_react243.useCallback)((fn) => {
48813
48813
  dropHandlersRef.current.add(fn);
48814
48814
  return () => {
48815
48815
  dropHandlersRef.current.delete(fn);
48816
48816
  };
48817
48817
  }, []);
48818
- const handleDrop = (0, import_react244.useCallback)((files) => {
48818
+ const handleDrop = (0, import_react243.useCallback)((files) => {
48819
48819
  dropHandlersRef.current.forEach((fn) => fn(files));
48820
48820
  }, []);
48821
48821
  const { getRootProps, isDragActive, isDragReject } = (0, import_react_dropzone.useDropzone)({
@@ -48828,24 +48828,24 @@ var WithDragAndDropUpload = ({
48828
48828
  onDrop: isWithinMessageInputContext ? messageComposer.attachmentManager.uploadFiles : handleDrop
48829
48829
  });
48830
48830
  if (dragAndDropUploadContext.subscribeToDrop !== null) {
48831
- return /* @__PURE__ */ import_react244.default.createElement(Component2, { className }, children);
48831
+ return /* @__PURE__ */ import_react243.default.createElement(Component2, { className }, children);
48832
48832
  }
48833
- return /* @__PURE__ */ import_react244.default.createElement(
48833
+ return /* @__PURE__ */ import_react243.default.createElement(
48834
48834
  DragAndDropUploadContext.Provider,
48835
48835
  {
48836
48836
  value: {
48837
48837
  subscribeToDrop
48838
48838
  }
48839
48839
  },
48840
- /* @__PURE__ */ import_react244.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react244.default.createElement(
48840
+ /* @__PURE__ */ import_react243.default.createElement(Component2, { ...getRootProps({ className, style }) }, isDragActive && /* @__PURE__ */ import_react243.default.createElement(
48841
48841
  "div",
48842
48842
  {
48843
48843
  className: (0, import_clsx62.default)("str-chat__dropzone-container", {
48844
48844
  "str-chat__dropzone-container--not-accepted": isDragReject
48845
48845
  })
48846
48846
  },
48847
- !isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Drag your files here")),
48848
- isDragReject && /* @__PURE__ */ import_react244.default.createElement("p", null, t("Some of the files will not be accepted"))
48847
+ !isDragReject && /* @__PURE__ */ import_react243.default.createElement("p", null, t("Drag your files here")),
48848
+ isDragReject && /* @__PURE__ */ import_react243.default.createElement("p", null, t("Some of the files will not be accepted"))
48849
48849
  ), children)
48850
48850
  );
48851
48851
  };
@@ -48876,33 +48876,33 @@ var MessageInputFlat = () => {
48876
48876
  } = useComponentContext("MessageInputFlat");
48877
48877
  const { channel } = useChatContext("MessageInputFlat");
48878
48878
  const { aiState } = useAIState(channel);
48879
- const stopGenerating = (0, import_react245.useCallback)(() => channel?.stopAIResponse(), [channel]);
48879
+ const stopGenerating = (0, import_react244.useCallback)(() => channel?.stopAIResponse(), [channel]);
48880
48880
  const [
48881
48881
  showRecordingPermissionDeniedNotification,
48882
48882
  setShowRecordingPermissionDeniedNotification
48883
- ] = (0, import_react245.useState)(false);
48884
- const closePermissionDeniedNotification = (0, import_react245.useCallback)(() => {
48883
+ ] = (0, import_react244.useState)(false);
48884
+ const closePermissionDeniedNotification = (0, import_react244.useCallback)(() => {
48885
48885
  setShowRecordingPermissionDeniedNotification(false);
48886
48886
  }, []);
48887
48887
  const { attachments } = useAttachmentManagerState();
48888
- if (recordingController.recordingState) return /* @__PURE__ */ import_react245.default.createElement(AudioRecorder2, null);
48888
+ if (recordingController.recordingState) return /* @__PURE__ */ import_react244.default.createElement(AudioRecorder2, null);
48889
48889
  const recordingEnabled = !!(recordingController.recorder && navigator.mediaDevices);
48890
48890
  const isRecording = !!recordingController.recordingState;
48891
48891
  const StopAIGenerationButton2 = StopAIGenerationButtonOverride === void 0 ? StopAIGenerationButton : StopAIGenerationButtonOverride;
48892
48892
  const shouldDisplayStopAIGeneration = [AIStates.Thinking, AIStates.Generating].includes(aiState) && !!StopAIGenerationButton2;
48893
- return /* @__PURE__ */ import_react245.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react245.default.createElement(
48893
+ return /* @__PURE__ */ import_react244.default.createElement(WithDragAndDropUpload, { className: "str-chat__message-input", component: "div" }, recordingEnabled && recordingController.permissionState === "denied" && showRecordingPermissionDeniedNotification && /* @__PURE__ */ import_react244.default.createElement(
48894
48894
  RecordingPermissionDeniedNotification2,
48895
48895
  {
48896
48896
  onClose: closePermissionDeniedNotification,
48897
48897
  permissionName: "microphone" /* MIC */
48898
48898
  }
48899
- ), /* @__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(TextareaComposer, 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(
48899
+ ), /* @__PURE__ */ import_react244.default.createElement(LinkPreviewList2, null), /* @__PURE__ */ import_react244.default.createElement(QuotedMessagePreviewHeader, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-input-inner" }, /* @__PURE__ */ import_react244.default.createElement(AttachmentSelector2, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-textarea-container" }, /* @__PURE__ */ import_react244.default.createElement(QuotedMessagePreview2, null), /* @__PURE__ */ import_react244.default.createElement(AttachmentPreviewList2, null), /* @__PURE__ */ import_react244.default.createElement("div", { className: "str-chat__message-textarea-with-emoji-picker" }, /* @__PURE__ */ import_react244.default.createElement(TextareaComposer, null), EmojiPicker && /* @__PURE__ */ import_react244.default.createElement(EmojiPicker, null))), shouldDisplayStopAIGeneration ? /* @__PURE__ */ import_react244.default.createElement(StopAIGenerationButton2, { onClick: stopGenerating }) : !hideSendButton && /* @__PURE__ */ import_react244.default.createElement(import_react244.default.Fragment, null, cooldownRemaining ? /* @__PURE__ */ import_react244.default.createElement(
48900
48900
  CooldownTimer2,
48901
48901
  {
48902
48902
  cooldownInterval: cooldownRemaining,
48903
48903
  setCooldownRemaining
48904
48904
  }
48905
- ) : /* @__PURE__ */ import_react245.default.createElement(import_react245.default.Fragment, null, /* @__PURE__ */ import_react245.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react245.default.createElement(
48905
+ ) : /* @__PURE__ */ import_react244.default.createElement(import_react244.default.Fragment, null, /* @__PURE__ */ import_react244.default.createElement(SendButton2, { sendMessage: handleSubmit }), recordingEnabled && /* @__PURE__ */ import_react244.default.createElement(
48906
48906
  StartRecordingAudioButton2,
48907
48907
  {
48908
48908
  disabled: isRecording || !asyncMessagesMultiSendEnabled && attachments.some(
@@ -48917,7 +48917,7 @@ var MessageInputFlat = () => {
48917
48917
  };
48918
48918
 
48919
48919
  // src/components/MessageInput/hooks/useCreateMessageInputContext.ts
48920
- var import_react246 = require("react");
48920
+ var import_react245 = require("react");
48921
48921
  var useCreateMessageInputContext = (value) => {
48922
48922
  const {
48923
48923
  additionalTextareaProps,
@@ -48943,7 +48943,7 @@ var useCreateMessageInputContext = (value) => {
48943
48943
  textareaRef
48944
48944
  } = value;
48945
48945
  const parentId = parent?.id;
48946
- const messageInputContext = (0, import_react246.useMemo)(
48946
+ const messageInputContext = (0, import_react245.useMemo)(
48947
48947
  () => ({
48948
48948
  additionalTextareaProps,
48949
48949
  asyncMessagesMultiSendEnabled,
@@ -48997,13 +48997,13 @@ var MessageInputProvider = (props) => {
48997
48997
  emojiSearchIndex: props.emojiSearchIndex ?? emojiSearchIndex
48998
48998
  });
48999
48999
  const messageComposer = useMessageComposer();
49000
- (0, import_react247.useEffect)(
49000
+ (0, import_react246.useEffect)(
49001
49001
  () => () => {
49002
49002
  messageComposer.createDraft();
49003
49003
  },
49004
49004
  [messageComposer]
49005
49005
  );
49006
- (0, import_react247.useEffect)(() => {
49006
+ (0, import_react246.useEffect)(() => {
49007
49007
  const threadId = messageComposer.threadId;
49008
49008
  if (!threadId || !messageComposer.channel || !messageComposer.compositionIsEmpty)
49009
49009
  return;
@@ -49014,16 +49014,16 @@ var MessageInputProvider = (props) => {
49014
49014
  });
49015
49015
  }, [messageComposer]);
49016
49016
  useRegisterDropHandlers();
49017
- return /* @__PURE__ */ import_react247.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
49017
+ return /* @__PURE__ */ import_react246.default.createElement(MessageInputContextProvider, { value: messageInputContextValue }, props.children);
49018
49018
  };
49019
49019
  var UnMemoizedMessageInput = (props) => {
49020
49020
  const { Input: PropInput } = props;
49021
49021
  const { Input: ContextInput } = useComponentContext("MessageInput");
49022
49022
  const Input3 = PropInput || ContextInput || MessageInputFlat;
49023
49023
  const dialogManagerId = props.isThreadInput ? "message-input-dialog-manager-thread" : "message-input-dialog-manager";
49024
- return /* @__PURE__ */ import_react247.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react247.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react247.default.createElement(Input3, null)));
49024
+ return /* @__PURE__ */ import_react246.default.createElement(DialogManagerProvider, { id: dialogManagerId }, /* @__PURE__ */ import_react246.default.createElement(MessageInputProvider, { ...props }, /* @__PURE__ */ import_react246.default.createElement(Input3, null)));
49025
49025
  };
49026
- var MessageInput = import_react247.default.memo(
49026
+ var MessageInput = import_react246.default.memo(
49027
49027
  UnMemoizedMessageInput
49028
49028
  );
49029
49029
 
@@ -49031,7 +49031,7 @@ var MessageInput = import_react247.default.memo(
49031
49031
  var EditMessageFormSendButton = () => {
49032
49032
  const { t } = useTranslationContext();
49033
49033
  const hasSendableData = useMessageComposerHasSendableData();
49034
- return /* @__PURE__ */ import_react248.default.createElement(
49034
+ return /* @__PURE__ */ import_react247.default.createElement(
49035
49035
  "button",
49036
49036
  {
49037
49037
  className: "str-chat__edit-message-send",
@@ -49046,26 +49046,26 @@ var EditMessageForm = () => {
49046
49046
  const { t } = useTranslationContext("EditMessageForm");
49047
49047
  const messageComposer = useMessageComposer();
49048
49048
  const { clearEditingState, handleSubmit } = useMessageInputContext("EditMessageForm");
49049
- const cancel = (0, import_react248.useCallback)(() => {
49049
+ const cancel = (0, import_react247.useCallback)(() => {
49050
49050
  clearEditingState?.();
49051
49051
  messageComposer.restore();
49052
49052
  }, [clearEditingState, messageComposer]);
49053
- (0, import_react248.useEffect)(() => {
49053
+ (0, import_react247.useEffect)(() => {
49054
49054
  const onKeyDown = (event) => {
49055
49055
  if (event.key === "Escape") cancel();
49056
49056
  };
49057
49057
  document.addEventListener("keydown", onKeyDown);
49058
49058
  return () => document.removeEventListener("keydown", onKeyDown);
49059
49059
  }, [cancel]);
49060
- return /* @__PURE__ */ import_react248.default.createElement(
49060
+ return /* @__PURE__ */ import_react247.default.createElement(
49061
49061
  "form",
49062
49062
  {
49063
49063
  autoComplete: "off",
49064
49064
  className: "str-chat__edit-message-form",
49065
49065
  onSubmit: handleSubmit
49066
49066
  },
49067
- /* @__PURE__ */ import_react248.default.createElement(MessageInputFlat, null),
49068
- /* @__PURE__ */ import_react248.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react248.default.createElement(
49067
+ /* @__PURE__ */ import_react247.default.createElement(MessageInputFlat, null),
49068
+ /* @__PURE__ */ import_react247.default.createElement("div", { className: "str-chat__edit-message-form-options" }, /* @__PURE__ */ import_react247.default.createElement(
49069
49069
  "button",
49070
49070
  {
49071
49071
  className: "str-chat__edit-message-cancel",
@@ -49073,7 +49073,7 @@ var EditMessageForm = () => {
49073
49073
  onClick: cancel
49074
49074
  },
49075
49075
  t("Cancel")
49076
- ), /* @__PURE__ */ import_react248.default.createElement(EditMessageFormSendButton, null))
49076
+ ), /* @__PURE__ */ import_react247.default.createElement(EditMessageFormSendButton, null))
49077
49077
  );
49078
49078
  };
49079
49079
  var EditMessageModal = ({
@@ -49082,18 +49082,18 @@ var EditMessageModal = ({
49082
49082
  const { EditMessageInput = EditMessageForm } = useComponentContext();
49083
49083
  const { clearEditingState } = useMessageContext();
49084
49084
  const messageComposer = useMessageComposer();
49085
- const onEditModalClose = (0, import_react248.useCallback)(() => {
49085
+ const onEditModalClose = (0, import_react247.useCallback)(() => {
49086
49086
  clearEditingState();
49087
49087
  messageComposer.restore();
49088
49088
  }, [clearEditingState, messageComposer]);
49089
- return /* @__PURE__ */ import_react248.default.createElement(
49089
+ return /* @__PURE__ */ import_react247.default.createElement(
49090
49090
  Modal,
49091
49091
  {
49092
49092
  className: "str-chat__edit-message-modal",
49093
49093
  onClose: onEditModalClose,
49094
49094
  open: true
49095
49095
  },
49096
- /* @__PURE__ */ import_react248.default.createElement(
49096
+ /* @__PURE__ */ import_react247.default.createElement(
49097
49097
  MessageInput,
49098
49098
  {
49099
49099
  clearEditingState,
@@ -49111,12 +49111,12 @@ var attachmentManagerConfigStateSelector2 = (state) => ({
49111
49111
  acceptedFiles: state.attachments.acceptedFiles,
49112
49112
  maxNumberOfFilesPerMessage: state.attachments.maxNumberOfFilesPerMessage
49113
49113
  });
49114
- var UploadButton = (0, import_react249.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
49114
+ var UploadButton = (0, import_react248.forwardRef)(function UploadButton2({ onFileChange, resetOnChange = true, ...rest }, ref) {
49115
49115
  const handleInputChange = useHandleFileChangeWrapper(resetOnChange, onFileChange);
49116
- return /* @__PURE__ */ import_react249.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
49116
+ return /* @__PURE__ */ import_react248.default.createElement("input", { onChange: handleInputChange, ref, type: "file", ...rest });
49117
49117
  });
49118
49118
  var FileInput = UploadButton;
49119
- var UploadFileInput = (0, import_react249.forwardRef)(function UploadFileInput2({
49119
+ var UploadFileInput = (0, import_react248.forwardRef)(function UploadFileInput2({
49120
49120
  className,
49121
49121
  onFileChange: onFileChangeCustom,
49122
49122
  ...props
@@ -49130,15 +49130,15 @@ var UploadFileInput = (0, import_react249.forwardRef)(function UploadFileInput2(
49130
49130
  messageComposer.configState,
49131
49131
  attachmentManagerConfigStateSelector2
49132
49132
  );
49133
- const id = (0, import_react249.useMemo)(() => (0, import_nanoid5.nanoid)(), []);
49134
- const onFileChange = (0, import_react249.useCallback)(
49133
+ const id = (0, import_react248.useMemo)(() => (0, import_nanoid5.nanoid)(), []);
49134
+ const onFileChange = (0, import_react248.useCallback)(
49135
49135
  (files) => {
49136
49136
  attachmentManager.uploadFiles(files);
49137
49137
  onFileChangeCustom?.(files);
49138
49138
  },
49139
49139
  [onFileChangeCustom, attachmentManager]
49140
49140
  );
49141
- return /* @__PURE__ */ import_react249.default.createElement(
49141
+ return /* @__PURE__ */ import_react248.default.createElement(
49142
49142
  FileInput,
49143
49143
  {
49144
49144
  accept: acceptedFiles?.join(","),
@@ -49185,7 +49185,7 @@ var VoiceRecordingPlayer = ({
49185
49185
  });
49186
49186
  if (!asset_url) return null;
49187
49187
  const displayedDuration = secondsElapsed || duration;
49188
- 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(
49188
+ return /* @__PURE__ */ import_react249.default.createElement("div", { className: rootClassName, "data-testid": "voice-recording-widget" }, /* @__PURE__ */ import_react249.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react249.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: mime_type })), /* @__PURE__ */ import_react249.default.createElement(PlayButton, { isPlaying, onClick: togglePlay }), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, /* @__PURE__ */ import_react249.default.createElement(
49189
49189
  "div",
49190
49190
  {
49191
49191
  className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -49193,25 +49193,25 @@ var VoiceRecordingPlayer = ({
49193
49193
  title
49194
49194
  },
49195
49195
  title
49196
- ), /* @__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(
49196
+ ), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(displayedDuration) : /* @__PURE__ */ import_react249.default.createElement(
49197
49197
  FileSizeIndicator,
49198
49198
  {
49199
49199
  fileSize: attachment.file_size,
49200
49200
  maximumFractionDigits: 0
49201
49201
  }
49202
- )), /* @__PURE__ */ import_react250.default.createElement(
49202
+ )), /* @__PURE__ */ import_react249.default.createElement(
49203
49203
  WaveProgressBar,
49204
49204
  {
49205
49205
  progress,
49206
49206
  seek,
49207
49207
  waveformData: waveform_data || []
49208
49208
  }
49209
- ))), /* @__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 })));
49209
+ ))), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__right-section" }, isPlaying ? /* @__PURE__ */ import_react249.default.createElement(PlaybackRateButton, { disabled: !audioRef.current, onClick: increasePlaybackRate }, playbackRate.toFixed(1), "x") : /* @__PURE__ */ import_react249.default.createElement(FileIcon, { big: true, mimeType: mime_type, size: 40 })));
49210
49210
  };
49211
49211
  var QuotedVoiceRecording = ({ attachment }) => {
49212
49212
  const { t } = useTranslationContext();
49213
49213
  const title = attachment.title || t("Voice message");
49214
- 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(
49214
+ return /* @__PURE__ */ import_react249.default.createElement("div", { className: rootClassName, "data-testid": "quoted-voice-recording-widget" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__metadata" }, title && /* @__PURE__ */ import_react249.default.createElement(
49215
49215
  "div",
49216
49216
  {
49217
49217
  className: "str-chat__message-attachment__voice-recording-widget__title",
@@ -49219,18 +49219,18 @@ var QuotedVoiceRecording = ({ attachment }) => {
49219
49219
  title
49220
49220
  },
49221
49221
  title
49222
- ), /* @__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(
49222
+ ), /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__audio-state" }, /* @__PURE__ */ import_react249.default.createElement("div", { className: "str-chat__message-attachment__voice-recording-widget__timer" }, attachment.duration ? displayDuration(attachment.duration) : /* @__PURE__ */ import_react249.default.createElement(
49223
49223
  FileSizeIndicator,
49224
49224
  {
49225
49225
  fileSize: attachment.file_size,
49226
49226
  maximumFractionDigits: 0
49227
49227
  }
49228
- )))), /* @__PURE__ */ import_react250.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
49228
+ )))), /* @__PURE__ */ import_react249.default.createElement(FileIcon, { big: true, mimeType: attachment.mime_type, size: 34 }));
49229
49229
  };
49230
- var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react250.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react250.default.createElement(VoiceRecordingPlayer, { attachment });
49230
+ var VoiceRecording = ({ attachment, isQuoted }) => isQuoted ? /* @__PURE__ */ import_react249.default.createElement(QuotedVoiceRecording, { attachment }) : /* @__PURE__ */ import_react249.default.createElement(VoiceRecordingPlayer, { attachment });
49231
49231
 
49232
49232
  // src/components/Attachment/Card.tsx
49233
- var import_react251 = __toESM(require("react"));
49233
+ var import_react250 = __toESM(require("react"));
49234
49234
  var import_clsx64 = __toESM(require("clsx"));
49235
49235
  var import_react_player = __toESM(require("react-player"));
49236
49236
  var getHostFromURL = (url) => {
@@ -49242,26 +49242,26 @@ var getHostFromURL = (url) => {
49242
49242
  };
49243
49243
  var UnableToRenderCard = ({ type }) => {
49244
49244
  const { t } = useTranslationContext("Card");
49245
- return /* @__PURE__ */ import_react251.default.createElement(
49245
+ return /* @__PURE__ */ import_react250.default.createElement(
49246
49246
  "div",
49247
49247
  {
49248
49248
  className: (0, import_clsx64.default)("str-chat__message-attachment-card", {
49249
49249
  [`str-chat__message-attachment-card--${type}`]: type
49250
49250
  })
49251
49251
  },
49252
- /* @__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")))
49252
+ /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, t("this content could not be displayed")))
49253
49253
  );
49254
49254
  };
49255
49255
  var SourceLink = ({
49256
49256
  author_name,
49257
49257
  url
49258
- }) => /* @__PURE__ */ import_react251.default.createElement(
49258
+ }) => /* @__PURE__ */ import_react250.default.createElement(
49259
49259
  "div",
49260
49260
  {
49261
49261
  className: "str-chat__message-attachment-card--source-link",
49262
49262
  "data-testid": "card-source-link"
49263
49263
  },
49264
- /* @__PURE__ */ import_react251.default.createElement(
49264
+ /* @__PURE__ */ import_react250.default.createElement(
49265
49265
  SafeAnchor,
49266
49266
  {
49267
49267
  className: "str-chat__message-attachment-card--url",
@@ -49276,7 +49276,7 @@ var CardHeader3 = (props) => {
49276
49276
  const { asset_url, dimensions, image: image4, image_url, thumb_url, title, type } = props;
49277
49277
  let visual = null;
49278
49278
  if (asset_url && type === "video") {
49279
- visual = /* @__PURE__ */ import_react251.default.createElement(
49279
+ visual = /* @__PURE__ */ import_react250.default.createElement(
49280
49280
  import_react_player.default,
49281
49281
  {
49282
49282
  className: "react-player",
@@ -49287,7 +49287,7 @@ var CardHeader3 = (props) => {
49287
49287
  }
49288
49288
  );
49289
49289
  } else if (image4) {
49290
- visual = /* @__PURE__ */ import_react251.default.createElement(
49290
+ visual = /* @__PURE__ */ import_react250.default.createElement(
49291
49291
  ImageComponent,
49292
49292
  {
49293
49293
  dimensions,
@@ -49297,7 +49297,7 @@ var CardHeader3 = (props) => {
49297
49297
  }
49298
49298
  );
49299
49299
  }
49300
- return visual ? /* @__PURE__ */ import_react251.default.createElement(
49300
+ return visual ? /* @__PURE__ */ import_react250.default.createElement(
49301
49301
  "div",
49302
49302
  {
49303
49303
  className: "str-chat__message-attachment-card--header str-chat__message-attachment-card-react--header",
@@ -49309,7 +49309,7 @@ var CardHeader3 = (props) => {
49309
49309
  var CardContent = (props) => {
49310
49310
  const { author_name, og_scrape_url, text: text8, title, title_link, type } = props;
49311
49311
  const url = title_link || og_scrape_url;
49312
- 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)));
49312
+ return /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--content" }, type === "audio" ? /* @__PURE__ */ import_react250.default.createElement(CardAudio, { og: props }) : /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--flex" }, url && /* @__PURE__ */ import_react250.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--title" }, title), text8 && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card--text" }, text8)));
49313
49313
  };
49314
49314
  var CardAudio = ({
49315
49315
  og: { asset_url, author_name, mime_type, og_scrape_url, text: text8, title, title_link }
@@ -49320,7 +49320,7 @@ var CardAudio = ({
49320
49320
  const url = title_link || og_scrape_url;
49321
49321
  const dataTestId = "card-audio-widget";
49322
49322
  const rootClassName2 = "str-chat__message-attachment-card-audio-widget";
49323
- 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)));
49323
+ return /* @__PURE__ */ import_react250.default.createElement("div", { className: rootClassName2, "data-testid": dataTestId }, asset_url && /* @__PURE__ */ import_react250.default.createElement(import_react250.default.Fragment, null, /* @__PURE__ */ import_react250.default.createElement("audio", { ref: audioRef }, /* @__PURE__ */ import_react250.default.createElement("source", { "data-testid": "audio-source", src: asset_url, type: "audio/mp3" })), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-card-audio-widget--first-row" }, /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--play-controls" }, /* @__PURE__ */ import_react250.default.createElement(PlayButton, { isPlaying, onClick: togglePlay })), /* @__PURE__ */ import_react250.default.createElement(ProgressBar, { onClick: seek, progress }))), /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--second-row" }, url && /* @__PURE__ */ import_react250.default.createElement(SourceLink, { author_name, url }), title && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--title" }, title), text8 && /* @__PURE__ */ import_react250.default.createElement("div", { className: "str-chat__message-attachment-audio-widget--description" }, text8)));
49324
49324
  };
49325
49325
  var UnMemoizedCard = (props) => {
49326
49326
  const { asset_url, giphy, image_url, thumb_url, title, title_link, type } = props;
@@ -49334,45 +49334,45 @@ var UnMemoizedCard = (props) => {
49334
49334
  dimensions.width = giphyVersion.width;
49335
49335
  }
49336
49336
  if (!title && !title_link && !asset_url && !image4) {
49337
- return /* @__PURE__ */ import_react251.default.createElement(UnableToRenderCard, null);
49337
+ return /* @__PURE__ */ import_react250.default.createElement(UnableToRenderCard, null);
49338
49338
  }
49339
- return /* @__PURE__ */ import_react251.default.createElement(
49339
+ return /* @__PURE__ */ import_react250.default.createElement(
49340
49340
  "div",
49341
49341
  {
49342
49342
  className: `str-chat__message-attachment-card str-chat__message-attachment-card--${type}`
49343
49343
  },
49344
- /* @__PURE__ */ import_react251.default.createElement(CardHeader3, { ...props, dimensions, image: image4 }),
49345
- /* @__PURE__ */ import_react251.default.createElement(CardContent, { ...props })
49344
+ /* @__PURE__ */ import_react250.default.createElement(CardHeader3, { ...props, dimensions, image: image4 }),
49345
+ /* @__PURE__ */ import_react250.default.createElement(CardContent, { ...props })
49346
49346
  );
49347
49347
  };
49348
- var Card3 = import_react251.default.memo(UnMemoizedCard);
49348
+ var Card3 = import_react250.default.memo(UnMemoizedCard);
49349
49349
 
49350
49350
  // src/components/Attachment/FileAttachment.tsx
49351
- var import_react252 = __toESM(require("react"));
49352
- 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(
49351
+ var import_react251 = __toESM(require("react"));
49352
+ var UnMemoizedFileAttachment = ({ attachment }) => /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item", "data-testid": "attachment-file" }, /* @__PURE__ */ import_react251.default.createElement(FileIcon, { className: "str-chat__file-icon", mimeType: attachment.mime_type }), /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item-text" }, /* @__PURE__ */ import_react251.default.createElement("div", { className: "str-chat__message-attachment-file--item-first-row" }, /* @__PURE__ */ import_react251.default.createElement(
49353
49353
  "div",
49354
49354
  {
49355
49355
  className: "str-chat__message-attachment-file--item-name",
49356
49356
  "data-testid": "file-title"
49357
49357
  },
49358
49358
  attachment.title
49359
- ), /* @__PURE__ */ import_react252.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react252.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
49360
- var FileAttachment = import_react252.default.memo(
49359
+ ), /* @__PURE__ */ import_react251.default.createElement(DownloadButton, { assetUrl: attachment.asset_url })), /* @__PURE__ */ import_react251.default.createElement(FileSizeIndicator, { fileSize: attachment.file_size })));
49360
+ var FileAttachment = import_react251.default.memo(
49361
49361
  UnMemoizedFileAttachment
49362
49362
  );
49363
49363
 
49364
49364
  // src/components/Attachment/UnsupportedAttachment.tsx
49365
- var import_react253 = __toESM(require("react"));
49365
+ var import_react252 = __toESM(require("react"));
49366
49366
  var UnsupportedAttachment = ({ attachment }) => {
49367
49367
  const { t } = useTranslationContext("UnsupportedAttachment");
49368
- return /* @__PURE__ */ import_react253.default.createElement(
49368
+ return /* @__PURE__ */ import_react252.default.createElement(
49369
49369
  "div",
49370
49370
  {
49371
49371
  className: "str-chat__message-attachment-unsupported",
49372
49372
  "data-testid": "attachment-unsupported"
49373
49373
  },
49374
- /* @__PURE__ */ import_react253.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
49375
- /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react253.default.createElement(
49374
+ /* @__PURE__ */ import_react252.default.createElement(FileIcon, { className: "str-chat__file-icon" }),
49375
+ /* @__PURE__ */ import_react252.default.createElement("div", { className: "str-chat__message-attachment-unsupported__metadata" }, /* @__PURE__ */ import_react252.default.createElement(
49376
49376
  "div",
49377
49377
  {
49378
49378
  className: "str-chat__message-attachment-unsupported__title",
@@ -49404,7 +49404,7 @@ var AttachmentWithinContainer = ({
49404
49404
  "str-chat__message-attachment-with-actions": extra === "actions"
49405
49405
  }
49406
49406
  );
49407
- return /* @__PURE__ */ import_react254.default.createElement("div", { className: classNames }, children);
49407
+ return /* @__PURE__ */ import_react253.default.createElement("div", { className: classNames }, children);
49408
49408
  };
49409
49409
  var AttachmentActionsContainer = ({
49410
49410
  actionHandler,
@@ -49412,7 +49412,7 @@ var AttachmentActionsContainer = ({
49412
49412
  AttachmentActions: AttachmentActions2 = AttachmentActions
49413
49413
  }) => {
49414
49414
  if (!attachment.actions?.length) return null;
49415
- return /* @__PURE__ */ import_react254.default.createElement(
49415
+ return /* @__PURE__ */ import_react253.default.createElement(
49416
49416
  AttachmentActions2,
49417
49417
  {
49418
49418
  ...attachment,
@@ -49443,10 +49443,10 @@ var GalleryContainer = ({
49443
49443
  attachment,
49444
49444
  Gallery: Gallery2 = Gallery
49445
49445
  }) => {
49446
- const imageElements = (0, import_react254.useRef)([]);
49446
+ const imageElements = (0, import_react253.useRef)([]);
49447
49447
  const { imageAttachmentSizeHandler } = useChannelStateContext();
49448
- const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react254.useState)([]);
49449
- (0, import_react254.useLayoutEffect)(() => {
49448
+ const [attachmentConfigurations, setAttachmentConfigurations] = (0, import_react253.useState)([]);
49449
+ (0, import_react253.useLayoutEffect)(() => {
49450
49450
  if (imageElements.current && imageElements.current.every((element4) => !!element4) && imageAttachmentSizeHandler) {
49451
49451
  const newConfigurations = [];
49452
49452
  imageElements.current.forEach((element4, i) => {
@@ -49463,15 +49463,15 @@ var GalleryContainer = ({
49463
49463
  attachment.images[i]?.image_url || attachment.images[i]?.thumb_url || ""
49464
49464
  )
49465
49465
  }));
49466
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react254.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
49466
+ return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "gallery" }, /* @__PURE__ */ import_react253.default.createElement(Gallery2, { images: images || [], innerRefs: imageElements, key: "gallery" }));
49467
49467
  };
49468
49468
  var ImageContainer = (props) => {
49469
49469
  const { attachment, Image: Image4 = ImageComponent } = props;
49470
49470
  const componentType = "image";
49471
- const imageElement = (0, import_react254.useRef)(null);
49471
+ const imageElement = (0, import_react253.useRef)(null);
49472
49472
  const { imageAttachmentSizeHandler } = useChannelStateContext();
49473
- const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)(void 0);
49474
- (0, import_react254.useLayoutEffect)(() => {
49473
+ const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react253.useState)(void 0);
49474
+ (0, import_react253.useLayoutEffect)(() => {
49475
49475
  if (imageElement.current && imageAttachmentSizeHandler) {
49476
49476
  const config = imageAttachmentSizeHandler(attachment, imageElement.current);
49477
49477
  setAttachmentConfiguration(config);
@@ -49483,41 +49483,41 @@ var ImageContainer = (props) => {
49483
49483
  style: getCssDimensionsVariables(attachment.image_url || attachment.thumb_url || "")
49484
49484
  };
49485
49485
  if (attachment.actions && attachment.actions.length) {
49486
- 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 })));
49486
+ return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }), /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props })));
49487
49487
  }
49488
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }));
49488
+ return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement(Image4, { ...imageConfig, innerRef: imageElement }));
49489
49489
  };
49490
49490
  var CardContainer = (props) => {
49491
49491
  const { attachment, Card: Card4 = Card3 } = props;
49492
49492
  const componentType = "card";
49493
49493
  if (attachment.actions && attachment.actions.length) {
49494
- 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 })));
49494
+ return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Card4, { ...attachment }), /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props })));
49495
49495
  }
49496
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react254.default.createElement(Card4, { ...attachment }));
49496
+ return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement(Card4, { ...attachment }));
49497
49497
  };
49498
49498
  var FileContainer = ({
49499
49499
  attachment,
49500
49500
  File: File2 = FileAttachment
49501
49501
  }) => {
49502
49502
  if (!attachment.asset_url) return null;
49503
- return /* @__PURE__ */ import_react254.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react254.default.createElement(File2, { attachment }));
49503
+ return /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "file" }, /* @__PURE__ */ import_react253.default.createElement(File2, { attachment }));
49504
49504
  };
49505
49505
  var AudioContainer = ({
49506
49506
  attachment,
49507
49507
  Audio: Audio2 = Audio
49508
- }) => /* @__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 })));
49508
+ }) => /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "audio" }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(Audio2, { og: attachment })));
49509
49509
  var VoiceRecordingContainer = ({
49510
49510
  attachment,
49511
49511
  isQuoted,
49512
49512
  VoiceRecording: VoiceRecording2 = VoiceRecording
49513
- }) => /* @__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 })));
49513
+ }) => /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType: "voiceRecording" }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, /* @__PURE__ */ import_react253.default.createElement(VoiceRecording2, { attachment, isQuoted })));
49514
49514
  var MediaContainer = (props) => {
49515
49515
  const { attachment, Media = import_react_player2.default } = props;
49516
49516
  const componentType = "media";
49517
49517
  const { shouldGenerateVideoThumbnail, videoAttachmentSizeHandler } = useChannelStateContext();
49518
- const videoElement = (0, import_react254.useRef)(null);
49519
- const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react254.useState)();
49520
- (0, import_react254.useLayoutEffect)(() => {
49518
+ const videoElement = (0, import_react253.useRef)(null);
49519
+ const [attachmentConfiguration, setAttachmentConfiguration] = (0, import_react253.useState)();
49520
+ (0, import_react253.useLayoutEffect)(() => {
49521
49521
  if (videoElement.current && videoAttachmentSizeHandler) {
49522
49522
  const config = videoAttachmentSizeHandler(
49523
49523
  attachment,
@@ -49527,7 +49527,7 @@ var MediaContainer = (props) => {
49527
49527
  setAttachmentConfiguration(config);
49528
49528
  }
49529
49529
  }, [videoElement, videoAttachmentSizeHandler, attachment]);
49530
- const content3 = /* @__PURE__ */ import_react254.default.createElement(
49530
+ const content3 = /* @__PURE__ */ import_react253.default.createElement(
49531
49531
  "div",
49532
49532
  {
49533
49533
  className: "str-chat__player-wrapper",
@@ -49535,7 +49535,7 @@ var MediaContainer = (props) => {
49535
49535
  ref: videoElement,
49536
49536
  style: getCssDimensionsVariables(attachment.thumb_url || "")
49537
49537
  },
49538
- /* @__PURE__ */ import_react254.default.createElement(
49538
+ /* @__PURE__ */ import_react253.default.createElement(
49539
49539
  Media,
49540
49540
  {
49541
49541
  className: "react-player",
@@ -49547,12 +49547,12 @@ var MediaContainer = (props) => {
49547
49547
  }
49548
49548
  )
49549
49549
  );
49550
- 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);
49550
+ return attachment.actions?.length ? /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, /* @__PURE__ */ import_react253.default.createElement("div", { className: "str-chat__attachment" }, content3, /* @__PURE__ */ import_react253.default.createElement(AttachmentActionsContainer, { ...props }))) : /* @__PURE__ */ import_react253.default.createElement(AttachmentWithinContainer, { attachment, componentType }, content3);
49551
49551
  };
49552
49552
  var UnsupportedAttachmentContainer = ({
49553
49553
  attachment,
49554
49554
  UnsupportedAttachment: UnsupportedAttachment2 = UnsupportedAttachment
49555
- }) => /* @__PURE__ */ import_react254.default.createElement(import_react254.default.Fragment, null, /* @__PURE__ */ import_react254.default.createElement(UnsupportedAttachment2, { attachment }));
49555
+ }) => /* @__PURE__ */ import_react253.default.createElement(import_react253.default.Fragment, null, /* @__PURE__ */ import_react253.default.createElement(UnsupportedAttachment2, { attachment }));
49556
49556
 
49557
49557
  // src/components/Attachment/Attachment.tsx
49558
49558
  var CONTAINER_MAP = {
@@ -49575,12 +49575,12 @@ var ATTACHMENT_GROUPS_ORDER = [
49575
49575
  ];
49576
49576
  var Attachment = (props) => {
49577
49577
  const { attachments } = props;
49578
- const groupedAttachments = (0, import_react255.useMemo)(
49578
+ const groupedAttachments = (0, import_react254.useMemo)(
49579
49579
  () => renderGroupedAttachments(props),
49580
49580
  // eslint-disable-next-line react-hooks/exhaustive-deps
49581
49581
  [attachments]
49582
49582
  );
49583
- return /* @__PURE__ */ import_react255.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
49583
+ return /* @__PURE__ */ import_react254.default.createElement("div", { className: "str-chat__attachment-list" }, ATTACHMENT_GROUPS_ORDER.reduce(
49584
49584
  (acc, groupName) => [...acc, ...groupedAttachments[groupName]],
49585
49585
  []
49586
49586
  ));
@@ -49597,7 +49597,7 @@ var renderGroupedAttachments = ({
49597
49597
  const attachmentType = getAttachmentType(attachment);
49598
49598
  const Container = CONTAINER_MAP[attachmentType];
49599
49599
  typeMap[attachmentType].push(
49600
- /* @__PURE__ */ import_react255.default.createElement(
49600
+ /* @__PURE__ */ import_react254.default.createElement(
49601
49601
  Container,
49602
49602
  {
49603
49603
  key: `${attachmentType}-${typeMap[attachmentType].length}`,
@@ -49624,7 +49624,7 @@ var renderGroupedAttachments = ({
49624
49624
  );
49625
49625
  if (uploadedImages.length > 1) {
49626
49626
  containers["gallery"] = [
49627
- /* @__PURE__ */ import_react255.default.createElement(
49627
+ /* @__PURE__ */ import_react254.default.createElement(
49628
49628
  GalleryContainer,
49629
49629
  {
49630
49630
  key: "gallery-container",
@@ -49638,7 +49638,7 @@ var renderGroupedAttachments = ({
49638
49638
  ];
49639
49639
  } else if (uploadedImages.length === 1) {
49640
49640
  containers["image"] = [
49641
- /* @__PURE__ */ import_react255.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
49641
+ /* @__PURE__ */ import_react254.default.createElement(ImageContainer, { key: "image-container", ...rest, attachment: uploadedImages[0] })
49642
49642
  ];
49643
49643
  }
49644
49644
  return containers;
@@ -49659,7 +49659,7 @@ var getAttachmentType = (attachment) => {
49659
49659
  };
49660
49660
 
49661
49661
  // src/components/Channel/Channel.tsx
49662
- var import_react261 = __toESM(require("react"));
49662
+ var import_react260 = __toESM(require("react"));
49663
49663
  var import_clsx66 = __toESM(require("clsx"));
49664
49664
  var import_lodash19 = __toESM(require("lodash.debounce"));
49665
49665
  var import_lodash20 = __toESM(require("lodash.defaultsdeep"));
@@ -49840,7 +49840,7 @@ var initialState = {
49840
49840
  };
49841
49841
 
49842
49842
  // src/components/Channel/hooks/useCreateChannelStateContext.ts
49843
- var import_react256 = require("react");
49843
+ var import_react255 = require("react");
49844
49844
  var useCreateChannelStateContext = (value) => {
49845
49845
  const {
49846
49846
  channel,
@@ -49899,7 +49899,7 @@ var useCreateChannelStateContext = (value) => {
49899
49899
  const memoizedThreadMessageData = threadMessages.map(
49900
49900
  ({ 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}`
49901
49901
  ).join();
49902
- const channelStateContext = (0, import_react256.useMemo)(
49902
+ const channelStateContext = (0, import_react255.useMemo)(
49903
49903
  () => ({
49904
49904
  channel,
49905
49905
  channelCapabilities,
@@ -49963,11 +49963,11 @@ var useCreateChannelStateContext = (value) => {
49963
49963
  };
49964
49964
 
49965
49965
  // src/components/Channel/hooks/useCreateTypingContext.ts
49966
- var import_react257 = require("react");
49966
+ var import_react256 = require("react");
49967
49967
  var useCreateTypingContext = (value) => {
49968
49968
  const { typing } = value;
49969
49969
  const typingValue = Object.keys(typing || {}).join();
49970
- const typingContext = (0, import_react257.useMemo)(
49970
+ const typingContext = (0, import_react256.useMemo)(
49971
49971
  () => ({
49972
49972
  typing
49973
49973
  }),
@@ -49991,10 +49991,10 @@ var useEditMessageHandler = (doUpdateMessageRequest) => {
49991
49991
  };
49992
49992
 
49993
49993
  // src/components/Channel/hooks/useIsMounted.ts
49994
- var import_react258 = require("react");
49994
+ var import_react257 = require("react");
49995
49995
  var useIsMounted = () => {
49996
- const isMounted = (0, import_react258.useRef)(false);
49997
- (0, import_react258.useEffect)(() => {
49996
+ const isMounted = (0, import_react257.useRef)(false);
49997
+ (0, import_react257.useEffect)(() => {
49998
49998
  isMounted.current = true;
49999
49999
  return () => {
50000
50000
  isMounted.current = false;
@@ -50004,8 +50004,8 @@ var useIsMounted = () => {
50004
50004
  };
50005
50005
 
50006
50006
  // src/components/Channel/hooks/useMentionsHandlers.ts
50007
- var import_react259 = require("react");
50008
- var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react259.useCallback)(
50007
+ var import_react258 = require("react");
50008
+ var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react258.useCallback)(
50009
50009
  (event, mentioned_users) => {
50010
50010
  if (!onMentionsHover && !onMentionsClick || !(event.target instanceof HTMLElement)) {
50011
50011
  return;
@@ -50029,11 +50029,11 @@ var useMentionsHandlers = (onMentionsHover, onMentionsClick) => (0, import_react
50029
50029
  );
50030
50030
 
50031
50031
  // src/components/Channel/LoadingChannel.tsx
50032
- var import_react260 = __toESM(require("react"));
50033
- 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" }))));
50034
- 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" }));
50035
- 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" })));
50036
- 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));
50032
+ var import_react259 = __toESM(require("react"));
50033
+ var LoadingMessage = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-avatar" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-end" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-sender" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-last-row" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-text" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-date" }))));
50034
+ var LoadingMessageInput = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-input-row" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-input" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-send" }));
50035
+ var LoadingChannelHeader = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-avatar" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-end" }, /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-name" }), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-header-info" })));
50036
+ var LoadingChannel = () => /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel" }, /* @__PURE__ */ import_react259.default.createElement(LoadingChannelHeader, null), /* @__PURE__ */ import_react259.default.createElement("div", { className: "str-chat__loading-channel-message-list" }, Array.from(Array(3)).map((_, i) => /* @__PURE__ */ import_react259.default.createElement(LoadingMessage, { key: `loading-message-${i}` }))), /* @__PURE__ */ import_react259.default.createElement(LoadingMessageInput, null));
50037
50037
 
50038
50038
  // src/components/Channel/hooks/useChannelContainerClasses.ts
50039
50039
  var useImageFlagEmojisOnWindowsClass = () => {
@@ -50220,7 +50220,7 @@ var ChannelContainer = ({
50220
50220
  customClasses
50221
50221
  });
50222
50222
  const className = (0, import_clsx66.default)(chatClass, theme, channelClass, additionalClassName);
50223
- return /* @__PURE__ */ import_react261.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
50223
+ return /* @__PURE__ */ import_react260.default.createElement("div", { id: CHANNEL_CONTAINER_ID, ...props, className }, children);
50224
50224
  };
50225
50225
  var UnMemoizedChannel = (props) => {
50226
50226
  const {
@@ -50232,15 +50232,15 @@ var UnMemoizedChannel = (props) => {
50232
50232
  const { channel: contextChannel, channelsQueryState } = useChatContext("Channel");
50233
50233
  const channel = propsChannel || contextChannel;
50234
50234
  if (channelsQueryState.queryInProgress === "reload" && LoadingIndicator2) {
50235
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
50235
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingIndicator2, null));
50236
50236
  }
50237
50237
  if (channelsQueryState.error && LoadingErrorIndicator2) {
50238
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
50238
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingErrorIndicator2, { error: channelsQueryState.error }));
50239
50239
  }
50240
50240
  if (!channel?.cid) {
50241
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
50241
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, EmptyPlaceholder2);
50242
50242
  }
50243
- return /* @__PURE__ */ import_react261.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
50243
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelInner, { ...props, channel, key: channel.cid });
50244
50244
  };
50245
50245
  var ChannelInner = (props) => {
50246
50246
  const {
@@ -50260,7 +50260,7 @@ var ChannelInner = (props) => {
50260
50260
  onMentionsHover,
50261
50261
  skipMessageDataMemoization
50262
50262
  } = props;
50263
- const channelQueryOptions = (0, import_react261.useMemo)(
50263
+ const channelQueryOptions = (0, import_react260.useMemo)(
50264
50264
  () => (0, import_lodash20.default)(propChannelQueryOptions, {
50265
50265
  messages: { limit: DEFAULT_INITIAL_CHANNEL_PAGE_SIZE }
50266
50266
  }),
@@ -50271,12 +50271,12 @@ var ChannelInner = (props) => {
50271
50271
  const chatContainerClass = getChatContainerClass(customClasses?.chatContainer);
50272
50272
  const windowsEmojiClass = useImageFlagEmojisOnWindowsClass();
50273
50273
  const thread = useThreadContext();
50274
- const [channelConfig, setChannelConfig] = (0, import_react261.useState)(channel.getConfig());
50275
- const [notifications, setNotifications] = (0, import_react261.useState)([]);
50276
- const notificationTimeouts = (0, import_react261.useRef)([]);
50277
- const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react261.useState)();
50278
- const channelReducer = (0, import_react261.useMemo)(() => makeChannelReducer(), []);
50279
- const [state, dispatch] = (0, import_react261.useReducer)(
50274
+ const [channelConfig, setChannelConfig] = (0, import_react260.useState)(channel.getConfig());
50275
+ const [notifications, setNotifications] = (0, import_react260.useState)([]);
50276
+ const notificationTimeouts = (0, import_react260.useRef)([]);
50277
+ const [channelUnreadUiState, _setChannelUnreadUiState] = (0, import_react260.useState)();
50278
+ const channelReducer = (0, import_react260.useMemo)(() => makeChannelReducer(), []);
50279
+ const [state, dispatch] = (0, import_react260.useReducer)(
50280
50280
  channelReducer,
50281
50281
  // channel.initialized === false if client.channel().query() was not called, e.g. ChannelList is not used
50282
50282
  // => Channel will call channel.watch() in useLayoutEffect => state.loading is used to signal the watch() call state
@@ -50288,10 +50288,10 @@ var ChannelInner = (props) => {
50288
50288
  );
50289
50289
  const jumpToMessageFromSearch = useSearchFocusedMessage();
50290
50290
  const isMounted = useIsMounted();
50291
- const originalTitle = (0, import_react261.useRef)("");
50292
- const lastRead = (0, import_react261.useRef)(void 0);
50293
- const online = (0, import_react261.useRef)(true);
50294
- const clearHighlightedMessageTimeoutId = (0, import_react261.useRef)(
50291
+ const originalTitle = (0, import_react260.useRef)("");
50292
+ const lastRead = (0, import_react260.useRef)(void 0);
50293
+ const online = (0, import_react260.useRef)(true);
50294
+ const clearHighlightedMessageTimeoutId = (0, import_react260.useRef)(
50295
50295
  null
50296
50296
  );
50297
50297
  const channelCapabilitiesArray = channel.data?.own_capabilities;
@@ -50303,14 +50303,14 @@ var ChannelInner = (props) => {
50303
50303
  trailing: true
50304
50304
  }
50305
50305
  );
50306
- const setChannelUnreadUiState = (0, import_react261.useMemo)(
50306
+ const setChannelUnreadUiState = (0, import_react260.useMemo)(
50307
50307
  () => (0, import_lodash21.default)(_setChannelUnreadUiState, 200, {
50308
50308
  leading: true,
50309
50309
  trailing: false
50310
50310
  }),
50311
50311
  []
50312
50312
  );
50313
- const markRead = (0, import_react261.useMemo)(
50313
+ const markRead = (0, import_react260.useMemo)(
50314
50314
  () => (0, import_lodash21.default)(
50315
50315
  async (options) => {
50316
50316
  const { updateChannelUiUnreadState = true } = options ?? {};
@@ -50413,7 +50413,7 @@ var ChannelInner = (props) => {
50413
50413
  }
50414
50414
  throttledCopyStateFromChannel();
50415
50415
  };
50416
- (0, import_react261.useLayoutEffect)(() => {
50416
+ (0, import_react260.useLayoutEffect)(() => {
50417
50417
  let errored = false;
50418
50418
  let done = false;
50419
50419
  (async () => {
@@ -50479,12 +50479,12 @@ var ChannelInner = (props) => {
50479
50479
  channelConfig?.read_events,
50480
50480
  initializeOnMount
50481
50481
  ]);
50482
- (0, import_react261.useEffect)(() => {
50482
+ (0, import_react260.useEffect)(() => {
50483
50483
  if (!state.thread) return;
50484
50484
  const message = state.messages?.find((m) => m.id === state.thread?.id);
50485
50485
  if (message) dispatch({ message, type: "setThread" });
50486
50486
  }, [state.messages, state.thread]);
50487
- const handleHighlightedMessageChange = (0, import_react261.useCallback)(
50487
+ const handleHighlightedMessageChange = (0, import_react260.useCallback)(
50488
50488
  ({
50489
50489
  highlightDuration,
50490
50490
  highlightedMessageId
@@ -50507,15 +50507,15 @@ var ChannelInner = (props) => {
50507
50507
  },
50508
50508
  [channel, searchController]
50509
50509
  );
50510
- (0, import_react261.useEffect)(() => {
50510
+ (0, import_react260.useEffect)(() => {
50511
50511
  if (!jumpToMessageFromSearch?.id) return;
50512
50512
  handleHighlightedMessageChange({ highlightedMessageId: jumpToMessageFromSearch.id });
50513
50513
  }, [jumpToMessageFromSearch, handleHighlightedMessageChange]);
50514
- const addNotification = (0, import_react261.useMemo)(
50514
+ const addNotification = (0, import_react260.useMemo)(
50515
50515
  () => makeAddNotifications(setNotifications, notificationTimeouts.current),
50516
50516
  []
50517
50517
  );
50518
- const loadMoreFinished = (0, import_react261.useCallback)(
50518
+ const loadMoreFinished = (0, import_react260.useCallback)(
50519
50519
  (0, import_lodash19.default)(
50520
50520
  (hasMore, messages) => {
50521
50521
  if (!isMounted.current) return;
@@ -50576,7 +50576,7 @@ var ChannelInner = (props) => {
50576
50576
  });
50577
50577
  return queryResponse.messages.length;
50578
50578
  };
50579
- const jumpToMessage = (0, import_react261.useCallback)(
50579
+ const jumpToMessage = (0, import_react260.useCallback)(
50580
50580
  async (messageId, messageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
50581
50581
  dispatch({ loadingMore: true, type: "setLoadingMore" });
50582
50582
  await channel.state.loadMessageIntoState(messageId, void 0, messageLimit);
@@ -50588,14 +50588,14 @@ var ChannelInner = (props) => {
50588
50588
  },
50589
50589
  [channel, handleHighlightedMessageChange, loadMoreFinished]
50590
50590
  );
50591
- const jumpToLatestMessage = (0, import_react261.useCallback)(async () => {
50591
+ const jumpToLatestMessage = (0, import_react260.useCallback)(async () => {
50592
50592
  await channel.state.loadMessageIntoState("latest");
50593
50593
  loadMoreFinished(channel.state.messagePagination.hasPrev, channel.state.messages);
50594
50594
  dispatch({
50595
50595
  type: "jumpToLatestMessage"
50596
50596
  });
50597
50597
  }, [channel, loadMoreFinished]);
50598
- const jumpToFirstUnreadMessage = (0, import_react261.useCallback)(
50598
+ const jumpToFirstUnreadMessage = (0, import_react260.useCallback)(
50599
50599
  async (queryMessageLimit = DEFAULT_JUMP_TO_PAGE_SIZE, highlightDuration = DEFAULT_HIGHLIGHT_DURATION) => {
50600
50600
  if (!channelUnreadUiState?.unread_messages) return;
50601
50601
  let lastReadMessageId = channelUnreadUiState?.last_read_message_id;
@@ -50718,7 +50718,7 @@ var ChannelInner = (props) => {
50718
50718
  channelUnreadUiState
50719
50719
  ]
50720
50720
  );
50721
- const deleteMessage = (0, import_react261.useCallback)(
50721
+ const deleteMessage = (0, import_react260.useCallback)(
50722
50722
  async (message) => {
50723
50723
  if (!message?.id) {
50724
50724
  throw new Error("Cannot delete a message - missing message ID.");
@@ -50836,7 +50836,7 @@ var ChannelInner = (props) => {
50836
50836
  event?.preventDefault();
50837
50837
  dispatch({ type: "closeThread" });
50838
50838
  };
50839
- const loadMoreThreadFinished = (0, import_react261.useCallback)(
50839
+ const loadMoreThreadFinished = (0, import_react260.useCallback)(
50840
50840
  (0, import_lodash19.default)(
50841
50841
  (threadHasMore, threadMessages) => {
50842
50842
  dispatch({
@@ -50891,7 +50891,7 @@ var ChannelInner = (props) => {
50891
50891
  videoAttachmentSizeHandler: props.videoAttachmentSizeHandler || getVideoAttachmentConfiguration,
50892
50892
  watcher_count: state.watcherCount
50893
50893
  });
50894
- const channelActionContextValue = (0, import_react261.useMemo)(
50894
+ const channelActionContextValue = (0, import_react260.useMemo)(
50895
50895
  () => ({
50896
50896
  addNotification,
50897
50897
  closeThread,
@@ -50928,7 +50928,7 @@ var ChannelInner = (props) => {
50928
50928
  setChannelUnreadUiState
50929
50929
  ]
50930
50930
  );
50931
- const componentContextValue = (0, import_react261.useMemo)(
50931
+ const componentContextValue = (0, import_react260.useMemo)(
50932
50932
  () => ({
50933
50933
  Attachment: props.Attachment,
50934
50934
  AttachmentPreviewList: props.AttachmentPreviewList,
@@ -51058,26 +51058,26 @@ var ChannelInner = (props) => {
51058
51058
  typing
51059
51059
  });
51060
51060
  if (state.error) {
51061
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingErrorIndicator2, { error: state.error }));
51061
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingErrorIndicator2, { error: state.error }));
51062
51062
  }
51063
51063
  if (state.loading) {
51064
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement(LoadingIndicator2, null));
51064
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement(LoadingIndicator2, null));
51065
51065
  }
51066
51066
  if (!channel.watch) {
51067
- return /* @__PURE__ */ import_react261.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react261.default.createElement("div", null, t("Channel Missing")));
51067
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, null, /* @__PURE__ */ import_react260.default.createElement("div", null, t("Channel Missing")));
51068
51068
  }
51069
- 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))))));
51069
+ return /* @__PURE__ */ import_react260.default.createElement(ChannelContainer, { className: windowsEmojiClass }, /* @__PURE__ */ import_react260.default.createElement(ChannelStateProvider, { value: channelStateContextValue }, /* @__PURE__ */ import_react260.default.createElement(ChannelActionProvider, { value: channelActionContextValue }, /* @__PURE__ */ import_react260.default.createElement(WithComponents, { overrides: componentContextValue }, /* @__PURE__ */ import_react260.default.createElement(TypingProvider, { value: typingContextValue }, /* @__PURE__ */ import_react260.default.createElement("div", { className: (0, import_clsx66.default)(chatContainerClass) }, children))))));
51070
51070
  };
51071
- var Channel = import_react261.default.memo(UnMemoizedChannel);
51071
+ var Channel = import_react260.default.memo(UnMemoizedChannel);
51072
51072
 
51073
51073
  // src/components/ChannelHeader/ChannelHeader.tsx
51074
- var import_react263 = __toESM(require("react"));
51074
+ var import_react262 = __toESM(require("react"));
51075
51075
 
51076
51076
  // src/components/ChannelHeader/icons.tsx
51077
- var import_react262 = __toESM(require("react"));
51077
+ var import_react261 = __toESM(require("react"));
51078
51078
  var MenuIcon2 = ({ title }) => {
51079
51079
  const { t } = useTranslationContext("MenuIcon");
51080
- 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(
51080
+ return /* @__PURE__ */ import_react261.default.createElement("svg", { "data-testid": "menu-icon", viewBox: "0 0 448 512", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ import_react261.default.createElement("title", null, title ?? t("Menu")), /* @__PURE__ */ import_react261.default.createElement(
51081
51081
  "path",
51082
51082
  {
51083
51083
  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",
@@ -51104,15 +51104,15 @@ var ChannelHeader = (props) => {
51104
51104
  overrideTitle
51105
51105
  });
51106
51106
  const { member_count, subtitle } = channel?.data || {};
51107
- return /* @__PURE__ */ import_react263.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react263.default.createElement(
51107
+ return /* @__PURE__ */ import_react262.default.createElement("div", { className: "str-chat__channel-header" }, /* @__PURE__ */ import_react262.default.createElement(
51108
51108
  "button",
51109
51109
  {
51110
51110
  "aria-label": t("aria/Menu"),
51111
51111
  className: "str-chat__header-hamburger",
51112
51112
  onClick: openMobileNav
51113
51113
  },
51114
- /* @__PURE__ */ import_react263.default.createElement(MenuIcon3, null)
51115
- ), /* @__PURE__ */ import_react263.default.createElement(
51114
+ /* @__PURE__ */ import_react262.default.createElement(MenuIcon3, null)
51115
+ ), /* @__PURE__ */ import_react262.default.createElement(
51116
51116
  Avatar2,
51117
51117
  {
51118
51118
  className: "str-chat__avatar--channel-header",
@@ -51120,36 +51120,36 @@ var ChannelHeader = (props) => {
51120
51120
  image: displayImage,
51121
51121
  name: displayTitle
51122
51122
  }
51123
- ), /* @__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", {
51123
+ ), /* @__PURE__ */ import_react262.default.createElement("div", { className: "str-chat__channel-header-end" }, /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-title" }, displayTitle, " ", live && /* @__PURE__ */ import_react262.default.createElement("span", { className: "str-chat__header-livestream-livelabel" }, t("live"))), subtitle && /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-subtitle" }, subtitle), /* @__PURE__ */ import_react262.default.createElement("p", { className: "str-chat__channel-header-info" }, !live && !!member_count && member_count > 0 && /* @__PURE__ */ import_react262.default.createElement(import_react262.default.Fragment, null, t("{{ memberCount }} members", {
51124
51124
  memberCount: member_count
51125
51125
  }), ",", " "), t("{{ watcherCount }} online", { watcherCount: watcher_count }))));
51126
51126
  };
51127
51127
 
51128
51128
  // src/components/Chat/Chat.tsx
51129
- var import_react267 = __toESM(require("react"));
51129
+ var import_react266 = __toESM(require("react"));
51130
51130
  var import_stream_chat12 = require("stream-chat");
51131
51131
 
51132
51132
  // src/components/Chat/hooks/useChat.ts
51133
- var import_react264 = require("react");
51133
+ var import_react263 = require("react");
51134
51134
  var useChat = ({
51135
51135
  client,
51136
51136
  defaultLanguage = "en",
51137
51137
  i18nInstance,
51138
51138
  initialNavOpen
51139
51139
  }) => {
51140
- const [translators, setTranslators] = (0, import_react264.useState)({
51140
+ const [translators, setTranslators] = (0, import_react263.useState)({
51141
51141
  t: (key) => key,
51142
51142
  tDateTimeParser: defaultDateTimeParser,
51143
51143
  userLanguage: "en"
51144
51144
  });
51145
- const [channel, setChannel] = (0, import_react264.useState)();
51146
- const [mutes, setMutes] = (0, import_react264.useState)([]);
51147
- const [navOpen, setNavOpen] = (0, import_react264.useState)(initialNavOpen);
51148
- const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react264.useState)({});
51145
+ const [channel, setChannel] = (0, import_react263.useState)();
51146
+ const [mutes, setMutes] = (0, import_react263.useState)([]);
51147
+ const [navOpen, setNavOpen] = (0, import_react263.useState)(initialNavOpen);
51148
+ const [latestMessageDatesByChannels, setLatestMessageDatesByChannels] = (0, import_react263.useState)({});
51149
51149
  const clientMutes = client.user?.mutes ?? [];
51150
51150
  const closeMobileNav = () => setNavOpen(false);
51151
51151
  const openMobileNav = () => setTimeout(() => setNavOpen(true), 100);
51152
- const appSettings = (0, import_react264.useRef)(null);
51152
+ const appSettings = (0, import_react263.useRef)(null);
51153
51153
  const getAppSettings = () => {
51154
51154
  if (appSettings.current) {
51155
51155
  return appSettings.current;
@@ -51157,9 +51157,9 @@ var useChat = ({
51157
51157
  appSettings.current = client.getAppSettings();
51158
51158
  return appSettings.current;
51159
51159
  };
51160
- (0, import_react264.useEffect)(() => {
51160
+ (0, import_react263.useEffect)(() => {
51161
51161
  if (!client) return;
51162
- const version = "13.0.0-rc.1";
51162
+ const version = "13.0.0-rc.2";
51163
51163
  const userAgent = client.getUserAgent();
51164
51164
  if (!userAgent.includes("stream-chat-react")) {
51165
51165
  client.setUserAgent(`stream-chat-react-${version}-${userAgent}`);
@@ -51171,7 +51171,7 @@ var useChat = ({
51171
51171
  client.polls.unregisterSubscriptions();
51172
51172
  };
51173
51173
  }, [client]);
51174
- (0, import_react264.useEffect)(() => {
51174
+ (0, import_react263.useEffect)(() => {
51175
51175
  setMutes(clientMutes);
51176
51176
  const handleEvent = (event) => {
51177
51177
  setMutes(event.me?.mutes || []);
@@ -51179,7 +51179,7 @@ var useChat = ({
51179
51179
  client.on("notification.mutes_updated", handleEvent);
51180
51180
  return () => client.off("notification.mutes_updated", handleEvent);
51181
51181
  }, [clientMutes?.length]);
51182
- (0, import_react264.useEffect)(() => {
51182
+ (0, import_react263.useEffect)(() => {
51183
51183
  let userLanguage = client.user?.language;
51184
51184
  if (!userLanguage) {
51185
51185
  const browserLanguage = window.navigator.language.slice(0, 2);
@@ -51196,7 +51196,7 @@ var useChat = ({
51196
51196
  });
51197
51197
  });
51198
51198
  }, [i18nInstance]);
51199
- const setActiveChannel = (0, import_react264.useCallback)(
51199
+ const setActiveChannel = (0, import_react263.useCallback)(
51200
51200
  async (activeChannel, watchers = {}, event) => {
51201
51201
  if (event && event.preventDefault) event.preventDefault();
51202
51202
  if (activeChannel && Object.keys(watchers).length) {
@@ -51207,7 +51207,7 @@ var useChat = ({
51207
51207
  },
51208
51208
  []
51209
51209
  );
51210
- (0, import_react264.useEffect)(() => {
51210
+ (0, import_react263.useEffect)(() => {
51211
51211
  setLatestMessageDatesByChannels({});
51212
51212
  }, [client.user?.id]);
51213
51213
  return {
@@ -51224,7 +51224,7 @@ var useChat = ({
51224
51224
  };
51225
51225
 
51226
51226
  // src/components/Chat/hooks/useCreateChatContext.ts
51227
- var import_react265 = require("react");
51227
+ var import_react264 = require("react");
51228
51228
  var useCreateChatContext = (value) => {
51229
51229
  const {
51230
51230
  channel,
@@ -51249,7 +51249,7 @@ var useCreateChatContext = (value) => {
51249
51249
  const clientValues = `${client.clientID}${Object.keys(client.activeChannels).length}${Object.keys(client.listeners).length}${client.mutedChannels.length}
51250
51250
  ${client.user?.id}`;
51251
51251
  const mutedUsersLength = mutes.length;
51252
- const chatContext = (0, import_react265.useMemo)(
51252
+ const chatContext = (0, import_react264.useMemo)(
51253
51253
  () => ({
51254
51254
  channel,
51255
51255
  channelsQueryState,
@@ -51284,10 +51284,10 @@ var useCreateChatContext = (value) => {
51284
51284
  };
51285
51285
 
51286
51286
  // src/components/Chat/hooks/useChannelsQueryState.ts
51287
- var import_react266 = require("react");
51287
+ var import_react265 = require("react");
51288
51288
  var useChannelsQueryState = () => {
51289
- const [error, setError] = (0, import_react266.useState)(null);
51290
- const [queryInProgress, setQueryInProgress] = (0, import_react266.useState)("uninitialized");
51289
+ const [error, setError] = (0, import_react265.useState)(null);
51290
+ const [queryInProgress, setQueryInProgress] = (0, import_react265.useState)("uninitialized");
51291
51291
  return {
51292
51292
  error,
51293
51293
  queryInProgress,
@@ -51322,7 +51322,7 @@ var Chat = (props) => {
51322
51322
  translators
51323
51323
  } = useChat({ client, defaultLanguage, i18nInstance, initialNavOpen });
51324
51324
  const channelsQueryState = useChannelsQueryState();
51325
- const searchController = (0, import_react267.useMemo)(
51325
+ const searchController = (0, import_react266.useMemo)(
51326
51326
  () => customChannelSearchController ?? new import_stream_chat12.SearchController({
51327
51327
  sources: [
51328
51328
  new import_stream_chat12.ChannelSearchSource(client),
@@ -51350,11 +51350,11 @@ var Chat = (props) => {
51350
51350
  useImageFlagEmojisOnWindows
51351
51351
  });
51352
51352
  if (!translators.t) return null;
51353
- return /* @__PURE__ */ import_react267.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react267.default.createElement(TranslationProvider, { value: translators }, children));
51353
+ return /* @__PURE__ */ import_react266.default.createElement(ChatProvider, { value: chatContextValue }, /* @__PURE__ */ import_react266.default.createElement(TranslationProvider, { value: translators }, children));
51354
51354
  };
51355
51355
 
51356
51356
  // src/components/Chat/hooks/useCreateChatClient.ts
51357
- var import_react268 = require("react");
51357
+ var import_react267 = require("react");
51358
51358
  var import_stream_chat13 = require("stream-chat");
51359
51359
  var useCreateChatClient = ({
51360
51360
  apiKey,
@@ -51362,13 +51362,13 @@ var useCreateChatClient = ({
51362
51362
  tokenOrProvider,
51363
51363
  userData
51364
51364
  }) => {
51365
- const [chatClient, setChatClient] = (0, import_react268.useState)(null);
51366
- const [cachedUserData, setCachedUserData] = (0, import_react268.useState)(userData);
51365
+ const [chatClient, setChatClient] = (0, import_react267.useState)(null);
51366
+ const [cachedUserData, setCachedUserData] = (0, import_react267.useState)(userData);
51367
51367
  if (userData.id !== cachedUserData.id) {
51368
51368
  setCachedUserData(userData);
51369
51369
  }
51370
- const [cachedOptions] = (0, import_react268.useState)(options);
51371
- (0, import_react268.useEffect)(() => {
51370
+ const [cachedOptions] = (0, import_react267.useState)(options);
51371
+ (0, import_react267.useEffect)(() => {
51372
51372
  const client = new import_stream_chat13.StreamChat(apiKey, void 0, cachedOptions);
51373
51373
  let didUserConnectInterrupt = false;
51374
51374
  const connectionPromise = client.connectUser(cachedUserData, tokenOrProvider).then(() => {
@@ -51386,12 +51386,12 @@ var useCreateChatClient = ({
51386
51386
  };
51387
51387
 
51388
51388
  // src/components/Window/Window.tsx
51389
- var import_react269 = __toESM(require("react"));
51389
+ var import_react268 = __toESM(require("react"));
51390
51390
  var import_clsx67 = __toESM(require("clsx"));
51391
51391
  var UnMemoizedWindow = (props) => {
51392
51392
  const { children, thread: propThread } = props;
51393
51393
  const { thread: contextThread } = useChannelStateContext("Window");
51394
- return /* @__PURE__ */ import_react269.default.createElement(
51394
+ return /* @__PURE__ */ import_react268.default.createElement(
51395
51395
  "div",
51396
51396
  {
51397
51397
  className: (0, import_clsx67.default)("str-chat__main-panel", {
@@ -51401,7 +51401,7 @@ var UnMemoizedWindow = (props) => {
51401
51401
  children
51402
51402
  );
51403
51403
  };
51404
- var Window = import_react269.default.memo(UnMemoizedWindow);
51404
+ var Window = import_react268.default.memo(UnMemoizedWindow);
51405
51405
  /*! Bundled license information:
51406
51406
 
51407
51407
  is-buffer/index.js: