## PayPalSavePaymentSource Widget

PayPalSavePaymentSource Widget allows to obtain a Paydock one time token linked with a Paypal payment source from the customer.

The general flow to use the widgets is:
1. Configure your PayPal gateway and connect it using Paydock API or Dashboard.
2. Create a container in your site
```html
<div id="widget"></div>
```
3. Initialize the specific `PayPalSavePaymentSourceWidget`, providing your Access token or Public Key, the Gateway ID that Paydock provides plus required and optional config parameter for the widget in use. The general format is:
```js
new paydock.PayPalSavePaymentSourceWidget(
    "#widget",
    accessTokenOrPublicKey,
    gatewayId,
    widgetSpecificConfig,
);
```
4. Handle the `onSuccess`, `onError` and `onCancel` for paypal setup token results.
5. If `onSuccess` event is emmited, event data should contain `token` and `email` ready to use.

### Example

A full description of the config parameters for [PayPalSavePaymentSourceWidget](#PayPalSavePaymentSourceWidget) meta parameters can be found [here](#PayPalSavePaymentSourceWidgetConfig). Below you will find a fully working html example.

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h2>Using PayDock PayPalSavePaymentSourceWidget!</h2>
    <div id="widget"></div>
</body>
<script src="https://widget.paydock.com/sdk/latest/widget.umd.min.js" ></script>
<script>
    let button = new paydock.PayPalSavePaymentSourceWidget(
        "#widget",
        accessTokenOrPublicKey,
        gatewayId,
        {
            style: {
                layout: 'vertical',
                color:  'gold',
                shape:  'pill',
                label:  'paypal'
            }
        }
    );

    payPalSavePaymentSourceWidget.onSuccess((data) => console.log('On success: ', data));
    payPalSavePaymentSourceWidget.onError((data) => console.log('On error: ', data));
    payPalSavePaymentSourceWidget.onCancel(() => console.log('On cancelled'));

    button.setEnv('sandbox');

    button.load();
</script>
</html>
```
