Components
Block editor and validation
Choose the activity, project, start/end time, and supporting detail with explicit range validation.
On this page
Purpose and usage
Choose the activity, project, start/end time, and supporting detail with explicit range validation.
Use for adding a daily block; reuse ProjectEventModal for project resource events.
Anatomy
| Part | Contract |
|---|---|
| Activity options | Type choice changes the editor context. |
| Project choice | Uses active project options when needed. |
| Time range | Native time inputs for start and end. |
| Feedback | Polite validation message near the save action. |
Variants and configuration
| Configuration | Behavior |
|---|---|
| choice | Project, event, lunch or time-away entry point. |
| start/end | Fractional hour values initialize native time inputs. |
| onSave | Returns a message or null. |
| onClose | Provided by the parent. |
State coverage
| State | Implemented behavior |
|---|---|
| Valid draft | Save sends a trimmed draft to the parent. |
| Invalid range | The block must end after it starts. |
| Placement rejected | Parent’s error message is shown. |
Interaction and responsive behavior
- Validate end after start before attempting placement.
- The parent must check bounds, overlap, availability and persistence.
- Keep editable times available as a non-drag path for creating entries.
Accessibility contract
- Inspect field labels and native time controls.
- The live error message communicates rejection.
- This specific editor must be reviewed for dialog semantics, focus trapping and restoration; other dialog components cannot confer those behaviors on it.
Known gaps and readiness
There is no claim of full modal accessibility for AgendaBlockModal. The screenshot demonstrates real range validation, not a successful server save.
Composition example
<AgendaBlockModal choice="project" start={8} end={9.5}
projects={projectOptions} onSave={validateAndSave}
onClose={closeEditor} />Source references
| File | Responsibility |
|---|---|
| app/components/agenda-block-modal.tsx | Time-entry form |
| app/components/radar-calendar.tsx | Placement callback and persistence |
Examples from the app
Actual Radarist components with fictional data. Captured at 2× resolution or higher. Select an image to inspect it full size.
Related topics
Source audit: 2026-10-07 · Revision 0103e2549959 · Documentation v0.1