Skip to content
Product Sheet
<sessions-product-sheet>

Buy a single product — a pass, membership, gift card, or physical good — without the catalogue. Point it at a product id (from the GraphQL API or the Products embed) and it opens a checkout sheet: an optional guest name and email, the inline Stripe card form, and the purchase, all themed by your --sessions-* branding. Free products (or ones a code drives to zero) fulfil with no payment step. The sheet opens on mount and emits a sessions:sheet-close event when dismissed. Supply an auth token (directly or via a wrapping <sessions-context>) to buy on behalf of a signed-in visitor and save their card; otherwise the visitor checks out as a guest.

Install

<script type="module" src="https://go.sessions.website/embeds/unstable/product-sheet.js"></script>
<sessions-product-sheet
  business="ottawa-volleyball"
  product="&lt;product-id>"
></sessions-product-sheet>

Attributes

Edit any attribute below — the snippet above and the live preview to the side rebuild in place.

business : string

Handle of the business that sells the product, without the leading @. Optional when a wrapping <sessions-context business="…"> already provides it.

product : string

Id of the product to sell (a Pass, Membership, GiftCard, or PhysicalProduct). Opens the checkout sheet for it.

auth : token

Optional embed-scoped JWT. When set, the purchase is made on behalf of the token holder (and their card can be saved); when omitted, the visitor checks out as a guest.

Content Security Policy

This embed renders a card-payment form and (for guest checkout) a bot-challenge widget. If your site sets a Content-Security-Policy, allow these origins or the payment form / challenge will be blocked.

script-src https://challenges.cloudflare.com;
frame-src https://challenges.cloudflare.com https://my.sessions.website;