packages = new PackageList(this).getPackages();
27 | // Packages that cannot be autolinked yet can be added manually here, for example:
28 | // packages.add(new MyReactNativePackage());
29 | return packages;
30 | }
31 |
32 | @Override
33 | protected String getJSMainModuleName() {
34 | return "index";
35 | }
36 | };
37 |
38 | @Override
39 | public ReactNativeHost getReactNativeHost() {
40 | return mReactNativeHost;
41 | }
42 |
43 | @Override
44 | public void onCreate() {
45 | super.onCreate();
46 | SoLoader.init(this, /* native exopackage */ false);
47 | initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
48 | }
49 |
50 | /**
51 | * Loads Flipper in React Native templates. Call this in the onCreate method with something like
52 | * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
53 | *
54 | * @param context
55 | * @param reactInstanceManager
56 | */
57 | private static void initializeFlipper(
58 | Context context, ReactInstanceManager reactInstanceManager) {
59 | if (BuildConfig.DEBUG) {
60 | try {
61 | /*
62 | We use reflection here to pick up the class that initializes Flipper,
63 | since Flipper library is not available in release mode
64 | */
65 | Class aClass = Class.forName("com.ecommercewithreactnative.ReactNativeFlipper");
66 | aClass
67 | .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
68 | .invoke(null, context, reactInstanceManager);
69 | } catch (ClassNotFoundException e) {
70 | e.printStackTrace();
71 | } catch (NoSuchMethodException e) {
72 | e.printStackTrace();
73 | } catch (IllegalAccessException e) {
74 | e.printStackTrace();
75 | } catch (InvocationTargetException e) {
76 | e.printStackTrace();
77 | }
78 | }
79 | }
80 | }
81 |
--------------------------------------------------------------------------------
/android/gradlew.bat:
--------------------------------------------------------------------------------
1 | @rem
2 | @rem Copyright 2015 the original author or authors.
3 | @rem
4 | @rem Licensed under the Apache License, Version 2.0 (the "License");
5 | @rem you may not use this file except in compliance with the License.
6 | @rem You may obtain a copy of the License at
7 | @rem
8 | @rem https://www.apache.org/licenses/LICENSE-2.0
9 | @rem
10 | @rem Unless required by applicable law or agreed to in writing, software
11 | @rem distributed under the License is distributed on an "AS IS" BASIS,
12 | @rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 | @rem See the License for the specific language governing permissions and
14 | @rem limitations under the License.
15 | @rem
16 |
17 | @if "%DEBUG%" == "" @echo off
18 | @rem ##########################################################################
19 | @rem
20 | @rem Gradle startup script for Windows
21 | @rem
22 | @rem ##########################################################################
23 |
24 | @rem Set local scope for the variables with windows NT shell
25 | if "%OS%"=="Windows_NT" setlocal
26 |
27 | set DIRNAME=%~dp0
28 | if "%DIRNAME%" == "" set DIRNAME=.
29 | set APP_BASE_NAME=%~n0
30 | set APP_HOME=%DIRNAME%
31 |
32 | @rem Resolve any "." and ".." in APP_HOME to make it shorter.
33 | for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
34 |
35 | @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
36 | set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
37 |
38 | @rem Find java.exe
39 | if defined JAVA_HOME goto findJavaFromJavaHome
40 |
41 | set JAVA_EXE=java.exe
42 | %JAVA_EXE% -version >NUL 2>&1
43 | if "%ERRORLEVEL%" == "0" goto execute
44 |
45 | echo.
46 | echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
47 | echo.
48 | echo Please set the JAVA_HOME variable in your environment to match the
49 | echo location of your Java installation.
50 |
51 | goto fail
52 |
53 | :findJavaFromJavaHome
54 | set JAVA_HOME=%JAVA_HOME:"=%
55 | set JAVA_EXE=%JAVA_HOME%/bin/java.exe
56 |
57 | if exist "%JAVA_EXE%" goto execute
58 |
59 | echo.
60 | echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME%
61 | echo.
62 | echo Please set the JAVA_HOME variable in your environment to match the
63 | echo location of your Java installation.
64 |
65 | goto fail
66 |
67 | :execute
68 | @rem Setup the command line
69 |
70 | set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar
71 |
72 |
73 | @rem Execute Gradle
74 | "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %*
75 |
76 | :end
77 | @rem End local scope for the variables with windows NT shell
78 | if "%ERRORLEVEL%"=="0" goto mainEnd
79 |
80 | :fail
81 | rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
82 | rem the _cmd.exe /c_ return code!
83 | if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1
84 | exit /b 1
85 |
86 | :mainEnd
87 | if "%OS%"=="Windows_NT" endlocal
88 |
89 | :omega
90 |
--------------------------------------------------------------------------------
/src/stacks/StartScreen/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import {
3 | StyleSheet,
4 | View,
5 | Dimensions,
6 | ImageBackground,
7 | StatusBar,
8 | Platform,
9 | } from 'react-native';
10 | import { ImageHeaderBgBlue, LogoCoffeeShop } from '../../assets';
11 | import { Button, Buttons, Space } from '../../components';
12 |
13 | const StartScreen = ({ navigation }) => {
14 | return (
15 |
16 | {Platform.OS === 'android' && }
17 |
21 |
27 |
28 |
29 |
30 |
31 | {/*
51 |
52 | {/*
72 |
73 |
74 | );
75 | };
76 |
77 | export default StartScreen;
78 |
79 | const styles = StyleSheet.create({
80 | safeContainer: {
81 | flex: 1,
82 | backgroundColor: '#0030FF',
83 | },
84 | mainContainer: {
85 | paddingHorizontal: 20,
86 | justifyContent: 'space-between',
87 | // backgroundColor: 'red',
88 | flex: 1,
89 | paddingVertical: Dimensions.get('screen').height / 100,
90 | },
91 | buttonGroup: {
92 | // backgroundColor: 'green',
93 | // flex: 1,
94 | height: 200,
95 | alignItems: 'center',
96 | // flexDirection: 'column',
97 | },
98 | buttonContainer: {
99 | // backgroundColor: 'red',
100 | flexDirection: 'row',
101 | // flex: 1,
102 | // height: 200,
103 | },
104 | });
105 |
--------------------------------------------------------------------------------
/src/assets/logo/gojek-logo-2019.svg:
--------------------------------------------------------------------------------
1 |
13 |
--------------------------------------------------------------------------------
/src/components/molecules/CardTextButton/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { TouchableOpacity } from 'react-native';
3 | import { StyleSheet, Text, View } from 'react-native';
4 | import { IconMoreHorizontal } from '../../../assets';
5 | import { Button, IconContainer, Space } from '../../atoms';
6 |
7 | const CardTextButton = ({
8 | text = 'Text',
9 | subtext = 'Subtext',
10 | default_label = true,
11 | padding = 10,
12 | radius = 10,
13 | borderColor,
14 | label = 'Button',
15 | onPress,
16 | onPressEdit,
17 | marginTop = 0,
18 | marginBottom = 0,
19 | }) => {
20 | return (
21 |
29 |
30 |
31 | {default_label ? (
32 | <>
33 | {text}
34 |
35 |
36 | default
37 |
38 |
39 | ) : (
40 | <>
41 | {text}
42 |
43 |
44 | )}
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 | {subtext}
55 |
56 |
57 |
70 |
71 | );
72 | };
73 |
74 | export default CardTextButton;
75 |
76 | const styles = StyleSheet.create({
77 | card: (padding, radius, borderColor, marginTop, marginBottom) => ({
78 | borderWidth: 1,
79 | borderColor: borderColor,
80 | padding: padding,
81 | borderRadius: radius,
82 | marginTop: marginTop,
83 | marginBottom: marginBottom,
84 | }),
85 | firstRow: {
86 | alignItems: 'center',
87 | flexDirection: 'row',
88 | justifyContent: 'space-between',
89 | // backgroundColor: 'grey',
90 | },
91 | textContainer: {
92 | alignItems: 'center',
93 | flexDirection: 'row',
94 | // backgroundColor: 'aqua',
95 | },
96 | text: {
97 | fontFamily: 'CircularStd-Bold',
98 | fontSize: 12,
99 | textTransform: 'capitalize',
100 | },
101 | defaultContainer: {
102 | backgroundColor: '#A6B7FF',
103 | borderRadius: 4,
104 | },
105 | default: {
106 | color: '#0030FF',
107 | fontSize: 8,
108 | paddingHorizontal: 6,
109 | paddingVertical: 3,
110 | textTransform: 'capitalize',
111 | },
112 | secondRow: { paddingRight: 60 },
113 | subtext: {
114 | textTransform: 'capitalize',
115 | lineHeight: 20,
116 | fontFamily: 'CircularStd-Book',
117 | },
118 | });
119 |
--------------------------------------------------------------------------------
/src/assets/logo/grab-logo-word.svg:
--------------------------------------------------------------------------------
1 |
11 |
--------------------------------------------------------------------------------
/android/app/src/debug/java/com/ecommercewithreactnative/ReactNativeFlipper.java:
--------------------------------------------------------------------------------
1 | /**
2 | * Copyright (c) Facebook, Inc. and its affiliates.
3 | *
4 | * This source code is licensed under the MIT license found in the LICENSE file in the root
5 | * directory of this source tree.
6 | */
7 | package com.ecommercewithreactnative;
8 |
9 | import android.content.Context;
10 | import com.facebook.flipper.android.AndroidFlipperClient;
11 | import com.facebook.flipper.android.utils.FlipperUtils;
12 | import com.facebook.flipper.core.FlipperClient;
13 | import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin;
14 | import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin;
15 | import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
16 | import com.facebook.flipper.plugins.inspector.DescriptorMapping;
17 | import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin;
18 | import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor;
19 | import com.facebook.flipper.plugins.network.NetworkFlipperPlugin;
20 | import com.facebook.flipper.plugins.react.ReactFlipperPlugin;
21 | import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin;
22 | import com.facebook.react.ReactInstanceManager;
23 | import com.facebook.react.bridge.ReactContext;
24 | import com.facebook.react.modules.network.NetworkingModule;
25 | import okhttp3.OkHttpClient;
26 |
27 | public class ReactNativeFlipper {
28 | public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) {
29 | if (FlipperUtils.shouldEnableFlipper(context)) {
30 | final FlipperClient client = AndroidFlipperClient.getInstance(context);
31 |
32 | client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults()));
33 | client.addPlugin(new ReactFlipperPlugin());
34 | client.addPlugin(new DatabasesFlipperPlugin(context));
35 | client.addPlugin(new SharedPreferencesFlipperPlugin(context));
36 | client.addPlugin(CrashReporterPlugin.getInstance());
37 |
38 | NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
39 | NetworkingModule.setCustomClientBuilder(
40 | new NetworkingModule.CustomClientBuilder() {
41 | @Override
42 | public void apply(OkHttpClient.Builder builder) {
43 | builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
44 | }
45 | });
46 | client.addPlugin(networkFlipperPlugin);
47 | client.start();
48 |
49 | // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized
50 | // Hence we run if after all native modules have been initialized
51 | ReactContext reactContext = reactInstanceManager.getCurrentReactContext();
52 | if (reactContext == null) {
53 | reactInstanceManager.addReactInstanceEventListener(
54 | new ReactInstanceManager.ReactInstanceEventListener() {
55 | @Override
56 | public void onReactContextInitialized(ReactContext reactContext) {
57 | reactInstanceManager.removeReactInstanceEventListener(this);
58 | reactContext.runOnNativeModulesQueueThread(
59 | new Runnable() {
60 | @Override
61 | public void run() {
62 | client.addPlugin(new FrescoFlipperPlugin());
63 | }
64 | });
65 | }
66 | });
67 | } else {
68 | client.addPlugin(new FrescoFlipperPlugin());
69 | }
70 | }
71 | }
72 | }
73 |
--------------------------------------------------------------------------------
/ios/EcommerceWithReactNative/Info.plist:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | CFBundleDevelopmentRegion
6 | en
7 | CFBundleDisplayName
8 | Coffee Shop
9 | CFBundleExecutable
10 | $(EXECUTABLE_NAME)
11 | CFBundleIdentifier
12 | $(PRODUCT_BUNDLE_IDENTIFIER)
13 | CFBundleInfoDictionaryVersion
14 | 6.0
15 | CFBundleName
16 | $(PRODUCT_NAME)
17 | CFBundlePackageType
18 | APPL
19 | CFBundleShortVersionString
20 | 1.0
21 | CFBundleSignature
22 | ????
23 | CFBundleVersion
24 | 1
25 | LSRequiresIPhoneOS
26 |
27 | NSAppTransportSecurity
28 |
29 | NSExceptionDomains
30 |
31 | localhost
32 |
33 | NSExceptionAllowsInsecureHTTPLoads
34 |
35 |
36 |
37 |
38 | NSLocationWhenInUseUsageDescription
39 |
40 | UIAppFonts
41 |
42 | CircularStd-Black.ttf
43 | CircularStd-BlackItalic.ttf
44 | CircularStd-Bold.ttf
45 | CircularStd-BoldItalic.ttf
46 | CircularStd-Book.ttf
47 | CircularStd-BookItalic.ttf
48 | CircularStd-Medium.ttf
49 | CircularStd-MediumItalic.ttf
50 | Montserrat-Black.ttf
51 | Montserrat-BlackItalic.ttf
52 | Montserrat-Bold.ttf
53 | Montserrat-BoldItalic.ttf
54 | Montserrat-ExtraBold.ttf
55 | Montserrat-ExtraBoldItalic.ttf
56 | Montserrat-ExtraLight.ttf
57 | Montserrat-ExtraLightItalic.ttf
58 | Montserrat-Italic.ttf
59 | Montserrat-Light.ttf
60 | Montserrat-LightItalic.ttf
61 | Montserrat-Medium.ttf
62 | Montserrat-MediumItalic.ttf
63 | Montserrat-Regular.ttf
64 | Montserrat-SemiBold.ttf
65 | Montserrat-SemiBoldItalic.ttf
66 | Montserrat-Thin.ttf
67 | Montserrat-ThinItalic.ttf
68 | AntDesign.ttf
69 | Entypo.ttf
70 | EvilIcons.ttf
71 | Feather.ttf
72 | FontAwesome.ttf
73 | FontAwesome5_Brands.ttf
74 | FontAwesome5_Regular.ttf
75 | FontAwesome5_Solid.ttf
76 | Fontisto.ttf
77 | Foundation.ttf
78 | Ionicons.ttf
79 | MaterialCommunityIcons.ttf
80 | MaterialIcons.ttf
81 | Octicons.ttf
82 | SimpleLineIcons.ttf
83 | Zocial.ttf
84 |
85 | UILaunchStoryboardName
86 | LaunchScreen
87 | UIRequiredDeviceCapabilities
88 |
89 | armv7
90 |
91 | UISupportedInterfaceOrientations
92 |
93 | UIInterfaceOrientationPortrait
94 |
95 | UIViewControllerBasedStatusBarAppearance
96 |
97 |
98 |
99 |
--------------------------------------------------------------------------------
/src/stacks/Account/index.js:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | import {
3 | StyleSheet,
4 | Text,
5 | View,
6 | Image,
7 | SafeAreaView,
8 | ImageBackground,
9 | TouchableOpacity,
10 | } from 'react-native';
11 | import {
12 | Button,
13 | ModalBottom,
14 | NavHeader,
15 | TextPlainNav,
16 | IconText,
17 | Space,
18 | SafeAreaViewCustom,
19 | } from '../../components';
20 | import { ImageProfileSan } from '../../assets';
21 | import { useSelector } from 'react-redux';
22 |
23 | const data = {
24 | username: 'sanengineer',
25 | email: 'sanenginer@email.com',
26 | avatar: ImageProfileSan,
27 | };
28 |
29 | const Account = ({ navigation, route }) => {
30 | const [isModalVisible, setModalVisible] = useState(false);
31 | const toggleModal = () => {
32 | setModalVisible(!isModalVisible);
33 | };
34 |
35 | const get_user_profile = useSelector(state => state.get_user_profile.data);
36 | const data = get_user_profile;
37 |
38 | return (
39 | <>
40 |
41 |
42 |
43 |
44 |
53 |
54 |
60 | Edit
61 |
62 |
63 |
64 |
65 |
66 |
67 |
74 |
75 |
76 |
83 |
84 |
85 |
90 |
91 |
92 |
93 |
94 |
95 |
96 |
97 |
98 |
99 |
100 | );
101 | };
102 |
103 | export default Account;
104 |
105 | const styles = StyleSheet.create({
106 | safeContainer: { flex: 1, backgroundColor: '#fff' },
107 | avaContainer: {
108 | alignItems: 'center',
109 | paddingTop: 20,
110 | paddingBottom: 50,
111 | // backgroundColor: 'red',
112 | },
113 | avatar: {
114 | overflow: 'hidden',
115 | borderRadius: 60,
116 | width: 180,
117 | height: 180,
118 | },
119 | });
120 |
--------------------------------------------------------------------------------
/src/components/molecules/CardImageTextButton/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import {
3 | StyleSheet,
4 | Text,
5 | View,
6 | Dimensions,
7 | TouchableOpacity,
8 | Image,
9 | } from 'react-native';
10 | import { IconTrashGrey } from '../../../assets';
11 | import { IconContainer, Space } from '../../atoms';
12 |
13 | const CardImageTextButton = ({
14 | item,
15 | numColumns = 2,
16 | onPressDetailProduct,
17 | onPressAddCart,
18 | onPressDeleteItem,
19 | showIconBottom = false,
20 | }) => {
21 | if (item !== undefined)
22 | return (
23 |
24 |
25 |
26 |
27 | {item.promo ? (
28 |
29 | promo
30 |
31 | ) : (
32 | <>
33 | )}
34 |
35 | {item.name}
36 |
37 | Rp. {item.price}
38 |
39 |
40 | {showIconBottom ? (
41 |
44 |
45 |
46 |
47 |
48 | ) : (
49 | <>
50 | )}
51 |
52 |
53 |
54 |
55 | Add
56 |
57 |
58 |
59 | );
60 | else return <>;
61 | };
62 |
63 | export default CardImageTextButton;
64 |
65 | const styles = StyleSheet.create({
66 | itemContainer: {
67 | flex: 1,
68 | margin: 10,
69 | justifyContent: 'space-around',
70 | },
71 | touchContainer: {
72 | flex: 1,
73 | overflow: 'hidden',
74 | borderRadius: 10,
75 | borderColor: '#efefef',
76 | borderStyle: 'solid',
77 | borderWidth: 1,
78 | },
79 | featImage: numColumns => ({
80 | height: 120,
81 | width: Dimensions.get('window').width / numColumns,
82 | }),
83 | promoStickerProductContainer: {
84 | position: 'absolute',
85 | borderBottomRightRadius: 10,
86 | backgroundColor: 'green',
87 | paddingRight: 6,
88 | paddingBottom: 4,
89 | paddingTop: 4,
90 | paddingLeft: 4,
91 | },
92 | promoText: {
93 | color: '#fff',
94 | textTransform: 'capitalize',
95 | fontFamily: 'CircularStd-Bold',
96 | },
97 | titlePriceContainer: {
98 | // flex: 1,
99 | paddingHorizontal: 10,
100 | paddingBottom: 10,
101 | paddingTop: 10,
102 | // backgroundColor: 'red',
103 | },
104 | title: { fontFamily: 'CircularStd-Book', lineHeight: 20 },
105 | price: { fontFamily: 'CircularStd-Bold' },
106 | buttonContainer: {
107 | borderRadius: 10,
108 | borderWidth: 1,
109 | borderStyle: 'solid',
110 | borderColor: '#efefef',
111 | paddingVertical: 5,
112 | },
113 | button: {
114 | fontFamily: 'CircularStd-Book',
115 | textAlign: 'center',
116 | fontSize: 14,
117 | },
118 | });
119 |
--------------------------------------------------------------------------------
/src/components/molecules/TextButtonRow/index.js:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import { StyleSheet, Text, View, TouchableOpacity } from 'react-native';
3 | import { Space } from '../../atoms';
4 |
5 | const TextButtonRow = ({
6 | paddingHorizontal = 20,
7 | paddingVertical = 20,
8 | borderBottomWidth = 1,
9 | borderBottomColor = '#efefef',
10 | title = 'Title',
11 | Subtitle = 'Subtitle',
12 | titleTextSize = 12,
13 | titleTextFam = 'CircularStd-Book',
14 | subtitleTextSize = 16,
15 | subtitleTextFam = 'CircularStd-Bold',
16 | textButton = 'Text',
17 | showSubtitle = true,
18 | onPressButton,
19 | buttonRadius = 6,
20 | bgButton = '#1440FF',
21 | buttonPaddingX = 50,
22 | buttonPaddingY = 12,
23 | buttonTextColor = '#fff',
24 | showIcon = false,
25 | children,
26 | }) => {
27 | return (
28 |
35 |
36 | {showSubtitle ? (
37 | <>
38 |
39 | {title}
40 |
41 |
42 |
43 | {Subtitle}
44 |
45 |
46 | ) : (
47 | {title}
48 | )}
49 |
50 |
51 |
54 | {showIcon ? (
55 | children
56 | ) : (
57 |
63 | {textButton}
64 |
65 | )}
66 |
67 |
68 |
69 | );
70 | };
71 |
72 | export default TextButtonRow;
73 |
74 | const styles = StyleSheet.create({
75 | textButtonRowContainer: (
76 | paddingHorizontal,
77 | paddingVertical,
78 | borderContainerBottomWidth,
79 | borderContainerBottomColor,
80 | ) => ({
81 | paddingVertical: paddingVertical,
82 | flexDirection: 'row',
83 | alignItems: 'center',
84 | justifyContent: 'space-between',
85 | paddingHorizontal: paddingHorizontal,
86 | backgroundColor: '#fff',
87 | borderBottomWidth: borderContainerBottomWidth,
88 | borderBottomColor: borderContainerBottomColor,
89 | // borderBottomColor: 'red',
90 | }),
91 |
92 | titleSubtitleContainer: {
93 | // flexDirection: 'column',
94 | },
95 |
96 | buttonContainer: (buttonRadius, bgButton) => ({
97 | borderRadius: buttonRadius,
98 | backgroundColor: bgButton,
99 | }),
100 |
101 | button: (buttonPaddingX, buttonPaddingY, buttonTextColor) => ({
102 | fontFamily: 'CircularStd-Bold',
103 | // backgroundColor: 'red',
104 | paddingHorizontal: buttonPaddingX,
105 | paddingVertical: buttonPaddingY,
106 | color: buttonTextColor,
107 | fontSize: 14,
108 | }),
109 |
110 | title: (titleTextSize, titleTextFam) => ({
111 | fontSize: titleTextSize,
112 | fontFamily: titleTextFam,
113 | }),
114 | subtitle: (subtitleTextSize, subtitleTextFam) => ({
115 | fontSize: subtitleTextSize,
116 | fontFamily: subtitleTextFam,
117 | }),
118 | });
119 |
--------------------------------------------------------------------------------