Stripe Checkout Sessions adds Contact Details Element for email
Introduced 2026-05-27 · score 0.95
HOW TO USE IT
When integrating Elements with the Checkout Sessions API, use the Contact Details Element to collect and validate the customer’s email and help them sign in to Link.
const contactDetailsElement = checkout.createContactDetailsElement();
contactDetailsElement.mount("#contact-details-element");<CheckoutElementsProvider clientSecret={clientSecret}>
<ContactDetailsElement />
</CheckoutElementsProvider>WHY THIS HELPS
When integrating Elements with the Checkout Sessions API, collect and validate a customer's email address without building a custom email form.
BEFORE THIS CHANGE
Build and validate a custom email input, then use `actions.updateEmail(email)` to update the customer’s email.
REQUIREMENTS AND LIMITATIONS
- checkout (required): Checkout instance used to create the element.
- #contact-details-element (required): Selector for the DOM node where the element is mounted.
- clientSecret (required): Checkout Session client secret, or a promise resolving to it; passed to the React CheckoutElementsProvider.
- ContactDetailsElement (required): React component from `@stripe/react-stripe-js/checkout`; render inside CheckoutElementsProvider.
- Prerequisite: Create the Checkout Session server-side with `ui_mode` set to `elements`; return its client secret to the client.
- Prerequisite: For React, install and import React Stripe.js; the ContactDetailsElement must be inside CheckoutElementsProvider.
FIRST-PARTY EVIDENCE
- https://docs.stripe.com/changelog/dahlia/2026-05-27/add-contact-details-element-to-checkout
- https://docs.stripe.com/js/custom_checkout/create_contact_details_element and https://docs.stripe.com/js/element/mount
- https://docs.stripe.com/js/react_stripe_js/checkout/contact_details_element and https://docs.stripe.com/js/react_stripe_js/checkout/checkout_provider
- https://docs.stripe.com/js/custom_checkout/create_contact_details_element
- https://docs.stripe.com/js/element/mount
- https://docs.stripe.com/js/react_stripe_js/checkout/checkout_provider
- https://docs.stripe.com/js/react_stripe_js/checkout/contact_details_element
- https://docs.stripe.com/payments/quickstart
- https://docs.stripe.com/payments/quickstart and https://docs.stripe.com/js/react_stripe_js/checkout/contact_details_element
- https://docs.stripe.com/changelog/dahlia/2026-05-27/add-contact-details-element-to-checkout and https://docs.stripe.com/js/custom_checkout/update_email
Check the installed version and the source before using it. Entry JSON