@cosmoola/cosmoola-native

React Native SDK for Cosmoola — payments + currency converter. Works with Expo and bare React Native (iOS + Android).

Install

npm install @cosmoola/cosmoola-native @react-native-async-storage/async-storage

If bare RN (not Expo):

cd ios && pod install

Currency Converter

1. Wrap your app ONCE in App.js

import { CurrencyProvider } from "@cosmoola/cosmoola-native";

export default function App() {
  return (
    <CurrencyProvider apiKey="pk_live_xxx">
      <NavigationContainer>
        <RootNavigator />
      </NavigationContainer>
    </CurrencyProvider>
  );
}

2. Use anywhere in any screen

import { useCurrency, CsmPrice } from "@cosmoola/cosmoola-native";
import { Text, View } from "react-native";

// Hook
function ProductScreen() {
  const { convert, currency, setCurrency } = useCurrency();
  return (
    <View>
      <Text>{convert(99.99)}</Text>         // → "£79.23"
      <Text>{convert(99.99, "USD")}</Text>  // explicit base
    </View>
  );
}

// Drop-in component
function PriceTag({ amount }) {
  return <CsmPrice amount={amount} from="USD" style={{ fontSize: 18, fontWeight: "bold" }} />;
}

Payments

import CosmoolaNative, { useMobilePayment } from "@cosmoola/cosmoola-native";

const cosmoola = new CosmoolaNative("pk_live_xxx");

// Card payment
const { paymentIntent, error } = await cosmoola.confirmCardPayment(clientSecret, {
  payment_method: {
    card: { number: "4242424242424242", exp_month: "12", exp_year: "26", cvc: "123" }
  }
});

// Mobile Money hook
function PayScreen() {
  const { initiate, status, error } = useMobilePayment("pk_live_xxx");

  const pay = async () => {
    await initiate({
      clientSecret: "pi_xxx_secret_xxx",
      phone:        "+254712345678",
      country:      "KE",
      amount:       500,
      currency:     "KES",
    });
  };

  return (
    <Button title={status === "polling" ? "Waiting..." : "Pay with M-Pesa"} onPress={pay} />
  );
}

Folder structure

sdk/
  cosmoola-js/         ← Web browser SDK
  cosmoola-node/       ← Node.js server SDK
  cosmoola-react/      ← React web SDK (hooks + components)
  cosmoola-native/     ← React Native SDK (this package)

Differences from cosmoola-react

| Feature | cosmoola-react | cosmoola-native | |---------|---------------|-----------------| | Cache | localStorage | AsyncStorage | | Country detect | ipapi.co + navigator.language | ipapi.co | | Price component | <CsmPrice /> (web) | <CsmPrice /> (RN Text) | | Currency switcher | <CsmSwitcher /> | Build your own with allCurrencies | | Payment elements | DOM-based CardElement | Use your own RN inputs | | No-build | ✓ | ✓ |