@zohoim/chat-components 0.0.11 → 0.0.14

package/es/Theme/{ToolttipWrapper.js → TooltipWrapper.js}

@@ -1,81 +1,85 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-/* eslint-disable react/prop-types */
+
 /** ** Libraries *** */
 import React from 'react';
-
+import PropTypes from 'prop-types';
 /** ** Components *** */
-import Tooltip from '@zohodesk/components/es/Tooltip/Tooltip';
 
+import Tooltip from '@zohodesk/components/es/Tooltip/Tooltip';
 /** ** Hooks *** */
-import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
 
+import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
 /** ** Methods *** */
+
 import { setLibraryConfig, getLibraryConfig } from '@zohodesk/components/lib/Provider/Config';
-import cssJSLogic from './css/cssJSLogic';
+/** ** Constants *** */
 
+import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
 /** ** Styles *** */
+
 import style from './css/TooltipWrapper.module.css';
 export default function TooltipWrapper(props) {
   const {
     getContainerRef,
-    customStyle = {}
+    customStyle = dummyObject
   } = props;
-  const containerRef = getContainerRef();
   let timer = null;
   const tooltipRef = React.useRef(null);
   setLibraryConfig({
     getTooltipContainer: () => getContainerRef()
   });
+
   function handleMouseOverDispatch(e) {
     const containerRef = getContainerRef();
+
     if (tooltipRef && tooltipRef.current) {
       tooltipRef.current.handleOver(e, containerRef);
     }
   }
+
   function handleOver(e) {
     if (timer) {
       timer = clearTimeout(timer);
     }
+
     timer = setTimeout(() => handleMouseOverDispatch(e), getLibraryConfig('tooltipDebounce'));
   }
+
   function removeTimeout() {
     if (timer) {
       timer = clearTimeout(timer);
     }
-  }
+  } // componentDidMount and componentWillUnmount case
+
 
-  // componentDidMount and componentWillUnmount case
   React.useEffect(() => {
     const containerRef = getContainerRef();
+
     if (containerRef) {
       containerRef.addEventListener('mouseover', handleOver, false);
       containerRef.addEventListener('mouseout', removeTimeout, false);
       tooltipRef.current.observeElement();
     }
+
     return () => {
       if (containerRef) {
         containerRef.removeEventListener('mouseover', handleOver, false);
-        containerRef.removeEventListener('mouseout', removeTimeout, false);
+        containerRef.removeEventListener('mouseout', removeTimeout, false); // eslint-disable-next-line react-hooks/exhaustive-deps
+
         tooltipRef.current.unObserveElement();
       }
-    };
-  }, [containerRef]);
+    }; // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  /* External CSS Customization */
 
-  /* External customization */
   const newStyle = useMergeStyle(style, customStyle);
-
-  /* CSS classnames added based on logic */
-  const {
-    tooltipClass,
-    tooltipWrapperClass
-  } = cssJSLogic(props, newStyle);
   return /*#__PURE__*/React.createElement("div", {
-    className: tooltipWrapperClass
+    className: newStyle.tooltipWrapper
   }, /*#__PURE__*/React.createElement(Tooltip, _extends({
     ref: tooltipRef
-  }, props, {
-    customClass: tooltipClass
-  })));
+  }, props)));
 }
-const a = {};
-TooltipWrapper.protoTypes = a;
+TooltipWrapper.propTypes = {
+  customStyle: PropTypes.object,
+  getContainerRef: PropTypes.func
+};

package/es/Theme/constants/index.js

