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

package/package.json

@@ -1,23 +1,27 @@
 {
   "name": "@zohoim/chat-components",
-  "version": "1.1.3-beta.1",
+  "version": "1.1.4",
   "description": "Chat Components",
   "main": "lib/index.js",
   "module": "es/index.js",
   "scripts": {
-    "init": "npm run clean && npm run build:variables",
     "build": "npm run build:lib && npm run build:es",
-    "build:lib": "cbt build:lib",
-    "build:es": "cbt build:es",
-    "build_watch": "npm run build:variables && npm run build:es -- -w",
-    "build_watch_lib": "npm run build:lib -- -w",
-    "build:variables": "cdt clean ./assets && node ./preprocess/index",
-    "clean": "cdt clean unittest coverage es result.json && mkdir assets",
-    "prepare": "cdt clean assets && npm run init && npm run build",
+    "build:lib": "react-cli build:component:cmjs",
+    "build:es": "react-cli build:library:es",
+    "build:local": " npm run build && npm run rtl && npm run cssVariableConvert ",
+    "build_watch": "npm run build:variables && npm run build && npm run build:es --module:mode=dev -- -w",
+    "clean": "react-cli clean unittest coverage es result.json && mkdir assets",
+    "rtl": "react-cli rtl ./src ./es",
+    "prepare": "react-cli clean assets && npm run init && npm run build && npm run rtl && npm run cssVariableConvert ",
+    "test": "react-cli test",
+    "test:debug": "react-cli test --runInBand --watch",
     "create-icons": "node ./src/icons/create-icon-components --sourucePath=./factory --targetPath=./iconSrc",
+    "cssVariableConvert": "react-cli variableConverter ./lib ./lib && react-cli variableConverter ./es ./es",
     "variable:addignore": "node ../../node_modules/@zohodesk-private/css-variable-migrator/es/variableIgnore.js ./src",
     "variable:convert": "node ../../node_modules/@zohodesk-private/css-variable-migrator/es/pxParserPostcss.js ./src",
-    "variable:check": "node  ../../node_modules/@zohodesk-private/css-variable-migrator/es/variableErrorCheck.js ./src ../../node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json"
+    "variable:check": "node  ../../node_modules/@zohodesk-private/css-variable-migrator/es/variableErrorCheck.js ./src ../../node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json",
+    "build:variables": "react-cli clean ./assets && node ./preprocess/index",
+    "init": "npm run clean && npm run build:variables"
   },
   "author": "ZohoDesk - IM Team",
   "license": "ISC",
@@ -27,48 +31,26 @@
   },
   "files": [
     "es",
-    "lib",
     "assets",
     "!**/__tests__"
   ],
-  "devDependencies": {
-    "@zoho/SecurityJS": "7.2.4",
-    "@zohodesk-private/color-variable-preprocessor": "1.2.1",
-    "@zohodesk-private/css-variable-migrator": "1.0.8",
-    "@zohodesk/a11y": "2.3.4",
-    "@zohodesk/components": "1.3.1",
-    "@zohodesk/hooks": "2.0.5",
+  "dependencies": {
+    "@zohodesk/components": "1.2.62",
+    "@zohodesk/hooks": "2.0.4",
     "@zohodesk/icon": "1.3.15",
-    "@zohodesk/icons": "1.0.75",
-    "@zohodesk/normalizer": "1.0.2",
-    "@zohodesk/svg": "1.1.29",
-    "@zohodesk/utils": "1.3.14",
+    "@zohodesk/icons": "1.0.43",
+    "@zohodesk/utils": "1.3.13",
     "@zohodesk/variables": "1.0.0",
     "@zohodesk/virtualizer": "1.0.13",
-    "@zohoim/chat-components-hooks": "1.1.3-beta.1",
-    "@zohoim/chat-components-utils": "1.1.3-beta.1",
+    "@zohoim/chat-components-hooks": "1.1.4",
+    "@zohoim/chat-components-utils": "1.1.4"
+  },
+  "devDependencies": {
+    "@zohodesk-private/color-variable-preprocessor": "1.2.1",
+    "@zohodesk-private/css-variable-migrator": "1.0.7",
     "html-to-react": "1.7.0 ",
     "jsdom": "23.0.0",
-    "react-sortable-hoc": "1.11.0",
-    "react-to-jsx": "1.3.2",
-    "velocity-react": "1.4.3"
-  },
-  "peerDependencies": {
-    "@zoho/SecurityJS": "7.2.4",
-    "@zohodesk/a11y": "2.3.4",
-    "@zohodesk/components": "1.3.1",
-    "@zohodesk/hooks": "2.0.5",
-    "@zohodesk/icon": "1.3.15",
-    "@zohodesk/icons": "1.0.75",
-    "@zohodesk/normalizer": "1.0.2",
-    "@zohodesk/svg": "1.1.29",
-    "@zohodesk/utils": "1.3.14",
-    "@zohodesk/variables": "1.0.0",
-    "@zohodesk/virtualizer": "1.0.13",
-    "@zohoim/chat-components-hooks": "1.1.2",
-    "@zohoim/chat-components-utils": "1.1.2",
-    "react-sortable-hoc": "1.11.0",
-    "velocity-react": "1.4.3"
+    "react-to-jsx": "1.3.2"
   },
-  "gitHead": "49e11a79172ffb38012aa0cf706c05fd204da6e8"
+  "gitHead": "0058c5987d4381f3356078cbcc1e2ca2f6f467ed"
 }

