boxpay-checkout-reactnative-sdk 1.0.11-beta → 1.0.11-beta3

package/src/screens/upiScreen.tsx

@@ -18,6 +18,7 @@ import { formatTime, height, width } from '../utility';
 import upiPostRequest from '../postRequest/upiPostRequest';
 import { handlePaymentResponse } from '../sharedContext/handlePaymentResponseHandler';
 import callUIAnalytics from '../postRequest/callUIAnalytics';
+import { getTextInputTheme } from '../sharedContext/getTextInputTheme';
 
 interface UpiScreenProps {
   handleUpiPayment: (selectedIntent: string) => void;
@@ -447,12 +448,7 @@ const UpiScreen: React.FC<UpiScreenProps> = ({
               onChangeText={(it) => {
                 handleTextChange(it);
               }}
-              theme={{
-                colors: {
-                  primary: '#2D2B32',
-                  outline: '#E6E6E6',
-                },
-              }}
+              theme={getTextInputTheme()}
               style={[styles.textInput, {fontFamily: checkoutDetails.fontFamily.regular,}]}
               error={upiCollectError}
               right={

package/src/screens/walletScreen.tsx

@@ -26,6 +26,7 @@ import styles from '../styles/screens/walletScreenStyles';
 import type { CheckoutStackParamList } from '../navigation';
 import type { NavigationProp, RouteProp } from '@react-navigation/native';
 import { setUserDataHandlerToDefault } from '../sharedContext/userdataHandler';
+import { getTextInputTheme } from '../sharedContext/getTextInputTheme';
 
 type WalletScreenRouteProp = RouteProp<CheckoutStackParamList, 'WalletScreen'>;
 type WalletScreenNavigationProp = NavigationProp<CheckoutStackParamList, 'WalletScreen'>;
@@ -276,12 +277,7 @@ const WalletScreen = ({ navigation, route }: Props) => {
                 onChangeText={(it) => {
                   handleSearchTextChange(it);
                 }}
-                theme={{
-                  colors: {
-                    primary: '#2D2B32',
-                    outline: '#E6E6E6',
-                  },
-                }}
+                theme={getTextInputTheme()}
                 style={[styles.textFieldStyle, {fontFamily: checkoutDetails.fontFamily.regular,}]}
                 left={
                   <TextInput.Icon

package/src/sdk-version.json

@@ -1 +1 @@
-{ "version": "1.0.11-beta" }
+{ "version": "1.0.11-beta3" }

package/src/sharedContext/checkoutDetailsHandler.ts

@@ -13,6 +13,8 @@ export let checkoutDetailsHandler: CheckoutDetailsHandler = {
     fontFamily : {},
     ctaBorderRadius:0,
     buttonColor: '#1CA672',
+    textInputFieldFocusedOutlineColor : "#2D2B32",
+    textInputFieldUnFocusedOutlineColor: "#ADACB0",
     buttonTextColor:'white',
     headerColor : 'white',
     headerTextColor:'#363840',
@@ -46,7 +48,8 @@ export let checkoutDetailsHandler: CheckoutDetailsHandler = {
     isUPIOtmQRMethodEnabled : false,
     isOrderItemDetailsVisible : true,
     isSICheckboxVisible : false,
-    isSubscriptionCheckout : false
+    isSubscriptionCheckout : false,
+    subscriptionDetails : null
   },
 };
 
@@ -64,6 +67,8 @@ export const setCheckOutDetailsHandlerToDefault = () => {
       fontFamily : {},
       ctaBorderRadius:0,
       buttonColor: '',
+      textInputFieldFocusedOutlineColor : "",
+      textInputFieldUnFocusedOutlineColor: "",
       buttonTextColor:'',
       headerColor : '',
       headerTextColor:'',
@@ -97,7 +102,8 @@ export const setCheckOutDetailsHandlerToDefault = () => {
       isUPIOtmQRMethodEnabled: false,
       isOrderItemDetailsVisible : true,
       isSICheckboxVisible : false,
-      isSubscriptionCheckout : false
+      isSubscriptionCheckout : false,
+      subscriptionDetails : null
     },
   };
 };

package/src/sharedContext/getTextInputTheme.ts

@@ -0,0 +1,12 @@
+import { checkoutDetailsHandler } from "./checkoutDetailsHandler";
+
+
+export const getTextInputTheme = () => {
+    const { checkoutDetails } = checkoutDetailsHandler;
+    return {
+      colors: {
+        primary: checkoutDetails.textInputFieldFocusedOutlineColor,
+        outline: checkoutDetails.textInputFieldUnFocusedOutlineColor,
+      },
+    };
+};

package/src/styles/indexStyles.ts

@@ -44,7 +44,7 @@ const styles = StyleSheet.create({
     footerText : {
         fontSize: 12,
         color: '#888888',
-        marginBottom: 13,
+        paddingBottom:16,
     },
     footerImage : { height: 50, width: 50 },
     webViewScreenStyle : {

package/src/styles/screens/bnplScreenStyles.ts

@@ -53,12 +53,11 @@ const styles = StyleSheet.create({
     },
     bottomText : {
         fontSize: 12,
-        color: '#888888',
-        marginBottom: 13,
+        color: '#888888'
     },
     bottomContainer : {
         justifyContent: 'center',
-        alignItems: 'flex-end',
+        alignItems: 'center',
         backgroundColor: '#F5F6FB',
         flexDirection: 'row',
     },

package/src/styles/screens/cardScreenStyles.ts

@@ -15,6 +15,7 @@ const styles = StyleSheet.create({
         paddingTop: 14,
         paddingBottom: 12,
     },
+    subscriptionContainer : {backgroundColor:'#EFF3FA', marginHorizontal : 16, marginTop : 10, borderRadius : 6, paddingBottom : 4},
     buttonText: {
         color: 'white',
         fontSize: 16,
@@ -77,7 +78,6 @@ const styles = StyleSheet.create({
     errorText : {
         color: '#B3261E',
         fontSize: 12,
-        marginHorizontal: 16,
         marginTop: 4,
     },
     expiryCvvContainer : {
@@ -143,13 +143,12 @@ const styles = StyleSheet.create({
       },
       footerContainer : {
         justifyContent: 'center',
-        alignItems: 'flex-end',
+        alignItems: 'center',
         flexDirection: 'row',
     },
     footerText : {
         fontSize: 12,
-        color: '#888888',
-        marginBottom: 13,
+        color: '#888888'
     },
     footerImage : { height: 50, width: 50 },
 })

package/src/styles/screens/netBankingScreenStyles.ts

@@ -61,14 +61,13 @@ const styles = StyleSheet.create({
     },
     footerContainer : {
         justifyContent: 'center',
-        alignItems: 'flex-end',
+        alignItems: 'center',
         backgroundColor: '#F5F6FB',
         flexDirection: 'row',
     },
     footerTextStyle : {
         fontSize: 12,
-        color: '#888888',
-        marginBottom: 13,
+        color: '#888888'
     },
     footerIcon : { height: 50, width: 50 },
     webViewContainer : {

package/src/styles/screens/walletScreenStyles.ts

@@ -48,14 +48,13 @@ const styles = StyleSheet.create({
     },
     bottomContainer : {
         justifyContent: 'center',
-        alignItems: 'flex-end',
+        alignItems: 'center',
         backgroundColor: '#F5F6FB',
         flexDirection: 'row',
     },
     bottomText : {
         fontSize: 12,
-        color: '#888888',
-        marginBottom: 13,
+        color: '#888888'
     },
     bottomImage : {
         height: 50, width: 50

package/src/utility.ts

@@ -198,4 +198,27 @@ export const getPhoneNumberCodeAndCountryName = (countryCodeRef : string) : Coun
   const countryDataJson = countryData as Record<string, CountryDetails>;
   return countryDataJson[countryCodeRef];
 
-}
+}
+
+export const formatDate = (dateStr: string) => {
+  const [datePart] = dateStr.split(' '); // "28/08/2027"
+  if (!datePart) return '';
+  const [day, month, year] = datePart.split('/');
+
+  const months = [
+    'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
+    'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
+  ];
+
+  return `${day}-${months[Number(month) - 1]}-${year}`;
+};
+
+export const isEmpty = (value: unknown): boolean => {
+  if (value === null || value === undefined) return true;
+  if (typeof value === 'string') return value.trim() === '';
+  if (typeof value === 'number') return isNaN(value);
+  if (typeof value === 'boolean') return false;
+  if (Array.isArray(value)) return value.length === 0;
+  if (typeof value === 'object') return Object.keys(value).length === 0;
+  return false;
+};