diff --git a/llms.txt b/llms.txt index bc12aa5a..86c89532 100644 --- a/llms.txt +++ b/llms.txt @@ -136,9 +136,6 @@ const LoginForm = () => {

Sign In

- {/* Form-level error display */} - - { disabled={isSubmitting} /> + + @@ -993,6 +992,9 @@ const ComprehensiveForm = () => { {/* Submit Button & Status */}
+ {/* Form-level errors appear below inputs, above submit button */} + +
)} - - {/* General Error */} - {fetcher.data?.errors?._form && ( -
-

{fetcher.data.errors._form.message}

-
- )}
@@ -1144,14 +1139,14 @@ This comprehensive example serves as a complete reference for implementing any f 7. **FormError Placement Options** ```typescript - // Top of form (most common) + // Below inputs, above submit button (most common) // Between sections - // Bottom of form - + // Top of form (for critical errors that need immediate attention) + // Multiple placements with different styling @@ -1212,9 +1207,10 @@ This comprehensive example serves as a complete reference for implementing any f - **Be user-friendly**: Avoid technical jargon and error codes ### 3. Placement Strategy -- **Top placement**: For critical errors that should be seen immediately +- **Below inputs, above submit button**: Most common placement - users see errors after completing form fields but before submitting +- **Top placement**: For critical errors that need immediate attention before users start filling the form - **Inline placement**: For contextual errors related to specific sections -- **Bottom placement**: For summary or less critical errors +- **Multiple placements**: FormError can be placed anywhere in the form and styled differently for various use cases ### 4. Component Integration - FormError works seamlessly with all existing form components