@digigov/form 0.6.9 → 0.7.1

package/es/Field/utils.js

@@ -0,0 +1,122 @@
+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,
+      errors = _useContext.errors,
+      registerField = _useContext.registerField,
+      componentRegistry = _useContext.componentRegistry;
+
+  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,
+    componentRegistry: componentRegistry,
+    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/Fieldset/FieldsetWithContext.js

@@ -0,0 +1,41 @@
+import React, { useContext, useMemo } from 'react';
+import { FormContext } from '@digigov/form/FormContext';
+import Field from '@digigov/form/Field';
+import { useTranslation } from '@digigov/ui/app/i18n';
+import { Fieldset, FieldsetLabel, FieldsetCaption, FieldsetBody } from '@digigov/form/Fieldset/';
+export var FieldsetWithContext = function FieldsetWithContext(_ref) {
+  var name = _ref.name;
+
+  var _useFieldset = useFieldset(name),
+      label = _useFieldset.label,
+      body = _useFieldset.body,
+      fields = _useFieldset.fields;
+
+  var _useTranslation = useTranslation(),
+      t = _useTranslation.t;
+
+  var _ref2 = /*#__PURE__*/React.createElement(FieldsetBody, null, body);
+
+  return useMemo(function () {
+    return /*#__PURE__*/React.createElement(Fieldset, null, (label === null || label === void 0 ? void 0 : label.primary) && /*#__PURE__*/React.createElement(FieldsetLabel, null, t(label.primary)), (label === null || label === void 0 ? void 0 : label.secondary) && /*#__PURE__*/React.createElement(FieldsetCaption, null, t(label.secondary)), body && _ref2, fields.map(function (field) {
+      return /*#__PURE__*/React.createElement(Field, {
+        key: field,
+        name: field
+      });
+    }));
+  }, [label === null || label === void 0 ? void 0 : label.primary, label === null || label === void 0 ? void 0 : label.secondary, body, fields]);
+};
+
+var useFieldset = function useFieldset(name) {
+  var _useContext = useContext(FormContext),
+      fieldsetsMap = _useContext.fieldsetsMap;
+
+  if (fieldsetsMap && fieldsetsMap[name]) {
+    return useMemo(function () {
+      return fieldsetsMap[name];
+    }, [name]);
+  } else {
+    if (!fieldsetsMap) throw new Error("Fieldsets is not defined");
+    throw new Error("No fieldset with name ".concat(name, " found"));
+  }
+};

package/es/Fieldset/index.js

@@ -1,12 +1,9 @@
-import React, { useContext, useMemo } from 'react';
+import React from 'react';
 import Grid from '@digigov/ui/layouts/Grid';
 import CoreFieldset from '@digigov/react-core/Fieldset';
 import FieldsetLegend from '@digigov/react-core/FieldsetLegend';
 import Hint from '@digigov/react-core/Hint';
-import { FormContext } from '@digigov/form';
-import Field from '@digigov/form/Field';
 import NormalText from '@digigov/ui/typography/NormalText';
