A New Model for Form Components
summary
A new component model centers on small composables that supply prop bundles and behaviors so templates keep the HTML while state and accessibility live in JS. It uses form transactions to detect adds/removes under V-for/V-if, composes behaviors like use number field (locale-aware parsing and spin buttons), use date field (alternate calendars, segmented inputs) and slider/select/dropzone primitives, and consolidates HTML validation and schema validation. The claim is smaller, predictable code that handles RTL, keyboard navigation and ARIA without imposing a head or locked markup; see formwork.dev.
AI-written summary · about
chapters (14)
- 0:00Introduction and delays
- 1:10Problem with form libraries
- 3:41Accessibility and RTL challenges
- 5:50Headless libraries limitations
- 10:40New model for form components
- 16:22Form transactions explained
- 17:45Markup and accessibility
- 19:29Locale-aware number parsing
- 21:55Composable field architecture
- 24:23Composables in UI components
- 25:48Demo of text fields
- 27:12Complex components like date pickers
- 29:42Drop zones and advanced features
- 31:06Conclusion and library showcase
related talks
31mComposable Form Brains without Bloat
27mConquering forms in Vue
24mScalable Forms in Vue
27mMastering the Art of Forms
34mConquering Forms in Vue
41mWeb Components: Maintaining and Reusing your Frontend
28mForm forms and reform that way
49mBuilding Better Components - A Journey to a More Resilient Frontend