@ukhomeoffice/cop-react-form-renderer 5.62.1 → 5.65.0

package/dist/components/CollectionSummary/SummaryCardDetails.js

@@ -7,7 +7,9 @@ exports.default = exports.DEFAULT_CLASS = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
 var _utils = _interopRequireDefault(require("../../utils"));
+var _models = require("../../models");
 var _getComponentRowForCYA = _interopRequireDefault(require("../../utils/CheckYourAnswers/getComponentRowForCYA"));
+var _getCYARowsForContainer = _interopRequireDefault(require("../../utils/CheckYourAnswers/getCYARowsForContainer"));
 require("./SummaryCardDetails.scss");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -84,6 +86,20 @@ var SummaryCardDetails = function SummaryCardDetails(_ref) {
         if (!component) {
           return null;
         }
+        if (component.type === _models.ComponentTypes.CONTAINER) {
+          var containerRows = (0, _getCYARowsForContainer.default)(childPage, component, entryData);
+          return /*#__PURE__*/_react.default.createElement("div", {
+            key: fieldId,
+            className: classes('field')
+          }, containerRows.map(function (subComponent) {
+            var _entryData$component$;
+            // Put value for current subcomponent at top level
+            var modEntry = _objectSpread(_objectSpread({}, entryData), _defineProperty({}, subComponent.fieldId, (_entryData$component$ = entryData[component.fieldId]) === null || _entryData$component$ === void 0 ? void 0 : _entryData$component$[subComponent.fieldId]));
+            return (0, _getComponentRowForCYA.default)(childPage, _objectSpread(_objectSpread({}, subComponent), {
+              label: subComponent.key
+            }), classes, modEntry);
+          }));
+        }
         return /*#__PURE__*/_react.default.createElement("div", {
           key: fieldId,
           className: classes('field')

package/dist/components/CollectionSummary/SummaryCardDetails.test.js

@@ -82,6 +82,75 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var section2Content = section2Title.parentNode.querySelector(".".concat(classes('section-content')));
     expect(section2Content.querySelectorAll(".".concat(classes('field'))).length).toEqual(1);
   });
+  it('should render sections containing containers based on summaryLayout config', function () {
+    var CHILD_PAGES = [{
+      summaryLayout: {
+        sections: [{
+          title: 'Section 1',
+          columns: 1,
+          fields: ['containerComponent']
+        }]
+      },
+      components: [{
+        fieldId: 'containerComponent',
+        type: 'container',
+        label: 'container',
+        components: [{
+          fieldId: 'subOne',
+          label: 'subOneLabel'
+        }, {
+          fieldId: 'subTwo',
+          label: 'subTwoLabel'
+        }, {
+          fieldId: 'subThree',
+          label: 'subThreeLabel'
+        }]
+      }]
+    }];
+    var CONTAINER_ENTRY = {
+      id: '001',
+      bannerText: 'A banner',
+      titleText: 'A title',
+      detailsText: 'Some details',
+      index: 0,
+      summaryText: 'Full details',
+      containerComponent: {
+        subOne: 'alpha',
+        subTwo: 'bravo',
+        subThree: 'charlie'
+      }
+    };
+    var MASTER_PAGE = {
+      childPages: CHILD_PAGES
+    };
+    var _renderWithValidation2 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+        masterPage: MASTER_PAGE,
+        childMasterPages: [],
+        formData: {},
+        entryData: CONTAINER_ENTRY
+      })),
+      container = _renderWithValidation2.container;
+
+    // Function to find an element by its text content
+    function getByTextContent(parent, text) {
+      return Array.from(parent.getElementsByClassName(classes('section-title'))).find(function (el) {
+        return el.textContent === text;
+      });
+    }
+
+    // Check for section title
+    var section1Title = getByTextContent(container, 'Section 1');
+    expect(section1Title).not.toBeUndefined();
+
+    // All three subcomponents from the container should have labels and values displayed
+    var section1Content = section1Title.parentNode.querySelector(".".concat(classes('section-content')));
+    expect(section1Content.textContent).toContain('subOneLabel');
+    expect(section1Content.textContent).toContain('alpha');
+    expect(section1Content.textContent).toContain('subTwoLabel');
+    expect(section1Content.textContent).toContain('bravo');
+    expect(section1Content.textContent).toContain('subThreeLabel');
+    expect(section1Content.textContent).toContain('charlie');
+  });
   it('should render sections if they have show_when checks and pass them', function () {
     var CHILD_PAGES = [{
       summaryLayout: {
@@ -114,13 +183,13 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var CUSTOM_ENTRY = _objectSpread(_objectSpread({}, ENTRY), {}, {
       showSection1: true
     });
-    var _renderWithValidation2 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation3 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childMasterPages: [],
         formData: {},
         entryData: CUSTOM_ENTRY
       })),
-      container = _renderWithValidation2.container;
+      container = _renderWithValidation3.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {
@@ -171,13 +240,13 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var CUSTOM_ENTRY = _objectSpread(_objectSpread({}, ENTRY), {}, {
       showSection1: false
     });
-    var _renderWithValidation3 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation4 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childMasterPages: [],
         formData: {},
         entryData: CUSTOM_ENTRY
       })),
