@zohoim/chat-components 1.1.2 → 1.1.3-beta.1

package/es/im/IMMessageContent/IMMessageContent.js

@@ -1,3 +1,5 @@
+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/jsx-indent */
 
 /** ** Libraries *** */
@@ -84,56 +86,42 @@ export default function IMMessageContent(props) {
   };
   return /*#__PURE__*/React.createElement(Fragment, null, isShowLayoutBubble ? null : null, isShowDeleteBubble ? /*#__PURE__*/React.createElement("div", {
     className: newStyle.deleteBubble
-  }, deleteMessageText) : null, isShowReplyBubble ? /*#__PURE__*/React.createElement("div", { ...wrapperDivProps
-  }, /*#__PURE__*/React.createElement(IMReplyBubble, {
+  }, deleteMessageText) : null, isShowReplyBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(IMReplyBubble, _extends({
     isFailed: isFailed,
     messageDetails: replyToMessage,
     onClick: onClickReply,
-    replyText: replyText,
-    ...imReplyBubbleProps
-  })) : null, isShowCustomBubble ? renderCustomMessage({
+    replyText: replyText
+  }, imReplyBubbleProps))) : null, isShowCustomBubble ? renderCustomMessage({
     messageDetails,
     isFailed
-  }) : null, isShowImageBubble ? /*#__PURE__*/React.createElement("div", { ...wrapperDivProps
-  }, /*#__PURE__*/React.createElement(ImageBubble, {
+  }) : null, isShowImageBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(ImageBubble, _extends({
     imageDetails: attachmentDetails,
     isFailed: isFailed,
     isSending: isSending,
-    onClick: onImageBubbleClick,
-    ...imageBubbleProps
-  })) : null, isShowVideoBubble ? /*#__PURE__*/React.createElement("div", { ...wrapperDivProps
-  }, /*#__PURE__*/React.createElement(VideoBubble, {
+    onClick: onImageBubbleClick
+  }, imageBubbleProps))) : null, isShowVideoBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(VideoBubble, _extends({
     isFailed: isFailed,
-    videoDetails: attachmentDetails,
-    ...videoBubbleProps
-  })) : null, isShowAudioBubble ? /*#__PURE__*/React.createElement("div", { ...wrapperDivProps
-  }, /*#__PURE__*/React.createElement(AudioBubble, {
+    videoDetails: attachmentDetails
+  }, videoBubbleProps))) : null, isShowAudioBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(AudioBubble, _extends({
     audioDetails: attachmentDetails,
-    isFailed: isFailed,
-    ...audioBubbleProps
-  })) : null, isShowAttachmentBubble ? /*#__PURE__*/React.createElement("div", { ...wrapperDivProps
-  }, /*#__PURE__*/React.createElement(AttachmentBubble, {
+    isFailed: isFailed
+  }, audioBubbleProps))) : null, isShowAttachmentBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(AttachmentBubble, _extends({
     attachmentBubbleTitle: attachmentBubbleTitle,
     attachmentDetails: attachmentDetails,
     isFailed: isFailed,
     isSending: isSending,
-    onClick: onAttachmentBubbleClick,
-    ...attachmentBubbleProps
-  })) : null, isShowLocationBubble ? /*#__PURE__*/React.createElement("div", { ...wrapperDivProps
-  }, /*#__PURE__*/React.createElement(LocationBubble, {
+    onClick: onAttachmentBubbleClick
+  }, attachmentBubbleProps))) : null, isShowLocationBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(LocationBubble, _extends({
     isFailed: isFailed,
-    locationUrl: locationUrl,
-    ...locationBubbleProps
-  })) : null, isShowTextBubble ? /*#__PURE__*/React.createElement("div", { ...wrapperDivProps
-  }, /*#__PURE__*/React.createElement(IMTextBubble, {
+    locationUrl: locationUrl
+  }, locationBubbleProps))) : null, isShowTextBubble ? /*#__PURE__*/React.createElement("div", wrapperDivProps, /*#__PURE__*/React.createElement(IMTextBubble, _extends({
     isFailed: isFailed,
     isShowFullContent: isShowFullContent,
     messageDetails: messageDetails,
     moreText: seeMoreText,
     onLoadFullMessage: onLoadFullMessage,
-    sessionDetails: sessionDetails,
-    ...imTextBubbleProps
-  })) : null);
+    sessionDetails: sessionDetails
+  }, imTextBubbleProps))) : null);
 }
 IMMessageContent.propTypes = imMessageContentPropTypes;
 IMMessageContent.defaultProps = imMessageContentDefaultProps;

