@ukhomeoffice/cop-react-form-renderer 6.0.2-peter → 6.0.5-peter

package/dist/components/CollectionPage/CollectionPage.js

@@ -29,7 +29,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } // Global
 // Styles
 var DEFAULT_CLASS = exports.DEFAULT_CLASS = _FormPage2.DEFAULT_CLASS;
 var CollectionPage = function CollectionPage(_ref) {
-  var _page$collection;
+  var _page$collection, _objectSpread4;
   var page = _ref.page,
     onCollectionChange = _ref.onCollectionChange,
     onAction = _ref.onAction,
@@ -120,7 +120,7 @@ var CollectionPage = function CollectionPage(_ref) {
   }
   return /*#__PURE__*/_react.default.createElement(_FormPage.default, {
     page: _objectSpread(_objectSpread({}, page), {}, {
-      formData: _objectSpread(_objectSpread(_objectSpread({}, page.formData), data[activeIndex]), {}, _defineProperty({}, "".concat(currentCollectionName, "ActiveIndex"), activeIndex)),
+      formData: _objectSpread(_objectSpread(_objectSpread({}, page.formData), data[activeIndex]), {}, (_objectSpread4 = {}, _defineProperty(_objectSpread4, "".concat(currentCollectionName, "ActiveIndex"), activeIndex), _defineProperty(_objectSpread4, "".concat(currentCollectionName, "NumberedIndex"), typeof activeIndex === 'number' ? activeIndex + 1 : null), _objectSpread4)),
       components: page.components.map(function (component) {
         return _objectSpread(_objectSpread({}, component), {}, {
           pageCollection: _objectSpread({}, page.collection)

package/dist/components/CollectionSummary/CollectionSummary.js

@@ -7,10 +7,13 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.DEFAULT_ADD_BUTTON_LABEL = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
+var _hooks = require("../../hooks");
 var _PageAction = require("../../models/PageAction");
 var _utils = _interopRequireDefault(require("../../utils"));
+var _getCYARow = _interopRequireDefault(require("../../utils/CheckYourAnswers/getCYARow"));
+var _elevateNestedComponents = _interopRequireDefault(require("../../utils/Component/elevateNestedComponents"));
+var _Answer = _interopRequireDefault(require("../CheckYourAnswers/Answer"));
 var _ActionButton = _interopRequireDefault(require("../PageActions/ActionButton"));
-var _hooks = require("../../hooks");
 var _Confirmation = _interopRequireDefault(require("./Confirmation"));
 var _SummaryCard = _interopRequireDefault(require("./SummaryCard"));
 var _SummaryCardValidationContext = _interopRequireDefault(require("./SummaryCardValidationContext"));
@@ -46,7 +49,7 @@ var DEFAULT_ADD_BUTTON_LABEL = exports.DEFAULT_ADD_BUTTON_LABEL = 'Add';
 // errors local to the Quick Edit page.
 
 var CollectionSummary = function CollectionSummary(_ref) {
-  var _config$confirmation, _config$confirmation2;
+  var _config$confirmation, _config$confirmation2, _config$confirmation3;
   var config = _ref.config,
     formData = _ref.formData,
     onAction = _ref.onAction,
@@ -83,6 +86,17 @@ var CollectionSummary = function CollectionSummary(_ref) {
       return currentPath;
     }, "");
   }, [pages]);
+  var allComponents = (0, _react.useMemo)(function () {
+    if (config.card.listView) {
+      var _masterPage$childPage;
+      var components = (_masterPage$childPage = masterPage.childPages) === null || _masterPage$childPage === void 0 ? void 0 : _masterPage$childPage.reduce(function (acc, page) {
+        var elevatedComponents = (0, _elevateNestedComponents.default)(page.components, _objectSpread(_objectSpread({}, formData), entryToDelete));
+        return acc.concat(elevatedComponents);
+      }, []);
+      return components || [];
+    }
+    return [];
+  }, [masterPage, formData, entryToDelete, config.card.listView]);
   var validateEntries = function validateEntries() {
     var stored = [];
     // We only clear errors if it's not empty to avoid
@@ -181,6 +195,23 @@ var CollectionSummary = function CollectionSummary(_ref) {
     setEntryToDelete(null);
     validateEntries();
   };
+  var renderFieldValue = function renderFieldValue(field) {
+    var component = allComponents.find(function (c) {
+      return c.fieldId === field;
+    });
+    if (!component) return null;
+    var row = (0, _getCYARow.default)(_objectSpread(_objectSpread({}, masterPage), {}, {
+      formData: _objectSpread(_objectSpread({}, formData), entryToDelete)
+    }), component);
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: field,
+      className: "confirmation-field-value"
+    }, /*#__PURE__*/_react.default.createElement(_Answer.default, {
+      value: row.value,
+      component: row.component,
+      formData: row.formData
+    }));
+  };
   return /*#__PURE__*/_react.default.createElement("div", {
     id: config.fieldId
   }, entryToDelete && /*#__PURE__*/_react.default.createElement(_Confirmation.default, {
@@ -191,7 +222,9 @@ var CollectionSummary = function CollectionSummary(_ref) {
     onCancel: function onCancel() {
       return setEntryToDelete(null);
     }
-  }, /*#__PURE__*/_react.default.createElement(_SummaryCard.default, {
+  }, config.card.listView ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "confirmation-content"
+  }, (_config$confirmation3 = config.confirmation) === null || _config$confirmation3 === void 0 ? void 0 : _config$confirmation3.displayFields.map(renderFieldValue)) : /*#__PURE__*/_react.default.createElement(_SummaryCard.default, {
     id: "".concat(config.fieldId, ".confirmationChild"),
     entryData: entryToDelete,
     config: config.card ? _objectSpread(_objectSpread({}, config.card), {}, {
@@ -200,7 +233,7 @@ var CollectionSummary = function CollectionSummary(_ref) {
     masterPage: masterPage,
     classModifiers: "nested",
     hideDetails: true
-  })), config.addButton && /*#__PURE__*/_react.default.createElement(_ActionButton.default, {
+  })), !config.card.listView && config.addButton && /*#__PURE__*/_react.default.createElement(_ActionButton.default, {
     id: "".concat(config.fieldId, ".addButton"),
     action: {
       collection: config.collectionName,
@@ -244,6 +277,16 @@ var CollectionSummary = function CollectionSummary(_ref) {
         return e.entryId === entry.id;
       }).length > 0
     }));
+  }), config.card.listView && config.addButton && /*#__PURE__*/_react.default.createElement(_ActionButton.default, {
+    id: "".concat(config.fieldId, ".addButton"),
+    action: {
+      collection: config.collectionName,
+      label: config.addButton.label || DEFAULT_ADD_BUTTON_LABEL,
+      page: config.addButton.page,
+      type: _PageAction.PageActionTypes.COLLECTION_ADD,
+      classModifiers: ['secondary']
+    },
+    onAction: onAction
   }));
 };
 CollectionSummary.propTypes = {
@@ -261,7 +304,8 @@ CollectionSummary.propTypes = {
       details: _propTypes.default.string,
       duplicateAction: _propTypes.default.shape({
         fieldsToIgnore: _propTypes.default.arrayOf(_propTypes.default.string)
-      })
+      }),
+      listView: _propTypes.default.bool
     }),
     errorCard: _propTypes.default.shape({
       banners: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.shape({})])),
@@ -273,7 +317,8 @@ CollectionSummary.propTypes = {
     }),
     confirmation: _propTypes.default.shape({
       message: _propTypes.default.string,
-      label: _propTypes.default.string
+      label: _propTypes.default.string,
+      displayFields: _propTypes.default.arrayOf(_propTypes.default.string)
     }),
     childCollections: _propTypes.default.arrayOf(_propTypes.default.string)
   }).isRequired,

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

