@zohoim/chat-components 0.0.11 → 0.0.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (421) hide show
  1. package/es/ActionIcon/ActionIcon.js +56 -34
  2. package/es/ActionIcon/css/ActionIcon.module.css +4 -23
  3. package/es/ActionIcon/props/defaultProps.js +4 -2
  4. package/es/ActionIcon/props/propTypes.js +10 -3
  5. package/es/ActionIconWrapper/ActionIconWrapper.js +49 -0
  6. package/es/ActionIconWrapper/css/ActionIconWrapper.module.css +27 -0
  7. package/es/ActionIconWrapper/index.js +1 -0
  8. package/es/{MessageWrapper → ActionIconWrapper}/props/defaultProps.js +3 -3
  9. package/es/ActionIconWrapper/props/propTypes.js +11 -0
  10. package/es/AttachmentBubble/AttachmentBubble.js +36 -34
  11. package/es/AttachmentBubble/css/AttachmentBubble.module.css +16 -15
  12. package/es/AttachmentBubble/props/defaultProps.js +2 -2
  13. package/es/AttachmentBubble/props/propTypes.js +10 -5
  14. package/es/AttachmentBubbleInfo/AttachmentBubbleInfo.js +7 -20
  15. package/es/AttachmentBubbleInfo/css/AttachmentBubbleInfo.module.css +20 -15
  16. package/es/AttachmentBubbleInfo/props/defaultProps.js +1 -1
  17. package/es/AttachmentBubbleInfo/props/propTypes.js +3 -3
  18. package/es/AttachmentIcon/AttachmentIcon.js +47 -0
  19. package/es/AttachmentIcon/css/AttachmentIcon.module.css +4 -0
  20. package/es/AttachmentIcon/index.js +1 -0
  21. package/es/{MediaControls → AttachmentIcon}/props/defaultProps.js +3 -3
  22. package/es/AttachmentIcon/props/propTypes.js +11 -0
  23. package/es/AttachmentIcon/utils/getAttachmentIconComponent.js +55 -0
  24. package/es/Audio/Audio.js +12 -34
  25. package/es/Audio/css/Audio.module.css +3 -3
  26. package/es/Audio/props/defaultProps.js +2 -3
  27. package/es/Audio/props/propTypes.js +3 -4
  28. package/es/AudioBubble/AudioBubble.js +25 -43
  29. package/es/AudioBubble/props/defaultProps.js +2 -4
  30. package/es/AudioBubble/props/propTypes.js +10 -7
  31. package/es/Fonts/puviFont.module.css +55 -54
  32. package/es/ImageBubble/ImageBubble.js +26 -25
  33. package/es/ImageBubble/css/ImageBubble.module.css +8 -11
  34. package/es/ImageBubble/props/defaultProps.js +1 -1
  35. package/es/ImageBubble/props/propTypes.js +5 -3
  36. package/es/InfoBubble/InfoBubble.js +6 -9
  37. package/es/InfoBubble/props/defaultProps.js +1 -1
  38. package/es/LazyLoadImage/LazyLoadImage.js +8 -19
  39. package/es/LazyLoadImage/css/LazyLoadImage.module.css +1 -0
  40. package/es/LazyLoadImage/props/defaultProps.js +1 -1
  41. package/es/LazyLoadImage/props/propTypes.js +3 -3
  42. package/es/LocationBubble/LocationBubble.js +25 -44
  43. package/es/LocationBubble/css/LocationBubble.module.css +11 -9
  44. package/es/LocationBubble/props/defaultProps.js +1 -1
  45. package/es/LocationBubble/props/propTypes.js +2 -2
  46. package/es/MediaBubbleWrapper/MediaBubbleWrapper.js +59 -0
  47. package/es/MediaBubbleWrapper/css/MediaBubbleWrapper.module.css +3 -0
  48. package/es/MediaBubbleWrapper/index.js +1 -0
  49. package/es/MediaBubbleWrapper/props/defaultProps.js +7 -0
  50. package/es/MediaBubbleWrapper/props/propTypes.js +16 -0
  51. package/es/Message/Message.js +91 -104
  52. package/es/Message/props/defaultProps.js +3 -35
  53. package/es/Message/props/propTypes.js +26 -85
  54. package/es/MessageAction/MessageAction.js +32 -19
  55. package/es/MessageAction/props/defaultProps.js +4 -4
  56. package/es/MessageAction/props/propTypes.js +11 -8
  57. package/es/MessageActions/MessageActions.js +86 -53
  58. package/es/MessageActions/css/MessageActions.module.css +23 -2
  59. package/es/MessageActions/props/defaultProps.js +5 -5
  60. package/es/MessageActions/props/propTypes.js +15 -3
  61. package/es/MessageActionsMore/MessageActionsMore.js +45 -37
  62. package/es/MessageActionsMore/css/MessageActionsMore.module.css +8 -5
  63. package/es/MessageActionsMore/props/defaultProps.js +3 -2
  64. package/es/MessageActionsMore/props/propTypes.js +3 -2
  65. package/es/MessageActionsWrapper/MessageActionsWrapper.js +67 -0
  66. package/es/MessageActionsWrapper/css/MessageActionsWrapper.module.css +3 -0
  67. package/es/MessageActionsWrapper/index.js +1 -0
  68. package/es/MessageActionsWrapper/props/defaultProps.js +9 -0
  69. package/es/MessageActionsWrapper/props/propTypes.js +15 -0
  70. package/es/MessageAvatar/MessageAvatar.js +15 -22
  71. package/es/MessageAvatar/css/MessageAvatar.module.css +3 -3
  72. package/es/MessageAvatar/props/defaultProps.js +2 -6
  73. package/es/MessageAvatar/props/propTypes.js +5 -5
  74. package/es/MessageBox/MessageBox.js +24 -25
  75. package/es/MessageBox/css/MessageBox.module.css +12 -14
  76. package/es/MessageBox/css/cssJSLogic.js +1 -21
  77. package/es/MessageBox/props/defaultProps.js +1 -3
  78. package/es/MessageBox/props/propTypes.js +8 -7
  79. package/es/MessageBubble/MessageBubble.js +61 -38
  80. package/es/MessageBubble/css/MessageBubble.module.css +11 -8
  81. package/es/MessageBubble/css/cssJSLogic.js +10 -26
  82. package/es/MessageBubble/props/defaultProps.js +2 -2
  83. package/es/MessageBubble/props/propTypes.js +9 -9
  84. package/es/MessageStatus/MessageStatus.js +72 -0
  85. package/es/{im/IMMessageStatus/css/IMMessageStatus.module.css → MessageStatus/css/MessageStatus.module.css} +1 -1
  86. package/es/MessageStatus/css/cssJSLogic.js +26 -0
  87. package/es/MessageStatus/index.js +1 -0
  88. package/es/{im/IMAttachmentIcon → MessageStatus}/props/defaultProps.js +3 -3
  89. package/es/MessageStatus/props/propTypes.js +12 -0
  90. package/es/MoreActionItem/MoreActionItem.js +25 -37
  91. package/es/MoreActionItem/css/MoreActionItem.module.css +5 -11
  92. package/es/MoreActionItem/props/defaultProps.js +1 -5
  93. package/es/MoreActionItem/props/propTypes.js +6 -5
  94. package/es/ReplyBubble/ReplyBubble.js +62 -30
  95. package/es/ReplyBubble/css/ReplyBubble.module.css +17 -0
  96. package/es/ReplyBubble/props/defaultProps.js +3 -4
  97. package/es/ReplyBubble/props/propTypes.js +15 -8
  98. package/es/ReplyBubbleContent/ReplyBubbleContent.js +21 -28
  99. package/es/ReplyBubbleContent/css/ReplyBubbleContent.module.css +44 -34
  100. package/es/ReplyBubbleContent/props/defaultProps.js +1 -1
  101. package/es/ReplyBubbleContent/props/propTypes.js +4 -4
  102. package/es/ReplyBubbleHeader/ReplyBubbleHeader.js +25 -29
  103. package/es/ReplyBubbleHeader/css/ReplyBubbleHeader.module.css +12 -4
  104. package/es/ReplyBubbleHeader/props/defaultProps.js +2 -5
  105. package/es/ReplyBubbleHeader/props/propTypes.js +2 -2
  106. package/es/TextBubble/TextBubble.js +15 -34
  107. package/es/TextBubble/css/TextBubble.module.css +16 -3
  108. package/es/TextBubble/props/defaultProps.js +2 -5
  109. package/es/TextBubble/props/propTypes.js +3 -4
  110. package/es/Theme/{DeskAssets.js → ThemeAssets.js} +10 -6
  111. package/es/Theme/ThemeWrapper.js +62 -62
  112. package/es/Theme/{ToolttipWrapper.js → TooltipWrapper.js} +29 -25
  113. package/es/Theme/constants/index.js +1 -4
  114. package/es/Theme/crm/dark/blueFanTheme.js +5 -5
  115. package/es/Theme/crm/dark/blueTheme.js +5 -5
  116. package/es/Theme/crm/dark/commonColorVariable.js +5 -5
  117. package/es/Theme/crm/dark/darkBlueTheme.js +5 -5
  118. package/es/Theme/crm/dark/darkGreyTheme.js +5 -5
  119. package/es/Theme/crm/dark/greenTheme.js +5 -5
  120. package/es/Theme/crm/dark/orangeTheme.js +5 -5
  121. package/es/Theme/crm/dark/pinkTheme.js +5 -5
  122. package/es/Theme/crm/dark/tealTheme.js +5 -5
  123. package/es/Theme/crm/dark/whiteTheme.js +5 -5
  124. package/es/Theme/crm/light/blueFanTheme.js +5 -5
  125. package/es/Theme/crm/light/blueTheme.js +3 -3
  126. package/es/Theme/crm/light/commonColorVariable.js +3 -3
  127. package/es/Theme/crm/light/darkBlueTheme.js +5 -5
  128. package/es/Theme/crm/light/darkGreyTheme.js +5 -5
  129. package/es/Theme/crm/light/greenTheme.js +3 -3
  130. package/es/Theme/crm/light/orangeTheme.js +3 -3
  131. package/es/Theme/crm/light/pinkTheme.js +3 -3
  132. package/es/Theme/crm/light/tealTheme.js +3 -3
  133. package/es/Theme/crm/light/whiteTheme.js +5 -5
  134. package/es/Theme/crm/pureDark/blueFanTheme.js +5 -5
  135. package/es/Theme/crm/pureDark/blueTheme.js +5 -5
  136. package/es/Theme/crm/pureDark/commonColorVariable.js +3 -3
  137. package/es/Theme/crm/pureDark/darkBlueTheme.js +5 -5
  138. package/es/Theme/crm/pureDark/darkGreyTheme.js +5 -5
  139. package/es/Theme/crm/pureDark/greenTheme.js +5 -5
  140. package/es/Theme/crm/pureDark/orangeTheme.js +5 -5
  141. package/es/Theme/crm/pureDark/pinkTheme.js +5 -5
  142. package/es/Theme/crm/pureDark/tealTheme.js +5 -5
  143. package/es/Theme/crm/pureDark/whiteTheme.js +5 -5
  144. package/es/Theme/css/TooltipWrapper.module.css +2 -2
  145. package/es/Theme/props/defaultProps.js +2 -3
  146. package/es/Theme/props/propTypes.js +5 -6
  147. package/es/Theme/themeVariables/commonThemeColorVariable.js +13 -0
  148. package/es/Theme/themeVariables/dark/blueTheme.js +68 -0
  149. package/es/Theme/themeVariables/dark/commonColorVariable.js +10 -0
  150. package/es/Theme/themeVariables/dark/greenTheme.js +67 -0
  151. package/es/Theme/themeVariables/dark/orangeTheme.js +67 -0
  152. package/es/Theme/themeVariables/dark/redTheme.js +76 -0
  153. package/es/Theme/themeVariables/dark/yellowTheme.js +67 -0
  154. package/es/Theme/themeVariables/light/blueTheme.js +63 -0
  155. package/es/Theme/themeVariables/light/commonColorVariable.js +12 -0
  156. package/es/Theme/themeVariables/light/greenTheme.js +63 -0
  157. package/es/Theme/themeVariables/light/orangeTheme.js +61 -0
  158. package/es/Theme/themeVariables/light/redTheme.js +61 -0
  159. package/es/Theme/themeVariables/light/yellowTheme.js +63 -0
  160. package/es/Theme/themeVariables/pureDark/blueTheme.js +68 -0
  161. package/es/Theme/themeVariables/pureDark/commonColorVariable.js +12 -0
  162. package/es/Theme/themeVariables/pureDark/greenTheme.js +67 -0
  163. package/es/Theme/themeVariables/pureDark/orangeTheme.js +67 -0
  164. package/es/Theme/themeVariables/pureDark/redTheme.js +67 -0
  165. package/es/Theme/themeVariables/pureDark/yellowTheme.js +67 -0
  166. package/es/Theme/utils/combineConfigurations.js +17 -0
  167. package/es/Theme/utils/flatVariables.js +12 -0
  168. package/es/Theme/utils/getCustomizedCssVariables.js +19 -0
  169. package/es/Theme/utils/getThemeConfigurations.js +47 -175
  170. package/es/Theme/utils/getWrapperDivProps.js +12 -0
  171. package/es/Video/Video.js +14 -45
  172. package/es/Video/css/Video.module.css +2 -7
  173. package/es/Video/props/defaultProps.js +2 -3
  174. package/es/Video/props/propTypes.js +3 -4
  175. package/es/VideoBubble/VideoBubble.js +31 -36
  176. package/es/VideoBubble/css/VideoBubble.module.css +4 -4
  177. package/es/VideoBubble/props/defaultProps.js +2 -3
  178. package/es/VideoBubble/props/propTypes.js +11 -7
  179. package/es/icons/create-icon-components.js +31 -0
  180. package/es/icons/icon.template.js +10 -9
  181. package/es/icons/iconSrc/attachments/Audio.js +1 -0
  182. package/es/icons/iconSrc/attachments/Code.js +1 -0
  183. package/es/icons/iconSrc/attachments/Image.js +1 -0
  184. package/es/icons/iconSrc/attachments/Pdf.js +1 -0
  185. package/es/icons/iconSrc/attachments/Txt.js +1 -0
  186. package/es/icons/iconSrc/attachments/Unknown.js +1 -0
  187. package/es/icons/iconSrc/attachments/Video.js +1 -0
  188. package/es/icons/iconSrc/attachments/Zip.js +1 -0
  189. package/es/icons/iconSrc/attachments/index.js +8 -8
  190. package/es/icons/iconSrc/common/Article.js +1 -0
  191. package/es/icons/iconSrc/common/index.js +1 -2
  192. package/es/icons/iconSrc/integrations/ChInstagram.js +1 -0
  193. package/es/icons/iconSrc/integrations/ChWhatsApp.js +1 -0
  194. package/es/icons/iconSrc/integrations/TtASAP.js +1 -0
  195. package/es/icons/iconSrc/integrations/TtTelegram.js +1 -0
  196. package/es/icons/iconSrc/integrations/TtTwillio.js +1 -0
  197. package/es/icons/iconSrc/integrations/TtTwitter.js +1 -0
  198. package/es/icons/iconSrc/integrations/TtWechat.js +1 -0
  199. package/es/icons/iconSrc/integrations/index.js +7 -7
  200. package/es/icons/iconSrc/messageStatus/Clock.js +1 -0
  201. package/es/icons/iconSrc/messageStatus/DoubleTick.js +1 -0
  202. package/es/icons/iconSrc/messageStatus/Failed.js +1 -0
  203. package/es/icons/iconSrc/messageStatus/Tick.js +1 -0
  204. package/es/icons/iconSrc/messageStatus/index.js +4 -4
  205. package/es/im/ArticleBubble/ArticleBubble.js +66 -0
  206. package/es/im/ArticleBubble/css/ArticleBubble.module.css +47 -0
  207. package/es/{ArticleBubble → im/ArticleBubble}/props/defaultProps.js +1 -1
  208. package/es/im/ArticleBubble/props/propTypes.js +13 -0
  209. package/es/im/IMAutoMessageInfo/IMAutoMessageInfo.js +10 -21
  210. package/es/im/IMAutoMessageInfo/css/IMAutoMessageInfo.module.css +2 -3
  211. package/es/im/IMAutoMessageInfo/props/defaultProps.js +1 -1
  212. package/es/im/IMAutoMessageInfo/props/propTypes.js +11 -9
  213. package/es/im/IMInfoBubble/IMInfoBubble.js +6 -9
  214. package/es/im/IMInfoBubble/props/defaultProps.js +1 -1
  215. package/es/im/IMIntegrationIcon/IMIntegrationIcon.js +31 -38
  216. package/es/im/IMIntegrationIcon/css/IMIntegrationIcon.module.css +5 -8
  217. package/es/im/IMIntegrationIcon/css/cssJSLogic.js +9 -13
  218. package/es/im/IMIntegrationIcon/index.js +1 -2
  219. package/es/im/IMIntegrationIcon/props/defaultProps.js +6 -4
  220. package/es/im/IMIntegrationIcon/props/propTypes.js +6 -17
  221. package/es/im/IMMessage/IMMessage.js +95 -156
  222. package/es/im/IMMessage/props/defaultProps.js +2 -29
  223. package/es/im/IMMessage/props/propTypes.js +57 -117
  224. package/es/im/IMMessageContent/IMMessageContent.js +80 -55
  225. package/es/im/IMMessageContent/css/IMMessageContent.module.css +3 -0
  226. package/es/im/IMMessageContent/props/defaultProps.js +2 -3
  227. package/es/im/IMMessageContent/props/propTypes.js +28 -23
  228. package/es/im/IMMessageMeta/IMMessageMeta.js +28 -24
  229. package/es/im/IMMessageMeta/css/IMMessageMeta.module.css +15 -4
  230. package/es/im/IMMessageMeta/css/cssJSLogic.js +11 -3
  231. package/es/im/IMMessageMeta/props/defaultProps.js +1 -1
  232. package/es/im/IMMessageMeta/props/propTypes.js +17 -12
  233. package/es/im/IMReplyBubble/IMReplyBubble.js +21 -61
  234. package/es/im/IMReplyBubble/props/defaultProps.js +2 -4
  235. package/es/im/IMReplyBubble/props/propTypes.js +16 -14
  236. package/es/im/IMTextBubble/IMTextBubble.js +16 -33
  237. package/es/im/IMTextBubble/props/defaultProps.js +3 -9
  238. package/es/im/IMTextBubble/props/propTypes.js +22 -8
  239. package/es/im/IMTicketLink/IMTicketLink.js +13 -13
  240. package/es/im/IMTicketLink/css/IMTicketLink.module.css +3 -4
  241. package/es/im/IMTicketLink/props/defaultProps.js +1 -1
  242. package/es/im/IMTicketLink/props/propTypes.js +4 -3
  243. package/es/im/index.js +1 -11
  244. package/es/index.js +30 -34
  245. package/package.json +32 -14
  246. package/es/ActionIcon/css/cssJSLogic.js +0 -10
  247. package/es/ArticleBubble/ArticleBubble.js +0 -68
  248. package/es/ArticleBubble/css/ArticleBubble.module.css +0 -40
  249. package/es/ArticleBubble/css/cssJSLogic.js +0 -34
  250. package/es/ArticleBubble/props/propTypes.js +0 -10
  251. package/es/AttachmentBubble/css/cssJSLogic.js +0 -18
  252. package/es/AttachmentBubbleInfo/css/cssJSLogic.js +0 -18
  253. package/es/Audio/css/cssJSLogic.js +0 -14
  254. package/es/AudioBubble/css/AudioBubble.module.css +0 -3
  255. package/es/AudioBubble/css/cssJSLogic.js +0 -20
  256. package/es/ImageBubble/css/cssJSLogic.js +0 -22
  257. package/es/LazyLoadImage/css/cssJSLogic.js +0 -10
  258. package/es/LocationBubble/css/cssJSLogic.js +0 -30
  259. package/es/MediaControls/MediaControls.js +0 -60
  260. package/es/MediaControls/css/MediaControls.module.css +0 -1
  261. package/es/MediaControls/css/cssJSLogic.js +0 -22
  262. package/es/MediaControls/index.js +0 -1
  263. package/es/MediaControls/props/propTypes.js +0 -11
  264. package/es/Message/css/Message.module.css +0 -0
  265. package/es/Message/css/cssJSLogic.js +0 -10
  266. package/es/MessageAction/css/MessageAction.module.css +0 -0
  267. package/es/MessageAction/css/cssJSLogic.js +0 -0
  268. package/es/MessageActions/css/cssJSLogic.js +0 -10
  269. package/es/MessageActions/props/propConstants.js +0 -7
  270. package/es/MessageActionsMore/css/cssJSLogic.js +0 -28
  271. package/es/MessageAvatar/css/cssJSLogic.js +0 -18
  272. package/es/MessageBoxFooter/MessageBoxFooter.js +0 -39
  273. package/es/MessageBoxFooter/css/MessageBoxFooter.module.css +0 -3
  274. package/es/MessageBoxFooter/css/cssJSLogic.js +0 -10
  275. package/es/MessageBoxFooter/index.js +0 -1
  276. package/es/MessageBoxFooter/props/defaultProps.js +0 -5
  277. package/es/MessageBoxFooter/props/propTypes.js +0 -6
  278. package/es/MessageBoxHeader/MessageBoxHeader.js +0 -7
  279. package/es/MessageBoxHeader/css/MessageBoxHeader.module.css +0 -0
  280. package/es/MessageBoxHeader/css/cssJsLogic.js +0 -0
  281. package/es/MessageBoxHeader/index.js +0 -2
  282. package/es/MessageBoxHeader/props/defaultProps.js +0 -0
  283. package/es/MessageBoxHeader/props/propTypes.js +0 -0
  284. package/es/MessageBubble/props/propConstants.js +0 -6
  285. package/es/MessageWrapper/MessageWrapper.js +0 -37
  286. package/es/MessageWrapper/css/MessageWrapper.module.css +0 -0
  287. package/es/MessageWrapper/css/cssJSLogic.js +0 -10
  288. package/es/MessageWrapper/index.js +0 -1
  289. package/es/MessageWrapper/props/propTypes.js +0 -6
  290. package/es/MoreActionItem/css/cssJSLogic.js +0 -27
  291. package/es/ReplyBubble/css/cssJSLogic.js +0 -10
  292. package/es/ReplyBubbleContent/css/cssJSLogic.js +0 -22
  293. package/es/ReplyBubbleHeader/css/cssJSLogic.js +0 -10
  294. package/es/TextBubble/css/cssJSLogic.js +0 -18
  295. package/es/TextMessage/DefaultActions.js +0 -60
  296. package/es/TextMessage/TextMessage.js +0 -67
  297. package/es/TextMessage/TextMessage1.js +0 -69
  298. package/es/TextMessage/css/TextMessage.module.css +0 -5
  299. package/es/TextMessage/css/cssJSLogic.js +0 -0
  300. package/es/TextMessage/index.js +0 -1
  301. package/es/TextMessage/props/defaultProps.js +0 -4
  302. package/es/TextMessage/props/propConstants.js +0 -3
  303. package/es/TextMessage/props/propTypes.js +0 -17
  304. package/es/Theme/css/cssJSLogic.js +0 -14
  305. package/es/Theme/darkTheme.js +0 -9
  306. package/es/Theme/defaultTheme.js +0 -33
  307. package/es/Theme/desk/commonDeskColorVariable.js +0 -14
  308. package/es/Theme/desk/dark/blueTheme.js +0 -42
  309. package/es/Theme/desk/dark/commonColorVariable.js +0 -5
  310. package/es/Theme/desk/dark/greenTheme.js +0 -41
  311. package/es/Theme/desk/dark/orangeTheme.js +0 -41
  312. package/es/Theme/desk/dark/redTheme.js +0 -41
  313. package/es/Theme/desk/dark/yellowTheme.js +0 -41
  314. package/es/Theme/desk/light/blueTheme.js +0 -46
  315. package/es/Theme/desk/light/commonColorVariable.js +0 -6
  316. package/es/Theme/desk/light/greenTheme.js +0 -37
  317. package/es/Theme/desk/light/orangeTheme.js +0 -36
  318. package/es/Theme/desk/light/redTheme.js +0 -36
  319. package/es/Theme/desk/light/yellowTheme.js +0 -37
  320. package/es/Theme/desk/pureDark/blueTheme.js +0 -41
  321. package/es/Theme/desk/pureDark/commonColorVariable.js +0 -7
  322. package/es/Theme/desk/pureDark/greenTheme.js +0 -41
  323. package/es/Theme/desk/pureDark/orangeTheme.js +0 -41
  324. package/es/Theme/desk/pureDark/redTheme.js +0 -41
  325. package/es/Theme/desk/pureDark/yellowTheme.js +0 -41
  326. package/es/Video/css/cssJSLogic.js +0 -14
  327. package/es/VideoBubble/css/cssJSLogic.js +0 -10
  328. package/es/icons/factory/actions/convertTicket.svg +0 -21
  329. package/es/icons/factory/common/quote.svg +0 -1
  330. package/es/icons/iconSrc/actions/ConvertTicket.js +0 -24
  331. package/es/icons/iconSrc/actions/index.js +0 -1
  332. package/es/icons/iconSrc/common/Quote.js +0 -16
  333. package/es/im/IMArticleBubble/IMArticleBubble.js +0 -55
  334. package/es/im/IMArticleBubble/css/IMArticleBubble.module.css +0 -0
  335. package/es/im/IMArticleBubble/css/cssJSLogic.js +0 -10
  336. package/es/im/IMArticleBubble/index.js +0 -1
  337. package/es/im/IMArticleBubble/props/defaultProps.js +0 -8
  338. package/es/im/IMArticleBubble/props/propTypes.js +0 -14
  339. package/es/im/IMAttachmentBubble/IMAttachmentBubble.js +0 -63
  340. package/es/im/IMAttachmentBubble/css/IMAttachmentBubble.module.css +0 -1
  341. package/es/im/IMAttachmentBubble/css/cssJSLogic.js +0 -10
  342. package/es/im/IMAttachmentBubble/index.js +0 -1
  343. package/es/im/IMAttachmentBubble/props/defaultProps.js +0 -10
  344. package/es/im/IMAttachmentBubble/props/propTypes.js +0 -16
  345. package/es/im/IMAttachmentIcon/IMAttachmentIcon.js +0 -86
  346. package/es/im/IMAttachmentIcon/css/IMAttachmentIcon.module.css +0 -4
  347. package/es/im/IMAttachmentIcon/css/cssJSLogic.js +0 -16
  348. package/es/im/IMAttachmentIcon/index.js +0 -1
  349. package/es/im/IMAttachmentIcon/props/propTypes.js +0 -26
  350. package/es/im/IMAudioBubble/IMAudioBubble.js +0 -63
  351. package/es/im/IMAudioBubble/css/IMAudioBubble.module.css +0 -8
  352. package/es/im/IMAudioBubble/css/cssJSLogic.js +0 -20
  353. package/es/im/IMAudioBubble/index.js +0 -1
  354. package/es/im/IMAudioBubble/props/defaultProps.js +0 -11
  355. package/es/im/IMAudioBubble/props/propTypes.js +0 -17
  356. package/es/im/IMAutoMessageInfo/css/cssJSLogic.js +0 -10
  357. package/es/im/IMDateTime/IMDateTime.js +0 -41
  358. package/es/im/IMDateTime/css/IMDateTime.module.css +0 -5
  359. package/es/im/IMDateTime/css/cssJSLogic.js +0 -10
  360. package/es/im/IMDateTime/index.js +0 -1
  361. package/es/im/IMDateTime/props/defaultProps.js +0 -6
  362. package/es/im/IMDateTime/props/propTypes.js +0 -6
  363. package/es/im/IMImageBubble/IMImageBubble.js +0 -49
  364. package/es/im/IMImageBubble/css/IMImageBubble.module.css +0 -0
  365. package/es/im/IMImageBubble/css/cssJSLogic.js +0 -10
  366. package/es/im/IMImageBubble/index.js +0 -1
  367. package/es/im/IMImageBubble/props/defaultProps.js +0 -7
  368. package/es/im/IMImageBubble/props/propTypes.js +0 -13
  369. package/es/im/IMIntegrationIcon/props/propConstants.js +0 -8
  370. package/es/im/IMLocationBubble/IMLocationBubble.js +0 -49
  371. package/es/im/IMLocationBubble/css/IMLocationBubble.module.css +0 -0
  372. package/es/im/IMLocationBubble/css/cssJSLogic.js +0 -10
  373. package/es/im/IMLocationBubble/index.js +0 -1
  374. package/es/im/IMLocationBubble/props/defaultProps.js +0 -8
  375. package/es/im/IMLocationBubble/props/propTypes.js +0 -11
  376. package/es/im/IMMessage/css/IMMessage.module.css +0 -0
  377. package/es/im/IMMessage/css/cssJSLogic.js +0 -10
  378. package/es/im/IMMessage/renderChild/renderMessage.js +0 -8
  379. package/es/im/IMMessage/renderChild/renderMessageActions.js +0 -8
  380. package/es/im/IMMessage/renderChild/renderMessageBox.js +0 -15
  381. package/es/im/IMMessage/renderChild/renderMessageBoxFooter.js +0 -8
  382. package/es/im/IMMessage/renderChild/renderMessageFooter.js +0 -8
  383. package/es/im/IMMessage/renderChild/renderMessageHeader.js +0 -8
  384. package/es/im/IMMessage/renderChild/renderMessageOwner.js +0 -8
  385. package/es/im/IMMessage/renderChild/renderMessageStatus.js +0 -8
  386. package/es/im/IMMessageActions/IMMessageActions.js +0 -150
  387. package/es/im/IMMessageActions/css/IMMessageActions.module.css +0 -31
  388. package/es/im/IMMessageActions/css/cssJSLogic.js +0 -20
  389. package/es/im/IMMessageActions/index.js +0 -1
  390. package/es/im/IMMessageActions/props/defaultProps.js +0 -12
  391. package/es/im/IMMessageActions/props/propTypes.js +0 -30
  392. package/es/im/IMMessageAvatar/IMMessageAvatar.js +0 -45
  393. package/es/im/IMMessageAvatar/css/IMMessageAvatar.module.css +0 -0
  394. package/es/im/IMMessageAvatar/css/cssJSLogic.js +0 -0
  395. package/es/im/IMMessageAvatar/index.js +0 -1
  396. package/es/im/IMMessageAvatar/props/defaultProps.js +0 -12
  397. package/es/im/IMMessageAvatar/props/propTypes.js +0 -28
  398. package/es/im/IMMessageContent/css/cssJSLogic.js +0 -10
  399. package/es/im/IMMessageStatus/IMMessageStatus.js +0 -69
  400. package/es/im/IMMessageStatus/css/cssJSLogic.js +0 -22
  401. package/es/im/IMMessageStatus/index.js +0 -1
  402. package/es/im/IMMessageStatus/props/defaultProps.js +0 -6
  403. package/es/im/IMMessageStatus/props/propTypes.js +0 -21
  404. package/es/im/IMReplyBubble/css/IMReplyBubble.module.css +0 -24
  405. package/es/im/IMReplyBubble/css/cssJSLogic.js +0 -10
  406. package/es/im/IMTextBubble/css/IMTextBubble.module.css +0 -1
  407. package/es/im/IMTextBubble/css/cssJSLogic.js +0 -10
  408. package/es/im/IMVideoBubble/IMVideoBubble.js +0 -62
  409. package/es/im/IMVideoBubble/css/IMVideoBubble.module.css +0 -1
  410. package/es/im/IMVideoBubble/css/cssJSLogic.js +0 -10
  411. package/es/im/IMVideoBubble/index.js +0 -1
  412. package/es/im/IMVideoBubble/props/defaultProps.js +0 -11
  413. package/es/im/IMVideoBubble/props/propTypes.js +0 -17
  414. package/es/unused/AvatarSpace/AvatarSpace.js +0 -40
  415. package/es/unused/AvatarSpace/css/AvatarSpace.module.css +0 -1
  416. package/es/unused/AvatarSpace/css/cssJSLogic.js +0 -15
  417. package/es/unused/AvatarSpace/index.js +0 -1
  418. package/es/unused/AvatarSpace/props/defaultProps.js +0 -10
  419. package/es/unused/AvatarSpace/props/propConstants.js +0 -7
  420. package/es/unused/AvatarSpace/props/propTypes.js +0 -8
  421. /package/es/{ArticleBubble → im/ArticleBubble}/index.js +0 -0
