@hmcts/ccd-case-ui-toolkit 7.3.79-govuk3 → 7.3.79-govuk4

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

@@ -6308,7 +6308,7 @@ class FormValidatorsService {
         // Matches: [text](url), ![alt](url), <img ...>, <a ...>...</a>
         const inlineMarkdownPattern = /(?:!?\[[^\]]{0,500}\]\([^)]{0,500}\)|<(?:img\b[^>]{0,500}>|a\b[^>]{0,500}>[\s\S]*?<\/a>))/i;
         // Matches: [text][id], ![alt][id], and the collapsed form [text][]
-        const referenceBoxPattern = /(!)?\[((?:[^[\]\\]|\\.){0,500})\]\s*\[([^\]]{0,100})\]/;
+        const referenceBoxPattern = /(!)?\[((?:[^[\]\\]|\\.){0,500})\]\[([^\]]{0,100})\](?!\s*\/)/;
         // Matches: autolinks such as <http://example.com>
         const autolinkPattern = /<(?:[A-Za-z][A-Za-z0-9+.-]*:[^ <>\n]*|[A-Za-z0-9.!#$%&'*+/=?^_`{|}~-]+@[A-Za-z0-9-]+(?:\.[A-Za-z0-9-]+)+)>/;
         // Matches: bare www.example.com autolinks
@@ -16272,7 +16272,7 @@ class ReadCollectionFieldComponent extends AbstractFieldReadComponent {
         return prefix;
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadCollectionFieldComponent_BaseFactory; return function ReadCollectionFieldComponent_Factory(__ngFactoryType__) { return (ɵReadCollectionFieldComponent_BaseFactory || (ɵReadCollectionFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadCollectionFieldComponent)))(__ngFactoryType__ || ReadCollectionFieldComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadCollectionFieldComponent, selectors: [["ccd-read-collection-field"]], inputs: { caseFields: "caseFields" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["class", "collection-field-table", "aria-describedby", "collection table", 4, "ngIf"], ["aria-describedby", "collection table", 1, "collection-field-table"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["id", "hiddenHeader", 2, "display", "none"], [3, "caseField", "context", "caseFields", "topLevelFormGroup"], [4, "ngFor", "ngForOf"], [3, "caseField", "context", "caseFields", "topLevelFormGroup", "idPrefix"]], template: function ReadCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadCollectionFieldComponent, selectors: [["ccd-read-collection-field"]], inputs: { caseFields: "caseFields" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["class", "collection-field-table", "aria-label", "collection table", 4, "ngIf"], ["aria-label", "collection table", 1, "collection-field-table"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["id", "hiddenHeader", 2, "display", "none"], [3, "caseField", "context", "caseFields", "topLevelFormGroup"], [4, "ngFor", "ngForOf"], [3, "caseField", "context", "caseFields", "topLevelFormGroup", "idPrefix"]], template: function ReadCollectionFieldComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, ReadCollectionFieldComponent_table_0_Template, 4, 3, "table", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.caseField.value && ctx.caseField.value.length);
@@ -16280,7 +16280,7 @@ class ReadCollectionFieldComponent extends AbstractFieldReadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadCollectionFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-collection-field', standalone: false, template: "<table *ngIf=\"caseField.value && caseField.value.length \" class=\"collection-field-table\" aria-describedby=\"collection table\">\n  <ng-container [ngSwitch]=\"isDisplayContextParameterAvailable\">\n    <tbody *ngSwitchCase=\"true\">\n    <tr>\n      <th id=\"hiddenHeader\" style=\"display: none;\"></th>\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: caseField.label,\n            label: caseField.label,\n            field_type: caseField.field_type.collection_field_type,\n            display_context_parameter: caseField.display_context_parameter,\n            value: caseField.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [caseFields]=\"caseFields\"\n          [topLevelFormGroup]=\"topLevelFormGroup\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n    <tbody *ngSwitchCase=\"false\">\n    <tr *ngFor=\"let item of caseField.value; let i = index\">\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: i + '',\n            label: caseField.label + ' ' + (i + 1),\n            field_type: caseField.field_type.collection_field_type,\n            value: item.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [caseFields]=\"caseFields\"\n          [topLevelFormGroup]=\"topLevelFormGroup\"\n          [idPrefix]=\"buildIdPrefix(i)\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n  </ng-container>\n</table>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.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}}@media print{.complex-panel .complex-panel-title{font-size:14pt}}.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-read-collection-field', standalone: false, template: "<table *ngIf=\"caseField.value && caseField.value.length \" class=\"collection-field-table\" aria-label=\"collection table\">\n  <ng-container [ngSwitch]=\"isDisplayContextParameterAvailable\">\n    <tbody *ngSwitchCase=\"true\">\n    <tr>\n      <th id=\"hiddenHeader\" style=\"display: none;\"></th>\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: caseField.label,\n            label: caseField.label,\n            field_type: caseField.field_type.collection_field_type,\n            display_context_parameter: caseField.display_context_parameter,\n            value: caseField.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [caseFields]=\"caseFields\"\n          [topLevelFormGroup]=\"topLevelFormGroup\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n    <tbody *ngSwitchCase=\"false\">\n    <tr *ngFor=\"let item of caseField.value; let i = index\">\n      <td>\n        <ccd-field-read\n          [caseField]=\"{\n            id: i + '',\n            label: caseField.label + ' ' + (i + 1),\n            field_type: caseField.field_type.collection_field_type,\n            value: item.value,\n            hidden: caseField.hidden,\n            parent: caseField\n          }\"\n          [context]=\"context\"\n          [caseFields]=\"caseFields\"\n          [topLevelFormGroup]=\"topLevelFormGroup\"\n          [idPrefix]=\"buildIdPrefix(i)\">\n        </ccd-field-read>\n      </td>\n    </tr>\n    </tbody>\n  </ng-container>\n</table>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.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}}@media print{.complex-panel .complex-panel-title{font-size:14pt}}.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"] }]
     }], null, { caseFields: [{
             type: Input
         }] }); })();
@@ -20344,7 +20344,7 @@ class LinkedCasesFromTableComponent {
             : 'Show';
     }
     static ɵfac = function LinkedCasesFromTableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LinkedCasesFromTableComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(CasesService), i0.ɵɵdirectiveInject(LinkedCasesService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LinkedCasesFromTableComponent, selectors: [["ccd-linked-cases-from-table"]], inputs: { caseField: "caseField" }, outputs: { notifyAPIFailure: "notifyAPIFailure" }, standalone: false, decls: 2, vars: 2, consts: [["type", "button", "id", "show-hide-link", "class", "govuk-js-link", 3, "click", 4, "ngIf"], ["aria-describedby", "table to display cases linked from", 4, "ngIf"], ["type", "button", "id", "show-hide-link", 1, "govuk-js-link", 3, "click"], ["aria-describedby", "table to display cases linked from"], [1, "govuk-table__head"], [1, "govuk-table__row"], ["scope", "col", "width", "20%", 1, "govuk-table__header", "case-table-column"], ["class", "govuk-table__body", 4, "ngIf"], [1, "govuk-table__body"], ["class", "govuk-table__row", 4, "ngFor", "ngForOf"], ["class", "govuk-table__row", 4, "ngIf"], [1, "govuk-table__header", "case-table-column", "width-20"], [1, "govuk-body"], ["target", "_blank", "rel", "noopener", 1, "govuk-link", 3, "href"], [1, "case-table-column"], [3, "title"], ["class", "case-table-column", 4, "ngFor", "ngForOf"], [4, "ngFor", "ngForOf"], ["class", "govuk-!-padding-left-1", 3, "href", 4, "ngIf"], [4, "ngIf"], [1, "govuk-!-padding-left-1", 3, "href"], ["colspan", "5", 1, "govuk-table__cell"]], template: function LinkedCasesFromTableComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LinkedCasesFromTableComponent, selectors: [["ccd-linked-cases-from-table"]], inputs: { caseField: "caseField" }, outputs: { notifyAPIFailure: "notifyAPIFailure" }, standalone: false, decls: 2, vars: 2, consts: [["type", "button", "id", "show-hide-link", "class", "govuk-js-link", 3, "click", 4, "ngIf"], ["aria-label", "table to display cases linked from", 4, "ngIf"], ["type", "button", "id", "show-hide-link", 1, "govuk-js-link", 3, "click"], ["aria-label", "table to display cases linked from"], [1, "govuk-table__head"], [1, "govuk-table__row"], ["scope", "col", "width", "20%", 1, "govuk-table__header", "case-table-column"], ["class", "govuk-table__body", 4, "ngIf"], [1, "govuk-table__body"], ["class", "govuk-table__row", 4, "ngFor", "ngForOf"], ["class", "govuk-table__row", 4, "ngIf"], [1, "govuk-table__header", "case-table-column", "width-20"], [1, "govuk-body"], ["target", "_blank", "rel", "noopener", 1, "govuk-link", 3, "href"], [1, "case-table-column"], [3, "title"], ["class", "case-table-column", 4, "ngFor", "ngForOf"], [4, "ngFor", "ngForOf"], ["class", "govuk-!-padding-left-1", 3, "href", 4, "ngIf"], [4, "ngIf"], [1, "govuk-!-padding-left-1", 3, "href"], ["colspan", "5", 1, "govuk-table__cell"]], template: function LinkedCasesFromTableComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, LinkedCasesFromTableComponent_button_0_Template, 2, 1, "button", 0)(1, LinkedCasesFromTableComponent_table_1_Template, 14, 1, "table", 1);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", !ctx.noLinkedCases && !ctx.isServerError);
