Skip to content
Create account
or
Sign in
The Stripe Docs logo
/
Ask AI
Create account
Sign in
Get started
Payments
Finance automation
Platforms and marketplaces
Money management
Developer tools
Get started
Payments
Finance automation
Get started
Payments
Finance automation
Platforms and marketplaces
Money management
Overview
Get started with Connect
Integration fundamentals
Example integrations
Onboard accounts
Configure account Dashboards
    Get started with Connect embedded components
    Customize Connect embedded components
    Supported Connect embedded components
      Available Components
      Account management
      Account onboarding
      Balances
      Documents
      Financial account
      Financial account transactions
      Issuing card
      Issuing cards list
      Notification banner
      Payment details
      Payments
      Payouts
      Payouts list
      Tax registrations
      Tax settings
      Preview components
      App install
      App viewport
      Capital financing
      Capital financing application
      Capital financing promotion
      Disputes for a payment
      Export Tax Transactions
      Payment method settings
      Reporting chart
    Stripe Dashboard customization
    Platform controls for Stripe Dashboard accounts
    Express Dashboard
Accept payments
Pay out to accounts
Manage your Connect platform
Tax forms for your Connect platform
Work with connected account types
HomePlatforms and marketplacesConfigure account DashboardsSupported Connect embedded components

Payment details

Show details of a given payment and allow users to manage disputes and perform refunds.

Copy page

This component is a subset of payments, which provides the detail overlay of a given payment. The UI rendered by the payment details component is equivalent to the overlay that the payments component renders when the user clicks on a payment row.

Use the payment-details component to invoke the payment details overlay without the need to inline the entirety of the payments list in your website. This allows you to invoke the payment detail overlay from your existing UI (for example, your payments list) and integrate with our detail view to enable your customers to view payment details, issue refunds, and manage disputed payments.

By default, the embedded components offer limited information for destination charges and separate charges and transfers. They don’t provide access to customer information, payment methods, and some charge amount details. The destination_on_behalf_of_charge_management feature allows a connected account to see additional information with destination charges, as well as perform refunds and manage disputes.

When creating an Account Session, enable payment details by specifying payment_details in the components parameter. You can turn on or off an individual feature of the payment details component by specifying the features parameter under payment_details:

Command Line
cURL
curl https://api.stripe.com/v1/account_sessions \ -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:"
\ -d account=
{{CONNECTED_ACCOUNT_ID}}
\ -d "components[payment_details][enabled]"=true \ -d "components[payment_details][features][refund_management]"=true \ -d "components[payment_details][features][dispute_management]"=true \ -d "components[payment_details][features][capture_payments]"=true \ -d "components[payment_details][features][destination_on_behalf_of_charge_management]"=false

After creating the account session and initializing ConnectJS, you can render the payment details component in the frontend:

payment-details.js
JavaScript
// Include this element in your HTML const paymentDetails = stripeConnectInstance.create('payment-details'); paymentDetails.setPayment('{{PAYMENT_INTENT_OR_CHARGE_ID}}'); // use setOnClose to set a callback function to close payment-details paymentDetails.setOnClose(() => { paymentDetails.remove(); }); container.appendChild(paymentDetails);

Note

For destination charges and separate charges and transfers, the PaymentIntent doesn’t exist on the connected account. Instead, pass the associated charge ID that belongs to the connected account.

The payment details component shows different information and supports different features for different charge types:

  • For direct charges, your connected accounts can view the complete set of information. They can also manage refunds, manage disputes, and capture payments if you enable the corresponding features when creating an account session.
  • For destination charges and separate charges and transfers, your connected accounts can only see the transfer object associated with the selected charge, which contains limited information.
  • For destination charges with the on_behalf_of attribute, your connected accounts can view the complete set of information when the destination_on_behalf_of_charge_management feature is enabled. When this feature is turned on, you can also enable refund and disputes management by enabling the corresponding features.

Allow your connected accounts to manage destination charges

When you set the destination_on_behalf_of_charge_management feature to true, your connected accounts can use the payments component to view and manage destination charges that have the on_behalf_of attribute. If you also turn on the dispute_management feature, your connected accounts can participate directly in handling their disputes.

Enabling the destination_on_behalf_of_charge_management feature has the following limitations:

  1. You can’t filter by charge status or payment methods.
  2. You can’t export certain data columns.

Dispute management for destination charges

When you enable both dispute_management and destination_on_behalf_of_charge_management, your connected accounts can update and modify dispute evidence, counter disputes, and accept disputes for destination charges with the on_behalf_of attribute set to the connected account.

For destination charges, with or without on_behalf_of, Stripe debits dispute amounts and fees from your platform account.

We recommend setting up a webhook to listen to dispute created events. When that happens, you can attempt to recover funds from the connected account by reversing the transfer through the Dashboard or by creating a transfer reversal.

If the connected account has a negative balance, Stripe attempts to debit its external account if debit_negative_balances is set to true.

If you challenge the dispute and win, you can transfer the funds that you previously reversed back to the connected account. If your platform has an insufficient balance, the transfer fails. Prevent insufficient balance errors by adding funds to your Stripe balance.

Common mistake

Retransferring a previous reversal is subject to cross-border transfer restrictions, meaning you might have no means to repay your connected account. Instead, wait to recover disputed cross-border payment transfers for destination charges with on_behalf_of until after a dispute is lost.

Supported parameters

This embedded component supports the following parameters:

MethodTypeDescription
setPaymentstringThe ID of the payment, charge, or PaymentIntent that displays in the overlay. This should be an ID of the payment, charge, or PaymentIntent on the connected account. If this attribute isn’t defined, the embedded component renders nothing. To obtain this ID, query the charges API or use a payment ID that you’ve created or stored in your integration.required
setOnClose() => voidWe send this event when the user closes the overlay.

To enable the dismiss behavior of this component, listen to the close event by calling setOnClose.

Was this page helpful?
YesNo
Need help? Contact Support.
Join our early access program.
Check out our changelog.
Questions? Contact Sales.
LLM? Read llms.txt.
Powered by Markdoc