# Checkout Wizard

Multi-step checkout, cart, order, and payment wizard with a running summary that recalculates as answers change. It adapts to its host width, renders the summary first on narrow surfaces, validates every forward path, and completes locally without sending payment.

UI demo only: authentication, payments, AI responses, uploads and navigation are not connected to production services. Keep the Meta MIT notice. Media comes from the pinned Astryx repository; copy the media directory with its license or replace /resource-previews/astryx/ paths with your own assets. See /resource-previews/astryx/media/manifest.json for provenance. Template body copy stays in its original language. Three upstream draft templates are labeled experimental.

Status: ready

## Dependencies

```sh
npm install @astryxdesign/core@0.7.1 @astryxdesign/theme-neutral@0.7.1 @stylexjs/stylex@0.19.0 @heroicons/react@2.2.0
```

## Scaffold the upstream template

```sh
npx @astryxdesign/cli@0.7.1 template checkout-wizard ./src/templates/checkout-wizard
```

Run in the consumer project. Inspect the target directory first; never overwrite existing files. npm installs dependencies; the CLI scaffolds template source.

First configure React 19, base CSS and a Theme provider. [Setup](/resources/astryx/docs/getting-started)

Uses prebuilt Astryx component styles.

License: MIT
Source: @astryxdesign/cli@0.7.1/packages/cli/assets/templates/pages/checkout-wizard/page.tsx


---

Index of all JGuang resources: https://jiguang132.com/llms.txt