stream-chat-react-native-core 8.13.7 → 9.0.0-beta.2

package/lib/module/components/Channel/Channel.js

@@ -3,10 +3,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.reactionData = exports.Channel = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _debounce = _interopRequireDefault(require("lodash/debounce"));
@@ -23,12 +23,7 @@ var _useCreateThreadContext = require("./hooks/useCreateThreadContext");
 var _useCreateTypingContext = require("./hooks/useCreateTypingContext");
 var _useMessageListPagination = require("./hooks/useMessageListPagination");
 var _useTargetedMessage2 = require("./hooks/useTargetedMessage");
-var _CameraSelectorIcon = require("../../components/AttachmentPicker/components/CameraSelectorIcon");
-var _FileSelectorIcon = require("../../components/AttachmentPicker/components/FileSelectorIcon");
-var _ImageSelectorIcon = require("../../components/AttachmentPicker/components/ImageSelectorIcon");
-var _VideoRecorderSelectorIcon = require("../../components/AttachmentPicker/components/VideoRecorderSelectorIcon");
-var _CreatePollIcon = require("../../components/Poll/components/CreatePollIcon");
-var _contexts = require("../../contexts");
+var _AttachmentPickerContext = require("../../contexts/attachmentPickerContext/AttachmentPickerContext");
 var _AudioPlayerContext = require("../../contexts/audioPlayerContext/AudioPlayerContext");
 var _ChannelContext = require("../../contexts/channelContext/ChannelContext");
 var _useChannelState2 = require("../../contexts/channelsStateContext/useChannelState");
@@ -46,80 +41,88 @@ var _hooks = require("../../hooks");
 var _useAppStateListener = require("../../hooks/useAppStateListener");
 var _useAttachmentPickerBottomSheet = require("../../hooks/useAttachmentPickerBottomSheet");
 var _usePrunableMessageList = require("../../hooks/usePrunableMessageList");
-var _icons = require("../../icons");
 var _native = require("../../native");
 var _channelUnreadState = require("../../state-store/channel-unread-state");
+var _messageInputHeightStore = require("../../state-store/message-input-height-store");
+var _theme = require("../../theme");
 var _types = require("../../types/types");
 var _addReactionToLocalState = require("../../utils/addReactionToLocalState");
 var _compressImage = require("../../utils/compressImage");
 var _patchMessageTextCommand = require("../../utils/patchMessageTextCommand");
 var _utils = require("../../utils/utils");
 var _Attachment = require("../Attachment/Attachment");
-var _AttachmentActions = require("../Attachment/AttachmentActions");
-var _AudioAttachment = require("../Attachment/AudioAttachment");
-var _Card = require("../Attachment/Card");
+var _Audio = require("../Attachment/Audio");
 var _FileAttachment = require("../Attachment/FileAttachment");
 var _FileAttachmentGroup = require("../Attachment/FileAttachmentGroup");
 var _FileIcon = require("../Attachment/FileIcon");
+var _FilePreview = require("../Attachment/FilePreview");
 var _Gallery = require("../Attachment/Gallery");
 var _Giphy = require("../Attachment/Giphy");
 var _ImageLoadingFailedIndicator = require("../Attachment/ImageLoadingFailedIndicator");
 var _ImageLoadingIndicator = require("../Attachment/ImageLoadingIndicator");
-var _ImageReloadIndicator = require("../Attachment/ImageReloadIndicator");
+var _UnsupportedAttachment = require("../Attachment/UnsupportedAttachment");
+var _UrlPreview = require("../Attachment/UrlPreview");
+var _URLPreviewCompact = require("../Attachment/UrlPreview/URLPreviewCompact");
 var _VideoThumbnail = require("../Attachment/VideoThumbnail");
 var _AttachmentPicker = require("../AttachmentPicker/AttachmentPicker");
-var _AttachmentPickerBottomSheetHandle = require("../AttachmentPicker/components/AttachmentPickerBottomSheetHandle");
-var _AttachmentPickerError = require("../AttachmentPicker/components/AttachmentPickerError");
-var _AttachmentPickerErrorImage = require("../AttachmentPicker/components/AttachmentPickerErrorImage");
-var _AttachmentPickerIOSSelectMorePhotos = require("../AttachmentPicker/components/AttachmentPickerIOSSelectMorePhotos");
+var _AttachmentPickerContent = require("../AttachmentPicker/components/AttachmentPickerContent");
 var _AttachmentPickerSelectionBar = require("../AttachmentPicker/components/AttachmentPickerSelectionBar");
 var _ImageOverlaySelectedComponent = require("../AttachmentPicker/components/ImageOverlaySelectedComponent");
 var _AutoCompleteSuggestionHeader = require("../AutoCompleteInput/AutoCompleteSuggestionHeader");
 var _AutoCompleteSuggestionItem = require("../AutoCompleteInput/AutoCompleteSuggestionItem");
 var _AutoCompleteSuggestionList = require("../AutoCompleteInput/AutoCompleteSuggestionList");
+var _InputView = require("../AutoCompleteInput/InputView");
 var _EmptyStateIndicator = require("../Indicators/EmptyStateIndicator");
 var _LoadingErrorIndicator = require("../Indicators/LoadingErrorIndicator");
 var _LoadingIndicator = require("../Indicators/LoadingIndicator");
-var _KeyboardCompatibleView = require("../KeyboardCompatibleView/KeyboardCompatibleView");
+var _KeyboardControllerAvoidingView = require("../KeyboardCompatibleView/KeyboardControllerAvoidingView");
 var _Message = require("../Message/Message");
-var _MessageAvatar = require("../Message/MessageSimple/MessageAvatar");
-var _MessageBlocked = require("../Message/MessageSimple/MessageBlocked");
-var _MessageBounce = require("../Message/MessageSimple/MessageBounce");
-var _MessageContent = require("../Message/MessageSimple/MessageContent");
-var _MessageDeleted = require("../Message/MessageSimple/MessageDeleted");
-var _MessageEditedTimestamp = require("../Message/MessageSimple/MessageEditedTimestamp");
-var _MessageError = require("../Message/MessageSimple/MessageError");
-var _MessageFooter = require("../Message/MessageSimple/MessageFooter");
-var _MessagePinnedHeader = require("../Message/MessageSimple/MessagePinnedHeader");
-var _MessageReplies = require("../Message/MessageSimple/MessageReplies");
-var _MessageRepliesAvatars = require("../Message/MessageSimple/MessageRepliesAvatars");
-var _MessageSimple = require("../Message/MessageSimple/MessageSimple");
-var _MessageStatus = require("../Message/MessageSimple/MessageStatus");
-var _MessageSwipeContent = require("../Message/MessageSimple/MessageSwipeContent");
-var _MessageTimestamp = require("../Message/MessageSimple/MessageTimestamp");
-var _ReactionListBottom = require("../Message/MessageSimple/ReactionList/ReactionListBottom");
-var _ReactionListTop = require("../Message/MessageSimple/ReactionList/ReactionListTop");
-var _StreamingMessageView = require("../Message/MessageSimple/StreamingMessageView");
-var _AttachButton = require("../MessageInput/AttachButton");
-var _AttachmentUploadPreviewList = require("../MessageInput/AttachmentUploadPreviewList");
-var _CommandsButton = require("../MessageInput/CommandsButton");
+var _MessagePinnedHeader = require("../Message/MessageItemView/Headers/MessagePinnedHeader");
+var _MessageReminderHeader = require("../Message/MessageItemView/Headers/MessageReminderHeader");
+var _MessageSavedForLaterHeader = require("../Message/MessageItemView/Headers/MessageSavedForLaterHeader");
+var _SentToChannelHeader = require("../Message/MessageItemView/Headers/SentToChannelHeader");
+var _MessageAuthor = require("../Message/MessageItemView/MessageAuthor");
+var _MessageBlocked = require("../Message/MessageItemView/MessageBlocked");
+var _MessageBounce = require("../Message/MessageItemView/MessageBounce");
+var _MessageContent = require("../Message/MessageItemView/MessageContent");
+var _MessageDeleted = require("../Message/MessageItemView/MessageDeleted");
+var _MessageError = require("../Message/MessageItemView/MessageError");
+var _MessageFooter = require("../Message/MessageItemView/MessageFooter");
+var _MessageHeader = require("../Message/MessageItemView/MessageHeader");
+var _MessageItemView = require("../Message/MessageItemView/MessageItemView");
+var _MessageReplies = require("../Message/MessageItemView/MessageReplies");
+var _MessageRepliesAvatars = require("../Message/MessageItemView/MessageRepliesAvatars");
+var _MessageStatus = require("../Message/MessageItemView/MessageStatus");
+var _MessageSwipeContent = require("../Message/MessageItemView/MessageSwipeContent");
+var _MessageTimestamp = require("../Message/MessageItemView/MessageTimestamp");
+var _ReactionListBottom = require("../Message/MessageItemView/ReactionList/ReactionListBottom");
+var _ReactionListClustered = require("../Message/MessageItemView/ReactionList/ReactionListClustered");
+var _ReactionListItem = require("../Message/MessageItemView/ReactionList/ReactionListItem");
+var _ReactionListItemWrapper = require("../Message/MessageItemView/ReactionList/ReactionListItemWrapper");
+var _ReactionListTop = require("../Message/MessageItemView/ReactionList/ReactionListTop");
+var _StreamingMessageView = require("../Message/MessageItemView/StreamingMessageView");
+var _AttachmentUploadPreviewList = require("../MessageInput/components/AttachmentPreview/AttachmentUploadPreviewList");
 var _AttachmentUploadProgressIndicator = require("../MessageInput/components/AttachmentPreview/AttachmentUploadProgressIndicator");
 var _AudioAttachmentUploadPreview = require("../MessageInput/components/AttachmentPreview/AudioAttachmentUploadPreview");
 var _FileAttachmentUploadPreview = require("../MessageInput/components/AttachmentPreview/FileAttachmentUploadPreview");
 var _ImageAttachmentUploadPreview = require("../MessageInput/components/AttachmentPreview/ImageAttachmentUploadPreview");
