@hmcts/ccd-case-ui-toolkit 7.2.1 → 7.2.2-exui-1832-rc1

package/fesm2022/hmcts-ccd-case-ui-toolkit.mjs

@@ -27,7 +27,7 @@ import { MatDialogConfig } from '@angular/material/dialog';
 import * as i2 from '@nicky-lenaers/ngx-scroll-to';
 import { ScrollToModule } from '@nicky-lenaers/ngx-scroll-to';
 import * as marked from 'marked';
-import * as i1$4 from 'ngx-markdown';
+import * as i2$1 from 'ngx-markdown';
 import { MarkdownModule } from 'ngx-markdown';
 import * as i6 from '@angular/material/legacy-autocomplete';
 import { MatLegacyAutocompleteModule } from '@angular/material/legacy-autocomplete';
@@ -36,7 +36,7 @@ import { MAT_LEGACY_DATE_LOCALE } from '@angular/material/legacy-core';
 import * as i3 from '@hmcts/ccpay-web-component';
 import { PaymentLibModule } from '@hmcts/ccpay-web-component';
 import { v4 } from 'uuid';
-import * as i2$1 from '@angular/cdk/overlay';
+import * as i2$2 from '@angular/cdk/overlay';
 import { OverlayModule } from '@angular/cdk/overlay';
 import * as i7$1 from '@angular/cdk/tree';
 import { NestedTreeControl, CdkTreeModule } from '@angular/cdk/tree';
@@ -53,7 +53,7 @@ import { MatLegacyInputModule } from '@angular/material/legacy-input';
 import * as i14 from '@hmcts/media-viewer';
 import { MediaViewerModule } from '@hmcts/media-viewer';
 import { PortalModule } from '@angular/cdk/portal';
-import * as i2$2 from 'ngx-pagination';
+import * as i2$3 from 'ngx-pagination';
 import { NgxPaginationModule, PaginatePipe } from 'ngx-pagination';
 import * as i10 from '@angular/material/legacy-tabs';
 import { MatLegacyTabsModule } from '@angular/material/legacy-tabs';
@@ -12996,7 +12996,7 @@ class CaseFileViewFieldComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-file-view-field', template: "<ng-container *ngIf=\"errorMessages?.length\">\n  <div\n    id=\"case-file-view-field-errors\"\n    class=\"govuk-error-summary govuk-!-margin-bottom-4\"\n    data-module=\"govuk-error-summary\"\n  >\n    <div role=\"alert\">\n      <h2 class=\"govuk-error-summary__title\">There is a problem</h2>\n      <div class=\"govuk-error-summary__body\">\n        <ul class=\"govuk-list govuk-error-summary__list\">\n          <li *ngFor=\"let errorMessage of errorMessages\">\n            <a href=\"javascript:void(0);\">{{ errorMessage }}</a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </div>\n</ng-container>\n\n<div\n  *ngIf=\"getCategoriesAndDocumentsError\"\n  class=\"govuk-grid-column-two-thirds\"\n>\n  <h1 class=\"govuk-heading-xl\">Sorry, there is a problem with the service</h1>\n  <p class=\"govuk-body\">Try again later.</p>\n</div>\n<div *ngIf=\"!getCategoriesAndDocumentsError\">\n  <h2 class=\"govuk-heading-l\">Case file</h2>\n  <div class=\"govuk-form-group\" id=\"case-file-view\">\n    <!-- Document tree -->\n    <div class=\"document-tree-container\">\n      <ccd-case-file-view-folder\n        class=\"document-tree-container__tree\"\n        [categoriesAndDocuments]=\"categoriesAndDocuments$\"\n        (clickedDocument)=\"setMediaViewerFile($event); resetErrorMessages()\"\n        (moveDocument)=\"moveDocument($event)\"\n        [allowMoving]=\"allowMoving\"\n      ></ccd-case-file-view-folder>\n    </div>\n    <!-- Slider -->\n    <div class=\"slider\"></div>\n    <!-- Media viewer -->\n    <div class=\"media-viewer-container\">\n      <ng-container *ngIf=\"currentDocument\">\n        <mv-media-viewer\n          [url]=\"currentDocument.document_binary_url\"\n          [downloadFileName]=\"currentDocument.document_filename\"\n          [showToolbar]=\"true\"\n          [contentType]=\"currentDocument.content_type\"\n          [enableAnnotations]=\"true\"\n          [enableRedactions]=\"true\"\n          [height]=\"'94.5vh'\"\n          [caseId]=\"caseId\"\n          [multimediaPlayerEnabled]=\"true\"\n          [enableICP]=\"isIcpEnabled()\"\n        >\n        </mv-media-viewer>\n      </ng-container>\n    </div>\n  </div>\n</div>\n", styles: ["#case-file-view{display:flex;border:2px solid #C9C9C9;height:100vh;position:relative}#case-file-view .document-tree-container{background-color:#faf8f8;width:30%;min-height:400px;min-width:10%}#case-file-view .slider{width:.2%;background-color:#6b6b6b}#case-file-view .slider:hover,#case-file-view .slider:focus{cursor:col-resize}#case-file-view .media-viewer-container{background-color:#dee0e2;flex:1 1 0;overflow:hidden}\n"] }]
+        args: [{ selector: 'ccd-case-file-view-field', template: "<ng-container *ngIf=\"errorMessages?.length\">\n  <div\n    id=\"case-file-view-field-errors\"\n    class=\"govuk-error-summary govuk-!-margin-bottom-4\"\n    data-module=\"govuk-error-summary\"\n  >\n    <div role=\"alert\">\n      <h2 class=\"govuk-error-summary__title\">There is a problem</h2>\n      <div class=\"govuk-error-summary__body\">\n        <ul class=\"govuk-list govuk-error-summary__list\">\n          <li *ngFor=\"let errorMessage of errorMessages\">\n            <a href=\"javascript:void(0);\">{{ errorMessage }}</a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </div>\n</ng-container>\n\n<div\n  *ngIf=\"getCategoriesAndDocumentsError\"\n  class=\"govuk-grid-column-two-thirds\"\n>\n  <h1 class=\"govuk-heading-xl\">Sorry, there is a problem with the service</h1>\n  <p class=\"govuk-body\">Try again later.</p>\n</div>\n<div *ngIf=\"!getCategoriesAndDocumentsError\">\n  <h2 class=\"govuk-heading-l\">Case file</h2>\n  <div class=\"govuk-form-group\" id=\"case-file-view\">\n    <!-- Document tree -->\n    <div class=\"document-tree-container\">\n      <ccd-case-file-view-folder \n          class=\"document-tree-container__tree\"\n          [categoriesAndDocuments]=\"categoriesAndDocuments$\"\n          (clickedDocument)=\"setMediaViewerFile($event); resetErrorMessages()\" \n          (moveDocument)=\"moveDocument($event)\"\n          [allowMoving]=\"allowMoving\">\n      </ccd-case-file-view-folder>\n    </div>\n    <!-- Slider -->\n    <div class=\"slider\"></div>\n    <!-- Media viewer -->\n    <div class=\"media-viewer-container\">\n      <ng-container *ngIf=\"currentDocument\">\n        <mv-media-viewer\n          [url]=\"currentDocument.document_binary_url\"\n          [downloadFileName]=\"currentDocument.document_filename\"\n          [showToolbar]=\"true\"\n          [contentType]=\"currentDocument.content_type\"\n          [enableAnnotations]=\"true\"\n          [enableRedactions]=\"true\"\n          [height]=\"'94.5vh'\"\n          [caseId]=\"caseId\"\n          [multimediaPlayerEnabled]=\"true\"\n          [enableICP]=\"isIcpEnabled()\"\n        >\n        </mv-media-viewer>\n      </ng-container>\n    </div>\n  </div>\n</div>\n", styles: ["#case-file-view{display:flex;border:2px solid #C9C9C9;height:100vh;position:relative}#case-file-view .document-tree-container{background-color:#faf8f8;width:30%;min-height:400px;min-width:10%}#case-file-view .slider{width:.2%;background-color:#6b6b6b}#case-file-view .slider:hover,#case-file-view .slider:focus{cursor:col-resize}#case-file-view .media-viewer-container{background-color:#dee0e2;flex:1 1 0;overflow:hidden}\n"] }]
     }], () => [{ type: i0.ElementRef }, { type: i1$1.ActivatedRoute }, { type: CaseFileViewService }, { type: DocumentManagementService }, { type: LoadingService }, { type: SessionStorageService }, { type: CaseNotifier }, { type: AbstractAppConfig }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseFileViewFieldComponent, { className: "CaseFileViewFieldComponent", filePath: "lib/shared/components/palette/case-file-view/case-file-view-field.component.ts", lineNumber: 17 }); })();
 
@@ -14370,17 +14370,16 @@ class RemoveDialogComponent {
 
 const _c0$S = ["collectionItem"];
 function WriteCollectionFieldComponent_h2_8_span_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 10)(1, "markdown");
-    i0.ɵɵtext(2);
-    i0.ɵɵpipe(3, "rpxTranslate");
-    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(0, "span", 10);
+    i0.ɵɵelement(1, "ccd-markdown", 11);
+    i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, ctx_r0.caseField.hint_text));
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("content", ctx_r0.caseField.hint_text);
 } }
 function WriteCollectionFieldComponent_h2_8_span_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 11);
+    i0.ɵɵelementStart(0, "span", 12);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "ccdFirstError");
     i0.ɵɵelementEnd();
@@ -14391,7 +14390,7 @@ function WriteCollectionFieldComponent_h2_8_span_2_Template(rf, ctx) { if (rf &
 } }
 function WriteCollectionFieldComponent_h2_8_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "h2", 3);
-    i0.ɵɵtemplate(1, WriteCollectionFieldComponent_h2_8_span_1_Template, 4, 3, "span", 8)(2, WriteCollectionFieldComponent_h2_8_span_2_Template, 3, 4, "span", 9);
+    i0.ɵɵtemplate(1, WriteCollectionFieldComponent_h2_8_span_1_Template, 2, 1, "span", 8)(2, WriteCollectionFieldComponent_h2_8_span_2_Template, 3, 4, "span", 9);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -14402,16 +14401,16 @@ function WriteCollectionFieldComponent_h2_8_Template(rf, ctx) { if (rf & 1) {
 } }
 function WriteCollectionFieldComponent_div_9_div_2_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 1, 0)(2, "div", 15)(3, "div", 16)(4, "legend", 17)(5, "label", 18)(6, "h3", 19);
+    i0.ɵɵelementStart(0, "div", 1, 0)(2, "div", 16)(3, "div", 17)(4, "legend", 18)(5, "label", 19)(6, "h3", 20);
     i0.ɵɵtext(7);
     i0.ɵɵpipe(8, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(9, "div", 20)(10, "button", 21);
+    i0.ɵɵelementStart(9, "div", 21)(10, "button", 22);
     i0.ɵɵlistener("click", function WriteCollectionFieldComponent_div_9_div_2_Template_button_click_10_listener() { const i_r3 = i0.ɵɵrestoreView(_r2).index; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.openModal(i_r3)); });
     i0.ɵɵtext(11);
     i0.ɵɵpipe(12, "rpxTranslate");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelement(13, "ccd-field-write", 22);
+    i0.ɵɵelement(13, "ccd-field-write", 23);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const item_r4 = ctx.$implicit;
@@ -14431,8 +14430,8 @@ function WriteCollectionFieldComponent_div_9_div_2_Template(rf, ctx) { if (rf &
     i0.ɵɵproperty("caseField", item_r4.caseField)("caseFields", ctx_r0.caseFields)("formGroup", ctx_r0.formGroup)("parent", item_r4.container)("idPrefix", item_r4.prefix)("hidden", item_r4.caseField.hidden)("isExpanded", ctx_r0.isExpanded)("isInSearchBlock", ctx_r0.isInSearchBlock);
 } }
 function WriteCollectionFieldComponent_div_9_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 12)(1, "fieldset", 13);
-    i0.ɵɵtemplate(2, WriteCollectionFieldComponent_div_9_div_2_Template, 14, 19, "div", 14);
+    i0.ɵɵelementStart(0, "div", 13)(1, "fieldset", 14);
+    i0.ɵɵtemplate(2, WriteCollectionFieldComponent_div_9_div_2_Template, 14, 19, "div", 15);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -14442,7 +14441,7 @@ function WriteCollectionFieldComponent_div_9_Template(rf, ctx) { if (rf & 1) {
 } }
 function WriteCollectionFieldComponent_button_10_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 23);
+    i0.ɵɵelementStart(0, "button", 24);
     i0.ɵɵlistener("click", function WriteCollectionFieldComponent_button_10_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.addItem(false)); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
@@ -14760,7 +14759,7 @@ class WriteCollectionFieldComponent extends AbstractFieldWriteComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.items = _t);
-        } }, inputs: { caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 11, consts: [["collectionItem", ""], [1, "form-group", 3, "id"], [1, "panel", "collection-indicator"], [1, "heading-h2", "error-spacing"], ["type", "button", 1, "button", "write-collection-add-item__top", 3, "click", "disabled"], ["class", "heading-h2 error-spacing", 4, "ngIf"], ["class", "form-group", 3, "hidden", 4, "ngIf"], ["class", "button write-collection-add-item__bottom", "type", "button", 3, "disabled", "click", 4, "ngIf"], ["class", "form-hint", 4, "ngIf"], ["class", "error-message", 4, "ngIf"], [1, "form-hint"], [1, "error-message"], [1, "form-group", 3, "hidden"], [1, "govuk-fieldset"], ["class", "form-group", 3, "id", 4, "ngFor", "ngForOf"], [1, "collection-title"], [1, "float-left"], [1, "govuk-fieldset__legend"], [3, "for"], [1, "heading-h3"], [1, "float-right"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], [3, "caseField", "caseFields", "formGroup", "parent", "idPrefix", "hidden", "isExpanded", "isInSearchBlock"], ["type", "button", 1, "button", "write-collection-add-item__bottom", 3, "click", "disabled"]], template: function WriteCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { caseFields: "caseFields" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 11, consts: [["collectionItem", ""], [1, "form-group", 3, "id"], [1, "panel", "collection-indicator"], [1, "heading-h2", "error-spacing"], ["type", "button", 1, "button", "write-collection-add-item__top", 3, "click", "disabled"], ["class", "heading-h2 error-spacing", 4, "ngIf"], ["class", "form-group", 3, "hidden", 4, "ngIf"], ["class", "button write-collection-add-item__bottom", "type", "button", 3, "disabled", "click", 4, "ngIf"], ["class", "form-hint", 4, "ngIf"], ["class", "error-message", 4, "ngIf"], [1, "form-hint"], [3, "content"], [1, "error-message"], [1, "form-group", 3, "hidden"], [1, "govuk-fieldset"], ["class", "form-group", 3, "id", 4, "ngFor", "ngForOf"], [1, "collection-title"], [1, "float-left"], [1, "govuk-fieldset__legend"], [3, "for"], [1, "heading-h3"], [1, "float-right"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], [3, "caseField", "caseFields", "formGroup", "parent", "idPrefix", "hidden", "isExpanded", "isInSearchBlock"], ["type", "button", 1, "button", "write-collection-add-item__bottom", 3, "click", "disabled"]], template: function WriteCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 1)(1, "div", 2)(2, "h2", 3);
             i0.ɵɵtext(3);
             i0.ɵɵpipe(4, "ccdFieldLabel");
@@ -14790,7 +14789,7 @@ class WriteCollectionFieldComponent extends AbstractFieldWriteComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteCollectionFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-write-collection-field', template: "<div class=\"form-group\" [id]=\"id()\">\n\n  <div class=\"panel collection-indicator\">\n\n    <h2 class=\"heading-h2 error-spacing\">\n      {{(caseField | ccdFieldLabel)}}\n    </h2>\n    <button class=\"button write-collection-add-item__top\" type=\"button\" (click)=\"addItem(true)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\">{{'Add new' | rpxTranslate}}</button>\n    <h2 class=\"heading-h2 error-spacing\" *ngIf=\"caseField.hint_text || formArray.errors\">\n      <span *ngIf=\"caseField.hint_text\" class=\"form-hint\">\n      <markdown>{{caseField.hint_text | rpxTranslate }}</markdown>\n      </span>\n      <span *ngIf=\"formArray.errors\" class=\"error-message\">\n        {{(formArray.errors | ccdFirstError:caseField.label)}}\n      </span>\n    </h2>\n\n    <div class=\"form-group\" [hidden]=\"caseField.hidden\" *ngIf=\"caseField.value && caseField.value.length\">\n      <fieldset class=\"govuk-fieldset\">\n        <div *ngFor=\"let item of collItems; let i = index\" #collectionItem\n            [id]=\"this.buildIdPrefix(i) + i\" class=\"form-group\">\n          <div class=\"collection-title\">\n            <div class=\"float-left\">\n              <legend class=\"govuk-fieldset__legend\">\n                <label [for]=\"item.prefix + i\"><h3 class=\"heading-h3\">{{itemLabel(i) | rpxTranslate}}</h3></label>\n              </legend>\n            </div>\n            <div class=\"float-right\">\n              <button class=\"button button-secondary\" type=\"button\" (click)=\"openModal(i)\"\n                      [disabled]=\"isNotAuthorisedToDelete(i)\"\n                      attr.aria-label=\"Remove {{ itemLabel(i) }}\">{{'Remove' | rpxTranslate}}</button>\n            </div>\n          </div>\n          <ccd-field-write [caseField]=\"item.caseField\"\n                          [caseFields]=\"caseFields\"\n                          [formGroup]=\"formGroup\"\n                          [parent]=\"item.container\"\n                          [idPrefix]=\"item.prefix\"\n                          [hidden]=\"item.caseField.hidden\"\n                          [isExpanded]=\"isExpanded\"\n                          [isInSearchBlock]=\"isInSearchBlock\">\n          </ccd-field-write>\n        </div>\n      </fieldset>\n    </div>\n\n    <button class=\"button write-collection-add-item__bottom\" type=\"button\" (click)=\"addItem(false)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\" *ngIf=\"caseField.value && caseField.value.length\">{{'Add new' | rpxTranslate }}</button>\n\n  </div>\n\n</div>\n", styles: [".collection-field-table tr:first-child>td{padding-top:0}.collection-field-table tr:last-child>td{border-bottom:none}.collection-field-table td.collection-actions{width:1px;white-space:nowrap}.error-spacing{margin-top:10px}.collection-title{height:51px}.float-left{float:left;padding-top:8px}.float-right{float:right}.complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th,.complex-panel .complex-panel-table>tbody>tr:last-child>td{border-bottom:none}.complex-panel .complex-panel-simple-field th{padding-left:5px;width:295px}.complex-panel .complex-panel-compound-field td{padding:5px}.collection-indicator{border-left:solid 5px #b1b4b6}\n"] }]
+        args: [{ selector: 'ccd-write-collection-field', template: "<div class=\"form-group\" [id]=\"id()\">\n\n  <div class=\"panel collection-indicator\">\n\n    <h2 class=\"heading-h2 error-spacing\">\n      {{(caseField | ccdFieldLabel)}}\n    </h2>\n    <button class=\"button write-collection-add-item__top\" type=\"button\" (click)=\"addItem(true)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\">{{'Add new' | rpxTranslate}}</button>\n    <h2 class=\"heading-h2 error-spacing\" *ngIf=\"caseField.hint_text || formArray.errors\">\n      <span *ngIf=\"caseField.hint_text\" class=\"form-hint\">\n      <ccd-markdown [content]=\"caseField.hint_text\"></ccd-markdown>\n      </span>\n      <span *ngIf=\"formArray.errors\" class=\"error-message\">\n        {{(formArray.errors | ccdFirstError:caseField.label)}}\n      </span>\n    </h2>\n\n    <div class=\"form-group\" [hidden]=\"caseField.hidden\" *ngIf=\"caseField.value && caseField.value.length\">\n      <fieldset class=\"govuk-fieldset\">\n        <div *ngFor=\"let item of collItems; let i = index\" #collectionItem\n            [id]=\"this.buildIdPrefix(i) + i\" class=\"form-group\">\n          <div class=\"collection-title\">\n            <div class=\"float-left\">\n              <legend class=\"govuk-fieldset__legend\">\n                <label [for]=\"item.prefix + i\"><h3 class=\"heading-h3\">{{itemLabel(i) | rpxTranslate}}</h3></label>\n              </legend>\n            </div>\n            <div class=\"float-right\">\n              <button class=\"button button-secondary\" type=\"button\" (click)=\"openModal(i)\"\n                      [disabled]=\"isNotAuthorisedToDelete(i)\"\n                      attr.aria-label=\"Remove {{ itemLabel(i) }}\">{{'Remove' | rpxTranslate}}</button>\n            </div>\n          </div>\n          <ccd-field-write [caseField]=\"item.caseField\"\n                          [caseFields]=\"caseFields\"\n                          [formGroup]=\"formGroup\"\n                          [parent]=\"item.container\"\n                          [idPrefix]=\"item.prefix\"\n                          [hidden]=\"item.caseField.hidden\"\n                          [isExpanded]=\"isExpanded\"\n                          [isInSearchBlock]=\"isInSearchBlock\">\n          </ccd-field-write>\n        </div>\n      </fieldset>\n    </div>\n\n    <button class=\"button write-collection-add-item__bottom\" type=\"button\" (click)=\"addItem(false)\" [disabled]=\"isNotAuthorisedToCreate() || isSearchFilter()\" *ngIf=\"caseField.value && caseField.value.length\">{{'Add new' | rpxTranslate }}</button>\n\n  </div>\n\n</div>\n", styles: [".collection-field-table tr:first-child>td{padding-top:0}.collection-field-table tr:last-child>td{border-bottom:none}.collection-field-table td.collection-actions{width:1px;white-space:nowrap}.error-spacing{margin-top:10px}.collection-title{height:51px}.float-left{float:left;padding-top:8px}.float-right{float:right}.complex-panel{margin:13px 0;border:1px solid #bfc1c3}.complex-panel .complex-panel-title{background-color:#dee0e2;padding:5px 5px 2px;border-bottom:1px solid #bfc1c3;display:block;color:#0b0c0c;font-family:nta,Arial,sans-serif;font-weight:700;text-transform:none;font-size:16px;line-height:1.25}@media (min-width: 641px){.complex-panel .complex-panel-title{font-size:19px;line-height:1.3157894737}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th,.complex-panel .complex-panel-table>tbody>tr:last-child>td{border-bottom:none}.complex-panel .complex-panel-simple-field th{padding-left:5px;width:295px}.complex-panel .complex-panel-compound-field td{padding:5px}.collection-indicator{border-left:solid 5px #b1b4b6}\n"] }]
     }], () => [{ type: i1$3.MatLegacyDialog }, { type: i2.ScrollToService }, { type: ProfileNotifier }, { type: i0.ChangeDetectorRef }], { caseFields: [{
             type: Input
         }], items: [{
@@ -15072,7 +15071,7 @@ class FileUploadStateService {
 const _c0$R = ["fileInput"];
 const _c1$l = a0 => ({ "form-group-error bottom-30": a0 });
 function WriteDocumentFieldComponent_span_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 12)(1, "markdown");
+    i0.ɵɵelementStart(0, "span", 15)(1, "markdown");
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd()();
@@ -15082,7 +15081,7 @@ function WriteDocumentFieldComponent_span_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, ctx_r1.caseField.hint_text));
 } }
 function WriteDocumentFieldComponent_ccd_read_document_field_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "ccd-read-document-field", 13);
