Household pattern
ActivityReplay
A practice week with scrubbing, playback, event details and a comparison against your saved note.
States
Original note, mid-week
Play, pause, scrub, and select an event. On a phone, selection opens a sheet.
A practice week
The week of Aug 24
A household example. Nothing here places an order or sends a message.
Showing the template as written.
Wednesday, Aug 26 at 9:30 am
Now: Wednesday, Aug 26 at 9:30 am
Drag the time marker to look back. Use arrow keys to move an hour, or hold Shift to move six.
Through the week
Choose an event to read what happened and the line in your note behind it.
Mon, Aug 24
7:05 amDone
Reorder oat milk, eggs and bananas
Oat milk ran out Sunday and there were two eggs left. Added to Wednesday's Greenleaf delivery.
7:06 amDone
Apply 15% off dairy at Greenleaf
Greenleaf has 15% off dairy this week. It covers the eggs.
9:30 amAsked you
Swap Cheerios for Honey Nut Cheerios
Greenleaf is out of the 18 oz plain Cheerios until Friday. Honey Nut is the closest match and 40¢ more.
Tue, Aug 25
6:50 amDone
Reorder coffee beans and dish soap
Coffee lasts about ten days and the last bag was opened on the 14th. Dish soap is on the same rhythm.
6:52 amAsked you
Add fruit leather for lunchboxes
The shared list says "lunchbox snacks". You've bought this brand in store but never had it delivered.
11:15 amRefused
Add a bottle of Pinot Noir
Greenleaf's "pairs well with" suggestion for the salmon in Wednesday's order.
Wed, Aug 26
7:00 amWaiting on you
Reorder laundry detergent, the 5-litre size
The big bottle from Valley Wholesale works out 30% cheaper per wash than the one you usually get, but it's a bigger order than usual.
8:15 amDone
Move today's delivery to 7–9 pm
Greenleaf dropped the 5–7 pm slot. 7–9 pm is the next one today and nobody's out this evening.
Thu, Aug 27
6:55 amComing up
Reorder chicken thighs, rice and spinach
The usual Thursday dinner things. The 5 lb rice bag is the better price per pound.
3:40 pmComing up
Swap the 12-pack paper towels for an 8-pack
Valley Wholesale's 12-pack is out until next week. The 8-pack is the nearest match and $3.10 more per roll-for-roll.
Fri, Aug 28
7:10 amComing up
Apply $5 off $50 at Valley Wholesale
Valley's monthly $5-off offer applies to the detergent order.
12:30 pmComing up
Order Biscuit's dog food from PetPal
The usual 15 lb bag is $8 cheaper at PetPal this week than at Greenleaf.
Sat, Aug 29
9:00 amComing up
Move Sunday's delivery to Monday morning
Your calendar shows everyone out Sunday from 10 am to 6 pm, which covers the whole delivery window.
Sun, Aug 30
7:00 amComing up
Reorder bread, butter and yogurt
The Sunday basics for the school week.
What-if, saved $60 ceiling
A practice week
The week of Aug 24
A household example. Nothing here places an order or sends a message.
Your note still matches the template. Change a limit or rule in the contract to try a different week.
Sunday, Aug 30 at 11:59 pm
Now: Sunday, Aug 30 at 11:59 pm
Drag the time marker to look back. Use arrow keys to move an hour, or hold Shift to move six.
Through the week
Choose an event to read what happened and the line in your note behind it.
Mon, Aug 24
7:05 amDone
Reorder oat milk, eggs and bananas
Oat milk ran out Sunday and there were two eggs left. Added to Wednesday's Greenleaf delivery.
7:06 amDone
Apply 15% off dairy at Greenleaf
Greenleaf has 15% off dairy this week. It covers the eggs.
9:30 amAsked you
Swap Cheerios for Honey Nut Cheerios
Greenleaf is out of the 18 oz plain Cheerios until Friday. Honey Nut is the closest match and 40¢ more.
Tue, Aug 25
6:50 amDone
Reorder coffee beans and dish soap
Coffee lasts about ten days and the last bag was opened on the 14th. Dish soap is on the same rhythm.
6:52 amAsked you
Add fruit leather for lunchboxes
The shared list says "lunchbox snacks". You've bought this brand in store but never had it delivered.
11:15 amRefused
Add a bottle of Pinot Noir
Greenleaf's "pairs well with" suggestion for the salmon in Wednesday's order.
Wed, Aug 26
7:00 amLimit hit
Reorder laundry detergent, the 5-litre size
The big bottle from Valley Wholesale works out 30% cheaper per wash than the one you usually get, but it's a bigger order than usual.
8:15 amDone
Move today's delivery to 7–9 pm
Greenleaf dropped the 5–7 pm slot. 7–9 pm is the next one today and nobody's out this evening.
Thu, Aug 27
6:55 amDone
Reorder chicken thighs, rice and spinach
The usual Thursday dinner things. The 5 lb rice bag is the better price per pound.
3:40 pmNo answer
Swap the 12-pack paper towels for an 8-pack
Valley Wholesale's 12-pack is out until next week. The 8-pack is the nearest match and $3.10 more per roll-for-roll.
Fri, Aug 28
7:10 amDone
Apply $5 off $50 at Valley Wholesale
Valley's monthly $5-off offer applies to the detergent order.
12:30 pmRefused
Order Biscuit's dog food from PetPal
The usual 15 lb bag is $8 cheaper at PetPal this week than at Greenleaf.
Sat, Aug 29
9:00 amLimit hit
Move Sunday's delivery to Monday morning
Your calendar shows everyone out Sunday from 10 am to 6 pm, which covers the whole delivery window.
Sun, Aug 30
7:00 amLimit hit
Reorder bread, butter and yogurt
The Sunday basics for the school week.
Empty period
A practice week
The week of Aug 24
A household example. Nothing here places an order or sends a message.
Showing the template as written.
Wednesday, Aug 26 at 9:30 am
Nothing happened in this stretch.
Now: Wednesday, Aug 26 at 9:30 am
Drag the time marker to look back. Use arrow keys to move an hour, or hold Shift to move six.
Through the week
Choose an event to read what happened and the line in your note behind it.
Nothing happened in this stretch.
When to use
- On a helper’s Activity route, below the shared header and navigation.
- For a simulated fixture whose outcomes can be re-evaluated from a contract.
When not to
- For live approvals or real orders.
- For the compact preview on a gallery card; use TraceEvent there.
Props
| Name | Type | Notes |
|---|---|---|
| template* | Template | Default contract and intent-only fixture. Mount with key={template.id} when changing templates. |
| initialNow | number | Optional initial playhead instant; normally use the fixture default. |
| initialWhatIf | boolean | Start with the edited contract visible. Defaults to false. |
* required
Accessibility invariants
- Playback starts only on request and stops when scrubbing, selecting an event, or switching the comparison.
- Timeline markers are keyboard buttons; the playhead is a named slider.
- Phone selection opens a Sheet with focus return and Escape dismissal.
- Changed events have an announced label and rings, with previous status text in the trace.
- Reduced motion is respected by the existing timeline and glyph primitives.
Agent instructions
For anything generating UI from this system
Use useEditableContract(template), exactly as the editor does. Evaluate the default and shared edited contracts against the same fixture; use diffRuns for changedIds and statusAt(baseEvent, now) for changedFrom. Never make a draft contract, calculate outcomes, count changes, or assign event colours in this component. Keep all approval cards read-only. Group days and advance through transitions with the engine helpers. This is an application composite documented here for reuse.