@zohoim/chat-components 0.0.29 → 1.0.1

package/es/AttachmentBubble/AttachmentBubble.js

@@ -28,7 +28,8 @@ export default function AttachmentBubble(props) {
     attachmentDetails,
     isFailed,
     isSending,
-    onClick: propOnClick
+    onClick: propOnClick,
+    attachmentBubbleTitle
   } = props;
   const {
     attachmentBubbleInfoProps,
@@ -38,6 +39,8 @@ export default function AttachmentBubble(props) {
     formattedFileSize: fileSize,
     fileName,
     fileFormat,
+    isDisabled,
+    isValidAttachment,
     mediaType,
     onClick
   } = useAttachmentBubble({
@@ -53,17 +56,21 @@ export default function AttachmentBubble(props) {
     attachmentBubbleClass
   } = cssJSLogic({
     isFailed,
-    isSending
+    isSending,
+    isDisabled
   }, newStyle);
   return /*#__PURE__*/React.createElement(Container, {
     alignBox: "row",
     className: attachmentBubbleClass,
+    "data-title": attachmentBubbleTitle,
     isCover: false,
     onClick: onClick
   }, /*#__PURE__*/React.createElement(Box, {
     className: newStyle.attachmentBubbleIcon
   }, /*#__PURE__*/React.createElement(AttachmentIcon, _extends({
     fileFormat: fileFormat,
+    isDisabled: isDisabled,
+    isValidAttachment: isValidAttachment,
     mediaType: mediaType
   }, attachmentIconProps))), /*#__PURE__*/React.createElement(Box, {
     className: newStyle.attachmentBubbleContent,

package/es/AttachmentBubble/css/AttachmentBubble.module.css

@@ -5,6 +5,11 @@
   border: 1px solid var(--imlib_chat_components_attachmentBubble_border_color);
 }
 
+.disabledAttachmentBubble {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+
 .failedAttachmentBubble {
   background-color: var(
     --imlib_chat_components_attachmentBubble_bg_color_failed

package/es/AttachmentBubble/css/cssJSLogic.js

@@ -2,12 +2,14 @@ import { compileClassNames } from '@zohodesk/utils';
 export default function cssJSLogic(props, style) {
   const {
     isFailed,
-    isSending
+    isSending,
+    isDisabled
   } = props;
   const attachmentBubbleClass = compileClassNames({
     [style.attachmentBubble]: true,
+    [style.disabledAttachmentBubble]: isDisabled,
     [style.failedAttachmentBubble]: isFailed,
-    [style.attachmentBubbleCursor]: !isSending,
+    [style.attachmentBubbleCursor]: !isSending && !isDisabled,
     [style.sendingdAttachmentBubble]: isSending
   });
   return {

package/es/AttachmentBubble/props/defaultProps.js

@@ -1,6 +1,7 @@
 /** ** Constants *** */
 import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
 const attachmentBubbleDefaultProps = {
+  attachmentBubbleTitle: '',
   customStyle: dummyObject,
   customProps: dummyObject
 };

package/es/AttachmentBubble/props/propTypes.js

@@ -13,6 +13,7 @@ const attachmentBubblePropTypes = {
   customStyle: PropTypes.object,
   isFailed: PropTypes.bool,
   isSending: PropTypes.bool,
-  onClick: PropTypes.func
+  onClick: PropTypes.func,
+  attachmentBubbleTitle: PropTypes.string
 };
 export default attachmentBubblePropTypes;

package/es/AttachmentIcon/AttachmentIcon.js

@@ -9,6 +9,7 @@ import attachmentIconDefaultProps from './props/defaultProps';
 import attachmentIconPropTypes from './props/propTypes';
 /** ** Methods *** */
 
+import cssJSLogic from './css/cssJSLogic';
 import getAttachmentIconComponent from './utils/getAttachmentIconComponent';
 import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
 /** ** Styles *** */
@@ -19,14 +20,23 @@ export default function AttachmentIcon(props) {
     customStyle,
     fileFormat,
     mediaType,
-    renderCustomIcon
+    isDisabled,
+    renderCustomIcon,
+    isValidAttachment
   } = props;
   /* External CSS Customization */
 
   const newStyle = useMergeStyle(style, customStyle);
+  /* css classnames added based on logic */
+
+  const {
+    iconStyleClass
+  } = cssJSLogic({
+    isDisabled
+  }, newStyle);
   const iconCustomStyle = useMemo(() => ({
-    base: newStyle.icon
-  }), [newStyle.icon]);
+    base: iconStyleClass
+  }), [iconStyleClass]);
   /* Custom Icon Renderer */
 
   if (renderCustomIcon) {
@@ -38,7 +48,8 @@ export default function AttachmentIcon(props) {
     IconComponent
   } = getAttachmentIconComponent({
     fileFormat,
-    mediaType
+    mediaType,
+    isValidAttachment
   });
   return IconComponent ? /*#__PURE__*/React.createElement(IconComponent, {
     customStyle: iconCustomStyle

package/es/AttachmentIcon/css/AttachmentIcon.module.css

@@ -2,3 +2,7 @@
   width: var(--zd_size20)  !important;
   height: var(--zd_size20)  !important;
 }
+
+.disabledIcon {
+  cursor: not-allowed !important;
+}

package/es/AttachmentIcon/css/cssJSLogic.js

@@ -0,0 +1,13 @@
+import { compileClassNames } from '@zohodesk/utils';
+export default function cssJSLogic(props, style) {
+  const {
+    isDisabled
+  } = props;
+  const iconStyleClass = compileClassNames({
+    [style.icon]: true,
+    [style.disabledIcon]: isDisabled
+  });
+  return {
+    iconStyleClass
+  };
+}

package/es/AttachmentIcon/props/defaultProps.js

@@ -1,6 +1,8 @@
 /** ** Constants *** */
 import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
 const attachmentIconDefaultProps = {
+  isDisabled: false,
+  isValidAttachment: true,
   customStyle: dummyObject
 };
 export default attachmentIconDefaultProps;

package/es/AttachmentIcon/props/propTypes.js

@@ -13,7 +13,9 @@ const fileFormats = JSON.parse(JSON.stringify(Object.values(attachmentFileTypes)
 const attachmentIconPropTypes = {
   fileFormat: PropTypes.oneOf(fileFormats).isRequired,
   mediaType: PropTypes.oneOf([AUDIO, VIDEO, IMAGE]).isRequired,
+  isDisabled: PropTypes.bool,
   customStyle: PropTypes.object,
-  renderCustomIcon: PropTypes.func
+  renderCustomIcon: PropTypes.func,
+  isValidAttachment: PropTypes.bool
 };
 export default attachmentIconPropTypes;

package/es/AttachmentIcon/utils/getAttachmentIconComponent.js

@@ -7,6 +7,9 @@ import TextIcon from '../../icons/iconSrc/attachments/Text';
 import UnknownIcon from '../../icons/iconSrc/attachments/Unknown';
 import VideoIcon from '../../icons/iconSrc/attachments/Video';
 import ZipIcon from '../../icons/iconSrc/attachments/Zip';
+import AlertIcon from '../../icons/iconSrc/common/AlertTriangle';
+import XlsIcon from '../../icons/iconSrc/attachments/Xls';
+import PptIcon from '../../icons/iconSrc/attachments/Ppt';
 /** ** Constants *** */
 
 import attachmentFileTypes from '@zohoim/chat-components-utils/es/constants/attachmentFileTypes';
@@ -27,13 +30,17 @@ const {
   CSS,
   TEXT,
   PLAIN,
+  XLS,
+  PPT,
   ZIP,
-  UNDEFINED
+  UNDEFINED,
+  INVALID
 } = attachmentFileTypes;
 export default function getAttachmentIconComponent(_ref) {
   let {
     fileFormat,
-    mediaType
+    mediaType,
+    isValidAttachment
   } = _ref;
   const iconMapping = {
     [SVG]: CodeIcon,
@@ -52,10 +59,22 @@ export default function getAttachmentIconComponent(_ref) {
     [CSS]: CodeIcon,
     [TEXT]: TextIcon,
     [PLAIN]: TextIcon,
+    [XLS]: XlsIcon,
+    [PPT]: PptIcon,
     [ZIP]: ZipIcon,
-    [UNDEFINED]: UnknownIcon
+    [UNDEFINED]: UnknownIcon,
+    [INVALID]: AlertIcon
   };
-  const IconComponent = attachmentFileTypes[mediaType] ? iconMapping[attachmentFileTypes[mediaType]] : iconMapping[fileFormat] || iconMapping[UNDEFINED];
+  let IconComponent;
+
+  if (!isValidAttachment) {
+    IconComponent = iconMapping[INVALID];
+  } else if (attachmentFileTypes[mediaType]) {
+    IconComponent = iconMapping[attachmentFileTypes[mediaType]];
+  } else {
+    IconComponent = iconMapping[fileFormat] || iconMapping[UNDEFINED];
+  }
+
   return {
     IconComponent
   };

package/es/MessageAction/props/propTypes.js

@@ -6,10 +6,6 @@ import { defaultMessageActions } from '@zohoim/chat-components-utils/es/constant
 const messageActionPropTypes = {
   displayText: PropTypes.string.isRequired,
   id: PropTypes.oneOf(Object.values(defaultMessageActions)).isRequired,
-  // id: PropTypes.oneOfType([
-  //   PropTypes.oneOf(Object.values(defaultMessageActions)),
-  //   PropTypes.string
-  // ]).isRequired,
   onClick: PropTypes.func.isRequired,
   onMouseEnter: PropTypes.func,
   closePopup: PropTypes.func,

package/es/ReplyBubble/ReplyBubble.js

@@ -44,7 +44,8 @@ export default function ReplyBubble(props) {
     fileName,
     fileURL,
     fileFormat,
-    mediaType
+    mediaType,
+    isValidAttachment
   } = attachmentDetails || dummyObject;
   /* External CSS Customization */
 
@@ -93,12 +94,13 @@ export default function ReplyBubble(props) {
       return /*#__PURE__*/React.createElement(AttachmentIcon, _extends({
         customStyle: iconStyle,
         fileFormat: fileFormat,
+        isValidAttachment: isValidAttachment,
         mediaType: mediaType
       }, iconProps));
     }
 
     return null;
-  }, [fileURL, fileName, fileFormat, mediaType, iconStyle, iconProps, newStyle.image, imageWrapperClass]);
+  }, [fileURL, fileName, fileFormat, isValidAttachment, mediaType, iconStyle, iconProps, newStyle.image, imageWrapperClass]);
   return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ReplyBubbleHeader, _extends({
     dateTimeDetails: dateTimeDetails,
     isFailed: isFailed,

package/es/ReplyBubble/props/propTypes.js

@@ -9,6 +9,7 @@ const replyBubblePropTypes = {
     fileFormat: PropTypes.string,
     fileName: PropTypes.string,
     fileURL: PropTypes.string,
+    isValidAttachment: PropTypes.bool,
     mediaType: PropTypes.string
   }),
   locationUrl: PropTypes.string,

package/es/Theme/themeVariables/commonThemeColorVariable.js

@@ -6,7 +6,7 @@ export const imIntegrationIcon = {
   wechat_color: '#2dc100',
   line_color: '#01b901',
   twillio_color: '#f22f46',
-  instagram_color: 'red',
+  instagram_color: 'linear-gradient(221.05deg,#933ab9 11.59%,#d12f8c 50.45%,#fdbb59 85.46%);',
   asap_color: '#0a73eb',
   fb_color: '#006aff'
 };

package/es/icons/factory/attachments/ppt.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30.52 30.27"><defs><style>.cls-1{fill:#010101;}.cls-2{fill:#c8cadb;opacity:.5;}</style></defs><rect class="cls-2" x="4.25" y="4" width="26.27" height="26.27" rx="3.16" ry="3.16"/><path class="cls-1" d="M29.75,10.13L21.12,.34c-.19-.22-.46-.34-.75-.34H4.11C1.84,0,0,1.84,0,4.11V25.88c0,2.27,1.84,4.11,4.11,4.11H25.89c2.27,0,4.11-1.84,4.11-4.11V10.79c0-.24-.09-.48-.25-.66Zm-1.75,15.75c0,1.16-.95,2.11-2.11,2.11H4.11c-1.16,0-2.11-.95-2.11-2.11V4.11c0-1.16,.95-2.11,2.11-2.11h15.66V7.94c0,1.93,1.57,3.5,3.5,3.5h4.73v14.44Zm-5.83-13.7h-6.17v-.84c0-.55-.45-1-1-1s-1,.45-1,1v.84H7.83c-.55,0-1,.45-1,1v8.78c0,.55,.45,1,1,1h2.76l-.59,.97c-.29,.47-.14,1.09,.33,1.37,.16,.1,.34,.15,.52,.15,.34,0,.67-.17,.85-.48l1.23-2.01h3.89l1.23,2.01c.19,.31,.52,.48,.85,.48,.18,0,.36-.05,.52-.15,.47-.29,.62-.9,.33-1.37l-.59-.97h3c.55,0,1-.45,1-1V13.17c0-.55-.45-1-1-1Zm-1,8.78H8.83v-6.78h12.34v6.78Z"/></svg>

package/es/icons/factory/attachments/xls.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30.27"><defs><style>.cls-1{fill:#010101;}.cls-2{fill:#c8cadb;opacity:.5;}</style></defs><rect class="cls-2" x="3.73" y="4" width="26.27" height="26.27" rx="3.16" ry="3.16"/><path class="cls-1" d="M14.58,16.36l4.24,6.07h-3.27l-2.6-3.76-1.19,1.66h1.19v2.1H7.07l4.32-6.07-3.79-5.5h3.13l2.23,3.18,2.23-3.18h3.13l-3.72,5.5Zm15.42-5.57v15.09c0,2.27-1.84,4.11-4.11,4.11H4.11c-2.27,0-4.11-1.84-4.11-4.11V4.11C0,1.84,1.84,0,4.11,0H20.38c.29,0,.56,.12,.75,.34l8.62,9.79c.16,.18,.25,.42,.25,.66Zm-2,.65h-4.73c-1.93,0-3.5-1.57-3.5-3.5V2H4.11c-1.16,0-2.11,.95-2.11,2.11V25.88c0,1.16,.95,2.11,2.11,2.11H25.89c1.16,0,2.11-.95,2.11-2.11V11.44Z"/></svg>

package/es/icons/factory/common/alertTriangle.svg

@@ -0,0 +1,5 @@
+<svg width="29" height="29" viewBox="0 0 29 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.79264 28.179C6.25485 28.1726 5.72811 28.0254 5.26489 27.752C4.80164 27.4789 4.41804 27.0891 4.15227 26.6215C3.8865 26.1539 3.74782 25.6248 3.75003 25.087C3.75225 24.5492 3.89527 24.0212 4.16488 23.5559L13.9607 7.09663C14.229 6.63566 14.6136 6.25317 15.076 5.9873C15.5385 5.72146 16.0626 5.58154 16.596 5.58154C17.1293 5.58154 17.6534 5.72146 18.1158 5.9873C18.5783 6.25317 18.9628 6.63566 19.2312 7.09663L29.0195 23.5634C29.2809 24.0231 29.4232 24.5408 29.4336 25.0693C29.4376 25.475 29.3613 25.8774 29.2092 26.2535C29.0573 26.6298 28.8324 26.9722 28.5476 27.2611C28.263 27.5501 27.9238 27.7799 27.5499 27.9375C27.1761 28.095 26.7748 28.1771 26.3691 28.179H6.79264ZM15.2557 7.84957L5.46747 24.3164C5.26169 24.6774 5.20635 25.1051 5.31343 25.5068C5.42052 25.9083 5.68143 26.2516 6.0397 26.4623C6.26775 26.5976 6.52749 26.6703 6.79264 26.6731H26.3691C26.7793 26.6575 27.1667 26.4813 27.4485 26.1829C27.7301 25.8844 27.8831 25.4872 27.875 25.0768C27.8722 24.8116 27.7995 24.552 27.6642 24.3239L17.9061 7.84957C17.7999 7.67397 17.6601 7.52104 17.4948 7.39959C17.3294 7.27813 17.1416 7.19054 16.9423 7.14181C16.7456 7.09174 16.5409 7.08193 16.3403 7.11299C16.1398 7.14403 15.9476 7.21531 15.7752 7.32251C15.5628 7.45463 15.3848 7.63527 15.2557 7.84957Z" fill="#AB1A18"/>
+<path d="M16.5801 19.6704C16.3804 19.6704 16.1889 19.5911 16.0477 19.45C15.9065 19.3088 15.8271 19.1172 15.8271 18.9174V13.4512C15.8271 13.2515 15.9065 13.06 16.0477 12.9188C16.1889 12.7776 16.3804 12.6982 16.5801 12.6982C16.7798 12.6982 16.9713 12.7776 17.1125 12.9188C17.2537 13.06 17.333 13.2515 17.333 13.4512V18.9174C17.333 19.1172 17.2537 19.3088 17.1125 19.45C16.9713 19.5911 16.7798 19.6704 16.5801 19.6704Z" fill="#AB1A18"/>
+<path d="M16.5801 23.5183C16.481 23.5189 16.3828 23.4999 16.291 23.4624C16.1993 23.4249 16.1159 23.3698 16.0455 23.3C15.9757 23.2296 15.9205 23.1462 15.883 23.0543C15.8456 22.9626 15.8266 22.8644 15.8272 22.7654C15.828 22.5677 15.9064 22.3785 16.0455 22.2383C16.1155 22.1677 16.1988 22.1116 16.2905 22.0734C16.3823 22.0352 16.4807 22.0156 16.5801 22.0156C16.6795 22.0156 16.7779 22.0352 16.8697 22.0734C16.9614 22.1116 17.0447 22.1677 17.1147 22.2383C17.2538 22.3785 17.3322 22.5677 17.333 22.7654C17.3312 22.8661 17.3107 22.9656 17.2728 23.059C17.2361 23.1488 17.1824 23.2305 17.1147 23.3C17.0443 23.3698 16.9609 23.4249 16.8692 23.4624C16.7774 23.4999 16.6792 23.5189 16.5801 23.5183Z" fill="#AB1A18"/>
+</svg>

package/es/icons/iconSrc/attachments/Ppt.js

@@ -0,0 +1,26 @@
+/* eslint-disable */
+import React from 'react';
+import Icon from '@zohodesk/icon/es/Icon/Icon';
+export default function IconComponent(props) {
+  return /*#__PURE__*/React.createElement(Icon, props, /*#__PURE__*/React.createElement("svg", {
+    id: "Layer_1",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 30.52 30.27"
+  }, " ", /*#__PURE__*/React.createElement("defs", null, " ", /*#__PURE__*/React.createElement("style", {
+    dangerouslySetInnerHTML: {
+      __html: `.cls-1{fill:#010101;}.cls-2{fill:#c8cadb;opacity:.5;}`
+    }
+  }), " "), " ", /*#__PURE__*/React.createElement("rect", {
+    className: "cls-2",
+    x: "4.25",
+    y: "4",
+    width: "26.27",
+    height: "26.27",
+    rx: "3.16",
+    ry: "3.16"
+  }), " ", /*#__PURE__*/React.createElement("path", {
+    className: "path-0",
+    d: "M29.75,10.13L21.12,.34c-.19-.22-.46-.34-.75-.34H4.11C1.84,0,0,1.84,0,4.11V25.88c0,2.27,1.84,4.11,4.11,4.11H25.89c2.27,0,4.11-1.84,4.11-4.11V10.79c0-.24-.09-.48-.25-.66Zm-1.75,15.75c0,1.16-.95,2.11-2.11,2.11H4.11c-1.16,0-2.11-.95-2.11-2.11V4.11c0-1.16,.95-2.11,2.11-2.11h15.66V7.94c0,1.93,1.57,3.5,3.5,3.5h4.73v14.44Zm-5.83-13.7h-6.17v-.84c0-.55-.45-1-1-1s-1,.45-1,1v.84H7.83c-.55,0-1,.45-1,1v8.78c0,.55,.45,1,1,1h2.76l-.59,.97c-.29,.47-.14,1.09,.33,1.37,.16,.1,.34,.15,.52,.15,.34,0,.67-.17,.85-.48l1.23-2.01h3.89l1.23,2.01c.19,.31,.52,.48,.85,.48,.18,0,.36-.05,.52-.15,.47-.29,.62-.9,.33-1.37l-.59-.97h3c.55,0,1-.45,1-1V13.17c0-.55-.45-1-1-1Zm-1,8.78H8.83v-6.78h12.34v6.78Z"
+  }), " "));
+}
+IconComponent.propTypes = Icon.propTypes;

package/es/icons/iconSrc/attachments/Xls.js

@@ -0,0 +1,26 @@
+/* eslint-disable */
+import React from 'react';
+import Icon from '@zohodesk/icon/es/Icon/Icon';
+export default function IconComponent(props) {
+  return /*#__PURE__*/React.createElement(Icon, props, /*#__PURE__*/React.createElement("svg", {
+    id: "Layer_1",
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 30 30.27"
+  }, " ", /*#__PURE__*/React.createElement("defs", null, " ", /*#__PURE__*/React.createElement("style", {
+    dangerouslySetInnerHTML: {
+      __html: `.cls-1{fill:#010101;}.cls-2{fill:#c8cadb;opacity:.5;}`
+    }
+  }), " "), " ", /*#__PURE__*/React.createElement("rect", {
+    className: "cls-2",
+    x: "3.73",
+    y: "4",
+    width: "26.27",
+    height: "26.27",
+    rx: "3.16",
+    ry: "3.16"
+  }), " ", /*#__PURE__*/React.createElement("path", {
+    className: "path-0",
+    d: "M14.58,16.36l4.24,6.07h-3.27l-2.6-3.76-1.19,1.66h1.19v2.1H7.07l4.32-6.07-3.79-5.5h3.13l2.23,3.18,2.23-3.18h3.13l-3.72,5.5Zm15.42-5.57v15.09c0,2.27-1.84,4.11-4.11,4.11H4.11c-2.27,0-4.11-1.84-4.11-4.11V4.11C0,1.84,1.84,0,4.11,0H20.38c.29,0,.56,.12,.75,.34l8.62,9.79c.16,.18,.25,.42,.25,.66Zm-2,.65h-4.73c-1.93,0-3.5-1.57-3.5-3.5V2H4.11c-1.16,0-2.11,.95-2.11,2.11V25.88c0,1.16,.95,2.11,2.11,2.11H25.89c1.16,0,2.11-.95,2.11-2.11V11.44Z"
+  }), " "));
+}
+IconComponent.propTypes = Icon.propTypes;

package/es/icons/iconSrc/attachments/index.js

@@ -2,7 +2,9 @@ export { default as Audio } from './Audio';
 export { default as Code } from './Code';
 export { default as Image } from './Image';
 export { default as Pdf } from './Pdf';
+export { default as Ppt } from './Ppt';
 export { default as Text } from './Text';
 export { default as Unknown } from './Unknown';
 export { default as Video } from './Video';
+export { default as Xls } from './Xls';
 export { default as Zip } from './Zip';

package/es/icons/iconSrc/common/AlertTriangle.js

@@ -0,0 +1,23 @@
+/* eslint-disable */
+import React from 'react';
+import Icon from '@zohodesk/icon/es/Icon/Icon';
+export default function IconComponent(props) {
+  return /*#__PURE__*/React.createElement(Icon, props, /*#__PURE__*/React.createElement("svg", {
+    viewBox: "0 0 29 29",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, " ", /*#__PURE__*/React.createElement("path", {
+    d: "M6.79264 28.179C6.25485 28.1726 5.72811 28.0254 5.26489 27.752C4.80164 27.4789 4.41804 27.0891 4.15227 26.6215C3.8865 26.1539 3.74782 25.6248 3.75003 25.087C3.75225 24.5492 3.89527 24.0212 4.16488 23.5559L13.9607 7.09663C14.229 6.63566 14.6136 6.25317 15.076 5.9873C15.5385 5.72146 16.0626 5.58154 16.596 5.58154C17.1293 5.58154 17.6534 5.72146 18.1158 5.9873C18.5783 6.25317 18.9628 6.63566 19.2312 7.09663L29.0195 23.5634C29.2809 24.0231 29.4232 24.5408 29.4336 25.0693C29.4376 25.475 29.3613 25.8774 29.2092 26.2535C29.0573 26.6298 28.8324 26.9722 28.5476 27.2611C28.263 27.5501 27.9238 27.7799 27.5499 27.9375C27.1761 28.095 26.7748 28.1771 26.3691 28.179H6.79264ZM15.2557 7.84957L5.46747 24.3164C5.26169 24.6774 5.20635 25.1051 5.31343 25.5068C5.42052 25.9083 5.68143 26.2516 6.0397 26.4623C6.26775 26.5976 6.52749 26.6703 6.79264 26.6731H26.3691C26.7793 26.6575 27.1667 26.4813 27.4485 26.1829C27.7301 25.8844 27.8831 25.4872 27.875 25.0768C27.8722 24.8116 27.7995 24.552 27.6642 24.3239L17.9061 7.84957C17.7999 7.67397 17.6601 7.52104 17.4948 7.39959C17.3294 7.27813 17.1416 7.19054 16.9423 7.14181C16.7456 7.09174 16.5409 7.08193 16.3403 7.11299C16.1398 7.14403 15.9476 7.21531 15.7752 7.32251C15.5628 7.45463 15.3848 7.63527 15.2557 7.84957Z",
+    fill: "#AB1A18",
+    className: "path-0"
+  }), " ", /*#__PURE__*/React.createElement("path", {
+    d: "M16.5801 19.6704C16.3804 19.6704 16.1889 19.5911 16.0477 19.45C15.9065 19.3088 15.8271 19.1172 15.8271 18.9174V13.4512C15.8271 13.2515 15.9065 13.06 16.0477 12.9188C16.1889 12.7776 16.3804 12.6982 16.5801 12.6982C16.7798 12.6982 16.9713 12.7776 17.1125 12.9188C17.2537 13.06 17.333 13.2515 17.333 13.4512V18.9174C17.333 19.1172 17.2537 19.3088 17.1125 19.45C16.9713 19.5911 16.7798 19.6704 16.5801 19.6704Z",
+    fill: "#AB1A18",
+    className: "path-1"
+  }), " ", /*#__PURE__*/React.createElement("path", {
+    d: "M16.5801 23.5183C16.481 23.5189 16.3828 23.4999 16.291 23.4624C16.1993 23.4249 16.1159 23.3698 16.0455 23.3C15.9757 23.2296 15.9205 23.1462 15.883 23.0543C15.8456 22.9626 15.8266 22.8644 15.8272 22.7654C15.828 22.5677 15.9064 22.3785 16.0455 22.2383C16.1155 22.1677 16.1988 22.1116 16.2905 22.0734C16.3823 22.0352 16.4807 22.0156 16.5801 22.0156C16.6795 22.0156 16.7779 22.0352 16.8697 22.0734C16.9614 22.1116 17.0447 22.1677 17.1147 22.2383C17.2538 22.3785 17.3322 22.5677 17.333 22.7654C17.3312 22.8661 17.3107 22.9656 17.2728 23.059C17.2361 23.1488 17.1824 23.2305 17.1147 23.3C17.0443 23.3698 16.9609 23.4249 16.8692 23.4624C16.7774 23.4999 16.6792 23.5189 16.5801 23.5183Z",
+    fill: "#AB1A18",
+    className: "path-2"
+  }), " "));
+}
+IconComponent.propTypes = Icon.propTypes;

package/es/icons/iconSrc/common/index.js

@@ -1,2 +1,3 @@
+export { default as AlertTriangle } from './AlertTriangle';
 export { default as Article } from './Article';
 export { default as Reply } from './Reply';

package/es/im/IMIntegrationIcon/IMIntegrationIcon.js

@@ -20,7 +20,8 @@ const {
   WECHAT,
   TWILLIO,
   LINE,
-  FACEBOOKMESSENGER
+  FACEBOOKMESSENGER,
+  INSTAGRAM
 } = integrationConstants;
 const fontIconMap = {
   [TWILLIO]: 'ZD-TT-imtwillio',
@@ -29,7 +30,8 @@ const fontIconMap = {
   [WECHAT]: 'ZD-TT-imWeChat',
   [LINE]: 'ZD-TT-imLine',
   [IM_TALK]: 'ZD-TT-imASAP',
-  [FACEBOOKMESSENGER]: 'ZD-TT-fbMessanger'
+  [FACEBOOKMESSENGER]: 'ZD-TT-fbMessanger',
+  [INSTAGRAM]: 'ZD-TT-instagram'
 };
 export default function IMIntegrationIcon(props) {
   const {

package/es/im/IMMessage/IMMessage.js

@@ -36,9 +36,9 @@ export default function IMMessage(props) {
     replyText,
     seeMoreText,
     deleteMessageText,
-    autoMessagesI18N,
-    autoMessagesTitleI18N,
+    messageBubbleTitleI18N,
     messageStatusI18N,
+    messageMetaInfoI18N,
     onLoadFullMessage,
     onClickReply,
     onTicketClick,
@@ -78,8 +78,8 @@ export default function IMMessage(props) {
     messageStatus,
     isFailedMessage,
     isSendingMessage,
-    isAgentMessage,
     messageStatusTitle,
+    isValidAttachment,
     dateTimeDetails,
     autoMessageType,
     // messageId,
@@ -100,14 +100,14 @@ export default function IMMessage(props) {
       tooltip
     } = dateTimeDetails || {};
     return /*#__PURE__*/React.createElement(IMMessageMeta, _extends({
-      autoMessagesI18N: autoMessagesI18N,
-      autoMessagesTitleI18N: autoMessagesTitleI18N,
       autoMessageType: autoMessageType,
       direction: direction,
+      isValidAttachment: isValidAttachment,
+      messageMetaInfoI18N: messageMetaInfoI18N,
       time: isShowMessageTime ? displayDateTime : '',
       timeTooltip: tooltip
     }, imMessageMetaProps));
-  }, [isShowMessageTime, dateTimeDetails, direction, autoMessageType, imMessageMetaProps, autoMessagesI18N, autoMessagesTitleI18N]);
+  }, [isShowMessageTime, dateTimeDetails, direction, autoMessageType, imMessageMetaProps, isValidAttachment, messageMetaInfoI18N]);
   /** ** Render Message Content *** */
 
   const handleRenderMessage = useCallback(() => /*#__PURE__*/React.createElement(IMMessageContent, _extends({
@@ -115,6 +115,7 @@ export default function IMMessage(props) {
     isFailed: isFailedMessage,
     isSending: isSendingMessage,
     isShowFullContent: isShowFullContent,
+    messageBubbleTitleI18N: messageBubbleTitleI18N,
     messageContentClickMapping: messageContentClickMapping,
     messageDetails: messageDetails,
     onClickReply: onClickReply,
@@ -122,7 +123,7 @@ export default function IMMessage(props) {
     replyText: replyText,
     seeMoreText: seeMoreText,
     sessionDetails: sessionDetails
-  }, imMessageContentProps)), [seeMoreText, replyText, deleteMessageText, messageDetails, sessionDetails, messageContentClickMapping, onLoadFullMessage, onClickReply, isFailedMessage, isSendingMessage, imMessageContentProps, isShowFullContent]);
+  }, imMessageContentProps)), [seeMoreText, replyText, deleteMessageText, messageDetails, sessionDetails, messageContentClickMapping, messageBubbleTitleI18N, onLoadFullMessage, onClickReply, isFailedMessage, isSendingMessage, imMessageContentProps, isShowFullContent]);
   /** ** Render Secondary Actions - TicketId *** */
 
   const handleRenderSecondaryActions = useCallback(() => {

package/es/im/IMMessage/props/defaultProps.js

@@ -6,6 +6,8 @@ const imMessageDefaultProps = {
   messageDetails: dummyObject,
   sessionDetails: dummyObject,
   messageStatusI18N: dummyObject,
+  messageBubbleTitleI18N: dummyObject,
+  messageMetaInfoI18N: dummyObject,
   customProps: dummyObject,
   customStyle: dummyObject,
   messageDisplayProps: dummyObject,

package/es/im/IMMessage/props/propTypes.js

@@ -78,17 +78,26 @@ const imMessagePropTypes = {
     [SENT]: PropTypes.string,
     [UNSENT]: PropTypes.string
   }),
-  autoMessagesI18N: PropTypes.shape({
-    [UN_SUPPORTED_FILE]: PropTypes.string,
-    [WELCOMEMSG]: PropTypes.string,
-    [WORKFLOW_MESSAGE]: PropTypes.string,
-    [WORKFLOW_NOTIFICATION]: PropTypes.string
+  messageBubbleTitleI18N: PropTypes.shape({
+    attachmentBubbleTitle: PropTypes.string
   }),
-  autoMessagesTitleI18N: PropTypes.shape({
-    [UN_SUPPORTED_FILE]: PropTypes.string,
-    [WELCOMEMSG]: PropTypes.string,
-    [WORKFLOW_MESSAGE]: PropTypes.string,
-    [WORKFLOW_NOTIFICATION]: PropTypes.string
+  messageMetaInfoI18N: PropTypes.shape({
+    autoMessagesI18N: PropTypes.shape({
+      [UN_SUPPORTED_FILE]: PropTypes.string,
+      [WELCOMEMSG]: PropTypes.string,
+      [WORKFLOW_MESSAGE]: PropTypes.string,
+      [WORKFLOW_NOTIFICATION]: PropTypes.string
+    }),
+    autoMessagesTitleI18N: PropTypes.shape({
+      [UN_SUPPORTED_FILE]: PropTypes.string,
+      [WELCOMEMSG]: PropTypes.string,
+      [WORKFLOW_MESSAGE]: PropTypes.string,
+      [WORKFLOW_NOTIFICATION]: PropTypes.string
+    }),
+    restrictedAttachmentMetaInfo: PropTypes.shape({
+      info: PropTypes.string,
+      title: PropTypes.string
+    })
   }),
   actions: PropTypes.arrayOf(PropTypes.shape({
     displayText: PropTypes.string.isRequired,

package/es/im/IMMessageContent/IMMessageContent.js

@@ -41,6 +41,7 @@ export default function IMMessageContent(props) {
     isFailed,
     isSending,
     messageContentClickMapping,
+    messageBubbleTitleI18N,
     isShowFullContent
   } = props;
   const {
@@ -56,6 +57,9 @@ export default function IMMessageContent(props) {
     onImageBubbleClick,
     onAttachmentBubbleClick
   } = messageContentClickMapping;
+  const {
+    attachmentBubbleTitle
+  } = messageBubbleTitleI18N || dummyObject;
   const {
     isShowLayoutBubble,
     isShowReplyBubble,
@@ -102,6 +106,7 @@ export default function IMMessageContent(props) {
     audioDetails: attachmentDetails,
     isFailed: isFailed
   }, audioBubbleProps))) : null, isShowAttachmentBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(AttachmentBubble, _extends({
+    attachmentBubbleTitle: attachmentBubbleTitle,
     attachmentDetails: attachmentDetails,
     isFailed: isFailed,
     isSending: isSending,

package/es/im/IMMessageContent/props/defaultProps.js

@@ -3,6 +3,7 @@ import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyCon
 const imMessageContentDefaultProps = {
   customStyle: dummyObject,
   customProps: dummyObject,
+  messageBubbleTitleI18N: dummyObject,
   messageContentClickMapping: dummyObject
 };
 export default imMessageContentDefaultProps;

package/es/im/IMMessageContent/props/propTypes.js

@@ -28,6 +28,9 @@ const imMessageContentPropTypes = {
   }),
   onClick: PropTypes.func,
   messageContentClickMapping: PropTypes.object,
+  messageBubbleTitleI18N: PropTypes.shape({
+    attachmentBubbleTitle: PropTypes.string
+  }),
   onLoadFullMessage: PropTypes.func,
   onClickReply: PropTypes.func,
   seeMoreText: PropTypes.string,

package/es/im/IMMessageMeta/IMMessageMeta.js

@@ -5,6 +5,7 @@ import React from 'react';
 /** ** Hooks *** */
 
 import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
+import useIMMessageMeta from '@zohoim/chat-components-hooks/es/im/IMMessageMeta/useIMMessageMeta';
 /** ** Constants *** */
 
 import imMessageMetaDefaultProps from './props/defaultProps';
@@ -19,21 +20,29 @@ import style from './css/IMMessageMeta.module.css';
 /** ** Components *** */
 
 import { Container } from '@zohodesk/components/es/Layout';
-import IMAutoMessageInfo from '../IMAutoMessageInfo/IMAutoMessageInfo';
+import IMMessageMetaInfo from '../IMMessageMetaInfo/IMMessageMetaInfo';
 export default function IMMessageMeta(props) {
   const {
     direction,
     customStyle,
     time,
     timeTooltip,
+    messageMetaInfoI18N,
     autoMessageType,
-    autoMessagesI18N,
-    autoMessagesTitleI18N,
+    isValidAttachment,
     customProps
   } = props;
   const {
-    imAutoMessageInfoProps = dummyObject
+    imMessageMetaInfoProps = dummyObject
   } = customProps;
+  const {
+    imMessageMetaInfoTitle,
+    imMessageMetaInfoContent
+  } = useIMMessageMeta({
+    messageMetaInfoI18N,
+    autoMessageType,
+    isValidAttachment
+  });
   /* External CSS Customization */
 
   const newStyle = useMergeStyle(style, customStyle);
@@ -45,19 +54,18 @@ export default function IMMessageMeta(props) {
   } = cssJSLogic({
     direction
   }, newStyle);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, autoMessageType || time ? /*#__PURE__*/React.createElement(Container, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, imMessageMetaInfoContent || time ? /*#__PURE__*/React.createElement(Container, {
     alignBox: "row",
     className: imMessageMetaClass
-  }, autoMessageType ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IMAutoMessageInfo, _extends({
-    autoMessagesI18N: autoMessagesI18N,
-    autoMessagesTitleI18N: autoMessagesTitleI18N,
-    autoMessageType: autoMessageType
-  }, imAutoMessageInfoProps))) : null, time ? /*#__PURE__*/React.createElement(React.Fragment, null, autoMessageType ? /*#__PURE__*/React.createElement("div", {
+  }, imMessageMetaInfoContent ? /*#__PURE__*/React.createElement(IMMessageMetaInfo, _extends({
+    imMessageMetaInfoContent: imMessageMetaInfoContent,
+    imMessageMetaInfoTitle: imMessageMetaInfoTitle
+  }, imMessageMetaInfoProps)) : null, imMessageMetaInfoContent && time ? /*#__PURE__*/React.createElement("div", {
     className: dotClass
-  }, "\u22C5") : null, /*#__PURE__*/React.createElement("div", {
+  }, "\u22C5") : null, time ? /*#__PURE__*/React.createElement("div", {
     className: newStyle.dateTime,
     "data-title": timeTooltip
-  }, time)) : null) : null);
+  }, time) : null) : null);
 }
 IMMessageMeta.propTypes = imMessageMetaPropTypes;
 IMMessageMeta.defaultProps = imMessageMetaDefaultProps;

package/es/im/IMMessageMeta/css/IMMessageMeta.module.css

@@ -10,6 +10,11 @@
   margin-top: var(--imMessageMeta-gap);
 }
 
+.imMessageMetaIncoming {
+  flex-direction: row-reverse;
+  justify-content: flex-end;
+}
+
 .dot {
   composes: varClass;
   margin: 0 var(--imMessageMeta-separator_gap);
@@ -36,6 +41,6 @@
   /* max-width: 100px; */
   /* display: flex; */
   max-width: var(--zd_size100) ;
-  composes: dotted from "../../css/common.module.css";
+  composes: dotted from '../../css/common.module.css';
   color: var(--imlib_chat_components_imMessageMeta_time_color);
 }

package/es/im/IMMessageMeta/css/cssJSLogic.js

@@ -15,6 +15,7 @@ export default function cssJSLogic(props, style) {
   });
   const imMessageMetaClass = compileClassNames({
     [style.imMessageMeta]: true,
+    [style.imMessageMetaIncoming]: isIncoming,
     [style.leftTime]: isIncoming,
     [style.rightTime]: isOutgoing
   });

package/es/im/IMMessageMeta/props/defaultProps.js

@@ -4,7 +4,8 @@ import { direction as directionConstants } from '@zohoim/chat-components-utils/e
 const imMessageMetaDefaultProps = {
   customStyle: dummyObject,
   customProps: dummyObject,
-  autoMessageCustomStyle: dummyObject,
+  messageMetaInfoI18N: dummyObject,
+  isValidAttachment: true,
   direction: directionConstants.IN
 };
 export default imMessageMetaDefaultProps;

package/es/im/IMMessageMeta/props/propTypes.js

@@ -13,21 +13,28 @@ const {
 const imMessageMetaPropTypes = {
   direction: PropTypes.oneOf(Object.values(direction)).isRequired,
   time: PropTypes.string.isRequired,
+  isValidAttachment: PropTypes.bool,
   autoMessageType: PropTypes.oneOf(Object.values(autoMessageTypes)),
-  autoMessagesI18N: PropTypes.shape({
-    [UN_SUPPORTED_FILE]: PropTypes.string,
-    [WELCOMEMSG]: PropTypes.string,
-    [WORKFLOW_MESSAGE]: PropTypes.string,
-    [WORKFLOW_NOTIFICATION]: PropTypes.string
-  }),
-  autoMessagesTitleI18N: PropTypes.shape({
-    [UN_SUPPORTED_FILE]: PropTypes.string,
-    [WELCOMEMSG]: PropTypes.string,
-    [WORKFLOW_MESSAGE]: PropTypes.string,
-    [WORKFLOW_NOTIFICATION]: PropTypes.string
+  messageMetaInfoI18N: PropTypes.shape({
+    autoMessagesI18N: PropTypes.shape({
+      [UN_SUPPORTED_FILE]: PropTypes.string,
+      [WELCOMEMSG]: PropTypes.string,
+      [WORKFLOW_MESSAGE]: PropTypes.string,
+      [WORKFLOW_NOTIFICATION]: PropTypes.string
+    }),
+    autoMessagesTitleI18N: PropTypes.shape({
+      [UN_SUPPORTED_FILE]: PropTypes.string,
+      [WELCOMEMSG]: PropTypes.string,
+      [WORKFLOW_MESSAGE]: PropTypes.string,
+      [WORKFLOW_NOTIFICATION]: PropTypes.string
+    }),
+    restrictedAttachmentMetaInfo: PropTypes.shape({
+      info: PropTypes.string,
+      title: PropTypes.string
+    })
   }),
   customProps: PropTypes.shape({
-    imAutoMessageInfoProps: PropTypes.object
+    imMessageMetaInfoProps: PropTypes.object
   }),
   customStyle: PropTypes.object,
   timeTooltip: PropTypes.string

package/es/im/IMMessageMetaInfo/IMMessageMetaInfo.js

@@ -0,0 +1,29 @@
+/** ** Libraries *** */
+import React from 'react';
+/** ** Hooks *** */
+
+import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
+/** ** Constants *** */
+
+import imMessageMetaInfoDefaultProps from './props/defaultProps';
+import imMessageMetaInfoPropTypes from './props/propTypes';
+/** ** Styles *** */
+
+import style from './css/IMMessageMetaInfo.module.css';
+export default function IMMessageMetaInfo(props) {
+  const {
+    imMessageMetaInfoTitle,
+    imMessageMetaInfoContent,
+    customStyle
+  } = props;
+  /* External CSS Customization */
+
+  const newStyle = useMergeStyle(style, customStyle);
+  return /*#__PURE__*/React.createElement("div", {
+    className: newStyle.imMessageMetaInfo,
+    "data-title": imMessageMetaInfoTitle
+  }, imMessageMetaInfoContent);
+}
+IMMessageMetaInfo.propTypes = imMessageMetaInfoPropTypes;
+IMMessageMetaInfo.defaultProps = imMessageMetaInfoDefaultProps;
+IMMessageMetaInfo.displayName = 'IMMessageMetaInfo';

package/es/im/IMMessageMetaInfo/css/IMMessageMetaInfo.module.css

@@ -0,0 +1,14 @@
+.varClass {
+  --imMessageMetaInfo-font_size: var(--zd_font_size13);
+  --imMessageMetaInfo-max_width: var(--zd_size150);
+  --imMessageMetaInfo-letter_spacing: 0.2px;
+}
+
+.imMessageMetaInfo {
+  composes: varClass;
+  composes: dotted from '../../../css/common.module.css';
+  font-size: var(--imMessageMetaInfo-font_size);
+  letter-spacing: var(--imMessageMetaInfo-letter_spacing);
+  max-width: var(--imMessageMetaInfo-max_width);
+  color: var(--imlib_chat_components_imAutoMessageInfo_text_color);
+}

package/es/im/IMMessageMetaInfo/index.js

@@ -0,0 +1 @@
+export { default as IMMessageMetaInfo } from './IMMessageMetaInfo';

package/es/im/IMMessageMetaInfo/props/defaultProps.js

@@ -0,0 +1,8 @@
+/** ** Constants *** */
+import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
+const imMessageMetaInfoDefaultProps = {
+  imMessageMetaInfoTitle: '',
+  imMessageMetaInfoContent: '',
+  customStyle: dummyObject
+};
+export default imMessageMetaInfoDefaultProps;

package/es/im/IMMessageMetaInfo/props/propTypes.js

@@ -0,0 +1,8 @@
+/** ** Libraries *** */
+import PropTypes from 'prop-types';
+const imMessageMetaInfoPropTypes = {
+  imMessageMetaInfoTitle: PropTypes.string,
+  imMessageMetaInfoContent: PropTypes.string,
+  customStyle: PropTypes.object
+};
+export default imMessageMetaInfoPropTypes;

package/es/im/index.js

@@ -2,7 +2,7 @@ export * from './IMIntegrationIcon';
 export * from './IMMessage';
 export * from './IMPermaLink';
 export * from './IMMessageMeta';
-export * from './IMAutoMessageInfo';
+export * from './IMMessageMetaInfo';
 export * from './IMMessageContent';
 export * from './IMTextBubble';
 export * from './IMReplyBubble';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohoim/chat-components",
-  "version": "0.0.29",
+  "version": "1.0.1",
   "description": "Chat Components",
   "main": "es/index.js",
   "module": "es/index.js",
@@ -36,8 +36,8 @@
     "@zohodesk/utils": "1.3.13",
     "@zohodesk/variables": "1.0.0",
     "@zohodesk/virtualizer": "1.0.13",
-    "@zohoim/chat-components-hooks": "^0.0.22",
-    "@zohoim/chat-components-utils": "^0.0.21"
+    "@zohoim/chat-components-hooks": "^1.0.1",
+    "@zohoim/chat-components-utils": "^1.0.1"
   },
   "devDependencies": {
     "@zohodesk-private/css-variable-migrator": "1.0.7",
@@ -45,5 +45,5 @@
     "jsdom": "23.0.0",
     "react-to-jsx": "1.3.2"
   },
-  "gitHead": "d194abef05a82e50181495879ad2d7addf8f511a"
+  "gitHead": "6a0a48d7d71d085fe7db2eb9281b407a00294506"
 }

package/es/im/IMAutoMessageInfo/IMAutoMessageInfo.js

@@ -1,32 +0,0 @@
-/** ** Libraries *** */
-import React from 'react';
-/** ** Hooks *** */
-
-import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
-/** ** Constants *** */
-
-import imAutoMessageInfoDefaultProps from './props/defaultProps';
-import imAutoMessageInfoPropTypes from './props/propTypes';
-/** ** Styles *** */
-
-import style from './css/IMAutoMessageInfo.module.css';
-export default function IMAutoMessageInfo(props) {
-  const {
-    autoMessageType,
-    autoMessagesI18N,
-    autoMessagesTitleI18N,
-    customStyle
-  } = props;
-  /* External CSS Customization */
-
-  const newStyle = useMergeStyle(style, customStyle);
-  const autoMessageContent = autoMessagesI18N[autoMessageType] || '';
-  const autoMessageTitle = autoMessagesTitleI18N[autoMessageType] || '';
-  return autoMessageContent ? /*#__PURE__*/React.createElement("div", {
-    className: newStyle.imAutoMessageInfo,
-    "data-title": autoMessageTitle
-  }, autoMessageContent) : null;
-}
-IMAutoMessageInfo.propTypes = imAutoMessageInfoPropTypes;
-IMAutoMessageInfo.defaultProps = imAutoMessageInfoDefaultProps;
-IMAutoMessageInfo.displayName = 'IMAutoMessageInfo';

package/es/im/IMAutoMessageInfo/css/IMAutoMessageInfo.module.css

@@ -1,13 +0,0 @@
-.varClass {
-  --imAutoMessageInfo-font_size: var(--zd_font_size13);
-  --imAutoMessageInfo-max_width: var(--zd_size100);
-  --imAutoMessageInfo-letter_spacing: 0.2px;
-}
-
-.imAutoMessageInfo {
-  composes: varClass;
-  font-size: var(--imAutoMessageInfo-font_size);
-  letter-spacing: var(--imAutoMessageInfo-letter_spacing);
-  max-width: var(--imAutoMessageInfo-max_width);
-  color: var(--imlib_chat_components_imAutoMessageInfo_text_color);
-}

package/es/im/IMAutoMessageInfo/index.js

@@ -1 +0,0 @@
-export { default as IMAutoMessageInfo } from './IMAutoMessageInfo';

package/es/im/IMAutoMessageInfo/props/defaultProps.js

@@ -1,6 +0,0 @@
-/** ** Constants *** */
-import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
-const imAutoMessageInfoDefaultProps = {
-  customStyle: dummyObject
-};
-export default imAutoMessageInfoDefaultProps;

package/es/im/IMAutoMessageInfo/props/propTypes.js

@@ -1,28 +0,0 @@
-/** ** Libraries *** */
-import PropTypes from 'prop-types';
-/** ** Constants *** */
-
-import autoMessageTypes from '@zohoim/chat-components-utils/es/imUtils/constants/autoMessageTypes';
-const {
-  WELCOMEMSG,
-  WORKFLOW_MESSAGE,
-  WORKFLOW_NOTIFICATION,
-  UN_SUPPORTED_FILE
-} = autoMessageTypes;
-const imAutoMessageInfoPropTypes = {
-  autoMessageType: PropTypes.oneOf(Object.values(autoMessageTypes)).isRequired,
-  autoMessagesI18N: PropTypes.shape({
-    [UN_SUPPORTED_FILE]: PropTypes.string,
-    [WELCOMEMSG]: PropTypes.string,
-    [WORKFLOW_MESSAGE]: PropTypes.string,
-    [WORKFLOW_NOTIFICATION]: PropTypes.string
-  }).isRequired,
-  autoMessagesTitleI18N: PropTypes.shape({
-    [UN_SUPPORTED_FILE]: PropTypes.string,
-    [WELCOMEMSG]: PropTypes.string,
-    [WORKFLOW_MESSAGE]: PropTypes.string,
-    [WORKFLOW_NOTIFICATION]: PropTypes.string
-  }).isRequired,
-  customStyle: PropTypes.object
-};
-export default imAutoMessageInfoPropTypes;