+    i0.ɵɵelement(0, "ccd-read-document-field", 16);
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("caseField", ctx_r1.caseField);
@@ -15094,6 +15093,7 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
     dialog;
     fileUploadStateService;
     jurisdictionService;
+    rpxTranslationService;
     static DOCUMENT_URL = 'document_url';
     static DOCUMENT_BINARY_URL = 'document_binary_url';
     static DOCUMENT_FILENAME = 'document_filename';
@@ -15104,6 +15104,7 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
     static UPLOAD_ERROR_INVALID_FORMAT = 'Document format is not supported';
     static UPLOAD_WAITING_FILE_STATUS = 'Uploading...';
     static ERROR_UPLOADING_FILE = 'Error Uploading File';
+    static NO_FILE_CHOSED = 'No file chosen';
     fileInput;
     selectedFile;
     valid = true;
@@ -15115,12 +15116,13 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
     dialogSubscription;
     caseNotifierSubscription;
     jurisdictionSubs;
+    fileName = WriteDocumentFieldComponent.NO_FILE_CHOSED;
     uploadedDocument;
     dialogConfig;
     secureModeOn;
     jurisdictionId;
     caseTypeId;
-    constructor(appConfig, caseNotifier, documentManagement, dialog, fileUploadStateService, jurisdictionService) {
+    constructor(appConfig, caseNotifier, documentManagement, dialog, fileUploadStateService, jurisdictionService, rpxTranslationService) {
         super();
         this.appConfig = appConfig;
         this.caseNotifier = caseNotifier;
@@ -15128,9 +15130,15 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
         this.dialog = dialog;
         this.fileUploadStateService = fileUploadStateService;
         this.jurisdictionService = jurisdictionService;
+        this.rpxTranslationService = rpxTranslationService;
     }
     ngOnInit() {
         this.secureModeOn = this.appConfig.getDocumentSecureMode();
+        if (this.rpxTranslationService.language === 'cy') {
+            this.rpxTranslationService.getTranslation$(WriteDocumentFieldComponent.NO_FILE_CHOSED).subscribe((translation) => {
+                this.fileName = translation;
+            });
+        }
         if (this.secureModeOn) {
             this.subscribeToCaseDetails();
         }
@@ -15189,6 +15197,7 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
         }
         else if (fileInput.target.files[0]) {
             this.selectedFile = fileInput.target.files[0];
+            this.fileName = fileInput.target.files[0].name;
             this.displayFileUploadMessages(WriteDocumentFieldComponent.UPLOAD_WAITING_FILE_STATUS);
             const documentUpload = this.buildDocumentUploadData(this.selectedFile);
             this.fileUploadStateService.setUploadInProgress(true);
@@ -15423,13 +15432,13 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
         this.valid = false;
         this.fileUploadStateService.setUploadInProgress(false);
     }
-    static ɵfac = function WriteDocumentFieldComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || WriteDocumentFieldComponent)(i0.ɵɵdirectiveInject(AbstractAppConfig), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(DocumentManagementService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(FileUploadStateService), i0.ɵɵdirectiveInject(JurisdictionService)); };
+    static ɵfac = function WriteDocumentFieldComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || WriteDocumentFieldComponent)(i0.ɵɵdirectiveInject(AbstractAppConfig), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(DocumentManagementService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(FileUploadStateService), i0.ɵɵdirectiveInject(JurisdictionService), i0.ɵɵdirectiveInject(i1.RpxTranslationService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: WriteDocumentFieldComponent, selectors: [["ccd-write-document-field"]], viewQuery: function WriteDocumentFieldComponent_Query(rf, ctx) { if (rf & 1) {
             i0.ɵɵviewQuery(_c0$R, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.fileInput = _t.first);
-        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 20, vars: 23, consts: [["fileInput", ""], [1, "form-group", 3, "ngClass"], [3, "for"], [1, "form-label"], ["class", "form-hint", 4, "ngIf"], ["role", "alert", "tabindex", "0", 1, "error-message", 3, "hidden"], [3, "caseField", 4, "ngIf"], [2, "position", "relative"], [3, "click", "keyup", "id"], ["type", "file", 1, "form-control", "bottom-30", 3, "keydown.Tab", "change", "id", "accept"], [1, "form-group", "bottom-30"], ["type", "button", "aria-label", "Cancel upload", 1, "button", "button-secondary", 3, "click", "disabled"], [1, "form-hint"], [3, "caseField"]], template: function WriteDocumentFieldComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 27, vars: 28, consts: [["fileInput", ""], [1, "form-group", 3, "ngClass"], [3, "for"], [1, "form-label"], ["class", "form-hint", 4, "ngIf"], ["role", "alert", "tabindex", "0", 1, "error-message", 3, "hidden"], [3, "caseField", 4, "ngIf"], [2, "position", "relative"], [3, "click", "keyup", "id"], [1, "upload-file-container"], ["aria-label", "Choose file", 1, "button", "button-secondary", "input-label", 3, "for"], [1, "form-control", "bottom-30"], ["type", "file", 1, "input-upload-file", 3, "keydown.Tab", "change", "id", "accept"], [1, "form-group", "bottom-30"], ["type", "button", "aria-label", "Cancel upload", 1, "button", "button-secondary", 3, "click", "disabled"], [1, "form-hint"], [3, "caseField"]], template: function WriteDocumentFieldComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "div", 1)(1, "label", 2)(2, "span", 3);
             i0.ɵɵpipe(3, "ccdFieldLabel");
@@ -15447,49 +15456,62 @@ class WriteDocumentFieldComponent extends AbstractFieldWriteComponent {
             i0.ɵɵelementStart(12, "div", 7)(13, "div", 8);
             i0.ɵɵlistener("click", function WriteDocumentFieldComponent_Template_div_click_13_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.fileSelectEvent()); })("keyup", function WriteDocumentFieldComponent_Template_div_keyup_13_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.fileSelectEvent()); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(14, "input", 9, 0);
-            i0.ɵɵlistener("keydown.Tab", function WriteDocumentFieldComponent_Template_input_keydown_Tab_14_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.fileValidationsOnTab()); })("change", function WriteDocumentFieldComponent_Template_input_change_14_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.fileChangeEvent($event, ctx.caseField.field_type.regular_expression)); });
+            i0.ɵɵelementStart(14, "div", 9)(15, "label", 10);
+            i0.ɵɵtext(16);
+            i0.ɵɵpipe(17, "rpxTranslate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(18, "span", 11)(19, "span");
+            i0.ɵɵtext(20);
             i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(16, "div", 10)(17, "button", 11);
-            i0.ɵɵlistener("click", function WriteDocumentFieldComponent_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.cancelUpload()); });
-            i0.ɵɵtext(18);
-            i0.ɵɵpipe(19, "rpxTranslate");
+            i0.ɵɵelementStart(21, "input", 12, 0);
+            i0.ɵɵlistener("keydown.Tab", function WriteDocumentFieldComponent_Template_input_keydown_Tab_21_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.fileValidationsOnTab()); })("change", function WriteDocumentFieldComponent_Template_input_change_21_listener($event) { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.fileChangeEvent($event, ctx.caseField.field_type.regular_expression)); });
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(23, "div", 13)(24, "button", 14);
+            i0.ɵɵlistener("click", function WriteDocumentFieldComponent_Template_button_click_24_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.cancelUpload()); });
+            i0.ɵɵtext(25);
+            i0.ɵɵpipe(26, "rpxTranslate");
             i0.ɵɵelementEnd()();
         } if (rf & 2) {
-            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(21, _c1$l, !ctx.valid));
+            i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(26, _c1$l, !ctx.valid));
             i0.ɵɵadvance();
             i0.ɵɵproperty("for", ctx.id());
             i0.ɵɵadvance();
-            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(3, 13, ctx.caseField));
+            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(3, 16, ctx.caseField));
             i0.ɵɵadvance(2);
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(5, 15, ctx.caseField));
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(5, 18, ctx.caseField));
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.caseField.hint_text);
             i0.ɵɵadvance();
             i0.ɵɵproperty("hidden", !(ctx.fileUploadMessages && !ctx.valid));
             i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(9, 17, ctx.fileUploadMessages), " ");
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(9, 20, ctx.fileUploadMessages), " ");
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("ngIf", ctx.caseField);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("id", ctx.createElementId("fileInputWrapper"));
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("for", ctx.id());
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(17, 22, "Choose file"), " ");
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate(ctx.fileName);
             i0.ɵɵadvance();
             i0.ɵɵpropertyInterpolate("accept", ctx.caseField.field_type.regular_expression);
             i0.ɵɵproperty("id", ctx.id());
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("disabled", !ctx.isUploadInProgress());
             i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(19, 19, "Cancel upload"));
-        } }, encapsulation: 2 });
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(26, 24, "Cancel upload"), " ");
+        } }, styles: [".input-upload-file[_ngcontent-%COMP%]{width:100%;display:none}.upload-file-container[_ngcontent-%COMP%]{display:flex;align-items:baseline}.input-label[_ngcontent-%COMP%]{width:8rem}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group, .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group, .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field{margin-left:15px;padding-left:15px}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group:not(.form-group-error), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group:not(.form-group-error), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field:not(.form-group-error){border-left:solid 5px #b1b4b6}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>.form-group select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>.form-group textarea:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group textarea:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field textarea:not(.inline-block){display:block}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(WriteDocumentFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-write-document-field', template: "<div class=\"form-group\" [ngClass]=\"{'form-group-error bottom-30': !valid}\">\n  <label [for]=\"id()\">\n    <span class=\"form-label\" attr.aria-label=\"{{caseField | ccdFieldLabel}}\">{{(caseField | ccdFieldLabel)}}</span>\n  </label>\n  <span class=\"form-hint\" *ngIf=\"caseField.hint_text\">\n    <markdown>{{ caseField.hint_text | rpxTranslate }}</markdown>\n  </span>\n  <span class=\"error-message\"\n        role=\"alert\"\n        tabindex=\"0\"\n        [hidden]=\"!(fileUploadMessages && !valid)\">\n    {{ fileUploadMessages | rpxTranslate }}\n  </span>\n  <div>\n    <!--<span *ngIf=\"getUploadedFileName()\" class=\"text-16\">File name: {{getUploadedFileName()}}</span>-->\n    <ccd-read-document-field *ngIf=\"caseField\" [caseField]=\"caseField\"></ccd-read-document-field>\n  </div>\n\n  <div style='position:relative'>\n    <div [id]=\"createElementId('fileInputWrapper')\" (click)=\"fileSelectEvent()\" (keyup)=\"fileSelectEvent()\"></div>\n    <input class=\"form-control bottom-30\" [id]=\"id()\" type=\"file\" (keydown.Tab)=\"fileValidationsOnTab()\" (change)=\"fileChangeEvent($event, caseField.field_type.regular_expression)\"\n           accept=\"{{caseField.field_type.regular_expression}}\" #fileInput/>\n  </div>\n</div>\n<div class=\"form-group bottom-30\">\n  <button class=\"button button-secondary\" type=\"button\" aria-label=\"Cancel upload\" (click)=\"cancelUpload()\" [disabled]=\"!isUploadInProgress()\">{{'Cancel upload' | rpxTranslate}}</button>\n</div>\n" }]
-    }], () => [{ type: AbstractAppConfig }, { type: CaseNotifier }, { type: DocumentManagementService }, { type: i1$3.MatLegacyDialog }, { type: FileUploadStateService }, { type: JurisdictionService }], { fileInput: [{
+        args: [{ selector: 'ccd-write-document-field', template: "<div class=\"form-group\" [ngClass]=\"{'form-group-error bottom-30': !valid}\">\n  <label [for]=\"id()\">\n    <span class=\"form-label\" attr.aria-label=\"{{caseField | ccdFieldLabel}}\">{{(caseField | ccdFieldLabel)}}</span>\n  </label>\n  <span class=\"form-hint\" *ngIf=\"caseField.hint_text\">\n    <markdown>{{ caseField.hint_text | rpxTranslate }}</markdown>\n  </span>\n  <span class=\"error-message\"\n        role=\"alert\"\n        tabindex=\"0\"\n        [hidden]=\"!(fileUploadMessages && !valid)\">\n    {{ fileUploadMessages | rpxTranslate }}\n  </span>\n  <div>\n    <!--<span *ngIf=\"getUploadedFileName()\" class=\"text-16\">File name: {{getUploadedFileName()}}</span>-->\n    <ccd-read-document-field *ngIf=\"caseField\" [caseField]=\"caseField\"></ccd-read-document-field>\n  </div>\n\n  <div style=\"position:relative\">\n    <div\n      [id]=\"createElementId('fileInputWrapper')\"\n      (click)=\"fileSelectEvent()\"\n      (keyup)=\"fileSelectEvent()\"\n    ></div>\n    <div class=\"upload-file-container\">\n      <label\n        [for]=\"id()\"\n        class=\"button button-secondary input-label\"\n        aria-label=\"Choose file\">\n        {{'Choose file' | rpxTranslate}}\n      </label>\n      <span class=\"form-control bottom-30\">\n        <span>{{fileName}}</span>\n      </span>\n    </div>\n    <input\n      [id]=\"id()\"\n      type=\"file\"\n      class=\"input-upload-file\"\n      (keydown.Tab)=\"fileValidationsOnTab()\"\n      (change)=\"fileChangeEvent($event, caseField.field_type.regular_expression)\"\n      accept=\"{{caseField.field_type.regular_expression}}\"\n      #fileInput/>\n  </div>\n</div>\n<div class=\"form-group bottom-30\">\n  <button\n    class=\"button button-secondary\"\n    type=\"button\"\n    aria-label=\"Cancel upload\"\n    (click)=\"cancelUpload()\"\n    [disabled]=\"!isUploadInProgress()\">\n    {{'Cancel upload' | rpxTranslate}}\n  </button>\n</div>\n", styles: [".input-upload-file{width:100%;display:none}.upload-file-container{display:flex;align-items:baseline}.input-label{width:8rem}.form :host::ng-deep .grey-bar>*>.form-group,.form :host::ng-deep .grey-bar>*>*>.form-group,.form :host::ng-deep .grey-bar>*>dl.case-field{margin-left:15px;padding-left:15px}.form :host::ng-deep .grey-bar>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>dl.case-field:not(.form-group-error){border-left:solid 5px #b1b4b6}.form :host::ng-deep .grey-bar>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field input:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field select:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field textarea:not(.inline-block){display:block}\n"] }]
+    }], () => [{ type: AbstractAppConfig }, { type: CaseNotifier }, { type: DocumentManagementService }, { type: i1$3.MatLegacyDialog }, { type: FileUploadStateService }, { type: JurisdictionService }, { type: i1.RpxTranslationService }], { fileInput: [{
             type: ViewChild,
             args: ['fileInput', { static: false }]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteDocumentFieldComponent, { className: "WriteDocumentFieldComponent", filePath: "lib/shared/components/palette/document/write-document-field.component.ts", lineNumber: 23 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteDocumentFieldComponent, { className: "WriteDocumentFieldComponent", filePath: "lib/shared/components/palette/document/write-document-field.component.ts", lineNumber: 25 }); })();
 
 class DynamicListPipe {
     static EMPTY = '';
@@ -15734,7 +15756,7 @@ class MarkdownComponent {
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵproperty("data", i0.ɵɵpipeBind1(3, 3, i0.ɵɵpipeBind1(2, 1, ctx.content)));
-        } }, dependencies: [i1$4.MarkdownComponent, i1.RpxTranslatePipe, CaseReferencePipe], encapsulation: 2, changeDetection: 0 });
+        } }, dependencies: [i2$1.MarkdownComponent, i1.RpxTranslatePipe, CaseReferencePipe], encapsulation: 2, changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MarkdownComponent, [{
         type: Component,
@@ -20866,10 +20888,11 @@ class QueryListItem {
     createdBy;
     parentId;
     children = [];
+    messageIndexInParent = null;
     get lastSubmittedMessage() {
         const getLastSubmittedMessage = (item) => {
             let lastSubmittedMessage = item;
-            if (item.children && item.children.length > 0) {
+            if (item.children && item.children.length > 1) {
                 for (const child of item.children) {
                     const childLastSubmittedMessage = getLastSubmittedMessage(child);
                     if (childLastSubmittedMessage.createdOn > lastSubmittedMessage.createdOn) {
@@ -20885,20 +20908,47 @@ class QueryListItem {
         return this.lastSubmittedMessage.name;
     }
     get lastSubmittedDate() {
-        return new Date(this.lastSubmittedMessage.createdOn);
+        const childrenCount = this.children.length;
+        if (childrenCount <= 1) {
+            return new Date(this.lastSubmittedMessage.createdOn);
+        }
+        let index;
+        if (childrenCount > 1) {
+            index = childrenCount % 2 === 0 ? childrenCount - 1 : childrenCount - 2;
+        }
+        return new Date(this.children[index].createdOn);
     }
     get lastResponseBy() {
         return this.children?.length > 0 ? this.lastSubmittedMessage.name : '';
     }
     get lastResponseDate() {
-        return this.children?.length > 0 ? new Date(this.lastSubmittedMessage.createdOn) : null;
+        const childrenCount = this.children.length;
+        if (childrenCount === 0) {
+            return null;
+        }
+        let index;
+        if (childrenCount === 1) {
+            index = 0;
+        }
+        else {
+            index = childrenCount % 2 === 1 ? childrenCount - 1 : childrenCount - 2;
+        }
+        return new Date(this.children[index].createdOn);
     }
     get responseStatus() {
-        if (this.children?.length > 0) {
+        // Child logic (position-based)
+        if (this.messageIndexInParent !== null) {
+            return this.messageIndexInParent % 2 === 0
+                ? QueryItemResponseStatus.RESPONDED
+                : QueryItemResponseStatus.AWAITING;
+        }
+        // Parent logic (children count)
+        if (this.children && this.children.length > 0) {
             return this.children.length % 2 === 1
                 ? QueryItemResponseStatus.RESPONDED
                 : QueryItemResponseStatus.AWAITING;
         }
+        // No children — still awaiting
         return QueryItemResponseStatus.AWAITING;
     }
 }
@@ -20915,12 +20965,16 @@ class QueryListData {
         this.queries = parentMessages.map((message) => this.buildQueryListItem(message, caseQueriesCollection.caseMessages));
     }
     buildQueryListItem(message, allMessages) {
+        const childrenMessages = allMessages.filter((childMessage) => childMessage.value.parentId === message.value.id);
+        const children = childrenMessages.map((childMessage, index) => {
+            const childItem = this.buildQueryListItem(childMessage, allMessages);
+            childItem.messageIndexInParent = index; // Assign index for status logic
+            return childItem;
+        });
         const queryListItem = new QueryListItem();
         Object.assign(queryListItem, {
             ...message.value,
-            children: allMessages
-                .filter((childMessage) => childMessage.value.parentId === message.value.id)
-                .map((childMessage) => this.buildQueryListItem(childMessage, allMessages))
+            children
         });
         return queryListItem;
     }
@@ -21010,8 +21064,8 @@ class QueryManagementUtils {
         type: Injectable
     }], null, null); })();
 
-function QueryCheckYourAnswersComponent_div_2_li_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "li")(1, "a", 25);
+function QueryCheckYourAnswersComponent_div_0_div_2_li_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "li")(1, "a", 26);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd()();
@@ -21022,24 +21076,24 @@ function QueryCheckYourAnswersComponent_div_2_li_6_Template(rf, ctx) { if (rf &
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, errorMessage_r2.description));
 } }
-function QueryCheckYourAnswersComponent_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 20)(1, "h2", 21);
+function QueryCheckYourAnswersComponent_div_0_div_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 21)(1, "h2", 22);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "div", 22)(5, "ul", 23);
-    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_2_li_6_Template, 4, 4, "li", 24);
+    i0.ɵɵelementStart(4, "div", 23)(5, "ul", 24);
+    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_0_div_2_li_6_Template, 4, 4, "li", 25);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 2, "There is a problem"), " ");
     i0.ɵɵadvance(4);
     i0.ɵɵproperty("ngForOf", ctx_r2.errorMessages);
 } }
