@hmcts/ccd-case-ui-toolkit 7.3.44-exui-4368-2916 → 7.3.44-pofcc-75

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

@@ -6624,7 +6624,6 @@ class LabelSubstitutorDirective {
     contextFields = [];
     formGroup;
     elementsToSubstitute = ['label', 'hint_text'];
-    initialLabel;
     initialHintText;
     languageSubscription;
     constructor(fieldsUtils, placeholderService, rpxTranslationPipe, rpxTranslationService) {
@@ -6634,10 +6633,9 @@ class LabelSubstitutorDirective {
         this.rpxTranslationService = rpxTranslationService;
     }
     ngOnInit() {
-        this.initialLabel = this.caseField.label;
         this.initialHintText = this.caseField.hint_text;
+        this.caseField.originalLabel = this.caseField.label;
         this.noCacheProcessing();
-        this.caseField.originalLabel = this.caseField.originalLabel || this.caseField.label;
         this.formGroup = this.formGroup || new FormGroup({});
         this.languageSubscription = this.rpxTranslationService.language$.pipe(skip(1)).subscribe(() => {
             this.onLanguageChange();
@@ -6660,56 +6658,22 @@ class LabelSubstitutorDirective {
             }
         }
     }
-    applySubstitutions(isLanguageChange = false) {
+    applySubstitutions() {
         const fields = this.getReadOnlyAndFormFields();
         if (this.shouldSubstitute('label')) {
-            const currentLabel = this.caseField.label;
-            // `originalLabel` stores the label exactly as it came from the server, before any
-            // placeholder values were inserted. That gives us a clean starting point when the user
-            // changes language or returns to the page later.
-            const originalLabel = this.caseField.originalLabel || currentLabel;
-            const substitutedCurrentLabel = this.resolvePlaceholders(fields, currentLabel);
-            const substitutedOriginalLabel = originalLabel === currentLabel
-                ? substitutedCurrentLabel
-                : this.resolvePlaceholders(fields, originalLabel);
-            const substitutedLabel = substitutedCurrentLabel || substitutedOriginalLabel;
-            const languageIsWelsh = this.rpxTranslationService.language === 'cy';
-            const hasAnyLabelSubstitution = (currentLabel && currentLabel !== substitutedCurrentLabel)
-                || (originalLabel && originalLabel !== substitutedOriginalLabel);
-            if (hasAnyLabelSubstitution) {
-                // Preserve the original template the first time we successfully interpolate it.
-                this.caseField.originalLabel = this.caseField.originalLabel || originalLabel;
-                // Some labels only translate correctly if we translate the template first and then
-                // substitute the helper values into the translated sentence.
-                const translatedTemplateLabel = this.resolvePlaceholders(fields, this.translateLabel(originalLabel, isLanguageChange));
-                // Other labels only translate correctly if we first resolve the English phrase and let
-                // the render layer translate that final resolved string.
-                const translatedResolvedLabel = this.translateLabel(substitutedLabel, isLanguageChange);
-                const hasResolvedWelshTranslation = languageIsWelsh
-                    && translatedResolvedLabel
-                    && translatedResolvedLabel !== substitutedLabel;
-                const hasTemplateWelshTranslation = languageIsWelsh
-                    && translatedTemplateLabel
-                    && translatedTemplateLabel !== substitutedLabel;
-                if (hasResolvedWelshTranslation) {
-                    // Keep the resolved English label and mark it as not yet translated so the field
-                    // template can run `rpxTranslate` on the full phrase at render time.
-                    this.setLabelState(substitutedLabel);
-                }
-                else if (hasTemplateWelshTranslation) {
-                    // Use the template-translated result when translating the fully resolved label does
-                    // not improve the Welsh output.
-                    this.setLabelState(translatedTemplateLabel, true);
-                }
-                else {
-                    // English, untranslated Welsh, or labels whose translation is handled elsewhere.
-                    this.setLabelState(substitutedLabel);
-                }
+            const oldLabel = this.caseField.label;
+            const substitutedLabel = this.resolvePlaceholders(fields, this.caseField.label);
+            if (oldLabel && oldLabel !== substitutedLabel) {
+                // we need to translate the uninterpolated data then substitute the values in translated string
+                this.caseField.originalLabel = substitutedLabel;
+                const translated = this.rpxTranslationPipe.transform(oldLabel);
+                const transSubstitutedLabel = this.resolvePlaceholders(fields, translated);
+                this.caseField.label = transSubstitutedLabel;
+                this.caseField.isTranslated = this.rpxTranslationService.language === 'cy' && translated !== oldLabel;
             }
             else {
-                // No placeholders were resolved, so keep the current label and allow the render layer
-                // to translate it normally if needed.
-                this.setLabelState(substitutedLabel);
+                this.caseField.label = substitutedLabel;
+                this.caseField.isTranslated = false;
             }
         }
         if (this.shouldSubstitute('hint_text')) {
@@ -6719,26 +6683,14 @@ class LabelSubstitutorDirective {
             this.caseField.value = this.resolvePlaceholders(fields, this.caseField.value);
         }
     }
-    translateLabel(label, isLanguageChange) {
-        return isLanguageChange && this.rpxTranslationService.language === 'en'
-            ? label
-            : this.rpxTranslationPipe.transform(label);
-    }
-    setLabelState(label, isTranslated = false) {
-        this.caseField.label = label;
-        this.caseField.isTranslated = isTranslated;
-    }
     onLanguageChange() {
-        this.resetToInitialValues(true);
-        this.applySubstitutions(true);
+        this.resetToInitialValues();
+        this.applySubstitutions();
     }
-    resetToInitialValues(isLanguageChange = false) {
-        if (isLanguageChange && this.caseField?.originalLabel) {
+    resetToInitialValues() {
+        if (this.caseField?.originalLabel) {
             this.caseField.label = this.caseField.originalLabel;
         }
-        if (!isLanguageChange && this.initialLabel) {
-            this.caseField.label = this.initialLabel;
-        }
         if (this.initialHintText) {
             this.caseField.hint_text = this.initialHintText;
         }
@@ -11224,6 +11176,7 @@ class CaseEditPageComponent {
     addressService;
     linkedCasesService;
     caseFlagStateService;
+    zone;
     static RESUMED_FORM_DISCARD = 'RESUMED_FORM_DISCARD';
     static NEW_FORM_DISCARD = 'NEW_FORM_DISCARD';
     static NEW_FORM_SAVE = 'NEW_FORM_CHANGED_SAVE';
@@ -11259,12 +11212,19 @@ class CaseEditPageComponent {
         window.scrollTo(0, 0);
     }
     static setFocusToTop() {
-        const topContainer = document.getElementById('top');
-        if (topContainer) {
-            topContainer.focus();
-        }
+        window.requestAnimationFrame(() => {
+            const pageHeading = document.getElementById('page-heading');
+            if (pageHeading) {
+                pageHeading.focus();
+                return;
+            }
+            const topContainer = document.getElementById('top');
+            if (topContainer) {
+                topContainer.focus();
+            }
+        });
     }
-    constructor(caseEdit, route, formValueService, formErrorService, cdRef, pageValidationService, dialog, caseFieldService, caseEditDataService, loadingService, validPageListCaseFieldsService, multipageComponentStateService, addressService, linkedCasesService, caseFlagStateService) {
+    constructor(caseEdit, route, formValueService, formErrorService, cdRef, pageValidationService, dialog, caseFieldService, caseEditDataService, loadingService, validPageListCaseFieldsService, multipageComponentStateService, addressService, linkedCasesService, caseFlagStateService, zone) {
         this.caseEdit = caseEdit;
         this.route = route;
         this.formValueService = formValueService;
@@ -11280,6 +11240,7 @@ class CaseEditPageComponent {
         this.addressService = addressService;
         this.linkedCasesService = linkedCasesService;
         this.caseFlagStateService = caseFlagStateService;
+        this.zone = zone;
         this.multipageComponentStateService.setInstigator(this);
     }
     onFinalNext() {
@@ -11343,7 +11304,9 @@ class CaseEditPageComponent {
             }
             this.triggerText = this.getTriggerText();
         });
-        CaseEditPageComponent.setFocusToTop();
+        this.zone.onStable.pipe(take(1)).subscribe(() => {
+            CaseEditPageComponent.setFocusToTop();
+        });
         this.caseEditFormSub = this.caseEditDataService.caseEditForm$.subscribe({
             next: editForm => this.editForm = editForm
         });
@@ -11896,8 +11859,8 @@ class CaseEditPageComponent {
             }
         });
     }
-    static ɵfac = function CaseEditPageComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaseEditPageComponent)(i0.ɵɵdirectiveInject(CaseEditComponent), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(FormValueService), i0.ɵɵdirectiveInject(FormErrorService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(PageValidationService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(CaseFieldService), i0.ɵɵdirectiveInject(CaseEditDataService), i0.ɵɵdirectiveInject(LoadingService), i0.ɵɵdirectiveInject(ValidPageListCaseFieldsService), i0.ɵɵdirectiveInject(MultipageComponentStateService), i0.ɵɵdirectiveInject(AddressesService), i0.ɵɵdirectiveInject(LinkedCasesService), i0.ɵɵdirectiveInject(CaseFlagStateService)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEditPageComponent, selectors: [["ccd-case-edit-page"]], standalone: false, decls: 12, vars: 11, consts: [["titleBlock", ""], ["idBlock", ""], [4, "ngIf"], [4, "ngIf", "ngIfThen", "ngIfElse"], ["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], [3, "error"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [1, "width-50"], ["class", "form", 3, "formGroup", "submit", 4, "ngIf"], [3, "eventCompletionParams", "eventCanBeCompleted", 4, "ngIf"], ["class", "govuk-heading-l", 4, "ngIf"], [1, "govuk-heading-l"], [1, "govuk-caption-l"], [3, "content"], ["class", "heading-h2", 4, "ngIf"], [1, "heading-h2"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], ["class", "govuk-error-summary__body", 4, "ngFor", "ngForOf"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], ["tabindex", "0", 1, "validation-error", 3, "click", "keyup.enter"], [1, "form", 3, "submit", "formGroup"], ["id", "fieldset-case-data"], [2, "display", "none"], ["id", "caseEditForm", 3, "fields", "formGroup", "caseFields", "pageChangeSubject", "valuesChanged", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "form-group", "form-group-related"], ["class", "button button-secondary", "type", "button", 3, "disabled", "click", 4, "ngIf"], ["type", "submit", 1, "button", 3, "disabled"], [1, "cancel"], ["type", "button", 1, "govuk-js-link", 3, "click"], ["id", "caseEditForm", 3, "valuesChanged", "fields", "formGroup", "caseFields", "pageChangeSubject"], [1, "grid-row"], [1, "column-two-thirds", "rightBorderSeparator"], ["id", "caseEditForm1", 3, "fields", "formGroup", "caseFields"], [1, "column-one-third"], ["id", "caseEditForm2", 3, "fields", "formGroup", "caseFields"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], [3, "eventCanBeCompleted", "eventCompletionParams"]], template: function CaseEditPageComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵfac = function CaseEditPageComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CaseEditPageComponent)(i0.ɵɵdirectiveInject(CaseEditComponent), i0.ɵɵdirectiveInject(i1$1.ActivatedRoute), i0.ɵɵdirectiveInject(FormValueService), i0.ɵɵdirectiveInject(FormErrorService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(PageValidationService), i0.ɵɵdirectiveInject(i1$3.MatLegacyDialog), i0.ɵɵdirectiveInject(CaseFieldService), i0.ɵɵdirectiveInject(CaseEditDataService), i0.ɵɵdirectiveInject(LoadingService), i0.ɵɵdirectiveInject(ValidPageListCaseFieldsService), i0.ɵɵdirectiveInject(MultipageComponentStateService), i0.ɵɵdirectiveInject(AddressesService), i0.ɵɵdirectiveInject(LinkedCasesService), i0.ɵɵdirectiveInject(CaseFlagStateService), i0.ɵɵdirectiveInject(i0.NgZone)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CaseEditPageComponent, selectors: [["ccd-case-edit-page"]], standalone: false, decls: 12, vars: 11, consts: [["titleBlock", ""], ["idBlock", ""], [4, "ngIf"], [4, "ngIf", "ngIfThen", "ngIfElse"], ["class", "govuk-error-summary", "aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 4, "ngIf"], [3, "error"], [3, "callbackErrorsContext", "triggerTextContinue", "triggerTextIgnore", "callbackErrorsSubject"], [1, "width-50"], ["class", "form", 3, "formGroup", "submit", 4, "ngIf"], [3, "eventCompletionParams", "eventCanBeCompleted", 4, "ngIf"], ["class", "govuk-heading-l", "id", "page-heading", "tabindex", "-1", 4, "ngIf"], ["id", "page-heading", "tabindex", "-1", 1, "govuk-heading-l"], [1, "govuk-caption-l"], [3, "content"], ["class", "heading-h2", 4, "ngIf"], [1, "heading-h2"], ["aria-labelledby", "error-summary-title", "role", "alert", "tabindex", "-1", "data-module", "govuk-error-summary", 1, "govuk-error-summary"], ["id", "error-summary-title", 1, "govuk-error-summary__title"], ["class", "govuk-error-summary__body", 4, "ngFor", "ngForOf"], [1, "govuk-error-summary__body"], [1, "govuk-list", "govuk-error-summary__list"], ["tabindex", "0", 1, "validation-error", 3, "click", "keyup.enter"], [1, "form", 3, "submit", "formGroup"], ["id", "fieldset-case-data"], [2, "display", "none"], ["id", "caseEditForm", 3, "fields", "formGroup", "caseFields", "pageChangeSubject", "valuesChanged", 4, "ngIf"], ["class", "grid-row", 4, "ngIf"], [1, "form-group", "form-group-related"], ["class", "button button-secondary", "type", "button", 3, "disabled", "click", 4, "ngIf"], ["type", "submit", 1, "button", 3, "disabled"], [1, "cancel"], ["type", "button", 1, "govuk-js-link", 3, "click"], ["id", "caseEditForm", 3, "valuesChanged", "fields", "formGroup", "caseFields", "pageChangeSubject"], [1, "grid-row"], [1, "column-two-thirds", "rightBorderSeparator"], ["id", "caseEditForm1", 3, "fields", "formGroup", "caseFields"], [1, "column-one-third"], ["id", "caseEditForm2", 3, "fields", "formGroup", "caseFields"], ["type", "button", 1, "button", "button-secondary", 3, "click", "disabled"], [3, "eventCanBeCompleted", "eventCompletionParams"]], template: function CaseEditPageComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵtemplate(0, CaseEditPageComponent_ng_container_0_Template, 3, 2, "ng-container", 2)(1, CaseEditPageComponent_div_1_Template, 1, 0, "div", 3)(2, CaseEditPageComponent_ng_template_2_Template, 3, 7, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor)(4, CaseEditPageComponent_ng_template_4_Template, 1, 1, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor)(6, CaseEditPageComponent_div_6_Template, 5, 4, "div", 4);
             i0.ɵɵelement(7, "ccd-case-edit-generic-errors", 5);
@@ -11924,12 +11887,12 @@ class CaseEditPageComponent {
             i0.ɵɵproperty("ngIf", ctx.currentPage);
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.caseEdit.isEventCompletionChecksRequired);
-        } }, styles: [".rightBorderSeparator[_ngcontent-%COMP%]{border-right-width:4px;border-right-color:#ffcc02;border-right-style:solid}.validation-error[_ngcontent-%COMP%]{cursor:pointer;text-decoration:underline;color:#d4351c}"] });
+        } }, styles: [".rightBorderSeparator[_ngcontent-%COMP%]{border-right-width:4px;border-right-color:#ffcc02;border-right-style:solid}.validation-error[_ngcontent-%COMP%]{cursor:pointer;text-decoration:underline;color:#d4351c}#page-heading[_ngcontent-%COMP%]:focus{outline:none}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CaseEditPageComponent, [{
         type: Component,
-        args: [{ selector: 'ccd-case-edit-page', standalone: false, template: "<ng-container *ngIf=\"currentPage\">\n  <h1 *ngIf=\"!currentPage.label\" class=\"govuk-heading-l\">{{eventTrigger.name | rpxTranslate}}</h1>\n  <ng-container *ngIf=\"currentPage.label\">\n    <span class=\"govuk-caption-l\">{{ eventTrigger.name | rpxTranslate}}</span>\n    <h1 class=\"govuk-heading-l\">{{currentPage.label | rpxTranslate}}</h1>\n  </ng-container>\n</ng-container>\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: caseFields : 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<!-- Error message summary -->\n<div *ngIf=\"validationErrors.length > 0\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    {{'There is a problem' | rpxTranslate}}\n  </h2>\n  <div *ngFor=\"let validationError of validationErrors\" class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li>\n        <a (click)=\"navigateToErrorElement(validationError.id)\" (keyup.enter)=\"navigateToErrorElement(validationError.id)\" tabindex=\"0\" class=\"validation-error\">\n          {{ validationError.message | rpxTranslate: getRpxTranslatePipeArgs(validationError.label | rpxTranslate): null }}\n        </a>\n      </li>\n    </ul>\n  </div>\n</div>\n\n<ccd-case-edit-generic-errors [error]=\"caseEdit.error\"></ccd-case-edit-generic-errors>\n\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"caseEdit.callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<div class=\"width-50\">\n  <form *ngIf=\"currentPage\" class=\"form\" [formGroup]=\"editForm\" (submit)=\"nextStep()\">\n    <fieldset id=\"fieldset-case-data\">\n      <legend style=\"display: none;\"></legend>\n      <!-- single column -->\n      <ccd-case-edit-form id='caseEditForm' *ngIf=\"!currentPage.isMultiColumn()\" [fields]=\"currentPage.getCol1Fields()\"\n                          [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"\n                          [pageChangeSubject]=\"pageChangeSubject\"\n                          (valuesChanged)=\"applyValuesChanged($event)\"></ccd-case-edit-form>\n      <!-- two columns -->\n      <div *ngIf=\"currentPage.isMultiColumn()\" class=\"grid-row\">\n        <div class=\"column-two-thirds rightBorderSeparator\">\n          <ccd-case-edit-form id='caseEditForm1' [fields]=\"currentPage.getCol1Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n        <div class=\"column-one-third\">\n          <ccd-case-edit-form id='caseEditForm2' [fields]=\"currentPage.getCol2Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n      </div>\n    </fieldset>\n\n    <div class=\"form-group form-group-related\">\n      <button class=\"button button-secondary\" type=\"button\" (click)=\"toPreviousPage()\" *ngIf=\"!isAtStart()\" [disabled]=\"isDisabled()\">\n        {{'Previous' | rpxTranslate}}\n      </button>\n      <button class=\"button\" type=\"submit\" [disabled]=\"submitting()\">{{triggerText | rpxTranslate}}</button>\n    </div>\n\n    <p class=\"cancel\"><button type=\"button\" (click)=\"cancel()\" class=\"govuk-js-link\">{{getCancelText() | rpxTranslate}}</button></p>\n  </form>\n</div>\n\n<ccd-case-event-completion *ngIf=\"caseEdit.isEventCompletionChecksRequired\"\n  [eventCompletionParams]=\"caseEdit.eventCompletionParams\"\n  (eventCanBeCompleted)=\"onEventCanBeCompleted($event)\">\n</ccd-case-event-completion>\n", styles: [".rightBorderSeparator{border-right-width:4px;border-right-color:#ffcc02;border-right-style:solid}.validation-error{cursor:pointer;text-decoration:underline;color:#d4351c}\n"] }]
-    }], () => [{ type: CaseEditComponent }, { type: i1$1.ActivatedRoute }, { type: FormValueService }, { type: FormErrorService }, { type: i0.ChangeDetectorRef }, { type: PageValidationService }, { type: i1$3.MatLegacyDialog }, { type: CaseFieldService }, { type: CaseEditDataService }, { type: LoadingService }, { type: ValidPageListCaseFieldsService }, { type: MultipageComponentStateService }, { type: AddressesService }, { type: LinkedCasesService }, { type: CaseFlagStateService }], null); })();
+        args: [{ selector: 'ccd-case-edit-page', standalone: false, template: "<ng-container *ngIf=\"currentPage\">\n  <h1 *ngIf=\"!currentPage.label\" class=\"govuk-heading-l\" id=\"page-heading\" tabindex=\"-1\">{{eventTrigger.name | rpxTranslate}}</h1>\n  <ng-container *ngIf=\"currentPage.label\">\n    <span class=\"govuk-caption-l\">{{ eventTrigger.name | rpxTranslate}}</span>\n    <h1 class=\"govuk-heading-l\" id=\"page-heading\" tabindex=\"-1\">{{currentPage.label | rpxTranslate}}</h1>\n  </ng-container>\n</ng-container>\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: caseFields : 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<!-- Error message summary -->\n<div *ngIf=\"validationErrors.length > 0\" class=\"govuk-error-summary\" aria-labelledby=\"error-summary-title\" role=\"alert\" tabindex=\"-1\" data-module=\"govuk-error-summary\">\n  <h2 class=\"govuk-error-summary__title\" id=\"error-summary-title\">\n    {{'There is a problem' | rpxTranslate}}\n  </h2>\n  <div *ngFor=\"let validationError of validationErrors\" class=\"govuk-error-summary__body\">\n    <ul class=\"govuk-list govuk-error-summary__list\">\n      <li>\n        <a (click)=\"navigateToErrorElement(validationError.id)\" (keyup.enter)=\"navigateToErrorElement(validationError.id)\" tabindex=\"0\" class=\"validation-error\">\n          {{ validationError.message | rpxTranslate: getRpxTranslatePipeArgs(validationError.label | rpxTranslate): null }}\n        </a>\n      </li>\n    </ul>\n  </div>\n</div>\n\n<ccd-case-edit-generic-errors [error]=\"caseEdit.error\"></ccd-case-edit-generic-errors>\n\n<ccd-callback-errors\n  [triggerTextContinue]=\"triggerTextStart\"\n  [triggerTextIgnore]=\"triggerTextIgnoreWarnings\"\n  [callbackErrorsSubject]=\"caseEdit.callbackErrorsSubject\"\n  (callbackErrorsContext)=\"callbackErrorsNotify($event)\">\n</ccd-callback-errors>\n<div class=\"width-50\">\n  <form *ngIf=\"currentPage\" class=\"form\" [formGroup]=\"editForm\" (submit)=\"nextStep()\">\n    <fieldset id=\"fieldset-case-data\">\n      <legend style=\"display: none;\"></legend>\n      <!-- single column -->\n      <ccd-case-edit-form id='caseEditForm' *ngIf=\"!currentPage.isMultiColumn()\" [fields]=\"currentPage.getCol1Fields()\"\n                          [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"\n                          [pageChangeSubject]=\"pageChangeSubject\"\n                          (valuesChanged)=\"applyValuesChanged($event)\"></ccd-case-edit-form>\n      <!-- two columns -->\n      <div *ngIf=\"currentPage.isMultiColumn()\" class=\"grid-row\">\n        <div class=\"column-two-thirds rightBorderSeparator\">\n          <ccd-case-edit-form id='caseEditForm1' [fields]=\"currentPage.getCol1Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n        <div class=\"column-one-third\">\n          <ccd-case-edit-form id='caseEditForm2' [fields]=\"currentPage.getCol2Fields()\"\n                              [formGroup]=\"editForm.controls['data']\" [caseFields]=\"caseFields\"></ccd-case-edit-form>\n        </div>\n      </div>\n    </fieldset>\n\n    <div class=\"form-group form-group-related\">\n      <button class=\"button button-secondary\" type=\"button\" (click)=\"toPreviousPage()\" *ngIf=\"!isAtStart()\" [disabled]=\"isDisabled()\">\n        {{'Previous' | rpxTranslate}}\n      </button>\n      <button class=\"button\" type=\"submit\" [disabled]=\"submitting()\">{{triggerText | rpxTranslate}}</button>\n    </div>\n\n    <p class=\"cancel\"><button type=\"button\" (click)=\"cancel()\" class=\"govuk-js-link\">{{getCancelText() | rpxTranslate}}</button></p>\n  </form>\n</div>\n\n<ccd-case-event-completion *ngIf=\"caseEdit.isEventCompletionChecksRequired\"\n  [eventCompletionParams]=\"caseEdit.eventCompletionParams\"\n  (eventCanBeCompleted)=\"onEventCanBeCompleted($event)\">\n</ccd-case-event-completion>\n", styles: [".rightBorderSeparator{border-right-width:4px;border-right-color:#ffcc02;border-right-style:solid}.validation-error{cursor:pointer;text-decoration:underline;color:#d4351c}#page-heading:focus{outline:none}\n"] }]
+    }], () => [{ type: CaseEditComponent }, { type: i1$1.ActivatedRoute }, { type: FormValueService }, { type: FormErrorService }, { type: i0.ChangeDetectorRef }, { type: PageValidationService }, { type: i1$3.MatLegacyDialog }, { type: CaseFieldService }, { type: CaseEditDataService }, { type: LoadingService }, { type: ValidPageListCaseFieldsService }, { type: MultipageComponentStateService }, { type: AddressesService }, { type: LinkedCasesService }, { type: CaseFlagStateService }, { type: i0.NgZone }], null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CaseEditPageComponent, { className: "CaseEditPageComponent", filePath: "lib/shared/components/case-editor/case-edit-page/case-edit-page.component.ts", lineNumber: 35 }); })();
 
 class CallbackErrorsContext {