@digigov/form 0.6.10 → 0.8.0

package/es/Field/utils.js

@@ -0,0 +1,138 @@
+import _extends from "@babel/runtime/helpers/extends";
+import { useContext, useMemo } from 'react';
+import Input from '@digigov/form/inputs/Input';
+import Checkboxes from '@digigov/form/inputs/Checkboxes';
+import Radio from '@digigov/form/inputs/Radio';
+import Select from '@digigov/form/inputs/Select';
+import FileInput from '@digigov/form/inputs/FileInput';
+import DateInput from '@digigov/form/inputs/DateInput';
+import { FormContext } from '@digigov/form/FormContext';
+var FIELD_COMPONENTS = {
+  text: {
+    component: Input
+  },
+  string: {
+    component: Input
+  },
+  file: {
+    wrapper: 'fieldset',
+    component: FileInput
+  },
+  date: {
+    wrapper: 'fieldset',
+    controlled: true,
+    component: DateInput
+  },
+  'choice:multiple': {
+    wrapper: 'fieldset',
+    controlled: true,
+    component: Checkboxes
+  },
+  'choice:single': {
+    wrapper: 'fieldset',
+    controlled: false,
+    component: Radio
+  }
+};
+var ALTERNATIVE_COMPONENTS = {
+  Select: {
+    component: Select,
+    controlled: false
+  }
+};
+export function calculateField(children, field, componentRegistry) {
+  var _field$extra;
+
+  var calculatedField = _extends({}, field);
+
+  var fieldComponentRegistry = _extends({}, FIELD_COMPONENTS, componentRegistry);
+
+  if (children) {
+    calculatedField.component = children;
+  } else if (typeof field.component === 'function') {// leave as is
+  } else if (!field.component && !field.type) {
+    var _fieldComponentRegist;
+
+    calculatedField.component = fieldComponentRegistry.string.component;
+    calculatedField.controlled = ((_fieldComponentRegist = fieldComponentRegistry.string) === null || _fieldComponentRegist === void 0 ? void 0 : _fieldComponentRegist.controlled) || false;
+  } else if (typeof (field === null || field === void 0 ? void 0 : (_field$extra = field.extra) === null || _field$extra === void 0 ? void 0 : _field$extra.component) === 'string' && ALTERNATIVE_COMPONENTS[field.extra.component]) {
+    var _ALTERNATIVE_COMPONEN;
+
+    calculatedField.controlled = ((_ALTERNATIVE_COMPONEN = ALTERNATIVE_COMPONENTS[field.extra.component]) === null || _ALTERNATIVE_COMPONEN === void 0 ? void 0 : _ALTERNATIVE_COMPONEN.controlled) || false;
+    calculatedField.component = ALTERNATIVE_COMPONENTS[field.extra.component].component;
+  } else if (!field.component && field.type && fieldComponentRegistry[field.type]) {
+    var _fieldComponentRegist2;
+
+    calculatedField.component = fieldComponentRegistry[field.type].component;
+    calculatedField.wrapper = fieldComponentRegistry[field.type].wrapper;
+    calculatedField.controlled = ((_fieldComponentRegist2 = fieldComponentRegistry[field.type]) === null || _fieldComponentRegist2 === void 0 ? void 0 : _fieldComponentRegist2.controlled) || false;
+  } else {
+    var _fieldComponentRegist3;
+
+    calculatedField.component = fieldComponentRegistry.string.component;
+    calculatedField.controlled = ((_fieldComponentRegist3 = fieldComponentRegistry.string) === null || _fieldComponentRegist3 === void 0 ? void 0 : _fieldComponentRegist3.controlled) || false;
+  }
+
+  return calculatedField;
+}
+export var useField = function useField(name, customField) {
+  var _useContext = useContext(FormContext),
+      fieldsMap = _useContext.fieldsMap,
+      control = _useContext.control,
+      register = _useContext.register,
+      trigger = _useContext.trigger,
+      clearErrors = _useContext.clearErrors,
+      errors = _useContext.errors,
+      registerField = _useContext.registerField,
+      watch = _useContext.watch,
+      componentRegistry = _useContext.componentRegistry,
+      getFieldState = _useContext.getFieldState,
+      setValue = _useContext.setValue,
+      getValues = _useContext.getValues,
+      unregister = _useContext.unregister,
+      formState = _useContext.formState;
+
+  useMemo(function () {
+    return (customField === null || customField === void 0 ? void 0 : customField.type) && registerField(_extends({}, customField, {
+      key: name
+    }));
+  }, [customField, name, registerField]);
+  return {
+    field: customField || fieldsMap[name],
+    control: control,
+    register: register,
+    trigger: trigger,
+    watch: watch,
+    componentRegistry: componentRegistry,
+    getFieldState: getFieldState,
+    setValue: setValue,
+    clearErrors: clearErrors,
+    getValues: getValues,
+    unregister: unregister,
+    formState: formState,
+    error: errors[name]
+  };
+};
+export function evaluateFieldWithConditions(field, variables) {
+  var newField = _extends({}, field);
+
+  if (variables) {
+    for (var key in variables) {
+      if (field.condition[key] && field.condition[key].is === variables[key]) {
+        var then = field.condition[key].then || {};
+
+        for (var attr in then) {
+          newField[attr] = then[attr];
+        }
+      } else if (field.condition[key]) {
+        var otherwise = field.condition[key]["else"] || {};
+
+        for (var _attr in otherwise) {
+          newField[_attr] = otherwise[_attr];
+        }
+      }
+    }
+  }
+
+  return newField;
+}

