stream-chat-react 10.4.2 → 10.4.3

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.
Files changed (29) hide show
  1. package/dist/browser.full-bundle.js +27 -18
  2. package/dist/browser.full-bundle.js.map +1 -1
  3. package/dist/browser.full-bundle.min.js +2 -2
  4. package/dist/browser.full-bundle.min.js.map +1 -1
  5. package/dist/components/Chat/Chat.d.ts.map +1 -1
  6. package/dist/components/Chat/Chat.js +6 -3
  7. package/dist/components/InfiniteScrollPaginator/InfiniteScroll.d.ts +0 -1
  8. package/dist/components/InfiniteScrollPaginator/InfiniteScroll.d.ts.map +1 -1
  9. package/dist/components/InfiniteScrollPaginator/InfiniteScroll.js +9 -7
  10. package/dist/components/MessageList/MessageList.d.ts +5 -1
  11. package/dist/components/MessageList/MessageList.d.ts.map +1 -1
  12. package/dist/components/MessageList/MessageList.js +4 -2
  13. package/dist/components/MessageList/hooks/useMessageListScrollManager.d.ts +1 -0
  14. package/dist/components/MessageList/hooks/useMessageListScrollManager.d.ts.map +1 -1
  15. package/dist/components/MessageList/hooks/useMessageListScrollManager.js +6 -5
  16. package/dist/components/MessageList/hooks/useScrollLocationLogic.d.ts +1 -1
  17. package/dist/components/MessageList/hooks/useScrollLocationLogic.d.ts.map +1 -1
  18. package/dist/components/MessageList/hooks/useScrollLocationLogic.js +2 -1
  19. package/dist/css/index.css +1 -1
  20. package/dist/index.cjs.js +26 -17
  21. package/dist/index.cjs.js.map +1 -1
  22. package/dist/scss/Card.scss +1 -1
  23. package/dist/scss/ChannelHeader.scss +1 -1
  24. package/dist/scss/MessageInput.scss +1 -1
  25. package/dist/scss/TypingIndicator.scss +1 -1
  26. package/dist/scss/_variables.scss +1 -1
  27. package/dist/version.d.ts +1 -1
  28. package/dist/version.js +1 -1
  29. package/package.json +5 -5