-import { useTranslation } from '@digigov/ui/app/i18n';
 export var FieldsetLabel = function FieldsetLabel(_ref) {
   var children = _ref.children;
   return /*#__PURE__*/React.createElement(FieldsetLegend, {
@@ -25,53 +22,8 @@ export var FieldsetBody = function FieldsetBody(_ref3) {
     xs: 12
   }, /*#__PURE__*/React.createElement(NormalText, null, children));
 };
-
-var useFieldset = function useFieldset(name) {
-  var _useContext = useContext(FormContext),
-      fieldsetsMap = _useContext.fieldsetsMap;
-
-  if (fieldsetsMap && fieldsetsMap[name]) {
-    return useMemo(function () {
-      return fieldsetsMap[name];
-    }, [name]);
-  } else {
-    if (!fieldsetsMap) throw new Error("Fieldsets is not defined");
-    throw new Error("No fieldset with name ".concat(name, " found"));
-  }
-};
-
-export var FieldsetWithContext = function FieldsetWithContext(_ref4) {
-  var name = _ref4.name;
-
-  var _useFieldset = useFieldset(name),
-      label = _useFieldset.label,
-      body = _useFieldset.body,
-      fields = _useFieldset.fields;
-
-  var _useTranslation = useTranslation(),
-      t = _useTranslation.t;
-
-  var _ref5 = /*#__PURE__*/React.createElement(FieldsetBody, null, body);
-
-  return useMemo(function () {
-    return /*#__PURE__*/React.createElement(Fieldset, null, (label === null || label === void 0 ? void 0 : label.primary) && /*#__PURE__*/React.createElement(FieldsetLabel, null, t(label.primary)), (label === null || label === void 0 ? void 0 : label.secondary) && /*#__PURE__*/React.createElement(FieldsetCaption, null, t(label.secondary)), body && _ref5, fields.map(function (field) {
-      return /*#__PURE__*/React.createElement(Field, {
-        key: field,
-        name: field
-      });
-    }));
-  }, [label === null || label === void 0 ? void 0 : label.primary, label === null || label === void 0 ? void 0 : label.secondary, body, fields]);
-};
-export var Fieldset = function Fieldset(_ref6) {
-  var name = _ref6.name,
-      children = _ref6.children;
-
-  if (name && !children) {
-    return /*#__PURE__*/React.createElement(FieldsetWithContext, {
-      name: name
-    });
-  }
-
+export var Fieldset = function Fieldset(_ref4) {
+  var children = _ref4.children;
   return /*#__PURE__*/React.createElement(CoreFieldset, null, children);
 };
 export default Fieldset;

package/es/Fieldset/types.js

@@ -0,0 +1 @@
+export {};

package/es/FormBuilder.js

@@ -0,0 +1,148 @@
+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", "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 { 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,
+      registerField = _ref.registerField,
+      fieldsMap = _ref.fieldsMap,
+      fieldsetsMap = _ref.fieldsetsMap,
+      resolver = _ref.resolver,
+      mode = _ref.mode,
+      initial = _ref.initial,
+      reValidateMode = _ref.reValidateMode,
+      shouldFocusError = _ref.shouldFocusError,
+      criteriaMode = _ref.criteriaMode,
+      componentRegistry = _ref.componentRegistry,
+      grid = _ref.grid,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var form = useForm({
+    resolver: resolver,
+    mode: mode,
+    defaultValues: initial,
+    reValidateMode: reValidateMode,
+    shouldFocusError: shouldFocusError,
+    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]);
+  var ctx = {
+    fieldsMap: fieldsMap,
+    fieldsetsMap: fieldsetsMap,
+    control: form.control,
+    register: form.register,
+    registerField: registerField,
+    errors: form.errors,
+    reset: form.reset,
+    componentRegistry: componentRegistry
+  };
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
+    value: ctx
+  }, /*#__PURE__*/React.createElement(Form, _extends({
+    grid: grid,
+    onSubmit: form.handleSubmit(handleSubmit),
+    ref: ref
+  }, props), children));
+});
+export var FormBuilder = /*#__PURE__*/React.forwardRef(function FormBuilder(_ref2, ref) {
+  var _ref2$fields = _ref2.fields,
+      fields = _ref2$fields === void 0 ? [] : _ref2$fields,
+      fieldsets = _ref2.fieldsets,
+      _ref2$initial = _ref2.initial,
+      initial = _ref2$initial === void 0 ? {} : _ref2$initial,
+      onSubmit = _ref2.onSubmit,
+      children = _ref2.children,
+      _ref2$reValidateMode = _ref2.reValidateMode,
+      reValidateMode = _ref2$reValidateMode === void 0 ? 'onSubmit' : _ref2$reValidateMode,
+      _ref2$mode = _ref2.mode,
+      mode = _ref2$mode === void 0 ? 'onSubmit' : _ref2$mode,
+      _ref2$shouldFocusErro = _ref2.shouldFocusError,
+      shouldFocusError = _ref2$shouldFocusErro === void 0 ? true : _ref2$shouldFocusErro,
+      _ref2$criteriaMode = _ref2.criteriaMode,
+      criteriaMode = _ref2$criteriaMode === void 0 ? 'firstError' : _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);
+  var setFieldsState = useCallback(function (newFields) {
+    fieldsState.current = newFields;
+  }, []);
+  var schema = useValidationSchema(fieldsState, validatorRegistry);
+  var registerField = useCallback(function (field) {
+    setFieldsState([].concat(_toConsumableArray(fieldsState.current), [field]));
+  }, []);
+  var resolver;
+  var fieldsMap;
+  var fieldsetsMap;
+  var fieldChildren;
+
+  if (schema) {
+    resolver = yupResolver(schema);
+    fieldsMap = fields ? fields.reduce(function (map, field) {
+      return _extends({}, map, _defineProperty({}, field.key, field));
+    }, {}) : {};
+    fieldsetsMap = fieldsets && fieldsets.reduce(function (map, fieldset) {
+      return _extends({}, map, _defineProperty({}, fieldset.key, fieldset));
+    }, {});
+
+    if (auto) {
+      if (fieldsets) {
+        fieldChildren = fieldsets.map(function (fieldset) {
+          return /*#__PURE__*/React.createElement(Fieldset, {
+            key: fieldset.key
+          });
+        });
+      } else if (fields) {
+        fieldChildren = fields.map(function (field) {
+          return /*#__PURE__*/React.createElement(Field, {
+            key: field.key,
+            name: field.key
+          });
+        });
+      }
+    }
+  }
+
+  return /*#__PURE__*/React.createElement(FormBase, _extends({
+    resolver: resolver,
+    fieldsetsMap: fieldsetsMap,
+    fieldsMap: fieldsMap,
+    registerField: registerField,
+    initial: initial,
+    reValidateMode: reValidateMode,
+    mode: mode,
+    shouldFocusError: shouldFocusError,
+    criteriaMode: criteriaMode,
+    onSubmit: onSubmit,
+    componentRegistry: componentRegistry,
+    ref: ref,
+    grid: grid
+  }, props), fieldChildren, children);
+});
+export default FormBuilder;

