# CartCheckoutButton

The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.

Must be a descendent of a `CartProvider` component.
  

```jsx
import {CartCheckoutButton} from '@shopify/hydrogen-react';

export default function ProductCartCheckoutButton() {
  return <CartCheckoutButton />;
}

```

```tsx
import {CartCheckoutButton} from '@shopify/hydrogen-react';

export default function ProductCartCheckoutButton() {
  return <CartCheckoutButton />;
}

```

## Props

### CartCheckoutButtonPropsForDocs

### as

value: `AsType`

Provide a React element or component to render as the underlying button. Note: for accessibility compliance, almost always you should use a `button` element, or a component that renders an underlying button.

### buttonRef

value: `Ref<HTMLButtonElement>`

A `ref` to the underlying button

### children

value: `ReactNode`

Any ReactNode elements.

### defaultOnClick

value: `(event?: MouseEvent<HTMLButtonElement, MouseEvent>) => boolean | void`

A default `onClick` behavior