@zohoim/chat-components 0.0.11 → 0.0.14

package/es/Message/props/propTypes.js

@@ -1,98 +1,39 @@
 /** ** Libraries *** */
 import PropTypes from 'prop-types';
-
 /** ** Constants *** */
-import integrationConstants from '@zohoim/chat-components-utils/es/constants/integrationConstants';
+
 import { defaultMessageActions } from '@zohoim/chat-components-utils/es/constants/messageActionConstants';
 import messageStatusConstants from '@zohoim/chat-components-utils/es/constants/messageStatusConstants';
 import { direction } from '@zohoim/chat-components-utils/es/constants/messageConstants';
-import sizes from '@zohoim/chat-components-utils/es/constants/sizes';
-const {
-  REPLY,
-  COPY,
-  DOWNLOAD,
-  CREATE_TICKET,
-  RESEND,
-  DELETE,
-  FORWARD
-} = defaultMessageActions;
-const {
-  WHATSAPP,
-  TELEGRAM,
-  INSTAGRAM,
-  ASAP,
-  WECHAT,
-  TWILLIO,
-  LINE
-} = integrationConstants;
-const {
-  SENT,
-  SAVED,
-  QUEUED,
-  DELIVERED,
-  READ,
-  UNSENT,
-  FAILED,
-  OUTGOING
-} = messageStatusConstants;
-const {
-  IN,
-  OUT
-} = direction;
 const messagePropTypes = {
-  customStyle: PropTypes.object,
-  direction: PropTypes.oneOf([IN, OUT]),
+  direction: PropTypes.oneOf(Object.values(direction)).isRequired,
+  renderContent: PropTypes.func.isRequired,
   isActive: PropTypes.bool,
-  needMessageActions: PropTypes.bool,
-  renderMessageBoxFooter: PropTypes.func,
-  /* Avatar Related Props Start */
-  needSender: PropTypes.bool,
   isShowSender: PropTypes.bool,
-  senderSrc: PropTypes.string,
-  senderAlternateSrc: PropTypes.string,
-  senderTitle: PropTypes.string,
-  senderAvatarSize: PropTypes.oneOf(['xxsmall', 'small', 'xsmall', 'medium', 'xmedium', 'large', 'xlarge']),
-  senderName: PropTypes.string,
-  avatarCustomStyle: PropTypes.object,
-  senderIntegrationIcon: PropTypes.oneOf([WHATSAPP, TELEGRAM, INSTAGRAM, ASAP, WECHAT, TWILLIO, LINE]),
-  senderIntegrationIconSize: PropTypes.oneOf([sizes.SMALL, sizes.MEDIUM]),
-  senderIntegrationIconCustomStyle: PropTypes.object,
-  isCustomIntegrationIcon: PropTypes.bool,
-  isCustomSenderAvatar: PropTypes.bool,
-  renderCustomIntegrationIcon: PropTypes.func,
-  renderCustomSenderAvatar: PropTypes.func,
-  /*Avatar Related Props  End*/
-
-  /* MessageBox Props Start */
-  needMessageBox: PropTypes.bool,
-  renderMessage: PropTypes.func.isRequired,
-  renderMessageFooter: PropTypes.func,
-  renderMessageHeader: PropTypes.func,
-  messageBoxCustomStyle: PropTypes.object,
-  isFailedMessage: PropTypes.bool,
-  /*MessageBox Props End */
-
-  /* MessageAction Props Start */
-  messageActions: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.oneOfType([PropTypes.string, PropTypes.oneOf([REPLY, COPY, DOWNLOAD, CREATE_TICKET, RESEND, DELETE, FORWARD])]).isRequired,
-    displayText: PropTypes.string,
-    renderFunction: PropTypes.func,
-    iconTitle: PropTypes.string
+  needSender: PropTypes.bool,
+  ownerDetails: PropTypes.shape({
+    alternateSrc: PropTypes.string,
+    name: PropTypes.string,
+    src: PropTypes.string
+  }),
+  renderOwnerStatusIcon: PropTypes.func,
+  status: PropTypes.oneOf(Object.values(messageStatusConstants)),
+  statusTooltip: PropTypes.string,
+  actions: PropTypes.arrayOf(PropTypes.shape({
+    displayText: PropTypes.string.isRequired,
+    id: PropTypes.oneOfType([PropTypes.string, PropTypes.oneOf(Object.values(defaultMessageActions))]).isRequired,
+    iconTitle: PropTypes.string,
+    isDisabled: PropTypes.bool,
+    renderFunction: PropTypes.func
   })),
+  onSelectAction: PropTypes.func.isRequired,
   renderSecondaryActions: PropTypes.func,
-  actionsDefaultShowCount: PropTypes.number,
-  actionIconCustomStyle: PropTypes.object,
-  moreActionItemCustomStyle: PropTypes.object,
-  onSelectAction: PropTypes.func,
-  messageActionCustomStyle: PropTypes.object,
-  moreActionPopupCustomStyle: PropTypes.object,
-  /* MessageAction Props End */
-
-  /* MessageStatus Props Start */
-  messageStatus: PropTypes.oneOf([SENT, SAVED, QUEUED, DELIVERED, READ, UNSENT, FAILED, OUTGOING]),
-  messageStatusCustomStyle: PropTypes.object,
-  statusTitle: PropTypes.string
-  /*MessageStatus Props End */
+  customProps: PropTypes.shape({
+    messageActionsProps: PropTypes.object,
+    messageBoxProps: PropTypes.object,
+    messageBubbleProps: PropTypes.object,
+    messageOwnerProps: PropTypes.object,
+    messageStatusProps: PropTypes.object
+  })
 };