-      container = _renderWithValidation3.container;
+      container = _renderWithValidation4.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {
@@ -231,7 +300,7 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var CUSTOM_ENTRY = _objectSpread(_objectSpread({}, ENTRY), {}, {
       showSection1: false
     });
-    var _renderWithValidation4 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation5 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childMasterPages: [],
         formData: {
@@ -239,7 +308,7 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
         },
         entryData: CUSTOM_ENTRY
       })),
-      container = _renderWithValidation4.container;
+      container = _renderWithValidation5.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {
@@ -294,13 +363,13 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
       childPages: [].concat(CHILD_PAGES, CHILD_MASTER_PAGES)
     };
     var CHILD_COLLECTIONS = ['childCollection'];
-    var _renderWithValidation5 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
+    var _renderWithValidation6 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_SummaryCardDetails.default, {
         masterPage: MASTER_PAGE,
         childCollections: CHILD_COLLECTIONS,
         formData: {},
         entryData: ENTRY
       })),
-      container = _renderWithValidation5.container;
+      container = _renderWithValidation6.container;
 
     // Function to find an element by its text content
     function getByTextContent(parent, text) {

package/dist/components/CollectionSummary/SummaryCardValidationContext.js

@@ -7,8 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _utils = _interopRequireDefault(require("../../utils"));
 var _ValidationContext = require("../../context/ValidationContext");
+var _hooks = require("../../hooks");
+var _utils = _interopRequireDefault(require("../../utils"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -22,7 +23,11 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } /* eslint-
 var SummaryCardValidationContextProvider = function SummaryCardValidationContextProvider(_ref) {
   var entryId = _ref.entryId,
     topLevelErrors = _ref.topLevelErrors,
+    clearTopLevelErrorsForCard = _ref.clearTopLevelErrorsForCard,
     children = _ref.children;
+  var _useHooks = (0, _hooks.useHooks)(),
+    hooks = _useHooks.hooks;
+
   // Errors raised from the Collection Summary.
   var initialErrors = topLevelErrors.filter(function (e) {
     return e.entryId === entryId;
@@ -38,8 +43,10 @@ var SummaryCardValidationContextProvider = function SummaryCardValidationContext
     setErrors(null);
   };
   var addErrors = function addErrors(addedErrors) {
-    var newErrors = errors !== null && errors !== void 0 ? errors : [];
-    setErrors(newErrors.concat(addedErrors));
+    setErrors(function (prev) {
+      var newErrors = prev !== null && prev !== void 0 ? prev : [];
+      return newErrors.concat(addedErrors);
+    });
   };
 
   // This validate is only used by the Quick Edit page
@@ -47,8 +54,9 @@ var SummaryCardValidationContextProvider = function SummaryCardValidationContext
   var validate = {
     page: function page(_page) {
       var pageErrors = _utils.default.Validate.page(_page);
-      setErrors(pageErrors);
-      return pageErrors;
+      var allErrors = hooks.onValidate(_page, pageErrors);
+      setErrors(allErrors);
+      return allErrors;
     }
   };
   return /*#__PURE__*/_react.default.createElement(_ValidationContext.ValidationContext.Provider, {
@@ -56,6 +64,7 @@ var SummaryCardValidationContextProvider = function SummaryCardValidationContext
       addErrors: addErrors,
       errors: errors === null ? [].concat(initialErrors) : errors,
       resetQuickEditErrors: resetQuickEditErrors,
+      clearTopLevelErrorsForCard: clearTopLevelErrorsForCard,
       validate: validate
     }
   }, children);
@@ -64,6 +73,7 @@ var _default = exports.default = SummaryCardValidationContextProvider;
 SummaryCardValidationContextProvider.propTypes = {
   entryId: _propTypes.default.string.isRequired,
   topLevelErrors: _propTypes.default.arrayOf(_propTypes.default.shape({})),
+  clearTopLevelErrorsForCard: _propTypes.default.func.isRequired,
   children: _propTypes.default.node
 };
 SummaryCardValidationContextProvider.defaultProps = {

package/dist/components/CollectionSummary/SummaryCardValidationContext.test.js

@@ -6,6 +6,7 @@ var _copReactComponents = require("@ukhomeoffice/cop-react-components");
 var _react2 = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../../hooks");
+var _context3 = require("../../context");
 var _SummaryCardValidationContext = _interopRequireDefault(require("./SummaryCardValidationContext"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -36,10 +37,10 @@ describe('context.SummaryCardValidationContext', function () {
     return _regeneratorRuntime().wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          _render = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_SummaryCardValidationContext.default, {
+          _render = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_context3.HooksContextProvider, null, /*#__PURE__*/_react2.default.createElement(_SummaryCardValidationContext.default, {
             entryId: "123",
             topLevelErrors: []
-          }, /*#__PURE__*/_react2.default.createElement(TestComponent, null))), container = _render.container;
+          }, /*#__PURE__*/_react2.default.createElement(TestComponent, null)))), container = _render.container;
           expect(container.childNodes.length).toEqual(4);
           expect(container.textContent).toContain('addErrors is a function');
           expect(container.textContent).toContain('resetQuickEditErrors is a function');
@@ -72,10 +73,10 @@ describe('context.SummaryCardValidationContext', function () {
             id: 'testid',
             error: 'error message four'
           }];
-          _render2 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_SummaryCardValidationContext.default, {
+          _render2 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_context3.HooksContextProvider, null, /*#__PURE__*/_react2.default.createElement(_SummaryCardValidationContext.default, {
             entryId: "123",
             topLevelErrors: TOP_LEVEL_ERRORS
-          }, /*#__PURE__*/_react2.default.createElement(TestComponent, null))), container = _render2.container;
+          }, /*#__PURE__*/_react2.default.createElement(TestComponent, null)))), container = _render2.container;
           expect(container.childNodes.length).toEqual(5);
           expect(container.textContent).toContain('addErrors is a function');
           expect(container.textContent).toContain('resetQuickEditErrors is a function');