package/es/im/IMMessageMeta/IMMessageMeta.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React from 'react';
 /** ** Hooks *** */
@@ -55,11 +57,10 @@ export default function IMMessageMeta(props) {
   return /*#__PURE__*/React.createElement(React.Fragment, null, imMessageMetaInfoContent || time ? /*#__PURE__*/React.createElement(Container, {
     alignBox: "row",
     className: imMessageMetaClass
-  }, imMessageMetaInfoContent ? /*#__PURE__*/React.createElement(IMMessageMetaInfo, {
+  }, imMessageMetaInfoContent ? /*#__PURE__*/React.createElement(IMMessageMetaInfo, _extends({
     imMessageMetaInfoContent: imMessageMetaInfoContent,
-    imMessageMetaInfoTitle: imMessageMetaInfoTitle,
-    ...imMessageMetaInfoProps
-  }) : null, imMessageMetaInfoContent && time ? /*#__PURE__*/React.createElement("div", {
+    imMessageMetaInfoTitle: imMessageMetaInfoTitle
+  }, imMessageMetaInfoProps)) : null, imMessageMetaInfoContent && time ? /*#__PURE__*/React.createElement("div", {
     className: dotClass
   }, "\u22C5") : null, time ? /*#__PURE__*/React.createElement("div", {
     className: newStyle.dateTime,

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

@@ -1,7 +1,7 @@
 .varClass {
-  --imMessageMeta-gap: var(--zd_size5);
-  --imMessageMeta-separator_gap: var(--zd_size5);
-  --imMessageMeta-time_padding: var(--zd_size45);
+  --imMessageMeta-gap: 5px;
+  --imMessageMeta-separator_gap: 5px;
+  --imMessageMeta-time_padding: 45px;
 }
 
 .imMessageMeta {

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

@@ -1,6 +1,6 @@
 .varClass {
-  --imMessageMetaInfo-font_size: var(--zd_font_size13);
-  --imMessageMetaInfo-max_width: var(--zd_size150);
+  --imMessageMetaInfo-font_size: 13px;
+  --imMessageMetaInfo-max_width: 150px;
   --imMessageMetaInfo-letter_spacing: 0.2px;
 }
 

package/es/im/IMReplyBubble/IMReplyBubble.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React from 'react';
 /** ** Hooks *** */
@@ -33,17 +35,17 @@ export default function IMReplyBubble(props) {
     messageDetails,
     onClick: propOnClick
   });
-  return /*#__PURE__*/React.createElement(ReplyBubble, {
+  return /*#__PURE__*/React.createElement(ReplyBubble, _extends({
     attachmentDetails: attachmentDetails,
     dateTimeDetails: dateTimeDetails,
     locationUrl: locationUrl,
     message: message,
     onClick: onClick,
     replyText: replyText,
-    senderName: senderName,
-    ...replyBubbleProps,
+    senderName: senderName
+  }, replyBubbleProps, {
     isFailed: isFailed
-  });
+  }));
 }
 IMReplyBubble.propTypes = imReplyBubblePropTypes;
 IMReplyBubble.defaultProps = imReplyBubbleDefaultProps;

package/es/im/IMTextBubble/IMTextBubble.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React from 'react';
 /** ** Constants *** */
@@ -25,13 +27,13 @@ export default function IMTextBubble(props) {
     sanitizedDisplayMessage,
     isShowSeeMore
   } = useIMTextBubble(props);
-  return /*#__PURE__*/React.createElement(TextBubble, {
+  return /*#__PURE__*/React.createElement(TextBubble, _extends({
     message: sanitizedDisplayMessage,
     moreText: isShowSeeMore ? moreText : '',
-    onClickMore: onLoadFullMessage,
-    ...textBubbleProps,
+    onClickMore: onLoadFullMessage
+  }, textBubbleProps, {
     isFailed: isFailed
-  });
+  }));
 }
 IMTextBubble.propTypes = imTextBubblePropTypes;
 IMTextBubble.defaultProps = imTextBubbleDefaultProps;

package/es/im/ReplyComposer/ReplyComposer.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React, { useMemo } from 'react';
 /** ** Components *** */
@@ -108,14 +110,13 @@ export default function ReplyComposer(props) {
   return /*#__PURE__*/React.createElement(Container, {
     className: newStyle.replyComposer,
     isCover: false
-  }, isShowSuggestion ? /*#__PURE__*/React.createElement(ReplyEditorSuggestions, {
+  }, isShowSuggestion ? /*#__PURE__*/React.createElement(ReplyEditorSuggestions, _extends({
     getMethods: getSuggetPopupMethods,
     onClose: onHideSuggestions,
     onSelect: onSelectSuggestion,
     suggestionDetails: suggestionDetails,
-    suggestionsMapping: suggestionsMapping,
-    ...replyEditorSuggestionsProps
-  }) : null, files.length > 0 ? /*#__PURE__*/React.createElement(AttachmentPreview, {
+    suggestionsMapping: suggestionsMapping
+  }, replyEditorSuggestionsProps)) : null, files.length > 0 ? /*#__PURE__*/React.createElement(AttachmentPreview, _extends({
     descriptionDetails: filesDescription,
     files: files,
     isDescriptionNeeded: true,
@@ -123,11 +124,10 @@ export default function ReplyComposer(props) {
     onCancel: onFileCancel,
     onDescriptionChange: onChangeFileDescription,
     onSubmit: onFileSubmit,
-    texts: attachmentPreviewTexts,
-    ...attachmentPreviewCustomProps
-  }) : null, isLoaded ? headerElement : null, stencilsElement || null, /*#__PURE__*/React.createElement("div", {
+    texts: attachmentPreviewTexts
+  }, attachmentPreviewCustomProps)) : null, isLoaded ? headerElement : null, stencilsElement || null, /*#__PURE__*/React.createElement("div", {
     className: replEditorWrapperClass
-  }, /*#__PURE__*/React.createElement(ReplyEditor, {
+  }, /*#__PURE__*/React.createElement(ReplyEditor, _extends({
     content: content,
     EDITORURL: EDITORURL,
     features: allFeatures,
@@ -138,15 +138,13 @@ export default function ReplyComposer(props) {
     onChange: onChange,
     onKeyDown: onKeyDown,
     onPaste: onPaste,
-    placeHolder: placeHolder,
-    ...replyEditorCustomProps
-  })), needFooter && isLoaded ? /*#__PURE__*/React.createElement(ReplyComposerFooter, {
+    placeHolder: placeHolder
+  }, replyEditorCustomProps))), needFooter && isLoaded ? /*#__PURE__*/React.createElement(ReplyComposerFooter, _extends({
     editor: editor,
     extensions: extensions,
     isHTMLContent: isHTMLContent,
-    renderButtons: renderFooter,
-    ...replyComposerFooterProps
-  }) : null);
+    renderButtons: renderFooter
+  }, replyComposerFooterProps)) : null);
 }
 ReplyComposer.propTypes = replyComposerPropTypes;
 ReplyComposer.defaultProps = replyComposerDefaultProps;

package/es/im/ReplyEditor/ReplyEditor.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React, { useMemo } from 'react';
 /** ** Components *** */
@@ -79,7 +81,7 @@ export default function ReplyEditor(props) {
     className: newStyle.replyEditor
   }, isRenderEditor ? /*#__PURE__*/React.createElement(Container, {
     className: editorClass
-  }, /*#__PURE__*/React.createElement(Editor, {
+  }, /*#__PURE__*/React.createElement(Editor, _extends({
     appearance: appearance,
     content: content,
     customStyle: editorNewCustomStyle,
@@ -94,9 +96,8 @@ export default function ReplyEditor(props) {
     onKeyDown: onKeyDown,
     onPaste: onPaste,
     onReadyCallback: onReadyCallback,
-    placeHolder: placeHolder,
-    ...editorProps
-  })) : null);
+    placeHolder: placeHolder
+  }, editorProps))) : null);
 }
 ReplyEditor.propTypes = replyEditorPropTypes;
 ReplyEditor.defaultProps = replyEditorDefaultProps;

