Offline runtime
Three orchestrated surfaces — banner, sync queue, conflict dialog — that make the product workable on intermittent connectivity.
COMPOSITION 01
Banner only · just-disconnected
A single sticky bar at the top of the chrome. Pulse animation for 5 seconds, then settles.
Use whenThe connection just dropped; the operator should know but nothing is queued yet.
Offline since 14:12 · still working
POS, stock and HR continue. Receipts queue locally.
COMPOSITION 02
Banner + sync panel
When the queue grows past 3 items, the sync panel slides in from the right showing what is pending.
Use whenThe operator has been working for a while offline; they want to see what is waiting.
Offline · 7 actions queued
Sync queue · 7 pending
Receipt R-19281 $ 17.21
14:32Receipt R-19282 $ 24.80
14:38Receipt R-19283 $ 8.40
14:42Shift S-2841 close —
19:14COMPOSITION 03
Conflict resolution
After reconnect, server has a newer version of a record edited offline. Operator picks which to keep.
Use whenSync finds a conflict — a record was changed both locally and on the server while disconnected.
● Sync conflict
Inventory adjustment SKU-0833
The server has a newer version. Pick which to keep.
Your version (local)
On-hand12
ReasonStock take
Edited14:12
Server version
On-hand14
ReasonStock take
Edited14:18
Shared rules
Do
Queue every action locally. POS, stock, attendance keep working.
Don't
Block read-only surfaces when offline.
Do
When network returns, sync quietly with progress.
Don't
Auto-merge conflicts. Always open the dialog.