Forms Framework (Office hours: Jan 25, 2022)

[henrieri]

The specific questions I have are...

• Get feedback for default standard practices for Forms Framework

Background: We are looking to standardise the form framework based on Paste and react-hook-forms. Currently we are using this framework in Messaging UI, but we are looking to share it with other teams after we are sure that it matches best practices as closely as possible.
Stage of design: Used in Messaging Console UI
Research:
GitHub repository & Docs
https://github.com/twilio/react-typed-forms

Storybook:
https://effective-couscous-d99c0d1f.pages.github.io/

Default behaviours of the form:
https://docs.google.com/spreadsheets/d/13mleZ8dP1Y75tXrD4IEza-CCjyc1UVhYkz-CV_APEPI/edit?usp=sharing

Rough presentation notes:
https://docs.google.com/document/d/13FbuZVUbM-1QPOjqpNMVNe2ifloiuRlUAMcE4ZclMnU/edit#

Example of a more complicated form (with N amount of input elements) and its source code:
https://effective-couscous-d99c0d1f.pages.github.io/?path=/docs/forms-create-template-form--create-template-form

Links to mockups or prototype: https://github.com/twilio/react-typed-forms

[andioneto]

Hi @henrieri 👋 Thanks again for coming to office hours and sharing react-typed-forms with us.

Here is a recap of what we dicussed and some future actions we will be taking 👇

This toolkit was built to address the following pain points:

• there is a lack of consistent UX, layout, composition, and state management in our form implementations
• there can be a heavy upfront investment in boilerplate code to create a simple form

Henri and his friends on messaging console will continue to own this toolkit, and Paste will assist them in a number of ways:

• We will set up time and space for Henri to present this toolkit to our Peer Committees, and will facilitate those sessions
• We will work with the committee, Henri, and peers to create guidance for best practices and patterns in form composition (including but not limited to: accessibility, composition, interactions, etc.)
• Shepard progress and support as needed