+var _VideoAttachmentUploadPreview = require("../MessageInput/components/AttachmentPreview/VideoAttachmentUploadPreview");
 var _AudioRecorder = require("../MessageInput/components/AudioRecorder/AudioRecorder");
 var _AudioRecordingButton = require("../MessageInput/components/AudioRecorder/AudioRecordingButton");
 var _AudioRecordingInProgress = require("../MessageInput/components/AudioRecorder/AudioRecordingInProgress");
 var _AudioRecordingLockIndicator = require("../MessageInput/components/AudioRecorder/AudioRecordingLockIndicator");
 var _AudioRecordingPreview = require("../MessageInput/components/AudioRecorder/AudioRecordingPreview");
 var _AudioRecordingWaveform = require("../MessageInput/components/AudioRecorder/AudioRecordingWaveform");
-var _CommandInput = require("../MessageInput/components/CommandInput");
-var _InputEditingStateHeader = require("../MessageInput/components/InputEditingStateHeader");
-var _InputReplyStateHeader = require("../MessageInput/components/InputReplyStateHeader");
-var _CooldownTimer = require("../MessageInput/CooldownTimer");
-var _InputButtons = require("../MessageInput/InputButtons");
-var _MoreOptionsButton = require("../MessageInput/MoreOptionsButton");
-var _SendButton = require("../MessageInput/SendButton");
+var _InputButtons = require("../MessageInput/components/InputButtons");
+var _AttachButton = require("../MessageInput/components/InputButtons/AttachButton");
+var _CooldownTimer = require("../MessageInput/components/OutputButtons/CooldownTimer");
+var _SendButton = require("../MessageInput/components/OutputButtons/SendButton");
+var _MessageComposerLeadingView = require("../MessageInput/MessageComposerLeadingView");
+var _MessageComposerTrailingView = require("../MessageInput/MessageComposerTrailingView");
+var _MessageInputFooterView = require("../MessageInput/MessageInputFooterView");
+var _MessageInputHeaderView = require("../MessageInput/MessageInputHeaderView");
+var _MessageInputLeadingView = require("../MessageInput/MessageInputLeadingView");
+var _MessageInputTrailingView = require("../MessageInput/MessageInputTrailingView");
 var _SendMessageDisallowedIndicator = require("../MessageInput/SendMessageDisallowedIndicator");
 var _ShowThreadMessageInChannelButton = require("../MessageInput/ShowThreadMessageInChannelButton");
 var _StopMessageStreamingButton = require("../MessageInput/StopMessageStreamingButton");
@@ -134,6 +137,8 @@ var _StickyHeader = require("../MessageList/StickyHeader");
 var _TypingIndicator = require("../MessageList/TypingIndicator");
 var _TypingIndicatorContainer = require("../MessageList/TypingIndicatorContainer");
 var _UnreadMessagesNotification = require("../MessageList/UnreadMessagesNotification");
+var _EmojiPickerList = require("../MessageMenu/EmojiPickerList");
+var _emojis = require("../MessageMenu/emojis");
 var _MessageActionList = require("../MessageMenu/MessageActionList");
 var _MessageActionListItem = require("../MessageMenu/MessageActionListItem");
 var _MessageMenu = require("../MessageMenu/MessageMenu");
@@ -149,28 +154,74 @@ var _this = this,
   _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/Channel/Channel.tsx";
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var styles = _reactNative.StyleSheet.create({
-  selectChannel: {
-    fontWeight: 'bold',
-    padding: 16
-  }
-});
 var reactionData = exports.reactionData = [{
-  Icon: _icons.LoveReaction,
-  type: 'love'
+  Icon: function Icon(_ref) {
+    var _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 12 : _ref$size;
+    return (0, _jsxRuntime.jsx)(_EmojiPickerList.Emoji, {
+      item: '👍',
+      size: size
+    });
+  },
+  type: 'like',
+  isMain: true
 }, {
-  Icon: _icons.ThumbsUpReaction,
-  type: 'like'
+  Icon: function Icon(_ref2) {
+    var _ref2$size = _ref2.size,
+      size = _ref2$size === void 0 ? 12 : _ref2$size;
+    return (0, _jsxRuntime.jsx)(_EmojiPickerList.Emoji, {
+      item: '😂',
+      size: size
+    });
+  },
+  type: 'haha',
+  isMain: true
 }, {
-  Icon: _icons.ThumbsDownReaction,
-  type: 'sad'
+  Icon: function Icon(_ref3) {
+    var _ref3$size = _ref3.size,
+      size = _ref3$size === void 0 ? 12 : _ref3$size;
+    return (0, _jsxRuntime.jsx)(_EmojiPickerList.Emoji, {
+      item: '❤️',
+      size: size
+    });
+  },
+  type: 'love',
+  isMain: true
 }, {
-  Icon: _icons.LOLReaction,
-  type: 'haha'
+  Icon: function Icon(_ref4) {
+    var _ref4$size = _ref4.size,
+      size = _ref4$size === void 0 ? 12 : _ref4$size;
+    return (0, _jsxRuntime.jsx)(_EmojiPickerList.Emoji, {
+      item: '😮',
+      size: size
+    });
+  },
+  type: 'wow',
+  isMain: true
 }, {
-  Icon: _icons.WutReaction,
-  type: 'wow'
-}];
+  Icon: function Icon(_ref5) {
+    var _ref5$size = _ref5.size,
+      size = _ref5$size === void 0 ? 12 : _ref5$size;
+    return (0, _jsxRuntime.jsx)(_EmojiPickerList.Emoji, {
+      item: '😢',
+      size: size
+    });
+  },
+  type: 'sad',
+  isMain: true
+}].concat((0, _toConsumableArray2.default)(_emojis.emojis.map(function (emoji) {
+  return {
+    Icon: function Icon(_ref6) {
+      var _ref6$size = _ref6.size,
+        size = _ref6$size === void 0 ? 12 : _ref6$size;
+      return (0, _jsxRuntime.jsx)(_EmojiPickerList.Emoji, {
+        item: emoji,
+        size: size
+      });
+    },
+    type: (0, _MessageReactionPicker.toUnicodeScalarString)(emoji)
+  };
+})));
 var scrollToFirstUnreadThreshold = 0;
 var defaultThrottleInterval = 500;
 var defaultDebounceInterval = 500;
