You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository has been archived by the owner on Dec 2, 2021. It is now read-only.
Here are some very rough (malleable) ideas about how we could make this form generalizable. The ideas are:
Enable teams to customize the UI look-and-feel without re-investing the form-building logic from scratch
Preserve as much of the form specification (form.yml) and validation components ("email must be valid, etc.") as possible
Enable a (long-term) future where we can build form-building tooling on top of form.yml (like a UI for validating translations or for updating copy + structure with an iframe to visualize it).
I imagine we could have a <Form /> component that allows you to override specific components to customize the rendering behavior (to use your own design system, f.e.):
import{CustomEmail}from'./components/CustomEmail'// ...return(// The Form component is mostly a "container" with no// UI logic. It just handles setting up contexts / // passing the relevant props to the underlying `Page`// component.<Form// You can override the high-level Page component// to change how a specific page is rendered.// The PAPUA Page component would render our sidebar, f.e.page={Page}// The submit page is a special version of the Page// component that is rendered when all form pages// have finished.submit={Submit}// This is similar to the mapping we already have.// It would allow you to do things like swap out the// Grommet TextInput for an Evergreen TextInput.questions={{email: CustomEmail,// ...}}/>)
Each custom component could access the same FormContext with the useContext hook that we expose now. The FormContext will continue to handle a) loading + validating the form.yml, b) managing values and errors, and c) data type validation.
Notably, this approach (since it relies on React Contexts) would require teams to use React.
The text was updated successfully, but these errors were encountered:
Sign up for freeto subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Here are some very rough (malleable) ideas about how we could make this form generalizable. The ideas are:
form.yml
) and validation components ("email must be valid, etc."
) as possibleform.yml
(like a UI for validating translations or for updating copy + structure with aniframe
to visualize it).I imagine we could have a
<Form />
component that allows you to override specific components to customize the rendering behavior (to use your own design system, f.e.):Each custom component could access the same
FormContext
with theuseContext
hook that we expose now. TheFormContext
will continue to handle a) loading + validating theform.yml
, b) managing values and errors, and c) data type validation.Notably, this approach (since it relies on React Contexts) would require teams to use React.
The text was updated successfully, but these errors were encountered: