React Examples
All React examples live under:
packages/react/examples
Minimal
| Example | Purpose |
|---|---|
simple-flow.tsx | Minimal provider + renderer flow |
simple-back.flow.tsx | Basic HISTORY_TARGET usage |
go-to-jump.flow.tsx | Programmatic step jumps |
Feature-Focused
| Example | Purpose |
|---|---|
conditional-skip.flow.tsx | Optional step routing |
first-match-wins.flow.tsx | Transition precedence |
custom-event.flow.tsx | Custom event dispatch |
async-guard.flow.tsx | Async when with UI |
async-effect.flow.tsx | Async context updates |
dynamic-steps.flow.tsx | Runtime graph updates |
reset-on-journey-change.flow.tsx | Intentional provider reset |
confirm-close.flow.tsx | Dirty-close confirmation |
history-back.flow.tsx | Branch-aware back UX |
Real Journey Scenarios
| Example | Domain |
|---|---|
group-trip.flow.tsx | Group travel planning |
itinerary-builder.flow.tsx | Itinerary building |
onboarding.flow.tsx | Branching onboarding |
checkout.flow.tsx | Checkout flow |
support-ticket.flow.tsx | Support intake |
Suggested Adoption Path
- Start from
simple-flow.tsx. - Add guards/effects from feature examples.
- Validate behavior with one real-domain example close to your product workflow.