smartprocure / mobx-autoform

Ridiculously simple form state management with mobx.
MIT License
4 stars 1 forks source link

Form composition. #18

Closed stellarhoof closed 5 years ago

stellarhoof commented 5 years ago

Say you've got a couple forms form1 and form2 like the example in the readme:

let form = Form({
  fields: {
    email: {
      label: 'Email Address',
      rules: 'required|email'
    },
    password: {
      rules: 'required',
    },
  },
  submit: async snapshot => {
    await serviceCall(snapshot)
  },
  validate: validatorJS(V),
})

There's currently no way of composing them. Such composition should:

Those are the harder ones. The semantics of composing reset, validate, etc... are trivial. We just iterate through the composed forms and call those methods in order.

daedalus28 commented 5 years ago

Just summarizing our off-github conversation: I'm not sure I see the value in this because it's trivial to compose fields (just use object spread) and submit methods are just functions (so you can compose them as you would other functions). The net savings would likely be a few lines of code but would come at the cost of introducing new concepts and API surface for form composition (instead of just regular functional/object composition).

With that said, we definitely should at least create a canonical example of doing this, even if there's no official API (like how focusing a field has a demo, but no underlying actual API is needed in this library).