@uzum-tech/ui 2.3.5 → 2.3.7

package/es/chat/src/ChatMainArea.d.ts

@@ -1,5 +1,6 @@
 import type { PropType, Ref } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
+import type { MarkdownOptions } from '../../_utils/markdown';
 import type { ButtonProps } from '../../button';
 import type { IconProps } from '../../icon';
 import type { InputProps } from '../../input';
@@ -114,6 +115,14 @@ export declare const chatMainAreaProps: {
         readonly type: StringConstructor;
         readonly default: undefined;
     };
+    readonly markdown: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly markdownOptions: {
+        readonly type: PropType<MarkdownOptions>;
+        readonly default: undefined;
+    };
     readonly bubbleActions: {
         readonly type: PropType<ChatBubbleAction[]>;
         readonly default: undefined;
@@ -193,6 +202,13 @@ export declare const chatMainAreaProps: {
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -966,6 +982,17 @@ export declare const chatMainAreaProps: {
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -1048,6 +1075,13 @@ export declare const chatMainAreaProps: {
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -1821,6 +1855,17 @@ export declare const chatMainAreaProps: {
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -1903,6 +1948,13 @@ export declare const chatMainAreaProps: {
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -2676,6 +2728,17 @@ export declare const chatMainAreaProps: {
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -2838,6 +2901,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly type: StringConstructor;
         readonly default: undefined;
     };
+    readonly markdown: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly markdownOptions: {
+        readonly type: PropType<MarkdownOptions>;
+        readonly default: undefined;
+    };
     readonly bubbleActions: {
         readonly type: PropType<ChatBubbleAction[]>;
         readonly default: undefined;
@@ -2917,6 +2988,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -3690,6 +3768,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -3772,6 +3861,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -4545,6 +4641,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -4627,6 +4734,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -5400,6 +5514,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -5453,7 +5578,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     }>>>;
 }>, {
     mergedClsPrefix: Ref<string, string>;
-    mergedTheme: Ref<{
+    mergedTheme: import("vue").ComputedRef<{
         common: import("../..").ThemeCommonVars;
         self: {
             backgroundColor: string;
@@ -5486,6 +5611,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             inputSuffixColor: string;
             unreadNotificationBackgroundColor: string;
             unreadNotificationTextColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
             typingIndicatorColor: string;
             dateSeparatorColor: string;
             dateSeparatorBackgroundColor: string;
@@ -6260,6 +6392,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 serviceMessageTextColor: string;
                 serviceMessageBackgroundColor: string;
                 messageTitleColor: string;
+                markdownQuoteBorderColorOwn: string;
+                markdownQuoteBorderColorOther: string;
+                markdownQuoteTextColor: string;
+                markdownQuoteBackgroundColor: string;
+                markdownQuoteMarkerColor: string;
+                markdownDividerColorOwn: string;
+                markdownDividerColorOther: string;
+                markdownH1FontSize: string;
+                markdownH2FontSize: string;
+                markdownH3FontSize: string;
+                markdownTextFontSize: string;
             }, {
                 StatusIcon: import("../../_mixins").Theme<"Icon", {
                     color: string;
@@ -6700,7 +6843,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 } | undefined;
             } | undefined;
         };
-    }, {
+    }> | Ref<{
         common: import("../..").ThemeCommonVars;
         self: {
             backgroundColor: string;
@@ -6733,6 +6876,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             inputSuffixColor: string;
             unreadNotificationBackgroundColor: string;
             unreadNotificationTextColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
             typingIndicatorColor: string;
             dateSeparatorColor: string;
             dateSeparatorBackgroundColor: string;
@@ -7507,6 +7657,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 serviceMessageTextColor: string;
                 serviceMessageBackgroundColor: string;
                 messageTitleColor: string;
+                markdownQuoteBorderColorOwn: string;
+                markdownQuoteBorderColorOther: string;
+                markdownQuoteTextColor: string;
+                markdownQuoteBackgroundColor: string;
+                markdownQuoteMarkerColor: string;
+                markdownDividerColorOwn: string;
+                markdownDividerColorOther: string;
+                markdownH1FontSize: string;
+                markdownH2FontSize: string;
+                markdownH3FontSize: string;
+                markdownTextFontSize: string;
             }, {
                 StatusIcon: import("../../_mixins").Theme<"Icon", {
                     color: string;
@@ -7947,7 +8108,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 } | undefined;
             } | undefined;
         };
-    }> | import("vue").ComputedRef<{
+    }, {
         common: import("../..").ThemeCommonVars;
         self: {
             backgroundColor: string;
@@ -7980,6 +8141,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             inputSuffixColor: string;
             unreadNotificationBackgroundColor: string;
             unreadNotificationTextColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
             typingIndicatorColor: string;
             dateSeparatorColor: string;
             dateSeparatorBackgroundColor: string;
@@ -8754,6 +8922,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
                 serviceMessageTextColor: string;
                 serviceMessageBackgroundColor: string;
                 messageTitleColor: string;
+                markdownQuoteBorderColorOwn: string;
+                markdownQuoteBorderColorOther: string;
+                markdownQuoteTextColor: string;
+                markdownQuoteBackgroundColor: string;
+                markdownQuoteMarkerColor: string;
+                markdownDividerColorOwn: string;
+                markdownDividerColorOther: string;
+                markdownH1FontSize: string;
+                markdownH2FontSize: string;
+                markdownH3FontSize: string;
+                markdownTextFontSize: string;
             }, {
                 StatusIcon: import("../../_mixins").Theme<"Icon", {
                     color: string;
@@ -9323,6 +9502,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly type: StringConstructor;
         readonly default: undefined;
     };
+    readonly markdown: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    readonly markdownOptions: {
+        readonly type: PropType<MarkdownOptions>;
+        readonly default: undefined;
+    };
     readonly bubbleActions: {
         readonly type: PropType<ChatBubbleAction[]>;
         readonly default: undefined;
@@ -9402,6 +9589,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -10175,6 +10369,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -10257,6 +10462,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -11030,6 +11242,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -11112,6 +11335,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         inputSuffixColor: string;
         unreadNotificationBackgroundColor: string;
         unreadNotificationTextColor: string;
+        markdownQuoteBorderColorOwn: string;
+        markdownQuoteBorderColorOther: string;
+        markdownQuoteTextColor: string;
+        markdownQuoteBackgroundColor: string;
+        markdownQuoteMarkerColor: string;
+        markdownDividerColorOwn: string;
+        markdownDividerColorOther: string;
         typingIndicatorColor: string;
         dateSeparatorColor: string;
         dateSeparatorBackgroundColor: string;
@@ -11885,6 +12115,17 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             serviceMessageTextColor: string;
             serviceMessageBackgroundColor: string;
             messageTitleColor: string;
+            markdownQuoteBorderColorOwn: string;
+            markdownQuoteBorderColorOther: string;
+            markdownQuoteTextColor: string;
+            markdownQuoteBackgroundColor: string;
+            markdownQuoteMarkerColor: string;
+            markdownDividerColorOwn: string;
+            markdownDividerColorOther: string;
+            markdownH1FontSize: string;
+            markdownH2FontSize: string;
+            markdownH3FontSize: string;
+            markdownTextFontSize: string;
         }, {
             StatusIcon: import("../../_mixins").Theme<"Icon", {
                 color: string;
@@ -11945,6 +12186,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly shareButtonTooltip: string;
     readonly profileButtonTooltip: string;
     readonly unreadNotificationText: string;
+    readonly markdown: boolean;
+    readonly markdownOptions: MarkdownOptions;
     readonly onAttachmentDownload: OnAttachmentDownload;
     readonly inputValue: string;
     readonly messages: ChatMessageData[];
@@ -11971,10 +12214,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly onFooterInputChange: (value: string, chatId: ChatId) => void;
     readonly onMessagesScrollToTop: () => void;
     readonly onMessagesScrollToBottom: () => void;
-    readonly loadingCount: number;
+    readonly 'onUpdate:inputValue': (value: string) => void;
     readonly selectedChat: ChatListItemData;
+    readonly loadingCount: number;
     readonly showAttachButton: boolean;
     readonly onMessageSend: OnMessageSend;
-    readonly 'onUpdate:inputValue': (value: string) => void;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/chat/src/ChatMainArea.mjs

@@ -37,6 +37,7 @@ import { computed, defineComponent, Fragment, h, inject, nextTick, onMounted, pr
 import { ArrowHookUpRight, AttachIcon, CloseIcon, PersonNote, SendFilled } from "../../_internal/icons/index.mjs";
 import { useConfig, useLocale, useTheme, useThemeClass } from "../../_mixins/index.mjs";
 import { resolveSlot } from "../../_utils/index.mjs";
+import { renderMarkdown } from "../../_utils/markdown/index.mjs";
 import { UButton } from "../../button/index.mjs";
 import { UFlex } from "../../flex/index.mjs";
 import { UIcon } from "../../icon/index.mjs";
@@ -160,6 +161,14 @@ export const chatMainAreaProps = Object.assign(Object.assign({}, useTheme.props)
     type: String,
     default: undefined
   },
+  markdown: {
+    type: Boolean,
+    default: true
+  },
+  markdownOptions: {
+    type: Object,
+    default: undefined
+  },
   bubbleActions: {
     type: Array,
     default: undefined
@@ -215,7 +224,7 @@ export default defineComponent({
   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, _17, _18;
+    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, _19, _20;
     const UChat = inject(chatInjectionKey, null);
     const isStandalone = !UChat;
     const {
@@ -289,24 +298,26 @@ export default defineComponent({
     const editMessageIdRef = (_5 = UChat === null || UChat === void 0 ? void 0 : UChat.editMessageIdRef) !== null && _5 !== void 0 ? _5 : ref(null);
     const startEditingMessageRef = (_6 = UChat === null || UChat === void 0 ? void 0 : UChat.startEditingMessage) !== null && _6 !== void 0 ? _6 : ref();
     const bubbleActionsRef = (_7 = UChat === null || UChat === void 0 ? void 0 : UChat.bubbleActionsRef) !== null && _7 !== void 0 ? _7 : toRef(props, 'bubbleActions');
-    const handleMessageSend = (_8 = UChat === null || UChat === void 0 ? void 0 : UChat.handleMessageSend) !== null && _8 !== void 0 ? _8 : (content, attachments) => {
+    const markdownRef = (_8 = UChat === null || UChat === void 0 ? void 0 : UChat.markdownRef) !== null && _8 !== void 0 ? _8 : toRef(props, 'markdown');
+    const markdownOptionsRef = (_9 = UChat === null || UChat === void 0 ? void 0 : UChat.markdownOptionsRef) !== null && _9 !== void 0 ? _9 : toRef(props, 'markdownOptions');
+    const handleMessageSend = (_10 = UChat === null || UChat === void 0 ? void 0 : UChat.handleMessageSend) !== null && _10 !== void 0 ? _10 : (content, attachments) => {
       var _a;
       return (_a = props.onMessageSend) === null || _a === void 0 ? void 0 : _a.call(props, content, attachments);
     };
-    const handleMessageRetry = (_9 = UChat === null || UChat === void 0 ? void 0 : UChat.handleMessageRetry) !== null && _9 !== void 0 ? _9 : message => {
+    const handleMessageRetry = (_11 = UChat === null || UChat === void 0 ? void 0 : UChat.handleMessageRetry) !== null && _11 !== void 0 ? _11 : message => {
       var _a;
       return (_a = props.onMessageRetry) === null || _a === void 0 ? void 0 : _a.call(props, message);
     };
-    const handleFooterInputChange = (_10 = UChat === null || UChat === void 0 ? void 0 : UChat.handleFooterInputChange) !== null && _10 !== void 0 ? _10 : (value, chatId) => {
+    const handleFooterInputChange = (_12 = UChat === null || UChat === void 0 ? void 0 : UChat.handleFooterInputChange) !== null && _12 !== void 0 ? _12 : (value, chatId) => {
       var _a;
       return (_a = props.onFooterInputChange) === null || _a === void 0 ? void 0 : _a.call(props, value, chatId);
     };
-    const onAttachmentUpload = (_11 = UChat === null || UChat === void 0 ? void 0 : UChat.onAttachmentUpload) !== null && _11 !== void 0 ? _11 : toRef(props, 'onAttachmentUpload');
-    const onChatClose = (_12 = UChat === null || UChat === void 0 ? void 0 : UChat.onChatClose) !== null && _12 !== void 0 ? _12 : toRef(props, 'onChatClose');
-    const onChatShare = (_13 = UChat === null || UChat === void 0 ? void 0 : UChat.onChatShare) !== null && _13 !== void 0 ? _13 : toRef(props, 'onChatShare');
-    const onUserProfile = (_14 = UChat === null || UChat === void 0 ? void 0 : UChat.onUserProfile) !== null && _14 !== void 0 ? _14 : toRef(props, 'onUserProfile');
-    const onMessagesScrollToTop = (_15 = UChat === null || UChat === void 0 ? void 0 : UChat.onMessagesScrollToTop) !== null && _15 !== void 0 ? _15 : toRef(props, 'onMessagesScrollToTop');
-    const onMessagesScrollToBottom = (_16 = UChat === null || UChat === void 0 ? void 0 : UChat.onMessagesScrollToBottom) !== null && _16 !== void 0 ? _16 : toRef(props, 'onMessagesScrollToBottom');
+    const onAttachmentUpload = (_13 = UChat === null || UChat === void 0 ? void 0 : UChat.onAttachmentUpload) !== null && _13 !== void 0 ? _13 : toRef(props, 'onAttachmentUpload');
+    const onChatClose = (_14 = UChat === null || UChat === void 0 ? void 0 : UChat.onChatClose) !== null && _14 !== void 0 ? _14 : toRef(props, 'onChatClose');
+    const onChatShare = (_15 = UChat === null || UChat === void 0 ? void 0 : UChat.onChatShare) !== null && _15 !== void 0 ? _15 : toRef(props, 'onChatShare');
+    const onUserProfile = (_16 = UChat === null || UChat === void 0 ? void 0 : UChat.onUserProfile) !== null && _16 !== void 0 ? _16 : toRef(props, 'onUserProfile');
+    const onMessagesScrollToTop = (_17 = UChat === null || UChat === void 0 ? void 0 : UChat.onMessagesScrollToTop) !== null && _17 !== void 0 ? _17 : toRef(props, 'onMessagesScrollToTop');
+    const onMessagesScrollToBottom = (_18 = UChat === null || UChat === void 0 ? void 0 : UChat.onMessagesScrollToBottom) !== null && _18 !== void 0 ? _18 : toRef(props, 'onMessagesScrollToBottom');
     const cssVarsRef = computed(() => {
       const {
         common: {
@@ -387,8 +398,8 @@ export default defineComponent({
     const themeClassHandle = useThemeClass('chat-main-area', computed(() => ''), cssVarsRef, props);
     const messagesBodyRef = ref();
     const inputRef = ref();
-    const uncontrolledInputValueRef = 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 => {
+    const uncontrolledInputValueRef = ref((_19 = props.inputValue) !== null && _19 !== void 0 ? _19 : '');
+    const handleInputValueChange = (_20 = UChat === null || UChat === void 0 ? void 0 : UChat.handleInputValueChange) !== null && _20 !== void 0 ? _20 : value => {
       var _a;
       uncontrolledInputValueRef.value = value;
       (_a = props['onUpdate:inputValue']) === null || _a === void 0 ? void 0 : _a.call(props, value);
@@ -676,6 +687,8 @@ export default defineComponent({
         showUnreadNotification: showUnreadNotification.value,
         unreadNotificationText: unreadNotificationTextRef.value,
         unreadNotificationCount: unreadCountOnOpen.value,
+        markdown: markdownRef.value,
+        markdownOptions: markdownOptionsRef.value,
         onMessageRetry: handleMessageRetry
       }, {
         messageAttachment: slots.messageAttachment,
@@ -771,7 +784,8 @@ export default defineComponent({
             }
             return result;
           })() : undefined;
-          handleMessageSend(inputValue.value, attachments);
+          const content = props.markdown && !renderMarkdown(inputValue.value).length ? '' : inputValue.value;
+          handleMessageSend(content, attachments);
           inputValue.value = '';
           attachmentFileList.value = [];
           chatInputs.value[selectedChatRef.value.id] = '';