Patient Intake Steps Contact Block for React

Nowhere yet. Send waits 800 milliseconds as a stand-in for a request and then shows the confirmation. Replace that timer in submit with a call to your patient system: details holds every answer, and the pad can hand you its image in onDrawEnd through getDataUrl("image/png") (the demo only counts strokes). Handle real health data only in a system your privacy rules allow.

Next checks the current step and only then moves on; an answer never advances by itself, and Enter in a field does what Next does. The step row is navigation too, but only up to the furthest step you have reached, so you can go back and forward without skipping ahead. After each move, focus lands on the new step's heading and a polite status says "Step 2 of 4: History". Send re-checks everything, and if an earlier step is no longer right it reopens that step.

An unseen copy of all four panels sits in the same grid cell as the live one, so the cell is as tall as the tallest panel at every width. The unseen copies are inert and hidden from assistive technology, use their own ids, and swap the date field and the signature pad for blank boxes of the same size. The allergies field is counted as open in that copy, so switching allergies on adds nothing.

The pad takes a pointer or a finger, and it is labelled as a signature pad with a Clear button. Keyboard and screen reader users, and anyone who would rather not draw, type their full name in the field beside it: that field is required whenever the pad is empty, and a drawn signature makes typing optional. Either one is accepted and the review says which was used.

No. The consent box and every condition start unticked, and the allergies switch starts off. Conditions are optional; allergies need a note only if the switch is on; consent is required, with its text next to it.

The step row keeps its numbers and drops the names below md (screen readers still hear them). The conditions go one per row, the name, date and email fields stack, and the pad keeps its 160 pixel height with the typed-name field under it. Nothing scrolls sideways at 320 pixels, and in a right-to-left layout the Back chevron and the panels' slide mirror.