@sendbird/uikit-react 3.15.4 → 3.15.5-rc

package/ui/TemplateMessageItemBody.js

@@ -1,21 +1,22 @@
-import { e as __extends, _ as __assign } from '../chunks/bundle-CYvEzbcv.js';
+import { e as __extends, _ as __assign } from '../chunks/bundle-BcMa6bRz.js';
 import React__default, { Component, useState, useEffect } from 'react';
-import { $ as startsWithAtAndEndsWithBraces, a0 as removeAtAndBraces, x as getClassName } from '../chunks/bundle-t_NHXb8k.js';
-import { M as MessageProvider, a as MessageTemplate, C as CompositeComponentType } from '../chunks/bundle-zxooGkqM.js';
+import { x as getClassName } from '../chunks/bundle-olFk3EFS.js';
+import { M as MessageProvider, a as MessageTemplate } from '../chunks/bundle-CPjZUpaJ.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
 import { FallbackTemplateMessageItemBody } from './FallbackTemplateMessageItemBody.tsx.js';
 import { LoadingTemplateMessageItemBody } from './LoadingTemplateMessageItemBody.tsx.js';
+import { i as MESSAGE_TEMPLATE_KEY } from '../chunks/bundle-Ncue9UT5.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-g4f6DqPZ.js';
-import '../chunks/bundle-S77tFmNz.js';
+import '../chunks/bundle-BDc7lm7H.js';
+import '../chunks/bundle-CMCuKccH.js';
 import '../withSendbird.js';
-import '../chunks/bundle-B8FD5WDF.js';
-import '../chunks/bundle-BtoO5ttX.js';
-import '../chunks/bundle-xPkUUY0y.js';
+import '../chunks/bundle-SphrgdI0.js';
+import '../chunks/bundle-InYgYKoj.js';
+import '../chunks/bundle-CnU1tGdg.js';
 import './Loader.js';
 import './Icon.js';
-import '../chunks/bundle-D8l9-enQ.js';
+import '../chunks/bundle-SWVu1WqU.js';
 
 var MessageTemplateWrapper = function (_a) {
     var message = _a.message, templateVersion = _a.templateVersion, templateItems = _a.templateItems;
@@ -23,73 +24,6 @@ var MessageTemplateWrapper = function (_a) {
         React__default.createElement(MessageTemplate, { templateVersion: templateVersion, templateItems: templateItems }));
 };
 