package/lib/ActionIcon/ActionIcon.js

@@ -1,97 +0,0 @@
-"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

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

package/lib/ActionIcon/index.js

@@ -1,15 +0,0 @@
-"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

@@ -1,17 +0,0 @@
-"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

@@ -1,30 +0,0 @@
-"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;

package/lib/ActionIconWrapper/ActionIconWrapper.js

@@ -1,81 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = ActionIconWrapper;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _useMergeStyle = _interopRequireDefault(require("@zohodesk/hooks/es/utils/useMergeStyle"));
-
-var _useActionIconWrapper2 = _interopRequireDefault(require("@zohoim/chat-components-hooks/es/ActionIconWrapper/useActionIconWrapper"));
-
-var _defaultProps = _interopRequireDefault(require("./props/defaultProps"));
-
-var _propTypes = _interopRequireDefault(require("./props/propTypes"));
-
-var _renderHandler = _interopRequireDefault(require("@zohoim/chat-components-utils/es/common/renderHandler"));
-
-var _cssJSLogic2 = _interopRequireDefault(require("./css/cssJSLogic"));
-
-var _ActionIconWrapperModule = _interopRequireDefault(require("./css/ActionIconWrapper.module.css"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-/** ** Libraries *** */
-
-/** ** Hooks *** */
-
-/** ** Constants *** */
-
-/** ** Methods *** */
-
-/** ** Styles *** */
-function ActionIconWrapper(props) {
-  var renderIcon = props.renderIcon,
-      customStyle = props.customStyle,
-      propOnClick = props.onClick,
-      propOnMouseEnter = props.onMouseEnter,
-      id = props.id,
-      title = props.title,
-      isDisabled = props.isDisabled,
-      isActive = props.isActive;
-
-  var _useActionIconWrapper = (0, _useActionIconWrapper2["default"])({
-    onClick: propOnClick,
-    onMouseEnter: propOnMouseEnter,
-    id: id,
-    isDisabled: isDisabled,
-    isActive: isActive
-  }),
-      onClick = _useActionIconWrapper.onClick,
-      onMouseEnter = _useActionIconWrapper.onMouseEnter;
-  /* External CSS Customization */
-
-
-  var newStyle = (0, _useMergeStyle["default"])(_ActionIconWrapperModule["default"], customStyle);
-  /* css classnames added based on logic */
-
-  var _cssJSLogic = (0, _cssJSLogic2["default"])({
-    isDisabled: isDisabled,
-    isActive: isActive
-  }, newStyle),
-      actionIconWrapperClass = _cssJSLogic.actionIconWrapperClass;
-  /* Render Icon */
-
-
-  var icon = (0, _renderHandler["default"])(renderIcon)({
-    id: id
-  });
-  return icon ? /*#__PURE__*/_react["default"].createElement("div", {
-    className: actionIconWrapperClass,
-    "data-title": title,
-    onClick: onClick,
-    onMouseEnter: onMouseEnter
-  }, icon) : null;
-}
-
-ActionIconWrapper.propTypes = _propTypes["default"];
-ActionIconWrapper.defaultProps = _defaultProps["default"];
-ActionIconWrapper.displayName = 'ActionIconWrapper';

package/lib/ActionIconWrapper/css/ActionIconWrapper.module.css

@@ -1,32 +0,0 @@
-.varClass {
-  --actionIconWrapper-height: 26px;
-  --actionIconWrapper-width: 26px;
-  --actionIconWrapper-border: 1px;
-  --actionIconWrapper-border_radius: 4px;
-}
-
-.actionIconWrapper {
-  composes: varClass;
-  display: inline-flex;
-  display: -webkit-inline-flex;
-  display: -ms-inline-flexbox;
-  color: var(--imlib_chat_components_actionIconWrapper_color);
-  position: relative;
-  width: var(--actionIconWrapper-width);
-  height: var(--actionIconWrapper-height);
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  border: var(--actionIconWrapper-border) solid transparent;
-  border-radius: var(--actionIconWrapper-border_radius);
-}
-
-.actionIconWrapper:hover, .actionIconWrapperActive{
-  background-color: var(--imlib_chat_components_actionIconWrapper_bg_color);
-  border-color: var(--imlib_chat_components_actionIconWrapper_border_color);
-}
-
-.disabled {
-  pointer-events: none;
-  opacity: 0.4;
-}

package/lib/ActionIconWrapper/css/cssJSLogic.js

@@ -1,21 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = cssJSLogic;
-
-var _utils = require("@zohodesk/utils");
-
-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; }
-
-function cssJSLogic(props, style) {
-  var _compileClassNames;
-
-  var isDisabled = props.isDisabled,
-      isActive = props.isActive;
-  var actionIconWrapperClass = (0, _utils.compileClassNames)((_compileClassNames = {}, _defineProperty(_compileClassNames, style.actionIconWrapper, true), _defineProperty(_compileClassNames, style.disabled, isDisabled), _defineProperty(_compileClassNames, style.actionIconWrapperActive, isActive), _compileClassNames));
-  return {
-    actionIconWrapperClass: actionIconWrapperClass
-  };
-}

package/lib/ActionIconWrapper/index.js

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

package/lib/ActionIconWrapper/props/defaultProps.js

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

package/lib/ActionIconWrapper/props/propTypes.js

@@ -1,24 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-/** ** Libraries *** */
-var actionIconWrapperPropTypes = {
-  id: _propTypes["default"].string.isRequired,
-  onClick: _propTypes["default"].func.isRequired,
-  onMouseEnter: _propTypes["default"].func,
-  renderIcon: _propTypes["default"].func.isRequired,
-  customStyle: _propTypes["default"].object,
-  isDisabled: _propTypes["default"].bool,
-  title: _propTypes["default"].string,
-  isActive: _propTypes["default"].bool
-};
-var _default = actionIconWrapperPropTypes;
-exports["default"] = _default;

package/lib/AttachmentBubble/AttachmentBubble.js

@@ -1,93 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = AttachmentBubble;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _useMergeStyle = _interopRequireDefault(require("@zohodesk/hooks/es/utils/useMergeStyle"));
-
-var _useAttachmentBubble2 = _interopRequireDefault(require("@zohoim/chat-components-hooks/es/AttachmentBubble/useAttachmentBubble"));
-
-var _defaultProps = _interopRequireDefault(require("./props/defaultProps"));
-
-var _propTypes = _interopRequireDefault(require("./props/propTypes"));
-
-var _AttachmentBubbleModule = _interopRequireDefault(require("./css/AttachmentBubble.module.css"));
-
-var _AttachmentBubbleInfo = _interopRequireDefault(require("../AttachmentBubbleInfo/AttachmentBubbleInfo"));
-
-var _AttachmentIcon = _interopRequireDefault(require("../AttachmentIcon/AttachmentIcon"));
-
-var _Layout = require("@zohodesk/components/es/Layout");
-
-var _cssJSLogic2 = _interopRequireDefault(require("./css/cssJSLogic"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-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 AttachmentBubble(props) {
-  var customStyle = props.customStyle,
-      customProps = props.customProps,
-      attachmentDetails = props.attachmentDetails,
-      isFailed = props.isFailed,
-      isSending = props.isSending,
-      propOnClick = props.onClick,
-      attachmentBubbleTitle = props.attachmentBubbleTitle;
-  var attachmentBubbleInfoProps = customProps.attachmentBubbleInfoProps,
-      attachmentIconProps = customProps.attachmentIconProps;
-
-  var _useAttachmentBubble = (0, _useAttachmentBubble2["default"])({
-    attachmentDetails: attachmentDetails,
-    onClick: propOnClick
-  }),
-      fileSize = _useAttachmentBubble.formattedFileSize,
-      fileName = _useAttachmentBubble.fileName,
-      fileFormat = _useAttachmentBubble.fileFormat,
-      isDisabled = _useAttachmentBubble.isDisabled,
-      isValidAttachment = _useAttachmentBubble.isValidAttachment,
-      mediaType = _useAttachmentBubble.mediaType,
-      onClick = _useAttachmentBubble.onClick;
-  /* External CSS Customization */
-
-
-  var newStyle = (0, _useMergeStyle["default"])(_AttachmentBubbleModule["default"], customStyle);
-  /* css classnames added based on logic */
-
-  var _cssJSLogic = (0, _cssJSLogic2["default"])({
-    isFailed: isFailed,
-    isSending: isSending,
-    isDisabled: isDisabled
-  }, newStyle),
-      attachmentBubbleClass = _cssJSLogic.attachmentBubbleClass;
-
-  return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
-    alignBox: "row",
-    className: attachmentBubbleClass,
-    "data-title": attachmentBubbleTitle,
-    isCover: false,
-    onClick: onClick
-  }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-    className: newStyle.attachmentBubbleIcon
-  }, /*#__PURE__*/_react["default"].createElement(_AttachmentIcon["default"], _extends({
-    fileFormat: fileFormat,
-    isDisabled: isDisabled,
-    isValidAttachment: isValidAttachment,
-    mediaType: mediaType
-  }, attachmentIconProps))), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-    className: newStyle.attachmentBubbleContent,
-    flexible: true
-  }, /*#__PURE__*/_react["default"].createElement(_AttachmentBubbleInfo["default"], _extends({
-    fileName: fileName,
-    fileSize: fileSize
-  }, attachmentBubbleInfoProps, {
-    isFailed: isFailed
-  }))));
-}
-
-AttachmentBubble.propTypes = _propTypes["default"];
-AttachmentBubble.defaultProps = _defaultProps["default"];
-AttachmentBubble.displayName = 'AttachmentBubble';

