@airxpay/sdk-ui 1.0.7 → 1.0.8

package/dist/components/ui/MerchantOnboard/CustomSegmentedButtons.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { ViewStyle } from 'react-native';
+interface ButtonType {
+    value: string;
+    label: string;
+    showSelectedCheck?: boolean;
+}
+interface CustomSegmentedButtonsProps {
+    value: string;
+    onValueChange: (value: string) => void;
+    buttons: ButtonType[];
+    style?: ViewStyle;
+}
+declare const CustomSegmentedButtons: React.FC<CustomSegmentedButtonsProps>;
+export default CustomSegmentedButtons;

package/dist/components/ui/MerchantOnboard/CustomSegmentedButtons.js

@@ -0,0 +1,64 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("react-native");
+const styles = react_native_1.StyleSheet.create({
+    segmentedContainer: {
+        flexDirection: 'row',
+        backgroundColor: '#f0f0f0',
+        borderRadius: 8,
+        padding: 4,
+    },
+    segmentedButton: {
+        flex: 1,
+        flexDirection: 'row',
+        justifyContent: 'center',
+        alignItems: 'center',
+        paddingVertical: 8,
+        paddingHorizontal: 12,
+        borderRadius: 6,
+        backgroundColor: 'transparent',
+    },
+    segmentedButtonActive: {
+        backgroundColor: '#6200ee',
+        elevation: 2,
+        shadowColor: '#000',
+        shadowOffset: { width: 0, height: 1 },
+        shadowOpacity: 0.2,
+        shadowRadius: 1,
+    },
+    segmentedButtonText: {
+        fontSize: 14,
+        fontWeight: '500',
+        color: '#666',
+    },
+    segmentedButtonTextActive: {
+        color: 'white',
+    },
+    segmentedButtonCheck: {
+        color: 'white',
+        marginLeft: 4,
+        fontSize: 14,
+        fontWeight: 'bold',
+    },
+});
+const CustomSegmentedButtons = ({ value, onValueChange, buttons, style, }) => {
+    return (<react_native_1.View style={[styles.segmentedContainer, style]}>
+      {buttons.map((button) => (<react_native_1.TouchableOpacity key={button.value} style={[
+                styles.segmentedButton,
+                value === button.value && styles.segmentedButtonActive
+            ]} onPress={() => onValueChange(button.value)}>
+          <react_native_1.Text style={[
+                styles.segmentedButtonText,
+                value === button.value && styles.segmentedButtonTextActive
+            ]}>
+            {button.label}
+          </react_native_1.Text>
+          {button.showSelectedCheck && value === button.value && (<react_native_1.Text style={styles.segmentedButtonCheck}>✓</react_native_1.Text>)}
+        </react_native_1.TouchableOpacity>))}
+    </react_native_1.View>);
+};
+exports.default = CustomSegmentedButtons;

package/dist/contexts/AirXPayProvider.d.ts

