@webinex/chatify 1.0.3-rc3 → 2.0.0-build10

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 (408) hide show
  1. package/dist/css/chatify.css +137 -105
  2. package/dist/esm/index.js +10 -1
  3. package/dist/esm/index.js.map +1 -1
  4. package/dist/esm/types/core/api/accountApi.d.ts +5 -0
  5. package/dist/esm/types/core/api/api.d.ts +2380 -0
  6. package/dist/esm/types/core/api/baseApi.d.ts +15 -0
  7. package/dist/esm/types/core/api/chatApi.d.ts +16 -0
  8. package/dist/esm/types/core/api/chatListApi.d.ts +5 -0
  9. package/dist/esm/types/core/api/chatMemberApi.d.ts +6 -0
  10. package/dist/esm/types/core/api/chatMessageApi.d.ts +3 -0
  11. package/dist/esm/types/core/api/index.d.ts +1 -0
  12. package/dist/esm/types/core/api/threadApi.d.ts +1 -0
  13. package/dist/esm/types/core/api/threadMessageApi.d.ts +6 -0
  14. package/dist/esm/types/core/client.d.ts +56 -9
  15. package/dist/esm/types/core/constants.d.ts +1 -0
  16. package/dist/esm/types/core/debounce.d.ts +27 -0
  17. package/dist/esm/types/core/index.d.ts +3 -16
  18. package/dist/esm/types/core/types.d.ts +105 -0
  19. package/dist/esm/types/index.d.ts +0 -1
  20. package/dist/esm/types/ui/Chat/ChatContext.d.ts +10 -0
  21. package/dist/esm/types/ui/Chat/ChatEditableHeaderName.d.ts +2 -0
  22. package/dist/esm/types/ui/Chat/ChatHeaderActions.d.ts +2 -0
  23. package/dist/esm/types/ui/Chat/ChatPanel.d.ts +13 -0
  24. package/dist/esm/types/ui/Chat/ChatView.d.ts +17 -0
  25. package/dist/esm/types/ui/Chat/Members/ChatMembersButton.d.ts +2 -0
  26. package/dist/esm/types/ui/Chat/Members/ChatMembersPanel.d.ts +2 -0
  27. package/dist/esm/types/ui/Chat/Members/ChatMembersPreview.d.ts +2 -0
  28. package/dist/esm/types/ui/Chat/Members/index.d.ts +11 -0
  29. package/dist/esm/types/ui/Chat/index.d.ts +6 -0
  30. package/dist/esm/types/ui/ChatGroup/ChatGroupContext.d.ts +12 -0
  31. package/dist/esm/types/ui/ChatGroup/ChatGroupPanel.d.ts +15 -0
  32. package/dist/esm/types/ui/ChatGroup/Create/CreateChatButton.d.ts +2 -0
  33. package/dist/esm/types/ui/{CreateChatPanel → ChatGroup/Create}/CreateChatForm.d.ts +1 -1
  34. package/dist/esm/types/ui/ChatGroup/Create/CreateChatMemberInput.d.ts +5 -0
  35. package/dist/esm/types/ui/ChatGroup/Create/CreateChatNameInput.d.ts +5 -0
  36. package/dist/esm/types/ui/ChatGroup/Create/CreateChatPanel.d.ts +2 -0
  37. package/dist/esm/types/ui/ChatGroup/Create/index.d.ts +17 -0
  38. package/dist/esm/types/ui/ChatGroup/Layout/ChatGroupAside.d.ts +2 -0
  39. package/dist/esm/types/ui/ChatGroup/Layout/ChatGroupBody.d.ts +2 -0
  40. package/dist/esm/types/ui/ChatGroup/Layout/ChatGroupFooter.d.ts +2 -0
  41. package/dist/esm/types/ui/ChatGroup/Layout/ChatGroupHeader.d.ts +2 -0
  42. package/dist/esm/types/ui/ChatGroup/Layout/ChatGroupMain.d.ts +2 -0
  43. package/dist/esm/types/ui/ChatGroup/Layout/index.d.ts +17 -0
  44. package/dist/esm/types/ui/ChatGroup/List/ChatList.d.ts +2 -0
  45. package/dist/esm/types/ui/ChatGroup/List/ChatListItemAvatar.d.ts +3 -0
  46. package/dist/esm/types/ui/ChatGroup/List/ChatListItemBox.d.ts +6 -0
  47. package/dist/esm/types/ui/ChatGroup/List/ChatListItemLastMessage.d.ts +3 -0
  48. package/dist/esm/types/ui/ChatGroup/List/ChatListItemLastMessageAuthor.d.ts +3 -0
  49. package/dist/esm/types/ui/{ChatList → ChatGroup/List}/ChatListItemLastMessageContent.d.ts +1 -1
  50. package/dist/esm/types/ui/ChatGroup/List/ChatListItemLastMessageSentAt.d.ts +3 -0
  51. package/dist/esm/types/ui/ChatGroup/List/ChatListItemName.d.ts +3 -0
  52. package/dist/esm/types/ui/ChatGroup/List/ChatListItemUnreadCount.d.ts +3 -0
  53. package/dist/esm/types/ui/ChatGroup/List/index.d.ts +29 -0
  54. package/dist/esm/types/ui/ChatGroup/index.d.ts +5 -0
  55. package/dist/esm/types/ui/Chatify.d.ts +8 -72
  56. package/dist/esm/types/ui/Conversation/Conversation.d.ts +21 -0
  57. package/dist/esm/types/ui/Conversation/ConversationActions.d.ts +2 -0
  58. package/dist/esm/types/ui/Conversation/ConversationBody.d.ts +2 -0
  59. package/dist/esm/types/ui/Conversation/ConversationContext.d.ts +20 -0
  60. package/dist/esm/types/ui/Conversation/ConversationHeader.d.ts +2 -0
  61. package/dist/esm/types/ui/Conversation/ConversationName.d.ts +2 -0
  62. package/dist/esm/types/ui/Conversation/InputBox/InputBox.d.ts +2 -0
  63. package/dist/esm/types/ui/Conversation/InputBox/InputFilesBox.d.ts +2 -0
  64. package/dist/esm/types/ui/Conversation/InputBox/InputSubmitButtonBox.d.ts +5 -0
  65. package/dist/esm/types/ui/Conversation/InputBox/InputTextBox.d.ts +8 -0
  66. package/dist/esm/types/ui/Conversation/InputBox/index.d.ts +14 -0
  67. package/dist/esm/types/ui/Conversation/Message/MessageAuthor.d.ts +3 -0
  68. package/dist/esm/types/ui/Conversation/Message/MessageBox.d.ts +6 -0
  69. package/dist/esm/types/ui/Conversation/Message/MessageContent.d.ts +3 -0
  70. package/dist/esm/types/ui/Conversation/Message/MessageInfoBox.d.ts +3 -0
  71. package/dist/esm/types/ui/{Message → Conversation/Message}/MessageRow.d.ts +1 -1
  72. package/dist/esm/types/ui/Conversation/Message/MessageText.d.ts +3 -0
  73. package/dist/esm/types/ui/Conversation/Message/index.d.ts +20 -0
  74. package/dist/esm/types/ui/Conversation/NextObserver/NextMessagesObserver.d.ts +5 -0
  75. package/dist/esm/types/ui/Conversation/NextObserver/index.d.ts +1 -0
  76. package/dist/esm/types/ui/Conversation/ReadObserver/MessageReadObserver.d.ts +6 -0
  77. package/dist/esm/types/ui/Conversation/ReadObserver/index.d.ts +1 -0
  78. package/dist/esm/types/ui/Conversation/SendingMessage/SendingMessageBox.d.ts +7 -0
  79. package/dist/esm/types/ui/Conversation/SendingMessage/SendingMessageContent.d.ts +3 -0
  80. package/dist/esm/types/ui/Conversation/SendingMessage/SendingMessageInfoBox.d.ts +3 -0
  81. package/dist/esm/types/ui/{SendingMessage/SendingMessageInfoBox.d.ts → Conversation/SendingMessage/SendingMessageText.d.ts} +1 -1
  82. package/dist/esm/types/ui/Conversation/SendingMessage/index.d.ts +14 -0
  83. package/dist/esm/types/ui/Conversation/SystemMessage/SystemMessageBox.d.ts +6 -0
  84. package/dist/esm/types/ui/Conversation/SystemMessage/SystemMessageRow.d.ts +9 -0
  85. package/dist/esm/types/ui/Conversation/SystemMessage/index.d.ts +8 -0
  86. package/dist/esm/types/ui/Conversation/index.d.ts +12 -0
  87. package/dist/esm/types/ui/{InputBox/InputFilesBox.d.ts → Thread/ThreadActions.d.ts} +1 -1
  88. package/dist/esm/types/ui/Thread/ThreadContext.d.ts +8 -0
  89. package/dist/esm/types/ui/Thread/ThreadPanel.d.ts +14 -0
  90. package/dist/esm/types/ui/Thread/index.d.ts +3 -0
  91. package/dist/esm/types/ui/color.d.ts +6 -0
  92. package/dist/esm/types/ui/common/Avatar.d.ts +6 -0
  93. package/dist/esm/types/ui/common/Icon.d.ts +20 -0
  94. package/dist/esm/types/ui/common/MessageSkeleton.d.ts +5 -0
  95. package/dist/esm/types/ui/common/index.d.ts +11 -0
  96. package/dist/esm/types/ui/customize.d.ts +5 -7
  97. package/dist/esm/types/ui/index.d.ts +9 -9
  98. package/dist/esm/types/ui/localizer.d.ts +2 -6
  99. package/dist/index.d.ts +2800 -433
  100. package/package.json +16 -15
  101. package/src/core/api/accountApi.ts +11 -0
  102. package/src/core/api/api.ts +642 -0
  103. package/src/core/api/baseApi.ts +38 -0
  104. package/src/core/api/chatApi.ts +87 -0
  105. package/src/core/api/chatListApi.ts +134 -0
  106. package/src/core/api/chatMemberApi.ts +20 -0
  107. package/src/core/api/chatMessageApi.ts +12 -0
  108. package/src/core/api/index.ts +1 -0
  109. package/src/core/api/threadApi.ts +8 -0
  110. package/src/core/api/threadMessageApi.ts +20 -0
  111. package/src/core/client.ts +157 -31
  112. package/src/core/constants.ts +1 -0
  113. package/src/core/debounce.ts +90 -0
  114. package/src/core/index.ts +3 -16
  115. package/src/core/types.tsx +152 -0
  116. package/src/index.ts +0 -1
  117. package/src/styles/aside.scss +31 -2
  118. package/src/styles/chat.scss +34 -37
  119. package/src/styles/index.scss +7 -5
  120. package/src/styles/input.scss +3 -1
  121. package/src/styles/members.scss +13 -0
  122. package/src/types/core/api/accountApi.d.ts +5 -0
  123. package/src/types/core/api/api.d.ts +2380 -0
  124. package/src/types/core/api/baseApi.d.ts +15 -0
  125. package/src/types/core/api/chatApi.d.ts +16 -0
  126. package/src/types/core/api/chatListApi.d.ts +5 -0
  127. package/src/types/core/api/chatMemberApi.d.ts +6 -0
  128. package/src/types/core/api/chatMessageApi.d.ts +3 -0
  129. package/src/types/core/api/index.d.ts +1 -0
  130. package/src/types/core/api/threadApi.d.ts +1 -0
  131. package/src/types/core/api/threadMessageApi.d.ts +6 -0
  132. package/src/types/core/client.d.ts +83 -0
  133. package/src/types/core/constants.d.ts +1 -0
  134. package/src/types/core/debounce.d.ts +27 -0
  135. package/src/types/core/index.d.ts +4 -0
  136. package/src/types/core/types.d.ts +105 -0
  137. package/src/types/index.d.ts +2 -0
  138. package/src/types/ui/Chat/ChatContext.d.ts +10 -0
  139. package/src/types/ui/Chat/ChatEditableHeaderName.d.ts +2 -0
  140. package/src/types/ui/Chat/ChatHeaderActions.d.ts +2 -0
  141. package/src/types/ui/Chat/ChatPanel.d.ts +13 -0
  142. package/src/types/ui/Chat/ChatView.d.ts +17 -0
  143. package/src/types/ui/Chat/Members/ChatMembersButton.d.ts +2 -0
  144. package/src/types/ui/Chat/Members/ChatMembersPanel.d.ts +2 -0
  145. package/src/types/ui/Chat/Members/ChatMembersPreview.d.ts +2 -0
  146. package/src/types/ui/Chat/Members/index.d.ts +11 -0
  147. package/src/types/ui/Chat/index.d.ts +6 -0
  148. package/src/types/ui/ChatGroup/ChatGroupContext.d.ts +12 -0
  149. package/src/types/ui/ChatGroup/ChatGroupPanel.d.ts +15 -0
  150. package/src/types/ui/ChatGroup/Create/CreateChatButton.d.ts +2 -0
  151. package/src/types/ui/ChatGroup/Create/CreateChatForm.d.ts +11 -0
  152. package/src/types/ui/ChatGroup/Create/CreateChatMemberInput.d.ts +5 -0
  153. package/src/types/ui/ChatGroup/Create/CreateChatNameInput.d.ts +5 -0
  154. package/src/types/ui/ChatGroup/Create/CreateChatPanel.d.ts +2 -0
  155. package/src/types/ui/ChatGroup/Create/index.d.ts +17 -0
  156. package/src/types/ui/ChatGroup/Layout/ChatGroupAside.d.ts +2 -0
  157. package/src/types/ui/ChatGroup/Layout/ChatGroupBody.d.ts +2 -0
  158. package/src/types/ui/ChatGroup/Layout/ChatGroupFooter.d.ts +2 -0
  159. package/src/types/ui/ChatGroup/Layout/ChatGroupHeader.d.ts +2 -0
  160. package/src/types/ui/ChatGroup/Layout/ChatGroupMain.d.ts +2 -0
  161. package/src/types/ui/ChatGroup/Layout/index.d.ts +17 -0
  162. package/src/types/ui/ChatGroup/List/ChatList.d.ts +2 -0
  163. package/src/types/ui/ChatGroup/List/ChatListItemAvatar.d.ts +3 -0
  164. package/src/types/ui/ChatGroup/List/ChatListItemBox.d.ts +6 -0
  165. package/src/types/ui/ChatGroup/List/ChatListItemLastMessage.d.ts +3 -0
  166. package/src/types/ui/ChatGroup/List/ChatListItemLastMessageAuthor.d.ts +3 -0
  167. package/src/types/ui/ChatGroup/List/ChatListItemLastMessageContent.d.ts +3 -0
  168. package/src/types/ui/ChatGroup/List/ChatListItemLastMessageSentAt.d.ts +3 -0
  169. package/src/types/ui/ChatGroup/List/ChatListItemName.d.ts +3 -0
  170. package/src/types/ui/ChatGroup/List/ChatListItemUnreadCount.d.ts +3 -0
  171. package/src/types/ui/ChatGroup/List/index.d.ts +29 -0
  172. package/src/types/ui/ChatGroup/index.d.ts +5 -0
  173. package/src/types/ui/Chatify.d.ts +8 -0
  174. package/src/types/ui/Conversation/Conversation.d.ts +21 -0
  175. package/src/types/ui/Conversation/ConversationActions.d.ts +2 -0
  176. package/src/types/ui/Conversation/ConversationBody.d.ts +2 -0
  177. package/src/types/ui/Conversation/ConversationContext.d.ts +20 -0
  178. package/src/types/ui/Conversation/ConversationHeader.d.ts +2 -0
  179. package/src/types/ui/Conversation/ConversationName.d.ts +2 -0
  180. package/src/types/ui/Conversation/InputBox/InputBox.d.ts +2 -0
  181. package/src/types/ui/Conversation/InputBox/InputFilesBox.d.ts +2 -0
  182. package/src/types/ui/Conversation/InputBox/InputSubmitButtonBox.d.ts +5 -0
  183. package/src/types/ui/Conversation/InputBox/InputTextBox.d.ts +8 -0
  184. package/src/types/ui/Conversation/InputBox/index.d.ts +14 -0
  185. package/src/types/ui/Conversation/Message/MessageAuthor.d.ts +3 -0
  186. package/src/types/ui/Conversation/Message/MessageBox.d.ts +6 -0
  187. package/src/types/ui/Conversation/Message/MessageContent.d.ts +3 -0
  188. package/src/types/ui/Conversation/Message/MessageInfoBox.d.ts +3 -0
  189. package/src/types/ui/Conversation/Message/MessageRow.d.ts +6 -0
  190. package/src/types/ui/Conversation/Message/MessageText.d.ts +3 -0
  191. package/src/types/ui/Conversation/Message/index.d.ts +20 -0
  192. package/src/types/ui/Conversation/NextObserver/NextMessagesObserver.d.ts +5 -0
  193. package/src/types/ui/Conversation/NextObserver/index.d.ts +1 -0
  194. package/src/types/ui/Conversation/ReadObserver/MessageReadObserver.d.ts +6 -0
  195. package/src/types/ui/Conversation/ReadObserver/index.d.ts +1 -0
  196. package/src/types/ui/Conversation/SendingMessage/SendingMessageBox.d.ts +7 -0
  197. package/src/types/ui/Conversation/SendingMessage/SendingMessageContent.d.ts +3 -0
  198. package/src/types/ui/Conversation/SendingMessage/SendingMessageInfoBox.d.ts +3 -0
  199. package/{dist/esm/types/ui/SendingMessage/SendingMessageContent.d.ts → src/types/ui/Conversation/SendingMessage/SendingMessageText.d.ts} +1 -1
  200. package/src/types/ui/Conversation/SendingMessage/index.d.ts +14 -0
  201. package/src/types/ui/Conversation/SystemMessage/SystemMessageBox.d.ts +6 -0
  202. package/src/types/ui/Conversation/SystemMessage/SystemMessageRow.d.ts +9 -0
  203. package/src/types/ui/Conversation/SystemMessage/index.d.ts +8 -0
  204. package/src/types/ui/Conversation/index.d.ts +12 -0
  205. package/src/types/ui/Thread/ThreadActions.d.ts +2 -0
  206. package/src/types/ui/Thread/ThreadContext.d.ts +8 -0
  207. package/src/types/ui/Thread/ThreadPanel.d.ts +14 -0
  208. package/src/types/ui/Thread/index.d.ts +3 -0
  209. package/src/types/ui/color.d.ts +6 -0
  210. package/src/types/ui/common/Avatar.d.ts +6 -0
  211. package/src/types/ui/common/Icon.d.ts +20 -0
  212. package/src/types/ui/common/MessageSkeleton.d.ts +5 -0
  213. package/src/types/ui/common/index.d.ts +11 -0
  214. package/src/types/ui/customize.d.ts +9 -0
  215. package/src/types/ui/index.d.ts +11 -0
  216. package/src/types/ui/localizer.d.ts +35 -0
  217. package/src/ui/Chat/ChatContext.tsx +30 -0
  218. package/src/ui/{ChatPanel/ChatHeaderName.tsx → Chat/ChatEditableHeaderName.tsx} +10 -16
  219. package/src/ui/Chat/ChatHeaderActions.tsx +19 -0
  220. package/src/ui/Chat/ChatPanel.tsx +30 -0
  221. package/src/ui/Chat/ChatView.tsx +115 -0
  222. package/src/ui/Chat/Members/ChatMembersButton.tsx +9 -0
  223. package/src/ui/{ChatPanel → Chat/Members}/ChatMembersPanel.tsx +13 -22
  224. package/src/ui/Chat/Members/ChatMembersPreview.tsx +25 -0
  225. package/src/ui/Chat/Members/index.ts +13 -0
  226. package/src/ui/Chat/index.ts +6 -0
  227. package/src/ui/ChatGroup/ChatGroupContext.tsx +50 -0
  228. package/src/ui/ChatGroup/ChatGroupPanel.tsx +73 -0
  229. package/src/ui/ChatGroup/Create/CreateChatButton.tsx +15 -0
  230. package/src/ui/{CreateChatPanel → ChatGroup/Create}/CreateChatForm.tsx +2 -2
  231. package/src/ui/{CreateChatPanel → ChatGroup/Create}/CreateChatMemberInput.tsx +6 -7
  232. package/src/ui/{CreateChatPanel → ChatGroup/Create}/CreateChatNameInput.tsx +2 -2
  233. package/src/ui/{CreateChatPanel → ChatGroup/Create}/CreateChatPanel.tsx +14 -18
  234. package/src/ui/ChatGroup/Create/index.ts +19 -0
  235. package/src/ui/ChatGroup/Layout/ChatGroupAside.tsx +12 -0
  236. package/src/ui/ChatGroup/Layout/ChatGroupBody.tsx +10 -0
  237. package/src/ui/ChatGroup/Layout/ChatGroupFooter.tsx +3 -0
  238. package/src/ui/ChatGroup/Layout/ChatGroupHeader.tsx +5 -0
  239. package/src/ui/ChatGroup/Layout/ChatGroupMain.tsx +17 -0
  240. package/src/ui/ChatGroup/Layout/index.ts +19 -0
  241. package/src/ui/{ChatList → ChatGroup/List}/ChatList.tsx +9 -9
  242. package/src/ui/ChatGroup/List/ChatListItemAvatar.tsx +22 -0
  243. package/src/ui/{ChatList → ChatGroup/List}/ChatListItemBox.tsx +9 -5
  244. package/src/ui/{ChatList → ChatGroup/List}/ChatListItemLastMessage.tsx +1 -1
  245. package/src/ui/{ChatList → ChatGroup/List}/ChatListItemLastMessageAuthor.tsx +2 -7
  246. package/src/ui/{ChatList → ChatGroup/List}/ChatListItemLastMessageContent.tsx +3 -3
  247. package/src/ui/{ChatList → ChatGroup/List}/ChatListItemLastMessageSentAt.tsx +2 -2
  248. package/src/ui/ChatGroup/List/ChatListItemName.tsx +8 -0
  249. package/src/ui/{ChatList → ChatGroup/List}/ChatListItemUnreadCount.tsx +1 -1
  250. package/src/ui/ChatGroup/List/index.ts +31 -0
  251. package/src/ui/ChatGroup/index.ts +5 -0
  252. package/src/ui/Chatify.tsx +8 -153
  253. package/src/ui/Conversation/Conversation.tsx +76 -0
  254. package/src/ui/Conversation/ConversationActions.tsx +5 -0
  255. package/src/ui/Conversation/ConversationBody.tsx +28 -0
  256. package/src/ui/Conversation/ConversationContext.ts +27 -0
  257. package/src/ui/Conversation/ConversationHeader.tsx +23 -0
  258. package/src/ui/Conversation/ConversationName.tsx +7 -0
  259. package/src/ui/Conversation/InputBox/InputBox.tsx +40 -0
  260. package/src/ui/{InputBox → Conversation/InputBox}/InputFilesBox.tsx +2 -2
  261. package/src/ui/{InputBox → Conversation/InputBox}/InputSubmitButtonBox.tsx +2 -2
  262. package/src/ui/{InputBox → Conversation/InputBox}/InputTextBox.tsx +6 -4
  263. package/src/ui/Conversation/InputBox/index.ts +16 -0
  264. package/src/ui/{Message → Conversation/Message}/MessageAuthor.tsx +2 -2
  265. package/src/ui/{Message → Conversation/Message}/MessageBox.tsx +4 -4
  266. package/src/ui/{Message → Conversation/Message}/MessageContent.tsx +1 -1
  267. package/src/ui/{Message → Conversation/Message}/MessageInfoBox.tsx +9 -7
  268. package/src/ui/{Message → Conversation/Message}/MessageRow.tsx +3 -3
  269. package/src/ui/{Message → Conversation/Message}/MessageText.tsx +1 -1
  270. package/src/ui/Conversation/Message/index.ts +22 -0
  271. package/src/ui/{Next.tsx → Conversation/NextObserver/NextMessagesObserver.tsx} +11 -12
  272. package/src/ui/Conversation/NextObserver/index.ts +1 -0
  273. package/src/ui/{MessageReadObserver.tsx → Conversation/ReadObserver/MessageReadObserver.tsx} +17 -13
  274. package/src/ui/Conversation/ReadObserver/index.ts +1 -0
  275. package/src/ui/{SendingMessage → Conversation/SendingMessage}/SendingMessageBox.tsx +2 -2
  276. package/src/ui/{SendingMessage → Conversation/SendingMessage}/SendingMessageContent.tsx +1 -1
  277. package/src/ui/{SendingMessage → Conversation/SendingMessage}/SendingMessageInfoBox.tsx +2 -2
  278. package/src/ui/{SendingMessage → Conversation/SendingMessage}/SendingMessageText.tsx +1 -1
  279. package/src/ui/Conversation/SendingMessage/index.ts +16 -0
  280. package/src/ui/{SystemMessage → Conversation/SystemMessage}/SystemMessageBox.tsx +4 -4
  281. package/src/ui/Conversation/SystemMessage/SystemMessageRow.tsx +28 -0
  282. package/src/ui/Conversation/SystemMessage/index.ts +10 -0
  283. package/src/ui/Conversation/index.ts +13 -0
  284. package/src/ui/Thread/ThreadActions.tsx +22 -0
  285. package/src/ui/Thread/ThreadContext.ts +13 -0
  286. package/src/ui/Thread/ThreadPanel.tsx +127 -0
  287. package/src/ui/Thread/index.tsx +3 -0
  288. package/src/ui/color.ts +20 -0
  289. package/src/ui/common/Avatar.tsx +20 -0
  290. package/src/ui/{Icon.tsx → common/Icon.tsx} +6 -1
  291. package/src/ui/{MessageSkeleton.tsx → common/MessageSkeleton.tsx} +3 -2
  292. package/src/ui/common/index.ts +13 -0
  293. package/src/ui/customize.tsx +18 -10
  294. package/src/ui/index.ts +9 -9
  295. package/src/ui/localizer.tsx +7 -10
  296. package/dist/esm/types/ChatifyContext.d.ts +0 -11
  297. package/dist/esm/types/core/action.d.ts +0 -151
  298. package/dist/esm/types/core/models.d.ts +0 -70
  299. package/dist/esm/types/core/reducer.d.ts +0 -11
  300. package/dist/esm/types/core/state.d.ts +0 -55
  301. package/dist/esm/types/core/useAddChatMutation.d.ts +0 -2
  302. package/dist/esm/types/core/useAddMemberMutation.d.ts +0 -2
  303. package/dist/esm/types/core/useFetchNextMutation.d.ts +0 -3
  304. package/dist/esm/types/core/useGetAccountsQuery.d.ts +0 -3
  305. package/dist/esm/types/core/useGetChatListQuery.d.ts +0 -3
  306. package/dist/esm/types/core/useGetChatQuery.d.ts +0 -5
  307. package/dist/esm/types/core/useGetMessagesQuery.d.ts +0 -4
  308. package/dist/esm/types/core/useReadMonitor.d.ts +0 -1
  309. package/dist/esm/types/core/useRemoveMemberMutation.d.ts +0 -2
  310. package/dist/esm/types/core/useSendMutation.d.ts +0 -2
  311. package/dist/esm/types/core/useSignalRMonitor.d.ts +0 -2
  312. package/dist/esm/types/core/useUpdateChatNameMutation.d.ts +0 -2
  313. package/dist/esm/types/ui/AddChatButton.d.ts +0 -2
  314. package/dist/esm/types/ui/Avatar.d.ts +0 -6
  315. package/dist/esm/types/ui/ChatList/ChatList.d.ts +0 -2
  316. package/dist/esm/types/ui/ChatList/ChatListItemBox.d.ts +0 -6
  317. package/dist/esm/types/ui/ChatList/ChatListItemLastMessage.d.ts +0 -3
  318. package/dist/esm/types/ui/ChatList/ChatListItemLastMessageAuthor.d.ts +0 -3
  319. package/dist/esm/types/ui/ChatList/ChatListItemLastMessageSentAt.d.ts +0 -3
  320. package/dist/esm/types/ui/ChatList/ChatListItemName.d.ts +0 -3
  321. package/dist/esm/types/ui/ChatList/ChatListItemUnreadCount.d.ts +0 -3
  322. package/dist/esm/types/ui/ChatList/index.d.ts +0 -8
  323. package/dist/esm/types/ui/ChatName.d.ts +0 -5
  324. package/dist/esm/types/ui/ChatPanel/ChatBody.d.ts +0 -5
  325. package/dist/esm/types/ui/ChatPanel/ChatHeader.d.ts +0 -5
  326. package/dist/esm/types/ui/ChatPanel/ChatHeaderMembers.d.ts +0 -5
  327. package/dist/esm/types/ui/ChatPanel/ChatHeaderName.d.ts +0 -5
  328. package/dist/esm/types/ui/ChatPanel/ChatMembersButton.d.ts +0 -5
  329. package/dist/esm/types/ui/ChatPanel/ChatMembersPanel.d.ts +0 -5
  330. package/dist/esm/types/ui/ChatPanel/ChatPanel.d.ts +0 -5
  331. package/dist/esm/types/ui/ChatPanel/index.d.ts +0 -6
  332. package/dist/esm/types/ui/CreateChatPanel/CreateChatMemberInput.d.ts +0 -5
  333. package/dist/esm/types/ui/CreateChatPanel/CreateChatNameInput.d.ts +0 -5
  334. package/dist/esm/types/ui/CreateChatPanel/CreateChatPanel.d.ts +0 -2
  335. package/dist/esm/types/ui/CreateChatPanel/index.d.ts +0 -4
  336. package/dist/esm/types/ui/Icon.d.ts +0 -17
  337. package/dist/esm/types/ui/InputBox/InputBox.d.ts +0 -2
  338. package/dist/esm/types/ui/InputBox/InputSubmitButtonBox.d.ts +0 -5
  339. package/dist/esm/types/ui/InputBox/InputTextBox.d.ts +0 -7
  340. package/dist/esm/types/ui/InputBox/index.d.ts +0 -4
  341. package/dist/esm/types/ui/Layout/Aside.d.ts +0 -2
  342. package/dist/esm/types/ui/Layout/Body.d.ts +0 -2
  343. package/dist/esm/types/ui/Layout/Footer.d.ts +0 -2
  344. package/dist/esm/types/ui/Layout/Header.d.ts +0 -2
  345. package/dist/esm/types/ui/Layout/Main.d.ts +0 -2
  346. package/dist/esm/types/ui/Layout/index.d.ts +0 -5
  347. package/dist/esm/types/ui/Message/MessageAuthor.d.ts +0 -3
  348. package/dist/esm/types/ui/Message/MessageBox.d.ts +0 -6
  349. package/dist/esm/types/ui/Message/MessageContent.d.ts +0 -3
  350. package/dist/esm/types/ui/Message/MessageInfoBox.d.ts +0 -3
  351. package/dist/esm/types/ui/Message/MessageText.d.ts +0 -3
  352. package/dist/esm/types/ui/Message/index.d.ts +0 -6
  353. package/dist/esm/types/ui/MessageReadObserver.d.ts +0 -6
  354. package/dist/esm/types/ui/MessageSkeleton.d.ts +0 -4
  355. package/dist/esm/types/ui/Next.d.ts +0 -4
  356. package/dist/esm/types/ui/SendingMessage/SendingMessageBox.d.ts +0 -7
  357. package/dist/esm/types/ui/SendingMessage/SendingMessageText.d.ts +0 -3
  358. package/dist/esm/types/ui/SendingMessage/index.d.ts +0 -4
  359. package/dist/esm/types/ui/SystemMessage/SystemMessageBox.d.ts +0 -6
  360. package/dist/esm/types/ui/SystemMessage/SystemMessageRow.d.ts +0 -9
  361. package/dist/esm/types/ui/SystemMessage/index.d.ts +0 -2
  362. package/dist/esm/types/util/index.d.ts +0 -2
  363. package/dist/esm/types/util/uniqBy.d.ts +0 -1
  364. package/dist/esm/types/util/uniqId.d.ts +0 -1
  365. package/src/ChatifyContext.tsx +0 -41
  366. package/src/core/action.tsx +0 -431
  367. package/src/core/models.tsx +0 -82
  368. package/src/core/reducer.tsx +0 -87
  369. package/src/core/state.ts +0 -93
  370. package/src/core/useAddChatMutation.tsx +0 -28
  371. package/src/core/useAddMemberMutation.tsx +0 -25
  372. package/src/core/useFetchNextMutation.tsx +0 -28
  373. package/src/core/useGetAccountsQuery.tsx +0 -30
  374. package/src/core/useGetChatListQuery.tsx +0 -30
  375. package/src/core/useGetChatQuery.tsx +0 -31
  376. package/src/core/useGetMessagesQuery.tsx +0 -35
  377. package/src/core/useReadMonitor.tsx +0 -32
  378. package/src/core/useRemoveMemberMutation.tsx +0 -23
  379. package/src/core/useSendMutation.tsx +0 -24
  380. package/src/core/useSignalRMonitor.tsx +0 -66
  381. package/src/core/useUpdateChatNameMutation.tsx +0 -23
  382. package/src/ui/AddChatButton.tsx +0 -17
  383. package/src/ui/Avatar.tsx +0 -18
  384. package/src/ui/ChatList/ChatListItemName.tsx +0 -13
  385. package/src/ui/ChatList/index.ts +0 -8
  386. package/src/ui/ChatName.tsx +0 -10
  387. package/src/ui/ChatPanel/ChatBody.tsx +0 -44
  388. package/src/ui/ChatPanel/ChatHeader.tsx +0 -31
  389. package/src/ui/ChatPanel/ChatHeaderMembers.tsx +0 -28
  390. package/src/ui/ChatPanel/ChatMembersButton.tsx +0 -21
  391. package/src/ui/ChatPanel/ChatPanel.tsx +0 -27
  392. package/src/ui/ChatPanel/index.ts +0 -6
  393. package/src/ui/CreateChatPanel/index.ts +0 -4
  394. package/src/ui/InputBox/InputBox.tsx +0 -38
  395. package/src/ui/InputBox/index.ts +0 -4
  396. package/src/ui/Layout/Aside.tsx +0 -12
  397. package/src/ui/Layout/Body.tsx +0 -10
  398. package/src/ui/Layout/Footer.tsx +0 -3
  399. package/src/ui/Layout/Header.tsx +0 -5
  400. package/src/ui/Layout/Main.tsx +0 -15
  401. package/src/ui/Layout/index.ts +0 -5
  402. package/src/ui/Message/index.ts +0 -6
  403. package/src/ui/SendingMessage/index.ts +0 -4
  404. package/src/ui/SystemMessage/SystemMessageRow.tsx +0 -43
  405. package/src/ui/SystemMessage/index.ts +0 -2
  406. package/src/util/index.ts +0 -2
  407. package/src/util/uniqBy.tsx +0 -17
  408. package/src/util/uniqId.tsx +0 -3