-
 export default messagePropTypes;

package/es/MessageAction/MessageAction.js

@@ -1,44 +1,57 @@
-/* eslint-disable max-len */
+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';
-
+import React, { useCallback } from 'react';
 /** ** Components *** */
+
 import MoreActionItem from '../MoreActionItem/MoreActionItem';
 import ActionIcon from '../ActionIcon/ActionIcon';
-
 /** ** Constants *** */
+
 import messageActionsDefaultProps from './props/defaultProps';
 import messageActionsPropTypes from './props/propTypes';
+import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
 export default function MessageAction(props) {
   const {
     displayText,
     id,
-    index,
-    renderIcon,
     onClick,
     isShowInMore,
     iconTitle,
-    actionIconCustomStyle,
-    moreItemCustomStyle,
-    closePopup
+    customProps,
+    closePopup,
+    isDisabled,
+    needMoreActionItemIcon
   } = props;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, isShowInMore ? /*#__PURE__*/React.createElement(MoreActionItem, {
+  const {
+    moreActionItemProps = dummyObject,
+    actionIconProps = dummyObject
+  } = customProps;
+  const renderIcon = useCallback( // eslint-disable-next-line no-confusing-arrow
+  function () {
+    let {
+      id
+    } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return needMoreActionItemIcon ? /*#__PURE__*/React.createElement(ActionIcon, _extends({
+      id: id,
+      needIconOnly: true
+    }, actionIconProps)) : null;
+  }, [actionIconProps, needMoreActionItemIcon]);
+  return isShowInMore ? /*#__PURE__*/React.createElement(MoreActionItem, _extends({
+    closePopup: closePopup,
     displayText: displayText,
-    iconTitle: iconTitle,
     id: id,
-    index: index,
-    customStyle: moreItemCustomStyle,
+    isDisabled: isDisabled,
+    needIcon: needMoreActionItemIcon,
     onClick: onClick,
     renderIcon: renderIcon,
-    closePopup: closePopup
-  }) : /*#__PURE__*/React.createElement(ActionIcon, {
-    renderIcon: renderIcon,
-    customStyle: actionIconCustomStyle,
-    onClick: onClick,
+    title: iconTitle
+  }, moreActionItemProps)) : /*#__PURE__*/React.createElement(ActionIcon, _extends({
     id: id,
+    isDisabled: isDisabled,
+    onClick: onClick,
     title: iconTitle
-  }));
+  }, actionIconProps));
 }
 MessageAction.propTypes = messageActionsPropTypes;
 MessageAction.defaultProps = messageActionsDefaultProps;

package/es/MessageAction/props/defaultProps.js

@@ -1,8 +1,8 @@
 /** ** Constants *** */
