Components
Badges and notices
Distinguish persistent record state from temporary feedback and contextual warnings.
On this page
Purpose and placement
Distinguish persistent record state from temporary feedback and contextual warnings.
Anatomy
| Part | Behavior |
|---|---|
| Badge | Short neutral/accent/success/warning/danger status. |
| Notice | Longer contextual message in one of the supported tones. |
| Save notice | A specific saved-state acknowledgment. |
Configuration and contract
| Input or decision | Implementation |
|---|---|
| AdminBadge | tone and children; source token mixtures define appearance. |
| AdminNotice | tone and content; not automatically a live region. |
| Message owner | Caller provides the truthful state and accessible announcement strategy. |
States and feedback
- All badge and notice tones captured.
- Saved feedback specimen is explicitly local, not a database-write confirmation.
Usage rules
- Use words such as Draft or Published rather than relying on tone.
- Explain recovery in an error notice.
- Do not use a success badge as evidence of an operation that has not occurred.
Accessibility and verification
Color must be redundant with text. Dynamic notices may need role/status/live semantics at the caller; those are not guaranteed by AdminNotice.
Source references
| File | Responsibility |
|---|---|
| components/admin-ui.tsx | Audited Townwell implementation; use this file when extending this interface. |
| components/admin/save-status-notice.tsx | Audited Townwell implementation; use this file when extending this interface. |
Examples from the app
Actual Boise Today and Townwell UI with synthetic editorial, business, review, media metadata and analytics. Existing Boise imagery; no live data changes. Captured at 2× resolution or higher. Select an image to inspect it full size.
Related topics
Source audit: 2026-10-07 · Revision ce8bc72b96da · Documentation v0.1