std-wizard
Level: Atom | Entity: WizardEntry | Persistence: runtime
5 states, 5 events, 10 transitions
Live Preview
schema.orb
{
"name": "WizardEntryOrbital",
"orbitals": [
{
"name": "WizardEntryOrbital",
"entity": {
"name": "WizardEntry",
"persistence": "runtime",
"fields": [
{
"name": "id",
"type": "string"
},
{
"name": "name",
"type": "string"
},
{
"name": "description",
"type": "string"
},
{
"name": "status",
"type": "string",
"default": "active",
"values": [
"active",
"inactive",
"pending"
]
},
{
"name": "createdAt",
"type": "string"
}
]
},
"traits": [
{
"name": "WizardEntryWizard",
"linkedEntity": "WizardEntry",
"category": "interaction",
"stateMachine": {
"states": [
{
"name": "step1",
"isInitial": true
},
{
"name": "step2"
},
{
"name": "step3"
},
{
"name": "review"
},
{
"name": "complete"
}
],
"events": [
{
"key": "INIT",
"name": "Initialize"
},
{
"key": "NEXT",
"name": "Next Step",
"payload": [
{
"name": "data",
"type": "object",
"required": true
}
]
},
{
"key": "PREV",
"name": "Previous Step"
},
{
"key": "COMPLETE",
"name": "Complete Wizard",
"payload": [
{
"name": "data",
"type": "object",
"required": true
}
]
},
{
"key": "RESTART",
"name": "Restart Wizard"
}
],
"transitions": [
{
"from": "step1",
"to": "step1",
"event": "INIT",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 0
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 0
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Personal Info",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "INIT",
"fields": [
"name",
"description"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
},
{
"from": "step1",
"to": "step2",
"event": "NEXT",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 1
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 1
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Settings",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "PREV",
"fields": [
"status"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Back",
"event": "PREV",
"variant": "ghost",
"icon": "arrow-left"
},
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
},
{
"from": "step2",
"to": "step3",
"event": "NEXT",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 2
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 2
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Review",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "PREV",
"fields": [
"createdAt"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Back",
"event": "PREV",
"variant": "ghost",
"icon": "arrow-left"
},
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
},
{
"from": "step3",
"to": "review",
"event": "NEXT",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "badge",
"label": "Review"
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 3
},
{
"type": "divider"
},
{
"type": "data-list",
"entity": "WizardEntry",
"renderItem": [
"fn",
"item",
{
"type": "stack",
"direction": "vertical",
"gap": "sm",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "md",
"justify": "space-between",
"children": [
{
"type": "typography",
"variant": "caption",
"content": "Name"
},
{
"type": "typography",
"variant": "body",
"content": "@item.name"
}
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "md",
"justify": "space-between",
"children": [
{
"type": "typography",
"variant": "caption",
"content": "Description"
},
{
"type": "typography",
"variant": "body",
"content": "@item.description"
}
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "md",
"justify": "space-between",
"children": [
{
"type": "typography",
"variant": "caption",
"content": "Status"
},
{
"type": "typography",
"variant": "body",
"content": "@item.status"
}
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "md",
"justify": "space-between",
"children": [
{
"type": "typography",
"variant": "caption",
"content": "CreatedAt"
},
{
"type": "typography",
"variant": "body",
"content": "@item.createdAt"
}
]
}
]
}
]
},
{
"type": "wizard-navigation",
"currentStep": 3,
"totalSteps": 4,
"showBack": true,
"showComplete": true,
"showNext": false
}
]
}
]
]
},
{
"from": "step2",
"to": "step1",
"event": "PREV",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 0
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 0
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Personal Info",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "INIT",
"fields": [
"name",
"description"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
},
{
"from": "step3",
"to": "step2",
"event": "PREV",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 1
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 1
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Settings",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "PREV",
"fields": [
"status"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Back",
"event": "PREV",
"variant": "ghost",
"icon": "arrow-left"
},
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
},
{
"from": "review",
"to": "step3",
"event": "PREV",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 2
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 2
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Review",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "PREV",
"fields": [
"createdAt"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Back",
"event": "PREV",
"variant": "ghost",
"icon": "arrow-left"
},
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
},
{
"from": "review",
"to": "complete",
"event": "COMPLETE",
"effects": [
[
"persist",
"create",
"WizardEntry",
"@payload.data"
],
[
"notify",
"success",
"WizardEntry created successfully"
],
[
"render-ui",
"main",
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"align": "center",
"children": [
{
"type": "icon",
"name": "check-circle",
"size": "lg"
},
{
"type": "typography",
"content": "Complete!",
"variant": "h2"
},
{
"type": "typography",
"content": "Your wizardentry has been created successfully.",
"variant": "body"
},
{
"type": "button",
"label": "Start New",
"event": "RESTART",
"variant": "primary",
"icon": "refresh-cw"
}
]
}
]
]
},
{
"from": "complete",
"to": "step1",
"event": "RESTART",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 0
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 0
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Personal Info",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "INIT",
"fields": [
"name",
"description"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
},
{
"from": "complete",
"to": "step1",
"event": "INIT",
"effects": [
[
"fetch",
"WizardEntry"
],
[
"render-ui",
"main",
{
"type": "container",
"maxWidth": "lg",
"padding": "lg",
"children": [
{
"type": "stack",
"direction": "vertical",
"gap": "lg",
"children": [
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"align": "center",
"children": [
{
"type": "icon",
"name": "clipboard",
"size": "lg"
},
{
"type": "typography",
"content": "Setup Wizard",
"variant": "h2"
}
]
},
{
"type": "progress-dots",
"count": 3,
"currentIndex": 0
},
{
"type": "wizard-progress",
"steps": [
"Personal Info",
"Settings",
"Review"
],
"currentStep": 0
},
{
"type": "divider"
},
{
"type": "typography",
"content": "Personal Info",
"variant": "h3"
},
{
"type": "form-section",
"entity": "WizardEntry",
"mode": "create",
"submitEvent": "NEXT",
"cancelEvent": "INIT",
"fields": [
"name",
"description"
]
},
{
"type": "stack",
"direction": "horizontal",
"gap": "sm",
"justify": "end",
"children": [
{
"type": "button",
"label": "Next",
"event": "NEXT",
"variant": "primary",
"icon": "arrow-right"
}
]
}
]
}
]
}
]
]
}
]
}
}
],
"pages": [
{
"name": "WizardEntryPage",
"path": "/wizard",
"traits": [
{
"ref": "WizardEntryWizard"
}
]
}
]
}
],
"description": "Multi-step wizard behavior parameterized for any domain. Generates a dynamic number of steps based on the `steps` parameter, with a review screen and completion view. Pure function: params in, OrbitalDefinition out."
}
Loading preview...
Orbital Visualization
Loading visualization...
Entity Fields
| Field | Type | Default |
|---|---|---|
| id | string | - |
| name | string | - |
| description | string | - |
| status | string | "active" |
| createdAt | string | - |
States
| State | Type |
|---|---|
| step1 | Initial |
| step2 | - |
| step3 | - |
| review | - |
| complete | - |
Events
| Event | Payload |
|---|---|
| INIT | - |
| NEXT | data: object |
| PREV | - |
| COMPLETE | data: object |
| RESTART | - |
Transitions
| From | Event | To | Effects |
|---|---|---|---|
| step1 | INIT | step1 | 2 effects |
| step1 | NEXT | step2 | 2 effects |
| step2 | NEXT | step3 | 2 effects |
| step3 | NEXT | review | 2 effects |
| step2 | PREV | step1 | 2 effects |
| step3 | PREV | step2 | 2 effects |
| review | PREV | step3 | 2 effects |
| review | COMPLETE | complete | 3 effects |
| complete | RESTART | step1 | 2 effects |
| complete | INIT | step1 | 2 effects |