creation flow:
FormView extends <ObserverForm>
componentlifecycle flow:
componentDidMount
componentDidMount
)plugins:
we register a list of plugins
when we map through the list of objects at the beginning, we find the plugin for them by doing: inputsList.forEach(inputConfig => { const pluginForInput = registeredPluginList.find(plugin => { return plugin.isSatisfiedBy() }) inputConfig.plugin = pluginForInput return inputConfig })
instead of having ObserverInput handle everything, the ObserverInput does this: render() { // each InputPlugin is a simplified minimal react component return this.plugin.setPluginProps(props).render() }
class TextBoxInput extends InputChain { /** * this handles all text inputs, and is the default */ static isSatisfiedByProps(props): boolean { const typesSupported = ['text', 'confirmPassword', 'telephone'] return ( isUndefined(props.type) || typesSupported.includes(props.type) || (props.identity !== 'SecurityCode' && props.type === 'password') ) } validate = () => { const state = this.get('state') const props = this.get('props') this.isValid = validators.isValid(state.value, props.validationType) } render() { const props = this.get('props') const attributes = { ...props, } return <TextBox {...attributes} /> } }