Dropdown menu inside payments component is too narrow for localized text (German)

[Dari4sho]

Summary:

When using the Stripe Connect Embedded Components (via @stripe/connect-js), some dropdowns or filter popovers inside the iframe have a fixed width of 200px. In localized interfaces - particularly in German - the labels are too long for that and can overflow awkwardly.

Example:

In the payments component, the “Status” filter dropdown shows options like
"Betrugsfrühwarnsystem"
which do not fit within the current dropdown width.

Expected behavior:

The dropdown should either

• automatically resize based on content length (width: max-content;)

• wrap text properly - e.g. with lang="de" on the html element + hyphens: auto on the filter container

• embed a ­ at the correct place for long words

Ideally, the component would provide a way to configure or theme the dropdown width through the appearance object or similar.

Actual behavior:

• Dropdown width is fixed (200px).
• Text overflows when using longer localized strings.
• The appearance API (including overlays: 'drawer') has no effect on this element.

Environment:

Library: @stripe/connect-js@3.3.30
Locale: de (German)
Browser: Chrome v141.0.7390.67
Integration type: React

Request:

Please make the dropdown/popover width responsive to content length or expose a configurable width via the appearance API, especially for localized (non-English) text.

[tomchengcui-stripe]

Thanks for filing this. The team will take a look and get back to you once its fixed.