@@ -20354,7 +20354,7 @@ class LinkedCasesFromTableComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LinkedCasesFromTableComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-linked-cases-from-table', standalone: false, template: "<button type=\"button\" *ngIf=\"!noLinkedCases && !isServerError\" id=\"show-hide-link\" class=\"govuk-js-link\"\n  (click)=\"onClick()\">{{showHideLinkText}}</button>\n<table *ngIf=\"(getLinkedCasesResponse && showHideLinkText === 'Hide') || noLinkedCases\"\n  aria-describedby=\"table to display cases linked from\">\n  <thead class=\"govuk-table__head\">\n    <tr class=\"govuk-table__row\">\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case name and number</th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case type </th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Service</th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">State</th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Reasons for case link</th>\n    </tr>\n  </thead>\n  <tbody class=\"govuk-table__body\" *ngIf=\"getLinkedCasesResponse && (!isServerError && !isServerReasonCodeError)\">\n    <tr class=\"govuk-table__row\" *ngFor=\"let case of getLinkedCasesResponse\">\n      <td class=\"govuk-table__header case-table-column width-20\">\n        <p class=\"govuk-body\"><a target=\"_blank\" class=\"govuk-link\" href=\"cases/case-details/{{ case.ccdJurisdiction }}/{{ case.ccdCaseType }}/{{case.caseReference}}\"\n            rel=\"noopener\"><span>{{case.caseNameHmctsInternal}} <br>\n              {{case.caseReference | ccdCaseReference}}</span></a></p>\n      </td>\n      <td class=\"case-table-column\"><span [title]=\"case.ccdCaseTypeDescription\">{{case.ccdCaseType}}</span></td>\n      <td class=\"case-table-column\"><span>{{case.ccdJurisdiction}}</span></td>\n      <td class=\"case-table-column\"><span [title]=\"case.stateDescription\">{{case.state}}</span></td>\n      <td class=\"case-table-column\" *ngFor=\"let details of case.linkDetails\">\n        <span *ngFor=\"let reason of details.reasons; let i = index; let isLast = last\">\n          {{reason | ccdLinkCasesFromReasonValue}}<span><a class=\"govuk-!-padding-left-1\"\n            href=\"cases/case-details/{{ case.ccdJurisdiction }}/{{ case.ccdCaseType }}/{{ case.caseReference }}\"\n            *ngIf=\"hasLeadCaseOrConsolidated(reason.reasonCode)\">{{getCaseReferenceLink(case.caseReference)}}</a></span>\n        <br *ngIf=\"!isLast\" />\n        </span>\n      </td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngIf=\"noLinkedCases\">\n      <td class=\"govuk-table__cell\" colspan=\"5\">\n        None\n      </td>\n    </tr>\n    </tbody>  \n</table>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.case-table-column{min-width:20%;max-width:20%}.heading-h2{margin-bottom:0}\n"] }]
+        args: [{ selector: 'ccd-linked-cases-from-table', standalone: false, template: "<button type=\"button\" *ngIf=\"!noLinkedCases && !isServerError\" id=\"show-hide-link\" class=\"govuk-js-link\"\n  (click)=\"onClick()\">{{showHideLinkText}}</button>\n<table *ngIf=\"(getLinkedCasesResponse && showHideLinkText === 'Hide') || noLinkedCases\"\n  aria-label=\"table to display cases linked from\">\n  <thead class=\"govuk-table__head\">\n    <tr class=\"govuk-table__row\">\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case name and number</th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case type </th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Service</th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">State</th>\n      <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Reasons for case link</th>\n    </tr>\n  </thead>\n  <tbody class=\"govuk-table__body\" *ngIf=\"getLinkedCasesResponse && (!isServerError && !isServerReasonCodeError)\">\n    <tr class=\"govuk-table__row\" *ngFor=\"let case of getLinkedCasesResponse\">\n      <td class=\"govuk-table__header case-table-column width-20\">\n        <p class=\"govuk-body\"><a target=\"_blank\" class=\"govuk-link\" href=\"cases/case-details/{{ case.ccdJurisdiction }}/{{ case.ccdCaseType }}/{{case.caseReference}}\"\n            rel=\"noopener\"><span>{{case.caseNameHmctsInternal}} <br>\n              {{case.caseReference | ccdCaseReference}}</span></a></p>\n      </td>\n      <td class=\"case-table-column\"><span [title]=\"case.ccdCaseTypeDescription\">{{case.ccdCaseType}}</span></td>\n      <td class=\"case-table-column\"><span>{{case.ccdJurisdiction}}</span></td>\n      <td class=\"case-table-column\"><span [title]=\"case.stateDescription\">{{case.state}}</span></td>\n      <td class=\"case-table-column\" *ngFor=\"let details of case.linkDetails\">\n        <span *ngFor=\"let reason of details.reasons; let i = index; let isLast = last\">\n          {{reason | ccdLinkCasesFromReasonValue}}<span><a class=\"govuk-!-padding-left-1\"\n            href=\"cases/case-details/{{ case.ccdJurisdiction }}/{{ case.ccdCaseType }}/{{ case.caseReference }}\"\n            *ngIf=\"hasLeadCaseOrConsolidated(reason.reasonCode)\">{{getCaseReferenceLink(case.caseReference)}}</a></span>\n        <br *ngIf=\"!isLast\" />\n        </span>\n      </td>\n    </tr>\n    <tr class=\"govuk-table__row\" *ngIf=\"noLinkedCases\">\n      <td class=\"govuk-table__cell\" colspan=\"5\">\n        None\n      </td>\n    </tr>\n    </tbody>  \n</table>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.case-table-column{min-width:20%;max-width:20%}.heading-h2{margin-bottom:0}\n"] }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: CasesService }, { type: LinkedCasesService }], { caseField: [{
             type: Input
         }], notifyAPIFailure: [{
@@ -20620,7 +20620,7 @@ class LinkedCasesToTableComponent {
         };
     }
     static ɵfac = function LinkedCasesToTableComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LinkedCasesToTableComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(LinkedCasesService), i0.ɵɵdirectiveInject(CasesService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LinkedCasesToTableComponent, selectors: [["ccd-linked-cases-to-table"]], inputs: { caseField: "caseField" }, outputs: { notifyAPIFailure: "notifyAPIFailure" }, standalone: false, decls: 3, vars: 1, consts: [[1, "govuk-grid-row", "govuk-!-margin-bottom-2"], [1, "govuk-grid-column-full"], ["aria-describedby", "table to display cases linked TO", 4, "ngIf"], ["aria-describedby", "table to display cases linked TO"], [1, "govuk-table__row"], ["scope", "col", "width", "20%", 1, "govuk-table__header", "case-table-column"], [1, "govuk-table__body"], ["class", "govuk-table__row", 4, "ngFor", "ngForOf"], ["class", "govuk-table__row", 4, "ngIf"], [1, "govuk-body"], ["target", "_blank", "rel", "noopener", 3, "href"], [1, "govuk-link"], [3, "title"], [4, "ngIf"], [4, "ngFor", "ngForOf"], ["class", "govuk-!-padding-left-1", 3, "href", 4, "ngIf"], [1, "govuk-!-padding-left-1", 3, "href"], ["colspan", "5", 1, "govuk-table__cell"]], template: function LinkedCasesToTableComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LinkedCasesToTableComponent, selectors: [["ccd-linked-cases-to-table"]], inputs: { caseField: "caseField" }, outputs: { notifyAPIFailure: "notifyAPIFailure" }, standalone: false, decls: 3, vars: 1, consts: [[1, "govuk-grid-row", "govuk-!-margin-bottom-2"], [1, "govuk-grid-column-full"], ["aria-label", "table to display cases linked TO", 4, "ngIf"], ["aria-label", "table to display cases linked TO"], [1, "govuk-table__row"], ["scope", "col", "width", "20%", 1, "govuk-table__header", "case-table-column"], [1, "govuk-table__body"], ["class", "govuk-table__row", 4, "ngFor", "ngForOf"], ["class", "govuk-table__row", 4, "ngIf"], [1, "govuk-body"], ["target", "_blank", "rel", "noopener", 3, "href"], [1, "govuk-link"], [3, "title"], [4, "ngIf"], [4, "ngFor", "ngForOf"], ["class", "govuk-!-padding-left-1", 3, "href", 4, "ngIf"], [1, "govuk-!-padding-left-1", 3, "href"], ["colspan", "5", 1, "govuk-table__cell"]], template: function LinkedCasesToTableComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
             i0.ɵɵtemplate(2, LinkedCasesToTableComponent_table_2_Template, 16, 2, "table", 2);
             i0.ɵɵelementEnd()();
@@ -20631,7 +20631,7 @@ class LinkedCasesToTableComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LinkedCasesToTableComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-linked-cases-to-table', standalone: false, template: "<div class=\"govuk-grid-row govuk-!-margin-bottom-2\">\n  <div class=\"govuk-grid-column-full\">\n    <table *ngIf=\"linkedCasesFromResponse\" aria-describedby=\"table to display cases linked TO\">\n      <thead>\n        <tr class=\"govuk-table__row\">\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case name and number</th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case type </th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Service</th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">State</th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Reasons for case link</th>\n        </tr>\n      </thead>\n      <tbody class=\"govuk-table__body\">\n        <tr class=\"govuk-table__row\" *ngFor=\"let case of linkedCasesFromResponse\">\n          <td>\n            <p class=\"govuk-body\"><a target=\"_blank\" href=\"cases/case-details/{{ case.service }}/{{ case.caseType }}/{{case.caseReference}}\"\n                rel=\"noopener\"><span class=\"govuk-link\">{{case.caseName}} <br>\n                  {{case.caseReference | ccdCaseReference}}</span></a></p>\n          </td>\n          <td><span [title]=\"case.caseTypeDescription\">{{case.caseType}}</span></td>\n          <td><span>{{case.service}}</span></td>\n          <td><span [title]=\"case.stateDescription\">{{case.state}}</span>\n          </td>\n          <td *ngIf=\"case && case.reasons\">\n            <span *ngFor=\"let reason of case.reasons; let i = index; let isLast = last\">\n              {{reason.value | ccdLinkCasesReasonValue}}<span><a class=\"govuk-!-padding-left-1\"\n                href=\"cases/case-details/{{ case.service }}/{{ case.caseType }}/{{ case.caseReference }}\"\n                  *ngIf=\"hasLeadCaseOrConsolidated(reason.value.Reason)\">{{getCaseRefereneLink(case.caseReference)}}</a></span>\n              <br *ngIf=\"!isLast\" />\n            </span>\n          </td>\n        </tr>\n        <tr class=\"govuk-table__row\" *ngIf=\"linkedCasesFromResponse.length === 0 && (!isServerError && !isServerReasonCodeError)\">\n          <td class=\"govuk-table__cell\" colspan=\"5\">\n            None\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</div>\n", styles: [".case-table-column{min-width:20%;max-width:20%}\n"] }]
+        args: [{ selector: 'ccd-linked-cases-to-table', standalone: false, template: "<div class=\"govuk-grid-row govuk-!-margin-bottom-2\">\n  <div class=\"govuk-grid-column-full\">\n    <table *ngIf=\"linkedCasesFromResponse\" aria-label=\"table to display cases linked TO\">\n      <thead>\n        <tr class=\"govuk-table__row\">\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case name and number</th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Case type </th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Service</th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">State</th>\n          <th scope=\"col\" class=\"govuk-table__header case-table-column\" width=\"20%\">Reasons for case link</th>\n        </tr>\n      </thead>\n      <tbody class=\"govuk-table__body\">\n        <tr class=\"govuk-table__row\" *ngFor=\"let case of linkedCasesFromResponse\">\n          <td>\n            <p class=\"govuk-body\"><a target=\"_blank\" href=\"cases/case-details/{{ case.service }}/{{ case.caseType }}/{{case.caseReference}}\"\n                rel=\"noopener\"><span class=\"govuk-link\">{{case.caseName}} <br>\n                  {{case.caseReference | ccdCaseReference}}</span></a></p>\n          </td>\n          <td><span [title]=\"case.caseTypeDescription\">{{case.caseType}}</span></td>\n          <td><span>{{case.service}}</span></td>\n          <td><span [title]=\"case.stateDescription\">{{case.state}}</span>\n          </td>\n          <td *ngIf=\"case && case.reasons\">\n            <span *ngFor=\"let reason of case.reasons; let i = index; let isLast = last\">\n              {{reason.value | ccdLinkCasesReasonValue}}<span><a class=\"govuk-!-padding-left-1\"\n                href=\"cases/case-details/{{ case.service }}/{{ case.caseType }}/{{ case.caseReference }}\"\n                  *ngIf=\"hasLeadCaseOrConsolidated(reason.value.Reason)\">{{getCaseRefereneLink(case.caseReference)}}</a></span>\n              <br *ngIf=\"!isLast\" />\n            </span>\n          </td>\n        </tr>\n        <tr class=\"govuk-table__row\" *ngIf=\"linkedCasesFromResponse.length === 0 && (!isServerError && !isServerReasonCodeError)\">\n          <td class=\"govuk-table__cell\" colspan=\"5\">\n            None\n          </td>\n        </tr>\n      </tbody>\n    </table>\n  </div>\n</div>\n", styles: [".case-table-column{min-width:20%;max-width:20%}\n"] }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: LinkedCasesService }, { type: CasesService }], { caseField: [{
             type: Input
         }], notifyAPIFailure: [{
@@ -21745,43 +21745,50 @@ class WriteMoneyGbpFieldComponent extends AbstractFieldWriteComponent {
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteMoneyGbpFieldComponent, { className: "WriteMoneyGbpFieldComponent", filePath: "lib/shared/components/palette/money-gbp/write-money-gbp-field.component.ts", lineNumber: 10 }); })();
 
-function ReadMultiSelectListFieldComponent_table_0_tr_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr");
-    i0.ɵɵelement(1, "th", 3);
-    i0.ɵɵelementStart(2, "td")(3, "span", 4);
-    i0.ɵɵtext(4);
-    i0.ɵɵpipe(5, "ccdFixedList");
-    i0.ɵɵpipe(6, "rpxTranslate");
+function ReadMultiSelectListFieldComponent_table_0_tr_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr")(1, "td")(2, "span", 5);
+    i0.ɵɵtext(3);
+    i0.ɵɵpipe(4, "ccdFixedList");
+    i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const value_r1 = ctx.$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵadvance(4);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(6, 4, i0.ɵɵpipeBind2(5, 1, value_r1, ctx_r1.caseField.field_type.fixed_list_items)));
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(5, 4, i0.ɵɵpipeBind2(4, 1, value_r1, ctx_r1.caseField.field_type.fixed_list_items)));
 } }
 function ReadMultiSelectListFieldComponent_table_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "table", 1);