-function QueryCheckYourAnswersComponent_ng_container_3_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "div", 26);
+    i0.ɵɵelementStart(1, "div", 27);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -21048,7 +21102,7 @@ function QueryCheckYourAnswersComponent_ng_container_3_Template(rf, ctx) { if (r
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, "Raise a query"));
 } }
-function QueryCheckYourAnswersComponent_ng_container_5_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_ng_container_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
@@ -21057,16 +21111,16 @@ function QueryCheckYourAnswersComponent_ng_container_5_Template(rf, ctx) { if (r
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 1, "Review query response details"), " ");
 } }
-function QueryCheckYourAnswersComponent_ng_template_6_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_ng_template_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
     i0.ɵɵpipe(1, "rpxTranslate");
 } if (rf & 2) {
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(1, 1, "Review query details"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_10_a_8_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_10_a_8_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_10_a_8_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(0, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_10_a_8_Template_a_click_0_listener() { i0.ɵɵrestoreView(_r4); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
     i0.ɵɵelementEnd();
@@ -21074,28 +21128,28 @@ function QueryCheckYourAnswersComponent_dl_10_a_8_Template(rf, ctx) { if (rf & 1
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(2, 1, "Change"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "dl", 11)(1, "div", 12)(2, "dt", 13);
+function QueryCheckYourAnswersComponent_div_0_dl_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "dl", 12)(1, "div", 13)(2, "dt", 14);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "dd", 14);
+    i0.ɵɵelementStart(5, "dd", 15);
     i0.ɵɵtext(6);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "dd", 15);
-    i0.ɵɵtemplate(8, QueryCheckYourAnswersComponent_dl_10_a_8_Template, 3, 3, "a", 27);
+    i0.ɵɵelementStart(7, "dd", 16);
+    i0.ɵɵtemplate(8, QueryCheckYourAnswersComponent_div_0_dl_10_a_8_Template, 3, 3, "a", 28);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    let tmp_3_0;
-    const ctx_r2 = i0.ɵɵnextContext();
+    let tmp_4_0;
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? "Submitted query" : i0.ɵɵpipeBind1(4, 3, "Query subject"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? ctx_r2.queryItem.subject : (tmp_3_0 = ctx_r2.formGroup.get("subject")) == null ? null : tmp_3_0.value, " ");
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? ctx_r2.queryItem.subject : (tmp_4_0 = ctx_r2.formGroup.get("subject")) == null ? null : tmp_4_0.value, " ");
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY);
 } }
-function QueryCheckYourAnswersComponent_dl_22_ng_container_6_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_ng_container_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "rpxTranslate");
@@ -21104,89 +21158,89 @@ function QueryCheckYourAnswersComponent_dl_22_ng_container_6_Template(rf, ctx) {
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind3(2, 1, "Is the query hearing related?", null, "Yes"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_22_ng_template_7_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_ng_template_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
     i0.ɵɵpipe(1, "rpxTranslate");
 } if (rf & 2) {
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind3(1, 1, "Is the query hearing related?", null, "No"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_22_div_13_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_div_13_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 12)(1, "dt", 13);
+    i0.ɵɵelementStart(0, "div", 13)(1, "dt", 14);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "dd", 14);
+    i0.ɵɵelementStart(4, "dd", 15);
     i0.ɵɵtext(5);
     i0.ɵɵpipe(6, "date");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "dd", 15)(8, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_22_div_13_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(7, "dd", 16)(8, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_22_div_13_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r6); const ctx_r2 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(9);
     i0.ɵɵpipe(10, "rpxTranslate");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
-    let tmp_5_0;
-    const ctx_r2 = i0.ɵɵnextContext(2);
+    let tmp_6_0;
+    const ctx_r2 = i0.ɵɵnextContext(3);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY ? "What is the date of the hearing?" : i0.ɵɵpipeBind1(3, 3, "What is the date of the hearing your query is related to?"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(6, 5, (tmp_5_0 = ctx_r2.formGroup.get("hearingDate")) == null ? null : tmp_5_0.value, "dd MMM yyyy"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(6, 5, (tmp_6_0 = ctx_r2.formGroup.get("hearingDate")) == null ? null : tmp_6_0.value, "dd MMM yyyy"), " ");
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(10, 8, "Change"), " ");
 } }
-function QueryCheckYourAnswersComponent_dl_22_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_22_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "dl", 11)(1, "div", 12)(2, "dt", 13);
+    i0.ɵɵelementStart(0, "dl", 12)(1, "div", 13)(2, "dt", 14);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "dd", 14);
-    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_dl_22_ng_container_6_Template, 3, 5, "ng-container", 7)(7, QueryCheckYourAnswersComponent_dl_22_ng_template_7_Template, 2, 5, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵelementStart(5, "dd", 15);
+    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_0_dl_22_ng_container_6_Template, 3, 5, "ng-container", 8)(7, QueryCheckYourAnswersComponent_div_0_dl_22_ng_template_7_Template, 2, 5, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(9, "dd", 15)(10, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_22_Template_a_click_10_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(9, "dd", 16)(10, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_22_Template_a_click_10_listener() { i0.ɵɵrestoreView(_r5); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(11);
     i0.ɵɵpipe(12, "rpxTranslate");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵtemplate(13, QueryCheckYourAnswersComponent_dl_22_div_13_Template, 11, 10, "div", 28);
+    i0.ɵɵtemplate(13, QueryCheckYourAnswersComponent_div_0_dl_22_div_13_Template, 11, 10, "div", 29);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    let tmp_4_0;
-    let tmp_7_0;
+    let tmp_5_0;
+    let tmp_8_0;
     const isHearingRelatedFalse_r7 = i0.ɵɵreference(8);
-    const ctx_r2 = i0.ɵɵnextContext();
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(4, 5, "Is the query hearing related?"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵproperty("ngIf", ((tmp_4_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_4_0.value) === true)("ngIfElse", isHearingRelatedFalse_r7);
+    i0.ɵɵproperty("ngIf", ((tmp_5_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_5_0.value) === true)("ngIfElse", isHearingRelatedFalse_r7);
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(12, 7, "Change"), " ");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("ngIf", (tmp_7_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_7_0.value);
+    i0.ɵɵproperty("ngIf", (tmp_8_0 = ctx_r2.formGroup.get("isHearingRelated")) == null ? null : tmp_8_0.value);
 } }
-function QueryCheckYourAnswersComponent_dl_23_ccd_query_attachments_read_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "ccd-query-attachments-read", 31);
+function QueryCheckYourAnswersComponent_div_0_dl_23_ccd_query_attachments_read_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ccd-query-attachments-read", 32);
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext(2);
+    const ctx_r2 = i0.ɵɵnextContext(3);
     i0.ɵɵproperty("attachments", ctx_r2.attachments);
 } }
-function QueryCheckYourAnswersComponent_dl_23_Template(rf, ctx) { if (rf & 1) {
+function QueryCheckYourAnswersComponent_div_0_dl_23_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "dl", 11)(1, "div", 12)(2, "dt", 13);
+    i0.ɵɵelementStart(0, "dl", 12)(1, "div", 13)(2, "dt", 14);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "dd", 29);
-    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_dl_23_ccd_query_attachments_read_6_Template, 1, 1, "ccd-query-attachments-read", 30);
+    i0.ɵɵelementStart(5, "dd", 30);
+    i0.ɵɵtemplate(6, QueryCheckYourAnswersComponent_div_0_dl_23_ccd_query_attachments_read_6_Template, 1, 1, "ccd-query-attachments-read", 31);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "dd", 15)(8, "a", 16);
-    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_dl_23_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵelementStart(7, "dd", 16)(8, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_dl_23_Template_a_click_8_listener() { i0.ɵɵrestoreView(_r8); const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.goBack()); });
     i0.ɵɵtext(9);
     i0.ɵɵpipe(10, "rpxTranslate");
     i0.ɵɵelementEnd()()()();
 } if (rf & 2) {
-    const ctx_r2 = i0.ɵɵnextContext();
+    const ctx_r2 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY ? "Upload a file to the query" : i0.ɵɵpipeBind1(4, 3, "Document attached"), " ");
     i0.ɵɵadvance(3);
@@ -21194,6 +21248,74 @@ function QueryCheckYourAnswersComponent_dl_23_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(10, 5, "Change"), " ");
 } }
+function QueryCheckYourAnswersComponent_div_0_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 3)(1, "div", 4);
+    i0.ɵɵtemplate(2, QueryCheckYourAnswersComponent_div_0_div_2_Template, 7, 4, "div", 5)(3, QueryCheckYourAnswersComponent_div_0_ng_container_3_Template, 4, 3, "ng-container", 6);
+    i0.ɵɵelementStart(4, "h1", 7);
+    i0.ɵɵtemplate(5, QueryCheckYourAnswersComponent_div_0_ng_container_5_Template, 3, 3, "ng-container", 8)(6, QueryCheckYourAnswersComponent_div_0_ng_template_6_Template, 2, 3, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 9);
+    i0.ɵɵelement(9, "ccd-query-case-details-header", 10);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(10, QueryCheckYourAnswersComponent_div_0_dl_10_Template, 9, 5, "dl", 11);
+    i0.ɵɵelementStart(11, "dl", 12)(12, "div", 13)(13, "dt", 14);
+    i0.ɵɵtext(14);
+    i0.ɵɵpipe(15, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "dd", 15);
+    i0.ɵɵtext(17);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(18, "dd", 16)(19, "a", 17);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_a_click_19_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵtext(20);
+    i0.ɵɵpipe(21, "rpxTranslate");
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵtemplate(22, QueryCheckYourAnswersComponent_div_0_dl_22_Template, 14, 9, "dl", 11)(23, QueryCheckYourAnswersComponent_div_0_dl_23_Template, 11, 7, "dl", 11);
+    i0.ɵɵelement(24, "br");
+    i0.ɵɵelementStart(25, "div")(26, "button", 18);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_button_click_26_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goBack()); });
+    i0.ɵɵtext(27);
+    i0.ɵɵpipe(28, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(29, "button", 19);
+    i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_div_0_Template_button_click_29_listener() { i0.ɵɵrestoreView(_r1); const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.submit()); });
+    i0.ɵɵtext(30);
+    i0.ɵɵpipe(31, "rpxTranslate");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelement(32, "ccd-query-event-completion", 20);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_9_0;
+    const defaultCheckYourAnswersTitle_r9 = i0.ɵɵreference(7);
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngIf", ctx_r2.errorMessages.length > 0);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND)("ngIfElse", defaultCheckYourAnswersTitle_r9);
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("caseDetails", ctx_r2.caseDetails);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext !== ctx_r2.queryCreateContextEnum.FOLLOWUP);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.RESPOND ? "Response detail" : i0.ɵɵpipeBind1(15, 14, "Query detail"), " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", (tmp_9_0 = ctx_r2.formGroup.get("body")) == null ? null : tmp_9_0.value, " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(21, 16, "Change"), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngIf", ctx_r2.queryCreateContext === ctx_r2.queryCreateContextEnum.NEW_QUERY);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", ctx_r2.formGroup.get("attachments").value.length > 0);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(28, 18, "Previous"), " ");
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(31, 20, "Submit"), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("eventCompletionParams", ctx_r2.eventCompletionParams);
+} }
 class QueryCheckYourAnswersComponent {
     route;
     router;
@@ -21216,6 +21338,7 @@ class QueryCheckYourAnswersComponent {
     eventData = null;
     backClicked = new EventEmitter();
     querySubmitted = new EventEmitter();
+    callbackConfirmationMessage = new EventEmitter();
     caseViewTrigger;
     caseDetails;
     queryId;
@@ -21229,6 +21352,8 @@ class QueryCheckYourAnswersComponent {
     attachments;
     errorMessages = [];
     filteredTasks = [];
+    readyToSubmit;
+    isSubmitting = false;
     constructor(route, router, casesService, caseNotifier, workAllocationService, sessionStorageService, qualifyingQuestionService) {
         this.route = route;
         this.router = router;
@@ -21265,13 +21390,18 @@ class QueryCheckYourAnswersComponent {
                         else {
                             this.filteredTasks = response.tasks;
                         }
+                        this.readyToSubmit = true;
                     }
                 },
                 error: (error) => {
                     console.error('Error in searchTasksSubscription:', error);
+                    this.readyToSubmit = false;
                 }
             });
         }