@@ -1,14 +1,9 @@
-/**
- * Frontend SDK - AirXPay Provider
- * Context provider for merchant state management
- */
 import React from 'react';
 import { AirXPayConfig, MerchantCreateResponse } from '../types/merchantTypes';
 interface AirXPayContextType extends AirXPayConfig {
     isValid: boolean;
     loading: boolean;
     merchantData?: MerchantCreateResponse;
-    error?: string;
     hasToken: boolean;
     merchantId?: string;
     setHasToken: (value: boolean) => void;
@@ -22,4 +17,5 @@ interface Props {
 export declare const AirXPayProvider: React.FC<Props>;
 export declare const useAirXPay: () => AirXPayContextType;
 export declare const useAirXPaySafe: () => AirXPayContextType | null;
+export declare const useProviderReady: () => boolean;
 export {};

package/dist/contexts/AirXPayProvider.js

@@ -1,8 +1,4 @@
 "use strict";
-/**
- * Frontend SDK - AirXPay Provider
- * Context provider for merchant state management
- */
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -46,13 +42,13 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useAirXPaySafe = exports.useAirXPay = exports.AirXPayProvider = void 0;
+exports.useProviderReady = exports.useAirXPaySafe = exports.useAirXPay = exports.AirXPayProvider = void 0;
 const react_1 = __importStar(require("react"));
 const tokenStorage_1 = require("../utils/tokenStorage");
 const merchant_1 = require("../api/merchant");
 const jwt_1 = require("../utils/jwt");
 const AirXPayContext = (0, react_1.createContext)(null);
-const AirXPayProvider = ({ config, children, enableLogging = __DEV__, }) => {
+const AirXPayProvider = ({ config, children, enableLogging = __DEV__ }) => {
     const [state, setState] = (0, react_1.useState)(Object.assign(Object.assign({}, config), { isValid: false, loading: true, hasToken: false, setHasToken: () => { }, logout: () => __awaiter(void 0, void 0, void 0, function* () { }) }));
     const [hasToken, setHasToken] = (0, react_1.useState)(false);
     const [merchantId, setMerchantId] = (0, react_1.useState)();
@@ -60,58 +56,44 @@ const AirXPayProvider = ({ config, children, enableLogging = __DEV__, }) => {
         yield (0, tokenStorage_1.clearStoredToken)();
         setHasToken(false);
         setMerchantId(undefined);
-        if (enableLogging) {
+        if (enableLogging)
             console.log('[AirXPay] User logged out');
-        }
     }), [enableLogging]);
     (0, react_1.useEffect)(() => {
         const initialize = () => __awaiter(void 0, void 0, void 0, function* () {
             var _a;
             if (!((_a = config.publicKey) === null || _a === void 0 ? void 0 : _a.trim())) {
-                setState(prev => (Object.assign(Object.assign({}, prev), { isValid: false, loading: false, error: 'publicKey is required' })));
+                setState(prev => (Object.assign(Object.assign({}, prev), { isValid: false, loading: false })));
                 return;
             }
             try {
-                // Initialize API client
                 (0, merchant_1.initializeApi)(config.publicKey);
-                // Check for stored token
                 const token = yield (0, tokenStorage_1.getStoredToken)();
-                const hasValidToken = !!token;
-                let extractedId;
-                if (hasValidToken) {
-                    extractedId = (0, jwt_1.getMerchantIdFromToken)(token) || undefined;
-                    setMerchantId(extractedId);
-                }
-                setHasToken(hasValidToken);
-                // Verify public key
+                const validToken = !!token;
+                const id = validToken ? (0, jwt_1.getMerchantIdFromToken)(token) || undefined : undefined;
+                setHasToken(validToken);
+                setMerchantId(id);
                 const verification = yield (0, merchant_1.verifyPublicKey)(config.publicKey);
-                setState(Object.assign(Object.assign({}, config), { isValid: true, loading: false, merchantData: verification.merchantData, hasToken: hasValidToken, merchantId,
-                    setHasToken,
+                setState(Object.assign(Object.assign({}, config), { isValid: true, loading: false, merchantData: verification.merchantData, hasToken: validToken, merchantId: id, setHasToken,
                     logout }));
-                if (enableLogging) {
-                    console.log('[AirXPay] Initialized', { hasToken: hasValidToken });
-                }
+                if (enableLogging)
+                    console.log('[AirXPay] Initialized', { hasToken: validToken });
             }
             catch (err) {
-                setState(Object.assign(Object.assign({}, config), { isValid: false, loading: false, error: err.message, hasToken: false, setHasToken,
-                    logout }));
-                if (enableLogging) {
-                    console.error('[AirXPay] Initialization failed', err);
-                }
+                setState(Object.assign(Object.assign({}, config), { isValid: false, loading: false, hasToken: false, setHasToken, logout }));
+                if (enableLogging)
+                    console.error('[AirXPay] Init failed', err);
             }
         });
         initialize();
     }, [config, enableLogging, logout]);
-    return (<AirXPayContext.Provider value={Object.assign(Object.assign({}, state), { hasToken, merchantId, setHasToken, logout })}>
-      {children}
-    </AirXPayContext.Provider>);
+    return <AirXPayContext.Provider value={Object.assign(Object.assign({}, state), { hasToken, merchantId, setHasToken, logout })}>{children}</AirXPayContext.Provider>;
 };
 exports.AirXPayProvider = AirXPayProvider;
 const useAirXPay = () => {
     const context = (0, react_1.useContext)(AirXPayContext);
-    if (!context) {
+    if (!context)
         throw new Error('useAirXPay must be used inside <AirXPayProvider>');
-    }
     return context;
 };
 exports.useAirXPay = useAirXPay;
@@ -124,3 +106,8 @@ const useAirXPaySafe = () => {
     }
 };
 exports.useAirXPaySafe = useAirXPaySafe;
+const useProviderReady = () => {
+    const airXPay = (0, exports.useAirXPaySafe)();
+    return !!airXPay && airXPay.isValid && !airXPay.loading;
+};
+exports.useProviderReady = useProviderReady;

package/dist/hooks/MerchantOnboarding.d.ts

@@ -1,12 +1,7 @@
+import React from 'react';
+import { MerchantOnboardingProps } from '../types/merchantTypes';
 /**
- * Frontend SDK - Merchant Onboarding Screen
- * Fixed: Removed "pending" from MerchantStatus, aligned with backend
+ * Hook to render the Merchant Onboarding Sheet safely
+ * Returns null if AirXPayProvider is not ready
  */
-import React from 'react';
-import { Merchant } from '../types/merchantTypes';
-interface MerchantOnboardingScreenProps {
-    initialStep?: number;
-    onComplete?: (merchantData: Merchant) => void;
-}
-declare const MerchantOnboardingScreen: React.FC<MerchantOnboardingScreenProps>;
-export default MerchantOnboardingScreen;
+export declare const useAirXPaySheet: (props: Partial<MerchantOnboardingProps>) => React.JSX.Element | null;

package/dist/hooks/MerchantOnboarding.js

@@ -1,125 +1,25 @@
 "use strict";
-/**
- * Frontend SDK - Merchant Onboarding Screen
- * Fixed: Removed "pending" from MerchantStatus, aligned with backend
- */
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const react_native_paper_1 = require("react-native-paper");
+exports.useAirXPaySheet = void 0;
+const react_1 = __importDefault(require("react"));
 const MerchantOnboarding_1 = __importDefault(require("../components/ui/MerchantOnboard/MerchantOnboarding"));
 const AirXPayProvider_1 = require("../contexts/AirXPayProvider");
-const merchant_1 = require("../api/merchant");
-const MerchantOnboardingScreen = ({ initialStep = 1, onComplete, }) => {
-    const { publicKey, hasToken, setHasToken } = (0, AirXPayProvider_1.useAirXPay)();
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const [merchantData, setMerchantData] = (0, react_1.useState)({
-        mode: 'test',
-        kycStatus: 'not_submitted',
-        isKycCompleted: false,
-        isBankDetailsCompleted: false,
-        // FIXED: Removed "pending" from status - only active/suspended/blocked allowed
-        status: 'active', // Default to active, will be updated by backend
-    });
-    (0, react_1.useEffect)(() => {
-        if (hasToken) {
-            console.log('[AirXPay] Token exists, showing completed state');
-        }
-    }, [hasToken]);
-    const handleNext = (stepData, step) => __awaiter(void 0, void 0, void 0, function* () {
-        setMerchantData(prev => (Object.assign(Object.assign({}, prev), stepData)));
-        if (step === 3 && stepData.isBankDetailsCompleted) {
-            setLoading(true);
-            try {
-                const response = yield (0, merchant_1.createMerchant)(Object.assign(Object.assign({}, merchantData), stepData));
-                if (response.token) {
-                    setHasToken(true);
-                }
-                if (onComplete) {
-                    onComplete(Object.assign(Object.assign(Object.assign({}, merchantData), stepData), { merchantId: response.merchant.merchantId, airxpayMerchantId: response.merchant.airxpayMerchantId, walletId: response.merchant.walletId, status: response.merchant.status, kycStatus: response.merchant.kycStatus, isKycCompleted: response.merchant.isKycCompleted, isBankDetailsCompleted: response.merchant.isBankDetailsCompleted, mode: response.merchant.mode }));
-                }
-            }
-            catch (error) {
-                console.error('[AirXPay] Failed to create merchant:', error);
-            }
-            finally {
-                setLoading(false);
-            }
-        }
-    });
-    const handleBack = (currentStep) => {
-        console.log('[AirXPay] Navigated back to step:', currentStep);
-    };
-    const handleComplete = (merchantData) => {
-        console.log('[AirXPay] Onboarding complete:', merchantData);
-        if (onComplete) {
-            onComplete(merchantData);
-        }
-    };
-    if (loading) {
-        return (<react_native_1.View style={styles.loadingContainer}>
-        <react_native_paper_1.ActivityIndicator size="large" color="#0066CC"/>
-        <react_native_paper_1.Text style={styles.loadingText}>Creating your merchant account...</react_native_paper_1.Text>
-      </react_native_1.View>);
-    }
-    return (<MerchantOnboarding_1.default mode={merchantData.mode} initialStep={initialStep} isKycCompleted={merchantData.isKycCompleted || false} isBankDetailsCompleted={merchantData.isBankDetailsCompleted || false} kycStatus={merchantData.kycStatus || 'not_submitted'} status={merchantData.status || 'active'} initialData={merchantData} onNext={handleNext} onBack={handleBack} onComplete={handleComplete} loading={loading}/>);
+/**
+ * Hook to render the Merchant Onboarding Sheet safely
+ * Returns null if AirXPayProvider is not ready
+ */
+const useAirXPaySheet = (props) => {
+    const airXPay = (0, AirXPayProvider_1.useAirXPaySafe)();
+    if (!(airXPay === null || airXPay === void 0 ? void 0 : airXPay.merchantData))
+        return null;
+    const merchantData = airXPay.merchantData;
+    // Default empty functions to satisfy required props
+    const defaultOnNext = (stepData, step) => { };
+    const defaultOnBack = (currentStep) => { };
+    const defaultOnComplete = (finalData) => { };
+    return (<MerchantOnboarding_1.default merchantId={merchantData.merchant.merchantId} mode={merchantData.merchant.mode} isKycCompleted={merchantData.merchant.isKycCompleted} isBankDetailsCompleted={merchantData.merchant.isBankDetailsCompleted} kycStatus={merchantData.merchant.kycStatus} status={merchantData.merchant.status} onNext={props.onNext || defaultOnNext} onBack={props.onBack || defaultOnBack} onComplete={props.onComplete || defaultOnComplete} initialStep={props.initialStep} loading={props.loading}/>);
 };
-const styles = react_native_1.StyleSheet.create({
-    loadingContainer: {
-        flex: 1,
-        justifyContent: 'center',
-        alignItems: 'center',
-        backgroundColor: '#FFFFFF',
-    },
-    loadingText: {
-        marginTop: 16,
-        fontSize: 16,
-        color: '#666666',
-    },
-});
-exports.default = MerchantOnboardingScreen;
+exports.useAirXPaySheet = useAirXPaySheet;

package/dist/hooks/useAirXPayReady.d.ts

@@ -0,0 +1,6 @@
+import { AirXPayConfig } from "../types/type";
+export declare class AirXPayReady {
+    private publicKey;
+    constructor(config: AirXPayConfig);
+    initialize(): Promise<import("../api/merchant").MerchantInitResponse>;
+}

package/dist/hooks/useAirXPayReady.js

@@ -0,0 +1,27 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AirXPayReady = void 0;
+const merchant_1 = require("../api/merchant");
+class AirXPayReady {
+    constructor(config) {
+        if (!config.publicKey) {
+            throw new Error("Public key is required");
+        }
+        this.publicKey = config.publicKey;
+    }
+    initialize() {
+        return __awaiter(this, void 0, void 0, function* () {
+            return yield (0, merchant_1.verifyPublicKey)(this.publicKey);
+        });
+    }
+}
+exports.AirXPayReady = AirXPayReady;

package/dist/index.d.ts

@@ -3,7 +3,7 @@
  * Clean exports with proper separation
  */
 export { AirXPayProvider } from './contexts/AirXPayProvider';
-export { useAirXPay, useAirXPaySafe, } from './contexts/AirXPayProvider';
+export { useAirXPay, useAirXPaySafe, useProviderReady } from './contexts/AirXPayProvider';
 export { default as MerchantOnboarding } from './components/ui/MerchantOnboard/MerchantOnboarding';
 export { default as OnboardingComplete } from './components/steps/OnboardingComplete';
 export { initializeApi, createMerchant, getMerchantStatus } from './api/merchant';

package/dist/index.js

@@ -7,13 +7,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.isTokenExpired = exports.getMerchantIdFromToken = exports.decodeJWT = exports.tokenStorage = exports.getMerchantStatus = exports.createMerchant = exports.initializeApi = exports.OnboardingComplete = exports.MerchantOnboarding = exports.useAirXPaySafe = exports.useAirXPay = exports.AirXPayProvider = void 0;
+exports.isTokenExpired = exports.getMerchantIdFromToken = exports.decodeJWT = exports.tokenStorage = exports.getMerchantStatus = exports.createMerchant = exports.initializeApi = exports.OnboardingComplete = exports.MerchantOnboarding = exports.useProviderReady = exports.useAirXPaySafe = exports.useAirXPay = exports.AirXPayProvider = void 0;
 // Context
 var AirXPayProvider_1 = require("./contexts/AirXPayProvider");
 Object.defineProperty(exports, "AirXPayProvider", { enumerable: true, get: function () { return AirXPayProvider_1.AirXPayProvider; } });
 var AirXPayProvider_2 = require("./contexts/AirXPayProvider");
 Object.defineProperty(exports, "useAirXPay", { enumerable: true, get: function () { return AirXPayProvider_2.useAirXPay; } });
 Object.defineProperty(exports, "useAirXPaySafe", { enumerable: true, get: function () { return AirXPayProvider_2.useAirXPaySafe; } });
+Object.defineProperty(exports, "useProviderReady", { enumerable: true, get: function () { return AirXPayProvider_2.useProviderReady; } });
 // Screens
 var MerchantOnboarding_1 = require("./components/ui/MerchantOnboard/MerchantOnboarding");
 Object.defineProperty(exports, "MerchantOnboarding", { enumerable: true, get: function () { return __importDefault(MerchantOnboarding_1).default; } });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@airxpay/sdk-ui",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "AirXPay Initialization UI Components for React & React Native",
   "author": "Tafseel Khan",
   "license": "MIT",