@hmcts/ccd-case-ui-toolkit 6.16.0-query-management-sorting-v1 → 6.16.0-query-management-write-view-v5

package/fesm2015/hmcts-ccd-case-ui-toolkit.js

@@ -5,7 +5,7 @@ import { CommonModule, DOCUMENT, CurrencyPipe, formatDate } from '@angular/commo
 import * as i1$1 from '@angular/router';
 import { RouterModule, NavigationStart, NavigationEnd } from '@angular/router';
 import * as i3 from '@angular/forms';
-import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormArray, FormGroup, FormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { NG_VALUE_ACCESSOR, NG_VALIDATORS, FormArray, FormGroup, FormControl, Validators, ReactiveFormsModule, FormsModule } from '@angular/forms';
 import polling from 'rx-polling';
 import { throwError, Subject, EMPTY, Observable, of, BehaviorSubject, timer, fromEvent, forkJoin } from 'rxjs';
 import * as i1$2 from '@angular/common/http';
@@ -28,8 +28,6 @@ import * as i6 from '@angular/material/core';
 import { MAT_DATE_LOCALE } from '@angular/material/core';
 import * as i3$1 from '@hmcts/ccpay-web-component';
 import { PaymentLibModule } from '@hmcts/ccpay-web-component';
-import * as i2$1 from 'rpx-xui-translation';
-import { RpxTranslationModule } from 'rpx-xui-translation';
 import * as i1$4 from '@angular/cdk/overlay';
 import { OverlayModule } from '@angular/cdk/overlay';
 import * as i7 from '@angular/cdk/tree';
@@ -47,6 +45,8 @@ import * as i1$5 from 'ngx-md';
 import { NgxMdModule } from 'ngx-md';
 import * as i12 from '@hmcts/media-viewer';
 import { MediaViewerModule } from '@hmcts/media-viewer';
+import * as i2$1 from 'rpx-xui-translation';
+import { RpxTranslationModule } from 'rpx-xui-translation';
 import * as i6$2 from '@angular/cdk/portal';
 import { ComponentPortal, PortalModule } from '@angular/cdk/portal';
 import * as i1$6 from 'ngx-pagination';
@@ -4367,6 +4367,7 @@ FormValidatorsService.ɵprov = i0.ɵɵdefineInjectable({ token: FormValidatorsSe
 class AbstractFormFieldComponent {
     constructor() {
         this.idPrefix = '';
+        this.caseReference = '';
     }
     id() {
         return this.idPrefix + this.caseField.id;
@@ -4425,7 +4426,7 @@ class AbstractFormFieldComponent {
     }
 }
 AbstractFormFieldComponent.ɵfac = function AbstractFormFieldComponent_Factory(t) { return new (t || AbstractFormFieldComponent)(); };
-AbstractFormFieldComponent.ɵdir = i0.ɵɵdefineDirective({ type: AbstractFormFieldComponent, inputs: { caseField: "caseField", formGroup: "formGroup", parent: "parent", idPrefix: "idPrefix" } });
+AbstractFormFieldComponent.ɵdir = i0.ɵɵdefineDirective({ type: AbstractFormFieldComponent, inputs: { caseField: "caseField", formGroup: "formGroup", parent: "parent", idPrefix: "idPrefix", caseReference: "caseReference" } });
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(AbstractFormFieldComponent, [{
         type: Directive
     }], null, { caseField: [{
@@ -4436,6 +4437,8 @@ AbstractFormFieldComponent.ɵdir = i0.ɵɵdefineDirective({ type: AbstractFormFi
             type: Input
         }], idPrefix: [{
             type: Input
+        }], caseReference: [{
+            type: Input
         }] }); })();
 
 class AbstractFieldWriteComponent extends AbstractFormFieldComponent {
@@ -10104,6 +10107,7 @@ var DisplayContextCustomParameter;
     DisplayContextCustomParameter["CaseFileView"] = "CaseFileView";
     DisplayContextCustomParameter["LinkedCases"] = "LinkedCases";
     DisplayContextCustomParameter["QueryManagement"] = "QueryManagement";
+    DisplayContextCustomParameter["QueryManagementWriteTest"] = "QueryManagementWriteTest";
 })(DisplayContextCustomParameter || (DisplayContextCustomParameter = {}));
 
 function CaseFileViewFieldComponent_div_0_Template(rf, ctx) { if (rf & 1) {
@@ -16879,6 +16883,16 @@ const ɵWritePhoneUKFieldComponent_BaseFactory = /*@__PURE__*/ i0.ɵɵgetInherit
             }]
     }], null, null); })();
 
+class QueryManagementUtils {
+    static extractCaseQueriesFromCaseField() {
+    }
+}
+QueryManagementUtils.ɵfac = function QueryManagementUtils_Factory(t) { return new (t || QueryManagementUtils)(); };
+QueryManagementUtils.ɵprov = i0.ɵɵdefineInjectable({ token: QueryManagementUtils, factory: QueryManagementUtils.ɵfac });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryManagementUtils, [{
+        type: Injectable
+    }], null, null); })();
+
 const partyMessagesMockData = [
     {
         partyName: 'John Smith - Appellant',
@@ -16889,7 +16903,15 @@ const partyMessagesMockData = [
                 subject: 'Review attached document',
                 name: 'Maggie Conroy',
                 body: 'Please review attached document and advise if hearing should proceed?',
-                attachments: [],
+                attachments: [
+                    {
+                        _links: {
+                            self: { href: '/' },
+                            binary: { href: '/' },
+                        },
+                        originalDocumentName: 'documentName.pdf',
+                    }
+                ],
                 isHearingRelated: true,
                 hearingDate: '10 Jan 2023',
                 createdOn: new Date(2023, 0, 3),
@@ -16991,44 +17013,50 @@ const partyMessagesMockData = [
     }
 ];
 
-class QueryCreateComponent {
-    constructor() {
-    }
-    ngOnInit() {
-    }
-}
-QueryCreateComponent.ɵfac = function QueryCreateComponent_Factory(t) { return new (t || QueryCreateComponent)(); };
-QueryCreateComponent.ɵcmp = i0.ɵɵdefineComponent({ type: QueryCreateComponent, selectors: [["ccd-query-create"]], decls: 0, vars: 0, template: function QueryCreateComponent_Template(rf, ctx) { }, encapsulation: 2 });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryCreateComponent, [{
-        type: Component,
-        args: [{
-                selector: 'ccd-query-create',
-                templateUrl: './query-create.component.html',
-            }]
-    }], function () { return []; }, null); })();
-
-class QueryDetailComponent {
-    constructor() {
+function ReadQueryManagementFieldComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "div", 1);
+    i0.ɵɵelement(2, "ccd-query-list", 2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const singlePartyMessageGroup_r1 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("partyMessageGroup", singlePartyMessageGroup_r1);
+} }
+class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
+    constructor(route) {
+        super();
+        this.route = route;
     }
     ngOnInit() {
+        if (this.context === PaletteContext.DEFAULT) {
+            // EUI-8303 Using mock data until CCD is ready with the API and data contract
+            this.partyMessagesGroups = partyMessagesMockData;
+            // TODO: Actual implementation once the CCD API and data contract is available
+            // Each parties will have a separate collection of party messages
+            // Find whether queries tab is available in the case data
+            const queriesTab = this.route.snapshot.data.case.tabs
+                .filter(tab => tab.fields && tab.fields
+                .some(caseField => caseField.id === 'QueryManagement'));
+            // Loop through the list of parties and their case queries collections
+            QueryManagementUtils.extractCaseQueriesFromCaseField();
+        }
     }
 }
-QueryDetailComponent.ɵfac = function QueryDetailComponent_Factory(t) { return new (t || QueryDetailComponent)(); };
-QueryDetailComponent.ɵcmp = i0.ɵɵdefineComponent({ type: QueryDetailComponent, selectors: [["ccd-query-detail"]], decls: 0, vars: 0, template: function QueryDetailComponent_Template(rf, ctx) { }, encapsulation: 2 });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryDetailComponent, [{
+ReadQueryManagementFieldComponent.ɵfac = function ReadQueryManagementFieldComponent_Factory(t) { return new (t || ReadQueryManagementFieldComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute)); };
+ReadQueryManagementFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: ReadQueryManagementFieldComponent, selectors: [["ccd-read-query-management-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [[4, "ngFor", "ngForOf"], [1, "govuk-!-margin-top-6", "govuk-!-margin-bottom-6"], [3, "partyMessageGroup"]], template: function ReadQueryManagementFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵtemplate(0, ReadQueryManagementFieldComponent_ng_container_0_Template, 3, 1, "ng-container", 0);
+    } if (rf & 2) {
+        i0.ɵɵproperty("ngForOf", ctx.partyMessagesGroups);
+    } }, encapsulation: 2 });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadQueryManagementFieldComponent, [{
         type: Component,
         args: [{
-                selector: 'ccd-query-detail',
-                templateUrl: './query-detail.component.html',
+                selector: 'ccd-read-query-management-field',
+                templateUrl: './read-query-management-field.component.html',
             }]
-    }], function () { return []; }, null); })();
-
-var SortOrder;
-(function (SortOrder) {
-    SortOrder[SortOrder["ASCENDING"] = 0] = "ASCENDING";
-    SortOrder[SortOrder["DESCENDING"] = 1] = "DESCENDING";
-    SortOrder[SortOrder["UNSORTED"] = 2] = "UNSORTED";
-})(SortOrder || (SortOrder = {}));
+    }], function () { return [{ type: i1$1.ActivatedRoute }]; }, null); })();
 
 class QueryListItem {
     constructor() {
@@ -17088,286 +17116,222 @@ var QueryListResponseStatus;
     QueryListResponseStatus["RESPONDED"] = "Responded";
 })(QueryListResponseStatus || (QueryListResponseStatus = {}));
 