-import { dummyObject } from '@zohoim/chat-components-utils/es/constants';
+import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
 const messageActionDefaultProps = {
-  actionIconCustomStyle: dummyObject,
-  moreItemCustomStyle: dummyObject,
-  isShowInMore: false
+  customProps: dummyObject,
+  isShowInMore: false,
+  needMoreActionItemIcon: true
 };
 export default messageActionDefaultProps;

package/es/MessageAction/props/propTypes.js

@@ -1,14 +1,17 @@
 /** ** Libraries *** */
 import PropTypes from 'prop-types';
 const messageActionPropTypes = {
-  displayText: PropTypes.string,
-  id: PropTypes.string,
-  index: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
-  renderIcon: PropTypes.func,
-  onClick: PropTypes.func,
-  isShowInMore: PropTypes.bool,
+  displayText: PropTypes.string.isRequired,
+  id: PropTypes.string.isRequired,
+  onClick: PropTypes.func.isRequired,
+  closePopup: PropTypes.func,
+  customProps: PropTypes.shape({
+    actionIconProps: PropTypes.object,
+    moreActionItemProps: PropTypes.object
+  }),
   iconTitle: PropTypes.string,
-  actionIconCustomStyle: PropTypes.object,
-  moreItemCustomStyle: PropTypes.object
+  isDisabled: PropTypes.bool,
+  isShowInMore: PropTypes.bool,
+  needMoreActionItemIcon: PropTypes.bool
 };
 export default messageActionPropTypes;

package/es/MessageActions/MessageActions.js

@@ -1,75 +1,108 @@
-/* eslint-disable max-len */
+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';
-
+import React, { useCallback } from 'react';
 /** ** Components *** */
-import { Container } from '@zohodesk/components/lib/Layout';
-import MessageActionsMore from '../MessageActionsMore/MessageActionsMore';
 
+import ActionIconWrapper from '../ActionIconWrapper/ActionIconWrapper';
+import MessageActionsWrapper from '../MessageActionsWrapper/MessageActionsWrapper';
+import MessageAction from '../MessageAction/MessageAction';
+/** ** Icons *** */
+
+import MoreIcon from '@zohodesk/icon/es/general/More';
 /** ** Hooks *** */
-import { useMessageAction } from '@zohoim/chat-components-hooks';
 
+import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
+import useMessageActions from '@zohoim/chat-components-hooks/es/MessageActions/useMessageActions';
+/** ** Methods *** */
+
+import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
 /** ** Constants *** */
+
 import messageActionsDefaultProps from './props/defaultProps';
 import messageActionsPropTypes from './props/propTypes';
-import constantProps from './props/propConstants';
-
-/** ** Methods *** */
-import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
-import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
-import cssJSLogic from './css/cssJSLogic';
+import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
+/** ** CSS *** */
 
-/** ** Style *** */
 import style from './css/MessageActions.module.css';
