@sendbird/uikit-react 3.4.0 → 3.4.1-rc.0

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 (501) hide show
  1. package/App.js +40 -40
  2. package/CHANGELOG.md +22 -0
  3. package/Channel/components/ChannelHeader.js +30 -28
  4. package/Channel/components/ChannelHeader.js.map +1 -1
  5. package/Channel/components/ChannelUI.js +42 -94
  6. package/Channel/components/ChannelUI.js.map +1 -1
  7. package/Channel/components/FileViewer.js +15 -15
  8. package/Channel/components/FrozenNotification.js +8 -6
  9. package/Channel/components/FrozenNotification.js.map +1 -1
  10. package/Channel/components/Message.js +162 -132
  11. package/Channel/components/Message.js.map +1 -1
  12. package/Channel/components/MessageInput.js +23 -23
  13. package/Channel/components/MessageList.js +169 -95
  14. package/Channel/components/MessageList.js.map +1 -1
  15. package/Channel/components/RemoveMessageModal.js +17 -17
  16. package/Channel/components/SuggestedMentionList.js +17 -17
  17. package/Channel/components/TypingIndicator.js +15 -15
  18. package/Channel/components/UnreadCount.js +14 -17
  19. package/Channel/components/UnreadCount.js.map +1 -1
  20. package/Channel/context.js +14 -14
  21. package/Channel.js +34 -34
  22. package/ChannelList/components/AddChannel.js +22 -17
  23. package/ChannelList/components/AddChannel.js.map +1 -1
  24. package/ChannelList/components/ChannelListHeader.js +7 -7
  25. package/ChannelList/components/ChannelListUI.js +29 -29
  26. package/ChannelList/components/ChannelPreview.js +28 -28
  27. package/ChannelList/components/ChannelPreview.js.map +1 -1
  28. package/ChannelList/components/ChannelPreviewAction.js +14 -14
  29. package/ChannelList/context.js +8 -8
  30. package/ChannelList.js +29 -29
  31. package/{ChannelListProvider-442bea80.js → ChannelListProvider-9f51ca7a.js} +8 -8
  32. package/{ChannelListProvider-442bea80.js.map → ChannelListProvider-9f51ca7a.js.map} +1 -1
  33. package/{ChannelProvider-43d68897.js → ChannelProvider-19d75ee9.js} +13 -12
  34. package/ChannelProvider-19d75ee9.js.map +1 -0
  35. package/ChannelSettings/components/ChannelProfile.js +12 -12
  36. package/ChannelSettings/components/ChannelSettingsUI.js +18 -18
  37. package/ChannelSettings/components/EditDetailsModal.js +12 -12
  38. package/ChannelSettings/components/LeaveChannel.js +12 -12
  39. package/ChannelSettings/components/ModerationPanel.js +15 -15
  40. package/ChannelSettings/components/UserListItem.js +11 -11
  41. package/ChannelSettings/components/UserPanel.js +14 -14
  42. package/ChannelSettings/context.js +3 -3
  43. package/ChannelSettings.js +18 -18
  44. package/CreateChannel/components/CreateChannelUI.js +14 -14
  45. package/CreateChannel/components/InviteUsers.js +14 -14
  46. package/CreateChannel/components/SelectChannelType.js +11 -11
  47. package/CreateChannel/context.js +4 -4
  48. package/CreateChannel.js +14 -14
  49. package/{CreateChannelProvider-62afdf07.js → CreateChannelProvider-4a26fc5d.js} +1 -1
  50. package/{CreateChannelProvider-62afdf07.js.map → CreateChannelProvider-4a26fc5d.js.map} +1 -1
  51. package/CreateOpenChannel/components/CreateOpenChannelUI.js +10 -10
  52. package/CreateOpenChannel/context.js +1 -1
  53. package/CreateOpenChannel.js +10 -10
  54. package/EditUserProfile/components/EditUserProfileUI.js +13 -13
  55. package/EditUserProfile.js +13 -13
  56. package/{LocalizationContext-83ddce67.js → LocalizationContext-646420ca.js} +3 -3
  57. package/{LocalizationContext-83ddce67.js.map → LocalizationContext-646420ca.js.map} +1 -1
  58. package/{MediaQueryContext-010e9df0.js → MediaQueryContext-1441c35c.js} +1 -1
  59. package/{MediaQueryContext-010e9df0.js.map → MediaQueryContext-1441c35c.js.map} +1 -1
  60. package/{MemberList-299e055b.js → MemberList-e1088d7b.js} +5 -5
  61. package/{MemberList-299e055b.js.map → MemberList-e1088d7b.js.map} +1 -1
  62. package/MessageSearch/components/MessageSearchUI.js +12 -12
  63. package/MessageSearch/context.js +2 -2
  64. package/MessageSearch.js +12 -12
  65. package/OpenChannel/components/FrozenChannelNotification.js +4 -4
  66. package/OpenChannel/components/OpenChannelHeader.js +13 -13
  67. package/OpenChannel/components/OpenChannelInput.js +15 -15
  68. package/OpenChannel/components/OpenChannelMessage.js +26 -22
  69. package/OpenChannel/components/OpenChannelMessage.js.map +1 -1
  70. package/OpenChannel/components/OpenChannelMessageList.js +24 -24
  71. package/OpenChannel/components/OpenChannelUI.js +24 -24
  72. package/OpenChannel/context.js +9 -9
  73. package/OpenChannel.js +24 -24
  74. package/OpenChannelList/components/OpenChannelListUI.js +13 -13
  75. package/OpenChannelList/components/OpenChannelPreview.js +4 -4
  76. package/OpenChannelList/context.js +4 -4
  77. package/OpenChannelList.js +13 -13
  78. package/{OpenChannelListProvider-2d811cef.js → OpenChannelListProvider-76b2bc47.js} +3 -3
  79. package/{OpenChannelListProvider-2d811cef.js.map → OpenChannelListProvider-76b2bc47.js.map} +1 -1
  80. package/{OpenChannelProvider-7aef2b42.js → OpenChannelProvider-de0549fc.js} +7 -7
  81. package/{OpenChannelProvider-7aef2b42.js.map → OpenChannelProvider-de0549fc.js.map} +1 -1
  82. package/OpenChannelSettings/components/EditDetailsModal.js +13 -13
  83. package/OpenChannelSettings/components/OpenChannelProfile.js +13 -13
  84. package/OpenChannelSettings/components/OpenChannelSettingsUI.js +18 -18
  85. package/OpenChannelSettings/components/OperatorUI.js +17 -17
  86. package/OpenChannelSettings/components/ParticipantUI.js +15 -15
  87. package/OpenChannelSettings/context.js +3 -3
  88. package/OpenChannelSettings.js +18 -18
  89. package/{RemoveMessageModal-1ca08354.js → RemoveMessageModal-c25f1f20.js} +3 -3
  90. package/{RemoveMessageModal-1ca08354.js.map → RemoveMessageModal-c25f1f20.js.map} +1 -1
  91. package/SendbirdProvider.js +12 -12
  92. package/SendbirdProvider.js.map +1 -1
  93. package/Thread/components/ParentMessageInfo.js +24 -24
  94. package/Thread/components/ParentMessageInfoItem.js +16 -16
  95. package/Thread/components/ThreadHeader.js +6 -6
  96. package/Thread/components/ThreadList.js +27 -27
  97. package/Thread/components/ThreadListItem.js +39 -38
  98. package/Thread/components/ThreadListItem.js.map +1 -1
  99. package/Thread/components/ThreadMessageInput.js +24 -24
  100. package/Thread/components/ThreadUI.js +31 -31
  101. package/Thread/context.js +9 -9
  102. package/Thread.js +31 -31
  103. package/{ThreadProvider-94605d33.js → ThreadProvider-0ebc9c60.js} +7 -7
  104. package/{ThreadProvider-94605d33.js.map → ThreadProvider-0ebc9c60.js.map} +1 -1
  105. package/{UserProfileContext-236a8db5.js → UserProfileContext-eb7f4891.js} +1 -1
  106. package/{UserProfileContext-236a8db5.js.map → UserProfileContext-eb7f4891.js.map} +1 -1
  107. package/{VoiceMessageInputWrapper-8d50dc6c.js → VoiceMessageInputWrapper-c0ac4f9c.js} +7 -7
  108. package/{VoiceMessageInputWrapper-8d50dc6c.js.map → VoiceMessageInputWrapper-c0ac4f9c.js.map} +1 -1
  109. package/VoicePlayer/context.js +3 -3
  110. package/VoicePlayer/useVoicePlayer.js +3 -3
  111. package/VoiceRecorder/context.js +1 -1
  112. package/VoiceRecorder/useVoiceRecorder.js +2 -2
  113. package/{_rollupPluginBabelHelpers-b0efb0e7.js → _rollupPluginBabelHelpers-5827233e.js} +1 -1
  114. package/_rollupPluginBabelHelpers-5827233e.js.map +1 -0
  115. package/{actionTypes-42a0e7a6.js → actionTypes-42080a5c.js} +1 -1
  116. package/{actionTypes-42a0e7a6.js.map → actionTypes-42080a5c.js.map} +1 -1
  117. package/cjs/App.js +40 -40
  118. package/cjs/Channel/components/ChannelHeader.js +30 -28
  119. package/cjs/Channel/components/ChannelHeader.js.map +1 -1
  120. package/cjs/Channel/components/ChannelUI.js +41 -93
  121. package/cjs/Channel/components/ChannelUI.js.map +1 -1
  122. package/cjs/Channel/components/FileViewer.js +15 -15
  123. package/cjs/Channel/components/FrozenNotification.js +8 -6
  124. package/cjs/Channel/components/FrozenNotification.js.map +1 -1
  125. package/cjs/Channel/components/Message.js +161 -131
  126. package/cjs/Channel/components/Message.js.map +1 -1
  127. package/cjs/Channel/components/MessageInput.js +23 -23
  128. package/cjs/Channel/components/MessageList.js +168 -94
  129. package/cjs/Channel/components/MessageList.js.map +1 -1
  130. package/cjs/Channel/components/RemoveMessageModal.js +17 -17
  131. package/cjs/Channel/components/SuggestedMentionList.js +17 -17
  132. package/cjs/Channel/components/TypingIndicator.js +15 -15
  133. package/cjs/Channel/components/UnreadCount.js +14 -17
  134. package/cjs/Channel/components/UnreadCount.js.map +1 -1
  135. package/cjs/Channel/context.js +14 -14
  136. package/cjs/Channel.js +34 -34
  137. package/cjs/ChannelList/components/AddChannel.js +22 -17
  138. package/cjs/ChannelList/components/AddChannel.js.map +1 -1
  139. package/cjs/ChannelList/components/ChannelListHeader.js +7 -7
  140. package/cjs/ChannelList/components/ChannelListUI.js +29 -29
  141. package/cjs/ChannelList/components/ChannelPreview.js +28 -28
  142. package/cjs/ChannelList/components/ChannelPreview.js.map +1 -1
  143. package/cjs/ChannelList/components/ChannelPreviewAction.js +14 -14
  144. package/cjs/ChannelList/context.js +8 -8
  145. package/cjs/ChannelList.js +29 -29
  146. package/cjs/{ChannelListProvider-c2da1fdd.js → ChannelListProvider-f0ae2b2b.js} +8 -8
  147. package/cjs/{ChannelListProvider-c2da1fdd.js.map → ChannelListProvider-f0ae2b2b.js.map} +1 -1
  148. package/cjs/{ChannelProvider-d207316d.js → ChannelProvider-7a4dc56f.js} +12 -12
  149. package/cjs/ChannelProvider-7a4dc56f.js.map +1 -0
  150. package/cjs/ChannelSettings/components/ChannelProfile.js +12 -12
  151. package/cjs/ChannelSettings/components/ChannelSettingsUI.js +18 -18
  152. package/cjs/ChannelSettings/components/EditDetailsModal.js +12 -12
  153. package/cjs/ChannelSettings/components/LeaveChannel.js +12 -12
  154. package/cjs/ChannelSettings/components/ModerationPanel.js +15 -15
  155. package/cjs/ChannelSettings/components/UserListItem.js +11 -11
  156. package/cjs/ChannelSettings/components/UserPanel.js +14 -14
  157. package/cjs/ChannelSettings/context.js +3 -3
  158. package/cjs/ChannelSettings.js +18 -18
  159. package/cjs/CreateChannel/components/CreateChannelUI.js +14 -14
  160. package/cjs/CreateChannel/components/InviteUsers.js +14 -14
  161. package/cjs/CreateChannel/components/SelectChannelType.js +11 -11
  162. package/cjs/CreateChannel/context.js +4 -4
  163. package/cjs/CreateChannel.js +14 -14
  164. package/cjs/{CreateChannelProvider-02349744.js → CreateChannelProvider-f93f94ce.js} +1 -1
  165. package/cjs/{CreateChannelProvider-02349744.js.map → CreateChannelProvider-f93f94ce.js.map} +1 -1
  166. package/cjs/CreateOpenChannel/components/CreateOpenChannelUI.js +10 -10
  167. package/cjs/CreateOpenChannel/context.js +1 -1
  168. package/cjs/CreateOpenChannel.js +10 -10
  169. package/cjs/EditUserProfile/components/EditUserProfileUI.js +13 -13
  170. package/cjs/EditUserProfile.js +13 -13
  171. package/cjs/{LocalizationContext-a60a75a7.js → LocalizationContext-c7dba320.js} +3 -3
  172. package/cjs/{LocalizationContext-a60a75a7.js.map → LocalizationContext-c7dba320.js.map} +1 -1
  173. package/cjs/{MediaQueryContext-5d0a1ebc.js → MediaQueryContext-c21176c2.js} +1 -1
  174. package/cjs/{MediaQueryContext-5d0a1ebc.js.map → MediaQueryContext-c21176c2.js.map} +1 -1
  175. package/cjs/{MemberList-4c6bb907.js → MemberList-8beacafe.js} +5 -5
  176. package/cjs/{MemberList-4c6bb907.js.map → MemberList-8beacafe.js.map} +1 -1
  177. package/cjs/MessageSearch/components/MessageSearchUI.js +12 -12
  178. package/cjs/MessageSearch/context.js +2 -2
  179. package/cjs/MessageSearch.js +12 -12
  180. package/cjs/OpenChannel/components/FrozenChannelNotification.js +4 -4
  181. package/cjs/OpenChannel/components/OpenChannelHeader.js +13 -13
  182. package/cjs/OpenChannel/components/OpenChannelInput.js +15 -15
  183. package/cjs/OpenChannel/components/OpenChannelMessage.js +26 -22
  184. package/cjs/OpenChannel/components/OpenChannelMessage.js.map +1 -1
  185. package/cjs/OpenChannel/components/OpenChannelMessageList.js +24 -24
  186. package/cjs/OpenChannel/components/OpenChannelUI.js +24 -24
  187. package/cjs/OpenChannel/context.js +9 -9
  188. package/cjs/OpenChannel.js +24 -24
  189. package/cjs/OpenChannelList/components/OpenChannelListUI.js +13 -13
  190. package/cjs/OpenChannelList/components/OpenChannelPreview.js +4 -4
  191. package/cjs/OpenChannelList/context.js +4 -4
  192. package/cjs/OpenChannelList.js +13 -13
  193. package/cjs/{OpenChannelListProvider-5a949d98.js → OpenChannelListProvider-be9e4a7a.js} +3 -3
  194. package/cjs/{OpenChannelListProvider-5a949d98.js.map → OpenChannelListProvider-be9e4a7a.js.map} +1 -1
  195. package/cjs/{OpenChannelProvider-7c843439.js → OpenChannelProvider-48f2c689.js} +7 -7
  196. package/cjs/{OpenChannelProvider-7c843439.js.map → OpenChannelProvider-48f2c689.js.map} +1 -1
  197. package/cjs/OpenChannelSettings/components/EditDetailsModal.js +13 -13
  198. package/cjs/OpenChannelSettings/components/OpenChannelProfile.js +13 -13
  199. package/cjs/OpenChannelSettings/components/OpenChannelSettingsUI.js +18 -18
  200. package/cjs/OpenChannelSettings/components/OperatorUI.js +17 -17
  201. package/cjs/OpenChannelSettings/components/ParticipantUI.js +15 -15
  202. package/cjs/OpenChannelSettings/context.js +3 -3
  203. package/cjs/OpenChannelSettings.js +18 -18
  204. package/cjs/{RemoveMessageModal-a069ff52.js → RemoveMessageModal-a2906376.js} +3 -3
  205. package/cjs/{RemoveMessageModal-a069ff52.js.map → RemoveMessageModal-a2906376.js.map} +1 -1
  206. package/cjs/SendbirdProvider.js +12 -12
  207. package/cjs/SendbirdProvider.js.map +1 -1
  208. package/cjs/Thread/components/ParentMessageInfo.js +24 -24
  209. package/cjs/Thread/components/ParentMessageInfoItem.js +16 -16
  210. package/cjs/Thread/components/ThreadHeader.js +6 -6
  211. package/cjs/Thread/components/ThreadList.js +27 -27
  212. package/cjs/Thread/components/ThreadListItem.js +39 -38
  213. package/cjs/Thread/components/ThreadListItem.js.map +1 -1
  214. package/cjs/Thread/components/ThreadMessageInput.js +24 -24
  215. package/cjs/Thread/components/ThreadUI.js +31 -31
  216. package/cjs/Thread/context.js +9 -9
  217. package/cjs/Thread.js +31 -31
  218. package/cjs/{ThreadProvider-66fcc519.js → ThreadProvider-c69173ee.js} +7 -7
  219. package/cjs/{ThreadProvider-66fcc519.js.map → ThreadProvider-c69173ee.js.map} +1 -1
  220. package/cjs/{UserProfileContext-2ec6891e.js → UserProfileContext-55f0e6bb.js} +1 -1
  221. package/cjs/{UserProfileContext-2ec6891e.js.map → UserProfileContext-55f0e6bb.js.map} +1 -1
  222. package/cjs/{VoiceMessageInputWrapper-289e18f6.js → VoiceMessageInputWrapper-1f621f96.js} +7 -7
  223. package/cjs/{VoiceMessageInputWrapper-289e18f6.js.map → VoiceMessageInputWrapper-1f621f96.js.map} +1 -1
  224. package/cjs/VoicePlayer/context.js +3 -3
  225. package/cjs/VoicePlayer/useVoicePlayer.js +3 -3
  226. package/cjs/VoiceRecorder/context.js +1 -1
  227. package/cjs/VoiceRecorder/useVoiceRecorder.js +2 -2
  228. package/cjs/{_rollupPluginBabelHelpers-24f49f41.js → _rollupPluginBabelHelpers-53067984.js} +1 -1
  229. package/cjs/_rollupPluginBabelHelpers-53067984.js.map +1 -0
  230. package/cjs/{actionTypes-31463602.js → actionTypes-6116824d.js} +1 -1
  231. package/cjs/{actionTypes-31463602.js.map → actionTypes-6116824d.js.map} +1 -1
  232. package/cjs/{color-7144c59e.js → color-9ec8fac6.js} +1 -1
  233. package/cjs/{color-7144c59e.js.map → color-9ec8fac6.js.map} +1 -1
  234. package/cjs/{compareIds-b3e3cffc.js → compareIds-d6461851.js} +1 -1
  235. package/cjs/{compareIds-b3e3cffc.js.map → compareIds-d6461851.js.map} +1 -1
  236. package/cjs/{const-21424d05.js → const-1f3d1ae1.js} +1 -1
  237. package/cjs/{const-21424d05.js.map → const-1f3d1ae1.js.map} +1 -1
  238. package/cjs/{const-d6a997ec.js → const-3d3ea5a6.js} +3 -1
  239. package/cjs/const-3d3ea5a6.js.map +1 -0
  240. package/cjs/{consts-47e4d487.js → consts-a7f5f91d.js} +1 -1
  241. package/cjs/{consts-47e4d487.js.map → consts-a7f5f91d.js.map} +1 -1
  242. package/cjs/{context-8cb8affd.js → context-5374df4e.js} +2 -2
  243. package/cjs/{context-8cb8affd.js.map → context-5374df4e.js.map} +1 -1
  244. package/cjs/dist/index.css +161 -141
  245. package/cjs/dist/index.css.map +1 -1
  246. package/cjs/{index-a1b754e9.js → index-082ae73e.js} +7 -7
  247. package/cjs/{index-a1b754e9.js.map → index-082ae73e.js.map} +1 -1
  248. package/cjs/{index-31f28d2f.js → index-4dc4e6b5.js} +4 -4
  249. package/cjs/{index-31f28d2f.js.map → index-4dc4e6b5.js.map} +1 -1
  250. package/cjs/{index-4c8c854d.js → index-5993f1e6.js} +3 -3
  251. package/cjs/{index-4c8c854d.js.map → index-5993f1e6.js.map} +1 -1
  252. package/cjs/{index-62b0b176.js → index-5fef7cd4.js} +7 -7
  253. package/cjs/{index-62b0b176.js.map → index-5fef7cd4.js.map} +1 -1
  254. package/cjs/{index-a3f2fc1e.js → index-7ee2031a.js} +3 -3
  255. package/cjs/{index-a3f2fc1e.js.map → index-7ee2031a.js.map} +1 -1
  256. package/cjs/{index-e97ad39a.js → index-84e17bfc.js} +2 -2
  257. package/cjs/{index-e97ad39a.js.map → index-84e17bfc.js.map} +1 -1
  258. package/cjs/{index-c65779c7.js → index-8e745dca.js} +2 -2
  259. package/cjs/{index-c65779c7.js.map → index-8e745dca.js.map} +1 -1
  260. package/cjs/{index-4678a454.js → index-9d41d610.js} +1 -1
  261. package/cjs/{index-4678a454.js.map → index-9d41d610.js.map} +1 -1
  262. package/cjs/{index-8ea5c90b.js → index-b583b8df.js} +5 -5
  263. package/cjs/{index-8ea5c90b.js.map → index-b583b8df.js.map} +1 -1
  264. package/cjs/{index-c77b4d21.js → index-bb8788c1.js} +2 -2
  265. package/cjs/{index-c77b4d21.js.map → index-bb8788c1.js.map} +1 -1
  266. package/cjs/{index-dbe73222.js → index-dbfa9e30.js} +4 -4
  267. package/cjs/{index-dbe73222.js.map → index-dbfa9e30.js.map} +1 -1
  268. package/cjs/{index-7f8189a8.js → index-e2cb4259.js} +2 -2
  269. package/cjs/{index-7f8189a8.js.map → index-e2cb4259.js.map} +1 -1
  270. package/cjs/{index-254f336f.js → index-ef4ab52a.js} +7 -5
  271. package/cjs/index-ef4ab52a.js.map +1 -0
  272. package/cjs/{index-987764bd.js → index-f0738051.js} +1 -1
  273. package/cjs/{index-987764bd.js.map → index-f0738051.js.map} +1 -1
  274. package/cjs/index.js +44 -44
  275. package/cjs/sendbirdSelectors.js +2 -2
  276. package/cjs/{stringSet-4ee01b87.js → stringSet-39f04718.js} +1 -1
  277. package/cjs/{stringSet-4ee01b87.js.map → stringSet-39f04718.js.map} +1 -1
  278. package/cjs/{topics-022da857.js → topics-5606f43e.js} +1 -1
  279. package/cjs/{topics-022da857.js.map → topics-5606f43e.js.map} +1 -1
  280. package/cjs/{tslib.es6-e6498d62.js → tslib.es6-aab6b54f.js} +1 -1
  281. package/cjs/{tslib.es6-e6498d62.js.map → tslib.es6-aab6b54f.js.map} +1 -1
  282. package/cjs/{types-aeca242a.js → types-45b8cd42.js} +1 -1
  283. package/cjs/{types-aeca242a.js.map → types-45b8cd42.js.map} +1 -1
  284. package/cjs/ui/Accordion.js +3 -3
  285. package/cjs/ui/AccordionGroup.js +2 -2
  286. package/cjs/ui/AdminMessage.js +3 -3
  287. package/cjs/ui/Avatar.js +2 -2
  288. package/cjs/ui/Badge.js +5 -5
  289. package/cjs/ui/BottomSheet.js +1 -1
  290. package/cjs/ui/Button.js +3 -3
  291. package/cjs/ui/ChannelAvatar.js +3 -3
  292. package/cjs/ui/ConnectionStatus.js +4 -4
  293. package/cjs/ui/ContextMenu.js +7 -6
  294. package/cjs/ui/ContextMenu.js.map +1 -1
  295. package/cjs/ui/DateSeparator.js +4 -4
  296. package/cjs/ui/EmojiReactions.js +7 -7
  297. package/cjs/ui/FileMessageItemBody.js +6 -6
  298. package/cjs/ui/FileViewer.js +8 -8
  299. package/cjs/ui/IconButton.js +1 -1
  300. package/cjs/ui/ImageRenderer.js +1 -1
  301. package/cjs/ui/Input.js +2 -2
  302. package/cjs/ui/Label.js +2 -2
  303. package/cjs/ui/LinkLabel.js +2 -2
  304. package/cjs/ui/Loader.js +1 -1
  305. package/cjs/ui/MentionLabel.js +11 -11
  306. package/cjs/ui/MessageContent.js +35 -34
  307. package/cjs/ui/MessageContent.js.map +1 -1
  308. package/cjs/ui/MessageInput.js +9 -9
  309. package/cjs/ui/MessageItemMenu.js +11 -11
  310. package/cjs/ui/MessageItemMenu.js.map +1 -1
  311. package/cjs/ui/MessageItemReactionMenu.js +5 -5
  312. package/cjs/ui/MessageSearchFileItem.js +10 -10
  313. package/cjs/ui/MessageSearchItem.js +9 -9
  314. package/cjs/ui/MessageStatus.js +10 -10
  315. package/cjs/ui/Modal.js +7 -7
  316. package/cjs/ui/OGMessageItemBody.js +11 -11
  317. package/cjs/ui/OpenChannelAdminMessage.js +3 -3
  318. package/cjs/ui/OpenChannelAvatar.js +6 -6
  319. package/cjs/ui/OpenchannelConversationHeader.js +6 -6
  320. package/cjs/ui/OpenchannelFileMessage.js +33 -27
  321. package/cjs/ui/OpenchannelFileMessage.js.map +1 -1
  322. package/cjs/ui/OpenchannelOGMessage.js +32 -30
  323. package/cjs/ui/OpenchannelOGMessage.js.map +1 -1
  324. package/cjs/ui/OpenchannelThumbnailMessage.js +35 -29
  325. package/cjs/ui/OpenchannelThumbnailMessage.js.map +1 -1
  326. package/cjs/ui/OpenchannelUserMessage.js +32 -30
  327. package/cjs/ui/OpenchannelUserMessage.js.map +1 -1
  328. package/cjs/ui/PlaceHolder.js +6 -6
  329. package/cjs/ui/PlaybackTime.js +2 -2
  330. package/cjs/ui/QuoteMessage.js +6 -6
  331. package/cjs/ui/QuoteMessageInput.js +6 -6
  332. package/cjs/ui/ReactionBadge.js +3 -3
  333. package/cjs/ui/ReactionButton.js +1 -1
  334. package/cjs/ui/SortByRow.js +2 -2
  335. package/cjs/ui/TextButton.js +2 -2
  336. package/cjs/ui/TextMessageItemBody.js +11 -11
  337. package/cjs/ui/ThreadReplies.js +6 -6
  338. package/cjs/ui/ThumbnailMessageItemBody.js +2 -2
  339. package/cjs/ui/Tooltip.js +3 -3
  340. package/cjs/ui/TooltipWrapper.js +1 -1
  341. package/cjs/ui/UnknownMessageItemBody.js +6 -6
  342. package/cjs/ui/UserListItem.js +11 -11
  343. package/cjs/ui/UserProfile.js +10 -10
  344. package/cjs/ui/VoiceMessageItemBody.js +5 -5
  345. package/cjs/ui/VoiceMessgeInput.js +8 -8
  346. package/cjs/ui/Word.js +11 -11
  347. package/cjs/{useLongPress-322218d9.js → useLongPress-9261da40.js} +3 -3
  348. package/cjs/{useLongPress-322218d9.js.map → useLongPress-9261da40.js.map} +1 -1
  349. package/cjs/useSendbirdStateContext.js +1 -1
  350. package/cjs/utils/message/isVoiceMessage.js +2 -2
  351. package/cjs/{utils-eb7febed.js → utils-1575dcd5.js} +1 -1
  352. package/cjs/{utils-eb7febed.js.map → utils-1575dcd5.js.map} +1 -1
  353. package/cjs/{utils-642928b9.js → utils-5ee973c5.js} +2 -2
  354. package/cjs/{utils-642928b9.js.map → utils-5ee973c5.js.map} +1 -1
  355. package/cjs/{utils-37fca8a6.js → utils-67a9f818.js} +1 -1
  356. package/cjs/{utils-37fca8a6.js.map → utils-67a9f818.js.map} +1 -1
  357. package/cjs/{utils-c95c0536.js → utils-acf605ed.js} +1 -1
  358. package/cjs/{utils-c95c0536.js.map → utils-acf605ed.js.map} +1 -1
  359. package/cjs/{uuid-74ed3d6f.js → uuid-7daa634b.js} +1 -1
  360. package/cjs/{uuid-74ed3d6f.js.map → uuid-7daa634b.js.map} +1 -1
  361. package/cjs/withSendbird.js +1 -1
  362. package/{color-1e2ee795.js → color-9754a8a3.js} +1 -1
  363. package/{color-1e2ee795.js.map → color-9754a8a3.js.map} +1 -1
  364. package/{compareIds-5ccbddc5.js → compareIds-5ff919a8.js} +1 -1
  365. package/{compareIds-5ccbddc5.js.map → compareIds-5ff919a8.js.map} +1 -1
  366. package/{const-8faafb2e.js → const-21dcd857.js} +3 -2
  367. package/const-21dcd857.js.map +1 -0
  368. package/{const-dc9e776d.js → const-7588ac16.js} +1 -1
  369. package/{const-dc9e776d.js.map → const-7588ac16.js.map} +1 -1
  370. package/{consts-36a3e18c.js → consts-20a8f693.js} +1 -1
  371. package/{consts-36a3e18c.js.map → consts-20a8f693.js.map} +1 -1
  372. package/{context-7f6e48a4.js → context-01308b37.js} +2 -2
  373. package/{context-7f6e48a4.js.map → context-01308b37.js.map} +1 -1
  374. package/dist/index.css +161 -141
  375. package/dist/index.css.map +1 -1
  376. package/{index-34aa10d1.js → index-100b143d.js} +2 -2
  377. package/{index-34aa10d1.js.map → index-100b143d.js.map} +1 -1
  378. package/{index-3fb2524a.js → index-1a8fa4cd.js} +4 -4
  379. package/{index-3fb2524a.js.map → index-1a8fa4cd.js.map} +1 -1
  380. package/{index-ba7daf9f.js → index-1de84663.js} +3 -3
  381. package/{index-ba7daf9f.js.map → index-1de84663.js.map} +1 -1
  382. package/{index-33f2cf64.js → index-2e23c452.js} +2 -2
  383. package/{index-33f2cf64.js.map → index-2e23c452.js.map} +1 -1
  384. package/{index-28d6891b.js → index-3e5cbf80.js} +7 -7
  385. package/{index-28d6891b.js.map → index-3e5cbf80.js.map} +1 -1
  386. package/{index-5f7a15e3.js → index-44342614.js} +1 -1
  387. package/{index-5f7a15e3.js.map → index-44342614.js.map} +1 -1
  388. package/{index-ece24db0.js → index-561ddd27.js} +2 -2
  389. package/{index-ece24db0.js.map → index-561ddd27.js.map} +1 -1
  390. package/{index-5eb9a836.js → index-5e057577.js} +1 -1
  391. package/{index-5eb9a836.js.map → index-5e057577.js.map} +1 -1
  392. package/{index-ba245747.js → index-82382d4a.js} +5 -5
  393. package/{index-ba245747.js.map → index-82382d4a.js.map} +1 -1
  394. package/{index-a66bf2c0.js → index-9e5cf819.js} +4 -4
  395. package/{index-a66bf2c0.js.map → index-9e5cf819.js.map} +1 -1
  396. package/{index-5258ee05.js → index-aa29a843.js} +2 -2
  397. package/{index-5258ee05.js.map → index-aa29a843.js.map} +1 -1
  398. package/{index-7e47ba7d.js → index-cebb1db7.js} +7 -5
  399. package/index-cebb1db7.js.map +1 -0
  400. package/{index-25d0ba0b.js → index-dc672161.js} +7 -7
  401. package/{index-25d0ba0b.js.map → index-dc672161.js.map} +1 -1
  402. package/{index-87ea8714.js → index-dd2a9d44.js} +3 -3
  403. package/{index-87ea8714.js.map → index-dd2a9d44.js.map} +1 -1
  404. package/index.d.ts +30 -22
  405. package/index.js +44 -44
  406. package/package.json +1 -1
  407. package/sendbirdSelectors.js +2 -2
  408. package/{stringSet-44be1369.js → stringSet-ea4aeced.js} +1 -1
  409. package/{stringSet-44be1369.js.map → stringSet-ea4aeced.js.map} +1 -1
  410. package/{topics-3f0db840.js → topics-2b0b1403.js} +1 -1
  411. package/{topics-3f0db840.js.map → topics-2b0b1403.js.map} +1 -1
  412. package/{tslib.es6-d163c646.js → tslib.es6-ca21063f.js} +1 -1
  413. package/{tslib.es6-d163c646.js.map → tslib.es6-ca21063f.js.map} +1 -1
  414. package/{types-490489b7.js → types-d5ea9376.js} +1 -1
  415. package/{types-490489b7.js.map → types-d5ea9376.js.map} +1 -1
  416. package/ui/Accordion.js +3 -3
  417. package/ui/AccordionGroup.js +2 -2
  418. package/ui/AdminMessage.js +3 -3
  419. package/ui/Avatar.js +2 -2
  420. package/ui/Badge.js +5 -5
  421. package/ui/BottomSheet.js +1 -1
  422. package/ui/Button.js +3 -3
  423. package/ui/ChannelAvatar.js +3 -3
  424. package/ui/ConnectionStatus.js +4 -4
  425. package/ui/ContextMenu.js +7 -6
  426. package/ui/ContextMenu.js.map +1 -1
  427. package/ui/DateSeparator.js +4 -4
  428. package/ui/EmojiReactions.js +7 -7
  429. package/ui/FileMessageItemBody.js +6 -6
  430. package/ui/FileViewer.js +8 -8
  431. package/ui/IconButton.js +1 -1
  432. package/ui/ImageRenderer.js +1 -1
  433. package/ui/Input.js +2 -2
  434. package/ui/Label.js +2 -2
  435. package/ui/LinkLabel.js +2 -2
  436. package/ui/Loader.js +1 -1
  437. package/ui/MentionLabel.js +11 -11
  438. package/ui/MessageContent.js +35 -34
  439. package/ui/MessageContent.js.map +1 -1
  440. package/ui/MessageInput.js +9 -9
  441. package/ui/MessageItemMenu.js +11 -11
  442. package/ui/MessageItemMenu.js.map +1 -1
  443. package/ui/MessageItemReactionMenu.js +5 -5
  444. package/ui/MessageSearchFileItem.js +10 -10
  445. package/ui/MessageSearchItem.js +9 -9
  446. package/ui/MessageStatus.js +10 -10
  447. package/ui/Modal.js +7 -7
  448. package/ui/OGMessageItemBody.js +11 -11
  449. package/ui/OpenChannelAdminMessage.js +3 -3
  450. package/ui/OpenChannelAvatar.js +6 -6
  451. package/ui/OpenchannelConversationHeader.js +6 -6
  452. package/ui/OpenchannelFileMessage.js +33 -27
  453. package/ui/OpenchannelFileMessage.js.map +1 -1
  454. package/ui/OpenchannelOGMessage.js +32 -30
  455. package/ui/OpenchannelOGMessage.js.map +1 -1
  456. package/ui/OpenchannelThumbnailMessage.js +35 -29
  457. package/ui/OpenchannelThumbnailMessage.js.map +1 -1
  458. package/ui/OpenchannelUserMessage.js +32 -30
  459. package/ui/OpenchannelUserMessage.js.map +1 -1
  460. package/ui/PlaceHolder.js +6 -6
  461. package/ui/PlaybackTime.js +2 -2
  462. package/ui/QuoteMessage.js +6 -6
  463. package/ui/QuoteMessageInput.js +6 -6
  464. package/ui/ReactionBadge.js +3 -3
  465. package/ui/ReactionButton.js +1 -1
  466. package/ui/SortByRow.js +2 -2
  467. package/ui/TextButton.js +2 -2
  468. package/ui/TextMessageItemBody.js +11 -11
  469. package/ui/ThreadReplies.js +6 -6
  470. package/ui/ThumbnailMessageItemBody.js +2 -2
  471. package/ui/Tooltip.js +3 -3
  472. package/ui/TooltipWrapper.js +1 -1
  473. package/ui/UnknownMessageItemBody.js +6 -6
  474. package/ui/UserListItem.js +11 -11
  475. package/ui/UserProfile.js +10 -10
  476. package/ui/VoiceMessageItemBody.js +5 -5
  477. package/ui/VoiceMessgeInput.js +8 -8
  478. package/ui/Word.js +11 -11
  479. package/{useLongPress-a05b8d13.js → useLongPress-0dccc5ca.js} +3 -3
  480. package/{useLongPress-a05b8d13.js.map → useLongPress-0dccc5ca.js.map} +1 -1
  481. package/useSendbirdStateContext.js +1 -1
  482. package/utils/message/isVoiceMessage.js +2 -2
  483. package/{utils-e96969ad.js → utils-2088448e.js} +1 -1
  484. package/{utils-e96969ad.js.map → utils-2088448e.js.map} +1 -1
  485. package/{utils-49a0dde3.js → utils-3f271584.js} +1 -1
  486. package/{utils-49a0dde3.js.map → utils-3f271584.js.map} +1 -1
  487. package/{utils-3a9b2a5b.js → utils-a4003ad3.js} +1 -1
  488. package/{utils-3a9b2a5b.js.map → utils-a4003ad3.js.map} +1 -1
  489. package/{utils-14105f2b.js → utils-a9e361cf.js} +2 -2
  490. package/{utils-14105f2b.js.map → utils-a9e361cf.js.map} +1 -1
  491. package/{uuid-bf5599d8.js → uuid-e2d2f65c.js} +1 -1
  492. package/{uuid-bf5599d8.js.map → uuid-e2d2f65c.js.map} +1 -1
  493. package/withSendbird.js +1 -1
  494. package/ChannelProvider-43d68897.js.map +0 -1
  495. package/_rollupPluginBabelHelpers-b0efb0e7.js.map +0 -1
  496. package/cjs/ChannelProvider-d207316d.js.map +0 -1
  497. package/cjs/_rollupPluginBabelHelpers-24f49f41.js.map +0 -1
  498. package/cjs/const-d6a997ec.js.map +0 -1
  499. package/cjs/index-254f336f.js.map +0 -1
  500. package/const-8faafb2e.js.map +0 -1
  501. package/index-7e47ba7d.js.map +0 -1