package/dist/css/chatify.css CHANGED
@@ -66,11 +66,15 @@
66
66
  }
67
67
  .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item.ant-menu-item-selected .wxchtf-chat-name {
68
68
  font-weight: 600;
69
+ color: inherit;
69
70
  }
70
71
  .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item .wxchtf-chat {
71
72
  padding-inline: 10px;
72
73
  padding-block: 8.5px;
73
74
  position: relative;
75
+ display: flex;
76
+ flex-flow: row nowrap;
77
+ align-items: center;
74
78
  }
75
79
  .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item .wxchtf-chat.--unread .wxchtf-chat-last {
76
80
  font-weight: bold;
@@ -79,9 +83,29 @@
79
83
  font-weight: bold;
80
84
  max-width: 100%;
81
85
  }
86
+ .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item .wxchtf-chat .wxchtf-chat-info {
87
+ min-width: 1;
88
+ }
82
89
  .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item .wxchtf-chat .wxchtf-chat-name {
83
90
  display: inline-block;
84
91
  font-weight: 500;
92
+ color: rgba(0, 0, 0, 0.88);
93
+ }
94
+ .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item .wxchtf-chat .wxchtf-chat-avatar {
95
+ background-color: var(--background-color);
96
+ width: 42px;
97
+ height: 42px;
98
+ line-height: 40px;
99
+ text-align: center;
100
+ color: var(--color);
101
+ border-radius: 50%;
102
+ margin-right: 11px;
103
+ flex: none;
104
+ }
105
+ .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item .wxchtf-chat .wxchtf-chat-avatar .anticon {
106
+ font-size: 20px;
107
+ line-height: 42px;
108
+ height: 42px;
85
109
  }
