Tab Form: Complete Interview Checklist

Core (steps config, formData object, render, prev/next, validation, submit on last, prev hidden on first), advanced (progress indicator, prevent skip, real-time validation, error messages, summary step), CSS (tabs, fields, buttons, progress, errors), and testing (persistence, validation, boundaries, submit, tab click).

Multiple steps with fields, a single formData object that persists, prev/next navigation, per-step validation for required fields, submit button on the last step, and prev button hidden on the first step. These are the minimum.

Progress indicator (linear or stepped), prevent forward jump without validation, real-time validation on blur, per-field error messages, and a summary/review step before final submit. These show depth and production-readiness.

Test data persistence (fill step 1, go to step 2, come back), validation (try next with empty fields), prev on first step (should be hidden), submit on last step (should work), and tab click forward (should validate first).

Store all data in a single object: const formData = {}. Update on every input change: formData[name] = value. On render, set input values from this object: value={formData[field.name] || ''}. The object is in the outer scope, so it persists.