@sendbird/uikit-react 3.9.0 → 3.9.1-rc-0

package/dist/cjs/SendbirdProvider.js

@@ -0,0 +1,1066 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _tslib = require('./chunks/bundle-RmtoGD4w.js');
+var React = require('react');
+var uikitTools = require('@sendbird/uikit-tools');
+var withSendbird = require('./withSendbird.js');
+var cssVars = require('css-vars-ponyfill');
+var index_module = require('./chunks/bundle--sK1aluY.js');
+var actionTypes = require('./chunks/bundle-hAYm1E9a.js');
+var SendbirdChat = require('@sendbird/chat');
+var uuid = require('./chunks/bundle-2B2B2GGi.js');
+var openChannel = require('@sendbird/chat/openChannel');
+var groupChannel = require('@sendbird/chat/groupChannel');
+var index = require('./chunks/bundle-CDhpLgdo.js');
+var utils = require('./chunks/bundle-3WvVLPrn.js');
+var VoicePlayer_context = require('./chunks/bundle-cbDU-09l.js');
+var VoiceRecorder_context = require('./VoiceRecorder/context.js');
+var LocalizationContext = require('./chunks/bundle-AkDULw2F.js');
+var MediaQueryContext = require('./chunks/bundle-2utPAHKj.js');
+var stringSet = require('./chunks/bundle-Sx--KyLX.js');
+var consts = require('./chunks/bundle-98hUmAMo.js');
+var resolvedReplyType = require('./chunks/bundle-EW9CHi3w.js');
+var hooks_useModal = require('./hooks/useModal.js');
+var useSendbirdStateContext = require('./useSendbirdStateContext.js');
+require('./utils/message/getOutgoingMessageState.js');
+require('./chunks/bundle-stRq_8W4.js');
+require('react-dom');
+require('./ui/IconButton.js');
+require('./ui/Button.js');
+require('./chunks/bundle-41kBJWv1.js');
+require('./ui/Icon.js');
+require('./chunks/bundle-PwiP9Ezo.js');
+
+var isEmpty = function (obj) {
+    if (obj === null || obj === undefined) {
+        return true;
+    }
+    for (var prop in obj) {
+        if (obj.hasOwnProperty(prop)) {
+            return false;
+        }
+    }
+    return JSON.stringify(obj) === JSON.stringify({});
+};
+var useTheme = function (overrides) {
+    React.useLayoutEffect(function () {
+        if (!isEmpty(overrides)) {
+            cssVars({
+                variables: _tslib.__assign({
+                    '--sendbird-dark-primary-500': '#4d2aa6',
+                    '--sendbird-dark-primary-400': '#6440C4',
+                    '--sendbird-dark-primary-300': '#7B53EF',
+                    '--sendbird-dark-primary-200': '#9E8CF5',
+                    '--sendbird-dark-primary-100': '#E2DFFF',
+                    '--sendbird-dark-secondary-500': '#007A7A',
+                    '--sendbird-dark-secondary-400': '#189A8D',
+                    '--sendbird-dark-secondary-300': '#2EBA9F',
+                    '--sendbird-dark-secondary-200': '#6FD6BE',
+                    '--sendbird-dark-secondary-100': '#AEF2DC',
+                    '--sendbird-dark-information-100': '#b2d9ff',
+                    '--sendbird-dark-error-500': '#A30E2D',
+                    '--sendbird-dark-error-400': '#C11F41',
+                    '--sendbird-dark-error-300': '#E53157',
+                    '--sendbird-dark-error-200': '#FF6183',
+                    '--sendbird-dark-error-100': '#FFABBD',
+                    '--sendbird-dark-background-700': '#000000',
+                    '--sendbird-dark-background-600': '#161616',
+                    '--sendbird-dark-background-500': '#2C2C2C',
+                    '--sendbird-dark-background-400': '#393939',
+                    '--sendbird-dark-background-300': '#A8A8A8',
+                    '--sendbird-dark-background-200': '#D9D9D9',
+                    '--sendbird-dark-background-100': '#F0F0F0',
+                    '--sendbird-dark-background-50': '#FFFFFF',
+                    '--sendbird-dark-overlay': 'rgba(0, 0, 0, 0.32)',
+                    '--sendbird-dark-onlight-01': 'rgba(0, 0, 0, 0.88)',
+                    '--sendbird-dark-onlight-02': 'rgba(0, 0, 0, 0.50)',
+                    '--sendbird-dark-onlight-03': 'rgba(0, 0, 0, 0.38)',
+                    '--sendbird-dark-onlight-04': 'rgba(0, 0, 0, 0.12)',
+                    '--sendbird-dark-ondark-01': 'rgba(255, 255, 255, 0.88)',
+                    '--sendbird-dark-ondark-02': 'rgba(255, 255, 255, 0.50)',
+                    '--sendbird-dark-ondark-03': 'rgba(255, 255, 255, 0.38)',
+                    '--sendbird-dark-ondark-04': 'rgba(255, 255, 255, 0.12)',
+                    '--sendbird-dark-shadow-01': '0 1px 5px 0 rgba(33, 34, 66, 0.04), 0 0 3px 0 rgba(0, 0, 0, 0.08), 0 2px 1px 0 rgba(0, 0, 0, 0.12)',
+                    '--sendbird-dark-shadow-02': '0 3px 5px -3px rgba(33, 34, 66, 0.04), 0 3px 14px 2px rgba(0, 0, 0, 0.08), 0 8px 10px 1px rgba(0, 0, 0, 0.12)',
+                    '--sendbird-dark-shadow-03': '0 6px 10px -5px rgba(0, 0, 0, 0.04), 0 6px 30px 5px rgba(0, 0, 0, 0.08), 0 16px 24px 2px rgba(0, 0, 0, 0.12)',
+                    '--sendbird-dark-shadow-04': '0 9px 15px -7px rgba(0, 0, 0, 0.04), 0 9px 46px 8px rgba(0, 0, 0, 0.08), 0 24px 38px 3px rgba(0, 0, 0, 0.12)',
+                    '--sendbird-dark-shadow-message-input': '0 1px 5px 0 rgba(33, 34, 66, 0.12), 0 0 1px 0 rgba(33, 34, 66, 0.16), 0 2px 1px 0 rgba(33, 34, 66, 0.08), 0 1px 5px 0 rgba(0, 0, 0, 0.12)',
+                    '--sendbird-light-primary-500': '#4d2aa6',
+                    '--sendbird-light-primary-400': '#6440C4',
+                    '--sendbird-light-primary-300': '#7B53EF',
+                    '--sendbird-light-primary-200': '#9E8CF5',
+                    '--sendbird-light-primary-100': '#E2DFFF',
+                    '--sendbird-light-secondary-500': '#007A7A',
+                    '--sendbird-light-secondary-400': '#189A8D',
+                    '--sendbird-light-secondary-300': '#2EBA9F',
+                    '--sendbird-light-secondary-200': '#6FD6BE',
+                    '--sendbird-light-secondary-100': '#AEF2DC',
+                    '--sendbird-light-information-100': '#b2d9ff',
+                    '--sendbird-light-error-500': '#A30E2D',
+                    '--sendbird-light-error-400': '#C11F41',
+                    '--sendbird-light-error-300': '#E53157',
+                    '--sendbird-light-error-200': '#FF6183',
+                    '--sendbird-light-error-100': '#FFABBD',
+                    '--sendbird-light-background-700': '#000000',
+                    '--sendbird-light-background-600': '#161616',
+                    '--sendbird-light-background-500': '#2C2C2C',
+                    '--sendbird-light-background-400': '#393939',
+                    '--sendbird-light-background-300': '#A8A8A8',
+                    '--sendbird-light-background-200': '#D9D9D9',
+                    '--sendbird-light-background-100': '#F0F0F0',
+                    '--sendbird-light-background-50': ' #FFFFFF',
+                    '--sendbird-light-overlay': 'rgba(0, 0, 0, 0.32)',
+                    '--sendbird-light-onlight-01': 'rgba(0, 0, 0, 0.88)',
+                    '--sendbird-light-onlight-02': 'rgba(0, 0, 0, 0.50)',
+                    '--sendbird-light-onlight-03': 'rgba(0, 0, 0, 0.38)',
+                    '--sendbird-light-onlight-04': 'rgba(0, 0, 0, 0.12)',
+                    '--sendbird-light-ondark-01': 'rgba(255, 255, 255, 0.88)',
+                    '--sendbird-light-ondark-02': 'rgba(255, 255, 255, 0.50)',
+                    '--sendbird-light-ondark-03': 'rgba(255, 255, 255, 0.38)',
+                    '--sendbird-light-ondark-04': 'rgba(255, 255, 255, 0.12)',
+                    '--sendbird-light-shadow-01': '0 1px 5px 0 rgba(33, 34, 66, 0.04), 0 0 3px 0 rgba(0, 0, 0, 0.08), 0 2px 1px 0 rgba(0, 0, 0, 0.12)',
+                    '--sendbird-light-shadow-02': '0 3px 5px -3px rgba(33, 34, 66, 0.04), 0 3px 14px 2px rgba(0, 0, 0, 0.08), 0 8px 10px 1px rgba(0, 0, 0, 0.12)',
+                    '--sendbird-light-shadow-03': '0 6px 10px -5px rgba(0, 0, 0, 0.04), 0 6px 30px 5px rgba(0, 0, 0, 0.08), 0 16px 24px 2px rgba(0, 0, 0, 0.12)',
+                    '--sendbird-light-shadow-04': '0 9px 15px -7px rgba(0, 0, 0, 0.04), 0 9px 46px 8px rgba(0, 0, 0, 0.08), 0 24px 38px 3px rgba(0, 0, 0, 0.12)',
+                    '--sendbird-light-shadow-message-input': '0 1px 5px 0 rgba(33, 34, 66, 0.12), 0 0 1px 0 rgba(33, 34, 66, 0.16), 0 2px 1px 0 rgba(33, 34, 66, 0.08), 0 1px 5px 0 rgba(0, 0, 0, 0.12)',
+                }, overrides),
+            });
+        }
+    }, [overrides]);
+};
+
+var SDK_ACTIONS = {
+    INIT_SDK: 'INIT_SDK',
+    SET_SDK_LOADING: 'SET_SDK_LOADING',
+    RESET_SDK: 'RESET_SDK',
+    SDK_ERROR: 'SDK_ERROR',
+};
+
+var initialState$1 = {
+    initialized: false,
+    loading: false,
+    sdk: {},
+    error: false,
+};
+
+function reducer$1(state, action) {
+    return index_module.K(action)
+        .with({ type: SDK_ACTIONS.SET_SDK_LOADING }, function (_a) {
+        var payload = _a.payload;
+        return _tslib.__assign(_tslib.__assign({}, state), { initialized: false, loading: payload });
+    })
+        .with({ type: SDK_ACTIONS.SDK_ERROR }, function () {
+        return _tslib.__assign(_tslib.__assign({}, state), { initialized: false, loading: false, error: true });
+    })
+        .with({ type: SDK_ACTIONS.INIT_SDK }, function (_a) {
+        var payload = _a.payload;
+        return {
+            sdk: payload,
+            initialized: true,
+            loading: false,
+            error: false,
+        };
+    })
+        .with({ type: SDK_ACTIONS.RESET_SDK }, function () {
+        return initialState$1;
+    })
+        .otherwise(function () {
+        return state;
+    });
+}
+
+var initialState = {
+    initialized: false,
+    loading: false,
+    user: {},
+};
+
+function reducer(state, action) {
+    return index_module.K(action)
+        .with({ type: actionTypes.USER_ACTIONS.INIT_USER }, function (_a) {
+        var payload = _a.payload;
+        return {
+            initialized: true,
+            loading: false,
+            user: payload,
+        };
+    })
+        .with({ type: actionTypes.USER_ACTIONS.RESET_USER }, function () {
+        return initialState;
+    })
+        .with({ type: actionTypes.USER_ACTIONS.UPDATE_USER_INFO }, function (_a) {
+        var payload = _a.payload;
+        return _tslib.__assign(_tslib.__assign({}, state), { user: payload });
+    })
+        .otherwise(function () {
+        return state;
+    });
+}
+
+function useOnlineStatus(sdk, logger) {
+    var _a, _b;
+    var _c = React.useState((_b = (_a = window === null || window === void 0 ? void 0 : window.navigator) === null || _a === void 0 ? void 0 : _a.onLine) !== null && _b !== void 0 ? _b : true), isOnline = _c[0], setIsOnline = _c[1];
+    React.useEffect(function () {
+        var uniqueHandlerId = uuid.uuidv4();
+        try {
+            logger.warning('sdk changed', uniqueHandlerId);
+            var handler = new SendbirdChat.ConnectionHandler({
+                onDisconnected: function () {
+                    setIsOnline(false);
+                    logger.warning('onDisconnected', { isOnline: isOnline });
+                },
+                onReconnectStarted: function () {
+                    setIsOnline(false);
+                    logger.warning('onReconnectStarted', { isOnline: isOnline });
+                },
+                onReconnectSucceeded: function () {
+                    setIsOnline(true);
+                    logger.warning('onReconnectSucceeded', { isOnline: isOnline });
+                },
+                onReconnectFailed: function () {
+                    sdk.reconnect();
+                    logger.warning('onReconnectFailed');
+                },
+            });
+            if (sdk === null || sdk === void 0 ? void 0 : sdk.addConnectionHandler) {
+                // workaround -> addConnectionHandler invalidates session handler
+                // provided through configureSession
+                sdk.addConnectionHandler(uniqueHandlerId, handler);
+                logger.info('Added ConnectionHandler', uniqueHandlerId);
+            }
+        }
+        catch (_a) {
+            //
+        }
+        return function () {
+            try {
+                sdk.removeConnectionHandler(uniqueHandlerId);
+                logger.info('Removed ConnectionHandler', uniqueHandlerId);
+            }
+            catch (_a) {
+                //
+            }
+        };
+    }, [sdk]);
+    React.useEffect(function () {
+        var tryReconnect = function () {
+            try {
+                logger.warning('Try reconnecting SDK');
+                if (sdk.connectionState !== 'OPEN') { // connection is not broken yet
+                    sdk.reconnect();
+                }
+            }
+            catch (_a) {
+                //
+            }
+        };
+        // addEventListener version
+        window.addEventListener('online', tryReconnect);
+        return function () {
+            window.removeEventListener('online', tryReconnect);
+        };
+    }, [sdk]);
+    // add offline-class to body
+    React.useEffect(function () {
+        var body = document.querySelector('body');
+        if (!isOnline) {
+            try {
+                body.classList.add('sendbird__offline');
+                logger.info('Added class sendbird__offline to body');
+            }
+            catch (e) {
+                //
+            }
+        }
+        else {
+            try {
+                body.classList.remove('sendbird__offline');
+                logger.info('Removed class sendbird__offline from body');
+            }
+            catch (e) {
+                //
+            }
+        }
+    }, [isOnline]);
+    return isOnline;
+}
+
+function disconnectSdk(_a) {
+    var sdkDispatcher = _a.sdkDispatcher, userDispatcher = _a.userDispatcher, sdk = _a.sdk;
+    return _tslib.__awaiter(this, void 0, void 0, function () {
+        return _tslib.__generator(this, function (_b) {
+            return [2 /*return*/, new Promise(function (resolve) {
+                    sdkDispatcher({ type: SDK_ACTIONS.SET_SDK_LOADING, payload: true });
+                    if (sdk === null || sdk === void 0 ? void 0 : sdk.disconnect) {
+                        sdk.disconnect()
+                            .then(function () {
+                            sdkDispatcher({ type: SDK_ACTIONS.RESET_SDK });
+                            userDispatcher({ type: actionTypes.USER_ACTIONS.RESET_USER });
+                        })
+                            .finally(function () {
+                            resolve(true);
+                        });
+                    }
+                    else {
+                        resolve(true);
+                    }
+                })];
+        });
+    });
+}
+
+var APP_VERSION_STRING = '3.9.1-rc-0';
+var INIT_SDK = SDK_ACTIONS.INIT_SDK, SET_SDK_LOADING = SDK_ACTIONS.SET_SDK_LOADING, RESET_SDK = SDK_ACTIONS.RESET_SDK, SDK_ERROR = SDK_ACTIONS.SDK_ERROR;
+var INIT_USER = actionTypes.USER_ACTIONS.INIT_USER, UPDATE_USER_INFO = actionTypes.USER_ACTIONS.UPDATE_USER_INFO, RESET_USER = actionTypes.USER_ACTIONS.RESET_USER;
+function getMissingParamError(_a) {
+    var userId = _a.userId, appId = _a.appId;
+    return "SendbirdProvider | useConnect/setupConnection/Connection failed UserId: ".concat(userId, " or appId: ").concat(appId, " missing");
+}
+function getConnectSbError(error) {
+    return "SendbirdProvider | useConnect/setupConnection/Connection failed. ".concat((error === null || error === void 0 ? void 0 : error.code) || '', " ").concat((error === null || error === void 0 ? void 0 : error.message) || '');
+}
+function setUpParams(_a) {
+    var appId = _a.appId, customApiHost = _a.customApiHost, customWebSocketHost = _a.customWebSocketHost, _b = _a.sdkInitParams, sdkInitParams = _b === void 0 ? {} : _b;
+    var params = Object.assign(sdkInitParams, {
+        appId: appId,
+        modules: [new groupChannel.GroupChannelModule(), new openChannel.OpenChannelModule()],
+        newInstance: true,
+    });
+    if (customApiHost)
+        params.customApiHost = customApiHost;
+    if (customWebSocketHost)
+        params.customWebSocketHost = customWebSocketHost;
+    return SendbirdChat.init(params);
+}
+// Steps
+// 1. Check if minimum userID/appID is provided
+//  1.a. If not, throw error > !reject
+//  1.b. If yes, continue
+// 2. Set up params with custom host if provided
+// 3. Set up session handler if provided
+// 4. Set up version
+// 5. Connect to Sendbird -> either using user ID or (user ID + access token)
+// 6. If connected, connectCbSucess
+//  6.a check if nickname is to be updated -> no > !resolve immediately
+//  6.b check if nickname is to be updated -> yes > update nickname > !resolve
+// 7. If not connected, connectCbError > !reject
+function setUpConnection(_a) {
+    var logger = _a.logger, sdkDispatcher = _a.sdkDispatcher, userDispatcher = _a.userDispatcher, initDashboardConfigs = _a.initDashboardConfigs, userId = _a.userId, appId = _a.appId, customApiHost = _a.customApiHost, customWebSocketHost = _a.customWebSocketHost, configureSession = _a.configureSession, nickname = _a.nickname, profileUrl = _a.profileUrl, accessToken = _a.accessToken, isUserIdUsedForNickname = _a.isUserIdUsedForNickname, sdkInitParams = _a.sdkInitParams, customExtensionParams = _a.customExtensionParams, _b = _a.isMobile, isMobile = _b === void 0 ? false : _b, eventHandlers = _a.eventHandlers;
+    return _tslib.__awaiter(this, void 0, void 0, function () {
+        var _this = this;
+        return _tslib.__generator(this, function (_c) {
+            return [2 /*return*/, new Promise(function (resolve, reject) {
+                    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+                    (_a = logger === null || logger === void 0 ? void 0 : logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/setupConnection/init', { userId: userId, appId: appId });
+                    var onConnectionFailed = (_b = eventHandlers === null || eventHandlers === void 0 ? void 0 : eventHandlers.connection) === null || _b === void 0 ? void 0 : _b.onFailed;
+                    sdkDispatcher({ type: SET_SDK_LOADING, payload: true });
+                    if (userId && appId) {
+                        var newSdk_1 = setUpParams({
+                            appId: appId,
+                            customApiHost: customApiHost,
+                            customWebSocketHost: customWebSocketHost,
+                            sdkInitParams: sdkInitParams,
+                        });
+                        if (configureSession && typeof configureSession === 'function') {
+                            var sessionHandler = configureSession(newSdk_1);
+                            (_c = logger === null || logger === void 0 ? void 0 : logger.info) === null || _c === void 0 ? void 0 : _c.call(logger, 'SendbirdProvider | useConnect/setupConnection/configureSession', sessionHandler);
+                            newSdk_1.setSessionHandler(sessionHandler);
+                        }
+                        (_d = logger === null || logger === void 0 ? void 0 : logger.info) === null || _d === void 0 ? void 0 : _d.call(logger, 'SendbirdProvider | useConnect/setupConnection/setVersion', { version: APP_VERSION_STRING });
+                        /**
+                         * Keep optional chaining to the addSendbirdExtensions
+                         * for supporting the ChatSDK v4.9.5 or less
+                         */
+                        (_e = newSdk_1 === null || newSdk_1 === void 0 ? void 0 : newSdk_1.addSendbirdExtensions) === null || _e === void 0 ? void 0 : _e.call(newSdk_1, [
+                            {
+                                product: (_f = SendbirdChat.SendbirdProduct === null || SendbirdChat.SendbirdProduct === void 0 ? void 0 : SendbirdChat.SendbirdProduct.UIKIT_CHAT) !== null && _f !== void 0 ? _f : 'uikit-chat',
+                                version: APP_VERSION_STRING,
+                                platform: (_g = SendbirdChat.SendbirdPlatform === null || SendbirdChat.SendbirdPlatform === void 0 ? void 0 : SendbirdChat.SendbirdPlatform.JS) !== null && _g !== void 0 ? _g : 'js',
+                            },
+                        ], {
+                            platform: (isMobile
+                                ? (_h = SendbirdChat.DeviceOsPlatform === null || SendbirdChat.DeviceOsPlatform === void 0 ? void 0 : SendbirdChat.DeviceOsPlatform.MOBILE_WEB) !== null && _h !== void 0 ? _h : 'mobile_web'
+                                : (_j = SendbirdChat.DeviceOsPlatform === null || SendbirdChat.DeviceOsPlatform === void 0 ? void 0 : SendbirdChat.DeviceOsPlatform.WEB) !== null && _j !== void 0 ? _j : 'web'),
+                        }, customExtensionParams);
+                        newSdk_1.addExtension('sb_uikit', APP_VERSION_STRING);
+                        var connectCbSucess_1 = function (user) { return _tslib.__awaiter(_this, void 0, void 0, function () {
+                            var _a, _b;
+                            return _tslib.__generator(this, function (_c) {
+                                (_a = logger === null || logger === void 0 ? void 0 : logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/setupConnection/connectCbSucess', user);
+                                sdkDispatcher({ type: INIT_SDK, payload: newSdk_1 });
+                                userDispatcher({ type: INIT_USER, payload: user });
+                                initDashboardConfigs(newSdk_1)
+                                    .then(function (config) {
+                                    var _a;
+                                    (_a = logger === null || logger === void 0 ? void 0 : logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/setupConnection/getUIKitConfiguration success', {
+                                        config: config,
+                                    });
+                                })
+                                    .catch(function (error) {
+                                    var _a;
+                                    (_a = logger === null || logger === void 0 ? void 0 : logger.error) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/setupConnection/getUIKitConfiguration failed', {
+                                        error: error,
+                                    });
+                                });
+                                // use nickname/profileUrl if provided
+                                // or set userID as nickname
+                                if ((nickname !== user.nickname || profileUrl !== user.profileUrl)
+                                    && !(index.isTextuallyNull(nickname) && index.isTextuallyNull(profileUrl))) {
+                                    (_b = logger === null || logger === void 0 ? void 0 : logger.info) === null || _b === void 0 ? void 0 : _b.call(logger, 'SendbirdProvider | useConnect/setupConnection/updateCurrentUserInfo', {
+                                        nickname: nickname,
+                                        profileUrl: profileUrl,
+                                    });
+                                    newSdk_1.updateCurrentUserInfo({
+                                        nickname: nickname || user.nickname || (isUserIdUsedForNickname ? user.userId : ''),
+                                        profileUrl: profileUrl || user.profileUrl,
+                                    }).then(function (namedUser) {
+                                        var _a;
+                                        (_a = logger === null || logger === void 0 ? void 0 : logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/setupConnection/updateCurrentUserInfo success', {
+                                            nickname: nickname,
+                                            profileUrl: profileUrl,
+                                        });
+                                        userDispatcher({ type: UPDATE_USER_INFO, payload: namedUser });
+                                    }).finally(function () {
+                                        resolve();
+                                    });
+                                }
+                                else {
+                                    resolve();
+                                }
+                                return [2 /*return*/];
+                            });
+                        }); };
+                        var connectCbError_1 = function (e) {
+                            var _a;
+                            var errorMessage = getConnectSbError(e);
+                            (_a = logger === null || logger === void 0 ? void 0 : logger.error) === null || _a === void 0 ? void 0 : _a.call(logger, errorMessage, {
+                                e: e,
+                                appId: appId,
+                                userId: userId,
+                            });
+                            sdkDispatcher({ type: RESET_SDK });
+                            userDispatcher({ type: RESET_USER });
+                            sdkDispatcher({ type: SDK_ERROR });
+                            onConnectionFailed === null || onConnectionFailed === void 0 ? void 0 : onConnectionFailed(e);
+                            // exit promise with error
+                            reject(errorMessage);
+                        };
+                        (_k = logger === null || logger === void 0 ? void 0 : logger.info) === null || _k === void 0 ? void 0 : _k.call(logger, "SendbirdProvider | useConnect/setupConnection/connect connecting using ".concat(accessToken !== null && accessToken !== void 0 ? accessToken : userId));
+                        newSdk_1.connect(userId, accessToken)
+                            .then(function (res) { return connectCbSucess_1(res); })
+                            .catch(function (err) { return connectCbError_1(err); });
+                    }
+                    else {
+                        var errorMessage = getMissingParamError({ userId: userId, appId: appId });
+                        sdkDispatcher({ type: SDK_ERROR });
+                        onConnectionFailed === null || onConnectionFailed === void 0 ? void 0 : onConnectionFailed({ message: errorMessage });
+                        (_l = logger === null || logger === void 0 ? void 0 : logger.error) === null || _l === void 0 ? void 0 : _l.call(logger, errorMessage);
+                        // exit promise with error
+                        reject(errorMessage);
+                    }
+                })];
+        });
+    });
+}
+
+function connect(_a) {
+    var logger = _a.logger, sdkDispatcher = _a.sdkDispatcher, userDispatcher = _a.userDispatcher, initDashboardConfigs = _a.initDashboardConfigs, userId = _a.userId, appId = _a.appId, customApiHost = _a.customApiHost, customWebSocketHost = _a.customWebSocketHost, configureSession = _a.configureSession, nickname = _a.nickname, profileUrl = _a.profileUrl, accessToken = _a.accessToken, sdk = _a.sdk, sdkInitParams = _a.sdkInitParams, customExtensionParams = _a.customExtensionParams, isMobile = _a.isMobile, eventHandlers = _a.eventHandlers;
+    return _tslib.__awaiter(this, void 0, void 0, function () {
+        return _tslib.__generator(this, function (_b) {
+            switch (_b.label) {
+                case 0: return [4 /*yield*/, disconnectSdk({
+                        logger: logger,
+                        sdkDispatcher: sdkDispatcher,
+                        userDispatcher: userDispatcher,
+                        sdk: sdk,
+                    })];
+                case 1:
+                    _b.sent();
+                    return [4 /*yield*/, setUpConnection({
+                            logger: logger,
+                            sdkDispatcher: sdkDispatcher,
+                            userDispatcher: userDispatcher,
+                            initDashboardConfigs: initDashboardConfigs,
+                            userId: userId,
+                            appId: appId,
+                            customApiHost: customApiHost,
+                            customWebSocketHost: customWebSocketHost,
+                            configureSession: configureSession,
+                            nickname: nickname,
+                            profileUrl: profileUrl,
+                            accessToken: accessToken,
+                            sdkInitParams: sdkInitParams,
+                            customExtensionParams: customExtensionParams,
+                            isMobile: isMobile,
+                            eventHandlers: eventHandlers,
+                        })];
+                case 2:
+                    _b.sent();
+                    return [2 /*return*/];
+            }
+        });
+    });
+}
+
+function useConnect(triggerTypes, staticTypes) {
+    var _this = this;
+    var _a;
+    var userId = triggerTypes.userId, appId = triggerTypes.appId, accessToken = triggerTypes.accessToken, isMobile = triggerTypes.isMobile, isUserIdUsedForNickname = triggerTypes.isUserIdUsedForNickname;
+    var logger = staticTypes.logger, nickname = staticTypes.nickname, profileUrl = staticTypes.profileUrl, configureSession = staticTypes.configureSession, customApiHost = staticTypes.customApiHost, customWebSocketHost = staticTypes.customWebSocketHost, sdk = staticTypes.sdk, sdkDispatcher = staticTypes.sdkDispatcher, userDispatcher = staticTypes.userDispatcher, initDashboardConfigs = staticTypes.initDashboardConfigs, sdkInitParams = staticTypes.sdkInitParams, customExtensionParams = staticTypes.customExtensionParams, eventHandlers = staticTypes.eventHandlers;
+    (_a = logger === null || logger === void 0 ? void 0 : logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect', _tslib.__assign(_tslib.__assign({}, triggerTypes), staticTypes));
+    React.useEffect(function () {
+        var _a;
+        (_a = logger === null || logger === void 0 ? void 0 : logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/useEffect', { userId: userId, appId: appId, accessToken: accessToken });
+        connect({
+            userId: userId,
+            appId: appId,
+            accessToken: accessToken,
+            logger: logger,
+            nickname: nickname,
+            profileUrl: profileUrl,
+            configureSession: configureSession,
+            customApiHost: customApiHost,
+            customWebSocketHost: customWebSocketHost,
+            sdk: sdk,
+            sdkDispatcher: sdkDispatcher,
+            userDispatcher: userDispatcher,
+            initDashboardConfigs: initDashboardConfigs,
+            isUserIdUsedForNickname: isUserIdUsedForNickname,
+            sdkInitParams: sdkInitParams,
+            customExtensionParams: customExtensionParams,
+            isMobile: isMobile,
+            eventHandlers: eventHandlers,
+        }).catch(function (error) {
+            var _a;
+            (_a = logger === null || logger === void 0 ? void 0 : logger.error) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/useEffect', error);
+        });
+    }, [userId, appId, accessToken]);
+    var reconnect = React.useCallback(function () { return _tslib.__awaiter(_this, void 0, void 0, function () {
+        var error_1;
+        var _a, _b;
+        return _tslib.__generator(this, function (_c) {
+            switch (_c.label) {
+                case 0:
+                    (_a = logger === null || logger === void 0 ? void 0 : logger.info) === null || _a === void 0 ? void 0 : _a.call(logger, 'SendbirdProvider | useConnect/reconnect/useCallback', { sdk: sdk });
+                    _c.label = 1;
+                case 1:
+                    _c.trys.push([1, 3, , 4]);
+                    return [4 /*yield*/, connect({
+                            userId: userId,
+                            appId: appId,
+                            accessToken: accessToken,
+                            logger: logger,
+                            nickname: nickname,
+                            profileUrl: profileUrl,
+                            configureSession: configureSession,
+                            customApiHost: customApiHost,
+                            customWebSocketHost: customWebSocketHost,
+                            sdk: sdk,
+                            sdkDispatcher: sdkDispatcher,
+                            userDispatcher: userDispatcher,
+                            initDashboardConfigs: initDashboardConfigs,
+                            isUserIdUsedForNickname: isUserIdUsedForNickname,
+                            sdkInitParams: sdkInitParams,
+                            customExtensionParams: customExtensionParams,
+                            isMobile: isMobile,
+                            eventHandlers: eventHandlers,
+                        })];
+                case 2:
+                    _c.sent();
+                    return [3 /*break*/, 4];
+                case 3:
+                    error_1 = _c.sent();
+                    (_b = logger === null || logger === void 0 ? void 0 : logger.error) === null || _b === void 0 ? void 0 : _b.call(logger, 'SendbirdProvider | useConnect/reconnect/useCallback', error_1);
+                    return [3 /*break*/, 4];
+                case 4: return [2 /*return*/];
+            }
+        });
+    }); }, [sdk]);
+    return reconnect;
+}
+
+// Logger, pretty much explains it
+// in SendbirdProvider
+// const [logger, setLogger] = useState(LoggerFactory(logLevel));
+var LOG_LEVELS = {
+    DEBUG: 'debug',
+    WARNING: 'warning',
+    ERROR: 'error',
+    INFO: 'info',
+    ALL: 'all',
+};
+var colorLog = function (level) {
+    switch (level) {
+        case LOG_LEVELS.WARNING:
+            return ('color: Orange');
+        case LOG_LEVELS.ERROR:
+            return ('color: Red');
+        default:
+            return ('color: Gray');
+    }
+};
+var printLog = function (_a) {
+    var level = _a.level, title = _a.title, _b = _a.description, description = _b === void 0 ? '' : _b, _c = _a.payload, payload = _c === void 0 ? [] : _c;
+    // eslint-disable-next-line no-console
+    console.log.apply(console, _tslib.__spreadArray(["%c SendbirdUIKit | ".concat(level, " | ").concat(new Date().toISOString(), " | ").concat(title, " ").concat(description && '|'), colorLog(level), description], payload, false));
+};
+var getDefaultLogger = function () { return ({
+    info: utils.noop,
+    error: utils.noop,
+    warning: utils.noop,
+}); };
+var LoggerFactory = function (lvl, customInterface) {
+    var logInterface = customInterface || printLog;
+    var lvlArray = Array.isArray(lvl) ? lvl : [lvl];
+    var applyLog = function (lgLvl) { return function (title, description) {
+        var payload = [];
+        for (var _i = 2; _i < arguments.length; _i++) {
+            payload[_i - 2] = arguments[_i];
+        }
+        return logInterface({
+            level: lgLvl,
+            title: title,
+            description: description,
+            payload: payload,
+        });
+    }; };
+    return lvlArray.reduce(function (accumulator, currentLvl) {
+        if (currentLvl === LOG_LEVELS.DEBUG || currentLvl === LOG_LEVELS.ALL) {
+            return (_tslib.__assign(_tslib.__assign({}, accumulator), { info: applyLog(LOG_LEVELS.INFO), error: applyLog(LOG_LEVELS.ERROR), warning: applyLog(LOG_LEVELS.WARNING) }));
+        }
+        if (currentLvl === LOG_LEVELS.INFO) {
+            return (_tslib.__assign(_tslib.__assign({}, accumulator), { info: applyLog(LOG_LEVELS.INFO) }));
+        }
+        if (currentLvl === LOG_LEVELS.ERROR) {
+            return (_tslib.__assign(_tslib.__assign({}, accumulator), { error: applyLog(LOG_LEVELS.ERROR) }));
+        }
+        if (currentLvl === LOG_LEVELS.WARNING) {
+            return (_tslib.__assign(_tslib.__assign({}, accumulator), { warning: applyLog(LOG_LEVELS.WARNING) }));
+        }
+        return _tslib.__assign({}, accumulator);
+    }, getDefaultLogger());
+};
+// TODO: Make this to hook, useLogger
+
+// we use pubsub to sync events between multiple components(example - ChannelList, Channel)
+// for example, if customer sends a message from their custom component
+// without pubsub,we would not be able to listen to it
+// in our ChannelList or Conversation
+var pubSubFactory = function () {
+    var topics = {};
+    return {
+        __getTopics: function () { return topics; },
+        subscribe: function (topic, listener) {
+            var _a;
+            (_a = topics[topic]) !== null && _a !== void 0 ? _a : (topics[topic] = new Set());
+            topics[topic].add(listener);
+            return {
+                remove: function () {
+                    topics[topic].delete(listener);
+                },
+            };
+        },
+        publish: function (topic, info) {
+            if (topics[topic]) {
+                topics[topic].forEach(function (fn) {
+                    setTimeout(function () { return fn(info !== undefined ? info : {}); }, 0);
+                });
+            }
+        },
+    };
+};
+
+function useAppendDomNode(ids, rootSelector) {
+    if (ids === void 0) { ids = []; }
+    if (rootSelector === void 0) { rootSelector = 'unknown'; }
+    React.useEffect(function () {
+        var root = document.querySelector(rootSelector);
+        if (root) {
+            ids.forEach(function (id) {
+                var elem = document.createElement('div');
+                elem.setAttribute('id', id);
+                root.appendChild(elem);
+            });
+        }
+        return function () {
+            if (root) {
+                ids.forEach(function (id) {
+                    var target = document.getElementById(id);
+                    if (target)
+                        root.removeChild(target);
+                });
+            }
+        };
+    }, []);
+}
+
+var VoiceMessageProvider = function (_a) {
+    var children = _a.children, _b = _a.isVoiceMessageEnabled, isVoiceMessageEnabled = _b === void 0 ? true : _b;
+    if (!isVoiceMessageEnabled) {
+        return (React.createElement(VoicePlayer_context.VoicePlayerProvider, null, children));
+    }
+    return (React.createElement(VoiceRecorder_context.VoiceRecorderProvider, null,
+        React.createElement(VoicePlayer_context.VoicePlayerProvider, null, children)));
+};
+
+function uikitConfigMapper(_a) {
+    var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1;
+    var legacyConfig = _a.legacyConfig, _2 = _a.uikitOptions, uikitOptions = _2 === void 0 ? {} : _2;
+    var replyType = legacyConfig.replyType, isMentionEnabled = legacyConfig.isMentionEnabled, isReactionEnabled = legacyConfig.isReactionEnabled, disableUserProfile = legacyConfig.disableUserProfile, isVoiceMessageEnabled = legacyConfig.isVoiceMessageEnabled, isTypingIndicatorEnabledOnChannelList = legacyConfig.isTypingIndicatorEnabledOnChannelList, isMessageReceiptStatusEnabledOnChannelList = legacyConfig.isMessageReceiptStatusEnabledOnChannelList, showSearchIcon = legacyConfig.showSearchIcon;
+    return {
+        common: {
+            enableUsingDefaultUserProfile: (_c = (_b = uikitOptions.common) === null || _b === void 0 ? void 0 : _b.enableUsingDefaultUserProfile) !== null && _c !== void 0 ? _c : (typeof disableUserProfile === 'boolean'
+                ? !disableUserProfile
+                : undefined),
+        },
+        groupChannel: {
+            enableOgtag: (_d = uikitOptions.groupChannel) === null || _d === void 0 ? void 0 : _d.enableOgtag,
+            enableMention: (_f = (_e = uikitOptions.groupChannel) === null || _e === void 0 ? void 0 : _e.enableMention) !== null && _f !== void 0 ? _f : isMentionEnabled,
+            enableReactions: (_h = (_g = uikitOptions.groupChannel) === null || _g === void 0 ? void 0 : _g.enableReactions) !== null && _h !== void 0 ? _h : isReactionEnabled,
+            enableTypingIndicator: (_j = uikitOptions.groupChannel) === null || _j === void 0 ? void 0 : _j.enableTypingIndicator,
+            enableVoiceMessage: (_l = (_k = uikitOptions.groupChannel) === null || _k === void 0 ? void 0 : _k.enableVoiceMessage) !== null && _l !== void 0 ? _l : isVoiceMessageEnabled,
+            replyType: (_o = (_m = uikitOptions.groupChannel) === null || _m === void 0 ? void 0 : _m.replyType) !== null && _o !== void 0 ? _o : (replyType != null ? resolvedReplyType.getCaseResolvedReplyType(replyType).lowerCase : undefined),
+            threadReplySelectType: (_p = uikitOptions.groupChannel) === null || _p === void 0 ? void 0 : _p.threadReplySelectType,
+            input: {
+                enableDocument: (_r = (_q = uikitOptions.groupChannel) === null || _q === void 0 ? void 0 : _q.input) === null || _r === void 0 ? void 0 : _r.enableDocument,
+            },
+            typingIndicatorTypes: (_s = uikitOptions.groupChannel) === null || _s === void 0 ? void 0 : _s.typingIndicatorTypes,
+        },
+        groupChannelList: {
+            enableTypingIndicator: (_u = (_t = uikitOptions.groupChannelList) === null || _t === void 0 ? void 0 : _t.enableTypingIndicator) !== null && _u !== void 0 ? _u : isTypingIndicatorEnabledOnChannelList,
+            enableMessageReceiptStatus: (_w = (_v = uikitOptions.groupChannelList) === null || _v === void 0 ? void 0 : _v.enableMessageReceiptStatus) !== null && _w !== void 0 ? _w : isMessageReceiptStatusEnabledOnChannelList,
+        },
+        groupChannelSettings: {
+            enableMessageSearch: (_y = (_x = uikitOptions.groupChannelSettings) === null || _x === void 0 ? void 0 : _x.enableMessageSearch) !== null && _y !== void 0 ? _y : showSearchIcon,
+        },
+        openChannel: {
+            enableOgtag: (_z = uikitOptions.openChannel) === null || _z === void 0 ? void 0 : _z.enableOgtag,
+            input: {
+                enableDocument: (_1 = (_0 = uikitOptions.openChannel) === null || _0 === void 0 ? void 0 : _0.input) === null || _1 === void 0 ? void 0 : _1.enableDocument,
+            },
+        },
+    };
+}
+
+var TIMEOUT = 2000;
+/*
+  * This is a factory function that returns a scheduler.
+  * The scheduler is a queue that calls the callback function on intervals.
+  * If interval is empty, the callback function is called immediately.
+  * If interval is not empty, the callback function is called after the interval.
+*/
+function schedulerFactory(_a) {
+    var logger = _a.logger, timeout = _a.timeout, cb = _a.cb;
+    var queue = [];
+    var interval = null;
+    var push = function (channel) {
+        var channelPresent = queue.find(function (c) { return c.url === channel.url; });
+        if (!channelPresent) {
+            queue.push(channel);
+        }
+        else {
+            logger.info('Channel: Mark as read already in queue', { channel: channel });
+        }
+        // start the interval if it's not already running
+        if (interval) {
+            return;
+        }
+        var item = queue.shift();
+        if (item) {
+            cb(item);
+        }
+        interval = setInterval(function () {
+            if (queue.length === 0 && interval) {
+                clearInterval(interval);
+                interval = null;
+                return;
+            }
+            var item = queue.shift();
+            if (item) {
+                cb(item);
+            }
+        }, (timeout || TIMEOUT));
+    };
+    var clear = function () {
+        queue = [];
+        if (interval) {
+            clearInterval(interval);
+            interval = null;
+        }
+    };
+    return {
+        push: push,
+        clear: clear,
+        getQueue: function () { return queue; },
+    };
+}
+
+// this hook accepts a callback to run component is unmounted
+function useUnmount(callback, deps) {
+    if (deps === void 0) { deps = []; }
+    React.useLayoutEffect(function () {
+        return function () {
+            callback();
+        };
+    }, deps);
+}
+
+function useMarkAsReadScheduler(_a, _b) {
+    var isConnected = _a.isConnected;
+    var logger = _b.logger;
+    var markAsReadScheduler = React.useMemo(function () { return schedulerFactory({
+        logger: logger,
+        cb: function (channel) {
+            try {
+                channel.markAsRead();
+            }
+            catch (error) {
+                logger.warning('Channel: Mark as delivered failed', { channel: channel, error: error });
+            }
+        },
+    }); }, []);
+    React.useEffect(function () {
+        // for simplicity, we clear the queue when the connection is lost
+        if (!isConnected) {
+            markAsReadScheduler.clear();
+        }
+    }, [isConnected]);
+    useUnmount(function () { markAsReadScheduler.clear(); });
+    return markAsReadScheduler;
+}
+
+function useMarkAsDeliveredScheduler(_a, _b) {
+    var isConnected = _a.isConnected;
+    var logger = _b.logger;
+    var markAsDeliveredScheduler = React.useMemo(function () { return schedulerFactory({
+        logger: logger,
+        cb: function (channel) {
+            try {
+                channel.markAsDelivered();
+            }
+            catch (error) {
+                logger.warning('Channel: Mark as delivered failed', { channel: channel, error: error });
+            }
+        },
+    }); }, []);
+    React.useEffect(function () {
+        // for simplicity, we clear the queue when the connection is lost
+        if (!isConnected) {
+            markAsDeliveredScheduler.clear();
+        }
+    }, [isConnected]);
+    useUnmount(function () { markAsDeliveredScheduler.clear(); });
+    return markAsDeliveredScheduler;
+}
+
+function SendbirdProvider(props) {
+    var localConfigs = uikitConfigMapper({
+        legacyConfig: {
+            replyType: props.replyType,
+            isMentionEnabled: props.isMentionEnabled,
+            isReactionEnabled: props.isReactionEnabled,
+            disableUserProfile: props.disableUserProfile,
+            isVoiceMessageEnabled: props.isVoiceMessageEnabled,
+            isTypingIndicatorEnabledOnChannelList: props.isTypingIndicatorEnabledOnChannelList,
+            isMessageReceiptStatusEnabledOnChannelList: props.isMessageReceiptStatusEnabledOnChannelList,
+            showSearchIcon: props.showSearchIcon,
+        },
+        uikitOptions: props.uikitOptions,
+    });
+    return (React.createElement(uikitTools.UIKitConfigProvider, { localConfigs: {
+            common: localConfigs === null || localConfigs === void 0 ? void 0 : localConfigs.common,
+            groupChannel: {
+                channel: localConfigs === null || localConfigs === void 0 ? void 0 : localConfigs.groupChannel,
+                channelList: localConfigs === null || localConfigs === void 0 ? void 0 : localConfigs.groupChannelList,
+                setting: localConfigs === null || localConfigs === void 0 ? void 0 : localConfigs.groupChannelSettings,
+            },
+            openChannel: {
+                channel: localConfigs === null || localConfigs === void 0 ? void 0 : localConfigs.openChannel,
+            },
+        } },
+        React.createElement(SendbirdSDK, _tslib.__assign({}, props))));
+}
+var SendbirdSDK = function (_a) {
+    var _b, _c, _d;
+    var appId = _a.appId, userId = _a.userId, children = _a.children, accessToken = _a.accessToken, customApiHost = _a.customApiHost, customWebSocketHost = _a.customWebSocketHost, _e = _a.configureSession, configureSession = _e === void 0 ? null : _e, _f = _a.theme, theme = _f === void 0 ? 'light' : _f, _g = _a.config, config = _g === void 0 ? {} : _g, _h = _a.nickname, nickname = _h === void 0 ? '' : _h, _j = _a.colorSet, colorSet = _j === void 0 ? null : _j, _k = _a.stringSet, stringSet$1 = _k === void 0 ? null : _k, _l = _a.dateLocale, dateLocale = _l === void 0 ? null : _l, _m = _a.profileUrl, profileUrl = _m === void 0 ? '' : _m, voiceRecord = _a.voiceRecord, _o = _a.userListQuery, userListQuery = _o === void 0 ? null : _o, _p = _a.imageCompression, imageCompression = _p === void 0 ? {} : _p, _q = _a.allowProfileEdit, allowProfileEdit = _q === void 0 ? false : _q, _r = _a.disableMarkAsDelivered, disableMarkAsDelivered = _r === void 0 ? false : _r, _s = _a.renderUserProfile, renderUserProfile = _s === void 0 ? null : _s, _t = _a.onUserProfileMessage, onUserProfileMessage = _t === void 0 ? null : _t, _u = _a.breakpoint, breakpoint = _u === void 0 ? false : _u, _v = _a.isUserIdUsedForNickname, isUserIdUsedForNickname = _v === void 0 ? true : _v, sdkInitParams = _a.sdkInitParams, customExtensionParams = _a.customExtensionParams, _w = _a.isMultipleFilesMessageEnabled, isMultipleFilesMessageEnabled = _w === void 0 ? false : _w, eventHandlers = _a.eventHandlers;
+    var _x = config.logLevel, logLevel = _x === void 0 ? '' : _x, _y = config.userMention, userMention = _y === void 0 ? {} : _y, _z = config.isREMUnitEnabled, isREMUnitEnabled = _z === void 0 ? false : _z, customPubSub = config.pubSub;
+    var isMobile = MediaQueryContext.useMediaQueryContext().isMobile;
+    var _0 = React.useState(LoggerFactory(logLevel)), logger = _0[0], setLogger = _0[1];
+    var pubSub = React.useState(function () { return customPubSub !== null && customPubSub !== void 0 ? customPubSub : pubSubFactory(); })[0];
+    var _1 = React.useReducer(reducer$1, initialState$1), sdkStore = _1[0], sdkDispatcher = _1[1];
+    var _2 = React.useReducer(reducer, initialState), userStore = _2[0], userDispatcher = _2[1];
+    var _3 = uikitTools.useUIKitConfig(), configs = _3.configs, configsWithAppAttr = _3.configsWithAppAttr, initDashboardConfigs = _3.initDashboardConfigs;
+    var sdkInitialized = sdkStore.initialized;
+    var sdk = sdkStore === null || sdkStore === void 0 ? void 0 : sdkStore.sdk;
+    var _4 = (_b = sdk === null || sdk === void 0 ? void 0 : sdk.appInfo) !== null && _b !== void 0 ? _b : {}, uploadSizeLimit = _4.uploadSizeLimit, multipleFilesMessageFileCountLimit = _4.multipleFilesMessageFileCountLimit;
+    useTheme(colorSet);
+    var reconnect = useConnect({
+        appId: appId,
+        userId: userId,
+        accessToken: accessToken,
+        isUserIdUsedForNickname: isUserIdUsedForNickname,
+        isMobile: isMobile,
+    }, {
+        logger: logger,
+        nickname: nickname,
+        profileUrl: profileUrl,
+        configureSession: configureSession,
+        customApiHost: customApiHost,
+        customWebSocketHost: customWebSocketHost,
+        sdkInitParams: sdkInitParams,
+        customExtensionParams: customExtensionParams,
+        sdk: sdk,
+        sdkDispatcher: sdkDispatcher,
+        userDispatcher: userDispatcher,
+        initDashboardConfigs: initDashboardConfigs,
+        eventHandlers: eventHandlers,
+    });
+    useUnmount(function () {
+        if (typeof sdk.disconnect === 'function') {
+            disconnectSdk({
+                logger: logger,
+                sdkDispatcher: sdkDispatcher,
+                userDispatcher: userDispatcher,
+                sdk: sdk,
+            });
+        }
+    }, [sdk.disconnect]);
+    // to create a pubsub to communicate between parent and child
+    React.useEffect(function () {
+        setLogger(LoggerFactory(logLevel));
+    }, [logLevel]);
+    useAppendDomNode([
+        'sendbird-modal-root',
+        'sendbird-dropdown-portal',
+        'sendbird-emoji-list-portal',
+    ], 'body');
+    // should move to reducer
+    var _5 = React.useState(theme), currentTheme = _5[0], setCurrentTheme = _5[1];
+    React.useEffect(function () {
+        setCurrentTheme(theme);
+    }, [theme]);
+    React.useEffect(function () {
+        var body = document.querySelector('body');
+        body.classList.remove('sendbird-experimental__rem__units');
+        if (isREMUnitEnabled) {
+            body.classList.add('sendbird-experimental__rem__units');
+        }
+    }, [isREMUnitEnabled]);
+    // add-remove theme from body
+    React.useEffect(function () {
+        logger.info('Setup theme', "Theme: ".concat(currentTheme));
+        try {
+            var body = document.querySelector('body');
+            body.classList.remove('sendbird-theme--light');
+            body.classList.remove('sendbird-theme--dark');
+            body.classList.add("sendbird-theme--".concat(currentTheme || 'light'));
+            logger.info('Finish setup theme');
+            // eslint-disable-next-line no-empty
+        }
+        catch (e) {
+            logger.warning('Setup theme failed', "".concat(e));
+        }
+        return function () {
+            try {
+                var body = document.querySelector('body');
+                body.classList.remove('sendbird-theme--light');
+                body.classList.remove('sendbird-theme--dark');
+                // eslint-disable-next-line no-empty
+            }
+            catch (_a) { }
+        };
+    }, [currentTheme]);
+    var isOnline = useOnlineStatus(sdkStore.sdk, logger);
+    var markAsReadScheduler = useMarkAsReadScheduler({ isConnected: isOnline }, { logger: logger });
+    var markAsDeliveredScheduler = useMarkAsDeliveredScheduler({ isConnected: isOnline }, { logger: logger });
+    var localeStringSet = React.useMemo(function () {
+        if (!stringSet$1) {
+            return stringSet.getStringSet('en');
+        }
+        return _tslib.__assign(_tslib.__assign({}, stringSet.getStringSet('en')), stringSet$1);
+    }, [stringSet$1]);
+    /**
+     * Feature Configuration - TODO
+     * This will be moved into the UIKitConfigProvider, aftering Dashboard applies
+     */
+    var uikitMultipleFilesMessageLimit = React.useMemo(function () {
+        return Math.min(consts.DEFAULT_MULTIPLE_FILES_MESSAGE_LIMIT, multipleFilesMessageFileCountLimit !== null && multipleFilesMessageFileCountLimit !== void 0 ? multipleFilesMessageFileCountLimit : Number.MAX_SAFE_INTEGER);
+    }, [multipleFilesMessageFileCountLimit]);
+    var uikitUploadSizeLimit = React.useMemo(function () {
+        return uploadSizeLimit;
+    }, [uploadSizeLimit]);
+    return (React.createElement(withSendbird.SendbirdSdkContext.Provider, { value: {
+            stores: {
+                sdkStore: sdkStore,
+                userStore: userStore,
+            },
+            dispatchers: {
+                sdkDispatcher: sdkDispatcher,
+                userDispatcher: userDispatcher,
+                reconnect: reconnect,
+            },
+            config: {
+                disableMarkAsDelivered: disableMarkAsDelivered,
+                renderUserProfile: renderUserProfile,
+                onUserProfileMessage: onUserProfileMessage,
+                allowProfileEdit: allowProfileEdit,
+                isOnline: isOnline,
+                userId: userId,
+                appId: appId,
+                accessToken: accessToken,
+                theme: currentTheme,
+                setCurrentTheme: setCurrentTheme,
+                setCurrenttheme: setCurrentTheme,
+                isMultipleFilesMessageEnabled: isMultipleFilesMessageEnabled,
+                uikitUploadSizeLimit: uikitUploadSizeLimit,
+                uikitMultipleFilesMessageLimit: uikitMultipleFilesMessageLimit,
+                userListQuery: userListQuery,
+                logger: logger,
+                pubSub: pubSub,
+                imageCompression: _tslib.__assign({ compressionRate: 0.7 }, imageCompression),
+                voiceRecord: {
+                    maxRecordingTime: (_c = voiceRecord === null || voiceRecord === void 0 ? void 0 : voiceRecord.maxRecordingTime) !== null && _c !== void 0 ? _c : consts.VOICE_RECORDER_DEFAULT_MAX,
+                    minRecordingTime: (_d = voiceRecord === null || voiceRecord === void 0 ? void 0 : voiceRecord.minRecordingTime) !== null && _d !== void 0 ? _d : consts.VOICE_RECORDER_DEFAULT_MIN,
+                },
+                userMention: {
+                    maxMentionCount: (userMention === null || userMention === void 0 ? void 0 : userMention.maxMentionCount) || 10,
+                    maxSuggestionCount: (userMention === null || userMention === void 0 ? void 0 : userMention.maxSuggestionCount) || 15,
+                },
+                markAsReadScheduler: markAsReadScheduler,
+                markAsDeliveredScheduler: markAsDeliveredScheduler,
+                // From UIKitConfigProvider.localConfigs
+                disableUserProfile: !configs.common.enableUsingDefaultUserProfile,
+                isReactionEnabled: sdkInitialized && configsWithAppAttr(sdk).groupChannel.channel.enableReactions,
+                isMentionEnabled: configs.groupChannel.channel.enableMention,
+                isVoiceMessageEnabled: configs.groupChannel.channel.enableVoiceMessage,
+                replyType: resolvedReplyType.getCaseResolvedReplyType(configs.groupChannel.channel.replyType).upperCase,
+                isTypingIndicatorEnabledOnChannelList: configs.groupChannel.channelList.enableTypingIndicator,
+                isMessageReceiptStatusEnabledOnChannelList: configs.groupChannel.channelList.enableMessageReceiptStatus,
+                showSearchIcon: sdkInitialized && configsWithAppAttr(sdk).groupChannel.setting.enableMessageSearch,
+                // Remote configs set from dashboard by UIKit feature configuration
+                groupChannel: {
+                    enableOgtag: sdkInitialized && configsWithAppAttr(sdk).groupChannel.channel.enableOgtag,
+                    enableTypingIndicator: configs.groupChannel.channel.enableTypingIndicator,
+                    enableDocument: configs.groupChannel.channel.input.enableDocument,
+                    threadReplySelectType: resolvedReplyType.getCaseResolvedThreadReplySelectType(configs.groupChannel.channel.threadReplySelectType).lowerCase,
+                    typingIndicatorTypes: configs.groupChannel.channel.typingIndicatorTypes,
+                },
+                openChannel: {
+                    enableOgtag: sdkInitialized && configsWithAppAttr(sdk).openChannel.channel.enableOgtag,
+                    enableDocument: configs.openChannel.channel.input.enableDocument,
+                },
+            },
+            eventHandlers: eventHandlers,
+        } },
+        React.createElement(MediaQueryContext.MediaQueryProvider, { logger: logger, breakpoint: breakpoint },
+            React.createElement(LocalizationContext.LocalizationProvider, { stringSet: localeStringSet, dateLocale: dateLocale },
+                React.createElement(VoiceMessageProvider, { isVoiceMessageEnabled: configs.groupChannel.channel.enableVoiceMessage },
+                    React.createElement(hooks_useModal.GlobalModalProvider, null, children))))));
+};
+
+exports.useSendbirdStateContext = useSendbirdStateContext.useSendbirdStateContext;
+exports.SendbirdProvider = SendbirdProvider;
+exports.default = SendbirdProvider;
+//# sourceMappingURL=SendbirdProvider.js.map