npm - @hmcts/opal-frontend-common - Versions diffs - 0.0.95 → 0.0.97 - Mend

@hmcts/opal-frontend-common 0.0.95 → 0.0.97

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (131) hide show

package/fesm2022/hmcts-opal-frontend-common-components-govuk-govuk-text-input.mjs CHANGED Viewed

@@ -33,10 +33,10 @@ class GovukTextInputComponent {
         }
         return ids.length ? ids.join(' ') : null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: GovukTextInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: GovukTextInputComponent, isStandalone: true, selector: "opal-lib-govuk-text-input", inputs: { labelText: "labelText", labelClasses: "labelClasses", inputId: "inputId", inputName: "inputName", inputClasses: "inputClasses", hintText: "hintText", hintHtml: "hintHtml", errors: "errors", autoComplete: "autoComplete", autoCompleteValue: "autoCompleteValue", control: "control" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [class.govuk-form-group--error]=\"!!errors\">\n  <div class=\"govuk-label-wrapper\">\n    <label class=\"govuk-label {{ labelClasses }}\" [for]=\"inputId\">\n      {{ labelText }}\n    </label>\n  </div>\n  @if (hintText || hintHtml) {\n    <div id=\"{{ inputId }}-hint\" class=\"govuk-hint\">\n      @if (hintHtml) {\n        <ng-content></ng-content>\n      } @else {\n        {{ hintText }}\n      }\n    </div>\n  }\n\n  @if (errors) {\n    <p id=\"{{ this.inputId }}-error-message\" class=\"govuk-error-message\">\n      <span class=\"govuk-visually-hidden\">Error: </span> {{ errors }}\n    </p>\n  }\n\n  <input\n    class=\"govuk-input {{ inputClasses }}\"\n    [id]=\"inputId\"\n    [name]=\"inputName\"\n    type=\"text\"\n    [attr.autocomplete]=\"autoCompleteValue ? autoCompleteValue : autoComplete ? 'on' : 'off'\"\n    [formControl]=\"getControl\"\n    [attr.aria-describedby]=\"describedBy\"\n  />\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: GovukTextInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: GovukTextInputComponent, isStandalone: true, selector: "opal-lib-govuk-text-input", inputs: { labelText: "labelText", labelClasses: "labelClasses", inputId: "inputId", inputName: "inputName", inputClasses: "inputClasses", hintText: "hintText", hintHtml: "hintHtml", errors: "errors", autoComplete: "autoComplete", autoCompleteValue: "autoCompleteValue", control: "control" }, ngImport: i0, template: "<div class=\"govuk-form-group\" [class.govuk-form-group--error]=\"!!errors\">\n  <div class=\"govuk-label-wrapper\">\n    <label class=\"govuk-label {{ labelClasses }}\" [for]=\"inputId\">\n      {{ labelText }}\n    </label>\n  </div>\n  @if (hintText || hintHtml) {\n    <div id=\"{{ inputId }}-hint\" class=\"govuk-hint\">\n      @if (hintHtml) {\n        <ng-content></ng-content>\n      } @else {\n        {{ hintText }}\n      }\n    </div>\n  }\n\n  @if (errors) {\n    <p id=\"{{ this.inputId }}-error-message\" class=\"govuk-error-message\">\n      <span class=\"govuk-visually-hidden\">Error: </span> {{ errors }}\n    </p>\n  }\n\n  <input\n    class=\"govuk-input {{ inputClasses }}\"\n    [id]=\"inputId\"\n    [name]=\"inputName\"\n    type=\"text\"\n    [attr.autocomplete]=\"autoCompleteValue ? autoCompleteValue : autoComplete ? 'on' : 'off'\"\n    [formControl]=\"getControl\"\n    [attr.aria-describedby]=\"describedBy\"\n  />\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: GovukTextInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: GovukTextInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-govuk-text-input', imports: [ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"govuk-form-group\" [class.govuk-form-group--error]=\"!!errors\">\n  <div class=\"govuk-label-wrapper\">\n    <label class=\"govuk-label {{ labelClasses }}\" [for]=\"inputId\">\n      {{ labelText }}\n    </label>\n  </div>\n  @if (hintText || hintHtml) {\n    <div id=\"{{ inputId }}-hint\" class=\"govuk-hint\">\n      @if (hintHtml) {\n        <ng-content></ng-content>\n      } @else {\n        {{ hintText }}\n      }\n    </div>\n  }\n\n  @if (errors) {\n    <p id=\"{{ this.inputId }}-error-message\" class=\"govuk-error-message\">\n      <span class=\"govuk-visually-hidden\">Error: </span> {{ errors }}\n    </p>\n  }\n\n  <input\n    class=\"govuk-input {{ inputClasses }}\"\n    [id]=\"inputId\"\n    [name]=\"inputName\"\n    type=\"text\"\n    [attr.autocomplete]=\"autoCompleteValue ? autoCompleteValue : autoComplete ? 'on' : 'off'\"\n    [formControl]=\"getControl\"\n    [attr.aria-describedby]=\"describedBy\"\n  />\n</div>\n" }]
         }], propDecorators: { labelText: [{

package/fesm2022/hmcts-opal-frontend-common-components-hod-hod-loading-spinner.mjs CHANGED Viewed

@@ -6,10 +6,10 @@ class HodLoadingSpinnerComponent {
     statusText = 'Loading...';
     hostClasses = 'hods-loading-spinner';
     role = 'status';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: HodLoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: HodLoadingSpinnerComponent, isStandalone: true, selector: "opal-lib-hod-loading-spinner, [opal-lib-hod-loading-spinner]", inputs: { spinnerId: "spinnerId", statusText: "statusText" }, host: { properties: { "class": "this.hostClasses", "attr.role": "this.role" } }, ngImport: i0, template: "<div class=\"hods-loading-spinner__spinner\"></div>\n<div class=\"hods-loading-spinner__content\">\n  @if (statusText) {\n    <span class=\"govuk-visually-hidden\">{{ statusText }}</span>\n  }\n  <ng-content></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: HodLoadingSpinnerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: HodLoadingSpinnerComponent, isStandalone: true, selector: "opal-lib-hod-loading-spinner, [opal-lib-hod-loading-spinner]", inputs: { spinnerId: "spinnerId", statusText: "statusText" }, host: { properties: { "class": "this.hostClasses", "attr.role": "this.role" } }, ngImport: i0, template: "<div class=\"hods-loading-spinner__spinner\"></div>\n<div class=\"hods-loading-spinner__content\">\n  @if (statusText) {\n    <span class=\"govuk-visually-hidden\">{{ statusText }}</span>\n  }\n  <ng-content></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: HodLoadingSpinnerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: HodLoadingSpinnerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-hod-loading-spinner, [opal-lib-hod-loading-spinner]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"hods-loading-spinner__spinner\"></div>\n<div class=\"hods-loading-spinner__content\">\n  @if (statusText) {\n    <span class=\"govuk-visually-hidden\">{{ statusText }}</span>\n  }\n  <ng-content></ng-content>\n</div>\n" }]
         }], propDecorators: { spinnerId: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-alert.mjs CHANGED Viewed

@@ -17,10 +17,10 @@ class MojAlertDismissComponent {
         }
         this.dismiss.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertDismissComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojAlertDismissComponent, isStandalone: true, selector: "opal-lib-moj-alert-dismiss", outputs: { dismiss: "dismiss" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<button class=\"moj-alert__dismiss\" (click)=\"dismissAlert($event)\" (keyup.enter)=\"dismissAlert($event)\">Dismiss</button>\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertDismissComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojAlertDismissComponent, isStandalone: true, selector: "opal-lib-moj-alert-dismiss", outputs: { dismiss: "dismiss" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<button class=\"moj-alert__dismiss\" (click)=\"dismissAlert($event)\" (keyup.enter)=\"dismissAlert($event)\">Dismiss</button>\n" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertDismissComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertDismissComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-alert-dismiss', imports: [], template: "<button class=\"moj-alert__dismiss\" (click)=\"dismissAlert($event)\" (keyup.enter)=\"dismissAlert($event)\">Dismiss</button>\n" }]
         }], propDecorators: { hostClass: [{
@@ -42,6 +42,12 @@ class MojAlertComponent {
     get computedAriaLabel() {
         return `${this.type} : ${this.ariaLabel}`;
     }
+    get computedRole() {
+        if (!this.isVisible) {
+            return null;
+        }
+        return this.type === 'error' || this.type === 'warning' ? 'alert' : 'status';
+    }
     dataModule = 'moj-alert';
     /**
      * Dismisses the alert component.
@@ -54,10 +60,10 @@ class MojAlertComponent {
         this.isVisible = false;
         this.dismissed.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: MojAlertComponent, isStandalone: true, selector: "opal-lib-moj-alert, [opal-lib-moj-alert]", inputs: { ariaLabel: "ariaLabel", type: "type", showDismiss: "showDismiss" }, outputs: { dismissed: "dismissed" }, host: { properties: { "class": "this.hostClass", "attr.aria-label": "this.computedAriaLabel", "attr.data-module": "this.dataModule" } }, ngImport: i0, template: "@if (isVisible) {\n  <ng-content select=\"[icon]\"></ng-content>\n  <ng-content select=\"[content]\"></ng-content>\n\n  @if (showDismiss) {\n    <opal-lib-moj-alert-dismiss (dismiss)=\"dismiss()\"></opal-lib-moj-alert-dismiss>\n  }\n}\n", dependencies: [{ kind: "component", type: MojAlertDismissComponent, selector: "opal-lib-moj-alert-dismiss", outputs: ["dismiss"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: MojAlertComponent, isStandalone: true, selector: "opal-lib-moj-alert, [opal-lib-moj-alert]", inputs: { ariaLabel: "ariaLabel", type: "type", showDismiss: "showDismiss" }, outputs: { dismissed: "dismissed" }, host: { properties: { "class": "this.hostClass", "attr.aria-label": "this.computedAriaLabel", "attr.role": "this.computedRole", "attr.data-module": "this.dataModule" } }, ngImport: i0, template: "@if (isVisible) {\n  <ng-content select=\"[icon]\"></ng-content>\n  <ng-content select=\"[content]\"></ng-content>\n\n  @if (showDismiss) {\n    <opal-lib-moj-alert-dismiss (dismiss)=\"dismiss()\"></opal-lib-moj-alert-dismiss>\n  }\n}\n", dependencies: [{ kind: "component", type: MojAlertDismissComponent, selector: "opal-lib-moj-alert-dismiss", outputs: ["dismiss"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-alert, [opal-lib-moj-alert]', imports: [MojAlertDismissComponent], template: "@if (isVisible) {\n  <ng-content select=\"[icon]\"></ng-content>\n  <ng-content select=\"[content]\"></ng-content>\n\n  @if (showDismiss) {\n    <opal-lib-moj-alert-dismiss (dismiss)=\"dismiss()\"></opal-lib-moj-alert-dismiss>\n  }\n}\n" }]
         }], propDecorators: { ariaLabel: [{
@@ -77,6 +83,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
             }], computedAriaLabel: [{
                 type: HostBinding,
                 args: ['attr.aria-label']
+            }], computedRole: [{
+                type: HostBinding,
+                args: ['attr.role']
             }], dataModule: [{
                 type: HostBinding,
                 args: ['attr.data-module']
@@ -141,10 +150,10 @@ class MojAlertPathDirective {
             svg.appendChild(path);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertPathDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.18", type: MojAlertPathDirective, isStandalone: true, selector: "[opalLibMojAlertSortIcon]", inputs: { type: ["opalLibMojAlertSortIcon", "type"] }, usesOnChanges: true, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertPathDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.19", type: MojAlertPathDirective, isStandalone: true, selector: "[opalLibMojAlertSortIcon]", inputs: { type: ["opalLibMojAlertSortIcon", "type"] }, usesOnChanges: true, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertPathDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertPathDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[opalLibMojAlertSortIcon]',
@@ -158,10 +167,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
 class MojAlertIconComponent {
     type = 'information';
     applyColour = false;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojAlertIconComponent, isStandalone: true, selector: "opal-lib-moj-alert-icon", inputs: { type: "type", applyColour: "applyColour" }, ngImport: i0, template: "<svg\n  [opalLibMojAlertSortIcon]=\"type\"\n  [class]=\"'moj-alert__icon' + (applyColour ? ' moj-alert--' + type : '')\"\n  role=\"presentation\"\n  focusable=\"false\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  viewBox=\"0 0 30 30\"\n  height=\"30\"\n  width=\"30\"\n  fill=\"currentColor\"\n></svg>\n", dependencies: [{ kind: "directive", type: MojAlertPathDirective, selector: "[opalLibMojAlertSortIcon]", inputs: ["opalLibMojAlertSortIcon"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojAlertIconComponent, isStandalone: true, selector: "opal-lib-moj-alert-icon", inputs: { type: "type", applyColour: "applyColour" }, ngImport: i0, template: "<svg\n  [opalLibMojAlertSortIcon]=\"type\"\n  [class]=\"'moj-alert__icon' + (applyColour ? ' moj-alert--' + type : '')\"\n  role=\"presentation\"\n  focusable=\"false\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  viewBox=\"0 0 30 30\"\n  height=\"30\"\n  width=\"30\"\n  fill=\"currentColor\"\n></svg>\n", dependencies: [{ kind: "directive", type: MojAlertPathDirective, selector: "[opalLibMojAlertSortIcon]", inputs: ["opalLibMojAlertSortIcon"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertIconComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertIconComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-alert-icon', imports: [MojAlertPathDirective], template: "<svg\n  [opalLibMojAlertSortIcon]=\"type\"\n  [class]=\"'moj-alert__icon' + (applyColour ? ' moj-alert--' + type : '')\"\n  role=\"presentation\"\n  focusable=\"false\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  viewBox=\"0 0 30 30\"\n  height=\"30\"\n  width=\"30\"\n  fill=\"currentColor\"\n></svg>\n" }]
         }], propDecorators: { type: [{
@@ -174,10 +183,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
 class MojAlertHeadingComponent {
     hostClass = 'moj-alert__heading';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertHeadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojAlertHeadingComponent, isStandalone: true, selector: "opal-lib-moj-alert-content-heading", host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertHeadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojAlertHeadingComponent, isStandalone: true, selector: "opal-lib-moj-alert-content-heading", host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertHeadingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertHeadingComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-alert-content-heading', imports: [], template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { hostClass: [{
@@ -187,10 +196,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
 class MojAlertContentComponent {
     hostClass = 'moj-alert__content';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojAlertContentComponent, isStandalone: true, selector: "opal-lib-moj-alert-content", host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojAlertContentComponent, isStandalone: true, selector: "opal-lib-moj-alert-content", host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<ng-content></ng-content>\n" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertContentComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertContentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-alert-content', imports: [], template: "<ng-content></ng-content>\n" }]
         }], propDecorators: { hostClass: [{
@@ -199,10 +208,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
             }] } });
 class MojAlertTextComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojAlertTextComponent, isStandalone: true, selector: "opal-lib-moj-alert-content-text", ngImport: i0, template: "<ng-content></ng-content>\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojAlertTextComponent, isStandalone: true, selector: "opal-lib-moj-alert-content-text", ngImport: i0, template: "<ng-content></ng-content>\n" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojAlertTextComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojAlertTextComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-alert-content-text', imports: [], template: "<ng-content></ng-content>\n" }]
         }] });

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-badge.mjs CHANGED Viewed

@@ -4,10 +4,10 @@ import { Input, ChangeDetectionStrategy, Component } from '@angular/core';
 class MojBadgeComponent {
     badgeId;
     badgeClasses;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojBadgeComponent, isStandalone: true, selector: "opal-lib-moj-badge", inputs: { badgeId: "badgeId", badgeClasses: "badgeClasses" }, ngImport: i0, template: "<span class=\"moj-badge {{ badgeClasses }}\" [id]=\"badgeId\"><ng-content></ng-content> </span>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojBadgeComponent, isStandalone: true, selector: "opal-lib-moj-badge", inputs: { badgeId: "badgeId", badgeClasses: "badgeClasses" }, ngImport: i0, template: "<span class=\"moj-badge {{ badgeClasses }}\" [id]=\"badgeId\"><ng-content></ng-content> </span>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojBadgeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojBadgeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-badge', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"moj-badge {{ badgeClasses }}\" [id]=\"badgeId\"><ng-content></ng-content> </span>\n" }]
         }], propDecorators: { badgeId: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-button-menu-moj-button-menu-item.mjs CHANGED Viewed

@@ -8,10 +8,10 @@ class MojButtonMenuItemComponent {
         event.preventDefault();
         this.actionClick.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojButtonMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojButtonMenuItemComponent, isStandalone: true, selector: "opal-lib-moj-button-menu-item", inputs: { itemText: "itemText" }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: "<li>\n  <a\n    href=\"#\"\n    role=\"link\"\n    draggable=\"false\"\n    class=\"moj-button-menu__item\"\n    data-module=\"govuk-button\"\n    data-secondary=\"true\"\n    data-govuk-button-init=\"\"\n    tabindex=\"-1\"\n    (click)=\"handleClick($event)\"\n  >\n    {{ itemText }}\n  </a>\n</li>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojButtonMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojButtonMenuItemComponent, isStandalone: true, selector: "opal-lib-moj-button-menu-item", inputs: { itemText: "itemText" }, outputs: { actionClick: "actionClick" }, ngImport: i0, template: "<li>\n  <a\n    href=\"#\"\n    role=\"link\"\n    draggable=\"false\"\n    class=\"moj-button-menu__item\"\n    data-module=\"govuk-button\"\n    data-secondary=\"true\"\n    data-govuk-button-init=\"\"\n    tabindex=\"-1\"\n    (click)=\"handleClick($event)\"\n  >\n    {{ itemText }}\n  </a>\n</li>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojButtonMenuItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojButtonMenuItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-button-menu-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li>\n  <a\n    href=\"#\"\n    role=\"link\"\n    draggable=\"false\"\n    class=\"moj-button-menu__item\"\n    data-module=\"govuk-button\"\n    data-secondary=\"true\"\n    data-govuk-button-init=\"\"\n    tabindex=\"-1\"\n    (click)=\"handleClick($event)\"\n  >\n    {{ itemText }}\n  </a>\n</li>\n" }]
         }], propDecorators: { itemText: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-button-menu.mjs CHANGED Viewed

@@ -25,10 +25,10 @@ class MojButtonMenuComponent {
     toggleButtonMenu() {
         this.isExpanded = !this.isExpanded;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojButtonMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojButtonMenuComponent, isStandalone: true, selector: "opal-lib-moj-button-menu", inputs: { menuButtonTitle: "menuButtonTitle", menuId: "menuId" }, host: { properties: { "class": "this.hostClasses", "attr.data-module": "this.dataModule", "attr.data-button-text": "this.dataButtonText", "attr.data-button-classes": "this.dataButtonClasses", "attr.data-moj-button-menu-init": "this.dataMojButtonMenuInit" } }, ngImport: i0, template: "<button\n  class=\"govuk-button moj-button-menu__toggle-button govuk-button--secondary\"\n  type=\"button\"\n  aria-haspopup=\"true\"\n  [attr.aria-controls]=\"menuId\"\n  [attr.aria-expanded]=\"isExpanded\"\n  (click)=\"toggleButtonMenu()\"\n>\n  <span>\n    {{ menuButtonTitle }}\n    <svg width=\"11\" height=\"5\" viewBox=\"0 0 11 5\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M5.5 0L11 5L0 5L5.5 0Z\" fill=\"currentColor\"></path>\n    </svg>\n  </span>\n</button>\n\n<ul [id]=\"menuId\" class=\"moj-button-menu__wrapper\" [hidden]=\"!isExpanded\">\n  <ng-content></ng-content>\n</ul>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojButtonMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojButtonMenuComponent, isStandalone: true, selector: "opal-lib-moj-button-menu", inputs: { menuButtonTitle: "menuButtonTitle", menuId: "menuId" }, host: { properties: { "class": "this.hostClasses", "attr.data-module": "this.dataModule", "attr.data-button-text": "this.dataButtonText", "attr.data-button-classes": "this.dataButtonClasses", "attr.data-moj-button-menu-init": "this.dataMojButtonMenuInit" } }, ngImport: i0, template: "<button\n  class=\"govuk-button moj-button-menu__toggle-button govuk-button--secondary\"\n  type=\"button\"\n  aria-haspopup=\"true\"\n  [attr.aria-controls]=\"menuId\"\n  [attr.aria-expanded]=\"isExpanded\"\n  (click)=\"toggleButtonMenu()\"\n>\n  <span>\n    {{ menuButtonTitle }}\n    <svg width=\"11\" height=\"5\" viewBox=\"0 0 11 5\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M5.5 0L11 5L0 5L5.5 0Z\" fill=\"currentColor\"></path>\n    </svg>\n  </span>\n</button>\n\n<ul [id]=\"menuId\" class=\"moj-button-menu__wrapper\" [hidden]=\"!isExpanded\">\n  <ng-content></ng-content>\n</ul>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojButtonMenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojButtonMenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-button-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n  class=\"govuk-button moj-button-menu__toggle-button govuk-button--secondary\"\n  type=\"button\"\n  aria-haspopup=\"true\"\n  [attr.aria-controls]=\"menuId\"\n  [attr.aria-expanded]=\"isExpanded\"\n  (click)=\"toggleButtonMenu()\"\n>\n  <span>\n    {{ menuButtonTitle }}\n    <svg width=\"11\" height=\"5\" viewBox=\"0 0 11 5\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M5.5 0L11 5L0 5L5.5 0Z\" fill=\"currentColor\"></path>\n    </svg>\n  </span>\n</button>\n\n<ul [id]=\"menuId\" class=\"moj-button-menu__wrapper\" [hidden]=\"!isExpanded\">\n  <ng-content></ng-content>\n</ul>\n" }]
         }], propDecorators: { menuButtonTitle: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-date-picker.mjs CHANGED Viewed

@@ -22,6 +22,8 @@ class MojDatePickerComponent {
     disabledDates;
     disabledDays;
     errors = null;
+    autoComplete = false;
+    autoCompleteValue = null;
     dateChange = new EventEmitter();
     set control(abstractControl) {
         // Form controls are passed in as abstract controls, we need to re-cast it.
@@ -104,12 +106,12 @@ class MojDatePickerComponent {
         this.isDestroyed = true;
         this.nextRenderRef.destroy();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojDatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: MojDatePickerComponent, isStandalone: true, selector: "opal-lib-moj-date-picker", inputs: { labelText: "labelText", labelClasses: "labelClasses", hintText: "hintText", inputId: "inputId", inputName: "inputName", inputClasses: "inputClasses", minDate: "minDate", maxDate: "maxDate", disabledDates: "disabledDates", disabledDays: "disabledDays", errors: "errors", control: "control" }, outputs: { dateChange: "dateChange" }, ngImport: i0, template: "<div\n  class=\"moj-datepicker\"\n  data-module=\"moj-date-picker\"\n  [attr.data-min-date]=\"minDate\"\n  [attr.data-max-date]=\"maxDate\"\n  [attr.data-excluded-dates]=\"disabledDatesConcatenated\"\n  [attr.data-excluded-days]=\"disabledDays\"\n>\n  <div class=\"govuk-form-group\" [class.govuk-form-group--error]=\"!!errors\">\n    <label class=\"govuk-label {{ labelClasses }}\" [for]=\"inputId\"> {{ labelText }} </label>\n\n    @if (hintText) {\n      <div [id]=\"inputId + '-hint'\" class=\"govuk-hint\">{{ hintText }}</div>\n    }\n\n    @if (errors) {\n      <p id=\"{{ inputId }}-error-message\" class=\"govuk-error-message\">\n        <span class=\"govuk-visually-hidden\">Error: </span> {{ errors }}\n      </p>\n    }\n\n    <input\n      class=\"govuk-input moj-js-datepicker-input {{ inputClasses }}\"\n      [id]=\"inputId\"\n      [name]=\"inputName\"\n      type=\"text\"\n      [attr.aria-describedby]=\"describedBy\"\n      autocomplete=\"off\"\n      [formControl]=\"getControl\"\n      (change)=\"setDateValue($any($event).target.value)\"\n    />\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojDatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: MojDatePickerComponent, isStandalone: true, selector: "opal-lib-moj-date-picker", inputs: { labelText: "labelText", labelClasses: "labelClasses", hintText: "hintText", inputId: "inputId", inputName: "inputName", inputClasses: "inputClasses", minDate: "minDate", maxDate: "maxDate", disabledDates: "disabledDates", disabledDays: "disabledDays", errors: "errors", autoComplete: "autoComplete", autoCompleteValue: "autoCompleteValue", control: "control" }, outputs: { dateChange: "dateChange" }, ngImport: i0, template: "<div\n  class=\"moj-datepicker\"\n  data-module=\"moj-date-picker\"\n  [attr.data-min-date]=\"minDate\"\n  [attr.data-max-date]=\"maxDate\"\n  [attr.data-excluded-dates]=\"disabledDatesConcatenated\"\n  [attr.data-excluded-days]=\"disabledDays\"\n>\n  <div class=\"govuk-form-group\" [class.govuk-form-group--error]=\"!!errors\">\n    <label class=\"govuk-label {{ labelClasses }}\" [for]=\"inputId\"> {{ labelText }} </label>\n\n    @if (hintText) {\n      <div [id]=\"inputId + '-hint'\" class=\"govuk-hint\">{{ hintText }}</div>\n    }\n\n    @if (errors) {\n      <p id=\"{{ inputId }}-error-message\" class=\"govuk-error-message\">\n        <span class=\"govuk-visually-hidden\">Error: </span> {{ errors }}\n      </p>\n    }\n\n    <input\n      class=\"govuk-input moj-js-datepicker-input {{ inputClasses }}\"\n      [id]=\"inputId\"\n      [name]=\"inputName\"\n      type=\"text\"\n      [attr.aria-describedby]=\"describedBy\"\n      [attr.autocomplete]=\"autoCompleteValue ? autoCompleteValue : autoComplete ? 'on' : 'off'\"\n      [formControl]=\"getControl\"\n      (change)=\"setDateValue($any($event).target.value)\"\n    />\n  </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojDatePickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojDatePickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'opal-lib-moj-date-picker', imports: [ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"moj-datepicker\"\n  data-module=\"moj-date-picker\"\n  [attr.data-min-date]=\"minDate\"\n  [attr.data-max-date]=\"maxDate\"\n  [attr.data-excluded-dates]=\"disabledDatesConcatenated\"\n  [attr.data-excluded-days]=\"disabledDays\"\n>\n  <div class=\"govuk-form-group\" [class.govuk-form-group--error]=\"!!errors\">\n    <label class=\"govuk-label {{ labelClasses }}\" [for]=\"inputId\"> {{ labelText }} </label>\n\n    @if (hintText) {\n      <div [id]=\"inputId + '-hint'\" class=\"govuk-hint\">{{ hintText }}</div>\n    }\n\n    @if (errors) {\n      <p id=\"{{ inputId }}-error-message\" class=\"govuk-error-message\">\n        <span class=\"govuk-visually-hidden\">Error: </span> {{ errors }}\n      </p>\n    }\n\n    <input\n      class=\"govuk-input moj-js-datepicker-input {{ inputClasses }}\"\n      [id]=\"inputId\"\n      [name]=\"inputName\"\n      type=\"text\"\n      [attr.aria-describedby]=\"describedBy\"\n      autocomplete=\"off\"\n      [formControl]=\"getControl\"\n      (change)=\"setDateValue($any($event).target.value)\"\n    />\n  </div>\n</div>\n" }]
+            args: [{ selector: 'opal-lib-moj-date-picker', imports: [ReactiveFormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"moj-datepicker\"\n  data-module=\"moj-date-picker\"\n  [attr.data-min-date]=\"minDate\"\n  [attr.data-max-date]=\"maxDate\"\n  [attr.data-excluded-dates]=\"disabledDatesConcatenated\"\n  [attr.data-excluded-days]=\"disabledDays\"\n>\n  <div class=\"govuk-form-group\" [class.govuk-form-group--error]=\"!!errors\">\n    <label class=\"govuk-label {{ labelClasses }}\" [for]=\"inputId\"> {{ labelText }} </label>\n\n    @if (hintText) {\n      <div [id]=\"inputId + '-hint'\" class=\"govuk-hint\">{{ hintText }}</div>\n    }\n\n    @if (errors) {\n      <p id=\"{{ inputId }}-error-message\" class=\"govuk-error-message\">\n        <span class=\"govuk-visually-hidden\">Error: </span> {{ errors }}\n      </p>\n    }\n\n    <input\n      class=\"govuk-input moj-js-datepicker-input {{ inputClasses }}\"\n      [id]=\"inputId\"\n      [name]=\"inputName\"\n      type=\"text\"\n      [attr.aria-describedby]=\"describedBy\"\n      [attr.autocomplete]=\"autoCompleteValue ? autoCompleteValue : autoComplete ? 'on' : 'off'\"\n      [formControl]=\"getControl\"\n      (change)=\"setDateValue($any($event).target.value)\"\n    />\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { labelText: [{
                 type: Input,
                 args: [{ required: true }]
@@ -143,6 +145,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImpo
             }], errors: [{
                 type: Input,
                 args: [{ required: false }]
+            }], autoComplete: [{
+                type: Input,
+                args: [{ required: false }]
+            }], autoCompleteValue: [{
+                type: Input,
+                args: [{ required: false }]
             }], dateChange: [{
                 type: Output
             }], control: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-header.mjs CHANGED Viewed

@@ -3,10 +3,10 @@ import { Input, ChangeDetectionStrategy, Component } from '@angular/core';
 class MojFilterPanelHeaderComponent {
     title = 'Filter';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojFilterPanelHeaderComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-header", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"moj-filter__header\">\n  <div class=\"moj-filter__header-title\">\n    <h2 class=\"govuk-heading-m\">{{ title }}</h2>\n  </div>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojFilterPanelHeaderComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-header", inputs: { title: "title" }, ngImport: i0, template: "<div class=\"moj-filter__header\">\n  <div class=\"moj-filter__header-title\">\n    <h2 class=\"govuk-heading-m\">{{ title }}</h2>\n  </div>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter-panel-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"moj-filter__header\">\n  <div class=\"moj-filter__header-title\">\n    <h2 class=\"govuk-heading-m\">{{ title }}</h2>\n  </div>\n</div>\n" }]
         }], propDecorators: { title: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-option-moj-filter-panel-option-form-group-item.mjs CHANGED Viewed

@@ -20,10 +20,10 @@ class MojFilterPanelOptionFormGroupItemComponent {
         const updatedItem = { ...item, selected: input.checked };
         this.changed.emit({ categoryName: this.options.categoryName, item: updatedItem });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelOptionFormGroupItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: MojFilterPanelOptionFormGroupItemComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-options-form-group-item, [opal-lib-moj-filter-panel-options-form-group-item]", inputs: { options: "options" }, outputs: { changed: "changed" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<fieldset class=\"govuk-fieldset\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">{{ options.categoryName }}</legend>\n  <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n    @for (item of options.options; track item.value + '-' + options.categoryName) {\n      <div class=\"govuk-checkboxes__item\">\n        <input\n          class=\"govuk-checkboxes__input\"\n          id=\"{{ item.value }}\"\n          name=\"{{ item.value }}\"\n          type=\"checkbox\"\n          [value]=\"item.value\"\n          [checked]=\"item.selected\"\n          (change)=\"onCheckboxChange($event, item)\"\n        />\n        <label class=\"govuk-label govuk-checkboxes__label\" for=\"{{ item.value }}\">\n          {{ item.count !== null && item.count !== undefined ? item.label + ' (' + item.count + ')' : item.label }}\n        </label>\n      </div>\n    }\n  </div>\n</fieldset>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelOptionFormGroupItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: MojFilterPanelOptionFormGroupItemComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-options-form-group-item, [opal-lib-moj-filter-panel-options-form-group-item]", inputs: { options: "options" }, outputs: { changed: "changed" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0, template: "<fieldset class=\"govuk-fieldset\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">{{ options.categoryName }}</legend>\n  <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n    @for (item of options.options; track item.value + '-' + options.categoryName) {\n      <div class=\"govuk-checkboxes__item\">\n        <input\n          class=\"govuk-checkboxes__input\"\n          id=\"{{ item.value }}\"\n          name=\"{{ item.value }}\"\n          type=\"checkbox\"\n          [value]=\"item.value\"\n          [checked]=\"item.selected\"\n          (change)=\"onCheckboxChange($event, item)\"\n        />\n        <label class=\"govuk-label govuk-checkboxes__label\" for=\"{{ item.value }}\">\n          {{ item.count !== null && item.count !== undefined ? item.label + ' (' + item.count + ')' : item.label }}\n        </label>\n      </div>\n    }\n  </div>\n</fieldset>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelOptionFormGroupItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelOptionFormGroupItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter-panel-options-form-group-item, [opal-lib-moj-filter-panel-options-form-group-item]', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, template: "<fieldset class=\"govuk-fieldset\">\n  <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--m\">{{ options.categoryName }}</legend>\n  <div class=\"govuk-checkboxes govuk-checkboxes--small\" data-module=\"govuk-checkboxes\">\n    @for (item of options.options; track item.value + '-' + options.categoryName) {\n      <div class=\"govuk-checkboxes__item\">\n        <input\n          class=\"govuk-checkboxes__input\"\n          id=\"{{ item.value }}\"\n          name=\"{{ item.value }}\"\n          type=\"checkbox\"\n          [value]=\"item.value\"\n          [checked]=\"item.selected\"\n          (change)=\"onCheckboxChange($event, item)\"\n        />\n        <label class=\"govuk-label govuk-checkboxes__label\" for=\"{{ item.value }}\">\n          {{ item.count !== null && item.count !== undefined ? item.label + ' (' + item.count + ')' : item.label }}\n        </label>\n      </div>\n    }\n  </div>\n</fieldset>\n" }]
         }], propDecorators: { hostClass: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-option-moj-filter-panel-option-form-group-keyword.mjs CHANGED Viewed

@@ -21,10 +21,10 @@ class MojFilterPanelOptionFormGroupKeywordComponent {
         }
         this.keywordChange.emit(keyword);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelOptionFormGroupKeywordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojFilterPanelOptionFormGroupKeywordComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-option-form-group-keyword", inputs: { inputId: "inputId", inputName: "inputName", labelValue: "labelValue" }, outputs: { keywordChange: "keywordChange" }, ngImport: i0, template: "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-label--m\" [for]=\"inputId\"> {{ labelValue }} </label>\n  <input class=\"govuk-input\" [id]=\"inputId\" [name]=\"inputName\" type=\"text\" (input)=\"onKeywordChange($event)\" />\n</div>\n<ng-content select=\"[mojFilterPanelItems]\"></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelOptionFormGroupKeywordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojFilterPanelOptionFormGroupKeywordComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-option-form-group-keyword", inputs: { inputId: "inputId", inputName: "inputName", labelValue: "labelValue" }, outputs: { keywordChange: "keywordChange" }, ngImport: i0, template: "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-label--m\" [for]=\"inputId\"> {{ labelValue }} </label>\n  <input class=\"govuk-input\" [id]=\"inputId\" [name]=\"inputName\" type=\"text\" (input)=\"onKeywordChange($event)\" />\n</div>\n<ng-content select=\"[mojFilterPanelItems]\"></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelOptionFormGroupKeywordComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelOptionFormGroupKeywordComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter-panel-option-form-group-keyword', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label govuk-label--m\" [for]=\"inputId\"> {{ labelValue }} </label>\n  <input class=\"govuk-input\" [id]=\"inputId\" [name]=\"inputName\" type=\"text\" (input)=\"onKeywordChange($event)\" />\n</div>\n<ng-content select=\"[mojFilterPanelItems]\"></ng-content>\n" }]
         }], propDecorators: { inputId: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-option.mjs CHANGED Viewed

@@ -13,10 +13,10 @@ class MojFilterPanelOptionComponent {
     onApplyFilters() {
         this.applyFilters.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojFilterPanelOptionComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-option", inputs: { buttonText: "buttonText" }, outputs: { applyFilters: "applyFilters" }, ngImport: i0, template: "<div class=\"moj-filter__options\">\n  <button\n    type=\"button\"\n    class=\"govuk-button\"\n    data-module=\"govuk-button\"\n    data-test-id=\"submit-button\"\n    (click)=\"onApplyFilters()\"\n  >\n    {{ buttonText }}\n  </button>\n  <ng-content select=\"[mojFilterPanelKeyword]\"></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojFilterPanelOptionComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-option", inputs: { buttonText: "buttonText" }, outputs: { applyFilters: "applyFilters" }, ngImport: i0, template: "<div class=\"moj-filter__options\">\n  <button\n    type=\"button\"\n    class=\"govuk-button\"\n    data-module=\"govuk-button\"\n    data-test-id=\"submit-button\"\n    (click)=\"onApplyFilters()\"\n  >\n    {{ buttonText }}\n  </button>\n  <ng-content select=\"[mojFilterPanelKeyword]\"></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelOptionComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelOptionComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter-panel-option', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"moj-filter__options\">\n  <button\n    type=\"button\"\n    class=\"govuk-button\"\n    data-module=\"govuk-button\"\n    data-test-id=\"submit-button\"\n    (click)=\"onApplyFilters()\"\n  >\n    {{ buttonText }}\n  </button>\n  <ng-content select=\"[mojFilterPanelKeyword]\"></ng-content>\n</div>\n" }]
         }], propDecorators: { buttonText: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-selected-moj-filter-panel-selected-tag.mjs CHANGED Viewed

@@ -18,10 +18,10 @@ class MojFilterPanelSelectedTagComponent {
         }
         this.removeTagClicked.emit({ categoryName, optionValue });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelSelectedTagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.18", type: MojFilterPanelSelectedTagComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-selected-tag", inputs: { filterData: "filterData", ariaLabelPrefix: "ariaLabelPrefix" }, outputs: { removeTagClicked: "removeTagClicked" }, ngImport: i0, template: "@for (data of filterData; track data.categoryName) {\n  <h3 class=\"govuk-heading-s govuk-!-margin-bottom-0\">{{ data.categoryName }}</h3>\n  <ul class=\"moj-filter-tags\">\n    @for (tag of data.options; track tag.value) {\n      <li>\n        <a class=\"moj-filter__tag\" href=\"#\" (click)=\"removeTag(data.categoryName, tag.value, $event)\">\n          <span class=\"govuk-visually-hidden\">{{ ariaLabelPrefix }}</span> {{ tag.label }}\n        </a>\n      </li>\n    }\n  </ul>\n}\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelSelectedTagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: MojFilterPanelSelectedTagComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-selected-tag", inputs: { filterData: "filterData", ariaLabelPrefix: "ariaLabelPrefix" }, outputs: { removeTagClicked: "removeTagClicked" }, ngImport: i0, template: "@for (data of filterData; track data.categoryName) {\n  <h3 class=\"govuk-heading-s govuk-!-margin-bottom-0\">{{ data.categoryName }}</h3>\n  <ul class=\"moj-filter-tags\">\n    @for (tag of data.options; track tag.value) {\n      <li>\n        <a class=\"moj-filter__tag\" href=\"#\" (click)=\"removeTag(data.categoryName, tag.value, $event)\">\n          <span class=\"govuk-visually-hidden\">{{ ariaLabelPrefix }}</span> {{ tag.label }}\n        </a>\n      </li>\n    }\n  </ul>\n}\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelSelectedTagComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelSelectedTagComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter-panel-selected-tag', changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (data of filterData; track data.categoryName) {\n  <h3 class=\"govuk-heading-s govuk-!-margin-bottom-0\">{{ data.categoryName }}</h3>\n  <ul class=\"moj-filter-tags\">\n    @for (tag of data.options; track tag.value) {\n      <li>\n        <a class=\"moj-filter__tag\" href=\"#\" (click)=\"removeTag(data.categoryName, tag.value, $event)\">\n          <span class=\"govuk-visually-hidden\">{{ ariaLabelPrefix }}</span> {{ tag.label }}\n        </a>\n      </li>\n    }\n  </ul>\n}\n" }]
         }], propDecorators: { filterData: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-selected.mjs CHANGED Viewed

@@ -19,10 +19,10 @@ class MojFilterPanelSelectedComponent {
         }
         this.clearFilters.emit();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelSelectedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojFilterPanelSelectedComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-selected", inputs: { headingLabel: "headingLabel", linkLabel: "linkLabel" }, outputs: { clearFilters: "clearFilters" }, ngImport: i0, template: "<div class=\"moj-filter__content\">\n  <div class=\"moj-filter__selected\">\n    <div class=\"moj-filter__selected-heading\">\n      <div class=\"moj-filter__heading-title\">\n        <h2 class=\"govuk-heading-m\">{{ headingLabel }}</h2>\n      </div>\n      <div class=\"moj-filter__heading-action\">\n        <a class=\"govuk-link govuk-link--no-visited-state\" href=\"#\" (click)=\"clearTag($event)\">{{ linkLabel }}</a>\n      </div>\n    </div>\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".moj-filter__selected-heading{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1rem}.moj-filter__heading-title,.moj-filter__heading-action{margin:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelSelectedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojFilterPanelSelectedComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel-selected", inputs: { headingLabel: "headingLabel", linkLabel: "linkLabel" }, outputs: { clearFilters: "clearFilters" }, ngImport: i0, template: "<div class=\"moj-filter__content\">\n  <div class=\"moj-filter__selected\">\n    <div class=\"moj-filter__selected-heading\">\n      <div class=\"moj-filter__heading-title\">\n        <h2 class=\"govuk-heading-m\">{{ headingLabel }}</h2>\n      </div>\n      <div class=\"moj-filter__heading-action\">\n        <a class=\"govuk-link govuk-link--no-visited-state\" href=\"#\" (click)=\"clearTag($event)\">{{ linkLabel }}</a>\n      </div>\n    </div>\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".moj-filter__selected-heading{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1rem}.moj-filter__heading-title,.moj-filter__heading-action{margin:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelSelectedComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelSelectedComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter-panel-selected', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"moj-filter__content\">\n  <div class=\"moj-filter__selected\">\n    <div class=\"moj-filter__selected-heading\">\n      <div class=\"moj-filter__heading-title\">\n        <h2 class=\"govuk-heading-m\">{{ headingLabel }}</h2>\n      </div>\n      <div class=\"moj-filter__heading-action\">\n        <a class=\"govuk-link govuk-link--no-visited-state\" href=\"#\" (click)=\"clearTag($event)\">{{ linkLabel }}</a>\n      </div>\n    </div>\n    <ng-content></ng-content>\n  </div>\n</div>\n", styles: [".moj-filter__selected-heading{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:1rem}.moj-filter__heading-title,.moj-filter__heading-action{margin:0}\n"] }]
         }], propDecorators: { headingLabel: [{

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel.mjs CHANGED Viewed

@@ -2,10 +2,10 @@ import * as i0 from '@angular/core';
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 class MojFilterPanelComponent {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojFilterPanelComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel", ngImport: i0, template: "<div class=\"moj-filter\" data-module=\"moj-filter\">\n  <ng-content select=\"[mojFilterPanelHeader]\"></ng-content>\n  <ng-content select=\"[mojFilterPanelSelected]\"></ng-content>\n  <ng-content select=\"[mojFilterPanelOption]\"></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojFilterPanelComponent, isStandalone: true, selector: "opal-lib-moj-filter-panel", ngImport: i0, template: "<div class=\"moj-filter\" data-module=\"moj-filter\">\n  <ng-content select=\"[mojFilterPanelHeader]\"></ng-content>\n  <ng-content select=\"[mojFilterPanelSelected]\"></ng-content>\n  <ng-content select=\"[mojFilterPanelOption]\"></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter-panel', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"moj-filter\" data-module=\"moj-filter\">\n  <ng-content select=\"[mojFilterPanelHeader]\"></ng-content>\n  <ng-content select=\"[mojFilterPanelSelected]\"></ng-content>\n  <ng-content select=\"[mojFilterPanelOption]\"></ng-content>\n</div>\n" }]
         }] });

package/fesm2022/hmcts-opal-frontend-common-components-moj-moj-filter.mjs CHANGED Viewed

@@ -14,10 +14,10 @@ class MojFilterComponent {
     toggleFilter() {
         this.showFilter = !this.showFilter;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.18", type: MojFilterComponent, isStandalone: true, selector: "opal-lib-moj-filter", inputs: { showFilter: "showFilter", filterId: "filterId" }, ngImport: i0, template: "<div class=\"moj-filter-layout\">\n  <div class=\"moj-filter-layout__filter\" [id]=\"filterId\" [hidden]=\"!showFilter\">\n    <ng-content select=\"[mojFilterPanel]\"></ng-content>\n  </div>\n  <div class=\"moj-filter-layout__content\">\n    <button\n      type=\"button\"\n      class=\"govuk-button govuk-button--secondary moj-filter-layout__toggle-button\"\n      [attr.aria-controls]=\"filterId\"\n      [attr.aria-expanded]=\"showFilter\"\n      (click)=\"toggleFilter()\"\n    >\n      {{ showFilter ? 'Hide filter' : 'Show filter' }}\n    </button>\n\n    <ng-content select=\"[mojFilterContent]\"></ng-content>\n  </div>\n</div>\n" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: MojFilterComponent, isStandalone: true, selector: "opal-lib-moj-filter", inputs: { showFilter: "showFilter", filterId: "filterId" }, ngImport: i0, template: "<div class=\"moj-filter-layout\">\n  <div class=\"moj-filter-layout__filter\" [id]=\"filterId\" [hidden]=\"!showFilter\">\n    <ng-content select=\"[mojFilterPanel]\"></ng-content>\n  </div>\n  <div class=\"moj-filter-layout__content\">\n    <button\n      type=\"button\"\n      class=\"govuk-button govuk-button--secondary moj-filter-layout__toggle-button\"\n      [attr.aria-controls]=\"filterId\"\n      [attr.aria-expanded]=\"showFilter\"\n      (click)=\"toggleFilter()\"\n    >\n      {{ showFilter ? 'Hide filter' : 'Show filter' }}\n    </button>\n\n    <ng-content select=\"[mojFilterContent]\"></ng-content>\n  </div>\n</div>\n" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.18", ngImport: i0, type: MojFilterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: MojFilterComponent, decorators: [{
             type: Component,
             args: [{ selector: 'opal-lib-moj-filter', standalone: true, template: "<div class=\"moj-filter-layout\">\n  <div class=\"moj-filter-layout__filter\" [id]=\"filterId\" [hidden]=\"!showFilter\">\n    <ng-content select=\"[mojFilterPanel]\"></ng-content>\n  </div>\n  <div class=\"moj-filter-layout__content\">\n    <button\n      type=\"button\"\n      class=\"govuk-button govuk-button--secondary moj-filter-layout__toggle-button\"\n      [attr.aria-controls]=\"filterId\"\n      [attr.aria-expanded]=\"showFilter\"\n      (click)=\"toggleFilter()\"\n    >\n      {{ showFilter ? 'Hide filter' : 'Show filter' }}\n    </button>\n\n    <ng-content select=\"[mojFilterContent]\"></ng-content>\n  </div>\n</div>\n" }]
         }], propDecorators: { showFilter: [{