package/es/icons/create-icon-components.js CHANGED
@@ -1,13 +1,22 @@
1
+ /* eslint-disable */
1
2
  const commandLineArgs = require('command-line-args');
3
+
2
4
  const path = require('path');
5
+
3
6
  const fs = require('fs');
7
+
4
8
  const templateList = require('./icon.template');
9
+
5
10
  const jsdom = require('jsdom');
11
+
6
12
  const {
7
13
  JSDOM
8
14
  } = jsdom;
15
+
9
16
  const reactToJsx = require('react-to-jsx');
17
+
10
18
  const HtmlToReactParser = require('html-to-react').Parser;
19
+
11
20
  const htmlToReactParser = new HtmlToReactParser();
12
21
  const options = commandLineArgs([{
13
22
  name: 'sourucePath',
@@ -20,6 +29,7 @@ const options = commandLineArgs([{
20
29
  }]);
21
30
  const sourucePath = `${__dirname}/${options.sourucePath}`;
22
31
  const targetPath = `${__dirname}/${options.targetPath}`;
32
+
23
33
  function readAllFolder(sourucePath, targetPath, index, filesList, callback) {
24
34
  const readDirMain = fs.readdirSync(sourucePath, {
25
35
  withFileTypes: true
@@ -27,18 +37,22 @@ function readAllFolder(sourucePath, targetPath, index, filesList, callback) {
27
37
  readDirMain.forEach(dirNext => {
28
38
  const sourceDirPath = path.join(`${sourucePath}/${dirNext.name}`);
29
39
  const targetDirPath = path.join(`${targetPath}/${dirNext.name}`);
40
+
30
41
  if (fs.existsSync(sourceDirPath) && fs.lstatSync(sourceDirPath).isDirectory()) {
31
42
  filesList[index + 1] = [];
32
43
  readAllFolder(sourceDirPath, targetDirPath, index + 1, filesList, callback);
33
44
  createIndexFiles(filesList[index + 1], targetDirPath);
34
45
  return;
35
46
  }
47
+
36
48
  const svgFileName = callback(dirNext, sourucePath, targetPath);
49
+
37
50
  if (svgFileName) {
38
51
  filesList[index] = (filesList[index] || []).concat(svgFileName);
39
52
  }
40
53
  });
41
54
  }
55
+
42
56
  function createIndexFiles(filesList, targetDirPath) {
43
57
  let indexContent = '';
44
58
  filesList.forEach(fileName => {
@@ -47,6 +61,7 @@ function createIndexFiles(filesList, targetDirPath) {
47
61
  name: fileName
48
62
  })}\n`;
49
63
  });
64
+
50
65
  if (indexContent) {
51
66
  const fsPromises = fs.promises;
52
67
  fsPromises.mkdir(targetDirPath, {
@@ -56,8 +71,10 @@ function createIndexFiles(filesList, targetDirPath) {
56
71
  });
57
72
  }
58
73
  }
74
+
59
75
  function getFormattedSvgFileName(fileName) {
60
76
  const replacer = '/'; // OS won't allow this char.so.
77
+
61
78
  let str = fileName.replace(/[^A-z0-9]/g, replacer);
62
79
  str = str.split('');
63
80
  str.forEach((charCode, index) => {
@@ -69,16 +86,20 @@ function getFormattedSvgFileName(fileName) {
69
86
  fileName = str.join('');
70
87
  return fileName.charAt(0).toUpperCase() + fileName.slice(1);
71
88
  }
89
+
72
90
  function isValidFileName(fileName) {
73
91
  return /[A-z]/g.test(fileName.charAt(0));
74
92
  }
93
+
75
94
  readAllFolder(sourucePath, targetPath, 0, [], (file, sourucePath, targetPath) => {
76
95
  let svgFileName = '';
96
+
77
97
  if (file && path.extname(file.name) === '.svg') {
78
98
  if (!isValidFileName(file.name)) {
79
99
  console.error(`Invalid File Name Error!!! - This file ${file.name} is should be startswith A-z `);
80
100
  return;
81
101
  }
102
+
82
103
  try {
83
104
  const readFilePath = path.join(`${sourucePath}/${file.name}`);
84
105
  const svgFileContent = fs.readFileSync(readFilePath).toString();
@@ -90,36 +111,45 @@ readAllFolder(sourucePath, targetPath, 0, [], (file, sourucePath, targetPath) =>
90
111
  const dom = new JSDOM(`<!DOCTYPE html>${svgFileContent}`);
91
112
  const doc = dom.window.document;
92
113
  const collection = doc.querySelectorAll('title');
114
+
93
115
  for (const elem of collection) {
94
116
  elem.parentNode.removeChild(elem);
95
117
  }
118
+
96
119
  const svgElement = doc.querySelector('svg');
97
120
  svgElement.removeAttribute('width');
98
121
  svgElement.removeAttribute('height');
99
122
  svgElement.removeAttribute('version');
100
123
  const styleTags = svgElement.querySelector('style');
101
124
  let styleTagsContent;
125
+
102
126
  if (styleTags) {
103
127
  styleTagsContent = styleTags.innerHTML;
104
128
  const NewStyleElement = doc.createElement('style');
105
129
  styleTags.parentNode.replaceChild(NewStyleElement, styleTags);
106
130
  }
131
+
107
132
  const collectionPathEl = svgElement.querySelectorAll('path');
133
+
108
134
  for (const entry of collectionPathEl.entries()) {
109
135
  const index = entry[0];
110
136
  const elem = entry[1];
111
137
  elem.setAttribute('class', `path-${index}`);
138
+
112
139
  if (elem.getAttribute('fill') == 'black' || elem.getAttribute('fill') == '#010101') {
113
140
  elem.removeAttribute('fill');
114
141
  }
115
142
  }
143
+
116
144
  const svgHtmlContent = svgElement.outerHTML.replace(/\s+/g, ' ').trim();
117
145
  const svgAsReactElement = htmlToReactParser.parse(svgHtmlContent);
118
146
  let svgHtmlContentResult = reactToJsx(svgAsReactElement).replace(/\s+/g, ' ').trim();
147
+
119
148
  if (styleTags) {
120
149
  // console.log(styleTags, 'styleTags');
121
150
  svgHtmlContentResult = svgHtmlContentResult.replace('<style/>', `<style dangerouslySetInnerHTML={{__html: \`${styleTagsContent}\` }} />`);
122
151
  }
152
+
123
153
  svgHtmlContentResult = svgHtmlContentResult.replace(/color-interpolation-filters/gi, 'colorInterpolationFilters');
124
154
  svgHtmlContentResult = svgHtmlContentResult.replace(/feflood/gi, 'feFlood');
125
155
  svgHtmlContentResult = svgHtmlContentResult.replace(/fecolormatrix/gi, 'feColorMatrix');
@@ -137,5 +167,6 @@ readAllFolder(sourucePath, targetPath, 0, [], (file, sourucePath, targetPath) =>
137
167
  console.error(err);
138
168
  }
139
169
  }
170
+
140
171
  return svgFileName;
141
172
  });
package/es/icons/icon.template.js CHANGED
@@ -1,26 +1,27 @@
1
1
  function iconTemplate(_ref) {
2
2
  let {
3
3
  path,
4
- name,
5
4
  value
6
5
  } = _ref;
7
- return `
8
- import React from 'react';
9
- import Icon from '${path}';
6
+ return `/* eslint-disable */
7
+ import React from 'react';
8
+ import Icon from '${path}';
10
9
 
11
- export default function IconComponent(props) {
12
- return <Icon {...props}>${value}</Icon>
13
- }
10
+ export default function IconComponent(props) {
11
+ return <Icon {...props}>${value}</Icon>
12
+ }
14
13
 
15
- IconComponent.propTypes=Icon.propTypes;`;
14
+ IconComponent.propTypes=Icon.propTypes;`;
16
15
  }
16
+
17
17
  function indexTemplate(_ref2) {
18
18
  let {
19
19
  name,
20
20
  path
21
21
  } = _ref2;
22
- return `export { default as ${name} } from "${path}";`;
22
+ return `export { default as ${name} } from '${path}';`;
23
23
  }
24
+
24
25
  module.exports = {
25
26
  iconTemplate,
26
27
  indexTemplate
package/es/icons/iconSrc/attachments/Audio.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/Code.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/Image.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/Pdf.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/Txt.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/Unknown.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/Video.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/Zip.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/attachments/index.js CHANGED
@@ -1,8 +1,8 @@
1
- export { default as Audio } from "./Audio";
2
- export { default as Code } from "./Code";
3
- export { default as Image } from "./Image";
4
- export { default as Pdf } from "./Pdf";
5
- export { default as Txt } from "./Txt";
6
- export { default as Unknown } from "./Unknown";
7
- export { default as Video } from "./Video";
8
- export { default as Zip } from "./Zip";
1
+ export { default as Audio } from './Audio';
2
+ export { default as Code } from './Code';
3
+ export { default as Image } from './Image';
4
+ export { default as Pdf } from './Pdf';
5
+ export { default as Txt } from './Txt';
6
+ export { default as Unknown } from './Unknown';
7
+ export { default as Video } from './Video';
8
+ export { default as Zip } from './Zip';
package/es/icons/iconSrc/common/Article.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/common/index.js CHANGED
@@ -1,2 +1 @@
1
- export { default as Article } from "./Article";
2
- export { default as Quote } from "./Quote";
1
+ export { default as Article } from './Article';
package/es/icons/iconSrc/integrations/ChInstagram.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/integrations/ChWhatsApp.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/integrations/TtASAP.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/integrations/TtTelegram.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/integrations/TtTwillio.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/integrations/TtTwitter.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/integrations/TtWechat.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/integrations/index.js CHANGED
@@ -1,7 +1,7 @@
1
- export { default as ChInstagram } from "./ChInstagram";
2
- export { default as ChWhatsApp } from "./ChWhatsApp";
3
- export { default as TtASAP } from "./TtASAP";
4
- export { default as TtTelegram } from "./TtTelegram";
5
- export { default as TtTwillio } from "./TtTwillio";
6
- export { default as TtTwitter } from "./TtTwitter";
7
- export { default as TtWechat } from "./TtWechat";
1
+ export { default as ChInstagram } from './ChInstagram';
2
+ export { default as ChWhatsApp } from './ChWhatsApp';
3
+ export { default as TtASAP } from './TtASAP';
4
+ export { default as TtTelegram } from './TtTelegram';
5
+ export { default as TtTwillio } from './TtTwillio';
6
+ export { default as TtTwitter } from './TtTwitter';
7
+ export { default as TtWechat } from './TtWechat';
package/es/icons/iconSrc/messageStatus/Clock.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/messageStatus/DoubleTick.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/messageStatus/Failed.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/messageStatus/Tick.js CHANGED
@@ -1,3 +1,4 @@
1
+ /* eslint-disable */
1
2
  import React from 'react';
2
3
  import Icon from '@zohodesk/icon/es/Icon/Icon';
3
4
  export default function IconComponent(props) {
package/es/icons/iconSrc/messageStatus/index.js CHANGED
@@ -1,4 +1,4 @@
1
- export { default as Clock } from "./Clock";
2
- export { default as DoubleTick } from "./DoubleTick";
3
- export { default as Failed } from "./Failed";
4
- export { default as Tick } from "./Tick";
1
+ export { default as Clock } from './Clock';
2
+ export { default as DoubleTick } from './DoubleTick';
3
+ export { default as Failed } from './Failed';
4
+ export { default as Tick } from './Tick';
package/es/im/ArticleBubble/ArticleBubble.js ADDED
@@ -0,0 +1,66 @@
1
+ /** ** Libraries *** */
2
+ import React, { useMemo } from 'react';
3
+ /** ** Hooks *** */
4
+
5
+ import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
6
+ import useArticleBubble from '@zohoim/chat-components-hooks/es/im/ArticleBubble/useArticleBubble';
7
+ /** ** Constants *** */
8
+
9
+ import articleBubbleDefaultProps from './props/defaultProps';
10
+ import articleBubblePropTypes from './props/propTypes';
11
+ /** ** Components *** */
12
+
13
+ import { Container } from '@zohodesk/components/es/Layout';
14
+ /** ** Styles *** */
15
+
16
+ import style from './css/ArticleBubble.module.css';
17
+ /** ** Icons *** */
18
+
19
+ import ArticleIcon from '../../icons/iconSrc/common/Article';
20
+ export default function ArticleBubble(props) {
21
+ const {
22
+ customStyle,
23
+ info,
24
+ articleDetails,
25
+ onClick: propOnClick
26
+ } = props;
27
+ const {
28
+ title,
29
+ summary
30
+ } = articleDetails;
31
+ const {
32
+ onClick,
33
+ webUrl
34
+ } = useArticleBubble({
35
+ articleDetails,
36
+ onClick: propOnClick
37
+ });
38
+ /* External CSS Customization */
39
+
40
+ const newStyle = useMergeStyle(style, customStyle);
41
+ const iconCustomStyle = useMemo(() => ({
42
+ base: newStyle.articleIcon
43
+ }), [newStyle.articleIcon]);
44
+ return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Container, {
45
+ align: "vertical",
46
+ alignBox: "row",
47
+ isCover: false
48
+ }, /*#__PURE__*/React.createElement("div", {
49
+ className: newStyle.icon
50
+ }, /*#__PURE__*/React.createElement(ArticleIcon, {
51
+ customStyle: iconCustomStyle
52
+ })), /*#__PURE__*/React.createElement("div", null, info)), /*#__PURE__*/React.createElement("a", {
53
+ className: newStyle.articleWrapper,
54
+ href: webUrl,
55
+ onClick: onClick,
56
+ rel: "noopener noreferrer",
57
+ target: "_blank"
58
+ }, /*#__PURE__*/React.createElement("div", {
59
+ className: newStyle.title
60
+ }, title), /*#__PURE__*/React.createElement("div", {
61
+ className: newStyle.summary
62
+ }, summary)));
63
+ }
64
+ ArticleBubble.propTypes = articleBubblePropTypes;
65
+ ArticleBubble.defaultProps = articleBubbleDefaultProps;
66
+ ArticleBubble.displayName = 'ArticleBubble';
package/es/im/ArticleBubble/css/ArticleBubble.module.css ADDED
@@ -0,0 +1,47 @@
1
+ .icon {
2
+ display: flex;
3
+ }
4
+
5
+ .articleWrapper {
6
+ padding: var(--zd_size8) var(--zd_size10) ;
7
+ background-color: var(--imlib_chat_components_articleBubble_bg_color);
8
+ border-radius: 3px;
9
+ cursor: pointer;
10
+ border: 1px solid var(--imlib_chat_components_articleBubble_border_color);
11
+ margin: var(--zd_size4) 0 var(--zd_size2) ;
12
+ }
13
+
14
+ .title {
15
+ color: var(--imlib_chat_components_articleBubble_color);
16
+ font-size: var(--zd_font_size15) ;
17
+ line-height: 1.5;
18
+ overflow: hidden;
19
+ white-space: nowrap;
20
+ word-wrap: normal;
21
+ text-overflow: ellipsis;
22
+ }
23
+
24
+ .summary {
25
+ color: var(--imlib_chat_components_articleBubble_color);
26
+ font-size: var(--zd_font_size13) ;
27
+ line-height: 1.5;
28
+ max-height: var(--zd_size40) ;
29
+ -webkit-line-clamp: 2;
30
+ display: -webkit-box;
31
+ -webkit-box-orient: vertical;
32
+ word-break: break-word;
33
+ overflow: hidden;
34
+ }
35
+
36
+ .articleIcon {
37
+ width: var(--zd_size16) ;
38
+ height: var(--zd_size16) ;
39
+ }
40
+
41
+ .articleIcon :global(.path-0) {
42
+ fill: var(--imlib_chat_components_imIntegrationIcon_path0_color);
43
+ }
44
+
45
+ .articleIcon :global(.path-1) {
46
+ fill: var(--imlib_chat_components_imIntegrationIcon_path1_color);
47
+ }
package/es/{ArticleBubble → im/ArticleBubble}/props/defaultProps.js RENAMED
@@ -1,5 +1,5 @@
1
1
  /** ** Constants *** */
2
- import { dummyObject } from '@zohoim/chat-components-utils/es/constants';
2
+ import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
3
3
  const articleBubbleDefaultProps = {
4
4
  customStyle: dummyObject
5
5
  };
package/es/im/ArticleBubble/props/propTypes.js ADDED
@@ -0,0 +1,13 @@
1
+ /** ** Libraries *** */
2
+ import PropTypes from 'prop-types';
3
+ const articleBubblePropTypes = {
4
+ articleDetails: PropTypes.shape({
5
+ summary: PropTypes.string.isRequired,
6
+ title: PropTypes.string.isRequired,
7
+ webUrl: PropTypes.string
8
+ }).isRequired,
9
+ customStyle: PropTypes.object,
10
+ info: PropTypes.string,
11
+ onClick: PropTypes.func
12
+ };
13
+ export default articleBubblePropTypes;
package/es/im/IMAutoMessageInfo/IMAutoMessageInfo.js CHANGED
@@ -1,40 +1,29 @@
1
- /* eslint-disable react/jsx-no-bind */
2
- /* eslint-disable max-len */
3
-
4
1
  /** ** Libraries *** */
5
2
  import React from 'react';
6
-
7
3
  /** ** Hooks *** */
8
- import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
9
- import useIMAutoMessageInfo from '@zohoim/chat-components-hooks/es/im/IMAutoMessageInfo/useIMAutoMessageInfo';
10
4
 
5
+ import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
11
6
  /** ** Constants *** */
7
+
12
8
  import imAutoMessageInfoDefaultProps from './props/defaultProps';
13
9
  import imAutoMessageInfoPropTypes from './props/propTypes';
14
-
15
- /** ** Methods *** */
16
- import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
17
- import cssJSLogic from './css/cssJSLogic';
18
-
19
10
  /** ** Styles *** */
11
+
20
12
  import style from './css/IMAutoMessageInfo.module.css';
21
13
  export default function IMAutoMessageInfo(props) {
22
14
  const {
23
- autoMessageContent,
24
- autoMessageTitle
25
- } = useIMAutoMessageInfo(props);
26
- const {
15
+ autoMessageType,
16
+ autoMessagesI18N,
17
+ autoMessagesTitleI18N,
27
18
  customStyle
28
19
  } = props;
20
+ /* External CSS Customization */
29
21
 
30
- /* External customization */
31
22
  const newStyle = useMergeStyle(style, customStyle);
32
- /* CSS classnames added based on logic */
33
- const {
34
- imAutoMessageInfoClass
35
- } = cssJSLogic(props, newStyle);
23
+ const autoMessageContent = autoMessagesI18N[autoMessageType] || '';
24
+ const autoMessageTitle = autoMessagesTitleI18N[autoMessageType] || '';
36
25
  return autoMessageContent ? /*#__PURE__*/React.createElement("div", {
37
- className: imAutoMessageInfoClass,
26
+ className: newStyle.imAutoMessageInfo,
38
27
  "data-title": autoMessageTitle
39
28
  }, autoMessageContent) : null;
40
29
  }
package/es/im/IMAutoMessageInfo/css/IMAutoMessageInfo.module.css CHANGED
@@ -1,12 +1,11 @@
1
1
  .varClass {
2
- --imAutoMessageInfo-font_size: var(--imlib_size_13);
3
- --imAutoMessageInfo-max_width: var(--imlib_size_100);
2
+ --imAutoMessageInfo-font_size: var(--zd_font_size13);
3
+ --imAutoMessageInfo-max_width: var(--zd_size100);
4
4
  --imAutoMessageInfo-letter_spacing: 0.2px;
5
5
  }
6
6
 
7
7
  .imAutoMessageInfo {
8
8
  composes: varClass;
9
-
10
9
  font-size: var(--imAutoMessageInfo-font_size);
11
10
  letter-spacing: var(--imAutoMessageInfo-letter_spacing);
12
11
  max-width: var(--imAutoMessageInfo-max_width);
package/es/im/IMAutoMessageInfo/props/defaultProps.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /** ** Constants *** */
2
- import { dummyObject } from '@zohoim/chat-components-utils/es/constants';
2
+ import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
3
3
  const imAutoMessageInfoDefaultProps = {
4
4
  customStyle: dummyObject
5
5
  };
package/es/im/IMAutoMessageInfo/props/propTypes.js CHANGED
@@ -1,6 +1,8 @@
1
1
  /** ** Libraries *** */
2
2
  import PropTypes from 'prop-types';
3
- import { autoMessageTypes } from '@zohoim/chat-components-utils/es/constants/messageConstants';
3
+ /** ** Constants *** */
4
+
5
+ import autoMessageTypes from '@zohoim/chat-components-utils/es/imUtils/constants/autoMessageTypes';
4
6
  const {
5
7
  WELCOMEMSG,
6
8
  WORKFLOW_MESSAGE,
@@ -8,19 +10,19 @@ const {
8
10
  UN_SUPPORTED_FILE
9
11
  } = autoMessageTypes;
10
12
  const imAutoMessageInfoPropTypes = {
11
- customStyle: PropTypes.object,
12
- autoMessageType: PropTypes.oneOf([WELCOMEMSG, WORKFLOW_MESSAGE, WORKFLOW_NOTIFICATION, UN_SUPPORTED_FILE]),
13
+ autoMessageType: PropTypes.oneOf(Object.values(autoMessageTypes)).isRequired,
13
14
  autoMessagesI18N: PropTypes.shape({
15
+ [UN_SUPPORTED_FILE]: PropTypes.string,
14
16
  [WELCOMEMSG]: PropTypes.string,
15
17
  [WORKFLOW_MESSAGE]: PropTypes.string,
16
- [WORKFLOW_NOTIFICATION]: PropTypes.string,
17
- [UN_SUPPORTED_FILE]: PropTypes.string
18
- }),
18
+ [WORKFLOW_NOTIFICATION]: PropTypes.string
19
+ }).isRequired,
19
20
  autoMessagesTitleI18N: PropTypes.shape({
21
+ [UN_SUPPORTED_FILE]: PropTypes.string,
20
22
  [WELCOMEMSG]: PropTypes.string,
21
23
  [WORKFLOW_MESSAGE]: PropTypes.string,
22
- [WORKFLOW_NOTIFICATION]: PropTypes.string,
23
- [UN_SUPPORTED_FILE]: PropTypes.string
24
- })
24
+ [WORKFLOW_NOTIFICATION]: PropTypes.string
25
+ }).isRequired,
26
+ customStyle: PropTypes.object
25
27
  };
26
28
  export default imAutoMessageInfoPropTypes;
package/es/im/IMInfoBubble/IMInfoBubble.js CHANGED
@@ -1,30 +1,27 @@
1
- /* eslint-disable react/jsx-no-bind */
2
- /* eslint-disable max-len */
3
-
4
1
  /** ** Libraries *** */
5
2
  import React from 'react';
6
-
7
3
  /** ** Hooks *** */
8
- import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
9
4
 
5
+ import useMergeStyle from '@zohodesk/hooks/es/utils/useMergeStyle';
10
6
  /** ** Constants *** */
7
+
11
8
  import imInfoBubbleDefaultProps from './props/defaultProps';
12
9
  import imInfoBubblePropTypes from './props/propTypes';
13
-
14
10
  /** ** Methods *** */
15
- import renderHandler from '@zohoim/chat-components-utils/es/common/renderHandler';
16
- import cssJSLogic from './css/cssJSLogic';
17
11
 
12
+ import cssJSLogic from './css/cssJSLogic';
18
13
  /** ** Styles *** */
14
+
19
15
  import style from './css/IMInfoBubble.module.css';
20
16
  export default function IMInfoBubble(props) {
21
17
  const {
22
18
  customStyle
23
19
  } = props;
20
+ /* External CSS Customization */
24
21
 
25
- /* External customization */
26
22
  const newStyle = useMergeStyle(style, customStyle);
27
23
  /* CSS classnames added based on logic */
24
+
28
25
  const {
29
26
  imInfoBubbleClass
30
27
  } = cssJSLogic(props, newStyle);
package/es/im/IMInfoBubble/props/defaultProps.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /** ** Constants *** */
2
- import { dummyObject } from '@zohoim/chat-components-utils/es/constants';
2
+ import { dummyObject } from '@zohoim/chat-components-utils/es/constants/emptyConstants';
3
3
  const imInfoBubbleDefaultProps = {
4
4
  customStyle: dummyObject
5
5
  };