@planning-inspectorate/dynamic-forms 3.3.4 → 3.4.0

package/.azure/pipelines/azure-pipelines-pr.yml

@@ -58,3 +58,7 @@ extends:
             parameters:
               nodeVersion: 22
               script: npm run test-coverage
+          - template: ../steps/node_script.yml
+            parameters:
+              nodeVersion: 22
+              script: npm run generate-types

package/.azure/pipelines/release.yml

@@ -46,6 +46,10 @@ jobs:
               parameters:
                 nodeVersion: 22
                 script: npm ci
+            - template: steps/node_script.yml@templates
+              parameters:
+                nodeVersion: 22
+                script: npm run generate-types
             - template: steps/node_script.yml@templates
               parameters:
                 nodeVersion: 22

package/README.md

@@ -146,7 +146,7 @@ to add conditions to questions in multiple ways.
 The simplest condition applies to just one question:
 
 ```javascript
-import { whenQuestionHasAnswer } from '@pins/dynamic-forms/src/components/utils/question-has-answer';
+import { whenQuestionHasAnswer } from '@planning-inspectorate/dynamic-forms';
 
 new Section('section-key', 'Section title')
         .addQuestion(questions.q1)
@@ -206,10 +206,12 @@ Email validation is provided through the `EmailValidator` class and `EmailQuesti
 #### Basic Usage
 
 ```javascript
-import { COMPONENT_TYPES } from '@planning-inspectorate/dynamic-forms/src/index.js';
-import { createQuestions } from '@planning-inspectorate/dynamic-forms/src/questions/create-questions.js';
-import { questionClasses } from '@planning-inspectorate/dynamic-forms/src/questions/questions.js';
-import EmailValidator from '@planning-inspectorate/dynamic-forms/src/validator/email-validator.js';
+import { 
+	COMPONENT_TYPES,
+    createQuestions,
+    questionClasses,
+    EmailValidator
+} from '@planning-inspectorate/dynamic-forms';
 
 // Define question configuration
 const questionProps = {
@@ -260,10 +262,12 @@ const businessEmailValidator = new EmailValidator({
 You can also configure a single line input with email-specific attributes:
 
 ```javascript