-    i0.ɵɵpipe(1, "rpxTranslate");
-    i0.ɵɵelementStart(2, "tbody");
-    i0.ɵɵtemplate(3, ReadMultiSelectListFieldComponent_table_0_tr_3_Template, 7, 6, "tr", 2);
+    i0.ɵɵelementStart(0, "table", 1)(1, "caption", 2);
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "rpxTranslate");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "thead")(5, "tr")(6, "th", 3);
+    i0.ɵɵtext(7);
+    i0.ɵɵpipe(8, "rpxTranslate");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(9, "tbody");
+    i0.ɵɵtemplate(10, ReadMultiSelectListFieldComponent_table_0_tr_10_Template, 6, 6, "tr", 4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵattribute("aria-describedby", i0.ɵɵpipeBind1(1, 2, "multi selection table"));
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 3, "Multi selection table"));
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(8, 5, "Value"));
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("ngForOf", ctx_r1.caseField.value);
 } }
 class ReadMultiSelectListFieldComponent extends AbstractFieldReadComponent {
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadMultiSelectListFieldComponent_BaseFactory; return function ReadMultiSelectListFieldComponent_Factory(__ngFactoryType__) { return (ɵReadMultiSelectListFieldComponent_BaseFactory || (ɵReadMultiSelectListFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadMultiSelectListFieldComponent)))(__ngFactoryType__ || ReadMultiSelectListFieldComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadMultiSelectListFieldComponent, selectors: [["ccd-read-multi-select-list-field"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["class", "multi-select-list-field-table", 4, "ngIf"], [1, "multi-select-list-field-table"], [4, "ngFor", "ngForOf"], [2, "display", "none"], [1, "text-16"]], template: function ReadMultiSelectListFieldComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵtemplate(0, ReadMultiSelectListFieldComponent_table_0_Template, 4, 4, "table", 0);
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadMultiSelectListFieldComponent, selectors: [["ccd-read-multi-select-list-field"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 1, vars: 1, consts: [["class", "multi-select-list-field-table", 4, "ngIf"], [1, "multi-select-list-field-table"], [1, "govuk-visually-hidden"], ["scope", "col", 1, "govuk-visually-hidden"], [4, "ngFor", "ngForOf"], [1, "text-16"]], template: function ReadMultiSelectListFieldComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵtemplate(0, ReadMultiSelectListFieldComponent_table_0_Template, 11, 7, "table", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.caseField.value && ctx.caseField.value.length);
         } }, dependencies: [i5.NgForOf, i5.NgIf, i1.RpxTranslatePipe, FixedListPipe], styles: [".multi-select-list-field-table[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%] > td[_ngcontent-%COMP%]{padding:5px 0}.multi-select-list-field-table[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:last-child > td[_ngcontent-%COMP%]{border-bottom:none}.multi-select-list-field-table[_ngcontent-%COMP%]   td.collection-actions[_ngcontent-%COMP%]{width:1px;white-space:nowrap}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadMultiSelectListFieldComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-multi-select-list-field', standalone: false, template: "<table *ngIf=\"caseField.value && caseField.value.length\" class=\"multi-select-list-field-table\"\n       [attr.aria-describedby]=\"'multi selection table' | rpxTranslate\">\n  <tbody>\n    <tr *ngFor=\"let value of caseField.value\">\n      <th style=\"display: none;\"></th>\n      <td><span class=\"text-16\">{{ value | ccdFixedList:caseField.field_type.fixed_list_items | rpxTranslate}}</span></td>\n    </tr>\n  </tbody>\n</table>\n", styles: [".multi-select-list-field-table tr>td{padding:5px 0}.multi-select-list-field-table tr:last-child>td{border-bottom:none}.multi-select-list-field-table td.collection-actions{width:1px;white-space:nowrap}\n"] }]
+        args: [{ selector: 'ccd-read-multi-select-list-field', standalone: false, template: "<table *ngIf=\"caseField.value && caseField.value.length\" class=\"multi-select-list-field-table\">\n  <caption class=\"govuk-visually-hidden\">{{ 'Multi selection table' | rpxTranslate }}</caption>\n  <thead>\n    <tr>\n      <th scope=\"col\" class=\"govuk-visually-hidden\">{{ 'Value' | rpxTranslate }}</th>\n    </tr>\n  </thead>\n  <tbody>\n    <tr *ngFor=\"let value of caseField.value\">\n      <td><span class=\"text-16\">{{ value | ccdFixedList:caseField.field_type.fixed_list_items | rpxTranslate}}</span></td>\n    </tr>\n  </tbody>\n</table>\n", styles: [".multi-select-list-field-table tr>td{padding:5px 0}.multi-select-list-field-table tr:last-child>td{border-bottom:none}.multi-select-list-field-table td.collection-actions{width:1px;white-space:nowrap}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadMultiSelectListFieldComponent, { className: "ReadMultiSelectListFieldComponent", filePath: "lib/shared/components/palette/multi-select-list/read-multi-select-list-field.component.ts", lineNumber: 10 }); })();
 
@@ -26578,6 +26585,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
             },
             plugins: [
                 new Plugin({
+                    appendTransaction: (transactions, oldState, newState) => this.renumberContinuedOrderedLists(transactions, oldState, newState),
                     props: {
                         handlePaste: (_view, event) => this.handleEditorPaste(event),
                         handleDOMEvents: {
@@ -27061,6 +27069,71 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
             ? candidateOrder === adjacentOrder + adjacentList.childCount
             : candidateOrder + candidateList.childCount === adjacentOrder;
     }
+    renumberContinuedOrderedLists(transactions, oldState, newState) {
+        if (!transactions.some((transaction) => transaction.docChanged)) {
+            return null;
+        }
+        const oldChildren = [];
+        let oldPosition = 0;
+        oldState.doc.forEach((node) => {
+            oldChildren.push({ node, position: oldPosition });
+            oldPosition += node.nodeSize;
+        });
+        const mapPosition = (position) => transactions.reduce((mappedPosition, transaction) => transaction.mapping.map(mappedPosition, 1), position);
+        const effectiveOrders = new Map();
+        let result = null;
+        oldChildren.forEach(({ node: candidate, position: candidatePosition }, candidateIndex) => {
+            if (candidate.type.name !== 'ordered_list') {
+                return;
+            }
+            let previousIndex = candidateIndex - 1;
+            while (previousIndex >= 0 &&
+                this.isOrderedListContinuationSeparator(oldChildren[previousIndex].node, candidate)) {
+                previousIndex--;
+            }
+            if (previousIndex < 0) {
+                return;
+            }
+            const previous = oldChildren[previousIndex].node;
+            const previousPosition = oldChildren[previousIndex].position;
+            if (previous.type.name !== 'ordered_list' ||
+                !this.hasMatchingListType(candidate, previous) ||
+                candidate.attrs.indent !== previous.attrs.indent ||
+                !this.isSequentialList(candidate, previous, 1)) {
+                return;
+            }
+            const mappedPreviousPosition = mapPosition(previousPosition);
+            const mappedCandidatePosition = mapPosition(candidatePosition);
+            const newPrevious = newState.doc.nodeAt(mappedPreviousPosition);
+            const newCandidate = newState.doc.nodeAt(mappedCandidatePosition);
+            if (!newPrevious || !newCandidate ||
+                newPrevious.type.name !== 'ordered_list' || newCandidate.type.name !== 'ordered_list' ||
+                newPrevious.firstChild?.textContent !== previous.firstChild?.textContent ||
+                newCandidate.firstChild?.textContent !== candidate.firstChild?.textContent ||
+                !this.hasMatchingListType(newCandidate, newPrevious) ||
+                newCandidate.attrs.indent !== newPrevious.attrs.indent) {
+                return;
+            }
+            const previousOrder = effectiveOrders.get(previousPosition) ?? (Number(newPrevious.attrs.order) || 1);
+            const expectedOrder = previousOrder + newPrevious.childCount;
+            effectiveOrders.set(candidatePosition, expectedOrder);
+            if (Number(newCandidate.attrs.order) === expectedOrder) {
+                return;
+            }
+            result = (result || newState.tr).setNodeMarkup(mappedCandidatePosition, newCandidate.type, {
+                ...newCandidate.attrs,
+                order: expectedOrder
+            });
+        });
+        return result;
+    }
+    isOrderedListContinuationSeparator(node, candidate) {
+        if (this.isEmptyParagraph(node) || this.isListSectionHeading(node)) {
+            return true;
+        }
+        return this.isList(node) &&
+            (Number(node.attrs.indent) || 0) > (Number(candidate.attrs.indent) || 0);
+    }
     hasListContinuation(list) {
         return list.type.name === 'ordered_list' || Boolean(list.attrs.continuationOrder);
     }
@@ -27326,7 +27399,10 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         this.removeUnsupportedMarkup(documentElement);
         this.normaliseDateRangeSpacing(documentElement);
         this.removeUnsupportedAttributes(documentElement);
-        return this.normalisePlainTextValue(sanitiseRichTextDocument(documentElement));
+        const sanitisedValue = sanitiseRichTextDocument(documentElement);
+        return this.hasMeaningfulRichTextContent(documentElement)
+            ? this.normalisePlainTextValue(sanitisedValue)
+            : '';
     }
     normaliseRichTextValue(value) {
         if (!value) {
@@ -27344,7 +27420,15 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         this.removeUnsupportedMarkup(documentElement);
         this.normaliseDateRangeSpacing(documentElement);
         this.removeUnsupportedAttributes(documentElement);
-        return this.normalisePlainTextValue(sanitiseRichTextDocument(documentElement));
+        const sanitisedValue = sanitiseRichTextDocument(documentElement);
+        return this.hasMeaningfulRichTextContent(documentElement)
+            ? this.normalisePlainTextValue(sanitisedValue)
+            : '';
+    }
+    hasMeaningfulRichTextContent(documentElement) {
+        const visibleText = (documentElement.body.textContent || '')
+            .replace(/[\s\u00a0\u200b-\u200d\ufeff]/g, '');
+        return visibleText.length > 0 || Boolean(documentElement.body.querySelector('hr'));
     }
     syncAccessibilityLater() {
         setTimeout(() => this.syncAccessibilityState());
@@ -27457,13 +27541,31 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         }
         this.isNormalisingValue = true;
         try {
-            this.richTextAreaControl.setValue(normalisedValue, { emitEvent: false });
-            this.editor.setContent(normalisedValue || '');
+            this.richTextAreaControl.setValue(normalisedValue, {
+                emitEvent: false,
+                emitModelToViewChange: false
+            });
+            if (normalisedValue || this.editorHasMeaningfulRichTextContent()) {
+                this.editor.setContent(normalisedValue || '');
+            }
         }
         finally {
             this.isNormalisingValue = false;
         }
     }
+    editorHasMeaningfulRichTextContent() {
+        const documentNode = this.editor.view.state.doc;
+        const visibleText = documentNode.textContent.replace(/[\s\u00a0\u200b-\u200d\ufeff]/g, '');
+        let hasHorizontalRule = false;
+        documentNode.descendants((node) => {
+            if (node.type.name === 'horizontal_rule') {
+                hasHorizontalRule = true;
+                return false;
+            }
+            return !hasHorizontalRule;
+        });
+        return visibleText.length > 0 || hasHorizontalRule;
+    }
     richTextRequiredValidator() {
         return (control) => {
             const textValue = this.htmlToText(control.value);
@@ -28114,7 +28216,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         }
         return value
             .replace(/!?\[([^\]]{0,500})\]\(([^)]{0,500})\)/g, (_match, text, url) => text || url)
-            .replace(/!?\[((?:[^[\]\\]|\\.){0,500})\]\s*\[[^\]]{0,100}\]/g, '$1');
+            .replace(/!?\[((?:[^[\]\\]|\\.){0,500})\]\[[^\]]{0,100}\](?!\s*\/)/g, '$1');
     }
     unwrapElement(element) {
         const parentNode = element.parentNode;
@@ -28133,6 +28235,8 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         const state = {
             listStack: [],
             listParents: [],
+            listRunDeclaredLevel: null,
+            listRunVisualLevel: null,
             resetListLevels: new Map(),
             previousListId: null
         };
@@ -28161,12 +28265,19 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
     resetWordListConversionState(state) {
         state.listStack.length = 0;
         state.listParents.length = 0;
+        state.listRunDeclaredLevel = null;
+        state.listRunVisualLevel = null;
         state.resetListLevels.clear();
         state.previousListId = null;
     }
     wordListRequestedLevel(paragraph, listId, wordListIndents, state) {
         const declaredLevel = this.wordListDeclaredLevel(paragraph);
-        let requestedLevel = this.wordListLevel(paragraph, wordListIndents);
+        const visualLevel = this.wordListVisualLevel(paragraph, wordListIndents);
+        if (state.listRunDeclaredLevel === null || state.listRunVisualLevel === null) {
+            state.listRunDeclaredLevel = declaredLevel;
+            state.listRunVisualLevel = visualLevel;
+        }
+        let requestedLevel = Math.max(1, declaredLevel - state.listRunDeclaredLevel + 1, visualLevel - state.listRunVisualLevel + 1);
         const rememberedResetLevel = declaredLevel === 1 ? state.resetListLevels.get(listId) : null;
         if (rememberedResetLevel) {
             return Math.max(requestedLevel, rememberedResetLevel);
@@ -28187,7 +28298,8 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         let currentList = state.listStack[stackIndex];
         if (currentList?.tagName.toLowerCase() !== listType || currentList?.getAttribute('type') !== orderedListType ||
             state.listParents[stackIndex] !== listParent) {
-            currentList = this.createWordList(documentElement, paragraph, listType, orderedListType, parentListItem);
+            const rootIndent = level === 1 ? state.listRunVisualLevel - 1 : 0;
+            currentList = this.createWordList(documentElement, paragraph, listType, orderedListType, parentListItem, rootIndent);
             state.listStack[stackIndex] = currentList;
             state.listParents[stackIndex] = listParent;
         }
@@ -28195,15 +28307,18 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         state.listParents.length = level;
         return currentList;
     }
-    createWordList(documentElement, paragraph, listType, orderedListType, parentListItem) {
+    createWordList(documentElement, paragraph, listType, orderedListType, parentListItem, rootIndent) {
         const list = documentElement.createElement(listType);
-        const listStart = this.wordListStart(paragraph);
+        const listStart = this.wordListStart(paragraph, orderedListType);
         if (listType === 'ol' && listStart > 1) {
             list.setAttribute('start', listStart.toString());
         }
         if (orderedListType) {
             list.setAttribute('type', orderedListType);
         }
+        if (rootIndent > 0) {
+            list.dataset.indent = Math.min(6, rootIndent).toString();
+        }
         if (parentListItem) {
             parentListItem.appendChild(list);
         }
@@ -28262,11 +28377,10 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
             .find((element) => /mso-list:\s*Ignore/i.test(element.getAttribute('style') || ''));
         return (markerElement ? markerElement.textContent : paragraph.textContent).trim();
     }
-    wordListLevel(paragraph, wordListIndents) {
-        const declaredLevel = this.wordListDeclaredLevel(paragraph);
+    wordListVisualLevel(paragraph, wordListIndents) {
         const indent = this.wordListIndent(paragraph);
         const visualLevel = wordListIndents.indexOf(indent) + 1;
-        return Math.max(declaredLevel, visualLevel || 1);
+        return visualLevel || 1;
     }
     wordListDeclaredLevel(paragraph) {
         const match = (paragraph.getAttribute('style') || '').match(/mso-list:[^;]*\blevel(\d+)/i);
@@ -28287,9 +28401,18 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
         const indent = Math.max(this.cssLengthToPixels(this.cssStyleLength(style, 'margin-left')), this.cssLengthToPixels(this.cssStyleLength(style, 'margin-inline-start')), this.cssLengthToPixels(this.cssStyleLength(style, 'mso-para-margin-left')), this.cssLengthToPixels(this.cssStyleLength(style, 'mso-margin-left-alt')), this.cssLengthToPixels(this.cssMarginLeftLength(style)));
         return Math.round(indent);
     }
-    wordListStart(paragraph) {
-        const match = /^(\d+)[.)]/.exec(this.wordListMarker(paragraph));
-        return match ? Number(match[1]) : 1;
+    wordListStart(paragraph, orderedListType) {
+        const match = /^\(?([a-z]+|\d+)[.)]/i.exec(this.wordListMarker(paragraph));
+        if (!match) {
+            return 1;
+        }
+        if (/^\d+$/.test(match[1])) {
+            return Number(match[1]);
+        }
+        if (orderedListType === 'a') {
+            return match[1].toLowerCase().split('').reduce((start, character) => (start * 26) + character.charCodeAt(0) - 96, 0);
+        }
+        return 1;
     }
     copyListItemContents(documentElement, paragraph, listItem) {
         Array.prototype.slice.call(paragraph.childNodes).forEach((childNode) => {
@@ -29008,7 +29131,7 @@ class WriteRichTextAreaFieldComponent extends AbstractFieldWriteComponent {
             type: ViewChild,
             args: ['editorHost']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteRichTextAreaFieldComponent, { className: "WriteRichTextAreaFieldComponent", filePath: "lib/shared/components/palette/rich-text-area/write-rich-text-area-field.component.ts", lineNumber: 137 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(WriteRichTextAreaFieldComponent, { className: "WriteRichTextAreaFieldComponent", filePath: "lib/shared/components/palette/rich-text-area/write-rich-text-area-field.component.ts", lineNumber: 139 }); })();
 
 class ReadTextFieldComponent extends AbstractFieldReadComponent {
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadTextFieldComponent_BaseFactory; return function ReadTextFieldComponent_Factory(__ngFactoryType__) { return (ɵReadTextFieldComponent_BaseFactory || (ɵReadTextFieldComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadTextFieldComponent)))(__ngFactoryType__ || ReadTextFieldComponent); }; })();
@@ -34023,28 +34146,41 @@ function ReadComplexFieldTableComponent_ng_container_9_ng_container_2_Template(r
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("topLevelFormGroup", ctx_r1.topLevelFormGroup)("caseFields", ctx_r1.caseFields)("caseField", field_r1)("context", ctx_r1.context);
 } }
-function ReadComplexFieldTableComponent_ng_container_9_ng_template_4_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 11)(1, "th", 12)(2, "span", 3);
-    i0.ɵɵtext(3);
-    i0.ɵɵpipe(4, "rpxTranslate");
+function ReadComplexFieldTableComponent_ng_container_9_ng_template_4_th_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "th", 14)(1, "span", 3);
+    i0.ɵɵtext(2);
+    i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "td")(6, "span", 3);
-    i0.ɵɵelement(7, "ccd-field-read", 10);
+} if (rf & 2) {
+    const field_r1 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(3, 1, field_r1.label));
+} }
+function ReadComplexFieldTableComponent_ng_container_9_ng_template_4_td_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "td");
+} }
+function ReadComplexFieldTableComponent_ng_container_9_ng_template_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr", 11);
+    i0.ɵɵtemplate(1, ReadComplexFieldTableComponent_ng_container_9_ng_template_4_th_1_Template, 4, 3, "th", 12)(2, ReadComplexFieldTableComponent_ng_container_9_ng_template_4_td_2_Template, 1, 0, "td", 13);
+    i0.ɵɵelementStart(3, "td")(4, "span", 3);
+    i0.ɵɵelement(5, "ccd-field-read", 10);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const field_r1 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext();
     i0.ɵɵproperty("hidden", field_r1.hidden);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", field_r1.label);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngIf", !field_r1.label);
     i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(4, 6, field_r1.label));
-    i0.ɵɵadvance(4);
     i0.ɵɵproperty("topLevelFormGroup", ctx_r1.topLevelFormGroup)("caseFields", ctx_r1.caseFields)("caseField", field_r1)("context", ctx_r1.context);
 } }
 function ReadComplexFieldTableComponent_ng_container_9_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0)(1, 6);
     i0.ɵɵtemplate(2, ReadComplexFieldTableComponent_ng_container_9_ng_container_2_Template, 5, 5, "ng-container", 7);
     i0.ɵɵpipe(3, "ccdIsCompound");
-    i0.ɵɵtemplate(4, ReadComplexFieldTableComponent_ng_container_9_ng_template_4_Template, 8, 8, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(4, ReadComplexFieldTableComponent_ng_container_9_ng_template_4_Template, 6, 7, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd()();
 } if (rf & 2) {
     const field_r1 = ctx.$implicit;
@@ -34074,7 +34210,7 @@ class ReadComplexFieldTableComponent extends AbstractFieldReadComponent {
         this.path = ReadComplexFieldTableComponent.DUMMY_STRING_PRE + this.idPrefix + ReadComplexFieldTableComponent.DUMMY_STRING_POST;
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadComplexFieldTableComponent_BaseFactory; return function ReadComplexFieldTableComponent_Factory(__ngFactoryType__) { return (ɵReadComplexFieldTableComponent_BaseFactory || (ɵReadComplexFieldTableComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadComplexFieldTableComponent)))(__ngFactoryType__ || ReadComplexFieldTableComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldTableComponent, selectors: [["ccd-read-complex-field-table"]], inputs: { caseFields: "caseFields" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 17, consts: [["SimpleRow", ""], [1, "complex-panel"], [1, "complex-panel-title"], [1, "text-16"], ["aria-describedby", "complex field table", 1, "complex-panel-table"], [4, "ngFor", "ngForOf"], ["ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields"], [4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], ["colspan", "2"], [3, "topLevelFormGroup", "caseFields", "caseField", "context"], [1, "complex-panel-simple-field", 3, "hidden"], ["id", "complex-panel-simple-field-label"]], template: function ReadComplexFieldTableComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldTableComponent, selectors: [["ccd-read-complex-field-table"]], inputs: { caseFields: "caseFields" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 11, vars: 17, consts: [["SimpleRow", ""], [1, "complex-panel"], [1, "complex-panel-title"], [1, "text-16"], ["aria-label", "complex field table", 1, "complex-panel-table"], [4, "ngFor", "ngForOf"], ["ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields"], [4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], ["colspan", "2"], [3, "topLevelFormGroup", "caseFields", "caseField", "context"], [1, "complex-panel-simple-field", 3, "hidden"], ["scope", "row", 4, "ngIf"], [4, "ngIf"], ["scope", "row"]], template: function ReadComplexFieldTableComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 1)(1, "dl", 2)(2, "dt")(3, "span", 3);
             i0.ɵɵtext(4);
             i0.ɵɵpipe(5, "rpxTranslate");
@@ -34094,7 +34230,7 @@ class ReadComplexFieldTableComponent extends AbstractFieldReadComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadComplexFieldTableComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-complex-field-table', standalone: false, template: "<div class=\"complex-panel\">\n  <dl class=\"complex-panel-title\"><dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt><dd></dd></dl>\n  <table class=\"complex-panel-table\" aria-describedby=\"complex field table\">\n    <tbody>\n      <ng-container *ngFor=\"let field of caseField | ccdReadFieldsFilter:false :undefined :true :topLevelFormGroup :path :idPrefix\">\n        <ng-container ccdLabelSubstitutor [caseField]=\"field\" [formGroup]=\"topLevelFormGroup\" [contextFields]=\"caseFields\">\n          <ng-container *ngIf=\"(field | ccdIsCompound); else SimpleRow\">\n            <tr class=\"complex-panel-compound-field\" [hidden]=\"field.hidden\">\n              <td colspan=\"2\">\n                <span class=\"text-16\">\n                  <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\" [caseFields]=\"caseFields\"\n                    [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n                </span>\n              </td>\n            </tr>\n          </ng-container>\n          <ng-template #SimpleRow>\n            <tr class=\"complex-panel-simple-field\" [hidden]=\"field.hidden\">\n              <th id=\"complex-panel-simple-field-label\"><span class=\"text-16\">{{field.label | rpxTranslate}}</span></th>\n              <td>\n                  <span class=\"text-16\">\n                    <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\" [caseFields]=\"caseFields\"\n                    [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n                  </span>\n              </td>\n            </tr>\n          </ng-template>\n        </ng-container>\n      </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.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}}@media print{.complex-panel .complex-panel-title{font-size:14pt}}.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}\n"] }]
+        args: [{ selector: 'ccd-read-complex-field-table', standalone: false, template: "<div class=\"complex-panel\">\n  <dl class=\"complex-panel-title\"><dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt><dd></dd></dl>\n  <table class=\"complex-panel-table\" aria-label=\"complex field table\">\n    <tbody>\n      <ng-container *ngFor=\"let field of caseField | ccdReadFieldsFilter:false :undefined :true :topLevelFormGroup :path :idPrefix\">\n        <ng-container ccdLabelSubstitutor [caseField]=\"field\" [formGroup]=\"topLevelFormGroup\" [contextFields]=\"caseFields\">\n          <ng-container *ngIf=\"(field | ccdIsCompound); else SimpleRow\">\n            <tr class=\"complex-panel-compound-field\" [hidden]=\"field.hidden\">\n              <td colspan=\"2\">\n                <span class=\"text-16\">\n                  <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\" [caseFields]=\"caseFields\"\n                    [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n                </span>\n              </td>\n            </tr>\n          </ng-container>\n          <ng-template #SimpleRow>\n            <tr class=\"complex-panel-simple-field\" [hidden]=\"field.hidden\">\n              <th *ngIf=\"field.label\" scope=\"row\"><span class=\"text-16\">{{field.label | rpxTranslate}}</span></th>\n              <td *ngIf=\"!field.label\"></td>\n              <td>\n                  <span class=\"text-16\">\n                    <ccd-field-read [topLevelFormGroup]=\"topLevelFormGroup\" [caseFields]=\"caseFields\"\n                    [caseField]=\"field\" [context]=\"context\"></ccd-field-read>\n                  </span>\n              </td>\n            </tr>\n          </ng-template>\n        </ng-container>\n      </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.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}}@media print{.complex-panel .complex-panel-title{font-size:14pt}}.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}\n"] }]
     }], null, { caseFields: [{
             type: Input
         }] }); })();
