@zohoim/chat-components 0.0.8 → 0.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/ArticleBubble/ArticleBubble.js +19 -11
- package/es/ArticleBubble/css/ArticleBubble.module.css +39 -0
- package/es/AttachmentBubble/AttachmentBubble.js +12 -11
- package/es/AttachmentBubble/css/AttachmentBubble.module.css +12 -5
- package/es/AttachmentBubbleInfo/css/AttachmentBubbleInfo.module.css +9 -2
- package/es/Audio/css/Audio.module.css +4 -0
- package/es/AudioBubble/css/AudioBubble.module.css +1 -1
- package/es/Fonts/puviFont.module.css +61 -0
- package/es/LocationBubble/LocationBubble.js +17 -12
- package/es/LocationBubble/css/LocationBubble.module.css +33 -0
- package/es/Message/Message.js +3 -3
- package/es/MessageActionsMore/css/MessageActionsMore.module.css +1 -0
- package/es/MessageAvatar/css/MessageAvatar.module.css +3 -3
- package/es/MessageBox/css/MessageBox.module.css +5 -2
- package/es/MoreActionItem/MoreActionItem.js +1 -0
- package/es/MoreActionItem/css/MoreActionItem.module.css +4 -0
- package/es/ReplyBubble/ReplyBubble.js +18 -2
- package/es/ReplyBubble/props/defaultProps.js +4 -1
- package/es/ReplyBubble/props/propTypes.js +9 -1
- package/es/ReplyBubbleContent/ReplyBubbleContent.js +56 -0
- package/es/ReplyBubbleContent/css/ReplyBubbleContent.module.css +50 -0
- package/es/ReplyBubbleContent/css/cssJSLogic.js +22 -0
- package/es/ReplyBubbleContent/index.js +1 -0
- package/es/ReplyBubbleContent/props/defaultProps.js +6 -0
- package/es/ReplyBubbleContent/props/propTypes.js +9 -0
- package/es/ReplyBubbleHeader/ReplyBubbleHeader.js +6 -2
- package/es/ReplyBubbleHeader/css/ReplyBubbleHeader.module.css +4 -0
- package/es/ReplyBubbleHeader/props/defaultProps.js +1 -1
- package/es/TextBubble/TextBubble.js +10 -10
- package/es/TextBubble/css/TextBubble.module.css +5 -1
- package/es/Theme/ThemeWrapper.js +25 -19
- package/es/Theme/desk/commonDeskColorVariable.js +3 -1
- package/es/Theme/desk/dark/blueTheme.js +23 -11
- package/es/Theme/desk/dark/commonColorVariable.js +5 -5
- package/es/Theme/desk/dark/greenTheme.js +22 -11
- package/es/Theme/desk/dark/orangeTheme.js +13 -2
- package/es/Theme/desk/dark/redTheme.js +22 -11
- package/es/Theme/desk/dark/yellowTheme.js +22 -11
- package/es/Theme/desk/light/blueTheme.js +25 -12
- package/es/Theme/desk/light/commonColorVariable.js +2 -1
- package/es/Theme/desk/light/greenTheme.js +9 -2
- package/es/Theme/desk/light/orangeTheme.js +17 -10
- package/es/Theme/desk/light/redTheme.js +17 -10
- package/es/Theme/desk/light/yellowTheme.js +17 -10
- package/es/Theme/desk/pureDark/blueTheme.js +21 -10
- package/es/Theme/desk/pureDark/commonColorVariable.js +2 -1
- package/es/Theme/desk/pureDark/greenTheme.js +21 -10
- package/es/Theme/desk/pureDark/orangeTheme.js +21 -10
- package/es/Theme/desk/pureDark/redTheme.js +21 -10
- package/es/Theme/desk/pureDark/yellowTheme.js +21 -10
- package/es/VideoBubble/css/VideoBubble.module.css +1 -1
- package/es/icons/factory/common/article.svg +4 -0
- package/es/icons/factory/common/quote.svg +1 -0
- package/es/icons/iconSrc/common/Article.js +17 -0
- package/es/icons/iconSrc/common/Quote.js +16 -0
- package/es/icons/iconSrc/common/index.js +2 -0
- package/es/{IMArticleBubble → im/IMArticleBubble}/IMArticleBubble.js +2 -2
- package/es/{IMAttachmentBubble → im/IMAttachmentBubble}/IMAttachmentBubble.js +2 -2
- package/es/{IMAttachmentIcon → im/IMAttachmentIcon}/IMAttachmentIcon.js +17 -17
- package/es/{IMAudioBubble → im/IMAudioBubble}/IMAudioBubble.js +2 -2
- package/es/im/IMAudioBubble/css/IMAudioBubble.module.css +8 -0
- package/es/{IMAutoMessageInfo → im/IMAutoMessageInfo}/IMAutoMessageInfo.js +1 -1
- package/es/{IMDateTime → im/IMDateTime}/IMDateTime.js +1 -1
- package/es/im/IMDateTime/css/IMDateTime.module.css +5 -0
- package/es/{IMImageBubble → im/IMImageBubble}/IMImageBubble.js +2 -2
- package/es/{IMIntegrationIcon → im/IMIntegrationIcon}/IMIntegrationIcon.js +7 -7
- package/es/{IMLocationBubble → im/IMLocationBubble}/IMLocationBubble.js +2 -2
- package/es/{IMMessage → im/IMMessage}/IMMessage.js +18 -12
- package/es/{IMMessage → im/IMMessage}/props/propTypes.js +9 -6
- package/es/{IMMessageActions → im/IMMessageActions}/IMMessageActions.js +5 -5
- package/es/{IMMessageActions → im/IMMessageActions}/css/IMMessageActions.module.css +8 -0
- package/es/{IMMessageAvatar → im/IMMessageAvatar}/IMMessageAvatar.js +1 -1
- package/es/{IMMessageContent → im/IMMessageContent}/IMMessageContent.js +27 -22
- package/es/{IMMessageContent → im/IMMessageContent}/props/propTypes.js +3 -1
- package/es/{IMMessageStatus → im/IMMessageStatus}/IMMessageStatus.js +4 -4
- package/es/im/IMReplyBubble/IMReplyBubble.js +87 -0
- package/es/im/IMReplyBubble/css/IMReplyBubble.module.css +24 -0
- package/es/im/IMReplyBubble/props/defaultProps.js +9 -0
- package/es/im/IMReplyBubble/props/propTypes.js +22 -0
- package/es/{IMTextBubble → im/IMTextBubble}/IMTextBubble.js +4 -3
- package/es/{IMTicketLink → im/IMTicketLink}/IMTicketLink.js +1 -1
- package/es/{IMTicketLink → im/IMTicketLink}/css/IMTicketLink.module.css +4 -1
- package/es/{IMVideoBubble → im/IMVideoBubble}/IMVideoBubble.js +2 -2
- package/es/im/index.js +20 -0
- package/es/index.js +31 -49
- package/package.json +4 -4
- package/es/IMAudioBubble/css/IMAudioBubble.module.css +0 -8
- package/es/IMDateTime/css/IMDateTime.module.css +0 -5
- package/es/IMReplyBubble/IMReplyBubble.js +0 -37
- package/es/IMReplyBubble/css/IMReplyBubble.module.css +0 -0
- package/es/IMReplyBubble/props/defaultProps.js +0 -6
- package/es/IMReplyBubble/props/propTypes.js +0 -6
- /package/es/{IMArticleBubble → im/IMArticleBubble}/css/IMArticleBubble.module.css +0 -0
- /package/es/{IMArticleBubble → im/IMArticleBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMArticleBubble → im/IMArticleBubble}/index.js +0 -0
- /package/es/{IMArticleBubble → im/IMArticleBubble}/props/defaultProps.js +0 -0
- /package/es/{IMArticleBubble → im/IMArticleBubble}/props/propTypes.js +0 -0
- /package/es/{IMAttachmentBubble → im/IMAttachmentBubble}/css/IMAttachmentBubble.module.css +0 -0
- /package/es/{IMAttachmentBubble → im/IMAttachmentBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMAttachmentBubble → im/IMAttachmentBubble}/index.js +0 -0
- /package/es/{IMAttachmentBubble → im/IMAttachmentBubble}/props/defaultProps.js +0 -0
- /package/es/{IMAttachmentBubble → im/IMAttachmentBubble}/props/propTypes.js +0 -0
- /package/es/{IMAttachmentIcon → im/IMAttachmentIcon}/css/IMAttachmentIcon.module.css +0 -0
- /package/es/{IMAttachmentIcon → im/IMAttachmentIcon}/css/cssJSLogic.js +0 -0
- /package/es/{IMAttachmentIcon → im/IMAttachmentIcon}/index.js +0 -0
- /package/es/{IMAttachmentIcon → im/IMAttachmentIcon}/props/defaultProps.js +0 -0
- /package/es/{IMAttachmentIcon → im/IMAttachmentIcon}/props/propTypes.js +0 -0
- /package/es/{IMAudioBubble → im/IMAudioBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMAudioBubble → im/IMAudioBubble}/index.js +0 -0
- /package/es/{IMAudioBubble → im/IMAudioBubble}/props/defaultProps.js +0 -0
- /package/es/{IMAudioBubble → im/IMAudioBubble}/props/propTypes.js +0 -0
- /package/es/{IMAutoMessageInfo → im/IMAutoMessageInfo}/css/IMAutoMessageInfo.module.css +0 -0
- /package/es/{IMAutoMessageInfo → im/IMAutoMessageInfo}/css/cssJSLogic.js +0 -0
- /package/es/{IMAutoMessageInfo → im/IMAutoMessageInfo}/index.js +0 -0
- /package/es/{IMAutoMessageInfo → im/IMAutoMessageInfo}/props/defaultProps.js +0 -0
- /package/es/{IMAutoMessageInfo → im/IMAutoMessageInfo}/props/propTypes.js +0 -0
- /package/es/{IMDateTime → im/IMDateTime}/css/cssJSLogic.js +0 -0
- /package/es/{IMDateTime → im/IMDateTime}/index.js +0 -0
- /package/es/{IMDateTime → im/IMDateTime}/props/defaultProps.js +0 -0
- /package/es/{IMDateTime → im/IMDateTime}/props/propTypes.js +0 -0
- /package/es/{IMImageBubble → im/IMImageBubble}/css/IMImageBubble.module.css +0 -0
- /package/es/{IMImageBubble → im/IMImageBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMImageBubble → im/IMImageBubble}/index.js +0 -0
- /package/es/{IMImageBubble → im/IMImageBubble}/props/defaultProps.js +0 -0
- /package/es/{IMImageBubble → im/IMImageBubble}/props/propTypes.js +0 -0
- /package/es/{IMInfoBubble → im/IMInfoBubble}/IMInfoBubble.js +0 -0
- /package/es/{IMInfoBubble → im/IMInfoBubble}/css/IMInfoBubble.module.css +0 -0
- /package/es/{IMInfoBubble → im/IMInfoBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMInfoBubble → im/IMInfoBubble}/index.js +0 -0
- /package/es/{IMInfoBubble → im/IMInfoBubble}/props/defaultProps.js +0 -0
- /package/es/{IMInfoBubble → im/IMInfoBubble}/props/propTypes.js +0 -0
- /package/es/{IMIntegrationIcon → im/IMIntegrationIcon}/css/IMIntegrationIcon.module.css +0 -0
- /package/es/{IMIntegrationIcon → im/IMIntegrationIcon}/css/cssJSLogic.js +0 -0
- /package/es/{IMIntegrationIcon → im/IMIntegrationIcon}/index.js +0 -0
- /package/es/{IMIntegrationIcon → im/IMIntegrationIcon}/props/defaultProps.js +0 -0
- /package/es/{IMIntegrationIcon → im/IMIntegrationIcon}/props/propConstants.js +0 -0
- /package/es/{IMIntegrationIcon → im/IMIntegrationIcon}/props/propTypes.js +0 -0
- /package/es/{IMLocationBubble → im/IMLocationBubble}/css/IMLocationBubble.module.css +0 -0
- /package/es/{IMLocationBubble → im/IMLocationBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMLocationBubble → im/IMLocationBubble}/index.js +0 -0
- /package/es/{IMLocationBubble → im/IMLocationBubble}/props/defaultProps.js +0 -0
- /package/es/{IMLocationBubble → im/IMLocationBubble}/props/propTypes.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/css/IMMessage.module.css +0 -0
- /package/es/{IMMessage → im/IMMessage}/css/cssJSLogic.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/index.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/props/defaultProps.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessage.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessageActions.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessageBox.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessageBoxFooter.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessageFooter.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessageHeader.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessageOwner.js +0 -0
- /package/es/{IMMessage → im/IMMessage}/renderChild/renderMessageStatus.js +0 -0
- /package/es/{IMMessageActions → im/IMMessageActions}/css/cssJSLogic.js +0 -0
- /package/es/{IMMessageActions → im/IMMessageActions}/index.js +0 -0
- /package/es/{IMMessageActions → im/IMMessageActions}/props/defaultProps.js +0 -0
- /package/es/{IMMessageActions → im/IMMessageActions}/props/propTypes.js +0 -0
- /package/es/{IMMessageAvatar → im/IMMessageAvatar}/css/IMMessageAvatar.module.css +0 -0
- /package/es/{IMMessageAvatar → im/IMMessageAvatar}/css/cssJSLogic.js +0 -0
- /package/es/{IMMessageAvatar → im/IMMessageAvatar}/index.js +0 -0
- /package/es/{IMMessageAvatar → im/IMMessageAvatar}/props/defaultProps.js +0 -0
- /package/es/{IMMessageAvatar → im/IMMessageAvatar}/props/propTypes.js +0 -0
- /package/es/{IMMessageContent → im/IMMessageContent}/css/IMMessageContent.module.css +0 -0
- /package/es/{IMMessageContent → im/IMMessageContent}/css/cssJSLogic.js +0 -0
- /package/es/{IMMessageContent → im/IMMessageContent}/index.js +0 -0
- /package/es/{IMMessageContent → im/IMMessageContent}/props/defaultProps.js +0 -0
- /package/es/{IMMessageMeta → im/IMMessageMeta}/IMMessageMeta.js +0 -0
- /package/es/{IMMessageMeta → im/IMMessageMeta}/css/IMMessageMeta.module.css +0 -0
- /package/es/{IMMessageMeta → im/IMMessageMeta}/css/cssJSLogic.js +0 -0
- /package/es/{IMMessageMeta → im/IMMessageMeta}/index.js +0 -0
- /package/es/{IMMessageMeta → im/IMMessageMeta}/props/defaultProps.js +0 -0
- /package/es/{IMMessageMeta → im/IMMessageMeta}/props/propTypes.js +0 -0
- /package/es/{IMMessageStatus → im/IMMessageStatus}/css/IMMessageStatus.module.css +0 -0
- /package/es/{IMMessageStatus → im/IMMessageStatus}/css/cssJSLogic.js +0 -0
- /package/es/{IMMessageStatus → im/IMMessageStatus}/index.js +0 -0
- /package/es/{IMMessageStatus → im/IMMessageStatus}/props/defaultProps.js +0 -0
- /package/es/{IMMessageStatus → im/IMMessageStatus}/props/propTypes.js +0 -0
- /package/es/{IMReplyBubble → im/IMReplyBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMReplyBubble → im/IMReplyBubble}/index.js +0 -0
- /package/es/{IMTextBubble → im/IMTextBubble}/css/IMTextBubble.module.css +0 -0
- /package/es/{IMTextBubble → im/IMTextBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMTextBubble → im/IMTextBubble}/index.js +0 -0
- /package/es/{IMTextBubble → im/IMTextBubble}/props/defaultProps.js +0 -0
- /package/es/{IMTextBubble → im/IMTextBubble}/props/propTypes.js +0 -0
- /package/es/{IMTicketLink → im/IMTicketLink}/css/cssJSLogic.js +0 -0
- /package/es/{IMTicketLink → im/IMTicketLink}/index.js +0 -0
- /package/es/{IMTicketLink → im/IMTicketLink}/props/defaultProps.js +0 -0
- /package/es/{IMTicketLink → im/IMTicketLink}/props/propTypes.js +0 -0
- /package/es/{IMVideoBubble → im/IMVideoBubble}/css/IMVideoBubble.module.css +0 -0
- /package/es/{IMVideoBubble → im/IMVideoBubble}/css/cssJSLogic.js +0 -0
- /package/es/{IMVideoBubble → im/IMVideoBubble}/index.js +0 -0
- /package/es/{IMVideoBubble → im/IMVideoBubble}/props/defaultProps.js +0 -0
- /package/es/{IMVideoBubble → im/IMVideoBubble}/props/propTypes.js +0 -0
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/** ** Libraries *** */
|
|
2
|
-
import PropTypes from
|
|
2
|
+
import PropTypes from "prop-types";
|
|
3
3
|
|
|
4
4
|
/** ** Constants *** */
|
|
5
|
-
import { defaultMessageActions } from
|
|
6
|
-
import messageStatusConstants from
|
|
7
|
-
import sizes from
|
|
5
|
+
import { defaultMessageActions } from "@zohoim/chat-components-utils/es/constants/messageActionConstants";
|
|
6
|
+
import messageStatusConstants from "@zohoim/chat-components-utils/es/constants/messageStatusConstants";
|
|
7
|
+
import sizes from "@zohoim/chat-components-utils/es/constants/sizes";
|
|
8
8
|
const {
|
|
9
9
|
REPLY,
|
|
10
10
|
COPY,
|
|
@@ -121,7 +121,7 @@ const imMessagePropTypes = {
|
|
|
121
121
|
messageBubbleCustomStyle: PropTypes.object,
|
|
122
122
|
needMessageActions: PropTypes.bool,
|
|
123
123
|
needSender: PropTypes.bool,
|
|
124
|
-
senderAvatarSize: PropTypes.oneOf([
|
|
124
|
+
senderAvatarSize: PropTypes.oneOf(["xxsmall", "small", "xsmall", "medium", "xmedium", "large", "xlarge"]),
|
|
125
125
|
avatarCustomStyle: PropTypes.object,
|
|
126
126
|
senderIntegrationIconSize: PropTypes.oneOf([sizes.SMALL, sizes.MEDIUM]),
|
|
127
127
|
senderIntegrationIconCustomStyle: PropTypes.object,
|
|
@@ -140,6 +140,9 @@ const imMessagePropTypes = {
|
|
|
140
140
|
moreActionItemCustomStyle: PropTypes.object,
|
|
141
141
|
messageActionCustomStyle: PropTypes.object,
|
|
142
142
|
moreActionPopupCustomStyle: PropTypes.object,
|
|
143
|
-
messageStatusCustomStyle: PropTypes.object
|
|
143
|
+
messageStatusCustomStyle: PropTypes.object,
|
|
144
|
+
replyText: PropTypes.string,
|
|
145
|
+
articleShareText: PropTypes.string,
|
|
146
|
+
moreText: PropTypes.string
|
|
144
147
|
};
|
|
145
148
|
export default imMessagePropTypes;
|
|
@@ -7,9 +7,9 @@
|
|
|
7
7
|
import React from 'react';
|
|
8
8
|
|
|
9
9
|
/** ** Components *** */
|
|
10
|
-
import ActionIcon from '
|
|
11
|
-
import MessageActions from '
|
|
12
|
-
import MessageAction from '
|
|
10
|
+
import ActionIcon from '../../ActionIcon/ActionIcon';
|
|
11
|
+
import MessageActions from '../../MessageActions/MessageActions';
|
|
12
|
+
import MessageAction from '../../MessageAction/MessageAction';
|
|
13
13
|
|
|
14
14
|
/** ** Icons *** */
|
|
15
15
|
import ReplyIcon from '@zohodesk/icon/es/general/Reply';
|
|
@@ -19,10 +19,10 @@ import DownloadIcon from '@zohodesk/icon/es/general/Cloud';
|
|
|
19
19
|
import DeleteIcon from '@zohodesk/icon/es/general/Delete';
|
|
20
20
|
import ForwardIcon from '@zohodesk/icon/es/channels/EmailForward';
|
|
21
21
|
import MoreIcon from '@zohodesk/icon/es/general/More';
|
|
22
|
-
import ConvertTicket from '
|
|
22
|
+
import ConvertTicket from '../../icons/iconSrc/actions/ConvertTicket';
|
|
23
23
|
|
|
24
24
|
/** ** Hooks *** */
|
|
25
|
-
import useIMMessageActions from '@zohoim/chat-components-hooks/es/IMMessageActions/useIMMessageActions';
|
|
25
|
+
import useIMMessageActions from '@zohoim/chat-components-hooks/es/im/IMMessageActions/useIMMessageActions';
|
|
26
26
|
|
|
27
27
|
/** ** Methods *** */
|
|
28
28
|
import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
|
|
@@ -16,6 +16,14 @@
|
|
|
16
16
|
/* margin-top: var(--imMessageActions-secondaryActions_margin); */
|
|
17
17
|
}
|
|
18
18
|
|
|
19
|
+
[dir=ltr] .secondaryActions {
|
|
20
|
+
text-align: left;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
[dir=rtl] .secondaryActions {
|
|
24
|
+
text-align: right;
|
|
25
|
+
}
|
|
26
|
+
|
|
19
27
|
.icon {
|
|
20
28
|
composes: varClass;
|
|
21
29
|
width: var(--imMessageActions-action_icon_size);
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
|
|
4
4
|
/** ** Components *** */
|
|
5
|
-
import MessageAvatar from '
|
|
5
|
+
import MessageAvatar from '../../MessageAvatar/MessageAvatar';
|
|
6
6
|
import IMIntegrationIcon from '../IMIntegrationIcon/IMIntegrationIcon';
|
|
7
7
|
|
|
8
8
|
/** ** Constants *** */
|
|
@@ -2,36 +2,38 @@
|
|
|
2
2
|
/* eslint-disable max-len */
|
|
3
3
|
|
|
4
4
|
/** ** Libraries *** */
|
|
5
|
-
import React from
|
|
5
|
+
import React from "react";
|
|
6
6
|
|
|
7
7
|
/** ** Hooks *** */
|
|
8
|
-
import useMergeStyle from
|
|
8
|
+
import useMergeStyle from "@zohodesk/hooks/es/utils/useMergeStyle";
|
|
9
9
|
|
|
10
10
|
/** ** Constants *** */
|
|
11
|
-
import imMessageContentDefaultProps from
|
|
12
|
-
import imMessageContentPropTypes from
|
|
11
|
+
import imMessageContentDefaultProps from "./props/defaultProps";
|
|
12
|
+
import imMessageContentPropTypes from "./props/propTypes";
|
|
13
13
|
|
|
14
14
|
/** ** Methods *** */
|
|
15
|
-
import renderHandler from
|
|
16
|
-
import cssJSLogic from
|
|
15
|
+
import renderHandler from "@zohoim/chat-components-utils/es/common/renderHandler";
|
|
16
|
+
import cssJSLogic from "./css/cssJSLogic";
|
|
17
17
|
|
|
18
18
|
/** ** Styles *** */
|
|
19
|
-
import style from
|
|
20
|
-
import useIMMessageContent from '@zohoim/chat-components-hooks/es/IMMessageContent/useIMMessageContent';
|
|
21
|
-
import { messageTypes, mediaTypes as mediaTypeConstants } from
|
|
22
|
-
import IMReplyBubble from
|
|
23
|
-
import IMLocationBubble from
|
|
24
|
-
import IMTextBubble from
|
|
25
|
-
import IMImageBubble from
|
|
26
|
-
import IMVideoBubble from
|
|
27
|
-
import IMAudioBubble from
|
|
28
|
-
import IMAttachmentBubble from
|
|
29
|
-
import IMArticleBubble from
|
|
19
|
+
import style from "./css/IMMessageContent.module.css";
|
|
20
|
+
import useIMMessageContent from '@zohoim/chat-components-hooks/es/im/IMMessageContent/useIMMessageContent';
|
|
21
|
+
import { messageTypes, mediaTypes as mediaTypeConstants } from "@zohoim/chat-components-utils/es/constants/messageConstants";
|
|
22
|
+
import IMReplyBubble from "../IMReplyBubble/IMReplyBubble";
|
|
23
|
+
import IMLocationBubble from "../IMLocationBubble/IMLocationBubble";
|
|
24
|
+
import IMTextBubble from "../IMTextBubble/IMTextBubble";
|
|
25
|
+
import IMImageBubble from "../IMImageBubble/IMImageBubble";
|
|
26
|
+
import IMVideoBubble from "../IMVideoBubble/IMVideoBubble";
|
|
27
|
+
import IMAudioBubble from "../IMAudioBubble/IMAudioBubble";
|
|
28
|
+
import IMAttachmentBubble from "../IMAttachmentBubble/IMAttachmentBubble";
|
|
29
|
+
import IMArticleBubble from "../IMArticleBubble/IMArticleBubble";
|
|
30
30
|
export default function IMMessageContent(props) {
|
|
31
31
|
const {
|
|
32
32
|
customStyle,
|
|
33
33
|
messageDetails,
|
|
34
|
-
seeMoreText
|
|
34
|
+
seeMoreText,
|
|
35
|
+
replyText,
|
|
36
|
+
articleShareText
|
|
35
37
|
} = props;
|
|
36
38
|
const {
|
|
37
39
|
isShowLayoutBubble,
|
|
@@ -56,12 +58,14 @@ export default function IMMessageContent(props) {
|
|
|
56
58
|
const {
|
|
57
59
|
attachment: attachmentDetails,
|
|
58
60
|
location: locationDetails,
|
|
59
|
-
kbArticle: articleDetails
|
|
61
|
+
kbArticle: articleDetails,
|
|
62
|
+
replyToMessage
|
|
60
63
|
} = messageDetails || {};
|
|
61
64
|
return /*#__PURE__*/React.createElement("div", {
|
|
62
65
|
className: imMessageContentClass
|
|
63
66
|
}, isShowLayoutBubble ? null : null, isShowReplyBubble ? /*#__PURE__*/React.createElement(IMReplyBubble, {
|
|
64
|
-
messageDetails:
|
|
67
|
+
messageDetails: replyToMessage,
|
|
68
|
+
replyText: replyText
|
|
65
69
|
}) : null, isShowImageBubble ? /*#__PURE__*/React.createElement(IMImageBubble, {
|
|
66
70
|
attachmentDetails: attachmentDetails
|
|
67
71
|
}) : null, isShowVideoBubble ? /*#__PURE__*/React.createElement(IMVideoBubble, {
|
|
@@ -73,7 +77,8 @@ export default function IMMessageContent(props) {
|
|
|
73
77
|
}) : null, isShowLocationBubble ? /*#__PURE__*/React.createElement(IMLocationBubble, {
|
|
74
78
|
locationDetails: locationDetails
|
|
75
79
|
}) : null, isShowArticleBubble ? /*#__PURE__*/React.createElement(IMArticleBubble, {
|
|
76
|
-
articleDetails: articleDetails
|
|
80
|
+
articleDetails: articleDetails,
|
|
81
|
+
articleShareI18N: articleShareText
|
|
77
82
|
}) : null, isShowTextBubble ? /*#__PURE__*/React.createElement(IMTextBubble, {
|
|
78
83
|
messageDetails: messageDetails,
|
|
79
84
|
moreText: seeMoreText
|
|
@@ -81,4 +86,4 @@ export default function IMMessageContent(props) {
|
|
|
81
86
|
}
|
|
82
87
|
IMMessageContent.propTypes = imMessageContentPropTypes;
|
|
83
88
|
IMMessageContent.defaultProps = imMessageContentDefaultProps;
|
|
84
|
-
IMMessageContent.displayName =
|
|
89
|
+
IMMessageContent.displayName = "IMMessageContent";
|
|
@@ -30,6 +30,8 @@ const imMessageContentPropTypes = {
|
|
|
30
30
|
createdTime: PropTypes.string,
|
|
31
31
|
id: PropTypes.string
|
|
32
32
|
}),
|
|
33
|
-
moreText: PropTypes.string
|
|
33
|
+
moreText: PropTypes.string,
|
|
34
|
+
replyText: PropTypes.string,
|
|
35
|
+
articleShareText: PropTypes.string
|
|
34
36
|
};
|
|
35
37
|
export default imMessageContentPropTypes;
|
|
@@ -19,10 +19,10 @@ import cssJSLogic from './css/cssJSLogic';
|
|
|
19
19
|
import style from './css/IMMessageStatus.module.css';
|
|
20
20
|
|
|
21
21
|
/** ** Icons *** */
|
|
22
|
-
import DoubleTickIcon from '
|
|
23
|
-
import TickIcon from '
|
|
24
|
-
import ClockIcon from '
|
|
25
|
-
import FailedIcon from '
|
|
22
|
+
import DoubleTickIcon from '../../icons/iconSrc/messageStatus/DoubleTick';
|
|
23
|
+
import TickIcon from '../../icons/iconSrc/messageStatus/Tick';
|
|
24
|
+
import ClockIcon from '../../icons/iconSrc/messageStatus/Clock';
|
|
25
|
+
import FailedIcon from '../../icons/iconSrc/messageStatus/Failed';
|
|
26
26
|
const {
|
|
27
27
|
SENT,
|
|
28
28
|
SAVED,
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
/* eslint-disable react/jsx-no-bind */
|
|
2
|
+
/* eslint-disable max-len */
|
|
3
|
+
|
|
4
|
+
/** ** Libraries *** */
|
|
5
|
+
import React from 'react';
|
|
6
|
+
|
|
7
|
+
/** ** Hooks *** */
|
|
8
|
+
import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
|
|
9
|
+
|
|
10
|
+
/** ** Constants *** */
|
|
11
|
+
import imReplyBubbleDefaultProps from './props/defaultProps';
|
|
12
|
+
import imReplyBubblePropTypes from './props/propTypes';
|
|
13
|
+
|
|
14
|
+
/** ** Methods *** */
|
|
15
|
+
import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
|
|
16
|
+
import cssJSLogic from './css/cssJSLogic';
|
|
17
|
+
|
|
18
|
+
/** ** Styles *** */
|
|
19
|
+
import style from './css/IMReplyBubble.module.css';
|
|
20
|
+
import ReplyBubble from '../../ReplyBubble/ReplyBubble';
|
|
21
|
+
import useIMReplyBubble from '@zohoim/chat-components-hooks/es/im/IMReplyBubble/useIMReplyBubble';
|
|
22
|
+
import IMAttachmentIcon from '../IMAttachmentIcon/IMAttachmentIcon';
|
|
23
|
+
export default function IMReplyBubble(props) {
|
|
24
|
+
const {
|
|
25
|
+
customStyle,
|
|
26
|
+
headerCustomStyle,
|
|
27
|
+
timeCustomStyle,
|
|
28
|
+
contentCustomStyle,
|
|
29
|
+
replyText,
|
|
30
|
+
messageDetails
|
|
31
|
+
} = props;
|
|
32
|
+
|
|
33
|
+
/* External customization */
|
|
34
|
+
const newStyle = useMergeStyle(style, customStyle);
|
|
35
|
+
/* CSS classnames added based on logic */
|
|
36
|
+
const {
|
|
37
|
+
imReplyBubbleClass,
|
|
38
|
+
attachmentIconStyle
|
|
39
|
+
} = cssJSLogic(props, newStyle);
|
|
40
|
+
const {
|
|
41
|
+
fileFormat,
|
|
42
|
+
message,
|
|
43
|
+
senderName,
|
|
44
|
+
time,
|
|
45
|
+
isShowImage,
|
|
46
|
+
fileName,
|
|
47
|
+
attachmentURL
|
|
48
|
+
} = useIMReplyBubble({
|
|
49
|
+
messageDetails
|
|
50
|
+
});
|
|
51
|
+
function renderMessage() {
|
|
52
|
+
return /*#__PURE__*/React.createElement("span", {
|
|
53
|
+
dangerouslySetInnerHTML: {
|
|
54
|
+
__html: message
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
function renderIcon() {
|
|
59
|
+
return isShowImage ? /*#__PURE__*/React.createElement("div", {
|
|
60
|
+
className: newStyle.imageWrapper
|
|
61
|
+
}, /*#__PURE__*/React.createElement("img", {
|
|
62
|
+
className: newStyle.image,
|
|
63
|
+
src: attachmentURL,
|
|
64
|
+
alt: fileName
|
|
65
|
+
})) : fileFormat ? /*#__PURE__*/React.createElement(IMAttachmentIcon, {
|
|
66
|
+
customStyle: {
|
|
67
|
+
$icon: newStyle.attachmentIcon
|
|
68
|
+
},
|
|
69
|
+
fileFormat: fileFormat
|
|
70
|
+
}) : null;
|
|
71
|
+
}
|
|
72
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
73
|
+
className: imReplyBubbleClass
|
|
74
|
+
}, /*#__PURE__*/React.createElement(ReplyBubble, {
|
|
75
|
+
headerCustomStyle: headerCustomStyle,
|
|
76
|
+
timeCustomStyle: timeCustomStyle,
|
|
77
|
+
contentCustomStyle: contentCustomStyle,
|
|
78
|
+
senderName: senderName,
|
|
79
|
+
time: time,
|
|
80
|
+
replyText: replyText,
|
|
81
|
+
renderMessage: renderMessage,
|
|
82
|
+
renderIcon: renderIcon
|
|
83
|
+
}));
|
|
84
|
+
}
|
|
85
|
+
IMReplyBubble.propTypes = imReplyBubblePropTypes;
|
|
86
|
+
IMReplyBubble.defaultProps = imReplyBubbleDefaultProps;
|
|
87
|
+
IMReplyBubble.displayName = 'IMReplyBubble';
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
.attachmentIcon {
|
|
2
|
+
height: 40px;
|
|
3
|
+
width: 40px;
|
|
4
|
+
}
|
|
5
|
+
|
|
6
|
+
.imageWrapper {
|
|
7
|
+
height: 60px;
|
|
8
|
+
width: 60px;
|
|
9
|
+
overflow: hidden;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
[dir=ltr] .imageWrapper {
|
|
13
|
+
margin-right: 10px;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
[dir=rtl] .imageWrapper {
|
|
17
|
+
margin-left: 10px;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
.image {
|
|
21
|
+
width: 100%;
|
|
22
|
+
height: 100%;
|
|
23
|
+
border-radius: 3px;
|
|
24
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/** ** Constants *** */
|
|
2
|
+
import { dummyObject } from '@zohoim/chat-components-utils/es/constants';
|
|
3
|
+
const imReplyBubbleDefaultProps = {
|
|
4
|
+
customStyle: dummyObject,
|
|
5
|
+
headerCustomStyle: dummyObject,
|
|
6
|
+
timeCustomStyle: dummyObject,
|
|
7
|
+
contentCustomStyle: dummyObject
|
|
8
|
+
};
|
|
9
|
+
export default imReplyBubbleDefaultProps;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
/** ** Libraries *** */
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
const imReplyBubblePropTypes = {
|
|
4
|
+
customStyle: PropTypes.object,
|
|
5
|
+
headerCustomStyle: PropTypes.object,
|
|
6
|
+
timeCustomStyle: PropTypes.object,
|
|
7
|
+
contentCustomStyle: PropTypes.object,
|
|
8
|
+
messageDetails: PropTypes.shape({
|
|
9
|
+
displayMessage: PropTypes.string,
|
|
10
|
+
attachment: PropTypes.shape({
|
|
11
|
+
type: PropTypes.string
|
|
12
|
+
}),
|
|
13
|
+
createdTime: PropTypes.string,
|
|
14
|
+
actor: PropTypes.shape({
|
|
15
|
+
name: PropTypes.string,
|
|
16
|
+
contactName: PropTypes.string,
|
|
17
|
+
externalId: PropTypes.string
|
|
18
|
+
})
|
|
19
|
+
}),
|
|
20
|
+
replyText: PropTypes.string
|
|
21
|
+
};
|
|
22
|
+
export default imReplyBubblePropTypes;
|
|
@@ -17,8 +17,9 @@ import cssJSLogic from './css/cssJSLogic';
|
|
|
17
17
|
|
|
18
18
|
/** ** Styles *** */
|
|
19
19
|
import style from './css/IMTextBubble.module.css';
|
|
20
|
-
import TextBubble from '
|
|
21
|
-
import useIMTextBubble from '@zohoim/chat-components-hooks/es/IMTextBubble/useIMTextBubble';
|
|
20
|
+
import TextBubble from '../../TextBubble/TextBubble';
|
|
21
|
+
import useIMTextBubble from '@zohoim/chat-components-hooks/es/im/IMTextBubble/useIMTextBubble';
|
|
22
|
+
import QuoteIcon from '../../icons/iconSrc/common/Quote';
|
|
22
23
|
export default function IMTextBubble(props) {
|
|
23
24
|
const {
|
|
24
25
|
customStyle,
|
|
@@ -40,7 +41,7 @@ export default function IMTextBubble(props) {
|
|
|
40
41
|
} = cssJSLogic(props, newStyle);
|
|
41
42
|
return /*#__PURE__*/React.createElement("div", {
|
|
42
43
|
className: imTextBubbleWrapperClass
|
|
43
|
-
}, isShowQuote ? /*#__PURE__*/React.createElement("span", null,
|
|
44
|
+
}, isShowQuote ? /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(QuoteIcon, null)) : null, /*#__PURE__*/React.createElement(TextBubble, {
|
|
44
45
|
customStyle: textBubbleCustomStyle,
|
|
45
46
|
message: sanitizedDisplayMessage,
|
|
46
47
|
isShowMoreText: isShowSeeMore,
|
|
@@ -7,7 +7,7 @@ import React from 'react';
|
|
|
7
7
|
|
|
8
8
|
/** ** Hooks *** */
|
|
9
9
|
import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
|
|
10
|
-
import useIMTicketLink from '@zohoim/chat-components-hooks/es/IMTicketLink/useIMTicketLink';
|
|
10
|
+
import useIMTicketLink from '@zohoim/chat-components-hooks/es/im/IMTicketLink/useIMTicketLink';
|
|
11
11
|
|
|
12
12
|
/** ** Constants *** */
|
|
13
13
|
import imTicketLinkDefaultProps from './props/defaultProps';
|
|
@@ -9,7 +9,10 @@
|
|
|
9
9
|
font-size: var(--imTicketLink-font_size);
|
|
10
10
|
max-width: var(--imTicketLink-max_width);
|
|
11
11
|
color: var(--imlib_chat_components_imTicketLink_color);
|
|
12
|
-
display:
|
|
12
|
+
display: block;
|
|
13
|
+
white-space: nowrap;
|
|
14
|
+
overflow: hidden;
|
|
15
|
+
text-overflow: ellipsis;
|
|
13
16
|
|
|
14
17
|
margin-top: var(--imTicketLink-top_gap);
|
|
15
18
|
cursor: pointer;
|
|
@@ -17,8 +17,8 @@ import cssJSLogic from './css/cssJSLogic';
|
|
|
17
17
|
|
|
18
18
|
/** ** Styles *** */
|
|
19
19
|
import style from './css/IMVideoBubble.module.css';
|
|
20
|
-
import VideoBubble from '
|
|
21
|
-
import useIMVideoBubble from '@zohoim/chat-components-hooks/es/IMVideoBubble/useIMVideoBubble';
|
|
20
|
+
import VideoBubble from '../../VideoBubble/VideoBubble';
|
|
21
|
+
import useIMVideoBubble from '@zohoim/chat-components-hooks/es/im/IMVideoBubble/useIMVideoBubble';
|
|
22
22
|
export default function IMVideoBubble(props) {
|
|
23
23
|
const {
|
|
24
24
|
attachmentDetails,
|
package/es/im/index.js
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export * from './IMIntegrationIcon';
|
|
2
|
+
export * from './IMMessageActions';
|
|
3
|
+
export * from './IMMessageAvatar';
|
|
4
|
+
export * from './IMMessageStatus';
|
|
5
|
+
export * from './IMMessage';
|
|
6
|
+
export * from './IMDateTime';
|
|
7
|
+
export * from './IMTicketLink';
|
|
8
|
+
export * from './IMMessageMeta';
|
|
9
|
+
export * from './IMAutoMessageInfo';
|
|
10
|
+
export * from './IMMessageContent';
|
|
11
|
+
export * from './IMAudioBubble';
|
|
12
|
+
export * from './IMAttachmentBubble';
|
|
13
|
+
export * from './IMVideoBubble';
|
|
14
|
+
export * from './IMTextBubble';
|
|
15
|
+
export * from './IMInfoBubble';
|
|
16
|
+
export * from './IMAttachmentIcon';
|
|
17
|
+
export * from './IMReplyBubble';
|
|
18
|
+
export * from './IMImageBubble';
|
|
19
|
+
export * from './IMLocationBubble';
|
|
20
|
+
export * from './IMArticleBubble';
|
package/es/index.js
CHANGED
|
@@ -1,55 +1,37 @@
|
|
|
1
|
-
export * from
|
|
1
|
+
export * from "./MessageBubble";
|
|
2
2
|
|
|
3
3
|
// export * from './AvatarSpace';
|
|
4
|
-
export * from
|
|
5
|
-
export * from
|
|
6
|
-
export * from
|
|
7
|
-
export * from
|
|
8
|
-
export * from
|
|
9
|
-
export * from
|
|
10
|
-
export * from
|
|
11
|
-
export * from
|
|
12
|
-
export * from
|
|
13
|
-
export * from
|
|
14
|
-
export * from
|
|
15
|
-
export * from
|
|
16
|
-
export * from
|
|
17
|
-
export * from
|
|
18
|
-
export * from
|
|
19
|
-
export * from
|
|
20
|
-
export * from
|
|
21
|
-
export * from
|
|
22
|
-
export * from
|
|
23
|
-
export * from
|
|
24
|
-
export * from
|
|
25
|
-
export * from
|
|
26
|
-
export * from
|
|
27
|
-
export * from
|
|
28
|
-
export * from
|
|
29
|
-
export * from
|
|
30
|
-
export * from
|
|
31
|
-
export * from './
|
|
32
|
-
export * from './
|
|
33
|
-
export * from './ImageBubble';
|
|
34
|
-
export * from './TextBubble';
|
|
35
|
-
export * from './IMTextBubble';
|
|
36
|
-
export * from './ArticleBubble';
|
|
37
|
-
export * from './LocationBubble';
|
|
38
|
-
export * from './InfoBubble';
|
|
39
|
-
export * from './IMInfoBubble';
|
|
40
|
-
export * from './AttachmentBubbleInfo';
|
|
41
|
-
export * from './Audio';
|
|
42
|
-
export * from './Video';
|
|
43
|
-
export * from './IMAttachmentIcon';
|
|
44
|
-
export * from './ReplyBubble';
|
|
45
|
-
export * from './IMReplyBubble';
|
|
46
|
-
export * from './ReplyBubbleHeader';
|
|
47
|
-
export * from './LazyLoadImage';
|
|
48
|
-
export * from './IMImageBubble';
|
|
49
|
-
export * from './IMLocationBubble';
|
|
50
|
-
export * from './IMArticleBubble';
|
|
4
|
+
export * from "./MessageActions";
|
|
5
|
+
export * from "./MessageBox";
|
|
6
|
+
export * from "./MessageBoxHeader";
|
|
7
|
+
export * from "./MessageBoxFooter";
|
|
8
|
+
export * from "./ActionIcon";
|
|
9
|
+
export * from "./MessageActionsMore";
|
|
10
|
+
export * from "./TextMessage";
|
|
11
|
+
export * from "./MessageAvatar";
|
|
12
|
+
export * from "./MoreActionItem";
|
|
13
|
+
export * from "./MessageAction";
|
|
14
|
+
export * from "./Theme";
|
|
15
|
+
export * from "./MessageWrapper";
|
|
16
|
+
export * from "./Message";
|
|
17
|
+
export * from "./AudioBubble";
|
|
18
|
+
export * from "./AttachmentBubble";
|
|
19
|
+
export * from "./VideoBubble";
|
|
20
|
+
export * from "./ImageBubble";
|
|
21
|
+
export * from "./TextBubble";
|
|
22
|
+
export * from "./ArticleBubble";
|
|
23
|
+
export * from "./LocationBubble";
|
|
24
|
+
export * from "./InfoBubble";
|
|
25
|
+
export * from "./AttachmentBubbleInfo";
|
|
26
|
+
export * from "./Audio";
|
|
27
|
+
export * from "./Video";
|
|
28
|
+
export * from "./ReplyBubble";
|
|
29
|
+
export * from "./ReplyBubbleHeader";
|
|
30
|
+
export * from "./LazyLoadImage";
|
|
31
|
+
export * from './ReplyBubbleContent';
|
|
32
|
+
export * from './im';
|
|
51
33
|
|
|
52
34
|
// ... export other components
|
|
53
35
|
|
|
54
36
|
/*** CONSTANTS ***/
|
|
55
|
-
export * from
|
|
37
|
+
export * from "./constants";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zohoim/chat-components",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.11",
|
|
4
4
|
"description": "Chat Components",
|
|
5
5
|
"main": "es/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -36,12 +36,12 @@
|
|
|
36
36
|
"@zohodesk/utils": "1.3.9",
|
|
37
37
|
"@zohodesk/variables": "1.0.0-beta.30",
|
|
38
38
|
"@zohodesk/virtualizer": "1.0.13",
|
|
39
|
-
"@zohoim/chat-components-hooks": "^0.0.
|
|
40
|
-
"@zohoim/chat-components-utils": "^0.0.
|
|
39
|
+
"@zohoim/chat-components-hooks": "^0.0.9",
|
|
40
|
+
"@zohoim/chat-components-utils": "^0.0.8"
|
|
41
41
|
},
|
|
42
42
|
"devDependencies": {
|
|
43
43
|
"html-to-react": "^1.4.8",
|
|
44
44
|
"react-to-jsx": "^1.3.2"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "44251e037d721b4e14928c9c49028ea6d4080dc7"
|
|
47
47
|
}
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
/* eslint-disable react/jsx-no-bind */
|
|
2
|
-
/* eslint-disable max-len */
|
|
3
|
-
|
|
4
|
-
/** ** Libraries *** */
|
|
5
|
-
import React from 'react';
|
|
6
|
-
|
|
7
|
-
/** ** Hooks *** */
|
|
8
|
-
import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
|
|
9
|
-
|
|
10
|
-
/** ** Constants *** */
|
|
11
|
-
import imReplyBubbleDefaultProps from './props/defaultProps';
|
|
12
|
-
import imReplyBubblePropTypes from './props/propTypes';
|
|
13
|
-
|
|
14
|
-
/** ** Methods *** */
|
|
15
|
-
import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
|
|
16
|
-
import cssJSLogic from './css/cssJSLogic';
|
|
17
|
-
|
|
18
|
-
/** ** Styles *** */
|
|
19
|
-
import style from './css/IMReplyBubble.module.css';
|
|
20
|
-
export default function IMReplyBubble(props) {
|
|
21
|
-
const {
|
|
22
|
-
customStyle
|
|
23
|
-
} = props;
|
|
24
|
-
|
|
25
|
-
/* External customization */
|
|
26
|
-
const newStyle = useMergeStyle(style, customStyle);
|
|
27
|
-
/* CSS classnames added based on logic */
|
|
28
|
-
const {
|
|
29
|
-
imReplyBubbleClass
|
|
30
|
-
} = cssJSLogic(props, newStyle);
|
|
31
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
32
|
-
className: imReplyBubbleClass
|
|
33
|
-
}, "Working On this...");
|
|
34
|
-
}
|
|
35
|
-
IMReplyBubble.propTypes = imReplyBubblePropTypes;
|
|
36
|
-
IMReplyBubble.defaultProps = imReplyBubbleDefaultProps;
|
|
37
|
-
IMReplyBubble.displayName = 'IMReplyBubble';
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|