@ukhomeoffice/cop-react-form-renderer 4.35.0 → 4.36.1

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

@@ -4,6 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 var parentComponents = ['radios'];
 
 var cleanHiddenNestedData = function cleanHiddenNestedData(patch, page) {
@@ -17,6 +24,15 @@ var cleanHiddenNestedData = function cleanHiddenNestedData(patch, page) {
       delete patch[id];
     });
   });
+
+  if (page.collection && patch[page.collection.name]) {
+    patch[page.collection.name] = patch[page.collection.name].map(function (entry) {
+      return cleanHiddenNestedData(entry, _objectSpread(_objectSpread({}, page), {}, {
+        collection: undefined
+      }));
+    });
+  }
+
   return patch;
 };
 

package/dist/components/FormRenderer/helpers/cleanHiddenNestedData.test.js

@@ -44,6 +44,51 @@ describe('components', function () {
           expect(updatedPatch['nested1']).toBeFalsy();
           expect(updatedPatch['nested2']).toBeTruthy();
         });
+        it('remove data corresponding to hidden nested components within a collection', function () {
+          var patch = {
+            collectionName: [{
+              parent: 'option1',
+              nested1: 'should be included',
+              nested2: 'should not be included'
+            }, {
+              parent: 'option2',
+              nested1: 'should not be included',
+              nested2: 'should be included'
+            }]
+          };
+          var page = {
+            id: 'page',
+            name: 'page',
+            title: 'Page',
+            collection: {
+              name: 'collectionName'
+            },
+            components: [{
+              id: 'parent',
+              type: 'radios',
+              data: {
+                options: [{
+                  value: 'option1',
+                  nested: [{
+                    id: 'nested1',
+                    fieldId: 'nested1'
+                  }]
+                }, {
+                  value: 'option2',
+                  nested: [{
+                    id: 'nested2',
+                    fieldId: 'nested2'
+                  }]
+                }]
+              }
+            }]
+          };
+          var updatedPatch = (0, _cleanHiddenNestedData.default)(patch, page);
+          expect(updatedPatch['collectionName'][0]['nested1']).toBeTruthy();
+          expect(updatedPatch['collectionName'][0]['nested2']).toBeFalsy();
+          expect(updatedPatch['collectionName'][1]['nested1']).toBeFalsy();
+          expect(updatedPatch['collectionName'][1]['nested2']).toBeTruthy();
+        });
       });
     });
   });

package/dist/models/ComponentTypes.js

@@ -17,6 +17,8 @@ var TYPE_FILE = 'file';
 var TYPE_HEADING = 'heading';
 var TYPE_HTML = 'html';
 var TYPE_INSET_TEXT = 'inset-text';
+var TYPE_LIST = 'list';
+var TYPE_PARAGRAPH = 'paragraph';
 var TYPE_PHONE_NUMBER = 'phone-number';
 var TYPE_RADIOS = 'radios';
 var TYPE_SELECT = 'select';
