@hmcts/opal-frontend-common 0.0.109 → 0.0.111

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

@@ -1,166 +1,217 @@
-import * as i0 from '@angular/core';
-import { inject, EventEmitter, afterNextRender, Input, Output, ChangeDetectionStrategy, Component } from '@angular/core';
-import * as i1 from '@angular/forms';
-import { ReactiveFormsModule } from '@angular/forms';
-import { DateService } from '@hmcts/opal-frontend-common/services/date-service';
-import { addGdsBodyClass } from '@hmcts/opal-frontend-common/components/govuk/helpers';
-
-class MojDatePickerComponent {
-    dateService = inject(DateService);
-    _control;
-    nextRenderRef;
-    isDestroyed = false;
-    disabledDatesConcatenated;
-    labelText;
-    labelClasses;
-    hintText;
-    inputId;
-    inputName;
-    inputClasses;
-    minDate;
-    maxDate;
-    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.
-        this._control = abstractControl;
-    }
-    get getControl() {
-        return this._control;
-    }
-    get describedBy() {
-        const ids = [];
-        if (this.hintText) {
-            ids.push(`${this.inputId}-hint`);
-        }
-        if (this.errors) {
-            ids.push(`${this.inputId}-error-message`);
-        }
-        return ids.length ? ids.join(' ') : null;
-    }
-    constructor() {
-        this.nextRenderRef = afterNextRender(() => {
-            this.handleAfterNextRender();
-        });
-    }
-    /**
-     * Runs the post-render date picker setup unless the component has already been destroyed.
-     */
-    handleAfterNextRender() {
-        if (this.isDestroyed)
-            return;
-        // Only trigger the render of the component in the browser
-        this.configureDatePicker();
-    }
-    /**
-     * Retrieves the disabled dates and concatenates them into a single string.
-     */
-    concatenateDisabledDates() {
-        this.disabledDatesConcatenated = this.disabledDates ? this.disabledDates.join(' ') : '';
-    }
-    /**
-     * Dynamically imports the Ministry of Justice frontend date picker module.
-     *
-     * @returns A promise that resolves to the imported module containing all MOJ components.
-     * @private
-     */
-    loadDatePickerModule() {
-        return import('@ministryofjustice/frontend/moj/all.mjs');
-    }
-    /**
-     * Sets the date value and emits the updated value through the `dateChange` event.
-     *
-     * @param value - The new date value to set.
-     */
-    setDateValue(value) {
-        const parsedDate = this.dateService.getFromFormat(value, 'd/M/yyyy');
-        if (parsedDate.isValid) {
-            const formattedDate = parsedDate.toFormat('dd/MM/yyyy'); // Formats with leading zeros
-            this.dateChange.emit(formattedDate);
-        }
-        else {
-            this.dateChange.emit(value);
-        }
-    }
-    /**
-     * Configures the date picker functionality using the moj library.
-     */
-    configureDatePicker() {
-        if (this.isDestroyed)
-            return;
-        this.loadDatePickerModule().then((datePicker) => {
-            if (this.isDestroyed)
-                return;
-            addGdsBodyClass();
-            datePicker.initAll();
-        });
-    }
-    ngOnInit() {
-        this.concatenateDisabledDates();
-    }
-    ngOnDestroy() {
-        this.isDestroyed = true;
-        this.nextRenderRef.destroy();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: MojDatePickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.23", 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.23", 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      [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 }]
-            }], labelClasses: [{
-                type: Input,
-                args: [{ required: false }]
-            }], hintText: [{
-                type: Input,
-                args: [{ required: false }]
-            }], inputId: [{
-                type: Input,
-                args: [{ required: true }]
-            }], inputName: [{
-                type: Input,
-                args: [{ required: true }]
-            }], inputClasses: [{
-                type: Input,
-                args: [{ required: false }]
-            }], minDate: [{
-                type: Input,
-                args: [{ required: false }]
-            }], maxDate: [{
-                type: Input,
-                args: [{ required: false }]
-            }], disabledDates: [{
-                type: Input,
-                args: [{ required: false }]
-            }], disabledDays: [{
-                type: Input,
-                args: [{ required: false }]
-            }], errors: [{
-                type: Input,
-                args: [{ required: false }]
-            }], autoComplete: [{
-                type: Input,
-                args: [{ required: false }]
-            }], autoCompleteValue: [{
-                type: Input,
-                args: [{ required: false }]
-            }], dateChange: [{
-                type: Output
-            }], control: [{
-                type: Input,
-                args: [{ required: true }]
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, afterNextRender, inject } from "@angular/core";
+import * as i1 from "@angular/forms";
+import { ReactiveFormsModule } from "@angular/forms";
+import { DateService } from "@hmcts/opal-frontend-common/services/date-service";
+import { addGdsBodyClass } from "@hmcts/opal-frontend-common/components/govuk/helpers";
+var MojDatePickerComponent = class MojDatePickerComponent {
+	dateService = inject(DateService);
+	_control;
+	nextRenderRef;
+	isDestroyed = false;
+	disabledDatesConcatenated;
+	labelText;
+	labelClasses;
+	hintText;
+	inputId;
+	inputName;
+	inputClasses;
+	minDate;
+	maxDate;
+	disabledDates;
+	disabledDays;
+	errors = null;
+	autoComplete = false;
+	autoCompleteValue = null;
+	dateChange = new EventEmitter();
+	set control(abstractControl) {
+		this._control = abstractControl;
+	}
+	get getControl() {
+		return this._control;
+	}
+	get describedBy() {
+		const ids = [];
+		if (this.hintText) ids.push(`${this.inputId}-hint`);
+		if (this.errors) ids.push(`${this.inputId}-error-message`);
+		return ids.length ? ids.join(" ") : null;
+	}
+	constructor() {
+		this.nextRenderRef = afterNextRender(() => {
+			this.handleAfterNextRender();
+		});
+	}
+	handleAfterNextRender() {
+		if (this.isDestroyed) return;
+		this.configureDatePicker();
+	}
+	concatenateDisabledDates() {
+		this.disabledDatesConcatenated = this.disabledDates ? this.disabledDates.join(" ") : "";
+	}
+	loadDatePickerModule() {
+		return import("@ministryofjustice/frontend/moj/all.mjs");
+	}
+	setDateValue(value) {
+		const parsedDate = this.dateService.getFromFormat(value, "d/M/yyyy");
+		if (parsedDate.isValid) {
+			const formattedDate = parsedDate.toFormat("dd/MM/yyyy");
+			this.dateChange.emit(formattedDate);
+		} else this.dateChange.emit(value);
+	}
+	configureDatePicker() {
+		if (this.isDestroyed) return;
+		this.loadDatePickerModule().then((datePicker) => {
+			if (this.isDestroyed) return;
+			addGdsBodyClass();
+			datePicker.initAll();
+		});
+	}
+	ngOnInit() {
+		this.concatenateDisabledDates();
+	}
+	ngOnDestroy() {
+		this.isDestroyed = true;
+		this.nextRenderRef.destroy();
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "21.2.25",
+		ngImport: i0,
+		type: MojDatePickerComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "21.2.25",
+		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.25",
+	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      [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 }]
+		}],
+		labelClasses: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		hintText: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		inputId: [{
+			type: Input,
+			args: [{ required: true }]
+		}],
+		inputName: [{
+			type: Input,
+			args: [{ required: true }]
+		}],
+		inputClasses: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		minDate: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		maxDate: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		disabledDates: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		disabledDays: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		errors: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		autoComplete: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		autoCompleteValue: [{
+			type: Input,
+			args: [{ required: false }]
+		}],
+		dateChange: [{ type: Output }],
+		control: [{
+			type: Input,
+			args: [{ required: true }]
+		}]
+	}
+});
 export { MojDatePickerComponent };
