@zohoim/chat-components 1.0.10 → 1.0.11-beta.1

package/lib/index.js

@@ -0,0 +1,382 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _MessageBubble = require("./MessageBubble");
+
+Object.keys(_MessageBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageBubble[key];
+    }
+  });
+});
+
+var _MessageActionsWrapper = require("./MessageActionsWrapper");
+
+Object.keys(_MessageActionsWrapper).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageActionsWrapper[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageActionsWrapper[key];
+    }
+  });
+});
+
+var _MessageActions = require("./MessageActions");
+
+Object.keys(_MessageActions).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageActions[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageActions[key];
+    }
+  });
+});
+
+var _MessageBox = require("./MessageBox");
+
+Object.keys(_MessageBox).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageBox[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageBox[key];
+    }
+  });
+});
+
+var _ActionIcon = require("./ActionIcon");
+
+Object.keys(_ActionIcon).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ActionIcon[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ActionIcon[key];
+    }
+  });
+});
+
+var _ActionIconWrapper = require("./ActionIconWrapper");
+
+Object.keys(_ActionIconWrapper).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ActionIconWrapper[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ActionIconWrapper[key];
+    }
+  });
+});
+
+var _MessageActionsMore = require("./MessageActionsMore");
+
+Object.keys(_MessageActionsMore).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageActionsMore[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageActionsMore[key];
+    }
+  });
+});
+
+var _MessageAvatar = require("./MessageAvatar");
+
+Object.keys(_MessageAvatar).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageAvatar[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageAvatar[key];
+    }
+  });
+});
+
+var _MoreActionItem = require("./MoreActionItem");
+
+Object.keys(_MoreActionItem).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MoreActionItem[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MoreActionItem[key];
+    }
+  });
+});
+
+var _MessageAction = require("./MessageAction");
+
+Object.keys(_MessageAction).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageAction[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageAction[key];
+    }
+  });
+});
+
+var _Theme = require("./Theme");
+
+Object.keys(_Theme).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Theme[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Theme[key];
+    }
+  });
+});
+
+var _Message = require("./Message");
+
+Object.keys(_Message).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Message[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Message[key];
+    }
+  });
+});
+
+var _AudioBubble = require("./AudioBubble");
+
+Object.keys(_AudioBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _AudioBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _AudioBubble[key];
+    }
+  });
+});
+
+var _AttachmentBubble = require("./AttachmentBubble");
+
+Object.keys(_AttachmentBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _AttachmentBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _AttachmentBubble[key];
+    }
+  });
+});
+
+var _AttachmentIcon = require("./AttachmentIcon");
+
+Object.keys(_AttachmentIcon).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _AttachmentIcon[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _AttachmentIcon[key];
+    }
+  });
+});
+
+var _VideoBubble = require("./VideoBubble");
+
+Object.keys(_VideoBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _VideoBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _VideoBubble[key];
+    }
+  });
+});
+
+var _ImageBubble = require("./ImageBubble");
+
+Object.keys(_ImageBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ImageBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ImageBubble[key];
+    }
+  });
+});
+
+var _TextBubble = require("./TextBubble");
+
+Object.keys(_TextBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _TextBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TextBubble[key];
+    }
+  });
+});
+
+var _LocationBubble = require("./LocationBubble");
+
+Object.keys(_LocationBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _LocationBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _LocationBubble[key];
+    }
+  });
+});
+
+var _AttachmentBubbleInfo = require("./AttachmentBubbleInfo");
+
+Object.keys(_AttachmentBubbleInfo).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _AttachmentBubbleInfo[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _AttachmentBubbleInfo[key];
+    }
+  });
+});
+
+var _Audio = require("./Audio");
+
+Object.keys(_Audio).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Audio[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Audio[key];
+    }
+  });
+});
+
+var _Video = require("./Video");
+
+Object.keys(_Video).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Video[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Video[key];
+    }
+  });
+});
+
+var _ReplyBubble = require("./ReplyBubble");
+
+Object.keys(_ReplyBubble).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ReplyBubble[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ReplyBubble[key];
+    }
+  });
+});
+
+var _ReplyBubbleHeader = require("./ReplyBubbleHeader");
+
+Object.keys(_ReplyBubbleHeader).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ReplyBubbleHeader[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ReplyBubbleHeader[key];
+    }
+  });
+});
+
+var _LazyLoadImage = require("./LazyLoadImage");
+
+Object.keys(_LazyLoadImage).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _LazyLoadImage[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _LazyLoadImage[key];
+    }
+  });
+});
+
+var _ReplyBubbleContent = require("./ReplyBubbleContent");
+
+Object.keys(_ReplyBubbleContent).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _ReplyBubbleContent[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ReplyBubbleContent[key];
+    }
+  });
+});
+
+var _MessageStatus = require("./MessageStatus");
+
+Object.keys(_MessageStatus).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _MessageStatus[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MessageStatus[key];
+    }
+  });
+});
+
+var _im = require("./im");
+
+Object.keys(_im).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _im[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _im[key];
+    }
+  });
+});
+
+var _constants = require("./constants");
+
+Object.keys(_constants).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _constants[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _constants[key];
+    }
+  });
+});

