Forms

Context

Forms are a key part of our product, used for capturing user input, managing data, and enabling various interactions. To improve usability and simplify code use we are introducing a new approach to forms.

Problem

Current forms are complex and inconsistent, leading to user confusion, misuse and potential errors. Additionally, forms that do not involve API submissions or data storage need a clear, simplified representation to avoid unnecessary complexity.

Proposed Solution

  • Where to Use Forms:
    • Implement forms in areas where user input is required, such as settings and data collection.
  • Simplified Approach:
    • The new form experience should reducing complexity and provide a straightforward approach in implementation. The goal is to create more consistent and user friendly forms that handle standard form interactions.
    • More complex custom forms should be built as separate custom components without using the Component Library Package form component.
  • Considerations
    • How to represent forms that do not involve submitting data to an API or saving information, such as filters or interactive elements, with a simplified structure. Are these forms considering they focus on user interaction and responsiveness, without the need for backend integration.
  • Grouping Form Elements:
    • Forms vs. Inputs:
      • How should we group inputs in the component library package and documentation?
      • Under Form - grouping under form ties them to Forms and does not allow for use outside of the specific form element - this can be useful for situations where you may want to create custom forms or use inputs outside of form components
      • Under Input - separates inputs from forms prevents locking them to the Form component conceptually.