-function QueryListComponent_ng_container_0_th_7_Template(rf, ctx) { if (rf & 1) {
-    const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "th", 8);
-    i0.ɵɵtext(1);
-    i0.ɵɵpipe(2, "rpxTranslate");
-    i0.ɵɵelementStart(3, "a", 9);
-    i0.ɵɵlistener("click", function QueryListComponent_ng_container_0_th_7_Template_a_click_3_listener() { i0.ɵɵrestoreView(_r5); const col_r3 = ctx.$implicit; const ctx_r4 = i0.ɵɵnextContext(2); return ctx_r4.sortTable(col_r3); });
+function WriteQueryManagementFieldComponent_p_28_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 24);
+    i0.ɵɵelementStart(1, "span", 25);
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
+    i0.ɵɵtext(4);
+    i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const col_r3 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 2, col_r3.displayName), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("innerHTML", ctx_r1.sortWidget(col_r3), i0.ɵɵsanitizeHtml);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "Error:"));
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(5, 4, "Enter a response message"), " ");
 } }
-function QueryListComponent_ng_container_0_tr_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 4);
-    i0.ɵɵelementStart(1, "td", 10);
-    i0.ɵɵelementStart(2, "a", 11);
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "td", 12);
-    i0.ɵɵtext(5);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "td", 12);
-    i0.ɵɵtext(7);
-    i0.ɵɵpipe(8, "date");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "td", 12);
-    i0.ɵɵtext(10);
-    i0.ɵɵpipe(11, "date");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "td", 12);
-    i0.ɵɵtext(13);
+function WriteQueryManagementFieldComponent_p_41_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 26);
+    i0.ɵɵelementStart(1, "span", 25);
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
+    i0.ɵɵtext(4);
+    i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const message_r6 = ctx.$implicit;
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(message_r6.subject);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(message_r6.lastSubmittedBy);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "Error:"));
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(8, 5, message_r6.lastSubmittedDate, "dd MMM YYYY"));
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(11, 8, message_r6.lastResponseDate, "dd MMM YYYY"));
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(message_r6.lastResponseBy);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(5, 4, "File error message"), " ");
 } }