+        else {
+            this.readyToSubmit = true;
+        }
     }
     ngOnDestroy() {
         this.createEventSubscription?.unsubscribe();
@@ -21281,6 +21411,9 @@ class QueryCheckYourAnswersComponent {
         this.backClicked.emit(true);
     }
     submit() {
+        if (this.isSubmitting) {
+            return;
+        }
         // Check if fieldId is null or undefined
         if (!this.fieldId) {
             console.error('Error: Field ID is missing. Cannot proceed with submission.');
@@ -21291,13 +21424,20 @@ class QueryCheckYourAnswersComponent {
                     fieldId: 'field-id'
                 }
             ];
+            window.scrollTo({ left: 0, top: 0, behavior: 'smooth' });
             return;
         }
         const data = this.generateCaseQueriesCollectionData();
         const createEvent$ = this.createEvent(data);
+        this.isSubmitting = true;
         if (this.queryCreateContext === QueryCreateContext.RESPOND) {
             if (this.filteredTasks?.length > 0) {
-                this.createEventSubscription = createEvent$.pipe(switchMap((createEventResponse) => this.workAllocationService.completeTask(this.filteredTasks[0].id, this.caseViewTrigger.name))).subscribe({
+                this.createEventSubscription = createEvent$.pipe(switchMap((createEventResponse) => {
+                    const confirmationBody = createEventResponse?.after_submit_callback_response?.confirmation_body;
+                    const confirmationHeader = createEventResponse?.after_submit_callback_response?.confirmation_header;
+                    this.callbackConfirmationMessage.emit({ body: confirmationBody, header: confirmationHeader });
+                    return this.workAllocationService.completeTask(this.filteredTasks[0].id, this.caseViewTrigger.name);
+                })).subscribe({
                     next: () => this.finaliseSubmission(),
                     error: (error) => this.handleError(error)
                 });
@@ -21311,11 +21451,19 @@ class QueryCheckYourAnswersComponent {
                         fieldId: 'field-id'
                     }
                 ];
+                this.isSubmitting = false;
+                window.scrollTo({ left: 0, top: 0, behavior: 'smooth' });
+                return;
             }
         }
         else {
             this.createEventSubscription = createEvent$.subscribe({
-                next: () => this.finaliseSubmission(),
+                next: (callbackResponse) => {
+                    this.finaliseSubmission();
+                    const confirmationBody = callbackResponse?.after_submit_callback_response?.confirmation_body;
+                    const confirmationHeader = callbackResponse?.after_submit_callback_response?.confirmation_header;
+                    this.callbackConfirmationMessage.emit({ body: confirmationBody, header: confirmationHeader });
+                },
                 error: (error) => this.handleError(error)
             });
         }
@@ -21335,9 +21483,11 @@ class QueryCheckYourAnswersComponent {
     finaliseSubmission() {
         this.querySubmitted.emit(true);
         this.qualifyingQuestionService.clearQualifyingQuestionSelection();
+        this.isSubmitting = false;
     }
     handleError(error) {
         console.error('Error in API calls:', error);
+        this.isSubmitting = false;
         this.router.navigate(['/', 'service-down']);
     }
     generateCaseQueriesCollectionData() {
@@ -21476,14 +21626,16 @@ class QueryCheckYourAnswersComponent {
         const candidateFields = this.eventData?.case_fields?.filter((field) => field.field_type.id === this.CASE_QUERIES_COLLECTION_ID &&
             field.field_type.type === this.FIELD_TYPE_COMPLEX &&
             field.display_context !== this.DISPLAY_CONTEXT_READONLY);
-        if (!candidateFields?.length)
+        if (!candidateFields?.length) {
             return undefined;
+        }
         const firstPageFields = this.eventData?.wizard_pages?.[0]?.wizard_page_fields;
-        if (!firstPageFields)
+        if (!firstPageFields) {
             return undefined;
+        }
         return candidateFields
             .map((field) => {
-            const wizardField = firstPageFields.find(f => f.case_field_id === field.id);
+            const wizardField = firstPageFields.find((f) => f.case_field_id === field.id);
             return { field, order: wizardField?.order ?? Number.MAX_SAFE_INTEGER };
         })
             .sort((a, b) => a.order - b.order)[0]?.field;
@@ -21499,77 +21651,15 @@ class QueryCheckYourAnswersComponent {
         }
     }
     static ɵfac = function QueryCheckYourAnswersComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || QueryCheckYourAnswersComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(CasesService), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(WorkAllocationService), i0.ɵɵdirectiveInject(SessionStorageService), i0.ɵɵdirectiveInject(QualifyingQuestionService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryCheckYourAnswersComponent, selectors: [["ccd-query-check-your-answers"]], inputs: { formGroup: "formGroup", queryItem: "queryItem", queryCreateContext: "queryCreateContext", eventData: "eventData" }, outputs: { backClicked: "backClicked", querySubmitted: "querySubmitted" }, decls: 33, vars: 22, consts: [["defaultCheckYourAnswersTitle", ""], ["isHearingRelatedFalse", ""], [1, "govuk-grid-row"], [1, "govuk-grid-column-two-thirds-from-desktop"], ["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], [4, "ngIf"], [1, "govuk-heading-l"], [4, "ngIf", "ngIfElse"], [1, "govuk-!-margin-bottom-4"], [3, "caseDetails"], ["class", "govuk-summary-list govuk-!-margin-bottom-0", 4, "ngIf"], [1, "govuk-summary-list", "govuk-!-margin-bottom-0"], [1, "govuk-summary-list__row"], [1, "govuk-summary-list__key"], [1, "govuk-summary-list__value"], [1, "govuk-summary-list__actions"], ["href", "javascript:void(0)", 1, "govuk-link", 3, "click"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", "govuk-!-margin-right-3", 3, "click"], ["data-module", "govuk-button", "type", "submit", 1, "govuk-button", 3, "click"], [3, "eventCompletionParams"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], [4, "ngFor", "ngForOf"], ["href", "javascript:void(0)", 1, "validation-error", 3, "id"], [1, "govuk-caption-l"], ["href", "javascript:void(0)", "class", "govuk-link", 3, "click", 4, "ngIf"], ["class", "govuk-summary-list__row", 4, "ngIf"], [1, "govuk-summary-list__value", "govuk-summary-list__value--documentAttached"], [3, "attachments", 4, "ngIf"], [3, "attachments"]], template: function QueryCheckYourAnswersComponent_Template(rf, ctx) { if (rf & 1) {
-            const _r1 = i0.ɵɵgetCurrentView();
-            i0.ɵɵelementStart(0, "div", 2)(1, "div", 3);
-            i0.ɵɵtemplate(2, QueryCheckYourAnswersComponent_div_2_Template, 7, 4, "div", 4)(3, QueryCheckYourAnswersComponent_ng_container_3_Template, 4, 3, "ng-container", 5);
-            i0.ɵɵelementStart(4, "h1", 6);
-            i0.ɵɵtemplate(5, QueryCheckYourAnswersComponent_ng_container_5_Template, 3, 3, "ng-container", 7)(6, QueryCheckYourAnswersComponent_ng_template_6_Template, 2, 3, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(8, "div", 8);
-            i0.ɵɵelement(9, "ccd-query-case-details-header", 9);
-            i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(10, QueryCheckYourAnswersComponent_dl_10_Template, 9, 5, "dl", 10);
-            i0.ɵɵelementStart(11, "dl", 11)(12, "div", 12)(13, "dt", 13);
-            i0.ɵɵtext(14);
-            i0.ɵɵpipe(15, "rpxTranslate");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(16, "dd", 14);
-            i0.ɵɵtext(17);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(18, "dd", 15)(19, "a", 16);
-            i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_Template_a_click_19_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.goBack()); });
-            i0.ɵɵtext(20);
-            i0.ɵɵpipe(21, "rpxTranslate");
-            i0.ɵɵelementEnd()()()();
-            i0.ɵɵtemplate(22, QueryCheckYourAnswersComponent_dl_22_Template, 14, 9, "dl", 10)(23, QueryCheckYourAnswersComponent_dl_23_Template, 11, 7, "dl", 10);
-            i0.ɵɵelement(24, "br");
-            i0.ɵɵelementStart(25, "div")(26, "button", 17);
-            i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_Template_button_click_26_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.goBack()); });
-            i0.ɵɵtext(27);
-            i0.ɵɵpipe(28, "rpxTranslate");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(29, "button", 18);
-            i0.ɵɵlistener("click", function QueryCheckYourAnswersComponent_Template_button_click_29_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.submit()); });
-            i0.ɵɵtext(30);
-            i0.ɵɵpipe(31, "rpxTranslate");
-            i0.ɵɵelementEnd()()();
-            i0.ɵɵelement(32, "ccd-query-event-completion", 19);
-            i0.ɵɵelementEnd();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryCheckYourAnswersComponent, selectors: [["ccd-query-check-your-answers"]], inputs: { formGroup: "formGroup", queryItem: "queryItem", queryCreateContext: "queryCreateContext", eventData: "eventData" }, outputs: { backClicked: "backClicked", querySubmitted: "querySubmitted", callbackConfirmationMessage: "callbackConfirmationMessage" }, decls: 1, vars: 1, consts: [["defaultCheckYourAnswersTitle", ""], ["isHearingRelatedFalse", ""], ["class", "govuk-grid-row", 4, "ngIf"], [1, "govuk-grid-row"], [1, "govuk-grid-column-two-thirds-from-desktop"], ["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], [4, "ngIf"], [1, "govuk-heading-l"], [4, "ngIf", "ngIfElse"], [1, "govuk-!-margin-bottom-4"], [3, "caseDetails"], ["class", "govuk-summary-list govuk-!-margin-bottom-0", 4, "ngIf"], [1, "govuk-summary-list", "govuk-!-margin-bottom-0"], [1, "govuk-summary-list__row"], [1, "govuk-summary-list__key"], [1, "govuk-summary-list__value"], [1, "govuk-summary-list__actions"], ["href", "javascript:void(0)", 1, "govuk-link", 3, "click"], ["data-module", "govuk-button", 1, "govuk-button", "govuk-button--secondary", "govuk-!-margin-right-3", 3, "click"], ["data-module", "govuk-button", "type", "submit", 1, "govuk-button", 3, "click"], [3, "eventCompletionParams"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], [4, "ngFor", "ngForOf"], ["href", "javascript:void(0)", 1, "validation-error", 3, "id"], [1, "govuk-caption-l"], ["href", "javascript:void(0)", "class", "govuk-link", 3, "click", 4, "ngIf"], ["class", "govuk-summary-list__row", 4, "ngIf"], [1, "govuk-summary-list__value", "govuk-summary-list__value--documentAttached"], [3, "attachments", 4, "ngIf"], [3, "attachments"]], template: function QueryCheckYourAnswersComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, QueryCheckYourAnswersComponent_div_0_Template, 33, 22, "div", 2);
         } if (rf & 2) {
-            let tmp_8_0;
-            const defaultCheckYourAnswersTitle_r9 = i0.ɵɵreference(7);
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.errorMessages.length > 0);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext === ctx.queryCreateContextEnum.NEW_QUERY);
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext === ctx.queryCreateContextEnum.RESPOND)("ngIfElse", defaultCheckYourAnswersTitle_r9);
-            i0.ɵɵadvance(4);
-            i0.ɵɵproperty("caseDetails", ctx.caseDetails);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext !== ctx.queryCreateContextEnum.FOLLOWUP);
-            i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate1(" ", ctx.queryCreateContext === ctx.queryCreateContextEnum.RESPOND ? "Response detail" : i0.ɵɵpipeBind1(15, 14, "Query detail"), " ");
-            i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate1(" ", (tmp_8_0 = ctx.formGroup.get("body")) == null ? null : tmp_8_0.value, " ");
-            i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(21, 16, "Change"), " ");
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("ngIf", ctx.queryCreateContext === ctx.queryCreateContextEnum.NEW_QUERY);
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.formGroup.get("attachments").value.length > 0);
-            i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(28, 18, "Previous"), " ");
-            i0.ɵɵadvance(3);
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(31, 20, "Submit"), " ");
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("eventCompletionParams", ctx.eventCompletionParams);
+            i0.ɵɵproperty("ngIf", ctx.readyToSubmit);
         } }, styles: [".govuk-summary-list__value--documentAttached[_ngcontent-%COMP%]{vertical-align:middle}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryCheckYourAnswersComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-check-your-answers', template: "<div class=\"govuk-grid-row\">\n  <div class=\"govuk-grid-column-two-thirds-from-desktop\">\n    <!-- Error message summary -->\n    <div *ngIf=\"errorMessages.length > 0\" class=\"govuk-error-summary\"\n      aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n      data-module=\"govuk-error-summary\">\n     <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n       {{ 'There is a problem' | rpxTranslate }}\n     </h2>\n     <div class=\"govuk-error-summary__body\">\n       <ul class=\"govuk-list govuk-error-summary__list\">\n         <li *ngFor=\"let errorMessage of errorMessages\">\n           <a [id]=\"'error-' + errorMessage.fieldId\" href=\"javascript:void(0)\"\n             class=\"validation-error\">{{ errorMessage.description | rpxTranslate }}</a>\n         </li>\n       </ul>\n     </div>\n   </div>\n\n    <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\">\n      <div class=\"govuk-caption-l\">{{ 'Raise a query' | rpxTranslate }}</div>\n    </ng-container>\n\n    <h1 class=\"govuk-heading-l\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND; else defaultCheckYourAnswersTitle\">\n        {{ 'Review query response details' | rpxTranslate }}\n      </ng-container>\n\n      <ng-template #defaultCheckYourAnswersTitle>\n        {{ 'Review query details' | rpxTranslate }}\n      </ng-template>\n    </h1>\n    <div class=\"govuk-!-margin-bottom-4\">\n      <ccd-query-case-details-header [caseDetails]=\"caseDetails\"></ccd-query-case-details-header>\n    </div>\n\n    <dl *ngIf=\"queryCreateContext !== queryCreateContextEnum.FOLLOWUP\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Submitted query' : 'Query subject' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? queryItem.subject : formGroup.get('subject')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a  *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" \n            href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Response detail' : 'Query detail' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('body')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <ng-container *ngIf=\"formGroup.get('isHearingRelated')?.value === true; else isHearingRelatedFalse\">\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'Yes' }}\n          </ng-container>\n          <ng-template #isHearingRelatedFalse>\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'No' }}\n          </ng-template>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n\n      <div *ngIf=\"formGroup.get('isHearingRelated')?.value\" class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY\n            ? 'What is the date of the hearing?'\n            : 'What is the date of the hearing your query is related to?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('hearingDate')?.value | date: 'dd MMM yyyy' }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\" *ngIf=\"this.formGroup.get('attachments').value.length > 0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY ? 'Upload a file to the query' : 'Document attached' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value govuk-summary-list__value--documentAttached\">\n          <ccd-query-attachments-read\n            *ngIf=\"this.formGroup.get('attachments').value\"\n            [attachments]=\"attachments\"\n          >\n          </ccd-query-attachments-read>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <br>\n\n    <div>\n      <button class=\"govuk-button govuk-button--secondary govuk-!-margin-right-3\" data-module=\"govuk-button\"\n        (click)=\"goBack()\">\n        {{ 'Previous' | rpxTranslate }}\n      </button>\n      <button class=\"govuk-button\" data-module=\"govuk-button\" type=\"submit\" (click)=\"submit()\">\n        {{ 'Submit' | rpxTranslate }}\n      </button>\n    </div>\n  </div>\n\n  <ccd-query-event-completion [eventCompletionParams]=\"eventCompletionParams\">    \n  </ccd-query-event-completion>\n</div>\n", styles: [".govuk-summary-list__value--documentAttached{vertical-align:middle}\n"] }]
+        args: [{ selector: 'ccd-query-check-your-answers', template: "<div class=\"govuk-grid-row\" *ngIf=\"readyToSubmit\">\n  <div class=\"govuk-grid-column-two-thirds-from-desktop\">\n    <!-- Error message summary -->\n    <div *ngIf=\"errorMessages.length > 0\" class=\"govuk-error-summary\"\n      aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\"\n      data-module=\"govuk-error-summary\">\n     <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n       {{ 'There is a problem' | rpxTranslate }}\n     </h2>\n     <div class=\"govuk-error-summary__body\">\n       <ul class=\"govuk-list govuk-error-summary__list\">\n         <li *ngFor=\"let errorMessage of errorMessages\">\n           <a [id]=\"'error-' + errorMessage.fieldId\" href=\"javascript:void(0)\"\n             class=\"validation-error\">{{ errorMessage.description | rpxTranslate }}</a>\n         </li>\n       </ul>\n     </div>\n   </div>\n\n    <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\">\n      <div class=\"govuk-caption-l\">{{ 'Raise a query' | rpxTranslate }}</div>\n    </ng-container>\n\n    <h1 class=\"govuk-heading-l\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND; else defaultCheckYourAnswersTitle\">\n        {{ 'Review query response details' | rpxTranslate }}\n      </ng-container>\n\n      <ng-template #defaultCheckYourAnswersTitle>\n        {{ 'Review query details' | rpxTranslate }}\n      </ng-template>\n    </h1>\n    <div class=\"govuk-!-margin-bottom-4\">\n      <ccd-query-case-details-header [caseDetails]=\"caseDetails\"></ccd-query-case-details-header>\n    </div>\n\n    <dl *ngIf=\"queryCreateContext !== queryCreateContextEnum.FOLLOWUP\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Submitted query' : 'Query subject' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? queryItem.subject : formGroup.get('subject')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a  *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" \n            href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.RESPOND ? 'Response detail' : 'Query detail' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('body')?.value }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <dl *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY\" class=\"govuk-summary-list govuk-!-margin-bottom-0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <ng-container *ngIf=\"formGroup.get('isHearingRelated')?.value === true; else isHearingRelatedFalse\">\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'Yes' }}\n          </ng-container>\n          <ng-template #isHearingRelatedFalse>\n            {{ 'Is the query hearing related?' | rpxTranslate: null : 'No' }}\n          </ng-template>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n\n      <div *ngIf=\"formGroup.get('isHearingRelated')?.value\" class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY\n            ? 'What is the date of the hearing?'\n            : 'What is the date of the hearing your query is related to?' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          {{ formGroup.get('hearingDate')?.value | date: 'dd MMM yyyy' }}\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n    <dl class=\"govuk-summary-list govuk-!-margin-bottom-0\" *ngIf=\"this.formGroup.get('attachments').value.length > 0\">\n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          {{ queryCreateContext === queryCreateContextEnum.NEW_QUERY ? 'Upload a file to the query' : 'Document attached' | rpxTranslate }}\n        </dt>\n        <dd class=\"govuk-summary-list__value govuk-summary-list__value--documentAttached\">\n          <ccd-query-attachments-read\n            *ngIf=\"this.formGroup.get('attachments').value\"\n            [attachments]=\"attachments\"\n          >\n          </ccd-query-attachments-read>\n        </dd>\n        <dd class=\"govuk-summary-list__actions\">\n          <a href=\"javascript:void(0)\" class=\"govuk-link\" (click)=\"goBack()\">\n            {{ 'Change' | rpxTranslate }}\n          </a>\n        </dd>\n      </div>\n    </dl>\n\n    <br>\n\n    <div>\n      <button class=\"govuk-button govuk-button--secondary govuk-!-margin-right-3\" data-module=\"govuk-button\"\n        (click)=\"goBack()\">\n        {{ 'Previous' | rpxTranslate }}\n      </button>\n      <button class=\"govuk-button\" data-module=\"govuk-button\" type=\"submit\" (click)=\"submit()\">\n        {{ 'Submit' | rpxTranslate }}\n      </button>\n    </div>\n  </div>\n\n  <ccd-query-event-completion [eventCompletionParams]=\"eventCompletionParams\">    \n  </ccd-query-event-completion>\n</div>\n", styles: [".govuk-summary-list__value--documentAttached{vertical-align:middle}\n"] }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: CasesService }, { type: CaseNotifier }, { type: WorkAllocationService }, { type: SessionStorageService }, { type: QualifyingQuestionService }], { formGroup: [{
             type: Input
         }], queryItem: [{
@@ -21582,6 +21672,8 @@ class QueryCheckYourAnswersComponent {
             type: Output
         }], querySubmitted: [{
             type: Output
+        }], callbackConfirmationMessage: [{
+            type: Output
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(QueryCheckYourAnswersComponent, { className: "QueryCheckYourAnswersComponent", filePath: "lib/shared/components/palette/query-management/components/query-check-your-answers/query-check-your-answers.component.ts", lineNumber: 28 }); })();
 
@@ -21717,7 +21809,7 @@ function QueryDetailsComponent_ng_container_0_ng_container_46_ng_container_1_ng_
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(11, 12, "Last response date"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(14, 14, child_r3.createdOn, "dd MMM yyyy"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(14, 14, child_r3.createdOn, "dd MMMM YYYY HH:mm"));
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", ctx_r0.isInternalUser());
     i0.ɵɵadvance(3);
@@ -21787,7 +21879,7 @@ function QueryDetailsComponent_ng_container_0_ng_container_46_ng_container_1_ng_
     i0.ɵɵadvance(5);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(10, 13, "Last submission date"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(13, 15, child_r3.createdOn, "dd MMM yyyy"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(13, 15, child_r3.createdOn, "dd MMMM YYYY HH:mm"));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(17, 18, "Last submitted by"));
     i0.ɵɵadvance(3);
@@ -21887,7 +21979,7 @@ function QueryDetailsComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(21, 27, "Submission date"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(24, 29, ctx_r0.query.createdOn, "dd MMM yyyy"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(24, 29, ctx_r0.query.createdOn, "dd MMMM YYYY HH:mm"));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(28, 32, "Query subject"));
     i0.ɵɵadvance(3);
@@ -21973,7 +22065,7 @@ class QueryDetailsComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryDetailsComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-details', template: "<ng-container *ngIf=\"query\">\n  <cut-alert type=\"error\" *ngIf=\"hasRespondedToQuery() && !showItem\">\n    <ng-container>{{message}}</ng-container>\n  </cut-alert>\n\n  <br/>\n  <p *ngIf=\"showItem\">\n    <a class=\"govuk-link\" href=\"javascript:void(0)\" (click)=\"onBack()\">{{ 'Back to query list' | rpxTranslate }}</a>\n  </p>\n  <div>\n    <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Details of the query' | rpxTranslate\">\n      <caption class=\"govuk-table__caption govuk-table__caption--l\">\n        <div>{{ 'Query details' | rpxTranslate }}</div>\n      </caption>\n      <tbody class=\"govuk-table__body\">\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.lastSubmittedBy }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Submission date' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.createdOn | date: 'dd MMM yyyy' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query subject' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.subject }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query body' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.body }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\" [class.govuk-table__header--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </th>\n        <td class=\"govuk-table__cell\" [class.govuk-table__cell--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate: null : (query.isHearingRelated) }}</td>\n      </tr>\n      <tr class=\"govuk-table__row govuk-table__row--isHearingRelated\" *ngIf=\"query.isHearingRelated === 'Yes'\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'What is the date of the hearing?' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.hearingDate | date: 'dd MMM yyyy' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\" *ngIf=\"query.attachments.length > 0\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">\n          <ccd-query-attachments-read\n            *ngIf=\"query.attachments\"\n            [attachments]=\"query.attachments\"\n          >\n          </ccd-query-attachments-read>\n        </td>\n      </tr>\n      </tbody>\n    </table>\n  </div>\n  <ng-container *ngIf=\"query.children?.length > 0\">\n    <ng-container *ngFor=\"let child of query.children; let i = index;\">\n      <ng-container *ngIf=\"i % 2 === 0; else followUpMessage\">\n        <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Response of the query' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Response' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last response date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMM yyyy' }}</td>\n          </tr>\n\n            <tr *ngIf=\"isInternalUser()\" class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Caseworker name' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.name }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Response detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n          <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">\n              <ccd-query-attachments-read\n                *ngIf=\"child.attachments\"\n                [attachments]=\"child.attachments\"\n              >\n              </ccd-query-attachments-read>\n            </td>\n          </tr>\n          </tbody>\n        </table>\n      </ng-container>\n\n      <ng-template #followUpMessage>\n        <!-- <div class=\"query_details_caption\">{{ 'Follow-up' | rpxTranslate }}</div> -->\n        <table class=\"govuk-table query-details-table\"\n               [attr.aria-describedby]=\"'Follow-up of the response' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Follow up query' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submission date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMM yyyy' }}</td>\n          </tr>\n\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.name }}</td>\n          </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">\n                <ccd-query-attachments-read\n                  *ngIf=\"child.attachments\"\n                  [attachments]=\"child.attachments\"\n                >\n                </ccd-query-attachments-read>\n              </td>\n            </tr>\n          </tbody>\n        </table>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n</ng-container>\n", styles: [".query-details-table .govuk-table__header{width:330px}\n"] }]
+        args: [{ selector: 'ccd-query-details', template: "<ng-container *ngIf=\"query\">\n  <cut-alert type=\"error\" *ngIf=\"hasRespondedToQuery() && !showItem\">\n    <ng-container>{{message}}</ng-container>\n  </cut-alert>\n\n  <br/>\n  <p *ngIf=\"showItem\">\n    <a class=\"govuk-link\" href=\"javascript:void(0)\" (click)=\"onBack()\">{{ 'Back to query list' | rpxTranslate }}</a>\n  </p>\n  <div>\n    <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Details of the query' | rpxTranslate\">\n      <caption class=\"govuk-table__caption govuk-table__caption--l\">\n        <div>{{ 'Query details' | rpxTranslate }}</div>\n      </caption>\n      <tbody class=\"govuk-table__body\">\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.lastSubmittedBy }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Submission date' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.createdOn | date: 'dd MMMM YYYY HH:mm' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query subject' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.subject }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query body' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.body }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\">\n        <th scope=\"row\" class=\"govuk-table__header\" [class.govuk-table__header--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate }}\n        </th>\n        <td class=\"govuk-table__cell\" [class.govuk-table__cell--no-border]=\"query.isHearingRelated\">\n          {{ 'Is the query hearing related?' | rpxTranslate: null : (query.isHearingRelated) }}</td>\n      </tr>\n      <tr class=\"govuk-table__row govuk-table__row--isHearingRelated\" *ngIf=\"query.isHearingRelated === 'Yes'\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'What is the date of the hearing?' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">{{ query.hearingDate | date: 'dd MMM yyyy' }}</td>\n      </tr>\n      <tr class=\"govuk-table__row\" *ngIf=\"query.attachments.length > 0\">\n        <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n        <td class=\"govuk-table__cell\">\n          <ccd-query-attachments-read\n            *ngIf=\"query.attachments\"\n            [attachments]=\"query.attachments\"\n          >\n          </ccd-query-attachments-read>\n        </td>\n      </tr>\n      </tbody>\n    </table>\n  </div>\n  <ng-container *ngIf=\"query.children?.length > 0\">\n    <ng-container *ngFor=\"let child of query.children; let i = index;\">\n      <ng-container *ngIf=\"i % 2 === 0; else followUpMessage\">\n        <table class=\"govuk-table query-details-table\" [attr.aria-describedby]=\"'Response of the query' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Response' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last response date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMMM YYYY HH:mm'  }}</td>\n          </tr>\n\n            <tr *ngIf=\"isInternalUser()\" class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Caseworker name' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.name }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Response detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n          <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">\n              <ccd-query-attachments-read\n                *ngIf=\"child.attachments\"\n                [attachments]=\"child.attachments\"\n              >\n              </ccd-query-attachments-read>\n            </td>\n          </tr>\n          </tbody>\n        </table>\n      </ng-container>\n\n      <ng-template #followUpMessage>\n        <!-- <div class=\"query_details_caption\">{{ 'Follow-up' | rpxTranslate }}</div> -->\n        <table class=\"govuk-table query-details-table\"\n               [attr.aria-describedby]=\"'Follow-up of the response' | rpxTranslate\">\n          <caption class=\"govuk-table__caption govuk-table__caption--l\">\n            <div>{{ 'Follow up query' | rpxTranslate }}</div>\n          </caption>\n          <tbody class=\"govuk-table__body\">\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submission date' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.createdOn | date: 'dd MMMM YYYY HH:mm'}}</td>\n          </tr>\n\n          <tr class=\"govuk-table__row\">\n            <th scope=\"row\" class=\"govuk-table__header\">{{ 'Last submitted by' | rpxTranslate }}</th>\n            <td class=\"govuk-table__cell\">{{ child.name }}</td>\n          </tr>\n\n            <tr class=\"govuk-table__row\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Query detail' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">{{ child.body }}</td>\n            </tr>\n\n            <tr class=\"govuk-table__row\" *ngIf=\"child.attachments.length > 0\">\n              <th scope=\"row\" class=\"govuk-table__header\">{{ 'Attachments' | rpxTranslate }}</th>\n              <td class=\"govuk-table__cell\">\n                <ccd-query-attachments-read\n                  *ngIf=\"child.attachments\"\n                  [attachments]=\"child.attachments\"\n                >\n                </ccd-query-attachments-read>\n              </td>\n            </tr>\n          </tbody>\n        </table>\n      </ng-template>\n    </ng-container>\n  </ng-container>\n</ng-container>\n", styles: [".query-details-table .govuk-table__header{width:330px}\n"] }]
     }], () => [{ type: SessionStorageService }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }], { query: [{
             type: Input
         }], caseId: [{
@@ -22061,9 +22153,9 @@ function QueryListComponent_ng_container_0_tr_9_Template(rf, ctx) { if (rf & 1)
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(message_r6.lastSubmittedBy);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(8, 5, message_r6.lastSubmittedDate, "dd MMM YYYY"));
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind2(8, 5, message_r6.lastSubmittedDate, "dd MMM YYYY HH:mm"), " ");
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(11, 8, message_r6.lastResponseDate, "dd MMM YYYY"));
+    i0.ɵɵtextInterpolate1("", i0.ɵɵpipeBind2(11, 8, message_r6.lastResponseDate, "dd MMM YYYY HH:mm"), " ");
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(14, 11, message_r6.responseStatus));
 } }