package/package.json

@@ -1,22 +1,27 @@
 {
   "name": "@zohoim/chat-components",
-  "version": "1.0.10",
+  "version": "1.0.11-beta.1",
   "description": "Chat Components",
-  "main": "es/index.js",
+  "main": "lib/index.js",
   "module": "es/index.js",
   "scripts": {
-    "build": "react-cli build:component:es",
-    "build_watch": "npm run build -- -w",
-    "clean": "react-cli clean unittest coverage es result.json",
+    "build": "npm run build:lib && npm run build:es",
+    "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": "npm run clean && npm run build && npm run rtl && npm run cssVariableConvert",
+    "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 ./es ./es",
+    "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",
@@ -26,6 +31,7 @@
   },
   "files": [
     "es",
+    "assets",
     "!**/__tests__"
   ],
   "dependencies": {
@@ -36,14 +42,15 @@
     "@zohodesk/utils": "1.3.13",
     "@zohodesk/variables": "1.0.0",
     "@zohodesk/virtualizer": "1.0.13",
-    "@zohoim/chat-components-hooks": "1.0.4-beta.8",
+    "@zohoim/chat-components-hooks": "1.0.5-beta.1",
     "@zohoim/chat-components-utils": "1.0.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-to-jsx": "1.3.2"
   },
-  "gitHead": "f3bead5ed7cfdbb215ec470df77ef0f3cff6f7a3"
+  "gitHead": "7873aeee4583e0177179ed66b92b65f497589d96"
 }

package/es/Theme/themeVariables/commonThemeColorVariable.js

@@ -1,17 +0,0 @@
-export const imIntegrationIcon = {
-  path0_color: '#ffffff40',
-  path1_color: '#fff',
-  whatsapp_color: '#24d366',
-  telegram_color: '#4fa7d8',
-  wechat_color: '#2dc100',
-  line_color: '#01b901',
-  twillio_color: '#f22f46',
-  instagram_color: 'linear-gradient(221.05deg,#933ab9 11.59%,#d12f8c 50.45%,#fdbb59 85.46%)',
-  asap_color: 'linear-gradient(180deg, #A375FF 0%, #7732FF 100%)',
-  fb_color: '#006aff'
-};
-export const imTtIcon = {
-  path0_color: '#ffffff40',
-  path1_color: '#fff'
-};
-export const messagetextColor = '#e2e4e6';

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

