[Bug] Dark Theme for <PayPalButtons/>

[eriknyk]

Library used

Using react-paypal-js v8.7.0

🐞 Describe the Bug

Using react-paypal-js I cannot find a way (at least documented) to enable dark mode for component.

🔬 Minimal Reproduction

 <PayPalScriptProvider
    options={{
      clientId: PAYPAL_CLIENT_ID,
      components: "buttons",
      currency: "USD",
    }}
  >
  <PayPalButtons
    style={{ layout: "vertical" }}
    createOrder={createOrder}
    onApprove={onApprove}
  />
</PayPalScriptProvider>

😕 Actual Behavior

I couldn't find a way to display checkout buttons and card form in dark mode.

🤔 Expected Behavior

Find a way to display checkout buttons and card form in dark mode. It looks there is a way to display buttons & card checkout form in dark mode, but no idea how. see [Additional Context] images below

🌍 Environment

• Node.js/npm: - Node v20.13.1 / NPM 10.5.2
• OS: - MacOS
• Browser: - Chrome latest

➕ Additional Context

In the storybook, on canvas tab If you set the background color to dark, dark theme for buttons works fine even for one-time checkout form.

Add any other context about the problem here.

[OmarAbouzeid95]

Any luck with this issue?

[ahsath]

same problem

same problem

[0zym4ndias]

Hello, just have to wrap your with <div style={{colorScheme: 'none'}}>

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[eriknyk]

Bump

[0zym4ndias]

Bump

I literally gave the solution.
Someone should mark it as resolved.

[eriknyk]

colorScheme: 'none'

It works! Thank you! @0zym4ndias however it shouldn't be marked as resolved yet until this is well documented.