Skip to content

Commit 9b7fce2

Browse files
authored
chore(release): publish content (#20)
Co-authored-by: ct-sdks[bot] <153784748+ct-sdks[bot]@users.noreply.github.com>
1 parent f65f7ba commit 9b7fce2

14 files changed

Lines changed: 84 additions & 84 deletions

File tree

.agents/plugins/commercetools/skills/commercetools-checkout/SKILL.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
---
22
name: commercetools-checkout
3-
description: The commercetools Checkout product — payment-only mode (integrating commercetools Checkout for payments while owning the rest of the flow), full hosted checkout (checkoutFlow), widget integration via @commercetools/checkout-browser-sdk, configuration, PSP connector setup (Stripe, Adyen, Mollie), and webhook handling. Use when integrating commercetools Checkout (the product) into a storefront or headless app — not for generic cart-to-order patterns (see commercetools-storefront).
3+
description: The Checkout — payment-only mode (integrating Checkout for payments while owning the rest of the flow), full hosted checkout (checkoutFlow), widget integration via @commercetools/checkout-browser-sdk, configuration, PSP connector setup (Stripe, Adyen, Mollie), and webhook handling. Use when integrating Checkout (the product) into a storefront or headless app — not for generic cart-to-order patterns (see commercetools-storefront).
44
when_to_use:
5-
- "Integrating the commercetools Checkout product into a storefront or headless app"
5+
- "Integrating the Checkout into a storefront or headless app"
66
- "Setting up payment-only mode while keeping existing address and shipping flows"
77
- "Configuring PSP connectors such as Stripe, Adyen, or Mollie"
88
- "Handling payment webhooks and order confirmation"
@@ -14,15 +14,15 @@ metadata:
1414
- psp
1515
---
1616

17-
# commercetools Checkout
17+
# Checkout
1818

19-
The commercetools Checkout product provides hosted payment and checkout experiences via the Browser SDK.
19+
The Checkout provides hosted payment and checkout experiences via the Browser SDK.
2020

2121
## Integration Modes
2222

23-
Three modes — choose based on how much of the checkout flow commercetools Checkout should own:
23+
Three modes — choose based on how much of the checkout flow Checkout should own:
2424

25-
- **`paymentFlow`** (payment-only) — keep existing address/shipping UI, replace only the payment step with the commercetools Checkout widget. Least invasive.
25+
- **`paymentFlow`** (payment-only) — keep existing address/shipping UI, replace only the payment step with the Checkout widget. Least invasive.
2626
- **`checkoutFlow`** (full hosted) — replace the entire multi-step checkout with a single commercetools-hosted page covering address, shipping, and payment.
2727
- **`expressPayment`** — add Apple Pay / Google Pay express buttons to cart or PDP. Can coexist with either mode above.
2828

@@ -48,7 +48,7 @@ When this skill is invoked, always follow these steps:
4848
## References
4949

5050
See [payment-only-mode.md](./references/payment-only-mode.md) for:
51-
- Full architecture diagram (Browser SDK → commercetools Checkout service → PSP)
51+
- Full architecture diagram (Browser SDK → Checkout service → PSP)
5252
- Session creation (`/api/checkout/session` → commercetools Sessions API)
5353
- `paymentFlow`, `checkoutFlow`, and `expressPayment` implementation patterns
5454
- PSP connector setup (Stripe, Adyen, Mollie)

.agents/plugins/commercetools/skills/commercetools-checkout/references/payment-only-mode.md

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
---
22
name: payment-only-mode
3-
description: Implementation guide for integrating the commercetools Checkout Browser SDK with payment-only mode (paymentFlow), full hosted checkout (checkoutFlow), and express payment buttons.
3+
description: Implementation guide for integrating the Checkout Browser SDK with payment-only mode (paymentFlow), full hosted checkout (checkoutFlow), and express payment buttons.
44
when_to_use:
5-
- "Integrating the commercetools Checkout product into a headless or hosted storefront"
5+
- "Integrating the Checkout into a headless or hosted storefront"
66
- "Replacing only the payment step while keeping existing address and shipping flows"
7-
- "Setting up Stripe, Adyen, Mollie, or other PSP connectors via commercetools Checkout Applications"
7+
- "Setting up Stripe, Adyen, Mollie, or other PSP connectors via Checkout Applications"
88
- "Implementing order creation via commercetools Sessions API and handling post-payment confirmation"
99
metadata:
1010
contentType: REFERENCE
@@ -15,9 +15,9 @@ metadata:
1515
- sdk
1616
---
1717

18-
# commercetools Checkout Integration
18+
# Checkout Integration
1919

20-
Adds payment processing via the [commercetools Checkout Browser SDK](https://docs.commercetools.com/checkout/browser-sdk).
20+
Adds payment processing via the [Checkout Browser SDK](https://docs.commercetools.com/checkout/browser-sdk).
2121

2222
---
2323

@@ -27,7 +27,7 @@ Adds payment processing via the [commercetools Checkout Browser SDK](https://doc
2727

2828
1. **Which checkout mode?**
2929
- `paymentFlow` — payment-only: keep existing address/shipping steps, replace only `StepPayment.tsx` with the commercetools widget. Least invasive.
30-
- `checkoutFlow` — full page: replace the entire multi-step checkout with a single commercetools-hosted checkout page (addresses, shipping, and payment all handled by commercetools Checkout).
30+
- `checkoutFlow` — full page: replace the entire multi-step checkout with a single commercetools-hosted checkout page (addresses, shipping, and payment all handled by Checkout).
3131
- `expressPayment` — express buttons: add Apple Pay / Google Pay buttons to the cart or PDP. Can coexist with either of the above.
3232

3333
2. **Which PSP (Payment Service Provider)?**
@@ -38,9 +38,9 @@ Adds payment processing via the [commercetools Checkout Browser SDK](https://doc
3838
## Architecture Overview
3939

4040
```
41-
Browser (SDK) → commercetools Checkout service → PSP
41+
Browser (SDK) → Checkout service → PSP
4242
43-
/api/checkout/session (creates commercetools Checkout Session from cart)
43+
/api/checkout/session (creates Checkout Session from cart)
4444
4545
commercetools Sessions API (POST https://session.{region}.commercetools.com/{projectKey}/sessions)
4646
```
@@ -54,7 +54,7 @@ The storefront creates a **Checkout Session** (server-side, via a new API route)
5454
### 0a. Add environment variables to `site/.env`
5555

5656
```bash
57-
# The key of your commercetools Checkout Application
57+
# The key of your Checkout Application
5858
CTP_CHECKOUT_APP_KEY=storefront-checkout
5959
```
6060

@@ -182,19 +182,19 @@ export default function StepPayment() {
182182

183183
In Checkout page, the payment step should render the PaymentStep.tsx
184184

185-
> **Note**: With `paymentFlow`, commercetools Checkout handles the payment AND the **order is created by commercetools** automatically when payment succeeds (via the `paymentReturnUrl` configured in the Application).
185+
> **Note**: With `paymentFlow`, Checkout handles the payment AND the **order is created by commercetools** automatically when payment succeeds (via the `paymentReturnUrl` configured in the Application).
186186
187187
---
188188

189-
## Step 3 — Order confirmation after commercetools Checkout
189+
## Step 3 — Order confirmation after Checkout
190190

191-
commercetools Checkout navigates the browser to `paymentReturnUrl` after a successful payment, appending `?orderId=<id>` (or `?orderNumber=<n>`). Update the confirmation page to read these params:
191+
Checkout navigates the browser to `paymentReturnUrl` after a successful payment, appending `?orderId=<id>` (or `?orderNumber=<n>`). Update the confirmation page to read these params:
192192

193193
---
194194

195195
## Step 5 — Styling
196196

197-
Optional: Override commercetools Checkout widget styles via the `styles` option (CSS custom properties):
197+
Optional: Override Checkout widget styles via the `styles` option (CSS custom properties):
198198

199199
```typescript
200200
checkoutFlow({
@@ -208,15 +208,15 @@ checkoutFlow({
208208
});
209209
```
210210

211-
Available CSS variables are listed in the commercetools Checkout theming docs.
211+
Available CSS variables are listed in the Checkout theming docs.
212212

213213
---
214214

215215
## Environment Variable Summary
216216

217217
| Variable | Secret? | Purpose |
218218
|---|---|---|
219-
| `CTP_CHECKOUT_APP_KEY` | No | **New** — key of the commercetools Checkout Application |
219+
| `CTP_CHECKOUT_APP_KEY` | No | **New** — key of the Checkout Application |
220220

221221

222222
No `CT_REGION`, `NEXT_PUBLIC_CT_PROJECT_KEY`, or `NEXT_PUBLIC_CT_REGION` variables are needed. The session API derives the region from `CTP_API_URL` and returns `{ sessionId, projectKey, region }` to the browser.

.agents/plugins/commercetools/skills/commercetools-storefront/examples/prompts/b2c/scaffold.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ Generate a complete production ready B2C storefront connected to commercetools.
99
3. product-listing + facets
1010
4. product-detail
1111
5. cart
12-
6. checkout: create complete integration with paymentflow of commercetools checkout but keep the application key as const
12+
6. checkout: create complete integration with paymentflow of Checkout but keep the application key as const
1313
7. customer authentication and registration
1414
8. search page + facets
1515
9. wishlist

.agents/plugins/commercetools/skills/commercetools-storefront/references/b2b/checkout.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -37,17 +37,17 @@ The address step reads saved addresses from the active business unit, not from t
3737
### Order Placement Sequence
3838

3939
```
40-
addresses (shipping + billing) → shipping method → payment (commercetools checkout SDK) → confirmation
40+
addresses (shipping + billing) → shipping method → payment (Checkout SDK) → confirmation
4141
```
4242

4343
1. **Addresses step** — shipping and billing addresses persisted to cart when moving to the next step. All cart writes use the as-associate chain — see the [reference](./cart.md).
4444
2. **Shipping step** — user selects a method with `shippingMethodId`
45-
3. **Payment step**commercetools checkout frontend SDK mounts and handles payment capture and order placement. If a PO Number payment method is configured in the commercetools checkout frontend SDK, it will appear automatically — no custom PO Number field is needed in the checkout form.
45+
3. **Payment step**Checkout frontend SDK mounts and handles payment capture and order placement. If a PO Number payment method is configured in the Checkout frontend SDK, it will appear automatically — no custom PO Number field is needed in the checkout form.
4646
4. **Confirmation** — SDK signals completion → clear `cartId` from session → redirect to `/checkout/confirmation?orderId=<id>`
4747

48-
Order placement is handled entirely by the commercetools checkout frontend SDK. Do not implement a separate `POST /api/checkout` route for order creation.
48+
Order placement is handled entirely by the Checkout frontend SDK. Do not implement a separate `POST /api/checkout` route for order creation.
4949

50-
> **Reference:** See the [commercetools checkout frontend SDK](../../../commercetools-checkout/references/payment-only-mode.md) implementation skill for SDK setup and the order-completion event handler.
50+
> **Reference:** See the [Checkout frontend SDK](../../../commercetools-checkout/references/payment-only-mode.md) implementation skill for SDK setup and the order-completion event handler.
5151
5252
### BU + Store Validation
5353

@@ -102,8 +102,8 @@ After submission, the quote progresses through seller review and negotiation. Se
102102
- [ ] Address step reads BU addresses, auto-selects `defaultShippingAddressId` / `defaultBillingAddressId`
103103
- [ ] All cart writes in checkout use the as-associate chain
104104
- [ ] `session.businessUnitKey` and `session.storeKey` validated before rendering checkout
105-
- [ ] Order placement driven by commercetools checkout frontend SDK — no custom order route for cart checkout
106-
- [ ] PO Number not added manually — relies on commercetools checkout SDK configuration if needed
105+
- [ ] Order placement driven by Checkout frontend SDK — no custom order route for cart checkout
106+
- [ ] PO Number not added manually — relies on Checkout SDK configuration if needed
107107
- [ ] Confirmation page handles `order.orderState === 'Open'` (approval pending) gracefully
108108
- [ ] Cart page shows **Request a Quote** button below the Checkout button
109109
- [ ] Quote request flow: addresses and shipping use the same BU patterns as Flow 1

.agents/plugins/commercetools/skills/commercetools-storefront/references/b2c/checkout.md

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -30,17 +30,17 @@ Saved addresses are display-only in the selector — editing or adding a new add
3030
## Order Placement Sequence
3131

3232
```
33-
addresses (shipping + billing) → shipping method → payment (commercetools checkout SDK) → confirmation
33+
addresses (shipping + billing) → shipping method → payment (Checkout SDK) → confirmation
3434
```
3535

3636
1. **Addresses step** — shipping and billing addresses persisted to cart in real time
3737
2. **Shipping step** — user selects a method
38-
3. **Payment step**commercetools checkout frontend SDK mounts, handles payment capture and order placement
38+
3. **Payment step**Checkout frontend SDK mounts, handles payment capture and order placement
3939
4. **Confirmation** — SDK signals completion → clear `cartId` from session → redirect to `/checkout/confirmation?orderId=<id>`
4040

41-
Order placement is handled entirely by the commercetools checkout frontend SDK on the payment step. Do not implement a separate `POST /api/checkout` route for order creation.
41+
Order placement is handled entirely by the Checkout frontend SDK on the payment step. Do not implement a separate `POST /api/checkout` route for order creation.
4242

43-
> **Reference:** See the [commercetools checkout frontend SDK](../../../commercetools-checkout/references/payment-only-mode.md) implementation skill for SDK setup and the order-completion event handler.
43+
> **Reference:** See the [Checkout frontend SDK](../../../commercetools-checkout/references/payment-only-mode.md) implementation skill for SDK setup and the order-completion event handler.
4444
4545
---
4646

@@ -51,5 +51,5 @@ Order placement is handled entirely by the commercetools checkout frontend SDK o
5151
- [ ] Saved address list shown as selectable options; manual entry also allowed
5252
- [ ] Address changes debounced to `PATCH /api/cart` (inherited from shared)
5353
- [ ] Shipping method filtered by session currency (inherited from shared)
54-
- [ ] Order placement driven by commercetools checkout frontend SDK — no custom order route
54+
- [ ] Order placement driven by Checkout frontend SDK — no custom order route
5555
- [ ] `cartId` cleared from session after SDK order completion event

.agents/plugins/commercetools/skills/commercetools-storefront/references/b2c/overview.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ metadata:
1515

1616
# Next.js + commercetools B2C Storefront
1717

18-
Production-tested patterns for building a B2C storefront on commercetools with Next.js 16, TypeScript, Tailwind v4, and JWT sessions. Derived from the b2c-starter-kit — a working production storefront.
18+
Production-tested patterns for building a B2C storefront on commercetools with Next.js 16, TypeScript, Tailwind v4, and JWT sessions.
1919

2020
> **Shared foundation:** BFF architecture, JWT session setup, commercetools SDK singleton, project scaffold, `COUNTRY_CONFIG`, performance patterns, image config, Vercel deployment, and the shared auth base are in the `commercetools-storefront` skill. Load that skill alongside this one when starting a new project.
2121

.agents/plugins/commercetools/skills/commercetools-storefront/references/core/checkout-page.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ description: Multi-step checkout structure, address step, shipping method select
44
when_to_use:
55
- "Building the checkout flow"
66
- "Implementing shipping method selection"
7-
- "Integrating the payment step with commercetools checkout SDK"
7+
- "Integrating the payment step with Checkout SDK"
88
- "Handling order confirmation pages"
99
metadata:
1010
contentType: REFERENCE
@@ -17,13 +17,13 @@ metadata:
1717

1818
**Impact: HIGH — The checkout route is the revenue path. A failed order placement or stale cart version drops the conversion entirely.**
1919

20-
This reference covers the shared checkout structure used by both B2C and B2B storefronts: the multi-step page shell, shipping method selection, payment via the commercetools checkout frontend SDK, and the confirmation page. Address step details and order placement are storefront-specific — see the relevant extension file.
20+
This reference covers the shared checkout structure used by both B2C and B2B storefronts: the multi-step page shell, shipping method selection, payment via the Checkout frontend SDK, and the confirmation page. Address step details and order placement are storefront-specific — see the relevant extension file.
2121

2222
## Table of Contents
2323
- [Pattern 1: Multi-Step Checkout Page Structure](#pattern-1-multi-step-checkout-page-structure)
2424
- [Pattern 2: Address Step](#pattern-2-address-step)
2525
- [Pattern 3: Shipping Method Selection](#pattern-3-shipping-method-selection)
26-
- [Pattern 4: Payment Step — commercetools Checkout Frontend SDK](#pattern-4-payment-step--commercetools-checkout-frontend-sdk)
26+
- [Pattern 4: Payment Step — Checkout Frontend SDK](#pattern-4-payment-step--commercetools-checkout-frontend-sdk)
2727
- [Pattern 5: Confirmation Page](#pattern-5-confirmation-page)
2828
- [Checklist](#checklist)
2929

@@ -121,11 +121,11 @@ When the user selects a method, `PATCH /api/cart` with `shippingMethodId` and up
121121

122122
---
123123

124-
## Pattern 4: Payment Step — commercetools Checkout Frontend SDK
124+
## Pattern 4: Payment Step — Checkout Frontend SDK
125125

126-
The payment step is handled entirely by the commercetools checkout frontend SDK, which renders the full payment UI and drives order placement.
126+
The payment step is handled entirely by the Checkout frontend SDK, which renders the full payment UI and drives order placement.
127127

128-
> **Reference:** See the [commercetools checkout frontend SDK](../../../commercetools-checkout/references/payment-only-mode.md) implementation skill for full setup, component mounting, and event handling.
128+
> **Reference:** See the [Checkout frontend SDK](../../../commercetools-checkout/references/payment-only-mode.md) implementation skill for full setup, component mounting, and event handling.
129129
130130
Key rules:
131131
- Do not implement a custom payment form — mount the SDK component and let it manage the flow.
@@ -169,6 +169,6 @@ Both flows (cart checkout and quote checkout) redirect to `/checkout/confirmatio
169169
- [ ] Step skip guards redirect back if prerequisites are not met
170170
- [ ] `GET /api/shipping-methods` filters by session currency
171171
- [ ] Address changes debounced to update cart address method
172-
- [ ] Payment step mounts the commercetools checkout frontend SDK — no custom payment form
172+
- [ ] Payment step mounts the Checkout frontend SDK — no custom payment form
173173
- [ ] `cartId` cleared from session after the SDK signals order completion
174174
- [ ] Confirmation page is a Server Component that fetches order by ID from commercetools

0 commit comments

Comments
 (0)