Consider deprecating this in favor of @reach/component-component

First of all, thanks again for the amazing work on formik, I’ve recently upgraded it from 0.* to 1.3 without breaking changes 😲!

I think this package brings not so much value considering more generic alternatives, like: https://ui.reach.tech/component-component

I propose to deprecate this redirecting the new users to the alternatives!

Comparison

// withFormikEffect.js
import React from 'react'
import ReactDOM from 'react-dom'
import {Formik, Form, Field} from 'formik'
import {Effect} from 'formik-effect'

const App = () => (
  <div>
    <h1>Formik with formik-effect</h1>
    <Formik onSubmit={console.log} initialValues={{nickname: '', password: ''}}>
      {formik => (
        <Form>
          <Effect
            onChange={(currentFormik, nextFormik) =>
              console.log(currentFormik, nextFormik)
            }
          />

          <Field name="nickname" />
          <Field name="password" />
          <input type="submit" />
        </Form>
      )}
    </Formik>
  </div>
)

const rootElement = document.getElementById('root')
ReactDOM.render(<App />, rootElement)

vs

// withComponentComponent.js
import React from 'react'
import ReactDOM from 'react-dom'
import {Formik, Form, Field} from 'formik'
import Component from '@reach/component-component'

const App = () => (
  <div>
    <h1>Formik with formik-effect</h1>
    <Formik onSubmit={console.log} initialValues={{nickname: '', password: ''}}>
      {formik => (
        <Form>
          <Component
            formik={formik}
            didUpdate={({prevProps, props}) => {
              console.log(prevProps.formik, props.formik)
            }}
          />

          <Field name="nickname" />
          <Field name="password" />
          <input type="submit" />
        </Form>
      )}
    </Formik>
  </div>
)

const rootElement = document.getElementById('root')
ReactDOM.render(<App />, rootElement)

The difference is minimal and u can do it in other ways also (for example passing only the formikBag props you want to Component)

[jedrichards]

@cloud-walker Yeah exactly. Got it now - thanks! 🙇

[MikeSuiter]

Kind of an edge case to submit a form on a field change but in our real app we have a select field that when changed will make a REST call to filter the grid contents. I think it’s a better experience to submit the form on change rather than making them select then hit a button. The sandbox is a dumb example but did show what was going on.

Jared pointed me in a right direction and for this I’m not using Component-Component. There are some places where we need to update a field based on a value from another field so I want to try C-C there. Here is my solution for submitting on a select field change.

https://github.com/jaredpalmer/formik/issues/1209#issuecomment-450027026