Add migration guide to documentation

Author: rvsia

packages/react-renderer-demo/src/app/pages/renderer/migration-guide.md

@@ -0,0 +1,152 @@
+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';
+
+<Grid container item>
+<Grid item xs={12} md={10}>
+
+# Migration guide from 1.x to 2.x
+
+The release of version 2 brings many new features, that as we hope you will find useful and you will like them.
+Also, we took this release as an opportunity to fix mistakes we did during the initial development and to remove some obsolete stuff, that is no longer useful.
+Major themes are using of React hooks, so update your React before you will continue, and giving more freedom to you how to customize the form.
+There are also major enhancements bringing more features to schemas not stored in JavaScript, as the action mapper and validator mapper.
+Thank you for your understanding.
+
+## Details
+
+### General rules
+
+-   All JSON schemas should remain almost the same
+
+### PF4/PF3/MUI Mapper
+
+-   formFieldsMapper was renamed to componentMapper
+-   Components can be imported separately to create only a subset of full component mapper
+
+### Removed 'treshold' option
+
+-   Due to a typo, it was possible to use key treshold as an option in some validators, this option is now disabled. Use only threshold.
+
+### Form Template
+
+-   layoutMapper removed - instead of it use FormTemplate
+-   All props related to form buttons are now removed, use them in you FormTemplate
+    -   showFormControls
+    -   buttonOrder
+    -   disableSubmit
+    -   buttonClassName
+    -   renderFormButtons
+    -   buttonsLabels
+-   => All these props are now managed by mapper's form templates!
+
+-   FormTemplate receives these props:
+    -   formFields : form fields
+    -   schema : provides access to schema.title, schema.description and everything else
+-   Default templates (it is a function!):
+
+```jsx
+import { FormTemplate } from '@data-driven-forms/pf4-component-mapper'
+
+<FormRenderer {...} FormTemplate={props => <FormTemplate {...props} showFormControls={false} />
+```
+
+-   Options - see removed props above
+
+### layoutComponents removed
+
+-   layoutComponents constants have been removed. Please do not use them.
+
+### formOptions props removed
+
+-   formOptions as a prop was removed, instead of it use useFormApi hook or you can get formOptions from the rendererContext
+
+```jsx
+
+import { useFormApi } from  '@data-driven-forms/react-form-renderer';
+
+const  Component  = (props) => {
+    const  formOptions  =  useFormApi();
+    ...
+}
+```
+
+
+### formSpy is exported
+
+-   formSpyProvider is no longer provided as a prop.
+-   Use direct import instead of it:
+
+```jsx
+import { FormSpy } from  '@data-driven-forms/react-form-renderer';
+```
+
+### fieldArray is exported
+
+-   fieldArrayProvider is no longer provided as a prop.
+-   Use direct import instead of it:
+
+```jsx
+import { FieldArray } from  '@data-driven-forms/react-form-renderer';
+```
+
+### onStateUpdate removed, replaced by debug
+
+-   onStateUpdate prop is removed from the renderer, instead of it use debug (please see <https://final-form.org/docs/react-final-form/types/FormProps#debug>)
+
+```jsx
+<FormRenderer {...} debug={console.log} />
+```
+
+-   In custom component, simulate this prop with using of formSpy
+
+```jsx
+    import { FormSpy } from  '@data-driven-forms/react-form-renderer';
+
+{onStateUpdate &&  <FormSpy  onChange={onStateUpdate} />}
+```
+
+### FieldProvider changed
+
+-   FieldProvider is no longer wrapping basic components and you cannot access him through props, instead of it use hook:
+
+```jsx
+import { useFieldApi } from  '@data-driven-forms/react-form-renderer';
+
+...
+
+const { input, isDisabled, label, helperText, description, meta } =  useFieldApi(props);
+```
+
+-   This hook accepts all props and returns them with input and meta included.
+-   Don't forget to pass a type, for special types as 'checkbox'
+
+
+### formFieldsMapper renamed to componentMapper
+
+-   There is no formFieldsMapper anymore, please use componentMapper
+
+```jsx
+import { componentMapper } from '@data-driven-forms/pf4-component-mapper'
+
+<FormRenderer {...} componentMapper={componentMapper} />
+```
+
+### Component types
+
+-   Removed the "-field" affix from the constants values
+-   "select-field" -> "select"
+-   removed duplicate constants SELECT_COMPONENT etc.
+
+### PF4/PF3/MUI Wizard doesn't use 'stepKey' anymore
+
+-   stepKey prop is replaced by name
+
+</Grid>
+<Grid item xs={false} md={2}>
+  <ListOfContents file="renderer/migration-guide" />
+</Grid>
+</Grid>

packages/react-renderer-demo/src/app/src/components/navigation/documentation-pages.js

@@ -62,5 +62,9 @@ export const docs = [
   {
     component: 'field-array',
     linkText: 'FieldArray Provider'
+  },
+  {
+    component: 'migration-guide',
+    linkText: 'Migration guide 1.x to 2.x'
   }
 ];