@ukhomeoffice/cop-react-form-renderer 7.1.1-ipm-accessibility → 7.1.1-ipm-accessibility-beta

package/dist/components/CheckYourAnswers/CheckYourAnswers.js

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

package/dist/components/FormPage/FormPage.js

@@ -11,7 +11,6 @@ var _hooks = require("../../hooks");
 var _utils = _interopRequireDefault(require("../../utils"));
 var _FormComponent = _interopRequireDefault(require("../FormComponent"));
 var _PageActions = _interopRequireDefault(require("../PageActions"));
-var _FormPageHeader = _interopRequireDefault(require("./FormPageHeader"));
 require("./FormPage.scss");
 var _validateOnPageLoad = require("../../utils/Validate/validateOnPageLoad");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -116,8 +115,8 @@ 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)(_FormPageHeader.default, {
-    titleSize: page.titleSize,
+  const headingContent = page.title ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.Heading, {
+    size: page.titleSize,
     children: _utils.default.FormPage.getTitle(page.title, page.formData)
   }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.Label, {
     id: page.id,

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,6 +37,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 const FormRenderer = _ref => {
   let {
     title,
+    titleSize,
     type,
     cleanseHiddenData,
     components,
@@ -61,6 +62,7 @@ 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,
@@ -87,6 +89,7 @@ const InternalFormRenderer = _ref2 => {
   var _formState$page4, _formState$page$actio, _formState$cya$hideCh, _formState$cya$hideGr;
   let {
     title,
+    titleSize,
     type,
     cleanseHiddenData,
     components,
@@ -305,7 +308,8 @@ 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.LargeHeading, {
+    children: [title && !hideTitle && pageId === _models.FormPages.HUB && /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.Heading, {
+      size: titleSize,
       children: title
     }), formState.cya && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckYourAnswers.default, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
       pages: _helpers.default.getRelevantPages(formState, pages, currentTask.fullPages)
@@ -382,6 +386,7 @@ 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,
@@ -408,6 +413,7 @@ const defaultProps = {
   noChangeAction: false,
   summaryListClassModifiers: [],
   title: '',
+  titleSize: 'l',
   cleanseHiddenData: false,
   viewOnly: true,
   hideBlankRows: false

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ukhomeoffice/cop-react-form-renderer",
-  "version": "7.1.1-ipm-accessibility",
+  "version": "7.1.1-ipm-accessibility-beta",
   "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",
+    "@ukhomeoffice/cop-react-components": "5.1.0-ipm-accessibility",
     "axios": "0.30.0",
     "dayjs": "^1.11.0",
     "govuk-frontend": "5.10.2",

package/dist/components/FormPage/FormPageHeader.js

@@ -1,54 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _copReactComponents = require("@ukhomeoffice/cop-react-components");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-// Global imports
-
-const FormPageHeader = _ref => {
-  let {
-    titleSize,
-    children
-  } = _ref;
-  if (titleSize) {
-    const titleLowerCase = titleSize.toLowerCase();
-    switch (titleLowerCase) {
-      case "l":
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.LargeHeading, {
-          children: children
-        });
-      case "m":
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.MediumHeading, {
-          children: children
-        });
-      case "s":
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.SmallHeading, {
-          children: children
-        });
-      default:
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.LargeHeading, {
-          children: children
-        });
-    }
-  }
-
-  // Default title size consistent with old behaviour.
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_copReactComponents.LargeHeading, {
-    children: children
-  });
-};
-FormPageHeader.propTypes = {
-  children: _propTypes.default.node,
-  titleSize: _propTypes.default.string
-};
-FormPageHeader.defaultProps = {
-  children: null,
-  titleSize: null
-};
-var _default = exports.default = FormPageHeader;

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

@@ -1,74 +0,0 @@
-"use strict";
-
-var _react = _interopRequireDefault(require("react"));
-require("@testing-library/jest-dom");
-var _react2 = require("@testing-library/react");
-var _FormPageHeader = _interopRequireDefault(require("./FormPageHeader"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-// Global imports
-
-// Local imports
-
-describe('components.FormPageHeader', () => {
-  const PAGE_TITLE = "Page title";
-  it("Should render a large title", () => {
-    const {
-      getByRole
-    } = (0, _react2.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPageHeader.default, {
-      titleSize: "l",
-      children: PAGE_TITLE
-    }));
-    const heading = getByRole('heading', {
-      level: 1
-    });
-    expect(heading).toHaveTextContent(PAGE_TITLE);
-  });
-  it("Should render a large title with uppercase L", () => {
-    const {
-      getByRole
-    } = (0, _react2.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPageHeader.default, {
-      titleSize: "L",
-      children: PAGE_TITLE
-    }));
-    const heading = getByRole('heading', {
-      level: 1
-    });
-    expect(heading).toHaveTextContent(PAGE_TITLE);
-  });
-  it("Should render a medium title", () => {
-    const {
-      getByRole
-    } = (0, _react2.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPageHeader.default, {
-      titleSize: "m",
-      children: PAGE_TITLE
-    }));
-    const heading = getByRole('heading', {
-      level: 2
-    });
-    expect(heading).toHaveTextContent(PAGE_TITLE);
-  });
-  it("Should render a small title", () => {
-    const {
-      getByRole
-    } = (0, _react2.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPageHeader.default, {
-      titleSize: "s",
-      children: PAGE_TITLE
-    }));
-    const heading = getByRole('heading', {
-      level: 3
-    });
-    expect(heading).toHaveTextContent(PAGE_TITLE);
-  });
-  it("Should render a large title by default", () => {
-    const {
-      getByRole
-    } = (0, _react2.render)(/*#__PURE__*/(0, _jsxRuntime.jsx)(_FormPageHeader.default, {
-      children: PAGE_TITLE
-    }));
-    const heading = getByRole('heading', {
-      level: 1
-    });
-    expect(heading).toHaveTextContent(PAGE_TITLE);
-  });
-});