-function QueryListComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "table", 1);
-    i0.ɵɵelementStart(2, "caption", 2);
-    i0.ɵɵelementStart(3, "div");
-    i0.ɵɵtext(4);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "thead", 3);
-    i0.ɵɵelementStart(6, "tr", 4);
-    i0.ɵɵtemplate(7, QueryListComponent_ng_container_0_th_7_Template, 4, 4, "th", 5);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "tbody", 6);
-    i0.ɵɵtemplate(9, QueryListComponent_ng_container_0_tr_9_Template, 14, 11, "tr", 7);
-    i0.ɵɵelementEnd();
+class WriteQueryManagementFieldComponent extends AbstractFieldWriteComponent {
+    constructor() {
+        super();
+        this.responseFormGroup = new FormGroup({
+            response: new FormControl('', Validators.required),
+            documents: new FormControl([], Validators.required)
+        });
+        this.queryItem = new QueryListItem();
+        Object.assign(this.queryItem, partyMessagesMockData[0].partyMessages[0]);
+    }
+}
+WriteQueryManagementFieldComponent.ɵfac = function WriteQueryManagementFieldComponent_Factory(t) { return new (t || WriteQueryManagementFieldComponent)(); };
+WriteQueryManagementFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: WriteQueryManagementFieldComponent, selectors: [["ccd-write-query-management-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 58, vars: 48, consts: [[1, "govuk-!-margin-top-6", "govuk-!-margin-bottom-6"], [1, "govuk-!-margin-bottom-2"], ["href", "javascript:void(0)", 1, "govuk-back-link"], [1, "govuk-!-margin-bottom-6"], [1, "govuk-caption-l", "govuk-!-margin-bottom-6"], [1, "govuk-heading-l", "govuk-!-margin-bottom-4"], [1, "govuk-!-margin-bottom-4"], [1, "govuk-body-l", "govuk-!-margin-bottom-0"], [3, "queryItem"], [1, "govuk-heading-m"], [3, "formGroup"], [1, "govuk-form-group", "response-textarea"], [1, "govuk-label-wrapper"], ["for", "query-response", 1, "govuk-label", "govuk-!-font-weight-bold"], ["id", "query-response-error", "class", "govuk-error-message", 4, "ngIf"], ["id", "query-response", "name", "query-response", "rows", "5", "aria-describedby", "query-response-hint query-response-error", 1, "govuk-textarea", 3, "formControlName"], [1, "govuk-form-group"], ["for", "add-documents", 1, "govuk-label"], [1, "govuk-!-font-weight-bold"], ["id", "add-documents-error", "class", "govuk-error-message", 4, "ngIf"], ["id", "add-documents", "name", "add-documents", "type", "file", 1, "govuk-file-upload"], ["data-module", "govuk-button", 1, "govuk-button"], [1, "govuk-button-group"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", 3, "disabled"], ["id", "query-response-error", 1, "govuk-error-message"], [1, "govuk-visually-hidden"], ["id", "add-documents-error", 1, "govuk-error-message"]], template: function WriteQueryManagementFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "div", 0);
+        i0.ɵɵelementStart(1, "div", 1);
+        i0.ɵɵelementStart(2, "a", 2);
+        i0.ɵɵtext(3);
+        i0.ɵɵpipe(4, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(5, "div", 3);
+        i0.ɵɵelementStart(6, "div", 4);
+        i0.ɵɵtext(7);
+        i0.ɵɵpipe(8, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(9, "h1", 5);
+        i0.ɵɵtext(10);
+        i0.ɵɵpipe(11, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(12, "div", 6);
+        i0.ɵɵelementStart(13, "div", 7);
+        i0.ɵɵtext(14);
+        i0.ɵɵpipe(15, "ccdCaseReference");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(16, "div");
+        i0.ɵɵelement(17, "ccd-query-details-table", 8);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(18, "div", 6);
+        i0.ɵɵelementStart(19, "h1", 9);
+        i0.ɵɵtext(20);
+        i0.ɵɵpipe(21, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(22, "div", 10);
+        i0.ɵɵelementStart(23, "div", 11);
+        i0.ɵɵelementStart(24, "div", 12);
+        i0.ɵɵelementStart(25, "label", 13);
+        i0.ɵɵtext(26);
+        i0.ɵɵpipe(27, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵtemplate(28, WriteQueryManagementFieldComponent_p_28_Template, 6, 6, "p", 14);
+        i0.ɵɵelementStart(29, "textarea", 15);
+        i0.ɵɵtext(30, "        ");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(31, "div");
+        i0.ɵɵelementStart(32, "div", 16);
+        i0.ɵɵelementStart(33, "div", 12);
+        i0.ɵɵelementStart(34, "label", 17);
+        i0.ɵɵelementStart(35, "div", 18);
+        i0.ɵɵtext(36);
+        i0.ɵɵpipe(37, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(38, "div");
+        i0.ɵɵtext(39);
+        i0.ɵɵpipe(40, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵtemplate(41, WriteQueryManagementFieldComponent_p_41_Template, 6, 6, "p", 19);
+        i0.ɵɵelement(42, "input", 20);
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(43, "button", 21);
+        i0.ɵɵtext(44);
+        i0.ɵɵpipe(45, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(46, "div");
+        i0.ɵɵelementStart(47, "div", 22);
+        i0.ɵɵelementStart(48, "button", 23);
+        i0.ɵɵtext(49);
+        i0.ɵɵpipe(50, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(51, "button", 21);
+        i0.ɵɵtext(52);
+        i0.ɵɵpipe(53, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementStart(54, "div", 1);
+        i0.ɵɵelementStart(55, "a", 2);
+        i0.ɵɵtext(56);
+        i0.ɵɵpipe(57, "rpxTranslate");
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+        i0.ɵɵelementEnd();
+    } if (rf & 2) {
+        let tmp_7_0 = null;
+        let tmp_9_0 = null;
+        let tmp_10_0 = null;
+        let tmp_12_0 = null;
+        let tmp_15_0 = null;
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 24, "Back to tasks"));
+        i0.ɵɵadvance(4);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(8, 26, "Respond to query"));
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(11, 28, "Query details"));
+        i0.ɵɵadvance(4);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(15, 30, ctx.caseReference));
+        i0.ɵɵadvance(3);
+        i0.ɵɵproperty("queryItem", ctx.queryItem);
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(21, 32, "Respond to a query"));
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("formGroup", ctx.responseFormGroup);
+        i0.ɵɵadvance(1);
+        i0.ɵɵclassProp("govuk-form-group--error", (tmp_7_0 = ctx.responseFormGroup.get("response")) == null ? null : tmp_7_0.errors == null ? null : tmp_7_0.errors.length);
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(27, 34, "Response message"), " ");
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("ngIf", (tmp_9_0 = ctx.responseFormGroup.get("response")) == null ? null : tmp_9_0.errors == null ? null : tmp_9_0.errors.length);
+        i0.ɵɵadvance(1);
+        i0.ɵɵclassProp("govuk-textarea--error", (tmp_10_0 = ctx.responseFormGroup.get("response")) == null ? null : tmp_10_0.errors == null ? null : tmp_10_0.errors.length);
+        i0.ɵɵproperty("formControlName", "response");
+        i0.ɵɵadvance(3);
+        i0.ɵɵclassProp("govuk-form-group--error", (tmp_12_0 = ctx.responseFormGroup.get("documents")) == null ? null : tmp_12_0.errors == null ? null : tmp_12_0.errors.length);
+        i0.ɵɵadvance(4);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(37, 36, "Add document(optional)"));
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(40, 38, "Attach a document to this message"));
+        i0.ɵɵadvance(2);
+        i0.ɵɵproperty("ngIf", (tmp_15_0 = ctx.responseFormGroup.get("response")) == null ? null : tmp_15_0.errors == null ? null : tmp_15_0.errors.length);
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(45, 40, "Next"), " ");
+        i0.ɵɵadvance(4);
+        i0.ɵɵproperty("disabled", true);
+        i0.ɵɵadvance(1);
+        i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(50, 42, "Previous"), " ");
+        i0.ɵɵadvance(3);
+        i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(53, 44, "Continue"), " ");
+        i0.ɵɵadvance(4);
+        i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(57, 46, "Cancel and return to query list"));
+    } }, styles: [".response-textarea[_ngcontent-%COMP%]{max-width:576px}"] });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteQueryManagementFieldComponent, [{
+        type: Component,
+        args: [{
+                selector: 'ccd-write-query-management-field',
+                templateUrl: './write-query-management-field.component.html',
+                styleUrls: ['./write-query-management-field.component.scss']
+            }]
+    }], function () { return []; }, null); })();
+
+class ReadTextAreaFieldComponent extends AbstractFieldReadComponent {
+}
+ReadTextAreaFieldComponent.ɵfac = function ReadTextAreaFieldComponent_Factory(t) { return ɵReadTextAreaFieldComponent_BaseFactory(t || ReadTextAreaFieldComponent); };
+ReadTextAreaFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: ReadTextAreaFieldComponent, selectors: [["ccd-read-text-area-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 1, consts: [[2, "white-space", "pre-wrap"]], template: function ReadTextAreaFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "span", 0);
+        i0.ɵɵtext(1);
+        i0.ɵɵelementEnd();
+    } if (rf & 2) {
+        i0.ɵɵadvance(1);
+        i0.ɵɵtextInterpolate(ctx.caseField.value);
+    } }, encapsulation: 2 });
+const ɵReadTextAreaFieldComponent_BaseFactory = /*@__PURE__*/ i0.ɵɵgetInheritedFactory(ReadTextAreaFieldComponent);
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadTextAreaFieldComponent, [{
+        type: Component,
+        args: [{
+                selector: 'ccd-read-text-area-field',
+                template: `<span style="white-space: pre-wrap">{{caseField.value}}</span>`
+            }]
+    }], null, null); })();
+
+function WriteTextAreaFieldComponent_span_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 6);
+    i0.ɵɵtext(1);
+    i0.ɵɵpipe(2, "ccdFieldLabel");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(ctx_r0.queryListData.partyName);
-    i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngForOf", ctx_r0.displayedColumns);
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngForOf", ctx_r0.queryListData.partyMessages);
-} }
-class QueryListComponent {
-    constructor() {
-        this.displayedColumns = [
-            { name: 'subject', displayName: 'Queries', sortOrder: SortOrder.UNSORTED },
-            { name: 'lastSubmittedBy', displayName: 'Last submitted by', sortOrder: SortOrder.UNSORTED },
-            { name: 'lastSubmittedDate', displayName: 'Last submission date', sortOrder: SortOrder.UNSORTED },
-            { name: 'lastResponseDate', displayName: 'Last response date', sortOrder: SortOrder.UNSORTED },
-            { name: 'lastResponseBy', displayName: 'Response by', sortOrder: SortOrder.UNSORTED }
-        ];
-    }
-    ngOnChanges(simpleChanges) {
-        var _a;
-        const currentPartyMessageGroup = (_a = simpleChanges.partyMessageGroup) === null || _a === void 0 ? void 0 : _a.currentValue;
-        if (currentPartyMessageGroup) {
-            this.queryListData = new QueryListData(currentPartyMessageGroup);
-        }
-    }
-    sortTable(col) {
-        switch (col.displayName) {
-            case 'Queries': {
-                this.sort(col);
-                break;
-            }
-            case 'Last submitted by': {
-                this.sort(col);
-                break;
-            }
-            case 'Last submission date': {
-                this.sortDate(col);
-                break;
-            }
-            case 'Last response date': {
-                this.sortDate(col);
-                break;
-            }
-            case 'Response by': {
-                this.sort(col);
-                break;
-            }
-            default: {
-                this.sort(col);
-                break;
-            }
-        }
-    }
-    sortWidget(col) {
-        switch (col.sortOrder) {
-            case SortOrder.DESCENDING: {
-                return '&#9660;';
-            }
-            case SortOrder.ASCENDING: {
-                return '&#9650;';
-            }
-            default: {
-                return '&#11047;';
-            }
-        }
-    }
-    sort(col) {
-        if (col.sortOrder === SortOrder.ASCENDING) {
-            this.queryListData.partyMessages.sort((a, b) => (a[col.name] < b[col.name]) ? 1 : -1);
-            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
-            col.sortOrder = SortOrder.DESCENDING;
-        }
-        else {
-            this.queryListData.partyMessages.sort((a, b) => (a[col.name] > b[col.name]) ? 1 : -1);
-            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
-            col.sortOrder = SortOrder.ASCENDING;
-        }
-    }
-    sortDate(col) {
-        if (col.sortOrder === SortOrder.ASCENDING) {
-            this.queryListData.partyMessages.sort((a, b) => b[col.name] - a[col.name]);
-            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
-            col.sortOrder = SortOrder.DESCENDING;
-        }
-        else {
-            this.queryListData.partyMessages.sort((a, b) => a[col.name] - b[col.name]);
-            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
-            col.sortOrder = SortOrder.ASCENDING;
-        }
-    }
-}
-QueryListComponent.ɵfac = function QueryListComponent_Factory(t) { return new (t || QueryListComponent)(); };
-QueryListComponent.ɵcmp = i0.ɵɵdefineComponent({ type: QueryListComponent, selectors: [["ccd-query-list"]], inputs: { partyMessageGroup: "partyMessageGroup" }, features: [i0.ɵɵNgOnChangesFeature], decls: 1, vars: 1, consts: [[4, "ngIf"], [1, "govuk-table", "query-list__table"], [1, "govuk-table__cell", "query-list__caption", "query-list__row"], [1, "govuk-table__head"], [1, "govuk-table__row", "query-list__row"], ["class", "govuk-table__header", 4, "ngFor", "ngForOf"], [1, "govuk-table__body"], ["class", "govuk-table__row query-list__row", 4, "ngFor", "ngForOf"], [1, "govuk-table__header"], ["href", "javascript:void(0)", 1, "sort-widget", 3, "innerHTML", "click"], [1, "govuk-table__cell", "query-list__cell", "query-list__cell--first"], ["href", "javascript:void(0)"], [1, "govuk-table__cell", "query-list__cell"]], template: function QueryListComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵtemplate(0, QueryListComponent_ng_container_0_Template, 10, 3, "ng-container", 0);
-    } if (rf & 2) {
-        i0.ɵɵproperty("ngIf", ctx.queryListData);
-    } }, directives: [i1.NgIf, i1.NgForOf], pipes: [i2$1.RpxTranslatePipe, i1.DatePipe], styles: [".query-list__caption[_ngcontent-%COMP%], .query-list__table[_ngcontent-%COMP%]{border:1px solid #b1b4b6}.query-list__caption[_ngcontent-%COMP%]{background:#f3f2f1;border-bottom:0;font-weight:700}.query-list__row[_ngcontent-%COMP%] > [_ngcontent-%COMP%]:first-child{padding-left:10px}.query-list__row[_ngcontent-%COMP%] > [_ngcontent-%COMP%]:last-child{padding-right:10px}.query-list__cell--first[_ngcontent-%COMP%]{width:33%}.sort-widget[_ngcontent-%COMP%]{cursor:pointer;text-decoration:none;color:#000}"] });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryListComponent, [{
-        type: Component,
-        args: [{
-                selector: 'ccd-query-list',
-                templateUrl: './query-list.component.html',
-                styleUrls: ['./query-list.component.scss']
-            }]
-    }], null, { partyMessageGroup: [{
-            type: Input
-        }] }); })();
-
-class QueryManagementUtils {
-    static extractCaseQueriesFromCaseField() {
-    }
-}
-QueryManagementUtils.ɵfac = function QueryManagementUtils_Factory(t) { return new (t || QueryManagementUtils)(); };
-QueryManagementUtils.ɵprov = i0.ɵɵdefineInjectable({ token: QueryManagementUtils, factory: QueryManagementUtils.ɵfac });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryManagementUtils, [{
-        type: Injectable
-    }], null, null); })();
-
-function ReadQueryManagementFieldComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "div", 1);
-    i0.ɵɵelement(2, "ccd-query-list", 2);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementContainerEnd();
-} if (rf & 2) {
-    const singlePartyMessageGroup_r1 = ctx.$implicit;
-    i0.ɵɵadvance(2);
-    i0.ɵɵproperty("partyMessageGroup", singlePartyMessageGroup_r1);
-} }
-class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
-    constructor(route) {
-        super();
-        this.route = route;
-    }
-    ngOnInit() {
-        if (this.context === PaletteContext.DEFAULT) {
-            // EUI-8303 Using mock data until CCD is ready with the API and data contract
-            this.partyMessagesGroups = partyMessagesMockData;
-            // TODO: Actual implementation once the CCD API and data contract is available
-            // Each parties will have a separate collection of party messages
-            // Find whether queries tab is available in the case data
-            const queriesTab = this.route.snapshot.data.case.tabs
-                .filter(tab => tab.fields && tab.fields
-                .some(caseField => caseField.id === 'QueryManagement'));
-            // Loop through the list of parties and their case queries collections
-            QueryManagementUtils.extractCaseQueriesFromCaseField();
-        }
-    }
-}
-ReadQueryManagementFieldComponent.ɵfac = function ReadQueryManagementFieldComponent_Factory(t) { return new (t || ReadQueryManagementFieldComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute)); };
-ReadQueryManagementFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: ReadQueryManagementFieldComponent, selectors: [["ccd-read-query-management-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [[4, "ngFor", "ngForOf"], [1, "govuk-!-margin-top-8", "govuk-!-margin-bottom-8"], [3, "partyMessageGroup"]], template: function ReadQueryManagementFieldComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵtemplate(0, ReadQueryManagementFieldComponent_ng_container_0_Template, 3, 1, "ng-container", 0);
-    } if (rf & 2) {
-        i0.ɵɵproperty("ngForOf", ctx.partyMessagesGroups);
-    } }, encapsulation: 2 });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadQueryManagementFieldComponent, [{
-        type: Component,
-        args: [{
-                selector: 'ccd-read-query-management-field',
-                templateUrl: './read-query-management-field.component.html',
-            }]
-    }], function () { return [{ type: i1$1.ActivatedRoute }]; }, null); })();
-
-class WriteQueryManagementFieldComponent extends AbstractFieldWriteComponent {
-    constructor() {
-        super();
-    }
-    ngOnInit() {
-    }
-}
-WriteQueryManagementFieldComponent.ɵfac = function WriteQueryManagementFieldComponent_Factory(t) { return new (t || WriteQueryManagementFieldComponent)(); };
-WriteQueryManagementFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: WriteQueryManagementFieldComponent, selectors: [["ccd-write-query-management-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 0, vars: 0, template: function WriteQueryManagementFieldComponent_Template(rf, ctx) { }, encapsulation: 2 });
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteQueryManagementFieldComponent, [{
-        type: Component,
-        args: [{
-                selector: 'ccd-write-query-management-field',
-                templateUrl: './write-query-management-field.component.html',
-            }]
-    }], function () { return []; }, null); })();
-
-class ReadTextAreaFieldComponent extends AbstractFieldReadComponent {
-}
-ReadTextAreaFieldComponent.ɵfac = function ReadTextAreaFieldComponent_Factory(t) { return ɵReadTextAreaFieldComponent_BaseFactory(t || ReadTextAreaFieldComponent); };
-ReadTextAreaFieldComponent.ɵcmp = i0.ɵɵdefineComponent({ type: ReadTextAreaFieldComponent, selectors: [["ccd-read-text-area-field"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 2, vars: 1, consts: [[2, "white-space", "pre-wrap"]], template: function ReadTextAreaFieldComponent_Template(rf, ctx) { if (rf & 1) {
-        i0.ɵɵelementStart(0, "span", 0);
-        i0.ɵɵtext(1);
-        i0.ɵɵelementEnd();
-    } if (rf & 2) {
-        i0.ɵɵadvance(1);
-        i0.ɵɵtextInterpolate(ctx.caseField.value);
-    } }, encapsulation: 2 });
-const ɵReadTextAreaFieldComponent_BaseFactory = /*@__PURE__*/ i0.ɵɵgetInheritedFactory(ReadTextAreaFieldComponent);
-(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadTextAreaFieldComponent, [{
-        type: Component,
-        args: [{
-                selector: 'ccd-read-text-area-field',
-                template: `<span style="white-space: pre-wrap">{{caseField.value}}</span>`
-            }]
-    }], null, null); })();
-
-function WriteTextAreaFieldComponent_span_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 6);
-    i0.ɵɵtext(1);
-    i0.ɵɵpipe(2, "ccdFieldLabel");
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r0.caseField));
+    i0.ɵɵadvance(1);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 1, ctx_r0.caseField));
 } }
 function WriteTextAreaFieldComponent_span_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "span", 7);
