@ukhomeoffice/cop-react-form-renderer 7.1.1-ipm-accessibility-gamma → 7.2.0-alpha

package/LICENCE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 UKHomeOffice
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/CheckYourAnswers/CheckYourAnswers.js

@@ -32,7 +32,6 @@ const DEFAULT_MARGIN_BOTTOM = exports.DEFAULT_MARGIN_BOTTOM = 9;
 const CheckYourAnswers = _ref => {
   let {
     title,
-    titleSize,
     pages: _pages,
     actions,
     onAction,
@@ -146,8 +145,7 @@ const CheckYourAnswers = _ref => {
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: DEFAULT_CLASS,
-    children: [title && !hide_title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.Heading, {
-      size: titleSize,
+    children: [title && !hide_title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.LargeHeading, {
       children: title
     }, 'heading'), errors && errors.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.ErrorSummary, {
       errors: getDedupedErrors()
@@ -227,7 +225,6 @@ CheckYourAnswers.propTypes = {
   })),
   summaryListClassModifiers: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
   title: _propTypes.default.string,
-  titleSize: _propTypes.default.string,
   type: _propTypes.default.string,
   hideBlankRows: _propTypes.default.bool,
   optionalFieldPlaceholder: _propTypes.default.string
@@ -243,7 +240,6 @@ CheckYourAnswers.defaultProps = {
   sections: [],
   summaryListClassModifiers: null,
   title: DEFAULT_TITLE,
-  titleSize: 'l',
   type: null,
   hideBlankRows: false,
   optionalFieldPlaceholder: null

package/dist/components/CheckYourAnswers/CheckYourAnswers.test.js

@@ -116,7 +116,7 @@ describe('components', () => {
       const cya = checkCYA(container);
       const [, cyaChildNode] = cya.childNodes;
       const names = cyaChildNode.childNodes[0];
-      expect(names.tagName).toEqual('DL');
+      expect(names.tagName).toEqual('DIV');
       expect(names.classList).toContain("govuk-!-margin-bottom-".concat(_CheckYourAnswers.DEFAULT_MARGIN_BOTTOM));
       const [firstName, surname] = names.childNodes;
       checkRow(firstName, 'First name', 'John', false);
@@ -134,7 +134,7 @@ describe('components', () => {
       const [,, title, cyaChildNode] = cya.childNodes;
       const civilServant = cyaChildNode.childNodes[0];
       expect(title.textContent).toEqual('Are you a civil servant?');
-      expect(civilServant.tagName).toEqual('DL');
+      expect(civilServant.tagName).toEqual('DIV');
       expect(civilServant.classList).toContain("govuk-!-margin-bottom-".concat(_CheckYourAnswers.DEFAULT_MARGIN_BOTTOM));
       const [status] = civilServant.childNodes;
       checkRow(status, 'Are you a civil servant?', 'Yes', true);
@@ -151,7 +151,7 @@ describe('components', () => {
       const cya = checkCYA(container);
       const [,, cyaChildNode] = cya.childNodes; // The title simply isn't returned
       const civilServant = cyaChildNode.childNodes[0];
-      expect(civilServant.tagName).toEqual('DL');
+      expect(civilServant.tagName).toEqual('DIV');
       expect(civilServant.classList).toContain("govuk-!-margin-bottom-0"); // Changed margin if no titles
       const [status] = civilServant.childNodes;
       checkRow(status, 'Are you a civil servant?', 'Yes', true);
@@ -184,7 +184,7 @@ describe('components', () => {
       expect(titleAction.classList).toContain('heading-action');
       expect(titleAction.textContent).toEqual("Change page details");
       const civilServant = cyaChildNode.childNodes[0];
-      expect(civilServant.tagName).toEqual('DL');
+      expect(civilServant.tagName).toEqual('DIV');
       const [status] = civilServant.childNodes;
       checkRow(status, 'Are you a civil servant?', 'Yes', false);
     });
@@ -231,7 +231,7 @@ describe('components', () => {
       expect(titleAction.classList).toContain('heading-action');
       expect(titleAction.textContent).toEqual("Change page details");
       const civilServant = cyaChildNode.childNodes[0];
-      expect(civilServant.tagName).toEqual('DL');
+      expect(civilServant.tagName).toEqual('DIV');
       const [status] = civilServant.childNodes;
       checkRow(status, 'Are you a civil servant?', 'Yes', false);
     });
@@ -247,7 +247,7 @@ describe('components', () => {
       const cya = checkCYA(container);
       const [cyaChildNode] = cya.childNodes;
       const names = cyaChildNode.childNodes[0];
-      expect(names.tagName).toEqual('DL');
+      expect(names.tagName).toEqual('DIV');
       expect(names.classList).toContain("govuk-!-margin-bottom-".concat(_CheckYourAnswers.DEFAULT_MARGIN_BOTTOM));
       const [firstName, surname] = names.childNodes;
       checkRow(firstName, 'First name', 'John', false);
@@ -502,7 +502,7 @@ describe('components', () => {
       const [, cyaTitle, cyaChildNode] = cya.childNodes;
       expect(cyaTitle.textContent).toEqual('Alpha ID: 123456789');
       const names = cyaChildNode.childNodes[0];
-      expect(names.tagName).toEqual('DL');
+      expect(names.tagName).toEqual('DIV');
       expect(names.classList).toContain("govuk-!-margin-bottom-".concat(_CheckYourAnswers.DEFAULT_MARGIN_BOTTOM));
       const [firstName, surname] = names.childNodes;
       const [label] = firstName.childNodes;
@@ -528,7 +528,7 @@ describe('components', () => {
       const cya = checkCYA(container);
       const [, cyaChildNode] = cya.childNodes;
       const names = cyaChildNode.childNodes[0];
-      expect(names.tagName).toEqual('DL');
+      expect(names.tagName).toEqual('DIV');
       expect(names.classList).toContain("govuk-!-margin-bottom-".concat(_CheckYourAnswers.DEFAULT_MARGIN_BOTTOM));
       const [firstName, surname] = names.childNodes;
       const [label] = firstName.childNodes;

package/dist/components/FormComponent/Container.js

@@ -71,12 +71,10 @@ const Container = _ref => {
   };
   const classes = _utils.default.classBuilder(DEFAULT_CLASS, [], container.className);
   const cleanedAttrs = _copReactComponents.Utils.cleanHtmlAttributes(attrs);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, cleanedAttrs), {}, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", _objectSpread(_objectSpread({}, cleanedAttrs), {}, {
     className: classes(),
     id: container.id,
-    children: [container.title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.MediumHeading, {
-      children: container.title
-    }), container.components && container.components.filter(shouldShow).map((component, index) => {
+    children: container.components && container.components.filter(shouldShow).map((component, index) => {
       const defaultValue = component.type === _models.ComponentTypes.FILE ? {} : '';
       const val = value ? value[component.fieldId] : defaultValue;
       const fullPath = "".concat(container.full_path || container.fieldId, ".").concat(component.fieldId);
@@ -91,7 +89,7 @@ const Container = _ref => {
         onChange: onComponentChange,
         onTopLevelChange: onTopLevelChange
       }), index);
-    })]
+    })
   }));
 };
 Container.propTypes = {
@@ -104,8 +102,7 @@ Container.propTypes = {
     fieldId: _propTypes.default.string,
     full_path: _propTypes.default.string,
     id: _propTypes.default.string,
-    readonly: _propTypes.default.bool,
-    title: _propTypes.default.string
+    readonly: _propTypes.default.bool
   }).isRequired,
   formData: _propTypes.default.shape({}),
   fullPath: _propTypes.default.string,

package/dist/components/FormComponent/Container.test.js

@@ -407,49 +407,4 @@ describe('components.FormComponent.Container', () => {
     expect(input2.id).toEqual("".concat(ID, ".").concat(TEXT_ID, "Two"));
     expect(input2.value).toEqual('blue');
   });
-  it('should render a container component appropriately with a title', async () => {
-    const CONTAINER = {
-      id: ID,
-      fieldId: ID,
-      title: "some title",
-      type: _models.ComponentTypes.CONTAINER,
-      components: [TEXT_COMPONENT]
-    };
-    const {
-      container
-    } = (0, _setupTests.renderWithValidation)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormComponent.default, {
-      component: CONTAINER,
-      value: FORM_DATA[ID],
-      formData: FORM_DATA
-    }));
-
-    // Check the container itself.
-    const c = container.childNodes[0];
-    expect(c.tagName).toEqual('DIV');
-    expect(c.classList).toContain(_Container.DEFAULT_CLASS);
-
-    // Check container header.
-    const containerHeader = c.childNodes[0];
-    expect(containerHeader.tagName).toEqual('H2');
-    expect(containerHeader.textContent).toEqual('some title');
-
-    // And now check the single text component within it.
-    const formGroup = c.childNodes[1];
-    expect(formGroup.tagName).toEqual('DIV');
-    expect(formGroup.classList).toContain('govuk-form-group');
-    const label = formGroup.childNodes[0];
-    expect(label.tagName).toEqual('LABEL');
-    expect(label.classList).toContain('govuk-label');
-    expect(label.textContent).toEqual("".concat(TEXT_COMPONENT.label, " (optional)"));
-    expect(label.getAttribute('for')).toEqual("".concat(ID, ".").concat(TEXT_ID));
-    const hint = formGroup.childNodes[1];
-    expect(hint.tagName).toEqual('DIV');
-    expect(hint.classList).toContain('govuk-hint');
-    expect(hint.textContent).toEqual(TEXT_COMPONENT.hint);
-    const input = formGroup.childNodes[2];
-    expect(input.tagName).toEqual('INPUT');
-    expect(input.classList).toContain('govuk-input');
-    expect(input.id).toEqual("".concat(ID, ".").concat(TEXT_ID));
-    expect(input.value).toEqual(TEXT_VALUE);
-  });
 });

package/dist/components/FormComponent/FormComponent.js

@@ -110,9 +110,6 @@ const FormComponent = _ref => {
       value: value || _utils.default.Component.defaultValue(component, formData),
       formData: formData
     }));
-    if (component.fieldset) {
-      container = (0, _wrapInFormGroup.default)(component, container);
-    }
     if (component.additionalValidation) {
       container = (0, _wrapInFormGroup.default)(_objectSpread(_objectSpread({}, component), (0, _helpers.getComponentError)(component, validation === null || validation === void 0 ? void 0 : validation.errors)), container);
     }
@@ -205,7 +202,6 @@ FormComponent.propTypes = {
     id: _propTypes.default.string,
     label: _propTypes.default.string,
     suffix: _propTypes.default.string,
-    fieldset: _propTypes.default.bool,
     type: _propTypes.default.string,
     pageCollection: _propTypes.default.shape({
       name: _propTypes.default.string

package/dist/components/FormComponent/FormComponent.test.js

@@ -366,70 +366,5 @@ describe('components', () => {
       _userEvent.default.upload(input, FILE);
       expect(ON_CHANGE_COUNT).toEqual(3);
     });
-    it('should render a text component appropriately when wrapped in a formGroups', async () => {
-      const ID = 'container';
-      const INNER_COMPONENT_ID = "text";
-      const VALUE = 'Text value';
-      const INNER_COMPONENT = {
-        id: INNER_COMPONENT_ID,
-        fieldId: INNER_COMPONENT_ID,
-        type: 'text',
-        label: 'Text component',
-        hint: 'Text hint',
-        value: VALUE
-      };
-      const COMPONENT = {
-        id: ID,
-        fieldId: ID,
-        type: 'container',
-        fieldset: true,
-        components: [INNER_COMPONENT]
-      };
-      const NESTED_VALUE = {
-        [INNER_COMPONENT_ID]: VALUE
-      };
-      const ON_CHANGE = () => {};
-      const {
-        container
-      } = (0, _setupTests.renderWithValidation)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormComponent.default, {
-        "data-testid": ID,
-        component: COMPONENT,
-        value: NESTED_VALUE,
-        onChange: ON_CHANGE
-      }));
-
-      // Form group
-      const formGroup = container.childNodes[0];
-      expect(formGroup.tagName).toEqual('DIV');
-      expect(formGroup.classList).toContain('govuk-form-group');
-      // FieldSet
-      const fieldSet = formGroup.childNodes[0];
-      expect(fieldSet.tagName).toEqual('FIELDSET');
-      expect(fieldSet.classList).toContain('govuk-fieldset');
-      // Form container
-      const formContainer = fieldSet.childNodes[0];
-      expect(formContainer.tagName).toEqual('DIV');
-      expect(formContainer.classList).toContain('hods-form-container');
-      // Form group for container
-      const formGroupForContainer = formContainer.childNodes[0];
-      expect(formGroupForContainer.tagName).toEqual('DIV');
-      expect(formGroupForContainer.classList).toContain('govuk-form-group');
-
-      // Nested component.
-      const label = formGroupForContainer.childNodes[0];
-      expect(label.tagName).toEqual('LABEL');
-      expect(label.classList).toContain('govuk-label');
-      expect(label.textContent).toEqual("".concat(INNER_COMPONENT.label, " (optional)"));
-      expect(label.getAttribute('for')).toEqual("".concat(ID, ".").concat(INNER_COMPONENT_ID));
-      const hint = formGroupForContainer.childNodes[1];
-      expect(hint.tagName).toEqual('DIV');
-      expect(hint.classList).toContain('govuk-hint');
-      expect(hint.textContent).toEqual(INNER_COMPONENT.hint);
-      const input = formGroupForContainer.childNodes[2];
-      expect(input.tagName).toEqual('INPUT');
-      expect(input.classList).toContain('govuk-input');
-      expect(input.id).toEqual("".concat(ID, ".").concat(INNER_COMPONENT_ID));
-      expect(input.value).toEqual(VALUE);
-    });
   });
 });

