void` is a callback function that you provide that will be called when the event is fired. When called it will be passed an event object with the following properties: - `elementType` The type of element the event is fired from. - `paymentMethods` Describes which payment methods are available in the Payment Element. Returns `undefined` when no payment methods are available. Payment methods are returned in alphabetical order. - `

An object for each camelCase payment method name that may be available based on your configuration. -available### Example ```title Handle an availablepaymentmethodschange event ``` ## The Express Checkout Element The Express Checkout Element is an embeddable component for accepting payments through one-click payment buttons. ## Create the Express Checkout Elementelements.create(type: 'expressCheckout', options?: object)This method creates an instance of the Express Checkout Element. -typeThe type of Element being created, which isexpressCheckoutin this case. -optionsOptions for creating the Express Checkout Element. -allowedShippingCountriesBy default, the Express Checkout Element allows all countries for shipping. You can specify which countries are allowed for shipping in the Express Checkout Element with a list of two-letter country codes. -applePaySpecify Apple Pay specific options. These are passed through to the Apple Pay API. -recurringPaymentRequestSpecify a request to set up a recurring payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayrecurringpaymentrequest) for more details. -paymentDescription-managementURL-regularBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-trialBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-billingAgreement-deferredPaymentRequestSpecify a request to set up a deferred payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepaydeferredpaymentrequest) for more details. -paymentDescription-managementURL-deferredBilling-amount-amountTypeIndicates whether the billing amount is known at request time. When set to 'final', the Apple Pay payment sheet shows the configured amount. -label-deferredPaymentDate-billingAgreement-freeCancellationDateIf set, you must also supply a freeCancellationDateTimeZone. -freeCancellationDateTimeZoneIf set, you must also supply a freeCancellationDate. These are [tz](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) timezones such asAmerica/Los_Angeles, Europe/Dublin, and Asia/Singapore. - automaticReloadPaymentRequestSpecify a request to set up an automatic reload payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayautomaticreloadpaymentrequest) for more details. -paymentDescription-managementURL-automaticReloadBilling-amount-label-automaticReloadPaymentThresholdAmount-billingAgreement-billingAddressRequiredControls whether the Express Checkout Element collects the billing address. The default value depends on your integration: - If you passallowedShippingCountries, phoneNumberRequired, shippingAddressRequired, emailRequired, applePay, lineItems, or businesswhen creating the Express Checkout Element,billingAddressRequireddefaults to false. - Otherwise,billingAddressRequireddefaults to true. You can explicitly setbillingAddressRequiredto true or false to override the default behavior. We highly recommend that you collect the billing address because it can be used to perform address verifications and block fraudulent payments. -businessProvide information about your business that's displayed in the Express Checkout Element. This information will be retrieved from your Stripe account if it's not provided. -nameThe name of your business. Your business name is used to signal to the customer who they're paying. Klarna always retrieves the business name from your Stripe account, even when this option is set. -buttonHeightBy default, the height of the buttons are 44px. You can override this to specify a custom button height in the range of 40px-55px. -buttonThemeSpecify the preferred button theme to use. By default, Elements determines the themes based on the specified [appearance option](./create.md). -applePay-googlePay-paypal-klarna-buttonTypeSpecify the preferred button type to display. -applePayDefault isplain. - googlePayDefault isbuy. - paypalDefault ispaypal. - klarnaDefault ispay. - emailRequiredCollect the customer's email by setting this option totrue. - layoutSpecify how the buttons are arranged in a grid-like layout in the Express Checkout Element. Elements determines the layout by using certain factors, such as available space, number of buttons, and the definedlayoutobject. -maxColumnsDefines the maximum number of columns the Express Checkout Element can use to render. Default is0, meaning unlimited. - maxRowsDefines the maximum number of rows the Express Checkout Element can use to render. Default is0, meaning unlimited. - overflowSpecify whether or not to always hide the overflow menu or allow Elements to determine when to show the overflow menu. Default isauto. You can't specify both overflow: 'never'and setmaxRowsto a number greater than 0. -lineItemsAn array of LineItem objects. These LineItems are shown as line items in the payment interface, if line items are supported. You can represent discounts as negative amount LineItems. -nameThe name of the line item surfaced to the customer in the payment interface. -amountThe amount in the currency's subunit (for example, cents, yen, etc.). -paymentMethodsBy default, the Express Checkout Element displays all payment methods possible as a result of your Dashboard configuration. This is theautobehavior. If you don't want to show a given payment method as a payment option, set its property inpaymentMethodstonever. - amazonPay-applePayApple Pay has additional configurations that determine when Stripe can show it. By default, Apple Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Apple Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. This causes Apple Pay to be shown in supported browsers even when the customer isn't logged in to Apple Pay, resulting in a sign-in flow. Apple Pay on non-Safari desktop browsers is only supported when its property in paymentMethodsis set toalways. - googlePayGoogle Pay has additional configurations that determine when Stripe can show it. By default, Google Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Google Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. This causes Google Pay to be shown in supported browsers even when the customer isn't logged in to Google Pay, resulting in a sign-in flow. - link-paypal-klarna-paymentMethodOrderBy default, the Express Checkout 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 Express Checkout Element with a list of payment method types. If there are payment methods that will show that are not specified inpaymentMethodOrder, they display after the payment methods you specify. If you specify payment methods that will not show, they are ignored. - phoneNumberRequiredCollect the customer's phone number by setting this option totrue. PayPal doesn't provide a phone number, even when this option is set to true. Google Pay makes a best effort to return the phone number registered to the wallet, but doesn't guarantee it will be provided in all cases. - shippingAddressRequiredCollect the customer's shipping address by setting this option totrue. If true, you must also supply a valid shippingRatesoption in either thecreate, click, or shippingaddresschangeevents. -shippingRatesAn array of ShippingRate objects. The first shipping rate listed appears in the payment interface as the default option. -idUnique identifier for the object. -amountThe amount to charge for shipping. -displayNameThe name of the shipping rate, displayed to the customer in the payment interface. -deliveryEstimateThe estimated range for how long shipping takes, displayed to the customer in the payment interface. We recommended using the object format, but you can use a string instead. -maximumThe upper bound of the estimated range. If empty, it represents no upper bound (for example, infinite). -unitA unit of time. -valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, it represents no lower bound. -unitA unit of time. -valueMust be greater than 0. ### Example ```title Create an Express Checkout Element ``` ## Get an Express Checkout Elementelements.getElement(type: 'expressCheckout')This method retrieves a previously created Express Checkout Element. -typeThe type of Element being retrieved, which isexpressCheckoutin this case. ### Example ```title Get an Express Checkout Element ``` ## Update an Express Checkout Elementelement.update(options: object)Updates the options the [Express Checkout Element](./express-checkout-element.md) was initialized with. Updates merge into the existing configuration. -optionsOptions for updating the Express Checkout Element. -allowedShippingCountriesBy default, the Express Checkout Element allows all countries for shipping. You can specify which countries are allowed for shipping in the Express Checkout Element with a list of two-letter country codes. -billingAddressRequiredControls whether the Express Checkout Element collects the billing address. The default value depends on your integration: - If you passallowedShippingCountries, phoneNumberRequired, shippingAddressRequired, emailRequired, applePay, lineItems, or businesswhen creating the Express Checkout Element,billingAddressRequireddefaults to false. - Otherwise,billingAddressRequireddefaults to true. You can explicitly setbillingAddressRequiredto true or false to override the default behavior. We highly recommend that you collect the billing address because it can be used to perform address verifications and block fraudulent payments. -emailRequiredCollect the customer's email by setting this option totrue. - layoutSpecify how the buttons are arranged in a grid-like layout in the Express Checkout Element. Elements determines the layout by using certain factors, such as available space, number of buttons, and the definedlayoutobject. -maxColumnsDefines the maximum number of columns the Express Checkout Element can use to render. Default is0, meaning unlimited. - maxRowsDefines the maximum number of rows the Express Checkout Element can use to render. Default is0, meaning unlimited. - overflowSpecify whether or not to always hide the overflow menu or allow Elements to determine when to show the overflow menu. Default isauto. You can't specify both overflow: 'never'and setmaxRowsto a number greater than 0. -paymentMethodOrderBy default, the Express Checkout 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 Express Checkout Element with a list of payment method types. If there are payment methods that will show that are not specified inpaymentMethodOrder, they display after the payment methods you specify. If you specify payment methods that will not show, they are ignored. - phoneNumberRequiredCollect the customer's phone number by setting this option totrue. PayPal doesn't provide a phone number, even when this option is set to true. Google Pay makes a best effort to return the phone number registered to the wallet, but doesn't guarantee it will be provided in all cases. - shippingAddressRequiredCollect the customer's shipping address by setting this option totrue. If true, you must also supply a valid shippingRatesoption in either thecreate, click, or shippingaddresschangeevents. ### Example ```title Update an Express Checkout Element ``` ## Click eventexpressCheckoutElement.on(event: 'click', handler: function)Theclickevent is triggered from an Express Checkout Element when the customer clicks a payment button. Use this event to configure the payment interface. -eventThe name of the event. In this case,click. - handler handler(event) => voidis a **callback function** you provide that's called after the event is fired. After it's called, it passes an event object with the following properties: -elementTypeThe type of element the event is fired from, which isexpressCheckoutin this case. -expressPaymentTypeThe payment method the customer checks out with. -resolveA functionresolve(payload) => voidthat's called to show the payment interface. You must call this function within 1 second if you handle theclickevent. -allowedShippingCountries (deprecated)_This parameter has been deprecated in favor of theallowedShippingCountriesparam on the [create](./create-express-checkout-element.md) function._ By default, the Express Checkout Element allows all countries for shipping. You can specify which countries are allowed for shipping in the Express Checkout Element with a list of two-letter country codes. -applePaySpecify Apple Pay specific options. These are passed through to the Apple Pay API. -recurringPaymentRequestSpecify a request to set up a recurring payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayrecurringpaymentrequest) for more details. -paymentDescription-managementURL-regularBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-trialBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-billingAgreement-deferredPaymentRequestSpecify a request to set up a deferred payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepaydeferredpaymentrequest) for more details. -paymentDescription-managementURL-deferredBilling-amount-amountTypeIndicates whether the billing amount is known at request time. When set to 'final', the Apple Pay payment sheet shows the configured amount. -label-deferredPaymentDate-billingAgreement-freeCancellationDateIf set, you must also supply a freeCancellationDateTimeZone. -freeCancellationDateTimeZoneIf set, you must also supply a freeCancellationDate. These are [tz](https://en.wikipedia.org/wiki/List_of_tz_database_time_zones) timezones such asAmerica/Los_Angeles, Europe/Dublin, and Asia/Singapore. - automaticReloadPaymentRequestSpecify a request to set up an automatic reload payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayautomaticreloadpaymentrequest) for more details. -paymentDescription-managementURL-automaticReloadBilling-amount-label-automaticReloadPaymentThresholdAmount-billingAgreement-billingAddressRequired (deprecated)_This parameter has been deprecated in favor of thebillingAddressRequiredparam on the [create](./create-express-checkout-element.md) function._ By default, the Express Checkout Element collects the billing address. You can disable this by settingbillingAddressRequiredtofalse. We highly recommend that you collect the billing address because it can be used to perform address verifications and block fraudulent payments. - business (deprecated)_This parameter has been deprecated in favor of thebusinessparam on the [create](./create-express-checkout-element.md) function._ Provide information about your business that's displayed in the Express Checkout Element. This information will be retrieved from your Stripe account if it's not provided. -nameThe name of your business. Your business name is used to signal to the customer who they're paying. Klarna always retrieves the business name from your Stripe account, even when this option is set. -emailRequired (deprecated)_This parameter has been deprecated in favor of theemailRequiredparam on the [create](./create-express-checkout-element.md) function._ Collect the customer's email by setting this option totrue. - lineItemsAn array of LineItem objects. These LineItems are shown as line items in the payment interface, if line items are supported. You can represent discounts as negative amount LineItems. -nameThe name of the line item surfaced to the customer in the payment interface. -amountThe amount in the currency's subunit (for example, cents, yen, etc.). -phoneNumberRequired (deprecated)_This parameter has been deprecated in favor of thephoneNumberRequiredparam on the [create](./create-express-checkout-element.md) function._ Collect the customer's phone number by setting this option totrue. PayPal doesn't provide a phone number, even when this option is set to true. - shippingAddressRequired (deprecated)_This parameter has been deprecated in favor of theshippingAddressRequiredparam on the [create](./create-express-checkout-element.md) function._ Collect the customer's shipping address by setting this option totrue. If true, you must also supply a valid shippingRatesoption in either thecreate, click, or shippingaddresschangeevents. -shippingRatesAn array of ShippingRate objects. The first shipping rate listed appears in the payment interface as the default option. -idUnique identifier for the object. -amountThe amount to charge for shipping. -displayNameThe name of the shipping rate, displayed to the customer in the payment interface. -deliveryEstimateThe estimated range for how long shipping takes, displayed to the customer in the payment interface. We recommended using the object format, but you can use a string instead. -maximumThe upper bound of the estimated range. If empty, it represents no upper bound (for example, infinite). -unitA unit of time. -valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, it represents no lower bound. -unitA unit of time. -valueMust be greater than 0. -rejectA functionreject() => voidthat's called to cancel the payment interface. You must call this function within 1 second if you handle theclickevent. ### Example ```title Handle an express checkout element click event ``` ## Confirm eventexpressCheckoutElement.on(event: string, handler: function)Theconfirmevent is triggered from an Express Checkout Element when the customer finalizes their payment. Use this event to trigger payment confirmation. -eventThe name of the event. In this case,confirm. - handlerA callback functionhandler(event) => voidyou provide that's called after the event is fired. When called, it passes an event object with the following properties: -elementTypeThe type of element the event fires from, which isexpressCheckoutin this case. -expressPaymentTypeThe payment method the customer checks out with. -paymentFailedA functionpaymentFailed(payload) => voidthat's called if you're unable to process the customer's payment. -reasonDefault is'fail'. The payment interface might surface the reason to provide a hint to the customer on why their payment failed. - messageA short, concise, localized error message to display on the payment sheet. If none is provided, the payment sheet will display a generic error message for the given reason. **Wallet compatibility:** Apple Pay displays custom error messages for'invalid_shipping_address', 'invalid_billing_address', and 'invalid_payment_data', but not for 'fail'or'address_unserviceable'. Other wallets may not support custom messages or may truncate them. - billingDetailsObject containing information about the customer's billing details. -nameThe name of the customer. -emailThe email address of the customer. -phoneThe phone number of the customer. -addressThe billing address of the customer. -line1-line2-city-state-postal_code-country-shippingAddressObject containing information about the customer's shipping address. -nameThe name of the recipient. -addressThe shipping address of the customer. -line1-line2-city-state-postal_code-country-shippingRateObject containing information about the selected shipping rate. -idUnique identifier for the object. -amountThe amount to charge for shipping. -displayNameThe name of the shipping rate, displayed to the customer in the payment interface. -deliveryEstimateThe estimated range for how long shipping takes, displayed to the customer in the payment interface. We recommended using the object format, but you can use a string instead. -maximumThe upper bound of the estimated range. If empty, it represents no upper bound (for example, infinite). -unitA unit of time. -valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, it represents no lower bound. -unitA unit of time. -valueMust be greater than 0. ### Example ```title Handle 'confirm' event ``` ## Cancel eventexpressCheckoutElement.on(event: string, handler: function)Thecancelevent is triggered from an Express Checkout Element when the payment interface is dismissed. Note that in some browsers, the payment interface might be dismissed by the customer even after they authorize the payment. This means that you might receive acancelevent after receiving aconfirmevent. If you're using thecancelevent as a hook for canceling the customer's order, make sure you also refund the payment that you just created. -eventThe name of the event. In this case,cancel. - handlerA callback function that you provide that's called after the event is fired. ### Example ```title Handle 'cancel' event ``` ## Available payment methods change eventexpressCheckoutElement.on(event: 'availablepaymentmethodschange', handler: function)Triggered when there is a change to which buttons are available in the Express Checkout Element. Also fires on initial render. -eventThe name of the event. In this case,availablepaymentmethodschange. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. When called it will be passed an event object with the following properties: -elementTypeThe type of element the event is fired from. -paymentMethodsDescribes which buttons render in the Element. Returnsundefinedif no buttons will render. Payment methods are returned in alphabetical order. Each value is an object with anavailableboolean field. If you configured [custom payment methods](https://docs.stripe.com/payments/payment-element/custom-payment-methods.md) with anexpressCheckoutobject, their IDs (prefixed withcpmt_) also appear as keys in this object. - amazonPay-available-applePay-available-googlePay-available-klarna-available-link-available-paypal-available### Example ```title Handle an availablepaymentmethodschange event ``` ## Shippingaddresschange eventexpressCheckoutElement.on(event: string, handler: function)Theshippingaddresschangeevent is triggered from an Express Checkout Element whenever the customer selects a new address in the payment interface. This event is not available for Elements with Checkout Sessions (EwCS integrations). When using an Express Checkout Element with a Checkout Session, shipping address changes are managed through the Checkout Session itself. You can update the session on your server after the customer completes their payment rather than responding to this event during the payment flow. -eventThe name of the event. In this case,shippingaddresschange. - handlerA callback functionhandler(event) => voidyou provide that's called after the event is fired. After it's called, it passes an event object with the following properties: -elementTypeThe type of element the event is fired from, which isexpressCheckoutin this case. -resolveA functionresolve(payload) => voidthat's called if the recipient's shipping address is valid. -applePaySpecify Apple Pay specific options. These are passed through to the Apple Pay API. -recurringPaymentRequestSpecify a request to set up a recurring payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayrecurringpaymentrequest) for more details. -paymentDescription-managementURL-regularBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-trialBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-automaticReloadPaymentRequestSpecify a request to set up an automatic reload payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayautomaticreloadpaymentrequest) for more details. -paymentDescription-managementURL-automaticReloadBilling-amount-label-automaticReloadPaymentThresholdAmount-lineItemsAn array of LineItem objects. These LineItems are shown as line items in the payment interface, if line items are supported. -nameThe name of the line item surfaced to the customer in the payment interface. -amountThe amount in the currency's subunit (for example, cents, yen, etc.). -shippingRatesAn array of ShippingRate objects. The first shipping rate listed appears in the payment interface as the default option. -idUnique identifier for the object. -amountThe amount to charge for shipping. -displayNameThe name of the shipping rate, displayed to the customer in the payment interface. -deliveryEstimateThe estimated range for how long shipping takes, displayed to the customer in the payment interface. We recommended using the object format, but you can use a string instead. -maximumThe upper bound of the estimated range. If empty, it represents no upper bound (for example, infinite). -unitA unit of time. -valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, it represents no lower bound. -unitA unit of time. -valueMust be greater than 0. -rejectA functionreject() => voidthat's called if the recipient's shipping address is invalid. -nameThe name of the recipient. -addressThe shipping address of the recipient. To maintain privacy, browsers might anonymize the shipping address by removing sensitive information that isn't necessary to calculate shipping costs. Depending on the country, some fields can be missing or partially redacted. For example, the shipping address in the US can only contain a city, state, and ZIP code. The full shipping address appears in the [confirm event](./express-checkout-element-confirm-event.md) object after the purchase is confirmed in the browser’s payment interface. -city-state-postal_code-country### Example ```title Handle 'shippingaddresschange' event ``` ## Shippingratechange eventexpressCheckoutElement.on(event: string, handler: function)Theshippingratechangeevent is triggered from an Express Checkout Element whenever the customer selects a new shipping rate in the payment interface. This event is not available for Elements with Checkout Sessions (EwCS integrations). When using an Express Checkout Element with a Checkout Session, shipping rate changes are managed through the Checkout Session itself. You can update the session on your server after the customer completes their payment rather than responding to this event during the payment flow. -eventThe name of the event. In this case,shippingratechange. - handlerA callback functionhandler(event) => voidyou provide that's called after the event is fired. After it's called, it passes an event object with the following properties: -elementTypeThe type of element the event is fired from, which isexpressCheckoutin this case. -resolveA functionresolve(payload) => voidthat's called if the customer's shipping rate is valid. -applePaySpecify Apple Pay specific options. These are passed through to the Apple Pay API. -recurringPaymentRequestSpecify a request to set up a recurring payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayrecurringpaymentrequest) for more details. -paymentDescription-managementURL-regularBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-trialBilling-amount-label-recurringPaymentStartDate-recurringPaymentEndDate-recurringPaymentIntervalUnit-recurringPaymentIntervalCount-automaticReloadPaymentRequestSpecify a request to set up an automatic reload payment. See the [Apple Pay documentation](https://developer.apple.com/documentation/applepayontheweb/applepayautomaticreloadpaymentrequest) for more details. -paymentDescription-managementURL-automaticReloadBilling-amount-label-automaticReloadPaymentThresholdAmount-lineItemsAn array of LineItem objects. These LineItems are shown as line items in the payment interface, if line items are supported. -nameThe name of the line item surfaced to the customer in the payment interface. -amountThe amount in the currency's subunit (for example, cents, yen, etc.). -shippingRatesAn array of ShippingRate objects. The first shipping rate listed appears in the payment interface as the default option. -idUnique identifier for the object. -amountThe amount to charge for shipping. -displayNameThe name of the shipping rate, displayed to the customer in the payment interface. -deliveryEstimateThe estimated range for how long shipping takes, displayed to the customer in the payment interface. We recommended using the object format, but you can use a string instead. -maximumThe upper bound of the estimated range. If empty, it represents no upper bound (for example, infinite). -unitA unit of time. -valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, it represents no lower bound. -unitA unit of time. -valueMust be greater than 0. -rejectA functionreject() => voidthat's called if the customer's shipping rate is invalid. -shippingRateThe shipping rate selected by the customer. -idUnique identifier for the object. -amountThe amount to charge for shipping. -displayNameThe name of the shipping rate, displayed to the customer in the payment interface. -deliveryEstimateThe estimated range for how long shipping takes, displayed to the customer in the payment interface. We recommended using the object format, but you can use a string instead. -maximumThe upper bound of the estimated range. If empty, it represents no upper bound (for example, infinite). -unitA unit of time. -valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, it represents no lower bound. -unitA unit of time. -valueMust be greater than 0. ### Example ```title Handle 'shippingratechange' event ``` ## The Contact Details Element The [Contact Details Element](https://docs.stripe.com/payments/link/accept-a-payment.md) is an embeddable component for collecting email addresses and allow users to log into Link on your checkout page. This element was previously known as the Link Authentication Element. ## Create the Contact Details Elementelements.create(type: 'contactDetails', options?: object)This method creates an instance of the Contact Details Element. -typeThe type of Element being created, which iscontactDetailsin this case. -optionsOptions for creating the Contact Details Element. -defaultValuesProvide the initial contact information that will be displayed in the Contact Details Element. The form will render with empty fields if not provided. -email### Example ```title Create a Contact Details Element ``` ## Get a Contact Details Elementelements.getElement(type: 'contactDetails')This method retrieves a previously created Contact Details Element. -typeThe type of Element being retrieved, which iscontactDetailsin this case. ### Example ```title Get a Contact Details Element ``` ## The Address Element The Address Element is an embeddable component for collecting local and international billing and shipping addresses. ## Create the Address Elementelements.create(type: 'address', options: object)This method creates an instance of the Address Element. **NOTE**: If you are creating multiple instances of the Address Element, configuration of the checkbox to sync shipping and billing addresses exists in the creation of the [Elements](./create.md) instance. -typeThe type of Element being created, which isaddressin this case. You can create multiple Address Elements, one of each mode, in a single Elements instance. -optionsOptions for creating the Address Element. -modeSpecify which mode you would like to use Address Element for. Whenshippingmode is used with the Payment Element and Contact Details Element, it will automatically pass shipping information when confirming Payment Intent or Setup Intent. Whenbillingmode is used with the Payment Element, it will automatically pass the billing information when confirming Payment Intent or Setup Intent. -autocompleteBy default, the Address Element will have autocomplete enabled with Stripe provided Google Maps API key for certain countries if any of the following condition is met: * If Payment Element is mounted in the same elements group as Address Element in a single page application. * If the Address Element is used in an active Link session (Link is also known as Onelink in the UK). [Contact Legal before editing or deleting the Google Maps autocomplete callout]: # By using autocomplete, you agree to comply with the [Google Maps Platform Acceptable Use Policy](https://cloud.google.com/maps-platform/terms/aup). If you violate this policy, we might disable autocomplete, or take any other action as necessary. You can customize the autocomplete setting with this option. -modeSpecifydisabledto disable autocomplete in the Address Element. Specifygoogle_maps_apito enable [Google Maps API](https://developers.google.com/maps/documentation/javascript/places) with your own key. It will only be used when Stripe provided Google Maps API key is not available. The default setting isautomatic, where we’ll support autocomplete when possible. - apiKeySpecify your own [Google Maps API key](https://developers.google.com/maps/documentation/javascript/places#add-places-api-to-the-api-keys-api-restrictions-list) with it. **Only needs to be passed in whenautocomplete.modeis set togoogle_maps_api.** - allowedCountriesBy default, the Address Element will display all countries for selection. You can specify which countries are displayed in the Address Element with a list of two-letter country codes. If only one country is specified, the country field will not display. -blockPoBoxBy default, PO boxes are considered a valid address type. You can override this to invalidate PO Boxes. -contactsAn array of objects that can be displayed as saved addresses in the Address Element. The first contact will be automatically selected. If using a [CustomerSession](https://docs.stripe.com/api/customer_sessions.md), Address Element will ignore contacts and render saved billing addresses instead. -nameThe name of the contact. This might be a person, or a business name. -addressThe address of the contact. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -postal_codeThe postal code or ZIP code, also known as PIN code in India. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -phoneThe phone number of the contact. The [fields.phone](./create-address-element.md) option must be set toalwaysif this property is specified. -defaultValuesProvide the initial information that will be displayed in the Address Element. The form will render with empty fields if not provided. -nameProvide the initial full name or organization name. -firstNameProvide the initial first name. The [display.name](./create-address-element.md) option must be set tosplitif this property is specified. -lastNameProvide the initial last name. The [display.name](./create-address-element.md) option must be set tosplitif this property is specified. -phoneProvide the initial phone number value. The [fields.phone](./create-address-element.md) option must be set toalwaysif this property is specified. -addressProvide the initial address details. -line1-line2-city-state-postal_code-country-fieldsBy default, the Address Element will collect all the necessary information needed for an address. In some cases, it might be necessary to collect other types of information. You can specify other types of fields to render in the form with this option. -phoneSpecifyalwaysto enable phone number collection in the Address Element. Only collect phone numbers if you need them for the transaction. Default isauto. - validationBy default, the Address Element will enforce preset validation for each field. You can customize the settings by using this option. -phone-requiredSpecifyalwaysto make phone number a required field. The [fields.phone](./create-address-element.md) option must be set toalwaysif this property is specified. Default isauto. - displayYou can customize how certain fields are displayed. -nameBy default, the Address Element will display a full name field. Specify 'split' to display a first name field and a last name field. Specify 'organization' to display an organization field. ### Example ```title Create an Address Element ``` ## Get an Address Elementelements.getElement(type: 'address', options?: object)This method retrieves a previously created Address Element. -typeThe type of Element being retrieved, which isaddressin this case. -optionsOptions for retrieving the Address Element. -modeRequired when using multiple Address Elements. Specify which mode of the Address Element you would like to retrieve. ### Example ```title Get an Address Element ``` ## Update an Address Elementelement.update(options: object)Updates the options the [Address Element](./address-element.md) was initialized with. Updates are merged into the existing configuration. -optionsOptions for updating the Address Element. -fieldsBy default, the Address Element will collect all the necessary information needed for an address. In some cases, it might be necessary to collect other types of information. You can specify other types of fields to render in the form with this option. -phoneSpecifyalwaysto enable phone number collection in the Address Element. Only collect phone numbers if you need them for the transaction. Default isauto. - validationBy default, the Address Element will enforce preset validation for each field. You can customize the settings by using this option. -phone-requiredSpecifyalwaysto make phone number a required field. The [fields.phone](./create-address-element.md) option must be set toalwaysif this property is specified. Default isauto. ### Example ```title Update an Address Element ``` ## Get value from an Address Element element.getValue(options?: object)Validates and retrieves form values from an Address Element. If there are any input validation errors, the errors will display by their respective fields. -optionsAn optional options object to control the format of the returned values. -formatControls the format of thestatefield in the returned address value. *latin: Return the state in Latin characters (for example, "Tokyo"). * localized: Return the state in the locale's native script (for example, "東京"). If unspecified in Stripe.js Clover and below, format is determined by a heuristic based on the customer's browser language. If unspecified in Stripe.js Dahlia and above, defaults to latin. ### Example ```title Get value from an Address Element ``` ## The Tax ID Element The [Tax ID Element](https://docs.stripe.com/elements/tax-id-element.md) is an embeddable component for collecting customer tax ID information for tax reporting and compliance purposes. ## Create a Tax ID Element elements.create(type: 'taxId', options?: object)This method creates an instance of the Tax ID Element. > This feature requires theelements_tax_id_1beta. To use it, passbetas: ['elements_tax_id_1']when initializing Stripe.js. -typeThe type of Element being created, which istaxIdin this case. -optionsTax ID Element initialization options. -visibilityBy default, the Tax ID Element displays when the user is in a country that supports tax ID collection. Specifyalwaysto display the element regardless of the user's country. Specifyneverto hide the element completely. -fieldsBy default, the Tax ID Element collects all tax ID information. If it's not necessary for you to collect all fields, you can disable Tax ID Element collection of certain fields with thefieldsoption. -businessNameSpecifyalwaysto collect the business name. Specifyneverto not collect the business name. Default isauto. - validationBy default, the Tax ID Element will enforce preset validation for each field. You can customize the settings by using this option. -businessName-requiredSpecifyalwaysto make business name a required field. Specifyneverto make business name an optional field. Default isauto. - taxId-requiredSpecifyalwaysto make tax ID a required field. Specifyneverto make tax ID an optional field. Default isauto. - verificationConfigure real-time tax ID verification. Requires theelements_tax_id_verification_1beta. To use it, passbetas: ['elements_tax_id_1', 'elements_tax_id_verification_1']when initializing Stripe.js -taxId-modeSpecifyif_supportedto enable real-time tax ID verification for supported tax ID types. Specifyneverto disable verification. Default isnever. ### Example ```title Create a Tax ID Element ``` ## Retrieve a Tax ID Element elements.getElement(type: 'taxId')This method retrieves a previously created Tax ID Element. -typeThe type of Element being retrieved, which istaxIdin this case. ### Example ```title Retrieve a Tax ID Element ``` ## Get value from a Tax ID Elementelement.getValue()Validates and retrieves form values from a Tax ID Element. If there are any input validation errors, the errors are displayed by their associated fields. ### Example ```title Get value from a Tax ID Element ``` ## Issuing Elements [Issuing Elements](https://docs.stripe.com/issuing/elements.md) allows you to display the sensitive data of your Issuing cards in a PCI-compliant manner. ## Create an Elementelements.create(type: string, options: object)This method creates an instance of an individual Issuing Element. It takes thetypeof Element to create as well as anoptionsobject. ## Other Elements Stripe also offers a [set of Elements for individual payment methods](https://docs.stripe.com/payments/elements.md) that you can use in your payment flows. ## Create an Elementelements.create(type: string, options?: object)This method creates an instance of an individualElement. It takes the typeofElementto create as well as anoptionsobject. ## Get an Elementelements.getElement(type: string)This method looks up a previously created [Element](./element.md) by its type. -typeThe type of [Element](./create-element.md) to lookup. ### Example ```title Get an Element ``` ## Update an Elementelement.update(options: object)Updates the options the [Element](./element.md) was initialized with. Updates are merged into the existing configuration. If you collect certain information in a different part of your interface (e.g., ZIP or postal code), useelement.updatewith the appropriate information. The styles of anElementcan be dynamically changed usingelement.update. This method can be used to simulate CSS media queries that automatically adjust the size of elements when viewed on different devices. ## Style the Element container Style the container you mount an [Element](./element.md) to as if it were an