@@ -184,9 +235,9 @@ var debounceOptions = {
 };
 var ChannelWithContext = function ChannelWithContext(props) {
   var _channel$getConfig, _channel$data, _channelState$members, _channelState$read, _clientChannelConfig$, _channelMessagesState2, _channelState$typing, _channelMessagesState3;
-  var _useViewport = (0, _hooks.useViewport)(),
-    vh = _useViewport.vh;
-  var additionalKeyboardAvoidingViewProps = props.additionalKeyboardAvoidingViewProps,
+  var _props$disableAttachm = props.disableAttachmentPicker,
+    disableAttachmentPicker = _props$disableAttachm === void 0 ? !(0, _native.isImageMediaLibraryAvailable)() : _props$disableAttachm,
+    additionalKeyboardAvoidingViewProps = props.additionalKeyboardAvoidingViewProps,
     additionalPressableProps = props.additionalPressableProps,
     additionalTextInputProps = props.additionalTextInputProps,
     _props$allowConcurren = props.allowConcurrentAudioPlayback,
@@ -200,25 +251,19 @@ var ChannelWithContext = function ChannelWithContext(props) {
     _props$asyncMessagesM2 = props.asyncMessagesMultiSendEnabled,
     asyncMessagesMultiSendEnabled = _props$asyncMessagesM2 === void 0 ? true : _props$asyncMessagesM2,
     _props$asyncMessagesS = props.asyncMessagesSlideToCancelDistance,
-    asyncMessagesSlideToCancelDistance = _props$asyncMessagesS === void 0 ? 100 : _props$asyncMessagesS,
+    asyncMessagesSlideToCancelDistance = _props$asyncMessagesS === void 0 ? 75 : _props$asyncMessagesS,
     _props$AttachButton = props.AttachButton,
     AttachButton = _props$AttachButton === void 0 ? _AttachButton.AttachButton : _props$AttachButton,
     _props$Attachment = props.Attachment,
     Attachment = _props$Attachment === void 0 ? _Attachment.Attachment : _props$Attachment,
-    _props$AttachmentActi = props.AttachmentActions,
-    AttachmentActions = _props$AttachmentActi === void 0 ? _AttachmentActions.AttachmentActions : _props$AttachmentActi,
-    _props$AttachmentPick = props.AttachmentPickerBottomSheetHandle,
-    AttachmentPickerBottomSheetHandle = _props$AttachmentPick === void 0 ? _AttachmentPickerBottomSheetHandle.AttachmentPickerBottomSheetHandle : _props$AttachmentPick,
-    _props$attachmentPick = props.attachmentPickerBottomSheetHandleHeight,
-    attachmentPickerBottomSheetHandleHeight = _props$attachmentPick === void 0 ? 20 : _props$attachmentPick,
-    _props$attachmentPick2 = props.attachmentPickerBottomSheetHeight,
-    attachmentPickerBottomSheetHeight = _props$attachmentPick2 === void 0 ? vh(45) : _props$attachmentPick2,
-    _props$AttachmentPick2 = props.AttachmentPickerSelectionBar,
-    AttachmentPickerSelectionBar = _props$AttachmentPick2 === void 0 ? _AttachmentPickerSelectionBar.AttachmentPickerSelectionBar : _props$AttachmentPick2,
+    _props$attachmentPick = props.attachmentPickerBottomSheetHeight,
+    attachmentPickerBottomSheetHeight = _props$attachmentPick === void 0 ? disableAttachmentPicker ? 72 : 333 : _props$attachmentPick,
+    _props$AttachmentPick = props.AttachmentPickerSelectionBar,
+    AttachmentPickerSelectionBar = _props$AttachmentPick === void 0 ? _AttachmentPickerSelectionBar.AttachmentPickerSelectionBar : _props$AttachmentPick,
     _props$attachmentSele = props.attachmentSelectionBarHeight,
-    attachmentSelectionBarHeight = _props$attachmentSele === void 0 ? 52 : _props$attachmentSele,
+    attachmentSelectionBarHeight = _props$attachmentSele === void 0 ? 72 : _props$attachmentSele,
     _props$AudioAttachmen = props.AudioAttachment,
-    AudioAttachment = _props$AudioAttachmen === void 0 ? _AudioAttachment.AudioAttachment : _props$AudioAttachmen,
+    AudioAttachment = _props$AudioAttachmen === void 0 ? _Audio.AudioAttachment : _props$AudioAttachmen,
     _props$AudioAttachmen2 = props.AudioAttachmentUploadPreview,
     AudioAttachmentUploadPreview = _props$AudioAttachmen2 === void 0 ? _AudioAttachmentUploadPreview.AudioAttachmentUploadPreview : _props$AudioAttachmen2,
     _props$AudioRecorder = props.AudioRecorder,
@@ -239,55 +284,31 @@ var ChannelWithContext = function ChannelWithContext(props) {
     AutoCompleteSuggestionItem = _props$AutoCompleteSu2 === void 0 ? _AutoCompleteSuggestionItem.AutoCompleteSuggestionItem : _props$AutoCompleteSu2,
     _props$AutoCompleteSu3 = props.AutoCompleteSuggestionList,
     AutoCompleteSuggestionList = _props$AutoCompleteSu3 === void 0 ? _AutoCompleteSuggestionList.AutoCompleteSuggestionList : _props$AutoCompleteSu3,
-    _props$AttachmentPick3 = props.AttachmentPickerError,
-    AttachmentPickerError = _props$AttachmentPick3 === void 0 ? _AttachmentPickerError.AttachmentPickerError : _props$AttachmentPick3,
-    _props$AttachmentPick4 = props.AttachmentPickerErrorImage,
-    AttachmentPickerErrorImage = _props$AttachmentPick4 === void 0 ? _AttachmentPickerErrorImage.AttachmentPickerErrorImage : _props$AttachmentPick4,
-    _props$AttachmentPick5 = props.AttachmentPickerIOSSelectMorePhotos,
-    AttachmentPickerIOSSelectMorePhotos = _props$AttachmentPick5 === void 0 ? _AttachmentPickerIOSSelectMorePhotos.AttachmentPickerIOSSelectMorePhotos : _props$AttachmentPick5,
     _props$AttachmentUplo = props.AttachmentUploadPreviewList,
     AttachmentUploadPreviewList = _props$AttachmentUplo === void 0 ? _AttachmentUploadPreviewList.AttachmentUploadPreviewList : _props$AttachmentUplo,
     _props$ImageOverlaySe = props.ImageOverlaySelectedComponent,
     ImageOverlaySelectedComponent = _props$ImageOverlaySe === void 0 ? _ImageOverlaySelectedComponent.ImageOverlaySelectedComponent : _props$ImageOverlaySe,
-    attachmentPickerErrorButtonText = props.attachmentPickerErrorButtonText,
-    attachmentPickerErrorText = props.attachmentPickerErrorText,
     _props$numberOfAttach = props.numberOfAttachmentImagesToLoadPerCall,
-    numberOfAttachmentImagesToLoadPerCall = _props$numberOfAttach === void 0 ? 60 : _props$numberOfAttach,
+    numberOfAttachmentImagesToLoadPerCall = _props$numberOfAttach === void 0 ? 25 : _props$numberOfAttach,
     _props$numberOfAttach2 = props.numberOfAttachmentPickerImageColumns,
     numberOfAttachmentPickerImageColumns = _props$numberOfAttach2 === void 0 ? 3 : _props$numberOfAttach2,
+    _props$giphyVersion = props.giphyVersion,
+    giphyVersion = _props$giphyVersion === void 0 ? 'fixed_height' : _props$giphyVersion,
     _props$bottomInset = props.bottomInset,
     bottomInset = _props$bottomInset === void 0 ? 0 : _props$bottomInset,
-    _props$CameraSelector = props.CameraSelectorIcon,
-    CameraSelectorIcon = _props$CameraSelector === void 0 ? _CameraSelectorIcon.CameraSelectorIcon : _props$CameraSelector,
-    _props$FileSelectorIc = props.FileSelectorIcon,
-    FileSelectorIcon = _props$FileSelectorIc === void 0 ? _FileSelectorIcon.FileSelectorIcon : _props$FileSelectorIc,
-    _props$CreatePollIcon = props.CreatePollIcon,
-    CreatePollIcon = _props$CreatePollIcon === void 0 ? _CreatePollIcon.CreatePollIcon : _props$CreatePollIcon,
-    _props$ImageSelectorI = props.ImageSelectorIcon,
-    ImageSelectorIcon = _props$ImageSelectorI === void 0 ? _ImageSelectorIcon.ImageSelectorIcon : _props$ImageSelectorI,
-    _props$VideoRecorderS = props.VideoRecorderSelectorIcon,
-    VideoRecorderSelectorIcon = _props$VideoRecorderS === void 0 ? _VideoRecorderSelectorIcon.VideoRecorderSelectorIcon : _props$VideoRecorderS,
-    _props$Card = props.Card,
-    Card = _props$Card === void 0 ? _Card.Card : _props$Card,
-    CardCover = props.CardCover,
-    CardFooter = props.CardFooter,
-    CardHeader = props.CardHeader,
     channel = props.channel,
     children = props.children,
     client = props.client,
-    _props$CommandsButton = props.CommandsButton,
-    CommandsButton = _props$CommandsButton === void 0 ? _CommandsButton.CommandsButton : _props$CommandsButton,
     compressImageQuality = props.compressImageQuality,
     _props$CooldownTimer = props.CooldownTimer,
     CooldownTimer = _props$CooldownTimer === void 0 ? _CooldownTimer.CooldownTimer : _props$CooldownTimer,
     CreatePollContent = props.CreatePollContent,
+    createPollOptionGap = props.createPollOptionGap,
     customMessageSwipeAction = props.customMessageSwipeAction,
     _props$DateHeader = props.DateHeader,
     DateHeader = _props$DateHeader === void 0 ? _DateHeader.DateHeader : _props$DateHeader,
     _props$deletedMessage = props.deletedMessagesVisibilityType,
     deletedMessagesVisibilityType = _props$deletedMessage === void 0 ? 'always' : _props$deletedMessage,
-    _props$disableAttachm = props.disableAttachmentPicker,
-    disableAttachmentPicker = _props$disableAttachm === void 0 ? !(0, _native.isImageMediaLibraryAvailable)() : _props$disableAttachm,
     _props$disableKeyboar = props.disableKeyboardCompatibleView,
     disableKeyboardCompatibleView = _props$disableKeyboar === void 0 ? false : _props$disableKeyboar,
     disableTypingIndicator = props.disableTypingIndicator,
@@ -317,17 +338,28 @@ var ChannelWithContext = function ChannelWithContext(props) {
     FileAttachmentGroup = _props$FileAttachment3 === void 0 ? _FileAttachmentGroup.FileAttachmentGroup : _props$FileAttachment3,
     _props$FileAttachment4 = props.FileAttachmentIcon,
     FileAttachmentIcon = _props$FileAttachment4 === void 0 ? _FileIcon.FileIcon : _props$FileAttachment4,
+    _props$FilePreview = props.FilePreview,
+    FilePreview = _props$FilePreview === void 0 ? _FilePreview.FilePreview : _props$FilePreview,
+    _props$FileUploadInPr = props.FileUploadInProgressIndicator,
+    FileUploadInProgressIndicator = _props$FileUploadInPr === void 0 ? _AttachmentUploadProgressIndicator.FileUploadInProgressIndicator : _props$FileUploadInPr,
+    _props$FileUploadRetr = props.FileUploadRetryIndicator,
+    FileUploadRetryIndicator = _props$FileUploadRetr === void 0 ? _AttachmentUploadProgressIndicator.FileUploadRetryIndicator : _props$FileUploadRetr,
+    _props$FileUploadNotS = props.FileUploadNotSupportedIndicator,
+    FileUploadNotSupportedIndicator = _props$FileUploadNotS === void 0 ? _AttachmentUploadProgressIndicator.FileUploadNotSupportedIndicator : _props$FileUploadNotS,
+    _props$ImageUploadInP = props.ImageUploadInProgressIndicator,
+    ImageUploadInProgressIndicator = _props$ImageUploadInP === void 0 ? _AttachmentUploadProgressIndicator.ImageUploadInProgressIndicator : _props$ImageUploadInP,
+    _props$ImageUploadRet = props.ImageUploadRetryIndicator,
+    ImageUploadRetryIndicator = _props$ImageUploadRet === void 0 ? _AttachmentUploadProgressIndicator.ImageUploadRetryIndicator : _props$ImageUploadRet,
+    _props$ImageUploadNot = props.ImageUploadNotSupportedIndicator,
+    ImageUploadNotSupportedIndicator = _props$ImageUploadNot === void 0 ? _AttachmentUploadProgressIndicator.ImageUploadNotSupportedIndicator : _props$ImageUploadNot,
     _props$FlatList = props.FlatList,
     FlatList = _props$FlatList === void 0 ? _native.NativeHandlers.FlatList : _props$FlatList,
     forceAlignMessages = props.forceAlignMessages,
     _props$Gallery = props.Gallery,
     Gallery = _props$Gallery === void 0 ? _Gallery.Gallery : _props$Gallery,
-    getMessagesGroupStyles = props.getMessagesGroupStyles,
     getMessageGroupStyle = props.getMessageGroupStyle,
     _props$Giphy = props.Giphy,
     Giphy = _props$Giphy === void 0 ? _Giphy.Giphy : _props$Giphy,
-    _props$giphyVersion = props.giphyVersion,
-    giphyVersion = _props$giphyVersion === void 0 ? 'fixed_height' : _props$giphyVersion,
     handleAttachButtonPress = props.handleAttachButtonPress,
     handleBan = props.handleBan,
     handleCopy = props.handleCopy,
@@ -342,6 +374,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     handleReaction = props.handleReaction,
     handleRetry = props.handleRetry,
     handleThreadReply = props.handleThreadReply,
+    handleBlockUser = props.handleBlockUser,
     _props$hasCameraPicke = props.hasCameraPicker,
     hasCameraPicker = _props$hasCameraPicke === void 0 ? (0, _native.isImagePickerAvailable)() : _props$hasCameraPicke,
     hasCommands = props.hasCommands,
@@ -360,8 +393,6 @@ var ChannelWithContext = function ChannelWithContext(props) {
     ImageLoadingFailedIndicator = _props$ImageLoadingFa === void 0 ? _ImageLoadingFailedIndicator.ImageLoadingFailedIndicator : _props$ImageLoadingFa,
     _props$ImageLoadingIn = props.ImageLoadingIndicator,
     ImageLoadingIndicator = _props$ImageLoadingIn === void 0 ? _ImageLoadingIndicator.ImageLoadingIndicator : _props$ImageLoadingIn,
-    _props$ImageReloadInd = props.ImageReloadIndicator,
-    ImageReloadIndicator = _props$ImageReloadInd === void 0 ? _ImageReloadIndicator.ImageReloadIndicator : _props$ImageReloadInd,
     _props$initialScrollT = props.initialScrollToFirstUnreadMessage,
     initialScrollToFirstUnreadMessage = _props$initialScrollT === void 0 ? false : _props$initialScrollT,
     _props$InlineDateSepa = props.InlineDateSeparator,
@@ -369,14 +400,14 @@ var ChannelWithContext = function ChannelWithContext(props) {
     _props$InlineUnreadIn = props.InlineUnreadIndicator,
     InlineUnreadIndicator = _props$InlineUnreadIn === void 0 ? _InlineUnreadIndicator.InlineUnreadIndicator : _props$InlineUnreadIn,
     Input = props.Input,
+    _props$InputView = props.InputView,
+    InputView = _props$InputView === void 0 ? _InputView.InputView : _props$InputView,
     _props$InputButtons = props.InputButtons,
     InputButtons = _props$InputButtons === void 0 ? _InputButtons.InputButtons : _props$InputButtons,
-    _props$InputEditingSt = props.InputEditingStateHeader,
-    InputEditingStateHeader = _props$InputEditingSt === void 0 ? _InputEditingStateHeader.InputEditingStateHeader : _props$InputEditingSt,
-    _props$CommandInput = props.CommandInput,
-    CommandInput = _props$CommandInput === void 0 ? _CommandInput.CommandInput : _props$CommandInput,
-    _props$InputReplyStat = props.InputReplyStateHeader,
-    InputReplyStateHeader = _props$InputReplyStat === void 0 ? _InputReplyStateHeader.InputReplyStateHeader : _props$InputReplyStat,
+    _props$MessageCompose = props.MessageComposerLeadingView,
+    MessageComposerLeadingView = _props$MessageCompose === void 0 ? _MessageComposerLeadingView.MessageComposerLeadingView : _props$MessageCompose,
+    _props$MessageCompose2 = props.MessageComposerTrailingView,
+    MessageComposerTrailingView = _props$MessageCompose2 === void 0 ? _MessageComposerTrailingView.MessageComposerTrailingView : _props$MessageCompose2,
     isAttachmentEqual = props.isAttachmentEqual,
     _props$isMessageAIGen = props.isMessageAIGenerated,
     isMessageAIGenerated = _props$isMessageAIGen === void 0 ? function () {
@@ -384,10 +415,8 @@ var ChannelWithContext = function ChannelWithContext(props) {
     } : _props$isMessageAIGen,
     keyboardBehavior = props.keyboardBehavior,
     _props$KeyboardCompat = props.KeyboardCompatibleView,
-    KeyboardCompatibleView = _props$KeyboardCompat === void 0 ? _KeyboardCompatibleView.KeyboardCompatibleView : _props$KeyboardCompat,
+    KeyboardCompatibleView = _props$KeyboardCompat === void 0 ? _KeyboardControllerAvoidingView.KeyboardCompatibleView : _props$KeyboardCompat,
     keyboardVerticalOffset = props.keyboardVerticalOffset,
-    _props$legacyImageVie = props.legacyImageViewerSwipeBehaviour,
-    legacyImageViewerSwipeBehaviour = _props$legacyImageVie === void 0 ? false : _props$legacyImageVie,
     _props$LoadingErrorIn = props.LoadingErrorIndicator,
     LoadingErrorIndicator = _props$LoadingErrorIn === void 0 ? _LoadingErrorIndicator.LoadingErrorIndicator : _props$LoadingErrorIn,
     _props$LoadingIndicat = props.LoadingIndicator,
@@ -405,25 +434,38 @@ var ChannelWithContext = function ChannelWithContext(props) {
     _props$MessageActionL2 = props.MessageActionListItem,
     MessageActionListItem = _props$MessageActionL2 === void 0 ? _MessageActionListItem.MessageActionListItem : _props$MessageActionL2,
     messageActions = props.messageActions,
-    _props$MessageAvatar = props.MessageAvatar,
-    MessageAvatar = _props$MessageAvatar === void 0 ? _MessageAvatar.MessageAvatar : _props$MessageAvatar,
+    _props$MessageAuthor = props.MessageAuthor,
+    MessageAuthor = _props$MessageAuthor === void 0 ? _MessageAuthor.MessageAuthor : _props$MessageAuthor,
     _props$MessageBlocked = props.MessageBlocked,
     MessageBlocked = _props$MessageBlocked === void 0 ? _MessageBlocked.MessageBlocked : _props$MessageBlocked,
     _props$MessageBounce = props.MessageBounce,
     MessageBounce = _props$MessageBounce === void 0 ? _MessageBounce.MessageBounce : _props$MessageBounce,
     _props$MessageContent = props.MessageContent,
     MessageContent = _props$MessageContent === void 0 ? _MessageContent.MessageContent : _props$MessageContent,
+    MessageContentBottomView = props.MessageContentBottomView,
+    MessageContentLeadingView = props.MessageContentLeadingView,
     _props$messageContent = props.messageContentOrder,
-    messageContentOrder = _props$messageContent === void 0 ? ['quoted_reply', 'gallery', 'files', 'poll', 'ai_text', 'text', 'attachments', 'location'] : _props$messageContent,
+    messageContentOrder = _props$messageContent === void 0 ? ['quoted_reply', 'gallery', 'files', 'poll', 'ai_text', 'attachments', 'text', 'location'] : _props$messageContent,
+    MessageContentTrailingView = props.MessageContentTrailingView,
+    MessageContentTopView = props.MessageContentTopView,
     _props$MessageDeleted = props.MessageDeleted,
     MessageDeleted = _props$MessageDeleted === void 0 ? _MessageDeleted.MessageDeleted : _props$MessageDeleted,
-    _props$MessageEditedT = props.MessageEditedTimestamp,
-    MessageEditedTimestamp = _props$MessageEditedT === void 0 ? _MessageEditedTimestamp.MessageEditedTimestamp : _props$MessageEditedT,
     _props$MessageError = props.MessageError,
     MessageError = _props$MessageError === void 0 ? _MessageError.MessageError : _props$MessageError,
+    _props$messageInputFl = props.messageInputFloating,
+    messageInputFloating = _props$messageInputFl === void 0 ? false : _props$messageInputFl,
+    _props$MessageInputFo = props.MessageInputFooterView,
+    MessageInputFooterView = _props$MessageInputFo === void 0 ? _MessageInputFooterView.MessageInputFooterView : _props$MessageInputFo,
+    _props$MessageInputHe = props.MessageInputHeaderView,
+    MessageInputHeaderView = _props$MessageInputHe === void 0 ? _MessageInputHeaderView.MessageInputHeaderView : _props$MessageInputHe,
+    _props$MessageInputLe = props.MessageInputLeadingView,
+    MessageInputLeadingView = _props$MessageInputLe === void 0 ? _MessageInputLeadingView.MessageInputLeadingView : _props$MessageInputLe,
+    _props$MessageInputTr = props.MessageInputTrailingView,
+    MessageInputTrailingView = _props$MessageInputTr === void 0 ? _MessageInputTrailingView.MessageInputTrailingView : _props$MessageInputTr,
     _props$MessageFooter = props.MessageFooter,
     MessageFooter = _props$MessageFooter === void 0 ? _MessageFooter.MessageFooter : _props$MessageFooter,
-    MessageHeader = props.MessageHeader,
+    _props$MessageHeader = props.MessageHeader,
+    MessageHeader = _props$MessageHeader === void 0 ? _MessageHeader.MessageHeader : _props$MessageHeader,
     messageId = props.messageId,
     _props$MessageList = props.MessageList,
     MessageList = _props$MessageList === void 0 ? _MessageList.MessageList : _props$MessageList,
@@ -432,14 +474,21 @@ var ChannelWithContext = function ChannelWithContext(props) {
     MessageMenu = _props$MessageMenu === void 0 ? _MessageMenu.MessageMenu : _props$MessageMenu,
     _props$MessagePinnedH = props.MessagePinnedHeader,
     MessagePinnedHeader = _props$MessagePinnedH === void 0 ? _MessagePinnedHeader.MessagePinnedHeader : _props$MessagePinnedH,
+    _props$MessageReminde = props.MessageReminderHeader,
+    MessageReminderHeader = _props$MessageReminde === void 0 ? _MessageReminderHeader.MessageReminderHeader : _props$MessageReminde,
+    _props$MessageSavedFo = props.MessageSavedForLaterHeader,
+    MessageSavedForLaterHeader = _props$MessageSavedFo === void 0 ? _MessageSavedForLaterHeader.MessageSavedForLaterHeader : _props$MessageSavedFo,
+    _props$SentToChannelH = props.SentToChannelHeader,
+    SentToChannelHeader = _props$SentToChannelH === void 0 ? _SentToChannelHeader.SentToChannelHeader : _props$SentToChannelH,
     _props$MessageReactio = props.MessageReactionPicker,
     MessageReactionPicker = _props$MessageReactio === void 0 ? _MessageReactionPicker.MessageReactionPicker : _props$MessageReactio,
     _props$MessageReplies = props.MessageReplies,
     MessageReplies = _props$MessageReplies === void 0 ? _MessageReplies.MessageReplies : _props$MessageReplies,
     _props$MessageReplies2 = props.MessageRepliesAvatars,
     MessageRepliesAvatars = _props$MessageReplies2 === void 0 ? _MessageRepliesAvatars.MessageRepliesAvatars : _props$MessageReplies2,
-    _props$MessageSimple = props.MessageSimple,
-    MessageSimple = _props$MessageSimple === void 0 ? _MessageSimple.MessageSimple : _props$MessageSimple,
+    MessageSpacer = props.MessageSpacer,
+    _props$MessageItemVie = props.MessageItemView,
+    MessageItemView = _props$MessageItemVie === void 0 ? _MessageItemView.MessageItemView : _props$MessageItemVie,
     _props$MessageStatus = props.MessageStatus,
     MessageStatus = _props$MessageStatus === void 0 ? _MessageStatus.MessageStatus : _props$MessageStatus,
     _props$MessageSwipeCo = props.MessageSwipeContent,
@@ -457,8 +506,6 @@ var ChannelWithContext = function ChannelWithContext(props) {
     MessageUserReactionsAvatar = _props$MessageUserRea2 === void 0 ? _MessageUserReactionsAvatar.MessageUserReactionsAvatar : _props$MessageUserRea2,
     _props$MessageUserRea3 = props.MessageUserReactionsItem,
     MessageUserReactionsItem = _props$MessageUserRea3 === void 0 ? _MessageUserReactionsItem.MessageUserReactionsItem : _props$MessageUserRea3,
-    _props$MoreOptionsBut = props.MoreOptionsButton,
-    MoreOptionsButton = _props$MoreOptionsBut === void 0 ? _MoreOptionsButton.MoreOptionsButton : _props$MoreOptionsBut,
     myMessageTheme = props.myMessageTheme,
     _props$NetworkDownInd = props.NetworkDownIndicator,
     NetworkDownIndicator = _props$NetworkDownInd === void 0 ? _NetworkDownIndicator.NetworkDownIndicator : _props$NetworkDownInd,
@@ -467,6 +514,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     onLongPressMessage = props.onLongPressMessage,
     onPressInMessage = props.onPressInMessage,
     onPressMessage = props.onPressMessage,
+    onAlsoSentToChannelHeaderPress = props.onAlsoSentToChannelHeaderPress,
     openPollCreationDialog = props.openPollCreationDialog,
     overrideOwnCapabilities = props.overrideOwnCapabilities,
     PollContent = props.PollContent,
@@ -474,8 +522,18 @@ var ChannelWithContext = function ChannelWithContext(props) {
     ReactionListBottom = _props$ReactionListBo === void 0 ? _ReactionListBottom.ReactionListBottom : _props$ReactionListBo,
     _props$reactionListPo = props.reactionListPosition,
     reactionListPosition = _props$reactionListPo === void 0 ? 'top' : _props$reactionListPo,
+    _props$reactionListTy = props.reactionListType,
+    reactionListType = _props$reactionListTy === void 0 ? 'clustered' : _props$reactionListTy,
     _props$ReactionListTo = props.ReactionListTop,
     ReactionListTop = _props$ReactionListTo === void 0 ? _ReactionListTop.ReactionListTop : _props$ReactionListTo,
+    _props$ReactionListCl = props.ReactionListClustered,
+    ReactionListClustered = _props$ReactionListCl === void 0 ? _ReactionListClustered.ReactionListClustered : _props$ReactionListCl,
+    _props$ReactionListIt = props.ReactionListItem,
+    ReactionListItem = _props$ReactionListIt === void 0 ? _ReactionListItem.ReactionListItem : _props$ReactionListIt,
+    _props$ReactionListIt2 = props.ReactionListItemWrapper,
+    ReactionListItemWrapper = _props$ReactionListIt2 === void 0 ? _ReactionListItemWrapper.ReactionListItemWrapper : _props$ReactionListIt2,
+    _props$ReactionListCo = props.ReactionListCountItem,
+    ReactionListCountItem = _props$ReactionListCo === void 0 ? _ReactionListItem.ReactionListCountItem : _props$ReactionListCo,
     _props$Reply = props.Reply,
     Reply = _props$Reply === void 0 ? _Reply.Reply : _props$Reply,
     _props$ScrollToBottom = props.ScrollToBottomButton,
@@ -514,25 +572,28 @@ var ChannelWithContext = function ChannelWithContext(props) {
     TypingIndicatorContainer = _props$TypingIndicato2 === void 0 ? _TypingIndicatorContainer.TypingIndicatorContainer : _props$TypingIndicato2,
     _props$UnreadMessages = props.UnreadMessagesNotification,
     UnreadMessagesNotification = _props$UnreadMessages === void 0 ? _UnreadMessagesNotification.UnreadMessagesNotification : _props$UnreadMessages,
-    _props$AttachmentUplo2 = props.AttachmentUploadProgressIndicator,
-    AttachmentUploadProgressIndicator = _props$AttachmentUplo2 === void 0 ? _AttachmentUploadProgressIndicator.AttachmentUploadProgressIndicator : _props$AttachmentUplo2,
     _props$UrlPreview = props.UrlPreview,
-    UrlPreview = _props$UrlPreview === void 0 ? _Card.Card : _props$UrlPreview,
+    UrlPreview = _props$UrlPreview === void 0 ? _UrlPreview.URLPreview : _props$UrlPreview,
+    _props$URLPreviewComp = props.URLPreviewCompact,
+    URLPreviewCompact = _props$URLPreviewComp === void 0 ? _URLPreviewCompact.URLPreviewCompact : _props$URLPreviewComp,
     _props$VideoAttachmen = props.VideoAttachmentUploadPreview,
-    VideoAttachmentUploadPreview = _props$VideoAttachmen === void 0 ? _FileAttachmentUploadPreview.FileAttachmentUploadPreview : _props$VideoAttachmen,
+    VideoAttachmentUploadPreview = _props$VideoAttachmen === void 0 ? _VideoAttachmentUploadPreview.VideoAttachmentUploadPreview : _props$VideoAttachmen,
     _props$VideoThumbnail = props.VideoThumbnail,
     VideoThumbnail = _props$VideoThumbnail === void 0 ? _VideoThumbnail.VideoThumbnail : _props$VideoThumbnail,
     isOnline = props.isOnline,
     maximumMessageLimit = props.maximumMessageLimit,
     _props$initializeOnMo = props.initializeOnMount,
-    initializeOnMount = _props$initializeOnMo === void 0 ? true : _props$initializeOnMo;
+    initializeOnMount = _props$initializeOnMo === void 0 ? true : _props$initializeOnMo,
+    _props$AttachmentPick2 = props.AttachmentPickerContent,
+    AttachmentPickerContent = _props$AttachmentPick2 === void 0 ? _AttachmentPickerContent.AttachmentPickerContent : _props$AttachmentPick2,
+    _props$urlPreviewType = props.urlPreviewType,
+    urlPreviewType = _props$urlPreviewType === void 0 ? 'full' : _props$urlPreviewType,
+    _props$UnsupportedAtt = props.UnsupportedAttachment,
+    UnsupportedAttachment = _props$UnsupportedAtt === void 0 ? _UnsupportedAttachment.UnsupportedAttachment : _props$UnsupportedAtt;
   var threadProps = threadFromProps.thread,
     threadInstance = threadFromProps.threadInstance;
   var StopMessageStreamingButton = StopMessageStreamingButtonOverride === undefined ? _StopMessageStreamingButton.StopMessageStreamingButton : StopMessageStreamingButtonOverride;
-  var _useTheme = (0, _ThemeContext.useTheme)(),
-    _useTheme$theme = _useTheme.theme,
-    selectChannel = _useTheme$theme.channel.selectChannel,
-    black = _useTheme$theme.colors.black;
+  var styles = useStyles();
   var _useState = (0, _react.useState)(false),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     deleted = _useState2[0],
@@ -560,13 +621,16 @@ var ChannelWithContext = function ChannelWithContext(props) {
   var _useState13 = (0, _react.useState)(new _channelUnreadState.ChannelUnreadStateStore()),
     _useState14 = (0, _slicedToArray2.default)(_useState13, 1),
     channelUnreadStateStore = _useState14[0];
+  var _useState15 = (0, _react.useState)(new _messageInputHeightStore.MessageInputHeightStore()),
+    _useState16 = (0, _slicedToArray2.default)(_useState15, 1),
+    messageInputHeightStore = _useState16[0];
   var setChannelUnreadState = (0, _react.useCallback)(function (data) {
     channelUnreadStateStore.channelUnreadState = data;
   }, [channelUnreadStateStore]);
   var _useAttachmentPickerB = (0, _useAttachmentPickerBottomSheet.useAttachmentPickerBottomSheet)(),
     bottomSheetRef = _useAttachmentPickerB.bottomSheetRef,
-    _closePicker = _useAttachmentPickerB.closePicker,
-    _openPicker = _useAttachmentPickerB.openPicker;
+    closePicker = _useAttachmentPickerB.closePicker,
+    openPicker = _useAttachmentPickerB.openPicker;
   var syncingChannelRef = (0, _react.useRef)(false);
   var _useTargetedMessage = (0, _useTargetedMessage2.useTargetedMessage)(),
     highlightedMessageId = _useTargetedMessage.highlightedMessageId,
@@ -681,7 +745,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   (0, _react.useEffect)(function () {
     var listener;
     var initChannel = function () {
-      var _ref = (0, _asyncToGenerator2.default)(function* () {
+      var _ref7 = (0, _asyncToGenerator2.default)(function* () {
         var _client$user;
         setLastRead(new Date());
         var unreadCount = channel.countUnread();
@@ -732,7 +796,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
         listener = channel.on(handleEvent);
       });
       return function initChannel() {
-        return _ref.apply(this, arguments);
+        return _ref7.apply(this, arguments);
       };
     }();
     initChannel();
@@ -776,10 +840,10 @@ var ChannelWithContext = function ChannelWithContext(props) {
   }, [thread == null ? void 0 : thread.id, channelId]);
   (0, _useAppStateListener.useAppStateListener)(undefined, handleAppBackground);
   var markReadInternal = (0, _throttle.default)(function () {
-    var _ref2 = (0, _asyncToGenerator2.default)(function* (options) {
-      var _ref3 = options != null ? options : {},
-        _ref3$updateChannelUn = _ref3.updateChannelUnreadState,
-        updateChannelUnreadState = _ref3$updateChannelUn === void 0 ? true : _ref3$updateChannelUn;
+    var _ref8 = (0, _asyncToGenerator2.default)(function* (options) {
+      var _ref9 = options != null ? options : {},
+        _ref9$updateChannelUn = _ref9.updateChannelUnreadState,
+        updateChannelUnreadState = _ref9$updateChannelUn === void 0 ? true : _ref9$updateChannelUn;
       if (!channel || channel != null && channel.disconnected || !(clientChannelConfig != null && clientChannelConfig.read_events)) {
         return;
       }
@@ -802,7 +866,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       }
     });
     return function (_x) {
-      return _ref2.apply(this, arguments);
+      return _ref8.apply(this, arguments);
     };
   }(), defaultThrottleInterval, throttleOptions);
   var markRead = (0, _hooks.useStableCallback)(markReadInternal);
@@ -934,8 +998,8 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }
   }));
   var loadChannelAroundMessage = (0, _hooks.useStableCallback)(function () {
-    var _ref8 = (0, _asyncToGenerator2.default)(function* (_ref7) {
-      var messageIdToLoadAround = _ref7.messageId;
+    var _ref14 = (0, _asyncToGenerator2.default)(function* (_ref13) {
+      var messageIdToLoadAround = _ref13.messageId;
       if (!messageIdToLoadAround) {
         return;
       }
@@ -968,7 +1032,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       }
     });
     return function (_x2) {
-      return _ref8.apply(this, arguments);
+      return _ref14.apply(this, arguments);
     };
   }());
   var updateMessage = (0, _hooks.useStableCallback)(function (updatedMessage) {
@@ -1000,7 +1064,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     }
   });
   var uploadPendingAttachments = (0, _hooks.useStableCallback)(function () {
-    var _ref9 = (0, _asyncToGenerator2.default)(function* (message) {
+    var _ref15 = (0, _asyncToGenerator2.default)(function* (message) {
       var _updatedMessage$attac;
       var updatedMessage = Object.assign({}, message);
       if ((_updatedMessage$attac = updatedMessage.attachments) != null && _updatedMessage$attac.length) {
@@ -1063,15 +1127,15 @@ var ChannelWithContext = function ChannelWithContext(props) {
       return updatedMessage;
     });
     return function (_x3) {
-      return _ref9.apply(this, arguments);
+      return _ref15.apply(this, arguments);
     };
   }());
   var sendMessageRequest = (0, _hooks.useStableCallback)(function () {
-    var _ref11 = (0, _asyncToGenerator2.default)(function* (_ref10) {
-      var localMessage = _ref10.localMessage,
-        message = _ref10.message,
-        options = _ref10.options,
-        retrying = _ref10.retrying;
+    var _ref17 = (0, _asyncToGenerator2.default)(function* (_ref16) {
+      var localMessage = _ref16.localMessage,
+        message = _ref16.message,
+        options = _ref16.options,
+        retrying = _ref16.retrying;
       var failedMessageUpdated = false;
       var handleFailedMessage = function handleFailedMessage() {
         if (!failedMessageUpdated) {
@@ -1144,15 +1208,15 @@ var ChannelWithContext = function ChannelWithContext(props) {
       }
     });
     return function (_x4) {
-      return _ref11.apply(this, arguments);
+      return _ref17.apply(this, arguments);
     };
   }());
   var sendMessage = (0, _hooks.useStableCallback)(function () {
-    var _ref13 = (0, _asyncToGenerator2.default)(function* (_ref12) {
+    var _ref19 = (0, _asyncToGenerator2.default)(function* (_ref18) {
       var _channel$state, _client$offlineDb5;
-      var localMessage = _ref12.localMessage,
-        message = _ref12.message,
-        options = _ref12.options;
+      var localMessage = _ref18.localMessage,
+        message = _ref18.message,
+        options = _ref18.options;
       if (channel != null && (_channel$state = channel.state) != null && _channel$state.filterErrorMessages) {
         channel.state.filterErrorMessages();
       }
@@ -1185,11 +1249,11 @@ var ChannelWithContext = function ChannelWithContext(props) {
       });
     });
     return function (_x5) {
-      return _ref13.apply(this, arguments);
+      return _ref19.apply(this, arguments);
     };
   }());
   var retrySendMessage = (0, _hooks.useStableCallback)(function () {
-    var _ref14 = (0, _asyncToGenerator2.default)(function* (localMessage) {
+    var _ref20 = (0, _asyncToGenerator2.default)(function* (localMessage) {
       var statusPendingMessage = Object.assign({}, localMessage, {
         status: _utils.MessageStatusTypes.SENDING
       });
@@ -1204,16 +1268,16 @@ var ChannelWithContext = function ChannelWithContext(props) {
       });
     });
     return function (_x6) {
-      return _ref14.apply(this, arguments);
+      return _ref20.apply(this, arguments);
     };
   }());
-  var editMessage = (0, _hooks.useStableCallback)(function (_ref15) {
-    var localMessage = _ref15.localMessage,
-      options = _ref15.options;
+  var editMessage = (0, _hooks.useStableCallback)(function (_ref21) {
+    var localMessage = _ref21.localMessage,
+      options = _ref21.options;
     return doUpdateMessageRequest ? doUpdateMessageRequest((channel == null ? void 0 : channel.cid) || '', localMessage, options) : client.updateMessage(localMessage, undefined, options);
   });
   var removeMessage = (0, _hooks.useStableCallback)(function () {
-    var _ref16 = (0, _asyncToGenerator2.default)(function* (message) {
+    var _ref22 = (0, _asyncToGenerator2.default)(function* (message) {
       if (channel) {
         channel.state.removeMessage(message);
         copyMessagesStateFromChannel(channel);
@@ -1228,11 +1292,11 @@ var ChannelWithContext = function ChannelWithContext(props) {
       }
     });
     return function (_x7) {
-      return _ref16.apply(this, arguments);
+      return _ref22.apply(this, arguments);
     };
   }());
   var sendReaction = (0, _hooks.useStableCallback)(function () {
-    var _ref17 = (0, _asyncToGenerator2.default)(function* (type, messageId) {
+    var _ref23 = (0, _asyncToGenerator2.default)(function* (type, messageId) {
       if (!(channel != null && channel.id) || !client.user) {
         throw new Error('Channel has not been initialized');
       }
@@ -1259,11 +1323,11 @@ var ChannelWithContext = function ChannelWithContext(props) {
       }
     });
     return function (_x8, _x9) {
-      return _ref17.apply(this, arguments);
+      return _ref23.apply(this, arguments);
     };
   }());
   var deleteMessage = (0, _hooks.useStableCallback)(function () {
-    var _ref18 = (0, _asyncToGenerator2.default)(function* (message) {
+    var _ref24 = (0, _asyncToGenerator2.default)(function* (message) {
       var optionsOrHardDelete = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       var options = {};
       if (typeof optionsOrHardDelete === 'boolean') {
@@ -1301,11 +1365,11 @@ var ChannelWithContext = function ChannelWithContext(props) {
       }
     });
     return function (_x10) {
-      return _ref18.apply(this, arguments);
+      return _ref24.apply(this, arguments);
     };
   }());
   var deleteReaction = (0, _hooks.useStableCallback)(function () {
-    var _ref19 = (0, _asyncToGenerator2.default)(function* (type, messageId) {
+    var _ref25 = (0, _asyncToGenerator2.default)(function* (type, messageId) {
       if (!(channel != null && channel.id) || !client.user) {
         throw new Error('Channel has not been initialized');
       }
@@ -1322,7 +1386,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
       yield channel.deleteReaction.apply(channel, payload);
     });
     return function (_x11, _x12) {
-      return _ref19.apply(this, arguments);
+      return _ref25.apply(this, arguments);
     };
   }());
   var openThread = (0, _react.useCallback)(function (message) {
@@ -1373,43 +1437,35 @@ var ChannelWithContext = function ChannelWithContext(props) {
       throw err;
     }
   }));
-  var attachmentPickerProps = (0, _react.useMemo)(function () {
-    return {
-      AttachmentPickerBottomSheetHandle: AttachmentPickerBottomSheetHandle,
-      attachmentPickerBottomSheetHandleHeight: attachmentPickerBottomSheetHandleHeight,
-      attachmentPickerBottomSheetHeight: attachmentPickerBottomSheetHeight,
-      AttachmentPickerError: AttachmentPickerError,
-      attachmentPickerErrorButtonText: attachmentPickerErrorButtonText,
-      AttachmentPickerErrorImage: AttachmentPickerErrorImage,
-      attachmentPickerErrorText: attachmentPickerErrorText,
-      AttachmentPickerIOSSelectMorePhotos: AttachmentPickerIOSSelectMorePhotos,
-      attachmentSelectionBarHeight: attachmentSelectionBarHeight,
-      ImageOverlaySelectedComponent: ImageOverlaySelectedComponent,
-      numberOfAttachmentImagesToLoadPerCall: numberOfAttachmentImagesToLoadPerCall,
-      numberOfAttachmentPickerImageColumns: numberOfAttachmentPickerImageColumns
-    };
-  }, [AttachmentPickerBottomSheetHandle, attachmentPickerBottomSheetHandleHeight, attachmentPickerBottomSheetHeight, AttachmentPickerError, attachmentPickerErrorButtonText, AttachmentPickerErrorImage, attachmentPickerErrorText, AttachmentPickerIOSSelectMorePhotos, attachmentSelectionBarHeight, ImageOverlaySelectedComponent, numberOfAttachmentImagesToLoadPerCall, numberOfAttachmentPickerImageColumns]);
+  var handleClosePicker = (0, _hooks.useStableCallback)(function () {
+    return closePicker(bottomSheetRef);
+  });
+  var handleOpenPicker = (0, _hooks.useStableCallback)(function () {
+    return openPicker(bottomSheetRef);
+  });
   var attachmentPickerContext = (0, _react.useMemo)(function () {
     return {
       bottomInset: bottomInset,
       bottomSheetRef: bottomSheetRef,
-      closePicker: function closePicker() {
-        return _closePicker(bottomSheetRef);
-      },
+      closePicker: handleClosePicker,
       disableAttachmentPicker: disableAttachmentPicker,
-      openPicker: function openPicker() {
-        return _openPicker(bottomSheetRef);
-      },
-      topInset: topInset
+      openPicker: handleOpenPicker,
+      topInset: topInset,
+      ImageOverlaySelectedComponent: ImageOverlaySelectedComponent,
+      AttachmentPickerSelectionBar: AttachmentPickerSelectionBar,
+      numberOfAttachmentPickerImageColumns: numberOfAttachmentPickerImageColumns,
+      attachmentPickerBottomSheetHeight: attachmentPickerBottomSheetHeight,
+      attachmentSelectionBarHeight: attachmentSelectionBarHeight,
+      numberOfAttachmentImagesToLoadPerCall: numberOfAttachmentImagesToLoadPerCall,
+      AttachmentPickerContent: AttachmentPickerContent
     };
-  }, [bottomInset, bottomSheetRef, _closePicker, _openPicker, topInset, disableAttachmentPicker]);
+  }, [bottomInset, bottomSheetRef, handleClosePicker, disableAttachmentPicker, handleOpenPicker, topInset, ImageOverlaySelectedComponent, AttachmentPickerSelectionBar, numberOfAttachmentPickerImageColumns, attachmentPickerBottomSheetHeight, attachmentSelectionBarHeight, numberOfAttachmentImagesToLoadPerCall, AttachmentPickerContent]);
   var ownCapabilitiesContext = (0, _useCreateOwnCapabilitiesContext.useCreateOwnCapabilitiesContext)({
     channel: channel,
     overrideCapabilities: overrideOwnCapabilities
   });
   var channelContext = (0, _useCreateChannelContext.useCreateChannelContext)({
     channel: channel,
-    channelUnreadState: channelUnreadStateStore.channelUnreadState,
     channelUnreadStateStore: channelUnreadStateStore,
     disabled: !!(channel != null && (_channel$data = channel.data) != null && _channel$data.frozen),
     EmptyStateIndicator: EmptyStateIndicator,
@@ -1451,13 +1507,10 @@ var ChannelWithContext = function ChannelWithContext(props) {
     asyncMessagesMultiSendEnabled: asyncMessagesMultiSendEnabled,
     asyncMessagesSlideToCancelDistance: asyncMessagesSlideToCancelDistance,
     AttachButton: AttachButton,
-    AttachmentPickerBottomSheetHandle: AttachmentPickerBottomSheetHandle,
-    attachmentPickerBottomSheetHandleHeight: attachmentPickerBottomSheetHandleHeight,
     attachmentPickerBottomSheetHeight: attachmentPickerBottomSheetHeight,
     AttachmentPickerSelectionBar: AttachmentPickerSelectionBar,
     attachmentSelectionBarHeight: attachmentSelectionBarHeight,
     AttachmentUploadPreviewList: AttachmentUploadPreviewList,
-    AttachmentUploadProgressIndicator: AttachmentUploadProgressIndicator,
     AudioAttachmentUploadPreview: AudioAttachmentUploadPreview,
     AudioRecorder: AudioRecorder,
     audioRecordingEnabled: audioRecordingEnabled,
@@ -1468,30 +1521,37 @@ var ChannelWithContext = function ChannelWithContext(props) {
     AutoCompleteSuggestionHeader: AutoCompleteSuggestionHeader,
     AutoCompleteSuggestionItem: AutoCompleteSuggestionItem,
     AutoCompleteSuggestionList: AutoCompleteSuggestionList,
-    CameraSelectorIcon: CameraSelectorIcon,
     channelId: channelId,
-    CommandInput: CommandInput,
-    CommandsButton: CommandsButton,
     compressImageQuality: compressImageQuality,
     CooldownTimer: CooldownTimer,
     CreatePollContent: CreatePollContent,
-    CreatePollIcon: CreatePollIcon,
+    createPollOptionGap: createPollOptionGap,
     doFileUploadRequest: doFileUploadRequest,
     editMessage: editMessage,
     FileAttachmentUploadPreview: FileAttachmentUploadPreview,
-    FileSelectorIcon: FileSelectorIcon,
+    FileUploadInProgressIndicator: FileUploadInProgressIndicator,
+    FileUploadRetryIndicator: FileUploadRetryIndicator,
+    FileUploadNotSupportedIndicator: FileUploadNotSupportedIndicator,
+    ImageUploadInProgressIndicator: ImageUploadInProgressIndicator,
+    ImageUploadRetryIndicator: ImageUploadRetryIndicator,
+    ImageUploadNotSupportedIndicator: ImageUploadNotSupportedIndicator,
     handleAttachButtonPress: handleAttachButtonPress,
     hasCameraPicker: hasCameraPicker,
     hasCommands: hasCommands != null ? hasCommands : !!(clientChannelConfig != null && (_clientChannelConfig$ = clientChannelConfig.commands) != null && _clientChannelConfig$.length),
     hasFilePicker: hasFilePicker,
     hasImagePicker: hasImagePicker,
     ImageAttachmentUploadPreview: ImageAttachmentUploadPreview,
-    ImageSelectorIcon: ImageSelectorIcon,
     Input: Input,
+    InputView: InputView,
     InputButtons: InputButtons,
-    InputEditingStateHeader: InputEditingStateHeader,
-    InputReplyStateHeader: InputReplyStateHeader,
-    MoreOptionsButton: MoreOptionsButton,
+    MessageComposerLeadingView: MessageComposerLeadingView,
+    MessageComposerTrailingView: MessageComposerTrailingView,
+    messageInputFloating: messageInputFloating,
+    messageInputHeightStore: messageInputHeightStore,
+    MessageInputFooterView: MessageInputFooterView,
+    MessageInputHeaderView: MessageInputHeaderView,
+    MessageInputLeadingView: MessageInputLeadingView,
+    MessageInputTrailingView: MessageInputTrailingView,
     openPollCreationDialog: openPollCreationDialog,
     SendButton: SendButton,
     sendMessage: sendMessage,
@@ -1500,8 +1560,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
     ShowThreadMessageInChannelButton: ShowThreadMessageInChannelButton,
     StartAudioRecordingButton: StartAudioRecordingButton,
     StopMessageStreamingButton: StopMessageStreamingButton,
-    VideoAttachmentUploadPreview: VideoAttachmentUploadPreview,
-    VideoRecorderSelectorIcon: VideoRecorderSelectorIcon
+    VideoAttachmentUploadPreview: VideoAttachmentUploadPreview
   });
   var messageListContext = (0, _useCreatePaginatedMessageListContext.useCreatePaginatedMessageListContext)({
     channelId: channelId,
@@ -1517,12 +1576,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   var messagesContext = (0, _useCreateMessagesContext.useCreateMessagesContext)({
     additionalPressableProps: additionalPressableProps,
     Attachment: Attachment,
-    AttachmentActions: AttachmentActions,
     AudioAttachment: AudioAttachment,
-    Card: Card,
-    CardCover: CardCover,
-    CardFooter: CardFooter,
-    CardHeader: CardHeader,
     channelId: channelId,
     customMessageSwipeAction: customMessageSwipeAction,
     DateHeader: DateHeader,
@@ -1536,11 +1590,11 @@ var ChannelWithContext = function ChannelWithContext(props) {
     FileAttachment: FileAttachment,
     FileAttachmentGroup: FileAttachmentGroup,
     FileAttachmentIcon: FileAttachmentIcon,
+    FilePreview: FilePreview,
     FlatList: FlatList,
     forceAlignMessages: forceAlignMessages,
     Gallery: Gallery,
     getMessageGroupStyle: getMessageGroupStyle,
-    getMessagesGroupStyles: getMessagesGroupStyles,
     Giphy: Giphy,
     giphyVersion: giphyVersion,
     handleBan: handleBan,
@@ -1556,28 +1610,30 @@ var ChannelWithContext = function ChannelWithContext(props) {
     handleReaction: handleReaction,
     handleRetry: handleRetry,
     handleThreadReply: handleThreadReply,
+    handleBlockUser: handleBlockUser,
     hasCreatePoll: hasCreatePoll === undefined ? pollCreationEnabled : hasCreatePoll && pollCreationEnabled,
     ImageLoadingFailedIndicator: ImageLoadingFailedIndicator,
     ImageLoadingIndicator: ImageLoadingIndicator,
-    ImageReloadIndicator: ImageReloadIndicator,
     initialScrollToFirstUnreadMessage: !messageId && initialScrollToFirstUnreadMessage,
     InlineDateSeparator: InlineDateSeparator,
     InlineUnreadIndicator: InlineUnreadIndicator,
     isAttachmentEqual: isAttachmentEqual,
     isMessageAIGenerated: isMessageAIGenerated,
-    legacyImageViewerSwipeBehaviour: legacyImageViewerSwipeBehaviour,
     markdownRules: markdownRules,
     Message: Message,
     MessageActionList: MessageActionList,
     MessageActionListItem: MessageActionListItem,
     messageActions: messageActions,
-    MessageAvatar: MessageAvatar,
+    MessageAuthor: MessageAuthor,
     MessageBlocked: MessageBlocked,
     MessageBounce: MessageBounce,
     MessageContent: MessageContent,
+    MessageContentBottomView: MessageContentBottomView,
+    MessageContentLeadingView: MessageContentLeadingView,
     messageContentOrder: messageContentOrder,
+    MessageContentTrailingView: MessageContentTrailingView,
+    MessageContentTopView: MessageContentTopView,
     MessageDeleted: MessageDeleted,
-    MessageEditedTimestamp: MessageEditedTimestamp,
     MessageError: MessageError,
     MessageFooter: MessageFooter,
     MessageHeader: MessageHeader,
@@ -1585,10 +1641,14 @@ var ChannelWithContext = function ChannelWithContext(props) {
     MessageLocation: MessageLocation,
     MessageMenu: MessageMenu,
     MessagePinnedHeader: MessagePinnedHeader,
+    MessageReminderHeader: MessageReminderHeader,
+    MessageSavedForLaterHeader: MessageSavedForLaterHeader,
+    SentToChannelHeader: SentToChannelHeader,
     MessageReactionPicker: MessageReactionPicker,
     MessageReplies: MessageReplies,
     MessageRepliesAvatars: MessageRepliesAvatars,
-    MessageSimple: MessageSimple,
+    MessageSpacer: MessageSpacer,
+    MessageItemView: MessageItemView,
     MessageStatus: MessageStatus,
     MessageSwipeContent: MessageSwipeContent,
     messageSwipeToReplyHitSlop: messageSwipeToReplyHitSlop,
@@ -1606,7 +1666,12 @@ var ChannelWithContext = function ChannelWithContext(props) {
     PollContent: PollContent,
     ReactionListBottom: ReactionListBottom,
     reactionListPosition: reactionListPosition,
+    reactionListType: reactionListType,
     ReactionListTop: ReactionListTop,
+    ReactionListClustered: ReactionListClustered,
+    ReactionListItem: ReactionListItem,
+    ReactionListItemWrapper: ReactionListItemWrapper,
+    ReactionListCountItem: ReactionListCountItem,
     removeMessage: removeMessage,
     Reply: Reply,
     retrySendMessage: retrySendMessage,
@@ -1622,10 +1687,14 @@ var ChannelWithContext = function ChannelWithContext(props) {
     UnreadMessagesNotification: UnreadMessagesNotification,
     updateMessage: updateMessage,
     UrlPreview: UrlPreview,
-    VideoThumbnail: VideoThumbnail
+    URLPreviewCompact: URLPreviewCompact,
+    VideoThumbnail: VideoThumbnail,
+    urlPreviewType: urlPreviewType,
+    UnsupportedAttachment: UnsupportedAttachment
   });
   var threadContext = (0, _useCreateThreadContext.useCreateThreadContext)({
     allowThreadMessagesInChannel: allowThreadMessagesInChannel,
+    onAlsoSentToChannelHeaderPress: onAlsoSentToChannelHeaderPress,
     closeThread: closeThread,
     loadMoreThread: loadMoreThread,
     openThread: openThread,
@@ -1664,9 +1733,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
   }
   if (!(channel != null && channel.cid) || !channel.watch) {
     return (0, _jsxRuntime.jsx)(_reactNative.Text, {
-      style: [styles.selectChannel, {
-        color: black
-      }, selectChannel],
+      style: styles.selectChannel,
       testID: "no-channel",
       children: t('Please select a channel first')
     });
@@ -1688,7 +1755,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
               value: messagesContext,
               children: (0, _jsxRuntime.jsx)(_ThreadContext.ThreadProvider, {
                 value: threadContext,
-                children: (0, _jsxRuntime.jsx)(_contexts.AttachmentPickerProvider, {
+                children: (0, _jsxRuntime.jsx)(_AttachmentPickerContext.AttachmentPickerProvider, {
                   value: attachmentPickerContext,
                   children: (0, _jsxRuntime.jsx)(_MessageComposerContext.MessageComposerProvider, {
                     value: messageComposerContext,
@@ -1701,9 +1768,7 @@ var ChannelWithContext = function ChannelWithContext(props) {
                             height: '100%'
                           },
                           children: children
-                        }), !disableAttachmentPicker && (0, _jsxRuntime.jsx)(_AttachmentPicker.AttachmentPicker, Object.assign({
-                          ref: bottomSheetRef
-                        }, attachmentPickerProps))]
+                        }), (0, _jsxRuntime.jsx)(_AttachmentPicker.AttachmentPicker, {})]
                       })
                     })
                   })
@@ -1748,4 +1813,21 @@ var Channel = exports.Channel = function Channel(props) {
     threadMessages: threadMessages
   }));
 };
+var useStyles = function useStyles() {
+  var _useTheme = (0, _ThemeContext.useTheme)(),
+    _useTheme$theme = _useTheme.theme,
+    selectChannel = _useTheme$theme.channel.selectChannel,
+    semantics = _useTheme$theme.semantics;
+  return (0, _react.useMemo)(function () {
+    return _reactNative.StyleSheet.create({
+      selectChannel: Object.assign({
+        fontWeight: _theme.primitives.typographyFontWeightSemiBold,
+        fontSize: _theme.primitives.typographyFontSizeMd,
+        lineHeight: _theme.primitives.typographyLineHeightNormal,
+        padding: _theme.primitives.spacingMd,
+        color: semantics.textPrimary
+      }, selectChannel)
+    });
+  }, [selectChannel, semantics]);
+};
 //# sourceMappingURL=Channel.js.map