@@ -38,6 +40,8 @@ var ComponentTypes = {
   HEADING: TYPE_HEADING,
   HTML: TYPE_HTML,
   INSET_TEXT: TYPE_INSET_TEXT,
+  LIST: TYPE_LIST,
+  PARAGRAPH: TYPE_PARAGRAPH,
   PHONE_NUMBER: TYPE_PHONE_NUMBER,
   RADIOS: TYPE_RADIOS,
   SELECT: TYPE_SELECT,

package/dist/utils/Component/getComponent.js

@@ -23,14 +23,23 @@ var _wrapInFormGroup = _interopRequireDefault(require("./wrapInFormGroup"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
+var LIST_CLASS = 'govuk-list';
+var BODY_CLASS = 'govuk-body';
 /** 
  * Separate function for each component type for the sake of
  * code clarity - having the additional bits and pieces in the
  * switch statement increases the cyclomatic complexity and
  * makes it much harder to follow what's going on.
  */
+
 var getAlert = function getAlert(config) {
   var attrs = (0, _cleanAttributes.default)(config);
 
@@ -118,6 +127,36 @@ var getInsetText = function getInsetText(config) {
   return /*#__PURE__*/_react.default.createElement(_copReactComponents.InsetText, attrs, config.content);
 };
 
+var getList = function getList(config) {
+  var _attrs$items;
+
+  var attrs = (0, _cleanAttributes.default)(config);
+  var tagName = attrs.ordered ? 'ol' : 'ul';
+  var bullet = attrs.ordered ? 'number' : 'bullet';
+
+  var classes = _copReactComponents.Utils.classBuilder(LIST_CLASS, bullet);
+
+  var content = (_attrs$items = attrs.items) === null || _attrs$items === void 0 ? void 0 : _attrs$items.map(function (item) {
+    return "<li>".concat(item, "</li>");
+  }).join('');
+  return getHTML(_objectSpread(_objectSpread({}, attrs), {}, {
+    className: classes(),
+    tagName: tagName,
+    content: content,
+    type: _models.ComponentTypes.HTML
+  }));
+};
+
+var getParagraph = function getParagraph(config) {
+  var attrs = (0, _cleanAttributes.default)(config);
+  return getHTML(_objectSpread(_objectSpread({
+    className: BODY_CLASS
+  }, attrs), {}, {
+    tagName: 'p',
+    type: _models.ComponentTypes.HTML
+  }));
+};
+
 var getRadios = function getRadios(config) {
   var options = [];
 
@@ -223,6 +262,12 @@ var getComponentByType = function getComponentByType(config) {
     case _models.ComponentTypes.ALERT:
       return getAlert(config);
 
+    case _models.ComponentTypes.PARAGRAPH:
+      return getParagraph(config);
+
+    case _models.ComponentTypes.LIST:
+      return getList(config);
+
     default:
       {
         return null;

package/dist/utils/Component/getComponentTests/getComponent.list.test.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+var _models = require("../../../models");
+
+var _getComponent = _interopRequireDefault(require("../getComponent"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Global imports
+// Local imports
+describe('utils.Component.get', function () {
+  it('should return a ul tag and correct className for an unordered list component', function () {
+    var ID = 'test-id';
+    var ITEMS = ['paragraph content1', 'paragraph content2'];
+    var COMPONENT = {
+      type: _models.ComponentTypes.LIST,
+      ordered: false,
+      items: ITEMS,
+      'data-testid': ID
+    };
+
+    var _render = (0, _react.render)((0, _getComponent.default)(COMPONENT)),
+        container = _render.container;
+
+    var ul = (0, _react.getByTestId)(container, ID);
+    expect(ul.innerHTML).toContain('<li>paragraph content1</li><li>paragraph content2</li>');
+    expect(ul.tagName).toEqual('UL');
+    expect(ul.className).toEqual('govuk-list govuk-list--bullet');
+  });
+  it('should return a ol tag and correct className for an ordered list component', function () {
+    var ID = 'test-id';
+    var ITEMS = ['paragraph content1', 'paragraph content2'];
+    var COMPONENT = {
+      type: _models.ComponentTypes.LIST,
+      ordered: true,
+      items: ITEMS,
+      'data-testid': ID
+    };
+
+    var _render2 = (0, _react.render)((0, _getComponent.default)(COMPONENT)),
+        container = _render2.container;
+
+    var ol = (0, _react.getByTestId)(container, ID);
+    expect(ol.innerHTML).toContain('<li>paragraph content1</li><li>paragraph content2</li>');
+    expect(ol.tagName).toEqual('OL');
+    expect(ol.className).toEqual('govuk-list govuk-list--number');
+  });
+});

package/dist/utils/Component/getComponentTests/getComponent.paragraph.test.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _react = require("@testing-library/react");
+
+var _models = require("../../../models");
+
+var _getComponent = _interopRequireDefault(require("../getComponent"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Global imports
+// Local imports
+describe('utils.Component.get', function () {
+  it('should return a p tag and correct className for a paragraph component', function () {
+    var ID = 'test-id';
+    var CONTENT = 'paragraph content';
+    var COMPONENT = {
+      type: _models.ComponentTypes.PARAGRAPH,
+      content: CONTENT,
+      'data-testid': ID
+    };
+
+    var _render = (0, _react.render)((0, _getComponent.default)(COMPONENT)),
+        container = _render.container;
+
+    var p = (0, _react.getByTestId)(container, ID);
+    expect(p.innerHTML).toContain(CONTENT);
+    expect(p.tagName).toEqual('P');
+    expect(p.className).toEqual('govuk-body');
+  });
+  it('should override default className for a paragraph component', function () {
+    var ID = 'test-id';
+    var CONTENT = 'paragraph content';
+    var COMPONENT = {
+      type: _models.ComponentTypes.PARAGRAPH,
+      content: CONTENT,
+      'data-testid': ID,
+      className: 'govuk-body highlight'
+    };
+
+    var _render2 = (0, _react.render)((0, _getComponent.default)(COMPONENT)),
+        container = _render2.container;
+
+    var p = (0, _react.getByTestId)(container, ID);
+    expect(p.innerHTML).toContain(CONTENT);
+    expect(p.tagName).toEqual('P');
+    expect(p.className).toEqual('govuk-body highlight');
+  });
+});

package/package.json

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