package/cjs/dist/index.css CHANGED
@@ -58,97 +58,124 @@
58
58
  .sendbird-theme--dark .sendbird-openchannel-conversation-header__left__cover-image--icon {
59
59
  background-color: var(--sendbird-dark-background-300);
60
60
  }
61
- .sendbird-open-channel-list,
62
- .sendbird-open-channel-list-ui {
61
+ .sendbird-open-channel-preview {
63
62
  position: relative;
64
63
  display: inline-flex;
65
- flex-direction: column;
66
- width: 256px;
67
- min-width: 256px;
68
- height: 100%;
64
+ flex-direction: row;
65
+ width: 264px;
66
+ height: 58px;
67
+ min-width: 264px;
68
+ min-height: 58px;
69
69
  box-sizing: border-box;
70
70
  }
71
- .sendbird--mobile-mode .sendbird-open-channel-list,
72
- .sendbird--mobile-mode .sendbird-open-channel-list-ui {
71
+ .sendbird--mobile-mode .sendbird-open-channel-preview {
73
72
  width: 100%;
74
73
  }
75
- .sendbird-theme--light .sendbird-open-channel-list,
76
- .sendbird-theme--light .sendbird-open-channel-list-ui {
77
- border-right: solid 1px var(--sendbird-light-onlight-04);
74
+ .sendbird-theme--light .sendbird-open-channel-preview {
75
+ background-color: var(--sendbird-light-background-50);
76
+ border-bottom: solid 1px var(--sendbird-light-onlight-04);
78
77
  }
79
- .sendbird-theme--dark .sendbird-open-channel-list,
80
- .sendbird-theme--dark .sendbird-open-channel-list-ui {
81
- border-right: solid 1px var(--sendbird-dark-ondark-04);
78
+ .sendbird-theme--dark .sendbird-open-channel-preview {
79
+ background-color: var(--sendbird-dark-background-600);
80
+ border-bottom: solid 1px var(--sendbird-dark-ondark-04);
82
81
  }
83
- .sendbird-open-channel-list .sendbird-open-channel-list-ui__header,
84
- .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header {
85
- position: relative;
86
- display: inline-flex;
87
- flex-direction: row;
88
- align-items: center;
89
- width: 100%;
90
- height: 64px;
91
- box-sizing: border-box;
82
+ .sendbird-theme--light .sendbird-open-channel-preview:hover {
83
+ background-color: var(--sendbird-light-background-100);
92
84
  }
93
- .sendbird-theme--light .sendbird-open-channel-list .sendbird-open-channel-list-ui__header,
94
- .sendbird-theme--light .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header {
95
- border-bottom: solid 1px var(--sendbird-light-onlight-04);
85
+ .sendbird-theme--dark .sendbird-open-channel-preview:hover {
86
+ background-color: var(--sendbird-dark-background-500);
96
87
  }
97
- .sendbird-theme--dark .sendbird-open-channel-list .sendbird-open-channel-list-ui__header,
98
- .sendbird-theme--dark .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header {
99
- border-bottom: solid 1px var(--sendbird-dark-ondark-04);
88
+ .sendbird-theme--light .sendbird-open-channel-preview.selected {
89
+ background-color: var(--sendbird-light-primary-100);
90
+ border-left: solid 4px var(--sendbird-light-primary-300);
100
91
  }
101
- .sendbird-open-channel-list .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__title,
102
- .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__title {
92
+ .sendbird-theme--dark .sendbird-open-channel-preview.selected {
93
+ background-color: var(--sendbird-dark-primary-300);
94
+ border-left: solid 4px var(--sendbird-dark-primary-200);
95
+ }
96
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__cover-image {
103
97
  position: relative;
104
- margin-left: 24px;
98
+ margin-top: 8px;
99
+ margin-left: 16px;
105
100
  display: inline-flex;
106
101
  align-items: center;
102
+ justify-content: center;
103
+ width: 42px;
104
+ height: 42px;
107
105
  box-sizing: border-box;
108
106
  }
109
- .sendbird-open-channel-list .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-refresh,
110
- .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-refresh {
111
- position: absolute;
112
- top: 16px;
113
- right: 56px;
107
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__cover-image .sendbird-open-channel-preview__cover-image__avatar,
108
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__cover-image .sendbird-open-channel-preview__cover-image__avatar--default {
109
+ position: relative;
114
110
  display: inline-flex;
115
111
  align-items: center;
116
112
  justify-content: center;
117
113
  box-sizing: border-box;
118
114
  }
119
- .sendbird-open-channel-list .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-create-channel,
120
- .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-create-channel {
121
- position: absolute;
122
- top: 16px;
123
- right: 16px;
115
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context {
116
+ position: relative;
117
+ margin-top: 8px;
118
+ margin-left: 16px;
124
119
  display: inline-flex;
125
- align-items: center;
126
- justify-content: center;
120
+ flex-direction: column;
121
+ max-width: 178px;
127
122
  box-sizing: border-box;
128
123
  }
129
- .sendbird-open-channel-list .sendbird-open-channel-list-ui__channel-list,
130
- .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__channel-list {
124
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title {
131
125
  position: relative;
132
126
  display: inline-flex;
133
- flex-direction: column;
127
+ flex-direction: row;
128
+ align-items: center;
134
129
  width: 100%;
135
- height: calc(100% - 64px);
130
+ height: 16px;
136
131
  box-sizing: border-box;
137
- overflow-y: scroll;
138
132
  }
139
-
140
- .sendbird-open-channel-list-ui__channel-list--place-holder--loading {
133
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title .sendbird-open-channel-preview__context__title__channel-name {
141
134
  position: relative;
142
- min-height: 62px;
135
+ display: inline-block;
136
+ max-width: 100%;
137
+ height: 100%;
138
+ box-sizing: border-box;
139
+ overflow-x: hidden;
140
+ text-overflow: ellipsis;
141
+ word-break: keep-all;
142
+ }
143
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title .sendbird-open-channel-preview__context__title__channel-name.frozen {
144
+ max-width: calc(100% - 20px);
145
+ }
146
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title .sendbird-open-channel-preview__context__title__frozen {
147
+ position: relative;
148
+ margin-left: 4px;
149
+ display: inline-flex;
150
+ }
151
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__participants {
152
+ position: relative;
153
+ margin-top: 8px;
143
154
  display: inline-flex;
155
+ flex-direction: row;
144
156
  align-items: center;
145
- justify-content: center;
157
+ width: 100%;
158
+ height: 14px;
159
+ box-sizing: border-box;
146
160
  }
147
- .sendbird-theme--light .sendbird-open-channel-list-ui__channel-list--place-holder--loading {
148
- background-color: var(--sendbird-light-background-100);
161
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__participants .sendbird-open-channel-preview__context__participants__icon {
162
+ position: relative;
163
+ display: inline-flex;
164
+ width: 14px;
165
+ height: 14px;
166
+ box-sizing: border-box;
149
167
  }
150
- .sendbird-theme--dark .sendbird-open-channel-list-ui__channel-list--place-holder--loading {
151
- background-color: var(--sendbird-dark-background-500);
168
+ .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__participants .sendbird-open-channel-preview__context__participants__count {
169
+ position: relative;
170
+ margin-left: 4px;
171
+ display: inline-flex;
172
+ width: 160px;
173
+ max-width: 160px;
174
+ height: 12px;
175
+ box-sizing: border-box;
176
+ overflow-x: hidden;
177
+ text-overflow: ellipsis;
178
+ word-break: keep-all;
152
179
  }
153
180
  .sendbird-create-open-channel-ui {
154
181
  position: relative;
@@ -205,124 +232,97 @@
205
232
  display: inline-flex;
206
233
  flex-direction: row;
207
234
  }
208
- .sendbird-open-channel-preview {
235
+ .sendbird-open-channel-list,
236
+ .sendbird-open-channel-list-ui {
209
237
  position: relative;
210
238
  display: inline-flex;
211
- flex-direction: row;
212
- width: 264px;
213
- height: 58px;
214
- min-width: 264px;
215
- min-height: 58px;
239
+ flex-direction: column;
240
+ width: 256px;
241
+ min-width: 256px;
242
+ height: 100%;
216
243
  box-sizing: border-box;
217
244
  }
218
- .sendbird--mobile-mode .sendbird-open-channel-preview {
245
+ .sendbird--mobile-mode .sendbird-open-channel-list,
246
+ .sendbird--mobile-mode .sendbird-open-channel-list-ui {
219
247
  width: 100%;
220
248
  }
221
- .sendbird-theme--light .sendbird-open-channel-preview {
222
- background-color: var(--sendbird-light-background-50);
223
- border-bottom: solid 1px var(--sendbird-light-onlight-04);
224
- }
225
- .sendbird-theme--dark .sendbird-open-channel-preview {
226
- background-color: var(--sendbird-dark-background-600);
227
- border-bottom: solid 1px var(--sendbird-dark-ondark-04);
249
+ .sendbird-theme--light .sendbird-open-channel-list,
250
+ .sendbird-theme--light .sendbird-open-channel-list-ui {
251
+ border-right: solid 1px var(--sendbird-light-onlight-04);
228
252
  }
229
- .sendbird-theme--light .sendbird-open-channel-preview:hover {
230
- background-color: var(--sendbird-light-background-100);
253
+ .sendbird-theme--dark .sendbird-open-channel-list,
254
+ .sendbird-theme--dark .sendbird-open-channel-list-ui {
255
+ border-right: solid 1px var(--sendbird-dark-ondark-04);
231
256
  }
232
- .sendbird-theme--dark .sendbird-open-channel-preview:hover {
233
- background-color: var(--sendbird-dark-background-500);
257
+ .sendbird-open-channel-list .sendbird-open-channel-list-ui__header,
258
+ .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header {
259
+ position: relative;
260
+ display: inline-flex;
261
+ flex-direction: row;
262
+ align-items: center;
263
+ width: 100%;
264
+ height: 64px;
265
+ box-sizing: border-box;
234
266
  }
235
- .sendbird-theme--light .sendbird-open-channel-preview.selected {
236
- background-color: var(--sendbird-light-primary-100);
237
- border-left: solid 4px var(--sendbird-light-primary-300);
267
+ .sendbird-theme--light .sendbird-open-channel-list .sendbird-open-channel-list-ui__header,
268
+ .sendbird-theme--light .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header {
269
+ border-bottom: solid 1px var(--sendbird-light-onlight-04);
238
270
  }
239
- .sendbird-theme--dark .sendbird-open-channel-preview.selected {
240
- background-color: var(--sendbird-dark-primary-300);
241
- border-left: solid 4px var(--sendbird-dark-primary-200);
271
+ .sendbird-theme--dark .sendbird-open-channel-list .sendbird-open-channel-list-ui__header,
272
+ .sendbird-theme--dark .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header {
273
+ border-bottom: solid 1px var(--sendbird-dark-ondark-04);
242
274
  }
243
- .sendbird-open-channel-preview .sendbird-open-channel-preview__cover-image {
275
+ .sendbird-open-channel-list .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__title,
276
+ .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__title {
244
277
  position: relative;
245
- margin-top: 8px;
246
- margin-left: 16px;
278
+ margin-left: 24px;
247
279
  display: inline-flex;
248
280
  align-items: center;
249
- justify-content: center;
250
- width: 42px;
251
- height: 42px;
252
281
  box-sizing: border-box;
253
282
  }
254
- .sendbird-open-channel-preview .sendbird-open-channel-preview__cover-image .sendbird-open-channel-preview__cover-image__avatar,
255
- .sendbird-open-channel-preview .sendbird-open-channel-preview__cover-image .sendbird-open-channel-preview__cover-image__avatar--default {
256
- position: relative;
283
+ .sendbird-open-channel-list .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-refresh,
284
+ .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-refresh {
285
+ position: absolute;
286
+ top: 16px;
287
+ right: 56px;
257
288
  display: inline-flex;
258
289
  align-items: center;
259
290
  justify-content: center;
260
291
  box-sizing: border-box;
261
292
  }
262
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context {
263
- position: relative;
264
- margin-top: 8px;
265
- margin-left: 16px;
293
+ .sendbird-open-channel-list .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-create-channel,
294
+ .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__header .sendbird-open-channel-list-ui__header__button-create-channel {
295
+ position: absolute;
296
+ top: 16px;
297
+ right: 16px;
266
298
  display: inline-flex;
267
- flex-direction: column;
268
- max-width: 178px;
299
+ align-items: center;
300
+ justify-content: center;
269
301
  box-sizing: border-box;
270
302
  }
271
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title {
303
+ .sendbird-open-channel-list .sendbird-open-channel-list-ui__channel-list,
304
+ .sendbird-open-channel-list-ui .sendbird-open-channel-list-ui__channel-list {
272
305
  position: relative;
273
306
  display: inline-flex;
274
- flex-direction: row;
275
- align-items: center;
307
+ flex-direction: column;
276
308
  width: 100%;
277
- height: 16px;
278
- box-sizing: border-box;
279
- }
280
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title .sendbird-open-channel-preview__context__title__channel-name {
281
- position: relative;
282
- display: inline-block;
283
- max-width: 100%;
284
- height: 100%;
309
+ height: calc(100% - 64px);
285
310
  box-sizing: border-box;
286
- overflow-x: hidden;
287
- text-overflow: ellipsis;
288
- word-break: keep-all;
289
- }
290
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title .sendbird-open-channel-preview__context__title__channel-name.frozen {
291
- max-width: calc(100% - 20px);
292
- }
293
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__title .sendbird-open-channel-preview__context__title__frozen {
294
- position: relative;
295
- margin-left: 4px;
296
- display: inline-flex;
311
+ overflow-y: scroll;
297
312
  }
298
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__participants {
313
+
314
+ .sendbird-open-channel-list-ui__channel-list--place-holder--loading {
299
315
  position: relative;
300
- margin-top: 8px;
316
+ min-height: 62px;
301
317
  display: inline-flex;
302
- flex-direction: row;
303
318
  align-items: center;
304
- width: 100%;
305
- height: 14px;
306
- box-sizing: border-box;
319
+ justify-content: center;
307
320
  }
308
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__participants .sendbird-open-channel-preview__context__participants__icon {
309
- position: relative;
310
- display: inline-flex;
311
- width: 14px;
312
- height: 14px;
313
- box-sizing: border-box;
321
+ .sendbird-theme--light .sendbird-open-channel-list-ui__channel-list--place-holder--loading {
322
+ background-color: var(--sendbird-light-background-100);
314
323
  }
315
- .sendbird-open-channel-preview .sendbird-open-channel-preview__context .sendbird-open-channel-preview__context__participants .sendbird-open-channel-preview__context__participants__count {
316
- position: relative;
317
- margin-left: 4px;
318
- display: inline-flex;
319
- width: 160px;
320
- max-width: 160px;
321
- height: 12px;
322
- box-sizing: border-box;
323
- overflow-x: hidden;
324
- text-overflow: ellipsis;
325
- word-break: keep-all;
324
+ .sendbird-theme--dark .sendbird-open-channel-list-ui__channel-list--place-holder--loading {
325
+ background-color: var(--sendbird-dark-background-500);
326
326
  }
327
327
  @import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&display=swap");
328
328
  :root {
@@ -2561,7 +2561,11 @@
2561
2561
  .sendbird-chat-header__icon_back {
2562
2562
  margin-right: 8px;
2563
2563
  }
2564
+ .sendbird-conversation__messages {
2565
+ position: relative;
2566
+ }
2564
2567
  .sendbird-conversation__messages .sendbird-conversation__messages-padding {
2568
+ position: relative;
2565
2569
  padding-left: 24px;
2566
2570
  padding-right: 24px;
2567
2571
  height: 100%;
@@ -2574,6 +2578,13 @@
2574
2578
  padding-bottom: 8px;
2575
2579
  }
2576
2580
 
2581
+ .sendbird-conversation__messages__notification {
2582
+ position: fixed;
2583
+ top: 0px;
2584
+ width: calc(100% - 50px);
2585
+ margin-left: 25px;
2586
+ }
2587
+
2577
2588
  .sendbird-conversation__scroll-bottom-button {
2578
2589
  position: sticky;
2579
2590
  display: flex;
@@ -4339,6 +4350,11 @@ div.sendbird-og-message-item-body__text-bubble {
4339
4350
  justify-content: center;
4340
4351
  align-items: center;
4341
4352
  }
4353
+ .sendbird-notification--hide,
4354
+ .sendbird-notification {
4355
+ position: absolute;
4356
+ }
4357
+
4342
4358
  .sendbird-notification {
4343
4359
  margin-top: 8px;
4344
4360
  margin-left: 24px;
@@ -4383,6 +4399,10 @@ div.sendbird-og-message-item-body__text-bubble {
4383
4399
  justify-content: center;
4384
4400
  margin-right: 8px;
4385
4401
  }
4402
+
4403
+ .sendbird-notification--hide {
4404
+ display: none;
4405
+ }
4386
4406
  .sendbird-notification {
4387
4407
  margin-top: 8px;
4388
4408
  margin-left: 24px;