@planning-inspectorate/dynamic-forms 3.6.2 → 3.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@planning-inspectorate/dynamic-forms",
-  "version": "3.6.2",
+  "version": "3.7.0",
   "description": "This package is for building GDS forms using a configuration-based approach.",
   "main": "./src/index.js",
   "type": "module",

package/src/components/task-list/index.njk

@@ -29,9 +29,9 @@
     <div class="govuk-grid-row">
         <div class="govuk-grid-column-full">
             {% if summaryListData.sections | length > 1 %}
-                {{ multiTaskList(summaryListData.sections, journeyComplete, beforeSubmitButton) }}
+                {{ multiTaskList(summaryListData.sections, journeyComplete, beforeSubmitButton, submitButtonText) }}
             {% elif summaryListData.sections | length == 1 %}
-                {{ singleTaskList(summaryListData.sections | first, journeyComplete, beforeSubmitButton) }}
+                {{ singleTaskList(summaryListData.sections | first, journeyComplete, beforeSubmitButton, submitButtonText) }}
             {% endif %}
         </div>
     </div>

package/src/components/task-list/task-list-multi-section.njk

@@ -2,7 +2,7 @@
 {% from "govuk/components/tag/macro.njk" import govukTag %}
 {% from "govuk/components/button/macro.njk" import govukButton %}
 
-{% macro multiTaskList(sections, journeyComplete, beforeSubmitButton) %}
+{% macro multiTaskList(sections, journeyComplete, beforeSubmitButton, submitButtonText) %}
     <ol class="app-task-list">
         {% for section in sections %}
             <li class="govuk-body govuk-!-margin-bottom-9">
@@ -46,7 +46,7 @@
                         <form action method="post">
                             <input type="hidden" name="_csrf" value="{{_csrf}}">
                             {{ govukButton({
-                                text: "Accept & Submit",
+                                text: submitButtonText | default("Accept & Submit", true),
                                 type: "submit"
                             }) }}
                         </form>

package/src/components/task-list/task-list-single-section.njk

@@ -3,7 +3,7 @@
 {% from "govuk/components/button/macro.njk" import govukButton %}
 {% from "govuk/components/warning-text/macro.njk" import govukWarningText %}
 
-{% macro singleTaskList(section, journeyComplete, beforeSubmitButton) %}
+{% macro singleTaskList(section, journeyComplete, beforeSubmitButton, submitButtonText) %}
     {% if section.list.rows.length %}
         {{ govukSummaryList(section.list) }}
     {% endif %}
@@ -15,7 +15,7 @@
         <form action method="post">
             <input type="hidden" name="_csrf" value="{{_csrf}}">
             {{ govukButton({
-                text: "Accept & Submit",
+                text: submitButtonText | default("Accept & Submit", true),
                 type: "submit"
             }) }}
         </form>

package/src/components/utils/component-types.js

@@ -1,18 +1,18 @@
 export const COMPONENT_TYPES = Object.freeze({
-	CHECKBOX: 'checkbox',
+	ADDRESS: 'site-address',
 	BOOLEAN: 'boolean',
-	RADIO: 'radio',
+	CHECKBOX: 'checkbox',
 	DATE: 'date',
 	DATE_PERIOD: 'date-period',
 	DATE_TIME: 'date-time',
-	TEXT_ENTRY: 'text-entry',
-	TEXT_ENTRY_REDACT: 'text-entry-redact',
-	SELECT: 'select',
-	SINGLE_LINE_INPUT: 'single-line-input',
+	EMAIL: 'email',
+	MANAGE_LIST: 'manage-list',
 	MULTI_FIELD_INPUT: 'multi-field-input',
 	NUMBER: 'number',
-	ADDRESS: 'site-address',
-	UNIT_OPTION: 'unit-option',
-	EMAIL: 'email',
-	MANAGE_LIST: 'manage-list'
+	RADIO: 'radio',
+	SELECT: 'select',
+	SINGLE_LINE_INPUT: 'single-line-input',
+	TEXT_ENTRY: 'text-entry',
+	TEXT_ENTRY_REDACT: 'text-entry-redact',
+	UNIT_OPTION: 'unit-option'
 });

package/src/questions/question-props.d.ts

@@ -1,40 +1,27 @@
 import { DocType } from '@pins/common/src/document-types';
-import { JourneyResponse } from '../journey/journey-response';
-import BaseValidator from '../validator/base-validator';
+import { QuestionParameters } from '#question-types';
 
 type QuestionTypes =
-	| 'checkbox'
-	| 'multi-file-upload'
 	| 'boolean'
-	| 'radio'
+	| 'checkbox'
 	| 'date'
 	| 'date-period'
-	| 'text-entry'
-	| 'text-entry-redact'
-	| 'select'
-	| 'single-line-input'
+	| 'date-time'
+	| 'email'
+	| 'manage-list'
 	| 'multi-field-input'
 	| 'number'
+	| 'radio'
+	| 'select'
+	| 'single-line-input'
 	| 'site-address'
-	| 'unit-option'
-	| 'manage-list';
+	| 'text-entry'
+	| 'text-entry-redact'
+	| 'unit-option';
 
-interface CommonQuestionProps {
+type CommonQuestionProps = QuestionParameters & {
 	type: QuestionTypes;
-	title: string;
-	question: string;
-	viewFolder?: string;
-	fieldName: string;
-	url?: string;
-	pageTitle?: string;
-	description?: string;
-	label?: string;
-	validators?: BaseValidator[];
-	html?: string;
-	hint?: string;
-	shouldDisplay?: (response: JourneyResponse) => boolean;
-	autocomplete?: string;
-}
+};
 
 type Option =
 	| {
@@ -92,24 +79,14 @@ interface UnitOption {
 	};
 }
 
