Order State Machine
Pending → Paid → Shipped → Delivered with cancellation paths.
Rendering…
Make it your own.
{
"nodes": [
{ "id": "p", "type": "ellipse", "label": "Pending", "x": 40, "y": 160, "fill": "#fef3c7" },
{ "id": "a", "type": "rect", "label": "Paid", "x": 220, "y": 160, "fill": "#dbeafe" },
{ "id": "s", "type": "rect", "label": "Shipped", "x": 400, "y": 160, "fill": "#ede9fe" },
{ "id": "d", "type": "ellipse", "label": "Delivered", "x": 580, "y": 160, "fill": "#dcfce7" },
{ "id": "c", "type": "rect", "label": "Cancelled", "x": 220, "y": 300, "fill": "#fee2e2" },
{ "id": "r", "type": "rect", "label": "Refunded", "x": 400, "y": 300, "fill": "#fee2e2" }
],
"edges": [
{ "id": "e1", "source": "p", "target": "a", "label": "pay" },
{ "id": "e2", "source": "a", "target": "s", "label": "ship" },
{ "id": "e3", "source": "s", "target": "d", "label": "deliver" },
{ "id": "e4", "source": "p", "target": "c", "label": "cancel" },
{ "id": "e5", "source": "a", "target": "r", "label": "refund" }
]
}