@@ -17751,7 +17715,8 @@ class PaletteService {
         this.componentLauncherRegistry = {
             [DisplayContextCustomParameter.CaseFileView]: [CaseFileViewFieldComponent, CaseFileViewFieldComponent],
             [DisplayContextCustomParameter.LinkedCases]: [WriteLinkedCasesFieldComponent, ReadLinkedCasesFieldComponent],
-            [DisplayContextCustomParameter.QueryManagement]: [WriteQueryManagementFieldComponent, ReadQueryManagementFieldComponent]
+            [DisplayContextCustomParameter.QueryManagement]: [WriteQueryManagementFieldComponent, ReadQueryManagementFieldComponent],
+            [DisplayContextCustomParameter.QueryManagementWriteTest]: [WriteQueryManagementFieldComponent, WriteQueryManagementFieldComponent]
         };
     }
     getFieldComponentClass(caseField, write) {
@@ -20517,6 +20482,13 @@ const ɵReadComplexFieldTableComponent_BaseFactory = /*@__PURE__*/ i0.ɵɵgetInh
             type: Input
         }] }); })();
 
+var SortOrder;
+(function (SortOrder) {
+    SortOrder[SortOrder["ASCENDING"] = 0] = "ASCENDING";
+    SortOrder[SortOrder["DESCENDING"] = 1] = "DESCENDING";
+    SortOrder[SortOrder["UNSORTED"] = 2] = "UNSORTED";
+})(SortOrder || (SortOrder = {}));
+
 function ReadComplexFieldCollectionTableComponent_th_9_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "th", 6);
@@ -22603,6 +22575,399 @@ FileUploadProgressGuard.ɵprov = i0.ɵɵdefineInjectable({ token: FileUploadProg
         type: Injectable
     }], function () { return [{ type: FileUploadStateService }, { type: WindowService }]; }, null); })();
 