@@ -22167,7 +22259,7 @@ class QueryListComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryListComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-list', template: "<ng-container *ngIf=\"queryListData\">\n  <table class=\"govuk-table query-list__table\">\n    <caption class=\"govuk-table__caption govuk-table__caption--l query-list__caption\">\n      <div class=\"query-list__caption-text\">{{ queryListData.partyName }}</div>\n    </caption>\n    <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row query-list__row\">\n        <th scope=\"col\" class=\"govuk-table__header\" [attr.aria-sort]=\"getAriaSortHeaderValue(col)\"\n            *ngFor=\"let col of displayedColumns; let i = index;\">\n          <button type=\"button\" [attr.data-index]=\"i\" aria-sort=\"none\" (click)=\"sortTable(col)\" href=\"javascript:void(0)\">\n            {{ col.displayName | rpxTranslate }}\n          </button>\n        </th>\n      </tr>\n    </thead>\n\n    <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row query-list__row\"\n        *ngFor=\"let message of queryListData.queries\"\n    >\n      <td class=\"govuk-table__cell query-list__cell query-list__cell--first\">\n        <a href=\"javascript:void(0)\" (click)=\"showDetails(message)\">{{ message.subject }}</a>\n      </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedBy }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedDate | date: 'dd MMM YYYY' }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastResponseDate | date: 'dd MMM YYYY' }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.responseStatus | rpxTranslate }}</td>\n    </tr>\n    </tbody>\n  </table>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.query-list__row>*:first-child{padding-left:10px}.query-list__row>*:last-child{padding-right:10px}.query-list__cell--first{width:33%}.query-list__table{border:1px solid #b1b4b6;border-top:none}.query-list__caption{background-color:#dee0e2;border:1px solid #b1b4b6;border-bottom:none;font-weight:700;margin-bottom:0;padding:10px}.query-list__caption{font-size:18px}[aria-sort] button,[aria-sort] button:hover,[aria-sort] button:hover:hover{background-color:transparent;border-width:0;-webkit-box-shadow:0 0 0 0;-moz-box-shadow:0 0 0 0;box-shadow:0 0;color:#000;cursor:pointer;font-family:inherit;font-weight:inherit;padding:0 10px 0 0;position:relative;text-align:inherit;font-size:1em;margin:0}[aria-sort] button:focus,[aria-sort] button:hover:focus{background-color:#fd0;color:#000;box-shadow:0 -2px #fd0,0 4px #000;outline:none}[aria-sort]:first-child button{right:auto}[aria-sort] button:before{content:\" \\25bc\";position:absolute;right:-1px;top:9px;font-size:.5em}[aria-sort] button:after{content:\" \\25b2\";position:absolute;right:-1px;top:1px;font-size:.5em}[aria-sort=ascending] button:before,[aria-sort=descending] button:before{content:none}[aria-sort=ascending] button:after{content:\" \\25b2\";font-size:.8em;position:absolute;right:-5px;top:2px}[aria-sort=descending] button:after{content:\" \\25bc\";font-size:.8em;position:absolute;right:-5px;top:2px}\n"] }]
+        args: [{ selector: 'ccd-query-list', template: "<ng-container *ngIf=\"queryListData\">\n  <table class=\"govuk-table query-list__table\">\n    <caption class=\"govuk-table__caption govuk-table__caption--l query-list__caption\">\n      <div class=\"query-list__caption-text\">{{ queryListData.partyName }}</div>\n    </caption>\n    <thead class=\"govuk-table__head\">\n      <tr class=\"govuk-table__row query-list__row\">\n        <th scope=\"col\" class=\"govuk-table__header\" [attr.aria-sort]=\"getAriaSortHeaderValue(col)\"\n            *ngFor=\"let col of displayedColumns; let i = index;\">\n          <button type=\"button\" [attr.data-index]=\"i\" aria-sort=\"none\" (click)=\"sortTable(col)\" href=\"javascript:void(0)\">\n            {{ col.displayName | rpxTranslate }}\n          </button>\n        </th>\n      </tr>\n    </thead>\n\n    <tbody class=\"govuk-table__body\">\n    <tr class=\"govuk-table__row query-list__row\"\n        *ngFor=\"let message of queryListData.queries\"\n    >\n      <td class=\"govuk-table__cell query-list__cell query-list__cell--first\">\n        <a href=\"javascript:void(0)\" (click)=\"showDetails(message)\">{{ message.subject }}</a>\n      </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedBy }}</td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastSubmittedDate | date: 'dd MMM YYYY HH:mm' }} </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.lastResponseDate | date: 'dd MMM YYYY HH:mm' }} </td>\n      <td class=\"govuk-table__cell query-list__cell\">{{ message.responseStatus | rpxTranslate }}</td>\n    </tr>\n    </tbody>\n  </table>\n</ng-container>\n", styles: ["@charset \"UTF-8\";.query-list__row>*:first-child{padding-left:10px}.query-list__row>*:last-child{padding-right:10px}.query-list__cell--first{width:33%}.query-list__table{border:1px solid #b1b4b6;border-top:none}.query-list__caption{background-color:#dee0e2;border:1px solid #b1b4b6;border-bottom:none;font-weight:700;margin-bottom:0;padding:10px}.query-list__caption{font-size:18px}[aria-sort] button,[aria-sort] button:hover,[aria-sort] button:hover:hover{background-color:transparent;border-width:0;-webkit-box-shadow:0 0 0 0;-moz-box-shadow:0 0 0 0;box-shadow:0 0;color:#000;cursor:pointer;font-family:inherit;font-weight:inherit;padding:0 10px 0 0;position:relative;text-align:inherit;font-size:1em;margin:0}[aria-sort] button:focus,[aria-sort] button:hover:focus{background-color:#fd0;color:#000;box-shadow:0 -2px #fd0,0 4px #000;outline:none}[aria-sort]:first-child button{right:auto}[aria-sort] button:before{content:\" \\25bc\";position:absolute;right:-1px;top:9px;font-size:.5em}[aria-sort] button:after{content:\" \\25b2\";position:absolute;right:-1px;top:1px;font-size:.5em}[aria-sort=ascending] button:before,[aria-sort=descending] button:before{content:none}[aria-sort=ascending] button:after{content:\" \\25b2\";font-size:.8em;position:absolute;right:-5px;top:2px}[aria-sort=descending] button:after{content:\" \\25bc\";font-size:.8em;position:absolute;right:-5px;top:2px}\n"] }]
     }], null, { caseQueriesCollection: [{
             type: Input
         }], selectedQuery: [{
@@ -22718,7 +22810,7 @@ class QueryWriteRespondToQueryComponent {
                 const matchingMessage = filteredMessages[0]?.value;
                 let filteredQuery = [];
                 if (this.queryItemId === QueryWriteRespondToQueryComponent.QUERY_ITEM_RESPOND) {
-                    filteredQuery = queryWithChildren?.queries.filter((message) => filteredMessages[0]?.value?.parentId === message?.id);
+                    filteredQuery = queryWithChildren?.queries.filter((message) => filteredMessages[0]?.value?.id === message?.id);
                     if (matchingMessage) {
                         this.queryItemDisplay = new QueryListItem();
                         Object.assign(this.queryItemDisplay, matchingMessage);
@@ -22793,27 +22885,25 @@ function QueryConfirmationComponent_main_0_ng_container_3_Template(rf, ctx) { if
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(5, "div", 7);
-    i0.ɵɵtext(6);
+    i0.ɵɵelement(6, "ccd-markdown", 8);
     i0.ɵɵpipe(7, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "div", 8)(9, "h3", 9);
+    i0.ɵɵelementStart(8, "div", 9)(9, "h3", 10);
     i0.ɵɵtext(10);
     i0.ɵɵpipe(11, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(12, "p");
-    i0.ɵɵtext(13);
-    i0.ɵɵpipe(14, "rpxTranslate");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(15, "p");
-    i0.ɵɵtext(16);
-    i0.ɵɵpipe(17, "rpxTranslate");
+    i0.ɵɵelement(12, "ccd-markdown", 8);
+    i0.ɵɵpipe(13, "rpxTranslate");
+    i0.ɵɵelementStart(14, "p");
+    i0.ɵɵtext(15);
+    i0.ɵɵpipe(16, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(18, "p");
-    i0.ɵɵtext(19);
-    i0.ɵɵpipe(20, "rpxTranslate");
-    i0.ɵɵelementStart(21, "a", 10);
-    i0.ɵɵtext(22);
-    i0.ɵɵpipe(23, "rpxTranslate");
+    i0.ɵɵelementStart(17, "p");
+    i0.ɵɵtext(18);
+    i0.ɵɵpipe(19, "rpxTranslate");
+    i0.ɵɵelementStart(20, "a", 11);
+    i0.ɵɵtext(21);
+    i0.ɵɵpipe(22, "rpxTranslate");
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
@@ -22821,19 +22911,19 @@ function QueryConfirmationComponent_main_0_ng_container_3_Template(rf, ctx) { if
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 9, "Query submitted"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(7, 11, "Your query has been sent to HMCTS"));
+    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(7, 11, ctx_r0.callbackConfirmationMessageText == null ? null : ctx_r0.callbackConfirmationMessageText.header));
     i0.ɵɵadvance(4);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(11, 13, "What happens next"));
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("content", i0.ɵɵpipeBind1(13, 15, ctx_r0.callbackConfirmationMessageText == null ? null : ctx_r0.callbackConfirmationMessageText.body));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(14, 15, "Our team will read your query and will respond"));
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(17, 17, "When the response is available it will be added to the 'Queries' section."));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(16, 17, "When the response is available it will be added to the 'Queries' section."));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(20, 19, "You can"), " ");
+    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(19, 19, "You can"), " ");
     i0.ɵɵadvance(2);
     i0.ɵɵpropertyInterpolate1("routerLink", "/cases/case-details/", ctx_r0.caseId, "");
     i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(23, 21, "Go back to the case"));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(22, 21, "Go back to the case"));
 } }
 function QueryConfirmationComponent_main_0_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -22841,19 +22931,19 @@ function QueryConfirmationComponent_main_0_ng_container_4_Template(rf, ctx) { if
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(5, "div", 7);
+    i0.ɵɵelementStart(5, "div", 12);
     i0.ɵɵtext(6);
     i0.ɵɵpipe(7, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(8, "div", 8);
+    i0.ɵɵelementStart(8, "div", 9);
     i0.ɵɵtext(9);
     i0.ɵɵpipe(10, "rpxTranslate");
-    i0.ɵɵelementStart(11, "a", 11);
+    i0.ɵɵelementStart(11, "a", 13);
     i0.ɵɵtext(12);
     i0.ɵɵpipe(13, "rpxTranslate");
     i0.ɵɵelementEnd();
     i0.ɵɵtext(14, " or ");
-    i0.ɵɵelementStart(15, "a", 12);
+    i0.ɵɵelementStart(15, "a", 14);
     i0.ɵɵtext(16);
     i0.ɵɵpipe(17, "rpxTranslate");
     i0.ɵɵelementEnd()();
@@ -22877,7 +22967,7 @@ function QueryConfirmationComponent_main_0_ng_container_4_Template(rf, ctx) { if
 } }
 function QueryConfirmationComponent_main_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "main", 1)(1, "div", 2)(2, "div", 3);
-    i0.ɵɵtemplate(3, QueryConfirmationComponent_main_0_ng_container_3_Template, 24, 23, "ng-container", 4)(4, QueryConfirmationComponent_main_0_ng_container_4_Template, 18, 19, "ng-container", 4);
+    i0.ɵɵtemplate(3, QueryConfirmationComponent_main_0_ng_container_3_Template, 23, 23, "ng-container", 4)(4, QueryConfirmationComponent_main_0_ng_container_4_Template, 18, 19, "ng-container", 4);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext();
@@ -22889,6 +22979,7 @@ function QueryConfirmationComponent_main_0_Template(rf, ctx) { if (rf & 1) {
 class QueryConfirmationComponent {
     route;
     queryCreateContext;
+    callbackConfirmationMessageText = {};
     caseId = '';
     queryCreateContextEnum = QueryCreateContext;
     constructor(route) {
@@ -22898,17 +22989,19 @@ class QueryConfirmationComponent {
         this.caseId = this.route.snapshot.params.cid;
     }
     static ɵfac = function QueryConfirmationComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || QueryConfirmationComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryConfirmationComponent, selectors: [["ccd-query-confirmation"]], inputs: { queryCreateContext: "queryCreateContext" }, decls: 1, vars: 1, consts: [["class", "govuk-main-wrapper", 4, "ngIf"], [1, "govuk-main-wrapper"], [1, "govuk-grid-row"], [1, "govuk-grid-column-two-thirds"], [4, "ngIf"], [1, "govuk-panel", "govuk-panel--confirmation"], [1, "govuk-panel__title"], [1, "govuk-panel__body"], [1, "govuk-body"], [1, "govuk-heading-s"], ["href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], ["id", "tasks-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], ["id", "case-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"]], template: function QueryConfirmationComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: QueryConfirmationComponent, selectors: [["ccd-query-confirmation"]], inputs: { queryCreateContext: "queryCreateContext", callbackConfirmationMessageText: "callbackConfirmationMessageText" }, decls: 1, vars: 1, consts: [["class", "govuk-main-wrapper", 4, "ngIf"], [1, "govuk-main-wrapper"], [1, "govuk-grid-row"], [1, "govuk-grid-column-two-thirds"], [4, "ngIf"], [1, "govuk-panel", "govuk-panel--confirmation"], [1, "govuk-panel__title"], [1, "qm-confirmation", "govuk-panel__body"], [3, "content"], [1, "govuk-body"], [1, "govuk-heading-s"], ["href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], [1, "govuk-panel__body"], ["id", "tasks-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"], ["id", "case-link", "href", "javascript:void(0)", 1, "govuk-link", 3, "routerLink"]], template: function QueryConfirmationComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, QueryConfirmationComponent_main_0_Template, 5, 2, "main", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.queryCreateContext);
-        } }, dependencies: [i5.NgIf, i1$1.RouterLink, i1.RpxTranslatePipe], encapsulation: 2 });
+        } }, dependencies: [i5.NgIf, i1$1.RouterLink, MarkdownComponent, i1.RpxTranslatePipe], encapsulation: 2 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(QueryConfirmationComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-query-confirmation', template: "<main class=\"govuk-main-wrapper\" *ngIf=\"queryCreateContext\">\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-two-thirds\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY || queryCreateContext === queryCreateContextEnum.FOLLOWUP\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query submitted' | rpxTranslate}}</h1>\n          <div class=\"govuk-panel__body\">{{'Your query has been sent to HMCTS' | rpxTranslate}}</div>\n        </div>\n        <div class=\"govuk-body\">\n          <h3 class=\"govuk-heading-s\">{{'What happens next' | rpxTranslate}}</h3>\n          <p>{{'Our team will read your query and will respond' | rpxTranslate}}</p>\n          <p>{{'When the response is available it will be added to the \\'Queries\\' section.' | rpxTranslate}}</p>\n          <p>\n            {{'You can' | rpxTranslate}}\n            <a class=\"govuk-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n          </p>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query response submitted' | rpxTranslate}}</h1>\n          <div class=\"govuk-panel__body\">{{'This query response has been added to the case' | rpxTranslate}}</div>\n        </div>\n        <div class=\"govuk-body\">\n          {{'You can' | rpxTranslate}}\n          <a class=\"govuk-link\" id=\"tasks-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}/tasks\">{{'return to tasks' | rpxTranslate}}</a> or\n          <a class=\"govuk-link\" id=\"case-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</main>\n" }]
+        args: [{ selector: 'ccd-query-confirmation', template: "<main class=\"govuk-main-wrapper\" *ngIf=\"queryCreateContext\">\n  <div class=\"govuk-grid-row\">\n    <div class=\"govuk-grid-column-two-thirds\">\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.NEW_QUERY || queryCreateContext === queryCreateContextEnum.FOLLOWUP\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query submitted' | rpxTranslate}}</h1>\n          <div class=\"qm-confirmation govuk-panel__body\">\n            <ccd-markdown [content]=\"callbackConfirmationMessageText?.header | rpxTranslate\"></ccd-markdown>\n          </div>\n        </div>\n        <div class=\"govuk-body\">\n          <h3 class=\"govuk-heading-s\">{{'What happens next' | rpxTranslate}}</h3>\n          <ccd-markdown [content]=\"callbackConfirmationMessageText?.body | rpxTranslate\"></ccd-markdown>\n          <p>{{'When the response is available it will be added to the \\'Queries\\' section.' | rpxTranslate}}</p>\n          <p>\n            {{'You can' | rpxTranslate}}\n            <a class=\"govuk-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n          </p>\n        </div>\n      </ng-container>\n      <ng-container *ngIf=\"queryCreateContext === queryCreateContextEnum.RESPOND\">\n        <div class=\"govuk-panel govuk-panel--confirmation\">\n          <h1 class=\"govuk-panel__title\">{{'Query response submitted' | rpxTranslate}}</h1>\n          <div class=\"govuk-panel__body\">{{'This query response has been added to the case' | rpxTranslate}}</div>\n        </div>\n        <div class=\"govuk-body\">\n          {{'You can' | rpxTranslate}}\n          <a class=\"govuk-link\" id=\"tasks-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}/tasks\">{{'return to tasks' | rpxTranslate}}</a> or\n          <a class=\"govuk-link\" id=\"case-link\" href=\"javascript:void(0)\" routerLink=\"/cases/case-details/{{caseId}}\">{{'Go back to the case' | rpxTranslate}}</a>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</main>\n" }]
     }], () => [{ type: i1$1.ActivatedRoute }], { queryCreateContext: [{
             type: Input
+        }], callbackConfirmationMessageText: [{
+            type: Input
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(QueryConfirmationComponent, { className: "QueryConfirmationComponent", filePath: "lib/shared/components/palette/query-management/components/query-confirmation/query-confirmation.component.ts", lineNumber: 9 }); })();
 
@@ -22968,7 +23061,7 @@ function ReadQueryManagementFieldComponent_ng_template_1_ng_container_1_ng_templ
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 2, "Your query is under review"));
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 4, "Our team will read your query and will respond. Do not submit the same query more than once."));
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 4, "Our team will read your query and respond. Do not submit the same query more than once."));
 } }
 function ReadQueryManagementFieldComponent_ng_template_1_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
