Checkout Components

This section covers the high-level components that serve as entry points for various checkout flows. These components are designed to provide a complete, out-of-the-box experience for common payment scenarios like standard payments from a link, selecting a plan from a pricing table, or making a donation. They encapsulate the necessary logic to initiate and process payments, often leveraging the core CheckoutForm component internally.

Component Relationship

The typical flow involves a user interacting with an entry-point component like CheckoutTable or CheckoutDonate. These components handle the initial user interaction (e.g., selecting a subscription plan) and then create a CheckoutSession. Once the session is ready, they delegate the final payment processing to the CheckoutForm, which renders the actual payment interface.

The following diagram illustrates this component relationship:

DIAGRAM_PLACEHOLDER

This modular design allows for both flexibility and ease of use. You can quickly implement a complete payment workflow with a single component or compose them for more complex scenarios.

For more detailed information on each component, including props and usage examples, please refer to their respective documentation pages.