-function MessageActions(props) {
+export default function MessageActions(props) {
   const {
     actions,
-    renderMoreIcon,
     defaultShowCount,
+    onSelect,
+    renderSecondaryActions,
     customStyle,
-    morePopupCustomStyle
+    customProps
   } = props;
+  const {
+    messageActionProps = dummyObject,
+    actionIconWrapperProps = dummyObject,
+    messageActionsWrapperProps = dummyObject
+  } = customProps;
+  /* External CSS Customization */
 
-  /* external customization */
   const newStyle = useMergeStyle(style, customStyle);
-  /* css classnames added based on logic */
-  const {
-    actionsClass
-  } = cssJSLogic(props, newStyle);
+  const handleClickAction = useCallback(_ref => {
+    let {
+      id,
+      e
+    } = _ref;
+    onSelect && onSelect({
+      id,
+      e
+    });
+  }, [onSelect]);
+  const renderAction = useCallback(function () {
+    let {
+      id,
+      isShowInMore,
+      action,
+      closePopup
+    } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    const {
+      displayText,
+      iconTitle,
+      isDisabled
+    } = action || dummyObject;
+    return /*#__PURE__*/React.createElement(MessageAction, _extends({
+      key: id,
+      closePopup: closePopup,
+      displayText: displayText,
+      iconTitle: iconTitle,
+      id: id,
+      isDisabled: isDisabled,
+      isShowInMore: isShowInMore,
+      onClick: handleClickAction
+    }, messageActionProps));
+  }, [handleClickAction, messageActionProps]);
+  /* Hooks handling */
+
   const {
-    isShowMore: isShowMoreIcon,
-    revampedActions = []
-  } = useMessageAction(actions, defaultShowCount);
+    actionDetails
+  } = useMessageActions({
+    actions,
+    defaultRenderFunction: renderAction
+  });
   const {
-    defaultActions = [],
-    moreActions
-  } = revampedActions;
-  function renderRow(defaultActions, isShowMore) {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Container, {
-      alignBox: "row"
-    }, defaultActions.map(action => {
-      const {
-        id,
-        renderFunction
-      } = action;
-      return renderHandler(renderFunction)({
-        id,
-        isShowInMore: false,
-        action
-      }); // id, isRenderInMorePopup
-    }), isShowMore ? /*#__PURE__*/React.createElement(MessageActionsMore, {
-      actions: moreActions,
-      renderMoreIcon: renderMoreIcon,
-      customStyle: morePopupCustomStyle
-    }) : null));
-  }
-  return /*#__PURE__*/React.createElement("div", {
-    className: actionsClass
-  }, renderRow(defaultActions, isShowMoreIcon));
+    allActions
+  } = actionDetails;
+  /* Render More Icon */
+
+  const renderMoreIcon = useCallback(() => /*#__PURE__*/React.createElement("div", {
+    className: newStyle.moreIcon
+  }, /*#__PURE__*/React.createElement(MoreIcon, null)), [newStyle.moreIcon]);
+  const renderMore = useCallback(() => /*#__PURE__*/React.createElement(ActionIconWrapper, _extends({
+    renderIcon: renderMoreIcon
+  }, actionIconWrapperProps)), [actionIconWrapperProps, renderMoreIcon]);
+  const secondaryActions = renderHandler(renderSecondaryActions)();
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(MessageActionsWrapper, _extends({
+    actions: allActions,
+    defaultShowCount: defaultShowCount,
+    renderMoreIcon: renderMore
+  }, messageActionsWrapperProps)), secondaryActions ? /*#__PURE__*/React.createElement("div", {
+    className: newStyle.secondaryActions
+  }, secondaryActions) : null);
 }
-MessageActions.defaultProps = messageActionsDefaultProps;
 MessageActions.propTypes = messageActionsPropTypes;
-MessageActions.constantProps = constantProps;
-MessageActions.displayName = 'MessageActions';
-export default MessageActions;
+MessageActions.defaultProps = messageActionsDefaultProps;
+MessageActions.displayName = 'MessageActions';

package/es/MessageActions/css/MessageActions.module.css

@@ -1,3 +1,24 @@
-.messageActions {
-  /*Use this class for message actions customization*/
+.varClass {
+  /* --messageActions-secondaryActions_margin: 5px; */
+}
+
+[dir=ltr] .moreIcon svg {
+  transform: rotate(90deg);
+}
+
+[dir=rtl] .moreIcon svg {
+  transform: rotate(-90deg);
+}
+
+.secondaryActions {
+  composes: varClass;
+  /* margin-top: var(--messageActions-secondaryActions_margin); */
+}
+
+[dir=ltr] .secondaryActions {
+  text-align: left;
+}
+
+[dir=rtl] .secondaryActions {
+  text-align: right;
 }

package/es/MessageActions/props/defaultProps.js

@@ -1,10 +1,10 @@
 /** ** Constants *** */
-import { dummyObject, dummyArray } from '@zohoim/chat-components-utils/es/constants';
-import propConstants from './propConstants';
+import { dummyObject, dummyArray } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
+import { actionsDefaultShowCount } from '@zohoim/chat-components-utils/es/constants/messageActionConstants';
 const messageActionsDefaultProps = {
-  actions: dummyArray,
   customStyle: dummyObject,
-  morePopupCustomStyle: dummyObject,
-  defaultShowCount: propConstants.actions.defaultShowCount
+  customProps: dummyObject,
+  defaultShowCount: actionsDefaultShowCount,
+  actions: dummyArray
 };
 export default messageActionsDefaultProps;

package/es/MessageActions/props/propTypes.js

@@ -1,12 +1,24 @@
 /** ** Libraries *** */
 import PropTypes from 'prop-types';
+/** ** Constants *** */
+
+import { defaultMessageActions } from '@zohoim/chat-components-utils/es/constants/messageActionConstants';
 const messageActionsPropTypes = {
-  renderMoreIcon: PropTypes.func,
   actions: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string.isRequired,
+    displayText: PropTypes.string.isRequired,
+    id: PropTypes.oneOfType([PropTypes.string, PropTypes.oneOf(Object.values(defaultMessageActions))]).isRequired,
+    iconTitle: PropTypes.string,
+    isDisabled: PropTypes.bool,
     renderFunction: PropTypes.func
   })).isRequired,