@@ -23054,7 +23147,7 @@ class ReadQueryManagementFieldComponent extends AbstractFieldReadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadQueryManagementFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-query-management-field', template: "<ng-container *ngIf=\"showQueryList; else singleQueryDetails\">\n  <ng-container *ngFor=\"let caseQueriesCollection of caseQueriesCollections\">\n    <div *ngIf=\"showQueryList\" class=\"govuk-!-margin-top-8 govuk-!-margin-bottom-8\">\n      <ccd-query-list (selectedQuery)=\"setQuery($event)\" [caseQueriesCollection]=\"caseQueriesCollection\"></ccd-query-list>\n    </div>\n  </ng-container>\n</ng-container>\n\n<ng-template #singleQueryDetails>\n  <ccd-query-details\n    [query]=\"query\"\n    (backClicked)=\"showQueryList = true\"\n    [caseId]=\"caseId\"\n  ></ccd-query-details>\n\n  <ng-container *ngIf=\"!isInternalUser()\">\n    <ng-container *ngIf=\"query?.children?.length > 0 && query?.children?.length % 2 === 1; else queryIsInReview\">\n      <button id=\"ask-follow-up-question\" class=\"govuk-button\" data-module=\"govuk-button\"\n              [routerLink]=\"['/query-management', 'query', caseId, '4', query.id]\">\n        {{ 'Ask a follow-up question' | rpxTranslate }}\n      </button>\n    </ng-container>\n\n    <ng-template #queryIsInReview>\n      <div>\n        <p class=\"govuk-!-font-weight-bold\">{{ 'Your query is under review' | rpxTranslate }}</p>\n        <p>{{ 'Our team will read your query and will respond. Do not submit the same query more than once.' | rpxTranslate }}</p>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-template>\n" }]
+        args: [{ selector: 'ccd-read-query-management-field', template: "<ng-container *ngIf=\"showQueryList; else singleQueryDetails\">\n  <ng-container *ngFor=\"let caseQueriesCollection of caseQueriesCollections\">\n    <div *ngIf=\"showQueryList\" class=\"govuk-!-margin-top-8 govuk-!-margin-bottom-8\">\n      <ccd-query-list (selectedQuery)=\"setQuery($event)\" [caseQueriesCollection]=\"caseQueriesCollection\"></ccd-query-list>\n    </div>\n  </ng-container>\n</ng-container>\n\n<ng-template #singleQueryDetails>\n  <ccd-query-details\n    [query]=\"query\"\n    (backClicked)=\"showQueryList = true\"\n    [caseId]=\"caseId\"\n  ></ccd-query-details>\n\n  <ng-container *ngIf=\"!isInternalUser()\">\n    <ng-container *ngIf=\"query?.children?.length > 0 && query?.children?.length % 2 === 1; else queryIsInReview\">\n      <button id=\"ask-follow-up-question\" class=\"govuk-button\" data-module=\"govuk-button\"\n              [routerLink]=\"['/query-management', 'query', caseId, '4', query.id]\">\n        {{ 'Ask a follow-up question' | rpxTranslate }}\n      </button>\n    </ng-container>\n\n    <ng-template #queryIsInReview>\n      <div>\n        <p class=\"govuk-!-font-weight-bold\">{{ 'Your query is under review' | rpxTranslate }}</p>\n        <p>{{ 'Our team will read your query and respond. Do not submit the same query more than once.' | rpxTranslate }}</p>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-template>\n" }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: SessionStorageService }, { type: CaseNotifier }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadQueryManagementFieldComponent, { className: "ReadQueryManagementFieldComponent", filePath: "lib/shared/components/palette/query-management/read-query-management-field.component.ts", lineNumber: 15 }); })();
 
@@ -23691,11 +23784,11 @@ class FieldWriteComponent extends AbstractFieldWriteComponent {
         } if (rf & 2) {
             i0.ɵɵclassProp("grey-bar", ctx.canHaveGreyBar && !ctx.caseField.hiddenCannotChange);
             i0.ɵɵproperty("hidden", ctx.caseField.hidden);
-        } }, styles: [".form   [_nghost-%COMP%]  .grey-bar>*>.form-group, .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group, .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field{margin-left:15px;padding-left:15px}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group:not(.form-group-error), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group:not(.form-group-error), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field:not(.form-group-error){border-left:solid 5px #b1b4b6}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>.form-group select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>.form-group textarea:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group textarea:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field textarea:not(.inline-block){display:block}"] });
+        } }, styles: [".input-upload-file[_ngcontent-%COMP%]{width:100%;display:none}.upload-file-container[_ngcontent-%COMP%]{display:flex;align-items:baseline}.input-label[_ngcontent-%COMP%]{width:8rem}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group, .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group, .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field{margin-left:15px;padding-left:15px}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group:not(.form-group-error), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group:not(.form-group-error), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field:not(.form-group-error){border-left:solid 5px #b1b4b6}.form   [_nghost-%COMP%]  .grey-bar>*>.form-group input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>.form-group select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>.form-group textarea:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>*>.form-group textarea:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field input:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field select:not(.inline-block), .form   [_nghost-%COMP%]  .grey-bar>*>dl.case-field textarea:not(.inline-block){display:block}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FieldWriteComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-field-write', template: "<div [hidden]=\"caseField.hidden\" [class.grey-bar]=\"canHaveGreyBar && !caseField.hiddenCannotChange\">\n  <ng-container #fieldContainer></ng-container>\n</div>\n", styles: [".form :host::ng-deep .grey-bar>*>.form-group,.form :host::ng-deep .grey-bar>*>*>.form-group,.form :host::ng-deep .grey-bar>*>dl.case-field{margin-left:15px;padding-left:15px}.form :host::ng-deep .grey-bar>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>dl.case-field:not(.form-group-error){border-left:solid 5px #b1b4b6}.form :host::ng-deep .grey-bar>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field input:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field select:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field textarea:not(.inline-block){display:block}\n"] }]
+        args: [{ selector: 'ccd-field-write', template: "<div [hidden]=\"caseField.hidden\" [class.grey-bar]=\"canHaveGreyBar && !caseField.hiddenCannotChange\">\n  <ng-container #fieldContainer></ng-container>\n</div>\n", styles: [".input-upload-file{width:100%;display:none}.upload-file-container{display:flex;align-items:baseline}.input-label{width:8rem}.form :host::ng-deep .grey-bar>*>.form-group,.form :host::ng-deep .grey-bar>*>*>.form-group,.form :host::ng-deep .grey-bar>*>dl.case-field{margin-left:15px;padding-left:15px}.form :host::ng-deep .grey-bar>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>*>.form-group:not(.form-group-error),.form :host::ng-deep .grey-bar>*>dl.case-field:not(.form-group-error){border-left:solid 5px #b1b4b6}.form :host::ng-deep .grey-bar>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group input:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group select:not(.inline-block),.form :host::ng-deep .grey-bar>*>*>.form-group textarea:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field input:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field select:not(.inline-block),.form :host::ng-deep .grey-bar>*>dl.case-field textarea:not(.inline-block){display:block}\n"] }]
     }], () => [{ type: i0.ComponentFactoryResolver }, { type: PaletteService }], { caseFields: [{
             type: Input
         }], fieldContainer: [{
@@ -24019,7 +24112,7 @@ class CaseFileViewOverlayMenuComponent {
             const trigger_r5 = i0.ɵɵreference(2);
             i0.ɵɵadvance(4);
             i0.ɵɵproperty("cdkConnectedOverlayOrigin", trigger_r5)("cdkConnectedOverlayOpen", ctx.isOpen)("cdkConnectedOverlayHasBackdrop", true)("cdkConnectedOverlayBackdropClass", "cdk-overlay-transparent-backdrop");
-        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$1.CdkConnectedOverlay, i2$1.CdkOverlayOrigin], styles: [".overlay-toggle[_ngcontent-%COMP%]{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu[_ngcontent-%COMP%]{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title[_ngcontent-%COMP%], .overlay-menu__item[_ngcontent-%COMP%]{padding:10px;border-bottom:1px solid grey}.overlay-menu__title[_ngcontent-%COMP%]:last-child, .overlay-menu__item[_ngcontent-%COMP%]:last-child{border:none}.overlay-menu__title[_ngcontent-%COMP%]{padding-left:6px;padding-right:6px}.overlay-menu__item[_ngcontent-%COMP%]{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item[_ngcontent-%COMP%]:hover{background-color:#fff2cc}.overlay-menu__item[_ngcontent-%COMP%]:focus{border:2px solid #ffbf47}.overlay-menu__itemIcon[_ngcontent-%COMP%]{height:1.25em;width:1.25em;margin-right:6px}"] });
+        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$2.CdkConnectedOverlay, i2$2.CdkOverlayOrigin], styles: [".overlay-toggle[_ngcontent-%COMP%]{display:block;background:none;border:0;padding:0 6px;margin-right:-4px;cursor:pointer}.overlay-menu[_ngcontent-%COMP%]{background-color:#fafafa;border:1px solid grey;margin-top:8px;font-size:1rem}.overlay-menu__title[_ngcontent-%COMP%], .overlay-menu__item[_ngcontent-%COMP%]{padding:10px;border-bottom:1px solid grey}.overlay-menu__title[_ngcontent-%COMP%]:last-child, .overlay-menu__item[_ngcontent-%COMP%]:last-child{border:none}.overlay-menu__title[_ngcontent-%COMP%]{padding-left:6px;padding-right:6px}.overlay-menu__item[_ngcontent-%COMP%]{display:flex;align-items:center;cursor:pointer;font-size:.875em}.overlay-menu__item[_ngcontent-%COMP%]:hover{background-color:#fff2cc}.overlay-menu__item[_ngcontent-%COMP%]:focus{border:2px solid #ffbf47}.overlay-menu__itemIcon[_ngcontent-%COMP%]{height:1.25em;width:1.25em;margin-right:6px}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewOverlayMenuComponent, [{
         type: Component,
@@ -24121,11 +24214,11 @@ class CaseFileViewFolderSortComponent {
         } if (rf & 2) {
             i0.ɵɵproperty("title", "Sort documents by name")("menuItems", ctx.overlayMenuItems);
             i0.ɵɵtwoWayProperty("isOpen", ctx.isOpen);
-        } }, dependencies: [CaseFileViewOverlayMenuComponent], styles: [".sort-button-icon[_ngcontent-%COMP%]{display:block;height:20px;margin-right:-2px}"] });
+        } }, dependencies: [CaseFileViewOverlayMenuComponent], styles: [".sort-button-icon[_ngcontent-%COMP%]{height:20px;margin-right:-2px}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewFolderSortComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-file-view-folder-sort', template: "<ccd-case-file-view-overlay-menu\n  [title]=\"'Sort documents by name'\"\n  [menuItems]=\"overlayMenuItems\"\n  [(isOpen)]=\"isOpen\"\n>\n  <ng-container trigger>\n    <img class=\"sort-button-icon\" src=\"/assets/img/sort/sort-arrows.svg\" alt=\"Sort Arrows\">\n  </ng-container>\n</ccd-case-file-view-overlay-menu>\n", styles: [".sort-button-icon{display:block;height:20px;margin-right:-2px}\n"] }]
+        args: [{ selector: 'ccd-case-file-view-folder-sort', template: "<ccd-case-file-view-overlay-menu\n  [title]=\"'Sort documents by name'\"\n  [menuItems]=\"overlayMenuItems\"\n  [(isOpen)]=\"isOpen\"\n>\n  <ng-container trigger>\n    <img class=\"sort-button-icon\" src=\"/assets/img/sort/sort-arrows.svg\" alt=\"Sort Arrows\">\n  </ng-container>\n</ccd-case-file-view-overlay-menu>\n", styles: [".sort-button-icon{height:20px;margin-right:-2px}\n"] }]
     }], () => [{ type: AbstractAppConfig }], { sortAscending: [{
             type: Output
         }], sortDescending: [{
@@ -24133,6 +24226,49 @@ class CaseFileViewFolderSortComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseFileViewFolderSortComponent, { className: "CaseFileViewFolderSortComponent", filePath: "lib/shared/components/palette/case-file-view/components/case-file-view-folder/case-file-view-folder-sort/case-file-view-folder-sort.component.ts", lineNumber: 11 }); })();
 
+class CaseFileViewFolderToggleComponent {
+    appConfig;
+    isOpen = false;
+    expandAll = new EventEmitter();
+    collapseAll = new EventEmitter();
+    overlayMenuItems = [
+        {
+            actionText: "Expand All",
+            iconSrc: "/assets/img/accordion-plus.png",
+            actionFn: () => this.expandAll.emit(true),
+        },
+        {
+            actionText: "Collapse All",
+            iconSrc: "/assets/img/accordion-minus.png",
+            actionFn: () => this.collapseAll.emit(true),
+        },
+    ];
+    constructor(appConfig) {
+        this.appConfig = appConfig;
+    }
+    static ɵfac = function CaseFileViewFolderToggleComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaseFileViewFolderToggleComponent)(i0.ɵɵdirectiveInject(AbstractAppConfig)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewFolderToggleComponent, selectors: [["ccd-case-file-view-folder-toggle"]], outputs: { expandAll: "expandAll", collapseAll: "collapseAll" }, decls: 3, vars: 3, consts: [[3, "isOpenChange", "title", "menuItems", "isOpen"], ["trigger", ""], ["src", "/assets/images/folder-open.png", "alt", "Toggle list", 1, "toggle-button-icon"]], template: function CaseFileViewFolderToggleComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "ccd-case-file-view-overlay-menu", 0);
+            i0.ɵɵtwoWayListener("isOpenChange", function CaseFileViewFolderToggleComponent_Template_ccd_case_file_view_overlay_menu_isOpenChange_0_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.isOpen, $event) || (ctx.isOpen = $event); return $event; });
+            i0.ɵɵelementContainerStart(1, 1);
+            i0.ɵɵelement(2, "img", 2);
+            i0.ɵɵelementContainerEnd();
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵproperty("title", "Toggle list")("menuItems", ctx.overlayMenuItems);
+            i0.ɵɵtwoWayProperty("isOpen", ctx.isOpen);
+        } }, dependencies: [CaseFileViewOverlayMenuComponent], styles: [".toggle-button-icon[_ngcontent-%COMP%]{margin-right:2px;height:20px}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewFolderToggleComponent, [{
+        type: Component,
+        args: [{ selector: "ccd-case-file-view-folder-toggle", template: "<ccd-case-file-view-overlay-menu [title]=\"'Toggle list'\" [menuItems]=\"overlayMenuItems\" [(isOpen)]=\"isOpen\">\n  <ng-container trigger>\n    <img class=\"toggle-button-icon\" src=\"/assets/images/folder-open.png\" alt=\"Toggle list\" />\n  </ng-container>\n</ccd-case-file-view-overlay-menu>", styles: [".toggle-button-icon{margin-right:2px;height:20px}\n"] }]
+    }], () => [{ type: AbstractAppConfig }], { expandAll: [{
+            type: Output
+        }], collapseAll: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseFileViewFolderToggleComponent, { className: "CaseFileViewFolderToggleComponent", filePath: "lib/shared/components/palette/case-file-view/components/case-file-view-folder/case-file-view-folder-toggle/case-file-view-folder-toggle.component.ts", lineNumber: 10 }); })();
+
 class CaseFileViewCategory {
     category_id;
     category_name;
@@ -24286,27 +24422,27 @@ __decorate([
     __metadata("design:paramtypes", [])
 ], DocumentTreeNode.prototype, "childDocumentCount", null);
 
-function CaseFileViewFolderComponent_div_8_div_1_Template(rf, ctx) { if (rf & 1) {
+function CaseFileViewFolderComponent_div_9_div_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div");
     i0.ɵɵtext(1, " No results found ");
     i0.ɵɵelementEnd();
 } }
-function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template(rf, ctx) { if (rf & 1) {
+function CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_4_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "cdk-nested-tree-node", 12)(1, "button", 13);
-    i0.ɵɵlistener("click", function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template_button_click_1_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.selectedNodeItem = node_r2; return i0.ɵɵresetView(ctx_r2.clickedDocument.emit(node_r2)); });
-    i0.ɵɵelementStart(2, "div", 14);
-    i0.ɵɵelement(3, "img", 15);
+    i0.ɵɵelementStart(0, "cdk-nested-tree-node", 14)(1, "button", 15);
+    i0.ɵɵlistener("click", function CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_4_Template_button_click_1_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); ctx_r2.selectedNodeItem = node_r2; return i0.ɵɵresetView(ctx_r2.clickedDocument.emit(node_r2)); });
+    i0.ɵɵelementStart(2, "div", 16);
+    i0.ɵɵelement(3, "img", 17);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "span", 16);
+    i0.ɵɵelementStart(4, "span", 18);
     i0.ɵɵtext(5);
     i0.ɵɵelement(6, "br");
-    i0.ɵɵelementStart(7, "span", 17);
+    i0.ɵɵelementStart(7, "span", 19);
     i0.ɵɵtext(8);
     i0.ɵɵpipe(9, "ccdDate");
     i0.ɵɵelementEnd()()();
-    i0.ɵɵelementStart(10, "div", 18)(11, "ccd-case-file-view-folder-document-actions", 19);
-    i0.ɵɵlistener("changeFolderAction", function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_changeFolderAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("changeFolder", node_r2)); })("openInANewTabAction", function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_openInANewTabAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("openInANewTab", node_r2)); })("downloadAction", function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_downloadAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("download", node_r2)); })("printAction", function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_printAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("print", node_r2)); });
+    i0.ɵɵelementStart(10, "div", 20)(11, "ccd-case-file-view-folder-document-actions", 21);
+    i0.ɵɵlistener("changeFolderAction", function CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_changeFolderAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("changeFolder", node_r2)); })("openInANewTabAction", function CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_openInANewTabAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("openInANewTab", node_r2)); })("downloadAction", function CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_downloadAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("download", node_r2)); })("printAction", function CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_4_Template_ccd_case_file_view_folder_document_actions_printAction_11_listener() { const node_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.triggerDocumentAction("print", node_r2)); });
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const node_r2 = ctx.$implicit;
@@ -24320,17 +24456,17 @@ function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template(rf, c
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("allowMoving", ctx_r2.allowMoving);
 } }
-function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "cdk-nested-tree-node", 20)(1, "button", 21)(2, "div", 22);
-    i0.ɵɵelement(3, "img", 23);
-    i0.ɵɵelementStart(4, "span", 24);
+function CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "cdk-nested-tree-node", 22)(1, "button", 23)(2, "div", 24);
+    i0.ɵɵelement(3, "img", 25);
+    i0.ɵɵelementStart(4, "span", 26);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(6, "span", 25);
+    i0.ɵɵelementStart(6, "span", 27);
     i0.ɵɵtext(7);
     i0.ɵɵelementEnd()();
     i0.ɵɵelementStart(8, "div");
-    i0.ɵɵelementContainer(9, 26);
+    i0.ɵɵelementContainer(9, 28);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const node_r4 = ctx.$implicit;
@@ -24346,11 +24482,11 @@ function CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_5_Template(rf, c
     i0.ɵɵadvance();
     i0.ɵɵclassProp("document-tree-invisible", !ctx_r2.nestedTreeControl.isExpanded(node_r4));
 } }
-function CaseFileViewFolderComponent_div_8_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 7);
-    i0.ɵɵtemplate(1, CaseFileViewFolderComponent_div_8_div_1_Template, 2, 0, "div", 8);
-    i0.ɵɵelementStart(2, "div")(3, "cdk-tree", 9);
-    i0.ɵɵtemplate(4, CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_4_Template, 12, 9, "cdk-nested-tree-node", 10)(5, CaseFileViewFolderComponent_div_8_cdk_nested_tree_node_5_Template, 10, 6, "cdk-nested-tree-node", 11);
+function CaseFileViewFolderComponent_div_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵtemplate(1, CaseFileViewFolderComponent_div_9_div_1_Template, 2, 0, "div", 10);
+    i0.ɵɵelementStart(2, "div")(3, "cdk-tree", 11);
+    i0.ɵɵtemplate(4, CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_4_Template, 12, 9, "cdk-nested-tree-node", 12)(5, CaseFileViewFolderComponent_div_9_cdk_nested_tree_node_5_Template, 10, 6, "cdk-nested-tree-node", 13);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
@@ -24405,6 +24541,14 @@ class CaseFileViewFolderComponent {
         this.appConfig = appConfig;
         this.nestedTreeControl = new NestedTreeControl(this.getChildren);
     }
