Add action mapper example

Author: rvsia

packages/react-renderer-demo/src/app/pages/renderer/action-mapper.md

@@ -1,5 +1,7 @@
 import Grid from '@material-ui/core/Grid'
 import ListOfContents from '../../src/helpers/list-of-contents';
+import RawComponent from '@docs/raw-component';
+
 
 <Grid container item>
 <Grid item xs={12} md={10}>
@@ -68,6 +70,8 @@ Then, in your schema you can map `translateLabel` action to a prop:
 }
 ```
 
+<RawComponent source="action-mapper" />
+
 </Grid>
 <Grid item xs={false} md={2}>
   <ListOfContents file="renderer/action-mapper" />

packages/react-renderer-demo/src/app/src/doc-components/action-mapper.js

@@ -0,0 +1,54 @@
+import React from 'react';
+import FormRenderer from '@data-driven-forms/react-form-renderer/dist/cjs/form-renderer';
+import componentTypes from '@data-driven-forms/react-form-renderer/dist/cjs/component-types';
+
+import TextField from '@data-driven-forms/pf4-component-mapper/dist/cjs/text-field';
+import FormTemplate from '@data-driven-forms/pf4-component-mapper/dist/cjs/form-template';
+
+const translateLabel = (id, locale = 'en') =>
+  ({
+    en: {
+      name: 'User name',
+      password: 'Password'
+    },
+    jp: {
+      name: '名前',
+      password: 'パスワード'
+    }
+  }[locale][id]);
+
+const schema = {
+  title: 'Action Mapper example (translated strings)',
+  fields: [
+    {
+      component: componentTypes.TEXT_FIELD,
+      name: 'name',
+      actions: {
+        label: ['translateLabel', 'name', 'jp']
+      }
+    },
+    {
+      component: componentTypes.TEXT_FIELD,
+      name: 'password',
+      actions: {
+        label: ['translateLabel', 'password', 'jp']
+      }
+    }
+  ]
+};
+
+const componentMapper = {
+  [componentTypes.TEXT_FIELD]: TextField
+};
+
+const actionMapper = {
+  translateLabel
+};
+
+const ActionMapper = () => (
+  <div className="pf4">
+    <FormRenderer FormTemplate={FormTemplate} actionMapper={actionMapper} componentMapper={componentMapper} schema={schema} onSubmit={console.log} />
+  </div>
+);
+
+export default ActionMapper;