@planning-inspectorate/dynamic-forms 3.6.0 → 3.6.1

package/package.json

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

package/src/components/date-period/index.njk

@@ -33,6 +33,14 @@
                     }
                 }) }}
 
+                    {% if question.hint %}
+                        <div class="govuk-hint">{{ question.hint }}</div>
+                    {% endif %}
+
+                    {% if question.html %}
+                        {% include question.html ignore missing %}
+                    {% endif %}
+
                 {{ govukDateInput({
                     id: startFieldName,
                     fieldset: {
@@ -40,8 +48,8 @@
                             text: labels.start
                         }
                     },
-                    hint: question.hint and {
-                        text: question.hint
+                    hint: question.hintStart and {
+                        text: question.hintStart
                     },
                     errorMessage: errorSummary and {
                         text: errors[question.fieldName].msg or errors[startFieldName].msg or errors[startDayFieldName].msg or errors[startMonthFieldName].msg or errors[startYearFieldName].msg
@@ -78,8 +86,8 @@
                             text: labels.end
                         }
                     },
-                    hint: question.hint and {
-                        text: question.hint
+                    hint: question.hintEnd and {
+                       text: question.hintEnd
                     },
                     errorMessage: errorSummary and {
                         text: errors[question.fieldName].msg or errors[endFieldName].msg or errors[endDayFieldName].msg or errors[endMonthFieldName].msg or errors[endYearFieldName].msg

package/src/components/date-period/question.js

@@ -14,16 +14,22 @@ export default class DatePeriodQuestion extends Question {
 	 * @param {import('#question-types').QuestionParameters} params
 	 * @param {string} [params.dateFormat]
 	 * @param {{start: string, end: string}} [params.labels]
+	 * @param {string} [params.hint]
+	 * @param {string} [params.hintStart]
+	 * @param {string} [params.hintEnd]
 	 * @param {{hour: number, minute: number, second: number}} [params.startTime]
 	 * @param {{hour: number, minute: number, second: number}} [params.endTime]
 	 */
-	constructor({ dateFormat = DEFAULT_DATE_FORMAT, labels, startTime, endTime, ...params }) {
+	constructor({ dateFormat = DEFAULT_DATE_FORMAT, hint, labels, hintStart, startTime, hintEnd, endTime, ...params }) {
 		super({
 			...params,
 			viewFolder: 'date-period'
 		});
 		this.dateFormat = dateFormat;
 		this.labels = labels || { start: 'Start', end: 'End' };
+		this.hint = hint;
+		this.hintStart = hintStart;
+		this.hintEnd = hintEnd;
 		this.startTime = startTime || { hour: 0, minute: 0, second: 0 };
 		this.endTime = endTime || { hour: 0, minute: 0, second: 0 };
 	}

package/src/components/date-period/question.test.js

@@ -10,6 +10,8 @@ describe('DatePeriodQuestion', () => {
 	const FIELDNAME = 'fieldName';
 	const HINT = 'hint hint';
 	const VALIDATORS = [];
+	const HINTSTART = 'Start date hint';
+	const HINTEND = 'End date hint';
 
 	describe('constructor', () => {
 		it('should instantiate and inherit from Question', () => {
@@ -18,6 +20,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 			assert.strictEqual(dateQuestion instanceof DatePeriodQuestion, true);
@@ -33,6 +37,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 
@@ -63,6 +69,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS,
 				startTime: { hour: 3, minute: 24, second: 0 },
 				endTime: { hour: 23, minute: 59, second: 0 }
@@ -98,6 +106,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 
@@ -142,6 +152,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 
@@ -189,6 +201,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 
@@ -231,6 +245,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 
@@ -260,6 +276,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 
@@ -289,6 +307,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS,
 				labels: { start: 'Open', end: 'Close' }
 			});
@@ -320,6 +340,8 @@ describe('DatePeriodQuestion', () => {
 				question: QUESTION,
 				fieldName: FIELDNAME,
 				hint: HINT,
+				hintStart: HINTSTART,
+				hintEnd: HINTEND,
 				validators: VALIDATORS
 			});
 

package/test/snapshots/holiday-period.html

@@ -11,6 +11,8 @@
 </fieldset>
 
 
+
+
                 <div class="govuk-form-group">
   <fieldset class="govuk-fieldset" role="group">
     <legend class="govuk-fieldset__legend">

package/types/src/components/date-period/question.d.ts

@@ -7,12 +7,17 @@ export default class DatePeriodQuestion extends Question {
      * @param {import('#question-types').QuestionParameters} params
      * @param {string} [params.dateFormat]
      * @param {{start: string, end: string}} [params.labels]
+     * @param {string} [params.hint]
+     * @param {string} [params.hintStart]
+     * @param {string} [params.hintEnd]
      * @param {{hour: number, minute: number, second: number}} [params.startTime]
      * @param {{hour: number, minute: number, second: number}} [params.endTime]
      */
-    constructor({ dateFormat, labels, startTime, endTime, ...params }: import("#question-types").QuestionParameters);
+    constructor({ dateFormat, hint, labels, hintStart, startTime, hintEnd, endTime, ...params }: import("#question-types").QuestionParameters);
     dateFormat: any;
     labels: any;
+    hintStart: any;
+    hintEnd: any;
     startTime: any;
     endTime: any;
     /**

package/types/src/components/date-period/question.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"question.d.ts","sourceRoot":"","sources":["../../../../src/components/date-period/question.js"],"names":[],"mappings":"AAOA;;;GAGG;AACH;IACC;;;;;;OAMG;IACH,mEANW,OAAO,iBAAiB,EAAE,kBAAkB,EAetD;IAJA,gBAA4B;IAC5B,YAAsD;IACtD,eAA+D;IAC/D,aAA2D;IAG5D;;;;;OAKG,CACH,yCAHW,OAAO,mBAAmB,EAAE,eAAe,GACzC,OAAO,CAAE,MAAM,CAAC,CAgC5B;IAED;;MAuCC;CAuCD;yBAjJwB,WAAW"}
+{"version":3,"file":"question.d.ts","sourceRoot":"","sources":["../../../../src/components/date-period/question.js"],"names":[],"mappings":"AAOA;;;GAGG;AACH;IACC;;;;;;;;;OASG;IACH,6FATW,OAAO,iBAAiB,EAAE,kBAAkB,EAqBtD;IAPA,gBAA4B;IAC5B,YAAsD;IAEtD,eAA0B;IAC1B,aAAsB;IACtB,eAA+D;IAC/D,aAA2D;IAG5D;;;;;OAKG,CACH,yCAHW,OAAO,mBAAmB,EAAE,eAAe,GACzC,OAAO,CAAE,MAAM,CAAC,CAgC5B;IAED;;MAuCC;CAuCD;yBAvJwB,WAAW"}