+    collapseAll(expand) {
+        this.nestedTreeControl.collapseAll();
+    }
+    expandAll(expand) {
+        this.nestedDataSource.forEach((node) => {
+            this.nestedTreeControl.expandDescendants(node);
+        });
+    }
     ngOnInit() {
         this.documentFilterFormGroup = new FormGroup({});
         this.documentSearchFormControl = new FormControl('');
@@ -24588,29 +24732,32 @@ class CaseFileViewFolderComponent {
         a.remove();
     }
     static ɵfac = function CaseFileViewFolderComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaseFileViewFolderComponent)(i0.ɵɵdirectiveInject(WindowService), i0.ɵɵdirectiveInject(i1$1.Router), i0.ɵɵdirectiveInject(DocumentManagementService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(AbstractAppConfig)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewFolderComponent, selectors: [["ccd-case-file-view-folder"]], inputs: { categoriesAndDocuments: "categoriesAndDocuments", allowMoving: "allowMoving" }, outputs: { clickedDocument: "clickedDocument", moveDocument: "moveDocument" }, decls: 9, vars: 3, consts: [[1, "document-filter-container"], [1, "form-group", "document-filter", 3, "formGroup"], ["type", "search", "id", "document-search", "name", "documentSearchFormControl", "formControlName", "documentSearchFormControl", "placeholder", "Search by document name", "aria-label", "Search by document name", 1, "form-control", "document-search"], [1, "document-folders-header"], [1, "document-folders-header__title"], [3, "sortAscending", "sortDescending"], ["class", "document-tree-container", 4, "ngIf"], [1, "document-tree-container"], [4, "ngIf"], [3, "dataSource", "treeControl"], ["class", "document-tree-container__node document-tree-container__node--document", 4, "cdkTreeNodeDef"], ["class", "document-tree-container__node document-tree-container__folder", 4, "cdkTreeNodeDef", "cdkTreeNodeDefWhen"], [1, "document-tree-container__node", "document-tree-container__node--document"], [1, "node", "case-file__node", 3, "click"], ["disabled", "", 1, "node__icon"], ["src", "/assets/img/case-file-view/case-file-view-document.svg", "alt", "Document icon", 1, "node__iconImg"], [1, "node__name", "node-name-document"], [1, "node__document-upload-timestamp"], [1, "node__document-options", "case-file__action"], [3, "changeFolderAction", "openInANewTabAction", "downloadAction", "printAction", "allowMoving"], [1, "document-tree-container__node", "document-tree-container__folder"], ["cdkTreeNodeToggle", "", 1, "node"], [1, "node__icon"], ["alt", "Folder icon", 1, "node__iconImg", 3, "src"], [1, "node__count"], [1, "node__name", "node__name--folder"], ["cdkTreeNodeOutlet", ""]], template: function CaseFileViewFolderComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseFileViewFolderComponent, selectors: [["ccd-case-file-view-folder"]], inputs: { categoriesAndDocuments: "categoriesAndDocuments", allowMoving: "allowMoving" }, outputs: { clickedDocument: "clickedDocument", moveDocument: "moveDocument" }, decls: 10, vars: 3, consts: [[1, "document-filter-container"], [1, "form-group", "document-filter", 3, "formGroup"], ["type", "search", "id", "document-search", "name", "documentSearchFormControl", "formControlName", "documentSearchFormControl", "placeholder", "Search by document name", "aria-label", "Search by document name", 1, "form-control", "document-search"], [1, "document-folders-header"], [1, "document-folders-header__title"], [1, "document-folders-header__flex"], [3, "expandAll", "collapseAll"], [3, "sortAscending", "sortDescending"], ["class", "document-tree-container", 4, "ngIf"], [1, "document-tree-container"], [4, "ngIf"], [3, "dataSource", "treeControl"], ["class", "document-tree-container__node document-tree-container__node--document", 4, "cdkTreeNodeDef"], ["class", "document-tree-container__node document-tree-container__folder", 4, "cdkTreeNodeDef", "cdkTreeNodeDefWhen"], [1, "document-tree-container__node", "document-tree-container__node--document"], [1, "node", "case-file__node", 3, "click"], ["disabled", "", 1, "node__icon"], ["src", "/assets/img/case-file-view/case-file-view-document.svg", "alt", "Document icon", 1, "node__iconImg"], [1, "node__name", "node-name-document"], [1, "node__document-upload-timestamp"], [1, "node__document-options", "case-file__action"], [3, "changeFolderAction", "openInANewTabAction", "downloadAction", "printAction", "allowMoving"], [1, "document-tree-container__node", "document-tree-container__folder"], ["cdkTreeNodeToggle", "", 1, "node"], [1, "node__icon"], ["alt", "Folder icon", 1, "node__iconImg", 3, "src"], [1, "node__count"], [1, "node__name", "node__name--folder"], ["cdkTreeNodeOutlet", ""]], template: function CaseFileViewFolderComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
             i0.ɵɵelement(2, "input", 2);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(3, "div", 3)(4, "span", 4);
+            i0.ɵɵelementStart(3, "div", 3)(4, "div", 4);
             i0.ɵɵtext(5);
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(6, "div")(7, "ccd-case-file-view-folder-sort", 5);
-            i0.ɵɵlistener("sortAscending", function CaseFileViewFolderComponent_Template_ccd_case_file_view_folder_sort_sortAscending_7_listener($event) { return ctx.sortDataSourceAscending($event); })("sortDescending", function CaseFileViewFolderComponent_Template_ccd_case_file_view_folder_sort_sortDescending_7_listener($event) { return ctx.sortDataSourceDescending($event); });
+            i0.ɵɵelementStart(6, "div", 5)(7, "ccd-case-file-view-folder-toggle", 6);
+            i0.ɵɵlistener("expandAll", function CaseFileViewFolderComponent_Template_ccd_case_file_view_folder_toggle_expandAll_7_listener($event) { return ctx.expandAll($event); })("collapseAll", function CaseFileViewFolderComponent_Template_ccd_case_file_view_folder_toggle_collapseAll_7_listener($event) { return ctx.collapseAll($event); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "ccd-case-file-view-folder-sort", 7);
+            i0.ɵɵlistener("sortAscending", function CaseFileViewFolderComponent_Template_ccd_case_file_view_folder_sort_sortAscending_8_listener($event) { return ctx.sortDataSourceAscending($event); })("sortDescending", function CaseFileViewFolderComponent_Template_ccd_case_file_view_folder_sort_sortDescending_8_listener($event) { return ctx.sortDataSourceDescending($event); });
             i0.ɵɵelementEnd()()();
-            i0.ɵɵtemplate(8, CaseFileViewFolderComponent_div_8_Template, 6, 4, "div", 6);
+            i0.ɵɵtemplate(9, CaseFileViewFolderComponent_div_9_Template, 6, 4, "div", 8);
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵproperty("formGroup", ctx.documentFilterFormGroup);
             i0.ɵɵadvance(4);
             i0.ɵɵtextInterpolate1("Documents (", ctx.documentCount, ")");
-            i0.ɵɵadvance(3);
+            i0.ɵɵadvance(4);
             i0.ɵɵproperty("ngIf", ctx.documentTreeData);
-        } }, dependencies: [i5.NgIf, i4.DefaultValueAccessor, i4.NgControlStatus, i4.NgControlStatusGroup, i4.FormGroupDirective, i4.FormControlName, i7$1.CdkNestedTreeNode, i7$1.CdkTreeNodeDef, i7$1.CdkTreeNodeToggle, i7$1.CdkTree, i7$1.CdkTreeNodeOutlet, CaseFileViewFolderSortComponent, CaseFileViewFolderDocumentActionsComponent, DatePipe], styles: ["[_nghost-%COMP%]{display:flex;height:100%;flex-direction:column}[_nghost-%COMP%]   .document-tree-container[_ngcontent-%COMP%]{flex:1 0}.document-filter-container[_ngcontent-%COMP%]{border-bottom:2px solid #C9C9C9}.document-filter-container[_ngcontent-%COMP%]   .document-filter[_ngcontent-%COMP%]{padding:10px}.document-filter-container[_ngcontent-%COMP%]   .document-filter[_ngcontent-%COMP%]   .document-search[_ngcontent-%COMP%]{background:url(/assets/images/icon-search-black.svg) no-repeat right #fff;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container[_ngcontent-%COMP%]   .documents-title[_ngcontent-%COMP%]{height:30%;margin-left:8px;font-weight:700}.document-tree-container[_ngcontent-%COMP%]{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node[_ngcontent-%COMP%]{display:block}.document-tree-container__node[_ngcontent-%COMP%]   .document-tree-container__node[_ngcontent-%COMP%]{padding-left:40px}.document-tree-container[_ngcontent-%COMP%]   .document-tree-invisible[_ngcontent-%COMP%]{display:none}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:7px}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-button{display:none}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-track-piece{background:#eee}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#ccc}.document-folders-header[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title[_ngcontent-%COMP%]{font-weight:700}.node[_ngcontent-%COMP%]{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected[_ngcontent-%COMP%]{background:#fff2cc}.node__icon[_ngcontent-%COMP%]{position:relative;display:inline-block}.node__count[_ngcontent-%COMP%]{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg[_ngcontent-%COMP%]{display:block;height:30px;width:30px}.node__name[_ngcontent-%COMP%]{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options[_ngcontent-%COMP%]{margin-left:auto;margin-right:0}.node__document-upload-timestamp[_ngcontent-%COMP%]{font-size:.8rem;float:left;padding-left:10px}.node.case-file__node[_ngcontent-%COMP%]{width:80%;float:left}.node__document-options.case-file__action[_ngcontent-%COMP%]{width:15%;float:left;box-sizing:border-box;padding:12px}"] });
+        } }, dependencies: [i5.NgIf, i4.DefaultValueAccessor, i4.NgControlStatus, i4.NgControlStatusGroup, i4.FormGroupDirective, i4.FormControlName, i7$1.CdkNestedTreeNode, i7$1.CdkTreeNodeDef, i7$1.CdkTreeNodeToggle, i7$1.CdkTree, i7$1.CdkTreeNodeOutlet, CaseFileViewFolderSortComponent, CaseFileViewFolderToggleComponent, CaseFileViewFolderDocumentActionsComponent, DatePipe], styles: ["[_nghost-%COMP%]{display:flex;height:100%;flex-direction:column}[_nghost-%COMP%]   .document-tree-container[_ngcontent-%COMP%]{flex:1 0}.document-filter-container[_ngcontent-%COMP%]{border-bottom:2px solid #C9C9C9}.document-filter-container[_ngcontent-%COMP%]   .document-filter[_ngcontent-%COMP%]{padding:10px}.document-filter-container[_ngcontent-%COMP%]   .document-filter[_ngcontent-%COMP%]   .document-search[_ngcontent-%COMP%]{background:url(/assets/images/icon-search-black.svg) no-repeat right #fff;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container[_ngcontent-%COMP%]   .documents-title[_ngcontent-%COMP%]{height:30%;margin-left:8px;font-weight:700}.document-folders-header__flex[_ngcontent-%COMP%]{display:flex;flex-direction:row}.document-tree-container[_ngcontent-%COMP%]{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node[_ngcontent-%COMP%]{display:block}.document-tree-container__node[_ngcontent-%COMP%]   .document-tree-container__node[_ngcontent-%COMP%]{padding-left:40px}.document-tree-container[_ngcontent-%COMP%]   .document-tree-invisible[_ngcontent-%COMP%]{display:none}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar{width:7px}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-button{display:none}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-track-piece{background:#eee}.document-tree-container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:#ccc}.document-folders-header[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title[_ngcontent-%COMP%]{font-weight:700}.node[_ngcontent-%COMP%]{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected[_ngcontent-%COMP%]{background:#fff2cc}.node__icon[_ngcontent-%COMP%]{position:relative;display:inline-block}.node__count[_ngcontent-%COMP%]{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg[_ngcontent-%COMP%]{display:block;height:30px;width:30px}.node__name[_ngcontent-%COMP%]{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options[_ngcontent-%COMP%]{margin-left:auto;margin-right:0}.node__document-upload-timestamp[_ngcontent-%COMP%]{font-size:.8rem;float:left;padding-left:10px}.node.case-file__node[_ngcontent-%COMP%]{width:80%;float:left}.node__document-options.case-file__action[_ngcontent-%COMP%]{width:15%;float:left;box-sizing:border-box;padding:12px}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFileViewFolderComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-file-view-folder', template: "<div class=\"document-filter-container\">\n  <div class=\"form-group document-filter\" [formGroup]=\"documentFilterFormGroup\">\n    <input class=\"form-control document-search\"\n      type=\"search\"\n      id=\"document-search\"\n      name=\"documentSearchFormControl\"\n      formControlName=\"documentSearchFormControl\"\n      placeholder=\"Search by document name\"\n      aria-label=\"Search by document name\">\n  </div>\n</div>\n\n<div class=\"document-folders-header\">\n  <span class=\"document-folders-header__title\">Documents ({{ documentCount }})</span>\n  <div>\n    <ccd-case-file-view-folder-sort\n      (sortAscending)=\"sortDataSourceAscending($event)\"\n      (sortDescending)=\"sortDataSourceDescending($event)\"\n    ></ccd-case-file-view-folder-sort>\n  </div>\n</div>\n\n<div class=\"document-tree-container\" *ngIf=\"documentTreeData\">\n  <div *ngIf=\"!nestedDataSource || nestedDataSource.length === 0\">\n    No results found\n  </div>\n  <div>\n    <cdk-tree [dataSource]=\"nestedDataSource\" [treeControl]=\"nestedTreeControl\">\n      <!-- document -->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__node--document\" *cdkTreeNodeDef=\"let node\">\n        <button class=\"node case-file__node\" (click)=\"selectedNodeItem = node; clickedDocument.emit(node)\"\n                [class.node--selected]=\"selectedNodeItem?.name === node.name\">\n          <div class=\"node__icon\" disabled>\n            <img src=\"/assets/img/case-file-view/case-file-view-document.svg\" class=\"node__iconImg\" alt=\"Document icon\">\n          </div>\n          <span class=\"node__name node-name-document\">\n            {{node.name}}\n            <br>\n            <span class=\"node__document-upload-timestamp\">{{node.upload_timestamp | ccdDate : 'local' :'dd MMM YYYY HH:mm'}}</span>\n          </span>\n        </button>\n        <div class=\"node__document-options case-file__action\">\n          <ccd-case-file-view-folder-document-actions\n            (changeFolderAction)=\"triggerDocumentAction('changeFolder', node)\"\n            (openInANewTabAction)=\"triggerDocumentAction('openInANewTab', node)\"\n            (downloadAction)=\"triggerDocumentAction('download', node)\"\n            (printAction)=\"triggerDocumentAction('print', node)\"\n            [allowMoving]=\"allowMoving\"\n          >\n          </ccd-case-file-view-folder-document-actions>\n        </div>\n      </cdk-nested-tree-node>\n      <!-- folder-->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__folder\" *cdkTreeNodeDef=\"let node; when: nestedChildren\">\n        <button class=\"node\" cdkTreeNodeToggle>\n          <div class=\"node__icon\" [attr.aria-label]=\"'toggle ' + node.name\" >\n            <img class=\"node__iconImg\"\n                 [src]=\"nestedTreeControl.isExpanded(node) ? '/assets/images/folder-open.png' : '/assets/images/folder.png'\" alt=\"Folder icon\">\n            <span class=\"node__count\">{{node.childDocumentCount}}</span>\n          </div>\n          <span class=\"node__name node__name--folder\">{{node.name}}</span>\n        </button>\n\n        <div [class.document-tree-invisible]=\"!nestedTreeControl.isExpanded(node)\">\n          <ng-container cdkTreeNodeOutlet></ng-container>\n        </div>\n      </cdk-nested-tree-node>\n    </cdk-tree>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;flex-direction:column}:host .document-tree-container{flex:1 0}.document-filter-container{border-bottom:2px solid #C9C9C9}.document-filter-container .document-filter{padding:10px}.document-filter-container .document-filter .document-search{background:url(/assets/images/icon-search-black.svg) no-repeat right #fff;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container .documents-title{height:30%;margin-left:8px;font-weight:700}.document-tree-container{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node{display:block}.document-tree-container__node .document-tree-container__node{padding-left:40px}.document-tree-container .document-tree-invisible{display:none}.document-tree-container::-webkit-scrollbar{width:7px}.document-tree-container::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container::-webkit-scrollbar-button{display:none}.document-tree-container::-webkit-scrollbar-track-piece{background:#eee}.document-tree-container::-webkit-scrollbar-thumb{background:#ccc}.document-folders-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title{font-weight:700}.node{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected{background:#fff2cc}.node__icon{position:relative;display:inline-block}.node__count{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg{display:block;height:30px;width:30px}.node__name{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options{margin-left:auto;margin-right:0}.node__document-upload-timestamp{font-size:.8rem;float:left;padding-left:10px}.node.case-file__node{width:80%;float:left}.node__document-options.case-file__action{width:15%;float:left;box-sizing:border-box;padding:12px}\n"] }]
+        args: [{ selector: 'ccd-case-file-view-folder', template: "<div class=\"document-filter-container\">\n  <div class=\"form-group document-filter\" [formGroup]=\"documentFilterFormGroup\">\n    <input \n      class=\"form-control document-search\" \n      type=\"search\" \n      id=\"document-search\" \n      name=\"documentSearchFormControl\"\n      formControlName=\"documentSearchFormControl\"\n      placeholder=\"Search by document name\"\n      aria-label=\"Search by document name\" />\n  </div>\n</div>\n\n<div class=\"document-folders-header\">\n  <div class=\"document-folders-header__title\">Documents ({{ documentCount }})</div>\n  <div class=\"document-folders-header__flex\">\n    <ccd-case-file-view-folder-toggle \n      (expandAll)=\"expandAll($event)\"\n      (collapseAll)=\"collapseAll($event)\">\n    </ccd-case-file-view-folder-toggle>\n    <ccd-case-file-view-folder-sort \n      (sortAscending)=\"sortDataSourceAscending($event)\"\n      (sortDescending)=\"sortDataSourceDescending($event)\">\n    </ccd-case-file-view-folder-sort>\n  </div>\n</div>\n\n<div class=\"document-tree-container\" *ngIf=\"documentTreeData\">\n  <div *ngIf=\"!nestedDataSource || nestedDataSource.length === 0\">\n    No results found\n  </div>\n  <div>\n    <cdk-tree [dataSource]=\"nestedDataSource\" [treeControl]=\"nestedTreeControl\">\n      <!-- document -->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__node--document\" *cdkTreeNodeDef=\"let node\">\n        <button class=\"node case-file__node\" (click)=\"selectedNodeItem = node; clickedDocument.emit(node)\"\n                [class.node--selected]=\"selectedNodeItem?.name === node.name\">\n          <div class=\"node__icon\" disabled>\n            <img src=\"/assets/img/case-file-view/case-file-view-document.svg\" \n              class=\"node__iconImg\"\n              alt=\"Document icon\" \n            />\n          </div>\n          <span class=\"node__name node-name-document\">\n            {{ node.name }}\n            <br />\n            <span class=\"node__document-upload-timestamp\">{{\n              node.upload_timestamp | ccdDate: \"local\":\"dd MMM YYYY HH:mm\"\n              }}</span>\n          </span>\n        </button>\n        <div class=\"node__document-options case-file__action\">\n          <ccd-case-file-view-folder-document-actions\n            (changeFolderAction)=\"triggerDocumentAction('changeFolder', node)\"\n            (openInANewTabAction)=\"triggerDocumentAction('openInANewTab', node)\"\n            (downloadAction)=\"triggerDocumentAction('download', node)\"\n            (printAction)=\"triggerDocumentAction('print', node)\"\n            [allowMoving]=\"allowMoving\"\n          >\n          </ccd-case-file-view-folder-document-actions>\n        </div>\n      </cdk-nested-tree-node>\n      <!-- folder-->\n      <cdk-nested-tree-node class=\"document-tree-container__node document-tree-container__folder\" *cdkTreeNodeDef=\"let node; when: nestedChildren\">\n        <button class=\"node\" cdkTreeNodeToggle>\n          <div class=\"node__icon\" [attr.aria-label]=\"'toggle ' + node.name\">\n            <img class=\"node__iconImg\" \n                [src]=\"nestedTreeControl.isExpanded(node)\n                  ? '/assets/images/folder-open.png'\n                  : '/assets/images/folder.png'\n              \" alt=\"Folder icon\" />\n            <span class=\"node__count\">{{ node.childDocumentCount }}</span>\n          </div>\n          <span class=\"node__name node__name--folder\">{{ node.name }}</span>\n        </button>\n        <div [class.document-tree-invisible]=\"!nestedTreeControl.isExpanded(node)\">\n          <ng-container cdkTreeNodeOutlet></ng-container>\n        </div>\n      </cdk-nested-tree-node>\n    </cdk-tree>\n  </div>\n</div>\n", styles: [":host{display:flex;height:100%;flex-direction:column}:host .document-tree-container{flex:1 0}.document-filter-container{border-bottom:2px solid #C9C9C9}.document-filter-container .document-filter{padding:10px}.document-filter-container .document-filter .document-search{background:url(/assets/images/icon-search-black.svg) no-repeat right #fff;background-position-x:calc(100% - 4px);padding-right:30px;width:100%}.document-filter-container .documents-title{height:30%;margin-left:8px;font-weight:700}.document-folders-header__flex{display:flex;flex-direction:row}.document-tree-container{padding:4px;overflow-x:hidden;overflow-y:scroll}.document-tree-container__node{display:block}.document-tree-container__node .document-tree-container__node{padding-left:40px}.document-tree-container .document-tree-invisible{display:none}.document-tree-container::-webkit-scrollbar{width:7px}.document-tree-container::-webkit-scrollbar-thumb{border:4px solid rgba(0,0,0,0);background-clip:padding-box;border-radius:9999px;background-color:#aaa}.document-tree-container::-webkit-scrollbar-button{display:none}.document-tree-container::-webkit-scrollbar-track-piece{background:#eee}.document-tree-container::-webkit-scrollbar-thumb{background:#ccc}.document-folders-header{display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid #C9C9C9;padding:10px}.document-folders-header__title{font-weight:700}.node{display:flex;align-items:center;width:100%;padding:10px;background:none;border:0;cursor:pointer;white-space:nowrap}.node--selected{background:#fff2cc}.node__icon{position:relative;display:inline-block}.node__count{color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:.875rem;padding-top:4px}.node__iconImg{display:block;height:30px;width:30px}.node__name{margin-left:6px;font-size:1rem;overflow:hidden;text-overflow:ellipsis}.node__document-options{margin-left:auto;margin-right:0}.node__document-upload-timestamp{font-size:.8rem;float:left;padding-left:10px}.node.case-file__node{width:80%;float:left}.node__document-options.case-file__action{width:15%;float:left;box-sizing:border-box;padding:12px}\n"] }]
     }], () => [{ type: WindowService }, { type: i1$1.Router }, { type: DocumentManagementService }, { type: i1$3.MatLegacyDialog }, { type: AbstractAppConfig }], { categoriesAndDocuments: [{
             type: Input
         }], allowMoving: [{
@@ -29684,7 +29831,7 @@ class MarkdownComponentModule {
     }], null, null); })();
 (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(MarkdownComponentModule, { declarations: [MarkdownComponent,
         RouterLinkComponent], imports: [CommonModule,
-        ReactiveFormsModule, i1.RpxTranslationModule, PipesModule, i1$4.MarkdownModule, RouterModule], exports: [MarkdownComponent,
+        ReactiveFormsModule, i1.RpxTranslationModule, PipesModule, i2$1.MarkdownModule, RouterModule], exports: [MarkdownComponent,
         RouterLinkComponent] }); })();
 
 class FeeValue {
@@ -30173,6 +30320,7 @@ const PALETTE_COMPONENTS = [
     CaseFileViewFieldComponent,
     CaseFileViewFolderComponent,
     CaseFileViewFolderSortComponent,
+    CaseFileViewFolderToggleComponent,
     CaseFileViewOverlayMenuComponent,
     CaseFileViewFolderDocumentActionsComponent,
     CaseFileViewFolderSelectorComponent,
@@ -30443,6 +30591,7 @@ class PaletteModule {
         CaseFileViewFieldComponent,
         CaseFileViewFolderComponent,
         CaseFileViewFolderSortComponent,
+        CaseFileViewFolderToggleComponent,
         CaseFileViewOverlayMenuComponent,
         CaseFileViewFolderDocumentActionsComponent,
         CaseFileViewFolderSelectorComponent,
@@ -30503,7 +30652,7 @@ class PaletteModule {
         BodyModule,
         FormModule,
         TabsModule,
-        LabelSubstitutorModule, i1$4.MarkdownModule, NgxMatDatetimePickerModule,
+        LabelSubstitutorModule, i2$1.MarkdownModule, NgxMatDatetimePickerModule,
         NgxMatTimepickerModule,
         NgxMatNativeDateModule,
         MatLegacyFormFieldModule,
@@ -30599,6 +30748,7 @@ class PaletteModule {
         CaseFileViewFieldComponent,
         CaseFileViewFolderComponent,
         CaseFileViewFolderSortComponent,
+        CaseFileViewFolderToggleComponent,
         CaseFileViewOverlayMenuComponent,
         CaseFileViewFolderDocumentActionsComponent,
         CaseFileViewFolderSelectorComponent,
@@ -30676,7 +30826,7 @@ i0.ɵɵsetComponentScope(ReadLinkedCasesFieldComponent, function () { return [i5
 i0.ɵɵsetComponentScope(WriteAddressFieldComponent, function () { return [i5.NgClass, i5.NgForOf, i5.NgIf, i4.NgSelectOption, i4.ɵNgSelectMultipleOption, i4.DefaultValueAccessor, i4.SelectControlValueAccessor, i4.NgControlStatus, i4.NgControlStatusGroup, i4.FormControlDirective, i4.FormGroupDirective, WriteComplexFieldComponent]; }, function () { return [FieldLabelPipe, i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(WriteComplexFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i4.NgControlStatusGroup, i4.FormGroupDirective, LabelSubstitutorDirective, FieldReadComponent,
     FieldWriteComponent]; }, function () { return [FieldLabelPipe, IsReadOnlyPipe]; });
-i0.ɵɵsetComponentScope(WriteDocumentFieldComponent, function () { return [i5.NgClass, i5.NgIf, i1$4.MarkdownComponent, ReadDocumentFieldComponent]; }, function () { return [FieldLabelPipe, i1.RpxTranslatePipe]; });
+i0.ɵɵsetComponentScope(WriteDocumentFieldComponent, function () { return [i5.NgClass, i5.NgIf, i2$1.MarkdownComponent, ReadDocumentFieldComponent]; }, function () { return [FieldLabelPipe, i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(WriteDateContainerFieldComponent, function () { return [i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, DatetimePickerComponent,
     WriteDateFieldComponent]; }, []);
 i0.ɵɵsetComponentScope(WriteCaseFlagFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i4.NgControlStatusGroup, i4.FormGroupDirective, SelectFlagTypeComponent,
@@ -30696,7 +30846,7 @@ i0.ɵɵsetComponentScope(WriteOrganisationFieldComponent, function () { return [
 i0.ɵɵsetComponentScope(WriteOrderSummaryFieldComponent, function () { return [ReadOrderSummaryFieldComponent]; }, []);
 i0.ɵɵsetComponentScope(WriteDateContainerFieldComponent, function () { return [i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, DatetimePickerComponent,
     WriteDateFieldComponent]; }, []);
-i0.ɵɵsetComponentScope(WriteCollectionFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, i1$4.MarkdownComponent, FieldWriteComponent]; }, function () { return [FieldLabelPipe, FirstErrorPipe, i1.RpxTranslatePipe]; });
+i0.ɵɵsetComponentScope(WriteCollectionFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i4.NgControlStatusGroup, i4.FormGroupDirective, MarkdownComponent, FieldWriteComponent]; }, function () { return [FieldLabelPipe, FirstErrorPipe, i1.RpxTranslatePipe]; });
 i0.ɵɵsetComponentScope(
 // ComponentLauncher web components
 CaseFileViewFieldComponent, function () { return [i5.NgForOf, i5.NgIf, i14.MediaViewerComponent, CaseFileViewFolderComponent]; }, []);
@@ -32097,7 +32247,7 @@ class PaginationComponent {
             i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(3, 4, "Pagination"));
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", !(ctx.autoHide && p_r3.pages.length <= 1));
-        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$2.PaginationControlsDirective, i5.DecimalPipe, i1.RpxTranslatePipe], styles: [".ngx-pagination[_ngcontent-%COMP%]{margin-left:0;margin-bottom:1rem;padding-top:25px;text-decoration:none;text-align:left;font-size:16px}.ngx-pagination[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]:after{content:\" \";display:table}.ngx-pagination[_ngcontent-%COMP%]:after{clear:both}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;margin-right:.0625rem;border-radius:0}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{display:block;padding:.1875rem .625rem;border-radius:0;color:#005da6}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:hover, .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover{background:#e6e6e6}.ngx-pagination[_ngcontent-%COMP%]   .current[_ngcontent-%COMP%]{padding:.1875rem .625rem;background:#fff;color:#4c2c92;cursor:default;font-weight:900;text-decoration:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]{display:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]:hover{background:transparent}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{cursor:pointer}.ngx-pagination[_ngcontent-%COMP%]   .pagination-previous[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]   .pagination-previous.disabled[_ngcontent-%COMP%]:before{margin-right:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:3px 0 0 3px}.ngx-pagination[_ngcontent-%COMP%]   .pagination-next[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:after, .ngx-pagination[_ngcontent-%COMP%]   .pagination-next.disabled[_ngcontent-%COMP%]:after{margin-left:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:0 3px 3px 0}.ngx-pagination[_ngcontent-%COMP%]   .show-for-sr[_ngcontent-%COMP%]{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.ngx-pagination[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:none}@media screen and (max-width: 601px){.ngx-pagination.responsive[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination.responsive[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]:not(.small-screen):not(.pagination-previous):not(.pagination-next){display:none}}"] });
+        } }, dependencies: [i5.NgForOf, i5.NgIf, i2$3.PaginationControlsDirective, i5.DecimalPipe, i1.RpxTranslatePipe], styles: [".ngx-pagination[_ngcontent-%COMP%]{margin-left:0;margin-bottom:1rem;padding-top:25px;text-decoration:none;text-align:left;font-size:16px}.ngx-pagination[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]:after{content:\" \";display:table}.ngx-pagination[_ngcontent-%COMP%]:after{clear:both}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;margin-right:.0625rem;border-radius:0}.ngx-pagination[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{display:block;padding:.1875rem .625rem;border-radius:0;color:#005da6}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:hover, .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:hover{background:#e6e6e6}.ngx-pagination[_ngcontent-%COMP%]   .current[_ngcontent-%COMP%]{padding:.1875rem .625rem;background:#fff;color:#4c2c92;cursor:default;font-weight:900;text-decoration:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]{display:none}.ngx-pagination[_ngcontent-%COMP%]   .disabled[_ngcontent-%COMP%]:hover{background:transparent}.ngx-pagination[_ngcontent-%COMP%]   a[_ngcontent-%COMP%], .ngx-pagination[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{cursor:pointer}.ngx-pagination[_ngcontent-%COMP%]   .pagination-previous[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:before, .ngx-pagination[_ngcontent-%COMP%]   .pagination-previous.disabled[_ngcontent-%COMP%]:before{margin-right:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:3px 0 0 3px}.ngx-pagination[_ngcontent-%COMP%]   .pagination-next[_ngcontent-%COMP%]   a[_ngcontent-%COMP%]:after, .ngx-pagination[_ngcontent-%COMP%]   .pagination-next.disabled[_ngcontent-%COMP%]:after{margin-left:.5rem;display:inline-block;height:10px;width:10px;border-style:solid;color:#0a0a0a;background:transparent;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg);content:\"\";border-width:0 3px 3px 0}.ngx-pagination[_ngcontent-%COMP%]   .show-for-sr[_ngcontent-%COMP%]{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.ngx-pagination[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:none}@media screen and (max-width: 601px){.ngx-pagination.responsive[_ngcontent-%COMP%]   .small-screen[_ngcontent-%COMP%]{display:inline-block}.ngx-pagination.responsive[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]:not(.small-screen):not(.pagination-previous):not(.pagination-next){display:none}}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PaginationComponent, [{
         type: Component,
@@ -32443,7 +32593,7 @@ class CaseListComponent {
             i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind2(10, 10, ctx.cases, i0.ɵɵpureFunction3(13, _c0$c, ctx.pageSize, ctx.currentPageNo, ctx.totalResultsCount)));
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.totalResultsCount > ctx.pageSize);
-        } }, dependencies: [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i5.NgSwitchDefault, i1$1.RouterLink, PaginationComponent, i5.CurrencyPipe, i2$2.PaginatePipe, i1.RpxTranslatePipe] });
+        } }, dependencies: [i5.NgForOf, i5.NgIf, i5.NgSwitch, i5.NgSwitchCase, i5.NgSwitchDefault, i1$1.RouterLink, PaginationComponent, i5.CurrencyPipe, i2$3.PaginatePipe, i1.RpxTranslatePipe] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseListComponent, [{
         type: Component,
@@ -39518,7 +39668,7 @@ class SearchResultModule {
         PipesModule,
         ActivityModule,
         PaginationModule, i1.RpxTranslationModule, PaletteModule], exports: [SearchResultComponent] }); })();