@@ -1,116 +0,0 @@
-/* eslint-disable camelcase */
-import { incomingBubbleBgColor, bubbleActiveBgColor, actionIconWrapperColor, messageStatusSendColor, messageStatusFailedColor, primaryBlue, failedBgWrapper, failedBg, failedBdr, failedLine, failedColor, failedUrlColor } from "./commonColorVariable";
-import { imIntegrationIcon, imTtIcon, messagetextColor } from "../commonThemeColorVariable";
-export default {
-  library: 'chat_components',
-  variables: {
-    actionIconWrapper: {
-      color: actionIconWrapperColor,
-      bg_color: '#2c3b4d',
-      border_color: '#3f536b'
-    },
-    attachmentBubble: {
-      bg_color: '#232b38',
-      bg_color_failed: failedBg,
-      border_color: '#2d3748',
-      border_color_failed: failedBdr
-    },
-    attachmentBubbleInfo: {
-      fileName_color: '#e2e4e6',
-      fileName_color_failed: failedColor,
-      fileSize_color: '#788190',
-      fileSize_color_failed: '#788190'
-    },
-    articleBubble: {
-      bg_color: '#232b38',
-      bg_color_failed: failedBg,
-      border_color: '#2d3748',
-      border_color_failed: failedBdr,
-      title_color: '#e2e4e6',
-      title_color_failed: failedColor,
-      summary_color: '#e2e4e6',
-      summary_color_failed: failedColor
-    },
-    imAutoMessageInfo: {
-      text_color: '#828994'
-    },
-    imIntegrationIcon,
-    imTtIcon,
-    imMessageContent: {
-      text_color: '#a8b0bd'
-    },
-    imMessageMeta: {
-      time_color: '#a8b0bd'
-    },
-    imPermaLink: {
-      url_color: '#479dff'
-    },
-    imageBubble: {
-      bg_color: '#232b38',
-      bg_color_failed: failedBg,
-      alt_text_color: '#e2e4e6',
-      alt_text_color_failed: failedColor,
-      border_color: '#2d3748',
-      border_color_failed: failedBdr
-    },
-    locationBubble: {
-      bg_color: '#232b38',
-      bg_color_failed: failedBg,
-      border_color: '#2d3748',
-      border_color_failed: failedBdr,
-      url_color: primaryBlue,
-      url_color_failed: failedUrlColor
-    },
-    messageBox: {
-      incoming_bg_color: incomingBubbleBgColor,
-      outgoing_bg_color: '#2c3b4d',
-      bg_color: '#f1f7fe',
-      failed_bg_color: failedBgWrapper,
-      text_color: messagetextColor,
-      failed_text_color: '#000'
-    },
-    messageBubble: {
-      active_bg_color: bubbleActiveBgColor,
-      messageBox_footer_text_color: '#5a616f'
-    },
-    messageStatus: {
-      send_color: messageStatusSendColor,
-      read_color: '#479dff',
-      failed_color: messageStatusFailedColor
-    },
-    replyBubble: {
-      border_color: '#2d3748',
-      border_color_failed: failedBdr
-    },
-    replyBubbleContent: {
-      bg_color: '#232b38',
-      bg_color_failed: failedBg,
-      border_color: '#2d3748',
-      border_color_failed: failedBdr,
-      line_color: '#cddbf2',
-      line_color_failed: failedLine,
-      sender_color: '#e2e4e6',
-      sender_color_failed: failedColor,
-      content_color: '#e2e4e6',
-      content_color_failed: failedColor
-    },
-    replyBubbleHeader: {
-      text_color: '#e2e4e6',
-      text_color_failed: failedColor,
-      time_color: '#828994',
-      time_color_failed: failedColor
-    },
-    textBubble: {
-      text_color: '#e2e4e6',
-      text_color_failed: failedColor,
-      see_more_color: primaryBlue,
-      see_more_color_failed: failedUrlColor,
-      url_color: primaryBlue,
-      url_color_failed: failedUrlColor
-    },
-    videoBubble: {
-      border_color: '#2d3748',
-      border_color_failed: failedBdr
-    }
-  }
-};

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

@@ -1,16 +0,0 @@
-export const incomingBubbleBgColor = '#232b38';
-export const bubbleActiveBgColor = '#1b2e33';
-export const actionIconWrapperColor = '#e2e4e6';
-export const messageStatusSendColor = '#61667a';
-export const messageStatusFailedColor = '#de3535';
-export const primaryBlue = '#479dff';
-export const primaryGreen = '#45a159';
-export const primaryOrange = '#ff801f';
-export const primaryRed = '#e94f4f';
-export const primaryYellow = '#d79835';
-export const failedBgWrapper = '#f4b5bc';
-export const failedBg = '#f6dcdf';
-export const failedBdr = '#eb9ea7';
-export const failedLine = '#eb9ea7';
-export const failedColor = '#000';
-export const failedUrlColor = '#0a73eb';