@@ -34102,11 +34238,11 @@ class ReadComplexFieldTableComponent extends AbstractFieldReadComponent {
 
 function ReadComplexFieldCollectionTableComponent_th_10_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "th", 8)(1, "span", 4);
+    i0.ɵɵelementStart(0, "th", 9)(1, "span", 4);
     i0.ɵɵtext(2);
     i0.ɵɵpipe(3, "rpxTranslate");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(4, "a", 9);
+    i0.ɵɵelementStart(4, "a", 10);
     i0.ɵɵpipe(5, "rpxTranslate");
     i0.ɵɵlistener("click", function ReadComplexFieldCollectionTableComponent_th_10_Template_a_click_4_listener($event) { const heading_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); ctx_r2.sortRowsByColumns(heading_r2); return i0.ɵɵresetView($event.preventDefault()); })("keyup.enter", function ReadComplexFieldCollectionTableComponent_th_10_Template_a_keyup_enter_4_listener() { const heading_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.sortRowsByColumns(heading_r2)); });
     i0.ɵɵelementEnd()();
@@ -34119,9 +34255,9 @@ function ReadComplexFieldCollectionTableComponent_th_10_Template(rf, ctx) { if (
     i0.ɵɵproperty("innerHTML", ctx_r2.sortWidget(ctx_r2.columnsAllLabels[heading_r2]), i0.ɵɵsanitizeHtml);
     i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(5, 5, "Sort " + ctx_r2.columnsAllLabels[heading_r2].label));
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2_div_2_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_2_div_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div");
-    i0.ɵɵelement(1, "ccd-field-read", 18);
+    i0.ɵɵelement(1, "ccd-field-read", 19);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const heading_r6 = i0.ɵɵnextContext().$implicit;
@@ -34130,15 +34266,15 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2
     i0.ɵɵadvance();
     i0.ɵɵproperty("caseField", ctx_r2.toCaseField(heading_r6, item_r7[heading_r6].label, ctx_r2.columnsHorizontalLabel[heading_r6].type, item_r7[heading_r6]))("context", ctx_r2.context);
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2_ng_template_3_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_2_ng_template_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div");
     i0.ɵɵtext(1, "\u00A0");
     i0.ɵɵelementEnd();
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
     i0.ɵɵelementStart(1, "td", 4);
-    i0.ɵɵtemplate(2, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2_div_2_Template, 2, 2, "div", 17)(3, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2_ng_template_3_Template, 2, 0, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(2, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_2_div_2_Template, 2, 2, "div", 18)(3, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_2_ng_template_3_Template, 2, 0, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
@@ -34148,9 +34284,9 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", item_r7[heading_r6])("ngIfElse", showEmptyTd_r8);
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_1_td_5_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_1_td_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "td", 4);
-    i0.ɵɵelement(1, "ccd-field-read", 18);
+    i0.ɵɵelement(1, "ccd-field-read", 19);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const vLabel_r9 = i0.ɵɵnextContext(2).$implicit;
@@ -34159,12 +34295,12 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance();
     i0.ɵɵproperty("caseField", ctx_r2.toCaseField("", vLabel_r9.label, vLabel_r9.field_type, item_r7[vLabel_r9.id]))("context", ctx_r2.context);
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 21)(1, "th", 8)(2, "span", 4);
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr", 22)(1, "th", 9)(2, "span", 4);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(5, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_1_td_5_Template, 2, 2, "td", 22);
+    i0.ɵɵtemplate(5, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_1_td_5_Template, 2, 2, "td", 23);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const vLabel_r9 = i0.ɵɵnextContext().$implicit;
@@ -34174,9 +34310,9 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngIf", vLabel_r9["type"] !== "Complex");
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_tr_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 25)(1, "td", 23)(2, "span", 4);
-    i0.ɵɵelement(3, "ccd-field-read", 18);
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_tr_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr", 26)(1, "td", 24)(2, "span", 4);
+    i0.ɵɵelement(3, "ccd-field-read", 19);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
     const caseField_r10 = i0.ɵɵnextContext().$implicit;
@@ -34185,9 +34321,9 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance(3);
     i0.ɵɵproperty("caseField", caseField_r10)("context", ctx_r2.context);
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_ng_template_3_td_5_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_ng_template_3_td_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "td")(1, "span", 4);
-    i0.ɵɵelement(2, "ccd-field-read", 18);
+    i0.ɵɵelement(2, "ccd-field-read", 19);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const caseField_r10 = i0.ɵɵnextContext(2).$implicit;
@@ -34195,9 +34331,9 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("caseField", caseField_r10)("context", ctx_r2.context);
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_ng_template_3_td_6_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_ng_template_3_td_6_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "td");
-    i0.ɵɵelement(1, "ccd-read-case-link-field", 18);
+    i0.ɵɵelement(1, "ccd-read-case-link-field", 19);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const caseField_r10 = i0.ɵɵnextContext(2).$implicit;
@@ -34207,12 +34343,12 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance();
     i0.ɵɵproperty("caseField", ctx_r2.addCaseReferenceValue(caseField_r10, item_r7[vLabel_r9.id].CaseReference))("context", ctx_r2.context);
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_ng_template_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 26)(1, "th", 8)(2, "span", 4);
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_ng_template_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr", 27)(1, "th", 9)(2, "span", 4);
     i0.ɵɵtext(3);
     i0.ɵɵpipe(4, "rpxTranslate");
     i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(5, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_ng_template_3_td_5_Template, 3, 2, "td", 27)(6, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_ng_template_3_td_6_Template, 2, 2, "td", 27);
+    i0.ɵɵtemplate(5, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_ng_template_3_td_5_Template, 3, 2, "td", 28)(6, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_ng_template_3_td_6_Template, 2, 2, "td", 28);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const caseField_r10 = i0.ɵɵnextContext().$implicit;
@@ -34226,11 +34362,11 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", item_r7[vLabel_r9.id] == null ? null : item_r7[vLabel_r9.id].hasOwnProperty("CaseReference"));
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_tr_1_Template, 4, 3, "tr", 24);
+    i0.ɵɵtemplate(1, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_tr_1_Template, 4, 3, "tr", 25);
     i0.ɵɵpipe(2, "ccdIsCompound");
-    i0.ɵɵtemplate(3, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_ng_template_3_Template, 7, 6, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
+    i0.ɵɵtemplate(3, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_ng_template_3_Template, 7, 6, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const caseField_r10 = ctx.$implicit;
@@ -34238,9 +34374,9 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", i0.ɵɵpipeBind1(2, 2, caseField_r10))("ngIfElse", SimpleRow_r11);
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 14)(1, "td", 23);
-    i0.ɵɵtemplate(2, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_ng_container_2_Template, 5, 4, "ng-container", 7);
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr", 15)(1, "td", 24);
+    i0.ɵɵtemplate(2, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_ng_container_2_Template, 5, 4, "ng-container", 8);
     i0.ɵɵpipe(3, "ccdReadFieldsFilter");
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -34249,9 +34385,9 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("ngForOf", i0.ɵɵpipeBind4(3, 2, vLabel_r9, true, undefined, true));
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_1_Template, 6, 5, "tr", 19)(2, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_tr_2_Template, 4, 7, "tr", 20);
+    i0.ɵɵtemplate(1, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_1_Template, 6, 5, "tr", 20)(2, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_tr_2_Template, 4, 7, "tr", 21);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
     const vLabel_r9 = ctx.$implicit;
@@ -34262,18 +34398,18 @@ function ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_1
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngIf", vLabel_r9["type"] === "Complex" && ctx_r2.addCaseFieldValue(vLabel_r9, item_r7[vLabel_r9.id]));
 } }