package/es/im/ReplyEditorExtensions/ReplyEditorExtensions.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React, { useCallback, useMemo } from 'react';
 /** ** Components *** */
@@ -39,7 +41,7 @@ export default function ReplyEditorExtensions(props) {
     const {
       needFocusOnSelect
     } = componentProps;
-    return /*#__PURE__*/React.createElement(EmojiPopup, {
+    return /*#__PURE__*/React.createElement(EmojiPopup, _extends({
       key: id,
       onPopupClose: onPopupClose,
       onPopupOpen: onPopupOpen,
@@ -48,35 +50,32 @@ export default function ReplyEditorExtensions(props) {
           content: value,
           needFocus: needFocusOnSelect
         });
-      },
-      ...componentProps
-    });
+      }
+    }, componentProps));
   }, []);
   const handleRenderImageExtension = useCallback(_ref2 => {
     let {
       id,
       componentProps
     } = _ref2;
-    return /*#__PURE__*/React.createElement(IMAttachmentHandler, {
+    return /*#__PURE__*/React.createElement(IMAttachmentHandler, _extends({
       key: id,
       attachmentType: "image",
       iconName: "ZD-TT-image",
-      iconSize: "14",
-      ...componentProps
-    });
+      iconSize: "14"
+    }, componentProps));
   }, []);
   const handleRenderFileExtension = useCallback(_ref3 => {
     let {
       id,
       componentProps
     } = _ref3;
-    return /*#__PURE__*/React.createElement(IMAttachmentHandler, {
+    return /*#__PURE__*/React.createElement(IMAttachmentHandler, _extends({
       key: id,
       attachmentType: "document",
       iconName: "ZD-TT-ttAttach",
-      iconSize: "14",
-      ...componentProps
-    });
+      iconSize: "14"
+    }, componentProps));
   }, []);
   const defaultRenderMethod = useMemo(() => ({
     emoji: {

package/es/im/ReplyEditorSuggestions/ReplyEditorSuggestions.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React, { useMemo, useCallback } from 'react';
 /** ** Components *** */
@@ -49,7 +51,7 @@ export default function ReplyEditorSuggestions(props) {
     } = componentProps || {}; // (-1) -> ':' string is not valid for count.
 
     const isShowEmojiPopup = searchText.length - 1 >= searchTextLenForShow;
-    return isShowEmojiPopup ? /*#__PURE__*/React.createElement(Emojis, {
+    return isShowEmojiPopup ? /*#__PURE__*/React.createElement(Emojis, _extends({
       emojisRowType: "single",
       getMethods: getMethods,
       isShowGroupBasedList: false,
@@ -61,9 +63,8 @@ export default function ReplyEditorSuggestions(props) {
           content: value
         });
       },
-      searchString: searchText,
-      ...componentProps
-    }) : null;
+      searchString: searchText
+    }, componentProps)) : null;
   }, []);
   const defaultRenderMethod = useMemo(() => ({
     ':': handleRenderEmoji,
@@ -82,13 +83,11 @@ export default function ReplyEditorSuggestions(props) {
   });
   return /*#__PURE__*/React.createElement(Container, {
     className: newStyle.suggestionPopup
-  }, /*#__PURE__*/React.createElement(ReplyEditorSuggestionsPopup, {
+  }, /*#__PURE__*/React.createElement(ReplyEditorSuggestionsPopup, _extends({
     onClose: onClose,
     suggestionElement: suggestionElement,
-    targetPosition: position,
-    ...replyEditorSuggestionsPopupProps,
-    ...popupProps
-  }));
+    targetPosition: position
+  }, replyEditorSuggestionsPopupProps, popupProps)));
 }
 ReplyEditorSuggestions.propTypes = replyEditorSuggestionsPropTypes;
 ReplyEditorSuggestions.defaultProps = replyEditorSuggestionsDefaultProps;

