React Native SDK

npm install @yuno-payments/yuno-sdk-react-native

cd ios && pod install

import { YunoSdk } from '@yuno-payments/yuno-sdk-react-native';
import { useEffect } from 'react';

export default function App() {
  useEffect(() => {
    YunoSdk.initialize({
      apiKey: 'your-public-api-key',
      countryCode: 'US', // Default country
    });
  }, []);
  
  return <YourApp />;
}

import { YunoSdk, YunoPaymentMethods } from '@yuno-payments/yuno-sdk-react-native';

export default function PaymentScreen() {
  const [checkoutSession, setCheckoutSession] = useState<string | null>(null);
  const [isReady, setIsReady] = useState(false);
  
  useEffect(() => {
    // 1. Subscribe to payment events
    const subscription = YunoSdk.onPaymentStatus((state) => {
      if (state.status === 'SUCCEEDED') {
        // Handle success
      }
    });
    
    // 2. Fetch checkout session from your backend
    createCheckoutSession().then(session => {
      setCheckoutSession(session);
      setIsReady(true);
    });
    
    return () => subscription.remove();
  }, []);
  
  const handlePayment = async () => {
    // 3. Start payment flow
    await YunoSdk.startPayment(true); // true = show payment status screen
  };
  
  return (
    <View>
      {checkoutSession && (
        <YunoPaymentMethods
          checkoutSession={checkoutSession}
          countryCode="US"
        />
      )}
      <Button title="Pay Now" onPress={handlePayment} disabled={!isReady} />
    </View>
  );
}