stream-chat-react 6.13.0 → 8.1.0

package/dist/stories/jump-to-message.stories.js

@@ -0,0 +1,111 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import React, { useEffect, useState } from 'react';
+import { StreamChat } from 'stream-chat';
+import { Channel, Chat, MessageList, useChannelActionContext, VirtualizedMessageList, Window, } from '../index';
+import '@stream-io/stream-chat-css/dist/css/index.css';
+void MessageList;
+void VirtualizedMessageList;
+var apiKey = import.meta.env.E2E_APP_KEY;
+var userId = import.meta.env.E2E_TEST_USER_1;
+var userToken = import.meta.env.E2E_TEST_USER_1_TOKEN;
+var channelId = import.meta.env.E2E_JUMP_TO_MESSAGE_CHANNEL;
+var chatClient = StreamChat.getInstance(apiKey);
+chatClient.connectUser({ id: userId }, userToken);
+var JumpToMessage = function () {
+    var jumpToMessage = useChannelActionContext().jumpToMessage;
+    return (React.createElement("button", { "data-testid": 'jump-to-message', onClick: function () { return __awaiter(void 0, void 0, void 0, function () {
+            var results;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, chatClient.search({
+                            id: { $eq: channelId },
+                        }, 'Message 29', { limit: 1, offset: 0 })];
+                    case 1:
+                        results = _a.sent();
+                        jumpToMessage(results.results[0].message.id);
+                        return [2 /*return*/];
+                }
+            });
+        }); } }, "Jump to message '29'"));
+};
+var StyleFix = function () { return (React.createElement("style", null, "\n    .str-chat {\n      height: 700px\n    }\n  ")); };
+var useTheJumpChannel = function () {
+    var _a = useState(null), channel = _a[0], setChannel = _a[1];
+    useEffect(function () {
+        (function () { return __awaiter(void 0, void 0, void 0, function () {
+            var channels;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
+                    case 0: return [4 /*yield*/, chatClient.queryChannels({ id: { $eq: channelId } })];
+                    case 1:
+                        channels = _a.sent();
+                        setChannel(channels[0]);
+                        return [2 /*return*/];
+                }
+            });
+        }); })();
+    }, []);
+    return channel;
+};
+export var JumpInRegularMessageList = function () {
+    var channel = useTheJumpChannel();
+    if (!channel) {
+        return null;
+    }
+    return (React.createElement("div", null,
+        React.createElement(StyleFix, null),
+        React.createElement(Chat, { client: chatClient },
+            React.createElement(Channel, { channel: channel },
+                React.createElement(JumpToMessage, null),
+                React.createElement(Window, null,
+                    React.createElement(MessageList, null))))));
+};
+export var JumpInVirtualizedMessageList = function () {
+    var channel = useTheJumpChannel();
+    if (!channel) {
+        return null;
+    }
+    return (React.createElement("div", null,
+        React.createElement(StyleFix, null),
+        React.createElement(Chat, { client: chatClient },
+            React.createElement(Channel, { channel: channel },
+                React.createElement(JumpToMessage, null),
+                React.createElement(Window, null,
+                    React.createElement(VirtualizedMessageList, null))))));
+};

package/dist/stories/utils.d.ts

@@ -0,0 +1,19 @@
+export declare const apiKey: string;
+declare type LocalAttachmentType = Record<string, unknown>;
+declare type LocalChannelType = Record<string, unknown>;
+declare type LocalCommandType = string;
+declare type LocalEventType = Record<string, unknown>;
+declare type LocalMessageType = Record<string, unknown>;
+declare type LocalReactionType = Record<string, unknown>;
+declare type LocalUserType = Record<string, unknown>;
+export declare type StreamChatGenerics = {
+    attachmentType: LocalAttachmentType;
+    channelType: LocalChannelType;
+    commandType: LocalCommandType;
+    eventType: LocalEventType;
+    messageType: LocalMessageType;
+    reactionType: LocalReactionType;
+    userType: LocalUserType;
+};
+export {};
+//# sourceMappingURL=utils.d.ts.map

