feat(form-builder): header & footer (#478)

* feat(form-builder): header & footer * test(form-builder): structure of vales has changed
redgeoff · Sep 22, 2021 · 409a400 · 409a400
1 parent 273e3ec
commit 409a400
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 5 deletions.
diff --git a/src/form/form-builder.js b/src/form/form-builder.js
@@ -6,6 +6,8 @@ import Set from '../actions/set';
 import Emit from '../actions/emit';
 import JSONStringify from '../actions/json-stringify';
 import Text from '../text';
+import Fragment from '../fragment';
+import Container from '../container';
 
 export default class FormBuilder extends Form {
   className = 'FormBuilder';
@@ -52,9 +54,16 @@ export default class FormBuilder extends Form {
           ],
         }),
 
-        new Text({
-          name: 'definition',
+        // Note: Fragment is not a field so it will be automatically wrapped with a field and
+        // accessible at `fields.export.content`
+        new Fragment({
+          name: 'export',
           hidden: true,
+          items: [
+            new Container({ name: 'header' }),
+            new Text({ name: 'definition' }),
+            new Container({ name: 'footer' }),
+          ],
         }),
 
         new FormField({
@@ -98,7 +107,7 @@ export default class FormBuilder extends Form {
               space: 2,
             }),
             new Set({
-              name: 'fields.definition.content.text',
+              name: 'fields.export.content.items.definition.text',
               value: '```js\n{{arguments}}\n```\n',
             }),
             new Emit({
@@ -115,7 +124,7 @@ export default class FormBuilder extends Form {
           event: 'setCodeHidden',
           actions: [
             new Set({
-              name: 'fields.definition.content.hidden',
+              name: 'fields.export.content.hidden',
               value: '{{arguments.hideCode}}',
             }),
             new Set({

diff --git a/src/form/form-builder.test.js b/src/form/form-builder.test.js
@@ -55,7 +55,7 @@ it('should set definition', () => {
 it('should set definition via value', () => {
   const definition = getDefinition(true);
   builder.set({ value: { definition } });
-  expect(builder.getValues()).toEqual({ ...getValues(), definition });
+  expect(builder.getValues()).toEqual(getValues());
 });
 
 it('should get definition', () => {