## PaymentRequestButtonElement

Use the `PaymentRequestButtonElement` from `@stripe/react-stripe-js` to display Apple Pay, Google Pay, Link, and browser-based payment request buttons powered by the Payment Request API.

### Props

- `id`
  Sets the DOM `id` attribute on the rendered Element container. Use this to target the Element for styling or testing.

- `className`
  Applies custom CSS classes to the Element container.

- `options`
  Options for creating a `paymentRequestButton` element.

- `classes`
  Set custom class names on the container DOM element when the Stripe element is in a particular state.
  - `base`
    The base class applied to the container. Defaults to `StripeElement`.
  - `complete`
    The class name to apply when the `Element` is complete. Defaults to `StripeElement--complete`.
  - `empty`
    The class name to apply when the `Element` is empty. Defaults to `StripeElement--empty`.
  - `focus`
    The class name to apply when the `Element` is focused. Defaults to `StripeElement--focus`.
  - `invalid`
    The class name to apply when the `Element` is invalid. Defaults to `StripeElement--invalid`.
  - `webkitAutofill`
    The class name to apply when the `Element` has its value autofilled by the browser (only on Chrome and Safari). Defaults to `StripeElement--webkit-autofill`.

- `style`
  An object used to customize the appearance of the Payment Request Button. The object must have a single `paymentRequestButton` field, containing any of the following sub-fields:
  - `type`
    Preferred button type to display. Available types, by wallet:
    Browser card: `default`, `book`, `buy`, or `donate`.
    Google Pay: `default`, `buy`, or `donate`.
    Apple Pay: `default`, `book`, `buy`, `donate`, `check-out`, `subscribe`, `reload`, `add-money`, `top-up`, `order`, `rent`, `support`, `contribute`, `tip`
    When a wallet does not support the provided value, `default` is used as a fallback.
  - `theme`
    One of `dark`, `light`, or `light-outline`. The default is `dark`.
  - `height`
    The height of the Payment Request Button. Accepts `px` unit values.

- `paymentRequest`
  A [PaymentRequest](https://docs.stripe.com/js/payment_request.md) object used to configure the payment request.

### Example

```javascript
import { Elements } from '@stripe/react-stripe-js';
import { PaymentRequestButtonElement, useStripe } from '@stripe/react-stripe-js';

const CheckoutForm = () => {
  const stripe = useStripe();

  const elementsOptions = {
    paymentRequest: stripe.paymentRequest({
      country: 'US',
      currency: 'usd',
      total: {
        label: 'Demo order',
        amount: 1000,
      },
    }),
  };

  return (
    <Elements stripe={stripe} options={elementsOptions}>
      <PaymentRequestButtonElement />
    </Elements>
  );
};
```