Components

React components for React SDK reference for Crossmint authentication

EmbeddedAuthForm

Renders the Crossmint auth form inline in your page instead of in a modal. Displays the same login methods configured on CrossmintAuthProvider, which it must be rendered inside of.

Usage

import { EmbeddedAuthForm, useCrossmintAuth } from "@crossmint/client-sdk-react-ui";

function LoginPage() {
    const { status } = useCrossmintAuth();

    if (status === "logged-in") {
        return <p>You are logged in!</p>;
    }

    return (
        <div style={{ maxWidth: 400, margin: "0 auto" }}>
            <EmbeddedAuthForm />
        </div>
    );
}

Note: Must be rendered inside CrossmintAuthProvider. Renders the same auth form shown in the login modal, but inline in your page.