package/lib/AttachmentBubble/css/AttachmentBubble.module.css

@@ -1,56 +0,0 @@
-.attachmentBubble {
-  width: 100% ;
-  background-color: var(--imlib_chat_components_attachmentBubble_bg_color);
-  border-radius: 3px;
-  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
-  );
-  border-color: var(
-    --imlib_chat_components_attachmentBubble_border_color_failed
-  );
-}
-
-.sendingdAttachmentBubble {
-  opacity: 0.1;
-  cursor: default;
-}
-
-.attachmentBubbleCursor {
-  cursor: pointer;
-}
-
-.attachmentBubbleIcon {
-  width: var(--zd_size60) ;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-[dir=ltr] .attachmentBubbleIcon {
-  border-right: 1px solid
-    var(--imlib_chat_components_attachmentBubble_border_color);
-}
-
-[dir=rtl] .attachmentBubbleIcon {
-  border-left: 1px solid
-    var(--imlib_chat_components_attachmentBubble_border_color);
-}
-
-.failedAttachmentBubble .attachmentBubbleIcon {
-  border-color: var(
-    --imlib_chat_components_attachmentBubble_border_color_failed
-  );
-}
-
-.attachmentBubbleIcon, .attachmentBubbleContent {
-  padding: var(--zd_size10) ;
-}

package/lib/AttachmentBubble/css/cssJSLogic.js

@@ -1,22 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = cssJSLogic;
-
-var _utils = require("@zohodesk/utils");
-
-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; }
-
-function cssJSLogic(props, style) {
-  var _compileClassNames;
-
-  var isFailed = props.isFailed,
-      isSending = props.isSending,
-      isDisabled = props.isDisabled;
-  var attachmentBubbleClass = (0, _utils.compileClassNames)((_compileClassNames = {}, _defineProperty(_compileClassNames, style.attachmentBubble, true), _defineProperty(_compileClassNames, style.disabledAttachmentBubble, isDisabled), _defineProperty(_compileClassNames, style.failedAttachmentBubble, isFailed), _defineProperty(_compileClassNames, style.attachmentBubbleCursor, !isSending && !isDisabled), _defineProperty(_compileClassNames, style.sendingdAttachmentBubble, isSending), _compileClassNames));
-  return {
-    attachmentBubbleClass: attachmentBubbleClass
-  };
-}

package/lib/AttachmentBubble/index.js

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