§Demo 03
Every state of a screen. Each one a link.
Pick a state and watch the address change, or read the whole matrix at once. This page is driven by its own URL, the way State Mode is: copy the link and the state travels with it.
localhost:3000/items?plan=pro
Demo screen
Items
Everything your team is working on, in one list.
Pro plan New item
- Items
- 4
- Live
- 2
- Owners
- 4
| Item | Owner | Status |
|---|---|---|
| Onboarding checklistinv-1042 | Jane | live |
| Billing settingsinv-1041 | Sam | draft |
| Team invitationsinv-1040 | Ana | live |
| Notification rulesinv-1039 | Lee | draft |
The address above is the state. Nothing else remembers it.
Matrix · Items
Plan: pro · click a state to open it
In a real project
- The registry
- Screens, axes and states are declared in one file.
/auis-update-stateskeeps it in step with the code. - The URL
- A state is a query parameter, so a designer, an agent and a test all open the same thing.
- The matrix
- Every registered screen in every state at /auis/states, and as a PDF with one command.