Feature: HTMX support and a nifty Form Builder#7
Merged
Conversation
- 26 new tests covering all HTMX attributes - Document hx_* attribute usage in SKILL.md (full reference) - Add HTMX examples to README.md - Covers: requests, targeting, swapping, triggers, extensions HTMX attributes already work via underscore-to-hyphen conversion. This commit adds docs and test coverage to ensure it stays working. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
New Field class with static methods for generating form fields:
- Text inputs: text, email, password, url, tel, search, textarea
- Numeric: number, range
- Date/time: date, time, datetime_local
- Selection: select, checkbox, radio
- Other: file, hidden, color
Features:
- HTML5 validation attributes (required, minlength, pattern, etc.)
- Optional labels with proper for/id linking
- Optional wrapper divs for CSS framework compatibility
- Select supports string, tuple, and dict option formats
- Works seamlessly with HTMX attributes
Usage:
Form(
Field.email("email", label="Email", required=True),
Field.password("password", label="Password", min_length=8),
Button("Log In", type="submit")
)
53 new tests (420 total)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This pull request introduces a major new feature to NitroUI: a declarative HTML5 form builder API via the new
Fieldclass, as well as comprehensive documentation and tests for HTMX integration. The changes provide a unified, composable way to generate form fields with validation, labels, wrappers, and full support for HTMX attributes. The documentation has been expanded to cover the new form builder and HTMX usage patterns, and new tests ensure robust HTMX attribute handling.Form Builder Feature:
Fieldclass for declarative form field creation, supporting all HTML5 input types, validation attributes, labels, wrappers, and flexible option formats for selects and radios (src/nitro_ui/forms/field.py,src/nitro_ui/forms/__init__.py,src/nitro_ui/__init__.py, [1] [2] [3] [4].SKILL.mdand a new design doc (docs/plans/2026-01-30-form-builder-design.md, [1] [2] [3].HTMX Integration:
README.md,SKILL.md, [1] [2].tests/test_htmx.py, tests/test_htmx.pyR1-R174).Exports and API Consistency:
Fieldin both the main NitroUI namespace and the forms submodule for consistent imports (src/nitro_ui/__init__.py, [1] [2];src/nitro_ui/forms/__init__.py, [3].Documentation Improvements:
README.mdandSKILL.mdfor form builder and HTMX usage, making it easier for users to discover and adopt these features [1] [2] [3].Design Documentation:
docs/plans/2026-01-30-form-builder-design.md, docs/plans/2026-01-30-form-builder-design.mdR1-R176).