-import { COMPONENT_TYPES } from '@planning-inspectorate/dynamic-forms/src/index.js';
-import { createQuestions } from '@planning-inspectorate/dynamic-forms/src/questions/create-questions.js';
-import { questionClasses } from '@planning-inspectorate/dynamic-forms/src/questions/questions.js';
-import EmailValidator from '@planning-inspectorate/dynamic-forms/src/validator/email-validator.js';
+import {
+	COMPONENT_TYPES,
+	createQuestions,
+	questionClasses,
+	EmailValidator
+} from '@planning-inspectorate/dynamic-forms';
 
 const questionProps = {
     contactEmail: {
@@ -290,6 +294,13 @@ Commits must follow conventional commits, and the commit types will be used by s
 
 The package will be released automatically using semantic-release, on merge to main. This will include a git tag for the release, and publishing to NPM.
 
+### Type safety
+We use JSDocs to describe the types used. This is helpful for the JavaScript developers, and *crucial* for this project being compatible with TypeScript. Type declarations for TypeScript users are auto-generated by `tsc` to create type declarations. So please:
+1. Add JSDocs annotations to your code, use `@import` or an inline import, i.e. `@param {import('#section').Section} section`. Avoid a top-level import, e.g. `@typedef {import('../validator/base-validator.js')} BaseValidator` - this seems to create confusion when the compiler auto-generates the type declarations.
+2. Maintain `index.js`. If you're adding code that users of this module will import, please make it is being exported in `index.js`.
+
+Thank you for your co-operation and contributions!
+
 ### Tests
 
 There are some lightweight tests in the `test` directory which sets up a basic journey and checks the rendering for each question as well as redirect logic.

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "@planning-inspectorate/dynamic-forms",
-  "version": "3.3.4",
+  "version": "3.4.0",
   "description": "This package is for building GDS forms using a configuration-based approach.",
   "main": "./src/index.js",
   "type": "module",
+  "types": "./types/src/index.d.ts",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/Planning-Inspectorate/dynamic-forms.git"
@@ -13,6 +14,7 @@
     "lint": "npx eslint .",
     "format": "prettier --write .",
     "format-check": "prettier --check .",
+    "generate-types": "npx tsc --project tsconfig.json",
     "prepare": "node .husky/install.mjs",
     "test": "node --test",
     "test-coverage": "node --test --experimental-test-coverage"
@@ -26,9 +28,13 @@
   },
   "imports": {
     "#question-types": "./src/questions/question-types.d.ts",
-    "#src/*": "./src/*",
     "#test/*": "./test/*",
-    "#question": "./src/questions/question.js"
+    "#base-validator": "./src/validator/base-validator.js",
+    "#journey": "./src/journey/journey.js",
+    "#journey-response": "./src/journey/journey-response.js",
+    "#question": "./src/questions/question.js",
+    "#section": "./src/section.js",
+    "#src/*": "./src/*"
   },
   "devDependencies": {
     "@commitlint/cli": "^20.0.0",

package/src/components/address/question.js

@@ -5,15 +5,6 @@ import { Address } from '../../lib/address.js';
 import { nl2br } from '../../lib/utils.js';
 import AddressValidator from '../../validator/address-validator.js';
 
-/**
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../section.js').Section} Section
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('appeals-service-api').Api.SubmissionAddress} SubmissionAddress
-
- */
-
 export default class AddressQuestion extends Question {
 	/**
 	 * @param {import('#question-types').QuestionParameters} params
@@ -74,7 +65,7 @@ export default class AddressQuestion extends Question {
 	/**
 	 * Get the data to save from the request, returns an object of answers
 	 * @param {import('express').Request} req
-	 * @param {JourneyResponse} journeyResponse
+	 * @param {import('#journey-response').JourneyResponse} journeyResponse
 	 * @returns {Promise<{answers: Record<string, unknown>}>}
 	 */ //eslint-disable-next-line no-unused-vars -- journeyResponse kept for other questions to use
 	async getDataToSave(req, journeyResponse) {

package/src/components/boolean/question.js

@@ -44,7 +44,7 @@ export default class BooleanQuestion extends RadioQuestion {
 	 * @param {string} [params.html]
 	 * @param {string} [params.interfaceType]
 	 * @param {Array.<import('../../questions/options-question.js').Option>} [params.options]
-	 * @param {Array.<import('../../questions/question.js').BaseValidator>} [params.validators]
+	 * @param {Array.<import('#base-validator').BaseValidator>} [params.validators]
 	 * @param {boolean} [params.editable]
 	 */
 	constructor({

package/src/components/checkbox/question.js

@@ -3,10 +3,6 @@ import questionUtils from '../utils/question-utils.js';
 
 const defaultOptionJoinString = ',';
 
-/**
- * @typedef {import('../../journey/journey.js').Journey} Journey
- */
-
 /**
  * @typedef ConditionalAnswerObject
  * @type {object}
@@ -24,7 +20,7 @@ export default class CheckboxQuestion extends OptionsQuestion {
 	 * @param {string} [params.pageTitle]
 	 * @param {string} [params.description]
 	 * @param {Array.<import('../../questions/options-question.js').Option>} params.options
-	 * @param {Array.<import('../../questions/question.js').BaseValidator>} [params.validators]
+	 * @param {Array.<import('#base-validator').BaseValidator>} [params.validators]
 	 */
 	constructor({ title, question, fieldName, url, pageTitle, description, options, validators }) {
 		super({
@@ -45,7 +41,7 @@ export default class CheckboxQuestion extends OptionsQuestion {
 	/**
 	 * returns the formatted answers values to be used to build task list elements
 	 * @param {string | ConditionalAnswerObject } answer will be a single value string, a comma-separated string representing multiple values (one of which may be a conditional) or a single ConditionalAnswerObject
-	 * @param {Journey} journey
+	 * @param {import('#journey').Journey} journey
 	 * @param {String} sectionSegment
 	 * @returns {Array.<Object>}
 	 */

package/src/components/date/question.js

@@ -1,13 +1,6 @@
 import { formatDateForDisplay, parseDateInput } from '../../lib/date-utils.js';
 import { Question } from '../../questions/question.js';
 
-/**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../../section').Section} Section
- */
-
 const DEFAULT_DATE_FORMAT = 'd MMMM yyyy';
 
 /**
@@ -29,7 +22,7 @@ export default class DateQuestion extends Question {
 	/**
 	 * Get the data to save from the request, returns an object of answers
 	 * @param {import('express').Request} req
-	 * @param {JourneyResponse} journeyResponse - current journey response, modified with the new answers
+	 * @param {import('#journey-response').JourneyResponse} journeyResponse - current journey response, modified with the new answers
 	 * @returns {Promise.<Object>}
 	 */ //eslint-disable-next-line no-unused-vars -- journeyResponse kept for other questions to use
 	async getDataToSave(req, journeyResponse) {

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

@@ -3,13 +3,6 @@ import { Question } from '#question';
 import { nl2br } from '../../lib/utils.js';
 import escape from 'escape-html';
 
-/**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../../section').Section} Section
- */
-
 const DEFAULT_DATE_FORMAT = 'HH:mm d MMMM yyyy';
 
 /**
@@ -38,7 +31,7 @@ export default class DatePeriodQuestion extends Question {
 	/**
 	 * Get the data to save from the request, returns an object of answers
 	 * @param {import('express').Request} req
-	 * @param {JourneyResponse} journeyResponse - current journey response, modified with the new answers
+	 * @param {import('#journey-response').JourneyResponse} journeyResponse - current journey response, modified with the new answers
 	 * @returns {Promise.<Object>}
 	 */ //eslint-disable-next-line no-unused-vars -- journeyResponse kept for other questions to use
 	async getDataToSave(req, journeyResponse) {

package/src/components/email/question.js

@@ -1,9 +1,9 @@
 import SingleLineInputQuestion from '../single-line-input/question.js';
 
 /**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
+ * @typedef {import('#question').QuestionViewModel} QuestionViewModel
+ * @typedef {import('#journey').Journey} Journey
+ * @typedef {import('#journey-response').JourneyResponse} JourneyResponse
  * @typedef {import('../../section').Section} Section
  * @typedef {import('../../validator/base-validator')} BaseValidator
  */
@@ -44,7 +44,7 @@ export default class EmailQuestion extends SingleLineInputQuestion {
 	 * Override formatAnswerForSummary to prevent capitalization of email addresses
 	 * Email addresses should remain in their original case (typically lowercase)
 	 * @param {string} sectionSegment
-	 * @param {import('../../journey/journey.js').Journey} journey
+	 * @param {import('#journey').Journey} journey
 	 * @param {string} answer
 	 * @returns {Array}
 	 */

package/src/components/multi-field-input/question.js

@@ -3,9 +3,9 @@ import escape from 'escape-html';
 import { nl2br } from '../../lib/utils.js';
 
 /**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
+ * @typedef {import('#question').QuestionViewModel} QuestionViewModel
+ * @typedef {import('#journey').Journey} Journey
+ * @typedef {import('#journey-response').JourneyResponse} JourneyResponse
  * @typedef {import('../../section').Section} Section
  * @typedef {import('../../validator/base-validator')} BaseValidator
  */

package/src/components/multi-field-input/question.test.js

@@ -1,7 +1,7 @@
 import { describe, it } from 'node:test';
 import assert from 'node:assert';
 import MultiFieldInputQuestion from './question.js';
-import { Journey } from '../../journey/journey.js';
+import { Journey } from '#journey';
 
 const TITLE = 'title';
 const QUESTION = 'Question?';

package/src/components/number-entry/question.js

@@ -1,10 +1,6 @@
 import { Question } from '#question';
 import { getPersistedNumberAnswer } from '../utils/persisted-number-answer.js';
 
-/**
- * @typedef {import('../../journey/journey.js').Journey} Journey
- */
-
 export default class NumberEntryQuestion extends Question {
 	/**
 	 * @param {import('#question-types').QuestionParameters} params
@@ -36,7 +32,7 @@ export default class NumberEntryQuestion extends Question {
 	/**
 	 * returns the formatted answers values to be used to build task list elements
 	 * @param {Object} answer
-	 * @param {Journey} journey
+	 * @param {import('#journey').Journey} journey
 	 * @param {String} sectionSegment
 	 * @returns {Array<{
 	 *   key: string;

package/src/components/radio/question.js

@@ -15,7 +15,7 @@ export default class RadioQuestion extends OptionsQuestion {
 	 * @param {string} [params.html]
 	 * @param {string} [params.legend] - optional legend, used instead of h1
 	 * @param {Array.<import('../../questions/options-question.js').Option>} params.options
-	 * @param {Array.<import('../../questions/question.js').BaseValidator>} [params.validators]
+	 * @param {Array.<import('#base-validator').BaseValidator>} [params.validators]
 	 * @param {boolean} [params.editable]
 	 * @param {Object<string, any>} [params.viewData]
 	 * @param {import('../../questions/question-types.js').ActionLink} [params.actionLink]

package/src/components/select/question.js

@@ -16,7 +16,7 @@ export default class SelectQuestion extends OptionsQuestion {
 	 * @param {string} [params.legend] - optional legend, used instead of h1
 	 * @param {Array.<import('../../questions/options-question.js').Option>} params.options
 	 * @param {Object<string, any>} [params.viewData]
-	 * @param {Array.<import('../../questions/question.js').BaseValidator>} [params.validators]
+	 * @param {Array.<import('#base-validator').BaseValidator>} [params.validators]
 	 */
 	constructor({
 		title,

package/src/components/single-line-input/question.js

@@ -1,13 +1,5 @@
 import { Question } from '#question';
 
-/**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../../section').Section} Section
- * @typedef {import('../../validator/base-validator')} BaseValidator
- */
-
 /**
  * @class
  */

package/src/components/text-entry/question.js

@@ -1,9 +1,9 @@
 import { Question } from '#question';
 /**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../../section').Section} Section
+ * @import {QuestionViewModel} from '#question'
+ * @import {Journey} from '#journey'
+ * @import {JourneyResponse} from '#journey-response'
+ * @import {Section} from '#section'
  */
 
 /**

package/src/components/text-entry-redact/question.js

@@ -1,21 +1,6 @@
 import { Question } from '#question';
 import { nl2br } from '../../lib/utils.js';
 
-/**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../../section').Section} Section
- */
-
-/**
- * @typedef {Object} TextEntryCheckbox
- * @property {string} header
- * @property {string} text
- * @property {string} name
- * @property {string} [errorMessage]
- */
-
 export const REDACT_CHARACTER = '█';
 export const TRUNCATED_MAX_LENGTH = 500;
 
@@ -25,7 +10,7 @@ export const TRUNCATED_MAX_LENGTH = 500;
 export default class TextEntryRedactQuestion extends Question {
 	/**
 	 * @param {import('#question-types').QuestionParameters} params
-	 * @param {TextEntryCheckbox} [params.textEntryCheckbox]
+	 * @param {import('../text-entry/question.js').TextEntryCheckbox} [params.textEntryCheckbox]
 	 * @param {string|undefined} [params.label] if defined this show as a label for the input and the question will just be a standard h1
 	 * @param {boolean} [params.onlyShowRedactedValueForSummary] whether to only show redacted value for summary
 	 * @param {boolean} [params.useRedactedFieldNameForSave] whether to use the redacted field name when saving answers
@@ -57,6 +42,11 @@ export default class TextEntryRedactQuestion extends Question {
 		this.shouldTruncateSummary = shouldTruncateSummary;
 	}
 
+	/**
+	 * @param {import('express').Request} req
+	 * @param {import('#journey-response').JourneyResponse} journeyResponse
+	 * @returns {Promise<{answers: Record<string, unknown>}>}
+	 */
 	async getDataToSave(req, journeyResponse) {
 		if (this.useRedactedFieldNameForSave) {
 			const fieldName = this.fieldName + 'Redacted';

package/src/components/unit-option-entry/question.js

@@ -4,13 +4,6 @@ import { conditionalIsJustHTML } from '../utils/question-utils.js';
 
 const defaultOptionJoinString = ',';
 
-/**
- * @typedef {import('../../questions/question.js').QuestionViewModel} QuestionViewModel
- * @typedef {import('../../journey/journey.js').Journey} Journey
- * @typedef {import('../../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../../section').Section} Section
- */
-
 /**
  * UnitOptions are the options displayed in the radio format - in this case the value
  * represents the unit.
@@ -67,13 +60,13 @@ export default class UnitOptionEntryQuestion extends Question {
 
 	/**
 	 * gets the view model for this question
-	 * @param {Section} section - the current section
-	 * @param {Journey} journey - the journey we are in
+	 * @param {import('../../section').Section} section - the current section
+	 * @param {import('#journey').Journey} journey - the journey we are in
 	 * @param {Record<string, unknown>} [customViewData] additional data to send to view
 	 * @param {Record<string, unknown>} [payload]
 	 * @param {import('#src/questions/question-types.d.ts').PrepQuestionForRenderingOptions} options
-	 * @returns {QuestionViewModel & {
-	 *   question: QuestionViewModel['question'] & {
+	 * @returns {import('#question').QuestionViewModel & {
+	 *   question: import('#question').QuestionViewModel['question'] & {
 	 *     options:UnitOption[]
 	 *   }
 	 * }}

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

@@ -0,0 +1,18 @@
+export const COMPONENT_TYPES = Object.freeze({
+	CHECKBOX: 'checkbox',
+	BOOLEAN: 'boolean',
+	RADIO: 'radio',
+	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',
+	MULTI_FIELD_INPUT: 'multi-field-input',
+	NUMBER: 'number',
+	ADDRESS: 'site-address',
+	UNIT_OPTION: 'unit-option',
+	EMAIL: 'email',
+	MANAGE_LIST: 'manage-list'
+});

package/src/index.js

@@ -1,25 +1,72 @@
-/**
- * @typedef {import('./questions/question-props.js').QuestionTypes} QuestionTypes
- */
-
-/**
- * @type {Readonly<{CHECKBOX: QuestionTypes, BOOLEAN: QuestionTypes, RADIO: QuestionTypes, DATE: QuestionTypes, DATE_PERIOD: QuestionTypes, TEXT_ENTRY: QuestionTypes, TEXT_ENTRY_REDACT: QuestionTypes, SELECT: QuestionTypes, SINGLE_LINE_INPUT: QuestionTypes, MULTI_FIELD_INPUT: QuestionTypes, NUMBER: QuestionTypes, ADDRESS: QuestionTypes, UNIT_OPTION: QuestionTypes, EMAIL: QuestionTypes, MANAGE_LIST: QuestionTypes}>}
- */
-export const COMPONENT_TYPES = Object.freeze({
-	CHECKBOX: 'checkbox',
-	BOOLEAN: 'boolean',
-	RADIO: 'radio',
-	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',
-	MULTI_FIELD_INPUT: 'multi-field-input',
-	NUMBER: 'number',
-	ADDRESS: 'site-address',
-	UNIT_OPTION: 'unit-option',
-	EMAIL: 'email',
-	MANAGE_LIST: 'manage-list'
-});
+// Components
+import AddressQuestion from './components/address/question.js';
+import DateValidator from './validator/date-validator.js';
+import EmailValidator from './validator/email-validator.js';
+import StringValidator from './validator/string-validator.js';
+
+export { AddressQuestion };
+export * from './components/boolean/question.js';
+export * from './components/checkbox/question.js';
+export * from './components/date/question.js';
+export * from './components/date-period/question.js';
+export * from './components/multi-field-input/question.js';
+export * from './components/number-entry/question.js';
+export * from './components/radio/question.js';
+export * from './components/select/question.js';
+export * from './components/single-line-input/question.js';
+export * from './components/text-entry/question.js';
+export * from './components/text-entry-redact/question.js';
+export * from './components/unit-option-entry/question.js';
+export * from './components/utils/persisted-number-answer.js';
+export * from './components/utils/question-has-answer.js';
+export * from './components/utils/question-utils.js';
+export * from './components/utils/component-types.js';
+
+// Controller
+export * from './controller.js';
+
+// Journey
+export { Journey } from './journey/journey.js';
+export { JourneyResponse } from './journey/journey-response.js';
+
+// lib
+export * from './lib/address.js';
+export * from './lib/address-utils.js';
+export * from './lib/date-utils.js';
+export * from './lib/session-answer-store.js';
+export * from './lib/utils.js';
+
+// middleware
+export * from './middleware/build-get-journey.js';
+export * from './middleware/redirect-to-unanswered-question.js';
+
+// Questions
+export { Question } from './questions/question.js';
+export { createQuestions } from './questions/create-questions.js';
+export * from './questions/options-question.js';
+export { questionClasses } from './questions/questions.js';
+
+// Section
+export { Section } from './section.js';
+
+// validators
+export * from './validator/address-validator.js';
+export * from './validator/base-validator.js';
+export * from './validator/conditional-required-validator.js';
+export * from './validator/confirmation-checkbox-validator.js';
+export * from './validator/coordinates-validator.js';
+export * from './validator/date-period-validator.js';
+export * from './validator/date-time-validator.js';
+export { DateValidator };
+export { EmailValidator };
+export * from './validator/document-upload-validator.js';
+export * from './validator/multi-field-input-validator.js';
+export * from './validator/numeric-validator.js';
+export { default as RequiredValidator } from './validator/required-validator.js';
+export * from './validator/same-answer-validator.js';
+export { StringValidator };
+export * from './validator/unit-option-entry-validator.js';
+export * from './validator/valid-option-validator.js';
+export * from './validator/validation-error-handler.js';
+export { default as validate } from './validator/validator.js';
+export * from './validator/validator.js';

package/src/middleware/redirect-to-unanswered-question.test.js

@@ -5,7 +5,7 @@ import { redirectToUnansweredQuestion } from './redirect-to-unanswered-question.
 import { JourneyResponse } from '../journey/journey-response.js';
 import { Journey } from '../journey/journey.js';
 import { Section } from '../section.js';
-import { COMPONENT_TYPES } from '../index.js';
+import { COMPONENT_TYPES } from '../components/utils/component-types.js';
 import { questionHasAnswer } from '../components/utils/question-has-answer.js';
 
 describe('redirectToUnansweredQuestion Middleware', () => {

package/src/questions/options-question.js

@@ -5,13 +5,6 @@ import { getConditionalFieldName } from '../components/utils/question-utils.js';
 
 const defaultOptionJoinString = ',';
 
-/**
- * @typedef {import('./question').QuestionViewModel} QuestionViewModel
- * @typedef {import('../journey/journey.js').Journey} Journey
- * @typedef {import('../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../section.js').Section} Section
- */
-
 /**
  * @typedef {{
  *   text: string;
@@ -37,7 +30,7 @@ const defaultOptionJoinString = ',';
  */
 
 /**
- * @typedef {QuestionViewModel & { question: { options: Option[] } }} OptionsViewModel
+ * @typedef {import('./question').QuestionViewModel & { question: { options: Option[] } }} OptionsViewModel
  */
 
 export default class OptionsQuestion extends Question {
@@ -65,12 +58,12 @@ export default class OptionsQuestion extends Question {
 
 	/**
 	 * gets the view model for this question
-	 * @param {Section} section - the current section
-	 * @param {Journey} journey - the journey we are in
+	 * @param {import('#section').Section} section - the current section
+	 * @param {import('#journey').Journey} journey - the journey we are in
 	 * @param {Record<string, unknown>} [customViewData] additional data to send to view
 	 * @param {Record<string, unknown>} [payload]
 	 * @param {import('#src/questions/question-types.d.ts').PrepQuestionForRenderingOptions} options
-	 * @returns {QuestionViewModel}
+	 * @returns {import('./question').QuestionViewModel} QuestionViewModel
 	 */
 	prepQuestionForRendering(section, journey, customViewData, payload, options) {
 		const viewModel = super.prepQuestionForRendering(section, journey, customViewData, payload, options);
@@ -125,7 +118,7 @@ export default class OptionsQuestion extends Question {
 	/**
 	 * Get the data to save from the request, returns an object of answers
 	 * @param {import('express').Request} req
-	 * @param {JourneyResponse} journeyResponse - current journey response, modified with the new answers
+	 * @param {import('../journey/journey-response.js').JourneyResponse} journeyResponse - current journey response, modified with the new answers
 	 * @returns {Promise<{ answers: Record<string, unknown> }>}
 	 */ //eslint-disable-next-line no-unused-vars -- journeyResponse kept for other questions to use
 	async getDataToSave(req, journeyResponse) {

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

@@ -1,7 +1,7 @@
-import BaseValidator from '../validator/base-validator';
-import { JourneyResponse } from '../journey/journey-response';
 import { RouteParams } from '#src/journey/journey-types.d.ts';
 import ManageListQuestion from '#src/components/manage-list/question.js';
+import BaseValidator from '../validator/base-validator.js';
+import { JourneyResponse } from '../journey/journey-response.js';
 
 export interface QuestionParameters {
 	title: string;
@@ -22,7 +22,7 @@ export interface QuestionParameters {
 	// override the action link for this question
 	actionLink?: ActionLink;
 	// static view data for this question
-	viewData?: Object<string, any>;
+	viewData?: Record<string, any>;
 }
 
 export interface ActionLink {

package/src/questions/question.js

@@ -6,12 +6,12 @@ import MultiFieldInputValidator from '../validator/multi-field-input-validator.j
 import { answerObjectForManageList } from '#src/components/manage-list/utils.js';
 
 /**
- * @typedef {import('../validator/base-validator.js')} BaseValidator
- * @typedef {import('../journey/journey.js').Journey} Journey
- * @typedef {import('../journey/journey-response.js').JourneyResponse} JourneyResponse
- * @typedef {import('../section.js').Section} Section
- * @typedef {import('../controller.js').ActionView} ActionView
- * @typedef {import('./question-types.js').ActionLink} ActionLink
+ * @import {BaseValidator} from "#base-validator"
+ * @import {Journey} from "#journey"
+ * @import {JourneyResponse} from "#journey-response"
+ * @import {Section} from "#section"
+ * @import {ActionView} from "../controller.js"
+ * @import {ActionLink} from "./question-types.js"
  */
 
 /**