package/es/FormContext.js

@@ -0,0 +1,5 @@
+import { createContext } from 'react';
+export var FormContext = /*#__PURE__*/createContext({
+  fieldsMap: {},
+  fieldsetsMap: {}
+});

package/es/Questions/Questions.js

@@ -0,0 +1,84 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useState, useEffect } from 'react';
+import { QuestionsContext } from '@digigov/form/Questions/QuestionsContext';
+import { getNextStep } from '@digigov/form/Questions/getNextStep';
+var isBrowser = typeof window !== 'undefined';
+/**
+ * The Question component accepts question data as props
+ * uses composable components to provide a wholesome UX
+ *
+ */
+
+export var Questions = function Questions(_ref) {
+  var name = _ref.name,
+      steps = _ref.steps,
+      _ref$initialData = _ref.initialData,
+      initialData = _ref$initialData === void 0 ? {} : _ref$initialData,
+      onChange = _ref.onChange,
+      onSubmit = _ref.onSubmit,
+      onActiveStep = _ref.onActiveStep,
+      forceStepName = _ref.forceStepName,
+      _ref$localDraft = _ref.localDraft,
+      localDraft = _ref$localDraft === void 0 ? false : _ref$localDraft,
+      children = _ref.children;
+
+  var _useState = useState({
+    name: ''
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      currentStep = _useState2[0],
+      setCurrentStep = _useState2[1];
+
+  useEffect(function () {
+    if (!forceStepName) {
+      setCurrentStep(steps[0]);
+    }
+  }, [forceStepName, steps]);
+  useEffect(function () {
+    if (forceStepName !== currentStep.name) {
+      var forceStep = steps.find(function (_ref2) {
+        var name = _ref2.name;
+        return name === forceStepName;
+      });
+      forceStep && setCurrentStep(forceStep);
+    }
+  }, [forceStepName]);
+  var localData = isBrowser && localDraft && window.localStorage.getItem("questions-".concat(name));
+
+  var _useState3 = useState(localData && JSON.parse(localData) || initialData),
+      _useState4 = _slicedToArray(_useState3, 2),
+      data = _useState4[0],
+      setData = _useState4[1];
+
+  var submitStep = function submitStep(stepName, stepData) {
+    data[stepName] = stepData;
+
+    if (localDraft) {
+      isBrowser && window.localStorage.setItem("questions-".concat(name), JSON.stringify(data));
+    }
+
+    if (onChange) {
+      onChange && onChange(data);
+    }
+
+    setData(data);
+    var nextStep = getNextStep(currentStep, steps, data);
+
+    if (nextStep) {
+      onActiveStep && onActiveStep(nextStep);
+      setCurrentStep(nextStep);
+    } else {
+      onSubmit(data);
+    }
+  };
+
+  return /*#__PURE__*/React.createElement(QuestionsContext.Provider, {
+    value: {
+      steps: steps,
+      currentStep: currentStep,
+      submitStep: submitStep,
+      data: data,
+      onActiveStep: onActiveStep
+    }
+  }, children);
+};

package/es/Questions/QuestionsContext.js

@@ -0,0 +1,11 @@
+import { createContext } from 'react';
+var defaultStep = {
+  name: ''
+};
+export var QuestionsContext = /*#__PURE__*/createContext({
+  currentStep: defaultStep,
+  steps: [],
+  submitStep: function submitStep() {
+    return null;
+  }
+});

package/es/Questions/Step/ReviewStep.js

@@ -2,8 +2,9 @@ import React, { useContext } from 'react';
 import { SummaryList, SummaryListItem, SummaryListItemKey, SummaryListItemValue, SummaryListItemAction } from '@digigov/ui/core/SummaryList';
 import Title from '@digigov/ui/typography/Title';
 import { Button } from '@digigov/ui/core';
-import { QuestionsContext } from '@digigov/form/Questions/';
-import { StepTitleBase, StepContext } from '@digigov/form/Questions/Step';
+import { QuestionsContext } from '@digigov/form/Questions/QuestionsContext';
+import { StepTitleBase } from '@digigov/form/Questions/Step/StepTitle';
+import { StepContext } from '@digigov/form/Questions/Step/StepContext';
 import { useTranslation } from '@digigov/ui/app/i18n';
 export var ReviewStep = function ReviewStep() {
   var _useTranslation = useTranslation(),
@@ -48,4 +49,5 @@ export var ReviewStep = function ReviewStep() {
       return submitStep && submitStep();
     }
   }, t('button.submit')));
