@uzum-tech/ui 2.3.2 → 2.3.4

package/lib/chat/src/ChatMainArea.js

@@ -8,6 +8,17 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -34,6 +45,9 @@ const SENDING_DELAY = 100;
 exports.chatMainAreaProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { selectedChat: {
         type: Object,
         default: undefined
+    }, inputValue: {
+        type: String,
+        default: undefined
     }, messages: {
         type: Array,
         default: () => []
@@ -121,6 +135,9 @@ exports.chatMainAreaProps = Object.assign(Object.assign({}, _mixins_1.useTheme.p
     }, onFooterInputChange: {
         type: Function,
         default: undefined
+    }, 'onUpdate:inputValue': {
+        type: Function,
+        default: undefined
     }, onChatClose: {
         type: Function,
         default: undefined
@@ -147,7 +164,7 @@ exports.default = (0, vue_1.defineComponent)({
     name: 'ChatMainArea',
     props: exports.chatMainAreaProps,
     setup(props, { slots }) {
-        var _a, _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, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16;
+        var _a, _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, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13, _14, _15, _16, _17, _18;
         const UChat = (0, vue_1.inject)(interface_1.chatInjectionKey, null);
         const isStandalone = !UChat;
         const { mergedClsPrefixRef } = (0, _mixins_1.useConfig)(props);
@@ -167,6 +184,11 @@ exports.default = (0, vue_1.defineComponent)({
         const headerProfileIconPropsRef = (_o = UChat === null || UChat === void 0 ? void 0 : UChat.headerProfileIconPropsRef) !== null && _o !== void 0 ? _o : (0, vue_1.toRef)(props, 'headerProfileIconProps');
         const messageUploadPropsRef = (_p = UChat === null || UChat === void 0 ? void 0 : UChat.messageUploadPropsRef) !== null && _p !== void 0 ? _p : (0, vue_1.toRef)(props, 'messageUploadProps');
         const footerInputPropsRef = (_q = UChat === null || UChat === void 0 ? void 0 : UChat.footerInputPropsRef) !== null && _q !== void 0 ? _q : (0, vue_1.toRef)(props, 'footerInputProps');
+        const safeFooterInputPropsRef = (0, vue_1.computed)(() => {
+            var _a;
+            const _b = (_a = footerInputPropsRef.value) !== null && _a !== void 0 ? _a : {}, { value } = _b, rest = __rest(_b, ["value"]);
+            return rest;
+        });
         const footerButtonPropsRef = (_r = UChat === null || UChat === void 0 ? void 0 : UChat.footerButtonPropsRef) !== null && _r !== void 0 ? _r : (0, vue_1.toRef)(props, 'footerButtonProps');
         const footerUploadPropsRef = (_s = UChat === null || UChat === void 0 ? void 0 : UChat.footerUploadPropsRef) !== null && _s !== void 0 ? _s : (0, vue_1.toRef)(props, 'footerUploadProps');
         const footerIconPropsRef = (_t = UChat === null || UChat === void 0 ? void 0 : UChat.footerIconPropsRef) !== null && _t !== void 0 ? _t : (0, vue_1.toRef)(props, 'footerIconProps');
@@ -237,7 +259,26 @@ exports.default = (0, vue_1.defineComponent)({
         const themeClassHandle = (0, _mixins_1.useThemeClass)('chat-main-area', (0, vue_1.computed)(() => ''), cssVarsRef, props);
         const messagesBodyRef = (0, vue_1.ref)();
         const inputRef = (0, vue_1.ref)();
-        const inputValue = (0, vue_1.ref)('');
+        const uncontrolledInputValueRef = (0, vue_1.ref)((_17 = props.inputValue) !== null && _17 !== void 0 ? _17 : '');
+        const handleInputValueChange = (_18 = UChat === null || UChat === void 0 ? void 0 : UChat.handleInputValueChange) !== null && _18 !== void 0 ? _18 : ((value) => {
+            var _a;
+            uncontrolledInputValueRef.value = value;
+            (_a = props['onUpdate:inputValue']) === null || _a === void 0 ? void 0 : _a.call(props, value);
+        });
+        const inputValue = (0, vue_1.computed)({
+            get: () => {
+                var _a;
+                if (UChat) {
+                    return (_a = UChat.inputValueRef.value) !== null && _a !== void 0 ? _a : '';
+                }
+                return props.inputValue !== undefined
+                    ? props.inputValue
+                    : uncontrolledInputValueRef.value;
+            },
+            set: (value) => {
+                handleInputValueChange(value);
+            }
+        });
         const attachmentFileList = (0, vue_1.ref)([]);
         const uploadedAttachmentsMap = (0, vue_1.ref)(new Map());
         const lastScrollTop = (0, vue_1.ref)(0);
@@ -634,12 +675,14 @@ exports.default = (0, vue_1.defineComponent)({
                                         chatInputs.value[selectedChatRef.value.id] = value;
                                     }
                                 }, onKeydown: (e) => {
+                                    var _a, _b;
+                                    (_b = (_a = footerInputPropsRef.value) === null || _a === void 0 ? void 0 : _a.onKeydown) === null || _b === void 0 ? void 0 : _b.call(_a, e);
                                     if (e.key === 'Enter' && !e.shiftKey) {
                                         e.preventDefault();
                                         e.stopPropagation();
                                         void handleSendMessage();
                                     }
-                                } }, footerInputPropsRef.value), {
+                                } }, safeFooterInputPropsRef.value), {
                                 prefix: () => renderEditingBlock(),
                                 suffix: () => ((0, vue_1.h)(icon_1.UIcon, Object.assign({ size: 24, class: `${mergedClsPrefixRef.value}-chat-main__input-suffix` }, footerSuffixIconPropsRef.value, { theme: mergedThemeRef.value.peers.FooterSuffixIcon, themeOverrides: mergedThemeRef.value.peerOverrides
                                         .FooterSuffixIcon, onClick: () => {
@@ -658,6 +701,8 @@ exports.default = (0, vue_1.defineComponent)({
                 mergedClsPrefixRef,
                 mergedThemeRef,
                 selectedChatRef,
+                inputValueRef: inputValue,
+                handleInputValueChange,
                 messagesRef,
                 typingChatIdsRef,
                 messagesLoadingRef,