+  onSelect: PropTypes.func.isRequired,
+  customProps: PropTypes.shape({
+    actionIconWrapperProps: PropTypes.object,
+    messageActionProps: PropTypes.object,
+    messageActionsWrapperProps: PropTypes.object
+  }),
+  customStyle: PropTypes.object,
   defaultShowCount: PropTypes.number,
-  customStyle: PropTypes.object
+  renderSecondaryActions: PropTypes.func
 };
 export default messageActionsPropTypes;

package/es/MessageActionsMore/MessageActionsMore.js

@@ -1,33 +1,33 @@
-/* eslint-disable max-len */
-
 /** ** Libraries *** */
-import React from 'react';
-
+import React, { useCallback, useMemo } from 'react';
 /** ** Components *** */
+
 import Popup from '@zohodesk/components/lib/Popup/Popup';
 import DropBox from '@zohodesk/components/lib/DropBox/DropBox';
-
 /** ** Constants *** */
+
 import messageActionsMoreDefaultProps from './props/defaultProps';
 import messageActionsMorePropTypes from './props/propTypes';
 import { MSG_ACTION_POPUP_PORTAL } from '../constants';
-
 /** ** Methods *** */
-import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
-import cssJSLogic from './css/cssJSLogic';
 
+import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
 /** ** Hooks *** */
-import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
 
+import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
 /** ** Styles *** */
+
 import style from './css/MessageActionsMore.module.css';
+
 function MessageActionsMoreComp(props) {
   const {
     actions,
     renderMoreIcon,
     customStyle,
     popupSize,
-    /**** Popup Props ****/
+    defaultPopupPosition,
+
+    /** ** Popup Props *** */
     getTargetRef,
     getContainerRef,
     position,
@@ -40,34 +40,21 @@ function MessageActionsMoreComp(props) {
     positionsOffset
   } = props;
   const moreIcon = renderHandler(renderMoreIcon)();
+  /* External CSS Customization */
 
-  /* External customization */
   const newStyle = useMergeStyle(style, customStyle);
-  /* CSS classnames added based on logic */
-  const {
-    popupClass,
-    morePopupContainerClass
-  } = cssJSLogic(props, newStyle);
-  return /*#__PURE__*/React.createElement("span", {
-    className: morePopupContainerClass
-  }, moreIcon ? /*#__PURE__*/React.createElement("div", {
-    onClick: togglePopup,
-    ref: getTargetRef
-  }, moreIcon) : null, isPopupOpen ? /*#__PURE__*/React.createElement(DropBox, {
-    boxPosition: position,
-    getRef: getContainerRef,
-    isActive: isPopupReady,
-    isAnimate: true,
-    isArrow: false,
-    onClick: removeClose,
-    isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
-    positionMapping: positionsOffset,
-    positionsOffset: positionsOffset,
-    portalId: MSG_ACTION_POPUP_PORTAL,
-    size: popupSize,
-    customClass: popupClass
-    // isModel
-  }, actions.map(action => {
+  const popupClass = useMemo(() => ({
+    customDropBox: newStyle.popup,
+    customMobileDropBox: newStyle.mobilePopup,
+    customDropBoxWrap: newStyle.popupWrapper,
+    customMobileDropBoxWrap: newStyle.mobilePopupWrapper
+  }), [newStyle.popup, newStyle.mobilePopup, newStyle.popupWrapper, newStyle.mobilePopupWrapper]);
+
+  const handleTogglePopup = e => {
+    togglePopup(e, defaultPopupPosition);
+  };
+
+  const renderActions = useCallback(() => actions.map(action => {
     const {
       id,
       renderFunction
@@ -78,8 +65,29 @@ function MessageActionsMoreComp(props) {
       action,
       closePopup: closePopupOnly
     }); // id, isRenderInMorePopup
-  })) : null);
+  }), [actions, closePopupOnly]);
+  const isRenderPopup = !!(moreIcon && isPopupOpen);
+  return /*#__PURE__*/React.createElement("span", {
+    className: newStyle.morePopupContainer
+  }, moreIcon ? /*#__PURE__*/React.createElement("span", {
+    ref: getTargetRef,
+    onClick: handleTogglePopup
+  }, moreIcon) : null, isRenderPopup ? /*#__PURE__*/React.createElement(DropBox, {
+    boxPosition: position,
+    customClass: popupClass,
+    getRef: getContainerRef,
+    isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+    isActive: isPopupReady,
+    isAnimate: true,
+    isArrow: false,
+    onClick: removeClose,
+    portalId: MSG_ACTION_POPUP_PORTAL,
+    positionsOffset: positionsOffset,
+    size: popupSize // isModel
+
+  }, renderActions()) : null);
 }
+
 const MessageActionsMore = Popup(MessageActionsMoreComp, '', '', {
   isAbsolutePositioningNeeded: false
 });

package/es/MessageActionsMore/css/MessageActionsMore.module.css

@@ -2,19 +2,22 @@
   display: inline-block;
 }
 