package/dist/stories/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/stories/utils.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,MAAM,QAAS,CAAC;AAE7B,aAAK,mBAAmB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AACnD,aAAK,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAChD,aAAK,gBAAgB,GAAG,MAAM,CAAC;AAC/B,aAAK,cAAc,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAC9C,aAAK,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAChD,aAAK,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AACjD,aAAK,aAAa,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAE7C,oBAAY,kBAAkB,GAAG;IAC/B,cAAc,EAAE,mBAAmB,CAAC;IACpC,WAAW,EAAE,gBAAgB,CAAC;IAC9B,WAAW,EAAE,gBAAgB,CAAC;IAC9B,SAAS,EAAE,cAAc,CAAC;IAC1B,WAAW,EAAE,gBAAgB,CAAC;IAC9B,YAAY,EAAE,iBAAiB,CAAC;IAChC,QAAQ,EAAE,aAAa,CAAC;CACzB,CAAC"}

package/dist/stories/utils.js

@@ -0,0 +1,5 @@
+var appKey = import.meta.env.E2E_APP_KEY;
+if (!appKey || typeof appKey !== 'string') {
+    throw new Error('expected APP_KEY');
+}
+export var apiKey = appKey;

package/dist/types/types.d.ts

@@ -1,4 +1,5 @@
-import type { Event, LiteralStringForUnion, Mute } from 'stream-chat';
+import type { LoadingIndicatorProps } from '../components/Loading/LoadingIndicator';
+import type { Event, ExtendableGenerics, LiteralStringForUnion, Mute } from 'stream-chat';
 export declare type UnknownType = Record<string, unknown>;
 export declare type CustomTrigger = {
     [key: string]: {
@@ -14,7 +15,6 @@ export declare type DefaultAttachmentType = UnknownType & {
         image_url?: string;
         thumb_url?: string;
     }>;
-    mime_type?: string;
 };
 export declare type DefaultChannelType = UnknownType & {
     frozen?: boolean;
@@ -22,21 +22,42 @@ export declare type DefaultChannelType = UnknownType & {
     member_count?: number;
     subtitle?: string;
 };
-export declare type DefaultCommandType = LiteralStringForUnion;
-export declare type DefaultEventType = UnknownType;
-export declare type DefaultMessageType = UnknownType & {
+export declare type DefaultStreamChatGenerics = ExtendableGenerics & {
+    attachmentType: DefaultAttachmentType;
+    channelType: DefaultChannelType;
+    commandType: LiteralStringForUnion;
+    eventType: UnknownType;
+    messageType: DefaultMessageType;
+    reactionType: UnknownType;
+    userType: DefaultUserType;
+};
+export declare type DefaultMessageType<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = UnknownType & {
     customType?: 'channel.intro' | 'message.date';
     date?: string | Date;
     errorStatusCode?: number;
-    event?: Event<DefaultAttachmentType, DefaultChannelType, DefaultCommandType, DefaultEventType, DefaultMessageType, DefaultReactionType, DefaultUserType>;
+    event?: Event<StreamChatGenerics>;
     unread?: boolean;
 };
-export declare type DefaultReactionType = UnknownType;
 export declare type DefaultUserTypeInternal = {
     image?: string;
     status?: string;
 };
-export declare type DefaultUserType<UserType extends DefaultUserTypeInternal = DefaultUserTypeInternal> = UnknownType & DefaultUserTypeInternal & {
-    mutes?: Array<Mute<UserType>>;
+export declare type DefaultUserType<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = UnknownType & DefaultUserTypeInternal & {
+    mutes?: Array<Mute<StreamChatGenerics>>;
+};
+export declare type GiphyVersions = 'original' | 'fixed_height' | 'fixed_height_still' | 'fixed_height_downsampled' | 'fixed_width' | 'fixed_width_still' | 'fixed_width_downsampled';
+export declare type PaginatorProps = {
+    /** callback to load the next page */
+    loadNextPage: () => void;
+    /** indicates if there is a next page to load */
+    hasNextPage?: boolean;
+    /** The loading indicator to use */
+    LoadingIndicator?: React.ComponentType<LoadingIndicatorProps>;
+    /** indicates if there there's currently any refreshing taking place */
+    refreshing?: boolean;
+    /** display the items in opposite order */
+    reverse?: boolean;
+    /** Offset from when to start the loadNextPage call */
+    threshold?: number;
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/types/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,qBAAqB,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEtE,oBAAY,WAAW,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAElD,oBAAY,aAAa,GAAG;IAC1B,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,cAAc,EAAE,WAAW,CAAC;QAC5B,IAAI,EAAE,WAAW,CAAC;KACnB,CAAC;CACH,CAAC;AAEF,oBAAY,qBAAqB,GAAG,WAAW,GAAG;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,KAAK,CAAC;QACb,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC,CAAC;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,oBAAY,kBAAkB,GAAG,WAAW,GAAG;IAC7C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,oBAAY,kBAAkB,GAAG,qBAAqB,CAAC;AAEvD,oBAAY,gBAAgB,GAAG,WAAW,CAAC;AAE3C,oBAAY,kBAAkB,GAAG,WAAW,GAAG;IAC7C,UAAU,CAAC,EAAE,eAAe,GAAG,cAAc,CAAC;IAC9C,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CACX,qBAAqB,EACrB,kBAAkB,EAClB,kBAAkB,EAClB,gBAAgB,EAChB,kBAAkB,EAClB,mBAAmB,EACnB,eAAe,CAChB,CAAC;IACF,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,oBAAY,mBAAmB,GAAG,WAAW,CAAC;AAE9C,oBAAY,uBAAuB,GAAG;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,eAAe,CACzB,QAAQ,SAAS,uBAAuB,GAAG,uBAAuB,IAChE,WAAW,GACb,uBAAuB,GAAG;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC;CAC/B,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/types/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AACpF,OAAO,KAAK,EAAE,KAAK,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAE1F,oBAAY,WAAW,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAElD,oBAAY,aAAa,GAAG;IAC1B,CAAC,GAAG,EAAE,MAAM,GAAG;QACb,cAAc,EAAE,WAAW,CAAC;QAC5B,IAAI,EAAE,WAAW,CAAC;KACnB,CAAC;CACH,CAAC;AAEF,oBAAY,qBAAqB,GAAG,WAAW,GAAG;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,KAAK,CAAC;QACb,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC,CAAC;CACJ,CAAC;AAEF,oBAAY,kBAAkB,GAAG,WAAW,GAAG;IAC7C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,oBAAY,yBAAyB,GAAG,kBAAkB,GAAG;IAC3D,cAAc,EAAE,qBAAqB,CAAC;IACtC,WAAW,EAAE,kBAAkB,CAAC;IAChC,WAAW,EAAE,qBAAqB,CAAC;IACnC,SAAS,EAAE,WAAW,CAAC;IACvB,WAAW,EAAE,kBAAkB,CAAC;IAChC,YAAY,EAAE,WAAW,CAAC;IAC1B,QAAQ,EAAE,eAAe,CAAC;CAC3B,CAAC;AAEF,oBAAY,kBAAkB,CAC5B,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,WAAW,GAAG;IAChB,UAAU,CAAC,EAAE,eAAe,GAAG,cAAc,CAAC;IAC9C,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,KAAK,CAAC,kBAAkB,CAAC,CAAC;IAClC,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF,oBAAY,uBAAuB,GAAG;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,oBAAY,eAAe,CACzB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E,WAAW,GACb,uBAAuB,GAAG;IACxB,KAAK,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;CACzC,CAAC;AAEJ,oBAAY,aAAa,GACrB,UAAU,GACV,cAAc,GACd,oBAAoB,GACpB,0BAA0B,GAC1B,aAAa,GACb,mBAAmB,GACnB,yBAAyB,CAAC;AAE9B,oBAAY,cAAc,GAAG;IAC3B,qCAAqC;IACrC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,gDAAgD;IAChD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAC9D,uEAAuE;IACvE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC"}

package/dist/utils.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { UserResponse } from 'stream-chat';
-import type { DefaultUserType } from './types/types';
+import type { DefaultStreamChatGenerics } from './types/types';
 export declare const isOnlyEmojis: (text?: string | undefined) => boolean;
 export declare const matchMarkdownLinks: (message: string) => (string | null)[];
 export declare const messageCodeBlocks: (message: string) => RegExpMatchArray;
@@ -8,16 +8,16 @@ export declare const markDownRenderers: {
     [nodeType: string]: React.ElementType;
 };
 export declare const emojiMarkdownPlugin: () => <T extends unknown>(markdownAST: T) => T;
-export declare const mentionsMarkdownPlugin: <Us extends DefaultUserType<Us> = DefaultUserType<import("./types/types").DefaultUserTypeInternal>>(mentioned_users: UserResponse<Us>[]) => () => <T extends unknown>(markdownAST: T) => T;
-export declare type MentionProps<Us extends DefaultUserType<Us> = DefaultUserType> = {
-    mentioned_user: UserResponse<Us>;
+export declare const mentionsMarkdownPlugin: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(mentioned_users: UserResponse<StreamChatGenerics>[]) => () => <T extends unknown>(markdownAST: T) => T;
+export declare type MentionProps<StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics> = {
+    mentioned_user: UserResponse<StreamChatGenerics>;
 };
 export declare type RenderTextOptions = {
     customMarkDownRenderers?: {
         [nodeType: string]: React.ElementType;
     };
 };
-export declare const renderText: <Us extends DefaultUserType<Us> = DefaultUserType<import("./types/types").DefaultUserTypeInternal>>(text?: string | undefined, mentioned_users?: UserResponse<Us>[] | undefined, options?: RenderTextOptions) => JSX.Element | null;
+export declare const renderText: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>(text?: string | undefined, mentioned_users?: UserResponse<StreamChatGenerics>[] | undefined, options?: RenderTextOptions) => JSX.Element | null;
 export declare function escapeRegExp(text: string): string;
 export declare function generateRandomId(): string;
 export declare const getWholeChar: (str: string, i: number) => string;

package/dist/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AASjD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAErD,eAAO,MAAM,YAAY,wCAOxB,CAAC;AAoBF,eAAO,MAAM,kBAAkB,YAAa,MAAM,sBAajD,CAAC;AAEF,eAAO,MAAM,iBAAiB,YAAa,MAAM,qBAIhD,CAAC;AAyBF,eAAO,MAAM,iBAAiB,EAAE;IAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAA;CAwBtE,CAAC;AAEF,eAAO,MAAM,mBAAmB,gDAe/B,CAAC;AAEF,eAAO,MAAM,sBAAsB,4LAiClC,CAAC;AAEF,oBAAY,YAAY,CAAC,EAAE,SAAS,eAAe,CAAC,EAAE,CAAC,GAAG,eAAe,IAAI;IAC3E,cAAc,EAAE,YAAY,CAAC,EAAE,CAAC,CAAC;CAClC,CAAC;AAMF,oBAAY,iBAAiB,GAAG;IAC9B,uBAAuB,CAAC,EAAE;QACxB,CAAC,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC;KACvC,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,UAAU,6LAGZ,iBAAiB,uBAiE3B,CAAC;AAEF,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,UAExC;AAOD,wBAAgB,gBAAgB,WAG/B;AAGD,eAAO,MAAM,YAAY,QAAS,MAAM,KAAK,MAAM,WAgClD,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AASjD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,eAAe,CAAC;AAE/D,eAAO,MAAM,YAAY,wCAOxB,CAAC;AAoBF,eAAO,MAAM,kBAAkB,YAAa,MAAM,sBAajD,CAAC;AAEF,eAAO,MAAM,iBAAiB,YAAa,MAAM,qBAIhD,CAAC;AAyBF,eAAO,MAAM,iBAAiB,EAAE;IAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAA;CAwBtE,CAAC;AAEF,eAAO,MAAM,mBAAmB,gDAe/B,CAAC;AAEF,eAAO,MAAM,sBAAsB,2LAmClC,CAAC;AAEF,oBAAY,YAAY,CACtB,kBAAkB,SAAS,yBAAyB,GAAG,yBAAyB,IAC9E;IACF,cAAc,EAAE,YAAY,CAAC,kBAAkB,CAAC,CAAC;CAClD,CAAC;AAMF,oBAAY,iBAAiB,GAAG;IAC9B,uBAAuB,CAAC,EAAE;QACxB,CAAC,QAAQ,EAAE,MAAM,GAAG,KAAK,CAAC,WAAW,CAAC;KACvC,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,UAAU,4LAKZ,iBAAiB,uBAiE3B,CAAC;AAEF,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,UAExC;AAOD,wBAAgB,gBAAgB,WAG/B;AAGD,eAAO,MAAM,YAAY,QAAS,MAAM,KAAK,MAAM,WAgClD,CAAC"}

package/dist/version.d.ts

@@ -1,2 +1,2 @@
-export declare const version = "6.13.0";
+export declare const version = "8.1.0";
 //# sourceMappingURL=version.d.ts.map

package/dist/version.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,WAAW,CAAC"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../src/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,UAAU,CAAC"}

package/dist/version.js

@@ -1 +1 @@
-export var version = '6.13.0';
+export var version = '8.1.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "stream-chat-react",
-  "version": "6.13.0",
+  "version": "8.1.0",
   "description": "React components to create chat conversations or livestream style chat",
   "author": "GetStream",
   "homepage": "https://getstream.io/chat/",
@@ -27,13 +27,12 @@
     "getstream.io"
   ],
   "dependencies": {
-    "@braintree/sanitize-url": "5.0.0",
-    "@stream-io/stream-chat-css": "^2.2.1",
-    "custom-event": "^1.0.1",
+    "@braintree/sanitize-url": "6.0.0",
+    "@stream-io/stream-chat-css": "^2.8.0",
     "dayjs": "^1.10.4",
     "emoji-mart": "3.0.1",
     "emoji-regex": "^9.2.0",
-    "i18next": "^19.8.4",
+    "i18next": "^21.6.14",
     "isomorphic-ws": "^4.0.1",
     "linkifyjs": "^2.1.9",
     "lodash.debounce": "^4.0.8",
@@ -50,7 +49,7 @@
     "react-markdown": "^5.0.3",
     "react-player": "^2.7.0",
     "react-textarea-autosize": "^8.3.0",
-    "react-virtuoso": "^2.3.1",
+    "react-virtuoso": "^2.8.2",
     "textarea-caret": "^3.1.0",
     "uuid": "^8.3.1"
   },
@@ -61,7 +60,7 @@
   "peerDependencies": {
     "react": "^17.0.0 || ^16.8.0",
     "react-dom": "^17.0.0 || ^16.8.0",
-    "stream-chat": "^5.0.0"
+    "stream-chat": "^6.4.0"
   },
   "files": [
     "dist",
@@ -78,17 +77,21 @@
     "@babel/preset-env": "^7.12.7",
     "@babel/preset-react": "^7.12.7",
     "@babel/preset-typescript": "^7.12.7",
+    "@ladle/react": "^0.8.5",
+    "@playwright/test": "^1.20.0",
     "@rollup/plugin-babel": "^5.2.1",
     "@rollup/plugin-image": "^2.1.1",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^10.0.0",
     "@rollup/plugin-replace": "^2.3.4",
     "@rollup/plugin-typescript": "8.2.1",
+    "@semantic-release/changelog": "^6.0.1",
     "@stream-io/rollup-plugin-node-builtins": "^2.1.5",
     "@testing-library/jest-dom": "5.11.6",
     "@testing-library/react": "^11.2.2",
     "@testing-library/react-hooks": "^3.4.2",
     "@types/deep-equal": "^1.0.1",
+    "@types/dotenv": "^8.2.0",
     "@types/emoji-mart": "^3.0.8",
     "@types/linkifyjs": "^2.1.3",
     "@types/lodash.debounce": "^4.0.6",
@@ -96,6 +99,7 @@
     "@types/lodash.throttle": "^4.1.6",
     "@types/lodash.uniqby": "^4.7.6",
     "@types/moment": "^2.13.0",
+    "@types/react": "17.0.3",
     "@types/react-dom": "^17.0.0",
     "@types/react-image-gallery": "^1.0.5",
     "@types/react-is": "^17.0.0",
@@ -107,7 +111,6 @@
     "babel-eslint": "^10.1.0",
     "babel-jest": "^26.3.0",
     "babel-loader": "8.2.2",
-    "babel-plugin-i18next-extract": "^0.8.2",
     "babel-plugin-module-resolver": "^4.1.0",
     "babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
     "codecov": "^3.8.1",
@@ -132,10 +135,12 @@
     "eslint-plugin-react": "^7.21.5",
     "eslint-plugin-react-hooks": "^4.2.0",
     "eslint-plugin-sort-destructure-keys": "1.3.5",
+    "eslint-plugin-sort-keys-fix": "^1.1.2",
     "eslint-plugin-typescript-sort-keys": "1.5.0",
     "file-loader": "^6.2.0",
     "htmlparser2": "^5.0.1",
     "husky": "^4.3.0",
+    "i18next-parser": "^6.0.0",
     "jest": "^26.6.3",
     "jest-axe": "^5.0.1",
     "moment": "^2.29.1",
@@ -154,9 +159,9 @@
     "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-url": "^3.0.1",
     "rollup-plugin-visualizer": "^4.2.0",
-    "semantic-release": "^18.0.0",
+    "semantic-release": "^19.0.2",
     "semantic-release-cli": "^5.4.4",
-    "stream-chat": "^5.0.0",
+    "stream-chat": "6.4.0",
     "style-loader": "^2.0.0",
     "ts-jest": "^26.5.1",
     "tslib": "2.3.0",
@@ -176,9 +181,9 @@
     "build": "rm -rf dist && mkdir -p dist/assets assets && yarn --silent copy-version && yarn build-translations && yarn types && yarn bundle",
     "bundle": "rollup -c",
     "bundle-size": "BUNDLE_SIZE=true yarn bundle",
-    "build-translations": "rm -rf .tmpi18ncache || true && mkdir .tmpi18ncache && yarn run babel --config-file ./babel.i18next-extract.js --extensions '.ts','.tsx','.js','.jsx' 'src/**/*.{js,jsx,ts,tsx}' --out-dir '.tmpi18ncache/' && rm -rf .tmpi18ncache && prettier --write 'src/i18n/*.{js,jsx,ts,tsx,json}'",
-    "copy-version": "echo '\u001b[34mℹ\u001b[0m Copying Version to \u001b[34msrc/version.ts\u001b[0m' && PACKAGE_VERSION=$(node -pe 'require(`./package.json`).version') && PACKAGE_STRING=\"'$PACKAGE_VERSION'\" && echo 'export const version = '$PACKAGE_STRING';' > src/version.ts && echo '\u001b[32m✓\u001b[0m Done Copying Version'",
-    "coverage": "yarn test --collectCoverage && codecov",
+    "build-translations": "i18next",
+    "copy-version": "echo '\u001b[34mℹ\u001b[0m Copying Version to \u001b[34msrc/version.ts\u001b[0m' && PACKAGE_VERSION=$(node -pe 'require(`./package.json`).version') && PACKAGE_STRING=\"'$PACKAGE_VERSION'\" && echo 'export const version = '$PACKAGE_STRING';' > ./src/version.ts && echo '\u001b[32m✓\u001b[0m Done Copying Version'",
+    "coverage": "jest --collectCoverage && codecov",
     "eslint": "eslint '**/*.{js,md,ts,jsx,tsx}' --max-warnings 0",
     "lint": "prettier --list-different 'src/**/*.{js,ts,tsx,md,json}' .eslintrc.json .prettierrc babel.config.js && eslint 'src/**/*.{js,ts,tsx,md}' --max-warnings 0 && yarn validate-translations",
     "lint-fix": "prettier --write 'src/**/*.{js,ts,tsx,md,json}' .eslintrc.json .prettierrc babel.config.js && eslint --fix 'src/**/*.{js,ts,tsx,md}' --max-warnings 0",
@@ -190,7 +195,10 @@
     "test": "jest",
     "types": "tsc --strict",
     "validate-translations": "node scripts/validate-translations.js",
-    "semantic-release": "semantic-release"
+    "semantic-release": "semantic-release",
+    "browse-examples": "ladle serve",
+    "e2e": "playwright test",
+    "e2e-fixtures": "node e2e/fixtures.mjs"
   },
   "resolutions": {
     "ast-types": "^0.14.0"

package/dist/components/InfiniteScrollPaginator/InfiniteScrollPaginator.d.ts

@@ -1,18 +0,0 @@
-import React from 'react';
-import type { LoadingIndicatorProps } from '../Loading/LoadingIndicator';
-export declare type InfiniteScrollPaginatorProps = {
-    /** callback to load the next page */
-    loadNextPage: () => void;
-    /** indicates if there is a next page to load */
-    hasNextPage?: boolean;
-    /** The loading indicator to use */
-    LoadingIndicator?: React.ComponentType<LoadingIndicatorProps>;
-    /** indicates if there there's currently any refreshing taking place */
-    refreshing?: boolean;
-    /** display the items in opposite order */
-    reverse?: boolean;
-    /** Offset from when to start the loadNextPage call */
-    threshold?: number;
-};
-export declare const InfiniteScrollPaginator: React.FC<InfiniteScrollPaginatorProps>;
-//# sourceMappingURL=InfiniteScrollPaginator.d.ts.map

package/dist/components/InfiniteScrollPaginator/InfiniteScrollPaginator.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InfiniteScrollPaginator.d.ts","sourceRoot":"","sources":["../../../src/components/InfiniteScrollPaginator/InfiniteScrollPaginator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AAEzE,oBAAY,4BAA4B,GAAG;IACzC,qCAAqC;IACrC,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,gDAAgD;IAChD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAC;IAC9D,uEAAuE;IACvE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,EAAE,CAAC,4BAA4B,CA4B1E,CAAC"}

package/dist/components/InfiniteScrollPaginator/InfiniteScrollPaginator.js

@@ -1,8 +0,0 @@
-import React from 'react';
-import { LoadingIndicator as DefaultLoadingIndicator } from 'react-file-utils';
-import { InfiniteScroll } from './InfiniteScroll';
-export var InfiniteScrollPaginator = function (props) {
-    var children = props.children, hasNextPage = props.hasNextPage, _a = props.LoadingIndicator, LoadingIndicator = _a === void 0 ? DefaultLoadingIndicator : _a, loadNextPage = props.loadNextPage, refreshing = props.refreshing, reverse = props.reverse, threshold = props.threshold;
-    return (React.createElement(InfiniteScroll, { hasMore: hasNextPage, isLoading: refreshing, isReverse: reverse, loader: React.createElement("div", { className: 'str-chat__infinite-scroll-paginator', key: 'loadingindicator' },
-            React.createElement(LoadingIndicator, null)), loadMore: loadNextPage, threshold: threshold, useWindow: false }, children));
-};

package/dist/components/InfiniteScrollPaginator/ReverseInfiniteScroll.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { InfiniteScrollProps } from './InfiniteScroll';
-export declare const ReverseInfiniteScroll: React.FC<InfiniteScrollProps>;
-//# sourceMappingURL=ReverseInfiniteScroll.d.ts.map

package/dist/components/InfiniteScrollPaginator/ReverseInfiniteScroll.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ReverseInfiniteScroll.d.ts","sourceRoot":"","sources":["../../../src/components/InfiniteScrollPaginator/ReverseInfiniteScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAkB,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAEvE,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAE/D,CAAC"}

package/dist/components/InfiniteScrollPaginator/ReverseInfiniteScroll.js

@@ -1,14 +0,0 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import React from 'react';
-import { InfiniteScroll } from './InfiniteScroll';
-export var ReverseInfiniteScroll = function (props) { return (React.createElement(InfiniteScroll, __assign({}, props, { isReverse: true }))); };

package/dist/components/MessageList/hooks/useCallLoadMore.d.ts

@@ -1,3 +0,0 @@
-import type { MessageListProps } from '../MessageList';
-export declare const useCallLoadMore: (loadMore: MessageListProps['loadMore'], limit: number) => () => void;
-//# sourceMappingURL=useCallLoadMore.d.ts.map

package/dist/components/MessageList/hooks/useCallLoadMore.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useCallLoadMore.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageList/hooks/useCallLoadMore.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD,eAAO,MAAM,eAAe,aAAc,gBAAgB,CAAC,UAAU,CAAC,SAAS,MAAM,eAK9D,CAAC"}

package/dist/components/MessageList/hooks/useCallLoadMore.js

@@ -1,8 +0,0 @@
-import { useCallback } from 'react';
-export var useCallLoadMore = function (loadMore, limit) {
-    return useCallback(function () {
-        if (loadMore) {
-            loadMore(limit);
-        }
-    }, [limit, loadMore]);
-};