@@ -283,5 +283,35 @@ describe('components.CollectionSummary.CollectionSummary', function () {
       var roleAttribute = confirmation.getAttribute('role');
       expect(roleAttribute).toEqual('alert');
     });
+    it('should correctly render field values in confirmation view', function () {
+      var listViewConfig = _objectSpread(_objectSpread({}, CONFIG), {}, {
+        card: _objectSpread(_objectSpread({}, CONFIG.card), {}, {
+          listView: true
+        }),
+        confirmation: {
+          displayFields: ['testText']
+        }
+      });
+      var _renderWithValidation9 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react.default.createElement(_CollectionSummary.default, {
+          config: listViewConfig,
+          formData: FORM_DATA,
+          onAction: ON_ACTION,
+          pages: PAGES
+        })),
+        container = _renderWithValidation9.container,
+        getByText = _renderWithValidation9.getByText;
+      var summary = checkSetup(container);
+      expect(summary.children.length).toEqual(2);
+      var card = summary.children[0];
+      var deleteButton = card.querySelector('.govuk-summary-card__actions li:last-child button');
+      _react2.fireEvent.click(deleteButton);
+      var confirmation = container.querySelector(".".concat(_Confirmation.DEFAULT_CLASS));
+      expect(confirmation).toBeTruthy();
+      listViewConfig.confirmation.displayFields.forEach(function (field) {
+        var fieldValue = FORM_DATA.testCollection[0][field];
+        var fieldElement = getByText(fieldValue);
+        expect(fieldElement).not.toBeNull();
+      });
+    });
   });
 });

