@ukhomeoffice/cop-react-form-renderer 0.1.0-beta → 1.0.0-gamma

package/dist/utils/Format/formatDataForPage.test.js

@@ -0,0 +1,96 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+var _models = require("../../models");
+
+var _formatDataForPage = _interopRequireWildcard(require("./formatDataForPage"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+// Local imports
+describe('utils', function () {
+  describe('Format', function () {
+    var setupField = function setupField(fieldId, format) {
+      return {
+        fieldId: fieldId,
+        format: format
+      };
+    };
+
+    describe('formatDataForPage', function () {
+      it('should appropriately format a page of components', function () {
+        var EVENT_TYPE = _models.EventTypes.SUBMIT;
+        var COMPONENTS = [setupField('alpha', {
+          type: 'lowercase',
+          on: _models.EventTypes.SUBMIT
+        }), // Should be formatted
+        setupField('bravo', null), // Nothing to format
+        setupField('charlie', {
+          type: 'uppercase',
+          on: _models.EventTypes.SUBMIT
+        }), // Should be formatted
+        setupField('delta', {
+          type: 'uppercase',
+          on: _models.EventTypes.BLUR
+        }) // Should not be formatted because of event type
+        ];
+        var DATA = {
+          alpha: 'AlPhA',
+          bravo: 'bRaVo',
+          charlie: 'CHArlie',
+          delta: 'deLTA'
+        };
+        var PAGE = {
+          components: COMPONENTS
+        };
+        (0, _formatDataForPage.default)(PAGE, DATA, EVENT_TYPE);
+        expect(DATA).toEqual({
+          alpha: 'alpha',
+          bravo: 'bRaVo',
+          charlie: 'CHARLIE',
+          delta: 'deLTA'
+        });
+      });
+    });
+    describe('formatDataForPages', function () {
+      it('should appropriately format multiple pages', function () {
+        var EVENT_TYPE = _models.EventTypes.SUBMIT;
+        var COMPONENTS = [setupField('alpha', {
+          type: 'lowercase',
+          on: _models.EventTypes.SUBMIT
+        }), // Should be formatted
+        setupField('bravo', null), // Nothing to format
+        setupField('charlie', {
+          type: 'uppercase',
+          on: _models.EventTypes.SUBMIT
+        }), // Should be formatted
+        setupField('delta', {
+          type: 'uppercase',
+          on: _models.EventTypes.BLUR
+        }) // Should not be formatted because of event type
+        ];
+        var DATA = {
+          alpha: 'AlPhA',
+          bravo: 'bRaVo',
+          charlie: 'CHArlie',
+          delta: 'deLTA'
+        };
+        var PAGES = [{
+          components: COMPONENTS.slice(0, 1)
+        }, {
+          components: COMPONENTS.slice(2)
+        }];
+        (0, _formatDataForPage.formatDataForPages)(PAGES, DATA, EVENT_TYPE);
+        expect(DATA).toEqual({
+          alpha: 'alpha',
+          bravo: 'bRaVo',
+          charlie: 'CHARLIE',
+          delta: 'deLTA'
+        });
+      });
+    });
+  });
+});

package/dist/utils/Format/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _formatData = _interopRequireDefault(require("./formatData"));
+
+var _formatDataForComponent = _interopRequireDefault(require("./formatDataForComponent"));
+
+var _formatDataForForm = _interopRequireDefault(require("./formatDataForForm"));
+
+var _formatDataForPage = _interopRequireDefault(require("./formatDataForPage"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Local imports
+var Format = {
+  component: _formatDataForComponent.default,
+  data: _formatData.default,
+  form: _formatDataForForm.default,
+  page: _formatDataForPage.default
+};
+var _default = Format;
+exports.default = _default;

package/dist/utils/Hub/getFormHub.js

@@ -5,21 +5,35 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _FormPage = _interopRequireDefault(require("../FormPage"));
-
 var _models = require("../../models");
 
+var _FormPage = _interopRequireDefault(require("../FormPage"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 // Local imports
-var getFormHub = function getFormHub(type, hub, components) {
+
+/**
+ * Gets a configuration object (or a string) for the hub.
+ * 
+ * @param {string} type The type of the form.
+ * @param {object} hub The configuration direct from the JSON.
+ * @param {Array} components The top-level form components.
+ * @param {object} formData The top-level form data.
+ * 
+ * @returns:
+ *  undefined if the form type is not "hub-and-spoke", or;
+ *  The string "CYA" if the CYA screen should be used, or;
+ *  A page configuration object if the CYA screen should not be used and components are defined.
+ */
+var getFormHub = function getFormHub(type, hub, components, formData) {
   if (type === _models.FormTypes.HUB && hub) {
     if (hub.format === _models.HubFormats.CYA) {
       return _models.HubFormats.CYA;
     }
 
     if (hub.components) {
-      return _FormPage.default.get(hub, components);
+      return _FormPage.default.get(hub, components, formData);
     }
   }
 

package/dist/utils/Hub/getFormHub.test.js

@@ -0,0 +1,96 @@
+"use strict";
+
+var _models = require("../../models");
+
+var _getFormHub = _interopRequireDefault(require("./getFormHub"));
+
+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); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { 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; }
+
+describe('utils', function () {
+  describe('Hub', function () {
+    describe('getFormHub', function () {
+      var FORM_COMPONENTS = [{
+        id: 'a',
+        fieldId: 'a',
+        label: 'Alpha',
+        type: 'text'
+      }, {
+        id: 'b',
+        fieldId: 'b',
+        label: 'Bravo',
+        type: 'text'
+      }, // eslint-disable-next-line no-template-curly-in-string
+      {
+        id: 'c',
+        fieldId: 'c',
+        label: 'Charlie',
+        type: 'radios',
+        data: {
+          url: '${urls.refData}/v3/charlies'
+        }
+      }];
+      var FORM_DATA = {
+        urls: {
+          refData: 'https://ho.gov.uk/ref-data/'
+        }
+      };
+      [_models.FormTypes.CYA, _models.FormTypes.FORM, _models.FormTypes.WIZARD].forEach(function (formType) {
+        describe("when the FormType is \"".concat(formType, "\""), function () {
+          it('should return undefined', function () {
+            expect((0, _getFormHub.default)(formType, {}, FORM_COMPONENTS, FORM_DATA)).toBeUndefined();
+          });
+        });
+      });
+      describe("when the FormType is \"".concat(_models.FormTypes.HUB, "\""), function () {
+        it('should return undefined when there is no hub', function () {
+          expect((0, _getFormHub.default)(_models.FormTypes.HUB, null, FORM_COMPONENTS, FORM_DATA)).toBeUndefined();
+        });
+        it("should return undefined when the format is not \"".concat(_models.HubFormats.CYA, "\" but hub also has no components"), function () {
+          expect((0, _getFormHub.default)(_models.FormTypes.HUB, {}, FORM_COMPONENTS, FORM_DATA)).toBeUndefined();
+        });
+        it("should return the string \"".concat(_models.HubFormats.CYA, "\" when the format is set to \"").concat(_models.HubFormats.CYA, "\""), function () {
+          var HUB = {
+            format: _models.HubFormats.CYA
+          };
+          expect((0, _getFormHub.default)(_models.FormTypes.HUB, HUB, FORM_COMPONENTS, FORM_DATA)).toEqual(_models.HubFormats.CYA);
+        });
+        it("should return an appropriate page when the format is not \"".concat(_models.HubFormats.CYA, "\" and hub contains components"), function () {
+          var HUB = {
+            title: 'Hub title',
+            components: ["Opening paragraph", {
+              type: 'heading',
+              size: 'l',
+              content: 'Hub heading'
+            }, "Closing paragraph", {
+              use: 'a'
+            }]
+          };
+          var A = FORM_COMPONENTS[0];
+          expect((0, _getFormHub.default)(_models.FormTypes.HUB, HUB, FORM_COMPONENTS, FORM_DATA)).toEqual({
+            title: HUB.title,
+            components: [{
+              type: 'html',
+              tagName: 'p',
+              content: HUB.components[0]
+            }, HUB.components[1], {
+              type: 'html',
+              tagName: 'p',
+              content: HUB.components[2]
+            }, _objectSpread(_objectSpread({
+              use: 'a'
+            }, A), {}, {
+              cya_label: A.label
+            })],
+            formData: FORM_DATA
+          });
+        });
+      });
+    });
+  });
+});

package/dist/utils/Hub/index.js

@@ -7,13 +7,10 @@ exports.default = void 0;
 
 var _getFormHub = _interopRequireDefault(require("./getFormHub"));
 
-var _models = require("../../models");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 // Local imports
 var Hub = {
-  formats: _models.HubFormats,
   get: _getFormHub.default
 };
 var _default = Hub;

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

@@ -27,7 +27,7 @@ describe('utils', function () {
         expect((0, _validatePage.default)([], {}).length).toEqual(0);
       });
       describe('when there is no form data', function () {
-        it('should return a single error when no components are required', function () {
+        it('should return no errors when no components are required', function () {
           var COMPONENTS = [setup('a', _models.ComponentTypes.TEXT, 'Alpha', false), setup('b', _models.ComponentTypes.TEXT, 'Bravo', false)];
           expect((0, _validatePage.default)(COMPONENTS, null).length).toEqual(0);
         });

package/dist/utils/index.js

@@ -13,6 +13,8 @@ var _Component = _interopRequireDefault(require("./Component"));
 
 var _Data = _interopRequireDefault(require("./Data"));
 
+var _Format = _interopRequireDefault(require("./Format"));
+
 var _FormPage = _interopRequireDefault(require("./FormPage"));
 
 var _Hub = _interopRequireDefault(require("./Hub"));
@@ -33,6 +35,7 @@ var Utils = _objectSpread({
   CheckYourAnswers: _CheckYourAnswers.default,
   Component: _Component.default,
   Data: _Data.default,
+  Format: _Format.default,
   FormPage: _FormPage.default,
   Hub: _Hub.default,
   meetsCondition: _meetsCondition.default,

package/package.json

@@ -1,19 +1,21 @@
 {
   "name": "@ukhomeoffice/cop-react-form-renderer",
-  "version": "0.1.0-beta",
+  "version": "1.0.0-gamma",
   "private": false,
   "scripts": {
     "clean": "rimraf dist",
     "test": "react-scripts test",
     "lint": "eslint --ext .js,.jsx src",
     "storybook:start": "start-storybook --docs --no-manager-cache -p 6007",
-    "storybook:build": "build-storybook --docs",
+    "storybook:build": "build-storybook --docs -s src/assets",
+    "storybook:deploy": "yarn deploy-storybook",
     "storybook": "yarn storybook:start",
+    "deploy-storybook": "storybook-to-ghpages -e storybook-static",
     "compile": "yarn clean && cross-env NODE_ENV=production babel src --out-dir dist --copy-files && yarn post-compile",
     "post-compile": "rimraf dist/**/*.test.* dist/**/*.stories.* dist/json dist/assets"
   },
   "dependencies": {
-    "@ukhomeoffice/cop-react-components": "^0.5.0",
+    "@ukhomeoffice/cop-react-components": "^0.6.0",
     "axios": "^0.21.1",
     "govuk-frontend": "^3.13.0",
     "web-vitals": "^1.0.1"
@@ -22,6 +24,7 @@
     "@babel/cli": "^7.15.4",
     "@babel/preset-env": "^7.15.6",
     "@babel/preset-react": "^7.14.5",
+    "@monaco-editor/react": "^4.3.1",
     "@storybook/addon-a11y": "^6.3.8",
     "@storybook/addon-actions": "^6.3.8",
     "@storybook/addon-docs": "^6.3.8",

package/dist/components/FormRenderer/helpers.js

@@ -1,66 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getPage = exports.getFormState = exports.getCYA = exports.canActionProceed = void 0;
-
-var _models = require("../../models");
-
-var _utils = _interopRequireDefault(require("../../utils"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-// Local imports
-var getCYA = function getCYA(pageId, hub) {
-  if (pageId === 'hub' && hub === _models.HubFormats.CYA) {
-    return {
-      title: ''
-    };
-  } else if (pageId === _models.HubFormats.CYA) {
-    return {};
-  }
-
-  return undefined;
-};
-
-exports.getCYA = getCYA;
-
-var getPage = function getPage(pageId, pages, hub) {
-  if (pageId) {
-    if (pageId === 'hub') {
-      return hub === _models.HubFormats.CYA ? undefined : hub;
-    }
-
-    return pages.find(function (p) {
-      return p.id === pageId;
-    });
-  }
-
-  return undefined;
-};
-
-exports.getPage = getPage;
-
-var getFormState = function getFormState(pageId, pages, hub) {
-  return {
-    pageId: pageId,
-    cya: getCYA(pageId, hub),
-    page: getPage(pageId, pages, hub)
-  };
-};
-
-exports.getFormState = getFormState;
-
-var canActionProceed = function canActionProceed(action, page, onError) {
-  if (action.validate) {
-    var errors = _utils.default.Validate.page(page.components, page.formData);
-
-    onError(errors);
-    return errors.length === 0;
-  }
-
-  return true;
-};
-
-exports.canActionProceed = canActionProceed;

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

@@ -1,158 +0,0 @@
-"use strict";
-
-var _helpers = require("./helpers");
-
-var _models = require("../../models");
-
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-describe('components', function () {
-  describe('FormRenderer', function () {
-    describe('helpers', function () {
-      var HUB = {
-        id: 'hub',
-        components: []
-      };
-      var PAGES = [{
-        id: 'alpha',
-        components: ['x']
-      }, {
-        id: 'bravo',
-        components: ['y', 'z']
-      }, HUB];
-      describe('getCYA', function () {
-        it('should give an empty object if the pageId is "CYA"', function () {
-          expect((0, _helpers.getCYA)(_models.HubFormats.CYA)).toEqual({});
-        });
-        it('should give an object with a blank title if the pageId is "hub" and the hub is the CYA', function () {
-          expect((0, _helpers.getCYA)('hub', _models.HubFormats.CYA)).toEqual({
-            title: ''
-          });
-        });
-        it('should give undefined if pageId is "hub" and the hub is NOT the CYA', function () {
-          expect((0, _helpers.getCYA)('hub', HUB)).toBeUndefined();
-        });
-        it('should give undefined if pageId is NOT "hub" and the hub is NOT the CYA', function () {
-          expect((0, _helpers.getCYA)('bob', HUB)).toBeUndefined();
-        });
-        it('should give undefined if pageId is NOT "hub" and the hub is the CYA', function () {
-          expect((0, _helpers.getCYA)('bob', _models.HubFormats.CYA)).toBeUndefined();
-        });
-      });
-      describe('getPage', function () {
-        it('should give undefined if the pageId is undefined', function () {
-          expect((0, _helpers.getPage)(undefined, PAGES, _models.HubFormats.CYA)).toBeUndefined();
-        });
-        it('should give undefined if the pageId is "hub" but the hub is the CYA', function () {
-          expect((0, _helpers.getPage)('hub', PAGES, _models.HubFormats.CYA)).toBeUndefined();
-        });
-        it('should give hub if the pageId is "hub" and the hub is NOT the CYA', function () {
-          expect((0, _helpers.getPage)('hub', PAGES, HUB)).toEqual(HUB);
-        });
-        it('should give find the appropriate page if the pageId is not "hub"', function () {
-          expect((0, _helpers.getPage)('alpha', PAGES, HUB)).toEqual({
-            id: 'alpha',
-            components: ['x']
-          });
-        });
-        it('should give undefined if the pageId is not "hub" and not found in the pages collection', function () {
-          expect((0, _helpers.getPage)('charlie', PAGES, HUB)).toBeUndefined();
-        });
-      });
-      describe('getFormState', function () {
-        it('should set up accordingly when viewing a hub that is the CYA', function () {
-          expect((0, _helpers.getFormState)('hub', PAGES, _models.HubFormats.CYA)).toEqual({
-            pageId: 'hub',
-            cya: {
-              title: ''
-            },
-            page: undefined
-          });
-        });
-        it('should set up accordingly when viewing a hub that is NOT the CYA', function () {
-          expect((0, _helpers.getFormState)('hub', PAGES, HUB)).toEqual({
-            pageId: 'hub',
-            cya: undefined,
-            page: HUB
-          });
-        });
-        it('should set up accordingly when viewing the CYA', function () {
-          expect((0, _helpers.getFormState)(_models.HubFormats.CYA, PAGES, HUB)).toEqual({
-            pageId: _models.HubFormats.CYA,
-            cya: {},
-            page: undefined
-          });
-        });
-        it('should set up accordingly when viewing a standard page', function () {
-          expect((0, _helpers.getFormState)('bravo', PAGES, HUB)).toEqual({
-            pageId: 'bravo',
-            cya: undefined,
-            page: {
-              id: 'bravo',
-              components: ['y', 'z']
-            }
-          });
-        });
-      });
-      describe('canActionProceed', function () {
-        it('should return true when the action does not require validation', function () {
-          var ACTION = {
-            validate: false
-          };
-          expect((0, _helpers.canActionProceed)(ACTION, {}, function () {})).toBeTruthy();
-        });
-        it('should return true when the page is valid', function () {
-          var ACTION = {
-            validate: true
-          };
-          var PAGE = {
-            components: [{
-              id: 'a',
-              fieldId: 'a',
-              label: 'Alpha',
-              required: true
-            }],
-            formData: {
-              a: 'Bravo'
-            }
-          };
-          expect((0, _helpers.canActionProceed)(ACTION, PAGE, function () {})).toBeTruthy();
-        });
-        it('should return false when the page is invalid and should have called the onErrors method appropriately', function () {
-          var ACTION = {
-            validate: true
-          };
-          var PAGE = {
-            components: [{
-              id: 'a',
-              fieldId: 'a',
-              label: 'Alpha',
-              required: true
-            }],
-            formData: {}
-          };
-          var ERRORS = [];
-
-          var ON_ERROR = function ON_ERROR(errors) {
-            ERRORS.push.apply(ERRORS, _toConsumableArray(errors));
-          };
-
-          expect((0, _helpers.canActionProceed)(ACTION, PAGE, ON_ERROR)).toBeFalsy();
-          expect(ERRORS.length).toEqual(1);
-          expect(ERRORS[0].id).toEqual('a');
-          expect(ERRORS[0].error).toEqual('Alpha is required');
-        });
-      });
-    });
-  });
-});