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

Notification banner

Show a banner that lists required actions for risk interventions and onboarding requirements.

Copy page

Renders a notification banner that lists open tasks that can affect a connected account’s status or capabilities. Tasks can involve risk interventions or outstanding requirements for account capabilities, such as accepting payments and payouts. The banner renders only when the connected account must respond to risk interventions or provide currently due requirements after initial onboarding.

Requirements collection options

You can control the collection of currently_due or eventually_due requirements and the inclusion of future requirements by using the collectionOptions attribute when you integrate the notification banner component.

External account collection

Use the external_account_collection feature to control whether the component collects external account information. This parameter is enabled by default, and only platforms responsible for collecting updated information when requirements are due or change (including Custom accounts) can disable it. When external_account_collection is enabled, user authentication is required. You can opt out of Stripe user authentication with the disable_stripe_user_authentication parameter.

Disable Stripe user authentication

Use the disable_stripe_user_authentication feature to control whether the component requires Stripe user authentication. The default value is the opposite of the external_account_collection value. For example, if you don’t set external_account_collection, it defaults to true and disable_stripe_user_authentication defaults to false. This value can only be true for accounts where controller.requirement_collection is application.

We recommend implementing 2FA or equivalent security measures as a best practice. For account configurations that support this feature, such as Custom accounts, you assume liability for connected accounts if they can’t pay back negative balances.

Create an Account Session

When creating an Account Session, enable notification banner by specifying notification_banner in the components parameter.

Command Line
cURL
curl https://api.stripe.com/v1/account_sessions \ -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:"
\ -d account=
{{CONNECTED_ACCOUNT_ID}}
\ -d "components[notification_banner][enabled]"=true \ -d "components[notification_banner][features][external_account_collection]"=true

Render the notification banner component

notification-banner.js
JavaScript
// Include this element in your HTML const notificationBanner = stripeConnectInstance.create('notification-banner'); container.appendChild(notificationBanner); // Optional: // notificationBanner.setCollectionOptions({ // fields: 'eventually_due', // futureRequirements: 'include', // })
MethodTypeDescriptionDefault
setCollectionOptions{ fields: 'currently_due' | 'eventually_due', future_requirements: 'omit' | 'include' }Customizes collecting currently_due or eventually_due requirements and controls whether to include future requirements. Specifying eventually_due collects both eventually_due and currently_due requirements.{fields: 'currently_due', futureRequirements: 'omit'}

Configure custom banner behavior

You can configure custom behavior, such as different margins, for when the banner includes any notifications or when the notifications require any action. To do so, set a custom callback function using onNotificationsChange.

notification-banner.js
JavaScript
// index.html <h1 id="notification-banner-action-warning"></h1> <div id="notification-banner-container"></div> // index.js const handleNotificationsChange = (response) => { const warning = document.getElementById("notification-banner-action-warning"); if (response.actionRequired > 0) { // Do something related to required actions, such as adding margins to the banner container or tracking the current number of notifications. warning.style.display = "block"; warning.textContent = "You must resolve the notifications on this page before proceeding."; } else if (response.total > 0) { // Do something related to notifications that don't require action. warning.style.display = "block"; warning.textContent = "The items below are in review."; } else { warning.style.display = "none"; } }; const container = document.getElementById('notification-banner-container'); const notificationBanner = stripeConnectInstance.create('notification-banner'); notificationBanner.setOnNotificationsChange(handleNotificationsChange); container.appendChild(notificationBanner);
MethodDescriptionVariables
setOnNotificationsChangeAllows users to specify an optional custom behavior in a callback function.
  • response.total: The total number of notifications in the banner
  • response.actionRequired: The number of notifications that require user action

Testing

To test this component in a sandbox, specify different test inputs for fields that fail verifications or generate requirements on the account. For example, you can use the account management component to enter address_no_match in line1 of an individual’s address to trigger an address mismatch. In production, it can be difficult to verify that this component is working as expected because it’s hidden when an account has no banner items. To validate your integration is working, you can:

  • Set a callback using onNotificationsChange that verifies response.total is zero
  • Confirm the component is being displayed with no content using a loader start handler

Account onboarding

Use the notification banner after the account goes through account onboarding and has details_submitted. The banner won’t render any UI if the account is missing details_submitted.

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