-var NumberValueKeys = [
-    'version',
-    'size',
-    'top',
-    'left',
-    'right',
-    'bottom',
-    'maxTextLines',
-    'value',
-    'pixelWidth',
-    'pixelHeight',
-    'radius',
-];
-function restoreNumbersFromMessageTemplateObject(value, key) {
-    if (Array.isArray(value)) {
-        return value.map(function (item) { return restoreNumbersFromMessageTemplateObject(item); });
-    }
-    if (value && typeof value === 'object') {
-        return Object.keys(value).reduce(function (acc, key) {
-            acc[key] = restoreNumbersFromMessageTemplateObject(value[key], key);
-            return acc;
-        }, {});
-    }
-    if (key != null && NumberValueKeys.includes(key)) {
-        var numberValue = Number(value);
-        return Number.isNaN(numberValue) ? value : numberValue;
-    }
-    return value;
-}
-
-var flattenObjectHelper = function (currentObject, flattenObject, parentKeyPath) {
-    if (parentKeyPath === void 0) { parentKeyPath = ''; }
-    for (var _i = 0, _a = Object.entries(currentObject); _i < _a.length; _i++) {
-        var _b = _a[_i], key = _b[0], value = _b[1];
-        var currentKeyPath = parentKeyPath ? "".concat(parentKeyPath, ".").concat(key) : key;
-        if (value && typeof value === 'object') {
-            flattenObjectHelper(value, flattenObject, currentKeyPath);
-        }
-        else {
-            flattenObject[currentKeyPath] = value;
-        }
-    }
-};
-/**
- * Returns flattened object.
- * ex.
- * given { key-1: { key-1.1: 'value-1.1' }, key-2: 'value-2' }
- * returns { key-1.key-1.1: 'value-1.1', key-2: 'value-2' }
- */
-function flattenObject(object) {
-    var result = {};
-    flattenObjectHelper(object, result);
-    return result;
-}
-
-function convertArgbToRgba(string) {
-    if (!string.startsWith('#')) {
-        return string;
-    }
-    if (string.length === 9) {
-        return "#".concat(string.slice(3)).concat(string[1]).concat(string[2]);
-    }
-    if (string.length === 5) {
-        return "#".concat(string.slice(2)).concat(string[1]);
-    }
-    return string;
-}
 var splitColorVariables = function (colorVariables) {
     var light = {};
     var dark = {};
@@ -120,46 +54,6 @@ function selectColorVariablesByTheme(_a) {
     return theme === 'light' ? light : dark;
 }
 
-var COLOR_KEYS = {
-    color: true,
-    tintColor: true,
-    backgroundColor: true,
-    borderColor: true,
-};
-function mapData(_a) {
-    var template = _a.template, source = _a.source;
-    if (!['object', 'string'].includes(typeof template) || !template)
-        return template;
-    var regex = /\{([^}]+)\}/g;
-    var flattenedSource = flattenObject(source);
-    function replaceVariablePlaceholder(value) {
-        return typeof value === 'string'
-            ? value.replace(regex, function (_, placeholder) {
-                var value = flattenedSource[placeholder];
-                return value || "{".concat(placeholder, "}");
-            })
-            : mapData({ template: value, source: source });
-    }
-    if (typeof template === 'string') {
-        return replaceVariablePlaceholder(template);
-    }
-    if (Array.isArray(template)) {
-        return template.map(replaceVariablePlaceholder);
-    }
-    var result = {};
-    for (var key in template) {
-        if (Object.prototype.hasOwnProperty.call(template, key)) {
-            var value = template[key];
-            var replacedVal = replaceVariablePlaceholder(value);
-            if (COLOR_KEYS[key] && typeof replacedVal === 'string') {
-                replacedVal = convertArgbToRgba(replacedVal);
-            }
-            result[key] = replacedVal;
-        }
-    }
-    return result;
-}
-
 var MessageTemplateErrorBoundary = /** @class */ (function (_super) {
     __extends(MessageTemplateErrorBoundary, _super);
     function MessageTemplateErrorBoundary(props) {
@@ -172,24 +66,44 @@ var MessageTemplateErrorBoundary = /** @class */ (function (_super) {
     };
     MessageTemplateErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
         var _a;
-        (_a = this.props.logger) === null || _a === void 0 ? void 0 : _a.error('Error caught by ErrorBoundary:', error, errorInfo);
+        (_a = this.props.logger) === null || _a === void 0 ? void 0 : _a.error('Error caught by ErrorBoundary: ', error, errorInfo);
     };
     MessageTemplateErrorBoundary.prototype.render = function () {
         if (this.state.hasError) {
-            this.props.onTemplateMessageRenderedCallback('failed');
             return this.props.fallbackMessage;
         }
-        this.props.onTemplateMessageRenderedCallback(this.props.isComposite ? 'composite' : 'simple');
         return this.props.children;
     };
     return MessageTemplateErrorBoundary;
 }(Component));
 
-var TEMPLATE_FETCH_RETRY_BUFFER_TIME_IN_MILLIES = 500; // It takes about 450ms for isError update
+var flattenObjectHelper = function (currentObject, flattenObject, parentKeyPath) {
+    if (parentKeyPath === void 0) { parentKeyPath = ''; }
+    for (var _i = 0, _a = Object.entries(currentObject); _i < _a.length; _i++) {
+        var _b = _a[_i], key = _b[0], value = _b[1];
+        var currentKeyPath = parentKeyPath ? "".concat(parentKeyPath, ".").concat(key) : key;
+        if (value && typeof value === 'object') {
+            flattenObjectHelper(value, flattenObject, currentKeyPath);
+        }
+        else {
+            flattenObject[currentKeyPath] = value;
+        }
+    }
+};
 /**
- * Returns copied message template object filled with given template data and color variables.
+ * Returns flattened object.
+ * ex.
+ * given { key-1: { key-1.1: 'value-1.1' }, key-2: 'value-2' }
+ * returns { key-1.key-1.1: 'value-1.1', key-2: 'value-2' }
  */
-var getFilledMessageTemplateWithData = function (_a) {
+function flattenObject(object) {
+    var result = {};
+    flattenObjectHelper(object, result);
+    return result;
+}
+
+var TEMPLATE_FETCH_RETRY_BUFFER_TIME_IN_MILLIES = 500; // It takes about 450ms for isError update
+var replaceVariablesInTemplateString = function (_a) {
     var template = _a.template, _b = _a.templateData, templateData = _b === void 0 ? {} : _b, colorVariables = _a.colorVariables, theme = _a.theme;
     var selectedThemeColorVariables = {};
     if (colorVariables && theme) {
@@ -199,18 +113,21 @@ var getFilledMessageTemplateWithData = function (_a) {
         });
     }
     var source = __assign(__assign({}, templateData), selectedThemeColorVariables);
-    var parsedTemplate = mapData({
-        template: restoreNumbersFromMessageTemplateObject(template),
-        source: source,
+    var flattenedSource = flattenObject(source);
+    var replaced = template;
+    Object.entries(flattenedSource).forEach(function (_a) {
+        var key = _a[0], val = _a[1];
+        var pattern = "\\{".concat(key, "\\}");
+        var regex = new RegExp(pattern, 'g');
+        replaced = replaced.replace(regex, val);
     });
-    return parsedTemplate;
+    return replaced;
 };
 function TemplateMessageItemBody(_a) {
-    var _b, _c;
-    var _d = _a.className, className = _d === void 0 ? '' : _d, message = _a.message, _e = _a.isByMe, isByMe = _e === void 0 ? false : _e, _f = _a.theme, theme = _f === void 0 ? 'light' : _f, _g = _a.onTemplateMessageRenderedCallback, onTemplateMessageRenderedCallback = _g === void 0 ? function () { } : _g;
-    var templateData = (_b = message.extendedMessagePayload) === null || _b === void 0 ? void 0 : _b['template'];
+    var _b;
+    var _c = _a.className, className = _c === void 0 ? '' : _c, message = _a.message, _d = _a.isByMe, isByMe = _d === void 0 ? false : _d, _e = _a.theme, theme = _e === void 0 ? 'light' : _e;
+    var templateData = (_b = message.extendedMessagePayload) === null || _b === void 0 ? void 0 : _b[MESSAGE_TEMPLATE_KEY];
     var getFailedBody = function () {
-        onTemplateMessageRenderedCallback('failed');
         return React__default.createElement(FallbackTemplateMessageItemBody, { className: className, message: message, isByMe: isByMe });
     };
     if (!(templateData === null || templateData === void 0 ? void 0 : templateData.key)) {
@@ -221,72 +138,94 @@ function TemplateMessageItemBody(_a) {
     if (!globalState) {
         return getFailedBody();
     }
-    var _h = globalState.utils, getCachedTemplate = _h.getCachedTemplate, updateMessageTemplatesInfo = _h.updateMessageTemplatesInfo;
     var logger = globalState.config.logger;
+    var _f = globalState.utils, getCachedTemplate = _f.getCachedTemplate, updateMessageTemplatesInfo = _f.updateMessageTemplatesInfo;
     var waitingTemplateKeysMap = globalState.stores.appInfoStore.waitingTemplateKeysMap;
     var waitingTemplateKeysMapString = Object.entries(waitingTemplateKeysMap)
         .map(function (_a) {
         var key = _a[0], value = _a[1];
         return [key, value.requestedAt, value.erroredMessageIds.join(',')].join('-');
     }).join('_');
-    var _j = useState(getFilledMessageTemplateItems()), renderData = _j[0], setRenderData = _j[1];
-    function getFilledMessageTemplateItemsForCarouselTemplateByMessagePayload(simpleTemplateDataList) {
-        var cachedSimpleTemplates = [];
-        var simpleTemplatesVariables = [];
-        var maxVersion = 0;
-        simpleTemplateDataList.forEach(function (simpleTemplateData) {
-            var simpleTemplateKey = simpleTemplateData.key;
-            if (!simpleTemplateKey) {
-                logger.error('TemplateMessageItemBody | simple template keys are not found in view_variables: ', simpleTemplateDataList);
-                throw new Error('TemplateMessageItemBody | simple template keys are not found in view_variables.');
-            }
-            var simpleCachedTemplate = getCachedTemplate(simpleTemplateKey);
-            if (simpleCachedTemplate) {
-                cachedSimpleTemplates.push(simpleCachedTemplate);
-                simpleTemplatesVariables.push(simpleTemplateData.variables);
-                maxVersion = Math.max(maxVersion, simpleCachedTemplate.version);
-            }
-        });
-        var filledMessageTemplateItemsList = cachedSimpleTemplates
-            .map(function (cachedSimpleTemplate, index) {
-            var templateItems = JSON.parse(cachedSimpleTemplate.uiTemplate);
-            var filledMessageTemplateItems = getFilledMessageTemplateWithData({
-                template: templateItems,
-                templateData: simpleTemplatesVariables[index],
-                colorVariables: cachedSimpleTemplate.colorVariables,
-                theme: theme,
-            });
-            return filledMessageTemplateItems;
-        });
-        return {
-            maxVersion: maxVersion,
-            filledTemplates: filledMessageTemplateItemsList,
-        };
+    var _g = useState(getFilledMessageTemplateItems()), renderData = _g[0], setRenderData = _g[1];
+    function findSubstrings(input, matchString) {
+        var indices = [];
+        var startIndex = 0;
+        while ((startIndex = input.indexOf(matchString, startIndex)) !== -1) {
+            indices.push({ start: startIndex, end: startIndex + matchString.length });
+            startIndex += matchString.length;
+        }
+        return indices;
     }
-    function getFilledMessageTemplateItemsForCarouselTemplate(uiTemplates) {
-        var maxVersion = 0;
-        var filledTemplates = [];
-        uiTemplates.forEach(function (uiTemplate) {
-            maxVersion = Math.max(maxVersion, uiTemplate.version);
-            var filledMessageTemplateItems = getFilledMessageTemplateWithData({
-                template: uiTemplate.body.items,
-            });
-            filledTemplates.push(filledMessageTemplateItems);
+    function replaceAtIndices(input, indices, replacement) {
+        var result = '';
+        var lastIndex = 0;
+        indices.forEach(function (_a) {
+            var start = _a.start, end = _a.end;
+            result += input.slice(lastIndex, start) + replacement;
+            lastIndex = end;
         });
-        return {
-            maxVersion: maxVersion,
-            filledTemplates: filledTemplates,
-        };
+        // Add any remaining part of the string after the last match
+        result += input.slice(lastIndex);
+        return result;
     }
-    function getFilledMessageTemplateItemsForSimpleTemplate(templateItems, colorVariables) {
-        var _a;
-        var filledMessageTemplateItems = getFilledMessageTemplateWithData({
-            template: templateItems,
-            templateData: (_a = templateData === null || templateData === void 0 ? void 0 : templateData.variables) !== null && _a !== void 0 ? _a : {},
-            colorVariables: colorVariables,
+    function replaceReservationKeys(templateString, reservationKey, replacement) {
+        var indices = findSubstrings(templateString, reservationKey);
+        return replaceAtIndices(templateString, indices, replacement);
+    }
+    /**
+     * Returns filled rootTemplate. Given rootTemplate,
+     * 1. replace any reservation key with matching cached template,
+     * 2. fill variables and view_variables.
+     *
+     * Assume below facts:
+     * - carousel type template cannot have a carousel typed template in any
+     * depth of items.
+     * - However, box type template can have a carousel typed template in any
+     * depth of items.
+     *
+     * @param rootTemplate
+     */
+    function getFilledRootTemplate(rootTemplate) {
+        var rootTemplateString = replaceVariablesInTemplateString({
+            template: rootTemplate.uiTemplate,
+            templateData: templateData.variables,
+            colorVariables: rootTemplate.colorVariables,
             theme: theme,
         });
-        return filledMessageTemplateItems;
+        if (templateData.view_variables) {
+            var reservationKeyToItems_1 = {};
+            Object.entries(templateData.view_variables).forEach(function (_a) {
+                var reservationKey = _a[0], simpleTemplateDataList = _a[1];
+                var filledSimpleTemplates = [];
+                simpleTemplateDataList.forEach(function (simpleTemplateData) {
+                    var simpleTemplateKey = simpleTemplateData === null || simpleTemplateData === void 0 ? void 0 : simpleTemplateData.key;
+                    if (simpleTemplateKey) {
+                        var cachedTemplate = getCachedTemplate(simpleTemplateKey);
+                        if (!cachedTemplate) {
+                            logger.error('TemplateMessageItemBody | simple template is expected to be cached: ', simpleTemplateKey);
+                        }
+                        var items = replaceVariablesInTemplateString({
+                            template: cachedTemplate.uiTemplate,
+                            templateData: simpleTemplateData.variables,
+                            colorVariables: cachedTemplate.colorVariables,
+                            theme: theme,
+                        });
+                        filledSimpleTemplates.push({
+                            version: cachedTemplate.version,
+                            body: {
+                                items: JSON.parse(items),
+                            },
+                        });
+                        reservationKeyToItems_1[reservationKey] = JSON.stringify(filledSimpleTemplates);
+                    }
+                });
+            });
+            Object.entries(reservationKeyToItems_1).forEach(function (_a) {
+                var reservationKey = _a[0], filledSimpleTemplates = _a[1];
+                rootTemplateString = replaceReservationKeys(rootTemplateString, "\"@{".concat(reservationKey, "}\""), filledSimpleTemplates);
+            });
+        }
+        return JSON.parse(rootTemplateString);
     }
     function getFilledMessageTemplateItems() {
         var result = {
@@ -324,75 +263,15 @@ function TemplateMessageItemBody(_a) {
                 tryFetchTemplateByKey(nonCachedTemplateKeys);
             }
             else if (cachedTemplate) {
-                var parsedUiTemplate = JSON.parse(cachedTemplate.uiTemplate);
-                if (!Array.isArray(parsedUiTemplate) || parsedUiTemplate.length === 0) {
-                    logger.error('TemplateMessageItemBody | parsed template is missing ui_template: ', parsedUiTemplate);
-                    throw new Error('TemplateMessageItemBody | parsed template is missing ui_template. See error log in console for details');
-                }
-                /**
-                 * Composite template validation
-                 */
-                if (parsedUiTemplate[0].type === CompositeComponentType.Carousel) {
-                    var carouselItem = parsedUiTemplate[0];
-                    if (parsedUiTemplate.length > 1) { // TODO: in future, support multiple templates
-                        logger.error('TemplateMessageItemBody | composite template currently does not support multiple items: ', parsedUiTemplate);
-                        throw new Error('TemplateMessageItemBody | composite template currently does not support multiple items. See error log in console for details');
-                    }
-                    if (typeof carouselItem.items === 'string') {
-                        if (!startsWithAtAndEndsWithBraces(carouselItem.items)) {
-                            logger.error('TemplateMessageItemBody | composite template with reservation key must follow the following string format "{@your-reservation-key}": ', templateKey, carouselItem);
-                            throw new Error('TemplateMessageItemBody | composite template with reservation key must follow the following string format "{@your-reservation-key}". See error log in console for details');
-                        }
-                        if (!(templateData === null || templateData === void 0 ? void 0 : templateData.view_variables)) {
-                            logger.error('TemplateMessageItemBody | template key suggests composite template but template data is missing view_variables: ', templateKey, templateData);
-                            throw new Error('TemplateMessageItemBody | template key suggests composite template but template data is missing view_variables. See error log in console for details');
-                        }
-                        var reservationKey = removeAtAndBraces(carouselItem.items);
-                        var simpleTemplateDataList = templateData.view_variables[reservationKey];
-                        if (!simpleTemplateDataList) {
-                            logger.error('TemplateMessageItemBody | no reservation key found in view_variables: ', reservationKey, templateData.view_variables);
-                            throw new Error('TemplateMessageItemBody | no reservation key found in view_variables. See error log in console for details');
-                        }
-                        if (simpleTemplateDataList.length > 10) {
-                            logger.warning('TemplateMessageItemBody | composite template with more than 10 simple templates will only render the first 10 items: ', reservationKey, templateData.view_variables);
-                            simpleTemplateDataList = simpleTemplateDataList.slice(0, 10);
-                        }
-                        var _a = getFilledMessageTemplateItemsForCarouselTemplateByMessagePayload(simpleTemplateDataList), maxVersion = _a.maxVersion, filledTemplates = _a.filledTemplates;
-                        result.isComposite = true;
-                        result.templateVersion = Math.max(cachedTemplate.version, maxVersion);
-                        result.filledMessageTemplateItemsList = [{
-                                type: carouselItem.type,
-                                spacing: carouselItem.spacing,
-                                items: filledTemplates,
-                            }];
-                    }
-                    else if (Array.isArray(carouselItem.items)) {
-                        var simpleTemplates = carouselItem.items;
-                        if (carouselItem.items.length > 10) {
-                            logger.warning('TemplateMessageItemBody | composite template with more than 10 simple templates will only render the first 10 items: ', carouselItem);
-                            simpleTemplates = carouselItem.items.slice(0, 10);
-                        }
-                        var _b = getFilledMessageTemplateItemsForCarouselTemplate(simpleTemplates), maxVersion = _b.maxVersion, filledTemplates = _b.filledTemplates;
-                        result.isComposite = true;
-                        result.templateVersion = Math.max(cachedTemplate.version, maxVersion);
-                        result.filledMessageTemplateItemsList = [{
-                                type: carouselItem.type,
-                                spacing: carouselItem.spacing,
-                                items: filledTemplates,
-                            }];
-                    }
-                    else {
-                        logger.error('TemplateMessageItemBody | composite template is malformed: ', templateKey, carouselItem);
-                        throw new Error('TemplateMessageItemBody | composite template is malformed. See error log in console for details');
-                    }
-                }
-                else {
-                    result.templateVersion = cachedTemplate.version;
-                    result.filledMessageTemplateItemsList = getFilledMessageTemplateItemsForSimpleTemplate(parsedUiTemplate, cachedTemplate.colorVariables);
-                }
+                var items = getFilledRootTemplate(cachedTemplate);
+                result.filledMessageTemplateItemsList.push({
+                    version: cachedTemplate.version,
+                    items: items,
+                });
             }
         }
         catch (e) {
+            logger.error('TemplateMessageItemBody | fetching non-cached templates by given template keys failed: ', e);
             result.isErrored = true;
         }
         return result;
@@ -444,9 +323,11 @@ function TemplateMessageItemBody(_a) {
             isByMe ? 'outgoing' : 'incoming',
             'sendbird-template-message-item-body',
         ]) },
-        React__default.createElement(MessageTemplateErrorBoundary, { fallbackMessage: React__default.createElement(FallbackTemplateMessageItemBody, { className: className, message: message, isByMe: isByMe }), onTemplateMessageRenderedCallback: onTemplateMessageRenderedCallback, isComposite: renderData.isComposite, logger: logger },
-            React__default.createElement(MessageTemplateWrapper, { message: message, templateVersion: (_c = renderData.templateVersion) !== null && _c !== void 0 ? _c : 0, templateItems: renderData.filledMessageTemplateItemsList }))));
+        React__default.createElement(MessageTemplateErrorBoundary, { fallbackMessage: React__default.createElement(FallbackTemplateMessageItemBody, { className: className, message: message, isByMe: isByMe }), logger: logger }, renderData.filledMessageTemplateItemsList.map(function (filledMessageTemplateItem, i) {
+            var _a;
+            return (React__default.createElement(MessageTemplateWrapper, { key: i, message: message, templateVersion: (_a = filledMessageTemplateItem.version) !== null && _a !== void 0 ? _a : 0, templateItems: filledMessageTemplateItem.items }));
+        }))));
 }
 
-export { TemplateMessageItemBody, TemplateMessageItemBody as default };
+export { TemplateMessageItemBody, TemplateMessageItemBody as default, replaceVariablesInTemplateString };
 //# sourceMappingURL=TemplateMessageItemBody.js.map

package/ui/TemplateMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"TemplateMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"TemplateMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/ui/TextButton.js

@@ -1,6 +1,6 @@
-import { c as __spreadArray } from '../chunks/bundle-CYvEzbcv.js';
+import { c as __spreadArray } from '../chunks/bundle-BcMa6bRz.js';
 import React__default from 'react';
-import { C as Colors, c as changeColorToClassName } from '../chunks/bundle-1AhxUDPU.js';
+import { C as Colors, c as changeColorToClassName } from '../chunks/bundle-aVMDbd16.js';
 
 var TextButton = function (_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.color, color = _c === void 0 ? Colors.ONBACKGROUND_1 : _c, _d = _a.disabled, disabled = _d === void 0 ? false : _d, _e = _a.disableUnderline, disableUnderline = _e === void 0 ? false : _e, _f = _a.onClick, onClick = _f === void 0 ? function () { } : _f, children = _a.children;

package/ui/TextMessageItemBody.js

@@ -1,43 +1,43 @@
 import React__default, { useContext, useMemo } from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-xPkUUY0y.js';
-import { x as getClassName, d as isEditedMessage } from '../chunks/bundle-t_NHXb8k.js';
-import { L as LocalizationContext } from '../chunks/bundle-B8FD5WDF.js';
-import { t as tokenizeMessage } from '../chunks/bundle-BHGFStnL.js';
-import { T as TextFragment } from '../chunks/bundle-C_xDLLUt.js';
-import { T as TEXT_MESSAGE_BODY_CLASSNAME } from '../chunks/bundle-02mU_mdQ.js';
-import '../chunks/bundle-CYvEzbcv.js';
-import '../chunks/bundle-BtoO5ttX.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-CnU1tGdg.js';
+import { x as getClassName, d as isEditedMessage } from '../chunks/bundle-olFk3EFS.js';
+import { L as LocalizationContext } from '../chunks/bundle-SphrgdI0.js';
+import { t as tokenizeMessage } from '../chunks/bundle-BW_e3YLX.js';
+import { T as TextFragment } from '../chunks/bundle-DQZrZMxL.js';
+import { T as TEXT_MESSAGE_BODY_CLASSNAME } from '../chunks/bundle-C0IbzUJG.js';
+import '../chunks/bundle-BcMa6bRz.js';
+import '../chunks/bundle-InYgYKoj.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-g4f6DqPZ.js';
-import '../chunks/bundle-S77tFmNz.js';
+import '../chunks/bundle-BDc7lm7H.js';
+import '../chunks/bundle-CMCuKccH.js';
+import '../chunks/bundle-Ncue9UT5.js';
 import '../Message/context.js';
 import './MentionLabel.js';
-import '../chunks/bundle-BtnCB-7T.js';
+import '../chunks/bundle-DHJxhHOQ.js';
 import 'react-dom';
-import '../chunks/bundle-D8l9-enQ.js';
+import '../chunks/bundle-SWVu1WqU.js';
 import '@sendbird/chat';
 import '@sendbird/chat/openChannel';
 import './SortByRow.js';
-import '../chunks/bundle-DPIvYZBS.js';
+import '../chunks/bundle-WWn_D4d2.js';
 import '../withSendbird.js';
 import './IconButton.js';
 import './UserProfile.js';
-import '../chunks/bundle-fSCONSew.js';
+import '../chunks/bundle-CrBkSKYR.js';
 import '@sendbird/uikit-tools';
-import '../chunks/bundle-v3c-9N0A.js';
-import '../chunks/bundle-DZK4rg_Y.js';
+import '../chunks/bundle-DD_n8b-U.js';
+import '../chunks/bundle-BlC-a9vb.js';
 import './Button.js';
 import './Icon.js';
 import 'css-vars-ponyfill';
-import '../chunks/bundle-CZxcoh5B.js';
-import '../chunks/bundle-BoeyQYjc.js';
+import '../chunks/bundle-D0tTmUIi.js';
 import '../useSendbirdStateContext.js';
 import '../sendbirdSelectors.js';
-import '../chunks/bundle-Dw-CkW5p.js';
-import '../chunks/bundle-Cdoy9-UG.js';
+import '../chunks/bundle-DPAgdcbr.js';
+import '../chunks/bundle-q9l437Kc.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-D48t2vTo.js';
+import '../chunks/bundle-B-KvpqF_.js';
 import './LinkLabel.js';
 
 function TextMessageItemBody(_a) {

package/ui/ThreadReplies.js

@@ -1,13 +1,13 @@
 import React__default from 'react';
-import { A as Avatar } from '../chunks/bundle-Cdoy9-UG.js';
+import { A as Avatar } from '../chunks/bundle-q9l437Kc.js';
 import Icon, { IconTypes, IconColors } from './Icon.js';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-xPkUUY0y.js';
-import { u as useLocalization } from '../chunks/bundle-B8FD5WDF.js';
-import '../chunks/bundle-CYvEzbcv.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-CnU1tGdg.js';
+import { u as useLocalization } from '../chunks/bundle-SphrgdI0.js';
+import '../chunks/bundle-BcMa6bRz.js';
 import './ImageRenderer.js';
-import '../chunks/bundle-D8l9-enQ.js';
-import '../chunks/bundle-D48t2vTo.js';
-import '../chunks/bundle-BtoO5ttX.js';
+import '../chunks/bundle-SWVu1WqU.js';
+import '../chunks/bundle-B-KvpqF_.js';
+import '../chunks/bundle-InYgYKoj.js';
 
 function ThreadReplies(_a, ref) {
     var _b;

package/ui/ThumbnailMessageItemBody.js

@@ -1,16 +1,17 @@
-import { _ as __assign } from '../chunks/bundle-CYvEzbcv.js';
+import { _ as __assign } from '../chunks/bundle-BcMa6bRz.js';
 import React__default, { useState } from 'react';
 import Icon, { IconTypes, IconColors } from './Icon.js';
 import ImageRenderer from './ImageRenderer.js';
-import { x as getClassName, r as isVideoMessage, s as isGifMessage, q as isSentMessage } from '../chunks/bundle-t_NHXb8k.js';
-import { n as noop } from '../chunks/bundle-D8l9-enQ.js';
-import { u as useLongPress } from '../chunks/bundle-CM8k_MAe.js';
-import { c as getMessageFirstFileThumbnailUrl, g as getMessageFirstFileUrl, a as getMessageFirstFileType } from '../chunks/bundle-07bGaKDM.js';
+import { x as getClassName, r as isVideoMessage, s as isGifMessage, q as isSentMessage } from '../chunks/bundle-olFk3EFS.js';
+import { n as noop } from '../chunks/bundle-SWVu1WqU.js';
+import { u as useLongPress } from '../chunks/bundle-qFmHm75z.js';
+import { c as getMessageFirstFileThumbnailUrl, g as getMessageFirstFileUrl, a as getMessageFirstFileType } from '../chunks/bundle-Dph9R1sB.js';
 import '@sendbird/chat/groupChannel';
 import '../utils/message/getOutgoingMessageState.js';
-import '../chunks/bundle-g4f6DqPZ.js';
-import '../chunks/bundle-S77tFmNz.js';
-import '../chunks/bundle-DZK4rg_Y.js';
+import '../chunks/bundle-BDc7lm7H.js';
+import '../chunks/bundle-CMCuKccH.js';
+import '../chunks/bundle-Ncue9UT5.js';
+import '../chunks/bundle-BlC-a9vb.js';
 
 function ThumbnailMessageItemBody(_a) {
     var _b, _c;

package/ui/ThumbnailMessageItemBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThumbnailMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ThumbnailMessageItemBody.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/ui/Toggle.js

@@ -1,5 +1,5 @@
 import React__default, { useState, useCallback } from 'react';
-import { _ as __assign } from '../chunks/bundle-CYvEzbcv.js';
+import { _ as __assign } from '../chunks/bundle-BcMa6bRz.js';
 import { useSendbirdStateContext } from '../useSendbirdStateContext.js';
 import '../withSendbird.js';
 

package/ui/Tooltip.js

@@ -1,7 +1,7 @@
-import { c as __spreadArray } from '../chunks/bundle-CYvEzbcv.js';
+import { c as __spreadArray } from '../chunks/bundle-BcMa6bRz.js';
 import React__default from 'react';
-import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-xPkUUY0y.js';
-import '../chunks/bundle-BtoO5ttX.js';
+import { L as Label, a as LabelTypography, b as LabelColors } from '../chunks/bundle-CnU1tGdg.js';
+import '../chunks/bundle-InYgYKoj.js';
 
 function Tooltip(_a) {
     var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.children, children = _c === void 0 ? '' : _c;

package/ui/TooltipWrapper.js

@@ -1,4 +1,4 @@
-import { c as __spreadArray } from '../chunks/bundle-CYvEzbcv.js';
+import { c as __spreadArray } from '../chunks/bundle-BcMa6bRz.js';
 import React__default, { useState, useRef } from 'react';
 
 var SPACE_FROM_TRIGGER = 8;