-type CheckboxQuestionProps = CommonQuestionProps & {
-	type: 'checkbox';
-	options: Option[];
-};
-
-type MultiFileUploadQuestionProps = CommonQuestionProps & {
-	type: 'multi-file-upload';
-	documentType: DocType;
-};
-
 type BooleanQuestionProps = CommonQuestionProps & {
 	type: 'boolean';
 	options?: Option[];
 	interfaceType?: 'checkbox' | 'radio';
 };
 
-type RadioQuestionProps = CommonQuestionProps & {
-	type: 'radio';
+type CheckboxQuestionProps = CommonQuestionProps & {
+	type: 'checkbox';
 	options: Option[];
 };
 
@@ -117,51 +94,86 @@ type DateQuestionProps = CommonQuestionProps & {
 	type: 'date';
 };
 
-type TextEntryQuestionProps = CommonQuestionProps & {
-	type: 'text-entry';
-	label?: string;
+type DatePeriodQuestionProps = CommonQuestionProps & {
+	type: 'date-period';
 };
 
-type SingleLineInputQuestionProps = CommonQuestionProps & {
-	type: 'single-line-input';
-	label?: string;
-	inputAttributes?: Record<string, string>;
+type DateTimeQuestionProps = CommonQuestionProps & {
+	type: 'date-time';
+};
+
+type ManageListQuestionProps = CommonQuestionProps & {
+	type: 'manage-list';
+};
+
+type EmailQuestionProps = CommonQuestionProps & {
+	type: 'email';
 };
 
 type MultiFieldInputQuestionProps = CommonQuestionProps & {
 	type: 'multi-field-input';
-	label?: string;
 	inputAttributes?: Record<string, string>;
 	inputFields: InputField[];
 	formatType?: 'contactDetails' | 'standard';
 };
 
+type MultiFileUploadQuestionProps = CommonQuestionProps & {
+	type: 'multi-file-upload';
+	documentType: DocType;
+};
+
 type NumberEntryQuestionProps = CommonQuestionProps & {
 	type: 'number';
-	label?: string;
 	suffix?: string;
 };
 
+type RadioQuestionProps = CommonQuestionProps & {
+	type: 'radio';
+	options: Option[];
+};
+
+type SelectQuestionProps = CommonQuestionProps & {
+	type: 'select';
+	options: Option[];
+};
+
+type SingleLineInputQuestionProps = CommonQuestionProps & {
+	type: 'single-line-input';
+	inputAttributes?: Record<string, string>;
+};
+
 type SiteAddressQuestionProps = CommonQuestionProps & {
 	type: 'site-address';
 };
 
+type TextEntryQuestionProps = CommonQuestionProps & {
+	type: 'text-entry';
+};
+
+type TextEntryRedactQuestionProps = CommonQuestionProps & {
+	type: 'text-entry-redact';
+};
+
 type UnitOptionEntryQuestionProps = CommonQuestionProps & {
 	type: 'unit-option';
 	conditionalFieldName: string;
 	options: UnitOption[];
-	label?: string;
 };
 
 export type QuestionProps =
-	| CheckboxQuestionProps
-	| MultiFileUploadQuestionProps
 	| BooleanQuestionProps
-	| RadioQuestionProps
+	| CheckboxQuestionProps
 	| DateQuestionProps
-	| TextEntryQuestionProps
-	| SingleLineInputQuestionProps
+	| DatePeriodQuestionProps
+	| DateTimeQuestionProps
+	| ManageListQuestionProps
+	| EmailQuestionProps
 	| MultiFieldInputQuestionProps
 	| NumberEntryQuestionProps
+	| RadioQuestionProps
+	| SelectQuestionProps
+	| SingleLineInputQuestionProps
 	| SiteAddressQuestionProps
+	| TextEntryQuestionProps
+	| TextEntryRedactQuestionProps
 	| UnitOptionEntryQuestionProps;

package/types/src/components/utils/component-types.d.ts

@@ -1,19 +1,19 @@
 export const COMPONENT_TYPES: Readonly<{
-    CHECKBOX: "checkbox";
+    ADDRESS: "site-address";
     BOOLEAN: "boolean";
-    RADIO: "radio";
+    CHECKBOX: "checkbox";
     DATE: "date";
     DATE_PERIOD: "date-period";
     DATE_TIME: "date-time";
-    TEXT_ENTRY: "text-entry";
-    TEXT_ENTRY_REDACT: "text-entry-redact";
-    SELECT: "select";
-    SINGLE_LINE_INPUT: "single-line-input";
+    EMAIL: "email";
+    MANAGE_LIST: "manage-list";
     MULTI_FIELD_INPUT: "multi-field-input";
     NUMBER: "number";
-    ADDRESS: "site-address";
+    RADIO: "radio";
+    SELECT: "select";
+    SINGLE_LINE_INPUT: "single-line-input";
+    TEXT_ENTRY: "text-entry";
+    TEXT_ENTRY_REDACT: "text-entry-redact";
     UNIT_OPTION: "unit-option";
-    EMAIL: "email";
-    MANAGE_LIST: "manage-list";
 }>;
 //# sourceMappingURL=component-types.d.ts.map