@zohoim/chat-components 1.1.1 → 1.1.2-beta.2

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 (493) hide show
  1. package/README.md +5 -1
  2. package/assets/Appearance/dark/mode/General_DarkMode.module.css +93 -0
  3. package/assets/Appearance/dark/themes/blue/blue_General_DarkTheme.module.css +40 -0
  4. package/assets/Appearance/dark/themes/green/green_General_DarkTheme.module.css +40 -0
  5. package/assets/Appearance/dark/themes/orange/orange_General_DarkTheme.module.css +40 -0
  6. package/assets/Appearance/dark/themes/red/red_General_DarkTheme.module.css +40 -0
  7. package/assets/Appearance/dark/themes/yellow/yellow_General_DarkTheme.module.css +40 -0
  8. package/assets/Appearance/light/mode/General_LightMode.module.css +93 -0
  9. package/assets/Appearance/light/themes/blue/blue_General_LightTheme.module.css +40 -0
  10. package/assets/Appearance/light/themes/green/green_General_LightTheme.module.css +40 -0
  11. package/assets/Appearance/light/themes/orange/orange_General_LightTheme.module.css +40 -0
  12. package/assets/Appearance/light/themes/red/red_General_LightTheme.module.css +40 -0
  13. package/assets/Appearance/light/themes/yellow/yellow_General_LightTheme.module.css +40 -0
  14. package/assets/Appearance/pureDark/mode/General_PureDarkMode.module.css +93 -0
  15. package/assets/Appearance/pureDark/themes/blue/blue_General_PureDarkTheme.module.css +40 -0
  16. package/assets/Appearance/pureDark/themes/green/green_General_PureDarkTheme.module.css +40 -0
  17. package/assets/Appearance/pureDark/themes/orange/orange_General_PureDarkTheme.module.css +40 -0
  18. package/assets/Appearance/pureDark/themes/red/red_General_PureDarkTheme.module.css +40 -0
  19. package/assets/Appearance/pureDark/themes/yellow/yellow_General_PureDarkTheme.module.css +40 -0
  20. package/es/ActionIcon/ActionIcon.js +5 -4
  21. package/es/ActionIconWrapper/css/ActionIconWrapper.module.css +2 -2
  22. package/es/AttachmentBubble/AttachmentBubble.js +9 -8
  23. package/es/AttachmentBubble/css/AttachmentBubble.module.css +2 -1
  24. package/es/AttachmentBubbleInfo/css/AttachmentBubbleInfo.module.css +2 -2
  25. package/es/AttachmentHandler/AttachmentHandler.js +5 -4
  26. package/es/AttachmentHandler/css/AttachmentHandler.module.css +2 -2
  27. package/es/AttachmentPreview/AttachmentPreview.js +7 -7
  28. package/es/AttachmentPreviewBody/AttachmentPreviewBody.js +7 -7
  29. package/es/AttachmentPreviewBody/css/AttachmentPreviewBody.module.css +4 -8
  30. package/es/AttachmentPreviewHeader/AttachmentPreviewHeader.js +7 -7
  31. package/es/AttachmentPreviewHeader/css/AttachmentPreviewHeader.module.css +4 -4
  32. package/es/AudioBubble/AudioBubble.js +9 -8
  33. package/es/Emoji/Emoji.js +0 -0
  34. package/es/Emoji/css/Emoji.module.css +4 -4
  35. package/es/Emoji/css/cssJSLogic.js +0 -0
  36. package/es/Emoji/index.js +0 -0
  37. package/es/Emoji/props/defaultProps.js +0 -0
  38. package/es/Emoji/props/propTypes.js +0 -0
  39. package/es/EmojiPopup/EmojiPopup.js +9 -10
  40. package/es/EmojiPopup/css/EmojiPopup.module.css +2 -2
  41. package/es/Emojis/Emojis.js +9 -10
  42. package/es/Emojis/index.js +0 -0
  43. package/es/Emojis/props/defaultProps.js +0 -0
  44. package/es/Emojis/props/propTypes.js +0 -0
  45. package/es/EmojisEmptyState/EmojisEmptyState.js +0 -0
  46. package/es/EmojisEmptyState/css/EmojisEmptyState.module.css +0 -0
  47. package/es/EmojisEmptyState/index.js +0 -0
  48. package/es/EmojisEmptyState/props/defaultProps.js +0 -0
  49. package/es/EmojisEmptyState/props/propTypes.js +0 -0
  50. package/es/EmojisFooter/EmojisFooter.js +5 -4
  51. package/es/EmojisFooter/css/EmojisFooter.module.css +2 -2
  52. package/es/EmojisFooter/index.js +0 -0
  53. package/es/EmojisFooter/props/defaultProps.js +0 -0
  54. package/es/EmojisFooter/props/propTypes.js +0 -0
  55. package/es/EmojisHeader/EmojisHeader.js +5 -4
  56. package/es/EmojisHeader/css/EmojisHeader.module.css +3 -3
  57. package/es/EmojisHeader/index.js +0 -0
  58. package/es/EmojisHeader/props/defaultProps.js +0 -0
  59. package/es/EmojisHeader/props/propTypes.js +0 -0
  60. package/es/EmojisList/EmojisList.js +6 -6
  61. package/es/EmojisList/css/EmojisList.module.css +3 -3
  62. package/es/EmojisList/css/cssJSLogic.js +0 -0
  63. package/es/EmojisList/index.js +0 -0
  64. package/es/EmojisList/props/defaultProps.js +0 -0
  65. package/es/EmojisList/props/propTypes.js +0 -0
  66. package/es/ImageBubble/css/ImageBubble.module.css +1 -1
  67. package/es/MediaBubbleWrapper/MediaBubbleWrapper.js +6 -4
  68. package/es/Message/Message.js +9 -16
  69. package/es/MessageAction/MessageAction.js +10 -11
  70. package/es/MessageActions/MessageActions.js +11 -13
  71. package/es/MessageActionsWrapper/MessageActionsWrapper.js +5 -4
  72. package/es/MessageBox/css/MessageBox.module.css +5 -5
  73. package/es/MessageBubble/css/MessageBubble.module.css +3 -3
  74. package/es/MoreActionItem/css/MoreActionItem.module.css +2 -2
  75. package/es/ReplyBubble/ReplyBubble.js +10 -11
  76. package/es/Theme/ThemeAssets.js +18 -0
  77. package/es/Theme/ThemeWrapper.js +13 -9
  78. package/es/Theme/TooltipWrapper.js +5 -4
  79. package/es/Theme/utils/getThemeConfigurations.js +1 -55
  80. package/es/VideoBubble/VideoBubble.js +9 -8
  81. package/es/icons/iconSrc/attachments/Audio.js +1 -2
  82. package/es/icons/iconSrc/attachments/Code.js +1 -2
  83. package/es/icons/iconSrc/attachments/Image.js +1 -2
  84. package/es/icons/iconSrc/attachments/Pdf.js +1 -2
  85. package/es/icons/iconSrc/attachments/Ppt.js +1 -2
  86. package/es/icons/iconSrc/attachments/Text.js +1 -2
  87. package/es/icons/iconSrc/attachments/Txt.js +1 -2
  88. package/es/icons/iconSrc/attachments/Unknown.js +1 -2
  89. package/es/icons/iconSrc/attachments/Video.js +1 -2
  90. package/es/icons/iconSrc/attachments/Xls.js +1 -2
  91. package/es/icons/iconSrc/attachments/Zip.js +1 -2
  92. package/es/icons/iconSrc/common/AlertTriangle.js +1 -2
  93. package/es/icons/iconSrc/common/Article.js +1 -2
  94. package/es/icons/iconSrc/common/Reply.js +1 -2
  95. package/es/icons/iconSrc/messageStatus/Clock.js +1 -2
  96. package/es/icons/iconSrc/messageStatus/DoubleTick.js +1 -2
  97. package/es/icons/iconSrc/messageStatus/Failed.js +1 -2
  98. package/es/icons/iconSrc/messageStatus/Tick.js +1 -2
  99. package/es/im/IMAttachmentHandler/IMAttachmentHandler.js +5 -4
  100. package/es/im/IMIntegrationIcon/css/IMIntegrationIcon.module.css +6 -6
  101. package/es/im/IMMessage/IMMessage.js +17 -20
  102. package/es/im/IMMessage/css/IMMessage.module.css +3 -3
  103. package/es/im/IMMessageContent/IMMessageContent.js +18 -30
  104. package/es/im/IMMessageMeta/IMMessageMeta.js +5 -4
  105. package/es/im/IMMessageMeta/css/IMMessageMeta.module.css +3 -3
  106. package/es/im/IMMessageMetaInfo/css/IMMessageMetaInfo.module.css +2 -2
  107. package/es/im/IMReplyBubble/IMReplyBubble.js +6 -4
  108. package/es/im/IMTextBubble/IMTextBubble.js +6 -4
  109. package/es/im/ReplyComposer/ReplyComposer.js +12 -14
  110. package/es/im/ReplyEditor/ReplyEditor.js +5 -4
  111. package/es/im/ReplyEditor/css/ReplyEditor.module.css +4 -4
  112. package/es/im/ReplyEditorExtensions/ReplyEditorExtensions.js +11 -12
  113. package/es/im/ReplyEditorSuggestions/ReplyEditorSuggestions.js +8 -9
  114. package/es/im/ReplyEditorSuggestionsPopup/ReplyEditorSuggestionsPopup.js +5 -4
  115. package/es/rte/Editor/css/Editor.module.css +0 -0
  116. package/es/rte/Editor/index.js +0 -0
  117. package/es/rte/Editor/props/defaultProps.js +0 -0
  118. package/es/rte/Editor/props/propTypes.js +0 -0
  119. package/lib/ActionIcon/ActionIcon.js +97 -0
  120. package/lib/ActionIcon/css/ActionIcon.module.css +8 -0
  121. package/lib/ActionIcon/index.js +15 -0
  122. package/lib/ActionIcon/props/defaultProps.js +17 -0
  123. package/lib/ActionIcon/props/propTypes.js +30 -0
  124. package/lib/ActionIconWrapper/ActionIconWrapper.js +81 -0
  125. package/lib/ActionIconWrapper/css/ActionIconWrapper.module.css +32 -0
  126. package/lib/ActionIconWrapper/css/cssJSLogic.js +21 -0
  127. package/lib/ActionIconWrapper/index.js +15 -0
  128. package/lib/ActionIconWrapper/props/defaultProps.js +15 -0
  129. package/lib/ActionIconWrapper/props/propTypes.js +24 -0
  130. package/lib/AttachmentBubble/AttachmentBubble.js +93 -0
  131. package/lib/AttachmentBubble/css/AttachmentBubble.module.css +56 -0
  132. package/lib/AttachmentBubble/css/cssJSLogic.js +22 -0
  133. package/lib/AttachmentBubble/index.js +15 -0
  134. package/lib/AttachmentBubble/props/defaultProps.js +17 -0
  135. package/lib/AttachmentBubble/props/propTypes.js +30 -0
  136. package/lib/AttachmentBubbleInfo/AttachmentBubbleInfo.js +63 -0
  137. package/lib/AttachmentBubbleInfo/css/AttachmentBubbleInfo.module.css +39 -0
  138. package/lib/AttachmentBubbleInfo/css/cssJSLogic.js +20 -0
  139. package/lib/AttachmentBubbleInfo/index.js +15 -0
  140. package/lib/AttachmentBubbleInfo/props/defaultProps.js +15 -0
  141. package/lib/AttachmentBubbleInfo/props/propTypes.js +20 -0
  142. package/lib/AttachmentHandler/AttachmentHandler.js +101 -0
  143. package/lib/AttachmentHandler/css/AttachmentHandler.module.css +27 -0
  144. package/lib/AttachmentHandler/index.js +15 -0
  145. package/lib/AttachmentHandler/props/defaultProps.js +19 -0
  146. package/lib/AttachmentHandler/props/propTypes.js +28 -0
  147. package/lib/AttachmentIcon/AttachmentIcon.js +84 -0
  148. package/lib/AttachmentIcon/css/AttachmentIcon.module.css +8 -0
  149. package/lib/AttachmentIcon/css/cssJSLogic.js +20 -0
  150. package/lib/AttachmentIcon/index.js +15 -0
  151. package/lib/AttachmentIcon/props/defaultProps.js +17 -0
  152. package/lib/AttachmentIcon/props/propTypes.js +31 -0
  153. package/lib/AttachmentIcon/utils/getAttachmentIconComponent.js +78 -0
  154. package/lib/AttachmentPreview/AttachmentPreview.js +144 -0
  155. package/lib/AttachmentPreview/css/AttachmentPreview.module.css +39 -0
  156. package/lib/AttachmentPreview/index.js +15 -0
  157. package/lib/AttachmentPreview/props/defaultProps.js +18 -0
  158. package/lib/AttachmentPreview/props/propTypes.js +44 -0
  159. package/lib/AttachmentPreviewBody/AttachmentPreviewBody.js +120 -0
  160. package/lib/AttachmentPreviewBody/css/AttachmentPreviewBody.module.css +71 -0
  161. package/lib/AttachmentPreviewBody/index.js +15 -0
  162. package/lib/AttachmentPreviewBody/props/defaultProps.js +16 -0
  163. package/lib/AttachmentPreviewBody/props/propTypes.js +31 -0
  164. package/lib/AttachmentPreviewHeader/AttachmentPreviewHeader.js +94 -0
  165. package/lib/AttachmentPreviewHeader/css/AttachmentPreviewHeader.module.css +47 -0
  166. package/lib/AttachmentPreviewHeader/index.js +15 -0
  167. package/lib/AttachmentPreviewHeader/props/defaultProps.js +16 -0
  168. package/lib/AttachmentPreviewHeader/props/propTypes.js +27 -0
  169. package/lib/Audio/Audio.js +55 -0
  170. package/lib/Audio/css/Audio.module.css +7 -0
  171. package/lib/Audio/index.js +15 -0
  172. package/lib/Audio/props/defaultProps.js +15 -0
  173. package/lib/Audio/props/propTypes.js +19 -0
  174. package/lib/AudioBubble/AudioBubble.js +68 -0
  175. package/lib/AudioBubble/css/AudioBubble.module.css +4 -0
  176. package/lib/AudioBubble/index.js +15 -0
  177. package/lib/AudioBubble/props/defaultProps.js +16 -0
  178. package/lib/AudioBubble/props/propTypes.js +27 -0
  179. package/lib/Emoji/Emoji.js +87 -0
  180. package/lib/Emoji/css/Emoji.module.css +48 -0
  181. package/lib/Emoji/css/cssJSLogic.js +22 -0
  182. package/lib/Emoji/index.js +15 -0
  183. package/lib/Emoji/props/defaultProps.js +17 -0
  184. package/lib/Emoji/props/propTypes.js +27 -0
  185. package/lib/EmojiPopup/EmojiPopup.js +135 -0
  186. package/lib/EmojiPopup/css/EmojiPopup.module.css +55 -0
  187. package/lib/EmojiPopup/index.js +15 -0
  188. package/lib/EmojiPopup/props/defaultProps.js +20 -0
  189. package/lib/EmojiPopup/props/propTypes.js +33 -0
  190. package/lib/Emojis/Emojis.js +92 -0
  191. package/lib/Emojis/index.js +15 -0
  192. package/lib/Emojis/props/defaultProps.js +19 -0
  193. package/lib/Emojis/props/propTypes.js +31 -0
  194. package/lib/EmojisEmptyState/EmojisEmptyState.js +74 -0
  195. package/lib/EmojisEmptyState/css/EmojisEmptyState.module.css +18 -0
  196. package/lib/EmojisEmptyState/index.js +15 -0
  197. package/lib/EmojisEmptyState/props/defaultProps.js +18 -0
  198. package/lib/EmojisEmptyState/props/propTypes.js +19 -0
  199. package/lib/EmojisFooter/EmojisFooter.js +87 -0
  200. package/lib/EmojisFooter/css/EmojisFooter.module.css +40 -0
  201. package/lib/EmojisFooter/index.js +15 -0
  202. package/lib/EmojisFooter/props/defaultProps.js +16 -0
  203. package/lib/EmojisFooter/props/propTypes.js +23 -0
  204. package/lib/EmojisHeader/EmojisHeader.js +74 -0
  205. package/lib/EmojisHeader/css/EmojisHeader.module.css +36 -0
  206. package/lib/EmojisHeader/index.js +15 -0
  207. package/lib/EmojisHeader/props/defaultProps.js +17 -0
  208. package/lib/EmojisHeader/props/propTypes.js +24 -0
  209. package/lib/EmojisList/EmojisList.js +143 -0
  210. package/lib/EmojisList/css/EmojisList.module.css +50 -0
  211. package/lib/EmojisList/css/cssJSLogic.js +27 -0
  212. package/lib/EmojisList/index.js +15 -0
  213. package/lib/EmojisList/props/defaultProps.js +19 -0
  214. package/lib/EmojisList/props/propTypes.js +31 -0
  215. package/lib/Fonts/puviFont.module.css +62 -0
  216. package/lib/ImageBubble/ImageBubble.js +98 -0
  217. package/lib/ImageBubble/css/ImageBubble.module.css +63 -0
  218. package/lib/ImageBubble/css/cssJSLogic.js +21 -0
  219. package/lib/ImageBubble/index.js +15 -0
  220. package/lib/ImageBubble/props/defaultProps.js +15 -0
  221. package/lib/ImageBubble/props/propTypes.js +24 -0
  222. package/lib/LazyLoadImage/LazyLoadImage.js +54 -0
  223. package/lib/LazyLoadImage/css/LazyLoadImage.module.css +5 -0
  224. package/lib/LazyLoadImage/index.js +15 -0
  225. package/lib/LazyLoadImage/props/defaultProps.js +15 -0
  226. package/lib/LazyLoadImage/props/propTypes.js +19 -0
  227. package/lib/LocationBubble/LocationBubble.js +77 -0
  228. package/lib/LocationBubble/css/LocationBubble.module.css +57 -0
  229. package/lib/LocationBubble/css/cssJSLogic.js +20 -0
  230. package/lib/LocationBubble/images/location.png +0 -0
  231. package/lib/LocationBubble/index.js +15 -0
  232. package/lib/LocationBubble/props/defaultProps.js +15 -0
  233. package/lib/LocationBubble/props/propTypes.js +19 -0
  234. package/lib/MediaBubbleWrapper/MediaBubbleWrapper.js +76 -0
  235. package/lib/MediaBubbleWrapper/css/MediaBubbleWrapper.module.css +7 -0
  236. package/lib/MediaBubbleWrapper/index.js +15 -0
  237. package/lib/MediaBubbleWrapper/props/defaultProps.js +16 -0
  238. package/lib/MediaBubbleWrapper/props/propTypes.js +28 -0
  239. package/lib/Message/Message.js +157 -0
  240. package/lib/Message/index.js +15 -0
  241. package/lib/Message/props/defaultProps.js +22 -0
  242. package/lib/Message/props/propTypes.js +55 -0
  243. package/lib/MessageAction/MessageAction.js +77 -0
  244. package/lib/MessageAction/index.js +15 -0
  245. package/lib/MessageAction/props/defaultProps.js +17 -0
  246. package/lib/MessageAction/props/propTypes.js +34 -0
  247. package/lib/MessageActions/MessageActions.js +135 -0
  248. package/lib/MessageActions/css/MessageActions.module.css +24 -0
  249. package/lib/MessageActions/index.js +15 -0
  250. package/lib/MessageActions/props/defaultProps.js +20 -0
  251. package/lib/MessageActions/props/propTypes.js +38 -0
  252. package/lib/MessageActionsMore/MessageActionsMore.js +128 -0
  253. package/lib/MessageActionsMore/css/MessageActionsMore.module.css +24 -0
  254. package/lib/MessageActionsMore/index.js +15 -0
  255. package/lib/MessageActionsMore/props/defaultProps.js +18 -0
  256. package/lib/MessageActionsMore/props/propTypes.js +29 -0
  257. package/lib/MessageActionsWrapper/MessageActionsWrapper.js +91 -0
  258. package/lib/MessageActionsWrapper/css/MessageActionsWrapper.module.css +7 -0
  259. package/lib/MessageActionsWrapper/index.js +15 -0
  260. package/lib/MessageActionsWrapper/props/defaultProps.js +19 -0
  261. package/lib/MessageActionsWrapper/props/propTypes.js +27 -0
  262. package/lib/MessageAvatar/MessageAvatar.js +64 -0
  263. package/lib/MessageAvatar/css/MessageAvatar.module.css +23 -0
  264. package/lib/MessageAvatar/index.js +15 -0
  265. package/lib/MessageAvatar/props/defaultProps.js +16 -0
  266. package/lib/MessageAvatar/props/propTypes.js +24 -0
  267. package/lib/MessageBox/MessageBox.js +82 -0
  268. package/lib/MessageBox/css/MessageBox.module.css +56 -0
  269. package/lib/MessageBox/css/cssJSLogic.js +22 -0
  270. package/lib/MessageBox/index.js +15 -0
  271. package/lib/MessageBox/props/defaultProps.js +15 -0
  272. package/lib/MessageBox/props/propTypes.js +24 -0
  273. package/lib/MessageBubble/MessageBubble.js +153 -0
  274. package/lib/MessageBubble/css/MessageBubble.module.css +101 -0
  275. package/lib/MessageBubble/css/cssJSLogic.js +38 -0
  276. package/lib/MessageBubble/index.js +15 -0
  277. package/lib/MessageBubble/props/defaultProps.js +22 -0
  278. package/lib/MessageBubble/props/propTypes.js +30 -0
  279. package/lib/MessageStatus/MessageStatus.js +88 -0
  280. package/lib/MessageStatus/css/MessageStatus.module.css +17 -0
  281. package/lib/MessageStatus/css/cssJSLogic.js +33 -0
  282. package/lib/MessageStatus/index.js +15 -0
  283. package/lib/MessageStatus/props/defaultProps.js +15 -0
  284. package/lib/MessageStatus/props/propTypes.js +24 -0
  285. package/lib/MoreActionItem/MoreActionItem.js +94 -0
  286. package/lib/MoreActionItem/css/MoreActionItem.module.css +27 -0
  287. package/lib/MoreActionItem/index.js +15 -0
  288. package/lib/MoreActionItem/props/defaultProps.js +16 -0
  289. package/lib/MoreActionItem/props/propTypes.js +25 -0
  290. package/lib/ReplyBubble/ReplyBubble.js +136 -0
  291. package/lib/ReplyBubble/css/ReplyBubble.module.css +23 -0
  292. package/lib/ReplyBubble/css/cssJSLogic.js +20 -0
  293. package/lib/ReplyBubble/index.js +15 -0
  294. package/lib/ReplyBubble/props/defaultProps.js +17 -0
  295. package/lib/ReplyBubble/props/propTypes.js +39 -0
  296. package/lib/ReplyBubbleContent/ReplyBubbleContent.js +77 -0
  297. package/lib/ReplyBubbleContent/css/ReplyBubbleContent.module.css +75 -0
  298. package/lib/ReplyBubbleContent/css/cssJSLogic.js +20 -0
  299. package/lib/ReplyBubbleContent/index.js +15 -0
  300. package/lib/ReplyBubbleContent/props/defaultProps.js +15 -0
  301. package/lib/ReplyBubbleContent/props/propTypes.js +22 -0
  302. package/lib/ReplyBubbleHeader/ReplyBubbleHeader.js +97 -0
  303. package/lib/ReplyBubbleHeader/css/ReplyBubbleHeader.module.css +44 -0
  304. package/lib/ReplyBubbleHeader/css/cssJSLogic.js +18 -0
  305. package/lib/ReplyBubbleHeader/index.js +15 -0
  306. package/lib/ReplyBubbleHeader/props/defaultProps.js +16 -0
  307. package/lib/ReplyBubbleHeader/props/propTypes.js +24 -0
  308. package/lib/TextBubble/TextBubble.js +69 -0
  309. package/lib/TextBubble/css/TextBubble.module.css +35 -0
  310. package/lib/TextBubble/css/cssJSLogic.js +22 -0
  311. package/lib/TextBubble/index.js +15 -0
  312. package/lib/TextBubble/props/defaultProps.js +15 -0
  313. package/lib/TextBubble/props/propTypes.js +21 -0
  314. package/lib/Theme/ThemeAssets.js +182 -0
  315. package/lib/Theme/ThemeWrapper.js +130 -0
  316. package/lib/Theme/TooltipWrapper.js +97 -0
  317. package/lib/Theme/css/TooltipWrapper.module.css +10 -0
  318. package/lib/Theme/index.js +15 -0
  319. package/lib/Theme/props/defaultProps.js +20 -0
  320. package/lib/Theme/props/propTypes.js +26 -0
  321. package/lib/Theme/utils/combineConfigurations.js +31 -0
  322. package/lib/Theme/utils/flatVariables.js +21 -0
  323. package/lib/Theme/utils/getCustomizedCssVariables.js +29 -0
  324. package/lib/Theme/utils/getThemeConfigurations.js +28 -0
  325. package/lib/Theme/utils/getWrapperDivProps.js +23 -0
  326. package/lib/Video/Video.js +55 -0
  327. package/lib/Video/css/Video.module.css +5 -0
  328. package/lib/Video/index.js +15 -0
  329. package/lib/Video/props/defaultProps.js +15 -0
  330. package/lib/Video/props/propTypes.js +19 -0
  331. package/lib/VideoBubble/VideoBubble.js +77 -0
  332. package/lib/VideoBubble/css/VideoBubble.module.css +12 -0
  333. package/lib/VideoBubble/css/cssJSLogic.js +20 -0
  334. package/lib/VideoBubble/index.js +15 -0
  335. package/lib/VideoBubble/props/defaultProps.js +16 -0
  336. package/lib/VideoBubble/props/propTypes.js +28 -0
  337. package/lib/constants/index.js +18 -0
  338. package/lib/constants/propConstants/editorPropConstants.js +12 -0
  339. package/lib/constants/propConstants/popupPropConstants.js +10 -0
  340. package/lib/css/common.module.css +6 -0
  341. package/lib/icons/create-icon-components.js +199 -0
  342. package/lib/icons/factory/attachments/audio.svg +19 -0
  343. package/lib/icons/factory/attachments/code.svg +21 -0
  344. package/lib/icons/factory/attachments/image.svg +20 -0
  345. package/lib/icons/factory/attachments/pdf.svg +19 -0
  346. package/lib/icons/factory/attachments/ppt.svg +1 -0
  347. package/lib/icons/factory/attachments/text.svg +22 -0
  348. package/lib/icons/factory/attachments/unknown.svg +21 -0
  349. package/lib/icons/factory/attachments/video.svg +19 -0
  350. package/lib/icons/factory/attachments/xls.svg +1 -0
  351. package/lib/icons/factory/attachments/zip.svg +27 -0
  352. package/lib/icons/factory/common/alertTriangle.svg +5 -0
  353. package/lib/icons/factory/common/article.svg +4 -0
  354. package/lib/icons/factory/common/reply.svg +6 -0
  355. package/lib/icons/factory/messageStatus/clock.svg +7 -0
  356. package/lib/icons/factory/messageStatus/doubleTick.svg +1 -0
  357. package/lib/icons/factory/messageStatus/failed.svg +7 -0
  358. package/lib/icons/factory/messageStatus/tick.svg +1 -0
  359. package/lib/icons/icon.template.js +18 -0
  360. package/lib/icons/iconSrc/attachments/Audio.js +41 -0
  361. package/lib/icons/iconSrc/attachments/Code.js +47 -0
  362. package/lib/icons/iconSrc/attachments/Image.js +46 -0
  363. package/lib/icons/iconSrc/attachments/Pdf.js +41 -0
  364. package/lib/icons/iconSrc/attachments/Ppt.js +38 -0
  365. package/lib/icons/iconSrc/attachments/Text.js +50 -0
  366. package/lib/icons/iconSrc/attachments/Txt.js +50 -0
  367. package/lib/icons/iconSrc/attachments/Unknown.js +44 -0
  368. package/lib/icons/iconSrc/attachments/Video.js +41 -0
  369. package/lib/icons/iconSrc/attachments/Xls.js +38 -0
  370. package/lib/icons/iconSrc/attachments/Zip.js +89 -0
  371. package/lib/icons/iconSrc/attachments/index.js +87 -0
  372. package/lib/icons/iconSrc/common/AlertTriangle.js +35 -0
  373. package/lib/icons/iconSrc/common/Article.js +29 -0
  374. package/lib/icons/iconSrc/common/Reply.js +25 -0
  375. package/lib/icons/iconSrc/common/index.js +31 -0
  376. package/lib/icons/iconSrc/messageStatus/Clock.js +26 -0
  377. package/lib/icons/iconSrc/messageStatus/DoubleTick.js +28 -0
  378. package/lib/icons/iconSrc/messageStatus/Failed.js +26 -0
  379. package/lib/icons/iconSrc/messageStatus/Tick.js +25 -0
  380. package/lib/icons/iconSrc/messageStatus/index.js +39 -0
  381. package/lib/im/ArticleBubble/ArticleBubble.js +104 -0
  382. package/lib/im/ArticleBubble/css/ArticleBubble.module.css +75 -0
  383. package/lib/im/ArticleBubble/css/cssJSLogic.js +18 -0
  384. package/lib/im/ArticleBubble/index.js +15 -0
  385. package/lib/im/ArticleBubble/props/defaultProps.js +15 -0
  386. package/lib/im/ArticleBubble/props/propTypes.js +25 -0
  387. package/lib/im/IMAttachmentHandler/IMAttachmentHandler.js +59 -0
  388. package/lib/im/IMAttachmentHandler/index.js +15 -0
  389. package/lib/im/IMAttachmentHandler/props/defaultProps.js +19 -0
  390. package/lib/im/IMAttachmentHandler/props/propTypes.js +38 -0
  391. package/lib/im/IMIntegrationIcon/IMIntegrationIcon.js +82 -0
  392. package/lib/im/IMIntegrationIcon/css/IMIntegrationIcon.module.css +72 -0
  393. package/lib/im/IMIntegrationIcon/css/cssJSLogic.js +48 -0
  394. package/lib/im/IMIntegrationIcon/index.js +15 -0
  395. package/lib/im/IMIntegrationIcon/props/defaultProps.js +21 -0
  396. package/lib/im/IMIntegrationIcon/props/propTypes.js +27 -0
  397. package/lib/im/IMMessage/IMMessage.js +223 -0
  398. package/lib/im/IMMessage/css/IMMessage.module.css +36 -0
  399. package/lib/im/IMMessage/css/cssJSLogic.js +21 -0
  400. package/lib/im/IMMessage/index.js +15 -0
  401. package/lib/im/IMMessage/props/defaultProps.js +25 -0
  402. package/lib/im/IMMessage/props/propTypes.js +118 -0
  403. package/lib/im/IMMessageContent/IMMessageContent.js +149 -0
  404. package/lib/im/IMMessageContent/css/IMMessageContent.module.css +8 -0
  405. package/lib/im/IMMessageContent/index.js +15 -0
  406. package/lib/im/IMMessageContent/props/defaultProps.js +18 -0
  407. package/lib/im/IMMessageContent/props/propTypes.js +65 -0
  408. package/lib/im/IMMessageMeta/IMMessageMeta.js +79 -0
  409. package/lib/im/IMMessageMeta/css/IMMessageMeta.module.css +46 -0
  410. package/lib/im/IMMessageMeta/css/cssJSLogic.js +35 -0
  411. package/lib/im/IMMessageMeta/index.js +15 -0
  412. package/lib/im/IMMessageMeta/props/defaultProps.js +21 -0
  413. package/lib/im/IMMessageMeta/props/propTypes.js +44 -0
  414. package/lib/im/IMMessageMetaInfo/IMMessageMetaInfo.js +42 -0
  415. package/lib/im/IMMessageMetaInfo/css/IMMessageMetaInfo.module.css +14 -0
  416. package/lib/im/IMMessageMetaInfo/index.js +15 -0
  417. package/lib/im/IMMessageMetaInfo/props/defaultProps.js +17 -0
  418. package/lib/im/IMMessageMetaInfo/props/propTypes.js +19 -0
  419. package/lib/im/IMPermaLink/IMPermaLink.js +64 -0
  420. package/lib/im/IMPermaLink/css/IMPermaLink.module.css +14 -0
  421. package/lib/im/IMPermaLink/css/cssJSLogic.js +20 -0
  422. package/lib/im/IMPermaLink/index.js +15 -0
  423. package/lib/im/IMPermaLink/props/defaultProps.js +15 -0
  424. package/lib/im/IMPermaLink/props/propTypes.js +22 -0
  425. package/lib/im/IMReplyBubble/IMReplyBubble.js +59 -0
  426. package/lib/im/IMReplyBubble/index.js +15 -0
  427. package/lib/im/IMReplyBubble/props/defaultProps.js +16 -0
  428. package/lib/im/IMReplyBubble/props/propTypes.js +40 -0
  429. package/lib/im/IMTextBubble/IMTextBubble.js +47 -0
  430. package/lib/im/IMTextBubble/index.js +15 -0
  431. package/lib/im/IMTextBubble/props/defaultProps.js +18 -0
  432. package/lib/im/IMTextBubble/props/propTypes.js +42 -0
  433. package/lib/im/ReplyComposer/ReplyComposer.js +176 -0
  434. package/lib/im/ReplyComposer/css/ReplyComposer.module.css +10 -0
  435. package/lib/im/ReplyComposer/css/cssJSLogic.js +18 -0
  436. package/lib/im/ReplyComposer/index.js +15 -0
  437. package/lib/im/ReplyComposer/props/defaultProps.js +16 -0
  438. package/lib/im/ReplyComposer/props/propTypes.js +72 -0
  439. package/lib/im/ReplyComposerFooter/ReplyComposerFooter.js +64 -0
  440. package/lib/im/ReplyComposerFooter/css/ReplyComposerFooter.module.css +10 -0
  441. package/lib/im/ReplyComposerFooter/index.js +15 -0
  442. package/lib/im/ReplyComposerFooter/props/defaultProps.js +17 -0
  443. package/lib/im/ReplyComposerFooter/props/propTypes.js +28 -0
  444. package/lib/im/ReplyEditor/ReplyEditor.js +124 -0
  445. package/lib/im/ReplyEditor/css/ReplyEditor.module.css +50 -0
  446. package/lib/im/ReplyEditor/css/cssJSLogic.js +17 -0
  447. package/lib/im/ReplyEditor/index.js +15 -0
  448. package/lib/im/ReplyEditor/props/defaultProps.js +17 -0
  449. package/lib/im/ReplyEditor/props/propTypes.js +39 -0
  450. package/lib/im/ReplyEditorExtensions/ReplyEditorExtensions.js +160 -0
  451. package/lib/im/ReplyEditorExtensions/css/ReplyEditorExtensions.module.css +5 -0
  452. package/lib/im/ReplyEditorExtensions/index.js +15 -0
  453. package/lib/im/ReplyEditorExtensions/props/defaultProps.js +15 -0
  454. package/lib/im/ReplyEditorExtensions/props/propTypes.js +27 -0
  455. package/lib/im/ReplyEditorSuggestions/ReplyEditorSuggestions.js +119 -0
  456. package/lib/im/ReplyEditorSuggestions/css/ReplyEditorSuggestions.module.css +8 -0
  457. package/lib/im/ReplyEditorSuggestions/index.js +15 -0
  458. package/lib/im/ReplyEditorSuggestions/props/defaultProps.js +15 -0
  459. package/lib/im/ReplyEditorSuggestions/props/propTypes.js +32 -0
  460. package/lib/im/ReplyEditorSuggestionsPopup/ReplyEditorSuggestionsPopup.js +107 -0
  461. package/lib/im/ReplyEditorSuggestionsPopup/css/ReplyEditorSuggestionsPopup.module.css +7 -0
  462. package/lib/im/ReplyEditorSuggestionsPopup/index.js +15 -0
  463. package/lib/im/ReplyEditorSuggestionsPopup/props/defaultProps.js +19 -0
  464. package/lib/im/ReplyEditorSuggestionsPopup/props/propTypes.js +33 -0
  465. package/lib/im/css/common.module.css +6 -0
  466. package/lib/im/index.js +213 -0
  467. package/lib/index.js +538 -0
  468. package/lib/rte/Editor/Editor.js +97 -0
  469. package/lib/rte/Editor/css/Editor.module.css +17 -0
  470. package/lib/rte/Editor/index.js +15 -0
  471. package/lib/rte/Editor/props/defaultProps.js +30 -0
  472. package/lib/rte/Editor/props/propTypes.js +74 -0
  473. package/lib/rte/index.js +18 -0
  474. package/package.json +47 -22
  475. package/es/Theme/themeVariables/commonThemeColorVariable.js +0 -17
  476. package/es/Theme/themeVariables/dark/blueTheme.js +0 -133
  477. package/es/Theme/themeVariables/dark/commonColorVariable.js +0 -35
  478. package/es/Theme/themeVariables/dark/greenTheme.js +0 -132
  479. package/es/Theme/themeVariables/dark/orangeTheme.js +0 -132
  480. package/es/Theme/themeVariables/dark/redTheme.js +0 -132
  481. package/es/Theme/themeVariables/dark/yellowTheme.js +0 -132
  482. package/es/Theme/themeVariables/light/blueTheme.js +0 -135
  483. package/es/Theme/themeVariables/light/commonColorVariable.js +0 -54
  484. package/es/Theme/themeVariables/light/greenTheme.js +0 -131
  485. package/es/Theme/themeVariables/light/orangeTheme.js +0 -131
  486. package/es/Theme/themeVariables/light/redTheme.js +0 -131
  487. package/es/Theme/themeVariables/light/yellowTheme.js +0 -131
  488. package/es/Theme/themeVariables/pureDark/blueTheme.js +0 -132
  489. package/es/Theme/themeVariables/pureDark/commonColorVariable.js +0 -37
  490. package/es/Theme/themeVariables/pureDark/greenTheme.js +0 -132
  491. package/es/Theme/themeVariables/pureDark/orangeTheme.js +0 -132
  492. package/es/Theme/themeVariables/pureDark/redTheme.js +0 -132
  493. package/es/Theme/themeVariables/pureDark/yellowTheme.js +0 -132