-//# sourceMappingURL=hmcts-opal-frontend-common-components-moj-moj-date-picker.mjs.map
+
+//# sourceMappingURL=hmcts-opal-frontend-common-components-moj-moj-date-picker.mjs.map

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

@@ -1,22 +1,45 @@
-import * as i0 from '@angular/core';
-import { Input, ChangeDetectionStrategy, Component } from '@angular/core';
-
-class MojFilterPanelHeaderComponent {
-    title = 'Filter';
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: MojFilterPanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.23", 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.23", 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: [{
-                type: Input,
-                args: [{ required: false }]
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
+var MojFilterPanelHeaderComponent = class MojFilterPanelHeaderComponent {
+	title = "Filter";
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "21.2.25",
+		ngImport: i0,
+		type: MojFilterPanelHeaderComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "14.0.0",
+		version: "21.2.25",
+		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.25",
+	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: [{
+		type: Input,
+		args: [{ required: false }]
+	}] }
+});
 export { MojFilterPanelHeaderComponent };
-//# sourceMappingURL=hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-header.mjs.map
+
+//# sourceMappingURL=hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-header.mjs.map

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

@@ -1,43 +1,65 @@
-import * as i0 from '@angular/core';
-import { EventEmitter, Output, Input, HostBinding, ChangeDetectionStrategy, Component } from '@angular/core';
-
-class MojFilterPanelOptionFormGroupItemComponent {
-    hostClass = 'govuk-form-group';
-    options;
-    changed = new EventEmitter();
-    /**
-     * Handles a change in the checkbox state.
-     *
-     * This method updates the selected property of the given filter option based on the
-     * current state of the checkbox element derived from the event. It then emits the
-     * changed filter option to notify listeners of the update.
-     *
-     * @param event - The event object triggered by the checkbox change.
-     * @param item - The filter option item whose selected state needs to be updated.
-     */
-    onCheckboxChange(event, item) {
-        const input = event.target;
-        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.23", ngImport: i0, type: MojFilterPanelOptionFormGroupItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.23", 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.23", 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: [{
-                type: HostBinding,
-                args: ['class']
-            }], options: [{
-                type: Input
-            }], changed: [{
-                type: Output
-            }] } });
-
-/**
- * Generated bundle index. Do not edit.
- */
-
+import * as i0 from "@angular/core";
+import { ChangeDetectionStrategy, Component, EventEmitter, HostBinding, Input, Output } from "@angular/core";
+var MojFilterPanelOptionFormGroupItemComponent = class MojFilterPanelOptionFormGroupItemComponent {
+	hostClass = "govuk-form-group";
+	options;
+	changed = new EventEmitter();
+	onCheckboxChange(event, item) {
+		const input = event.target;
+		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.25",
+		ngImport: i0,
+		type: MojFilterPanelOptionFormGroupItemComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "21.2.25",
+		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.25",
+	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: [{
+			type: HostBinding,
+			args: ["class"]
+		}],
+		options: [{ type: Input }],
+		changed: [{ type: Output }]
+	}
+});
 export { MojFilterPanelOptionFormGroupItemComponent };
-//# sourceMappingURL=hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-option-moj-filter-panel-option-form-group-item.mjs.map
+
+//# sourceMappingURL=hmcts-opal-frontend-common-components-moj-moj-filter-moj-filter-panel-moj-filter-panel-option-moj-filter-panel-option-form-group-item.mjs.map