-};
+};
+export default ReviewStep;

package/es/Questions/Step/Step.js

@@ -0,0 +1,69 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useContext, useState } from 'react';
+import { QuestionsContext } from '@digigov/form/Questions/QuestionsContext';
+import { StepContext } from '@digigov/form/Questions/Step/StepContext';
+import { StepArrayReview } from '@digigov/form/Questions/Step/StepArrayReview';
+
+/**
+ * The Step component accepts Step data as props
+ * uses composable components to provide a wholesome UX
+ *
+ */
+export var Step = function Step(props) {
+  // or return all Questions and currentStepName
+  // or return a specific Step object
+  var _useContext = useContext(QuestionsContext),
+      currentStep = _useContext.currentStep,
+      submitStep = _useContext.submitStep,
+      data = _useContext.data;
+
+  var _useState = useState([]),
+      _useState2 = _slicedToArray(_useState, 2),
+      stepData = _useState2[0],
+      setStepData = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      reviewActive = _useState4[0],
+      setReviewActive = _useState4[1];
+
+  var handleArraySubmit = function handleArraySubmit(_name, data) {
+    setStepData([].concat(_toConsumableArray(stepData), [data]));
+    setReviewActive(true);
+  };
+
+  var handleArrayDeleteItem = function handleArrayDeleteItem(deleteIndex) {
+    var nextStepData = stepData.filter(function (_item, stepIndex) {
+      return stepIndex !== deleteIndex;
+    });
+    setStepData(nextStepData);
+
+    if (nextStepData.length === 0) {
+      setReviewActive(false);
+    }
+  };
+
+  var handleArrayReviewStep = function handleArrayReviewStep(data) {
+    if (data.addMore === 'yes') {
+      setReviewActive(false);
+    } else if (data.addMore === 'no') {
+      submitStep(currentStep.name, stepData);
+    }
+  };
+
+  if (!currentStep || props.name !== currentStep.name) return null; // then provide the currentStep object
+
+  return /*#__PURE__*/React.createElement(StepContext.Provider, {
+    value: _extends({}, currentStep, {
+      submitStep: currentStep.type === 'array' ? handleArraySubmit : submitStep,
+      initial: data[props.name]
+    })
+  }, reviewActive ? /*#__PURE__*/React.createElement(StepArrayReview, {
+    array: stepData,
+    handleSubmit: handleArrayReviewStep,
+    handleDelete: handleArrayDeleteItem
+  }) : props.children);
+};
+export default Step;

package/es/Questions/Step/StepArrayReview.js