-function ReadComplexFieldCollectionTableComponent_ng_container_12_Template(rf, ctx) { if (rf & 1) {
+function ReadComplexFieldCollectionTableComponent_ng_container_14_Template(rf, ctx) { if (rf & 1) {
     const _r4 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "tr", 10);
-    i0.ɵɵlistener("keyup", function ReadComplexFieldCollectionTableComponent_ng_container_12_Template_tr_keyup_1_listener($event) { const i_r5 = i0.ɵɵrestoreView(_r4).index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView($event.key === "Enter" ? ctx_r2.isHidden[i_r5] = !ctx_r2.isHidden[i_r5] : null); })("click", function ReadComplexFieldCollectionTableComponent_ng_container_12_Template_tr_click_1_listener() { const i_r5 = i0.ɵɵrestoreView(_r4).index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.isHidden[i_r5] = !ctx_r2.isHidden[i_r5]); });
-    i0.ɵɵtemplate(2, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_2_Template, 5, 2, "ng-container", 7);
-    i0.ɵɵelementStart(3, "td")(4, "div", 11)(5, "a", 12);
-    i0.ɵɵlistener("click", function ReadComplexFieldCollectionTableComponent_ng_container_12_Template_a_click_5_listener($event) { i0.ɵɵrestoreView(_r4); return i0.ɵɵresetView($event.preventDefault()); });
-    i0.ɵɵelement(6, "img", 13);
+    i0.ɵɵelementStart(1, "tr", 11);
+    i0.ɵɵlistener("keyup", function ReadComplexFieldCollectionTableComponent_ng_container_14_Template_tr_keyup_1_listener($event) { const i_r5 = i0.ɵɵrestoreView(_r4).index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView($event.key === "Enter" ? ctx_r2.isHidden[i_r5] = !ctx_r2.isHidden[i_r5] : null); })("click", function ReadComplexFieldCollectionTableComponent_ng_container_14_Template_tr_click_1_listener() { const i_r5 = i0.ɵɵrestoreView(_r4).index; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.isHidden[i_r5] = !ctx_r2.isHidden[i_r5]); });
+    i0.ɵɵtemplate(2, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_2_Template, 5, 2, "ng-container", 8);
+    i0.ɵɵelementStart(3, "td")(4, "div", 12)(5, "a", 13);
+    i0.ɵɵlistener("click", function ReadComplexFieldCollectionTableComponent_ng_container_14_Template_a_click_5_listener($event) { i0.ɵɵrestoreView(_r4); return i0.ɵɵresetView($event.preventDefault()); });
+    i0.ɵɵelement(6, "img", 14);
     i0.ɵɵelementEnd()()()();
-    i0.ɵɵelementStart(7, "tr", 14)(8, "td", 15)(9, "table", 16)(10, "tbody");
-    i0.ɵɵtemplate(11, ReadComplexFieldCollectionTableComponent_ng_container_12_ng_container_11_Template, 3, 2, "ng-container", 7);
+    i0.ɵɵelementStart(7, "tr", 15)(8, "td", 16)(9, "table", 17)(10, "tbody");
+    i0.ɵɵtemplate(11, ReadComplexFieldCollectionTableComponent_ng_container_14_ng_container_11_Template, 3, 2, "ng-container", 8);
     i0.ɵɵpipe(12, "keyvalue");
     i0.ɵɵpipe(13, "ccdCollectionTableCaseFieldsFilter");
     i0.ɵɵpipe(14, "ccdReadFieldsFilter");
@@ -34447,7 +34583,7 @@ class ReadComplexFieldCollectionTableComponent extends AbstractFieldReadComponen
         return result;
     }
     static ɵfac = /*@__PURE__*/ (() => { let ɵReadComplexFieldCollectionTableComponent_BaseFactory; return function ReadComplexFieldCollectionTableComponent_Factory(__ngFactoryType__) { return (ɵReadComplexFieldCollectionTableComponent_BaseFactory || (ɵReadComplexFieldCollectionTableComponent_BaseFactory = i0.ɵɵgetInheritedFactory(ReadComplexFieldCollectionTableComponent)))(__ngFactoryType__ || ReadComplexFieldCollectionTableComponent); }; })();
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldCollectionTableComponent, selectors: [["ccd-read-complex-field-collection-table"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 13, vars: 6, consts: [["showEmptyTd", ""], ["SimpleRow", ""], [1, "complex-panel", 3, "hidden"], [1, "complex-panel-title"], [1, "text-16"], ["aria-describedby", "complex panel table", 1, "complex-panel-table"], ["scope", "col", 4, "ngFor", "ngForOf"], [4, "ngFor", "ngForOf"], ["scope", "col"], ["href", "#", 1, "sort-widget", 3, "click", "keyup.enter", "innerHTML"], [1, "new-table-row", "accordion-heading", 3, "keyup", "click"], [2, "float", "right"], ["href", "#", 3, "click"], ["alt", "accordion-img", 1, "accordion-image", 3, "src"], [3, "hidden"], [3, "colSpan"], ["aria-describedby", "complex panel table expanded", 1, "complex-panel-table"], [4, "ngIf", "ngIfElse"], [3, "caseField", "context"], ["class", "complex-panel-simple-field accordion-body", 3, "hidden", 4, "ngIf"], [3, "hidden", 4, "ngIf"], [1, "complex-panel-simple-field", "accordion-body", 3, "hidden"], ["class", "text-16", 4, "ngIf"], ["colspan", "2"], ["class", "complex-panel-compound-field", 3, "hidden", 4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], [1, "complex-panel-nested-field", 3, "hidden"], [4, "ngIf"]], template: function ReadComplexFieldCollectionTableComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ReadComplexFieldCollectionTableComponent, selectors: [["ccd-read-complex-field-collection-table"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 15, vars: 6, consts: [["showEmptyTd", ""], ["SimpleRow", ""], [1, "complex-panel", 3, "hidden"], [1, "complex-panel-title"], [1, "text-16"], ["aria-label", "complex panel table", 1, "complex-panel-table"], ["scope", "col", 4, "ngFor", "ngForOf"], [1, "govuk-visually-hidden"], [4, "ngFor", "ngForOf"], ["scope", "col"], ["href", "#", 1, "sort-widget", 3, "click", "keyup.enter", "innerHTML"], [1, "new-table-row", "accordion-heading", 3, "keyup", "click"], [2, "float", "right"], ["href", "#", 3, "click"], ["alt", "accordion-img", 1, "accordion-image", 3, "src"], [3, "hidden"], [3, "colSpan"], ["aria-label", "complex panel table expanded", 1, "complex-panel-table"], [4, "ngIf", "ngIfElse"], [3, "caseField", "context"], ["class", "complex-panel-simple-field accordion-body", 3, "hidden", 4, "ngIf"], [3, "hidden", 4, "ngIf"], [1, "complex-panel-simple-field", "accordion-body", 3, "hidden"], ["class", "text-16", 4, "ngIf"], ["colspan", "2"], ["class", "complex-panel-compound-field", 3, "hidden", 4, "ngIf", "ngIfElse"], [1, "complex-panel-compound-field", 3, "hidden"], [1, "complex-panel-nested-field", 3, "hidden"], [4, "ngIf"]], template: function ReadComplexFieldCollectionTableComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2)(1, "dl", 3)(2, "dt")(3, "span", 4);
             i0.ɵɵtext(4);
             i0.ɵɵpipe(5, "rpxTranslate");
@@ -34456,9 +34592,10 @@ class ReadComplexFieldCollectionTableComponent extends AbstractFieldReadComponen
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(7, "table", 5)(8, "tbody")(9, "tr");
             i0.ɵɵtemplate(10, ReadComplexFieldCollectionTableComponent_th_10_Template, 6, 7, "th", 6);
-            i0.ɵɵelement(11, "th");
-            i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(12, ReadComplexFieldCollectionTableComponent_ng_container_12_Template, 15, 20, "ng-container", 7);
+            i0.ɵɵelementStart(11, "th")(12, "span", 7);
+            i0.ɵɵtext(13, "Expand row");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵtemplate(14, ReadComplexFieldCollectionTableComponent_ng_container_14_Template, 15, 20, "ng-container", 8);
             i0.ɵɵelementEnd()()();
         } if (rf & 2) {
             i0.ɵɵproperty("hidden", ctx.caseField.hidden);
@@ -34466,13 +34603,13 @@ class ReadComplexFieldCollectionTableComponent extends AbstractFieldReadComponen
             i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(5, 4, ctx.caseField.label));
             i0.ɵɵadvance(6);
             i0.ɵɵproperty("ngForOf", ctx.columns);
-            i0.ɵɵadvance(2);
+            i0.ɵɵadvance(4);
             i0.ɵɵproperty("ngForOf", ctx.rows);
         } }, styles: [".govuk-js-link[_ngcontent-%COMP%]{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link[_ngcontent-%COMP%]:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link[_ngcontent-%COMP%]:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link[_ngcontent-%COMP%]:visited{color:#4c2c92}.complex-panel[_ngcontent-%COMP%]{margin:13px 0;border:1px solid #bfc1c3}.complex-panel[_ngcontent-%COMP%]   .complex-panel-title[_ngcontent-%COMP%]{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[_ngcontent-%COMP%]   .complex-panel-title[_ngcontent-%COMP%]{font-size:19px;line-height:1.3157894737}}@media print{.complex-panel[_ngcontent-%COMP%]   .complex-panel-title[_ngcontent-%COMP%]{font-size:14pt}}.complex-panel[_ngcontent-%COMP%]   .complex-panel-table[_ngcontent-%COMP%] > tbody[_ngcontent-%COMP%] > tr[_ngcontent-%COMP%] > th[_ngcontent-%COMP%]{vertical-align:top}.complex-panel[_ngcontent-%COMP%]   .complex-panel-table[_ngcontent-%COMP%] > tbody[_ngcontent-%COMP%] > tr[_ngcontent-%COMP%]:last-child > th[_ngcontent-%COMP%]{border-bottom:none}.complex-panel[_ngcontent-%COMP%]   .complex-panel-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%]{padding-left:5px;font-weight:700;border-bottom:none}.complex-panel[_ngcontent-%COMP%]   .complex-panel-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%]{padding-left:5px;padding-top:0;padding-bottom:0;border-bottom:none}.complex-panel[_ngcontent-%COMP%]   .new-table-row[_ngcontent-%COMP%]{border-top:1px solid #bfc1c3}.complex-panel[_ngcontent-%COMP%]   .complex-panel-simple-field[_ngcontent-%COMP%]   th[_ngcontent-%COMP%]{padding-left:5px;padding-top:0;padding-bottom:0;width:295px}.complex-panel[_ngcontent-%COMP%]   .complex-panel-nested-field[_ngcontent-%COMP%]   th[_ngcontent-%COMP%]{padding-left:33px;padding-top:0;padding-bottom:0;width:200px}.complex-panel[_ngcontent-%COMP%]   .complex-panel-compound-field[_ngcontent-%COMP%]   td[_ngcontent-%COMP%]{padding:5px;border-bottom:none}.sort-widget[_ngcontent-%COMP%]{cursor:pointer;text-decoration:none;color:#0b0c0c}.accordion-wrapper[_ngcontent-%COMP%]{margin-bottom:20px}.accordion-wrapper[_ngcontent-%COMP%]   .heading-medium[_ngcontent-%COMP%]{margin:0}.accordion-wrapper[_ngcontent-%COMP%]   .accordion-heading[_ngcontent-%COMP%]{border-top:1px solid #bfc1c3;padding-top:20px;padding-bottom:10px;height:20px;cursor:pointer}.accordion-wrapper[_ngcontent-%COMP%]   .accordion-heading[_ngcontent-%COMP%]   .accordion-image[_ngcontent-%COMP%]{width:25px;margin-right:20px}.accordion-wrapper[_ngcontent-%COMP%]   .accordion-body[_ngcontent-%COMP%]{margin-top:20px;margin-right:20px}.accordion-wrapper[_ngcontent-%COMP%]   .last-accordion[_ngcontent-%COMP%]{border-bottom:1px solid #bfc1c3;padding-bottom:30px}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ReadComplexFieldCollectionTableComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-read-complex-field-collection-table', standalone: false, template: "<div class=\"complex-panel\" [hidden]=\"caseField.hidden\">\n  <dl class=\"complex-panel-title\">\n    <dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt>\n    <dd></dd>\n  </dl>\n  <table class=\"complex-panel-table\" aria-describedby=\"complex panel table\">\n    <tbody>\n    <!-- <COMPLEX table field header>-->\n    <tr>\n      <th *ngFor=\"let heading of columns\" scope=\"col\">\n        <span class=\"text-16\">{{columnsAllLabels[heading].label | rpxTranslate}}</span>\n        <a href=\"#\"\n           (click)=\"sortRowsByColumns(heading); $event.preventDefault()\"\n           (keyup.enter)=\"sortRowsByColumns(heading)\"\n           class=\"sort-widget\"\n           [attr.aria-label]=\"'Sort ' + columnsAllLabels[heading].label | rpxTranslate\"\n           [innerHTML]=\"sortWidget(columnsAllLabels[heading])\"></a>\n      </th>\n      <th></th>\n    </tr>\n    <!-- </COMPLEX table field header>-->\n    <ng-container *ngFor=\"let item of rows; let i = index;\">\n      <!-- <COMPLEX table collapsed view>-->\n      <tr class=\"new-table-row accordion-heading\" (keyup)=\"$event.key === 'Enter' ? (isHidden[i] = !isHidden[i]) : null\" (click)=\"isHidden[i] = !isHidden[i]\"\n          [class.last-accordion]=\"isHidden[i]\">\n        <ng-container *ngFor=\"let heading of columns\">\n          <td class=\"text-16\">\n            <div *ngIf=\"item[heading]; else showEmptyTd\">\n              <ccd-field-read\n                [caseField]=\"toCaseField(heading, item[heading].label, columnsHorizontalLabel[heading].type, item[heading])\"\n                [context]=\"context\"></ccd-field-read>\n            </div>\n            <ng-template #showEmptyTd>\n              <div>&nbsp;</div>\n            </ng-template>\n          </td>\n        </ng-container>\n        <td>\n          <div style=\"float: right;\">\n            <a href=\"#\" (click)=\"$event.preventDefault()\"> <img src=\"{{ getImage(i) }}\" alt=\"accordion-img\" class=\"accordion-image\"/></a>\n          </div>\n        </td>\n      </tr>\n      <!-- </COMPLEX table collapsed view>-->\n      <!-- <COMPLEX table expanded view>-->\n      <tr [hidden]=\"isHidden[i]\">\n        <td [colSpan]=\"columns.length + 1\">\n          <table class=\"complex-panel-table\" aria-describedby=\"complex panel table expanded\">\n            <tbody>\n            <ng-container\n              *ngFor=\"let vLabel of columnsVerticalLabel | keyvalue: keepOriginalOrder | ccdCollectionTableCaseFieldsFilter: caseField: rows[i] | ccdReadFieldsFilter:true :undefined :true\">\n              <!-- <COMPLEX table expandable body simple field>-->\n              <tr class=\"complex-panel-simple-field accordion-body\" *ngIf=\"item[vLabel.id]\" [hidden]=\"vLabel.hidden\">\n                <th scope=\"col\"><span class=\"text-16\">{{ vLabel.label | rpxTranslate }}</span></th>\n                <td *ngIf=\"vLabel['type'] !== 'Complex'\" class=\"text-16\">\n                  <ccd-field-read [caseField]=\"toCaseField('', vLabel.label, vLabel.field_type, item[vLabel.id])\"\n                                  [context]=\"context\"></ccd-field-read>\n                </td>\n              </tr>\n              <!-- </COMPLEX table expandable body simple field>-->\n\n              <!-- <COMPLEX table expandable body complex field>-->\n              <tr *ngIf=\"vLabel['type'] === 'Complex' && addCaseFieldValue(vLabel, item[vLabel.id])\" [hidden]=\"vLabel.hidden\">\n                <td colspan=\"2\">\n                  <ng-container *ngFor=\"let caseField of vLabel | ccdReadFieldsFilter:true :undefined :true\">\n                      <tr class=\"complex-panel-compound-field\" *ngIf=\"(caseField | ccdIsCompound); else SimpleRow\" [hidden]=\"caseField\">\n                        <td colspan=\"2\">\n                          <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                        </td>\n                      </tr>\n                      <ng-template #SimpleRow>\n                        <tr class=\"complex-panel-nested-field\" [hidden]=\"caseField.hidden\">\n                          <th scope=\"col\"><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></th>\n                          <td *ngIf=\"!item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                          </td>\n                          <td *ngIf=\"item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <ccd-read-case-link-field [caseField]=\"addCaseReferenceValue(caseField, item[vLabel.id].CaseReference)\" [context]=\"context\"></ccd-read-case-link-field>\n                          </td>\n                        </tr>\n                      </ng-template>\n                  </ng-container>\n                </td>\n              </tr>\n              <!-- <COMPLEX table expandable body complex field>-->\n            </ng-container>\n            </tbody>\n          </table>\n        </td>\n      </tr>\n      <!-- </COMPLEX table expanded view>-->\n    </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.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}}@media print{.complex-panel .complex-panel-title{font-size:14pt}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th{border-bottom:none}.complex-panel .complex-panel-table th{padding-left:5px;font-weight:700;border-bottom:none}.complex-panel .complex-panel-table td{padding-left:5px;padding-top:0;padding-bottom:0;border-bottom:none}.complex-panel .new-table-row{border-top:1px solid #bfc1c3}.complex-panel .complex-panel-simple-field th{padding-left:5px;padding-top:0;padding-bottom:0;width:295px}.complex-panel .complex-panel-nested-field th{padding-left:33px;padding-top:0;padding-bottom:0;width:200px}.complex-panel .complex-panel-compound-field td{padding:5px;border-bottom:none}.sort-widget{cursor:pointer;text-decoration:none;color:#0b0c0c}.accordion-wrapper{margin-bottom:20px}.accordion-wrapper .heading-medium{margin:0}.accordion-wrapper .accordion-heading{border-top:1px solid #bfc1c3;padding-top:20px;padding-bottom:10px;height:20px;cursor:pointer}.accordion-wrapper .accordion-heading .accordion-image{width:25px;margin-right:20px}.accordion-wrapper .accordion-body{margin-top:20px;margin-right:20px}.accordion-wrapper .last-accordion{border-bottom:1px solid #bfc1c3;padding-bottom:30px}\n"] }]
+        args: [{ selector: 'ccd-read-complex-field-collection-table', standalone: false, template: "<div class=\"complex-panel\" [hidden]=\"caseField.hidden\">\n  <dl class=\"complex-panel-title\">\n    <dt><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></dt>\n    <dd></dd>\n  </dl>\n  <table class=\"complex-panel-table\" aria-label=\"complex panel table\">\n    <tbody>\n    <!-- <COMPLEX table field header>-->\n    <tr>\n      <th *ngFor=\"let heading of columns\" scope=\"col\">\n        <span class=\"text-16\">{{columnsAllLabels[heading].label | rpxTranslate}}</span>\n        <a href=\"#\"\n           (click)=\"sortRowsByColumns(heading); $event.preventDefault()\"\n           (keyup.enter)=\"sortRowsByColumns(heading)\"\n           class=\"sort-widget\"\n           [attr.aria-label]=\"'Sort ' + columnsAllLabels[heading].label | rpxTranslate\"\n           [innerHTML]=\"sortWidget(columnsAllLabels[heading])\"></a>\n      </th>\n      <th><span class=\"govuk-visually-hidden\">Expand row</span></th>\n    </tr>\n    <!-- </COMPLEX table field header>-->\n    <ng-container *ngFor=\"let item of rows; let i = index;\">\n      <!-- <COMPLEX table collapsed view>-->\n      <tr class=\"new-table-row accordion-heading\" (keyup)=\"$event.key === 'Enter' ? (isHidden[i] = !isHidden[i]) : null\" (click)=\"isHidden[i] = !isHidden[i]\"\n          [class.last-accordion]=\"isHidden[i]\">\n        <ng-container *ngFor=\"let heading of columns\">\n          <td class=\"text-16\">\n            <div *ngIf=\"item[heading]; else showEmptyTd\">\n              <ccd-field-read\n                [caseField]=\"toCaseField(heading, item[heading].label, columnsHorizontalLabel[heading].type, item[heading])\"\n                [context]=\"context\"></ccd-field-read>\n            </div>\n            <ng-template #showEmptyTd>\n              <div>&nbsp;</div>\n            </ng-template>\n          </td>\n        </ng-container>\n        <td>\n          <div style=\"float: right;\">\n            <a href=\"#\" (click)=\"$event.preventDefault()\"> <img src=\"{{ getImage(i) }}\" alt=\"accordion-img\" class=\"accordion-image\"/></a>\n          </div>\n        </td>\n      </tr>\n      <!-- </COMPLEX table collapsed view>-->\n      <!-- <COMPLEX table expanded view>-->\n      <tr [hidden]=\"isHidden[i]\">\n        <td [colSpan]=\"columns.length + 1\">\n          <table class=\"complex-panel-table\" aria-label=\"complex panel table expanded\">\n            <tbody>\n            <ng-container\n              *ngFor=\"let vLabel of columnsVerticalLabel | keyvalue: keepOriginalOrder | ccdCollectionTableCaseFieldsFilter: caseField: rows[i] | ccdReadFieldsFilter:true :undefined :true\">\n              <!-- <COMPLEX table expandable body simple field>-->\n              <tr class=\"complex-panel-simple-field accordion-body\" *ngIf=\"item[vLabel.id]\" [hidden]=\"vLabel.hidden\">\n                <th scope=\"col\"><span class=\"text-16\">{{ vLabel.label | rpxTranslate }}</span></th>\n                <td *ngIf=\"vLabel['type'] !== 'Complex'\" class=\"text-16\">\n                  <ccd-field-read [caseField]=\"toCaseField('', vLabel.label, vLabel.field_type, item[vLabel.id])\"\n                                  [context]=\"context\"></ccd-field-read>\n                </td>\n              </tr>\n              <!-- </COMPLEX table expandable body simple field>-->\n\n              <!-- <COMPLEX table expandable body complex field>-->\n              <tr *ngIf=\"vLabel['type'] === 'Complex' && addCaseFieldValue(vLabel, item[vLabel.id])\" [hidden]=\"vLabel.hidden\">\n                <td colspan=\"2\">\n                  <ng-container *ngFor=\"let caseField of vLabel | ccdReadFieldsFilter:true :undefined :true\">\n                      <tr class=\"complex-panel-compound-field\" *ngIf=\"(caseField | ccdIsCompound); else SimpleRow\" [hidden]=\"caseField\">\n                        <td colspan=\"2\">\n                          <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                        </td>\n                      </tr>\n                      <ng-template #SimpleRow>\n                        <tr class=\"complex-panel-nested-field\" [hidden]=\"caseField.hidden\">\n                          <th scope=\"col\"><span class=\"text-16\">{{caseField.label | rpxTranslate}}</span></th>\n                          <td *ngIf=\"!item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <span class=\"text-16\"><ccd-field-read [caseField]=\"caseField\" [context]=\"context\"></ccd-field-read></span>\n                          </td>\n                          <td *ngIf=\"item[vLabel.id]?.hasOwnProperty('CaseReference')\">\n                            <ccd-read-case-link-field [caseField]=\"addCaseReferenceValue(caseField, item[vLabel.id].CaseReference)\" [context]=\"context\"></ccd-read-case-link-field>\n                          </td>\n                        </tr>\n                      </ng-template>\n                  </ng-container>\n                </td>\n              </tr>\n              <!-- <COMPLEX table expandable body complex field>-->\n            </ng-container>\n            </tbody>\n          </table>\n        </td>\n      </tr>\n      <!-- </COMPLEX table expanded view>-->\n    </ng-container>\n    </tbody>\n  </table>\n</div>\n", styles: [".govuk-js-link{appearance:none;background:none;border:none;color:#005ea5;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0;text-decoration:underline}.govuk-js-link:hover{color:#2b8cc4;text-decoration-thickness:max(3px,.1875rem,.12em)}.govuk-js-link:focus{background-color:#ffbf47;color:#000;outline:3px solid transparent;text-decoration:none;box-shadow:0 -2px #ffbf47,0 4px #000}.govuk-js-link:visited{color:#4c2c92}.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}}@media print{.complex-panel .complex-panel-title{font-size:14pt}}.complex-panel .complex-panel-table>tbody>tr>th{vertical-align:top}.complex-panel .complex-panel-table>tbody>tr:last-child>th{border-bottom:none}.complex-panel .complex-panel-table th{padding-left:5px;font-weight:700;border-bottom:none}.complex-panel .complex-panel-table td{padding-left:5px;padding-top:0;padding-bottom:0;border-bottom:none}.complex-panel .new-table-row{border-top:1px solid #bfc1c3}.complex-panel .complex-panel-simple-field th{padding-left:5px;padding-top:0;padding-bottom:0;width:295px}.complex-panel .complex-panel-nested-field th{padding-left:33px;padding-top:0;padding-bottom:0;width:200px}.complex-panel .complex-panel-compound-field td{padding:5px;border-bottom:none}.sort-widget{cursor:pointer;text-decoration:none;color:#0b0c0c}.accordion-wrapper{margin-bottom:20px}.accordion-wrapper .heading-medium{margin:0}.accordion-wrapper .accordion-heading{border-top:1px solid #bfc1c3;padding-top:20px;padding-bottom:10px;height:20px;cursor:pointer}.accordion-wrapper .accordion-heading .accordion-image{width:25px;margin-right:20px}.accordion-wrapper .accordion-body{margin-top:20px;margin-right:20px}.accordion-wrapper .last-accordion{border-bottom:1px solid #bfc1c3;padding-bottom:30px}\n"] }]
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ReadComplexFieldCollectionTableComponent, { className: "ReadComplexFieldCollectionTableComponent", filePath: "lib/shared/components/palette/complex/read-complex-field-collection-table.component.ts", lineNumber: 13 }); })();
 
