boxpay-checkout-reactnative-sdk 1.0.11-beta2 → 1.0.11-beta4

package/lib/typescript/src/sharedContext/checkoutDetailsHandler.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkoutDetailsHandler.d.ts","sourceRoot":"","sources":["../../../../src/sharedContext/checkoutDetailsHandler.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,MAAM,MAAM,sBAAsB,GAAG;IACnC,eAAe,EAAE,eAAe,CAAC;CAClC,CAAC;AAEF,eAAO,IAAI,sBAAsB,EAAE,sBA4ClC,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,SAAS,sBAAsB,SAExE,CAAC;AAEF,eAAO,MAAM,kCAAkC,YA8C9C,CAAC"}
+{"version":3,"file":"checkoutDetailsHandler.d.ts","sourceRoot":"","sources":["../../../../src/sharedContext/checkoutDetailsHandler.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAEpD,MAAM,MAAM,sBAAsB,GAAG;IACnC,eAAe,EAAE,eAAe,CAAC;CAClC,CAAC;AAEF,eAAO,IAAI,sBAAsB,EAAE,sBA+ClC,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,SAAS,sBAAsB,SAExE,CAAC;AAEF,eAAO,MAAM,kCAAkC,YAiD9C,CAAC"}

package/lib/typescript/src/sharedContext/getTextInputTheme.d.ts

@@ -0,0 +1,7 @@
+export declare const getTextInputTheme: () => {
+    colors: {
+        primary: string;
+        outline: string;
+    };
+};
+//# sourceMappingURL=getTextInputTheme.d.ts.map

package/lib/typescript/src/sharedContext/getTextInputTheme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getTextInputTheme.d.ts","sourceRoot":"","sources":["../../../../src/sharedContext/getTextInputTheme.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,iBAAiB;;;;;CAQ7B,CAAC"}

package/lib/typescript/src/sharedContext/handleAutoNavigation.d.ts

@@ -1,3 +1,3 @@
 import { type AutoNavigationScreen, type PaymentClass } from '../interface';
-export declare const handleAutoNavigation: (savedCardArray: PaymentClass[]) => AutoNavigationScreen | null;
+export declare const handleAutoNavigation: (status: String, savedCardArray: PaymentClass[]) => AutoNavigationScreen | null;
 //# sourceMappingURL=handleAutoNavigation.d.ts.map

package/lib/typescript/src/sharedContext/handleAutoNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"handleAutoNavigation.d.ts","sourceRoot":"","sources":["../../../../src/sharedContext/handleAutoNavigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,oBAAoB,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAK5F,eAAO,MAAM,oBAAoB,GAC7B,gBAAiB,YAAY,EAAE,KAC/B,oBAAoB,GAAG,IA0C1B,CAAA"}
+{"version":3,"file":"handleAutoNavigation.d.ts","sourceRoot":"","sources":["../../../../src/sharedContext/handleAutoNavigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAqC,KAAK,oBAAoB,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAK/G,eAAO,MAAM,oBAAoB,GAC7B,QAAS,MAAM,EACf,gBAAiB,YAAY,EAAE,KAC/B,oBAAoB,GAAG,IA4C1B,CAAA"}

package/lib/typescript/src/styles/indexStyles.d.ts

@@ -48,7 +48,7 @@ declare const styles: {
     footerText: {
         fontSize: number;
         color: string;
-        marginBottom: number;
+        paddingBottom: number;
     };
     footerImage: {
         height: number;

package/lib/typescript/src/styles/screens/bnplScreenStyles.d.ts

@@ -53,11 +53,10 @@ declare const styles: {
     bottomText: {
         fontSize: number;
         color: string;
-        marginBottom: number;
     };
     bottomContainer: {
         justifyContent: "center";
-        alignItems: "flex-end";
+        alignItems: "center";
         backgroundColor: string;
         flexDirection: "row";
     };

package/lib/typescript/src/styles/screens/bnplScreenStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"bnplScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/bnplScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyEV,CAAA;AAEF,eAAe,MAAM,CAAA"}
+{"version":3,"file":"bnplScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/bnplScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwEV,CAAA;AAEF,eAAe,MAAM,CAAA"}

package/lib/typescript/src/styles/screens/cardScreenStyles.d.ts

@@ -13,6 +13,13 @@ declare const styles: {
         paddingTop: number;
         paddingBottom: number;
     };
+    subscriptionContainer: {
+        backgroundColor: string;
+        marginHorizontal: number;
+        marginTop: number;
+        borderRadius: number;
+        paddingBottom: number;
+    };
     buttonText: {
         color: string;
         fontSize: number;
@@ -83,7 +90,6 @@ declare const styles: {
     errorText: {
         color: string;
         fontSize: number;
-        marginHorizontal: number;
         marginTop: number;
     };
     expiryCvvContainer: {
@@ -151,13 +157,12 @@ declare const styles: {
     };
     footerContainer: {
         justifyContent: "center";
-        alignItems: "flex-end";
+        alignItems: "center";
         flexDirection: "row";
     };
     footerText: {
         fontSize: number;
         color: string;
-        marginBottom: number;
     };
     footerImage: {
         height: number;

package/lib/typescript/src/styles/screens/cardScreenStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"cardScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/cardScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwJV,CAAA;AAEF,eAAe,MAAM,CAAA"}
+{"version":3,"file":"cardScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/cardScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuJV,CAAA;AAEF,eAAe,MAAM,CAAA"}

package/lib/typescript/src/styles/screens/netBankingScreenStyles.d.ts

@@ -73,14 +73,13 @@ declare const styles: {
     };
     footerContainer: {
         justifyContent: "center";
-        alignItems: "flex-end";
+        alignItems: "center";
         backgroundColor: string;
         flexDirection: "row";
     };
     footerTextStyle: {
         fontSize: number;
         color: string;
-        marginBottom: number;
     };
     footerIcon: {
         height: number;

package/lib/typescript/src/styles/screens/netBankingScreenStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"netBankingScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/netBankingScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+EV,CAAA;AAEF,eAAe,MAAM,CAAA"}
+{"version":3,"file":"netBankingScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/netBankingScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8EV,CAAA;AAEF,eAAe,MAAM,CAAA"}

package/lib/typescript/src/styles/screens/walletScreenStyles.d.ts

@@ -47,14 +47,13 @@ declare const styles: {
     };
     bottomContainer: {
         justifyContent: "center";
-        alignItems: "flex-end";
+        alignItems: "center";
         backgroundColor: string;
         flexDirection: "row";
     };
     bottomText: {
         fontSize: number;
         color: string;
-        marginBottom: number;
     };
     bottomImage: {
         height: number;

package/lib/typescript/src/styles/screens/walletScreenStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"walletScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/walletScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2FV,CAAA;AAEF,eAAe,MAAM,CAAA"}
+{"version":3,"file":"walletScreenStyles.d.ts","sourceRoot":"","sources":["../../../../../src/styles/screens/walletScreenStyles.ts"],"names":[],"mappings":"AAEA,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0FV,CAAA;AAEF,eAAe,MAAM,CAAA"}

package/lib/typescript/src/utility.d.ts

@@ -56,4 +56,6 @@ export declare function extractNames(fullName: string): {
 export declare const formatTime: (timeRemaining: number) => string;
 export declare const formatExpiry: (input: string) => string;
 export declare const getPhoneNumberCodeAndCountryName: (countryCodeRef: string) => CountryDetails | any;
+export declare const formatDate: (dateStr: string) => string;
+export declare const isEmpty: (value: unknown) => boolean;
 //# sourceMappingURL=utility.d.ts.map

package/lib/typescript/src/utility.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utility.d.ts","sourceRoot":"","sources":["../../../src/utility.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAMhG,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,aAAa,EAAE,EACrB,UAAU,EAAE,MAAM,GACjB,YAAY,EAAE,CAehB;AAGD,wBAAgB,gBAAgB;;;;;;EAQ/B;AAED,wBAAgB,cAAc;;;;;;;;;;;EAa7B;AAED,wBAAgB,iBAAiB;;;;;;;;;;;;;;;;;;;EA8BhC;AAED,eAAO,MAAQ,MAAM,UAAE,KAAK,QAA6B,CAAC;AAE1D,eAAO,MAAM,YAAY,GAAI,gBAAgB,MAAM;;;;CA0BlD,CAAC;AAMF,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAG/C;AAED,wBAAgB,gCAAgC,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAavE;AAGD,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAG9C;AAED,wBAAgB,aAAa,CAAC,eAAe,EAAG,eAAe,GAAI,MAAM,CAMxE;AAED,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG;IAC9C,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAcA;AAED,eAAO,MAAM,UAAU,GAAI,eAAgB,MAAM,WAIhD,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,MAAM,KAAG,MAgB5C,CAAC;AAEF,eAAO,MAAM,gCAAgC,GAAI,gBAAiB,MAAM,KAAI,cAAc,GAAG,GAK5F,CAAA"}
+{"version":3,"file":"utility.d.ts","sourceRoot":"","sources":["../../../src/utility.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAMhG,wBAAgB,sBAAsB,CACpC,IAAI,EAAE,aAAa,EAAE,EACrB,UAAU,EAAE,MAAM,GACjB,YAAY,EAAE,CAehB;AAGD,wBAAgB,gBAAgB;;;;;;EAQ/B;AAED,wBAAgB,cAAc;;;;;;;;;;;EAa7B;AAED,wBAAgB,iBAAiB;;;;;;;;;;;;;;;;;;;EA8BhC;AAED,eAAO,MAAQ,MAAM,UAAE,KAAK,QAA6B,CAAC;AAE1D,eAAO,MAAM,YAAY,GAAI,gBAAgB,MAAM;;;;CA0BlD,CAAC;AAMF,wBAAgB,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAG/C;AAED,wBAAgB,gCAAgC,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAavE;AAGD,wBAAgB,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAG9C;AAED,wBAAgB,aAAa,CAAC,eAAe,EAAG,eAAe,GAAI,MAAM,CAMxE;AAED,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,GAAG;IAC9C,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;CAClB,CAcA;AAED,eAAO,MAAM,UAAU,GAAI,eAAgB,MAAM,WAIhD,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,MAAM,KAAG,MAgB5C,CAAC;AAEF,eAAO,MAAM,gCAAgC,GAAI,gBAAiB,MAAM,KAAI,cAAc,GAAG,GAK5F,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,SAAS,MAAM,WAWzC,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,OAAO,OAAO,KAAG,OAQxC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "boxpay-checkout-reactnative-sdk",
-  "version": "1.0.11-beta2",
+  "version": "1.0.11-beta4",
   "description": "Boxpay Payment Gateway",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",
@@ -145,7 +145,7 @@
   "create-react-native-library": {
     "languages": "js",
     "type": "library",
-    "version": "1.0.11-beta2"
+    "version": "1.0.11-beta4"
   },
   "dependencies": {
     "axios": "^1.11.0",

package/src/components/checkboxContainer.tsx

@@ -44,6 +44,7 @@ const styles = StyleSheet.create({
       color: '#2D2B32',
       fontSize: 14,
       marginLeft: 6,
+      marginRight : 16
   },
   checkboxBox: {
     width: 20,
@@ -52,7 +53,7 @@ const styles = StyleSheet.create({
     borderRadius: 3,
     justifyContent: 'center',
     alignItems: 'center',
-    marginLeft: 8,
+    marginLeft: 16,
   },
   checkmark: {
     color: '#fff',

package/src/components/header.tsx

@@ -78,7 +78,7 @@ const styles = StyleSheet.create({
     color: '#363840'
   },
   headerDesc: {
-    marginTop: -4,
+    paddingTop: 2,
     fontSize: 12,
     color: '#4F4D55'
   },

package/src/components/paymentSelector.tsx

@@ -138,7 +138,7 @@ const PaymentSelector = ({
           }}
         >
           <Text style={[styles.buttonText, {fontFamily: checkoutDetails.fontFamily.semiBold,}]}>
-            Proceed to Pay{' '}
+            Pay{' '}
             <Text
               style={{
                 fontFamily: 'Inter-SemiBold',

package/src/components/paymentSuccess.tsx

@@ -256,11 +256,9 @@ const styles = StyleSheet.create({
     fontSize: 16,
   },
   dashedLine: {
-    borderBottomWidth: 2, // Thickness of the line
-    borderBottomColor: '#E6E6E6', // Color of the line
-    borderStyle: 'dashed', // Makes it dashed
+    backgroundColor: '#E6E6E6', // Color of the line
     width: '100%', // Full width
-    marginVertical: 10, // Some spacing
-    marginTop: 16,
+    marginVertical: 10,
+    height : 2
   },
 });

package/src/components/savedCardComponent.tsx

@@ -201,7 +201,7 @@ const SavedCardRow = ({
           }}
         >
           <Text style={[styles.buttonText, {fontFamily: checkoutDetails.fontFamily.semiBold,}]}>
-            Proceed to Pay{' '}
+            Pay{' '}
             <Text
               style={{
                 fontFamily: 'Inter-SemiBold',

package/src/components/subscriptionRow.tsx

@@ -0,0 +1,19 @@
+import { View, Text } from "react-native"
+import type { CheckoutDetails } from "../interface"
+
+interface SubscriptionArgs{
+    checkoutDetails : CheckoutDetails, 
+    heading: string, 
+    value : string
+}
+
+const SubscriptionRow = ({checkoutDetails, heading, value} : SubscriptionArgs) => {
+    return (
+        <View style={{ flexDirection : 'row', justifyContent : 'space-between', marginHorizontal : 16, paddingTop : 4}}>
+            <Text style={{fontFamily :checkoutDetails.fontFamily.regular, color : '#2D2B32'}}>{heading}</Text>
+            <Text style={{fontFamily :checkoutDetails.fontFamily.semiBold, color : '#2D2B32'}}>{value}</Text>
+        </View>
+    )
+}
+
+export default SubscriptionRow

package/src/interface.ts

@@ -13,6 +13,7 @@ export enum ConfigurationOptions {
 export enum UIConfigurationOptions {
   FontFamily = 'FONT_FAMILY',
   CTABorderRadius = 'CTA_BORDER_RADIUS',
+  TextInputFields = 'TEXT_INPUT_FIELDS'
 }
 
 export interface FontConfiguration {
@@ -23,10 +24,16 @@ export interface FontConfiguration {
   extraBold?: string
 }
 
+export interface TextInputFields {
+  focusedBorderColor? : string;
+  borderColor? : string
+}
+
 // 👇 Each key has its own strict type
 export interface UIConfiguration {
   [UIConfigurationOptions.FontFamily]?: FontConfiguration;
   [UIConfigurationOptions.CTABorderRadius]?: number;
+  [UIConfigurationOptions.TextInputFields]?: TextInputFields
 }
 
 export interface BoxpayCheckoutProps {
@@ -46,6 +53,8 @@ export interface CheckoutDetails {
   ctaBorderRadius : number,
   buttonColor: string;
   buttonTextColor : string;
+  textInputFieldFocusedOutlineColor : string;
+  textInputFieldUnFocusedOutlineColor : string;
   headerColor : string;
   headerTextColor : string;
   env: string;
@@ -78,7 +87,8 @@ export interface CheckoutDetails {
   isUPIOtmQRMethodEnabled : boolean,
   isOrderItemDetailsVisible : boolean,
   isSICheckboxVisible : boolean,
-  isSubscriptionCheckout : boolean
+  isSubscriptionCheckout : boolean,
+  subscriptionDetails : {label:string,value : string | null}[] | null
 }
 
 interface AnalyticsResponse {
@@ -447,6 +457,7 @@ export interface HandleFetchStatusOptions {
 }
 
 export enum TransactionStatus {
+  NoAction = "NOACTION",
   RequiresAction = 'REQUIRESACTION',
   Failed = 'FAILED',
   Rejected = 'REJECTED',
@@ -532,8 +543,20 @@ interface OrderDetails {
   items : OrderItem[] | null
 }
 
-interface SubscriptionDetails {
+export interface SubscriptionDetails {
   type : string,
+  billingCycle : {
+    billingTimeUnit : string,
+    count : number,
+    billingCycleValue : string
+  },
+  billingDuration : {
+    type : string,
+    noOfCycles : number
+  },
+  nextBillingDateLocale : string,
+  expiryDateLocale : string,
+  recurringExpiryDateLocale : string,
   maxAmountLocaleFull : string
 }
 

package/src/screens/addressScreen.tsx

@@ -20,6 +20,7 @@ import {
 } from '../sharedContext/userdataHandler';
 import styles from '../styles/screens/addressScreenStyles.';
 import { extractNames, getPhoneNumberCodeAndCountryName } from '../utility';
+import { getTextInputTheme } from '../sharedContext/getTextInputTheme';
 
 type AddressScreenRouteProp = RouteProp<CheckoutStackParamList, 'AddressScreen'>;
 type AddressScreenNavigationProp = NavigationProp<CheckoutStackParamList, 'AddressScreen'>;
@@ -358,12 +359,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
             }
             value={countryTextField || ''}
             onChangeText={(_) => {}}
-            theme={{
-              colors: {
-                primary: '#2D2B32',
-                outline: '#E6E6E6',
-              },
-            }}
+            theme={getTextInputTheme()}
             style={[
               styles.textInput,
               { marginTop: 28, marginHorizontal: 16, fontFamily: checkoutDetails.fontFamily.regular, },
@@ -411,12 +407,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                 onChangeText={(it) => {
                   onChangeFullName(it);
                 }}
-                theme={{
-                  colors: {
-                    primary: '#2D2B32',
-                    outline: '#E6E6E6',
-                  },
-                }}
+                theme={getTextInputTheme()}
                 style={[
                   styles.textInput,
                   { marginTop: 20, marginHorizontal: 16, fontFamily: checkoutDetails.fontFamily.regular, },
@@ -465,12 +456,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                   }
                   value={selectedPhoneCode || ''}
                   onChangeText={(_) => {}}
-                  theme={{
-                    colors: {
-                      primary: '#2D2B32',
-                      outline: '#E6E6E6',
-                    },
-                  }}
+                  theme={getTextInputTheme()}
                   style={[
                     styles.textInput,
                     { width: 100, marginEnd: 8, fontFamily: checkoutDetails.fontFamily.regular,},
@@ -514,12 +500,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                   onChangeText={(it) => {
                     onChangePhoneNumber(it)
                   }}
-                  theme={{
-                    colors: {
-                      primary: '#2D2B32',
-                      outline: '#E6E6E6',
-                    },
-                  }}
+                  theme={getTextInputTheme()}
                   style={[styles.textInput, { flex: 1 , fontFamily: checkoutDetails.fontFamily.regular,}]}
                   error={isPhoneNumberValid == false}
                   outlineStyle={{
@@ -560,12 +541,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                 onChangeText={(it) => {
                   onChangeEmailId(it);
                 }}
-                theme={{
-                  colors: {
-                    primary: '#2D2B32',
-                    outline: '#E6E6E6',
-                  },
-                }}
+                theme={getTextInputTheme()}
                 style={[
                   styles.textInput,
                   { marginTop: 20, marginHorizontal: 16, fontFamily: checkoutDetails.fontFamily.regular, },
@@ -617,12 +593,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                     onChangeText={(it) => {
                       onChangePostalCode(it);
                     }}
-                    theme={{
-                      colors: {
-                        primary: '#2D2B32',
-                        outline: '#E6E6E6',
-                      },
-                    }}
+                    theme={getTextInputTheme()}
                     style={[styles.textInput, {fontFamily: checkoutDetails.fontFamily.regular,}]}
                     error={isPinValid == false}
                     outlineStyle={{
@@ -662,12 +633,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                     onChangeText={(it) => {
                       onChangeCity(it);
                     }}
-                    theme={{
-                      colors: {
-                        primary: '#2D2B32',
-                        outline: '#E6E6E6',
-                      },
-                    }}
+                    theme={getTextInputTheme()}
                     style={[styles.textInput, { marginStart: 8, fontFamily: checkoutDetails.fontFamily.regular, }]}
                     error={isCityValid == false}
                     outlineStyle={{
@@ -706,12 +672,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                 onChangeText={(it) => {
                   onChangeState(it);
                 }}
-                theme={{
-                  colors: {
-                    primary: '#2D2B32',
-                    outline: '#E6E6E6',
-                  },
-                }}
+                theme={getTextInputTheme()}
                 style={[
                   styles.textInput,
                   { marginTop: 20, marginHorizontal: 16, fontFamily: checkoutDetails.fontFamily.regular, },
@@ -753,12 +714,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                 onChangeText={(it) => {
                   onChangeMainAddress(it);
                 }}
-                theme={{
-                  colors: {
-                    primary: '#2D2B32',
-                    outline: '#E6E6E6',
-                  },
-                }}
+                theme={getTextInputTheme()}
                 style={[
                   styles.textInput,
                   { marginTop: 20, marginHorizontal: 16, fontFamily: checkoutDetails.fontFamily.regular, },
@@ -800,12 +756,7 @@ const AddressScreen = ({ route, navigation }: Props) => {
                 onChangeText={(it) => {
                   setSecondaryAddressTextField(it);
                 }}
-                theme={{
-                  colors: {
-                    primary: '#2D2B32',
-                    outline: '#E6E6E6',
-                  },
-                }}
+                theme={getTextInputTheme()}
                 style={[
                   styles.textInput,
                   { marginTop: 20, marginHorizontal: 16, fontFamily: checkoutDetails.fontFamily.regular, },

package/src/screens/bnplScreen.tsx

@@ -9,7 +9,7 @@ import { useEffect, useRef, useState } from 'react';
 import { checkoutDetailsHandler, setCheckOutDetailsHandlerToDefault } from '../sharedContext/checkoutDetailsHandler';
 import LottieView from 'lottie-react-native';
 import Header from '../components/header';
-import type { PaymentClass, PaymentResultObject, BNPLScreenParams } from '../interface';
+import { type PaymentClass, type PaymentResultObject, type BNPLScreenParams, TransactionStatus } from '../interface';
 import ShimmerView from '../components/shimmerView';
 import PaymentSuccess from '../components/paymentSuccess';
 import SessionExpire from '../components/sessionExpire';
@@ -54,7 +54,7 @@ const BNPLScreen = ({ navigation, route }: Props) => {
   const [sessionExpireModalOpen, setSessionExppireModalState] = useState(false);
   const [successfulTimeStamp, setSuccessfulTimeStamp] = useState('');
 
-  const [status, setStatus] = useState<string>("NOACTION");
+  const [status, setStatus] = useState<string>(TransactionStatus.NoAction);
   const [transactionId, setTransactionId] = useState<string | null>(null);
 
   const backgroundApiInterval = useRef<NodeJS.Timeout | null>(null);
@@ -76,7 +76,7 @@ const BNPLScreen = ({ navigation, route }: Props) => {
       if (showWebView) {
         setShowWebView(false);
         paymentFailedMessage.current = checkoutDetails.errorMessage;
-        setStatus('Failed');
+        setStatus(TransactionStatus.Failed);
         setFailedModalState(true);
         setLoading(false);
         return true;