react-native-payengine 2.0.16 → 2.0.18-alpha.1

package/lib/module/components/v2/PayEngineNative.js

@@ -1,20 +1,78 @@
-import { NativeModules, Platform } from "react-native";
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import { NativeEventEmitter, NativeModules, Platform } from "react-native";
 import { PayProvider } from "../../interfaces";
 const {
-  RNPayEngineNative
+  RNPayEngineNative,
+  RNPEEventEmitter
 } = NativeModules;
+/**
+ * Represents an access token used for authenticating with the PayEngine SDK.
+ *
+ * @remarks
+ * The access token contains the actual token string and the duration (in seconds)
+ * for which the token remains valid. This is typically retrieved from your backend
+ * and used for making authenticated requests.
+ *
+ * @property accessToken - The access token string.
+ * @property expiresIn - The time (in seconds) until the token expires.
+ *  
+ * @category PayEngine
+ */
+
+/**
+ * Provides an interface for interacting with the native PayEngine SDK.
+ *
+ * @remarks
+ * `PayEngineNative` acts as a bridge between your React Native JavaScript code and
+ * the native PayEngine SDKs on iOS and Android. It utilizes React Native's
+ * Native Modules and platform channels to enable core payment functionalities.
+ *
+ * These include:
+ * - Fraud monitoring
+ * - Browser/device info retrieval
+ * - Support detection for Apple Pay and Google Pay
+ *
+ *
+ * @category PayEngine
+ */
 export default class PayEngineNative {
+  constructor() {}
+  /**
+   * Retrieves a fraud monitoring session ID from the native PayEngine SDK.
+   *
+   *
+   * @param merchantId - The unique identifier for the merchant.
+   * @returns A `Promise<string>` containing the fraud monitoring session ID.
+   */
+
+
   static async createFraudMonitorSession(merchantId) {
     return RNPayEngineNative.createFraudMonitorSession(merchantId);
   }
+  /**
+   * Retrieves browser-related information from the native PayEngine SDK.
+   *
+   * @returns A `Promise<string>` containing browser and device details.
+   *
+   */
+
 
   static async getBrowserInfo() {
     return RNPayEngineNative.getBrowserInfo();
   }
   /**
-   * @deprecated use userCanPay instead
-   * @param merchantId 
-   * @returns 
+   * @deprecated Use {@link PayEngineNative.userCanPay} instead.
+   *
+   * Checks if platform-native payments (Apple Pay or Google Pay) are supported on the current device.
+   *
+   * @remarks
+   * This method has been deprecated in favor of {@link PayEngineNative.userCanPay}, which allows specifying
+   * the payment provider explicitly.
+   *
+   * @param merchantId - The unique identifier for the merchant.
+   * @returns A `Promise<boolean>` indicating whether the platform-specific payment method is supported.
+   *
    */
 
 
@@ -27,6 +85,22 @@ export default class PayEngineNative {
 
     return false;
   }
+  /**
+   * Checks if the user can make payments using Apple Pay (iOS) or Google Pay (Android).
+   *
+   * @remarks
+   * This method verifies whether the current device and platform support the selected payment provider.
+   * It performs a platform-specific check using the native PayEngine SDK for either Apple Pay or Google Pay.
+   *
+   * ## Supported Providers
+   * - `PayProvider.googlePay` (Android only)
+   * - `PayProvider.applePay` (iOS only)
+   *
+   * @param provider - The payment provider to check support for.
+   * @param merchantId - The unique identifier for the merchant.
+   * @returns A `Promise<boolean>` indicating whether the selected payment method is supported.
+   */
+
 
   static async userCanPay(provider, merchantId) {
     if (provider == PayProvider.applePay && Platform.OS == 'ios') {
@@ -37,6 +111,111 @@ export default class PayEngineNative {
 
     return false;
   }
+  /**
+   * Sets the callback function that provides an access token when required by PayEngine.
+   *
+   * @remarks
+   * When the PayEngine SDK needs an access token, it will call this callback function
+   * to request the host application to fetch a new token from its backend.
+   * 
+   * The SDK uses this token internally to make calls to merchant related APIs which require merchant's credentials.
+   *
+   * ## Important:
+   * - PayEngine will invoke this callback **whenever an access token is needed or needs to be refreshed**.
+   * - The integrator must ensure that the token retrieval logic is secure and efficient in their backend.
+   * - For more details on how to retrieve the access token from Payengine, refer to the official documentation:
+   *   [PayEngine Merchant Session](https://docs.payengine.co/merchant-session#obtaining-a-new-merchant-session)
+   *
+   * ## Example Usage
+   * ```ts
+   * const fetchAccessToken = async (): Promise<AccessToken> => {
+   *   try {
+   *     // Make a network request to your server to fetch the token
+   *     // Your server then makes a request to Payengine securely and returns the results back in response
+   *     const response = await fetch("https://yourserver.com/accessToken");
+   *     
+   *     if (!response.ok) {
+   *       throw new Error(`Server responded with status ${response.status}`);
+   *     }
+   *     
+   *     const data = await response.json();
+   *     
+   *     // Extract the token and expiration from your server's response
+   *     const token = data.access_token;
+   *     const expiresIn = data.expires_in;
+   *
+   *     return { accessToken: token, expiresIn };
+   *   } catch (e) {
+   *     throw new Error("Failed to fetch access token: " + e);
+   *   }
+   * };
+   * 
+   * // This is where you supply the callback to the SDK
+   * PayEngineNative.setFetchAccessTokenCallback(fetchAccessToken);
+   * ```
+   *
+   * @param callback - A function that returns a `Promise<AccessToken>`. The function must handle
+   * errors properly in case token retrieval fails.
+   */
+
+
+  static async setFetchAccessTokenCallback(callback) {
+    PayEngineNative.fetchAccessTokenCallback = callback;
+
+    if (!PayEngineNative.isFetchCallbackListenerRegistered) {
+      PayEngineNative.emitter.addListener("fetchAccessToken", async () => {
+        try {
+          const result = await PayEngineNative.fetchAccessTokenCallback();
+          RNPayEngineNative.provideFetchAccessTokenResult(result);
+        } catch (error) {
+          RNPayEngineNative.provideFetchAccessTokenResult(null);
+        }
+      });
+      PayEngineNative.isFetchCallbackListenerRegistered = true;
+    }
+
+    RNPayEngineNative.configureFetchAccessTokenCallback();
+  }
+  /**
+   * Logs out the current merchant by invalidating the access token.
+   *
+   * @remarks
+   * While access tokens automatically expire, it's **strongly recommended** to explicitly invalidate
+   * them when a merchant's session ends on the server.
+   *
+   * Relying solely on token expiration can introduce **security vulnerabilities** 
+   * and result in a **suboptimal user experience**.
+   *
+   * Calling this method ensures that the merchant's session is terminated, 
+   * preventing any further authenticated requests until a new login is performed.
+   *
+   * For more details, refer to the official documentation:  
+   * [PayEngine Merchant Session](https://docs.payengine.co/merchant-session)
+   *
+   * ## Example Usage
+   * ```ts
+   * const merchantId = "your_merchant_id_here";
+   * await PayEngineNative.logout(merchantId);
+   * console.log("Merchant session terminated.");
+   * ```
+   *
+   * This ensures that no further authenticated requests can be made
+   * until a new access token is fetched.
+   *
+   * @param merchantId - The unique identifier of the merchant whose session should be invalidated.
+   * @returns A `Promise` indicating the completion of the logout process.
+   */
+
+
+  static async logout(merchantId) {
+    return RNPayEngineNative.logout(merchantId);
+  }
 
 }
+
+_defineProperty(PayEngineNative, "emitter", new NativeEventEmitter(RNPEEventEmitter));
+
+_defineProperty(PayEngineNative, "isFetchCallbackListenerRegistered", false);
+
+_defineProperty(PayEngineNative, "fetchAccessTokenCallback", null);
 //# sourceMappingURL=PayEngineNative.js.map

package/lib/module/components/v2/PayEngineNative.js.map

@@ -1 +1 @@
-{"version":3,"names":["NativeModules","Platform","PayProvider","RNPayEngineNative","PayEngineNative","createFraudMonitorSession","merchantId","getBrowserInfo","isPlatformPaySupported","OS","isApplePaySupported","isGooglePaySupported","userCanPay","provider","applePay","googlePay"],"sources":["PayEngineNative.tsx"],"sourcesContent":["import { NativeModules, Platform } from \"react-native\";\nimport { PayProvider } from \"../../interfaces\";\n\nconst { RNPayEngineNative } = NativeModules;\n\nexport default class PayEngineNative {\n  static async createFraudMonitorSession(merchantId: string) { \n    return RNPayEngineNative.createFraudMonitorSession(merchantId);\n  }\n\n  static async getBrowserInfo() {\n    return RNPayEngineNative.getBrowserInfo();\n  }\n\n  /**\n   * @deprecated use userCanPay instead\n   * @param merchantId \n   * @returns \n   */\n  static async isPlatformPaySupported(merchantId: string) {\n    if (Platform.OS === 'ios') {\n      return await RNPayEngineNative.isApplePaySupported(merchantId);\n    } else if (Platform.OS === 'android') {\n      return await RNPayEngineNative.isGooglePaySupported(merchantId);\n    }\n    return false;\n  }\n\n  static async userCanPay(provider: PayProvider, merchantId: string) {\n    if (provider == PayProvider.applePay && Platform.OS == 'ios') {\n      return await RNPayEngineNative.isApplePaySupported(merchantId);\n    } else if (provider === PayProvider.googlePay && Platform.OS === 'android') {\n      return await RNPayEngineNative.isGooglePaySupported(merchantId);\n    }\n    return false;\n  }\n}"],"mappings":"AAAA,SAASA,aAAT,EAAwBC,QAAxB,QAAwC,cAAxC;AACA,SAASC,WAAT,QAA4B,kBAA5B;AAEA,MAAM;EAAEC;AAAF,IAAwBH,aAA9B;AAEA,eAAe,MAAMI,eAAN,CAAsB;EACG,aAAzBC,yBAAyB,CAACC,UAAD,EAAqB;IACzD,OAAOH,iBAAiB,CAACE,yBAAlB,CAA4CC,UAA5C,CAAP;EACD;;EAE0B,aAAdC,cAAc,GAAG;IAC5B,OAAOJ,iBAAiB,CAACI,cAAlB,EAAP;EACD;EAED;AACF;AACA;AACA;AACA;;;EACqC,aAAtBC,sBAAsB,CAACF,UAAD,EAAqB;IACtD,IAAIL,QAAQ,CAACQ,EAAT,KAAgB,KAApB,EAA2B;MACzB,OAAO,MAAMN,iBAAiB,CAACO,mBAAlB,CAAsCJ,UAAtC,CAAb;IACD,CAFD,MAEO,IAAIL,QAAQ,CAACQ,EAAT,KAAgB,SAApB,EAA+B;MACpC,OAAO,MAAMN,iBAAiB,CAACQ,oBAAlB,CAAuCL,UAAvC,CAAb;IACD;;IACD,OAAO,KAAP;EACD;;EAEsB,aAAVM,UAAU,CAACC,QAAD,EAAwBP,UAAxB,EAA4C;IACjE,IAAIO,QAAQ,IAAIX,WAAW,CAACY,QAAxB,IAAoCb,QAAQ,CAACQ,EAAT,IAAe,KAAvD,EAA8D;MAC5D,OAAO,MAAMN,iBAAiB,CAACO,mBAAlB,CAAsCJ,UAAtC,CAAb;IACD,CAFD,MAEO,IAAIO,QAAQ,KAAKX,WAAW,CAACa,SAAzB,IAAsCd,QAAQ,CAACQ,EAAT,KAAgB,SAA1D,EAAqE;MAC1E,OAAO,MAAMN,iBAAiB,CAACQ,oBAAlB,CAAuCL,UAAvC,CAAb;IACD;;IACD,OAAO,KAAP;EACD;;AA9BkC"}
+{"version":3,"names":["NativeEventEmitter","NativeModules","Platform","PayProvider","RNPayEngineNative","RNPEEventEmitter","PayEngineNative","constructor","createFraudMonitorSession","merchantId","getBrowserInfo","isPlatformPaySupported","OS","isApplePaySupported","isGooglePaySupported","userCanPay","provider","applePay","googlePay","setFetchAccessTokenCallback","callback","fetchAccessTokenCallback","isFetchCallbackListenerRegistered","emitter","addListener","result","provideFetchAccessTokenResult","error","configureFetchAccessTokenCallback","logout"],"sources":["PayEngineNative.tsx"],"sourcesContent":["import { NativeEventEmitter, NativeModules, Platform } from \"react-native\";\nimport { PayProvider } from \"../../interfaces\";\n\nconst { RNPayEngineNative, RNPEEventEmitter } = NativeModules;\n\n/**\n * Represents an access token used for authenticating with the PayEngine SDK.\n *\n * @remarks\n * The access token contains the actual token string and the duration (in seconds)\n * for which the token remains valid. This is typically retrieved from your backend\n * and used for making authenticated requests.\n *\n * @property accessToken - The access token string.\n * @property expiresIn - The time (in seconds) until the token expires.\n *  \n * @category PayEngine\n */\nexport type AccessToken = {\n  accessToken: string;\n  expiresIn: number;\n};\n\n/**\n * A callback function that provides an access token to the PayEngine SDK.\n *\n * @returns A promise resolving to a valid {@link AccessToken}.\n * \n * @category PayEngine\n */\nexport type FetchAccessTokenCallback = () => Promise<AccessToken>;\n\n/**\n * Provides an interface for interacting with the native PayEngine SDK.\n *\n * @remarks\n * `PayEngineNative` acts as a bridge between your React Native JavaScript code and\n * the native PayEngine SDKs on iOS and Android. It utilizes React Native's\n * Native Modules and platform channels to enable core payment functionalities.\n *\n * These include:\n * - Fraud monitoring\n * - Browser/device info retrieval\n * - Support detection for Apple Pay and Google Pay\n *\n *\n * @category PayEngine\n */\nexport default class PayEngineNative {\n  private static emitter = new NativeEventEmitter(RNPEEventEmitter);\n\n  private static isFetchCallbackListenerRegistered = false;\n\n  private static fetchAccessTokenCallback: FetchAccessTokenCallback | null = null;\n\n\n  private constructor() { }\n\n  /**\n   * Retrieves a fraud monitoring session ID from the native PayEngine SDK.\n   *\n   *\n   * @param merchantId - The unique identifier for the merchant.\n   * @returns A `Promise<string>` containing the fraud monitoring session ID.\n   */\n  static async createFraudMonitorSession(merchantId: string): Promise<string> {\n    return RNPayEngineNative.createFraudMonitorSession(merchantId);\n  }\n\n  /**\n   * Retrieves browser-related information from the native PayEngine SDK.\n   *\n   * @returns A `Promise<string>` containing browser and device details.\n   *\n   */\n  static async getBrowserInfo(): Promise<string> {\n    return RNPayEngineNative.getBrowserInfo();\n  }\n\n  /**\n   * @deprecated Use {@link PayEngineNative.userCanPay} instead.\n   *\n   * Checks if platform-native payments (Apple Pay or Google Pay) are supported on the current device.\n   *\n   * @remarks\n   * This method has been deprecated in favor of {@link PayEngineNative.userCanPay}, which allows specifying\n   * the payment provider explicitly.\n   *\n   * @param merchantId - The unique identifier for the merchant.\n   * @returns A `Promise<boolean>` indicating whether the platform-specific payment method is supported.\n   *\n   */\n  static async isPlatformPaySupported(merchantId: string): Promise<boolean> {\n    if (Platform.OS === 'ios') {\n      return await RNPayEngineNative.isApplePaySupported(merchantId);\n    } else if (Platform.OS === 'android') {\n      return await RNPayEngineNative.isGooglePaySupported(merchantId);\n    }\n    return false;\n  }\n\n  /**\n   * Checks if the user can make payments using Apple Pay (iOS) or Google Pay (Android).\n   *\n   * @remarks\n   * This method verifies whether the current device and platform support the selected payment provider.\n   * It performs a platform-specific check using the native PayEngine SDK for either Apple Pay or Google Pay.\n   *\n   * ## Supported Providers\n   * - `PayProvider.googlePay` (Android only)\n   * - `PayProvider.applePay` (iOS only)\n   *\n   * @param provider - The payment provider to check support for.\n   * @param merchantId - The unique identifier for the merchant.\n   * @returns A `Promise<boolean>` indicating whether the selected payment method is supported.\n   */\n  static async userCanPay(provider: PayProvider, merchantId: string): Promise<boolean> {\n    if (provider == PayProvider.applePay && Platform.OS == 'ios') {\n      return await RNPayEngineNative.isApplePaySupported(merchantId);\n    } else if (provider === PayProvider.googlePay && Platform.OS === 'android') {\n      return await RNPayEngineNative.isGooglePaySupported(merchantId);\n    }\n    return false;\n  }\n\n\n  /**\n   * Sets the callback function that provides an access token when required by PayEngine.\n   *\n   * @remarks\n   * When the PayEngine SDK needs an access token, it will call this callback function\n   * to request the host application to fetch a new token from its backend.\n   * \n   * The SDK uses this token internally to make calls to merchant related APIs which require merchant's credentials.\n   *\n   * ## Important:\n   * - PayEngine will invoke this callback **whenever an access token is needed or needs to be refreshed**.\n   * - The integrator must ensure that the token retrieval logic is secure and efficient in their backend.\n   * - For more details on how to retrieve the access token from Payengine, refer to the official documentation:\n   *   [PayEngine Merchant Session](https://docs.payengine.co/merchant-session#obtaining-a-new-merchant-session)\n   *\n   * ## Example Usage\n   * ```ts\n   * const fetchAccessToken = async (): Promise<AccessToken> => {\n   *   try {\n   *     // Make a network request to your server to fetch the token\n   *     // Your server then makes a request to Payengine securely and returns the results back in response\n   *     const response = await fetch(\"https://yourserver.com/accessToken\");\n   *     \n   *     if (!response.ok) {\n   *       throw new Error(`Server responded with status ${response.status}`);\n   *     }\n   *     \n   *     const data = await response.json();\n   *     \n   *     // Extract the token and expiration from your server's response\n   *     const token = data.access_token;\n   *     const expiresIn = data.expires_in;\n   *\n   *     return { accessToken: token, expiresIn };\n   *   } catch (e) {\n   *     throw new Error(\"Failed to fetch access token: \" + e);\n   *   }\n   * };\n   * \n   * // This is where you supply the callback to the SDK\n   * PayEngineNative.setFetchAccessTokenCallback(fetchAccessToken);\n   * ```\n   *\n   * @param callback - A function that returns a `Promise<AccessToken>`. The function must handle\n   * errors properly in case token retrieval fails.\n   */\n  static async setFetchAccessTokenCallback(callback: FetchAccessTokenCallback) {\n    PayEngineNative.fetchAccessTokenCallback = callback;\n\n    if (!PayEngineNative.isFetchCallbackListenerRegistered) {\n      PayEngineNative.emitter.addListener(\"fetchAccessToken\", async () => {\n        try {\n          const result = await PayEngineNative.fetchAccessTokenCallback!();\n          RNPayEngineNative.provideFetchAccessTokenResult(result);\n        } catch (error) {\n          RNPayEngineNative.provideFetchAccessTokenResult(null);\n        }\n      });\n      PayEngineNative.isFetchCallbackListenerRegistered = true;\n    }\n\n\n    RNPayEngineNative.configureFetchAccessTokenCallback();\n  }\n\n  /**\n   * Logs out the current merchant by invalidating the access token.\n   *\n   * @remarks\n   * While access tokens automatically expire, it's **strongly recommended** to explicitly invalidate\n   * them when a merchant's session ends on the server.\n   *\n   * Relying solely on token expiration can introduce **security vulnerabilities** \n   * and result in a **suboptimal user experience**.\n   *\n   * Calling this method ensures that the merchant's session is terminated, \n   * preventing any further authenticated requests until a new login is performed.\n   *\n   * For more details, refer to the official documentation:  \n   * [PayEngine Merchant Session](https://docs.payengine.co/merchant-session)\n   *\n   * ## Example Usage\n   * ```ts\n   * const merchantId = \"your_merchant_id_here\";\n   * await PayEngineNative.logout(merchantId);\n   * console.log(\"Merchant session terminated.\");\n   * ```\n   *\n   * This ensures that no further authenticated requests can be made\n   * until a new access token is fetched.\n   *\n   * @param merchantId - The unique identifier of the merchant whose session should be invalidated.\n   * @returns A `Promise` indicating the completion of the logout process.\n   */\n  static async logout(merchantId: string): Promise<void> {\n    return RNPayEngineNative.logout(merchantId);\n  }\n}"],"mappings":";;AAAA,SAASA,kBAAT,EAA6BC,aAA7B,EAA4CC,QAA5C,QAA4D,cAA5D;AACA,SAASC,WAAT,QAA4B,kBAA5B;AAEA,MAAM;EAAEC,iBAAF;EAAqBC;AAArB,IAA0CJ,aAAhD;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,MAAMK,eAAN,CAAsB;EAQ3BC,WAAW,GAAG,CAAG;EAEzB;AACF;AACA;AACA;AACA;AACA;AACA;;;EACwC,aAAzBC,yBAAyB,CAACC,UAAD,EAAsC;IAC1E,OAAOL,iBAAiB,CAACI,yBAAlB,CAA4CC,UAA5C,CAAP;EACD;EAED;AACF;AACA;AACA;AACA;AACA;;;EAC6B,aAAdC,cAAc,GAAoB;IAC7C,OAAON,iBAAiB,CAACM,cAAlB,EAAP;EACD;EAED;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;EACqC,aAAtBC,sBAAsB,CAACF,UAAD,EAAuC;IACxE,IAAIP,QAAQ,CAACU,EAAT,KAAgB,KAApB,EAA2B;MACzB,OAAO,MAAMR,iBAAiB,CAACS,mBAAlB,CAAsCJ,UAAtC,CAAb;IACD,CAFD,MAEO,IAAIP,QAAQ,CAACU,EAAT,KAAgB,SAApB,EAA+B;MACpC,OAAO,MAAMR,iBAAiB,CAACU,oBAAlB,CAAuCL,UAAvC,CAAb;IACD;;IACD,OAAO,KAAP;EACD;EAED;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;EACyB,aAAVM,UAAU,CAACC,QAAD,EAAwBP,UAAxB,EAA8D;IACnF,IAAIO,QAAQ,IAAIb,WAAW,CAACc,QAAxB,IAAoCf,QAAQ,CAACU,EAAT,IAAe,KAAvD,EAA8D;MAC5D,OAAO,MAAMR,iBAAiB,CAACS,mBAAlB,CAAsCJ,UAAtC,CAAb;IACD,CAFD,MAEO,IAAIO,QAAQ,KAAKb,WAAW,CAACe,SAAzB,IAAsChB,QAAQ,CAACU,EAAT,KAAgB,SAA1D,EAAqE;MAC1E,OAAO,MAAMR,iBAAiB,CAACU,oBAAlB,CAAuCL,UAAvC,CAAb;IACD;;IACD,OAAO,KAAP;EACD;EAGD;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;EAC0C,aAA3BU,2BAA2B,CAACC,QAAD,EAAqC;IAC3Ed,eAAe,CAACe,wBAAhB,GAA2CD,QAA3C;;IAEA,IAAI,CAACd,eAAe,CAACgB,iCAArB,EAAwD;MACtDhB,eAAe,CAACiB,OAAhB,CAAwBC,WAAxB,CAAoC,kBAApC,EAAwD,YAAY;QAClE,IAAI;UACF,MAAMC,MAAM,GAAG,MAAMnB,eAAe,CAACe,wBAAhB,EAArB;UACAjB,iBAAiB,CAACsB,6BAAlB,CAAgDD,MAAhD;QACD,CAHD,CAGE,OAAOE,KAAP,EAAc;UACdvB,iBAAiB,CAACsB,6BAAlB,CAAgD,IAAhD;QACD;MACF,CAPD;MAQApB,eAAe,CAACgB,iCAAhB,GAAoD,IAApD;IACD;;IAGDlB,iBAAiB,CAACwB,iCAAlB;EACD;EAED;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;EACqB,aAANC,MAAM,CAACpB,UAAD,EAAoC;IACrD,OAAOL,iBAAiB,CAACyB,MAAlB,CAAyBpB,UAAzB,CAAP;EACD;;AA9KkC;;gBAAhBH,e,aACM,IAAIN,kBAAJ,CAAuBK,gBAAvB,C;;gBADNC,e,uCAGgC,K;;gBAHhCA,e,8BAKwD,I"}

package/lib/module/components/v2/PayEngineProvider.js

@@ -4,6 +4,57 @@ const {
   RNPayEngineNative
 } = NativeModules;
 const PayEngineContext = /*#__PURE__*/createContext(undefined);
+/**
+ * A provider that initializes and manages PayEngine's configuration across the app.
+ *
+ * `PayEngineProvider` ensures that PayEngine's SDK is properly set up by loading
+ * the necessary configurations before rendering the app. It must wrap the root widget
+ * for the payment functionalities to work correctly.
+ *
+ * ## Usage
+ *
+ * Before using PayEngine in your application, wrap your app inside [PayEngineProvider]
+ * and pass an `IPayEngineConfig` instance containing your public key, script URL, and optional log level.
+ *
+ * ```tsx
+ * const PE_CONFIG: IPayEngineConfig = {
+ *   publicKey: PUBLIC_KEY,
+ *   scriptURL: "https://staging-sandbox.payengine.dev/",
+ *   logLevel: 1,
+ * };
+ *
+ * return (
+ *   <PayEngineProvider config={PE_CONFIG}>
+ *     <NavigationContainer>
+ *       <DrawerNavigator />
+ *     </NavigationContainer>
+ *   </PayEngineProvider>
+ * );
+ * ```
+ *
+ * ## How It Works
+ *
+ * 1. The `PayEngineProvider` component accepts a configuration object (`IPayEngineConfig`) containing 
+ *    the `publicKey`, `scriptURL`, and `logLevel`.
+ * 2. It initializes the PayEngine SDK with the `publicKey` 
+ *    and `scriptURL` from the configuration.
+ * 3. The provider uses the `React.useEffect` hook to ensure that the configuration is set up 
+ *    before rendering the children.
+ * 4. While loading the configuration, an `ActivityIndicator` is displayed. Once the SDK is set up, 
+ *    it renders the provided child components.
+ *
+ * ## Properties:
+ *
+ * - **`config`**: The configuration required for PayEngine (type: `IPayEngineConfig`).
+ *   - `publicKey`: The public key for authentication.
+ *   - `scriptURL`: The URL for the PayEngine script.
+ *   - `logLevel`: The log level for debugging (optional).
+ *
+ * - **`children`**: The child components or widgets to be rendered after PayEngine is initialized.
+ *
+ *
+ * @category SecureFields
+ */
 
 const PayEngineProvider = _ref => {
   let {

package/lib/module/components/v2/PayEngineProvider.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","createContext","ActivityIndicator","NativeModules","RNPayEngineNative","PayEngineContext","undefined","PayEngineProvider","config","children","loading","setLoading","useState","useEffect","setConfig","publicKey","scriptURL","Error"],"sources":["PayEngineProvider.tsx"],"sourcesContent":["import React, { createContext } from \"react\";\nimport type { IPayEngineConfig } from \"../../interfaces\";\nimport { ActivityIndicator, NativeModules } from \"react-native\";\n\nconst { RNPayEngineNative } = NativeModules;\n\nconst PayEngineContext = createContext<IPayEngineConfig | undefined>(undefined);\n\nconst PayEngineProvider = ({ config, children }: { config: IPayEngineConfig, children: React.ReactNode }) => {\n  const [loading, setLoading] = React.useState(true);\n\n  React.useEffect(() => {\n    setLoading(true);\n    RNPayEngineNative.setConfig(config.publicKey, config.scriptURL)\n    setLoading(false);\n  }, [config]);\n\n  if (!config) {\n    throw new Error('PayEngineProvider: config is required');\n  }\n\n  return <PayEngineContext.Provider value={config}>\n    {loading ? <ActivityIndicator /> : children}\n  </PayEngineContext.Provider>\n}\n\nexport {\n  PayEngineContext,\n  PayEngineProvider\n};"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,aAAhB,QAAqC,OAArC;AAEA,SAASC,iBAAT,EAA4BC,aAA5B,QAAiD,cAAjD;AAEA,MAAM;EAAEC;AAAF,IAAwBD,aAA9B;AAEA,MAAME,gBAAgB,gBAAGJ,aAAa,CAA+BK,SAA/B,CAAtC;;AAEA,MAAMC,iBAAiB,GAAG,QAAmF;EAAA,IAAlF;IAAEC,MAAF;IAAUC;EAAV,CAAkF;EAC3G,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBX,KAAK,CAACY,QAAN,CAAe,IAAf,CAA9B;EAEAZ,KAAK,CAACa,SAAN,CAAgB,MAAM;IACpBF,UAAU,CAAC,IAAD,CAAV;IACAP,iBAAiB,CAACU,SAAlB,CAA4BN,MAAM,CAACO,SAAnC,EAA8CP,MAAM,CAACQ,SAArD;IACAL,UAAU,CAAC,KAAD,CAAV;EACD,CAJD,EAIG,CAACH,MAAD,CAJH;;EAMA,IAAI,CAACA,MAAL,EAAa;IACX,MAAM,IAAIS,KAAJ,CAAU,uCAAV,CAAN;EACD;;EAED,oBAAO,oBAAC,gBAAD,CAAkB,QAAlB;IAA2B,KAAK,EAAET;EAAlC,GACJE,OAAO,gBAAG,oBAAC,iBAAD,OAAH,GAA2BD,QAD9B,CAAP;AAGD,CAhBD;;AAkBA,SACEJ,gBADF,EAEEE,iBAFF"}
+{"version":3,"names":["React","createContext","ActivityIndicator","NativeModules","RNPayEngineNative","PayEngineContext","undefined","PayEngineProvider","config","children","loading","setLoading","useState","useEffect","setConfig","publicKey","scriptURL","Error"],"sources":["PayEngineProvider.tsx"],"sourcesContent":["import React, { createContext } from \"react\";\nimport type { IPayEngineConfig } from \"../../interfaces\";\nimport { ActivityIndicator, NativeModules } from \"react-native\";\n\nconst { RNPayEngineNative } = NativeModules;\n\nconst PayEngineContext = createContext<IPayEngineConfig | undefined>(undefined);\n\n/**\n * A provider that initializes and manages PayEngine's configuration across the app.\n *\n * `PayEngineProvider` ensures that PayEngine's SDK is properly set up by loading\n * the necessary configurations before rendering the app. It must wrap the root widget\n * for the payment functionalities to work correctly.\n *\n * ## Usage\n *\n * Before using PayEngine in your application, wrap your app inside [PayEngineProvider]\n * and pass an `IPayEngineConfig` instance containing your public key, script URL, and optional log level.\n *\n * ```tsx\n * const PE_CONFIG: IPayEngineConfig = {\n *   publicKey: PUBLIC_KEY,\n *   scriptURL: \"https://staging-sandbox.payengine.dev/\",\n *   logLevel: 1,\n * };\n *\n * return (\n *   <PayEngineProvider config={PE_CONFIG}>\n *     <NavigationContainer>\n *       <DrawerNavigator />\n *     </NavigationContainer>\n *   </PayEngineProvider>\n * );\n * ```\n *\n * ## How It Works\n *\n * 1. The `PayEngineProvider` component accepts a configuration object (`IPayEngineConfig`) containing \n *    the `publicKey`, `scriptURL`, and `logLevel`.\n * 2. It initializes the PayEngine SDK with the `publicKey` \n *    and `scriptURL` from the configuration.\n * 3. The provider uses the `React.useEffect` hook to ensure that the configuration is set up \n *    before rendering the children.\n * 4. While loading the configuration, an `ActivityIndicator` is displayed. Once the SDK is set up, \n *    it renders the provided child components.\n *\n * ## Properties:\n *\n * - **`config`**: The configuration required for PayEngine (type: `IPayEngineConfig`).\n *   - `publicKey`: The public key for authentication.\n *   - `scriptURL`: The URL for the PayEngine script.\n *   - `logLevel`: The log level for debugging (optional).\n *\n * - **`children`**: The child components or widgets to be rendered after PayEngine is initialized.\n *\n *\n * @category SecureFields\n */\nconst PayEngineProvider = ({ config, children }: { config: IPayEngineConfig, children: React.ReactNode }) => {\n  const [loading, setLoading] = React.useState(true);\n\n  React.useEffect(() => {\n    setLoading(true);\n    RNPayEngineNative.setConfig(config.publicKey, config.scriptURL)\n    setLoading(false);\n  }, [config]);\n\n  if (!config) {\n    throw new Error('PayEngineProvider: config is required');\n  }\n\n  return <PayEngineContext.Provider value={config}>\n    {loading ? <ActivityIndicator /> : children}\n  </PayEngineContext.Provider>\n};\n\nexport {\n  PayEngineContext,\n  PayEngineProvider\n};"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,aAAhB,QAAqC,OAArC;AAEA,SAASC,iBAAT,EAA4BC,aAA5B,QAAiD,cAAjD;AAEA,MAAM;EAAEC;AAAF,IAAwBD,aAA9B;AAEA,MAAME,gBAAgB,gBAAGJ,aAAa,CAA+BK,SAA/B,CAAtC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMC,iBAAiB,GAAG,QAAmF;EAAA,IAAlF;IAAEC,MAAF;IAAUC;EAAV,CAAkF;EAC3G,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBX,KAAK,CAACY,QAAN,CAAe,IAAf,CAA9B;EAEAZ,KAAK,CAACa,SAAN,CAAgB,MAAM;IACpBF,UAAU,CAAC,IAAD,CAAV;IACAP,iBAAiB,CAACU,SAAlB,CAA4BN,MAAM,CAACO,SAAnC,EAA8CP,MAAM,CAACQ,SAArD;IACAL,UAAU,CAAC,KAAD,CAAV;EACD,CAJD,EAIG,CAACH,MAAD,CAJH;;EAMA,IAAI,CAACA,MAAL,EAAa;IACX,MAAM,IAAIS,KAAJ,CAAU,uCAAV,CAAN;EACD;;EAED,oBAAO,oBAAC,gBAAD,CAAkB,QAAlB;IAA2B,KAAK,EAAET;EAAlC,GACJE,OAAO,gBAAG,oBAAC,iBAAD,OAAH,GAA2BD,QAD9B,CAAP;AAGD,CAhBD;;AAkBA,SACEJ,gBADF,EAEEE,iBAFF"}

package/lib/module/components/v2/SecureFields/BankAccountView.js

@@ -8,6 +8,77 @@ const RNPEBankAccountView = requireNativeComponent(COMPONENT_NAME); // @ts-ignor
 
 const RNPEBankAccountViewManager = UIManager[COMPONENT_NAME];
 const peEventEmitter = new NativeEventEmitter(RNPEEventEmitter);
+/**
+ * Props for the `PEBankAccountView` component.
+ *
+ * Allows optional configuration of additional input fields that can be rendered
+ * alongside the standard bank account fields.
+ *
+ * These fields can be used to collect extra information such as account holder type,
+ * billing address, or custom metadata required by the merchant.
+ *
+ * @category SecureFields
+ *
+ * @example
+ * ```ts
+ * const fields: IPEField[] = [
+ *   {
+ *     name: "accountHolderType",
+ *     type: "text",
+ *     placeholder: "Account Holder Type",
+ *     keyboardType: PEKeyboardType.Alphabet,
+ *     isRequired: false
+ *   }
+ * ];
+ *
+ * <PEBankAccountView additionalFields={fields} />
+ * ```
+ */
+
+/**
+ * A secure form widget for entering a customer's bank account information.
+ *
+ * [PEBankAccountView] provides a UI component for securely collecting bank account details.
+ * It does not store data locally and instead tokenizes the information using PayEngine.
+ *
+ * ## Features:
+ * - Securely collects bank account details.
+ * - Supports additional customizable fields.
+ * - Provides methods to show/hide the keyboard.
+ * - Allows tokenizing the entered data for safe storage.
+ *
+ * ## Usage Example:
+ *
+ * ```tsx
+ * const formRef = React.createRef<PEBankAccountViewMethods>();
+ *
+ * return (
+ *   <View style={styles.container}>
+ *     <Text>Welcome to PayEngine React Native SDK example</Text>
+ *     <View style={{ width: '100%' }}>
+ *       <PEBankAccountView ref={formRef} />
+ *       <Button disabled={submitting} onPress={() => createBankAccount()} title="Create Bank Account" />
+ *     </View>
+ *     <ScrollView style={{ flex: 1, width: '100%', backgroundColor: 'lightyellow', padding: 10, marginVertical: 20 }}>
+ *       <Text>{JSON.stringify(secureFieldsResult, null, 4)}</Text>
+ *     </ScrollView>
+ *   </View>
+ * );
+ * ```
+ *
+ * ## How It Works:
+ * 1. Create an instance of [PEBankAccountView], optionally passing additional fields.
+ * 2. Display the form inside your widget tree.
+ * 3. Use [showKeyboard] and [hideKeyboard] to manage input focus.
+ * 4. Call [submit] to securely send the bank account data and receive a token.
+ *
+ * ## Methods:
+ * - **`showKeyboard()`**: Manually shows the on-screen keyboard.
+ * - **`hideKeyboard()`**: Hides the on-screen keyboard.
+ * - **`submit()`**: Submits the entered data and retrieves a tokenized version of the bank account data.
+ *
+ * @category SecureFields
+ */
 export const PEBankAccountView = /*#__PURE__*/React.forwardRef((props, ref) => {
   const formRef = React.useRef();
   const [height, setHeight] = React.useState(0);

package/lib/module/components/v2/SecureFields/BankAccountView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","requireNativeComponent","NativeModules","NativeEventEmitter","findNodeHandle","UIManager","ActivityIndicator","Platform","RNPEEventEmitter","COMPONENT_NAME","RNPEBankAccountView","RNPEBankAccountViewManager","peEventEmitter","PEBankAccountView","forwardRef","props","ref","formRef","useRef","height","setHeight","useState","useImperativeHandle","submit","data","Promise","resolve","reject","Error","listener","addListener","args","remove","error","bankAccount","json","JSON","parse","callNativeMethod","merchantId","additionalData","showKeyboard","hideKeyboard","useCallback","methodName","params","viewId","current","commandId","Commands","toString","OS","Number","dispatchViewManagerCommand","useEffect","eventListener","width","_","frameHeight","stringify","additionalFields"],"sources":["BankAccountView.tsx"],"sourcesContent":["\nimport * as React from 'react';\nimport { requireNativeComponent, NativeModules, NativeEventEmitter, ViewProps, findNodeHandle, UIManager, ActivityIndicator, Platform } from 'react-native';\nimport type IPEField from './IPEField';\nimport type PEBankAccount from './PEBankAccount';\nimport type ITokenizationData from './ITokenizationData';\n\nconst { RNPEEventEmitter } = NativeModules;\n\ninterface NativePEBankAccountViewProps extends ViewProps {\n  additionalFields: string;\n}\n\nconst COMPONENT_NAME = 'RNPEBankAccountView'\nconst RNPEBankAccountView = requireNativeComponent<NativePEBankAccountViewProps>(COMPONENT_NAME);\n// @ts-ignore\nconst RNPEBankAccountViewManager = UIManager[COMPONENT_NAME]\n\nconst peEventEmitter = new NativeEventEmitter(RNPEEventEmitter);\n\nexport interface PEBankAccountViewProps {\n  additionalFields?: IPEField[];\n}\n\nexport interface PEBankAccountViewMethods {\n  submit: (data: ITokenizationData) => Promise<PEBankAccount>;\n  showKeyboard: () => void;\n  hideKeyboard: () => void;\n}\n\nexport const PEBankAccountView = React.forwardRef<\n  PEBankAccountViewMethods,\n  PEBankAccountViewProps\n>((props, ref) => {\n  const formRef = React.useRef<any>();\n  const [height, setHeight] = React.useState(0);\n\n  React.useImperativeHandle(ref, () => ({\n    submit: async (data: ITokenizationData = {}) => {\n      return new Promise((resolve, reject) => {\n        if (height === 0) {\n          return reject(new Error('Form is not ready'))\n        }\n        \n        const listener = peEventEmitter.addListener('onBankAccountRespond', args => {\n          listener.remove()\n\n          const { error, bankAccount: json } = args;\n          if (error) {\n            reject(new Error(error))\n          } else {\n            const bankAccount = JSON.parse(json) as PEBankAccount;\n            resolve(bankAccount)\n          }\n        });\n\n        callNativeMethod(\"submit\", [data.merchantId, data.additionalData],)\n      });\n    },\n    showKeyboard: () => {\n      callNativeMethod(\"showKeyboard\")\n    },\n    hideKeyboard: () => {\n      callNativeMethod(\"hideKeyboard\")\n    }\n  }));\n\n  const callNativeMethod = React.useCallback((methodName: string, params: any[] = []) => {\n    const viewId = findNodeHandle(formRef.current);\n    let commandId = RNPEBankAccountViewManager.Commands[methodName].toString()\n    if (Platform.OS === 'ios') {\n      commandId = Number(commandId)\n    }\n    UIManager.dispatchViewManagerCommand(\n      viewId,\n      commandId,\n      params,\n    );\n  }, [formRef.current])\n\n\n  React.useEffect(() => {\n    const eventListener = peEventEmitter.addListener('onSizeChanges', args => {\n      const { width: _, height: frameHeight } = args;\n      setHeight(frameHeight);\n    });\n    return () => eventListener.remove();\n  }, []);\n\n  return (\n    <>\n      {height === 0 && <ActivityIndicator />}\n      <RNPEBankAccountView ref={formRef} additionalFields={JSON.stringify(props.additionalFields ?? [])} style={{ height: height }}  />\n    </>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"names":["React","requireNativeComponent","NativeModules","NativeEventEmitter","findNodeHandle","UIManager","ActivityIndicator","Platform","RNPEEventEmitter","COMPONENT_NAME","RNPEBankAccountView","RNPEBankAccountViewManager","peEventEmitter","PEBankAccountView","forwardRef","props","ref","formRef","useRef","height","setHeight","useState","useImperativeHandle","submit","data","Promise","resolve","reject","Error","listener","addListener","args","remove","error","bankAccount","json","JSON","parse","callNativeMethod","merchantId","additionalData","showKeyboard","hideKeyboard","useCallback","methodName","params","viewId","current","commandId","Commands","toString","OS","Number","dispatchViewManagerCommand","useEffect","eventListener","width","_","frameHeight","stringify","additionalFields"],"sources":["BankAccountView.tsx"],"sourcesContent":["\nimport * as React from 'react';\nimport { requireNativeComponent, NativeModules, NativeEventEmitter, type ViewProps, findNodeHandle, UIManager, ActivityIndicator, Platform } from 'react-native';\nimport type IPEField from './IPEField';\nimport type PEBankAccount from './PEBankAccount';\nimport type ITokenizationData from './ITokenizationData';\n\nconst { RNPEEventEmitter } = NativeModules;\n\ninterface NativePEBankAccountViewProps extends ViewProps {\n  additionalFields: string;\n}\n\nconst COMPONENT_NAME = 'RNPEBankAccountView'\nconst RNPEBankAccountView = requireNativeComponent<NativePEBankAccountViewProps>(COMPONENT_NAME);\n// @ts-ignore\nconst RNPEBankAccountViewManager = UIManager[COMPONENT_NAME]\n\nconst peEventEmitter = new NativeEventEmitter(RNPEEventEmitter);\n\n/**\n * Props for the `PEBankAccountView` component.\n *\n * Allows optional configuration of additional input fields that can be rendered\n * alongside the standard bank account fields.\n *\n * These fields can be used to collect extra information such as account holder type,\n * billing address, or custom metadata required by the merchant.\n *\n * @category SecureFields\n *\n * @example\n * ```ts\n * const fields: IPEField[] = [\n *   {\n *     name: \"accountHolderType\",\n *     type: \"text\",\n *     placeholder: \"Account Holder Type\",\n *     keyboardType: PEKeyboardType.Alphabet,\n *     isRequired: false\n *   }\n * ];\n *\n * <PEBankAccountView additionalFields={fields} />\n * ```\n */\nexport interface PEBankAccountViewProps {\n  /**\n   * (Optional) A list of additional fields to be displayed in the bank account form.\n   *\n   * These are rendered below the standard account number and routing number fields.\n   */\n  additionalFields?: IPEField[];\n}\n\n\n/**\n * Provides methods to control and interact with the PayEngine Bank Account input view.\n *\n * This interface defines methods for submitting bank account details for tokenization\n * and managing keyboard visibility.\n *\n * @category SecureFields\n */\nexport interface PEBankAccountViewMethods {\n  /**\n   * Submits the entered bank account information to PayEngine for tokenization.\n   *\n   * @param data - Optional merchant info and additional metadata.\n   * @returns A promise that resolves to a tokenized bank account object (`PEBankAccount`).\n   *\n   * @example\n   * ```ts\n   * const result = await bankAccountRef.current?.submit({\n   *   merchantId: \"merchant_456\",\n   *   additionalData: { accountType: \"checking\" }\n   * });\n   * ```\n   */\n  submit: (data: ITokenizationData) => Promise<PEBankAccount>;\n\n  /**\n   * Programmatically displays the keyboard for the bank account input fields.\n   */\n  showKeyboard: () => void;\n\n  /**\n   * Programmatically hides the keyboard for the bank account input fields.\n   */\n  hideKeyboard: () => void;\n}\n\n\n/**\n * A secure form widget for entering a customer's bank account information.\n *\n * [PEBankAccountView] provides a UI component for securely collecting bank account details.\n * It does not store data locally and instead tokenizes the information using PayEngine.\n *\n * ## Features:\n * - Securely collects bank account details.\n * - Supports additional customizable fields.\n * - Provides methods to show/hide the keyboard.\n * - Allows tokenizing the entered data for safe storage.\n *\n * ## Usage Example:\n *\n * ```tsx\n * const formRef = React.createRef<PEBankAccountViewMethods>();\n *\n * return (\n *   <View style={styles.container}>\n *     <Text>Welcome to PayEngine React Native SDK example</Text>\n *     <View style={{ width: '100%' }}>\n *       <PEBankAccountView ref={formRef} />\n *       <Button disabled={submitting} onPress={() => createBankAccount()} title=\"Create Bank Account\" />\n *     </View>\n *     <ScrollView style={{ flex: 1, width: '100%', backgroundColor: 'lightyellow', padding: 10, marginVertical: 20 }}>\n *       <Text>{JSON.stringify(secureFieldsResult, null, 4)}</Text>\n *     </ScrollView>\n *   </View>\n * );\n * ```\n *\n * ## How It Works:\n * 1. Create an instance of [PEBankAccountView], optionally passing additional fields.\n * 2. Display the form inside your widget tree.\n * 3. Use [showKeyboard] and [hideKeyboard] to manage input focus.\n * 4. Call [submit] to securely send the bank account data and receive a token.\n *\n * ## Methods:\n * - **`showKeyboard()`**: Manually shows the on-screen keyboard.\n * - **`hideKeyboard()`**: Hides the on-screen keyboard.\n * - **`submit()`**: Submits the entered data and retrieves a tokenized version of the bank account data.\n *\n * @category SecureFields\n */\nexport const PEBankAccountView = React.forwardRef<\n  PEBankAccountViewMethods,\n  PEBankAccountViewProps\n>((props, ref) => {\n  const formRef = React.useRef<any>();\n  const [height, setHeight] = React.useState(0);\n\n  React.useImperativeHandle(ref, () => ({\n    submit: async (data: ITokenizationData = {}) => {\n      return new Promise((resolve, reject) => {\n        if (height === 0) {\n          return reject(new Error('Form is not ready'))\n        }\n        \n        const listener = peEventEmitter.addListener('onBankAccountRespond', args => {\n          listener.remove()\n\n          const { error, bankAccount: json } = args;\n          if (error) {\n            reject(new Error(error))\n          } else {\n            const bankAccount = JSON.parse(json) as PEBankAccount;\n            resolve(bankAccount)\n          }\n        });\n\n        callNativeMethod(\"submit\", [data.merchantId, data.additionalData],)\n      });\n    },\n    showKeyboard: () => {\n      callNativeMethod(\"showKeyboard\")\n    },\n    hideKeyboard: () => {\n      callNativeMethod(\"hideKeyboard\")\n    }\n  }));\n\n  const callNativeMethod = React.useCallback((methodName: string, params: any[] = []) => {\n    const viewId = findNodeHandle(formRef.current);\n    let commandId = RNPEBankAccountViewManager.Commands[methodName].toString()\n    if (Platform.OS === 'ios') {\n      commandId = Number(commandId)\n    }\n    UIManager.dispatchViewManagerCommand(\n      viewId,\n      commandId,\n      params,\n    );\n  }, [formRef.current])\n\n\n  React.useEffect(() => {\n    const eventListener = peEventEmitter.addListener('onSizeChanges', args => {\n      const { width: _, height: frameHeight } = args;\n      setHeight(frameHeight);\n    });\n    return () => eventListener.remove();\n  }, []);\n\n  return (\n    <>\n      {height === 0 && <ActivityIndicator />}\n      <RNPEBankAccountView ref={formRef} additionalFields={JSON.stringify(props.additionalFields ?? [])} style={{ height: height }}  />\n    </>\n  );\n});\n"],"mappings":"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"}

package/lib/module/components/v2/SecureFields/CreditCardView.js

@@ -8,6 +8,88 @@ const RNPECreditCardView = requireNativeComponent(COMPONENT_NAME); // @ts-ignore
 
 const RNPECreditCardViewManager = UIManager[COMPONENT_NAME];
 const peEventEmitter = new NativeEventEmitter(RNPEEventEmitter);
+/**
+ * Props for the `PECreditCardView` component.
+ *
+ * Allows optional configuration of additional input fields that can be rendered
+ * alongside the standard credit card fields.
+ *
+ * These fields can be used to collect extra information such as ZIP code, billing address,
+ * or custom metadata required by the merchant.
+ *
+ * @category SecureFields
+ *
+ * @example
+ * ```ts
+ * const fields: IPEField[] = [
+ *   {
+ *     name: "zipCode",
+ *     type: "text",
+ *     placeholder: "ZIP Code",
+ *     keyboardType: PEKeyboardType.Numeric,
+ *     isRequired: true
+ *   }
+ * ];
+ *
+ * <PECreditCardView additionalFields={fields} />
+ * ```
+ */
+
+/**
+ * A secure form for entering a customer's credit card information safely.
+ *
+ * [PECreditCardView] provides an interface for users to input their credit card details securely.
+ * It integrates with PayEngine to tokenize the card details and forward them to a PCI-compliant
+ * third party without storing sensitive information locally.
+ *
+ * ## How It Works
+ *
+ * 1. Create an instance of [PECreditCardView], optionally passing additional fields.
+ * 2. Display the form inside your UI.
+ * 3. Once the user enters their details, call [submit] to securely process and retrieve a tokenized version of the card.
+ * 4. Use [showKeyboard] and [hideKeyboard] to manually control the keyboard.
+ *
+ * ## Example Usage
+ *
+ * ```tsx
+ * const formRef = React.createRef<PECreditCardViewMethods>();
+ * 
+ * 
+ * const additionalFields = [
+ *    {
+ *      name: 'address_zip',
+ *      type: 'text',
+ *      placeholder: 'Zip code',
+ *      keyboardType: PEKeyboardType.alphabet,
+ *      isRequired: true,
+ *      pattern: '^(?:\\d{5}(?:-\\d{4})?|[ABCEGHJKLMNPRSTVXY]\\d[A-Z] ?\\d[A-Z]\\d)$'
+ *    }
+ * ]
+ *
+ * return (
+ *   <View style={styles.container}>
+ *     <Text>Welcome to PayEngine React Native SDK example</Text>
+ *     <View style={{ width: '100%' }}>
+ *       <PECreditCardView ref={formRef} additionalFields={additionalFields} />
+ *       <Button disabled={submitting} onPress={() => createCard()} title="Create Card" />
+ *       <Button onPress={() => formRef.current?.showKeyboard()} title="Show keyboard" />
+ *       <Button onPress={() => formRef.current?.hideKeyboard()} title="Hide keyboard" />
+ *     </View>
+ *     <ScrollView style={{ flex: 1, width: '100%', backgroundColor: 'lightyellow', padding: 10, marginVertical: 20 }}>
+ *       <Text>{JSON.stringify(secureFieldsResult, null, 4)}</Text>
+ *     </ScrollView>
+ *   </View>
+ * );
+ * ```
+ *
+ * ## Features:
+ * - Securely collects credit card details.
+ * - Supports additional customizable fields.
+ * - Provides methods to show/hide the keyboard.
+ * - Allows submitting the entered data for tokenization and safe storage.
+ * 
+ * @category SecureFields
+ */
 export const PECreditCardView = /*#__PURE__*/React.forwardRef((props, ref) => {
   const formRef = React.useRef();
   const [height, setHeight] = React.useState(0);

package/lib/module/components/v2/SecureFields/CreditCardView.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","requireNativeComponent","NativeModules","NativeEventEmitter","Platform","findNodeHandle","UIManager","ActivityIndicator","RNPEEventEmitter","COMPONENT_NAME","RNPECreditCardView","RNPECreditCardViewManager","peEventEmitter","PECreditCardView","forwardRef","props","ref","formRef","useRef","height","setHeight","useState","useImperativeHandle","submit","data","Promise","resolve","reject","Error","listener","addListener","args","remove","error","card","json","JSON","parse","callNativeMethod","merchantId","additionalData","showKeyboard","hideKeyboard","useCallback","methodName","params","console","log","viewId","current","commandId","Commands","toString","OS","Number","dispatchViewManagerCommand","useEffect","eventListener","width","_","frameHeight","stringify","additionalFields"],"sources":["CreditCardView.tsx"],"sourcesContent":["\nimport * as React from 'react';\nimport { requireNativeComponent, NativeModules, NativeEventEmitter, ViewProps, Platform, findNodeHandle, UIManager, ActivityIndicator } from 'react-native';\nimport type IPEField from './IPEField';\nimport type PECard from './PECard';\nimport type ITokenizationData from './ITokenizationData';\n\nconst { RNPEEventEmitter } = NativeModules;\n\ninterface NativePECreditCardViewProps extends ViewProps {\n  additionalFields: string;\n}\n\nconst COMPONENT_NAME = 'RNPECreditCardView'\nconst RNPECreditCardView = requireNativeComponent<NativePECreditCardViewProps>(COMPONENT_NAME);\n// @ts-ignore\nconst RNPECreditCardViewManager = UIManager[COMPONENT_NAME]\nconst peEventEmitter = new NativeEventEmitter(RNPEEventEmitter);\n\nexport interface PECreditCardViewProps {\n  additionalFields?: IPEField[];\n}\n\nexport interface PECreditCardViewMethods {\n  submit: (data: ITokenizationData) => Promise<PECard>;\n  showKeyboard: () => void;\n  hideKeyboard: () => void;\n}\n\nexport const PECreditCardView = React.forwardRef<\n  PECreditCardViewMethods,\n  PECreditCardViewProps\n>((props, ref) => {\n  const formRef = React.useRef<any>();\n  const [height, setHeight] = React.useState(0);\n\n  React.useImperativeHandle(ref, () => ({\n    submit: async (data: ITokenizationData = {}) => {\n      return new Promise((resolve, reject) => {\n        if (height === 0) {\n          return reject(new Error('Form is not ready'))\n        }\n\n        const listener = peEventEmitter.addListener('onCardRespond', args => {\n          listener.remove()\n\n          const { error, card: json } = args;\n          if (error) {\n            reject(new Error(error))\n          } else {\n            const card = JSON.parse(json) as PECard;\n            resolve(card)\n          }\n        });\n\n        callNativeMethod(\"submit\", [data.merchantId, data.additionalData])\n      });\n    },\n    showKeyboard: () => {\n      callNativeMethod(\"showKeyboard\")\n    },\n    hideKeyboard: () => {\n      callNativeMethod(\"hideKeyboard\")\n    }\n  }));\n\n  const callNativeMethod = React.useCallback((methodName: string, params: any[] = []) => {\n    console.log(\"callNativeMethod\", methodName, params)\n    const viewId = findNodeHandle(formRef.current);\n    let commandId = RNPECreditCardViewManager.Commands[methodName].toString()\n    if (Platform.OS === 'ios') {\n      commandId = Number(commandId)\n    }\n    UIManager.dispatchViewManagerCommand(\n      viewId,\n      commandId,\n      params,\n    );\n  }, [formRef.current])\n\n  React.useEffect(() => {\n    const eventListener = peEventEmitter.addListener('onSizeChanges', args => {\n      const { width: _, height: frameHeight } = args;\n      setHeight(frameHeight);\n    });\n\n    return () => eventListener.remove();\n  }, []);\n\n\n  return (\n    <>\n      {height === 0 && <ActivityIndicator />}\n      <RNPECreditCardView ref={formRef} additionalFields={JSON.stringify(props.additionalFields ?? [])} style={{ height: height }} />\n    </>\n  );\n});\n"],"mappings":"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"}
+{"version":3,"names":["React","requireNativeComponent","NativeModules","NativeEventEmitter","Platform","findNodeHandle","UIManager","ActivityIndicator","RNPEEventEmitter","COMPONENT_NAME","RNPECreditCardView","RNPECreditCardViewManager","peEventEmitter","PECreditCardView","forwardRef","props","ref","formRef","useRef","height","setHeight","useState","useImperativeHandle","submit","data","Promise","resolve","reject","Error","listener","addListener","args","remove","error","card","json","JSON","parse","callNativeMethod","merchantId","additionalData","showKeyboard","hideKeyboard","useCallback","methodName","params","console","log","viewId","current","commandId","Commands","toString","OS","Number","dispatchViewManagerCommand","useEffect","eventListener","width","_","frameHeight","stringify","additionalFields"],"sources":["CreditCardView.tsx"],"sourcesContent":["\nimport * as React from 'react';\nimport { requireNativeComponent, NativeModules, NativeEventEmitter, type ViewProps, Platform, findNodeHandle, UIManager, ActivityIndicator } from 'react-native';\nimport type IPEField from './IPEField';\nimport type PECard from './PECard';\nimport type ITokenizationData from './ITokenizationData';\n\nconst { RNPEEventEmitter } = NativeModules;\n\ninterface NativePECreditCardViewProps extends ViewProps {\n  additionalFields: string;\n}\n\nconst COMPONENT_NAME = 'RNPECreditCardView'\nconst RNPECreditCardView = requireNativeComponent<NativePECreditCardViewProps>(COMPONENT_NAME);\n// @ts-ignore\nconst RNPECreditCardViewManager = UIManager[COMPONENT_NAME]\nconst peEventEmitter = new NativeEventEmitter(RNPEEventEmitter);\n\n/**\n * Props for the `PECreditCardView` component.\n *\n * Allows optional configuration of additional input fields that can be rendered\n * alongside the standard credit card fields.\n *\n * These fields can be used to collect extra information such as ZIP code, billing address,\n * or custom metadata required by the merchant.\n *\n * @category SecureFields\n *\n * @example\n * ```ts\n * const fields: IPEField[] = [\n *   {\n *     name: \"zipCode\",\n *     type: \"text\",\n *     placeholder: \"ZIP Code\",\n *     keyboardType: PEKeyboardType.Numeric,\n *     isRequired: true\n *   }\n * ];\n *\n * <PECreditCardView additionalFields={fields} />\n * ```\n */\nexport interface PECreditCardViewProps {\n  /**\n   * (Optional) A list of additional fields to be displayed in the credit card form.\n   *\n   * These are rendered below the standard card number, expiry, and CVV fields.\n   */\n  additionalFields?: IPEField[];\n}\n\n\n/**\n * Provides methods to control and interact with the PayEngine Credit Card input view.\n *\n * This interface defines methods for submitting credit card details for tokenization\n * and managing keyboard visibility.\n *\n * @category SecureFields\n */\nexport interface PECreditCardViewMethods {\n  /**\n   * Submits the entered credit card information to PayEngine for tokenization.\n   *\n   * @param data - Optional merchant info and additional metadata.\n   * @returns A promise that resolves to a tokenized credit card object (`PECard`).\n   *\n   * @example\n   * ```ts\n   * const result = await creditCardRef.current?.submit({\n   *   merchantId: \"merchant_123\",\n   *   additionalData: { source: \"checkout\" }\n   * });\n   * ```\n   */\n  submit: (data: ITokenizationData) => Promise<PECard>;\n\n  /**\n   * Programmatically displays the keyboard for the credit card input fields.\n   */\n  showKeyboard: () => void;\n\n  /**\n   * Programmatically hides the keyboard for the credit card input fields.\n   */\n  hideKeyboard: () => void;\n}\n\n/**\n * A secure form for entering a customer's credit card information safely.\n *\n * [PECreditCardView] provides an interface for users to input their credit card details securely.\n * It integrates with PayEngine to tokenize the card details and forward them to a PCI-compliant\n * third party without storing sensitive information locally.\n *\n * ## How It Works\n *\n * 1. Create an instance of [PECreditCardView], optionally passing additional fields.\n * 2. Display the form inside your UI.\n * 3. Once the user enters their details, call [submit] to securely process and retrieve a tokenized version of the card.\n * 4. Use [showKeyboard] and [hideKeyboard] to manually control the keyboard.\n *\n * ## Example Usage\n *\n * ```tsx\n * const formRef = React.createRef<PECreditCardViewMethods>();\n * \n * \n * const additionalFields = [\n *    {\n *      name: 'address_zip',\n *      type: 'text',\n *      placeholder: 'Zip code',\n *      keyboardType: PEKeyboardType.alphabet,\n *      isRequired: true,\n *      pattern: '^(?:\\\\d{5}(?:-\\\\d{4})?|[ABCEGHJKLMNPRSTVXY]\\\\d[A-Z] ?\\\\d[A-Z]\\\\d)$'\n *    }\n * ]\n *\n * return (\n *   <View style={styles.container}>\n *     <Text>Welcome to PayEngine React Native SDK example</Text>\n *     <View style={{ width: '100%' }}>\n *       <PECreditCardView ref={formRef} additionalFields={additionalFields} />\n *       <Button disabled={submitting} onPress={() => createCard()} title=\"Create Card\" />\n *       <Button onPress={() => formRef.current?.showKeyboard()} title=\"Show keyboard\" />\n *       <Button onPress={() => formRef.current?.hideKeyboard()} title=\"Hide keyboard\" />\n *     </View>\n *     <ScrollView style={{ flex: 1, width: '100%', backgroundColor: 'lightyellow', padding: 10, marginVertical: 20 }}>\n *       <Text>{JSON.stringify(secureFieldsResult, null, 4)}</Text>\n *     </ScrollView>\n *   </View>\n * );\n * ```\n *\n * ## Features:\n * - Securely collects credit card details.\n * - Supports additional customizable fields.\n * - Provides methods to show/hide the keyboard.\n * - Allows submitting the entered data for tokenization and safe storage.\n * \n * @category SecureFields\n */\nexport const PECreditCardView = React.forwardRef<\n  PECreditCardViewMethods,\n  PECreditCardViewProps\n>((props, ref) => {\n  const formRef = React.useRef<any>();\n  const [height, setHeight] = React.useState(0);\n\n  React.useImperativeHandle(ref, () => ({\n    submit: async (data: ITokenizationData = {}) => {\n      return new Promise((resolve, reject) => {\n        if (height === 0) {\n          return reject(new Error('Form is not ready'))\n        }\n\n        const listener = peEventEmitter.addListener('onCardRespond', args => {\n          listener.remove()\n\n          const { error, card: json } = args;\n          if (error) {\n            reject(new Error(error))\n          } else {\n            const card = JSON.parse(json) as PECard;\n            resolve(card)\n          }\n        });\n\n        callNativeMethod(\"submit\", [data.merchantId, data.additionalData])\n      });\n    },\n    showKeyboard: () => {\n      callNativeMethod(\"showKeyboard\")\n    },\n    hideKeyboard: () => {\n      callNativeMethod(\"hideKeyboard\")\n    }\n  }));\n\n  const callNativeMethod = React.useCallback((methodName: string, params: any[] = []) => {\n    console.log(\"callNativeMethod\", methodName, params)\n    const viewId = findNodeHandle(formRef.current);\n    let commandId = RNPECreditCardViewManager.Commands[methodName].toString()\n    if (Platform.OS === 'ios') {\n      commandId = Number(commandId)\n    }\n    UIManager.dispatchViewManagerCommand(\n      viewId,\n      commandId,\n      params,\n    );\n  }, [formRef.current])\n\n  React.useEffect(() => {\n    const eventListener = peEventEmitter.addListener('onSizeChanges', args => {\n      const { width: _, height: frameHeight } = args;\n      setHeight(frameHeight);\n    });\n\n    return () => eventListener.remove();\n  }, []);\n\n\n  return (\n    <>\n      {height === 0 && <ActivityIndicator />}\n      <RNPECreditCardView ref={formRef} additionalFields={JSON.stringify(props.additionalFields ?? [])} style={{ height: height }} />\n    </>\n  );\n});\n"],"mappings":"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"}

package/lib/module/components/v2/SecureFields/IPEField.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["IPEField.ts"],"sourcesContent":["import type PEKeyboardType from \"./PEKeyboardType\";\n\ninterface IPEField {\n  name: string;\n  type: string;\n  placeholder: string;\n  keyboardType: PEKeyboardType;\n  isRequired: boolean;\n  pattern?: string;\n}\n\nexport default IPEField;\n"],"mappings":""}
+{"version":3,"names":[],"sources":["IPEField.ts"],"sourcesContent":["import type PEKeyboardType from \"./PEKeyboardType\";\n\n/**\n * Represents an input field in the PayEngine system.\n *\n * The `IPEField` interface defines a form field with properties such as\n * its name, type, placeholder, keyboard type, whether it is required, and\n * an optional validation pattern.\n *\n * @category SecureFields\n *\n * @example\n * ```ts\n * const emailField: IPEField = {\n *   name: \"email\",\n *   type: \"text\",\n *   placeholder: \"Enter your email\",\n *   keyboardType: PEKeyboardType.Alphabet,\n *   isRequired: true,\n *   pattern: \"^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\\\.[a-zA-Z]{2,}$\"\n * };\n * ```\n */\ninterface IPEField {\n  /**\n   * The unique identifier for the field.\n   *\n   * Typically used as the key when submitting form data.\n   */\n  name: string;\n\n  /**\n   * The type of the field (e.g., \"text\", \"password\", \"email\").\n   *\n   * Defines how the field’s value should be interpreted.\n   */\n  type: string;\n\n  /**\n   * The placeholder text shown when the field is empty.\n   */\n  placeholder: string;\n\n  /**\n   * Specifies the type of keyboard to display for this field.\n   *\n   * Example: `PEKeyboardType.Numeric`, `PEKeyboardType.Alphabet`\n   */\n  keyboardType: PEKeyboardType;\n\n  /**\n   * Indicates whether the field is required for form submission.\n   *\n   * If `true`, the field must be filled in with a valid value.\n   */\n  isRequired: boolean;\n\n  /**\n   * Optional regular expression used to validate the field's value.\n   *\n   * If omitted, no validation is enforced.\n   */\n  pattern?: string;\n}\n\n\nexport default IPEField;\n"],"mappings":""}

package/lib/module/components/v2/SecureFields/ITokenizationData.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["ITokenizationData.ts"],"sourcesContent":["interface ITokenizationData {\n  merchantId?: string;\n  additionalData?: { \n    [key: string]: string \n  };\n}\n\nexport default ITokenizationData;\n"],"mappings":""}
+{"version":3,"names":[],"sources":["ITokenizationData.ts"],"sourcesContent":["/**\n * Represents the data used for tokenizing a credit card or bank account.\n *\n * This interface allows passing additional metadata or specifying the merchant\n * for whom the data is being tokenized.\n *\n * @category SecureFields\n */\ninterface ITokenizationData {\n  /**\n   * (Optional) The merchant ID on behalf of whom the tokenization is performed.\n   */\n  merchantId?: string;\n\n  /**\n   * (Optional) A key-value map of additional metadata to include in the request.\n   */\n  additionalData?: {\n    [key: string]: string;\n  };\n}\n\nexport default ITokenizationData;\n"],"mappings":""}

package/lib/module/components/v2/SecureFields/PEBankAccount.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["PEBankAccount.ts"],"sourcesContent":["interface PEBankAccount {\n  id: string;\n  token: string;\n  account_data: {\n    first_name: string;\n    last_name: string;\n    routing_number: string;\n    last_4: string;\n  };\n}\n\nexport default PEBankAccount;"],"mappings":""}
+{"version":3,"names":[],"sources":["PEBankAccount.ts"],"sourcesContent":["/**\n * Represents a bank account stored within PayEngine.\n *\n * This interface contains a secure token and account details, ensuring sensitive banking\n * information is securely managed within the system.\n *\n * @category SecureFields\n */\ninterface PEBankAccount {\n  /**\n   * A unique identifier for the bank account.\n   *\n   * This may be used internally to reference the bank account object.\n   */\n  id: string;\n\n  /**\n   * A secure token representing the bank account.\n   *\n   * This token is used for referencing the account in API operations without exposing raw bank details.\n   */\n  token: string;\n\n  /**\n   * The associated bank account details.\n   *\n   * Includes essential information such as the account holder's name,\n   * the routing number, and the last four digits of the account number.\n   */\n  account_data: {\n    /**\n     * The first name of the account holder.\n     */\n    first_name: string;\n\n    /**\n     * The last name of the account holder.\n     */\n    last_name: string;\n\n    /**\n     * The bank's routing number.\n     */\n    routing_number: string;\n\n    /**\n     * The last four digits of the bank account number.\n     */\n    last_4: string;\n  };\n}\n\n\nexport default PEBankAccount;"],"mappings":""}

package/lib/module/components/v2/SecureFields/PECard.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["PECard.ts"],"sourcesContent":["interface PECard {\n  token: string;\n  card_data: {\n    id: string;\n    brand: string;\n    last_4: string;\n    exp_year: string;\n    exp_month: string;\n    name: string;\n    address_zip?: string;\n  };\n}\n\nexport default PECard;"],"mappings":""}
+{"version":3,"names":[],"sources":["PECard.ts"],"sourcesContent":["/**\n * Represents a payment card stored with PayEngine.\n *\n * This interface contains a secure token and associated card details,\n * ensuring sensitive payment information is securely managed within the system.\n *\n * @category SecureFields\n */\ninterface PECard {\n  /**\n   * A secure token representing the card.\n   *\n   * This token is used to safely reference the card in API operations without exposing raw card data.\n   */\n  token: string;\n\n  /**\n   * The associated card details.\n   *\n   * Includes essential information such as brand, expiration date,\n   * the last four digits, cardholder name, and optional billing ZIP code.\n   */\n  card_data: {\n    /**\n     * A unique identifier for the card.\n     *\n     * This ID is typically used to reference the card object in system operations.\n     */\n    id: string;\n\n    /**\n     * The brand of the card (e.g., Visa, MasterCard).\n     */\n    brand: string;\n\n    /**\n     * The last four digits of the card number.\n     *\n     * Useful for displaying or confirming the card to the user.\n     */\n    last_4: string;\n\n    /**\n     * The expiration year of the card.\n     */\n    exp_year: string;\n\n    /**\n     * The expiration month of the card.\n     */\n    exp_month: string;\n\n    /**\n     * The name of the cardholder.\n     */\n    name: string;\n\n    /**\n     * The ZIP code associated with the card's billing address (optional).\n     */\n    address_zip?: string;\n  };\n}\n\n\nexport default PECard;"],"mappings":""}

package/lib/module/components/v2/SecureFields/PEKeyboardType.js

@@ -1,4 +1,19 @@
-var PEKeyboardType;
+/**
+ * Defines the keyboard type for a PayEngine secure input field.
+ *
+ * @remarks
+ * This enum is used in {@link IPEField.keyboardType} to control the keyboard layout
+ * shown to the user based on the input field's context.
+ *
+ * The available keyboard types are:
+ * - {@link PEKeyboardType.alphabet} — Optimized for alphabetic characters.
+ * - {@link PEKeyboardType.number} — Optimized for numeric input.
+ * - {@link PEKeyboardType.phone} — Designed for entering phone numbers.
+ * - {@link PEKeyboardType.normal} — Standard keyboard with alphanumeric characters.
+ *
+ * @category SecureFields
+ */
+export let PEKeyboardType;
 
 (function (PEKeyboardType) {
   PEKeyboardType["alphabet"] = "alphabet";

package/lib/module/components/v2/SecureFields/PEKeyboardType.js.map

@@ -1 +1 @@
-{"version":3,"names":["PEKeyboardType"],"sources":["PEKeyboardType.ts"],"sourcesContent":["enum PEKeyboardType {\n  alphabet = 'alphabet',\n  number = 'number',\n  phone = 'phone',\n  normal = 'normal',\n}\n\nexport default PEKeyboardType;\n"],"mappings":"IAAKA,c;;WAAAA,c;EAAAA,c;EAAAA,c;EAAAA,c;EAAAA,c;GAAAA,c,KAAAA,c;;AAOL,eAAeA,cAAf"}
+{"version":3,"names":["PEKeyboardType"],"sources":["PEKeyboardType.ts"],"sourcesContent":["import type IPEField from './IPEField';\n\n/**\n * Defines the keyboard type for a PayEngine secure input field.\n *\n * @remarks\n * This enum is used in {@link IPEField.keyboardType} to control the keyboard layout\n * shown to the user based on the input field's context.\n *\n * The available keyboard types are:\n * - {@link PEKeyboardType.alphabet} — Optimized for alphabetic characters.\n * - {@link PEKeyboardType.number} — Optimized for numeric input.\n * - {@link PEKeyboardType.phone} — Designed for entering phone numbers.\n * - {@link PEKeyboardType.normal} — Standard keyboard with alphanumeric characters.\n *\n * @category SecureFields\n */\nexport enum PEKeyboardType {\n  alphabet = 'alphabet',\n  number = 'number',\n  phone = 'phone',\n  normal = 'normal',\n}\n\nexport default PEKeyboardType;\n"],"mappings":"AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAYA,cAAZ;;WAAYA,c;EAAAA,c;EAAAA,c;EAAAA,c;EAAAA,c;GAAAA,c,KAAAA,c;;AAOZ,eAAeA,cAAf"}