Add docs for validatorMapper

Author: rvsia

packages/react-renderer-demo/src/app/pages/renderer/renderer-api.md

@@ -33,6 +33,7 @@ Form Renderer provides a lot of customization via props.
 |initialValues|object|An object of fields names as keys and values as their values.||
 |subscription|object|You can pass your own [subscription](https://final-form.org/docs/react-final-form/types/FormProps#subscription), which will be added to default settings.|`{ pristine: true, submitting: true, valid: true }`|
 |<RouterLink href="/renderer/validators"><Link href="/renderer/validators">validate</Link></RouterLink>|func|A function which receives all form values and returns an object with errors.||
+|<RouterLink href="/renderer/validators#validatormapper"><Link href="/renderer/validators#validatormapper">validatorMapper</Link></RouterLink>|object|A mapper containing custom validators, it's automatically merged with the default one.||
 
 # Schema
 

packages/react-renderer-demo/src/app/pages/renderer/validators.md

@@ -1,5 +1,7 @@
 import Grid from '@material-ui/core/Grid'
 import RawComponent from '@docs/raw-component';
+import RouterLink from 'next/link';
+import Link from '@material-ui/core/Link';
 
 import ListOfContents from '../../src/helpers/list-of-contents';
 
@@ -56,6 +58,57 @@ Validator inputs and results are being cached so you will get immediate feedback
 If you do not want to trigger the async validator after every stroke, you can use a debounce promise [library](https://github.com/slorber/awesome-debounce-promise)
 (or any other implementation of debouncing.)
 
+# validatorMapper
+
+If you need to expand default Data Driven Forms validator types, you can use <RouterLink href="/renderer/renderer-api#optionalprops"><Link href="/renderer/renderer-api#optionalprops">validatorMapper</Link></RouterLink>.
+
+```jsx
+const customValidatorMapper = {
+  custom: () => (value) => value > 6 ? 'Value is bigger than 6' : undefined
+}
+
+const schema = {
+  fields: [{
+   name: 'name',
+   component: 'text-field',
+   validate: [{type: 'custom'}]
+  }]
+}
+
+<FormRenderer
+  ...
+  schema={schema}
+  validatorMapper={customValidatorMapper}
+/>
+
+```
+
+It is designed to return functions returning functions, so you can easily cached or debounce results.
+
+The higher order function receives the whole validator object.
+
+```jsx
+const customValidatorMapper = {
+  custom: ({ threshold }) => (value) => value > threshold ? `Value is bigger than ${threshold}` : undefined
+}
+
+const schema = {
+  fields: [{
+   name: 'name',
+   component: 'text-field',
+   validate: [{type: 'custom', threshold: 6}]
+  }]
+}
+```
+
+Also, each validator function receives value of the current field as the first argument and all form values as the second.
+
+```jsx
+const validatorMapper = {
+  [type]: (validatorSchema) => (value, allValues) => isValid ? undefined : 'error message'
+}
+```
+
 # ValidateOnMount pf3 only
 
 By providing `validateOnMount` the validation will be triggered immediately after mounting of the component.