+.morePopupContainer {
+  composes: container;
+}
+
 .popup {
-  /* use this class name for popup customization*/
-  padding: var(--imlib_size_10) 0;
+  padding: var(--zd_size10) 0 ;
 }
 
 .popupWrapper {
-  /* use this class name for popup wrapper customization*/
+  composes: container;
 }
 
 .mobilePopup {
-  /* use this class name for mobile popup customization*/
+  composes: container;
 }
 
 .mobilePopupWrapper {
-  /* use this class name for mobile popup wrapper customization*/
+  composes: container;
 }

package/es/MessageActionsMore/props/defaultProps.js

@@ -1,8 +1,9 @@
 /** ** Constants *** */
-import { dummyObject, dummyArray } from '@zohoim/chat-components-utils/es/constants';
+import { dummyObject, dummyArray } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
 const messageActionsMoreDefaultProps = {
   customStyle: dummyObject,
   actions: dummyArray,
-  popupSize: 'small'
+  popupSize: 'small',
+  defaultPopupPosition: 'bottomCenter'
 };
 export default messageActionsMoreDefaultProps;

package/es/MessageActionsMore/props/propTypes.js

@@ -5,8 +5,9 @@ const messageActionsMorePropTypes = {
     id: PropTypes.string.isRequired,
     renderFunction: PropTypes.func
   })).isRequired,
-  renderMoreIcon: PropTypes.func,
+  renderMoreIcon: PropTypes.func.isRequired,
   customStyle: PropTypes.object,
-  popupSize: PropTypes.string
+  popupSize: PropTypes.oneOf(['mini', 'xmini', 'xsmall', 'small', 'medium', 'large', 'mlarge', 'xlarge', 'xxlarge', 'default']),
+  defaultPopupPosition: PropTypes.oneOf([['bottomCenter', 'bottomLeftToRight', 'bottomCenterToRight', 'bottomRightToLeft', 'bottomCenterToLeft', 'topCenter', 'topLeftToRight', 'topCenterToRight', 'topRightToLeft', 'topCenterToLeft', 'rightTopToBottom', 'rightCenterToBottom', 'rightCenter', 'rightBottomToTop', 'rightCenterToTop', 'leftTopToBottom', 'leftCenterToBottom', 'leftCenter', 'leftBottomToTop', 'leftCenterToTop', 'bottomRight', 'bottomLeft', 'topRight', 'topLeft', 'rightBottom', 'rightTop', 'leftBottom', 'leftTop']])
 };
 export default messageActionsMorePropTypes;