# Wallet component

The wallet component allows customers to initiate an express checkout using any of the following payment methods:

* [PayPal](https://docs.digitalriver.com/digital-river-api/payments/supported-payment-methods/paypal)
* [Apple Pay](https://docs.digitalriver.com/digital-river-api/payments/supported-payment-methods/apple-pay)
* [Google Pay](https://docs.digitalriver.com/digital-river-api/payments/supported-payment-methods/google-pay)

<figure><img src="https://334437993-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LqH4RJfLVLuHPXuJyTZ%2Fuploads%2F2W7fH93awPFvQgl666SR%2Fexpress%20checkout.png?alt=media&#x26;token=8281a75c-2dc0-4481-9fb9-e475318c692c" alt=""><figcaption></figcaption></figure>

Customers are redirected to that payment provider's interface when they click any component's buttons. There, they designate a shipping and/or billing address, select a payment method, and then authorize it. If payment is successfully authorized, customers are sent back to your site, and Digital River adds the customer's payment [`sources[]`](https://docs.digitalriver.com/digital-river-api/payments/payment-sources), `shipTo`, and/or `billTo` to the checkout-session.

{% hint style="warning" %}
Certain browsers don't support some express payment methods. For example, the wallet component doesn't render Apple Pay in Chrome.
{% endhint %}

If customers initiate an express checkout, and [`items[]`](https://app.gitbook.com/s/x8fSFzVR3sg0TsNWwwVz/drop-in-checkout-sessions/checkout-sessions-basics#product-data) in the checkout-session containing [physical products](https://docs.digitalriver.com/digital-river-api/product-management/skus#how-products-are-classified-as-physical-or-digital), the customer's shipping method selection is collected within the [payment component](https://docs.digitalriver.com/digital-river-api/developer-resources/digitalrivercheckout.js-reference/digitalrivercheckout-object/components/payment-component). As a result, if the transaction involves physical products and you're using the wallet component, your application needs to implement the payment component.

## Creating the wallet component

To create an instance of the wallet component, pass `'wallet'` to [`createComponent()`](https://docs.digitalriver.com/digital-river-api/developer-resources/digitalrivercheckout.js-reference/digitalrivercheckout-object/components/..#createcomponent-componenttype).

```javascript
let walletComponent;
...
walletComponent = components.createComponent('wallet');
...
```

## Mounting the wallet component

To attach the wallet component to your DOM, pass the `id` of its container to [`mount()`](https://docs.digitalriver.com/digital-river-api/developer-resources/digitalrivercheckout.js-reference/digitalrivercheckout-object/components/..#mount-elementid).

```javascript
<div id="wallet-container" style="display: block">
...
walletComponent.mount('wallet-container');
...
```