@school24/paymentjs-rn 1.1.0 → 1.3.0

package/dist/PaymentJS.d.ts

@@ -1,4 +1,30 @@
 import React from "react";
 import type { PaymentJSProps } from "./types";
-declare const PaymentJS: React.FC<PaymentJSProps>;
+interface EnhancedPaymentJSProps extends PaymentJSProps {
+    /**
+     * Environment: 'test' or 'live'
+     */
+    environment?: "test" | "live";
+    /**
+     * Shopper reference (required for stored cards)
+     */
+    shopperReference?: string;
+    /**
+     * Amount in minor units (e.g. 100 = 1.00 AUD)
+     */
+    amount?: number;
+    /**
+     * Currency (default: AUD)
+     */
+    currency?: string;
+    /**
+     * Whether to store the card on first payment
+     */
+    storePaymentMethod?: boolean;
+    /**
+     * Optional base URL for the payment page (defaults to your hosted HTML)
+     */
+    baseUrl?: string;
+}
+declare const PaymentJS: React.FC<EnhancedPaymentJSProps>;
 export default PaymentJS;

package/dist/PaymentJS.js

@@ -37,11 +37,23 @@ const react_1 = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const react_native_webview_1 = require("react-native-webview");
 const PaymentJS = (props) => {
-    const { uri, onSuccess, onFailure, style } = props;
+    const { uri: customUri, onSuccess, onFailure, style, environment = "test", shopperReference = "USER123", amount = 100, currency = "AUD", storePaymentMethod = true, baseUrl = "https://your-domain.com/payment.html", } = props;
+    // Auto-build URI with query params if customUri not provided
+    const finalUri = (0, react_1.useMemo)(() => {
+        if (customUri)
+            return customUri;
+        const params = new URLSearchParams({
+            env: environment,
+            shopperReference,
+            amount: amount.toString(),
+            currency,
+            storePaymentMethod: storePaymentMethod.toString(),
+        });
+        return `${baseUrl}?${params.toString()}`;
+    }, [customUri, environment, shopperReference, amount, currency, storePaymentMethod, baseUrl]);
     const handleMessage = (0, react_1.useCallback)((event) => {
         var _a, _b;
         try {
-            // Type guard for WebView events
             const data = (_b = (_a = event === null || event === void 0 ? void 0 : event.nativeEvent) === null || _a === void 0 ? void 0 : _a.data) !== null && _b !== void 0 ? _b : event === null || event === void 0 ? void 0 : event.data;
             if (!data)
                 return;
@@ -56,16 +68,20 @@ const PaymentJS = (props) => {
                 case "CONFIG_ERROR":
                     onFailure === null || onFailure === void 0 ? void 0 : onFailure(message.payload);
                     break;
+                default:
+                    console.warn("Unknown PaymentJS event:", message.event);
             }
         }
         catch (err) {
+            console.error("Failed to parse WebView message:", err);
             onFailure === null || onFailure === void 0 ? void 0 : onFailure({
                 message: "Invalid message from payment WebView",
-                error: err
+                error: err,
             });
         }
     }, [onSuccess, onFailure]);
     return (react_1.default.createElement(react_native_1.View, { style: [{ flex: 1, backgroundColor: "#fff" }, style] },
-        react_1.default.createElement(react_native_webview_1.WebView, { source: { uri }, javaScriptEnabled: true, domStorageEnabled: true, originWhitelist: ["*"], startInLoadingState: true, onMessage: handleMessage, allowsBackForwardNavigationGestures: true, setSupportMultipleWindows: false })));
+        react_1.default.createElement(react_native_webview_1.WebView, { source: { uri: finalUri }, javaScriptEnabled: true, domStorageEnabled: true, originWhitelist: ["*"], startInLoadingState: true, renderLoading: () => (react_1.default.createElement(react_native_1.View, { style: { flex: 1, justifyContent: "center", alignItems: "center" } },
+                react_1.default.createElement(react_native_1.ActivityIndicator, { size: "large", color: "#2563eb" }))), onMessage: handleMessage, allowsBackForwardNavigationGestures: true, setSupportMultipleWindows: false })));
 };
 exports.default = PaymentJS;

package/dist/types.d.ts

@@ -7,9 +7,9 @@ export interface PaymentJSMessage {
 }
 export interface PaymentJSProps {
     /**
-     * Full URL to react-test.html with query params
+     * Full URL to the payment HTML page (optional if using auto-built URI)
      */
-    uri: string;
+    uri?: string;
     /**
      * Called when payment completes successfully
      */
@@ -22,4 +22,10 @@ export interface PaymentJSProps {
      * Optional container styling
      */
     style?: StyleProp<ViewStyle>;
+    environment?: "test" | "live";
+    shopperReference?: string;
+    amount?: number;
+    currency?: string;
+    storePaymentMethod?: boolean;
+    baseUrl?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@school24/paymentjs-rn",
-  "version": "1.1.0",
+  "version": "1.3.0",
   "description": "React Native WebView wrapper for PaymentJS (Adyen)",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",