From 585e5a05920564a243daf9590fd13f8871bad80c Mon Sep 17 00:00:00 2001
From: Gleidson Daniel Silva <gleidson10daniel@hotmail.com>
Date: Wed, 17 Aug 2022 10:32:21 -0300
Subject: [PATCH] Chore: Migrate Touch to hooks (#4422)

* migrate to hooks and fix types

* fix import and remove theme prop

* update tests

* fix touch file name

* wip

* rename

* change to touch

* remove button and change to touch
---
 .../ActionSheet/BottomSheetContent.tsx        | 10 ++---
 app/containers/ActionSheet/Button.ts          |  8 ----
 app/containers/ActionSheet/Item.tsx           | 11 ++---
 app/containers/ActionSheet/index.ts           |  1 -
 .../BackgroundContainer/index.stories.js      |  3 +-
 app/containers/DirectoryItem/index.tsx        |  4 +-
 app/containers/List/ListItem.tsx              |  3 +-
 .../LoginServices/ButtonService.tsx           |  5 +--
 app/containers/MessageActions/Header.tsx      | 14 +++---
 app/containers/Passcode/Base/Button.tsx       |  3 +-
 app/containers/RoomItem/Touchable.tsx         |  5 +--
 app/containers/Touch.tsx                      | 29 +++++++++++++
 app/lib/methods/helpers/touch.tsx             | 43 -------------------
 .../Dropdown/DropdownItem.tsx                 |  4 +-
 app/views/DirectoryView/Options.tsx           | 11 ++---
 app/views/DirectoryView/index.tsx             |  4 +-
 app/views/NewMessageView.tsx                  |  4 +-
 app/views/NewServerView/ServerInput/Item.tsx  |  4 +-
 app/views/ProfileView/index.tsx               |  3 +-
 app/views/RoomActionsView/index.tsx           |  3 +-
 app/views/RoomView/List/NavBottomFAB.tsx      |  4 +-
 .../RoomView/LoadMore/LoadMore.stories.js     |  2 +-
 app/views/RoomView/LoadMore/index.tsx         |  4 +-
 app/views/RoomView/index.tsx                  |  4 +-
 app/views/SidebarView/SidebarItem.tsx         |  3 +-
 .../Dropdown/DropdownItem.tsx                 |  6 +--
 storybook/stories/List.js                     |  3 +-
 .../stories/__snapshots__/List.storyshot      |  4 +-
 28 files changed, 79 insertions(+), 123 deletions(-)
 delete mode 100644 app/containers/ActionSheet/Button.ts
 create mode 100644 app/containers/Touch.tsx
 delete mode 100644 app/lib/methods/helpers/touch.tsx

diff --git a/app/containers/ActionSheet/BottomSheetContent.tsx b/app/containers/ActionSheet/BottomSheetContent.tsx
index f614b8cb5..6d82682d4 100644
--- a/app/containers/ActionSheet/BottomSheetContent.tsx
+++ b/app/containers/ActionSheet/BottomSheetContent.tsx
@@ -2,13 +2,13 @@ import { Text } from 'react-native';
 import React from 'react';
 import { BottomSheetView, BottomSheetFlatList } from '@gorhom/bottom-sheet';
 
-import { Button } from './Button';
 import I18n from '../../i18n';
 import { useTheme } from '../../theme';
 import { IActionSheetItem, Item } from './Item';
 import { TActionSheetOptionsItem } from './Provider';
 import styles from './styles';
 import * as List from '../List';
+import Touch from '../Touch';
 
 interface IBottomSheetContentProps {
 	hasCancel?: boolean;
@@ -18,19 +18,17 @@ interface IBottomSheetContentProps {
 }
 
 const BottomSheetContent = React.memo(({ options, hasCancel, hide, children }: IBottomSheetContentProps) => {
-	const { theme, colors } = useTheme();
+	const { colors } = useTheme();
 
 	const renderFooter = () =>
 		hasCancel ? (
-			<Button
+			<Touch
 				onPress={hide}
 				style={[styles.button, { backgroundColor: colors.auxiliaryBackground }]}
-				// TODO: Remove when migrate Touch
-				theme={theme}
 				accessibilityLabel={I18n.t('Cancel')}
 			>
 				<Text style={[styles.text, { color: colors.bodyText }]}>{I18n.t('Cancel')}</Text>
-			</Button>
+			</Touch>
 		) : null;
 
 	const renderItem = ({ item }: { item: IActionSheetItem['item'] }) => <Item item={item} hide={hide} />;
diff --git a/app/containers/ActionSheet/Button.ts b/app/containers/ActionSheet/Button.ts
deleted file mode 100644
index e742b89a4..000000000
--- a/app/containers/ActionSheet/Button.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import React from 'react';
-import { TouchableOpacity } from 'react-native';
-
-import { isAndroid } from '../../lib/methods/helpers';
-import Touch from '../../lib/methods/helpers/touch';
-
-// Taken from https://github.com/rgommezz/react-native-scroll-bottom-sheet#touchables
-export const Button: typeof React.Component = isAndroid ? Touch : TouchableOpacity;
diff --git a/app/containers/ActionSheet/Item.tsx b/app/containers/ActionSheet/Item.tsx
index cb39f2c1a..5268679ae 100644
--- a/app/containers/ActionSheet/Item.tsx
+++ b/app/containers/ActionSheet/Item.tsx
@@ -4,9 +4,9 @@ import { Text, View } from 'react-native';
 import { themes } from '../../lib/constants';
 import { CustomIcon } from '../CustomIcon';
 import { useTheme } from '../../theme';
-import { Button } from './Button';
 import { TActionSheetOptionsItem } from './Provider';
 import styles from './styles';
+import Touch from '../Touch';
 
 export interface IActionSheetItem {
 	item: TActionSheetOptionsItem;
@@ -21,12 +21,7 @@ export const Item = React.memo(({ item, hide }: IActionSheetItem) => {
 	};
 
 	return (
-		<Button
-			onPress={onPress}
-			style={[styles.item, { backgroundColor: themes[theme].focusedBackground }]}
-			theme={theme}
-			testID={item.testID}
-		>
+		<Touch onPress={onPress} style={[styles.item, { backgroundColor: themes[theme].focusedBackground }]} testID={item.testID}>
 			{item.icon ? (
 				<CustomIcon name={item.icon} size={20} color={item.danger ? themes[theme].dangerColor : themes[theme].bodyText} />
 			) : null}
@@ -42,6 +37,6 @@ export const Item = React.memo(({ item, hide }: IActionSheetItem) => {
 				</Text>
 			</View>
 			{item.right ? <View style={styles.rightContainer}>{item.right ? item.right() : null}</View> : null}
-		</Button>
+		</Touch>
 	);
 });
diff --git a/app/containers/ActionSheet/index.ts b/app/containers/ActionSheet/index.ts
index d714d22bb..505094109 100644
--- a/app/containers/ActionSheet/index.ts
+++ b/app/containers/ActionSheet/index.ts
@@ -1,2 +1 @@
 export * from './Provider';
-export * from './Button';
diff --git a/app/containers/BackgroundContainer/index.stories.js b/app/containers/BackgroundContainer/index.stories.js
index 4d1abfb65..14eec29ac 100644
--- a/app/containers/BackgroundContainer/index.stories.js
+++ b/app/containers/BackgroundContainer/index.stories.js
@@ -4,6 +4,7 @@ import { storiesOf } from '@storybook/react-native';
 
 import { ThemeContext } from '../../theme';
 import { longText } from '../../../storybook/utils';
+import { themes } from '../../lib/constants';
 import BackgroundContainer from '.';
 
 const stories = storiesOf('BackgroundContainer', module);
@@ -17,7 +18,7 @@ stories.add('text', () => <BackgroundContainer text='Text here' />);
 stories.add('long text', () => <BackgroundContainer text={longText} />);
 
 const ThemeStory = ({ theme, ...props }) => (
-	<ThemeContext.Provider value={{ theme }}>
+	<ThemeContext.Provider value={{ theme, colors: themes[theme] }}>
 		<BackgroundContainer {...props} />
 	</ThemeContext.Provider>
 );
diff --git a/app/containers/DirectoryItem/index.tsx b/app/containers/DirectoryItem/index.tsx
index edba47866..5edf32637 100644
--- a/app/containers/DirectoryItem/index.tsx
+++ b/app/containers/DirectoryItem/index.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Text, View, ViewStyle } from 'react-native';
 
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../Touch';
 import Avatar from '../Avatar';
 import RoomTypeIcon from '../RoomTypeIcon';
 import styles, { ROW_HEIGHT } from './styles';
@@ -49,7 +49,7 @@ const DirectoryItem = ({
 }: IDirectoryItem): React.ReactElement => {
 	const { theme } = useTheme();
 	return (
-		<Touch onPress={onPress} style={{ backgroundColor: themes[theme].backgroundColor }} testID={testID} theme={theme}>
+		<Touch onPress={onPress} style={{ backgroundColor: themes[theme].backgroundColor }} testID={testID}>
 			<View style={[styles.directoryItemContainer, styles.directoryItemButton, style]}>
 				<Avatar text={avatar} size={30} type={type} rid={rid} style={styles.directoryItemAvatar} />
 				<View style={styles.directoryItemTextContainer}>
diff --git a/app/containers/List/ListItem.tsx b/app/containers/List/ListItem.tsx
index bd1459815..9e75ea876 100644
--- a/app/containers/List/ListItem.tsx
+++ b/app/containers/List/ListItem.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { I18nManager, StyleProp, StyleSheet, Text, TextStyle, View } from 'react-native';
 
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../Touch';
 import { themes } from '../../lib/constants';
 import sharedStyles from '../../views/Styles';
 import { TSupportedThemes, useTheme } from '../../theme';
@@ -139,7 +139,6 @@ const Button = React.memo(({ onPress, backgroundColor, underlayColor, ...props }
 		style={{ backgroundColor: backgroundColor || themes[props.theme].backgroundColor }}
 		underlayColor={underlayColor}
 		enabled={!props.disabled}
-		theme={props.theme}
 	>
 		<Content {...props} />
 	</Touch>
diff --git a/app/containers/LoginServices/ButtonService.tsx b/app/containers/LoginServices/ButtonService.tsx
index 9975c9933..048cdcb77 100644
--- a/app/containers/LoginServices/ButtonService.tsx
+++ b/app/containers/LoginServices/ButtonService.tsx
@@ -2,20 +2,19 @@ import React from 'react';
 import { Text, View } from 'react-native';
 
 import { useTheme } from '../../theme';
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../Touch';
 import { CustomIcon } from '../CustomIcon';
 import { IButtonService } from './interfaces';
 import styles from './styles';
 
 const ButtonService = ({ name, authType, onPress, backgroundColor, buttonText, icon }: IButtonService) => {
-	const { theme, colors } = useTheme();
+	const { colors } = useTheme();
 
 	return (
 		<Touch
 			key={name}
 			onPress={onPress}
 			style={[styles.serviceButton, { backgroundColor }]}
-			theme={theme}
 			activeOpacity={0.5}
 			underlayColor={colors.buttonText}
 		>
diff --git a/app/containers/MessageActions/Header.tsx b/app/containers/MessageActions/Header.tsx
index e75d7ca7c..1e573dc07 100644
--- a/app/containers/MessageActions/Header.tsx
+++ b/app/containers/MessageActions/Header.tsx
@@ -7,10 +7,10 @@ import { CustomIcon } from '../CustomIcon';
 import shortnameToUnicode from '../../lib/methods/helpers/shortnameToUnicode';
 import CustomEmoji from '../EmojiPicker/CustomEmoji';
 import database from '../../lib/database';
-import { Button } from '../ActionSheet';
 import { useDimensions } from '../../dimensions';
 import sharedStyles from '../../views/Styles';
 import { TAnyMessageModel, TFrequentlyUsedEmojiModel } from '../../definitions';
+import Touch from '../Touch';
 
 type TItem = TFrequentlyUsedEmojiModel | string;
 
@@ -75,30 +75,28 @@ const HeaderItem = ({ item, onReaction, server, theme }: THeaderItem) => {
 	const emojiModel = item as TFrequentlyUsedEmojiModel;
 	const emoji = (emojiModel.id ? emojiModel.content : item) as string;
 	return (
-		<Button
+		<Touch
 			testID={`message-actions-emoji-${emoji}`}
 			onPress={() => onReaction({ emoji: `:${emoji}:` })}
 			style={[styles.headerItem, { backgroundColor: themes[theme].auxiliaryBackground }]}
-			theme={theme}
 		>
 			{emojiModel?.isCustom ? (
 				<CustomEmoji style={styles.customEmoji} emoji={emojiModel} baseUrl={server} />
 			) : (
 				<Text style={styles.headerIcon}>{shortnameToUnicode(`:${emoji}:`)}</Text>
 			)}
-		</Button>
+		</Touch>
 	);
 };
 
 const HeaderFooter = ({ onReaction, theme }: THeaderFooter) => (
-	<Button
+	<Touch
 		testID='add-reaction'
-		onPress={onReaction}
+		onPress={(param: any) => onReaction(param)}
 		style={[styles.headerItem, { backgroundColor: themes[theme].auxiliaryBackground }]}
-		theme={theme}
 	>
 		<CustomIcon name='reaction-add' size={24} color={themes[theme].bodyText} />
-	</Button>
+	</Touch>
 );
 
 const Header = React.memo(({ handleReaction, server, message, isMasterDetail }: IHeader) => {
diff --git a/app/containers/Passcode/Base/Button.tsx b/app/containers/Passcode/Base/Button.tsx
index 703082234..b768fb50c 100644
--- a/app/containers/Passcode/Base/Button.tsx
+++ b/app/containers/Passcode/Base/Button.tsx
@@ -3,7 +3,7 @@ import { Text } from 'react-native';
 
 import styles from './styles';
 import { themes } from '../../../lib/constants';
-import Touch from '../../../lib/methods/helpers/touch';
+import Touch from '../../Touch';
 import { CustomIcon, TIconsName } from '../../CustomIcon';
 import { useTheme } from '../../../theme';
 
@@ -25,7 +25,6 @@ const Button = React.memo(({ text, disabled, onPress, icon }: IPasscodeButton) =
 			underlayColor={themes[theme].passcodeButtonActive}
 			rippleColor={themes[theme].passcodeButtonActive}
 			enabled={!disabled}
-			theme={theme}
 			onPress={press}
 		>
 			{icon ? (
diff --git a/app/containers/RoomItem/Touchable.tsx b/app/containers/RoomItem/Touchable.tsx
index f2b8d5e94..881a24cbf 100644
--- a/app/containers/RoomItem/Touchable.tsx
+++ b/app/containers/RoomItem/Touchable.tsx
@@ -14,7 +14,7 @@ import {
 	PanGestureHandlerEventPayload
 } from 'react-native-gesture-handler';
 
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../Touch';
 import { ACTION_WIDTH, LONG_SWIPE, SMALL_SWIPE } from './styles';
 import { LeftActions, RightActions } from './Actions';
 import { ITouchableProps } from './interfaces';
@@ -38,7 +38,7 @@ const Touchable = ({
 	swipeEnabled,
 	displayMode
 }: ITouchableProps): React.ReactElement => {
-	const { theme, colors } = useTheme();
+	const { colors } = useTheme();
 
 	const rowOffSet = useSharedValue(0);
 	const transX = useSharedValue(0);
@@ -221,7 +221,6 @@ const Touchable = ({
 						<Animated.View style={animatedStyles}>
 							<Touch
 								onPress={handlePress}
-								theme={theme}
 								testID={testID}
 								style={{
 									backgroundColor: isFocused ? colors.chatComponentBackground : colors.backgroundColor
diff --git a/app/containers/Touch.tsx b/app/containers/Touch.tsx
new file mode 100644
index 000000000..190a74a2c
--- /dev/null
+++ b/app/containers/Touch.tsx
@@ -0,0 +1,29 @@
+import React from 'react';
+import { RectButton, RectButtonProps } from 'react-native-gesture-handler';
+
+import { useTheme } from '../theme';
+
+export interface ITouchProps extends RectButtonProps {
+	children: React.ReactNode;
+	accessibilityLabel?: string;
+	testID?: string;
+}
+
+const Touch = React.forwardRef<RectButton, ITouchProps>(({ children, onPress, underlayColor, ...props }, ref) => {
+	const { colors } = useTheme();
+
+	return (
+		<RectButton
+			ref={ref}
+			onPress={onPress}
+			activeOpacity={1}
+			underlayColor={underlayColor || colors.bannerBackground}
+			rippleColor={colors.bannerBackground}
+			{...props}
+		>
+			{children}
+		</RectButton>
+	);
+});
+
+export default Touch;
diff --git a/app/lib/methods/helpers/touch.tsx b/app/lib/methods/helpers/touch.tsx
deleted file mode 100644
index 87e12d3bf..000000000
--- a/app/lib/methods/helpers/touch.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import React from 'react';
-import { RectButton, RectButtonProps } from 'react-native-gesture-handler';
-
-import { TSupportedThemes } from '../../../theme';
-import { themes } from '../../constants';
-
-interface ITouchProps extends RectButtonProps {
-	children: React.ReactNode;
-	theme: TSupportedThemes;
-	accessibilityLabel?: string;
-	testID?: string;
-}
-
-class Touch extends React.Component<ITouchProps> {
-	private ref: any;
-
-	setNativeProps(props: ITouchProps): void {
-		this.ref.setNativeProps(props);
-	}
-
-	getRef = (ref: RectButton): void => {
-		this.ref = ref;
-	};
-
-	render(): JSX.Element {
-		const { children, onPress, theme, underlayColor, ...props } = this.props;
-
-		return (
-			<RectButton
-				ref={this.getRef}
-				onPress={onPress}
-				activeOpacity={1}
-				underlayColor={underlayColor || themes[theme].bannerBackground}
-				rippleColor={themes[theme].bannerBackground}
-				{...props}
-			>
-				{children}
-			</RectButton>
-		);
-	}
-}
-
-export default Touch;
diff --git a/app/views/CannedResponsesListView/Dropdown/DropdownItem.tsx b/app/views/CannedResponsesListView/Dropdown/DropdownItem.tsx
index 354022431..5ecdae1aa 100644
--- a/app/views/CannedResponsesListView/Dropdown/DropdownItem.tsx
+++ b/app/views/CannedResponsesListView/Dropdown/DropdownItem.tsx
@@ -3,7 +3,7 @@ import { StyleSheet, Text, View } from 'react-native';
 
 import { themes } from '../../../lib/constants';
 import { useTheme } from '../../../theme';
-import Touch from '../../../lib/methods/helpers/touch';
+import Touch from '../../../containers/Touch';
 import { CustomIcon, TIconsName } from '../../../containers/CustomIcon';
 import sharedStyles from '../../Styles';
 
@@ -34,7 +34,7 @@ const DropdownItem = React.memo(({ onPress, iconName, text }: IDropdownItem) =>
 	const { theme } = useTheme();
 
 	return (
-		<Touch theme={theme} onPress={onPress} style={{ backgroundColor: themes[theme].backgroundColor }}>
+		<Touch onPress={onPress} style={{ backgroundColor: themes[theme].backgroundColor }}>
 			<View style={styles.container}>
 				<Text style={[styles.text, { color: themes[theme].auxiliaryText }]}>{text}</Text>
 				{iconName ? <CustomIcon name={iconName} size={22} color={themes[theme].auxiliaryText} /> : null}
diff --git a/app/views/DirectoryView/Options.tsx b/app/views/DirectoryView/Options.tsx
index 198ded49d..43c84fc09 100644
--- a/app/views/DirectoryView/Options.tsx
+++ b/app/views/DirectoryView/Options.tsx
@@ -1,7 +1,7 @@
 import React, { PureComponent } from 'react';
 import { Animated, Easing, Switch, Text, TouchableWithoutFeedback, View } from 'react-native';
 
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../../containers/Touch';
 import { CustomIcon, TIconsName } from '../../containers/CustomIcon';
 import Check from '../../containers/Check';
 import I18n from '../../i18n';
@@ -64,12 +64,7 @@ export default class DirectoryOptions extends PureComponent<IDirectoryOptionsPro
 		}
 
 		return (
-			<Touch
-				onPress={() => changeType(itemType)}
-				style={styles.dropdownItemButton}
-				theme={theme}
-				accessibilityLabel={I18n.t(text)}
-			>
+			<Touch onPress={() => changeType(itemType)} style={styles.dropdownItemButton} accessibilityLabel={I18n.t(text)}>
 				<View style={styles.dropdownItemContainer}>
 					<CustomIcon name={icon} size={22} color={themes[theme].bodyText} style={styles.dropdownItemIcon} />
 					<Text style={[styles.dropdownItemText, { color: themes[theme].bodyText }]}>{I18n.t(text)}</Text>
@@ -97,7 +92,7 @@ export default class DirectoryOptions extends PureComponent<IDirectoryOptionsPro
 				<Animated.View
 					style={[styles.dropdownContainer, { transform: [{ translateY }], backgroundColor: themes[theme].backgroundColor }]}
 				>
-					<Touch onPress={this.close} theme={theme} accessibilityLabel={I18n.t('Search_by')}>
+					<Touch onPress={this.close} accessibilityLabel={I18n.t('Search_by')}>
 						<View
 							style={[
 								styles.dropdownContainerHeader,
diff --git a/app/views/DirectoryView/index.tsx b/app/views/DirectoryView/index.tsx
index c6566d6cf..aa72ea5a5 100644
--- a/app/views/DirectoryView/index.tsx
+++ b/app/views/DirectoryView/index.tsx
@@ -7,7 +7,7 @@ import { CompositeNavigationProp } from '@react-navigation/native';
 import { ChatsStackParamList } from '../../stacks/types';
 import { MasterDetailInsideStackParamList } from '../../stacks/MasterDetailStack/types';
 import * as List from '../../containers/List';
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../../containers/Touch';
 import DirectoryItem from '../../containers/DirectoryItem';
 import sharedStyles from '../Styles';
 import I18n from '../../i18n';
@@ -210,7 +210,7 @@ class DirectoryView extends React.Component<IDirectoryViewProps, IDirectoryViewS
 		return (
 			<>
 				<SearchBox onChangeText={this.onSearchChangeText} onSubmitEditing={this.search} testID='directory-view-search' />
-				<Touch onPress={this.toggleDropdown} style={styles.dropdownItemButton} testID='directory-view-dropdown' theme={theme}>
+				<Touch onPress={this.toggleDropdown} style={styles.dropdownItemButton} testID='directory-view-dropdown'>
 					<View
 						style={[
 							sharedStyles.separatorVertical,
diff --git a/app/views/NewMessageView.tsx b/app/views/NewMessageView.tsx
index cb0ae7d57..c8f70ec93 100644
--- a/app/views/NewMessageView.tsx
+++ b/app/views/NewMessageView.tsx
@@ -21,7 +21,7 @@ import UserItem from '../containers/UserItem';
 import { withTheme } from '../theme';
 import { goRoom, TGoRoomItem } from '../lib/methods/helpers/goRoom';
 import log, { events, logEvent } from '../lib/methods/helpers/log';
-import Touch from '../lib/methods/helpers/touch';
+import Touch from '../containers/Touch';
 import sharedStyles from './Styles';
 import { NewMessageStackParamList } from '../stacks/types';
 import { search } from '../lib/methods';
@@ -180,7 +180,7 @@ class NewMessageView extends React.Component<INewMessageViewProps, INewMessageVi
 	renderButton = ({ onPress, testID, title, icon, first }: IButton) => {
 		const { theme } = this.props;
 		return (
-			<Touch onPress={onPress} style={{ backgroundColor: themes[theme].backgroundColor }} testID={testID} theme={theme}>
+			<Touch onPress={onPress} style={{ backgroundColor: themes[theme].backgroundColor }} testID={testID}>
 				<View
 					style={[
 						first ? sharedStyles.separatorVertical : sharedStyles.separatorBottom,
diff --git a/app/views/NewServerView/ServerInput/Item.tsx b/app/views/NewServerView/ServerInput/Item.tsx
index 42b5a354c..0352d7ad3 100644
--- a/app/views/NewServerView/ServerInput/Item.tsx
+++ b/app/views/NewServerView/ServerInput/Item.tsx
@@ -5,7 +5,7 @@ import { BorderlessButton } from 'react-native-gesture-handler';
 import { themes } from '../../../lib/constants';
 import { CustomIcon } from '../../../containers/CustomIcon';
 import sharedStyles from '../../Styles';
-import Touch from '../../../lib/methods/helpers/touch';
+import Touch from '../../../containers/Touch';
 import { TServerHistoryModel } from '../../../definitions/IServerHistory';
 import { TSupportedThemes } from '../../../theme';
 
@@ -36,7 +36,7 @@ interface IItem {
 }
 
 const Item = ({ item, theme, onPress, onDelete }: IItem): JSX.Element => (
-	<Touch style={styles.container} onPress={() => onPress(item.url)} theme={theme} testID={`server-history-${item.url}`}>
+	<Touch style={styles.container} onPress={() => onPress(item.url)} testID={`server-history-${item.url}`}>
 		<View style={styles.content}>
 			<Text numberOfLines={1} style={[styles.server, { color: themes[theme].bodyText }]}>
 				{item.url}
diff --git a/app/views/ProfileView/index.tsx b/app/views/ProfileView/index.tsx
index 5d3109742..c428a0d4e 100644
--- a/app/views/ProfileView/index.tsx
+++ b/app/views/ProfileView/index.tsx
@@ -8,7 +8,7 @@ import { dequal } from 'dequal';
 import omit from 'lodash/omit';
 import { StackNavigationOptions } from '@react-navigation/stack';
 
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../../containers/Touch';
 import KeyboardView from '../../containers/KeyboardView';
 import sharedStyles from '../Styles';
 import scrollPersistTaps from '../../lib/methods/helpers/scrollPersistTaps';
@@ -376,7 +376,6 @@ class ProfileView extends React.Component<IProfileViewProps, IProfileViewState>
 				onPress={onPress}
 				style={[styles.avatarButton, { opacity: disabled ? 0.5 : 1 }, { backgroundColor: themes[theme].borderColor }]}
 				enabled={!disabled}
-				theme={theme}
 			>
 				{child}
 			</Touch>
diff --git a/app/views/RoomActionsView/index.tsx b/app/views/RoomActionsView/index.tsx
index e8bbcb00b..df0707a70 100644
--- a/app/views/RoomActionsView/index.tsx
+++ b/app/views/RoomActionsView/index.tsx
@@ -28,7 +28,7 @@ import { ChatsStackParamList } from '../../stacks/types';
 import { withTheme } from '../../theme';
 import { showConfirmationAlert, showErrorAlert } from '../../lib/methods/helpers/info';
 import log, { events, logEvent } from '../../lib/methods/helpers/log';
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../../containers/Touch';
 import sharedStyles from '../Styles';
 import styles from './styles';
 import { ERoomType } from '../../definitions/ERoomType';
@@ -807,7 +807,6 @@ class RoomActionsView extends React.Component<IRoomActionsViewProps, IRoomAction
 					accessibilityLabel={I18n.t('Room_Info')}
 					enabled={!isGroupChatHandler}
 					testID='room-actions-info'
-					theme={theme}
 				>
 					<View style={[styles.roomInfoContainer, { height: 72 * fontScale }]}>
 						<Avatar text={avatar} style={styles.avatar} size={50 * fontScale} type={t} rid={rid}>
diff --git a/app/views/RoomView/List/NavBottomFAB.tsx b/app/views/RoomView/List/NavBottomFAB.tsx
index 895c1278a..695c4ba38 100644
--- a/app/views/RoomView/List/NavBottomFAB.tsx
+++ b/app/views/RoomView/List/NavBottomFAB.tsx
@@ -5,7 +5,7 @@ import Animated, { call, cond, greaterOrEq, useCode } from 'react-native-reanima
 import { themes } from '../../../lib/constants';
 import { CustomIcon } from '../../../containers/CustomIcon';
 import { useTheme } from '../../../theme';
-import Touch from '../../../lib/methods/helpers/touch';
+import Touch from '../../../containers/Touch';
 import { hasNotch } from '../../../lib/methods/helpers';
 
 const SCROLL_LIMIT = 200;
@@ -63,7 +63,7 @@ const NavBottomFAB = ({
 	}
 	return (
 		<Animated.View style={[styles.container, { bottom }]} testID='nav-jump-to-bottom'>
-			<Touch onPress={handleOnPress} theme={theme} style={[styles.button, { backgroundColor: themes[theme].backgroundColor }]}>
+			<Touch onPress={handleOnPress} style={[styles.button, { backgroundColor: themes[theme].backgroundColor }]}>
 				<View style={[styles.content, { borderColor: themes[theme].borderColor }]}>
 					<CustomIcon name='chevron-down' color={themes[theme].auxiliaryTintColor} size={36} />
 				</View>
diff --git a/app/views/RoomView/LoadMore/LoadMore.stories.js b/app/views/RoomView/LoadMore/LoadMore.stories.js
index 8d13d55ca..b186b0117 100644
--- a/app/views/RoomView/LoadMore/LoadMore.stories.js
+++ b/app/views/RoomView/LoadMore/LoadMore.stories.js
@@ -24,7 +24,7 @@ stories.add('basic', () => (
 ));
 
 const ThemeStory = ({ theme }) => (
-	<ThemeContext.Provider value={{ theme }}>
+	<ThemeContext.Provider value={{ theme, colors: themes[theme] }}>
 		<ScrollView style={{ backgroundColor: themes[theme].backgroundColor }}>
 			<LoadMore load={load} type={MessageTypeLoad.PREVIOUS_CHUNK} />
 			<Message msg='Hey!' theme={theme} />
diff --git a/app/views/RoomView/LoadMore/index.tsx b/app/views/RoomView/LoadMore/index.tsx
index bb88c525c..d08d82460 100644
--- a/app/views/RoomView/LoadMore/index.tsx
+++ b/app/views/RoomView/LoadMore/index.tsx
@@ -4,7 +4,7 @@ import { ActivityIndicator, StyleSheet, Text } from 'react-native';
 import { MessageTypeLoad, themes } from '../../../lib/constants';
 import { MessageType } from '../../../definitions';
 import { useTheme } from '../../../theme';
-import Touch from '../../../lib/methods/helpers/touch';
+import Touch from '../../../containers/Touch';
 import sharedStyles from '../../Styles';
 import I18n from '../../../i18n';
 
@@ -59,7 +59,7 @@ const LoadMore = ({
 	}
 
 	return (
-		<Touch onPress={handleLoad} style={styles.button} theme={theme} enabled={!loading}>
+		<Touch onPress={handleLoad} style={styles.button} enabled={!loading}>
 			{loading ? (
 				<ActivityIndicator color={themes[theme].auxiliaryText} />
 			) : (
diff --git a/app/views/RoomView/index.tsx b/app/views/RoomView/index.tsx
index b9bbdd6dc..0883cb7ba 100644
--- a/app/views/RoomView/index.tsx
+++ b/app/views/RoomView/index.tsx
@@ -9,7 +9,7 @@ import { EdgeInsets, withSafeAreaInsets } from 'react-native-safe-area-context';
 import { Subscription } from 'rxjs';
 
 import { getRoutingConfig } from '../../lib/services/restApi';
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../../containers/Touch';
 import { replyBroadcast } from '../../actions/messages';
 import database from '../../lib/database';
 import Message from '../../containers/message';
@@ -1385,7 +1385,6 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 						onPress={this.resumeRoom}
 						style={[styles.joinRoomButton, { backgroundColor: themes[theme].actionTintColor }]}
 						enabled={!loading}
-						theme={theme}
 					>
 						<Text style={[styles.joinRoomText, { color: themes[theme].buttonText }]} testID='room-view-chat-on-hold-button'>
 							{I18n.t('Resume')}
@@ -1407,7 +1406,6 @@ class RoomView extends React.Component<IRoomViewProps, IRoomViewState> {
 						onPress={this.joinRoom}
 						style={[styles.joinRoomButton, { backgroundColor: themes[theme].actionTintColor }]}
 						enabled={!loading}
-						theme={theme}
 					>
 						<Text style={[styles.joinRoomText, { color: themes[theme].buttonText }]} testID='room-view-join-button'>
 							{I18n.t(this.isOmnichannel ? 'Take_it' : 'Join')}
diff --git a/app/views/SidebarView/SidebarItem.tsx b/app/views/SidebarView/SidebarItem.tsx
index 835bc406d..422d90fe4 100644
--- a/app/views/SidebarView/SidebarItem.tsx
+++ b/app/views/SidebarView/SidebarItem.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Text, View } from 'react-native';
 
-import Touch from '../../lib/methods/helpers/touch';
+import Touch from '../../containers/Touch';
 import { themes } from '../../lib/constants';
 import { TSupportedThemes, withTheme } from '../../theme';
 import styles from './styles';
@@ -21,7 +21,6 @@ const Item = React.memo(({ left, right, text, onPress, testID, current, theme }:
 		key={testID}
 		testID={testID}
 		onPress={onPress}
-		theme={theme}
 		style={[styles.item, current && { backgroundColor: themes[theme].borderColor }]}
 	>
 		<View style={styles.itemHorizontal}>{left}</View>
diff --git a/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx b/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx
index 01943e64b..95b2a819b 100644
--- a/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx
+++ b/app/views/ThreadMessagesView/Dropdown/DropdownItem.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 
 import { useTheme } from '../../../theme';
-import Touch from '../../../lib/methods/helpers/touch';
+import Touch from '../../../containers/Touch';
 import { CustomIcon, TIconsName } from '../../../containers/CustomIcon';
 import sharedStyles from '../../Styles';
 
@@ -28,9 +28,9 @@ interface IDropdownItem {
 }
 
 const DropdownItem = React.memo(({ onPress, iconName, text }: IDropdownItem) => {
-	const { colors, theme } = useTheme();
+	const { colors } = useTheme();
 	return (
-		<Touch theme={theme} onPress={onPress} style={{ backgroundColor: colors.backgroundColor }}>
+		<Touch onPress={onPress} style={{ backgroundColor: colors.backgroundColor }}>
 			<View style={styles.container}>
 				<Text style={[styles.text, { color: colors.auxiliaryText }]}>{text}</Text>
 				{iconName ? <CustomIcon name={iconName} size={22} color={colors.auxiliaryText} /> : null}
diff --git a/storybook/stories/List.js b/storybook/stories/List.js
index 5b7ac2612..2f4ba3aad 100644
--- a/storybook/stories/List.js
+++ b/storybook/stories/List.js
@@ -8,6 +8,7 @@ import SafeAreaView from '../../app/containers/SafeAreaView';
 import { longText } from '../utils';
 import { ThemeContext } from '../../app/theme';
 import { DimensionsContext } from '../../app/dimensions';
+import { themes } from '../../app/lib/constants';
 
 const stories = storiesOf('List', module);
 
@@ -176,7 +177,7 @@ const ListFull = () => (
 );
 
 const ThemeStory = ({ theme }) => (
-	<ThemeContext.Provider value={{ theme }}>
+	<ThemeContext.Provider value={{ theme, colors: themes[theme] }}>
 		<ListFull />
 	</ThemeContext.Provider>
 );
diff --git a/storybook/stories/__snapshots__/List.storyshot b/storybook/stories/__snapshots__/List.storyshot
index 4dfc69bfe..878af1273 100644
--- a/storybook/stories/__snapshots__/List.storyshot
+++ b/storybook/stories/__snapshots__/List.storyshot
@@ -16,11 +16,11 @@ exports[`Storyshots List with FlatList 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\"
 
 exports[`Storyshots List with bigger font 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"light\\",\\"colors\\":{\\"backgroundColor\\":\\"#ffffff\\",\\"focusedBackground\\":\\"#ffffff\\",\\"chatComponentBackground\\":\\"#f3f4f5\\",\\"auxiliaryBackground\\":\\"#efeff4\\",\\"bannerBackground\\":\\"#f1f2f4\\",\\"titleText\\":\\"#0d0e12\\",\\"bodyText\\":\\"#2f343d\\",\\"backdropColor\\":\\"#000000\\",\\"dangerColor\\":\\"#f5455c\\",\\"successColor\\":\\"#2de0a5\\",\\"borderColor\\":\\"#e1e5e8\\",\\"controlText\\":\\"#54585e\\",\\"auxiliaryText\\":\\"#9ca2a8\\",\\"infoText\\":\\"#6d6d72\\",\\"tintColor\\":\\"#1d74f5\\",\\"tintActive\\":\\"#549df9\\",\\"tintDisabled\\":\\"#88B4F5\\",\\"auxiliaryTintColor\\":\\"#6C727A\\",\\"actionTintColor\\":\\"#1d74f5\\",\\"separatorColor\\":\\"#cbcbcc\\",\\"navbarBackground\\":\\"#ffffff\\",\\"headerBorder\\":\\"#B2B2B2\\",\\"headerBackground\\":\\"#EEEFF1\\",\\"headerSecondaryBackground\\":\\"#ffffff\\",\\"headerTintColor\\":\\"#6C727A\\",\\"headerTitleColor\\":\\"#0C0D0F\\",\\"headerSecondaryText\\":\\"#1d74f5\\",\\"toastBackground\\":\\"#0C0D0F\\",\\"videoBackground\\":\\"#1f2329\\",\\"favoriteBackground\\":\\"#ffbb00\\",\\"hideBackground\\":\\"#54585e\\",\\"messageboxBackground\\":\\"#ffffff\\",\\"searchboxBackground\\":\\"#E6E6E7\\",\\"buttonBackground\\":\\"#414852\\",\\"buttonText\\":\\"#ffffff\\",\\"passcodeBackground\\":\\"#EEEFF1\\",\\"passcodeButtonActive\\":\\"#E4E7EA\\",\\"passcodeLockIcon\\":\\"#6C727A\\",\\"passcodePrimary\\":\\"#2F343D\\",\\"passcodeSecondary\\":\\"#6C727A\\",\\"passcodeDotEmpty\\":\\"#CBCED1\\",\\"passcodeDotFull\\":\\"#6C727A\\",\\"previewBackground\\":\\"#1F2329\\",\\"previewTintColor\\":\\"#f9f9f9\\",\\"backdropOpacity\\":0.3,\\"attachmentLoadingOpacity\\":0.7,\\"collapsibleQuoteBorder\\":\\"#CBCED1\\",\\"collapsibleChevron\\":\\"#6C727A\\",\\"cancelButton\\":\\"#E4E7EA\\",\\"unreadColor\\":\\"#6C727A\\",\\"tunreadColor\\":\\"#1d74f5\\",\\"mentionMeColor\\":\\"#F5455C\\",\\"mentionGroupColor\\":\\"#F38C39\\",\\"mentionOtherColor\\":\\"#F3BE08\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":69}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]}]}]}]}"`;
 
-exports[`Storyshots List with black theme 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#080808\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"black\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]}]}]}]}"`;
+exports[`Storyshots List with black theme 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#080808\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"black\\",\\"colors\\":{\\"backgroundColor\\":\\"#000000\\",\\"focusedBackground\\":\\"#0d0d0d\\",\\"chatComponentBackground\\":\\"#16181a\\",\\"auxiliaryBackground\\":\\"#080808\\",\\"bannerBackground\\":\\"#1f2329\\",\\"titleText\\":\\"#f9f9f9\\",\\"bodyText\\":\\"#cbced1\\",\\"backdropColor\\":\\"#000000\\",\\"dangerColor\\":\\"#f5455c\\",\\"successColor\\":\\"#2de0a5\\",\\"borderColor\\":\\"#1f2329\\",\\"controlText\\":\\"#dadde6\\",\\"auxiliaryText\\":\\"#b2b8c6\\",\\"infoText\\":\\"#6d6d72\\",\\"tintColor\\":\\"#1e9bfe\\",\\"tintActive\\":\\"#76b7fc\\",\\"tintDisabled\\":\\"#88B4F5\\",\\"auxiliaryTintColor\\":\\"#f9f9f9\\",\\"actionTintColor\\":\\"#1e9bfe\\",\\"separatorColor\\":\\"#272728\\",\\"navbarBackground\\":\\"#0d0d0d\\",\\"headerBorder\\":\\"#323232\\",\\"headerBackground\\":\\"#0d0d0d\\",\\"headerSecondaryBackground\\":\\"#0d0d0d\\",\\"headerTintColor\\":\\"#f9f9f9\\",\\"headerTitleColor\\":\\"#f9f9f9\\",\\"headerSecondaryText\\":\\"#b2b8c6\\",\\"toastBackground\\":\\"#0C0D0F\\",\\"videoBackground\\":\\"#1f2329\\",\\"favoriteBackground\\":\\"#ffbb00\\",\\"hideBackground\\":\\"#54585e\\",\\"messageboxBackground\\":\\"#0d0d0d\\",\\"searchboxBackground\\":\\"#1f1f1f\\",\\"buttonBackground\\":\\"#414852\\",\\"buttonText\\":\\"#ffffff\\",\\"passcodeBackground\\":\\"#000000\\",\\"passcodeButtonActive\\":\\"#0E0D0D\\",\\"passcodeLockIcon\\":\\"#6C727A\\",\\"passcodePrimary\\":\\"#FFFFFF\\",\\"passcodeSecondary\\":\\"#CBCED1\\",\\"passcodeDotEmpty\\":\\"#CBCED1\\",\\"passcodeDotFull\\":\\"#6C727A\\",\\"previewBackground\\":\\"#000000\\",\\"previewTintColor\\":\\"#f9f9f9\\",\\"backdropOpacity\\":0.9,\\"attachmentLoadingOpacity\\":0.3,\\"collapsibleQuoteBorder\\":\\"#CBCED1\\",\\"collapsibleChevron\\":\\"#6C727A\\",\\"cancelButton\\":\\"#E4E7EA\\",\\"unreadColor\\":\\"#6C727A\\",\\"tunreadColor\\":\\"#1d74f5\\",\\"mentionMeColor\\":\\"#F5455C\\",\\"mentionGroupColor\\":\\"#F38C39\\",\\"mentionOtherColor\\":\\"#F3BE08\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#b2b8c6\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#b2b8c6\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#272728\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6d6d72\\"}]},\\"children\\":[\\"Chats\\"]}]}]}]}]}]}"`;
 
 exports[`Storyshots List with custom colors 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"light\\",\\"colors\\":{\\"backgroundColor\\":\\"#ffffff\\",\\"focusedBackground\\":\\"#ffffff\\",\\"chatComponentBackground\\":\\"#f3f4f5\\",\\"auxiliaryBackground\\":\\"#efeff4\\",\\"bannerBackground\\":\\"#f1f2f4\\",\\"titleText\\":\\"#0d0e12\\",\\"bodyText\\":\\"#2f343d\\",\\"backdropColor\\":\\"#000000\\",\\"dangerColor\\":\\"#f5455c\\",\\"successColor\\":\\"#2de0a5\\",\\"borderColor\\":\\"#e1e5e8\\",\\"controlText\\":\\"#54585e\\",\\"auxiliaryText\\":\\"#9ca2a8\\",\\"infoText\\":\\"#6d6d72\\",\\"tintColor\\":\\"#1d74f5\\",\\"tintActive\\":\\"#549df9\\",\\"tintDisabled\\":\\"#88B4F5\\",\\"auxiliaryTintColor\\":\\"#6C727A\\",\\"actionTintColor\\":\\"#1d74f5\\",\\"separatorColor\\":\\"#cbcbcc\\",\\"navbarBackground\\":\\"#ffffff\\",\\"headerBorder\\":\\"#B2B2B2\\",\\"headerBackground\\":\\"#EEEFF1\\",\\"headerSecondaryBackground\\":\\"#ffffff\\",\\"headerTintColor\\":\\"#6C727A\\",\\"headerTitleColor\\":\\"#0C0D0F\\",\\"headerSecondaryText\\":\\"#1d74f5\\",\\"toastBackground\\":\\"#0C0D0F\\",\\"videoBackground\\":\\"#1f2329\\",\\"favoriteBackground\\":\\"#ffbb00\\",\\"hideBackground\\":\\"#54585e\\",\\"messageboxBackground\\":\\"#ffffff\\",\\"searchboxBackground\\":\\"#E6E6E7\\",\\"buttonBackground\\":\\"#414852\\",\\"buttonText\\":\\"#ffffff\\",\\"passcodeBackground\\":\\"#EEEFF1\\",\\"passcodeButtonActive\\":\\"#E4E7EA\\",\\"passcodeLockIcon\\":\\"#6C727A\\",\\"passcodePrimary\\":\\"#2F343D\\",\\"passcodeSecondary\\":\\"#6C727A\\",\\"passcodeDotEmpty\\":\\"#CBCED1\\",\\"passcodeDotFull\\":\\"#6C727A\\",\\"previewBackground\\":\\"#1F2329\\",\\"previewTintColor\\":\\"#f9f9f9\\",\\"backdropOpacity\\":0.3,\\"attachmentLoadingOpacity\\":0.7,\\"collapsibleQuoteBorder\\":\\"#CBCED1\\",\\"collapsibleChevron\\":\\"#6C727A\\",\\"cancelButton\\":\\"#E4E7EA\\",\\"unreadColor\\":\\"#6C727A\\",\\"tunreadColor\\":\\"#1d74f5\\",\\"mentionMeColor\\":\\"#F5455C\\",\\"mentionGroupColor\\":\\"#F38C39\\",\\"mentionOtherColor\\":\\"#F3BE08\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"red\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"white\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Press me!\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]}]}"`;
 
-exports[`Storyshots List with dark theme 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#07101e\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"dark\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}]},\\"children\\":[\\"Chats\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}]},\\"children\\":[\\"Chats\\"]}]}]}]}]}]}"`;
+exports[`Storyshots List with dark theme 1`] = `"{\\"type\\":\\"RNCSafeAreaView\\",\\"props\\":{\\"style\\":[{\\"flex\\":1},{\\"backgroundColor\\":\\"#07101e\\"},null],\\"edges\\":[\\"right\\",\\"left\\"]},\\"children\\":[{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"dark\\",\\"colors\\":{\\"backgroundColor\\":\\"#030b1b\\",\\"focusedBackground\\":\\"#0b182c\\",\\"chatComponentBackground\\":\\"#192132\\",\\"auxiliaryBackground\\":\\"#07101e\\",\\"bannerBackground\\":\\"#0e1f38\\",\\"titleText\\":\\"#f9f9f9\\",\\"bodyText\\":\\"#cbced1\\",\\"backdropColor\\":\\"#000000\\",\\"dangerColor\\":\\"#f5455c\\",\\"successColor\\":\\"#2de0a5\\",\\"borderColor\\":\\"#0f213d\\",\\"controlText\\":\\"#dadde6\\",\\"auxiliaryText\\":\\"#9297a2\\",\\"infoText\\":\\"#6D6D72\\",\\"tintColor\\":\\"#1d74f5\\",\\"tintActive\\":\\"#549df9\\",\\"tintDisabled\\":\\"#88B4F5\\",\\"auxiliaryTintColor\\":\\"#f9f9f9\\",\\"actionTintColor\\":\\"#1d74f5\\",\\"separatorColor\\":\\"#2b2b2d\\",\\"navbarBackground\\":\\"#0b182c\\",\\"headerBorder\\":\\"#2F3A4B\\",\\"headerBackground\\":\\"#0b182c\\",\\"headerSecondaryBackground\\":\\"#0b182c\\",\\"headerTintColor\\":\\"#f9f9f9\\",\\"headerTitleColor\\":\\"#f9f9f9\\",\\"headerSecondaryText\\":\\"#9297a2\\",\\"toastBackground\\":\\"#0C0D0F\\",\\"videoBackground\\":\\"#1f2329\\",\\"favoriteBackground\\":\\"#ffbb00\\",\\"hideBackground\\":\\"#54585e\\",\\"messageboxBackground\\":\\"#0b182c\\",\\"searchboxBackground\\":\\"#192d4d\\",\\"buttonBackground\\":\\"#414852\\",\\"buttonText\\":\\"#ffffff\\",\\"passcodeBackground\\":\\"#030C1B\\",\\"passcodeButtonActive\\":\\"#0B182C\\",\\"passcodeLockIcon\\":\\"#6C727A\\",\\"passcodePrimary\\":\\"#FFFFFF\\",\\"passcodeSecondary\\":\\"#CBCED1\\",\\"passcodeDotEmpty\\":\\"#CBCED1\\",\\"passcodeDotFull\\":\\"#6C727A\\",\\"previewBackground\\":\\"#030b1b\\",\\"previewTintColor\\":\\"#f9f9f9\\",\\"backdropOpacity\\":0.9,\\"attachmentLoadingOpacity\\":0.3,\\"collapsibleQuoteBorder\\":\\"#CBCED1\\",\\"collapsibleChevron\\":\\"#6C727A\\",\\"cancelButton\\":\\"#E4E7EA\\",\\"unreadColor\\":\\"#6C727A\\",\\"tunreadColor\\":\\"#1d74f5\\",\\"mentionMeColor\\":\\"#F5455C\\",\\"mentionGroupColor\\":\\"#F38C39\\",\\"mentionOtherColor\\":\\"#F3BE08\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}]},\\"children\\":[\\"Chats\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginVertical\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingBottom\\":12,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},{\\"opacity\\":0.3},{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#f9f9f9\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Chats\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9297a2\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"All\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9297a2\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#2b2b2d\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingTop\\":8,\\"paddingHorizontal\\":12}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6D6D72\\"}]},\\"children\\":[\\"Chats\\"]}]}]}]}]}]}"`;
 
 exports[`Storyshots List with icon 1`] = `"{\\"type\\":\\"RCTScrollView\\",\\"props\\":{\\"contentContainerStyle\\":{\\"paddingVertical\\":16},\\"scrollIndicatorInsets\\":{\\"right\\":1},\\"keyboardShouldPersistTaps\\":\\"always\\",\\"keyboardDismissMode\\":\\"interactive\\",\\"theme\\":\\"light\\",\\"colors\\":{\\"backgroundColor\\":\\"#ffffff\\",\\"focusedBackground\\":\\"#ffffff\\",\\"chatComponentBackground\\":\\"#f3f4f5\\",\\"auxiliaryBackground\\":\\"#efeff4\\",\\"bannerBackground\\":\\"#f1f2f4\\",\\"titleText\\":\\"#0d0e12\\",\\"bodyText\\":\\"#2f343d\\",\\"backdropColor\\":\\"#000000\\",\\"dangerColor\\":\\"#f5455c\\",\\"successColor\\":\\"#2de0a5\\",\\"borderColor\\":\\"#e1e5e8\\",\\"controlText\\":\\"#54585e\\",\\"auxiliaryText\\":\\"#9ca2a8\\",\\"infoText\\":\\"#6d6d72\\",\\"tintColor\\":\\"#1d74f5\\",\\"tintActive\\":\\"#549df9\\",\\"tintDisabled\\":\\"#88B4F5\\",\\"auxiliaryTintColor\\":\\"#6C727A\\",\\"actionTintColor\\":\\"#1d74f5\\",\\"separatorColor\\":\\"#cbcbcc\\",\\"navbarBackground\\":\\"#ffffff\\",\\"headerBorder\\":\\"#B2B2B2\\",\\"headerBackground\\":\\"#EEEFF1\\",\\"headerSecondaryBackground\\":\\"#ffffff\\",\\"headerTintColor\\":\\"#6C727A\\",\\"headerTitleColor\\":\\"#0C0D0F\\",\\"headerSecondaryText\\":\\"#1d74f5\\",\\"toastBackground\\":\\"#0C0D0F\\",\\"videoBackground\\":\\"#1f2329\\",\\"favoriteBackground\\":\\"#ffbb00\\",\\"hideBackground\\":\\"#54585e\\",\\"messageboxBackground\\":\\"#ffffff\\",\\"searchboxBackground\\":\\"#E6E6E7\\",\\"buttonBackground\\":\\"#414852\\",\\"buttonText\\":\\"#ffffff\\",\\"passcodeBackground\\":\\"#EEEFF1\\",\\"passcodeButtonActive\\":\\"#E4E7EA\\",\\"passcodeLockIcon\\":\\"#6C727A\\",\\"passcodePrimary\\":\\"#2F343D\\",\\"passcodeSecondary\\":\\"#6C727A\\",\\"passcodeDotEmpty\\":\\"#CBCED1\\",\\"passcodeDotFull\\":\\"#6C727A\\",\\"previewBackground\\":\\"#1F2329\\",\\"previewTintColor\\":\\"#f9f9f9\\",\\"backdropOpacity\\":0.3,\\"attachmentLoadingOpacity\\":0.7,\\"collapsibleQuoteBorder\\":\\"#CBCED1\\",\\"collapsibleChevron\\":\\"#6C727A\\",\\"cancelButton\\":\\"#E4E7EA\\",\\"unreadColor\\":\\"#6C727A\\",\\"tunreadColor\\":\\"#1d74f5\\",\\"mentionMeColor\\":\\"#F5455C\\",\\"mentionGroupColor\\":\\"#F38C39\\",\\"mentionOtherColor\\":\\"#F3BE08\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Icon Left\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Icon Right\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingRight\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries\\"]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},null]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"flex\\":1,\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\",\\"paddingHorizontal\\":12},null,{\\"height\\":92}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"flexShrink\\":1,\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"System\\",\\"fontWeight\\":\\"400\\"},null,{\\"color\\":\\"#0d0e12\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Show Action Indicator\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"paddingLeft\\":12}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"center\\"},{}]},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#9ca2a8\\"},null,{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"height\\":0.5},null,{\\"backgroundColor\\":\\"#cbcbcc\\"}]},\\"children\\":null}]}]}"`;