Skip to main content
<MoonPayAuth> renders the MoonPay auth frame inline in your layout. It is the declarative alternative to client.setupAuth(). The auth frame is a lighter-weight counterpart to the connect flow. It drives the customer through email/OTP authentication only, without the full connect UI. This makes it a good fit for headless and Identity API integrations. Precondition: a clientToken must be present in the client context before mounting this component. The token is populated automatically when client.getConnection() or <MoonPayConnectionCheck> resolves with status: "connectionRequired". If no token is present, the component emits an "error" event. When the customer completes the flow with an active connection, credentials are decrypted and stored on the shared client automatically.
AuthScreen.tsx
import {
  MoonPayAuth,
  type AuthEvent,
} from "@moonpay/platform-sdk-react-native";
import { StyleSheet, View } from "react-native";

export function AuthScreen() {
  const handleEvent = (event: AuthEvent) => {
    switch (event.kind) {
      case "ready":
        break;
      case "complete":
        // Emitted only for active or termsAcceptanceRequired connections.
        console.log(event.payload.status);
        break;
      case "error":
        console.error(event.payload.code, event.payload.message);
        break;
    }
  };

  return (
    <View style={styles.container}>
      <MoonPayAuth onEvent={handleEvent} />
    </View>
  );
}

const styles = StyleSheet.create({
  container: { flex: 1 },
});

​
Props

PropTypeRequiredDefaultDescription
onEvent(event: AuthEvent) => void—Callback for auth lifecycle events. See AuthEvent.
styleViewStyleflex: 1Container style.

​
AuthEvent

Use event.kind to handle each event.
kindPayloadWhen you receive it
"ready"—The auth UI is rendered and ready.
"complete"ConnectionEmitted only when the connection is active or termsAcceptanceRequired. Credentials are already applied.
"error"ConnectionErrorThe flow encountered an error.
ConnectionError is discriminated by code:
codeExtra fieldsDescription
"validationError"errors: ConfigValidationFieldError[]One or more session/client/public-key fields are invalid.
"generic"message?: stringA generic connection failure.
ConfigValidationFieldError entries have code: "invalidSessionToken" | "invalidClientToken" | "invalidPublicKey" and a developer-facing message.
"complete" is emitted only for active and termsAcceptanceRequired connection statuses. If the customer’s connection resolves to another status (such as pending or unavailable), no "complete" event fires.