hydrogen/packages/hydrogen/src/components/SelectedVariantShopPayButton/README.md
2021-11-09 18:20:09 -08:00

1.3 KiB

The SelectedVariantShopPayButton component renders a ShopPayButton for the product's selected variant. It must be a descendent of a ProductProvider component.

Example code

import {SelectedVariantShopPayButton, ProductProvider} from '@shopify/hydrogen';

export function ProductDetails({product}) {
  return (
    <ProductProvider value={product}>
      {/* Code for selecting the product variant */}
      <SelectedVariantShopPayButton />
    </ProductProvider>
  );
}

Alias

The SelectedVariantShopPayButton component is aliased by the Product.SelectedVariant.ShopPayButton component. You can use whichever component you prefer.

Component type

The SelectedVariantShopPayButton component is a client component, which means that it renders on the client. For more information about component types, refer to React Server Components.