Stripe | Financial Infrastructure to Grow Your Revenue

Stripe | Financial Infrastructure to Grow Your Revenue

5282 articles

Payment Method Messaging Element


PaymentMethodMessagingElement Use the PaymentMethodMessagingElement from @stripe/react-stripe-js to inform a customer about available buy-now-pay-later plans. ### Props - id Sets the DOM id attribute on the rendered Element container. Use this to target the Element for styling or testing. - className Applies custom CSS classes to the Element container. - options Options for displaying a paymentMethodMessaging element. See visual examples in the docs. - amount The total amount in the smallest currency unit. - currency The currency. One of AUD, CAD, CHF, CZK, DKK, EUR, GBP, NOK, NZD, PLN, RON, SEK, USD. - countryCode The end-buyer country. One of AT, AU, BE, CA, CH, CZ, DE, DK, ES, FI, FR, GB, GR, IE, IT, NL, NO, NZ, PL, PT, RO, SE, US. If not set, the buyer's country will be inferred from the request. - paymentMethodTypes A list of payment method types to render. You can omit this attribute to manage your payment methods from the Stripe Dashboard. Any combination of affirm, afterpay_clearpay, klarna. - paymentMethodOrder By default, the Payment Method Messaging Element uses a dynamic ordering that optimizes payment method display for each user. You can override the default order in which payment methods display in the Payment Method Messaging Element with a list of payment method types. If there are payment methods that will show that aren't specified in paymentMethodOrder, they display after the payment methods you specify. If you specify payment methods that won't show, they are ignored. - onReady Callback called once the Element is fully rendered. Recieves the ready event payload. - onBlur Callback called when the Element loses focus. - onFocus Callback called when the Element receives focus. ### Example title Render PaymentMethodMessagingElement

Last verified 2026-09-24

Is this helpful?