@@ -37600,7 +37737,7 @@ class CaseEditSubmitComponent {
         return this.placeholderService.resolvePlaceholders(fields, stringToResolve);
     }
     static ɵfac = function CaseEditSubmitComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaseEditSubmitComponent)(i0.ɵɵdirectiveInject(CaseEditComponent), i0.ɵɵdirectiveInject(FieldsUtils), i0.ɵɵdirectiveInject(CaseFieldService), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(OrderService), i0.ɵɵdirectiveInject(ProfileNotifier), i0.ɵɵdirectiveInject(MultipageComponentStateService), i0.ɵɵdirectiveInject(FormValidatorsService), i0.ɵɵdirectiveInject(CaseFlagStateService), i0.ɵɵdirectiveInject(LinkedCasesService), i0.ɵɵdirectiveInject(PlaceholderService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEditSubmitComponent, selectors: [["ccd-case-edit-submit"]], standalone: false, decls: 25, vars: 24, consts: [["titleBlock", ""], ["idBlock", ""], [1, "govuk-heading-l"], [4, "ngIf", "ngIfThen", "ngIfElse"], [3, "error"], [3, "callbackErrorsContext", "callbackErrorsSubject"], [1, "check-your-answers", 3, "submit", "formGroup"], [4, "ngIf"], [3, "eventCompletionParams", "eventCanBeCompleted", 4, "ngIf"], [1, "form-group", "form-group-related"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], ["type", "submit", 1, "button", 3, "disabled"], [1, "cancel"], ["href", "#", 3, "click"], [3, "content"], ["class", "heading-h2", 4, "ngIf"], [1, "heading-h2"], ["class", "text-16", 4, "ngIf"], ["aria-describedby", "check your answers table", 1, "form-table"], [4, "ngFor", "ngForOf"], [1, "text-16"], ["ccdLabelSubstitutor", "", 3, "caseField", "hidden", "formGroup", "contextFields"], ["class", "valign-top case-field-label", 4, "ngIf"], [1, "form-cell", "case-field-content", "text-16"], [3, "formGroup", "topLevelFormGroup", "caseField", "context", "caseFields"], [1, "valign-top", "case-field-label"], [1, "valign-top", "check-your-answers__change", "case-field-change"], ["href", "#", 3, "click", 4, "ngIf"], ["aria-describedby", "summary fields table", 1, "summary-fields"], [3, "ngSwitch"], ["ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields", 4, "ngSwitchCase"], ["class", "compound-field", "ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields", 4, "ngSwitchCase"], ["ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields"], ["id", "summary-field-label"], [1, "form-cell"], [3, "formGroup", "caseField"], ["ccdLabelSubstitutor", "", 1, "compound-field", 3, "caseField", "formGroup", "contextFields"], ["colspan", "2"], [3, "formGroup", "caseField", "caseFields"], ["id", "fieldset-event", "formGroupName", "event"], [2, "display", "none"], [1, "form-group", 3, "ngClass"], ["for", "field-trigger-summary", 1, "form-label"], [1, "form-hint"], ["class", "error-message", 4, "ngIf"], ["type", "text", "id", "field-trigger-summary", "formControlName", "summary", "maxlength", "1024", 1, "form-control", "bottom-30", "width-50", 3, "ngClass"], ["for", "field-trigger-description", 1, "form-label"], ["id", "field-trigger-description", "formControlName", "description", "maxlength", "65536", 1, "form-control", "bottom-30", "width-50", 3, "ngClass"], [1, "error-message"], [3, "eventCanBeCompleted", "eventCompletionParams"]], template: function CaseEditSubmitComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEditSubmitComponent, selectors: [["ccd-case-edit-submit"]], standalone: false, decls: 25, vars: 24, consts: [["titleBlock", ""], ["idBlock", ""], [1, "govuk-heading-l"], [4, "ngIf", "ngIfThen", "ngIfElse"], [3, "error"], [3, "callbackErrorsContext", "callbackErrorsSubject"], [1, "check-your-answers", 3, "submit", "formGroup"], [4, "ngIf"], [3, "eventCompletionParams", "eventCanBeCompleted", 4, "ngIf"], [1, "form-group", "form-group-related"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], ["type", "submit", 1, "button", 3, "disabled"], [1, "cancel"], ["href", "#", 3, "click"], [3, "content"], ["class", "heading-h2", 4, "ngIf"], [1, "heading-h2"], ["class", "text-16", 4, "ngIf"], ["aria-label", "check your answers table", 1, "form-table"], [4, "ngFor", "ngForOf"], [1, "text-16"], ["ccdLabelSubstitutor", "", 3, "caseField", "hidden", "formGroup", "contextFields"], ["class", "valign-top case-field-label", 4, "ngIf"], [1, "form-cell", "case-field-content", "text-16"], [3, "formGroup", "topLevelFormGroup", "caseField", "context", "caseFields"], [1, "valign-top", "case-field-label"], [1, "valign-top", "check-your-answers__change", "case-field-change"], ["href", "#", 3, "click", 4, "ngIf"], ["aria-label", "summary fields table", 1, "summary-fields"], [3, "ngSwitch"], ["ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields", 4, "ngSwitchCase"], ["class", "compound-field", "ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields", 4, "ngSwitchCase"], ["ccdLabelSubstitutor", "", 3, "caseField", "formGroup", "contextFields"], ["id", "summary-field-label"], [1, "form-cell"], [3, "formGroup", "caseField"], ["ccdLabelSubstitutor", "", 1, "compound-field", 3, "caseField", "formGroup", "contextFields"], ["colspan", "2"], [3, "formGroup", "caseField", "caseFields"], ["id", "fieldset-event", "formGroupName", "event"], [2, "display", "none"], [1, "form-group", 3, "ngClass"], ["for", "field-trigger-summary", 1, "form-label"], [1, "form-hint"], ["class", "error-message", 4, "ngIf"], ["type", "text", "id", "field-trigger-summary", "formControlName", "summary", "maxlength", "1024", 1, "form-control", "bottom-30", "width-50", 3, "ngClass"], ["for", "field-trigger-description", 1, "form-label"], ["id", "field-trigger-description", "formControlName", "description", "maxlength", "65536", 1, "form-control", "bottom-30", "width-50", 3, "ngClass"], [1, "error-message"], [3, "eventCanBeCompleted", "eventCompletionParams"]], template: function CaseEditSubmitComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "div")(1, "h1", 2);
             i0.ɵɵtext(2);
@@ -37661,7 +37798,7 @@ class CaseEditSubmitComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEditSubmitComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-edit-submit', standalone: false, template: "<div>\n  <!-- Event trigger name -->\n  <h1 class=\"govuk-heading-l\">{{eventTrigger.name | rpxTranslate}}</h1>\n\n  <!--Case ID or Title -->\n  <div *ngIf=\"getCaseTitle(); then titleBlock; else idBlock\"></div>\n  <ng-template #titleBlock>\n    <ccd-markdown [content]=\"getCaseTitle() | ccdCaseTitle: contextFields : editForm.controls['data'] | rpxTranslate\"></ccd-markdown>\n  </ng-template>\n  <ng-template #idBlock>\n    <h2 *ngIf=\"getCaseId()\" class=\"heading-h2\">#{{ getCaseId() | ccdCaseReference }}</h2>\n  </ng-template>\n\n  <ccd-case-edit-generic-errors [error]=\"caseEdit.error\"></ccd-case-edit-generic-errors>\n\n  <ccd-callback-errors [callbackErrorsSubject]=\"caseEdit.callbackErrorsSubject\"\n                      (callbackErrorsContext)=\"callbackErrorsNotify($event)\"></ccd-callback-errors>\n\n  <form class=\"check-your-answers\" [formGroup]=\"editForm\" (submit)=\"submit()\">\n    <div *ngIf=\"!caseEdit.isEventCompletionChecksRequired\">\n      <ng-container *ngIf=\"checkYourAnswerFieldsToDisplayExists()\">\n        <h2 class=\"heading-h2\">{{pageTitle | rpxTranslate }}</h2>\n        <span class=\"text-16\" *ngIf=\"!caseEdit.isCaseFlagSubmission\">{{'Check the information below carefully.' | rpxTranslate}}</span>\n\n        <table class=\"form-table\" aria-describedby=\"check your answers table\">\n          <tbody>\n          <ng-container *ngFor=\"let page of wizard.pages\">\n            <ng-container *ngIf=\"isShown(page)\">\n              <ng-container *ngFor=\"let field of page\n              | ccdPageFields: editForm\n              | ccdReadFieldsFilter: false :undefined :true :allFieldsValues\n              | ccdCYAPageLabelFilter\">\n                <ng-container *ngIf=\"canShowFieldInCYA(field)\">\n                  <tr ccdLabelSubstitutor [caseField]=\"field\" [hidden]=\"field.hidden\"\n                      [formGroup]=\"editForm.controls['data']\" [contextFields]=\"contextFields\">\n                    <th *ngIf=\"!isLabel(field) && !caseEdit.isCaseFlagSubmission\" class=\"valign-top case-field-label\">\n                      <span class=\"text-16\">{{field.label | rpxTranslate}}</span>\n                    </th>\n                    <td class=\"form-cell case-field-content text-16\" [attr.colspan]=\"isLabel(field) ? '2' : '1'\">\n                      <ccd-field-read\n                        [formGroup]=\"editForm.controls['data']\" [topLevelFormGroup]=\"editForm.controls['data']\"\n                        [caseField]=\"summaryCaseField(field)\" [context]=\"paletteContext\" [caseFields]=\"contextFields\"></ccd-field-read>\n                    </td>\n                    <ng-container *ngIf=\"!caseEdit.isCaseFlagSubmission\">\n                      <td class=\"valign-top check-your-answers__change case-field-change\">\n                        <a *ngIf=\"isChangeAllowed(field)\" (click)=\"navigateToPage(page.id); $event.preventDefault()\"\n                          href=\"#\">\n                          <span class=\"text-16\" attr.aria-label=\"{{'Change' | rpxTranslate}} {{ field.label | rpxTranslate }}\">\n                            {{'Change' | rpxTranslate}}\n                          </span>\n                        </a>\n                      </td>\n                    </ng-container>\n                  </tr>\n                </ng-container>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n          </tbody>\n        </table>\n      </ng-container>\n      <ng-container *ngIf=\"readOnlySummaryFieldsToDisplayExists()\">\n\n        <table class=\"summary-fields\" aria-describedby=\"summary fields table\">\n          <tbody>\n            <ng-container *ngFor=\"let field of showSummaryFields\">\n                <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                  <tr *ngSwitchCase=\"true\" ccdLabelSubstitutor [caseField]=\"field\" [formGroup]=\"editForm.controls['data']\" [contextFields]=\"contextFields\">\n                    <th id=\"summary-field-label\">{{field.label}}</th>\n                    <td class=\"form-cell\">\n                      <ccd-field-read [formGroup]=\"editForm.controls['data']\" [caseField]=\"summaryCaseField(field)\"></ccd-field-read>\n                    </td>\n                  </tr>\n                  <tr *ngSwitchCase=\"false\" class=\"compound-field\" ccdLabelSubstitutor [caseField]=\"field\" [formGroup]=\"editForm.controls['data']\" [contextFields]=\"contextFields\">\n                    <td colspan=\"2\">\n                      <ccd-field-read [formGroup]=\"editForm.controls['data']\" [caseField]=\"summaryCaseField(field)\" [caseFields]=\"contextFields\"></ccd-field-read>\n                    </td>\n                  </tr>\n                </ng-container>\n              </ng-container>\n          </tbody>\n        </table>\n      </ng-container>\n      <ng-container *ngIf=\"showEventNotes()\">\n        <fieldset id=\"fieldset-event\" formGroupName=\"event\">\n          <legend style=\"display: none;\"></legend>\n          <div class=\"form-group\" [ngClass]=\"{'form-group-error': !!summary && !summary.valid && (summary.dirty || summary.touched)}\">\n            <label for=\"field-trigger-summary\" class=\"form-label\">\n              Event summary (optional)\n              <span class=\"form-hint\">A few words describing the purpose of the event.</span>\n            </label>\n            <span class=\"error-message\" *ngIf=\"summary?.errors && (summary.dirty || summary.touched)\">\n              {{summary.errors | ccdFirstError: eventSummaryLabel | rpxTranslate}}\n            </span>\n            <input type=\"text\" id=\"field-trigger-summary\" class=\"form-control bottom-30 width-50\"\n              [ngClass]=\"{'govuk-input--error': summary?.errors && (summary.dirty || summary.touched)}\" formControlName=\"summary\" maxlength=\"1024\">\n          </div>\n          <div class=\"form-group\" [ngClass]=\"{'form-group-error': !!description && !description.valid && (description.dirty || description.touched)}\">\n            <label for=\"field-trigger-description\" class=\"form-label\">Event description (optional)</label>\n            <span class=\"error-message\" *ngIf=\"description?.errors && (description.dirty || description.touched)\">\n              {{description.errors | ccdFirstError: eventDescriptionLabel | rpxTranslate}}\n            </span>\n            <textarea id=\"field-trigger-description\" class=\"form-control bottom-30 width-50\" formControlName=\"description\"\n              [ngClass]=\"{'govuk-input--error': description?.errors && (description.dirty || description.touched)}\" maxlength=\"65536\"></textarea>\n          </div>\n        </fieldset>\n      </ng-container>\n    </div>\n    <ccd-case-event-completion *ngIf=\"caseEdit.isEventCompletionChecksRequired\"\n      [eventCompletionParams]=\"caseEdit.eventCompletionParams\"\n      (eventCanBeCompleted)=\"onEventCanBeCompleted($event)\">\n    </ccd-case-event-completion>\n    <div class=\"form-group form-group-related\">\n      <button class=\"button button-secondary\" type=\"button\" [disabled]=\"!hasPrevious() || caseEdit.isSubmitting\" (click)=\"previous()\">\n        {{'Previous' | rpxTranslate}}\n      </button>\n      <button type=\"submit\" [disabled]=\"isDisabled\" class=\"button\">\n        {{triggerText | rpxTranslate}}\n      </button>\n    </div>\n    <p class=\"cancel\">\n      <a (click)=\"cancel(); $event.preventDefault()\" href=\"#\" [class.disabled]=\"caseEdit.isSubmitting\">{{getCancelText() | rpxTranslate}}</a>\n    </p>\n  </form>\n</div>\n\n", styles: ["#fieldset-case-data{margin-bottom:30px}#fieldset-case-data th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{padding:0}#confirmation-header{width:630px;background-color:#17958b;border:solid 1px #979797;color:#fff;text-align:center}#confirmation-body{width:630px;background-color:#fff}.valign-top{vertical-align:top}.summary-fields{margin-bottom:30px}.summary-fields tbody tr th,.summary-fields tbody tr td{border-bottom:0px}a.disabled{pointer-events:none;cursor:default}.case-field-label{width:45%}.case-field-content{width:50%}.no-bottom-border{border-bottom:none}.case-field-change{width:5%}.refresh-modal-backdrop{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000}.refresh-modal{background:#fff;padding:24px;max-width:520px;width:90%;box-shadow:0 8px 24px #0003;border-radius:4px;text-align:center}.refresh-modal .button{margin-top:12px}\n"] }]
+        args: [{ selector: 'ccd-case-edit-submit', standalone: false, template: "<div>\n  <!-- Event trigger name -->\n  <h1 class=\"govuk-heading-l\">{{eventTrigger.name | rpxTranslate}}</h1>\n\n  <!--Case ID or Title -->\n  <div *ngIf=\"getCaseTitle(); then titleBlock; else idBlock\"></div>\n  <ng-template #titleBlock>\n    <ccd-markdown [content]=\"getCaseTitle() | ccdCaseTitle: contextFields : editForm.controls['data'] | rpxTranslate\"></ccd-markdown>\n  </ng-template>\n  <ng-template #idBlock>\n    <h2 *ngIf=\"getCaseId()\" class=\"heading-h2\">#{{ getCaseId() | ccdCaseReference }}</h2>\n  </ng-template>\n\n  <ccd-case-edit-generic-errors [error]=\"caseEdit.error\"></ccd-case-edit-generic-errors>\n\n  <ccd-callback-errors [callbackErrorsSubject]=\"caseEdit.callbackErrorsSubject\"\n                      (callbackErrorsContext)=\"callbackErrorsNotify($event)\"></ccd-callback-errors>\n\n  <form class=\"check-your-answers\" [formGroup]=\"editForm\" (submit)=\"submit()\">\n    <div *ngIf=\"!caseEdit.isEventCompletionChecksRequired\">\n      <ng-container *ngIf=\"checkYourAnswerFieldsToDisplayExists()\">\n        <h2 class=\"heading-h2\">{{pageTitle | rpxTranslate }}</h2>\n        <span class=\"text-16\" *ngIf=\"!caseEdit.isCaseFlagSubmission\">{{'Check the information below carefully.' | rpxTranslate}}</span>\n\n        <table class=\"form-table\" aria-label=\"check your answers table\">\n          <tbody>\n          <ng-container *ngFor=\"let page of wizard.pages\">\n            <ng-container *ngIf=\"isShown(page)\">\n              <ng-container *ngFor=\"let field of page\n              | ccdPageFields: editForm\n              | ccdReadFieldsFilter: false :undefined :true :allFieldsValues\n              | ccdCYAPageLabelFilter\">\n                <ng-container *ngIf=\"canShowFieldInCYA(field)\">\n                  <tr ccdLabelSubstitutor [caseField]=\"field\" [hidden]=\"field.hidden\"\n                      [formGroup]=\"editForm.controls['data']\" [contextFields]=\"contextFields\">\n                    <th *ngIf=\"!isLabel(field) && !caseEdit.isCaseFlagSubmission\" class=\"valign-top case-field-label\">\n                      <span class=\"text-16\">{{field.label | rpxTranslate}}</span>\n                    </th>\n                    <td class=\"form-cell case-field-content text-16\" [attr.colspan]=\"isLabel(field) ? '2' : '1'\">\n                      <ccd-field-read\n                        [formGroup]=\"editForm.controls['data']\" [topLevelFormGroup]=\"editForm.controls['data']\"\n                        [caseField]=\"summaryCaseField(field)\" [context]=\"paletteContext\" [caseFields]=\"contextFields\"></ccd-field-read>\n                    </td>\n                    <ng-container *ngIf=\"!caseEdit.isCaseFlagSubmission\">\n                      <td class=\"valign-top check-your-answers__change case-field-change\">\n                        <a *ngIf=\"isChangeAllowed(field)\" (click)=\"navigateToPage(page.id); $event.preventDefault()\"\n                          href=\"#\">\n                          <span class=\"text-16\" attr.aria-label=\"{{'Change' | rpxTranslate}} {{ field.label | rpxTranslate }}\">\n                            {{'Change' | rpxTranslate}}\n                          </span>\n                        </a>\n                      </td>\n                    </ng-container>\n                  </tr>\n                </ng-container>\n              </ng-container>\n            </ng-container>\n          </ng-container>\n          </tbody>\n        </table>\n      </ng-container>\n      <ng-container *ngIf=\"readOnlySummaryFieldsToDisplayExists()\">\n\n        <table class=\"summary-fields\" aria-label=\"summary fields table\">\n          <tbody>\n            <ng-container *ngFor=\"let field of showSummaryFields\">\n                <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                  <tr *ngSwitchCase=\"true\" ccdLabelSubstitutor [caseField]=\"field\" [formGroup]=\"editForm.controls['data']\" [contextFields]=\"contextFields\">\n                    <th id=\"summary-field-label\">{{field.label}}</th>\n                    <td class=\"form-cell\">\n                      <ccd-field-read [formGroup]=\"editForm.controls['data']\" [caseField]=\"summaryCaseField(field)\"></ccd-field-read>\n                    </td>\n                  </tr>\n                  <tr *ngSwitchCase=\"false\" class=\"compound-field\" ccdLabelSubstitutor [caseField]=\"field\" [formGroup]=\"editForm.controls['data']\" [contextFields]=\"contextFields\">\n                    <td colspan=\"2\">\n                      <ccd-field-read [formGroup]=\"editForm.controls['data']\" [caseField]=\"summaryCaseField(field)\" [caseFields]=\"contextFields\"></ccd-field-read>\n                    </td>\n                  </tr>\n                </ng-container>\n              </ng-container>\n          </tbody>\n        </table>\n      </ng-container>\n      <ng-container *ngIf=\"showEventNotes()\">\n        <fieldset id=\"fieldset-event\" formGroupName=\"event\">\n          <legend style=\"display: none;\"></legend>\n          <div class=\"form-group\" [ngClass]=\"{'form-group-error': !!summary && !summary.valid && (summary.dirty || summary.touched)}\">\n            <label for=\"field-trigger-summary\" class=\"form-label\">\n              Event summary (optional)\n              <span class=\"form-hint\">A few words describing the purpose of the event.</span>\n            </label>\n            <span class=\"error-message\" *ngIf=\"summary?.errors && (summary.dirty || summary.touched)\">\n              {{summary.errors | ccdFirstError: eventSummaryLabel | rpxTranslate}}\n            </span>\n            <input type=\"text\" id=\"field-trigger-summary\" class=\"form-control bottom-30 width-50\"\n              [ngClass]=\"{'govuk-input--error': summary?.errors && (summary.dirty || summary.touched)}\" formControlName=\"summary\" maxlength=\"1024\">\n          </div>\n          <div class=\"form-group\" [ngClass]=\"{'form-group-error': !!description && !description.valid && (description.dirty || description.touched)}\">\n            <label for=\"field-trigger-description\" class=\"form-label\">Event description (optional)</label>\n            <span class=\"error-message\" *ngIf=\"description?.errors && (description.dirty || description.touched)\">\n              {{description.errors | ccdFirstError: eventDescriptionLabel | rpxTranslate}}\n            </span>\n            <textarea id=\"field-trigger-description\" class=\"form-control bottom-30 width-50\" formControlName=\"description\"\n              [ngClass]=\"{'govuk-input--error': description?.errors && (description.dirty || description.touched)}\" maxlength=\"65536\"></textarea>\n          </div>\n        </fieldset>\n      </ng-container>\n    </div>\n    <ccd-case-event-completion *ngIf=\"caseEdit.isEventCompletionChecksRequired\"\n      [eventCompletionParams]=\"caseEdit.eventCompletionParams\"\n      (eventCanBeCompleted)=\"onEventCanBeCompleted($event)\">\n    </ccd-case-event-completion>\n    <div class=\"form-group form-group-related\">\n      <button class=\"button button-secondary\" type=\"button\" [disabled]=\"!hasPrevious() || caseEdit.isSubmitting\" (click)=\"previous()\">\n        {{'Previous' | rpxTranslate}}\n      </button>\n      <button type=\"submit\" [disabled]=\"isDisabled\" class=\"button\">\n        {{triggerText | rpxTranslate}}\n      </button>\n    </div>\n    <p class=\"cancel\">\n      <a (click)=\"cancel(); $event.preventDefault()\" href=\"#\" [class.disabled]=\"caseEdit.isSubmitting\">{{getCancelText() | rpxTranslate}}</a>\n    </p>\n  </form>\n</div>\n\n", styles: ["#fieldset-case-data{margin-bottom:30px}#fieldset-case-data th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{padding:0}#confirmation-header{width:630px;background-color:#17958b;border:solid 1px #979797;color:#fff;text-align:center}#confirmation-body{width:630px;background-color:#fff}.valign-top{vertical-align:top}.summary-fields{margin-bottom:30px}.summary-fields tbody tr th,.summary-fields tbody tr td{border-bottom:0px}a.disabled{pointer-events:none;cursor:default}.case-field-label{width:45%}.case-field-content{width:50%}.no-bottom-border{border-bottom:none}.case-field-change{width:5%}.refresh-modal-backdrop{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000}.refresh-modal{background:#fff;padding:24px;max-width:520px;width:90%;box-shadow:0 8px 24px #0003;border-radius:4px;text-align:center}.refresh-modal .button{margin-top:12px}\n"] }]
     }], () => [{ type: CaseEditComponent }, { type: FieldsUtils }, { type: CaseFieldService }, { type: i1$1.ActivatedRoute }, { type: OrderService }, { type: ProfileNotifier }, { type: MultipageComponentStateService }, { type: FormValidatorsService }, { type: CaseFlagStateService }, { type: LinkedCasesService }, { type: PlaceholderService }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEditSubmitComponent, { className: "CaseEditSubmitComponent", filePath: "lib/shared/components/case-editor/case-edit-submit/case-edit-submit.component.ts", lineNumber: 32 }); })();
 