package/es/im/ReplyEditorSuggestionsPopup/ReplyEditorSuggestionsPopup.js

@@ -1,3 +1,5 @@
+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); }
+
 /** ** Libraries *** */
 import React from 'react';
 /** ** Components *** */
@@ -67,7 +69,7 @@ export function ReplyEditorSuggestionsPopupComp(props) {
     ref: getTargetRef,
     className: newStyle.hiddenTarget,
     style: targetElementStyle
-  }))), isPopupOpen ? /*#__PURE__*/React.createElement(DropBox, {
+  }))), isPopupOpen ? /*#__PURE__*/React.createElement(DropBox, _extends({
     boxPosition: position,
     customStyle: dummyObject,
     getRef: getContainerRef,
@@ -78,9 +80,8 @@ export function ReplyEditorSuggestionsPopupComp(props) {
     onClick: removeClose,
     portalId: EDITOR_POPUP_PORTAL,
     positionsOffset: positionsOffset,
-    size: popupSize,
-    ...dropBoxProps
-  }, suggestionElement) : null);
+    size: popupSize
+  }, dropBoxProps), suggestionElement) : null);
 }
 const ReplyEditorSuggestionsPopup = Popup(ReplyEditorSuggestionsPopupComp, undefined, undefined, {
   isAbsolutePositioningNeeded: false

package/lib/ActionIcon/ActionIcon.js

@@ -0,0 +1,97 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = ActionIcon;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ActionIconWrapper = _interopRequireDefault(require("../ActionIconWrapper/ActionIconWrapper"));
+
+var _Reload = _interopRequireDefault(require("@zohodesk/icon/es/general/Reload"));
+
+var _Copy = _interopRequireDefault(require("@zohodesk/icon/es/general/Copy"));
+
+var _Cloud = _interopRequireDefault(require("@zohodesk/icon/es/general/Cloud"));
+
+var _Delete = _interopRequireDefault(require("@zohodesk/icon/es/general/Delete"));
+
+var _EmailForward = _interopRequireDefault(require("@zohodesk/icon/es/channels/EmailForward"));
+
+var _Reply = _interopRequireDefault(require("../icons/iconSrc/common/Reply"));
+
+var _useMergeStyle = _interopRequireDefault(require("@zohodesk/hooks/es/utils/useMergeStyle"));
+
+var _defaultProps = _interopRequireDefault(require("./props/defaultProps"));
+
+var _propTypes = _interopRequireDefault(require("./props/propTypes"));
+
+var _emptyConstants = require("@zohoim/chat-components-utils/es/constants/emptyConstants");
+
+var _messageActionConstants = require("@zohoim/chat-components-utils/es/constants/messageActionConstants");
+
+var _ActionIconModule = _interopRequireDefault(require("./css/ActionIcon.module.css"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var REPLY = _messageActionConstants.defaultMessageActions.REPLY,
+    COPY = _messageActionConstants.defaultMessageActions.COPY,
+    DOWNLOAD = _messageActionConstants.defaultMessageActions.DOWNLOAD,
+    RESEND = _messageActionConstants.defaultMessageActions.RESEND,
+    DELETE = _messageActionConstants.defaultMessageActions.DELETE,
+    FORWARD = _messageActionConstants.defaultMessageActions.FORWARD;
+
+function ActionIcon(props) {
+  var customStyle = props.customStyle,
+      customProps = props.customProps,
+      onClick = props.onClick,
+      onMouseEnter = props.onMouseEnter,
+      id = props.id,
+      title = props.title,
+      isDisabled = props.isDisabled,
+      needIconOnly = props.needIconOnly,
+      isActive = props.isActive;
+  var _customProps$actionIc = customProps.actionIconWrapperProps,
+      actionIconWrapperProps = _customProps$actionIc === void 0 ? _emptyConstants.dummyObject : _customProps$actionIc;
+  /* External customization */
+
+  var newStyle = (0, _useMergeStyle["default"])(_ActionIconModule["default"], customStyle);
+  var iconStyle = (0, _react.useMemo)(function () {
+    return {
+      base: newStyle.icon
+    };
+  }, [newStyle.icon]);
+  var renderIcon = (0, _react.useCallback)(function () {
+    var _iconMapping;
+
+    var iconMapping = (_iconMapping = {}, _defineProperty(_iconMapping, REPLY, _Reply["default"]), _defineProperty(_iconMapping, COPY, _Copy["default"]), _defineProperty(_iconMapping, DOWNLOAD, _Cloud["default"]), _defineProperty(_iconMapping, RESEND, _Reload["default"]), _defineProperty(_iconMapping, DELETE, _Delete["default"]), _defineProperty(_iconMapping, FORWARD, _EmailForward["default"]), _iconMapping);
+    var IconComponent = iconMapping[id];
+    return IconComponent ? /*#__PURE__*/_react["default"].createElement(IconComponent, {
+      customStyle: iconStyle
+    }) : null;
+  }, [iconStyle, id]);
+  return needIconOnly ? renderIcon() : /*#__PURE__*/_react["default"].createElement(_ActionIconWrapper["default"], _extends({
+    id: id,
+    isActive: isActive,
+    isDisabled: isDisabled,
+    onClick: onClick,
+    onMouseEnter: onMouseEnter,
+    renderIcon: renderIcon,
+    title: title
+  }, actionIconWrapperProps));
+}
+
+ActionIcon.propTypes = _propTypes["default"];
+ActionIcon.defaultProps = _defaultProps["default"];
+ActionIcon.displayName = 'ActionIcon';

package/lib/ActionIcon/css/ActionIcon.module.css

@@ -0,0 +1,8 @@
+.varClass {
+  --actionIcon_icon_size: 15px;
+}
+
+.icon {
+  width: var(--zd_size15) ;
+  height: var(--zd_size15) ;
+}

package/lib/ActionIcon/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ActionIcon", {
+  enumerable: true,
+  get: function get() {
+    return _ActionIcon["default"];
+  }
+});
+
+var _ActionIcon = _interopRequireDefault(require("./ActionIcon"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/lib/ActionIcon/props/defaultProps.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _emptyConstants = require("@zohoim/chat-components-utils/es/constants/emptyConstants");
+
+/** ** Constants *** */
+var actionIconDefaultProps = {
+  customStyle: _emptyConstants.dummyObject,
+  customProps: _emptyConstants.dummyObject,
+  needIconOnly: false
+};
+var _default = actionIconDefaultProps;
+exports["default"] = _default;

package/lib/ActionIcon/props/propTypes.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _messageActionConstants = require("@zohoim/chat-components-utils/es/constants/messageActionConstants");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+/** ** Libraries *** */
+
+/** ** Constants *** */
+var actionIconPropTypes = {
+  id: _propTypes["default"].oneOf(Object.values(_messageActionConstants.defaultMessageActions)).isRequired,
+  onClick: _propTypes["default"].func.isRequired,
+  customProps: _propTypes["default"].shape({
+    actionIconWrapperProps: _propTypes["default"].object
+  }),
+  customStyle: _propTypes["default"].object,
+  isDisabled: _propTypes["default"].bool,
+  needIconOnly: _propTypes["default"].bool,
+  title: _propTypes["default"].string,
+  isActive: _propTypes["default"].bool
+};
+var _default = actionIconPropTypes;
+exports["default"] = _default;