+class QueryCreateComponent {
+    constructor() {
+    }
+    ngOnInit() {
+    }
+}
+QueryCreateComponent.ɵfac = function QueryCreateComponent_Factory(t) { return new (t || QueryCreateComponent)(); };
+QueryCreateComponent.ɵcmp = i0.ɵɵdefineComponent({ type: QueryCreateComponent, selectors: [["ccd-query-create"]], decls: 0, vars: 0, template: function QueryCreateComponent_Template(rf, ctx) { }, encapsulation: 2 });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryCreateComponent, [{
+        type: Component,
+        args: [{
+                selector: 'ccd-query-create',
+                templateUrl: './query-create.component.html',
+            }]
+    }], function () { return []; }, null); })();
+
+function QueryDetailsTableComponent_ng_container_0_div_47_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div");
+    i0.ɵɵelementStart(1, "a", 7);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const attachment_r2 = ctx.$implicit;
+    i0.ɵɵadvance(1);
+    i0.ɵɵproperty("href", attachment_r2._links.self.href, i0.ɵɵsanitizeUrl);
+    i0.ɵɵadvance(1);
+    i0.ɵɵtextInterpolate(attachment_r2.originalDocumentName);
+} }
+function QueryDetailsTableComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "table", 1);
+    i0.ɵɵpipe(2, "rpxTranslate");
+    i0.ɵɵelementStart(3, "tbody", 2);
+    i0.ɵɵelementStart(4, "tr", 3);
+    i0.ɵɵelementStart(5, "th", 4);
+    i0.ɵɵtext(6);
+    i0.ɵɵpipe(7, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "td", 5);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "tr", 3);
+    i0.ɵɵelementStart(11, "th", 4);
+    i0.ɵɵtext(12);
+    i0.ɵɵpipe(13, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(14, "td", 5);
+    i0.ɵɵtext(15);
+    i0.ɵɵpipe(16, "date");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(17, "tr", 3);
+    i0.ɵɵelementStart(18, "th", 4);
+    i0.ɵɵtext(19);
+    i0.ɵɵpipe(20, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(21, "td", 5);
+    i0.ɵɵtext(22);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(23, "tr", 3);
+    i0.ɵɵelementStart(24, "th", 4);
+    i0.ɵɵtext(25);
+    i0.ɵɵpipe(26, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(27, "td", 5);
+    i0.ɵɵtext(28);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(29, "tr", 3);
+    i0.ɵɵelementStart(30, "th", 4);
+    i0.ɵɵtext(31);
+    i0.ɵɵpipe(32, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(33, "td", 5);
+    i0.ɵɵtext(34);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(35, "tr", 3);
+    i0.ɵɵelementStart(36, "th", 4);
+    i0.ɵɵtext(37);
+    i0.ɵɵpipe(38, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(39, "td", 5);
+    i0.ɵɵtext(40);
+    i0.ɵɵpipe(41, "date");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(42, "tr", 3);
+    i0.ɵɵelementStart(43, "th", 4);
+    i0.ɵɵtext(44);
+    i0.ɵɵpipe(45, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(46, "td", 5);
+    i0.ɵɵtemplate(47, QueryDetailsTableComponent_ng_container_0_div_47_Template, 3, 2, "div", 6);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(1);
+    i0.ɵɵattribute("aria-describedby", i0.ɵɵpipeBind1(2, 15, "Details of the query"));
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 17, "Last submitted by"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r0.queryItem.lastSubmittedBy);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(13, 19, "Submission date"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(16, 21, ctx_r0.queryItem.createdOn, "d MMM yyyy"));
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(20, 24, "Query subject"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r0.queryItem.subject);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(26, 26, "Query body"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r0.queryItem.body);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(32, 28, "Is the query hearing related ?"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ctx_r0.queryItem.isHearingRelated ? "Yes" : "No");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(38, 30, "What is the date of the hearing your query related to ?"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(41, 32, ctx_r0.queryItem.hearingDate, "d MMM yyyy"));
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(45, 35, "Attachments"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵproperty("ngForOf", ctx_r0.queryItem.attachments);
+} }
+class QueryDetailsTableComponent {
+}
+QueryDetailsTableComponent.ɵfac = function QueryDetailsTableComponent_Factory(t) { return new (t || QueryDetailsTableComponent)(); };
+QueryDetailsTableComponent.ɵcmp = i0.ɵɵdefineComponent({ type: QueryDetailsTableComponent, selectors: [["ccd-query-details-table"]], inputs: { queryItem: "queryItem" }, decls: 1, vars: 1, consts: [[4, "ngIf"], [1, "govuk-table", "query-details-table"], [1, "govuk-table__body"], [1, "govuk-table__row"], ["scope", "row", 1, "govuk-table__header"], [1, "govuk-table__cell"], [4, "ngFor", "ngForOf"], ["target", "_blank", 3, "href"]], template: function QueryDetailsTableComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵtemplate(0, QueryDetailsTableComponent_ng_container_0_Template, 48, 37, "ng-container", 0);
+    } if (rf & 2) {
+        i0.ɵɵproperty("ngIf", ctx.queryItem);
+    } }, directives: [i1.NgIf, i1.NgForOf], pipes: [i2$1.RpxTranslatePipe, i1.DatePipe], styles: [".query-details-table[_ngcontent-%COMP%]   .govuk-table__header[_ngcontent-%COMP%]{width:330px}"] });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryDetailsTableComponent, [{
+        type: Component,
+        args: [{
+                selector: 'ccd-query-details-table',
+                templateUrl: './query-details-table.component.html',
+                styleUrls: ['./query-details-table.component.scss']
+            }]
+    }], null, { queryItem: [{
+            type: Input
+        }] }); })();
+
+class QueryDetailsComponent {
+}
+QueryDetailsComponent.ɵfac = function QueryDetailsComponent_Factory(t) { return new (t || QueryDetailsComponent)(); };
+QueryDetailsComponent.ɵcmp = i0.ɵɵdefineComponent({ type: QueryDetailsComponent, selectors: [["ccd-query-details"]], decls: 2, vars: 0, template: function QueryDetailsComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵelementStart(0, "p");
+        i0.ɵɵtext(1, "query-details works!");
+        i0.ɵɵelementEnd();
+    } }, encapsulation: 2 });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryDetailsComponent, [{
+        type: Component,
+        args: [{
+                selector: 'ccd-query-details',
+                templateUrl: './query-details.component.html'
+            }]
+    }], null, null); })();
+
+function QueryListComponent_ng_container_0_th_7_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "th", 8);
+    i0.ɵɵtext(1);
+    i0.ɵɵpipe(2, "rpxTranslate");
+    i0.ɵɵelementStart(3, "a", 9);
+    i0.ɵɵlistener("click", function QueryListComponent_ng_container_0_th_7_Template_a_click_3_listener() { i0.ɵɵrestoreView(_r5); const col_r3 = ctx.$implicit; const ctx_r4 = i0.ɵɵnextContext(2); return ctx_r4.sortTable(col_r3); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const col_r3 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(1);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 2, col_r3.displayName), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("innerHTML", ctx_r1.sortWidget(col_r3), i0.ɵɵsanitizeHtml);
+} }
+function QueryListComponent_ng_container_0_tr_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr", 4);
+    i0.ɵɵelementStart(1, "td", 10);
+    i0.ɵɵelementStart(2, "a", 11);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "td", 12);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "td", 12);
+    i0.ɵɵtext(7);
+    i0.ɵɵpipe(8, "date");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "td", 12);
+    i0.ɵɵtext(10);
+    i0.ɵɵpipe(11, "date");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "td", 12);
+    i0.ɵɵtext(13);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const message_r6 = ctx.$implicit;
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(message_r6.subject);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(message_r6.lastSubmittedBy);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(8, 5, message_r6.lastSubmittedDate, "dd MMM YYYY"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(11, 8, message_r6.lastResponseDate, "dd MMM YYYY"));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(message_r6.lastResponseBy);
+} }
+function QueryListComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainerStart(0);
+    i0.ɵɵelementStart(1, "table", 1);
+    i0.ɵɵelementStart(2, "caption", 2);
+    i0.ɵɵelementStart(3, "div");
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "thead", 3);
+    i0.ɵɵelementStart(6, "tr", 4);
+    i0.ɵɵtemplate(7, QueryListComponent_ng_container_0_th_7_Template, 4, 4, "th", 5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "tbody", 6);
+    i0.ɵɵtemplate(9, QueryListComponent_ng_container_0_tr_9_Template, 14, 11, "tr", 7);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementContainerEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(ctx_r0.queryListData.partyName);
+    i0.ɵɵadvance(3);
+    i0.ɵɵproperty("ngForOf", ctx_r0.displayedColumns);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngForOf", ctx_r0.queryListData.partyMessages);
+} }
+class QueryListComponent {
+    constructor() {
+        this.displayedColumns = [
+            { name: 'subject', displayName: 'Queries', sortOrder: SortOrder.UNSORTED },
+            { name: 'lastSubmittedBy', displayName: 'Last submitted by', sortOrder: SortOrder.UNSORTED },
+            { name: 'lastSubmittedDate', displayName: 'Last submission date', sortOrder: SortOrder.UNSORTED },
+            { name: 'lastResponseDate', displayName: 'Last response date', sortOrder: SortOrder.UNSORTED },
+            { name: 'lastResponseBy', displayName: 'Response by', sortOrder: SortOrder.UNSORTED }
+        ];
+    }
+    ngOnChanges(simpleChanges) {
+        var _a;
+        const currentPartyMessageGroup = (_a = simpleChanges.partyMessageGroup) === null || _a === void 0 ? void 0 : _a.currentValue;
+        if (currentPartyMessageGroup) {
+            this.queryListData = new QueryListData(currentPartyMessageGroup);
+        }
+    }
+    sortTable(col) {
+        switch (col.displayName) {
+            case 'Queries': {
+                this.sort(col);
+                break;
+            }
+            case 'Last submitted by': {
+                this.sort(col);
+                break;
+            }
+            case 'Last submission date': {
+                this.sortDate(col);
+                break;
+            }
+            case 'Last response date': {
+                this.sortDate(col);
+                break;
+            }
+            case 'Response by': {
+                this.sort(col);
+                break;
+            }
+            default: {
+                this.sort(col);
+                break;
+            }
+        }
+    }
+    sortWidget(col) {
+        switch (col.sortOrder) {
+            case SortOrder.DESCENDING: {
+                return '&#9660;';
+            }
+            case SortOrder.ASCENDING: {
+                return '&#9650;';
+            }
+            default: {
+                return '&#11047;';
+            }
+        }
+    }
+    sort(col) {
+        if (col.sortOrder === SortOrder.ASCENDING) {
+            this.queryListData.partyMessages.sort((a, b) => (a[col.name] < b[col.name]) ? 1 : -1);
+            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
+            col.sortOrder = SortOrder.DESCENDING;
+        }
+        else {
+            this.queryListData.partyMessages.sort((a, b) => (a[col.name] > b[col.name]) ? 1 : -1);
+            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
+            col.sortOrder = SortOrder.ASCENDING;
+        }
+    }
+    sortDate(col) {
+        if (col.sortOrder === SortOrder.ASCENDING) {
+            this.queryListData.partyMessages.sort((a, b) => b[col.name] - a[col.name]);
+            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
+            col.sortOrder = SortOrder.DESCENDING;
+        }
+        else {
+            this.queryListData.partyMessages.sort((a, b) => a[col.name] - b[col.name]);
+            this.displayedColumns.forEach((c) => c.sortOrder = SortOrder.UNSORTED);
+            col.sortOrder = SortOrder.ASCENDING;
+        }
+    }
+}
+QueryListComponent.ɵfac = function QueryListComponent_Factory(t) { return new (t || QueryListComponent)(); };
+QueryListComponent.ɵcmp = i0.ɵɵdefineComponent({ type: QueryListComponent, selectors: [["ccd-query-list"]], inputs: { partyMessageGroup: "partyMessageGroup" }, features: [i0.ɵɵNgOnChangesFeature], decls: 1, vars: 1, consts: [[4, "ngIf"], [1, "govuk-table", "query-list__table"], [1, "govuk-table__cell", "query-list__caption", "query-list__row"], [1, "govuk-table__head"], [1, "govuk-table__row", "query-list__row"], ["class", "govuk-table__header", 4, "ngFor", "ngForOf"], [1, "govuk-table__body"], ["class", "govuk-table__row query-list__row", 4, "ngFor", "ngForOf"], [1, "govuk-table__header"], ["href", "javascript:void(0)", 1, "sort-widget", 3, "innerHTML", "click"], [1, "govuk-table__cell", "query-list__cell", "query-list__cell--first"], ["href", "javascript:void(0)"], [1, "govuk-table__cell", "query-list__cell"]], template: function QueryListComponent_Template(rf, ctx) { if (rf & 1) {
+        i0.ɵɵtemplate(0, QueryListComponent_ng_container_0_Template, 10, 3, "ng-container", 0);
+    } if (rf & 2) {
+        i0.ɵɵproperty("ngIf", ctx.queryListData);
+    } }, directives: [i1.NgIf, i1.NgForOf], pipes: [i2$1.RpxTranslatePipe, i1.DatePipe], styles: [".query-list__caption[_ngcontent-%COMP%], .query-list__table[_ngcontent-%COMP%]{border:1px solid #b1b4b6}.query-list__caption[_ngcontent-%COMP%]{background:#f3f2f1;border-bottom:0;font-weight:700}.query-list__row[_ngcontent-%COMP%] > [_ngcontent-%COMP%]:first-child{padding-left:10px}.query-list__row[_ngcontent-%COMP%] > [_ngcontent-%COMP%]:last-child{padding-right:10px}.query-list__cell--first[_ngcontent-%COMP%]{width:33%}.sort-widget[_ngcontent-%COMP%]{cursor:pointer;text-decoration:none;color:#000}"] });
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryListComponent, [{
+        type: Component,
+        args: [{
+                selector: 'ccd-query-list',
+                templateUrl: './query-list.component.html',
+                styleUrls: ['./query-list.component.scss']
+            }]
+    }], null, { partyMessageGroup: [{
+            type: Input
+        }] }); })();
+
+class QueryManagementModule {
+}
+QueryManagementModule.ɵfac = function QueryManagementModule_Factory(t) { return new (t || QueryManagementModule)(); };
+QueryManagementModule.ɵmod = i0.ɵɵdefineNgModule({ type: QueryManagementModule });
+QueryManagementModule.ɵinj = i0.ɵɵdefineInjector({ imports: [[
+            CommonModule,
+            ReactiveFormsModule,
+            RpxTranslationModule.forChild(),
+            PipesModule
+        ]] });
+(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(QueryManagementModule, { declarations: [ReadQueryManagementFieldComponent,
+        WriteQueryManagementFieldComponent,
+        QueryDetailsComponent,
+        QueryCreateComponent,
+        QueryListComponent,
+        QueryDetailsTableComponent], imports: [CommonModule,
+        ReactiveFormsModule, i2$1.RpxTranslationModule, PipesModule], exports: [ReadQueryManagementFieldComponent,
+        WriteQueryManagementFieldComponent] }); })();
+(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryManagementModule, [{
+        type: NgModule,
+        args: [{
+                declarations: [
+                    ReadQueryManagementFieldComponent,
+                    WriteQueryManagementFieldComponent,
+                    QueryDetailsComponent,
+                    QueryCreateComponent,
+                    QueryListComponent,
+                    QueryDetailsTableComponent,
+                ],
+                imports: [
+                    CommonModule,
+                    ReactiveFormsModule,
+                    RpxTranslationModule.forChild(),
+                    PipesModule
+                ],
+                exports: [
+                    ReadQueryManagementFieldComponent,
+                    WriteQueryManagementFieldComponent
+                ],
+            }]
+    }], null, null); })();
+i0.ɵɵsetComponentScope(ReadQueryManagementFieldComponent, [i1.NgForOf, QueryListComponent], []);
+i0.ɵɵsetComponentScope(WriteQueryManagementFieldComponent, [QueryDetailsTableComponent, i3.NgControlStatusGroup, i3.FormGroupDirective, i1.NgIf, i3.DefaultValueAccessor, i3.NgControlStatus, i3.FormControlName], [i2$1.RpxTranslatePipe, CaseReferencePipe]);
+
 const PALETTE_COMPONENTS = [
     UnsupportedFieldComponent,
     DatetimePickerComponent,
@@ -22648,7 +23013,6 @@ const PALETTE_COMPONENTS = [
     ReadComplexFieldCollectionTableComponent,
     ReadCaseFlagFieldComponent,
     ReadLinkedCasesFieldComponent,
-    ReadQueryManagementFieldComponent,
     // Write
     WriteJudicialUserFieldComponent,
     WriteAddressFieldComponent,
@@ -22668,7 +23032,6 @@ const PALETTE_COMPONENTS = [
     WriteDateFieldComponent,
     WriteCaseFlagFieldComponent,
     WriteLinkedCasesFieldComponent,
-    WriteQueryManagementFieldComponent,
     // new
     WriteYesNoFieldComponent,
     WriteOrganisationFieldComponent,
@@ -22712,10 +23075,6 @@ const PALETTE_COMPONENTS = [
     CheckYourAnswersComponent,
     UnLinkCasesComponent,
     NoLinkedCasesComponent,
-    // Components for query management
-    QueryCreateComponent,
-    QueryDetailComponent,
-    QueryListComponent
 ];
 class PaletteModule {
 }
@@ -22765,7 +23124,8 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
             MatDialogModule,
             MediaViewerModule,
             LoadingModule,
-            RpxTranslationModule.forChild()
+            RpxTranslationModule.forChild(),
+            QueryManagementModule
         ], NgxMatDatetimePickerModule,
         NgxMatNativeDateModule,
         NgxMatTimepickerModule,
@@ -22820,7 +23180,6 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
         ReadComplexFieldCollectionTableComponent,
         ReadCaseFlagFieldComponent,
         ReadLinkedCasesFieldComponent,
-        ReadQueryManagementFieldComponent,
         // Write
         WriteJudicialUserFieldComponent,
         WriteAddressFieldComponent,
@@ -22840,7 +23199,6 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
         WriteDateFieldComponent,
         WriteCaseFlagFieldComponent,
         WriteLinkedCasesFieldComponent,
-        WriteQueryManagementFieldComponent,
         // new
         WriteYesNoFieldComponent,
         WriteOrganisationFieldComponent,
@@ -22883,11 +23241,7 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
         LinkCasesComponent,
         CheckYourAnswersComponent,
         UnLinkCasesComponent,
-        NoLinkedCasesComponent,
-        // Components for query management
-        QueryCreateComponent,
-        QueryDetailComponent,
-        QueryListComponent], imports: [CommonModule,
+        NoLinkedCasesComponent], imports: [CommonModule,
         RouterModule,
         FormsModule,
         ReactiveFormsModule,
@@ -22913,7 +23267,7 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
         OverlayModule,
         PaymentLibModule, i2.ScrollToModule, MatDialogModule,
         MediaViewerModule,
-        LoadingModule, i2$1.RpxTranslationModule], exports: [NgxMatDatetimePickerModule,
+        LoadingModule, i2$1.RpxTranslationModule, QueryManagementModule], exports: [NgxMatDatetimePickerModule,
         NgxMatNativeDateModule,
         NgxMatTimepickerModule,
         TabsModule,
@@ -22962,7 +23316,6 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
         ReadComplexFieldCollectionTableComponent,
         ReadCaseFlagFieldComponent,
         ReadLinkedCasesFieldComponent,
-        ReadQueryManagementFieldComponent,
         // Write
         WriteJudicialUserFieldComponent,
         WriteAddressFieldComponent,
@@ -22982,7 +23335,6 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
         WriteDateFieldComponent,
         WriteCaseFlagFieldComponent,
         WriteLinkedCasesFieldComponent,
-        WriteQueryManagementFieldComponent,
         // new
         WriteYesNoFieldComponent,
         WriteOrganisationFieldComponent,
@@ -23025,11 +23377,7 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
         LinkCasesComponent,
         CheckYourAnswersComponent,
         UnLinkCasesComponent,
-        NoLinkedCasesComponent,
-        // Components for query management
-        QueryCreateComponent,
-        QueryDetailComponent,
-        QueryListComponent] }); })();
+        NoLinkedCasesComponent] }); })();
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PaletteModule, [{
         type: NgModule,
         args: [{
@@ -23063,7 +23411,8 @@ PaletteModule.ɵinj = i0.ɵɵdefineInjector({ providers: [
                     MatDialogModule,
                     MediaViewerModule,
                     LoadingModule,
-                    RpxTranslationModule.forChild()
+                    RpxTranslationModule.forChild(),
+                    QueryManagementModule
                 ],
                 declarations: [
                     FixedListPipe,
@@ -23122,7 +23471,6 @@ i0.ɵɵsetComponentScope(ReadCaseFlagFieldComponent, [i1.NgSwitch, i1.NgSwitchCa
 i0.ɵɵsetComponentScope(ReadLinkedCasesFieldComponent, [
     // Components for linked cases
     LinkedCasesToTableComponent, i1.NgIf, LinkedCasesFromTableComponent], []);
-i0.ɵɵsetComponentScope(ReadQueryManagementFieldComponent, [i1.NgForOf, QueryListComponent], []);
 i0.ɵɵsetComponentScope(WriteAddressFieldComponent, [i1.NgIf, i1.NgClass, i3.DefaultValueAccessor, i3.NgControlStatus, i3.FormControlDirective, i3.SelectControlValueAccessor, i1.NgForOf, i3.NgSelectOption, i3.ɵangular_packages_forms_forms_z, WriteComplexFieldComponent, i3.NgControlStatusGroup, i3.FormGroupDirective], [FieldLabelPipe]);
 i0.ɵɵsetComponentScope(WriteComplexFieldComponent, [i1.NgIf, i1.NgForOf, i1.NgSwitch, i1.NgSwitchCase, FieldReadComponent, LabelSubstitutorDirective, i3.NgControlStatusGroup, i3.FormGroupDirective, FieldWriteComponent], [FieldLabelPipe, IsReadOnlyPipe]);
 i0.ɵɵsetComponentScope(WriteDocumentFieldComponent, [i1.NgClass, i1.NgIf, ReadDocumentFieldComponent], [FieldLabelPipe]);
@@ -31842,5 +32190,5 @@ class TestRouteSnapshotBuilder {
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractAppConfig, AbstractFieldReadComponent, AbstractFieldWriteComponent, Activity, ActivityBannerComponent, ActivityComponent, ActivityIconComponent, ActivityInfo, ActivityModule, ActivityPollingService, ActivityService, AddCommentsComponent, AddCommentsErrorMessage, AddCommentsStep, AddressModel, AddressOption, AddressesService, Alert, AlertComponent, AlertIconClassPipe, AlertMessageType, AlertModule, AlertService, AuthService, Banner, BannersService, BeforeYouStartComponent, BodyComponent, BrowserService, CCDCaseLinkType, CallbackErrorsComponent, CallbackErrorsContext, CaseAccessUtils, CaseBasicAccessViewComponent, CaseChallengedAccessRequestComponent, CaseChallengedAccessSuccessComponent, CaseCreateComponent, CaseDetails, CaseEditComponent, CaseEditConfirmComponent, CaseEditDataModule, CaseEditDataService, CaseEditFormComponent, CaseEditPageComponent, CaseEditSubmitComponent, CaseEditWizardGuard, CaseEditorConfig, CaseEditorModule, CaseEvent, CaseEventData, CaseEventTrigger, CaseEventTriggerComponent, CaseField, CaseFieldService, CaseFileViewFieldComponent, CaseFileViewFolderComponent, CaseFileViewFolderDocumentActionsComponent, CaseFileViewFolderSelectorComponent, CaseFileViewFolderSortComponent, CaseFileViewOverlayMenuComponent, CaseFileViewService, CaseFlagFieldState, CaseFlagRefdataService, CaseFlagStatus, CaseFlagSummaryListComponent, CaseFlagSummaryListDisplayMode, CaseFlagTableComponent, CaseFlagText, CaseFlagWizardStepTitle, CaseFullAccessViewComponent, CaseHeaderComponent, CaseHeaderModule, CaseHistoryViewerFieldComponent, CaseLink, CaseLinkResponse, CaseListComponent, CaseListFiltersComponent, CaseListFiltersModule, CaseListModule, CaseNotifier, CasePaymentHistoryViewerFieldComponent, CasePrintDocument, CasePrinterComponent, CaseProgressComponent, CaseReferencePipe, CaseResolver, CaseSpecificAccessRequestComponent, CaseSpecificAccessSuccessComponent, CaseState, CaseTab, CaseTimelineComponent, CaseTimelineDisplayMode, CaseTimelineModule, CaseType, CaseTypeLite, CaseView, CaseViewComponent, CaseViewEvent, CaseViewTrigger, CaseViewerComponent, CaseViewerModule, CasesService, CaseworkerService, CcdCYAPageLabelFilterPipe, CcdCaseTitlePipe, CcdCollectionTableCaseFieldsFilterPipe, CcdPageFieldsPipe, CcdTabFieldsPipe, CheckYourAnswersComponent, ConditionalShowFormDirective, ConditionalShowModule, ConditionalShowRegistrarService, Confirmation, ConvertHrefToRouterService, CreateCaseFiltersComponent, CreateCaseFiltersModule, CreateCaseFiltersSelection, DRAFT_PREFIX, DRAFT_QUERY_PARAM, DashPipe, DateInputComponent, DatePipe, DateTimeFormatUtils, DatetimePickerComponent, DefinitionsModule, DefinitionsService, DeleteOrCancelDialogComponent, DialogsModule, DisplayMode, Document, DocumentData, DocumentDialogComponent, DocumentLinks, DocumentManagementService, DocumentUrlPipe, Draft, DraftService, DynamicListPipe, DynamicRadioListPipe, ESQueryType, Embedded, ErrorMessageComponent, ErrorNotifierService, EventCaseField, EventCompletionReturnStates, EventCompletionStateMachineService, EventCompletionStates, EventLogComponent, EventLogDetailsComponent, EventLogTableComponent, EventMessageModule, EventStartComponent, EventStartModule, EventStartStateMachineService, EventStatusService, EventTriggerResolver, EventTriggerService, Fee, FeeValue, Field, FieldLabelPipe, FieldReadComponent, FieldReadLabelComponent, FieldType, FieldTypeSanitiser, FieldWriteComponent, FieldsFilterPipe, FieldsPurger, FieldsUtils, FirstErrorPipe, FixedListItem, FixedListPipe, FixedRadioListPipe, FocusElementDirective, FocusElementModule, FooterComponent, FormDocument, FormErrorService, FormValidatorsService, FormValueService, FormatTranslatorService, GreyBarService, HRef, HeaderBarComponent, HeadersModule, HttpError, HttpErrorService, HttpService, IsCompoundPipe, IsMandatoryPipe, IsReadOnlyAndNotCollectionPipe, IsReadOnlyPipe, JudicialworkerService, Jurisdiction, JurisdictionService, LabelFieldComponent, LabelSubstitutorDirective, LabelSubstitutorModule, LinkCaseReason, LinkCasesComponent, LinkCasesFromReasonValuePipe, LinkCasesReasonValuePipe, LinkDetails, LinkFromReason, LinkReason, LinkedCasesErrorMessages, LinkedCasesEventTriggers, LinkedCasesFromTableComponent, LinkedCasesPages, LinkedCasesResponse, LinkedCasesToTableComponent, LoadingModule, LoadingService, LoadingSpinnerComponent, LoadingSpinnerModule, MEDIA_VIEWER_LOCALSTORAGE_KEY, MULTIPLE_TASKS_FOUND, ManageCaseFlagsComponent, MarkdownComponent, MoneyGbpInputComponent, MultipleTasksExistComponent, NavigationComponent, NavigationItemComponent, NavigationNotifierService, NavigationOrigin, NoLinkedCasesComponent, NoTasksAvailableComponent, NotificationBannerComponent, NotificationBannerHeaderClass, NotificationBannerType, OrderService, OrderSummary, OrganisationConverter, OrganisationService, PageValidationService, PaginationComponent, PaginationMetadata, PaginationModule, PaletteContext, PaletteModule, PaletteService, PaletteUtilsModule, Patterns, PaymentField, PhaseComponent, PipesModule, PlaceholderService, PrintUrlPipe, Profile, ProfileNotifier, ProfileService, QueryCreateComponent, QueryDetailComponent, QueryListComponent, QueryListData, QueryListItem, QueryListResponseStatus, ReadCaseFlagFieldComponent, ReadCaseLinkFieldComponent, ReadCollectionFieldComponent, ReadComplexFieldCollectionTableComponent, ReadComplexFieldComponent, ReadComplexFieldRawComponent, ReadComplexFieldTableComponent, ReadDateFieldComponent, ReadDocumentFieldComponent, ReadDynamicListFieldComponent, ReadDynamicMultiSelectListFieldComponent, ReadDynamicRadioListFieldComponent, ReadEmailFieldComponent, ReadFieldsFilterPipe, ReadFixedListFieldComponent, ReadFixedRadioListFieldComponent, ReadJudicialUserFieldComponent, ReadLinkedCasesFieldComponent, ReadMoneyGbpFieldComponent, ReadMultiSelectListFieldComponent, ReadNumberFieldComponent, ReadOrderSummaryFieldComponent, ReadOrderSummaryRowComponent, ReadOrganisationFieldComponent, ReadOrganisationFieldRawComponent, ReadOrganisationFieldTableComponent, ReadPhoneUKFieldComponent, ReadQueryManagementFieldComponent, ReadTextAreaFieldComponent, ReadTextFieldComponent, ReadYesNoFieldComponent, RefdataCaseFlagType, RemoveDialogComponent, RequestOptionsBuilder, RouterHelperService, SaveOrDiscardDialogComponent, SearchFiltersComponent, SearchFiltersModule, SearchFiltersWrapperComponent, SearchInput, SearchLanguageInterpreterComponent, SearchLanguageInterpreterErrorMessage, SearchLanguageInterpreterStep, SearchResultComponent, SearchResultModule, SearchResultView, SearchResultViewColumn, SearchResultViewItem, SearchResultViewItemComparatorFactory, SearchService, SelectFlagErrorMessage, SelectFlagLocationComponent, SelectFlagLocationErrorMessage, SelectFlagTypeComponent, SelectFlagTypeErrorMessage, SessionStorageService, ShowCondition, SortOrder$1 as SortOrder, SortParameters, SortSearchResultPipe, TabComponent, TableColumnConfig, TableConfig, TabsComponent, TabsModule, TaskAssignedComponent, TaskCancelledComponent, TaskConflictComponent, TaskUnassignedComponent, Terms, TestRouteSnapshotBuilder, UnLinkCasesComponent, UnsupportedFieldComponent, UpdateFlagComponent, UpdateFlagErrorMessage, UpdateFlagStep, WaysToPayFieldComponent, WindowService, Wizard, WizardFactoryService, WizardPage, WizardPageField, WorkAllocationService, WorkbasketFiltersComponent, WorkbasketFiltersModule, WorkbasketInput, WorkbasketInputFilterService, WorkbasketInputModel, WriteAddressFieldComponent, WriteCaseFlagFieldComponent, WriteCaseLinkFieldComponent, WriteCollectionFieldComponent, WriteComplexFieldComponent, WriteDateContainerFieldComponent, WriteDateFieldComponent, WriteDocumentFieldComponent, WriteDynamicListFieldComponent, WriteDynamicMultiSelectListFieldComponent, WriteDynamicRadioListFieldComponent, WriteEmailFieldComponent, WriteFixedListFieldComponent, WriteFixedRadioListFieldComponent, WriteJudicialUserFieldComponent, WriteLinkedCasesFieldComponent, WriteMoneyGbpFieldComponent, WriteMultiSelectListFieldComponent, WriteNumberFieldComponent, WriteOrderSummaryFieldComponent, WriteOrganisationComplexFieldComponent, WriteOrganisationFieldComponent, WritePhoneUKFieldComponent, WriteQueryManagementFieldComponent, WriteTextAreaFieldComponent, WriteTextFieldComponent, WriteYesNoFieldComponent, YesNoService, aCaseField, createACL, createCaseEventTrigger, createCaseField, createComplexFieldOverride, createFieldType, createFixedListFieldType, createHiddenComplexFieldOverride, createMultiSelectListFieldType, createWizardPage, createWizardPageField, editorRouting, initDialog, newCaseField, partyMessagesMockData, textFieldType, viewerRouting };
+export { AbstractAppConfig, AbstractFieldReadComponent, AbstractFieldWriteComponent, Activity, ActivityBannerComponent, ActivityComponent, ActivityIconComponent, ActivityInfo, ActivityModule, ActivityPollingService, ActivityService, AddCommentsComponent, AddCommentsErrorMessage, AddCommentsStep, AddressModel, AddressOption, AddressesService, Alert, AlertComponent, AlertIconClassPipe, AlertMessageType, AlertModule, AlertService, AuthService, Banner, BannersService, BeforeYouStartComponent, BodyComponent, BrowserService, CCDCaseLinkType, CallbackErrorsComponent, CallbackErrorsContext, CaseAccessUtils, CaseBasicAccessViewComponent, CaseChallengedAccessRequestComponent, CaseChallengedAccessSuccessComponent, CaseCreateComponent, CaseDetails, CaseEditComponent, CaseEditConfirmComponent, CaseEditDataModule, CaseEditDataService, CaseEditFormComponent, CaseEditPageComponent, CaseEditSubmitComponent, CaseEditWizardGuard, CaseEditorConfig, CaseEditorModule, CaseEvent, CaseEventData, CaseEventTrigger, CaseEventTriggerComponent, CaseField, CaseFieldService, CaseFileViewFieldComponent, CaseFileViewFolderComponent, CaseFileViewFolderDocumentActionsComponent, CaseFileViewFolderSelectorComponent, CaseFileViewFolderSortComponent, CaseFileViewOverlayMenuComponent, CaseFileViewService, CaseFlagFieldState, CaseFlagRefdataService, CaseFlagStatus, CaseFlagSummaryListComponent, CaseFlagSummaryListDisplayMode, CaseFlagTableComponent, CaseFlagText, CaseFlagWizardStepTitle, CaseFullAccessViewComponent, CaseHeaderComponent, CaseHeaderModule, CaseHistoryViewerFieldComponent, CaseLink, CaseLinkResponse, CaseListComponent, CaseListFiltersComponent, CaseListFiltersModule, CaseListModule, CaseNotifier, CasePaymentHistoryViewerFieldComponent, CasePrintDocument, CasePrinterComponent, CaseProgressComponent, CaseReferencePipe, CaseResolver, CaseSpecificAccessRequestComponent, CaseSpecificAccessSuccessComponent, CaseState, CaseTab, CaseTimelineComponent, CaseTimelineDisplayMode, CaseTimelineModule, CaseType, CaseTypeLite, CaseView, CaseViewComponent, CaseViewEvent, CaseViewTrigger, CaseViewerComponent, CaseViewerModule, CasesService, CaseworkerService, CcdCYAPageLabelFilterPipe, CcdCaseTitlePipe, CcdCollectionTableCaseFieldsFilterPipe, CcdPageFieldsPipe, CcdTabFieldsPipe, CheckYourAnswersComponent, ConditionalShowFormDirective, ConditionalShowModule, ConditionalShowRegistrarService, Confirmation, ConvertHrefToRouterService, CreateCaseFiltersComponent, CreateCaseFiltersModule, CreateCaseFiltersSelection, DRAFT_PREFIX, DRAFT_QUERY_PARAM, DashPipe, DateInputComponent, DatePipe, DateTimeFormatUtils, DatetimePickerComponent, DefinitionsModule, DefinitionsService, DeleteOrCancelDialogComponent, DialogsModule, DisplayMode, Document, DocumentData, DocumentDialogComponent, DocumentLinks, DocumentManagementService, DocumentUrlPipe, Draft, DraftService, DynamicListPipe, DynamicRadioListPipe, ESQueryType, Embedded, ErrorMessageComponent, ErrorNotifierService, EventCaseField, EventCompletionReturnStates, EventCompletionStateMachineService, EventCompletionStates, EventLogComponent, EventLogDetailsComponent, EventLogTableComponent, EventMessageModule, EventStartComponent, EventStartModule, EventStartStateMachineService, EventStatusService, EventTriggerResolver, EventTriggerService, Fee, FeeValue, Field, FieldLabelPipe, FieldReadComponent, FieldReadLabelComponent, FieldType, FieldTypeSanitiser, FieldWriteComponent, FieldsFilterPipe, FieldsPurger, FieldsUtils, FirstErrorPipe, FixedListItem, FixedListPipe, FixedRadioListPipe, FocusElementDirective, FocusElementModule, FooterComponent, FormDocument, FormErrorService, FormValidatorsService, FormValueService, FormatTranslatorService, GreyBarService, HRef, HeaderBarComponent, HeadersModule, HttpError, HttpErrorService, HttpService, IsCompoundPipe, IsMandatoryPipe, IsReadOnlyAndNotCollectionPipe, IsReadOnlyPipe, JudicialworkerService, Jurisdiction, JurisdictionService, LabelFieldComponent, LabelSubstitutorDirective, LabelSubstitutorModule, LinkCaseReason, LinkCasesComponent, LinkCasesFromReasonValuePipe, LinkCasesReasonValuePipe, LinkDetails, LinkFromReason, LinkReason, LinkedCasesErrorMessages, LinkedCasesEventTriggers, LinkedCasesFromTableComponent, LinkedCasesPages, LinkedCasesResponse, LinkedCasesToTableComponent, LoadingModule, LoadingService, LoadingSpinnerComponent, LoadingSpinnerModule, MEDIA_VIEWER_LOCALSTORAGE_KEY, MULTIPLE_TASKS_FOUND, ManageCaseFlagsComponent, MarkdownComponent, MoneyGbpInputComponent, MultipleTasksExistComponent, NavigationComponent, NavigationItemComponent, NavigationNotifierService, NavigationOrigin, NoLinkedCasesComponent, NoTasksAvailableComponent, NotificationBannerComponent, NotificationBannerHeaderClass, NotificationBannerType, OrderService, OrderSummary, OrganisationConverter, OrganisationService, PageValidationService, PaginationComponent, PaginationMetadata, PaginationModule, PaletteContext, PaletteModule, PaletteService, PaletteUtilsModule, Patterns, PaymentField, PhaseComponent, PipesModule, PlaceholderService, PrintUrlPipe, Profile, ProfileNotifier, ProfileService, ReadCaseFlagFieldComponent, ReadCaseLinkFieldComponent, ReadCollectionFieldComponent, ReadComplexFieldCollectionTableComponent, ReadComplexFieldComponent, ReadComplexFieldRawComponent, ReadComplexFieldTableComponent, ReadDateFieldComponent, ReadDocumentFieldComponent, ReadDynamicListFieldComponent, ReadDynamicMultiSelectListFieldComponent, ReadDynamicRadioListFieldComponent, ReadEmailFieldComponent, ReadFieldsFilterPipe, ReadFixedListFieldComponent, ReadFixedRadioListFieldComponent, ReadJudicialUserFieldComponent, ReadLinkedCasesFieldComponent, ReadMoneyGbpFieldComponent, ReadMultiSelectListFieldComponent, ReadNumberFieldComponent, ReadOrderSummaryFieldComponent, ReadOrderSummaryRowComponent, ReadOrganisationFieldComponent, ReadOrganisationFieldRawComponent, ReadOrganisationFieldTableComponent, ReadPhoneUKFieldComponent, ReadQueryManagementFieldComponent, ReadTextAreaFieldComponent, ReadTextFieldComponent, ReadYesNoFieldComponent, RefdataCaseFlagType, RemoveDialogComponent, RequestOptionsBuilder, RouterHelperService, SaveOrDiscardDialogComponent, SearchFiltersComponent, SearchFiltersModule, SearchFiltersWrapperComponent, SearchInput, SearchLanguageInterpreterComponent, SearchLanguageInterpreterErrorMessage, SearchLanguageInterpreterStep, SearchResultComponent, SearchResultModule, SearchResultView, SearchResultViewColumn, SearchResultViewItem, SearchResultViewItemComparatorFactory, SearchService, SelectFlagErrorMessage, SelectFlagLocationComponent, SelectFlagLocationErrorMessage, SelectFlagTypeComponent, SelectFlagTypeErrorMessage, SessionStorageService, ShowCondition, SortOrder$1 as SortOrder, SortParameters, SortSearchResultPipe, TabComponent, TableColumnConfig, TableConfig, TabsComponent, TabsModule, TaskAssignedComponent, TaskCancelledComponent, TaskConflictComponent, TaskUnassignedComponent, Terms, TestRouteSnapshotBuilder, UnLinkCasesComponent, UnsupportedFieldComponent, UpdateFlagComponent, UpdateFlagErrorMessage, UpdateFlagStep, WaysToPayFieldComponent, WindowService, Wizard, WizardFactoryService, WizardPage, WizardPageField, WorkAllocationService, WorkbasketFiltersComponent, WorkbasketFiltersModule, WorkbasketInput, WorkbasketInputFilterService, WorkbasketInputModel, WriteAddressFieldComponent, WriteCaseFlagFieldComponent, WriteCaseLinkFieldComponent, WriteCollectionFieldComponent, WriteComplexFieldComponent, WriteDateContainerFieldComponent, WriteDateFieldComponent, WriteDocumentFieldComponent, WriteDynamicListFieldComponent, WriteDynamicMultiSelectListFieldComponent, WriteDynamicRadioListFieldComponent, WriteEmailFieldComponent, WriteFixedListFieldComponent, WriteFixedRadioListFieldComponent, WriteJudicialUserFieldComponent, WriteLinkedCasesFieldComponent, WriteMoneyGbpFieldComponent, WriteMultiSelectListFieldComponent, WriteNumberFieldComponent, WriteOrderSummaryFieldComponent, WriteOrganisationComplexFieldComponent, WriteOrganisationFieldComponent, WritePhoneUKFieldComponent, WriteQueryManagementFieldComponent, WriteTextAreaFieldComponent, WriteTextFieldComponent, WriteYesNoFieldComponent, YesNoService, aCaseField, createACL, createCaseEventTrigger, createCaseField, createComplexFieldOverride, createFieldType, createFixedListFieldType, createHiddenComplexFieldOverride, createMultiSelectListFieldType, createWizardPage, createWizardPageField, editorRouting, initDialog, newCaseField, textFieldType, viewerRouting };
 //# sourceMappingURL=hmcts-ccd-case-ui-toolkit.js.map