1.4.x → 1.5.x

Release 1.5 includes crucial architecture rewrite to allow new features in the future.

Removed ImmutableJS

ImmutableJS is no longer a peer dependency of React Advanced Form. Having react alone is now sufficient to use your favorite form library!

Uninstall immutable package from your project in case you do not use it.

Deprecated withImmutable

Consequentially after removing immutable from library's dependencies, we deprecated the usage of immutable instances in various callback methods provided by the form. Please use plain JavaScript data types from now on.

FormProvider and Form components no longer support withImmutable prop.

Before:

const registerUser = ({ fields }) => {
  /* "fields" is the instance of Immutable.Map */
  const username = fields.get('username')
  const value = username.get('value')
}

<Form action={registerUser} withImmutable>
  <Input name="username" />
</Form>

After:

const registerUser = ({ fields }) => {
  /* "fields" is a plain Object */
  const { username } = fields
  const { value } = username
}

<Form action={registerUser}>
  <Input name="username" />
</Form>

Remove withImmutable prop and (optionally) re-write the usage of immutable instances in callback arguments to use plain JavaScript primitives.

Deprecated fields in rule resolvers

A rule resolver that references another field is expected to become reactive. Previously, we have used Proxy on fields Object to flush the references fields. However, to enable at least IE11 support we reworked the functionality and introduces a dedicated get function for reactive field references.

const validationRules = {
  name: {
    confirmPassword: ({ get, value, fieldProps, form }) => {
      return (value === get(['password']))
    },
  },
}

Replace fields.foo.bar by get(['foo', 'bar']) in the validation rules resolvers.

Changed fieldProps.ref

The reference to a field component is now available via fieldProps.getRef().

Before:

const validateUsername = ({ fieldProps }) => {
  const field = fieldProps.ref
}

<Input
  name="username"
  rule={validateUsername} />

After:

const validateUsername = ({ fieldProps }) => {
  const field = fieldProps.getRef()
}

<Input
  name="username"
  rule={validateUsername} />

Replace fieldProps.ref by fieldProps.getRef() whenever it has been used.