A new web component called `form-show-if` enables declarative conditional display of form fields based on the values of other fields. You wrap fields in the component and define conditions via a `conditions` attribute using key=value pairs, with `||` for multiple conditions. The component manages form state by automatically disabling hidden fields to prevent unwanted form submission and validation interference. It supports custom CSS classes for show/hide transitions, follows progressive enhancement principles (forms still work without JS), has no dependencies, and is available as a standard script or ES module on GitHub.
Table of contents
# Defining the display conditions# Customizing the show/hide behavior# Handling form state properly# Real-world examples# Progressive enhancement in action# Demo# Grab it5 Impressions