-i0.ɵɵsetComponentScope(SearchResultComponent, function () { return [i5.NgForOf, i5.NgIf, i1$1.RouterLink, LabelSubstitutorDirective, ActivityComponent, PaginationComponent, FieldReadComponent]; }, function () { return [i5.DecimalPipe, i2$2.PaginatePipe, CaseReferencePipe, SortSearchResultPipe, i1.RpxTranslatePipe]; });
+i0.ɵɵsetComponentScope(SearchResultComponent, function () { return [i5.NgForOf, i5.NgIf, i1$1.RouterLink, LabelSubstitutorDirective, ActivityComponent, PaginationComponent, FieldReadComponent]; }, function () { return [i5.DecimalPipe, i2$3.PaginatePipe, CaseReferencePipe, SortSearchResultPipe, i1.RpxTranslatePipe]; });
 
 // tslint:disable:variable-name
 class ComplexFieldOverride {
@@ -39762,5 +39912,5 @@ class TestRouteSnapshotBuilder {
  * Generated bundle index. Do not edit.
  */
 
-export { AbstractAppConfig, AbstractFieldReadComponent, AbstractFieldWriteComponent, AbstractFieldWriteJourneyComponent, AbstractJourneyComponent, 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, COMPONENT_PORTAL_INJECTION_TOKEN, CallbackErrorsComponent, CallbackErrorsContext, CaseAccessUtils, CaseBasicAccessViewComponent, CaseChallengedAccessRequestComponent, CaseChallengedAccessSuccessComponent, CaseCreateComponent, CaseDetails, CaseEditComponent, CaseEditConfirmComponent, CaseEditDataModule, CaseEditDataService, CaseEditFormComponent, CaseEditPageComponent, CaseEditSubmitComponent, CaseEditWizardGuard, CaseEditorConfig, CaseEditorModule, CaseEvent, CaseEventCompletionComponent, CaseEventCompletionTaskCancelledComponent, CaseEventCompletionTaskReassignedComponent, CaseEventData, CaseEventTrigger, CaseEventTriggerComponent, CaseField, CaseFieldService, CaseFileViewFieldComponent, CaseFileViewFolderComponent, CaseFileViewFolderDocumentActionsComponent, CaseFileViewFolderSelectorComponent, CaseFileViewFolderSortComponent, CaseFileViewOverlayMenuComponent, CaseFileViewService, CaseFlagCheckYourAnswersPageStep, CaseFlagDisplayContextParameter, CaseFlagErrorMessage, CaseFlagFieldState, CaseFlagFormFields, CaseFlagRefdataService, CaseFlagStatus, CaseFlagSummaryListComponent, CaseFlagSummaryListDisplayMode, CaseFlagTableComponent, 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, ConfirmFlagStatusComponent, ConfirmStatusErrorMessage, ConfirmStatusStep, 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, EnumDisplayDescriptionPipe, 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, FlagFieldDisplayPipe, 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, LanguageInterpreterDisplayPipe, 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, ManageCaseFlagsLabelDisplayPipe, MarkdownComponent, MarkdownComponentModule, MoneyGbpInputComponent, MultipageComponentStateService, 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, QualifyingQuestionDetailComponent, QualifyingQuestionOptionsComponent, QualifyingQuestionService, QualifyingQuestionsErrorMessage, QueryAttachmentsReadComponent, QueryCaseDetailsHeaderComponent, QueryCheckYourAnswersComponent, QueryConfirmationComponent, QueryCreateContext, QueryDetailsComponent, QueryEventCompletionComponent, QueryItemResponseStatus, QueryListComponent, QueryListData, QueryListItem, QueryWriteAddDocumentsComponent, QueryWriteDateInputComponent, QueryWriteRaiseQueryComponent, QueryWriteRespondToQueryComponent, RaiseQueryErrorMessage, ReadCaseFlagFieldComponent, ReadCaseLinkFieldComponent, ReadCollectionFieldComponent, ReadComplexFieldCollectionTableComponent, ReadComplexFieldComponent, ReadComplexFieldRawComponent, ReadComplexFieldTableComponent, ReadCookieService, 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, RespondToQueryErrorMessages, RetryUtil, RouterHelperService, RouterLinkComponent, 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, UpdateFlagAddTranslationErrorMessage, UpdateFlagAddTranslationFormComponent, UpdateFlagAddTranslationStep, UpdateFlagComponent, UpdateFlagErrorMessage, UpdateFlagStep, UpdateFlagTitleDisplayPipe, 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, WriteTextAreaFieldComponent, WriteTextFieldComponent, WriteYesNoFieldComponent, YesNoService, aCaseField, caseMessagesMockData, createACL, createCaseEventTrigger, createCaseField, createComplexFieldOverride, createFieldType, createFixedListFieldType, createHiddenComplexFieldOverride, createMultiSelectListFieldType, createWizardPage, createWizardPageField, editorRouting, initDialog, newCaseField, textFieldType, viewerRouting };
+export { AbstractAppConfig, AbstractFieldReadComponent, AbstractFieldWriteComponent, AbstractFieldWriteJourneyComponent, AbstractJourneyComponent, 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, COMPONENT_PORTAL_INJECTION_TOKEN, CallbackErrorsComponent, CallbackErrorsContext, CaseAccessUtils, CaseBasicAccessViewComponent, CaseChallengedAccessRequestComponent, CaseChallengedAccessSuccessComponent, CaseCreateComponent, CaseDetails, CaseEditComponent, CaseEditConfirmComponent, CaseEditDataModule, CaseEditDataService, CaseEditFormComponent, CaseEditPageComponent, CaseEditSubmitComponent, CaseEditWizardGuard, CaseEditorConfig, CaseEditorModule, CaseEvent, CaseEventCompletionComponent, CaseEventCompletionTaskCancelledComponent, CaseEventCompletionTaskReassignedComponent, CaseEventData, CaseEventTrigger, CaseEventTriggerComponent, CaseField, CaseFieldService, CaseFileViewFieldComponent, CaseFileViewFolderComponent, CaseFileViewFolderDocumentActionsComponent, CaseFileViewFolderSelectorComponent, CaseFileViewFolderSortComponent, CaseFileViewFolderToggleComponent, CaseFileViewOverlayMenuComponent, CaseFileViewService, CaseFlagCheckYourAnswersPageStep, CaseFlagDisplayContextParameter, CaseFlagErrorMessage, CaseFlagFieldState, CaseFlagFormFields, CaseFlagRefdataService, CaseFlagStatus, CaseFlagSummaryListComponent, CaseFlagSummaryListDisplayMode, CaseFlagTableComponent, 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, ConfirmFlagStatusComponent, ConfirmStatusErrorMessage, ConfirmStatusStep, 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, EnumDisplayDescriptionPipe, 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, FlagFieldDisplayPipe, 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, LanguageInterpreterDisplayPipe, 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, ManageCaseFlagsLabelDisplayPipe, MarkdownComponent, MarkdownComponentModule, MoneyGbpInputComponent, MultipageComponentStateService, 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, QualifyingQuestionDetailComponent, QualifyingQuestionOptionsComponent, QualifyingQuestionService, QualifyingQuestionsErrorMessage, QueryAttachmentsReadComponent, QueryCaseDetailsHeaderComponent, QueryCheckYourAnswersComponent, QueryConfirmationComponent, QueryCreateContext, QueryDetailsComponent, QueryEventCompletionComponent, QueryItemResponseStatus, QueryListComponent, QueryListData, QueryListItem, QueryWriteAddDocumentsComponent, QueryWriteDateInputComponent, QueryWriteRaiseQueryComponent, QueryWriteRespondToQueryComponent, RaiseQueryErrorMessage, ReadCaseFlagFieldComponent, ReadCaseLinkFieldComponent, ReadCollectionFieldComponent, ReadComplexFieldCollectionTableComponent, ReadComplexFieldComponent, ReadComplexFieldRawComponent, ReadComplexFieldTableComponent, ReadCookieService, 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, RespondToQueryErrorMessages, RetryUtil, RouterHelperService, RouterLinkComponent, 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, UpdateFlagAddTranslationErrorMessage, UpdateFlagAddTranslationFormComponent, UpdateFlagAddTranslationStep, UpdateFlagComponent, UpdateFlagErrorMessage, UpdateFlagStep, UpdateFlagTitleDisplayPipe, 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, WriteTextAreaFieldComponent, WriteTextFieldComponent, WriteYesNoFieldComponent, YesNoService, aCaseField, caseMessagesMockData, createACL, createCaseEventTrigger, createCaseField, createComplexFieldOverride, createFieldType, createFixedListFieldType, createHiddenComplexFieldOverride, createMultiSelectListFieldType, createWizardPage, createWizardPageField, editorRouting, initDialog, newCaseField, textFieldType, viewerRouting };
 //# sourceMappingURL=hmcts-ccd-case-ui-toolkit.mjs.map