package/dist/components/FormRenderer/onPageAction.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _models = require("../../models");
 var _utils = _interopRequireDefault(require("../../utils"));
+var _setCollectionPageData = _interopRequireDefault(require("../../utils/CollectionPage/setCollectionPageData"));
 var _handlers = _interopRequireDefault(require("./handlers"));
 var _helpers = _interopRequireDefault(require("./helpers"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -48,7 +49,11 @@ var onPageAction = function onPageAction(action, patch, patchLabel, hooks, data,
     if (action.addToFormData) {
       var operations = Array.isArray(action.addToFormData) ? action.addToFormData : [action.addToFormData];
       operations.forEach(function (op) {
-        _utils.default.Data.setDataItem(formState.page.formData, op.field, op.value);
+        if (op.isCollection) {
+          (0, _setCollectionPageData.default)(op.field, op.value, formState.page.formData);
+        } else {
+          _utils.default.Data.setDataItem(formState.page.formData, op.field, op.value);
+        }
       });
       form.page.formData[action.addToFormData.field] = action.addToFormData.value;
     }

package/dist/components/FormRenderer/onPageAction.test.js

@@ -576,10 +576,16 @@ describe('components.FormRenderer.onPageAction', function () {
         var ACTION = {
           type: actionType,
           collection: 'testCollection',
-          addToFormData: {
+          addToFormData: [{
             field: 'alpha',
             value: '123'
-          }
+          }, {
+            field: 'parent.child',
+            value: [{
+              id: '12345'
+            }],
+            isCollection: true
+          }]
         };
         var CUSTOM_ARGS = _objectSpread(_objectSpread({}, ARGS), {}, {
           formState: FORM_STATE,
@@ -591,6 +597,7 @@ describe('components.FormRenderer.onPageAction', function () {
         expect(FORM_STATE.page.formData).toMatchObject({
           alpha: '123'
         });
+        expect(FORM_STATE.page.formData.parent[0].child[0].id).toEqual('12345');
       });
     });
     it("should work for the ".concat(_models.PageAction.TYPES.NAVIGATE, " action type"), function () {
@@ -604,10 +611,16 @@ describe('components.FormRenderer.onPageAction', function () {
       var ACTION = {
         type: _models.PageAction.TYPES.NAVIGATE,
         collection: 'testCollection',
-        addToFormData: {
+        addToFormData: [{
           field: 'alpha',
           value: '123'
-        }
+        }, {
+          field: 'parent.child',
+          value: [{
+            id: '12345'
+          }],
+          isCollection: true
+        }]
       };
       var CUSTOM_ARGS = _objectSpread(_objectSpread({}, ARGS), {}, {
         formState: FORM_STATE,
@@ -621,6 +634,7 @@ describe('components.FormRenderer.onPageAction', function () {
       expect(FORM_STATE.page.formData).toMatchObject({
         alpha: '123'
       });
+      expect(FORM_STATE.page.formData.parent[0].child[0].id).toEqual('12345');
     });
     it('should work for an array of formData', function () {
       var FORM_STATE = {

package/dist/context/ValidationContext/ValidationContext.js

@@ -31,6 +31,45 @@ var ValidationContextProvider = function ValidationContextProvider(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     errors = _useState2[0],
     setErrors = _useState2[1];
+  var _useState3 = (0, _react.useState)([]),
+    _useState4 = _slicedToArray(_useState3, 2),
+    queuedErrors = _useState4[0],
+    setQueuedErrors = _useState4[1];
+
+  /**
+   * Queues errors to be displayed when the next validation takes place.
+   * 
+   * @param {array} errors An array of errors to queue.
+   */
+  var enqueueErrors = function enqueueErrors(errors) {
+    setQueuedErrors(function (prev) {
+      return [].concat(prev, errors).filter(function (e) {
+        return !!e;
+      });
+    });
+  };
+
+  /**
+   * Removed errors from the queue if they match the given criteria.
+   * 
+   * @param {function} matcher A function that should take an error and return true if that 
+   *                           error should be removed from the queue.
+   */
+  var dequeueErrors = function dequeueErrors(matcher) {
+    if (typeof matcher !== 'function') {
+      return;
+    }
+    setQueuedErrors(function (prev) {
+      return prev.filter(function (e) {
+        return !matcher(e);
+      });
+    });
+  };
+  var clearQueuedErrors = function clearQueuedErrors() {
+    if (queuedErrors.length) {
+      setQueuedErrors([]);
+    }
+  };
   var addErrors = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(errors) {
       return _regeneratorRuntime().wrap(function _callee$(_context) {
@@ -56,8 +95,9 @@ var ValidationContextProvider = function ValidationContextProvider(_ref) {
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
           case 0:
+            setQueuedErrors([]);
             setErrors([]);
-          case 1:
+          case 2:
           case "end":
             return _context2.stop();
         }
@@ -69,19 +109,21 @@ var ValidationContextProvider = function ValidationContextProvider(_ref) {
   }();
   var validate = {
     page: function page(_page) {
-      var pageErrors = _utils.default.Validate.page(_page);
+      var pageErrors = _utils.default.Validate.page(_page, queuedErrors);
       var allErrors = hooks.onValidate(_page, pageErrors);
       setErrors(allErrors);
+      setQueuedErrors([]);
       return allErrors;
     },
     pages: function pages(_pages) {
-      var allPagesErrors = _pages.map(function (page) {
-        return _utils.default.Validate.page(page);
+      var pageErrors = _pages.map(function (page) {
+        return _utils.default.Validate.page(page, queuedErrors);
       });
       var allErrors = _pages.flatMap(function (page, index) {
-        return hooks.onValidate(page, allPagesErrors[index]);
+        return hooks.onValidate(page, pageErrors[index]);
       });
       setErrors(allErrors);
+      setQueuedErrors([]);
       return allErrors;
     }
   };
@@ -90,6 +132,10 @@ var ValidationContextProvider = function ValidationContextProvider(_ref) {
       errors: errors,
       addErrors: addErrors,
       clearErrors: clearErrors,
+      queuedErrors: queuedErrors,
+      enqueueErrors: enqueueErrors,
+      dequeueErrors: dequeueErrors,
+      clearQueuedErrors: clearQueuedErrors,
       validate: validate
     }
   }, children);

package/dist/context/ValidationContext/ValidationContext.test.js

@@ -6,8 +6,8 @@ var _copReactComponents = require("@ukhomeoffice/cop-react-components");
 var _react2 = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../../hooks");
-var _ValidationContext = _interopRequireDefault(require("./ValidationContext"));
 var _HooksContext = _interopRequireDefault(require("../HooksContext"));
+var _ValidationContext = _interopRequireDefault(require("./ValidationContext"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -20,6 +20,9 @@ var TestComponent = function TestComponent(_ref) {
   var _useValidation = (0, _hooks.useValidation)(),
     addErrors = _useValidation.addErrors,
     clearErrors = _useValidation.clearErrors,
+    enqueueErrors = _useValidation.enqueueErrors,
+    dequeueErrors = _useValidation.dequeueErrors,
+    clearQueuedErrors = _useValidation.clearQueuedErrors,
     errors = _useValidation.errors,
     validate = _useValidation.validate;
   (0, _react2.useEffect)(function () {
@@ -27,7 +30,7 @@ var TestComponent = function TestComponent(_ref) {
       addErrors(customErrors);
     }
   }, [customErrors]);
-  return /*#__PURE__*/_react2.default.createElement(_react2.default.Fragment, null, typeof addErrors === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "addErrors is a function"), typeof clearErrors === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "clearErrors is a function"), typeof validate.page === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "validate.page is a function"), Array.isArray(errors) && /*#__PURE__*/_react2.default.createElement("span", null, "errors is an array of length ", errors.length), (errors === null || errors === void 0 ? void 0 : errors.length) > 0 && /*#__PURE__*/_react2.default.createElement(_copReactComponents.ErrorSummary, {
+  return /*#__PURE__*/_react2.default.createElement(_react2.default.Fragment, null, typeof addErrors === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "addErrors is a function"), typeof clearErrors === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "clearErrors is a function"), typeof enqueueErrors === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "enqueueErrors is a function"), typeof dequeueErrors === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "dequeueErrors is a function"), typeof clearQueuedErrors === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "clearQueuedErrors is a function"), typeof validate.page === 'function' && /*#__PURE__*/_react2.default.createElement("span", null, "validate.page is a function"), Array.isArray(errors) && /*#__PURE__*/_react2.default.createElement("span", null, "errors is an array of length ", errors.length), (errors === null || errors === void 0 ? void 0 : errors.length) > 0 && /*#__PURE__*/_react2.default.createElement(_copReactComponents.ErrorSummary, {
     errors: errors
   }));
 };
@@ -38,12 +41,15 @@ describe('context.ValidationContext', function () {
       while (1) switch (_context.prev = _context.next) {
         case 0:
           _render = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_HooksContext.default, null, /*#__PURE__*/_react2.default.createElement(_ValidationContext.default, null, /*#__PURE__*/_react2.default.createElement(TestComponent, null)))), container = _render.container;
-          expect(container.childNodes.length).toEqual(4);
+          expect(container.childNodes.length).toEqual(7);
           expect(container.textContent).toContain('addErrors is a function');
           expect(container.textContent).toContain('clearErrors is a function');
+          expect(container.textContent).toContain('enqueueErrors is a function');
+          expect(container.textContent).toContain('dequeueErrors is a function');
+          expect(container.textContent).toContain('clearQueuedErrors is a function');
           expect(container.textContent).toContain('validate.page is a function');
           expect(container.textContent).toContain('errors is an array of length 0');
-        case 6:
+        case 9:
         case "end":
           return _context.stop();
       }
@@ -61,16 +67,19 @@ describe('context.ValidationContext', function () {
           _render2 = (0, _react.render)( /*#__PURE__*/_react2.default.createElement(_HooksContext.default, null, /*#__PURE__*/_react2.default.createElement(_ValidationContext.default, null, /*#__PURE__*/_react2.default.createElement(TestComponent, {
             customErrors: CUSTOM_ERRORS
           })))), container = _render2.container;
-          expect(container.childNodes.length).toEqual(5);
+          expect(container.childNodes.length).toEqual(8);
           expect(container.textContent).toContain('addErrors is a function');
           expect(container.textContent).toContain('clearErrors is a function');
+          expect(container.textContent).toContain('enqueueErrors is a function');
+          expect(container.textContent).toContain('dequeueErrors is a function');
+          expect(container.textContent).toContain('clearQueuedErrors is a function');
           expect(container.textContent).toContain('validate.page is a function');
           expect(container.textContent).toContain('errors is an array of length 1');
-          errorSummary = container.childNodes[4];
+          errorSummary = container.childNodes[7];
           expect(errorSummary.tagName).toEqual('DIV');
           expect(errorSummary.classList).toContain('govuk-error-summary');
           expect(errorSummary.textContent).toContain(CUSTOM_ERRORS[0].error);
-        case 11:
+        case 14:
         case "end":
           return _context2.stop();
       }

package/dist/utils/CollectionPage/duplicateCollectionPageEntry.js

@@ -12,8 +12,20 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+/**
+ * Duplicates an entry with the given ID in the given collection, optionally
+ * ignoring named fields or adding extras to the duplicate if they're provided.
+ * 
+ * @param {string} collectionName The name of the collection the entry to duplicate is in.
+ * @param {object} formData The top-level formData object.
+ * @param {string} entryId The ID of the entry to duplicate.
+ * @param {array} fieldsToIgnore An array of field names that shouldn't be copied to the duplicate.
+ * @param {object} fieldsToAdd An object that will be spread to the new entry.
+ * @returns The ID of the duplicate entry.
+ */
 var duplicateCollectionPageEntry = function duplicateCollectionPageEntry(collectionName, formData, entryId) {
   var fieldsToIgnore = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
+  var fieldsToAdd = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
   var collectionData = (0, _getCollectionPageData.default)(collectionName, formData);
   var entryToDuplicate = collectionData === null || collectionData === void 0 ? void 0 : collectionData.find(function (entry) {
     return entry.id === entryId;
@@ -22,7 +34,7 @@ var duplicateCollectionPageEntry = function duplicateCollectionPageEntry(collect
     return null;
   }
   var newEntryId = Date.now().toString();
-  var newEntry = _objectSpread(_objectSpread({}, entryToDuplicate), {}, {
+  var newEntry = _objectSpread(_objectSpread(_objectSpread({}, entryToDuplicate), fieldsToAdd), {}, {
     id: newEntryId
   });
   fieldsToIgnore.forEach(function (field) {

package/dist/utils/CollectionPage/duplicateCollectionPageEntry.test.js

@@ -65,10 +65,25 @@ describe('utils.CollectionPage.duplicateCollectionPageEntry', function () {
     expect(FORM_DATA[COLLECTION_NAME][1].id).toBeTruthy();
     expect(FORM_DATA[COLLECTION_NAME][1].value).toBeUndefined();
   });
-  it('should do nothing if an entry with the given id does not exist', function () {
-    var _FORM_DATA3, _expect$toEqual;
+  it('should add fields from the fieldsToAdd object', function () {
+    var _FORM_DATA3;
     var FORM_DATA = (_FORM_DATA3 = {}, _defineProperty(_FORM_DATA3, "".concat(COLLECTION_NAME, "ActiveId"), '1'), _defineProperty(_FORM_DATA3, COLLECTION_NAME, [OBJ]), _FORM_DATA3);
     ;
+    var FIELDS_TO_ADD = {
+      addedKey: 'addedValue'
+    };
+    (0, _duplicateCollectionPageEntry.default)(COLLECTION_NAME, FORM_DATA, '1', [], FIELDS_TO_ADD);
+    expect(FORM_DATA[COLLECTION_NAME].length).toEqual(2);
+    expect(FORM_DATA[COLLECTION_NAME][0].id).toBeTruthy();
+    expect(FORM_DATA[COLLECTION_NAME][0].value).toBeTruthy();
+    expect(FORM_DATA[COLLECTION_NAME][1].id).toBeTruthy();
+    expect(FORM_DATA[COLLECTION_NAME][1].value).toBeTruthy();
+    expect(FORM_DATA[COLLECTION_NAME][1].addedKey).toEqual('addedValue');
+  });
+  it('should do nothing if an entry with the given id does not exist', function () {
+    var _FORM_DATA4, _expect$toEqual;
+    var FORM_DATA = (_FORM_DATA4 = {}, _defineProperty(_FORM_DATA4, "".concat(COLLECTION_NAME, "ActiveId"), '1'), _defineProperty(_FORM_DATA4, COLLECTION_NAME, [OBJ]), _FORM_DATA4);
+    ;
     (0, _duplicateCollectionPageEntry.default)(COLLECTION_NAME, FORM_DATA, '0');
     expect(FORM_DATA).toEqual((_expect$toEqual = {}, _defineProperty(_expect$toEqual, "".concat(COLLECTION_NAME, "ActiveId"), '1'), _defineProperty(_expect$toEqual, COLLECTION_NAME, [OBJ]), _expect$toEqual));
   });

package/dist/utils/Validate/validatePage.js

@@ -19,9 +19,11 @@ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input ==
 /**
  * Validate all of the components on a page.
  * @param {object} page The page to validate
+ * @param {array} queuedErrors Any errors that have been found before this validation.
  * @returns An array containing all of the errors.
  */
 var validatePage = function validatePage(page) {
+  var queuedErrors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
   var data = page.formData;
   if (page.collection) {
     var activeIndex = _CollectionPage.default.getActiveIndex(page.collection.name, page.formData);
@@ -32,7 +34,10 @@ var validatePage = function validatePage(page) {
   }
   if ((0, _showFormPage.default)(page, data) && Array.isArray(page.components)) {
     var errs = page.components.reduce(function (errors, component) {
-      var componentErrors = (0, _validateComponent.default)(component, data, data);
+      var queuedComponentErrors = queuedErrors.length > 0 ? queuedErrors.filter(function (e) {
+        return e.showFor ? e.showFor === component.id : e.id === component.id;
+      }) : [];
+      var componentErrors = queuedComponentErrors.concat((0, _validateComponent.default)(component, data, data));
       return errors.concat(componentErrors).flat().map(function (err) {
         if (err) {
           return _objectSpread(_objectSpread({}, err), {}, {

package/dist/utils/Validate/validatePage.test.js

@@ -719,4 +719,48 @@ describe('utils.Validate.Page', function () {
       });
     });
   });
+  describe('when there are queued errors', function () {
+    it('should return any errors queued for a component as well as errors found during validation', function () {
+      var COMPONENTS = [setup('a', _models.ComponentTypes.TEXT, 'Alpha', true)];
+      var PAGE = {
+        components: COMPONENTS,
+        formData: null
+      };
+      var QUEUED_ERRORS = [{
+        id: 'a',
+        error: 'Error queued for Alpha 1'
+      }, {
+        id: 'a',
+        error: 'Error queued for Alpha 2'
+      }];
+      var RESULT = (0, _validatePage.default)(PAGE, QUEUED_ERRORS);
+      expect(RESULT.length).toEqual(3);
+      expect(RESULT[0]).toEqual(_objectSpread({}, QUEUED_ERRORS[0]));
+      expect(RESULT[1]).toEqual(_objectSpread({}, QUEUED_ERRORS[1]));
+      expect(RESULT[2]).toEqual({
+        id: 'a',
+        error: 'Alpha is required'
+      });
+    });
+    it('should return any errors queued for a component even if no errors are found during validation', function () {
+      var COMPONENTS = [setup('a', _models.ComponentTypes.TEXT, 'Alpha', true)];
+      var PAGE = {
+        components: COMPONENTS,
+        formData: {
+          a: 'Value'
+        }
+      };
+      var QUEUED_ERRORS = [{
+        id: 'a',
+        error: 'Error queued for Alpha 1'
+      }, {
+        id: 'a',
+        error: 'Error queued for Alpha 2'
+      }];
+      var RESULT = (0, _validatePage.default)(PAGE, QUEUED_ERRORS);
+      expect(RESULT.length).toEqual(2);
+      expect(RESULT[0]).toEqual(_objectSpread({}, QUEUED_ERRORS[0]));
+      expect(RESULT[1]).toEqual(_objectSpread({}, QUEUED_ERRORS[1]));
+    });
+  });
 });