@@ -0,0 +1,50 @@
+import React, { useContext } from 'react';
+import { QuestionsContext } from '@digigov/form/Questions/QuestionsContext';
+import PageTitle, { PageTitleHeading } from '@digigov/ui/app/PageTitle';
+import Button from '@digigov/ui/core/Button';
+import { FormBuilder } from '@digigov/form/FormBuilder';
+import { Field } from '@digigov/form/Field';
+import { Fieldset } from '@digigov/form/Fieldset';
+import Label from '@digigov/form/inputs/Label';
+import { SummaryList, SummaryListItem, SummaryListItemKey, SummaryListItemValue, SummaryListItemAction } from '@digigov/ui/core/SummaryList';
+import { useTranslation } from '@digigov/ui/app/i18n';
+import { getAddMoreFields } from '@digigov/form/Questions/Step/getAddMoreFields';
+export var StepArrayReview = function StepArrayReview(props) {
+  var _currentStep$review2, _currentStep$review3, _currentStep$review4;
+
+  var _useTranslation = useTranslation(),
+      t = _useTranslation.t;
+
+  var _useContext = useContext(QuestionsContext),
+      currentStep = _useContext.currentStep;
+
+  var fields = getAddMoreFields(currentStep);
+  var primaryField = currentStep.fields.find(function (field) {
+    var _currentStep$review;
+
+    return field.key === ((_currentStep$review = currentStep.review) === null || _currentStep$review === void 0 ? void 0 : _currentStep$review.primaryFieldKey);
+  }) || {};
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PageTitle, null, /*#__PURE__*/React.createElement(PageTitleHeading, null, ((_currentStep$review2 = currentStep.review) === null || _currentStep$review2 === void 0 ? void 0 : _currentStep$review2.title) && t((_currentStep$review3 = currentStep.review) === null || _currentStep$review3 === void 0 ? void 0 : _currentStep$review3.title))), /*#__PURE__*/React.createElement(SummaryList, null, props.array.map(function (item, idx) {
+    return /*#__PURE__*/React.createElement(SummaryListItem, {
+      key: idx
+    }, /*#__PURE__*/React.createElement(SummaryListItemKey, null, t(primaryField.label.primary)), /*#__PURE__*/React.createElement(SummaryListItemValue, null, item[primaryField.key]), /*#__PURE__*/React.createElement(SummaryListItemAction, {
+      onClick: function onClick() {
+        return props.handleDelete(idx);
+      }
+    }, t('button.delete')));
+  })), /*#__PURE__*/React.createElement(FormBuilder, {
+    key: "addmore",
+    fields: fields,
+    onSubmit: props.handleSubmit
+  }, /*#__PURE__*/React.createElement(Fieldset, null, /*#__PURE__*/React.createElement(Label, {
+    label: (_currentStep$review4 = currentStep.review) === null || _currentStep$review4 === void 0 ? void 0 : _currentStep$review4.addMore.title
+  }), fields.map(function (field) {
+    return /*#__PURE__*/React.createElement(Field, {
+      key: field.key,
+      name: field.key
+    });
+  })), /*#__PURE__*/React.createElement(Button, {
+    type: "submit"
+  }, t('button.submit'))));
+};
+export default StepArrayReview;

package/es/Questions/Step/StepContext.js

@@ -0,0 +1,27 @@
+import { createContext } from 'react';
+export var StepContext = /*#__PURE__*/createContext({
+  name: '',
+  fields: [],
+  initial: [],
+  errorLabels: [],
+  submitStep: '',
+  review: {
+    title: '',
+    primaryFieldKey: '',
+    addMore: {
+      title: {
+        primary: ''
+      },
+      answers: {
+        positive: {
+          primary: 'Yes'
+        },
+        negative: {
+          primary: 'No'
+        }
+      }
+    }
+  },
+  type: 'object'
+});
+export default StepContext;

package/es/Questions/Step/StepDescription.js

@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["children", "description"];
 import React, { useContext } from 'react';
-import { StepContext } from '@digigov/form/Questions/Step';
+import { StepContext } from '@digigov/form/Questions/Step/StepContext';
 import Paragraph from '@digigov/ui/typography/Paragraph';
 import { useTranslation } from '@digigov/ui/app/i18n';
 export var StepDescriptionBase = function StepDescriptionBase(_ref) {