86
110
  .wxchtf-aside .wxchtf-chat-list.ant-menu .ant-menu-item .wxchtf-chat .wxchtf-unread-count {
87
111
  background-color: #ff4d4f;
@@ -131,35 +155,46 @@
131
155
  font-size: 0.8em;
132
156
  }
133
157
 
134
- .wxchtf-chatify .wxchtf-chat-panel {
158
+ .wxchtf-chatify .wxchtf-chat {
135
159
  flex: auto;
136
160
  display: flex;
137
161
  flex-flow: row nowrap;
162
+ min-width: 1;
138
163
  }
139
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main {
164
+ .wxchtf-chatify .wxchtf-conversation {
165
+ flex: auto;
166
+ display: flex;
167
+ flex-flow: row nowrap;
168
+ min-width: 1;
169
+ }
170
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main {
140
171
  flex: 1;
141
172
  display: flex;
142
173
  flex-flow: column nowrap;
174
+ min-width: 0;
143
175
  }
144
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-header {
176
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-header {
145
177
  padding: 15px 20px;
146
178
  line-height: 24px;
147
- z-index: 1;
179
+ z-index: 2;
148
180
  box-shadow: 0px 2px 4px 0px rgba(88, 99, 107, 0.04), 0px 1px 9px -1px rgba(88, 99, 107, 0.04), 0px 1px 2px 0px rgba(88, 99, 107, 0.06);
149
181
  }
150
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-header .wxchtf-chat-name {
182
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-header .wxchtf-conversation-name {
151
183
  font-weight: 600;
152
184
  font-size: 16px;
153
185
  flex: none;
154
186
  }
155
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-header .wxchtf-chat-name.--editable {
187
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-header .wxchtf-conversation-name.--editable {
156
188
  cursor: pointer;
157
189
  }
158
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-header .wxchtf-chat-members {
190
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-header .wxchtf-conversation-actions {
191
+ display: inline-flex;
192
+ }
193
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-header .wxchtf-chat-members {
159
194
  display: inline-flex;
160
195
  gap: 6px;
161
196
  }
162
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body {
197
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body {
163
198
  flex: 1 1 auto;
164
199
  height: 100px;
165
200
  overflow-y: auto;
@@ -170,118 +205,123 @@
170
205
  flex-flow: column-reverse nowrap;
171
206
  align-items: center;
172
207
  }
173
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body::-webkit-scrollbar {
208
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body::-webkit-scrollbar {
174
209
  width: 8px;
175
210
  height: 8px;
176
211
  }
177
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body::-webkit-scrollbar-track {
212
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body::-webkit-scrollbar-track {
178
213
  background-color: #f1f1f1;
179
214
  }
180
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body::-webkit-scrollbar-thumb {
215
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body::-webkit-scrollbar-thumb {
181
216
  background-color: #dfdfdf;
182
217
  }
183
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message,
184
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message,
185
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-system-message,
186
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message-skeleton {
218
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message,
219
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message,
220
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-system-message,
221
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message-skeleton {
187
222
  margin-bottom: 8px;
188
223
  max-width: 1110px;
189
224
  width: 100%;
190
225
  }
191
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message:first-child,
192
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message:first-child,
193
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-system-message:first-child,
194
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message-skeleton:first-child {
226
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message:first-child,
227
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message:first-child,
228
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-system-message:first-child,
229
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message-skeleton:first-child {
195
230
  margin-bottom: 0;
196
231
  }
197
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message,
198
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message {
232
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message,
233
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message {
199
234
  display: flex;
200
235
  flex-flow: row nowrap;
201
236
  align-items: flex-start;
202
237
  }
203
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message:not(.--my) .wxchtf-message-content,
204
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message:not(.--my) .wxchtf-sending-message-content,
205
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message:not(.--my) .wxchtf-message-content,
206
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message:not(.--my) .wxchtf-sending-message-content {
238
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message > div,
239
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message > div {
240
+ min-width: 0;
241
+ }
242
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message:not(.--my) .wxchtf-message-content,
243
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message:not(.--my) .wxchtf-sending-message-content,
244
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message:not(.--my) .wxchtf-message-content,
245
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message:not(.--my) .wxchtf-sending-message-content {
207
246
  border-bottom-left-radius: 0;
208
247
  }
209
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message.--my,
210
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message.--my {
248
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message.--my,
249
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message.--my {
211
250
  direction: rtl;
212
251
  justify-content: flex-start;
213
252
  }
214
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message.--my .wxchtf-message-author,
215
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message.--my .wxchtf-message-author {
253
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message.--my .wxchtf-message-author,
254
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message.--my .wxchtf-message-author {
216
255
  display: none;
217
256
  }
218
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message.--my .wxchtf-message-content,
219
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message.--my .wxchtf-sending-message-content,
220
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message.--my .wxchtf-message-content,
221
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message.--my .wxchtf-sending-message-content {
257
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message.--my .wxchtf-message-content,
258
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message.--my .wxchtf-sending-message-content,
259
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message.--my .wxchtf-message-content,
260
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message.--my .wxchtf-sending-message-content {
222
261
  direction: ltr;
223
262
  border-bottom-right-radius: 0;
224
263
  background-color: #e4f7f7;
225
264
  }
226
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message.--my .wxchtf-message-info-box,
227
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message.--my .wxchtf-message-info-box {
265
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message.--my .wxchtf-message-info-box,
266
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message.--my .wxchtf-message-info-box {
228
267
  text-align: right;
229
268
  }
230
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-author,
231
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-author {
269
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-author,
270
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-author {
232
271
  margin-right: 15px;
272
+ flex: none;
233
273
  }
234
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-author .ant-avatar,
235
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-author .ant-avatar {
274
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-author .ant-avatar,
275
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-author .ant-avatar {
236
276
  width: 40px;
237
277
  height: 40px;
238
278
  line-height: 38px;
239
279
  }
240
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box,
241
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box,
242
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box,
243
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box {
280
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box,
281
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box,
282
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box,
283
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box {
244
284
  text-align: left;
245
285
  margin-bottom: 3px;
246
286
  }
247
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-author-name,
248
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-sent-at,
249
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-read-box,
250
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
251
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-author-name,
252
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
253
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
254
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box,
255
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-author-name,
256
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-sent-at,
257
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-read-box,
258
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
259
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-author-name,
260
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
261
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
262
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box {
287
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-author-name,
288
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-sent-at,
289
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-read-box,
290
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
291
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-author-name,
292
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
293
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
294
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box,
295
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-author-name,
296
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-sent-at,
297
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-read-box,
298
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
299
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-author-name,
300
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
301
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
302
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box {
263
303
  display: inline-block;
264
304
  font-size: 0.85em;
265
305
  opacity: 0.5;
266
306
  }
267
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-sent-at,
268
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-read-box,
269
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
270
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
271
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
272
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box,
273
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-sent-at,
274
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-read-box,
275
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
276
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
277
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
278
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box {
307
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-sent-at,
308
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box .wxchtf-message-read-box,
309
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
310
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
311
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
312
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box,
313
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-sent-at,
314
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-message-read-box,
315
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-info-box .wxchtf-sending-message-sending-box,
316
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-sent-at,
317
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-message-read-box,
318
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-info-box .wxchtf-sending-message-sending-box {
279
319
  margin-left: 5px;
280
320
  }
281
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-content,
282
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-content,
283
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-content,
284
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-content {
321
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-content,
322
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-content,
323
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-content,
324
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-content {
285
325
  width: fit-content;
286
326
  min-width: 300px;
287
327
  max-width: 70%;
@@ -293,20 +333,20 @@
293
333
  overflow-wrap: break-word;
294
334
  border-radius: 24px;
295
335
  }
296
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-message-content .wxchtf-message-text,
297
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message .wxchtf-sending-message-content .wxchtf-message-text,
298
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-message-content .wxchtf-message-text,
299
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-sending-message .wxchtf-sending-message-content .wxchtf-message-text {
336
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-message-content .wxchtf-message-text,
337
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message .wxchtf-sending-message-content .wxchtf-message-text,
338
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-message-content .wxchtf-message-text,
339
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-sending-message .wxchtf-sending-message-content .wxchtf-message-text {
300
340
  line-height: 21px;
301
341
  }
302
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-system-message {
342
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-system-message {
303
343
  font-style: italic;
304
344
  position: relative;
305
345
  text-align: center;
306
346
  color: rgba(14, 15, 23, 0.6);
307
347
  }
308
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-system-message .wxchtf-text,
309
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-system-message .wxchtf-timestamp {
348
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-system-message .wxchtf-text,
349
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-system-message .wxchtf-timestamp {
310
350
  position: relative;
311
351
  z-index: 1;
312
352
  padding-inline: 8px;
@@ -314,46 +354,28 @@
314
354
  font-size: 0.85em;
315
355
  background-color: white;
316
356
  }
317
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-system-message .wxchtf-timestamp {
357
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-system-message .wxchtf-timestamp {
318
358
  padding-left: 10px;
319
359
  }
320
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-system-message::after {
321
- content: "";
322
- position: absolute;
323
- height: 1px;
324
- width: 100%;
325
- left: 0;
326
- top: 50%;
327
- z-index: 0;
328
- background-color: rgba(0, 0, 0, 0.0588235294);
329
- }
330
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message-skeleton {
360
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message-skeleton {
331
361
  display: flex;
332
362
  flex-flow: row nowrap;
333
363
  align-items: flex-end;
334
364
  }
335
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message-skeleton .wxchtf-avatar {
365
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message-skeleton .wxchtf-avatar {
336
366
  margin-right: 15px;
337
367
  }
338
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message-skeleton .wxchtf-avatar .ant-skeleton-avatar {
368
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message-skeleton .wxchtf-avatar .ant-skeleton-avatar {
339
369
  width: 40px;
340
370
  height: 40px;
341
371
  line-height: 40px;
342
372
  }
343
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-main .wxchtf-chat-body .wxchtf-message-skeleton .wxchtf-content {
373
+ .wxchtf-chatify .wxchtf-conversation .wxchtf-conversation-main .wxchtf-conversation-body .wxchtf-message-skeleton .wxchtf-content {
344
374
  width: 300px;
345
375
  height: 100px;
346
376
  border-radius: 10px;
347
377
  border-bottom-left-radius: 0;
348
378
  }
349
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-members-panel {
350
- min-width: 300px;
351
- box-shadow: -4px 0px 20px -5px rgba(12, 217, 226, 0.0784313725), -2px 1px 12px rgba(0, 110, 114, 0.0588235294);
352
- }
353
- .wxchtf-chatify .wxchtf-chat-panel .wxchtf-chat-members-panel .wxchtf-chat-members-list .wxchtf-chat-members-list-item {
354
- padding-inline: 1rem;
355
- border-block-end: none;
356
- }
357
379
 
358
380
  .wxchtf-input-form {
359
381
  flex: none;
@@ -431,6 +453,15 @@
431
453
  font-size: 1.5rem;
432
454
  }
433
455
 
456
+ .wxchtf-chatify .wxchtf-chat-members-panel {
457
+ min-width: 300px;
458
+ box-shadow: -4px 0px 20px -5px rgba(12, 217, 226, 0.0784313725), -2px 1px 12px rgba(0, 110, 114, 0.0588235294);
459
+ }
460
+ .wxchtf-chatify .wxchtf-chat-members-panel .wxchtf-chat-members-list .wxchtf-chat-members-list-item {
461
+ padding-inline: 1rem;
462
+ border-block-end: none;
463
+ }
464
+
434
465
  .wxchtf-chatify {
435
466
  display: flex;
436
467
  flex-flow: column nowrap;
@@ -475,6 +506,7 @@
475
506
  border-bottom-right-radius: 24px;
476
507
  box-shadow: 0px 6px 30px 0px rgba(12, 217, 226, 0.0784313725), 0px 1px 12px 0px rgba(0, 110, 114, 0.0588235294);
477
508
  z-index: 2;
509
+ min-width: 0;
478
510
  }
479
511
  .wxchtf-main .wxchtf-create-chat-panel {
480
512
  display: flex;