@@ -39779,7 +39916,7 @@ class CaseHistoryComponent {
             .filter(tab => ShowCondition.getInstance(tab.show_condition).matchByContextFields(tab.fields));
     }
     static ɵfac = function CaseHistoryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaseHistoryComponent)(i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(AlertService), i0.ɵɵdirectiveInject(OrderService), i0.ɵɵdirectiveInject(CaseNotifier), i0.ɵɵdirectiveInject(CaseHistoryService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseHistoryComponent, selectors: [["ccd-case-history"]], inputs: { event: "event" }, standalone: false, decls: 1, vars: 1, consts: [[4, "ngIf"], [1, "grid-row"], [1, "column-full"], [3, "caseDetails"], [1, "heading-h2"], ["aria-describedby", "event details table", 1, "EventDetails"], [4, "ngFor", "ngForOf"], [1, "caseHistorySection"], [1, "heading-h3"], [1, "CaseHistory", 3, "id"], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-label-header"], [1, "case-viewer-label"], [3, "caseField", "caseReference"], [1, "compound-field"], ["colspan", "2"]], template: function CaseHistoryComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseHistoryComponent, selectors: [["ccd-case-history"]], inputs: { event: "event" }, standalone: false, decls: 1, vars: 1, consts: [[4, "ngIf"], [1, "grid-row"], [1, "column-full"], [3, "caseDetails"], [1, "heading-h2"], ["aria-label", "event details table", 1, "EventDetails"], [4, "ngFor", "ngForOf"], [1, "caseHistorySection"], [1, "heading-h3"], [1, "CaseHistory", 3, "id"], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-label-header"], [1, "case-viewer-label"], [3, "caseField", "caseReference"], [1, "compound-field"], ["colspan", "2"]], template: function CaseHistoryComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, CaseHistoryComponent_div_0_Template, 58, 44, "div", 0);
         } if (rf & 2) {
             i0.ɵɵproperty("ngIf", ctx.isDataLoaded());
@@ -39787,7 +39924,7 @@ class CaseHistoryComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseHistoryComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-history', standalone: false, template: "<div *ngIf=\"isDataLoaded()\">\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    </div>\n  </div>\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <div>\n        <h2 class=\"heading-h2\">{{'Event Details' | rpxTranslate}}</h2>\n        <table class=\"EventDetails\" aria-describedby=\"event details table\">\n          <tbody>\n          <tr>\n            <th>{{'Date' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.timestamp | ccdDate : 'local'}}</td>\n          </tr>\n          <tr>\n            <th>{{'Author' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.user_first_name | titlecase}} {{caseHistory.event.user_last_name | uppercase}}</td>\n          </tr>\n          <tr>\n            <th>{{'End state' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.state_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Event' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.event_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Summary' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.summary | ccdDash}}</td>\n          </tr>\n          <tr>\n            <th>{{'Comment' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.comment | ccdDash}}</td>\n          </tr>\n          </tbody>\n        </table>\n      </div>\n      <div>\n        <h2 class=\"heading-h2\">{{'Case Details' | rpxTranslate}}</h2>\n        <ng-container *ngFor=\"let tab of tabs\">\n          <div class=\"caseHistorySection\">\n            <h3 class=\"heading-h3\">{{tab.label}}</h3>\n            <table class=\"CaseHistory\" id=\"{{tab.id}}\" [attr.aria-describedby]=\"'case history table' | rpxTranslate\">\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"tab.fields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-label-header\">\n                        <div class=\"case-viewer-label\">{{field.label}}</div>\n                      </th>\n                      <td>\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th colspan=\"2\">\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n            </table>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".CaseHistory th,.CaseHistory td{border-bottom:none}.caseHistorySection{margin-top:40px}.EventDetails th,.EventDetails td{border-bottom:none}th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}\n"] }]
+        args: [{ selector: 'ccd-case-history', standalone: false, template: "<div *ngIf=\"isDataLoaded()\">\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    </div>\n  </div>\n  <div class=\"grid-row\">\n    <div class=\"column-full\">\n      <div>\n        <h2 class=\"heading-h2\">{{'Event Details' | rpxTranslate}}</h2>\n        <table class=\"EventDetails\" aria-label=\"event details table\">\n          <tbody>\n          <tr>\n            <th>{{'Date' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.timestamp | ccdDate : 'local'}}</td>\n          </tr>\n          <tr>\n            <th>{{'Author' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.user_first_name | titlecase}} {{caseHistory.event.user_last_name | uppercase}}</td>\n          </tr>\n          <tr>\n            <th>{{'End state' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.state_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Event' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.event_name}}</td>\n          </tr>\n          <tr>\n            <th>{{'Summary' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.summary | ccdDash}}</td>\n          </tr>\n          <tr>\n            <th>{{'Comment' | rpxTranslate}}</th>\n            <td>{{caseHistory.event.comment | ccdDash}}</td>\n          </tr>\n          </tbody>\n        </table>\n      </div>\n      <div>\n        <h2 class=\"heading-h2\">{{'Case Details' | rpxTranslate}}</h2>\n        <ng-container *ngFor=\"let tab of tabs\">\n          <div class=\"caseHistorySection\">\n            <h3 class=\"heading-h3\">{{tab.label}}</h3>\n            <table class=\"CaseHistory\" id=\"{{tab.id}}\" [attr.aria-describedby]=\"'case history table' | rpxTranslate\">\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"tab.fields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-label-header\">\n                        <div class=\"case-viewer-label\">{{field.label}}</div>\n                      </th>\n                      <td>\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th colspan=\"2\">\n                        <ccd-field-read [caseField]=\"field\" [caseReference]=\"caseHistory.case_id\"></ccd-field-read>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n            </table>\n          </div>\n        </ng-container>\n      </div>\n    </div>\n  </div>\n</div>\n", styles: [".CaseHistory th,.CaseHistory td{border-bottom:none}.caseHistorySection{margin-top:40px}.EventDetails th,.EventDetails td{border-bottom:none}th{width:1%;white-space:nowrap;vertical-align:top}.compound-field td{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}\n"] }]
     }], () => [{ type: i1$1.ActivatedRoute }, { type: AlertService }, { type: OrderService }, { type: CaseNotifier }, { type: CaseHistoryService }], { event: [{
             type: Input
         }] }); })();