on your page. For example, to controlpaddingandborderon anElement, set these properties on the container. This is usually done by re-using the classes that you have applied to your DOM

elements. After theElementis mounted, the.StripeElementclass is added to the container. Additionally, the following classes are automatically added to the container when theElementis complete, empty, focused, invalid, or autofilled by the browser: *.StripeElement--complete*.StripeElement--empty*.StripeElement--focus*.StripeElement--invalid*.StripeElement--webkit-autofill(Chrome and Safari only) These class names can be customized using theclasses[option](./create-element.md) when you [create an Element](#elements_create). ## Input validation Stripe elements validate customer input as it is typed. To help your customers catch mistakes, listen tochangeevents on anElementand display any errors. ## Postal code formatting Thecardelement automatically determines your customer’s billing address country based on their card number. Using this information, the postal code field validation reflects whether that country uses numeric or alphanumeric-formatted postal codes, or if the country uses postal codes at all. For instance, if a U.S. card is entered, the postal code field only accepts a five-digit numeric value. If it’s a UK card, an alphanumeric value can be provided instead. Many of our test cards have a U.S. billing address country. When using these to test your payment form, you must also use a five-digit U.S. ZIP code (e.g., 12345). To test elements with other postal code formats, use our [international test card numbers](https://docs.stripe.com/testing.md#international-cards). ## Mount an Elementelement.mount(domElement: string | DOM element)Theelement.mountmethod attaches your [Element](./element.md) to the DOM.element.mountaccepts either a CSS Selector (e.g.,'#payment-element') or a DOM element. You need to create a container DOM element to mount an Element. Add an empty placeholder divto your payment form for each Element that you'll mount. Stripe inserts an iframe into eachdivto securely collect payment information. -domElementThe CSS selector or DOM element where your [Element](./element.md) will be mounted. ### Example ```title Mount an Element ``` ## Element methods Below are a number of methods that are in common between all [Element](./element.md) UIs. Wait until the [ready event](./on-ready.md) is triggered before calling these methods. ## Blur an Elementelement.blur()Blurs the [Element](./element.md). ### Example ```title Blur an Element ``` ## Clear an Element's valueselement.clear()Clears the value(s) of the [Element](./element.md). ### Example ```title Clear an Element ``` ## Destroy an Elementelement.destroy()Removes the [Element](./element.md) from the DOM and destroys it. A destroyedElementcan not be re-activated or re-mounted to the DOM. ### Example ```title Destroy an Element ``` ## Focus an Elementelement.focus()Focuses the [Element](./element.md). > This method will currently not work on iOS 13+ due to a system limitation. ### Example ```title Focus an Element ``` ## Unmount an Elementelement.unmount() Unmounts the [Element](./element.md) from the DOM. Call [element.mount](./mount.md) to re-attach it to the DOM. ### Example ```title Unmount an Element ``` ## Element events Communicate with your [Element](./element.md) by listening to an event. An Element might emit any of the events below. All events have a payload object that has an elementTypeproperty with the type of theElementthat emitted the event. ## Change eventelement.on(event: 'change', handler: function)The change event is triggered when any value in the change event payload changes. The event payload always contains certain keys, in addition to someElement-specific keys. > Consult with your legal counsel regarding your requirements and obligations about how you collect, use, and store customers' personal data ## Ready event element.on(event: 'ready', handler: function)Triggered when theElementis fully rendered and methods on the instance, likeelement.focus()andelement.update(), can be called. - eventThe name of the event. In this case,ready. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. After it's called, it passes an event object with the following properties: -elementTypeThe type of element the event is fired from. -availablePaymentMethods (deprecated)_This field has been deprecated in favor of thepaymentMethods field on the [availablepaymentmethodschange](./express-checkout-element-availablepaymentmethodschange-event.md) event, which also fires when available payment methods change after load._ This field is **only** present on the expressCheckoutElement. Describes which buttons render in the Element. Returns undefined if no buttons will render. -link-applePay-googlePay-paypal-amazonPay-klarna### Example ```title Handle an Element ready event ``` ## Focus eventelement.on(event: 'focus', handler: function)Triggered when theElementgains focus. -eventThe name of the event. In this case,focus. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. ### Example ```title Handle an Element focus event ``` ## Blur eventelement.on(event: 'blur', handler: function)Triggered when theElementloses focus. -eventThe name of the event. In this case,blur. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. ### Example ```title Handle an Element blur event ``` ## Escape eventelement.on(event: 'escape', handler: function)Triggered when the escape key is pressed within an Element. -eventThe name of the event. In this case,escape. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. ### Example ```title Handle an Element escape event ``` ## Click eventelement.on(event: 'click', handler: function)## LoadError eventelement.on(event: 'loaderror', handler: function)Triggered when theElementfails to load. **This event is only emitted from thepayment, linkAuthentication, address, expressCheckout, currencySelector, taxId, card, and cardNumberElements.** -eventThe name of the event. In this case,loaderror. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. When called it will be passed an event object with the following properties: -elementTypeThe type of element that emitted this event. -errorAnerrorobject that describes the failure. ### Example ```title Handle an Element loaderror event ``` ## LoadStart eventelement.on(event: 'loaderstart', handler: function)Triggered when the [loader](./create.md) UI is mounted to the DOM and ready to be displayed. **This event is only emitted from thepayment, paymentForm, linkAuthentication, and addressElements.** -eventThe name of the event. In this case,loaderstart. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. When called it will be passed an event object with the following properties: -elementTypeThe type of element that emitted this event. ### Example ```title Handle an Element loaderstart event ``` ## NetworksChange eventelement.on(event: 'networkschange', handler: function)Triggered when there is a change to the available networks the provided card can run on. If the list of available networks is still loading, an event withnetworks: nullandloading: trueis triggered. When the list of available networks loads, Stripe triggers an additional event that contains the list of these networks and showsloading: false. Refer to our [card brand choice guide](https://docs.stripe.com/card-brand-choice.md#identifying-the-available-card-networks) for further details. ## Checkout [Checkout](https://docs.stripe.com/payments/checkout.md) is a low-code payment integration that creates a customizable payment form so you can quickly collect payments on desktop and mobile devices. ## Create an embedded Checkout instance stripe.createEmbeddedCheckoutPage(options: object)This method creates an embedded Checkout instance. -optionsEmbedded Checkout create options. -fetchClientSecretA callback functionfetchClientSecret() => Promise

that resolves with the [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) for the [Checkout Session](the relevant part of the product). -clientSecret (deprecated)_This param has been deprecated in favor of thefetchClientSecretparam, which offers a faster loading experience._ The [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) for the [Checkout Session](the relevant part of the product). -onCompleteAn optional callback functiononComplete() => voidthat is called on completion for Checkout Sessions withredirect_on_completion: if_required. ### Example ```title Create embedded Checkout instance ``` ## Mount embedded Checkout checkout.mount(domElement: string | DOM element)Thecheckout.mountmethod attaches Checkout to the DOM.checkout.mountaccepts either a CSS Selector (e.g.,'#checkout') or a DOM element. You need to create a container DOM element to mount Checkout. - domElementThe CSS selector or DOM element where Checkout will be mounted. ### Example ```title Mount embedded Checkout ``` ## Unmount embedded Checkoutcheckout.unmount()Unmounts Checkout from the DOM. Callcheckout.mountto reattach it to the DOM. ### Example ```title Unmount embedded Checkout ``` ## Destroy embedded Checkoutcheckout.destroy()Removes Checkout from the DOM and destroys it. Once destroyed, an embedded Checkout instance cannot be reattached to the DOM. Callcheckout.createEmbeddedCheckoutPageto create a new embedded Checkout instance after unmounting the previous instance from the DOM. ### Example ```title Destroy embedded Checkout ``` ## Elements with the Checkout Sessions API Build an online checkout page using React, Stripe Elements, and the Checkout Sessions API. See [build a checkout page](https://docs.stripe.com/checkout/custom/quickstart.md) for steps on using Elements with the Checkout Sessions API. The following Stripe.js methods are available to use as part of your integration. ## Initialize the Checkout Elements SDKstripe.initCheckoutElementsSdk(options?: object)This method initializes Checkout for [Checkout elements](https://docs.stripe.com/payments/quickstart-checkout-sessions.md) integrations, where you compose individual Elements on your checkout page. -optionsCheckout initialization options. -clientSecretThe Checkout Session [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) or a promise that resolves to the client secret. -elementsOptionsA set of options to configure Elements created with Checkout. -appearanceMatch the design of your site with the [appearance option](https://docs.stripe.com/elements/appearance-api.md). The layout of each Element stays consistent, but you can modify colors, fonts, borders, padding, and more. -loaderDisplay skeleton loader UI while waiting for Elements to fully load after they're mounted. Default is'auto'(Stripe determines whether or not to show a loader UI). -fontsAn array of custom fonts that elements created from theElementsobject can use. You can specify fonts as [CssFontSource](#css_font_source_object) or [CustomFontSource](#custom_font_source_object) objects. -savedPaymentMethodOptions to configure what Elements displays when used to [Save payment details during payment](https://docs.stripe.com/payments/checkout/save-during-payment.md). -enableRedisplayToggle if Elements redisplays Customer saved Payment Methods. Default is'auto'. Prior to Clover, this defaulted to 'never'. - enableSaveToggle if the Payment Element collects consent to save a Customer's Payment Methods. Default is'auto'. Prior to Clover, this defaulted to 'never'. - syncAddressCheckboxUsed with the [Address Element](https://docs.stripe.com/elements/address-element.md). ThesyncAddressCheckboxparameter configures which Address Element to show the checkbox. The checkbox allows the customer the option to sync billing and shipping addresses when both Billing and Shipping Address Elements are used in a single Elements instance. The default value is'billing'. - adaptivePricingOptions for [Adaptive Pricing](https://docs.stripe.com/payments/currencies/localize-prices/adaptive-pricing.md?payment-ui=embedded-components). -allowedWhether Adaptive Pricing can be used with this integration. Default isfalse. [Additional setup](https://docs.stripe.com/payments/currencies/localize-prices/adaptive-pricing.md?payment-ui=embedded-components) is required before you can use Adaptive Pricing with Checkout elements. - defaultValuesIf customer details are already known, this option may be passed to prefill the Checkout Session and related elements. -billingAddressThe Customer's billing address. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingAddressThe Customer's shipping address. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -emailThe Customer's email address. -phoneNumberThe Customer's phone number. ### Example ```title Initialize the Checkout Elements SDK ``` ## Initialize the Embedded form SDKstripe.initCheckoutFormSdk(options?: object)> This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. This method initializes Checkout for [embedded form](https://docs.stripe.com/elements/embeddable-payment-form.md) integrations, where a single form handles payment, address, and other elements. -optionsEmbedded form SDK initialization options. -clientSecretThe Checkout Session [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) or a promise that resolves to the client secret. -appearanceMatch the design of your site with the [appearance option](https://docs.stripe.com/elements/appearance-api.md). The layout stays consistent, but you can modify colors, fonts, borders, padding, and more. Note:rulesare not supported in the embedded form. -loaderDisplay skeleton loader UI while waiting for the embedded form to fully load after it's mounted. Default is'auto'(Stripe determines whether or not to show a loader UI). -fontsAn array of custom fonts that the embedded form can use. You can specify fonts as [CssFontSource](#css_font_source_object) or [CustomFontSource](#custom_font_source_object) objects. -savedPaymentMethodOptions to configure what the embedded form displays when used to [save payment details during payment](https://docs.stripe.com/payments/checkout/save-during-payment.md). -enableRedisplayToggle if the embedded form redisplays Customer saved Payment Methods. Default is'auto'. - enableSaveToggle if the embedded form collects consent to save a customer's payment methods. Default is'auto'. - defaultValuesIf customer details are already known, you can pass this option to prefill the Checkout Session and the embedded form. -billingAddressThe Customer's billing address. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingAddressThe Customer's shipping address. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -emailThe Customer's email address. -phoneNumberThe Customer's phone number. ### Example ```title Initialize the Embedded form SDK ``` ## Checkout actionscheckout.loadActions()After calling [initCheckoutElementsSdk](./init.md), useloadActions()to access methods for reading and manipulating [Checkout Sessions](https://docs.stripe.com/api/checkout/sessions.md). ### Example ```title Checkout actions ``` ## Read session dataactions.getSession()This method returns an object that contains data about the Checkout Session. ### Example ```title Read session data ``` ## Apply a promotion codeactions.applyPromotionCode(promotionCode: string)Use this method to apply a promotion code that your customer enters. -promotionCodeThe promotion code to apply to the Checkout Session. ### Example ```title Apply a promotion code ``` ## Remove a promotion codeactions.removePromotionCode()Use this method to remove the currently applied promotion code, if applicable. ### Example ```title Remove a promotion code ``` ## Update the Customer's shipping addressactions.updateShippingAddress(shippingAddress: nullable object)Use this method to update the Customer's shipping address. If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the shipping address is collected directly from the wallet and the value set byupdateShippingAddressis not used for express checkout payments. -shippingAddressNew shipping address for the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. ### Example ```title Update the Customer's shipping address ``` ## Update the Customer's billing addressactions.updateBillingAddress(billingAddress: nullable object)Use this method to update the Customer's billing address. If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the billing address is collected directly from the wallet and the value set byupdateBillingAddressis not used for express checkout payments. -billingAddressNew billing information for the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. ### Example ```title Update the Customer's billing address ``` ## Update the Customer's email addressactions.updateEmail(email: nullable string)Use this method to update the Customer's email address. If your integration uses [Link](https://docs.stripe.com/payments/link.md) and you do not provide an email during Checkout Session creation, you must callupdateEmailfor Link to appear as a payment option for returning users (Link is also known as Onelink in the UK). If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the email address is collected directly from the wallet and the value set byupdateEmailis not used for express checkout payments. -emailThe Customer's email address. ### Example ```title Update the Customer's email address ``` ## Update the Customer's phone numberactions.updatePhoneNumber(phoneNumber: nullable string)Use this method to update the Customer's phone number. If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the phone number is collected directly from the wallet and the value set byupdatePhoneNumberis not used for express checkout payments. -phoneNumberThe Customer's phone number. ### Example ```title Update the Customer's phone number ``` ## Update the Customer's business nameactions.updateBusinessName(businessName: nullable string)Use this method to update the Customer's business name whenname_collection.business.enabledistrueon the Checkout Session. If the [Tax ID Element](./create-tax-id-element.md) is mounted with the business name field shown, callingconfirm()throws anIntegrationErrorbecause the Tax ID Element collects the business name directly. To useupdateBusinessName()instead, setfields.businessName: "never"when creating the Tax ID Element. -businessNameThe Customer's business name. ### Example ```title Update the Customer's business name ``` ## Update the Customer's individual nameactions.updateIndividualName(individualName: nullable string)Use this method to update the Customer's individual name whenname_collection.individual.enabledistrueon the Checkout Session. -individualNameThe Customer's individual name. ### Example ```title Update the Customer's individual name ``` ## Update the Customer's business name and tax IDactions.updateTaxIdInfo(taxIdInfo?: )Use this method to update the Customer's business name and tax ID. -taxIdInfoThe Customer's tax ID information including the business name and tax ID. -businessNameThe Customer's business name. -taxIdThe Customer's tax ID. -typeOne of [the supported tax ID types](./tax-ids.md) -valueThe value of the tax ID. ### Example ```title Update the Customer's business name and tax ID ``` ## Update line item quantitiesactions.updateLineItemQuantity(options: object)Use this method to change the quantity of a line item. -optionsOptions forupdateLineItemQuantity. - lineItemThe [ID](./session-object.md) of the line item to update. -quantityThe new quantity of the line item. ### Example ```title Update line item quantities ``` ## Update the selected shipping optionactions.updateShippingOption(shippingOption?: string)Use this method to update the selected shipping option. See [shippingOptions](./session-object.md) for a list of the available shipping options. -shippingOptionThe [ID](./session-object.md) of the shipping option to select. ### Example ```title Update the selected shipping option ``` ## Validate Elementsactions.validateElements()Use this method to validate all mounted Elements without confirming the Checkout Session. This is useful for multi-step checkout flows where you want to validate user input before advancing to the next step. This method doesn't verify that the Checkout Session can be confirmed. To check whether all required fields are present, use the [Session'scanConfirmfield](./session-object.md). ### Example ```title Validate Elements ``` ## Confirm the Checkout Sessionactions.confirm(options?: object)Use this method to confirm the Checkout Session. You must either read [total.total.amount](./session-object.md) or each of [total.total.minorUnitsAmount](./session-object.md) and [currency](./session-object.md) and [minorUnitsAmountDivisor](./session-object.md) from the checkout object and display in your UI, otherwise an error will be thrown. This helps keep your checkout page in sync as the Checkout Session updates, including adding future Stripe features, with minimal UI code changes. -optionsOptions forconfirm. - returnUrlThe URL to redirect your customer to after they authenticate or cancel their payment on the payment method’s app or site. This parameter is only required if you didn't specify thereturn_urlwhen creating the Checkout Session. -paymentMethodThe ID of a previously collected [PaymentMethod](https://docs.stripe.com/api/payment_methods/object.md) to use for confirmation. When this option is provided, Custom Checkout will ignore the payment method collected by the PaymentElement and attempt confirmation using the provided PaymentMethod. -savePaymentMethodWhether your Customer has provided consent to save the payment method for future purchases. Learn how to [save payment methods](https://docs.stripe.com/checkout/custom-checkout/save-payment-methods-checkout.md). -redirectBy default,confirmwill always redirect to yourreturnUrlafter a successful confirmation. If you setredirect: "if_required", then confirmwill only redirect if your user chooses a redirect-based payment method. -emailThe Customer's email address. If provided, this value overrides any values previously set using [updateEmail](./update-email.md). -phoneNumberThe Customer's phone number. If provided, this value overrides any values previously set using [updatePhoneNumber](./update-phone-number.md). -billingAddressThe Customer's billing address. If provided, this value overrides any values previously set using [updateBillingAddress](./update-billing-address.md). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingAddressThe Customer's shipping address. If provided, this value overrides any values previously set using [updateShippingAddress](./update-shipping-address.md). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -expressCheckoutConfirmEventThe [event object](./express-checkout-element-confirm-event.md) passed to your Express Checkout Elementconfirmhandler. -formConfirmEventThe [event object](./on-confirm.md) passed to your Embedded formconfirmhandler. ### Example ```title Confirm the Checkout Session ``` ## Run server updateactions.runServerUpdate(userFunction: function)Use this method to wrap an async function that makes a request to your server to update the Checkout Session. >runServerUpdateenforces a 20-second timeout for your update function. If your function doesn't resolve within 20 seconds,runServerUpdatereturns an error. WraprunServerUpdatecalls intry/catchblocks to handle any errors. -userFunctionAn async function to make a request to your server to update the Checkout Session. ### Example ```title Run server update ``` ## The Session object The Session object is a view of the [Checkout Session](https://docs.stripe.com/api/checkout/sessions/object.md) API object and represents your customer's session on your checkout page. Because data can change over the lifecycle of a session, avoid storing a reference to the Session object. Instead, call [getSession](./session.md) to retrieve the current value, or listen to the [change event](./change-event.md) to subscribe to updates. -idThe ID of the Checkout Session. -billingAddressBilling details of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -businessNameThe business name as configured in the Business Public Details settings of your Stripe account. -canConfirmWhether the Checkout Session has collected enough data to confirm. Use this field to indicate to your customer if they can proceed, such as disabling the pay button. -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. Must be a [supported currency](https://docs.stripe.com/currencies.md). -currencyOptionsThe currency options available on the Checkout Session when using [Adaptive Pricing](https://docs.stripe.com/checkout/custom-checkout/adaptive-pricing.md). -amountA formatted string representing the total amount in the source currency, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the source currency in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -currencyConversionCurrency conversion details. This is only present for the customer currency. -fxRateThe exchange rate used to convert source currency amounts to customer currency amounts. -sourceCurrencyThe creation currency of the Checkout Session before localization. -discountAmountsThe aggregate amounts calculated per discount for all line items. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -emailThe Customer's email address. -lastPaymentErrorThe error encountered the last time the Checkout Session was confirmed. -messageAn error message to be displayed to the customer. -lineItemsA list of items the customer is purchasing. -idUnique identifier for the object. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal amount for this line item, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountThe amount representing the cost of a single unit of the item. -amountA formatted string representing the unit amount, including currency symbols. -minorUnitsAmountAn integer representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountDecimalThe unit amount of the line item in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal), with sub-cent precision. Use this field instead ofunitAmountwhen dealing with sub-cent pricing (for example, usage-based billing). For sub-cent prices,unitAmount.minorUnitsAmountrounds to0, so unitAmountDecimalpreserves the exact decimal value (for example,0.005for a price of 0.00005 USD). -amountA formatted string representing the unit amount with sub-cent precision, including currency symbols. -minorUnitsAmountA number representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) with sub-cent precision (for example,0.5for half a cent). UnlikeunitAmount.minorUnitsAmount, this value can be a decimal. - unitLabelA label that represents the unit of this line item. SpecifyunitLabelin [productData.unit_label](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-unit_label) when creating the Checkout Session or when creating the Product's [unit_label](https://docs.stripe.com/api/products/object.md#product_object-unit_label) field. -descriptionAn arbitrary string attached to the object. Often useful for displaying to users. -nameThe item's name, meant to be displayable to users. -imagesAn array of image URLs for the line item. Specify [images](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-images) on the Product when creating the Checkout Session. -quantityThe quantity of products being purchased. -discountAmountsThe amount of discount calculated per discount for this line item. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -taxAmountsThe amount of tax calculated per tax rate for this line item. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -recurringThe recurring components of a price such asintervalandintervalCount. - intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -usageTypeOne oflicensedormetered. licensedautomatically bills the quantity set when adding it to a subscription.meteredaggregates the total usage based on usage records. -adjustableQuantityConfiguration for this item's quantity to be adjusted by the customer during checkout. -maximumThe maximum quantity the customer can purchase for the Checkout Session. -minimumThe minimum quantity the customer can purchase for the Checkout Session. -livemodeHas the valuetrueif the object exists in live mode or the valuefalseif the object exists in a sandbox. -minorUnitsAmountDivisorThe factor used to convert between minor and major currency units. This value represents the number of minor currency units per one major unit. For example, in USD, where cents are the minor unit, the divisor is 100. In JPY, which has no minor units, the divisor is 1. -nameCollectionNames collected from the customer. This value isnullif [name_collection](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-name_collection) is not configured on the Checkout Session. -individualNameThe customer's individual name. -businessNameThe customer's business name. -phoneNumberThe Customer's phone number. -recurringDetails about recurring payments set up by the Checkout Session. -intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -dueNextDetails about the next scheduled recurring payment. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -billingCycleAnchorA future Unix timestamp to anchor the subscription's billing cycle. The anchor is the reference point that aligns future billing cycle dates. If not present, the subscription starts immediately. -trialDetails about a free trial, if there is one. -trialEndUnix timestamp representing the end of the trial period the customer will get before being charged for the first time. -trialPeriodDaysInteger representing the number of trial period days before the customer is charged for the first time. -isProratedWhen true, the amount to be collected today is a prorated amount for a partial billing period, such as when using [billing_cycle_anchor](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-subscription_data-billing_cycle_anchor). -savedPaymentMethodsAn array of payment methods attached to the Customer. -idID of the PaymentMethod object -typeThe [type](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-type) of the PaymentMethod -billingDetailsBilling information associated with the PaymentMethod that may be used or required by particular types of payment methods. -emailEmail address. -phoneBilling phone number (including extension). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -cardIf this is acardPaymentMethod, this hash contains the user's card details. -brandThe brand to use when displaying the card, this accounts for customer's brand choice on dual-branded cards. Can be american_express, cartes_bancaires, diners_club, discover, eftpos_australia, interac, jcb, mastercard, union_pay, visa, or other and may contain more values in the future. -expMonthTwo-digit number representing the card's expiration month. -expYearFour-digit number representing the card's expiration year. -last4The last four digits of the card. -shippingThe selected shipping option, if any. -shippingOptionDetails of the selected shipping option. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -taxAmountsThe amount of tax calculated per tax rate for shipping costs. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -shippingAddressShipping address of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingOptionsThe list of shipping options that can be selected. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -statusStatus of the Checkout Session. -typeOne ofopen, expired, or complete. * open: The Checkout Session is still in progress. * expired: The Checkout Session has expired. No further processing will occur. * complete: The Checkout Session is complete. Payment processing may still be in progress. - paymentStatusOne ofpaid, unpaid, or no_payment_required. Only present when type=complete. * paid: The payment funds are available in your account. * unpaid: The payment funds are not yet available in your account. * no_payment_required: The payment is delayed to a future date, or the Checkout Session is in setup mode and doesn't require a payment at this time. - taxDetails about the tax computation status. -statusOne ofready, requires_shipping_address, or requires_billing_address. * ready: The final tax amount is computed, and the session is ready for confirmation. * requires_shipping_address: A shipping address must be provided to calculate tax. * requires_billing_address: A billing address must be provided to calculate tax. - automaticTaxDetails about the automatic tax settings of the Checkout Session. -enabledWhether automatic tax is enabled on the Checkout Session. The other fields in this hash arenullwhen automatic tax is disabled. -exemptOne ofnone, exempt, or reverse. This value is nullif automatic tax is disabled, or if the Customer hasn't provided enough address information to determine their tax exemption. *none: The Customer isn't exempt from tax. * exempt: The Customer is exempt from tax. * reverse: The Customer is subject to the [reverse charge mechanism](https://docs.stripe.com/tax/zero-tax.md#reverse-charges), so tax is accounted for by the Customer. - addressSourceOne ofbilling, shipping, or customer, indicating which address is used to calculate tax. This value is nullif automatic tax is disabled. *billing: Tax is calculated from the billing address collected during this Checkout Session. * shipping: Tax is calculated from the shipping address collected during this Checkout Session. * customer: Tax is calculated from the address saved on the Customer. - taxAmountsThe aggregate amounts calculated per tax rate for all line items. This value isnullif tax has not yet been computed, i.e. the Customer's address has not been collected yet. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -totalTax and discount details for the computed total amount. Use this field to render an amount breakdown to your customer, such as in an order summary. -subtotalThe total amount of line items, excluding tax, discounts, and shipping. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveThe sum of all [exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveThe sum of all [inclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -shippingRateThe sum of all shipping amounts. -amountA formatted string representing the total shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the total shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountThe sum of all the discounts. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts, tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -appliedBalanceTotal amount of [customer credit balance](https://docs.stripe.com/billing/customer/balance.md) to be applied to the payment. A positive number increases the amount to be paid, and a negative number decreases the amount to be paid. -amountA formatted string representing the applied customer balance amount, including currency symbols. -minorUnitsAmountAn integer representing the applied customer balance amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -balanceAppliedToNextInvoiceWhen true, no payment will be collected immediately. Instead, the amount due will be added to the Customer's next invoice. This can happen when the amount due today is less than the [minimum chargeable amount](https://docs.stripe.com/currencies.md#minimum-and-maximum-charge-amounts). ## Checkout events Listen to Checkout events to respond to changes caused by customer actions on your checkout page. ## Change eventcheckout.on(event: 'change', handler: function)The change event is triggered when [Checkout Session](./session-object.md) data changes, such as when the customer changes their shipping address. The event payload is always a [Checkout Session](./session-object.md) object. -eventThe name of the event. In this case,change. - handler handler(session) => voidis a **callback function** that you provide that will be called when the event is fired. When called it will be passed a [Checkout Session](./session-object.md) object. ### Example ```title Listen to change events ``` ## Use Elements with the Checkout Sessions API [Stripe Elements](https://docs.stripe.com/payments/elements.md) are customizable UI components you can use to build your checkout page. Use the [Checkout Elements SDK](./init.md) instance to create and manage Elements. ## Create a Payment Elementcheckout.createPaymentElement(options?: object)This method creates an instance of a Payment Element. -optionsPayment Element initialization options. -fieldsBy default, the Payment Element collects only the necessary billing details to complete a payment. To collect billing details outside of the Payment Element, use thefieldsoption to disable Payment Element collection of certain fields. You can setbillingDetailsat the top level to apply the same field collection settings to all payment methods, or setbillingDetailsunder a supported payment method type to override the top-level setting for that payment method. -billingDetailsSpecifyneverto avoid collecting all [billing details](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-billing_details) in the Payment Element. If you would like to disable only certain billing details, pass an object specifying which fields you would like to disable collection for. The default setting for each field or object isauto. - nameSpecifyalwaysto require the Payment Element to collect the customer's billing name. -emailSpecifyneverto avoid collecting email in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.email=neverandwalletOptions.emailRequired=true, email is still collected from wallets. - phoneSpecifyneverto avoid collecting phone in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.phone=neverandwalletOptions.phoneNumberRequired=true, phone is still collected from wallets. - addressSpecifyif_requiredto only collect the minimum billing address fields required to complete the payment. You can omit and hide optional address fields in the card form, such as country and postal code. Unlike theneveroption, you don't need to include fields omitted in the Payment Element when confirming the payment. This can reduce the amount of information required to complete the form. Disabling address collection can negatively impact authorization rates and network fees for users on a network cost plus pricing plan. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -postalCodeThe postal code or ZIP code, also known as PIN code in India. -[paymentMethodType]Optionally specify the billing detail collection settings for any Payment Element payment method type. Examples of valid values arecard, klarna, or us_bank_account. You can include one or more payment method type keys. - billingDetailsSpecifyneverto avoid collecting all [billing details](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-billing_details) in the Payment Element. If you would like to disable only certain billing details, pass an object specifying which fields you would like to disable collection for. The default setting for each field or object isauto. - nameSpecifyalwaysto require the Payment Element to collect the customer's billing name. -emailSpecifyneverto avoid collecting email in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.email=neverandwalletOptions.emailRequired=true, email is still collected from wallets. - phoneSpecifyneverto avoid collecting phone in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.phone=neverandwalletOptions.phoneNumberRequired=true, phone is still collected from wallets. - addressSpecifyif_requiredto only collect the minimum billing address fields required to complete the payment. You can omit and hide optional address fields in the card form, such as country and postal code. Unlike theneveroption, you don't need to include fields omitted in the Payment Element when confirming the payment. This can reduce the amount of information required to complete the form. Disabling address collection can negatively impact authorization rates and network fees for users on a network cost plus pricing plan. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -postalCodeThe postal code or ZIP code, also known as PIN code in India. -layout Specify the layout for the Payment Element. If you only pass a layout type ('accordion'or‘tabs’) without any additional parameters, the Payment Element renders using that layout and the default values associated with it. An object can also be passed to specify the layout with additional configuration. - typeDefines the layout to render the Payment Element. -defaultCollapsedControls if the Payment Element renders in a collapsed state (where no payment method is selected by default). When you leave thisundefined, Stripe renders the experience that it determines will have the best conversion. - radiosControls when to render each Payment Method with a radio input next to its logo. The radios visually indicate the current selection of the Payment Element. Defaults to'auto'. - 'always'— Always show radio inputs. -'never'— Never show radio inputs. -'if_multiple'— Show radio inputs only when there are multiple payment methods available. When there is only one payment method, no radio input is displayed. -'auto'— Stripe determines the best experience to optimize conversion. _This property is only applicable to theaccordionlayout._ -spacedAccordionItemsWhentrue, the Payment Methods render as standalone buttons with space in between them. _This property is only applicable to the accordionlayout._ -visibleAccordionItemsCountSets the max number of Payment Methods visible before using the "More" button to hide additional Payment Methods. Set this value to0to disable the "More" button and render all available Payment Methods. Default is5. _This property is only applicable to the accordionlayout._ -paymentMethodLogoPositionSets the position of the payment method logo in each accordion item. Default isstart. _This property is only applicable to the accordionlayout._ -paymentMethodOrderBy default, the Payment Element will use a dynamic ordering that optimizes payment method display for each user. You can override the default order in which payment methods are displayed in the Payment Element with a list of payment method types. If the associated Checkout Session has payment method types not specified inpaymentMethodOrder, they will be displayed after the payment methods you specify. If you specify payment method types not on the associated PaymentIntent, they will be ignored. - readOnlyApplies a read-only state to the Payment Element so that payment details can’t be changed. Default is false. Enabling thereadOnlyoption doesn't change the Payment Element's visual appearance. If you want to adjust the way the Payment Element looks, use the [Appearance API](https://docs.stripe.com/elements/appearance-api.md). -termsControl how mandates or other legal agreements are displayed in the Payment Element. Useneverto never display legal agreements. The default setting isauto, which causes legal agreements to only be shown when necessary. Consult your legal and compliance advisors before making any changes to the text of mandates or legal agreements. You can't use the termsoption to violate obligations under your Stripe agreement, Stripe policies, applicable laws or scheme rules. -applePay-auBecsDebit-bancontact-card-cashapp-googlePay-ideal-paypal-sepaDebit-sofort-usBankAccount-walletsBy default, the Payment Element will display all the payment methods that the underlying Checkout Session was created with. However, wallets like Apple Pay and Google Pay are not payment methods per the Checkout Session API. They will show when the Checkout Session has thecardpayment method and the customer is using a supported platform and have an active card in their account. This is theautobehavior, and it is the default for choice for all wallets. If you do not want to show a given wallet as a payment option, you can set its property inwalletstonever. - applePay-googlePay-link-walletOptionsOptions to control the information collected from the customer when paying with a wallet payment method. -emailRequiredCollect the customer's email from wallet payment methods by setting this option to true. -phoneNumberRequiredCollect the customer's phone number from wallet payment methods by setting this option to true. PayPal doesn't provide a phone number, even when this option is set to true. Google Pay makes a best effort to return the phone number registered to the wallet, but doesn't guarantee it will be provided in all cases. Link makes a best effort to return the phone number registered to the wallet, but doesn't guarantee it will be provided in all cases. ### Example ```title Create a Payment Element ``` ## Create a Billing Address Elementcheckout.createBillingAddressElement(options?: object)This method creates an instance of a Billing Address Element. -optionsBilling Address Element initialization options. -contactsAn array of objects that can be displayed as saved addresses in the Billing Address Element. The first contact is automatically selected. -nameThe name of the contact. This might be a person, or a business name. -addressThe address of the contact. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -postal_codeThe postal code or ZIP code, also known as PIN code in India. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -phoneThe phone number of the contact. -displayYou can customize how certain fields are displayed. -nameBy default, the Billing Address Element displays a full name field. Specify 'split' to display a first name field and a last name field. Specify 'organization' to display an organization field. -autocompleteBy default, the Address Element will have autocomplete enabled with Stripe provided Google Maps API key for certain countries if any of the following condition is met: * If Payment Element is mounted in the same elements group as Address Element in a single page application. * If the Address Element is used in an active Link session (Link is also known as Onelink in the UK). [Contact Legal before editing or deleting the Google Maps autocomplete callout]: # By using autocomplete, you agree to comply with the [Google Maps Platform Acceptable Use Policy](https://cloud.google.com/maps-platform/terms/aup). If you violate this policy, we might disable autocomplete, or take any other action as necessary. You can customize the autocomplete setting with this option. -modeSpecifydisabledto disable autocomplete in the Address Element. Specifygoogle_maps_apito enable [Google Maps API](https://developers.google.com/maps/documentation/javascript/places) with your own key. It will only be used when Stripe provided Google Maps API key is not available. The default setting isautomatic, where we'll support autocomplete when possible. - apiKeySpecify your own [Google Maps API key](https://developers.google.com/maps/documentation/javascript/places#add-places-api-to-the-api-keys-api-restrictions-list) with it. **Only needs to be passed in whenautocomplete.modeis set togoogle_maps_api.** ### Example ```title Create a Billing Address Element ``` ## Create a Shipping Address Element checkout.createShippingAddressElement(options?: object)This method creates an instance of a Shipping Address Element. -optionsShipping Address Element initialization options. -contactsAn array of objects that can be displayed as saved addresses in the Shipping Address Element. The first contact is automatically selected. -nameThe name of the contact. This might be a person, or a business name. -addressThe address of the contact. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -postal_codeThe postal code or ZIP code, also known as PIN code in India. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -phoneThe phone number of the contact. -displayYou can customize how certain fields are displayed. -nameBy default, the Shipping Address Element displays a full name field. Specify 'split' to display a first name field and a last name field. Specify 'organization' to display an organization field. -autocompleteBy default, the Address Element will have autocomplete enabled with Stripe provided Google Maps API key for certain countries if any of the following condition is met: * If Payment Element is mounted in the same elements group as Address Element in a single page application. * If the Address Element is used in an active Link session (Link is also known as Onelink in the UK). [Contact Legal before editing or deleting the Google Maps autocomplete callout]: # By using autocomplete, you agree to comply with the [Google Maps Platform Acceptable Use Policy](https://cloud.google.com/maps-platform/terms/aup). If you violate this policy, we might disable autocomplete, or take any other action as necessary. You can customize the autocomplete setting with this option. -modeSpecifydisabledto disable autocomplete in the Address Element. Specifygoogle_maps_apito enable [Google Maps API](https://developers.google.com/maps/documentation/javascript/places) with your own key. It will only be used when Stripe provided Google Maps API key is not available. The default setting isautomatic, where we'll support autocomplete when possible. - apiKeySpecify your own [Google Maps API key](https://developers.google.com/maps/documentation/javascript/places#add-places-api-to-the-api-keys-api-restrictions-list) with it. **Only needs to be passed in whenautocomplete.modeis set togoogle_maps_api.** ### Example ```title Create a Shipping Address Element ``` ## Create an Express Checkout Element checkout.createExpressCheckoutElement(options?: object)This method creates an instance of an Express Checkout Element. -optionsExpress Checkout Element initialization options. -buttonHeightBy default, the height of the buttons are 44px. You can override this to specify a custom button height in the range of 40px-55px. -buttonThemeSpecify the preferred button theme to use. By default, Elements determines the themes based on the specified [appearance option](./create.md). -applePay-googlePay-paypal-klarna-buttonTypeSpecify the preferred button type to display. -applePayDefault isplain. - googlePayDefault isbuy. - paypalDefault ispaypal. - klarnaDefault ispay. - layoutSpecify how the buttons are arranged in a grid-like layout in the Express Checkout Element. Elements determines the layout by using certain factors, such as available space, number of buttons, and the definedlayoutobject. -maxColumnsDefines the maximum number of columns the Express Checkout Element can use to render. Default is0, meaning unlimited. - maxRowsDefines the maximum number of rows the Express Checkout Element can use to render. Default is0, meaning unlimited. - overflowSpecify whether or not to always hide the overflow menu or allow Elements to determine when to show the overflow menu. Default isauto. You can't specify both overflow: 'never'and setmaxRowsto a number greater than 0. -paymentMethodOrderBy default, the Express Checkout 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 Express Checkout Element with a list of payment method types. If there are payment methods that will show that are not specified inpaymentMethodOrder, they display after the payment methods you specify. If you specify payment methods that will not show, they are ignored. - paymentMethodsIn addition to your Dashboard configuration, the CheckoutSession configuration also influences the availability of payment methods in the Express Checkout Element. By default, it displays all available payment methods based on both configurations. When setting the paymentMethods option, the Express Checkout Element merges your specified options with the default logic to determine the final set of payment methods displayed. -amazonPay-applePayApple Pay has additional configurations that determine when Stripe can show it. By default, Apple Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Apple Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. Apple Pay on non-Safari desktop browsers is only supported when its property in paymentMethodsis set toalways. - googlePayGoogle Pay has additional configurations that determine when Stripe can show it. By default, Google Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Google Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. - link-paypal### Example ```title Create an Express Checkout Element ``` ## Create a Currency Selector Elementcheckout.createCurrencySelectorElement()This method creates an instance of a Currency Selector Element. ### Example ```title Create a Currency Selector Element ``` ## Create a Tax ID Elementcheckout.createTaxIdElement(options?: object)This method creates an instance of a Tax ID Element. > This feature requires thecustom_checkout_tax_id_1beta. To use it, passbetas: ['custom_checkout_tax_id_1']when initializing Stripe.js. -optionsTax ID Element initialization options. -visibilityBy default, the Tax ID Element displays when the user is in a country that supports tax ID collection. Specifyalwaysto display the element regardless of the user's country. Specifyneverto hide the element completely. Whenname_collection.business.enabledistrueon the Checkout Session andvisibilityisauto, the element displays regardless of the user's country. In countries that do not support tax ID collection, only the business name field shows. - fieldsBy default, the Tax ID Element collects all tax ID information. If it's not necessary for you to collect all fields, you can disable Tax ID Element collection of certain fields with thefieldsoption. -businessNameSpecifyalwaysto collect the business name. Specifyneverto not collect the business name. Default isauto. When name_collection.business.enabledistrueon the Checkout Session, setting this toneversignals that you are collecting the business name through your own input viaupdateBusinessName()instead. -validationBy default, the Tax ID Element will enforce preset validation for each field. You can customize the settings by using this option. -businessName-requiredSpecifyalwaysto make business name a required field. Specifyneverto make business name an optional field. Default isauto. When name_collection.business.enabledistrueon the Checkout Session andname_collection.business.optionalisfalse, the SDK overrides this to alwaysregardless of what you set here. -taxId-requiredSpecifyalwaysto make tax ID a required field. Specifyneverto make tax ID an optional field. Default isauto. - verificationConfigure real-time tax ID verification. Requires thecustom_checkout_tax_id_verification_1beta. To use it, passbetas: ['custom_checkout_tax_id_1', 'custom_checkout_tax_id_verification_1']when initializing Stripe.js -taxId-modeSpecifyif_supportedto enable real-time tax ID verification for supported tax ID types. Specifyneverto disable verification. Default isnever. ### Example ```title Create a Tax ID Element ``` ## Create a Contact Details Element checkout.createContactDetailsElement()This method creates an instance of a Contact Details Element, which collects your customer's email address and helps them sign in to Link. ### Example ```title Create a Contact Details Element ``` ## Get the Payment Elementcheckout.getPaymentElement()This method gets the previously created Payment Element instance, if it exists. ### Example ```title Get the Payment Element ``` ## Get the Contact Details Elementcheckout.getContactDetailsElement()This method gets the previously created Contact Details Element instance, if it exists. ### Example ```title Get the Contact Details Element ``` ## Get the Billing Address Elementcheckout.getBillingAddressElement()This method gets the previously created Billing Address Element instance, if it exists. ### Example ```title Get the Billing Address Element ``` ## Get value from a Billing Address Elementelement.getValue(options?: object)Validates and retrieves form values from a Billing Address Element. If there are any input validation errors, the errors will display by their respective fields. -optionsAn optional options object to control the format of the returned values. -formatControls the format of thestatefield in the returned address value. *latin: Return the state in Latin characters (for example, "Tokyo"). * localized: Return the state in the locale's native script (for example, "東京"). If unspecified in Stripe.js Clover and below, format is determined by a heuristic based on the customer's browser language. If unspecified in Stripe.js Dahlia and above, defaults to latin. ### Example ```title Get value from a Billing Address Element ``` ## Get the Shipping Address Element checkout.getShippingAddressElement()This method gets the previously created Shipping Address Element instance, if it exists. ### Example ```title Get the Shipping Address Element ``` ## Get value from a Shipping Address Elementelement.getValue(options?: object)Validates and retrieves form values from a Shipping Address Element. If there are any input validation errors, the errors will display by their respective fields. -optionsAn optional options object to control the format of the returned values. -formatControls the format of thestatefield in the returned address value. *latin: Return the state in Latin characters (for example, "Tokyo"). * localized: Return the state in the locale's native script (for example, "東京"). If unspecified in Stripe.js Clover and below, format is determined by a heuristic based on the customer's browser language. If unspecified in Stripe.js Dahlia and above, defaults to latin. ### Example ```title Get value from a Shipping Address Element ``` ## Get the Express Checkout Element checkout.getExpressCheckoutElement()This method gets the previously created Express Checkout Element instance, if it exists. ### Example ```title Get the Express Checkout Address Element ``` ## Get the Currency Selector Elementcheckout.getCurrencySelectorElement()This method gets the previously created Currency Selector Element instance, if it exists. ### Example ```title Get the Currency Selector Address Element ``` ## Change the visual customization of Elements using the Appearance APIcheckout.changeAppearance(appearance: object)Change the visual customization of Elements created with Custom Checkout using the [Appearance API](https://docs.stripe.com/elements/appearance-api.md) -appearanceMatch the design of your site with the [appearance option](https://docs.stripe.com/elements/appearance-api.md). The layout of each Element stays consistent, but you can modify colors, fonts, borders, padding, and more. ### Example ```title Change the visual customization of Elements ``` ## Load additional custom fonts into Elementscheckout.loadFonts(fonts: array)Load an additional array of custom fonts into Elements after it loads. -fontsAn array of custom fonts. Specify fonts as [CssFontSource](#css_font_source_object) or [CustomFontSource](#custom_font_source_object) objects. ### Example ```title Load additional custom fonts ``` ## Embedded form methods > This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. Use the [Embedded form SDK](./form-init.md) instance to create and manage the embedded form. ## Create an embedded formcheckoutFormSdk.createForm(options?: object)> This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. This method creates an instance of an embedded form. Call [initCheckoutFormSdk](./form-init.md) first to obtain thecheckoutFormSdkobject. -optionsEmbedded form initialization options. -layoutThe layout of the embedded form. The'expanded'layout is a single-step embedded form, while the'compact'layout is a multi-step embedded form. When you leave this undefined, Stripe renders the layout it determines has the best conversion. -contactsAn array of objects that you can use to display saved addresses in the embedded form. The first contact is automatically selected. -nameThe name of the contact. This might be a person, or a business name. -addressThe address of the contact. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -postal_codeThe postal code or ZIP code, also known as PIN code in India. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -phoneThe phone number of the contact. -featuresConfiguration for client-side features of the embedded form. Use this to disable default features of the Checkout Session that you prefer to implement in your own UI instead. -promotionCodeCollectionControls whether to show promotion code input in the embedded form. Defaults to'auto'. - 'auto': Shows the promotion code input if the Checkout Session enables [allow_promotion_codes](./create.md). - 'never': Never shows the promotion code input in the embedded form. Use this if you build your own promotion code input outside of the form. - expressCheckoutExpress checkout configuration options. -buttonHeightBy default, the height of the buttons are 44px. You can override this to specify a custom button height in the range of 40px-55px. -buttonThemeSpecify the preferred button theme to use. By default, Elements determines the themes based on the specified [appearance option](./create.md). -applePay-googlePay-paypal-klarna-paymentMethodsIn addition to your Dashboard configuration, the CheckoutSession configuration also influences the availability of payment methods in the Embedded form. By default, it displays all available payment methods based on both configurations. When setting the paymentMethods option, the Embedded form merges your specified options with the default logic to determine the final set of payment methods displayed. -amazonPay-applePayApple Pay has additional configurations that determine when Stripe can show it. By default, Apple Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Apple Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. Apple Pay on non-Safari desktop browsers is only supported when its property in paymentMethodsis set toalways. - googlePayGoogle Pay has additional configurations that determine when Stripe can show it. By default, Google Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Google Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. - link-paypal### Example ```title Create an embedded form ``` ## Create a Currency Selector ElementcheckoutFormSdk.createCurrencySelectorElement()> This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. This method creates an instance of a Currency Selector Element. ThecheckoutFormSdkobject is obtained by calling [initCheckoutFormSdk](./form-init.md). ### Example ```title Create a Currency Selector Element ``` ## Get the embedded formcheckoutFormSdk.getForm()> This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. This method gets the previously created embedded form instance, if it exists. You can obtain thecheckoutFormSdkby calling [initCheckoutFormSdk](./form-init.md). ### Example ```title Get the embedded form ``` ## Get the Currency Selector ElementcheckoutFormSdk.getCurrencySelectorElement()> This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. This method gets the previously created Currency Selector Element instance, if it exists. ThecheckoutFormSdkobject is obtained by calling [initCheckoutFormSdk](./form-init.md). ### Example ```title Get the Currency Selector Element ``` ## Set the view on the embedded formcheckoutForm.setView(viewIndex: number)> This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. Programmatically sets the active view on the embedded form. This method is only available whenoptions[layout]is'compact'. The viewIndexparameter is a positive integer that corresponds to an index from theviewsarray provided on the embedded form's [change event](./on-change.md). You can only set a view whereenabledistrue. - viewIndexA positive integer index corresponding to an entry in theviewsarray provided on the embedded form's [change event](./on-change.md). The view at the specified index must haveenabled: true. ### Example ```title Set the view on the embedded form ``` ## Listen to Elements events Communicate with your [Element](./custom-checkout-elements.md) by listening to an event. An Element might emit any of the events below. All events have a payload object that has an elementTypeproperty with the type of theElementthat emitted the event. Use the.onmethod on the Element instance to listen to events. See also: [Elements methods](./custom-checkout-elements.md) | [Listen to Checkout events](./events.md) ## Change eventelement.on(event: 'change', handler: function)The change event is triggered when any value in the change event payload changes. The event payload always contains certain keys, in addition to someElement-specific keys. The following Checkout Elements support the changeevent:paymentElement, billingAddressElement, shippingAddressElement, taxIdElement, and checkoutForm. > Consult with your legal counsel regarding your requirements and obligations about how you collect, use, and store customers' personal data ## Ready event element.on(event: 'ready', handler: function)Triggered when theElementis fully rendered and methods on the instance, likeelement.focus()andelement.update(), can be called. - eventThe name of the event. In this case,ready. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. After it's called, it passes an event object with the following properties: -elementTypeThe type of element the event is fired from. ### Example ```title Handle an Element ready event ``` ## Focus eventelement.on(event: 'focus', handler: function)Triggered when theElementgains focus. -eventThe name of the event. In this case,focus. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. ### Example ```title Handle an Element focus event ``` ## Blur eventelement.on(event: 'blur', handler: function)Triggered when theElementloses focus. -eventThe name of the event. In this case,blur. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. ### Example ```title Handle an Element blur event ``` ## Escape eventelement.on(event: 'escape', handler: function)Triggered when the escape key is pressed within anElement. - eventThe name of the event. In this case,escape. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. ### Example ```title Handle an Element escape event ``` ## LoadError eventelement.on(event: 'loaderror', handler: function)Triggered when theElementfails to load. -eventThe name of the event. In this case,loaderror. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. When called it will be passed an event object with the following properties: -elementTypeThe type of element that emitted this event. -errorAnerrorobject that describes the failure. ### Example ```title Handle an Element loaderror event ``` ## LoaderStart eventelement.on(event: 'loaderstart', handler: function)Triggered when the loader UI is mounted to the DOM and ready to be displayed. See also: [Elements methods](./custom-checkout-elements.md) | [Listen to Elements events](./element-events.md) -eventThe name of the event. In this case,loaderstart. - handler handler(event) => voidis a **callback function** that you provide that will be called when the event is fired. When called it will be passed an event object with the following properties: -elementTypeThe type of element that emitted this event. ### Example ```title Handle a Checkout Element loaderstart event ``` ## Confirm eventelement.on(event: string, handler: function)Theconfirmevent is triggered when the customer finalizes their payment. Use this event to trigger payment confirmation. The following Checkout Elements support theconfirmevent:expressCheckoutElementandcheckoutForm. ## Cancel event element.on(event: string, handler: function)Thecancelevent is triggered when the payment interface is dismissed (e.g. the customer closes it). Note that in some browsers, the payment interface might be dismissed by the customer even after they authorize the payment. This means that you might receive acancelevent after receiving aconfirmevent. If you're using thecancelevent as a hook for canceling the customer's order, make sure you also refund the payment that you just created. The following Checkout Elements support thecancelevent:expressCheckoutElementandcheckoutForm. ## React Stripe.js reference The React bindings for Stripe.js provide context providers, hooks, and Element components for both [Checkout Sessions](https://docs.stripe.com/api/checkout/sessions.md) and direct [PaymentIntent](https://docs.stripe.com/api/payment_intents.md) or [SetupIntent](https://docs.stripe.com/api/setup_intents.md) integrations. The sections below document the APIs exported from @stripe/react-stripe-jsand@the relevant part of the product, grouped by the provider you render (CheckoutElementsProviderorElements). ## Using the Checkout provider Build your Stripe integration using React, Stripe Elements, and the [Checkout Sessions API](https://docs.stripe.com/api/checkout/sessions.md). See [build a checkout page](https://docs.stripe.com/docs/payments/quickstart-checkout-sessions.md) for steps on using Elements with the Checkout Sessions API. The following React components and hooks are available to use as part of your integration. ## CheckoutElementsProvider The CheckoutElementsProvidercomponent allows you to use Element components and access data from your [Checkout Session](https://docs.stripe.com/api/checkout/sessions/object.md) in any nested component. Wrap the portion of your React tree that renders individual Element components to make the Checkout instance available via React context. To useCheckoutElementsProvider, call loadStripefrom@stripe/stripe-jswith your publishable key. TheloadStripefunction asynchronously loads the Stripe.js script and initializes a Stripe object. Pass the returnedPromisetoCheckoutElementsProvideralong with the [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) of your Checkout Session. ### Props -stripeA [Stripe object](./initializing.md) or aPromiseresolving to a Stripe object. The easiest way to initialize a Stripe object is with the [Stripe.js wrapper module](https://github.com/stripe/stripe-js/blob/master/README.md#readme). After this prop has been set, it can not be changed. -optionsOptions forCheckoutElementsProvider. - clientSecretThe Checkout Session [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) or a promise that resolves to the client secret. -elementsOptionsA set of options to configure Elements created with [Checkout Sessions](https://docs.stripe.com/api/checkout/sessions.md). -appearanceMatch the design of your site with the [appearance option](https://docs.stripe.com/elements/appearance-api.md). The layout of each Element stays consistent, but you can modify colors, fonts, borders, padding, and more. -loaderDisplay skeleton loader UI while waiting for Elements to fully load after they're mounted. Default is'auto'(Stripe determines whether or not to show a loader UI). -fontsAn array of custom fonts that elements created from theElementsobject can use. You can specify fonts as [CssFontSource](#css_font_source_object) or [CustomFontSource](#custom_font_source_object) objects. -savedPaymentMethodOptions to configure what Elements displays when used to [Save payment details during payment](https://docs.stripe.com/payments/checkout/save-during-payment.md). -enableRedisplayToggle if Elements redisplays Customer saved Payment Methods. Default is'auto'. Prior to Clover, this defaulted to 'never'. - enableSaveToggle if the Payment Element collects consent to save a Customer's Payment Methods. Default is'auto'. Prior to Clover, this defaulted to 'never'. - syncAddressCheckboxUsed with the [Address Element](https://docs.stripe.com/elements/address-element.md). ThesyncAddressCheckboxparameter configures which Address Element to show the checkbox. The checkbox allows the customer the option to sync billing and shipping addresses when both Billing and Shipping Address Elements are used in a single Elements instance. The default value is'billing'. - adaptivePricingOptions for [Adaptive Pricing](https://docs.stripe.com/payments/currencies/localize-prices/adaptive-pricing.md?payment-ui=embedded-components). -allowedWhether Adaptive Pricing can be used with this integration. Default isfalse. [Additional setup](https://docs.stripe.com/payments/currencies/localize-prices/adaptive-pricing.md?payment-ui=embedded-components) is required before you can use Adaptive Pricing with Checkout elements. ### Example ```title Mount CheckoutElementsProvider ``` ## useCheckoutElements The useCheckoutElementshook returns a disjoint union describing the loading state: *{type: "loading"}*{type: "error", error: { message: string }}*{type: "success", checkout: object }. Upon success, it returns a [Session object](./session-object.md) as well as actions to update the Checkout Session. Use useCheckoutElementsinside a [CheckoutElementsProvider](./checkout-provider.md). For [CheckoutFormProvider](./checkout-form-provider.md) integrations, use [useCheckoutForm](./use-checkout-form.md) instead. ### Object properties -idThe ID of the Checkout Session. -billingAddressBilling details of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -businessNameThe business name as configured in the Business Public Details settings of your Stripe account. -canConfirmWhether the Checkout Session has collected enough data to confirm. Use this field to indicate to your customer if they can proceed, such as disabling the pay button. -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. Must be a [supported currency](https://docs.stripe.com/currencies.md). -currencyOptionsThe currency options available on the Checkout Session when using [Adaptive Pricing](https://docs.stripe.com/checkout/custom-checkout/adaptive-pricing.md). -amountA formatted string representing the total amount in the source currency, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the source currency in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -currencyConversionCurrency conversion details. This is only present for the customer currency. -fxRateThe exchange rate used to convert source currency amounts to customer currency amounts. -sourceCurrencyThe creation currency of the Checkout Session before localization. -discountAmountsThe aggregate amounts calculated per discount for all line items. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -emailThe Customer's email address. -lastPaymentErrorThe error encountered the last time the Checkout Session was confirmed. -messageAn error message to be displayed to the customer. -lineItemsA list of items the customer is purchasing. -idUnique identifier for the object. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal amount for this line item, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountThe amount representing the cost of a single unit of the item. -amountA formatted string representing the unit amount, including currency symbols. -minorUnitsAmountAn integer representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountDecimalThe unit amount of the line item in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal), with sub-cent precision. Use this field instead ofunitAmountwhen dealing with sub-cent pricing (for example, usage-based billing). For sub-cent prices,unitAmount.minorUnitsAmountrounds to0, so unitAmountDecimalpreserves the exact decimal value (for example,0.005for a price of 0.00005 USD). -amountA formatted string representing the unit amount with sub-cent precision, including currency symbols. -minorUnitsAmountA number representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) with sub-cent precision (for example,0.5for half a cent). UnlikeunitAmount.minorUnitsAmount, this value can be a decimal. - unitLabelA label that represents the unit of this line item. SpecifyunitLabelin [productData.unit_label](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-unit_label) when creating the Checkout Session or when creating the Product's [unit_label](https://docs.stripe.com/api/products/object.md#product_object-unit_label) field. -descriptionAn arbitrary string attached to the object. Often useful for displaying to users. -nameThe item's name, meant to be displayable to users. -imagesAn array of image URLs for the line item. Specify [images](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-images) on the Product when creating the Checkout Session. -quantityThe quantity of products being purchased. -discountAmountsThe amount of discount calculated per discount for this line item. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -taxAmountsThe amount of tax calculated per tax rate for this line item. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -recurringThe recurring components of a price such asintervalandintervalCount. - intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -usageTypeOne oflicensedormetered. licensedautomatically bills the quantity set when adding it to a subscription.meteredaggregates the total usage based on usage records. -adjustableQuantityConfiguration for this item's quantity to be adjusted by the customer during checkout. -maximumThe maximum quantity the customer can purchase for the Checkout Session. -minimumThe minimum quantity the customer can purchase for the Checkout Session. -livemodeHas the valuetrueif the object exists in live mode or the valuefalseif the object exists in a sandbox. -minorUnitsAmountDivisorThe factor used to convert between minor and major currency units. This value represents the number of minor currency units per one major unit. For example, in USD, where cents are the minor unit, the divisor is 100. In JPY, which has no minor units, the divisor is 1. -nameCollectionNames collected from the customer. This value isnullif [name_collection](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-name_collection) is not configured on the Checkout Session. -individualNameThe customer's individual name. -businessNameThe customer's business name. -phoneNumberThe Customer's phone number. -recurringDetails about recurring payments set up by the Checkout Session. -intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -dueNextDetails about the next scheduled recurring payment. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -billingCycleAnchorA future Unix timestamp to anchor the subscription's billing cycle. The anchor is the reference point that aligns future billing cycle dates. If not present, the subscription starts immediately. -trialDetails about a free trial, if there is one. -trialEndUnix timestamp representing the end of the trial period the customer will get before being charged for the first time. -trialPeriodDaysInteger representing the number of trial period days before the customer is charged for the first time. -isProratedWhen true, the amount to be collected today is a prorated amount for a partial billing period, such as when using [billing_cycle_anchor](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-subscription_data-billing_cycle_anchor). -savedPaymentMethodsAn array of payment methods attached to the Customer. -idID of the PaymentMethod object -typeThe [type](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-type) of the PaymentMethod -billingDetailsBilling information associated with the PaymentMethod that may be used or required by particular types of payment methods. -emailEmail address. -phoneBilling phone number (including extension). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -cardIf this is acardPaymentMethod, this hash contains the user's card details. -brandThe brand to use when displaying the card, this accounts for customer's brand choice on dual-branded cards. Can be american_express, cartes_bancaires, diners_club, discover, eftpos_australia, interac, jcb, mastercard, union_pay, visa, or other and may contain more values in the future. -expMonthTwo-digit number representing the card's expiration month. -expYearFour-digit number representing the card's expiration year. -last4The last four digits of the card. -shippingThe selected shipping option, if any. -shippingOptionDetails of the selected shipping option. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -taxAmountsThe amount of tax calculated per tax rate for shipping costs. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -shippingAddressShipping address of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingOptionsThe list of shipping options that can be selected. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -statusStatus of the Checkout Session. -typeOne ofopen, expired, or complete. * open: The Checkout Session is still in progress. * expired: The Checkout Session has expired. No further processing will occur. * complete: The Checkout Session is complete. Payment processing may still be in progress. - paymentStatusOne ofpaid, unpaid, or no_payment_required. Only present when type=complete. * paid: The payment funds are available in your account. * unpaid: The payment funds are not yet available in your account. * no_payment_required: The payment is delayed to a future date, or the Checkout Session is in setup mode and doesn't require a payment at this time. - taxDetails about the tax computation status. -statusOne ofready, requires_shipping_address, or requires_billing_address. * ready: The final tax amount is computed, and the session is ready for confirmation. * requires_shipping_address: A shipping address must be provided to calculate tax. * requires_billing_address: A billing address must be provided to calculate tax. - automaticTaxDetails about the automatic tax settings of the Checkout Session. -enabledWhether automatic tax is enabled on the Checkout Session. The other fields in this hash arenullwhen automatic tax is disabled. -exemptOne ofnone, exempt, or reverse. This value is nullif automatic tax is disabled, or if the Customer hasn't provided enough address information to determine their tax exemption. *none: The Customer isn't exempt from tax. * exempt: The Customer is exempt from tax. * reverse: The Customer is subject to the [reverse charge mechanism](https://docs.stripe.com/tax/zero-tax.md#reverse-charges), so tax is accounted for by the Customer. - addressSourceOne ofbilling, shipping, or customer, indicating which address is used to calculate tax. This value is nullif automatic tax is disabled. *billing: Tax is calculated from the billing address collected during this Checkout Session. * shipping: Tax is calculated from the shipping address collected during this Checkout Session. * customer: Tax is calculated from the address saved on the Customer. - taxAmountsThe aggregate amounts calculated per tax rate for all line items. This value isnullif tax has not yet been computed, i.e. the Customer's address has not been collected yet. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -totalTax and discount details for the computed total amount. Use this field to render an amount breakdown to your customer, such as in an order summary. -subtotalThe total amount of line items, excluding tax, discounts, and shipping. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveThe sum of all [exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveThe sum of all [inclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -shippingRateThe sum of all shipping amounts. -amountA formatted string representing the total shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the total shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountThe sum of all the discounts. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts, tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -appliedBalanceTotal amount of [customer credit balance](https://docs.stripe.com/billing/customer/balance.md) to be applied to the payment. A positive number increases the amount to be paid, and a negative number decreases the amount to be paid. -amountA formatted string representing the applied customer balance amount, including currency symbols. -minorUnitsAmountAn integer representing the applied customer balance amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -balanceAppliedToNextInvoice When true, no payment will be collected immediately. Instead, the amount due will be added to the Customer's next invoice. This can happen when the amount due today is less than the [minimum chargeable amount](https://docs.stripe.com/currencies.md#minimum-and-maximum-charge-amounts). ### Example ```title Call useCheckoutElements hook ``` ## useCheckout > This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. *useCheckoutis deprecated. Use [useCheckoutElements](./use-checkout-elements.md) inside a [CheckoutElementsProvider](./checkout-provider.md), or [useCheckoutForm](./use-checkout-form.md) inside a [CheckoutFormProvider](./checkout-form-provider.md). The new hooks provide compile-time type safety for the actions available under each provider.* TheuseCheckouthook returns a disjoint union describing the loading state: *{type: "loading"}*{type: "error", error: { message: string }}*{type: "success", checkout: object }. Upon success, it returns a [Session object](./session-object.md) as well as actions to update the Checkout Session. ### Object properties - idThe ID of the Checkout Session. -billingAddressBilling details of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -businessNameThe business name as configured in the Business Public Details settings of your Stripe account. -canConfirmWhether the Checkout Session has collected enough data to confirm. Use this field to indicate to your customer if they can proceed, such as disabling the pay button. -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. Must be a [supported currency](https://docs.stripe.com/currencies.md). -currencyOptionsThe currency options available on the Checkout Session when using [Adaptive Pricing](https://docs.stripe.com/checkout/custom-checkout/adaptive-pricing.md). -amountA formatted string representing the total amount in the source currency, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the source currency in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -currencyConversionCurrency conversion details. This is only present for the customer currency. -fxRateThe exchange rate used to convert source currency amounts to customer currency amounts. -sourceCurrencyThe creation currency of the Checkout Session before localization. -discountAmountsThe aggregate amounts calculated per discount for all line items. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -emailThe Customer's email address. -lastPaymentErrorThe error encountered the last time the Checkout Session was confirmed. -messageAn error message to be displayed to the customer. -lineItemsA list of items the customer is purchasing. -idUnique identifier for the object. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal amount for this line item, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountThe amount representing the cost of a single unit of the item. -amountA formatted string representing the unit amount, including currency symbols. -minorUnitsAmountAn integer representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountDecimalThe unit amount of the line item in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal), with sub-cent precision. Use this field instead ofunitAmountwhen dealing with sub-cent pricing (for example, usage-based billing). For sub-cent prices,unitAmount.minorUnitsAmountrounds to0, so unitAmountDecimalpreserves the exact decimal value (for example,0.005for a price of 0.00005 USD). -amountA formatted string representing the unit amount with sub-cent precision, including currency symbols. -minorUnitsAmountA number representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) with sub-cent precision (for example,0.5for half a cent). UnlikeunitAmount.minorUnitsAmount, this value can be a decimal. - unitLabelA label that represents the unit of this line item. SpecifyunitLabelin [productData.unit_label](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-unit_label) when creating the Checkout Session or when creating the Product's [unit_label](https://docs.stripe.com/api/products/object.md#product_object-unit_label) field. -descriptionAn arbitrary string attached to the object. Often useful for displaying to users. -nameThe item's name, meant to be displayable to users. -imagesAn array of image URLs for the line item. Specify [images](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-images) on the Product when creating the Checkout Session. -quantityThe quantity of products being purchased. -discountAmountsThe amount of discount calculated per discount for this line item. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -taxAmountsThe amount of tax calculated per tax rate for this line item. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -recurringThe recurring components of a price such asintervalandintervalCount. - intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -usageTypeOne oflicensedormetered. licensedautomatically bills the quantity set when adding it to a subscription.meteredaggregates the total usage based on usage records. -adjustableQuantityConfiguration for this item's quantity to be adjusted by the customer during checkout. -maximumThe maximum quantity the customer can purchase for the Checkout Session. -minimumThe minimum quantity the customer can purchase for the Checkout Session. -livemodeHas the valuetrueif the object exists in live mode or the valuefalseif the object exists in a sandbox. -minorUnitsAmountDivisorThe factor used to convert between minor and major currency units. This value represents the number of minor currency units per one major unit. For example, in USD, where cents are the minor unit, the divisor is 100. In JPY, which has no minor units, the divisor is 1. -nameCollectionNames collected from the customer. This value isnullif [name_collection](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-name_collection) is not configured on the Checkout Session. -individualNameThe customer's individual name. -businessNameThe customer's business name. -phoneNumberThe Customer's phone number. -recurringDetails about recurring payments set up by the Checkout Session. -intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -dueNextDetails about the next scheduled recurring payment. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -billingCycleAnchorA future Unix timestamp to anchor the subscription's billing cycle. The anchor is the reference point that aligns future billing cycle dates. If not present, the subscription starts immediately. -trialDetails about a free trial, if there is one. -trialEndUnix timestamp representing the end of the trial period the customer will get before being charged for the first time. -trialPeriodDaysInteger representing the number of trial period days before the customer is charged for the first time. -isProratedWhen true, the amount to be collected today is a prorated amount for a partial billing period, such as when using [billing_cycle_anchor](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-subscription_data-billing_cycle_anchor). -savedPaymentMethodsAn array of payment methods attached to the Customer. -idID of the PaymentMethod object -typeThe [type](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-type) of the PaymentMethod -billingDetailsBilling information associated with the PaymentMethod that may be used or required by particular types of payment methods. -emailEmail address. -phoneBilling phone number (including extension). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -cardIf this is acardPaymentMethod, this hash contains the user's card details. -brandThe brand to use when displaying the card, this accounts for customer's brand choice on dual-branded cards. Can be american_express, cartes_bancaires, diners_club, discover, eftpos_australia, interac, jcb, mastercard, union_pay, visa, or other and may contain more values in the future. -expMonthTwo-digit number representing the card's expiration month. -expYearFour-digit number representing the card's expiration year. -last4The last four digits of the card. -shippingThe selected shipping option, if any. -shippingOptionDetails of the selected shipping option. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -taxAmountsThe amount of tax calculated per tax rate for shipping costs. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -shippingAddressShipping address of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingOptionsThe list of shipping options that can be selected. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -statusStatus of the Checkout Session. -typeOne ofopen, expired, or complete. * open: The Checkout Session is still in progress. * expired: The Checkout Session has expired. No further processing will occur. * complete: The Checkout Session is complete. Payment processing may still be in progress. - paymentStatusOne ofpaid, unpaid, or no_payment_required. Only present when type=complete. * paid: The payment funds are available in your account. * unpaid: The payment funds are not yet available in your account. * no_payment_required: The payment is delayed to a future date, or the Checkout Session is in setup mode and doesn't require a payment at this time. - taxDetails about the tax computation status. -statusOne ofready, requires_shipping_address, or requires_billing_address. * ready: The final tax amount is computed, and the session is ready for confirmation. * requires_shipping_address: A shipping address must be provided to calculate tax. * requires_billing_address: A billing address must be provided to calculate tax. - automaticTaxDetails about the automatic tax settings of the Checkout Session. -enabledWhether automatic tax is enabled on the Checkout Session. The other fields in this hash arenullwhen automatic tax is disabled. -exemptOne ofnone, exempt, or reverse. This value is nullif automatic tax is disabled, or if the Customer hasn't provided enough address information to determine their tax exemption. *none: The Customer isn't exempt from tax. * exempt: The Customer is exempt from tax. * reverse: The Customer is subject to the [reverse charge mechanism](https://docs.stripe.com/tax/zero-tax.md#reverse-charges), so tax is accounted for by the Customer. - addressSourceOne ofbilling, shipping, or customer, indicating which address is used to calculate tax. This value is nullif automatic tax is disabled. *billing: Tax is calculated from the billing address collected during this Checkout Session. * shipping: Tax is calculated from the shipping address collected during this Checkout Session. * customer: Tax is calculated from the address saved on the Customer. - taxAmountsThe aggregate amounts calculated per tax rate for all line items. This value isnullif tax has not yet been computed, i.e. the Customer's address has not been collected yet. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -totalTax and discount details for the computed total amount. Use this field to render an amount breakdown to your customer, such as in an order summary. -subtotalThe total amount of line items, excluding tax, discounts, and shipping. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveThe sum of all [exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveThe sum of all [inclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -shippingRateThe sum of all shipping amounts. -amountA formatted string representing the total shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the total shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountThe sum of all the discounts. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts, tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -appliedBalanceTotal amount of [customer credit balance](https://docs.stripe.com/billing/customer/balance.md) to be applied to the payment. A positive number increases the amount to be paid, and a negative number decreases the amount to be paid. -amountA formatted string representing the applied customer balance amount, including currency symbols. -minorUnitsAmountAn integer representing the applied customer balance amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -balanceAppliedToNextInvoiceWhen true, no payment will be collected immediately. Instead, the amount due will be added to the Customer's next invoice. This can happen when the amount due today is less than the [minimum chargeable amount](https://docs.stripe.com/currencies.md#minimum-and-maximum-charge-amounts). ### Example ```title Call useCheckout hook ``` ## Apply a promotion codeapplyPromotionCode(promotionCode: string)Use this method to apply a promotion code that your customer enters. -promotionCodeThe promotion code to apply to the Checkout Session. ### Example ```title Apply a promotion code ``` ## Remove a promotion coderemovePromotionCode()Use this method to remove the currently applied promotion code, if applicable. ### Example ```title Remove a promotion code ``` ## Update the Customer's shipping addressupdateShippingAddress(shippingAddress: nullable object)Use this method to update the Customer's shipping address. If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the shipping address is collected directly from the wallet and the value set byupdateShippingAddressis not used for express checkout payments. -shippingAddressNew shipping address for the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. ### Example ```title Update the Customer's shipping address ``` ## Update the Customer's billing addressupdateBillingAddress(billingAddress: nullable object)Use this method to update the Customer's billing address. If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the billing address is collected directly from the wallet and the value set byupdateBillingAddressis not used for express checkout payments. -billingAddressNew billing information for the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. ### Example ```title Update the Customer's billing address ``` ## Update the Customer's email addressupdateEmail(email: nullable string)Use this method to update the Customer's email address. If your integration uses [Link](https://docs.stripe.com/payments/link.md) and you do not provide an email during Checkout Session creation, you must callupdateEmailfor Link to appear as a payment option for returning users (Link is also known as Onelink in the UK). If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the email address is collected directly from the wallet and the value set byupdateEmailis not used for express checkout payments. -emailThe Customer's email address. ### Example ```title Update the Customer's email address ``` ## Update the Customer's phone numberupdatePhoneNumber(phoneNumber: nullable string)Use this method to update the Customer's phone number. If your integration uses the [Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md), the phone number is collected directly from the wallet and the value set byupdatePhoneNumberis not used for express checkout payments. -phoneNumberThe Customer's phone number. ### Example ```title Update the Customer's phone number ``` ## Update the Customer's business nameupdateBusinessName(businessName: nullable string)Use this method to update the Customer's business name whenname_collection.business.enabledistrueon the Checkout Session. If the [Tax ID Element](./create-tax-id-element.md) is mounted with the business name field shown, callingconfirm()throws anIntegrationErrorbecause the Tax ID Element collects the business name directly. To useupdateBusinessName()instead, setfields.businessName: "never"when creating the Tax ID Element. -businessNameThe Customer's business name. ### Example ```title Update the Customer's business name ``` ## Update the Customer's individual nameupdateIndividualName(individualName: nullable string)Use this method to update the Customer's individual name whenname_collection.individual.enabledistrueon the Checkout Session. -individualNameThe Customer's individual name. ### Example ```title Update the Customer's individual name ``` ## Update the Customer's business name and tax IDupdateTaxIdInfo(taxIdInfo?: )Use this method to update the Customer's business name and tax ID. -taxIdInfoThe Customer's tax ID information including the business name and tax ID. -businessNameThe Customer's business name. -taxIdThe Customer's tax ID. -typeOne of [the supported tax ID types](./tax-ids.md) -valueThe value of the tax ID. ### Example ```title Update the Customer's business name and tax ID ``` ## Update line item quantitiesupdateLineItemQuantity(options: object)Use this method to change the quantity of a line item. -optionsOptions forupdateLineItemQuantity. - lineItemThe [ID](./session-object.md) of the line item to update. -quantityThe new quantity of the line item. ### Example ```title Update line item quantities ``` ## Update the selected shipping optionupdateShippingOption(shippingOption?: string)Use this method to update the selected shipping option. See [shippingOptions](./session-object.md) for a list of the available shipping options. -shippingOptionThe [ID](./session-object.md) of the shipping option to select. ### Example ```title Update the selected shipping option ``` ## Confirm the Checkout Sessionconfirm(options?: object)Use this method to confirm the Checkout Session. You must either read [total.total.amount](./session-object.md) or each of [total.total.minorUnitsAmount](./session-object.md) and [currency](./session-object.md) and [minorUnitsAmountDivisor](./session-object.md) from the checkout object and display in your UI, otherwise an error will be thrown. This helps keep your checkout page in sync as the Checkout Session updates, including adding future Stripe features, with minimal UI code changes. -optionsOptions forconfirm. - returnUrlThe URL to redirect your customer to after they authenticate or cancel their payment on the payment method’s app or site. This parameter is only required if you didn't specify thereturn_urlwhen creating the Checkout Session. -paymentMethodThe ID of a previously collected [PaymentMethod](https://docs.stripe.com/api/payment_methods/object.md) to use for confirmation. When this option is provided, Custom Checkout will ignore the payment method collected by the PaymentElement and attempt confirmation using the provided PaymentMethod. -savePaymentMethodWhether your Customer has provided consent to save the payment method for future purchases. Learn how to [save payment methods](https://docs.stripe.com/checkout/custom-checkout/save-payment-methods-checkout.md). -redirectBy default,confirmwill always redirect to yourreturnUrlafter a successful confirmation. If you setredirect: "if_required", then confirmwill only redirect if your user chooses a redirect-based payment method. -emailThe Customer's email address. If provided, this value overrides any values previously set using [updateEmail](./update-email.md). -phoneNumberThe Customer's phone number. If provided, this value overrides any values previously set using [updatePhoneNumber](./update-phone-number.md). -billingAddressThe Customer's billing address. If provided, this value overrides any values previously set using [updateBillingAddress](./update-billing-address.md). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingAddressThe Customer's shipping address. If provided, this value overrides any values previously set using [updateShippingAddress](./update-shipping-address.md). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -expressCheckoutConfirmEventThe [event object](./express-checkout-element-confirm-event.md) passed to your Express Checkout Elementconfirmhandler. -formConfirmEventThe [event object](./on-confirm.md) passed to your Embedded formconfirmhandler. ### Example ```title Confirm the Checkout Session ``` ## Validate ElementsvalidateElements()Use this method to validate all mounted Elements without confirming the Checkout Session. This is useful for multi-step checkout flows where you want to validate user input before advancing to the next step. This method doesn't verify that the Checkout Session can be confirmed. To check whether all required fields are present, use the [Session'scanConfirmfield](./session-object.md). ### Example ```title Validate Elements ``` ## Run server updaterunServerUpdate(userFunction: function)Use this method to wrap an async function that makes a request to your server to update the Checkout Session. >runServerUpdateenforces a 20-second timeout for your update function. If your function doesn't resolve within 20 seconds,runServerUpdatereturns an error. WraprunServerUpdatecalls intry/catchblocks to handle any errors. -userFunctionAn async function to make a request to your server to update the Checkout Session. ### Example ```title Run server update ``` ## PaymentElement Use thePaymentElementfrom@the relevant part of the productto collect payment details for more than [40 payment methods](https://docs.stripe.com/docs/payments/payment-methods/integration-options.md) from around the globe. The component must be rendered inside a [CheckoutElementsProvider](./checkout-provider.md). ### Props -idSets the DOMidattribute on the rendered Element container. Use this to target the Element for styling or testing. -classNameApplies custom CSS classes to the Element container. -optionsPayment Element initialization options. -fieldsBy default, the Payment Element collects only the necessary billing details to complete a payment. To collect billing details outside of the Payment Element, use thefieldsoption to disable Payment Element collection of certain fields. You can setbillingDetailsat the top level to apply the same field collection settings to all payment methods, or setbillingDetailsunder a supported payment method type to override the top-level setting for that payment method. -billingDetailsSpecifyneverto avoid collecting all [billing details](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-billing_details) in the Payment Element. If you would like to disable only certain billing details, pass an object specifying which fields you would like to disable collection for. The default setting for each field or object isauto. - nameSpecifyalwaysto require the Payment Element to collect the customer's billing name. -emailSpecifyneverto avoid collecting email in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.email=neverandwalletOptions.emailRequired=true, email is still collected from wallets. - phoneSpecifyneverto avoid collecting phone in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.phone=neverandwalletOptions.phoneNumberRequired=true, phone is still collected from wallets. - addressSpecifyif_requiredto only collect the minimum billing address fields required to complete the payment. You can omit and hide optional address fields in the card form, such as country and postal code. Unlike theneveroption, you don't need to include fields omitted in the Payment Element when confirming the payment. This can reduce the amount of information required to complete the form. Disabling address collection can negatively impact authorization rates and network fees for users on a network cost plus pricing plan. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -postalCodeThe postal code or ZIP code, also known as PIN code in India. -[paymentMethodType]Optionally specify the billing detail collection settings for any Payment Element payment method type. Examples of valid values arecard, klarna, or us_bank_account. You can include one or more payment method type keys. - billingDetailsSpecifyneverto avoid collecting all [billing details](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-billing_details) in the Payment Element. If you would like to disable only certain billing details, pass an object specifying which fields you would like to disable collection for. The default setting for each field or object isauto. - nameSpecifyalwaysto require the Payment Element to collect the customer's billing name. -emailSpecifyneverto avoid collecting email in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.email=neverandwalletOptions.emailRequired=true, email is still collected from wallets. - phoneSpecifyneverto avoid collecting phone in the Payment Element. Note that this parameter is independent of [walletOptions](./create-payment-element.md), so if you setfields.billingDetails.phone=neverandwalletOptions.phoneNumberRequired=true, phone is still collected from wallets. - addressSpecifyif_requiredto only collect the minimum billing address fields required to complete the payment. You can omit and hide optional address fields in the card form, such as country and postal code. Unlike theneveroption, you don't need to include fields omitted in the Payment Element when confirming the payment. This can reduce the amount of information required to complete the form. Disabling address collection can negatively impact authorization rates and network fees for users on a network cost plus pricing plan. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -postalCodeThe postal code or ZIP code, also known as PIN code in India. -layout Specify the layout for the Payment Element. If you only pass a layout type ('accordion'or‘tabs’) without any additional parameters, the Payment Element renders using that layout and the default values associated with it. An object can also be passed to specify the layout with additional configuration. - typeDefines the layout to render the Payment Element. -defaultCollapsedControls if the Payment Element renders in a collapsed state (where no payment method is selected by default). When you leave thisundefined, Stripe renders the experience that it determines will have the best conversion. - radiosControls when to render each Payment Method with a radio input next to its logo. The radios visually indicate the current selection of the Payment Element. Defaults to'auto'. - 'always'— Always show radio inputs. -'never'— Never show radio inputs. -'if_multiple'— Show radio inputs only when there are multiple payment methods available. When there is only one payment method, no radio input is displayed. -'auto'— Stripe determines the best experience to optimize conversion. _This property is only applicable to theaccordionlayout._ -spacedAccordionItemsWhentrue, the Payment Methods render as standalone buttons with space in between them. _This property is only applicable to the accordionlayout._ -visibleAccordionItemsCountSets the max number of Payment Methods visible before using the "More" button to hide additional Payment Methods. Set this value to0to disable the "More" button and render all available Payment Methods. Default is5. _This property is only applicable to the accordionlayout._ -paymentMethodLogoPositionSets the position of the payment method logo in each accordion item. Default isstart. _This property is only applicable to the accordionlayout._ -paymentMethodOrderBy default, the Payment Element will use a dynamic ordering that optimizes payment method display for each user. You can override the default order in which payment methods are displayed in the Payment Element with a list of payment method types. If the associated Checkout Session has payment method types not specified inpaymentMethodOrder, they will be displayed after the payment methods you specify. If you specify payment method types not on the associated PaymentIntent, they will be ignored. - readOnlyApplies a read-only state to the Payment Element so that payment details can’t be changed. Default is false. Enabling thereadOnlyoption doesn't change the Payment Element's visual appearance. If you want to adjust the way the Payment Element looks, use the [Appearance API](https://docs.stripe.com/elements/appearance-api.md). -termsControl how mandates or other legal agreements are displayed in the Payment Element. Useneverto never display legal agreements. The default setting isauto, which causes legal agreements to only be shown when necessary. Consult your legal and compliance advisors before making any changes to the text of mandates or legal agreements. You can't use the termsoption to violate obligations under your Stripe agreement, Stripe policies, applicable laws or scheme rules. -applePay-auBecsDebit-bancontact-card-cashapp-googlePay-ideal-paypal-sepaDebit-sofort-usBankAccount-walletsBy default, the Payment Element will display all the payment methods that the underlying Checkout Session was created with. However, wallets like Apple Pay and Google Pay are not payment methods per the Checkout Session API. They will show when the Checkout Session has thecardpayment method and the customer is using a supported platform and have an active card in their account. This is theautobehavior, and it is the default for choice for all wallets. If you do not want to show a given wallet as a payment option, you can set its property inwalletstonever. - applePay-googlePay-link-walletOptionsOptions to control the information collected from the customer when paying with a wallet payment method. -emailRequiredCollect the customer's email from wallet payment methods by setting this option to true. -phoneNumberRequiredCollect the customer's phone number from wallet payment methods by setting this option to true. PayPal doesn't provide a phone number, even when this option is set to true. Google Pay makes a best effort to return the phone number registered to the wallet, but doesn't guarantee it will be provided in all cases. Link makes a best effort to return the phone number registered to the wallet, but doesn't guarantee it will be provided in all cases. -onChangeCallback called when any value in the [change event payload](https://docs.stripe.com/js/element/events/on_change?type=paymentElement.md#element_on_change-handler) changes. -onReadyCallback called once the Element is fully rendered. Recieves the [ready event payload](./on-ready.md). -onBlurCallback called when the Element loses focus. -onFocusCallback called when the Element receives focus. -onEscapeCallback called when the escape key is pressed within the Element. -onLoaderStartCallback called right before Stripe displays the Element skeleton loader. Receives the Element instance as its only argument. -onLoadErrorCallback called when the Element fails to load. ### Example ```title Render PaymentElement ``` ## ExpressCheckoutElement Use theExpressCheckoutElementfrom@the relevant part of the productto accept payments through one-click payment buttons. The component must be rendered inside a [CheckoutElementsProvider](./checkout-provider.md). ### Props -idSets the DOMidattribute on the rendered Element container. Use this to target the Element for styling or testing. -classNameApplies custom CSS classes to the Element container. -optionsExpress Checkout Element initialization options. -buttonHeightBy default, the height of the buttons are 44px. You can override this to specify a custom button height in the range of 40px-55px. -buttonThemeSpecify the preferred button theme to use. By default, Elements determines the themes based on the specified [appearance option](./create.md). -applePay-googlePay-paypal-klarna-buttonTypeSpecify the preferred button type to display. -applePayDefault isplain. - googlePayDefault isbuy. - paypalDefault ispaypal. - klarnaDefault ispay. - layoutSpecify how the buttons are arranged in a grid-like layout in the Express Checkout Element. Elements determines the layout by using certain factors, such as available space, number of buttons, and the definedlayoutobject. -maxColumnsDefines the maximum number of columns the Express Checkout Element can use to render. Default is0, meaning unlimited. - maxRowsDefines the maximum number of rows the Express Checkout Element can use to render. Default is0, meaning unlimited. - overflowSpecify whether or not to always hide the overflow menu or allow Elements to determine when to show the overflow menu. Default isauto. You can't specify both overflow: 'never'and setmaxRowsto a number greater than 0. -paymentMethodOrderBy default, the Express Checkout 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 Express Checkout Element with a list of payment method types. If there are payment methods that will show that are not specified inpaymentMethodOrder, they display after the payment methods you specify. If you specify payment methods that will not show, they are ignored. - paymentMethodsIn addition to your Dashboard configuration, the CheckoutSession configuration also influences the availability of payment methods in the Express Checkout Element. By default, it displays all available payment methods based on both configurations. When setting the paymentMethods option, the Express Checkout Element merges your specified options with the default logic to determine the final set of payment methods displayed. -amazonPay-applePayApple Pay has additional configurations that determine when Stripe can show it. By default, Apple Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Apple Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. Apple Pay on non-Safari desktop browsers is only supported when its property in paymentMethodsis set toalways. - googlePayGoogle Pay has additional configurations that determine when Stripe can show it. By default, Google Pay shows when the customer is using a supported platform and when we determine it's advantageous for your conversion. This is theautobehavior. If you want to always show Google Pay when the customer is using a supported platform, you can set its property inpaymentMethodstoalways. - link-paypal-onConfirmTriggered when the Element fires a confirm event. Use this to handle payment confirmation. -onCancelThecancelevent is triggered when the payment interface is dismissed (e.g. the customer closes it). Note that in some browsers, the payment interface might be dismissed by the customer even after they authorize the payment. This means that you might receive acancelevent after receiving aconfirmevent. If you're using thecancelevent as a hook for canceling the customer's order, make sure you also refund the payment that you just created. The following Checkout Elements support thecancelevent:expressCheckoutElementandcheckoutForm. - onReadyCallback called once the Element is fully rendered. Recieves the [ready event payload](./on-ready.md). -onBlurCallback called when the Element loses focus. -onFocusCallback called when the Element receives focus. -onEscapeCallback called when the escape key is pressed within the Element. -onLoadErrorCallback called when the Element fails to load. ### Example ```title Render ExpressCheckoutElement ``` ## ContactDetailsElement Use theContactDetailsElementfrom@the relevant part of the productto collect your customer's email address and help them sign in to Link. The component must be rendered inside a [CheckoutElementsProvider](./checkout-provider.md). ### Props -idSets the DOMidattribute on the rendered Element container. Use this to target the Element for styling or testing. -classNameApplies custom CSS classes to the Element container. -onChangeCallback called when any value in the [change event payload](https://docs.stripe.com/js/element/events/on_change?type=paymentElement.md#element_on_change-handler) changes. -onReadyCallback called once the Element is fully rendered. Recieves the [ready event payload](./on-ready.md). -onBlurCallback called when the Element loses focus. -onFocusCallback called when the Element receives focus. -onEscapeCallback called when the escape key is pressed within the Element. -onLoaderStartCallback called right before Stripe displays the Element skeleton loader. Receives the Element instance as its only argument. -onLoadErrorCallback called when the Element fails to load. ### Example ```title Render ContactDetailsElement ``` ## BillingAddressElement Use theBillingAddressElementfrom@the relevant part of the productto render and update the billing address on the current [Checkout Session](https://docs.stripe.com/api/checkout/sessions/object.md). The component must be rendered inside a [CheckoutElementsProvider](./checkout-provider.md). ### Props -idSets the DOMidattribute on the rendered Element container. Use this to target the Element for styling or testing. -classNameApplies custom CSS classes to the Element container. -optionsBilling Address Element initialization options. -contactsAn array of objects that can be displayed as saved addresses in the Billing Address Element. The first contact is automatically selected. -nameThe name of the contact. This might be a person, or a business name. -addressThe address of the contact. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -postal_codeThe postal code or ZIP code, also known as PIN code in India. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -phoneThe phone number of the contact. -displayYou can customize how certain fields are displayed. -nameBy default, the Billing Address Element displays a full name field. Specify 'split' to display a first name field and a last name field. Specify 'organization' to display an organization field. -autocompleteBy default, the Address Element will have autocomplete enabled with Stripe provided Google Maps API key for certain countries if any of the following condition is met: * If Payment Element is mounted in the same elements group as Address Element in a single page application. * If the Address Element is used in an active Link session (Link is also known as Onelink in the UK). [Contact Legal before editing or deleting the Google Maps autocomplete callout]: # By using autocomplete, you agree to comply with the [Google Maps Platform Acceptable Use Policy](https://cloud.google.com/maps-platform/terms/aup). If you violate this policy, we might disable autocomplete, or take any other action as necessary. You can customize the autocomplete setting with this option. -modeSpecifydisabledto disable autocomplete in the Address Element. Specifygoogle_maps_apito enable [Google Maps API](https://developers.google.com/maps/documentation/javascript/places) with your own key. It will only be used when Stripe provided Google Maps API key is not available. The default setting isautomatic, where we'll support autocomplete when possible. - apiKeySpecify your own [Google Maps API key](https://developers.google.com/maps/documentation/javascript/places#add-places-api-to-the-api-keys-api-restrictions-list) with it. **Only needs to be passed in whenautocomplete.modeis set togoogle_maps_api.** - onChangeCallback called when any value in the [change event payload](https://docs.stripe.com/js/element/events/on_change?type=addressElement.md#element_on_change-handler) changes. -onReadyCallback called once the Element is fully rendered. Recieves the [ready event payload](./on-ready.md). -onBlurCallback called when the Element loses focus. -onFocusCallback called when the Element receives focus. -onEscapeCallback called when the escape key is pressed within the Element. -onLoaderStartCallback called right before Stripe displays the Element skeleton loader. Receives the Element instance as its only argument. -onLoadErrorCallback called when the Element fails to load. ### Example ```title Render BillingAddressElement ``` ## ShippingAddressElement Use theShippingAddressElementfrom@the relevant part of the productto render and update the shipping address on the current [Checkout Session](https://docs.stripe.com/api/checkout/sessions/object.md). The component must be rendered inside a [CheckoutElementsProvider](./checkout-provider.md). ### Props -idSets the DOMidattribute on the rendered Element container. Use this to target the Element for styling or testing. -classNameApplies custom CSS classes to the Element container. -optionsShipping Address Element initialization options. -contactsAn array of objects that can be displayed as saved addresses in the Shipping Address Element. The first contact is automatically selected. -nameThe name of the contact. This might be a person, or a business name. -addressThe address of the contact. -line1-line2-cityThe name of a city, town, village, etc. -stateThe most coarse subdivision of a country. Depending on the country, this might correspond to a state, a province, an oblast, a prefecture, or something else along these lines. -postal_codeThe postal code or ZIP code, also known as PIN code in India. -countryTwo-letter country code, capitalized. Valid two-letter country codes are specified by the related setting alpha-2. -phoneThe phone number of the contact. -displayYou can customize how certain fields are displayed. -nameBy default, the Shipping Address Element displays a full name field. Specify 'split' to display a first name field and a last name field. Specify 'organization' to display an organization field. -autocompleteBy default, the Address Element will have autocomplete enabled with Stripe provided Google Maps API key for certain countries if any of the following condition is met: * If Payment Element is mounted in the same elements group as Address Element in a single page application. * If the Address Element is used in an active Link session (Link is also known as Onelink in the UK). [Contact Legal before editing or deleting the Google Maps autocomplete callout]: # By using autocomplete, you agree to comply with the [Google Maps Platform Acceptable Use Policy](https://cloud.google.com/maps-platform/terms/aup). If you violate this policy, we might disable autocomplete, or take any other action as necessary. You can customize the autocomplete setting with this option. -modeSpecifydisabledto disable autocomplete in the Address Element. Specifygoogle_maps_apito enable [Google Maps API](https://developers.google.com/maps/documentation/javascript/places) with your own key. It will only be used when Stripe provided Google Maps API key is not available. The default setting isautomatic, where we'll support autocomplete when possible. - apiKeySpecify your own [Google Maps API key](https://developers.google.com/maps/documentation/javascript/places#add-places-api-to-the-api-keys-api-restrictions-list) with it. **Only needs to be passed in whenautocomplete.modeis set togoogle_maps_api.** - onChangeCallback called when any value in the [change event payload](https://docs.stripe.com/js/element/events/on_change?type=addressElement.md#element_on_change-handler) changes. -onReadyCallback called once the Element is fully rendered. Recieves the [ready event payload](./on-ready.md). -onBlurCallback called when the Element loses focus. -onFocusCallback called when the Element receives focus. -onEscapeCallback called when the escape key is pressed within the Element. -onLoaderStartCallback called right before Stripe displays the Element skeleton loader. Receives the Element instance as its only argument. -onLoadErrorCallback called when the Element fails to load. ### Example ```title Render ShippingAddressElement ``` ## CurrencySelectorElement Use theCurrencySelectorElementfrom@the relevant part of the productto allow customers to select the currency for their payment. The component must be rendered inside a [CheckoutElementsProvider](./checkout-provider.md). ### Props -idSets the DOMidattribute on the rendered Element container. Use this to target the Element for styling or testing. -classNameApplies custom CSS classes to the Element container. -onReadyCallback called once the Element is fully rendered. Recieves the [ready event payload](./on-ready.md). -onBlurCallback called when the Element loses focus. -onFocusCallback called when the Element receives focus. -onEscapeCallback called when the escape key is pressed within the Element. -onLoaderStartCallback called right before Stripe displays the Element skeleton loader. Receives the Element instance as its only argument. -onLoadErrorCallback called when the Element fails to load. ### Example ```title Render CurrencySelectorElement ``` ## TaxIdElement Use theTaxIdElementfrom@the relevant part of the productto collect tax ID information from your customers, including business name and tax identification number. The component must be rendered inside a [CheckoutElementsProvider](./checkout-provider.md). > This feature requires thecustom_checkout_tax_id_1beta. To use it, passbetas: ['custom_checkout_tax_id_1']when initializing Stripe.js vialoadStripe. ### Props - idSets the DOMidattribute on the rendered Element container. Use this to target the Element for styling or testing. -classNameApplies custom CSS classes to the Element container. -optionsTax ID Element initialization options. -visibilityBy default, the Tax ID Element displays when the user is in a country that supports tax ID collection. Specifyalwaysto display the element regardless of the user's country. Specifyneverto hide the element completely. Whenname_collection.business.enabledistrueon the Checkout Session andvisibilityisauto, the element displays regardless of the user's country. In countries that do not support tax ID collection, only the business name field shows. - fieldsBy default, the Tax ID Element collects all tax ID information. If it's not necessary for you to collect all fields, you can disable Tax ID Element collection of certain fields with thefieldsoption. -businessNameSpecifyalwaysto collect the business name. Specifyneverto not collect the business name. Default isauto. When name_collection.business.enabledistrueon the Checkout Session, setting this toneversignals that you are collecting the business name through your own input viaupdateBusinessName()instead. -validationBy default, the Tax ID Element will enforce preset validation for each field. You can customize the settings by using this option. -businessName-requiredSpecifyalwaysto make business name a required field. Specifyneverto make business name an optional field. Default isauto. When name_collection.business.enabledistrueon the Checkout Session andname_collection.business.optionalisfalse, the SDK overrides this to alwaysregardless of what you set here. -taxId-requiredSpecifyalwaysto make tax ID a required field. Specifyneverto make tax ID an optional field. Default isauto. - verificationConfigure real-time tax ID verification. Requires thecustom_checkout_tax_id_verification_1beta. To use it, passbetas: ['custom_checkout_tax_id_1', 'custom_checkout_tax_id_verification_1']when initializing Stripe.js -taxId-modeSpecifyif_supportedto enable real-time tax ID verification for supported tax ID types. Specifyneverto disable verification. Default isnever. - onChangeCallback called when any value in the [change event payload](https://docs.stripe.com/js/element/events/on_change?type=taxIdElement.md#element_on_change-handler) changes. -onReadyCallback called once the Element is fully rendered. Recieves the [ready event payload](./on-ready.md). -onBlurCallback called when the Element loses focus. -onFocusCallback called when the Element receives focus. -onEscapeCallback called when the escape key is pressed within the Element. -onLoaderStartCallback called right before Stripe displays the Element skeleton loader. Receives the Element instance as its only argument. -onLoadErrorCallback called when the Element fails to load. ### Example ```title Render TaxIdElement ``` ## Using the Embedded form provider > This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. Build your Stripe integration using React and the [embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form), a single unified form that bundles payment, address, and other elements. See [build an integration with an embedded form](https://docs.stripe.com/checkout/form/quickstart.md) for steps on using the embedded form with the Checkout Sessions API. The following React components and hooks are available to use as part of your integration. ## CheckoutFormProvider > This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. TheCheckoutFormProvidercomponent wraps your React tree for the [embedded form integration](https://docs.stripe.com/elements/embeddable-payment-form.md). It initializes the Embedded form SDK and provides it in a context so nested components can render theCheckoutFormcomponent and access session data. To useCheckoutFormProvider, call loadStripefrom@stripe/stripe-jswith your publishable key. TheloadStripefunction asynchronously loads the Stripe.js script and initializes a Stripe object. Pass the returnedPromisetoCheckoutFormProvideralong with the [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) of your Checkout Session. ### Props -stripeA [Stripe object](./initializing.md) or aPromiseresolving to a Stripe object. The easiest way to initialize a Stripe object is with the [Stripe.js wrapper module](https://github.com/stripe/stripe-js/blob/master/README.md#readme). After this prop has been set, it can not be changed. -optionsOptions forCheckoutFormProvider. - clientSecretThe Checkout Session [client secret](https://docs.stripe.com/api/checkout/sessions/object.md#checkout_session_object-client_secret) or a promise that resolves to the client secret. -appearanceMatch the design of your site with the [appearance option](https://docs.stripe.com/elements/appearance-api.md). The layout stays consistent, but you can modify colors, fonts, borders, padding, and more. Note: the embedded form doesn't supportrules. - loaderDisplay skeleton loader UI while waiting for the embedded form to fully load after it's mounted. Default is'auto'(Stripe determines whether or not to show a loader UI). -fontsAn array of custom fonts that the embedded form can use. You can specify fonts as [CssFontSource](#css_font_source_object) or [CustomFontSource](#custom_font_source_object) objects. -savedPaymentMethodOptions to configure what the embedded form displays when used to [save payment details during payment](https://docs.stripe.com/payments/checkout/save-during-payment.md). -enableRedisplayToggle if the embedded form redisplays Customer saved Payment Methods. Default is'auto'. - enableSaveToggle if the embedded form collects consent to save a customer's payment methods. Default is'auto'. ### Example ```title Mount CheckoutFormProvider ``` ## useCheckoutForm > This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. The useCheckoutFormhook returns a disjoint union describing the loading state: *{type: "loading"}*{type: "error", error: { message: string }}*{type: "success", checkout: object }. Upon success, it returns a [Session object](./session-object.md) as well as actions to update the Checkout Session. Use useCheckoutForminside a [CheckoutFormProvider](./checkout-form-provider.md). For [CheckoutElementsProvider](./checkout-provider.md) integrations, use [useCheckoutElements](./use-checkout-elements.md) instead. ### Object properties -idThe ID of the Checkout Session. -billingAddressBilling details of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -businessNameThe business name as configured in the Business Public Details settings of your Stripe account. -canConfirmWhether the Checkout Session has collected enough data to confirm. Use this field to indicate to your customer if they can proceed, such as disabling the pay button. -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. Must be a [supported currency](https://docs.stripe.com/currencies.md). -currencyOptionsThe currency options available on the Checkout Session when using [Adaptive Pricing](https://docs.stripe.com/checkout/custom-checkout/adaptive-pricing.md). -amountA formatted string representing the total amount in the source currency, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the source currency in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -currencyConversionCurrency conversion details. This is only present for the customer currency. -fxRateThe exchange rate used to convert source currency amounts to customer currency amounts. -sourceCurrencyThe creation currency of the Checkout Session before localization. -discountAmountsThe aggregate amounts calculated per discount for all line items. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -emailThe Customer's email address. -lastPaymentErrorThe error encountered the last time the Checkout Session was confirmed. -messageAn error message to be displayed to the customer. -lineItemsA list of items the customer is purchasing. -idUnique identifier for the object. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal amount for this line item, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountThe amount representing the cost of a single unit of the item. -amountA formatted string representing the unit amount, including currency symbols. -minorUnitsAmountAn integer representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountDecimalThe unit amount of the line item in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal), with sub-cent precision. Use this field instead ofunitAmountwhen dealing with sub-cent pricing (for example, usage-based billing). For sub-cent prices,unitAmount.minorUnitsAmountrounds to0, so unitAmountDecimalpreserves the exact decimal value (for example,0.005for a price of 0.00005 USD). -amountA formatted string representing the unit amount with sub-cent precision, including currency symbols. -minorUnitsAmountA number representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) with sub-cent precision (for example,0.5for half a cent). UnlikeunitAmount.minorUnitsAmount, this value can be a decimal. - unitLabelA label that represents the unit of this line item. SpecifyunitLabelin [productData.unit_label](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-unit_label) when creating the Checkout Session or when creating the Product's [unit_label](https://docs.stripe.com/api/products/object.md#product_object-unit_label) field. -descriptionAn arbitrary string attached to the object. Often useful for displaying to users. -nameThe item's name, meant to be displayable to users. -imagesAn array of image URLs for the line item. Specify [images](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-images) on the Product when creating the Checkout Session. -quantityThe quantity of products being purchased. -discountAmountsThe amount of discount calculated per discount for this line item. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -taxAmountsThe amount of tax calculated per tax rate for this line item. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -recurringThe recurring components of a price such asintervalandintervalCount. - intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -usageTypeOne oflicensedormetered. licensedautomatically bills the quantity set when adding it to a subscription.meteredaggregates the total usage based on usage records. -adjustableQuantityConfiguration for this item's quantity to be adjusted by the customer during checkout. -maximumThe maximum quantity the customer can purchase for the Checkout Session. -minimumThe minimum quantity the customer can purchase for the Checkout Session. -livemodeHas the valuetrueif the object exists in live mode or the valuefalseif the object exists in a sandbox. -minorUnitsAmountDivisorThe factor used to convert between minor and major currency units. This value represents the number of minor currency units per one major unit. For example, in USD, where cents are the minor unit, the divisor is 100. In JPY, which has no minor units, the divisor is 1. -nameCollectionNames collected from the customer. This value isnullif [name_collection](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-name_collection) is not configured on the Checkout Session. -individualNameThe customer's individual name. -businessNameThe customer's business name. -phoneNumberThe Customer's phone number. -recurringDetails about recurring payments set up by the Checkout Session. -intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -dueNextDetails about the next scheduled recurring payment. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -billingCycleAnchorA future Unix timestamp to anchor the subscription's billing cycle. The anchor is the reference point that aligns future billing cycle dates. If not present, the subscription starts immediately. -trialDetails about a free trial, if there is one. -trialEndUnix timestamp representing the end of the trial period the customer will get before being charged for the first time. -trialPeriodDaysInteger representing the number of trial period days before the customer is charged for the first time. -isProratedWhen true, the amount to be collected today is a prorated amount for a partial billing period, such as when using [billing_cycle_anchor](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-subscription_data-billing_cycle_anchor). -savedPaymentMethodsAn array of payment methods attached to the Customer. -idID of the PaymentMethod object -typeThe [type](https://docs.stripe.com/api/payment_methods/object.md#payment_method_object-type) of the PaymentMethod -billingDetailsBilling information associated with the PaymentMethod that may be used or required by particular types of payment methods. -emailEmail address. -phoneBilling phone number (including extension). -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -cardIf this is acardPaymentMethod, this hash contains the user's card details. -brandThe brand to use when displaying the card, this accounts for customer's brand choice on dual-branded cards. Can be american_express, cartes_bancaires, diners_club, discover, eftpos_australia, interac, jcb, mastercard, union_pay, visa, or other and may contain more values in the future. -expMonthTwo-digit number representing the card's expiration month. -expYearFour-digit number representing the card's expiration year. -last4The last four digits of the card. -shippingThe selected shipping option, if any. -shippingOptionDetails of the selected shipping option. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -taxAmountsThe amount of tax calculated per tax rate for shipping costs. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -shippingAddressShipping address of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -shippingOptionsThe list of shipping options that can be selected. -idUnique identifier for the object. -amountA formatted string representing the shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -displayNameA user-facing description of the shipping option. -deliveryEstimateThe estimated range for how long shipping will take. -maximumThe upper bound of the estimated range. If empty, represents no upper bound i.e., infinite. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -minimumThe lower bound of the estimated range. If empty, represents no lower bound. -unitA unit of time. Eitherbusiness_day, day, hour, week, or month. - valueMust be greater than 0. -statusStatus of the Checkout Session. -typeOne ofopen, expired, or complete. * open: The Checkout Session is still in progress. * expired: The Checkout Session has expired. No further processing will occur. * complete: The Checkout Session is complete. Payment processing may still be in progress. - paymentStatusOne ofpaid, unpaid, or no_payment_required. Only present when type=complete. * paid: The payment funds are available in your account. * unpaid: The payment funds are not yet available in your account. * no_payment_required: The payment is delayed to a future date, or the Checkout Session is in setup mode and doesn't require a payment at this time. - taxDetails about the tax computation status. -statusOne ofready, requires_shipping_address, or requires_billing_address. * ready: The final tax amount is computed, and the session is ready for confirmation. * requires_shipping_address: A shipping address must be provided to calculate tax. * requires_billing_address: A billing address must be provided to calculate tax. - automaticTaxDetails about the automatic tax settings of the Checkout Session. -enabledWhether automatic tax is enabled on the Checkout Session. The other fields in this hash arenullwhen automatic tax is disabled. -exemptOne ofnone, exempt, or reverse. This value is nullif automatic tax is disabled, or if the Customer hasn't provided enough address information to determine their tax exemption. *none: The Customer isn't exempt from tax. * exempt: The Customer is exempt from tax. * reverse: The Customer is subject to the [reverse charge mechanism](https://docs.stripe.com/tax/zero-tax.md#reverse-charges), so tax is accounted for by the Customer. - addressSourceOne ofbilling, shipping, or customer, indicating which address is used to calculate tax. This value is nullif automatic tax is disabled. *billing: Tax is calculated from the billing address collected during this Checkout Session. * shipping: Tax is calculated from the shipping address collected during this Checkout Session. * customer: Tax is calculated from the address saved on the Customer. - taxAmountsThe aggregate amounts calculated per tax rate for all line items. This value isnullif tax has not yet been computed, i.e. the Customer's address has not been collected yet. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -totalTax and discount details for the computed total amount. Use this field to render an amount breakdown to your customer, such as in an order summary. -subtotalThe total amount of line items, excluding tax, discounts, and shipping. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveThe sum of all [exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveThe sum of all [inclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax) tax amounts -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -shippingRateThe sum of all shipping amounts. -amountA formatted string representing the total shipping amount, including currency symbols. -minorUnitsAmountAn integer representing the total shipping amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountThe sum of all the discounts. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal computed amount, including discounts, tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -appliedBalanceTotal amount of [customer credit balance](https://docs.stripe.com/billing/customer/balance.md) to be applied to the payment. A positive number increases the amount to be paid, and a negative number decreases the amount to be paid. -amountA formatted string representing the applied customer balance amount, including currency symbols. -minorUnitsAmountAn integer representing the applied customer balance amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -balanceAppliedToNextInvoice When true, no payment will be collected immediately. Instead, the amount due will be added to the Customer's next invoice. This can happen when the amount due today is less than the [minimum chargeable amount](https://docs.stripe.com/currencies.md#minimum-and-maximum-charge-amounts). ### Example ```title Call useCheckoutForm hook ``` ## useCheckout > This feature is in private preview. See [Embedded form](https://docs.stripe.com/payments/checkout/how-checkout-works.md?payment-ui=checkout-form) for more information. *useCheckoutis deprecated. Use [useCheckoutElements](./use-checkout-elements.md) inside a [CheckoutElementsProvider](./checkout-provider.md), or [useCheckoutForm](./use-checkout-form.md) inside a [CheckoutFormProvider](./checkout-form-provider.md). The new hooks provide compile-time type safety for the actions available under each provider.* TheuseCheckouthook returns a disjoint union describing the loading state: *{type: "loading"}*{type: "error", error: { message: string }}*{type: "success", checkout: object }. Upon success, it returns a [Session object](./session-object.md) as well as actions to update the Checkout Session. ### Object properties - idThe ID of the Checkout Session. -billingAddressBilling details of the Customer. -nameFull name. -addressAddress. -countryTwo-letter country code ([ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2)). -line1Address line 1 (e.g., street, PO Box, or company name). -line2Address line 2 (e.g., apartment, suite, unit, or building). -cityCity, district, suburb, town, or village. -postal_codeZIP or postal code. -stateState, county, province, or region. -businessNameThe business name as configured in the Business Public Details settings of your Stripe account. -canConfirmWhether the Checkout Session has collected enough data to confirm. Use this field to indicate to your customer if they can proceed, such as disabling the pay button. -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. Must be a [supported currency](https://docs.stripe.com/currencies.md). -currencyOptionsThe currency options available on the Checkout Session when using [Adaptive Pricing](https://docs.stripe.com/checkout/custom-checkout/adaptive-pricing.md). -amountA formatted string representing the total amount in the source currency, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the source currency in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -currencyThree-letter [ISO currency code](https://www.iso.org/iso-4217-currency-codes.html), in lowercase. -currencyConversionCurrency conversion details. This is only present for the customer currency. -fxRateThe exchange rate used to convert source currency amounts to customer currency amounts. -sourceCurrencyThe creation currency of the Checkout Session before localization. -discountAmountsThe aggregate amounts calculated per discount for all line items. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -emailThe Customer's email address. -lastPaymentErrorThe error encountered the last time the Checkout Session was confirmed. -messageAn error message to be displayed to the customer. -lineItemsA list of items the customer is purchasing. -idUnique identifier for the object. -subtotalTotal before any discounts or exclusive taxes are applied. -amountA formatted string representing the subtotal amount, including currency symbols. -minorUnitsAmountAn integer representing the subtotal amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -discountTotal discount amount. A positive number reduces the amount to be paid. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxExclusiveTotal amount of exclusive tax (tax that is collected in addition to the subtotal). -amountA formatted string representing the exclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the exclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -taxInclusiveTotal amount of inclusive tax (tax that is already included in the subtotal). -amountA formatted string representing the inclusive tax amount, including currency symbols. -minorUnitsAmountAn integer representing the inclusive tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -totalTotal amount for this line item, including discounts and tax. -amountA formatted string representing the total amount, including currency symbols. -minorUnitsAmountAn integer representing the total amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountThe amount representing the cost of a single unit of the item. -amountA formatted string representing the unit amount, including currency symbols. -minorUnitsAmountAn integer representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -unitAmountDecimalThe unit amount of the line item in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal), with sub-cent precision. Use this field instead ofunitAmountwhen dealing with sub-cent pricing (for example, usage-based billing). For sub-cent prices,unitAmount.minorUnitsAmountrounds to0, so unitAmountDecimalpreserves the exact decimal value (for example,0.005for a price of 0.00005 USD). -amountA formatted string representing the unit amount with sub-cent precision, including currency symbols. -minorUnitsAmountA number representing the unit amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) with sub-cent precision (for example,0.5for half a cent). UnlikeunitAmount.minorUnitsAmount, this value can be a decimal. - unitLabelA label that represents the unit of this line item. SpecifyunitLabelin [productData.unit_label](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-unit_label) when creating the Checkout Session or when creating the Product's [unit_label](https://docs.stripe.com/api/products/object.md#product_object-unit_label) field. -descriptionAn arbitrary string attached to the object. Often useful for displaying to users. -nameThe item's name, meant to be displayable to users. -imagesAn array of image URLs for the line item. Specify [images](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-line_items-price_data-product_data-images) on the Product when creating the Checkout Session. -quantityThe quantity of products being purchased. -discountAmountsThe amount of discount calculated per discount for this line item. -amountA formatted string representing the discount amount, including currency symbols. -minorUnitsAmountAn integer representing the discount amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -displayNameA user-facing description of the discount. -promotionCodeThe customer-facing promotion code that was used to apply this discount, if any. -recurringDetails of how the discount applies to recurring payments. -typeOne offoreverorrepeating. * forever: Applies to all charges from a subscription with this coupon applied. * repeating: Applies to charges in the first durationInMonthsmonths from a subscription with this coupon applied. -durationInMonthsIfdurationisrepeating, the number of months the coupon applies. Null otherwise. - percentOffAn integer representing the discount amount as a percentage. -taxAmountsThe amount of tax calculated per tax rate for this line item. -amountA formatted string representing the tax amount, including currency symbols. -minorUnitsAmountAn integer representing the tax amount in the [smallest currency unit](https://docs.stripe.com/currencies.md#zero-decimal) (e.g., 100 cents to charge $1.00 or 100 to charge ¥100, a zero-decimal currency). -inclusiveWhether this tax amount is [inclusive or exclusive](https://docs.stripe.com/tax/faq.md#what-is-the-difference-between-inclusive-and-exclusive-tax). -displayNameA user-facing description of the tax. -percentageThe tax rate percentage. This value is absent for flat-amount tax rates. -recurringThe recurring components of a price such asintervalandintervalCount. - intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -usageTypeOne oflicensedormetered. licensedautomatically bills the quantity set when adding it to a subscription.meteredaggregates the total usage based on usage records. -adjustableQuantityConfiguration for this item's quantity to be adjusted by the customer during checkout. -maximumThe maximum quantity the customer can purchase for the Checkout Session. -minimumThe minimum quantity the customer can purchase for the Checkout Session. -livemodeHas the valuetrueif the object exists in live mode or the valuefalseif the object exists in a sandbox. -minorUnitsAmountDivisorThe factor used to convert between minor and major currency units. This value represents the number of minor currency units per one major unit. For example, in USD, where cents are the minor unit, the divisor is 100. In JPY, which has no minor units, the divisor is 1. -nameCollectionNames collected from the customer. This value isnullif [name_collection](https://docs.stripe.com/api/checkout/sessions/create.md#create_checkout_session-name_collection) is not configured on the Checkout Session. -individualNameThe customer's individual name. -businessNameThe customer's business name. -phoneNumberThe Customer's phone number. -recurringDetails about recurring payments set up by the Checkout Session. -intervalSpecifies billing frequency. Eitherday, week, month, or year. - intervalCountThe number of intervals between subscription billings. For example,interval=monthandintervalCount=3bills every 3 months. -dueNextDetails about the next scheduled recurring payment. -subtotal` Total before any discounts or exclusive tax