package/dist/components/CollectionSummary/Confirmation.scss

@@ -11,4 +11,16 @@ $govuk-font-family: 'Roboto', arial, sans-serif;
     @extend .hods-button--warning;
     margin-right: govuk-spacing(2);
   }
+
+  .confirmation-content {
+    margin-bottom: govuk-spacing(6);
+
+    .hods-form-container .govuk-form-group {
+      margin-bottom: 0px;
+
+      label {
+        display: none;
+      }
+    }
+  }
 }

package/dist/components/CollectionSummary/RenderListView.js

@@ -8,8 +8,7 @@ var _copReactComponents = require("@ukhomeoffice/cop-react-components");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireDefault(require("react"));
 var _utils = _interopRequireDefault(require("../../utils"));
-var _SummaryListRow = _interopRequireDefault(require("../SummaryList/SummaryListRow"));
-var _Answer = _interopRequireDefault(require("../CheckYourAnswers/Answer"));
+var _getComponentRowForCYA = _interopRequireDefault(require("../../utils/CheckYourAnswers/getComponentRowForCYA"));
 require("./RenderListView.scss");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
@@ -85,31 +84,14 @@ var RenderListView = function RenderListView(_ref) {
     }).flat().filter(Boolean);
     return (_childPage$summaryLay = childPage.summaryLayout) === null || _childPage$summaryLay === void 0 || (_childPage$summaryLay = _childPage$summaryLay.sections) === null || _childPage$summaryLay === void 0 ? void 0 : _childPage$summaryLay.flatMap(function (section) {
       if (section.fields) {
-        var fieldsToRender = section.fields.filter(function (fieldId) {
-          return Object.prototype.hasOwnProperty.call(entryData, fieldId);
-        });
-        return fieldsToRender.map(function (fieldId) {
+        return section.fields.flatMap(function (fieldId) {
           var component = elevatedComponents.find(function (comp) {
             return comp.fieldId === fieldId;
           });
           if (!component) {
             return null;
           }
-          return /*#__PURE__*/_react.default.createElement(_SummaryListRow.default, {
-            key: fieldId,
-            row: {
-              key: component.label,
-              value: _copReactComponents.Utils.interpolateString(entryData[component.fieldId], entryData) || /*#__PURE__*/_react.default.createElement(_Answer.default, {
-                value: entryData[component.fieldId],
-                component: component,
-                formData: component.formData
-              }),
-              required: component.required
-            },
-            classes: function classes(element) {
-              return listClass(element);
-            }
-          });
+          return (0, _getComponentRowForCYA.default)(childPage, component, listClass, entryData);
         });
       }
       return null;

package/dist/components/CollectionSummary/RenderListView.scss

@@ -83,6 +83,13 @@ $govuk-font-family: 'Roboto', arial, sans-serif;
   @include govuk-media-query($until: tablet) {
     margin-bottom: govuk-spacing(3);
   }
+  .hods-form-container .govuk-form-group {
+    margin-bottom: 0px;
+
+    label {
+      display: none;
+    }
+  } 
 }
 
 .govuk-summary-list__value > p {

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

@@ -16,8 +16,8 @@ describe('components.CollectionSummary.RenderListView', function () {
     item1: 'Value 1',
     item2: 'Value 2',
     item3: {
-      a: 'Value 3',
-      b: 'Value 4'
+      label: 'Value 3',
+      value: 'Value 3'
     },
     index: 0
   };
@@ -92,6 +92,15 @@ describe('components.CollectionSummary.RenderListView', function () {
   beforeEach(function () {
     onDeleteArgs = [];
   });
+  var getComponentRow = function getComponentRow() {
+    return /*#__PURE__*/_react2.default.createElement("div", {
+      className: "govuk-summary-list__row"
+    }, /*#__PURE__*/_react2.default.createElement("dt", {
+      className: "govuk-summary-list__key"
+    }, "Test Key"), /*#__PURE__*/_react2.default.createElement("dd", {
+      className: "govuk-summary-list__value"
+    }, /*#__PURE__*/_react2.default.createElement("div", null, "Test Value")));
+  };
 
   // Setup function to check rendered elements
   var checkSetup = function checkSetup(container) {
@@ -107,7 +116,8 @@ describe('components.CollectionSummary.RenderListView', function () {
         config: CONFIG,
         onChange: ON_CHANGE,
         onDelete: ON_DELETE,
-        masterPage: MASTER_PAGE
+        masterPage: MASTER_PAGE,
+        getComponentRow: getComponentRow
       })),
       container = _renderWithValidation.container;
     var listViewDiv = checkSetup(container);
@@ -126,19 +136,19 @@ describe('components.CollectionSummary.RenderListView', function () {
     var firstRowKey = rows[0].querySelector('.govuk-summary-list__key');
     var firstRowValue = rows[0].querySelector('.govuk-summary-list__value');
     expect(firstRowKey.textContent).toEqual('Item 1');
-    expect(firstRowValue.textContent).toEqual(ENTRY.item1);
+    expect(firstRowValue.textContent).toEqual('Value 1');
 
     // Check the second row
     var secondRowKey = rows[1].querySelector('.govuk-summary-list__key');
     var secondRowValue = rows[1].querySelector('.govuk-summary-list__value');
     expect(secondRowKey.textContent).toEqual('Item 2 (optional)');
-    expect(secondRowValue.textContent).toEqual(ENTRY.item2);
+    expect(secondRowValue.textContent).toEqual('Value 2');
 
     // Check the third row
     var thirdRowKey = rows[2].querySelector('.govuk-summary-list__key');
     var thirdRowValue = rows[2].querySelector('.govuk-summary-list__value');
     expect(thirdRowKey.textContent).toEqual('Item 3');
-    expect(thirdRowValue.textContent).toEqual('Value 3Value 4');
+    expect(thirdRowValue.textContent).toEqual('Value 3');
   });
   it('should render the index correctly in the title', function () {
     var _renderWithValidation2 = (0, _setupTests.renderWithValidation)( /*#__PURE__*/_react2.default.createElement(_RenderListView.default, {
@@ -147,7 +157,8 @@ describe('components.CollectionSummary.RenderListView', function () {
         config: CONFIG,
         onChange: ON_CHANGE,
         onDelete: ON_DELETE,
-        masterPage: MASTER_PAGE
+        masterPage: MASTER_PAGE,
+        getComponentRow: getComponentRow
       })),
       container = _renderWithValidation2.container;
     var listViewDiv = checkSetup(container);
@@ -175,7 +186,8 @@ describe('components.CollectionSummary.RenderListView', function () {
           config: CONFIG,
           onChange: ON_CHANGE,
           onDelete: ON_DELETE,
-          masterPage: MASTER_PAGE
+          masterPage: MASTER_PAGE,
+          getComponentRow: getComponentRow
         })),
         container = _renderWithValidation3.container;
       var listViewDiv = container.querySelector('.govuk-summary-card');

package/dist/components/CollectionSummary/SummaryCard.scss

@@ -6,12 +6,6 @@ $govuk-font-family: 'Roboto', arial, sans-serif;
   width: 100% !important;
 }
 
-.govuk-form-group:has(.hods-form-summary-card) {
-  .govuk-form-group:last-of-type {
-    margin-left: govuk-spacing(3);
-  }
-}
-
 .hods-form-summary-card {
   box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
   border: 1px solid #E5E4E2;
@@ -88,6 +82,10 @@ $govuk-font-family: 'Roboto', arial, sans-serif;
     .details.hods-details {
       margin-bottom: 0;
     }
+
+    .hods-form-container .govuk-form-group label{
+      display: none;
+    }
   }
 }
 

package/dist/components/CollectionSummary/SummaryCardDetails.js

@@ -7,7 +7,7 @@ exports.default = exports.DEFAULT_CLASS = void 0;
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react = _interopRequireWildcard(require("react"));
 var _utils = _interopRequireDefault(require("../../utils"));
-var _FormComponent = _interopRequireDefault(require("../FormComponent"));
+var _getComponentRowForCYA = _interopRequireDefault(require("../../utils/CheckYourAnswers/getComponentRowForCYA"));
 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; }
@@ -81,18 +81,13 @@ var SummaryCardDetails = function SummaryCardDetails(_ref) {
         var component = allPageComponents.find(function (comp) {
           return comp.fieldId === fieldId;
         });
+        if (!component) {
+          return null;
+        }
         return /*#__PURE__*/_react.default.createElement("div", {
           key: fieldId,
           className: classes('field')
-        }, /*#__PURE__*/_react.default.createElement(_FormComponent.default, {
-          component: _objectSpread(_objectSpread({}, component), {}, {
-            hint: ''
-          }),
-          value: entryData[component === null || component === void 0 ? void 0 : component.fieldId],
-          formData: entryData,
-          wrap: true,
-          readonly: true
-        }));
+        }, (0, _getComponentRowForCYA.default)(childPage, component, classes, entryData));
       })));
     });
   }).filter(function (e) {

package/dist/components/CollectionSummary/SummaryCardDetails.scss

@@ -7,34 +7,44 @@ $govuk-font-family: 'Roboto', arial, sans-serif;
 }
 
 .hods-form-summary-card-details {
-  &__section {
-    border-bottom: 2px solid #E9EBED;
+  &__row {
+    margin-left: govuk-spacing(5);
 
-    &-title {
-      font-weight: bold;
-      margin: govuk-spacing(2) 0 govuk-spacing(6) 0;
+    .hods-button-group{
+      display: none;
     }
+  }
+
+  &__key {
+    font-weight: bold;
+    margin: govuk-spacing(2) 0 govuk-spacing(1) 0;
+  }
+
+  &__value {
+    margin: 0;
+
+    .hods-form-container .govuk-form-group {
+      margin-bottom: 0px;
+
+      label {
+        display: none;
+      }
+    } 
+  }
+  
+  &__section {
+    border-bottom: 2px solid #E9EBED;
 
     &-content {
       display: flex;
       flex-wrap: wrap;
       gap: govuk-spacing(2);
 
-      .hods-form-summary-card-details__field {
+      .hods-form-summary-card__field {
         box-sizing: border-box;
         margin-bottom: govuk-spacing(4);
 
-        .govuk-label,
-        .govuk-fieldset__legend {
-          font-weight: bold;
-          margin-bottom: govuk-spacing(1) !important;
-
-          &::after {
-            content: " :";
-          }
-        }
-
-        div.govuk-form-group div:has(img){
+        .hods-form-summary-card__row div:has(img){
           display: flex;
           flex-wrap: wrap;
 

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

@@ -313,7 +313,7 @@ describe('components.CollectionSummary.SummaryCardDetails', function () {
     var childSectionTitles = getByTextContent(container, 'Hidden Title');
     expect(childSectionTitles).toBeUndefined(); // Individual section title for child collections should be hidden.
 
-    var childFields = container.querySelectorAll(".".concat(classes('field')));
-    expect(childFields.length).toEqual(4); // Two for each entry in the child collection.
+    var childFields = container.querySelectorAll(".".concat(classes('section')));
+    expect(childFields.length).toEqual(2); // One for each entry in the child collection.
   });
 });

package/dist/components/FormComponent/FormComponent.js

@@ -166,6 +166,7 @@ var FormComponent = function FormComponent(_ref) {
     options: options,
     value: value,
     onChange: onComponentChangeExtended,
+    onTopLevelChange: onTopLevelChange,
     formData: formData,
     onAction: onAction,
     submitting: submitting

package/dist/components/FormRenderer/helpers/clearOutUncompletedRoutes.js

@@ -7,6 +7,7 @@ exports.default = void 0;
 var _showComponent = _interopRequireDefault(require("../../../utils/Component/showComponent"));
 var _mergeCollectionPages = _interopRequireDefault(require("../../../utils/CollectionPage/mergeCollectionPages"));
 var _deleteNodeByPath = _interopRequireDefault(require("./deleteNodeByPath"));
+var _optionIsSelected = _interopRequireDefault(require("../../../utils/Component/optionIsSelected"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /* eslint-disable no-param-reassign */
 
@@ -18,6 +19,19 @@ var recurseCheckForHiddenComponents = function recurseCheckForHiddenComponents(c
       (_component$components = component.components) === null || _component$components === void 0 || _component$components.forEach(function (c) {
         recurseCheckForHiddenComponents(c, formData, path, candidateComponentForDeletion);
       });
+    } else if ((0, _showComponent.default)(component, formData)) {
+      var _component$data;
+      if (component !== null && component !== void 0 && (_component$data = component.data) !== null && _component$data !== void 0 && _component$data.options) {
+        var _component$data2;
+        component === null || component === void 0 || (_component$data2 = component.data) === null || _component$data2 === void 0 || (_component$data2 = _component$data2.options) === null || _component$data2 === void 0 || _component$data2.forEach(function (option) {
+          if (!(0, _optionIsSelected.default)(formData[component.id], option) && option.nested) {
+            option.nested.forEach(function (nested) {
+              path = nested.fieldId;
+              candidateComponentForDeletion.set(path, component);
+            });
+          }
+        });
+      }
     } else if (!(0, _showComponent.default)(component, formData)) {
       candidateComponentForDeletion.set(path, component);
     }

package/dist/components/FormRenderer/onPageAction.js

@@ -56,7 +56,6 @@ var onPageAction = function onPageAction(action, patch, patchLabel, hooks, data,
       _handlers.default.navigate(action, pageId, onPageChange);
       setSubmitting(false);
     } else {
-      var baseData = _objectSpread(_objectSpread(_objectSpread({}, data), patch), formState.page.formData);
       var pageUpdate = function pageUpdate(next) {
         return onPageChange(_helpers.default.getNextPageId(type, pages, pageId, action, next));
       };
@@ -108,12 +107,14 @@ var onPageAction = function onPageAction(action, patch, patchLabel, hooks, data,
         setData(submissionData);
       }
       ;
+      var formPagesAndComponents = {
+        pages: pages,
+        components: components
+      };
       if (action.type === _models.PageAction.TYPES.SUBMIT) {
-        _helpers.default.clearOutUncompletedRoutes({
-          pages: pages,
-          components: components
-        }, submissionData);
+        _helpers.default.clearOutUncompletedRoutes(formPagesAndComponents, submissionData);
       }
+
       // In case of hub-and-spoke if patchLabel has changed then
       // save name and value to variables for call to onSubmit hook
       var changedFieldName;

package/dist/utils/CheckYourAnswers/getCYARowsForCollectionPage.js

@@ -7,6 +7,7 @@ exports.default = void 0;
 var _copReactComponents = require("@ukhomeoffice/cop-react-components");
 var _models = require("../../models");
 var _addShowWhen = _interopRequireDefault(require("../Component/addShowWhen"));
+var _meetsAllConditions = _interopRequireDefault(require("../Condition/meetsAllConditions"));
 var _showFormPageCYA = _interopRequireDefault(require("../FormPage/showFormPageCYA"));
 var _getCYACollectionDeleteAction = _interopRequireDefault(require("./getCYACollectionDeleteAction"));
 var _getCYACollectionChangeAction = _interopRequireDefault(require("./getCYACollectionChangeAction"));
@@ -157,7 +158,7 @@ var getCYARowsForChildPages = function getCYARowsForChildPages(childPages, item,
         }
         var container = getContainerForPage(childPage, item, labelCount, fullPath);
         var rowChangeAction = getChangeActionForPage(childPage, onAction, activeIds);
-        var containerRows = (0, _getCYARowsForContainer.default)(childPage, container, item, rowChangeAction, fnOverride);
+        var containerRows = (0, _getCYARowsForContainer.default)(childPage, container, _objectSpread(_objectSpread({}, childPage.formData), item), rowChangeAction, fnOverride);
         rows = rows.concat(containerRows);
       }
     }
@@ -188,7 +189,8 @@ var getCYARowsForCollectionPage = function getCYARowsForCollectionPage(page, onA
     rows.push(getCollectionNameHeading(page, collectionName));
   }
   var itemIndex = 0;
-  if (page.collection.onlyShowActiveEntryOnCYA) {
+  var result = Array.isArray(page.collection.onlyShowActiveEntryOnCYA) ? (0, _meetsAllConditions.default)(page.collection.onlyShowActiveEntryOnCYA, data) : page.collection.onlyShowActiveEntryOnCYA;
+  if (result) {
     var activeEntry = collectionData.find(function (entry, index) {
       itemIndex = index;
       return entry.id === activeId;

package/dist/utils/CheckYourAnswers/getCYARowsForCollectionPage.test.js

@@ -170,6 +170,41 @@ describe('utils.CheckYourAnswers.getCYARowsForCollectionPage', function () {
       key: 'Test date'
     });
   });
+  it('should use values from top-level formData if they don\'t exist in the item', function () {
+    var FORM_DATA = {
+      testText: 'value',
+      collection: [{
+        id: '01'
+      }]
+    };
+    var PAGE = _objectSpread(_objectSpread({}, MASTER_PAGE), {}, {
+      childPages: [_objectSpread(_objectSpread({}, PAGES[0]), {}, {
+        formData: FORM_DATA
+      }), PAGES[1]],
+      formData: FORM_DATA
+    });
+    var ROWS = (0, _getCYARowsForCollectionPage.default)(PAGE, null, null, FORM_DATA);
+    expect(ROWS.length).toEqual(7); // Title row + component row for each item
+    expect(ROWS[0]).toMatchObject({
+      type: 'heading',
+      key: 'Collection'
+    });
+    expect(ROWS[1]).toMatchObject({
+      type: 'heading',
+      key: 'Collection entry 1'
+    });
+    expect(ROWS[2].action.label).toEqual('Change');
+    expect(ROWS[3].action.label).toEqual('custom remove label');
+    expect(ROWS[4].action.label).toEqual('custom change label');
+    expect(ROWS[5]).toMatchObject({
+      value: 'value',
+      key: 'Test text'
+    });
+    expect(ROWS[6]).toMatchObject({
+      value: '',
+      key: 'Test date'
+    });
+  });
   it('should return correctly formatted rows for only the active entry when page.collection.onlyShowActiveEntryOnCYA is defined', function () {
     var FORM_DATA = {
       collectionActiveId: '02',
@@ -209,6 +244,50 @@ describe('utils.CheckYourAnswers.getCYARowsForCollectionPage', function () {
       key: 'Test date'
     });
   });
+  it('should return correctly formatted rows for only the active entry when page.collection.onlyShowActiveEntryOnCYA is an array', function () {
+    var FORM_DATA = {
+      text: 'blue',
+      collectionActiveId: '02',
+      collection: [{
+        id: '01',
+        testText: 'value'
+      }, {
+        id: '02',
+        testText: 'value'
+      }]
+    };
+    var PAGE = _objectSpread(_objectSpread({}, MASTER_PAGE), {}, {
+      collection: _objectSpread(_objectSpread({}, MASTER_PAGE.collection), {}, {
+        onlyShowActiveEntryOnCYA: [{
+          field: 'text',
+          op: 'eq',
+          value: 'blue'
+        }]
+      }),
+      formData: FORM_DATA
+    });
+    var ROWS = (0, _getCYARowsForCollectionPage.default)(PAGE, null, null, FORM_DATA);
+    expect(ROWS.length).toEqual(7); // Title row + component row for only the active item.
+    expect(ROWS[0]).toMatchObject({
+      type: 'heading',
+      key: 'Collection'
+    });
+    expect(ROWS[1]).toMatchObject({
+      type: 'heading',
+      key: 'Collection entry 2'
+    });
+    expect(ROWS[2].action.label).toEqual('Change');
+    expect(ROWS[3].action.label).toEqual('custom remove label');
+    expect(ROWS[4].action.label).toEqual('custom change label');
+    expect(ROWS[5]).toMatchObject({
+      value: 'value',
+      key: 'Test text'
+    });
+    expect(ROWS[6]).toMatchObject({
+      value: '',
+      key: 'Test date'
+    });
+  });
   it('should exclude components that should not be shown', function () {
     var FD = {
       collection: [{

package/dist/utils/CheckYourAnswers/getComponentRowForCYA.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Answer = _interopRequireDefault(require("../../components/CheckYourAnswers/Answer"));
+var _SummaryListRow = _interopRequireDefault(require("../../components/SummaryList/SummaryListRow"));
+var _getCYARow = _interopRequireDefault(require("./getCYARow"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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); } // Local imports
+var getComponentRowForCYA = function getComponentRowForCYA(page, component, customClasses, entryData) {
+  var modifiedPage = _objectSpread(_objectSpread({}, page), {}, {
+    formData: _objectSpread(_objectSpread({}, page.formData), entryData)
+  });
+  var row = (0, _getCYARow.default)(modifiedPage, component);
+  return /*#__PURE__*/_react.default.createElement(_SummaryListRow.default, {
+    key: "".concat(row.fieldId),
+    row: {
+      key: row.key,
+      value: /*#__PURE__*/_react.default.createElement(_Answer.default, {
+        value: row.value,
+        component: row.component,
+        formData: modifiedPage.formData
+      }),
+      required: row.required
+    },
+    classes: customClasses
+  });
+};
+var _default = exports.default = getComponentRowForCYA;

package/dist/utils/CheckYourAnswers/getComponentRowForCYA.test.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _getCYARowsForPage = _interopRequireDefault(require("./getCYARowsForPage"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+describe('utils.CheckYourAnswers.getCYARowsForPage', function () {
+  var COMPONENT_A = {
+    type: 'text',
+    id: 'a',
+    fieldId: 'a',
+    label: 'Alpha'
+  };
+  var COMPONENT_B = {
+    type: 'text',
+    id: 'b',
+    fieldId: 'b',
+    label: 'Bravo'
+  };
+  var PAGE = {
+    id: 'page',
+    components: [COMPONENT_A, COMPONENT_B],
+    formData: {
+      a: 'Alpha Value',
+      b: 'Bravo Value'
+    }
+  };
+  var ON_ACTION = function ON_ACTION() {};
+  it('should get rows for a page with readonly text components', function () {
+    var rows = (0, _getCYARowsForPage.default)(PAGE, ON_ACTION);
+    expect(rows.length).toEqual(2);
+    expect(rows[0]).toEqual(expect.objectContaining({
+      fieldId: COMPONENT_A.fieldId,
+      key: COMPONENT_A.label,
+      value: 'Alpha Value'
+    }));
+    expect(rows[1]).toEqual(expect.objectContaining({
+      fieldId: COMPONENT_B.fieldId,
+      key: COMPONENT_B.label,
+      value: 'Bravo Value'
+    }));
+  });
+});

package/dist/utils/CollectionPage/addCollectionPageEntry.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+/* eslint-disable no-param-reassign */
 /**
  * This function effectively adds a new entry to a page collection by 
  * invalidating the current active ID for that collection.
@@ -15,7 +16,8 @@ exports.default = void 0;
  * @param {object} formData The top level formData object.
  */
 var addCollectionPageEntry = function addCollectionPageEntry(collectionName, formData) {
-  // eslint-disable-next-line no-param-reassign
-  formData["".concat(collectionName.split('.').pop(), "ActiveId")] = '0';
+  var fieldName = collectionName.split('.').pop();
+  formData["".concat(fieldName, "ActiveId")] = '0';
+  formData["".concat(fieldName, "NumberedIndex")] = Number(formData["".concat(fieldName, "ActiveId")]) + 1;
 };
 var _default = exports.default = addCollectionPageEntry;

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

@@ -13,4 +13,24 @@ describe('Utils.CollectionPage.addCollectionPageEntry', function () {
     (0, _addCollectionPageEntry.default)('parent.child.grandchild', FORM_DATA);
     expect(FORM_DATA.grandchildActiveId).toBeTruthy();
   });
+  it('should correctly set the active ID for a top-level collection', function () {
+    var FORM_DATA = {};
+    (0, _addCollectionPageEntry.default)('testCollection', FORM_DATA);
+    expect(FORM_DATA.testCollectionActiveId).toBe('0');
+  });
+  it('should correctly set the active ID for a nested collection', function () {
+    var FORM_DATA = {};
+    (0, _addCollectionPageEntry.default)('parent.child.grandchild', FORM_DATA);
+    expect(FORM_DATA.grandchildActiveId).toBe('0');
+  });
+  it('should correctly increment the numbered index for a top-level collection', function () {
+    var FORM_DATA = {};
+    (0, _addCollectionPageEntry.default)('testCollection', FORM_DATA);
+    expect(FORM_DATA.testCollectionNumberedIndex).toBe(1);
+  });
+  it('should correctly increment the numbered index for a nested collection', function () {
+    var FORM_DATA = {};
+    (0, _addCollectionPageEntry.default)('parent.child.grandchild', FORM_DATA);
+    expect(FORM_DATA.grandchildNumberedIndex).toBe(1);
+  });
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukhomeoffice/cop-react-form-renderer",
-  "version": "6.0.2-peter",
+  "version": "6.0.5-peter",
   "private": false,
   "scripts": {
     "clean": "rimraf dist",