Split Button out from CreditCard component

[llampwall]

Describe the bug

Currently the CreditCard field includes the submit payment button in it. There is no way to separate them. This makes using the library impossible for someone like me who has the button on a different part of the screen, in a different component. When using the regular Square JavaScript SDK, you can put them wherever you want in relation to each other. It's as simple as moving the divs.

<div id="card-container"></div> <button id="card-button" type="button">Pay $1.00</button>

This library should be updated to split those components and allow them to each be placed anywhere within the children of PaymentForm.

Your Example Website or App

this applies to any site this is used on

Steps to Reproduce the Bug or Issue

1. Attempt to put the button somewhere else in your code.
2. Realize there is no trivial way to do so.

Expected behavior

As a user, I expected to be able to have the same flexibility as the Square Web Payments SDK that this library wraps. This is a breaking change.

Screenshots or Videos

No response

Platform

• OS: macOS, Windows
• Browser: Chrome, Safari, Firefox

Additional context

No response