stream-chat-react-native-core
Version:
The official React Native and Expo components for Stream Chat, a service for building chat applications
2,306 lines • 52.9 kB
text/typescript
import {
Appearance,
type ColorValue,
type ImageStyle,
type TextStyle,
type ViewStyle,
} from 'react-native';
import type { IconProps } from '../../../icons/utils/base';
import { primitives, lightSemantics, darkSemantics } from '../../../theme';
export const DEFAULT_STATUS_ICON_SIZE = 16;
// TODO: Handle this better later depending on the size of the avatar used
export const BASE_AVATAR_SIZE = 24;
export const Colors = {
accent_blue: '#005FFF',
accent_dark_blue: '#005DFF',
accent_error: '#D92F26',
accent_green: '#20E070',
accent_info: '#1FE06F',
accent_red: '#FF3742',
bg_gradient_end: '#F7F7F7',
bg_gradient_start: '#FCFCFC',
bg_user: '#F7F7F8',
black: '#000000',
blue_alice: '#E9F2FF',
// border: '#00000014', // 14 = 8% opacity; top: x=0, y=-1; bottom: x=0, y=1
code_block: '#DDDDDD',
disabled: '#B4BBBA',
grey: '#7A7A7A',
grey_dark: '#72767E',
grey_gainsboro: '#DBDBDB',
grey_whisper: '#ECEBEB',
icon_background: '#FFFFFF',
label_bg_transparent: '#00000033', // 33 = 20% opacity
light_blue: '#E0F0FF',
light_gray: '#E9EAED',
modal_shadow: '#00000099', // 99 = 60% opacity; x=0, y= 1, radius=4
overlay: '#000000CC', // CC = 80% opacity
selected: 'hsla(0, 0%, 0%, 0.15)',
shadow_icon: '#00000040', // 40 = 25% opacity; x=0, y=0, radius=4
static_black: '#000000',
static_white: '#ffffff',
targetedMessageBackground: '#FBF4DD', // dark mode = #302D22
text_high_emphasis: '#080707',
text_low_emphasis: '#7E828B',
transparent: 'transparent',
white: '#FFFFFF',
white_smoke: '#F2F2F2',
white_snow: '#FCFCFC',
};
export type MarkdownStyle = Partial<{
autolink: TextStyle;
blockQuoteBar: ViewStyle;
blockQuoteSection: ViewStyle;
blockQuoteSectionBar: ViewStyle;
blockQuoteText: TextStyle | ViewStyle;
br: TextStyle;
codeBlock: TextStyle;
del: TextStyle;
em: TextStyle;
heading: TextStyle;
heading1: TextStyle;
heading2: TextStyle;
heading3: TextStyle;
heading4: TextStyle;
heading5: TextStyle;
heading6: TextStyle;
hr: ViewStyle;
image: ImageStyle;
inlineCode: TextStyle;
list: ViewStyle;
listItem: ViewStyle;
listItemBullet: TextStyle;
listItemNumber: TextStyle;
listItemText: TextStyle;
listRow: ViewStyle;
mailTo: TextStyle;
mentions: TextStyle;
newline: TextStyle;
noMargin: TextStyle;
paragraph: TextStyle;
paragraphCenter: TextStyle;
paragraphWithImage: ViewStyle;
strong: TextStyle;
sublist: ViewStyle;
table: ViewStyle;
tableHeader: ViewStyle;
tableHeaderCell: TextStyle;
tableRow: ViewStyle;
tableRowCell: TextStyle;
tableRowLast: ViewStyle;
text: TextStyle;
u: TextStyle;
view: ViewStyle;
}>;
export type Theme = {
aiTypingIndicatorView: {
container: ViewStyle;
text: TextStyle;
};
attachmentPicker: {
bottomSheetContentContainer: ViewStyle;
durationText: TextStyle;
content: {
actionContainer: ViewStyle;
container: ViewStyle;
infoContainer: ViewStyle;
text: TextStyle;
};
image: ViewStyle;
imageOverlay: ViewStyle;
imageOverlaySelectedComponent: {
check: ViewStyle;
};
handle: {
container: ViewStyle;
indicator: ViewStyle;
};
};
attachmentSelectionBar: {
container: ViewStyle;
icon: ViewStyle;
};
audioAttachment: {
container: ViewStyle;
centerContainer: ViewStyle;
audioInfo: ViewStyle;
leftContainer: ViewStyle;
playPauseButton: ViewStyle;
progressControlContainer: ViewStyle;
progressDurationText: TextStyle;
rightContainer: ViewStyle;
speedChangeButton: ViewStyle;
speedChangeButtonText: TextStyle;
};
avatar: {
border: ViewStyle;
container: ViewStyle;
image: ImageStyle;
};
avatarStack: {
userAvatarWrapper: ViewStyle;
};
bottomSheetModal: {
container: ViewStyle;
contentContainer: ViewStyle;
handle: ViewStyle;
overlay: ViewStyle;
wrapper: ViewStyle;
};
channel: {
selectChannel: TextStyle;
};
channelListFooterLoadingIndicator: {
container: ViewStyle;
};
channelListHeaderErrorIndicator: {
container: ViewStyle;
errorText: TextStyle;
};
channelListLoadingIndicator: {
container: ViewStyle;
};
channelListView: {
flatList: ViewStyle;
flatListContent: ViewStyle;
};
channelDetailsMenu: {
contentContainer: ViewStyle;
header: {
container: ViewStyle;
metaContainer: ViewStyle;
metaText: TextStyle;
};
item: {
container: ViewStyle;
destructiveText: TextStyle;
standardText: TextStyle;
};
};
channelDetails: {
container: ViewStyle;
scrollContent: ViewStyle;
header: {
container: ViewStyle;
title: TextStyle;
};
profile: {
container: ViewStyle;
heading: ViewStyle;
subtitle: TextStyle;
title: TextStyle;
};
sectionCard: ViewStyle;
actionItem: {
container: ViewStyle;
destructiveLabel: TextStyle;
iconWrapper: ViewStyle;
label: TextStyle;
trailingValue: TextStyle;
};
memberSection: {
addButtonWrapper: ViewStyle;
confirmButton: ViewStyle;
footer: ViewStyle;
header: ViewStyle;
headerTitle: TextStyle;
viewAllLabel: TextStyle;
};
memberItem: {
container: ViewStyle;
name: TextStyle;
status: TextStyle;
};
roleList: {
container: ViewStyle;
};
roleItem: {
container: ViewStyle;
ownerBackgroundColor: string;
ownerColor: string;
roleBackgroundColor: string;
roleColor: string;
text: TextStyle;
};
memberList: {
container: ViewStyle;
list: ViewStyle;
listContent: ViewStyle;
};
memberActionsSheet: {
actionsList: ViewStyle;
container: ViewStyle;
header: ViewStyle;
};
editImageSheet: {
actionsList: ViewStyle;
container: ViewStyle;
header: ViewStyle;
headerTitle: TextStyle;
};
modal: {
body: ViewStyle;
header: ViewStyle;
headerTitle: TextStyle;
};
addMembers: {
container: ViewStyle;
list: ViewStyle;
listContent: ViewStyle;
searchResultItem: {
alreadyMemberInfo: ViewStyle;
memberLabel: TextStyle;
userName: TextStyle;
userRow: ViewStyle;
};
};
editChannel: {
avatarSection: ViewStyle;
container: ViewStyle;
nameInput: ViewStyle;
uploadButton: ViewStyle;
};
pinnedMessageList: {
container: ViewStyle;
list: ViewStyle;
listContent: ViewStyle;
};
pinnedMessageItem: {
container: ViewStyle;
content: ViewStyle;
name: TextStyle;
title: ViewStyle;
};
fileAttachmentList: {
container: ViewStyle;
list: ViewStyle;
listContent: ViewStyle;
sectionHeader: ViewStyle;
sectionHeaderText: TextStyle;
};
fileAttachmentItem: {
container: ViewStyle;
};
mediaList: {
container: ViewStyle;
list: ViewStyle;
listContent: ViewStyle;
};
mediaItem: {
avatar: ViewStyle;
container: ViewStyle;
thumbnail: ImageStyle;
videoBadge: ViewStyle;
videoBadgeText: TextStyle;
};
};
channelListSkeleton: {
animationTime: number;
avatar: ViewStyle;
badge: ViewStyle;
content: ViewStyle;
container: ViewStyle;
headerRow: ViewStyle;
subtitle: ViewStyle;
textContainer: ViewStyle;
title: ViewStyle;
};
threadListSkeleton: {
animationTime: number;
avatar: ViewStyle;
body: ViewStyle;
content: ViewStyle;
contentContainer: ViewStyle;
container: ViewStyle;
footerIcon: ViewStyle;
footerPill: ViewStyle;
footerRow: ViewStyle;
headerLabel: ViewStyle;
textContainer: ViewStyle;
timestamp: ViewStyle;
};
memberListSkeleton: {
animationTime: number;
avatar: ViewStyle;
container: ViewStyle;
content: ViewStyle;
subtitle: ViewStyle;
textContainer: ViewStyle;
title: ViewStyle;
};
userListSkeleton: {
animationTime: number;
avatar: ViewStyle;
container: ViewStyle;
content: ViewStyle;
subtitle: ViewStyle;
textContainer: ViewStyle;
title: ViewStyle;
};
pinnedMessageListSkeleton: {
animationTime: number;
avatar: ViewStyle;
container: ViewStyle;
content: ViewStyle;
subtitle: ViewStyle;
textContainer: ViewStyle;
title: ViewStyle;
};
fileAttachmentListSkeleton: {
animationTime: number;
avatar: ViewStyle;
container: ViewStyle;
content: ViewStyle;
subtitle: ViewStyle;
textContainer: ViewStyle;
title: ViewStyle;
};
channelPreview: {
container: ViewStyle;
contentContainer: ViewStyle;
date: TextStyle;
mutedStatus: IconProps;
pinnedStatus: IconProps;
messageDeliveryStatus: {
container: ViewStyle;
text: TextStyle;
checkAllIcon: IconProps;
checkIcon: IconProps;
timeIcon: IconProps;
username: TextStyle;
};
lowerRow: ViewStyle;
title: TextStyle;
unreadContainer: ViewStyle;
unreadText: TextStyle;
typingIndicatorPreview: {
container: ViewStyle;
text: TextStyle;
};
upperRow: ViewStyle;
statusContainer: ViewStyle;
titleContainer: ViewStyle;
wrapper: ViewStyle;
message: {
container: ViewStyle;
subtitle: TextStyle;
errorText: TextStyle;
draftText: TextStyle;
};
messagePreview: {
container: ViewStyle;
draftText: TextStyle;
subtitle: TextStyle;
};
};
dateHeader: {
container: ViewStyle;
text: TextStyle;
};
emptyList: {
container: ViewStyle;
subtitle: TextStyle;
title: TextStyle;
};
emptySearchResult: {
container: ViewStyle;
text: TextStyle;
};
emptyStateIndicator: {
channelContainer: ViewStyle;
channelDetails: TextStyle;
channelTitle: TextStyle;
messageContainer: ViewStyle;
messageTitle: TextStyle;
};
groupAvatar: {
container: ViewStyle;
image: ImageStyle;
};
iconBadge: {
icon: ViewStyle;
iconInner: ViewStyle;
unreadCount: TextStyle;
};
iconSquare: {
container: ViewStyle;
image: ImageStyle;
};
imageGallery: {
footer: {
centerContainer: ViewStyle;
container: ViewStyle;
imageCountText: TextStyle;
innerContainer: ViewStyle;
activityIndicatorContainer: ViewStyle;
wrapper: ViewStyle;
};
grid: {
container: ViewStyle;
contentContainer: ViewStyle;
gridAvatar: ImageStyle;
gridAvatarWrapper: ViewStyle;
gridImage: ImageStyle;
handle: ViewStyle;
handleText: TextStyle;
overlay: ViewStyle;
};
header: {
centerContainer: ViewStyle;
container: ViewStyle;
dateText: TextStyle;
innerContainer: ViewStyle;
usernameText: TextStyle;
};
videoControl: {
container: ViewStyle;
durationTextStyle: TextStyle;
leftContainer: ViewStyle;
progressContainer: ViewStyle;
};
backgroundColor?: string;
pager?: ViewStyle;
slide?: ImageStyle;
};
inlineDateSeparator: {
container: ViewStyle;
text: TextStyle;
};
loadingDots: {
container: ViewStyle;
loadingDot: ViewStyle;
spacing: number;
};
loadingErrorIndicator: {
container: ViewStyle;
errorText: TextStyle;
retryText: TextStyle;
};
loadingIndicator: {
container: ViewStyle;
loadingText: TextStyle;
};
messageComposer: {
attachButton: ViewStyle;
attachButtonContainer: ViewStyle;
attachmentSelectionBar: ViewStyle;
attachmentUploadPreviewList: {
audioAttachmentsContainer: ViewStyle;
flatList: ViewStyle;
itemSeparator: ViewStyle;
};
audioRecordingButtonContainer: ViewStyle;
audioRecorder: {
arrowLeftIcon: IconProps;
checkContainer: ViewStyle;
circleStopIcon: IconProps;
deleteContainer: ViewStyle;
deleteIcon: IconProps;
micContainer: ViewStyle;
micIcon: IconProps;
pausedContainer: ViewStyle;
sendCheckIcon: IconProps;
slideToCancelContainer: ViewStyle;
};
audioRecordingInProgress: {
container: ViewStyle;
durationText: TextStyle;
};
audioRecordingLockIndicator: {
arrowUpIcon: IconProps;
container: ViewStyle;
lockIcon: IconProps;
};
audioRecordingPreview: {
container: ViewStyle;
currentTime: TextStyle;
infoContainer: ViewStyle;
pauseIcon: IconProps;
playIcon: IconProps;
progressBar: ViewStyle;
};
audioRecordingWaveform: {
container: ViewStyle;
waveform: ViewStyle;
};
container: ViewStyle;
contentContainer: ViewStyle;
cooldownButtonContainer: ViewStyle;
cooldownTimer: {
text: TextStyle;
};
dismissAttachmentUpload: {
dismiss: ViewStyle;
dismissIcon: IconProps;
dismissIconColor: ColorValue;
};
editButton: ViewStyle;
editButtonContainer: ViewStyle;
fileAttachmentUploadPreview: {
fileContainer: ViewStyle;
filenameText: TextStyle;
fileSizeText: TextStyle;
fileTextContainer: ViewStyle;
uploadProgressOverlay: ViewStyle;
wrapper: ViewStyle;
};
fileUploadInProgressIndicator: {
container: ViewStyle;
indicator: ViewStyle;
};
fileUploadRetryIndicator: {
container: ViewStyle;
networkErrorContainer: ViewStyle;
networkErrorText: TextStyle;
retryButton: ViewStyle;
retryText: TextStyle;
};
fileUploadNotSupportedIndicator: {
container: ViewStyle;
notSupportedText: TextStyle;
};
imageUploadInProgressIndicator: {
container: ViewStyle;
indicator: ViewStyle;
};
imageUploadRetryIndicator: {
container: ViewStyle;
};
imageUploadNotSupportedIndicator: {
container: ViewStyle;
};
fileUploadPreview: {
flatList: ViewStyle;
};
floatingWrapper: ViewStyle;
focusedInputBoxContainer: ViewStyle;
imageAttachmentUploadPreview: {
container: ViewStyle;
upload: ImageStyle;
wrapper: ViewStyle;
};
inputContainer: ViewStyle;
inputBox: TextStyle;
inputBoxContainer: ViewStyle;
inputBoxWrapper: ViewStyle;
inputButtonsContainer: ViewStyle;
inputFloatingContainer: ViewStyle;
micButtonContainer: ViewStyle;
nativeAttachmentPicker: {
buttonContainer: ViewStyle;
buttonDimmerStyle: ViewStyle;
container: ViewStyle;
};
outputButtonsContainer: ViewStyle;
sendButton: ViewStyle;
sendButtonContainer: ViewStyle;
sendMessageDisallowedIndicator: {
container: ViewStyle;
text: TextStyle;
};
showThreadMessageInChannelButton: {
check: IconProps;
checkBoxActive: ViewStyle;
checkBoxInactive: ViewStyle;
container: ViewStyle;
innerContainer: ViewStyle;
text: TextStyle;
};
stopMessageStreamingButton: ViewStyle;
stopMessageStreamingIcon: IconProps;
suggestions: {
command: {
args: TextStyle;
container: ViewStyle;
iconContainer: ViewStyle;
title: TextStyle;
};
emoji: {
container: ViewStyle;
text: TextStyle;
};
header: {
container: ViewStyle;
title: TextStyle;
};
item: ViewStyle;
mention: {
avatarSize: number;
column: ViewStyle;
container: ViewStyle;
enhancedMentionContainer: ViewStyle;
enhancedMentionIcon: ViewStyle;
enhancedMentionSubtitle: TextStyle;
enhancedMentionTitle: TextStyle;
name: TextStyle;
tag: TextStyle;
};
};
suggestionsListContainer: {
container: ViewStyle;
flatlist: ViewStyle;
flatlistContentContainer: ViewStyle;
};
videoAttachmentUploadPreview: {
durationContainer: ViewStyle;
durationText: TextStyle;
};
wrapper: ViewStyle;
linkPreviewList: {
linkContainer: ViewStyle;
linkIcon: ViewStyle;
container: ViewStyle;
imageWrapper: ViewStyle;
dismissWrapper: ViewStyle;
thumbnail: ImageStyle;
wrapper: ViewStyle;
metadataContainer: ViewStyle;
text: TextStyle;
titleText: TextStyle;
};
};
messageList: {
systemMessageContainer: ViewStyle;
container: ViewStyle;
contentContainer: ViewStyle;
errorNotification: ViewStyle;
errorNotificationText: TextStyle;
inlineUnreadIndicator: {
container: ViewStyle;
text: TextStyle;
};
listContainer: ViewStyle;
messageContainer: ViewStyle;
inlineDateSeparatorContainer: ViewStyle;
unreadUnderlayContainer: ViewStyle;
messageSystem: {
container: ViewStyle;
dateText: TextStyle;
line: ViewStyle;
text: TextStyle;
textContainer: ViewStyle;
};
scrollToBottomButtonContainer: ViewStyle;
scrollToBottomButton: {
container: ViewStyle;
unreadCountNotificationContainer: ViewStyle;
unreadCountNotificationText: TextStyle;
};
stickyHeaderContainer: ViewStyle;
typingIndicatorContainer: ViewStyle;
unreadMessagesNotificationContainer: ViewStyle;
unreadMessagesNotification: {
container: ViewStyle;
leftButtonContainer: ViewStyle;
rightButtonContainer: ViewStyle;
};
};
notification: {
actionButton: ViewStyle;
actionButtonText: TextStyle;
actionsContainer: ViewStyle;
closeButton: ViewStyle;
container: ViewStyle;
contentContainer: ViewStyle;
iconContainer: ViewStyle;
message: TextStyle;
};
notificationList: {
container: ViewStyle;
};
messageMenu: {
actionList: {
container: ViewStyle;
contentContainer: ViewStyle;
};
actionListItem: {
container: ViewStyle;
icon: ViewStyle;
title: TextStyle;
};
bottomSheet: {
height?: number;
};
reactionButton: {
filledColor?: ColorValue;
unfilledColor?: ColorValue;
filledBackgroundColor?: ColorValue;
unfilledBackgroundColor?: ColorValue;
};
reactionPicker: {
buttonContainer: ViewStyle;
container: ViewStyle;
contentContainer: ViewStyle;
reactionIconSize: number;
emojiViewerButton: ViewStyle;
};
userReactions: {
avatarContainer: ViewStyle;
avatarInnerContainer: ViewStyle;
avatarName: TextStyle;
avatarNameContainer: ViewStyle;
avatarSize: number;
container: ViewStyle;
contentContainer: ViewStyle;
filledBackgroundColor?: ColorValue;
flatlistContainer: ViewStyle;
iconFilledColor?: ColorValue;
iconUnFilledColor?: ColorValue;
radius: number;
reactionBubble: ViewStyle;
reactionBubbleBackground: ViewStyle;
reactionBubbleBorderRadius: number;
reactionSelectorContainer: ViewStyle;
reactionsText: TextStyle;
title: TextStyle;
unfilledBackgroundColor?: ColorValue;
};
};
messagePreview: {
message: TextStyle;
};
messageItemView: {
blockedMessageContainer: ViewStyle;
bubbleContentContainer: ViewStyle;
bubbleErrorContainer: ViewStyle;
bubbleReactionListTopContainer: ViewStyle;
bubbleWrapper: ViewStyle;
actions: {
button: ViewStyle & {
defaultBackgroundColor?: ViewStyle['backgroundColor'];
defaultBorderColor?: ViewStyle['borderColor'];
primaryBackgroundColor?: ViewStyle['backgroundColor'];
primaryBorderColor?: ViewStyle['borderColor'];
};
buttonText: TextStyle & {
defaultColor?: TextStyle['color'];
primaryColor?: TextStyle['color'];
};
container: ViewStyle;
};
authorWrapper: {
container: ViewStyle;
spacer: ViewStyle;
};
card: {
container: ViewStyle;
cover: ImageStyle;
footer: ViewStyle & {
description: TextStyle;
title: TextStyle;
};
linkPreview: ViewStyle;
linkPreviewText: TextStyle;
};
container: ViewStyle;
repliesContainer: ViewStyle;
content: {
container: ViewStyle;
containerInner: ViewStyle;
contentContainer: ViewStyle;
editedTimestampContainer: ViewStyle;
errorContainer: ViewStyle;
errorIcon: IconProps;
errorIconContainer: ViewStyle;
eyeIcon: IconProps;
lastMessageContainer: ViewStyle;
/**
* Available options for styling text:
* https://github.com/andangrd/react-native-markdown-package/blob/main/styles.js
*/
markdown: MarkdownStyle;
messageGroupedSingleOrBottomContainer: ViewStyle;
messageGroupedTopContainer: ViewStyle;
metaText: TextStyle;
replyBorder: ViewStyle;
replyContainer: ViewStyle;
textContainer: ViewStyle & {
onlyEmojiMarkdown: MarkdownStyle;
};
timestampText?: TextStyle;
};
deleted: {
containerInner: ViewStyle;
deletedText: TextStyle;
container: ViewStyle;
};
footer: {
container: ViewStyle;
name: TextStyle;
editedText: TextStyle;
};
contentWrapper: ViewStyle;
contentContainer: ViewStyle;
leftAlignItems: ViewStyle;
rightAlignItems: ViewStyle;
messageGroupedSingleStyles: ViewStyle;
messageGroupedBottomStyles: ViewStyle;
messageGroupedTopStyles: ViewStyle;
messageGroupedMiddleStyles: ViewStyle;
file: {
container: ViewStyle;
details: ViewStyle;
fileSize: TextStyle;
icon: IconProps;
title: TextStyle;
};
unsupportedAttachment: {
container: ViewStyle;
details: ViewStyle;
title: TextStyle;
};
fileAttachmentGroup: {
attachmentContainer: ViewStyle;
container: ViewStyle;
};
attachmentUploadIndicator: {
indicator: ViewStyle;
overlay: ViewStyle;
overlayContent: ViewStyle;
};
gallery: {
galleryContainer: ViewStyle;
galleryItemColumn: ViewStyle;
gridHeight: number;
gridWidth: number;
image: ImageStyle;
imageContainer: ViewStyle;
imageContainerStyle: ViewStyle;
maxHeight: number;
maxWidth: number;
minHeight: number;
minWidth: number;
moreImagesContainer: ViewStyle;
moreImagesText: TextStyle;
thumbnail: ViewStyle;
imageBorderRadius?: {
borderBottomLeftRadius: number;
borderBottomRightRadius: number;
borderTopLeftRadius: number;
borderTopRightRadius: number;
};
};
giphy: {
actionButtonContainer: ViewStyle;
actionButton: ViewStyle;
actionButtonText: TextStyle;
container: ViewStyle;
giphy: ImageStyle;
giphyContainer: ViewStyle;
giphyHeaderText: TextStyle;
giphyMask: ViewStyle;
giphyMaskText: TextStyle;
header: ViewStyle;
imageIndicatorContainer: ViewStyle;
};
compactUrlPreview: {
wrapper: ViewStyle;
container: ViewStyle;
cardCover: ImageStyle;
cardFooter: ViewStyle;
title: TextStyle;
description: TextStyle;
linkPreview: ViewStyle;
linkPreviewText: TextStyle;
};
lastMessageContainer: ViewStyle;
loadingIndicator: {
container: ViewStyle;
roundedView: ViewStyle;
};
messageGroupedSingleOrBottomContainer: ViewStyle;
messageGroupedTopContainer: ViewStyle;
messageBlocked: {
container: ViewStyle;
text: TextStyle;
};
pinnedHeader: {
container: ViewStyle;
label: TextStyle;
};
savedForLaterHeader: {
container: ViewStyle;
label: TextStyle;
};
reminderHeader: {
container: ViewStyle;
label: TextStyle;
dot: TextStyle;
time: TextStyle;
};
sentToChannelHeader: {
container: ViewStyle;
label: TextStyle;
dot: TextStyle;
link: TextStyle;
};
reactionListBottom: {
contentContainer: ViewStyle;
columnWrapper: ViewStyle;
rowSeparator: ViewStyle;
};
reactionListItem: {
reactionCount: TextStyle;
icon: {
size: number;
style: ViewStyle;
};
};
reactionListClustered: {
contentContainer: ViewStyle;
reactionCount: TextStyle;
iconStyle: ViewStyle;
icon: {
size: number;
style: ViewStyle;
};
};
reactionListItemWrapper: {
wrapper: ViewStyle;
container: ViewStyle;
containerSelected: ViewStyle;
containerPressed: ViewStyle;
};
reactionListTop: {
container: ViewStyle;
contentContainer: ViewStyle;
list: ViewStyle;
position: number;
};
replies: {
container: ViewStyle;
messageRepliesText: TextStyle;
content: ViewStyle;
avatarStackContainer: ViewStyle;
};
status: {
checkAllIcon: IconProps;
checkIcon: IconProps;
container: ViewStyle;
timeIcon: IconProps;
};
swipeContentContainer: ViewStyle;
swipeLeftContent: {
container: ViewStyle;
};
targetedMessageContainer: ViewStyle;
videoThumbnail: {
container: ViewStyle;
roundedView: ViewStyle;
};
wrapper: ViewStyle;
};
poll: {
allOptions: {
listContainer: ViewStyle;
titleContainer: ViewStyle;
titleText: TextStyle;
wrapper: ViewStyle;
};
answersList: {
container: ViewStyle;
contentContainer: ViewStyle;
item: {
answerText: TextStyle;
container: ViewStyle;
infoContainer: ViewStyle;
userInfoContainer: ViewStyle;
wrapper: ViewStyle;
};
};
button: { container: ViewStyle; text: TextStyle };
createContent: {
addComment: {
title: TextStyle;
description: TextStyle;
wrapper: ViewStyle;
optionCardContent: ViewStyle;
optionCardSwitch: ViewStyle;
};
anonymousPoll: {
title: TextStyle;
description: TextStyle;
wrapper: ViewStyle;
optionCardContent: ViewStyle;
optionCardSwitch: ViewStyle;
};
headerContainer: ViewStyle;
maxVotes: {
input: TextStyle;
validationText: TextStyle;
wrapper: ViewStyle;
};
multipleAnswers: {
description: TextStyle;
input: TextStyle;
row: ViewStyle;
settingsWrapper: ViewStyle;
title: TextStyle;
optionCard: ViewStyle;
optionCardContent: ViewStyle;
optionCardSwitch: ViewStyle;
wrapper: ViewStyle;
};
name: {
input: TextStyle;
title: TextStyle;
};
optionCardWrapper: ViewStyle;
pollOptions: {
addOption: {
text: TextStyle;
wrapper: ViewStyle;
};
container: ViewStyle;
optionStyle: {
content: ViewStyle;
input: TextStyle;
validationErrorText: TextStyle;
wrapper: ViewStyle;
validationErrorContainer: ViewStyle;
};
title: TextStyle;
};
scrollView: ViewStyle;
sendButton: ViewStyle;
suggestOption: {
title: TextStyle;
description: TextStyle;
wrapper: ViewStyle;
optionCardContent: ViewStyle;
optionCardSwitch: ViewStyle;
};
};
fullResults: {
container: ViewStyle;
contentContainer: ViewStyle;
headerContainer: ViewStyle;
headerText: TextStyle;
headerTitle: TextStyle;
};
inputDialog: {
button: TextStyle;
buttonContainer: ViewStyle;
container: ViewStyle;
input: TextStyle;
title: TextStyle;
transparentContainer: ViewStyle;
};
message: {
container: ViewStyle;
header: {
subtitle: TextStyle;
title: TextStyle;
};
option: {
container: ViewStyle;
info: ViewStyle;
header: ViewStyle;
votesText: TextStyle;
progressBarContainer: ViewStyle;
progressBar: ViewStyle;
text: TextStyle;
voteButtonContainer: ViewStyle;
votesContainer: ViewStyle;
wrapper: ViewStyle;
};
optionsWrapper: ViewStyle;
};
modalHeader: {
container: ViewStyle;
title: TextStyle;
};
results: {
container: ViewStyle;
item: {
container: ViewStyle;
headerContainer: ViewStyle;
title: TextStyle;
titleMeta: TextStyle;
voteCount: TextStyle;
};
scrollView: ViewStyle;
title: TextStyle;
titleMeta: TextStyle;
vote: { container: ViewStyle; dateText: TextStyle; userName: TextStyle };
};
};
progressControl: {
container: ViewStyle;
filledStyles: ViewStyle;
thumb: ViewStyle;
};
reply: {
audioIcon: IconProps;
container: ViewStyle;
dismissWrapper: ViewStyle;
fileIcon: IconProps;
leftContainer: ViewStyle;
locationIcon: IconProps;
linkIcon: IconProps;
photoIcon: IconProps;
pollIcon: IconProps;
rightContainer: ViewStyle;
title: TextStyle;
subtitle: TextStyle;
subtitleContainer: ViewStyle;
videoIcon: IconProps;
wrapper: ViewStyle;
messagePreview: {
container: ViewStyle;
subtitle: TextStyle;
};
};
screenPadding: number;
selectionCircle: {
circle: ViewStyle;
circleSelected: ViewStyle;
};
spinner: ViewStyle;
thread: {
newThread: {
container: ViewStyle;
text: TextStyle;
backgroundGradientStart?: string;
backgroundGradientStop?: string;
threadHeight?: number;
};
};
threadListItem: {
wrapper: ViewStyle;
container: ViewStyle;
content: ViewStyle;
channelName: TextStyle;
dateText: TextStyle;
lowerRow: ViewStyle;
messageRepliesText: TextStyle;
previewMessageContainer: ViewStyle;
unreadBubbleWrapper: ViewStyle;
messagePreview: {
container: ViewStyle;
draftText: TextStyle;
subtitle: TextStyle;
};
messagePreviewDeliveryStatus: {
container: ViewStyle;
text: TextStyle;
username: TextStyle;
};
};
threadListUnreadBanner: {
text: TextStyle;
container: ViewStyle;
};
typingIndicator: {
container: ViewStyle;
loadingDotsBubble: ViewStyle;
avatarStackContainer: ViewStyle;
text: TextStyle & {
fontSize: TextStyle['fontSize'];
};
};
waveProgressBar: {
container: ViewStyle;
thumb: ViewStyle;
waveform: ViewStyle;
};
semantics: typeof lightSemantics; // themed semantics have the same type
};
export const defaultTheme: Theme = {
semantics: Appearance.getColorScheme() === 'light' ? lightSemantics : darkSemantics,
aiTypingIndicatorView: {
container: {},
text: {},
},
attachmentPicker: {
bottomSheetContentContainer: {},
durationText: {},
content: {
actionContainer: {},
container: {},
infoContainer: {},
text: {},
},
handle: {
container: {},
indicator: {},
},
image: {},
imageOverlay: {},
imageOverlaySelectedComponent: {
check: {},
},
},
attachmentSelectionBar: {
container: {},
icon: {},
},
audioAttachment: {
centerContainer: {},
audioInfo: {},
container: {},
leftContainer: {},
playPauseButton: {},
progressControlContainer: {},
progressDurationText: {},
rightContainer: {},
speedChangeButton: {},
speedChangeButtonText: {},
},
avatar: {
border: {},
container: {},
image: {},
},
avatarStack: {
userAvatarWrapper: {},
},
bottomSheetModal: {
container: {},
contentContainer: {},
handle: {},
overlay: {},
wrapper: {},
},
channel: {
selectChannel: {},
},
channelListFooterLoadingIndicator: {
container: {},
},
channelListHeaderErrorIndicator: {
container: {},
errorText: {},
},
channelListLoadingIndicator: {
container: {},
},
channelListView: {
flatList: {},
flatListContent: {},
},
channelDetailsMenu: {
contentContainer: {},
header: {
container: {},
metaContainer: {},
metaText: {},
},
item: {
container: {},
destructiveText: {},
standardText: {},
},
},
channelDetails: {
container: {},
scrollContent: {},
header: {
container: {},
title: {},
},
profile: {
container: {},
heading: {},
subtitle: {},
title: {},
},
sectionCard: {},
actionItem: {
container: {},
destructiveLabel: {},
iconWrapper: {},
label: {},
trailingValue: {},
},
memberSection: {
addButtonWrapper: {},
confirmButton: {},
footer: {},
header: {},
headerTitle: {},
viewAllLabel: {},
},
memberItem: {
container: {},
name: {},
status: {},
},
roleList: {
container: {},
},
roleItem: {
container: {},
ownerBackgroundColor: '',
ownerColor: '',
roleBackgroundColor: '',
roleColor: '',
text: {},
},
memberList: {
container: {},
list: {},
listContent: {},
},
memberActionsSheet: {
actionsList: {},
container: {},
header: {},
},
editImageSheet: {
actionsList: {},
container: {},
header: {},
headerTitle: {},
},
modal: {
body: {},
header: {},
headerTitle: {},
},
addMembers: {
container: {},
list: {},
listContent: {},
searchResultItem: {
alreadyMemberInfo: {},
memberLabel: {},
userName: {},
userRow: {},
},
},
editChannel: {
avatarSection: {},
container: {},
nameInput: {},
uploadButton: {},
},
pinnedMessageList: {
container: {},
list: {},
listContent: {},
},
pinnedMessageItem: {
container: {},
content: {},
name: {},
title: {},
},
fileAttachmentList: {
container: {},
list: {},
listContent: {},
sectionHeader: {},
sectionHeaderText: {},
},
fileAttachmentItem: {
container: {},
},
mediaList: {
container: {},
list: {},
listContent: {},
},
mediaItem: {
avatar: {},
container: {},
thumbnail: {},
videoBadge: {},
videoBadgeText: {},
},
},
channelListSkeleton: {
animationTime: 1000, // in milliseconds
avatar: {},
badge: {},
content: {},
container: {},
headerRow: {},
subtitle: {},
textContainer: {},
title: {},
},
threadListSkeleton: {
animationTime: 1000, // in milliseconds
avatar: {},
body: {},
content: {},
contentContainer: {},
container: {},
footerIcon: {},
footerPill: {},
footerRow: {},
headerLabel: {},
textContainer: {},
timestamp: {},
},
memberListSkeleton: {
animationTime: 1000, // in milliseconds
avatar: {},
container: {},
content: {},
subtitle: {},
textContainer: {},
title: {},
},
userListSkeleton: {
animationTime: 1000, // in milliseconds
avatar: {},
container: {},
content: {},
subtitle: {},
textContainer: {},
title: {},
},
pinnedMessageListSkeleton: {
animationTime: 1000, // in milliseconds
avatar: {},
container: {},
content: {},
subtitle: {},
textContainer: {},
title: {},
},
fileAttachmentListSkeleton: {
animationTime: 1000, // in milliseconds
avatar: {},
container: {},
content: {},
subtitle: {},
textContainer: {},
title: {},
},
channelPreview: {
container: {},
contentContainer: {},
date: {},
message: {
container: {},
subtitle: {},
errorText: {},
draftText: {},
},
messageDeliveryStatus: {
container: {},
text: {},
checkAllIcon: {},
checkIcon: {},
timeIcon: {},
username: {},
},
mutedStatus: {},
pinnedStatus: {},
lowerRow: {},
title: {},
unreadContainer: {},
unreadText: {},
typingIndicatorPreview: {
container: {},
text: {},
},
upperRow: {},
statusContainer: {},
titleContainer: {},
wrapper: {},
messagePreview: {
container: {},
draftText: {},
subtitle: {},
},
},
dateHeader: {
container: {},
text: {},
},
emptyList: {
container: {},
subtitle: {},
title: {},
},
emptySearchResult: {
container: {},
text: {},
},
emptyStateIndicator: {
channelContainer: {},
channelDetails: {},
channelTitle: {},
messageContainer: {},
messageTitle: {},
},
groupAvatar: {
container: {},
image: {
resizeMode: 'cover',
},
},
iconBadge: {
icon: {},
iconInner: {},
unreadCount: {},
},
iconSquare: {
container: {},
image: {},
},
imageGallery: {
footer: {
centerContainer: {},
container: {},
imageCountText: {},
innerContainer: {},
activityIndicatorContainer: {},
wrapper: {},
},
grid: {
container: {},
contentContainer: {},
gridAvatar: {},
gridAvatarWrapper: {},
gridImage: {},
handle: {},
handleText: {},
overlay: {},
},
header: {
centerContainer: {},
container: {},
dateText: {},
innerContainer: {},
usernameText: {},
},
videoControl: {
container: {},
durationTextStyle: {},
leftContainer: {},
progressContainer: {},
},
},
inlineDateSeparator: {
container: {},
text: {},
},
loadingDots: {
container: {},
loadingDot: {},
spacing: primitives.spacingXxs,
},
loadingErrorIndicator: {
container: {},
errorText: {},
retryText: {},
},
loadingIndicator: {
container: {},
loadingText: {},
},
messageComposer: {
attachButton: {},
attachButtonContainer: {},
attachmentSelectionBar: {},
attachmentUploadPreviewList: {
audioAttachmentsContainer: {},
flatList: {},
itemSeparator: {},
},
audioRecorder: {
arrowLeftIcon: {},
checkContainer: {},
circleStopIcon: {},
deleteContainer: {},
deleteIcon: {},
micContainer: {},
micIcon: {},
pausedContainer: {},
sendCheckIcon: {},
slideToCancelContainer: {},
},
audioRecordingButtonContainer: {},
audioRecordingInProgress: { container: {}, durationText: {} },
audioRecordingLockIndicator: { arrowUpIcon: {}, container: {}, lockIcon: {} },
audioRecordingPreview: {
container: {},
currentTime: {},
infoContainer: {},
pauseIcon: {},
playIcon: {},
progressBar: {},
},
audioRecordingWaveform: { container: {}, waveform: {} },
container: {},
contentContainer: {},
cooldownButtonContainer: {},
cooldownTimer: {
text: {},
},
dismissAttachmentUpload: {
dismiss: {},
dismissIcon: {},
dismissIconColor: '',
},
editButton: {},
editButtonContainer: {},
fileAttachmentUploadPreview: {
fileContainer: {},
filenameText: {},
fileSizeText: {},
fileTextContainer: {},
uploadProgressOverlay: {},
wrapper: {},
},
fileUploadInProgressIndicator: {
container: {},
indicator: {},
},
fileUploadRetryIndicator: {
container: {},
networkErrorContainer: {},
networkErrorText: {},
retryButton: {},
retryText: {},
},
fileUploadNotSupportedIndicator: {
container: {},
notSupportedText: {},
},
imageUploadInProgressIndicator: {
container: {},
indicator: {},
},
imageUploadRetryIndicator: {
container: {},
},
imageUploadNotSupportedIndicator: {
container: {},
},
fileUploadPreview: {
flatList: {},
},
floatingWrapper: {},
focusedInputBoxContainer: {},
imageAttachmentUploadPreview: {
container: {},
upload: {},
wrapper: {},
},
videoAttachmentUploadPreview: {
durationContainer: {},
durationText: {},
},
inputBox: {},
inputBoxContainer: {},
inputBoxWrapper: {},
inputButtonsContainer: {},
inputContainer: {},
inputFloatingContainer: {},
micButtonContainer: {},
nativeAttachmentPicker: {
buttonContainer: {},
buttonDimmerStyle: {},
container: {},
},
outputButtonsContainer: {},
sendButton: {},
sendButtonContainer: {},
sendMessageDisallowedIndicator: {
container: {},
text: {},
},
showThreadMessageInChannelButton: {
check: {},
checkBoxActive: {},
checkBoxInactive: {},
container: {},
innerContainer: {},
text: {},
},
stopMessageStreamingButton: {},
stopMessageStreamingIcon: {},
suggestions: {
command: {
args: {},
container: {},
iconContainer: {},
title: {},
},
emoji: {
container: {},
text: {},
},
header: {
container: {},
title: {},
},
item: {},
mention: {
avatarSize: 40,
column: {},
container: {},
enhancedMentionContainer: {},
enhancedMentionIcon: {},
enhancedMentionSubtitle: {},
enhancedMentionTitle: {},
name: {},
tag: {},
},
},
suggestionsListContainer: {
container: {},
flatlist: {},
flatlistContentContainer: {},
},
wrapper: {},
linkPreviewList: {
linkContainer: {},
linkIcon: {},
container: {},
imageWrapper: {},
dismissWrapper: {},
thumbnail: {},
wrapper: {},
metadataContainer: {},
text: {},
titleText: {},
},
},
messageList: {
systemMessageContainer: {},
container: {},
contentContainer: {},
errorNotification: {},
errorNotificationText: {},
inlineUnreadIndicator: {
container: {},
text: {},
},
listContainer: {},
messageContainer: {},
inlineDateSeparatorContainer: {},
unreadUnderlayContainer: {},
messageSystem: {
container: {},
dateText: {},
line: {},
text: {},
textContainer: {},
},
scrollToBottomButton: {
container: {},
unreadCountNotificationContainer: {},
unreadCountNotificationText: {},
},
scrollToBottomButtonContainer: {},
stickyHeaderContainer: {},
typingIndicatorContainer: {},
unreadMessagesNotification: {
container: {},
leftButtonContainer: {},
rightButtonContainer: {},
},
unreadMessagesNotificationContainer: {},
},
notification: {
actionButton: {},
actionButtonText: {},
actionsContainer: {},
closeButton: {},
container: {},
contentContainer: {},
iconContainer: {},
message: {},
},
notificationList: {
container: {},
},
messageMenu: {
actionList: {
container: {},
contentContainer: {},
},
actionListItem: {
container: {},
icon: {},
title: {},
},
bottomSheet: {},
reactionButton: {},
reactionPicker: {
buttonContainer: {},
container: {},
contentContainer: {},
reactionIconSize: 24,
emojiViewerButton: {},
},
userReactions: {
avatarContainer: {},
avatarInnerContainer: {},
avatarName: {},
avatarNameContainer: {},
avatarSize: 64,
container: {},
contentContainer: {},
flatlistContainer: {},
radius: 2,
reactionBubble: {},
reactionBubbleBackground: {},
reactionBubbleBorderRadius: 24,
reactionSelectorContainer: {},
reactionsText: {},
title: {},
},
},
messagePreview: {
message: {},
},
messageItemView: {
blockedMessageContainer: {},
bubbleContentContainer: {},
bubbleErrorContainer: {},
bubbleReactionListTopContainer: {},
bubbleWrapper: {},
actions: {
button: {},
buttonText: {},
container: {},
},
authorWrapper: {
container: {},
spacer: {
height: BASE_AVATAR_SIZE,
width: BASE_AVATAR_SIZE, // same as BASE_AVATAR_SIZE
},
},
card: {
container: {},
cover: {},
footer: {
description: {},
title: {},
},
linkPreview: {},
linkPreviewText: {},
},
compactUrlPreview: {
wrapper: {},
container: {},
cardCover: {},
cardFooter: {},
title: {},
description: {},
linkPreview: {},
linkPreviewText: {},
},
container: {},
repliesContainer: {},
content: {
container: {},
containerInner: {},
contentContainer: {},
editedTimestampContainer: {},
errorContainer: {
paddingRight: 12,
paddingTop: 0,
},
errorIcon: {
height: 20,
width: 20,
},
errorIconContainer: {
bottom: -2,
position: 'absolute',
right: -12,
},
eyeIcon: {
height: 16,
width: 16,
},
lastMessageContainer: {},
markdown: {},
messageGroupedSingleOrBottomContainer: {},
messageGroupedTopContainer: {},
metaText: {
fontSize: 12,
},
replyBorder: {},
replyContainer: {},
textContainer: {
onlyEmojiMarkdown: { text: { fontSize: 50 } },
},
timestampText: {},
},
deleted: {
containerInner: {},
deletedText: {},
container: {},
},
footer: {
container: {},
name: {},
editedText: {},
},
contentWrapper: {},
contentContainer: {},
leftAlignItems: {},
rightAlignItems: {},
messageGroupedSingleStyles: {},
messageGroupedBottomStyles: {},
messageGroupedTopStyles: {},
messageGroupedMiddleStyles: {},
file: {
container: {},
details: {},
fileSize: {},
icon: {},
title: {},
},
unsupportedAttachment: {
container: {},
details: {},
title: {},
},
fileAttachmentGroup: {
attachmentContainer: {},
container: {},
},
attachmentUploadIndicator: {
indicator: {},
overlay: {},
overlayContent: {},
},
gallery: {
galleryContainer: {},
galleryItemColumn: {},
gridHeight: 192,
gridWidth: 256,
image: {},
imageBorderRadius: undefined,
imageContainer: {},
imageContainerStyle: {},
maxHeight: 192,
maxWidth: 256,
minHeight: 120,
minWidth: 120,
moreImagesContainer: {},
moreImagesText: {},
thumbnail: {},
},
giphy: {
actionButton: {},
actionButtonContainer: {},
actionButtonText: {},
container: {},
giphy: {},
giphyContainer: {},
giphyHeaderText: {},
giphyMask: {},
giphyMaskText: {},
header: {},
imageIndicatorContainer: {},
},
lastMessageContainer: {},
loadingIndicator: {
container: {},
roundedView: {},
},
messageBlocked: {
container: {},
text: {},
},
messageGroupedSingleOrBottomContainer: {},
messageGroupedTopContainer: {},
pinnedHeader: {
container: {},
label: {},
},
savedForLaterHeader: {
container: {},
label: {},
},
reminderHeader: {
container: {},
label: {},
dot: {},
time: {},
},
sentToChannelHeader: {
container: {},
label: {},
dot: {},
link: {},
},
reactionListBottom: {
contentContainer: {},
columnWrapper: {},
rowSeparator: {},
},
reactionListItem: {
reactionCount: {},
icon: {
size: 12,
style: {},
},
},
reactionListItemWrapper: {
wrapper: {},
container: {},
containerSelected: {},
containerPressed: {},
},
reactionListTop: {
container: {},
contentContainer: {},
list: {},
position: 8,
},
reactionListClustered: {
contentContainer: {},
reactionCount: {},
iconStyle: {},
icon: {
size: 12,
style: {},
},
},
replies: {
container: {},
content: {},
messageRepliesText: {},
avatarStackContainer: {},
},
status: {
checkAllIcon: {},
checkIcon: {},
container: {},
timeIcon: {},
},
swipeContentContainer: {},
swipeLeftContent: {
container: {},
},
targetedMessageContainer: {},
videoThumbnail: {
container: {},
roundedView: {},
},
wrapper: {},
},
poll: {
allOptions: {
listContainer: {},
titleContainer: {},
titleText: {},
wrapper: {},
},
answersList: {
container: {},
contentContainer: {},
item: {
answerText: {},
container: {},
infoContainer: {},
userInfoContainer: {},
wrapper: {},
},
},
button: { container: {}, text: {} },
createContent: {
addComment: {
title: {},
description: {},
wrapper: {},
optionCardContent: {},
optionCardSwitch: {},
},
anonymousPoll: {
title: {},
description: {},
wrapper: {},
optionCardContent: {},
optionCardSwitch: {},
},
headerContainer: {},
maxVotes: {
input: {},
validationText: {},
wrapper: {},
},
multipleAnswers: {
row: {},
description: {},
input: {},
optionCardContent: {},
optionCardSwitch: {},
settingsWrapper: {},
title: {},
optionCard: {},
wrapper: {},
},
name: {
input: {},
title: {},
},
optionCardWrapper: {},
pollOptions: {
addOption: {
text: {},
wrapper: {},
},
container: {},
optionStyle: {
content: {},
validationErrorContainer: {},
input: {},
validationErrorText: {},
wrapper: {},
},
title: {},
},
scrollView: {},
sendButton: {},
suggestOption: {
title: {},
description: {},
wrapper: {},
optionCardContent: {},
optionCardSwitch: {},
},
},
fullResults: {
container: {},
contentContainer: {},
headerContainer: {},
headerText: {},
headerTitle: {},
},
inputDialog: {
button: {},
buttonContainer: {},
container: {},
input: {},
title: {},
transparentContainer: {},
},
message: {
container: {},
header: {
subtitle: {},
title: {},
},
option: {
container: {},
info: {},
header: {},
text: {},
progressBarContainer: {},
progressBar: {},
votesContainer: {},
votesText: {},
wrapper: {},
voteButtonContainer: {},
},
optionsWrapper: {},
},
modalHeader: {
container: {},
title: {},
},
results: {
container: {},
item: {
container: {},
headerContainer: {},
title: {},
titleMeta: {},
voteCount: {},
},
scrollView: {},
title: {},
titleMeta: {},
vote: { container: {}, dateText: {}, userName: {} },
},
},
progressControl: {
container: {},
filledStyles: {},
thumb: {},
},
reply: {
audioIcon: {},
container: {},
dismissWrapper: {},
fileIcon: {},
leftContainer: {},
linkIcon: {},
locationIcon: {},
photoIcon: {},
pollIcon: {},
rightContainer: {},
subtitle: {},
subtitleContainer: {},
title: {},
videoIcon: {},
wrapper: {},
messagePreview: {
container: {},
subtitle: {},
},
},
screenPadding: 16,
selectionCircle: {
circle: {},
circleSelected: {},
},
spinner: {},
thread: {
newThread: {
container: {},
text: {},
},
},
threadListItem: {
previewMessageContainer: {},
unreadBubbleWrapper: {},
wrapper: {},
container: {},
content: {},
channelName: {},
dateText: {},
lowerRow: {},
messageRepliesText: {},
messagePreview: {
container: {},
draftText: {},
subtitle: {},
},
messagePreviewDeliveryStatus: {
container: {},
text: {},
username: {},
},
},
threadListUnreadBanner: {
text: {},
container: {},
},
typingIndicator: {
container: {},
loadingDotsBubble: {},
avatarStackContainer: {},
text: {
fontSize: 14,
},
},
waveProgressBar: {
container: {},
thumb: {},
waveform: {},
},
};