package/es/FieldArray/FieldArray.stories.js

@@ -0,0 +1,7 @@
+import FieldArray from '@digigov/form/FieldArray';
+export default {
+  title: 'Digigov Form/FieldArray',
+  component: FieldArray
+};
+export * from '@digigov/form/FieldArray/__stories__/Default';
+export * from '@digigov/form/FieldArray/__stories__/WithExactLength';

package/es/FieldArray/__stories__/Default.js

@@ -0,0 +1,88 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { Suspense } from 'react';
+import FormBuilder, { Field } from '@digigov/form';
+import { Button } from '@digigov/ui/core';
+var fields = [{
+  key: 'string',
+  type: 'string',
+  label: {
+    primary: 'Πεδίο 1',
+    secondary: 'Το multiplicity field είναι ένα πεδίο οπότε φαίνεται και είναι μέρος της φόρμας'
+  }
+}, {
+  key: 'multiplicity',
+  type: 'array',
+  label: {
+    primary: 'Συνυπογράφοντες',
+    secondary: 'Οι συνυπογράφοντες είναι άνθρωποι σαν και εμάς'
+  },
+  extra: {
+    label: {
+      question: {
+        title: 'Θέλετε να προσθέσετε επιπλέον συνυπογράφοντες;',
+        yes: 'Ναι',
+        no: 'Όχι'
+      },
+      edit: 'Επεξεργασία',
+      add: 'Προσθέστε τα στοιχεία του επόμενου συνυπογράφοντα',
+      "delete": 'Αφαίρεση συνυπογράφοντος',
+      save: 'Αποθήκευση'
+    },
+    min: 2,
+    max: 4,
+    of: {
+      type: 'object',
+      extra: {
+        fields: [{
+          key: 'afm',
+          type: 'afm',
+          required: true,
+          label: {
+            primary: 'ΑΦΜ'
+          }
+        }, {
+          key: 'firstName',
+          required: true,
+          type: 'string',
+          label: {
+            primary: 'Όνομα'
+          }
+        }, {
+          key: 'lastName',
+          required: true,
+          type: 'string',
+          label: {
+            primary: 'Επώνυμο'
+          }
+        }]
+      }
+    }
+  }
+}, {
+  key: 'phonenumber',
+  type: 'phone_number',
+  required: true,
+  label: {
+    primary: 'Πεδίο 2',
+    secondary: 'Το multiplicity field είναι ένα πεδίο οπότε φαίνεται και είναι μέρος της φόρμας'
+  }
+}];
+
+var _ref = /*#__PURE__*/React.createElement(Button, null, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
+
+export var Default = function Default() {
+  return /*#__PURE__*/React.createElement(Suspense, {
+    fallback: "loading"
+  }, /*#__PURE__*/React.createElement(FormBuilder, {
+    onSubmit: function onSubmit(data) {
+      debugger;
+      console.log(data);
+    }
+  }, /*#__PURE__*/React.createElement(Field, _extends({
+    name: "string"
+  }, fields[0])), /*#__PURE__*/React.createElement(Field, _extends({
+    name: "multiplicity"
+  }, fields[1])), /*#__PURE__*/React.createElement(Field, _extends({
+    name: "phonenumber"
+  }, fields[2])), _ref));
+};

package/es/FieldArray/__stories__/WithExactLength.js

@@ -0,0 +1,87 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { Suspense } from 'react';
+import FormBuilder, { Field } from '@digigov/form';
+import { Button } from '@digigov/ui/core';
+var fields = [{
+  key: 'string',
+  type: 'string',
+  label: {
+    primary: 'Πεδίο 1',
+    secondary: 'Το multiplicity field είναι ένα πεδίο οπότε φαίνεται και είναι μέρος της φόρμας'
+  }
+}, {
+  key: 'multiplicity',
+  type: 'array',
+  label: {
+    primary: 'Συνυπογράφοντες',
+    secondary: 'Οι συνυπογράφοντες είναι άνθρωποι σαν και εμάς'
+  },
+  extra: {
+    label: {
+      question: {
+        title: 'Θέλετε να προσθέσετε επιπλέον συνυπογράφοντες;',
+        yes: 'Ναι',
+        no: 'Όχι'
+      },
+      edit: 'Επεξεργασία',
+      add: 'Προσθέστε τα στοιχεία του επόμενου συνυπογράφοντα',
+      "delete": 'Αφαίρεση συνυπογράφοντος',
+      save: 'Αποθήκευση'
+    },
+    length: 2,
+    of: {
+      type: 'object',
+      extra: {
+        fields: [{
+          key: 'afm',
+          type: 'afm',
+          required: true,
+          label: {
+            primary: 'ΑΦΜ'
+          }
+        }, {
+          key: 'firstName',
+          required: true,
+          type: 'string',
+          label: {
+            primary: 'Όνομα'
+          }
+        }, {
+          key: 'lastName',
+          required: true,
+          type: 'string',
+          label: {
+            primary: 'Επώνυμο'
+          }
+        }]
+      }
+    }
+  }
+}, {
+  key: 'phonenumber',
+  type: 'phone_number',
+  required: true,
+  label: {
+    primary: 'Πεδίο 2',
+    secondary: 'Το multiplicity field είναι ένα πεδίο οπότε φαίνεται και είναι μέρος της φόρμας'
+  }
+}];
+
+var _ref = /*#__PURE__*/React.createElement(Button, null, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
+
+export var WithExactLength = function WithExactLength() {
+  return /*#__PURE__*/React.createElement(Suspense, {
+    fallback: "loading"
+  }, /*#__PURE__*/React.createElement(FormBuilder, {
+    onSubmit: function onSubmit(data) {
+      debugger;
+      console.log(data);
+    }
+  }, /*#__PURE__*/React.createElement(Field, _extends({
+    name: "string"
+  }, fields[0])), /*#__PURE__*/React.createElement(Field, _extends({
+    name: "multiplicity"
+  }, fields[1])), /*#__PURE__*/React.createElement(Field, _extends({
+    name: "phonenumber"
+  }, fields[2])), _ref));
+};

package/es/FieldArray/index.js

@@ -0,0 +1,65 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["name", "register", "control", "formState", "error", "layout", "label"];
+import React from 'react';
+import { DevTool } from '@hookform/devtools';
+import { useFieldArray } from 'react-hook-form';
+import FieldObject from '@digigov/form/FieldObject';
+import { Button, Card } from '@digigov/ui/core';
+import { FieldsetLabel } from '@digigov/form/Fieldset';
+import Fieldset from '@digigov/react-core/Fieldset';
+import FieldContainer from '@digigov/form/Field/FieldContainer';
+export var FieldArray = function FieldArray(_ref) {
+  var name = _ref.name,
+      register = _ref.register,
+      control = _ref.control,
+      formState = _ref.formState,
+      error = _ref.error,
+      layout = _ref.layout,
+      label = _ref.label,
+      customField = _objectWithoutProperties(_ref, _excluded);
+
+  var _useFieldArray = useFieldArray({
+    control: control,
+    name: name
+  }),
+      fields = _useFieldArray.fields,
+      append = _useFieldArray.append,
+      remove = _useFieldArray.remove;
+
+  return /*#__PURE__*/React.createElement(FieldContainer, {
+    label: label,
+    layout: layout,
+    error: formState.isSubmitted && !formState.isSubmitting && error !== null && error !== void 0 && error.message && error ? error : undefined,
+    wrapper: "fieldset",
+    name: name
+  }, /*#__PURE__*/React.createElement(DevTool, {
+    control: control
+  }), fields.map(function (field, index) {
+    var _customField$extra;
+
+    return /*#__PURE__*/React.createElement(Card, {
+      variant: "border",
+      key: field.id
+    }, /*#__PURE__*/React.createElement(Fieldset, null, /*#__PURE__*/React.createElement(FieldsetLabel, null, "\u03A3\u03C5\u03BD\u03C5\u03C0\u03BF\u03B3\u03C1\u03AC\u03C6\u03BF\u03BD\u03C4\u03B1\u03C2 ", index + 1), /*#__PURE__*/React.createElement(FieldObject, _extends({
+      name: "".concat(name, ".").concat(index),
+      error: Array.isArray(error) && error[index],
+      register: register,
+      control: control
+    }, (_customField$extra = customField.extra) === null || _customField$extra === void 0 ? void 0 : _customField$extra.of)), /*#__PURE__*/React.createElement(Button, {
+      type: "button",
+      color: "warning",
+      onClick: function onClick() {
+        return remove(index);
+      }
+    }, "Remove")));
+  }), /*#__PURE__*/React.createElement(Button, {
+    type: "button",
+    color: "secondary",
+    onClick: function onClick(ev) {
+      ev.preventDefault();
+      append({});
+    }
+  }, "\u03A0\u03C1\u03BF\u03C3\u03B8\u03AE\u03BA\u03B7 \u03C3\u03C5\u03BD\u03C5\u03C0\u03BF\u03B3\u03C1\u03AC\u03C6\u03BF\u03BD\u03C4\u03B1"));
+};
+export default FieldArray;

package/es/FieldObject/index.js

@@ -0,0 +1,55 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { useMemo } from 'react';
+import Fieldset, { FieldsetCaption } from '@digigov/form/Fieldset';
+import { useTranslation } from '@digigov/ui/app/i18n';
+import { FieldBase } from '@digigov/form/Field/FieldBase';
+import { calculateField } from '@digigov/form/Field/utils';
+import { FieldsetLegend } from '@digigov/react-core';
+export var FieldObject = function FieldObject(_ref) {
+  var name = _ref.name,
+      label = _ref.label,
+      extra = _ref.extra,
+      error = _ref.error,
+      control = _ref.control,
+      register = _ref.register,
+      formState = _ref.formState;
+
+  var _useTranslation = useTranslation(),
+      t = _useTranslation.t;
+
+  return /*#__PURE__*/React.createElement(Fieldset, null, (label === null || label === void 0 ? void 0 : label.primary) && /*#__PURE__*/React.createElement(FieldsetLegend, {
+    size: "s"
+  }, t(label.primary)), (label === null || label === void 0 ? void 0 : label.secondary) && /*#__PURE__*/React.createElement(FieldsetCaption, null, t(label.secondary)), extra === null || extra === void 0 ? void 0 : extra.fields.map(function (field) {
+    return /*#__PURE__*/React.createElement(FieldObjectItem, {
+      key: "".concat(name, ".").concat(field.key),
+      name: "".concat(name, ".").concat(field.key),
+      control: control,
+      register: register,
+      field: field,
+      error: error && error[field.key],
+      formState: formState
+    });
+  }));
+};
+
+var FieldObjectItem = function FieldObjectItem(_ref2) {
+  var name = _ref2.name,
+      children = _ref2.children,
+      field = _ref2.field,
+      error = _ref2.error,
+      control = _ref2.control,
+      formState = _ref2.formState,
+      register = _ref2.register;
+  var calculatedField = useMemo(function () {
+    return calculateField(children, field);
+  }, [field]);
+  var customError = error ? error : formState === null || formState === void 0 ? void 0 : formState.errors[name];
+  return /*#__PURE__*/React.createElement(FieldBase, _extends({}, calculatedField, {
+    name: name,
+    control: control,
+    register: register,
+    error: customError
+  }));
+};
+
+export default FieldObject;

package/es/FormBuilder.js

@@ -1,19 +1,18 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["onSubmit", "children", "registerField", "fieldsMap", "fieldsetsMap", "resolver", "mode", "initial", "reValidateMode", "shouldFocusError", "criteriaMode", "componentRegistry"],
-    _excluded2 = ["fields", "fieldsets", "initial", "onSubmit", "children", "reValidateMode", "mode", "shouldFocusError", "criteriaMode", "auto", "validatorRegistry", "componentRegistry"];
+var _excluded = ["onSubmit", "children", "registerField", "fieldsMap", "fieldsetsMap", "resolver", "mode", "initial", "reValidateMode", "shouldFocusError", "criteriaMode", "componentRegistry", "grid"],
+    _excluded2 = ["fields", "fieldsets", "initial", "onSubmit", "children", "reValidateMode", "mode", "shouldFocusError", "criteriaMode", "auto", "validatorRegistry", "componentRegistry", "grid"];
 
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import React, { useCallback, useRef } from 'react';
 import { useForm } from 'react-hook-form';
 import { yupResolver } from '@digigov/form/utils';
-import Grid from '@digigov/ui/layouts/Grid';
 import { useValidationSchema } from '@digigov/form/validators';
 import Fieldset from '@digigov/form/Fieldset';
 import Field from '@digigov/form/Field';
 import { FormContext } from '@digigov/form/FormContext';
+import { Form } from '@digigov/react-core/Form';
 export var FormBase = /*#__PURE__*/React.forwardRef(function FormBase(_ref, ref) {
   var onSubmit = _ref.onSubmit,
       children = _ref.children,
@@ -27,6 +26,7 @@ export var FormBase = /*#__PURE__*/React.forwardRef(function FormBase(_ref, ref)
       shouldFocusError = _ref.shouldFocusError,
       criteriaMode = _ref.criteriaMode,
       componentRegistry = _ref.componentRegistry,
+      grid = _ref.grid,
       props = _objectWithoutProperties(_ref, _excluded);
 
   var form = useForm({
@@ -38,35 +38,33 @@ export var FormBase = /*#__PURE__*/React.forwardRef(function FormBase(_ref, ref)
     criteriaMode: criteriaMode
   });
   var handleSubmit = useCallback(function (data) {
-    var errors = onSubmit && onSubmit(data);
-
-    if (errors) {
-      for (var key in errors) {
-        form.setError(key, errors[key]);
-      }
-    }
+    onSubmit && onSubmit(data);
   }, [onSubmit]);
   var ctx = {
     fieldsMap: fieldsMap,
     fieldsetsMap: fieldsetsMap,
     control: form.control,
     register: form.register,
+    watch: form.watch,
     registerField: registerField,
-    errors: form.errors,
+    errors: form.formState.errors,
+    formState: form.formState,
     reset: form.reset,
+    trigger: form.trigger,
+    getFieldState: form.getFieldState,
+    setValue: form.setValue,
+    clearErrors: form.clearErrors,
+    getValues: form.getValues,
+    unregister: form.unregister,
     componentRegistry: componentRegistry
   };
   return /*#__PURE__*/React.createElement(FormContext.Provider, {
     value: ctx
-  }, /*#__PURE__*/React.createElement("form", _extends({
+  }, /*#__PURE__*/React.createElement(Form, _extends({
+    grid: grid,
     onSubmit: form.handleSubmit(handleSubmit),
     ref: ref
-  }, props), /*#__PURE__*/React.createElement(Grid, {
-    container: true
-  }, /*#__PURE__*/React.createElement(Grid, {
-    item: true,
-    xs: 12
-  }, children))));
+  }, props), children));
 });
 export var FormBuilder = /*#__PURE__*/React.forwardRef(function FormBuilder(_ref2, ref) {
   var _ref2$fields = _ref2.fields,
@@ -83,11 +81,13 @@ export var FormBuilder = /*#__PURE__*/React.forwardRef(function FormBuilder(_ref
       _ref2$shouldFocusErro = _ref2.shouldFocusError,
       shouldFocusError = _ref2$shouldFocusErro === void 0 ? true : _ref2$shouldFocusErro,
       _ref2$criteriaMode = _ref2.criteriaMode,
-      criteriaMode = _ref2$criteriaMode === void 0 ? 'firstError' : _ref2$criteriaMode,
+      criteriaMode = _ref2$criteriaMode === void 0 ? 'all' : _ref2$criteriaMode,
       _ref2$auto = _ref2.auto,
       auto = _ref2$auto === void 0 ? false : _ref2$auto,
       validatorRegistry = _ref2.validatorRegistry,
       componentRegistry = _ref2.componentRegistry,
+      _ref2$grid = _ref2.grid,
+      grid = _ref2$grid === void 0 ? false : _ref2$grid,
       props = _objectWithoutProperties(_ref2, _excluded2);
 
   var fieldsState = useRef(fields);
@@ -96,7 +96,17 @@ export var FormBuilder = /*#__PURE__*/React.forwardRef(function FormBuilder(_ref
   }, []);
   var schema = useValidationSchema(fieldsState, validatorRegistry);
   var registerField = useCallback(function (field) {
-    setFieldsState([].concat(_toConsumableArray(fieldsState.current), [field]));
+    var fieldIndex = fieldsState.current.findIndex(function (f) {
+      return f.key === field.key;
+    });
+
+    if (fieldIndex > -1) {
+      fieldsState.current[fieldIndex] = field;
+    } else {
+      fieldsState.current.push(field);
+    }
+
+    setFieldsState(fieldsState.current);
   }, []);
   var resolver;
   var fieldsMap;
@@ -142,7 +152,8 @@ export var FormBuilder = /*#__PURE__*/React.forwardRef(function FormBuilder(_ref
     criteriaMode: criteriaMode,
     onSubmit: onSubmit,
     componentRegistry: componentRegistry,
-    ref: ref
+    ref: ref,
+    grid: grid
   }, props), fieldChildren, children);
 });
 export default FormBuilder;

package/es/MultiplicityField/MultiplicityField.stories.js

@@ -0,0 +1,10 @@
+import MultiplicityField from '@digigov/form/MultiplicityField';
+export default {
+  title: 'Digigov Form/MultiplicityField',
+  component: MultiplicityField
+};
+export * from '@digigov/form/MultiplicityField/__stories__/Default';
+export * from '@digigov/form/MultiplicityField/__stories__/WithMinLength';
+export * from '@digigov/form/MultiplicityField/__stories__/WithMaxLength';
+export * from '@digigov/form/MultiplicityField/__stories__/WithMinAndMaxLength';
+export * from '@digigov/form/MultiplicityField/__stories__/WithExactLength';

package/es/MultiplicityField/__stories__/Default.js

@@ -0,0 +1,100 @@
+import _extends from "@babel/runtime/helpers/extends";
+import React, { Suspense } from 'react';
+import FormBuilder, { Field } from '@digigov/form';
+import { Button } from '@digigov/ui/core';
+var fields = [{
+  key: 'string',
+  type: 'string',
+  label: {
+    primary: 'Πεδίο 1',
+    secondary: 'Το multiplicity field είναι ένα πεδίο οπότε φαίνεται και είναι μέρος της φόρμας'
+  }
+}, {
+  key: 'multiplicity',
+  type: 'array',
+  multiplicity: true,
+  label: {
+    primary: 'Συνυπογράφοντες',
+    secondary: 'Οι συνυπογράφοντες είναι άνθρωποι σαν και εμάς'
+  },
+  extra: {
+    border: true,
+    label: {
+      object: {
+        title: 'Συνυπογράφοντας',
+        title_added: 'Οι συνυπογράφοντες που έχετε προσθέσει',
+        add: 'Προσθήκη',
+        "delete": 'Αφαίρεση συνυπογράφοντος'
+      },
+      question: {
+        title: 'Θέλετε να προσθέσετε επιπλέον συνυπογράφοντες;',
+        objectLabel: {
+          primary: 'Προσθήκη νέου συνυπογράφοντα',
+          secondary: 'Συμπληρώστε τα στοιχεία και μετά πατήστε «Προσθήκη»'
+        },
+        yes: 'Ναι',
+        no: 'Όχι'
+      }
+    },
+    of: {
+      type: 'object',
+      label: {
+        primary: 'Στοιχεία συνυπογράφοντα',
+        secondary: 'Δείτε και αλλάξτε τα στοιχεία του συνυπογράφοντα'
+      },
+      extra: {
+        fields: [{
+          key: 'afm',
+          type: 'afm',
+          required: true,
+          label: {
+            primary: 'ΑΦΜ'
+          }
+        }, {
+          key: 'firstName',
+          required: true,
+          type: 'string',
+          label: {
+            primary: 'Όνομα'
+          }
+        }, {
+          key: 'lastName',
+          required: true,
+          type: 'string',
+          label: {
+            primary: 'Επώνυμο'
+          }
+        }]
+      }
+    }
+  }
+}, {
+  key: 'phonenumber',
+  type: 'phone_number',
+  required: true,
+  label: {
+    primary: 'Πεδίο 2',
+    secondary: 'Το multiplicity field είναι ένα πεδίο οπότε φαίνεται και είναι μέρος της φόρμας'
+  }
+}];
+
+var _ref = /*#__PURE__*/React.createElement(Button, {
+  type: "submit"
+}, "\u03A3\u03C5\u03BD\u03AD\u03C7\u03B5\u03B9\u03B1");
+
+export var Default = function Default() {
+  return /*#__PURE__*/React.createElement(Suspense, {
+    fallback: "loading"
+  }, /*#__PURE__*/React.createElement(FormBuilder, {
+    onSubmit: function onSubmit(data) {
+      debugger;
+      console.log(data);
+    }
+  }, /*#__PURE__*/React.createElement(Field, _extends({
+    name: "string"
+  }, fields[0])), /*#__PURE__*/React.createElement(Field, _extends({
+    name: "multiplicity"
+  }, fields[1])), /*#__PURE__*/React.createElement(Field, _extends({
+    name: "phonenumber"
+  }, fields[2])), _ref));
+};