@@ -1 +1 @@
1
- {"version":3,"file":"Chat.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/Chat.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,YAAY,EAAkC,MAAM,yBAAyB,CAAC;AAEvF,OAAO,EAAgB,aAAa,EAAgB,MAAM,2BAA2B,CAAC;AACtF,OAAO,EAAE,qBAAqB,EAAuB,MAAM,kCAAkC,CAAC;AAE9F,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE;;GAEG;AACH,oBAAY,KAAK,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IACvC,eAAe,GACf,gBAAgB,GAChB,iBAAiB,GACjB,kBAAkB,GAClB,gBAAgB,GAChB,iBAAiB,GACjB,WAAW,GACX,YAAY,GACZ,CAAC,CAAC;AAEN,oBAAY,SAAS,CACnB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,mCAAmC;IACnC,MAAM,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACvC,8FAA8F;IAC9F,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;;OAGG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oGAAoG;IACpG,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC,8BAA8B;IAC9B,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B,0CAA0C;IAC1C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,IAAI,yKA6DhB,CAAC"}
1
+ {"version":3,"file":"Chat.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/Chat.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAKjD,OAAO,EAAE,YAAY,EAAkC,MAAM,yBAAyB,CAAC;AAEvF,OAAO,EAAgB,aAAa,EAAgB,MAAM,2BAA2B,CAAC;AACtF,OAAO,EAAE,qBAAqB,EAAuB,MAAM,kCAAkC,CAAC;AAE9F,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE9C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAEnE;;GAEG;AACH,oBAAY,KAAK,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IACvC,eAAe,GACf,gBAAgB,GAChB,iBAAiB,GACjB,kBAAkB,GAClB,gBAAgB,GAChB,iBAAiB,GACjB,WAAW,GACX,YAAY,GACZ,CAAC,CAAC;AAEN,oBAAY,SAAS,CACnB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,mCAAmC;IACnC,MAAM,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACvC,8FAA8F;IAC9F,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;;OAGG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oGAAoG;IACpG,eAAe,CAAC,EAAE,qBAAqB,CAAC;IACxC,8BAA8B;IAC9B,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B,0CAA0C;IAC1C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,2BAA2B,CAAC,EAAE,OAAO,CAAC;CACvC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,IAAI,yKAiEhB,CAAC"}
@@ -13,9 +13,12 @@ export var Chat = function (props) {
13
13
  var children = props.children, client = props.client, customClasses = props.customClasses, customStyles = props.customStyles, _a = props.darkMode, darkMode = _a === void 0 ? false : _a, defaultLanguage = props.defaultLanguage, i18nInstance = props.i18nInstance, _b = props.initialNavOpen, initialNavOpen = _b === void 0 ? true : _b, _c = props.theme, theme = _c === void 0 ? 'messaging light' : _c, _d = props.useImageFlagEmojisOnWindows, useImageFlagEmojisOnWindows = _d === void 0 ? false : _d;
14
14
  var _e = useChat({ client: client, defaultLanguage: defaultLanguage, i18nInstance: i18nInstance, initialNavOpen: initialNavOpen }), channel = _e.channel, closeMobileNav = _e.closeMobileNav, getAppSettings = _e.getAppSettings, latestMessageDatesByChannels = _e.latestMessageDatesByChannels, mutes = _e.mutes, navOpen = _e.navOpen, openMobileNav = _e.openMobileNav, setActiveChannel = _e.setActiveChannel, translators = _e.translators;
15
15
  var channelsQueryState = useChannelsQueryState();
16
- var themeVersion = (getComputedStyle(document.documentElement)
17
- .getPropertyValue('--str-chat__theme-version')
18
- .replace(' ', '') || '1');
16
+ var themeVersion = typeof window !== 'undefined'
17
+ ? (window
18
+ .getComputedStyle(document.documentElement)
19
+ .getPropertyValue('--str-chat__theme-version')
20
+ .replace(' ', '') || '1')
21
+ : '1';
19
22
  useCustomStyles(darkMode ? darkModeTheme : customStyles);
20
23
  var chatContextValue = useCreateChatContext({
21
24
  channel: channel,
@@ -29,7 +29,6 @@ export declare type InfiniteScrollProps = PaginatorProps & {
29
29
  * @deprecated Use loadNextPage prop instead. Planned for removal: https://github.com/GetStream/stream-chat-react/issues/1804
30
30
  */
31
31
  loadMoreNewer?: () => void;
32
- pageStart?: number;
33
32
  useCapture?: boolean;
34
33
  };
35
34
  export declare const InfiniteScroll: (props: PropsWithChildren<InfiniteScrollProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
@@ -1 +1 @@
1
- {"version":3,"file":"InfiniteScroll.d.ts","sourceRoot":"","sources":["../../../src/components/InfiniteScrollPaginator/InfiniteScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAkC,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAaxD,oBAAY,mBAAmB,GAAG,cAAc,GAAG;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,mHAAmH;IACnH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACpF,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,cAAc,UAAW,kBAAkB,mBAAmB,CAAC,uEAuH3E,CAAC"}
1
+ {"version":3,"file":"InfiniteScroll.d.ts","sourceRoot":"","sources":["../../../src/components/InfiniteScrollPaginator/InfiniteScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAmD,MAAM,OAAO,CAAC;AAClG,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAaxD,oBAAY,mBAAmB,GAAG,cAAc,GAAG;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,mHAAmH;IACnH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACpF,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,cAAc,UAAW,kBAAkB,mBAAmB,CAAC,uEAwH3E,CAAC"}
@@ -20,7 +20,7 @@ var __rest = (this && this.__rest) || function (s, e) {
20
20
  }
21
21
  return t;
22
22
  };
23
- import React, { useCallback, useEffect, useRef } from 'react';
23
+ import React, { useCallback, useEffect, useLayoutEffect, useRef } from 'react';
24
24
  import { deprecationAndReplacementWarning } from '../../utils/deprecationWarning';
25
25
  /**
26
26
  * Prevents Chrome hangups
@@ -50,6 +50,8 @@ export var InfiniteScroll = function (props) {
50
50
  if (listenToScroll) {
51
51
  listenToScroll(offset, reverseOffset, threshold);
52
52
  }
53
+ if (isLoading)
54
+ return;
53
55
  if (reverseOffset < Number(threshold) &&
54
56
  typeof loadPreviousPageFn === 'function' &&
55
57
  hasPreviousPageFlag) {
@@ -61,10 +63,11 @@ export var InfiniteScroll = function (props) {
61
63
  }, [
62
64
  hasPreviousPageFlag,
63
65
  hasNextPageFlag,
64
- threshold,
66
+ isLoading,
65
67
  listenToScroll,
66
68
  loadPreviousPageFn,
67
69
  loadNextPageFn,
70
+ threshold,
68
71
  ]);
69
72
  useEffect(function () {
70
73
  deprecationAndReplacementWarning([
@@ -74,19 +77,18 @@ export var InfiniteScroll = function (props) {
74
77
  [{ loadMore: loadMore }, { loadPreviousPage: loadPreviousPage }],
75
78
  ], 'InfiniteScroll');
76
79
  }, []);
77
- useEffect(function () {
80
+ useLayoutEffect(function () {
78
81
  var _a;
79
82
  var scrollElement = (_a = scrollComponent.current) === null || _a === void 0 ? void 0 : _a.parentNode;
80
- if (isLoading || !scrollElement) {
81
- return function () { return undefined; };
82
- }
83
+ if (!scrollElement)
84
+ return;
83
85
  scrollElement.addEventListener('scroll', scrollListener, useCapture);
84
86
  scrollElement.addEventListener('resize', scrollListener, useCapture);
85
87
  return function () {
86
88
  scrollElement.removeEventListener('scroll', scrollListener, useCapture);
87
89
  scrollElement.removeEventListener('resize', scrollListener, useCapture);
88
90
  };
89
- }, [initialLoad, isLoading, scrollListener, useCapture]);
91
+ }, [initialLoad, scrollListener, useCapture]);
90
92
  useEffect(function () {
91
93
  var _a;
92
94
  var scrollElement = (_a = scrollComponent.current) === null || _a === void 0 ? void 0 : _a.parentNode;
@@ -41,7 +41,11 @@ export declare type MessageListProps<StreamChatGenerics extends DefaultStreamCha
41
41
  noGroupByUser?: boolean;
42
42
  /** If true, `readBy` data supplied to the `Message` components will include all user read states per sent message */
43
43
  returnAllReadData?: boolean;
44
- /** The pixel threshold to determine whether or not the user is scrolled up in the list, defaults to 200px */
44
+ /**
45
+ * The pixel threshold under which the message list is considered to be so near to the bottom,
46
+ * so that if a new message is delivered, the list will be scrolled to the absolute bottom.
47
+ * Defaults to 200px
48
+ */
45
49
  scrolledUpThreshold?: number;
46
50
  /** If true, indicates the message list is a thread */
47
51
  threadList?: boolean;
@@ -1 +1 @@
1
- {"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/MessageList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,EACL,yBAAyB,EAE1B,MAAM,oCAAoC,CAAC;AAQ5C,OAAO,EAAkB,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAMhG,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAErD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAEvE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAqMnE,aAAK,qBAAqB,GACtB,6BAA6B,GAC7B,8BAA8B,GAC9B,sBAAsB,GACtB,uBAAuB,GACvB,YAAY,GACZ,mCAAmC,GACnC,iCAAiC,GACjC,mCAAmC,GACnC,8BAA8B,GAC9B,gCAAgC,GAChC,gCAAgC,GAChC,SAAS,GACT,gBAAgB,GAChB,mBAAmB,GACnB,iBAAiB,GACjB,iBAAiB,GACjB,aAAa,GACb,aAAa,GACb,YAAY,GACZ,gBAAgB,GAChB,YAAY,GACZ,kBAAkB,GAClB,YAAY,CAAC;AAEjB,oBAAY,gBAAgB,CAC1B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,EAAE,qBAAqB,CAAC,CAAC,GAAG;IAC3E,8FAA8F;IAC9F,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,6DAA6D;IAC7D,WAAW,CAAC,EAAE,CACZ,OAAO,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAC1C,eAAe,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAClD,WAAW,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAC9C,aAAa,EAAE,OAAO,KACnB,UAAU,CAAC;IAChB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iIAAiI;IACjI,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,yCAAyC;IACzC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,6EAA6E;IAC7E,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,qIAAqI;IACrI,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,mLAAmL;IACnL,2BAA2B,CAAC,EAAE,mBAAmB,CAAC;IAClD,iHAAiH;IACjH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1C,8DAA8D;IAC9D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,+DAA+D;IAC/D,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,4LAA4L;IAC5L,QAAQ,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;IACzE,6LAA6L;IAC7L,aAAa,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;IACnF,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yKAAyK;IACzK,QAAQ,CAAC,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC/C,qDAAqD;IACrD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qHAAqH;IACrH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,6GAA6G;IAC7G,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,uDAAuD;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,gJA2BvB,CAAC"}
1
+ {"version":3,"file":"MessageList.d.ts","sourceRoot":"","sources":["../../../src/components/MessageList/MessageList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,OAAO,EACL,yBAAyB,EAE1B,MAAM,oCAAoC,CAAC;AAQ5C,OAAO,EAAkB,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAMhG,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAErD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAEvE,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AA0MnE,aAAK,qBAAqB,GACtB,6BAA6B,GAC7B,8BAA8B,GAC9B,sBAAsB,GACtB,uBAAuB,GACvB,YAAY,GACZ,mCAAmC,GACnC,iCAAiC,GACjC,mCAAmC,GACnC,8BAA8B,GAC9B,gCAAgC,GAChC,gCAAgC,GAChC,SAAS,GACT,gBAAgB,GAChB,mBAAmB,GACnB,iBAAiB,GACjB,iBAAiB,GACjB,aAAa,GACb,aAAa,GACb,YAAY,GACZ,gBAAgB,GAChB,YAAY,GACZ,kBAAkB,GAClB,YAAY,CAAC;AAEjB,oBAAY,gBAAgB,CAC1B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,OAAO,CAAC,IAAI,CAAC,YAAY,CAAC,kBAAkB,CAAC,EAAE,qBAAqB,CAAC,CAAC,GAAG;IAC3E,8FAA8F;IAC9F,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,6DAA6D;IAC7D,WAAW,CAAC,EAAE,CACZ,OAAO,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAC1C,eAAe,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAClD,WAAW,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAC9C,aAAa,EAAE,OAAO,KACnB,UAAU,CAAC;IAChB,8CAA8C;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,iIAAiI;IACjI,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,yCAAyC;IACzC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,6EAA6E;IAC7E,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,qIAAqI;IACrI,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,mLAAmL;IACnL,2BAA2B,CAAC,EAAE,mBAAmB,CAAC;IAClD,iHAAiH;IACjH,mBAAmB,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1C,8DAA8D;IAC9D,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,+DAA+D;IAC/D,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,4LAA4L;IAC5L,QAAQ,CAAC,EAAE,yBAAyB,CAAC,UAAU,CAAC,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;IACzE,6LAA6L;IAC7L,aAAa,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,GAAG,CAAC,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;IACnF,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yKAAyK;IACzK,QAAQ,CAAC,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC/C,qDAAqD;IACrD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qHAAqH;IACrH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,uDAAuD;IACvD,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,gJA2BvB,CAAC"}
@@ -73,16 +73,18 @@ import { defaultPinPermissions, MESSAGE_ACTIONS } from '../Message/utils';
73
73
  import { TypingIndicator as DefaultTypingIndicator } from '../TypingIndicator';
74
74
  import { MessageListMainPanel } from './MessageListMainPanel';
75
75
  var MessageListWithContext = function (props) {
76
- var channel = props.channel, _a = props.disableDateSeparator, disableDateSeparator = _a === void 0 ? false : _a, groupStyles = props.groupStyles, _b = props.hideDeletedMessages, hideDeletedMessages = _b === void 0 ? false : _b, _c = props.hideNewMessageSeparator, hideNewMessageSeparator = _c === void 0 ? false : _c, _d = props.messageActions, messageActions = _d === void 0 ? Object.keys(MESSAGE_ACTIONS) : _d, _e = props.messages, messages = _e === void 0 ? [] : _e, notifications = props.notifications, _f = props.noGroupByUser, noGroupByUser = _f === void 0 ? false : _f, _g = props.pinPermissions, pinPermissions = _g === void 0 ? defaultPinPermissions : _g, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
76
+ var channel = props.channel, _a = props.disableDateSeparator, disableDateSeparator = _a === void 0 ? false : _a, groupStyles = props.groupStyles, _b = props.hideDeletedMessages, hideDeletedMessages = _b === void 0 ? false : _b, _c = props.hideNewMessageSeparator, hideNewMessageSeparator = _c === void 0 ? false : _c, internalInfiniteScrollProps = props.internalInfiniteScrollProps, _d = props.messageActions, messageActions = _d === void 0 ? Object.keys(MESSAGE_ACTIONS) : _d, _e = props.messages, messages = _e === void 0 ? [] : _e, notifications = props.notifications, _f = props.noGroupByUser, noGroupByUser = _f === void 0 ? false : _f, _g = props.pinPermissions, pinPermissions = _g === void 0 ? defaultPinPermissions : _g, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
77
77
  _h = props.returnAllReadData, // @deprecated in favor of `channelCapabilities` - TODO: remove in next major release
78
78
  returnAllReadData = _h === void 0 ? false : _h, _j = props.threadList, threadList = _j === void 0 ? false : _j, _k = props.unsafeHTML, unsafeHTML = _k === void 0 ? false : _k, headerPosition = props.headerPosition, read = props.read, _l = props.messageLimit, messageLimit = _l === void 0 ? 100 : _l, loadMoreCallback = props.loadMore, loadMoreNewerCallback = props.loadMoreNewer, _m = props.hasMoreNewer, hasMoreNewer = _m === void 0 ? false : _m, suppressAutoscroll = props.suppressAutoscroll, highlightedMessageId = props.highlightedMessageId, _o = props.jumpToLatestMessage, jumpToLatestMessage = _o === void 0 ? function () { return Promise.resolve(); } : _o;
79
79
  var _p = React.useState(null), listElement = _p[0], setListElement = _p[1];
80
80
  var _q = React.useState(null), ulElement = _q[0], setUlElement = _q[1];
81
81
  var customClasses = useChatContext('MessageList').customClasses;
82
82
  var _r = useComponentContext('MessageList'), _s = _r.EmptyStateIndicator, EmptyStateIndicator = _s === void 0 ? DefaultEmptyStateIndicator : _s, _t = _r.LoadingIndicator, LoadingIndicator = _t === void 0 ? DefaultLoadingIndicator : _t, _u = _r.MessageListNotifications, MessageListNotifications = _u === void 0 ? DefaultMessageListNotifications : _u, _v = _r.MessageNotification, MessageNotification = _v === void 0 ? DefaultMessageNotification : _v, _w = _r.TypingIndicator, TypingIndicator = _w === void 0 ? DefaultTypingIndicator : _w;
83
+ var loadMoreScrollThreshold = (internalInfiniteScrollProps === null || internalInfiniteScrollProps === void 0 ? void 0 : internalInfiniteScrollProps.threshold) || 250;
83
84
  var _x = useScrollLocationLogic({
84
85
  hasMoreNewer: hasMoreNewer,
85
86
  listElement: listElement,
87
+ loadMoreScrollThreshold: loadMoreScrollThreshold,
86
88
  messages: messages,
87
89
  scrolledUpThreshold: props.scrolledUpThreshold,
88
90
  suppressAutoscroll: suppressAutoscroll,
@@ -169,7 +171,7 @@ var MessageListWithContext = function (props) {
169
171
  var showEmptyStateIndicator = elements.length === 0 && !threadList;
170
172
  return (React.createElement(React.Fragment, null,
171
173
  React.createElement(MessageListMainPanel, null,
172
- React.createElement("div", { className: "".concat(messageListClass, " ").concat(threadListClass), onScroll: onScroll, ref: setListElement, tabIndex: 0 }, showEmptyStateIndicator ? (React.createElement(EmptyStateIndicator, { key: 'empty-state-indicator', listType: threadList ? 'thread' : 'message' })) : (React.createElement(InfiniteScroll, __assign({ className: 'str-chat__reverse-infinite-scroll str-chat__message-list-scroll', "data-testid": 'reverse-infinite-scroll', hasNextPage: props.hasMoreNewer, hasPreviousPage: props.hasMore, head: props.head, isLoading: props.loadingMore, loader: React.createElement("div", { className: 'str-chat__list__loading', key: 'loading-indicator' }, props.loadingMore && React.createElement(LoadingIndicator, { size: 20 })), loadNextPage: loadMoreNewer, loadPreviousPage: loadMore }, props.internalInfiniteScrollProps),
174
+ React.createElement("div", { className: "".concat(messageListClass, " ").concat(threadListClass), onScroll: onScroll, ref: setListElement, tabIndex: 0 }, showEmptyStateIndicator ? (React.createElement(EmptyStateIndicator, { key: 'empty-state-indicator', listType: threadList ? 'thread' : 'message' })) : (React.createElement(InfiniteScroll, __assign({ className: 'str-chat__reverse-infinite-scroll str-chat__message-list-scroll', "data-testid": 'reverse-infinite-scroll', hasNextPage: props.hasMoreNewer, hasPreviousPage: props.hasMore, head: props.head, isLoading: props.loadingMore, loader: React.createElement("div", { className: 'str-chat__list__loading', key: 'loading-indicator' }, props.loadingMore && React.createElement(LoadingIndicator, { size: 20 })), loadNextPage: loadMoreNewer, loadPreviousPage: loadMore }, props.internalInfiniteScrollProps, { threshold: loadMoreScrollThreshold }),
173
175
  React.createElement("ul", { className: 'str-chat__ul', ref: setUlElement }, elements),
174
176
  React.createElement(TypingIndicator, { threadList: threadList }),
175
177
  React.createElement("div", { key: 'bottom' }))))),
@@ -5,6 +5,7 @@ export declare type ContainerMeasures = {
5
5
  scrollHeight: number;
6
6
  };
7
7
  export declare type UseMessageListScrollManagerParams<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
8
+ loadMoreScrollThreshold: number;
8
9
  messages: StreamMessage<StreamChatGenerics>[];
9
10
  onScrollBy: (scrollBy: number) => void;
10
11
  scrollContainerMeasures: () => ContainerMeasures;
@@ -1 +1 @@
1
- {"version":3,"file":"useMessageListScrollManager.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageList/hooks/useMessageListScrollManager.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAE1E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEtE,oBAAY,iBAAiB,GAAG;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,oBAAY,iCAAiC,CAC3C,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,QAAQ,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC9C,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;IACjD,mBAAmB,EAAE,MAAM,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAEF,wBAAgB,2BAA2B,CACzC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAChF,MAAM,EAAE,iCAAiC,CAAC,kBAAkB,CAAC,oBAkErC,MAAM,UAG/B"}
1
+ {"version":3,"file":"useMessageListScrollManager.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageList/hooks/useMessageListScrollManager.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAE1E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEtE,oBAAY,iBAAiB,GAAG;IAC9B,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,oBAAY,iCAAiC,CAC3C,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,uBAAuB,EAAE,MAAM,CAAC;IAChC,QAAQ,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC9C,UAAU,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;IACjD,mBAAmB,EAAE,MAAM,CAAC;IAC5B,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAGF,wBAAgB,2BAA2B,CACzC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,EAChF,MAAM,EAAE,iCAAiC,CAAC,kBAAkB,CAAC,oBAmErC,MAAM,UAG/B"}
@@ -1,7 +1,8 @@
1
- import { useEffect, useRef } from 'react';
1
+ import { useLayoutEffect, useRef } from 'react';
2
2
  import { useChatContext } from '../../../context/ChatContext';
3
+ // FIXME: change this generic name to something like useAdjustScrollPositionToListSize
3
4
  export function useMessageListScrollManager(params) {
4
- var onScrollBy = params.onScrollBy, scrollContainerMeasures = params.scrollContainerMeasures, scrolledUpThreshold = params.scrolledUpThreshold, scrollToBottom = params.scrollToBottom, showNewMessages = params.showNewMessages;
5
+ var loadMoreScrollThreshold = params.loadMoreScrollThreshold, onScrollBy = params.onScrollBy, scrollContainerMeasures = params.scrollContainerMeasures, scrolledUpThreshold = params.scrolledUpThreshold, scrollToBottom = params.scrollToBottom, showNewMessages = params.showNewMessages;
5
6
  var client = useChatContext('useMessageListScrollManager').client;
6
7
  var measures = useRef({
7
8
  offsetHeight: 0,
@@ -9,7 +10,7 @@ export function useMessageListScrollManager(params) {
9
10
  });
10
11
  var messages = useRef();
11
12
  var scrollTop = useRef(0);
12
- useEffect(function () {
13
+ useLayoutEffect(function () {
13
14
  var _a, _b, _c;
14
15
  var prevMeasures = measures.current;
15
16
  var prevMessages = messages.current;
@@ -23,8 +24,8 @@ export function useMessageListScrollManager(params) {
23
24
  if (prevMessages.length < newMessages.length) {
24
25
  // messages added to the top
25
26
  if ((lastPrevMessage === null || lastPrevMessage === void 0 ? void 0 : lastPrevMessage.id) === lastNewMessage.id) {
26
- var listHeightDelta = newMeasures.scrollHeight - prevMeasures.scrollHeight;
27
- if (scrollTop.current === 0) {
27
+ if (scrollTop.current < loadMoreScrollThreshold) {
28
+ var listHeightDelta = newMeasures.scrollHeight - prevMeasures.scrollHeight;
28
29
  onScrollBy(listHeightDelta);
29
30
  }
30
31
  }
@@ -4,8 +4,8 @@ import type { DefaultStreamChatGenerics } from '../../../types/types';
4
4
  export declare type UseScrollLocationLogicParams<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
5
5
  hasMoreNewer: boolean;
6
6
  listElement: HTMLDivElement | null;
7
+ loadMoreScrollThreshold: number;
7
8
  suppressAutoscroll: boolean;
8
- currentUserId?: string;
9
9
  messages?: StreamMessage<StreamChatGenerics>[];
10
10
  scrolledUpThreshold?: number;
11
11
  };
@@ -1 +1 @@
1
- {"version":3,"file":"useScrollLocationLogic.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageList/hooks/useScrollLocationLogic.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAI9E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAE1E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEtE,oBAAY,4BAA4B,CACtC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC/C,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;sBAwDvB,aAAa,CAAC,cAAc,CAAC;;;CAgCxC,CAAC"}
1
+ {"version":3,"file":"useScrollLocationLogic.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageList/hooks/useScrollLocationLogic.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAI9E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAE1E,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAEtE,oBAAY,4BAA4B,CACtC,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,YAAY,EAAE,OAAO,CAAC;IACtB,WAAW,EAAE,cAAc,GAAG,IAAI,CAAC;IACnC,uBAAuB,EAAE,MAAM,CAAC;IAChC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,EAAE,aAAa,CAAC,kBAAkB,CAAC,EAAE,CAAC;IAC/C,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;sBA0DvB,aAAa,CAAC,cAAc,CAAC;;;CAgCxC,CAAC"}
@@ -1,7 +1,7 @@
1
1
  import { useCallback, useLayoutEffect, useRef, useState } from 'react';
2
2
  import { useMessageListScrollManager } from './useMessageListScrollManager';
3
3
  export var useScrollLocationLogic = function (params) {
4
- var _a = params.messages, messages = _a === void 0 ? [] : _a, _b = params.scrolledUpThreshold, scrolledUpThreshold = _b === void 0 ? 200 : _b, hasMoreNewer = params.hasMoreNewer, suppressAutoscroll = params.suppressAutoscroll, listElement = params.listElement;
4
+ var loadMoreScrollThreshold = params.loadMoreScrollThreshold, _a = params.messages, messages = _a === void 0 ? [] : _a, _b = params.scrolledUpThreshold, scrolledUpThreshold = _b === void 0 ? 200 : _b, hasMoreNewer = params.hasMoreNewer, suppressAutoscroll = params.suppressAutoscroll, listElement = params.listElement;
5
5
  var _c = useState(false), hasNewMessages = _c[0], setHasNewMessages = _c[1];
6
6
  var _d = useState(), wrapperRect = _d[0], setWrapperRect = _d[1];
7
7
  var _e = useState(true), isMessageListScrolledToBottom = _e[0], setIsMessageListScrolledToBottom = _e[1];
@@ -25,6 +25,7 @@ export var useScrollLocationLogic = function (params) {
25
25
  }
26
26
  }, [listElement, hasMoreNewer]);
27
27
  var updateScrollTop = useMessageListScrollManager({
28
+ loadMoreScrollThreshold: loadMoreScrollThreshold,
28
29
  messages: messages,
29
30
  onScrollBy: function (scrollBy) {
30
31
  listElement === null || listElement === void 0 ? void 0 : listElement.scrollBy({ top: scrollBy });