package/dist/components/FormPage/FormPage.js

@@ -115,8 +115,7 @@ const FormPage = _ref => {
     label: _utils.default.interpolateString(action.label, formPage.formData)
   }) : action);
   formPage.formData = _utils.default.Operate.runPageOperations(formPage, _objectSpread(_objectSpread({}, formPage.formData), patch), onWrapperChange || onPageChange);
-  const headingContent = page.title ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.Heading, {
-    size: page.titleSize,
+  const headingContent = page.title ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.LargeHeading, {
     children: _utils.default.FormPage.getTitle(page.title, page.formData)
   }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.Label, {
     id: page.id,
@@ -178,7 +177,6 @@ FormPage.propTypes = {
   page: _propTypes.default.shape({
     id: _propTypes.default.string.isRequired,
     title: _propTypes.default.string,
-    titleSize: _propTypes.default.string,
     components: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.shape({})])).isRequired,
     fieldset: _propTypes.default.bool,
     hideOptionalSuffix: _propTypes.default.bool,

package/dist/components/FormPage/FormPage.test.js

@@ -11,12 +11,10 @@ var _FormPage = _interopRequireWildcard(require("./FormPage"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-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(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } // Global imports
+// Global imports
+
 // Local imports
+
 describe('components.FormPage', () => {
   describe('FormPage', () => {
     const TEXT = {
@@ -339,63 +337,6 @@ describe('components.FormPage', () => {
       }));
       expect(ON_ACTION_CALLS.length).toEqual(0);
     });
-    it('Should render the page title correctly.', async () => {
-      const {
-        container,
-        getByRole
-      } = (0, _setupTests.renderWithValidation)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPage.default, {
-        page: PAGE_WITHOUT_CUSTOM_VALIDATION,
-        fromTarget: true,
-        onAction: ON_ACTION
-      }));
-      const heading = getByRole('heading', {
-        level: 1
-      });
-      const labels = container.querySelectorAll('label');
-      expect(labels).toHaveLength(1);
-      expect(labels[0]).toHaveTextContent('Text component');
-      expect(heading).toHaveTextContent('Page without Custom Validation');
-    });
-    it('Should render the page title correctly as a medium title', async () => {
-      const PAGE_WITH_TITLE_SIZE = _objectSpread(_objectSpread({}, PAGE_WITHOUT_CUSTOM_VALIDATION), {}, {
-        titleSize: 'm'
-      });
-      const {
-        container,
-        getByRole
-      } = (0, _setupTests.renderWithValidation)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPage.default, {
-        page: PAGE_WITH_TITLE_SIZE,
-        fromTarget: true,
-        onAction: ON_ACTION
-      }));
-      const heading = getByRole('heading', {
-        level: 2
-      });
-      const labels = container.querySelectorAll('label');
-      expect(labels).toHaveLength(1);
-      expect(labels[0]).toHaveTextContent('Text component');
-      expect(heading).toHaveTextContent('Page without Custom Validation');
-    });
-    it('Should render the label correctly.', async () => {
-      const PAGE_WITHOUT_CUSTOM_VALIDATION_WITH_LABEL = _objectSpread(_objectSpread({}, PAGE_WITHOUT_CUSTOM_VALIDATION), {}, {
-        label: 'Some label value'
-      });
-      delete PAGE_WITHOUT_CUSTOM_VALIDATION_WITH_LABEL.title;
-      const {
-        container,
-        queryByRole
-      } = (0, _setupTests.renderWithValidation)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPage.default, {
-        page: PAGE_WITHOUT_CUSTOM_VALIDATION_WITH_LABEL,
-        fromTarget: true,
-        onAction: ON_ACTION
-      }));
-      const labels = container.querySelectorAll('label');
-      const heading = queryByRole('heading');
-      expect(labels).toHaveLength(2);
-      expect(labels[0]).toHaveTextContent('Some label value');
-      expect(labels[1]).toHaveTextContent('Text component');
-      expect(heading).not.toBeInTheDocument();
-    });
     it('removed field from the form data when the value is set to null', () => {
       const AUTOCOMPLETE = {
         id: 'autocomplete',

package/dist/components/FormRenderer/FormRenderer.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = exports.DEFAULT_CLASS = void 0;
+var _copReactComponents = require("@ukhomeoffice/cop-react-components");
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _copReactComponents = require("@ukhomeoffice/cop-react-components");
 var _context = require("../../context");
 var _hooks = require("../../hooks");
 var _models = require("../../models");
@@ -37,7 +37,6 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 const FormRenderer = _ref => {
   let {
     title,
-    titleSize,
     type,
     cleanseHiddenData,
     components,
@@ -62,7 +61,6 @@ const FormRenderer = _ref => {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_context.ValidationContextProvider, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(InternalFormRenderer, {
         title: title,
-        titleSize: titleSize,
         type: type,
         cleanseHiddenData: cleanseHiddenData,
         components: components,
@@ -89,7 +87,6 @@ const InternalFormRenderer = _ref2 => {
   var _formState$page4, _formState$page$actio, _formState$cya$hideCh, _formState$cya$hideGr;
   let {
     title,
-    titleSize,
     type,
     cleanseHiddenData,
     components,
@@ -308,8 +305,7 @@ const InternalFormRenderer = _ref2 => {
     taskDetails = _objectWithoutProperties(hubDetails, _excluded);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: classes(),
-    children: [title && !hideTitle && pageId === _models.FormPages.HUB && /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.Heading, {
-      size: titleSize,
+    children: [title && !hideTitle && pageId === _models.FormPages.HUB && /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.LargeHeading, {
       children: title
     }), formState.cya && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckYourAnswers.default, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
       pages: _helpers.default.getRelevantPages(formState, pages, currentTask.fullPages)
@@ -386,7 +382,6 @@ const propTypes = {
   pages: _propTypes.default.arrayOf(_propTypes.default.shape({})).isRequired,
   summaryListClassModifiers: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
   title: _propTypes.default.string,
-  titleSize: _propTypes.default.string,
   cleanseHiddenData: _propTypes.default.bool,
   /** See <a href="/?path=/docs/f-json--page#formtypes">FormTypes</a>. */
   type: _propTypes.default.oneOf([_models.FormTypes.CYA, _models.FormTypes.FORM, _models.FormTypes.HUB, _models.FormTypes.TASK, _models.FormTypes.WIZARD, _models.FormTypes.TASK_CYA, _models.FormTypes.FORM_WITH_TASK]).isRequired,
@@ -413,7 +408,6 @@ const defaultProps = {
   noChangeAction: false,
   summaryListClassModifiers: [],
   title: '',
-  titleSize: 'l',
   cleanseHiddenData: false,
   viewOnly: true,
   hideBlankRows: false

package/dist/components/SummaryList/SummaryList.js

@@ -14,7 +14,7 @@ var _SummaryListHeadingRowWithAction = _interopRequireDefault(require("./Summary
 var _SummaryListTitleRow = _interopRequireDefault(require("./SummaryListTitleRow"));
 require("./SummaryList.scss");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["rows", "noChangeAction", "noGroupAction", "isGroup", "classBlock", "classModifiers", "className", "showGroupAction"]; // Global imports
+const _excluded = ["rows", "noChangeAction", "noGroupAction", "isGroup", "classBlock", "classModifiers", "className"]; // Global imports
 // Local imports
 // Styles
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -34,8 +34,7 @@ const SummaryList = _ref => {
       isGroup,
       classBlock,
       classModifiers,
-      className,
-      showGroupAction = true
+      className
     } = _ref,
     attrs = _objectWithoutProperties(_ref, _excluded);
   const classes = _copReactComponents.Utils.classBuilder(classBlock, classModifiers, className);
@@ -47,7 +46,7 @@ const SummaryList = _ref => {
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     className: "group-of-rows",
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("dl", _objectSpread(_objectSpread({}, cleanedHtmlAttrs), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({}, cleanedHtmlAttrs), {}, {
       className: classes(),
       children: [rows.map(row => {
         const key = "".concat(row.pageId, "_").concat(row.full_path || row.fieldId);
@@ -83,7 +82,7 @@ const SummaryList = _ref => {
           classes: classes,
           showAction: !noChangeAction
         }, key);
-      }).filter(r => !!r), showGroupAction && isGroup && !noGroupAction && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      }).filter(r => !!r), isGroup && !noGroupAction && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         className: "change-group-button",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_GroupAction.default, {
           group: groupActionRow
@@ -99,7 +98,6 @@ SummaryList.propTypes = {
   isGroup: _propTypes.default.bool,
   noChangeAction: _propTypes.default.bool,
   noGroupAction: _propTypes.default.bool,
-  showGroupAction: _propTypes.default.bool,
   rows: _propTypes.default.arrayOf(_propTypes.default.shape({
     pageId: _propTypes.default.string.isRequired,
     fieldId: _propTypes.default.string.isRequired,
@@ -120,7 +118,6 @@ SummaryList.defaultProps = {
   className: '',
   isGroup: false,
   noChangeAction: false,
-  noGroupAction: false,
-  showGroupAction: true
+  noGroupAction: false
 };
 var _default = exports.default = SummaryList;

package/dist/components/SummaryList/SummaryList.test.js

@@ -14,7 +14,7 @@ describe('components', () => {
   describe('SummaryList', () => {
     const checkSummaryList = (container, id) => {
       const summaryList = (0, _react.getByTestId)(container, id);
-      expect(summaryList.tagName).toEqual('DL');
+      expect(summaryList.tagName).toEqual('DIV');
       expect(summaryList.classList).toContain(_SummaryList.DEFAULT_CLASS);
       return summaryList;
     };
@@ -37,7 +37,7 @@ describe('components', () => {
     };
     const checkRow = (summaryList, index) => {
       const row = summaryList.childNodes[index];
-      expect(row.tagName).toEqual('DIV');
+      expect(row.tagName).toEqual('DL');
       expect(row.classList).toContain("".concat(_SummaryList.DEFAULT_CLASS, "__row"));
       const [key, value, actions] = row.childNodes;
       expect(key.tagName).toEqual('DT');
@@ -61,7 +61,7 @@ describe('components', () => {
     };
     const checkRowNoChangeActions = (summaryList, index) => {
       const row = summaryList.childNodes[index];
-      expect(row.tagName).toEqual('DIV');
+      expect(row.tagName).toEqual('DL');
       expect(row.classList).toContain("".concat(_SummaryList.DEFAULT_CLASS, "__row"));
       const [key, value] = row.childNodes;
       expect(key.tagName).toEqual('DT');
@@ -443,61 +443,6 @@ describe('components', () => {
         expect(valueDiv.tagName).toEqual('DIV');
         expect(valueDiv.textContent).toEqual(VALUES[index]);
       });
-      // Expect the group action to be rendered at the bottom of the summary.
-      const groupAction = summaryList.childNodes[ROWS.length].childNodes[0];
-      expect(groupAction.tagName).toEqual('A');
-      expect(groupAction.textContent).toEqual('action');
-    });
-    it('should render groups of rows correctly and no render the group action', () => {
-      const ID = 'test-id';
-      const VALUES = ['Alpha component value', 'Bravo component value', 'Charlie component value'];
-      const ISGROUP = true;
-      const ROWS = [{
-        key: 'a',
-        pageId: 'p1',
-        fieldId: 'a',
-        value: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          children: VALUES[0]
-        }),
-        action: {
-          label: 'action'
-        }
-      }, {
-        key: 'b',
-        pageId: 'p1',
-        fieldId: 'b',
-        value: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          children: VALUES[1]
-        })
-      }, {
-        key: 'c',
-        pageId: 'p1',
-        fieldId: 'c',
-        value: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          children: VALUES[2]
-        })
-      }];
-      const {
-        container
-      } = (0, _react.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_SummaryList.default, {
-        "data-testid": ID,
-        rows: ROWS,
-        isGroup: ISGROUP,
-        showGroupAction: false
-      }));
-      const summaryList = checkSummaryList(container, ID);
-      expect(summaryList.childNodes.length).toEqual(ROWS.length);
-      ROWS.forEach((row, index) => {
-        const [key, value] = checkRow(summaryList, index);
-        expect(key.textContent).toEqual("".concat(row.key, " (optional)"));
-        expect(value.childNodes.length).toEqual(1);
-        const valueDiv = value.childNodes[0];
-        expect(valueDiv.tagName).toEqual('DIV');
-        expect(valueDiv.textContent).toEqual(VALUES[index]);
-      });
-      // Expect the group action to not be rendered.
-      const groupAction = summaryList.childNodes[ROWS.length];
-      expect(groupAction).toBeUndefined();
     });
   });
 });

package/dist/components/SummaryList/SummaryListRow.js

@@ -19,7 +19,7 @@ const SummaryListRow = _ref => {
     classes,
     showAction
   } = _ref;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("dl", {
     className: classes('row'),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("dt", {
       className: classes('key'),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukhomeoffice/cop-react-form-renderer",
-  "version": "7.1.1-ipm-accessibility-gamma",
+  "version": "7.2.0-alpha",
   "private": false,
   "scripts": {
     "build-storybook": "storybook build",
@@ -18,7 +18,7 @@
     "yalc-publish": "yarn compile-with-maps && cp -r src dist/src && yalc publish --push"
   },
   "dependencies": {
-    "@ukhomeoffice/cop-react-components": "5.1.0-ipm-accessibility-alpha",
+    "@ukhomeoffice/cop-react-components": "5.1.0",
     "axios": "0.30.0",
     "dayjs": "^1.11.0",
     "govuk-frontend": "5.10.2",