@@ -40972,14 +41109,14 @@ function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_
     const field_r7 = i0.ɵɵnextContext().$implicit;
     const ctx_r1 = i0.ɵɵnextContext(4);
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngIf", !ctx_r1.isFieldToHaveNoLabel(field_r7));
+    i0.ɵɵproperty("ngIf", !ctx_r1.isFieldToHaveNoLabel(field_r7) && field_r7.label);
     i0.ɵɵadvance();
     i0.ɵɵproperty("id", "case-viewer-field-read--" + field_r7.id);
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("topLevelFormGroup", ctx_r1.formGroup == null ? null : ctx_r1.formGroup.controls["data"])("caseFields", ctx_r1.caseFields)("caseField", field_r7)("caseReference", ctx_r1.caseDetails.case_id);
 } }
 function CaseFullAccessViewComponent_ng_container_12_mat_tab_4_ng_template_3_ng_container_3_tr_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr", 40)(1, "th", 35)(2, "span", 36);
+    i0.ɵɵelementStart(0, "tr", 40)(1, "td", 41)(2, "span", 36);
     i0.ɵɵelement(3, "ccd-field-read", 37);
     i0.ɵɵelementEnd()()();
 } if (rf & 2) {
@@ -41538,7 +41675,7 @@ class CaseFullAccessViewComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.tabGroup = _t.first);
-        } }, inputs: { hasPrint: "hasPrint", hasEventSelector: "hasEventSelector", caseDetails: "caseDetails", prependedTabs: "prependedTabs", appendedTabs: "appendedTabs" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 13, vars: 12, consts: [["tabGroup", ""], ["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [3, "caseId", "displayMode"], [1, "grid-row"], [1, "column-one-half"], [3, "caseDetails"], ["class", "case-viewer-controls", 4, "ngIf"], ["class", "column-one-half", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "column-full"], [4, "ngIf"], ["role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 1, "error-summary"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h1", "error-summary-heading"], ["id", "edit-case-event_error-summary-body", 1, "govuk-error-summary__body"], ["href", "get-help", "target", "_blank"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h2", "error-summary-heading"], ["class", "error-summary-list", 4, "ngIf"], [1, "error-summary-list"], [4, "ngFor", "ngForOf"], [1, "case-viewer-controls"], ["id", "case-viewer-control-print", "routerLink", "print", 1, "button", "button-secondary"], [3, "onTriggerChange", "onTriggerSubmit", "isDisabled", "triggers", "triggerText", "eventId"], [3, "linkClicked", "notificationBannerConfig"], ["animationDuration", "0ms", 3, "selectedIndexChange", "disableRipple", "selectedIndex", "selectedIndex"], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "label", "aria-label", 4, "ngFor", "ngForOf"], [3, "id", "label"], ["matTabContent", ""], [3, "id", "label", "aria-label"], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-field-label", 4, "ngIf"], ["scope", "col", 3, "id"], [1, "text-16"], [3, "topLevelFormGroup", "caseFields", "caseField", "caseReference"], ["id", "case-viewer-field-label"], [1, "case-viewer-label", "text-16"], [1, "compound-field"]], template: function CaseFullAccessViewComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { hasPrint: "hasPrint", hasEventSelector: "hasEventSelector", caseDetails: "caseDetails", prependedTabs: "prependedTabs", appendedTabs: "appendedTabs" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 13, vars: 12, consts: [["tabGroup", ""], ["class", "error-summary", "role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 4, "ngIf"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [3, "caseId", "displayMode"], [1, "grid-row"], [1, "column-one-half"], [3, "caseDetails"], ["class", "case-viewer-controls", 4, "ngIf"], ["class", "column-one-half", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "column-full"], [4, "ngIf"], ["role", "group", "aria-labelledby", "edit-case-event_error-summary-heading", "tabindex", "-1", 1, "error-summary"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h1", "error-summary-heading"], ["id", "edit-case-event_error-summary-body", 1, "govuk-error-summary__body"], ["href", "get-help", "target", "_blank"], ["id", "edit-case-event_error-summary-heading", 1, "heading-h2", "error-summary-heading"], ["class", "error-summary-list", 4, "ngIf"], [1, "error-summary-list"], [4, "ngFor", "ngForOf"], [1, "case-viewer-controls"], ["id", "case-viewer-control-print", "routerLink", "print", 1, "button", "button-secondary"], [3, "onTriggerChange", "onTriggerSubmit", "isDisabled", "triggers", "triggerText", "eventId"], [3, "linkClicked", "notificationBannerConfig"], ["animationDuration", "0ms", 3, "selectedIndexChange", "disableRipple", "selectedIndex", "selectedIndex"], [3, "id", "label", 4, "ngFor", "ngForOf"], [3, "id", "label", "aria-label", 4, "ngFor", "ngForOf"], [3, "id", "label"], ["matTabContent", ""], [3, "id", "label", "aria-label"], ["ccdLabelSubstitutor", "", 3, "caseField", "contextFields", "hidden"], [3, "ngSwitch"], [4, "ngSwitchCase"], ["class", "compound-field", 4, "ngSwitchCase"], ["id", "case-viewer-field-label", 4, "ngIf"], ["scope", "col", 3, "id"], [1, "text-16"], [3, "topLevelFormGroup", "caseFields", "caseField", "caseReference"], ["id", "case-viewer-field-label"], [1, "case-viewer-label", "text-16"], [1, "compound-field"], [3, "id"]], template: function CaseFullAccessViewComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, CaseFullAccessViewComponent_div_0_Template, 14, 12, "div", 1)(1, CaseFullAccessViewComponent_div_1_Template, 8, 7, "div", 1);
             i0.ɵɵelementStart(2, "ccd-callback-errors", 2);
             i0.ɵɵlistener("callbackErrorsContext", function CaseFullAccessViewComponent_Template_ccd_callback_errors_callbackErrorsContext_2_listener($event) { return ctx.callbackErrorsNotify($event); });
@@ -41576,7 +41713,7 @@ class CaseFullAccessViewComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseFullAccessViewComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-full-access-view', standalone: false, template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\"\n                       [eventId]=\"eventId\"\n                       (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\" [(selectedIndex)]=\"selectedTabIndex\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n          <ng-template matTabContent>\n            <ng-container *ngIf=\"tab.id === 'tasks'\">\n              <exui-tasks-ce></exui-tasks-ce>\n            </ng-container>\n            <ng-container *ngIf=\"tab.id === 'roles-and-access'\">\n              <exui-roles-and-access-ce></exui-roles-and-access-ce>\n            </ng-container>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\" [aria-label]=\"curIdx === 0 ? tab.label + ', Please use left and right arrow keys to navigate case tabs' : '' | rpxTranslate\">\n          <ng-template matTabContent>\n            <table [class]=\"tab.id\" [attr.aria-label]=\"'case viewer table' | rpxTranslate\">\n              <tbody>\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true : formGroup?.controls['data']\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"caseFields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-field-label\" *ngIf=\"!isFieldToHaveNoLabel(field)\">\n                        <div class=\"case-viewer-label text-16\">\n                          {{field.label | rpxTranslate}}</div>\n                      </th>\n                      <td [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup?.controls['data']\" [caseFields]=\"caseFields\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <th [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\" [caseFields]=\"caseFields\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\n                          </ccd-field-read>\n                        </span>\n                      </th>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n          <ng-template matTabContent>\n            <ng-container *ngIf=\"tab.id === 'hearings'\">\n              <exui-case-hearings-ce></exui-case-hearings-ce>\n            </ng-container>\n          </ng-template>\n        </mat-tab>\n      </mat-tab-group>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}.hide-table-capion{position:absolute;visibility:hidden}\n"] }]
+        args: [{ selector: 'ccd-case-full-access-view', standalone: false, template: "<!-- Generic error heading and error message to be displayed only if there are no specific callback errors or warnings, or no error details -->\n<div *ngIf=\"error && !(error.callbackErrors || error.callbackWarnings || error.details)\" class=\"error-summary\"\n     role=\"group\" aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h1 class=\"heading-h1 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'Something went wrong' | rpxTranslate}}\n  </h1>\n  <div class=\"govuk-error-summary__body\" id=\"edit-case-event_error-summary-body\">\n    <p>{{\"We're working to fix the problem. Try again shortly.\" | rpxTranslate}}</p>\n    <p>\n      <a href=\"get-help\" target=\"_blank\">\n        {{\"Contact us\" | rpxTranslate}}</a> {{\"if you're still having problems.\" | rpxTranslate}}\n    </p>\n  </div>\n</div>\n<!-- Callback error heading and error message to be displayed if there are specific error details -->\n<div *ngIf=\"error && error.details\" class=\"error-summary\" role=\"group\"\n     aria-labelledby=\"edit-case-event_error-summary-heading\" tabindex=\"-1\">\n  <h2 class=\"heading-h2 error-summary-heading\" id=\"edit-case-event_error-summary-heading\">\n    {{'The callback data failed validation' | rpxTranslate}}\n  </h2>\n  <p>{{error.message | rpxTranslate}}</p>\n  <ul *ngIf=\"error.details?.field_errors\" class=\"error-summary-list\">\n    <li *ngFor=\"let fieldError of error.details.field_errors\">\n      {{fieldError.message | rpxTranslate}}\n    </li>\n  </ul>\n</div>\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<ccd-activity [caseId]=\"caseDetails.case_id\" [displayMode]=\"BANNER\"></ccd-activity>\n<div class=\"grid-row\">\n  <div class=\"column-one-half\">\n    <ccd-case-header [caseDetails]=\"caseDetails\"></ccd-case-header>\n    <div class=\"case-viewer-controls\" *ngIf=\"hasPrint && !isDraft() && isPrintEnabled()\">\n      <a id=\"case-viewer-control-print\" routerLink=\"print\" class=\"button button-secondary\">{{'Print' | rpxTranslate}}</a>\n    </div>\n  </div>\n  <div *ngIf=\"hasEventSelector\" class=\"column-one-half\">\n    <ccd-event-trigger [isDisabled]=\"isTriggerButtonDisabled()\" [triggers]=\"caseDetails.triggers\"\n                       [triggerText]=\"triggerText\"\n                       [eventId]=\"eventId\"\n                       (onTriggerChange)=\"clearErrorsAndWarnings()\"\n                       (onTriggerSubmit)=\"applyTrigger($event)\"></ccd-event-trigger>\n  </div>\n</div>\n<div class=\"grid-row\" *ngIf=\"activeCaseFlags && !caseFlagsExternalUser\">\n  <div class=\"column-full\">\n    <ccd-notification-banner [notificationBannerConfig]=\"notificationBannerConfig\" (linkClicked)=\"onLinkClicked($event)\">\n    </ccd-notification-banner>\n  </div>\n</div>\n<div class=\"grid-row\">\n  <div class=\"column-full\">\n    <ng-container *ngIf=\"hasTabsPresent()\">\n      <mat-tab-group #tabGroup animationDuration=\"0ms\" (selectedIndexChange)=\"tabChanged($event)\" [disableRipple]=\"true\" [(selectedIndex)]=\"selectedTabIndex\"\n        [selectedIndex]=\"selectedTabIndex\">\n        <mat-tab *ngFor=\"let tab of prependedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n          <ng-template matTabContent>\n            <ng-container *ngIf=\"tab.id === 'tasks'\">\n              <exui-tasks-ce></exui-tasks-ce>\n            </ng-container>\n            <ng-container *ngIf=\"tab.id === 'roles-and-access'\">\n              <exui-roles-and-access-ce></exui-roles-and-access-ce>\n            </ng-container>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of sortedTabs; let curIdx=index\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\" [aria-label]=\"curIdx === 0 ? tab.label + ', Please use left and right arrow keys to navigate case tabs' : '' | rpxTranslate\">\n          <ng-template matTabContent>\n            <table [class]=\"tab.id\" [attr.aria-label]=\"'case viewer table' | rpxTranslate\">\n              <tbody>\n              <ng-container *ngFor=\"let field of tab | ccdTabFields | ccdReadFieldsFilter:false :undefined :true : formGroup?.controls['data']\">\n                <div ccdLabelSubstitutor [caseField]=\"field\" [contextFields]=\"caseFields\" [hidden]=\"field.hidden\">\n                  <ng-container [ngSwitch]=\"!(field | ccdIsCompound)\">\n                    <tr *ngSwitchCase=\"true\">\n                      <th id=\"case-viewer-field-label\" *ngIf=\"!isFieldToHaveNoLabel(field) && field.label\">\n                        <div class=\"case-viewer-label text-16\">\n                          {{field.label | rpxTranslate}}</div>\n                      </th>\n                      <td [id]=\"'case-viewer-field-read--' + field.id\" scope=\"col\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup?.controls['data']\" [caseFields]=\"caseFields\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                    <tr *ngSwitchCase=\"false\" class=\"compound-field\">\n                      <td [id]=\"'case-viewer-field-read--' + field.id\">\n                        <span class=\"text-16\">\n                          <ccd-field-read [topLevelFormGroup]=\"formGroup.controls['data']\" [caseFields]=\"caseFields\"\n                                          [caseField]=\"field\" [caseReference]=\"caseDetails.case_id\">\n                          </ccd-field-read>\n                        </span>\n                      </td>\n                    </tr>\n                  </ng-container>\n                </div>\n              </ng-container>\n              </tbody>\n            </table>\n          </ng-template>\n        </mat-tab>\n        <mat-tab *ngFor=\"let tab of appendedTabs\" [id]=\"tab.id\" [label]=\"tab.label | rpxTranslate\">\n          <ng-template matTabContent>\n            <ng-container *ngIf=\"tab.id === 'hearings'\">\n              <exui-case-hearings-ce></exui-case-hearings-ce>\n            </ng-container>\n          </ng-template>\n        </mat-tab>\n      </mat-tab-group>\n    </ng-container>\n  </div>\n</div>\n", styles: ["th{width:1%;white-space:nowrap;vertical-align:top}.compound-field th{padding:0}.case-viewer-controls{margin-top:47px;margin-bottom:20px}ccd-case-header{float:left;margin-right:10px}ccd-event-trigger{float:right}.case-viewer-label{min-width:300px;white-space:normal}.markdown h3{margin-bottom:0}.hide-table-capion{position:absolute;visibility:hidden}\n"] }]
     }], () => [{ type: i0.NgZone }, { type: i1$1.ActivatedRoute }, { type: i1$1.Router }, { type: NavigationNotifierService }, { type: OrderService }, { type: ActivityPollingService }, { type: i1$3.MatLegacyDialog }, { type: AlertService }, { type: DraftService }, { type: ErrorNotifierService }, { type: ConvertHrefToRouterService }, { type: i5.Location }, { type: i0.ChangeDetectorRef }, { type: SessionStorageService }, { type: i1.RpxTranslatePipe }, { type: LoadingService }, { type: LinkedCasesService }, { type: CaseFlagStateService }, { type: i0.NgZone }], { hasPrint: [{
             type: Input
         }], hasEventSelector: [{