package/README.md CHANGED
@@ -10,9 +10,13 @@ In this Library, We Provide Some Basic Message Components to Build Your Chat App
10
10
 
11
11
  > import MessageBubble from '@zohoim/chat-components/es/MessageBubble/MessageBubble’;
12
12
 
13
+ # 1.1.2
14
+
15
+ - Color contrast support added for components
16
+
13
17
  # 1.1.1
14
18
 
15
- - **@zohoim/chat-components-utils** package updated
19
+ - **@zohoim/chat-components-utils** version updated
16
20
 
17
21
  # 1.1.0
18
22
 
package/assets/Appearance/dark/mode/General_DarkMode.module.css ADDED
@@ -0,0 +1,93 @@
1
+ [data-zohoim-mode='dark'] {
2
+ /* default colors */
3
+ --imlib_chat_components_common_border: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
4
+ --imlib_chat_components_primary_text: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
5
+
6
+ /* integration colors */
7
+ --imlib_chat_components_imIntegrationIcon_whatsapp_color: hsla(143, 70.85%, calc(48.43% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
8
+ --imlib_chat_components_imIntegrationIcon_telegram_color: hsla(201, 63.72%, calc(57.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_imIntegrationIcon_wechat_color: hsla(106, 100.00%, calc(37.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_imIntegrationIcon_line_color: hsla(120, 98.92%, calc(36.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_imIntegrationIcon_twillio_color: hsla(353, 88.24%, calc(56.67% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
12
+ --imlib_chat_components_imIntegrationIcon_instagram_color: linear-gradient(221.05deg,#933ab9 11.59%,#d12f8c 50.45%,#fdbb59 85.46%);
13
+ --imlib_chat_components_imIntegrationIcon_asap_color: linear-gradient(180deg, #A375FF 0%, #7732FF 100%);
14
+ --imlib_chat_components_imIntegrationIcon_fb_color: hsla(215, 100.00%, calc(50.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
15
+
16
+ /* two tone icon colors */
17
+ --imlib_chat_components_imTtIcon_path0_color: rgba(255, 255, 255, 0.25);
18
+ --imlib_chat_components_imTtIcon_path1_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
19
+ --imlib_chat_components_imIntegrationIcon_path0_color: rgba(255, 255, 255, 0.25);
20
+ --imlib_chat_components_imIntegrationIcon_path1_color: rgb(255,255,255);
21
+ --imlib_chat_components_twotone_icon_border: var(--dot_platinum);
22
+
23
+ /* text / icon colors */
24
+ --imlib_chat_components_actionIconWrapper_color: rgb(226,228,230);
25
+ --imlib_chat_components_messageBox_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
26
+ --imlib_chat_components_replyBubbleContent_line_color: hsla(217, 58.73%, calc(87.65% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
27
+ --imlib_chat_components_replyBubbleContent_sender_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
28
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
29
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color: hsla(218, 9.76%, calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
30
+ --imlib_chat_components_replyBubbleContent_content_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
31
+ --imlib_chat_components_replyBubbleHeader_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_replyBubbleHeader_time_color: hsla(217, 7.76%, calc(54.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_articleBubble_title_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ --imlib_chat_components_articleBubble_summary_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
36
+ --imlib_chat_components_imMessageContent_text_color: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_imMessageMeta_time_color: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_imAutoMessageInfo_text_color: hsla(217, 7.76%, calc(54.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_messageBubble_messageBox_footer_text_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ --imlib_chat_components_messageStatus_send_color: hsla(228, 11.42%, calc(42.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
41
+ --imlib_chat_components_imageBubble_alt_text_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
42
+
43
+ /* text / icon failed colors */
44
+ --imlib_chat_components_messageBox_failed_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
45
+ --imlib_chat_components_replyBubbleHeader_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
46
+ --imlib_chat_components_textBubble_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_lighter_low)), calc(1 + var(--zdc_alpha_low)));
47
+ --imlib_chat_components_imageBubble_alt_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
48
+ --imlib_chat_components_articleBubble_summary_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
49
+ --imlib_chat_components_replyBubbleContent_line_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
50
+ --imlib_chat_components_replyBubbleContent_sender_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
51
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
52
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color_failed: hsla(218, 9.76%, calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
53
+ --imlib_chat_components_replyBubbleContent_content_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
54
+ --imlib_chat_components_replyBubbleHeader_time_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
55
+ --imlib_chat_components_articleBubble_title_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
56
+
57
+ /* bg colors */
58
+ --imlib_chat_components_messageBox_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
59
+
60
+ /* bg failed colors */
61
+ --imlib_chat_components_messageBox_failed_bg_color: hsla(2, 75.51%, calc(90.39% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
62
+ --imlib_chat_components_imageBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
63
+ --imlib_chat_components_attachmentBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
64
+ --imlib_chat_components_articleBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
65
+ --imlib_chat_components_locationBubble_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
66
+ --imlib_chat_components_replyBubbleContent_bg_color_failed: hsla(353, 59.09%, calc(91.37% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
67
+
68
+ /* border failed colors */
69
+ --imlib_chat_components_attachmentBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
70
+ --imlib_chat_components_imageBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
71
+ --imlib_chat_components_locationBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
72
+ --imlib_chat_components_replyBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
73
+ --imlib_chat_components_videoBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
74
+ --imlib_chat_components_articleBubble_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
75
+ --imlib_chat_components_replyBubbleContent_border_color_failed: hsla(353, 65.81%, calc(77.06% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
76
+
77
+ /* replyEditor */
78
+ --imlib_chat_components_reply_editor_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
79
+ --imlib_chat_components_reply_editor_bg: hsla(219, 21.74%, calc(18.04% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
80
+ --imlib_chat_components_reply_editor_placeholder_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
81
+
82
+ /* attachment Preview */
83
+ --imlib_chat_components_attachmentPreview_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
84
+ --imlib_chat_components_attachmentPreview_name_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
85
+ --imlib_chat_components_attachmentPreview_size_color: hsla(217, 13.73%, calc(70.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
86
+ --imlib_chat_components_attachmentPreview_body_bg_color: hsla(217, 23.23%, calc(19.41% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
87
+
88
+ /* emoji popup */
89
+ --imlib_chat_components_emojiPopup_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
90
+ --imlib_chat_components_emojiPopup_border_color: hsla(220, 16.67%, calc(28.24% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
91
+ --imlib_chat_components_emojiPopup_title_color: hsla(210, 7.41%, calc(89.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
92
+ --imlib_chat_components_emoji_popup_search_bg: hsla(212, 24.53%, calc(20.78% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
93
+ }
package/assets/Appearance/dark/themes/blue/blue_General_DarkTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='blue'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(213, 27.27%, calc(23.73% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(213, 27.27%, calc(23.73% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(213, 25.88%, calc(33.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgb(95,100,120);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(212, 100.00%, calc(63.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/dark/themes/green/green_General_DarkTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='green'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(191, 21.65%, calc(19.02% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(191, 21.65%, calc(19.02% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(189, 21.21%, calc(12.94% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(158, 26.83%, calc(24.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgb(95,100,120);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(133, 40.00%, calc(45.10% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/dark/themes/orange/orange_General_DarkTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='orange'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(252, 4.85%, calc(20.20% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(252, 4.85%, calc(20.20% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(19, 21.54%, calc(25.49% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgb(95,100,120);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(26, 100.00%, calc(56.08% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/dark/themes/red/red_General_DarkTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='red'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(258, 12.62%, calc(20.20% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(258, 12.62%, calc(20.20% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(256, 13.25%, calc(16.27% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(334, 20.00%, calc(24.51% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(256, 12.61%, calc(23.33% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgb(95,100,120);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(0, 77.78%, calc(61.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/dark/themes/yellow/yellow_General_DarkTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='dark'][data-zohoim-theme='yellow'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(218, 7.69%, calc(20.39% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(218, 7.69%, calc(20.39% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(193, 30.77%, calc(15.29% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(217, 23.08%, calc(17.84% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(37, 12.70%, calc(24.71% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(218, 23.08%, calc(22.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgb(95,100,120);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(37, 66.94%, calc(52.55% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/light/mode/General_LightMode.module.css ADDED
@@ -0,0 +1,93 @@
1
+ [data-zohoim-mode='light'] {
2
+ /* default colors */
3
+ --imlib_chat_components_common_border: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
4
+ --imlib_chat_components_primary_text: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
5
+
6
+ /* integration colors */
7
+ --imlib_chat_components_imIntegrationIcon_whatsapp_color: hsla(143, 70.85%, calc(48.43% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
8
+ --imlib_chat_components_imIntegrationIcon_telegram_color: hsla(201, 63.72%, calc(57.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_imIntegrationIcon_wechat_color: hsla(106, 100.00%, calc(37.84% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_imIntegrationIcon_line_color: hsla(120, 98.92%, calc(36.47% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_imIntegrationIcon_twillio_color: hsla(353, 88.24%, calc(56.67% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
12
+ --imlib_chat_components_imIntegrationIcon_instagram_color: linear-gradient(221.05deg,#933ab9 11.59%,#d12f8c 50.45%,#fdbb59 85.46%);
13
+ --imlib_chat_components_imIntegrationIcon_asap_color: linear-gradient(180deg, #A375FF 0%, #7732FF 100%);
14
+ --imlib_chat_components_imIntegrationIcon_fb_color: hsla(215, 100.00%, calc(50.00% + var(--zdc_darker_lower)), calc(1 + var(--zdc_alpha_low)));
15
+
16
+ /* two tone icon colors */
17
+ --imlib_chat_components_imTtIcon_path0_color: rgba(200,203,220,0.7);
18
+ --imlib_chat_components_imTtIcon_path1_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse_medium)), calc(1 + var(--zdc_alpha_low)));
19
+ --imlib_chat_components_imIntegrationIcon_path0_color: rgba(255, 255, 255, 0.25);
20
+ --imlib_chat_components_imIntegrationIcon_path1_color: rgb(255,255,255);
21
+ --imlib_chat_components_twotone_icon_border: var(--dot_black);
22
+
23
+ /* text / icon colors */
24
+ --imlib_chat_components_actionIconWrapper_color: rgb(0,0,0);
25
+ --imlib_chat_components_messageBox_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
26
+ --imlib_chat_components_replyBubbleContent_line_color: hsla(217, 58.73%, calc(87.65% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
27
+ --imlib_chat_components_replyBubbleContent_sender_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
28
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
29
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
30
+ --imlib_chat_components_replyBubbleContent_content_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
31
+ --imlib_chat_components_replyBubbleHeader_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
32
+ --imlib_chat_components_replyBubbleHeader_time_color: hsla(228, 11.42%, calc(42.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
33
+ --imlib_chat_components_textBubble_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
34
+ --imlib_chat_components_articleBubble_title_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
35
+ --imlib_chat_components_articleBubble_summary_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
36
+ --imlib_chat_components_imMessageContent_text_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_imMessageMeta_time_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_imAutoMessageInfo_text_color: hsla(240, 1.29%, calc(45.69% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_messageBubble_messageBox_footer_text_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ --imlib_chat_components_messageStatus_send_color: hsla(228, 11.42%, calc(42.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
41
+ --imlib_chat_components_imageBubble_alt_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
42
+
43
+ /* text / icon failed colors */
44
+ --imlib_chat_components_messageBox_failed_text_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
45
+ --imlib_chat_components_replyBubbleHeader_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
46
+ --imlib_chat_components_textBubble_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_lighter_low)), calc(1 + var(--zdc_alpha_low)));
47
+ --imlib_chat_components_imageBubble_alt_text_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
48
+ --imlib_chat_components_articleBubble_summary_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
49
+ --imlib_chat_components_replyBubbleContent_line_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
50
+ --imlib_chat_components_replyBubbleContent_sender_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
51
+ --imlib_chat_components_attachmentBubbleInfo_fileName_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
52
+ --imlib_chat_components_attachmentBubbleInfo_fileSize_color_failed: hsla(218, 9.76%, calc(51.76% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
53
+ --imlib_chat_components_replyBubbleContent_content_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
54
+ --imlib_chat_components_replyBubbleHeader_time_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
55
+ --imlib_chat_components_articleBubble_title_color_failed: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
56
+
57
+ /* bg colors */
58
+ --imlib_chat_components_messageBox_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
59
+
60
+ /* bg failed colors */
61
+ --imlib_chat_components_messageBox_failed_bg_color: hsla(0, 73.91%, calc(95.49% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
62
+ --imlib_chat_components_imageBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
63
+ --imlib_chat_components_attachmentBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
64
+ --imlib_chat_components_articleBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
65
+ --imlib_chat_components_locationBubble_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
66
+ --imlib_chat_components_replyBubbleContent_bg_color_failed: hsla(0, 100.00%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
67
+
68
+ /* border failed colors */
69
+ --imlib_chat_components_attachmentBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
70
+ --imlib_chat_components_imageBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
71
+ --imlib_chat_components_locationBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
72
+ --imlib_chat_components_replyBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
73
+ --imlib_chat_components_videoBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
74
+ --imlib_chat_components_articleBubble_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
75
+ --imlib_chat_components_replyBubbleContent_border_color_failed: hsla(0, 100.00%, calc(91.96% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
76
+
77
+ /* replyEditor */
78
+ --imlib_chat_components_reply_editor_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
79
+ --imlib_chat_components_reply_editor_bg: hsla(0, 0.00%, calc(100.00% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
80
+ --imlib_chat_components_reply_editor_placeholder_color: hsla(231, 22.22%, calc(82.35% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
81
+
82
+ /* attachment Preview */
83
+ --imlib_chat_components_attachmentPreview_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
84
+ --imlib_chat_components_attachmentPreview_name_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
85
+ --imlib_chat_components_attachmentPreview_size_color: hsla(220, 10.45%, calc(39.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
86
+ --imlib_chat_components_attachmentPreview_body_bg_color: hsla(210, 11.11%, calc(96.47% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
87
+
88
+ /* emoji popup */
89
+ --imlib_chat_components_emojiPopup_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default)), calc(1 + var(--zdc_alpha_high)));
90
+ --imlib_chat_components_emojiPopup_border_color: hsla(231, 42.22%, calc(91.18% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
91
+ --imlib_chat_components_emojiPopup_title_color: hsla(0, 0.00%, calc(0.00% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
92
+ --imlib_chat_components_emoji_popup_search_bg: hsla(0, 0.00%, calc(98.04% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
93
+ }
package/assets/Appearance/light/themes/blue/blue_General_LightTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='blue'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(212, 86.67%, calc(97.06% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(213, 65.52%, calc(82.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgba(200, 203, 220, 0.7);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(212, 91.84%, calc(48.04% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/light/themes/green/green_General_LightTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='green'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(143, 44.44%, calc(96.47% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(143, 44.44%, calc(96.47% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(135, 13.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(132, 42.86%, calc(82.16% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgba(197, 205, 199, 0.7);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(133, 63.29%, calc(40.59% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/light/themes/orange/orange_General_LightTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='orange'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(26, 77.78%, calc(96.47% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(26, 77.78%, calc(96.47% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(24, 27.78%, calc(92.94% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(28, 79.49%, calc(84.71% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgba(204, 201, 199, 0.7);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(28, 81.75%, calc(49.41% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }
package/assets/Appearance/light/themes/red/red_General_LightTheme.module.css ADDED
@@ -0,0 +1,40 @@
1
+ [data-zohoim-mode='light'][data-zohoim-theme='red'] {
2
+ /* bg colors */
3
+ --imlib_chat_components_actionIconWrapper_bg_color: hsla(0, 71.43%, calc(97.25% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
4
+ --imlib_chat_components_attachmentBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
5
+ --imlib_chat_components_articleBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
6
+ --imlib_chat_components_imageBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
7
+ --imlib_chat_components_locationBubble_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
8
+ --imlib_chat_components_messageBox_incoming_bg_color: hsla(217, 40.00%, calc(96.08% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
9
+ --imlib_chat_components_messageBox_outgoing_bg_color: hsla(0, 71.43%, calc(97.25% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
10
+ --imlib_chat_components_messageBubble_active_bg_color: hsla(64, 100.00%, calc(94.51% + var(--zdc_default_inverse_lower)), calc(1 + var(--zdc_alpha_low)));
11
+ --imlib_chat_components_replyBubbleContent_bg_color: hsla(0, 0.00%, calc(100.00% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
12
+
13
+ /* border colors */
14
+ --imlib_chat_components_common_border: hsla(0, 12.20%, calc(91.96% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
15
+ --imlib_chat_components_actionIconWrapper_border_color: hsla(0, 70.21%, calc(90.78% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
16
+ --imlib_chat_components_attachmentBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
17
+ --imlib_chat_components_articleBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
18
+ --imlib_chat_components_imageBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
19
+ --imlib_chat_components_locationBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
20
+ --imlib_chat_components_replyBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
21
+ --imlib_chat_components_replyBubbleContent_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
22
+ --imlib_chat_components_videoBubble_border_color: hsla(210, 33.33%, calc(94.12% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
23
+
24
+ /* icon colors */
25
+ --imlib_chat_components_twotone_icon_bg: rgba(204, 199, 201, 0.7);
26
+
27
+ /* url / themes / primary colors */
28
+ --imlib_chat_components_locationBubble_url_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
29
+ --imlib_chat_components_imPermaLink_url_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
30
+ --imlib_chat_components_textBubble_see_more_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
31
+ --imlib_chat_components_textBubble_url_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
32
+ --imlib_chat_components_messageStatus_read_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
33
+ --imlib_chat_components_emoji_tab_line_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse_low)), calc(1 + var(--zdc_alpha_low)));
34
+
35
+ /* failed colors */
36
+ --imlib_chat_components_messageStatus_failed_color: hsla(0, 71.91%, calc(53.92% + var(--zdc_lighter)), calc(1 + var(--zdc_alpha_high)));
37
+ --imlib_chat_components_locationBubble_url_color_failed: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
38
+ --imlib_chat_components_textBubble_see_more_color_failed: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
39
+ --imlib_chat_components_textBubble_url_color_failed: hsla(0, 71.91%, calc(53.92% + var(--zdc_default_inverse)), calc(1 + var(--zdc_alpha_high)));
40
+ }