@@ -1,3 +1,4 @@
+export const styleTagId = 'im-chat-components';
 export const baseUnitLimit = {
   size: {
     base: 16,
@@ -20,10 +21,6 @@ export const baseUnitLimit = {
     limit: 20
   }
 };
-export const appConstants = {
-  DESK: 'DESK',
-  CRM: 'CRM'
-};
 export const modeConstants = {
   LIGHT: 'LIGHT',
   DARK: 'DARK',

package/es/Theme/crm/dark/blueFanTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/blueTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/commonColorVariable.js

@@ -1,10 +1,10 @@
 export const incomingBubbleBgColor = '#232b38';
-export const outgoingBubbleBgColor = '#2c3b4d';
-// greenTheme, tealTheme
+export const outgoingBubbleBgColor = '#2c3b4d'; // greenTheme, tealTheme
+
 export const outgoingBubbleBgColor2 = '#26373b';
-export const actionIconColor = '#e2e4e6';
-export const actionIconBgColor = '#2c3b4d';
-export const actionIconBorderColor = '#3f536b';
+export const actionIconWrapperColor = '#e2e4e6';
+export const actionIconWrapperBgColor = '#2c3b4d';
+export const actionIconWrapperBorderColor = '#3f536b';
 export const bubbleActiveBgColor = '#1b2e33';
 export const messageStatusSendColor = '#61667a';
 export const messageStatusFailedColor = '#de3535';

package/es/Theme/crm/dark/darkBlueTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/darkGreyTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/greenTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor2, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor2, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/orangeTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/pinkTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/tealTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor2, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor2, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/dark/whiteTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/light/blueFanTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/light/blueTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,8 +14,8 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
       bg_color: '#eff4fb',
       border_color: '#cedef2'
     },

package/es/Theme/crm/light/commonColorVariable.js

@@ -1,8 +1,8 @@
 export const incomingBubbleBgColor = '#f1f4f9';
 export const outgoingBubbleBgColor = '#f1f7fe';
-export const actionIconColor = '#000';
-export const actionIconBgColor = '#f1f7fe';
-export const actionIconBorderColor = '#b7d1f0';
+export const actionIconWrapperColor = '#000';
+export const actionIconWrapperBgColor = '#f1f7fe';
+export const actionIconWrapperBorderColor = '#b7d1f0';
 export const bubbleActiveBgColor = '#fdffe3';
 export const messageStatusSendColor = '#61667a';
 export const messageStatusFailedColor = '#de3535';

package/es/Theme/crm/light/darkBlueTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/light/darkGreyTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/light/greenTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,8 +14,8 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
       bg_color: '#f1f6f4',
       border_color: '#d4e5dd'
     },

package/es/Theme/crm/light/orangeTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,8 +14,8 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
       bg_color: '#fcf2f0',
       border_color: '#f6d9d2'
     },

package/es/Theme/crm/light/pinkTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,8 +14,8 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
       bg_color: '#fdf1f7',
       border_color: '#fad5e8'
     },

package/es/Theme/crm/light/tealTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,8 +14,8 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
       bg_color: '#eef6f6',
       border_color: '#cde3e4'
     },

package/es/Theme/crm/light/whiteTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/pureDark/blueFanTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/pureDark/blueTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,

package/es/Theme/crm/pureDark/commonColorVariable.js

@@ -1,8 +1,8 @@
 export const incomingBubbleBgColor = '#2e2e2e';
 export const outgoingBubbleBgColor = '#2e2e2e';
-export const actionIconColor = '#e2e4e6';
-export const actionIconBgColor = '#2c3b4d';
-export const actionIconBorderColor = '#3f536b';
+export const actionIconWrapperColor = '#e2e4e6';
+export const actionIconWrapperBgColor = '#2c3b4d';
+export const actionIconWrapperBorderColor = '#3f536b';
 export const bubbleActiveBgColor = '#202821';
 export const messageStatusSendColor = '#61667a';
 export const messageStatusFailedColor = '#de3535';

package/es/Theme/crm/pureDark/darkBlueTheme.js

@@ -1,5 +1,5 @@
 /* eslint-disable camelcase */
-import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconBgColor, actionIconBorderColor, bubbleActiveBgColor, actionIconColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable.js';
+import { incomingBubbleBgColor, outgoingBubbleBgColor, actionIconWrapperBgColor, actionIconWrapperBorderColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, messageStatusReadColor } from './commonColorVariable';
 export default {
   library: 'chat_components',
   variables: {
@@ -14,10 +14,10 @@ export default {
       failed_bg_color: '#fcebeb',
       text_color: '#000'
     },
-    actionIcon: {
-      color: actionIconColor,
-      bg_color: actionIconBgColor,
-      border_color: actionIconBorderColor
+    actionIconWrapper: {
+      color: actionIconWrapperColor,
+      bg_color: actionIconWrapperBgColor,
+      border_color: actionIconWrapperBorderColor
     },
     messageStatus: {
       send_color: messageStatusSendColor,