@hmcts/rpx-xui-common-lib 1.7.47-cancel-callback-xui-filter → 1.7.47-clear-stream-data-v2

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.
@@ -741,6 +741,12 @@
741
741
  function (id) {
742
742
  sessionStorage.removeItem(id);
743
743
  localStorage.removeItem(id);
744
+ if (this.filterSettings[id] !== undefined) {
745
+ this.filterSettings[id] = null;
746
+ }
747
+ if (this.streams[id] !== undefined) {
748
+ this.streams[id].next(null);
749
+ }
744
750
  };
745
751
  /**
746
752
  * @private
@@ -953,6 +959,7 @@
953
959
  this.formSub = this.form.valueChanges.subscribe(( /**
954
960
  * @return {?}
955
961
  */function () { return _this.submitted = false; }));
962
+ this.filterSkillsByServices(null, this.config);
956
963
  };
957
964
  /**
958
965
  * @return {?}
@@ -1132,6 +1139,11 @@
1132
1139
  * @return {?}
1133
1140
  */
1134
1141
  function (field) {
1142
+ if (field.name === 'user-services') {
1143
+ /** @type {?} */
1144
+ var selectedServices = this.getSelectedValuesForFields(this.form.controls, field);
1145
+ this.filterSkillsByServices(selectedServices, this.config);
1146
+ }
1135
1147
  if (field.radioSelectionChange && typeof field.radioSelectionChange === 'string') {
1136
1148
  var _a = __read(field.enableCondition.split('='), 2), name_3 = _a[0], value = _a[1];
1137
1149
  this.form.get(name_3).patchValue(value);
@@ -1698,10 +1710,129 @@
1698
1710
  this.filterService.givenErrors.next(errors);
1699
1711
  }
1700
1712
  };
1713
+ /**
1714
+ * @param {?} services
1715
+ * @param {?} config
1716
+ * @return {?}
1717
+ */
1718
+ GenericFilterComponent.prototype.filterSkillsByServices = /**
1719
+ * @param {?} services
1720
+ * @param {?} config
1721
+ * @return {?}
1722
+ */
1723
+ function (services, config) {
1724
+ var _this = this;
1725
+ this.filteredSkillsByServices = [];
1726
+ /** @type {?} */
1727
+ var userSkillsField = config.fields.find(( /**
1728
+ * @param {?} f
1729
+ * @return {?}
1730
+ */function (f) { return f.name === 'user-skills'; }));
1731
+ if (userSkillsField) {
1732
+ /** @type {?} */
1733
+ var userSkills_1 = userSkillsField.groupOptions;
1734
+ if (!services || services.length === 0) {
1735
+ this.filteredSkillsByServices = userSkills_1;
1736
+ }
1737
+ else {
1738
+ services.forEach(( /**
1739
+ * @param {?} s
1740
+ * @return {?}
1741
+ */function (s) {
1742
+ /** @type {?} */
1743
+ var groupOption = userSkills_1.find(( /**
1744
+ * @param {?} u
1745
+ * @return {?}
1746
+ */function (u) { return u.group === s; }));
1747
+ if (groupOption) {
1748
+ _this.filteredSkillsByServices.push(groupOption);
1749
+ }
1750
+ }));
1751
+ }
1752
+ }
1753
+ this.filteredSkillsByServices = this.sortGroupOptions(this.filteredSkillsByServices);
1754
+ return this.filteredSkillsByServices;
1755
+ };
1756
+ /**
1757
+ * @private
1758
+ * @param {?} formValues
1759
+ * @param {?} field
1760
+ * @return {?}
1761
+ */
1762
+ GenericFilterComponent.prototype.getSelectedValuesForFields = /**
1763
+ * @private
1764
+ * @param {?} formValues
1765
+ * @param {?} field
1766
+ * @return {?}
1767
+ */
1768
+ function (formValues, field) {
1769
+ /** @type {?} */
1770
+ var selectedValues = [];
1771
+ Object.keys(formValues).map(( /**
1772
+ * @param {?} name
1773
+ * @return {?}
1774
+ */function (name) {
1775
+ /** @type {?} */
1776
+ var values = formValues[name].value;
1777
+ if (name === field.name) {
1778
+ values.forEach(( /**
1779
+ * @param {?} v
1780
+ * @return {?}
1781
+ */function (v) {
1782
+ selectedValues.push(v.key);
1783
+ }));
1784
+ }
1785
+ }));
1786
+ return selectedValues;
1787
+ };
1788
+ /**
1789
+ * @private
1790
+ * @param {?} groupOptions
1791
+ * @return {?}
1792
+ */
1793
+ GenericFilterComponent.prototype.sortGroupOptions = /**
1794
+ * @private
1795
+ * @param {?} groupOptions
1796
+ * @return {?}
1797
+ */
1798
+ function (groupOptions) {
1799
+ /** @type {?} */
1800
+ var sortedResults = [];
1801
+ /** @type {?} */
1802
+ var groups = groupOptions.map(( /**
1803
+ * @param {?} go
1804
+ * @return {?}
1805
+ */function (go) { return go.group; }));
1806
+ groups.sort().forEach(( /**
1807
+ * @param {?} g
1808
+ * @return {?}
1809
+ */function (g) {
1810
+ /** @type {?} */
1811
+ var options = groupOptions.find(( /**
1812
+ * @param {?} go
1813
+ * @return {?}
1814
+ */function (go) { return go.group === g; })).options;
1815
+ /** @type {?} */
1816
+ var sortedOptions = options.sort(( /**
1817
+ * @param {?} a
1818
+ * @param {?} b
1819
+ * @return {?}
1820
+ */function (a, b) {
1821
+ return a.label.toLowerCase() > b.label.toLowerCase() ? 1 : (b.label.toLowerCase() > a.label.toLowerCase() ? -1 : 0);
1822
+ }));
1823
+ /** @type {?} */
1824
+ var result = {
1825
+ group: g,
1826
+ options: sortedOptions
1827
+ };
1828
+ sortedResults.push(result);
1829
+ }));
1830
+ return sortedResults;
1831
+ };
1701
1832
  GenericFilterComponent.decorators = [
1702
1833
  { type: i0.Component, args: [{
1703
1834
  selector: 'xuilib-generic-filter',
1704
- template: "<form [formGroup]=\"form\" (ngSubmit)=\"applyFilter(form)\">\n <div class=\"contain-classes\" *ngFor=\"let field of config.fields\">\n <hr *ngIf=\"field.lineBreakBefore\" class=\"govuk-section-break elevated-break\">\n <ng-container [ngSwitch]=\"field.type\">\n <ng-container *ngSwitchCase=\"'group-title'\">\n <div [class]=\"field.titleClasses ? field.titleClasses: 'govuk-label govuk-label--m govuk-!-margin-bottom-4'\">\n {{ field.name | capitalize }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <div class=\"govuk-form-group xui-generic-filter\"\n [hidden]=\"hidden(field, form)\"\n [id]=\"field.name\"\n [ngClass]=\"{'form-group-error': submitted && ((form.get(field.name).errors?.minlength || form.get(field.name).errors?.required) || form.get(field.name).errors?.maxLength || form.get(field.name).errors?.email)}\">\n\n <div *ngIf=\"field.title\" class=\"xui-generic-filter__field-title\">\n <h3 [class]=\"field.titleClasses ? field.titleClasses : 'govuk-heading-s'\" style=\"margin-bottom: 0!important\">\n {{field.title | capitalize}}\n </h3>\n\n <div *ngIf=\"field?.minSelected === 0\" class=\"govuk-!-margin-left-2\">(optional)</div>\n </div>\n\n <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n *ngIf=\"field.displayMinSelectedError && submitted && (form.get(field.name).errors?.minlength || form.get(field.name).errors?.required)\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n </span>\n\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n </span>\n\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n *ngIf=\"field.emailError && submitted && form.get(field.name).errors?.email\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.emailError}}\n </span>\n\n <div class=\"govuk-body\" [class.govuk-body--maxWidth480px]=\"field.maxWidth480px\" [ngSwitch]=\"field.type\">\n <ng-container *ngSwitchCase=\"'select'\">\n <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n <option class=\"govuk-radios__item\" *ngFor=\"let item of field.options\" [value]=\"item.key\">{{item.label}}</option>\n </select>\n </ng-container>\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n [attr.disabled]=\"disabled(field, form)\"\n [formControlName]=\"i\"\n (change)=\"toggleSelectAll($event, form, item, field)\"\n [value]=\"item.key\" [id]=\"'checkbox_' + item.key\"\n [name]=\"'checkbox_' + item.key\"\n />\n <label\n [for]=\"'checkbox_' + item.key\"\n class=\"govuk-label govuk-checkboxes__label\"\n [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n >{{item.label}}</label>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'checkbox-large'\">\n <div class=\"govuk-checkboxes\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n [attr.disabled]=\"disabled(field, form)\"\n [formControlName]=\"i\"\n (change)=\"toggleSelectAll($event, form, item, field)\"\n [value]=\"item.key\" [id]=\"'checkbox_' + item.key\"\n [name]=\"'checkbox_' + item.key\"\n />\n <label\n [for]=\"'checkbox_' + item.key\"\n class=\"govuk-label govuk-checkboxes__label\"\n [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n >{{item.label}}</label>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'radio'\">\n <div class=\"govuk-radios\">\n <div *ngFor=\"let item of field.options\" class=\"govuk-radios__item\">\n <input type=\"radio\"\n [formControlName]=\"field.name\"\n [id]=\"'radio_' + item.key\"\n [attr.disabled]=\"disabled(field, form)\"\n [checked]=\"item.key === form.get(field.name).value\"\n class=\"govuk-radios__input\"\n [value]=\"item.key\"\n (change)=\"fieldChanged(field, form)\"\n />\n <label [for]=\"'radio_' + item.key\" class=\"govuk-label govuk-radios__label\">{{item.label}}</label>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'find-person'\">\n <xuilib-find-person subTitle=\"\" (personSelected)=\"updatePersonControls($event, field)\"\n (personFieldChanged)=\"inputChanged(field)\"\n [submitted]=\"submitted\"\n [disabled]=\"disabled(field, form)\"\n [domain]=\"form.get(field.domainField)?.value\"\n [findPersonGroup]=\"form\"\n [selectedPerson]=\"form.get(field.name)?.value?.email\"\n [userIncluded]=\"false\"\n ></xuilib-find-person>\n </ng-container>\n <ng-container *ngSwitchCase=\"'find-location'\">\n <xuilib-find-location (locationFieldChanged)=\"inputChanged(field)\"\n [form]=\"form\"\n [fields]=\"config.fields\"\n [locationTitle]=\"field.locationTitle\"\n [enableAddLocationButton]=\"field.enableAddButton\"\n [disabled]=\"disabled(field, form)\"\n [disableInputField]=\"field.disable\"\n [selectedLocations]=\"form.get(field.name)?.value\"\n [submitted]=\"submitted\"\n [services]=\"form.get(field.findLocationField)?.value\"\n [field]=\"field\"\n ></xuilib-find-location>\n </ng-container>\n <ng-container *ngSwitchCase=\"'find-service'\">\n <xuilib-find-service (serviceFieldChanged)=\"inputChanged(field)\"\n [form]=\"form\"\n [enableAddServiceButton]=\"field.enableAddButton\"\n [disabled]=\"disabled(field, form)\"\n [selectedServices]=\"form.get(field.name)?.value\"\n [services]=\"field.options\"\n [field]=\"field\"\n ></xuilib-find-service>\n </ng-container>\n <ng-container *ngSwitchCase=\"'text-input'\">\n <input class=\"govuk-input\" type=\"text\"\n [formControlName]=\"field.name\"\n [id]=\"field.name\"\n [attr.disabled]=\"disabled(field, form)\"\n (change)=\"fieldChanged(field, form)\"\n />\n </ng-container>\n <ng-container *ngSwitchCase=\"'email-input'\">\n <input class=\"govuk-input\" type=\"email\"\n [formControlName]=\"field.name\"\n [id]=\"field.name\"\n [attr.disabled]=\"disabled(field, form)\"\n (change)=\"fieldChanged(field, form)\"\n />\n </ng-container>\n </div>\n </div>\n </ng-container>\n </ng-container>\n\n </div>\n <hr class=\"govuk-section-break govuk-section-break--m\"/>\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full\">\n <button\n class=\"govuk-button govuk-!-margin-right-1 govuk-!-margin-bottom-0\"\n type=\"submit\"\n id=\"applyFilter\"\n [disabled]=\"config.enableDisabledButton && form.invalid\"\n >{{config.applyButtonText || 'Apply'}}</button>\n <button *ngIf=\"config.showCancelFilterButton\"\n class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n type=\"button\"\n id=\"cancelFilter\"\n (click)=\"cancelFilter()\">{{ config.cancelButtonText || 'Cancel'}}</button>\n </div>\n </div>\n</form>\n",
1835
+ template: "<form [formGroup]=\"form\" (ngSubmit)=\"applyFilter(form)\">\n <div class=\"contain-classes\" *ngFor=\"let field of config.fields\">\n <hr *ngIf=\"field.lineBreakBefore\" class=\"govuk-section-break elevated-break\">\n <ng-container [ngSwitch]=\"field.type\">\n <ng-container *ngSwitchCase=\"'group-title'\">\n <div [class]=\"field.titleClasses ? field.titleClasses: 'govuk-label govuk-label--m govuk-!-margin-bottom-4'\">\n {{ field.name | capitalize }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <div class=\"govuk-form-group xui-generic-filter\"\n [hidden]=\"hidden(field, form)\"\n [id]=\"field.name\"\n [ngClass]=\"{'form-group-error': submitted && ((form.get(field.name).errors?.minlength || form.get(field.name).errors?.required) || form.get(field.name).errors?.maxLength || form.get(field.name).errors?.email)}\">\n\n <div *ngIf=\"field.title\" class=\"xui-generic-filter__field-title\">\n <h3 [class]=\"field.titleClasses ? field.titleClasses : 'govuk-heading-s'\" style=\"margin-bottom: 0!important\">\n {{field.title | capitalize}}\n </h3>\n\n <div *ngIf=\"field?.titleHint\" class=\"govuk-!-margin-left-2\">\n {{ field.titleHint }}\n </div>\n </div>\n\n <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n *ngIf=\"field.displayMinSelectedError && submitted && (form.get(field.name).errors?.minlength || form.get(field.name).errors?.required)\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n </span>\n\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n </span>\n\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\"\n *ngIf=\"field.emailError && submitted && form.get(field.name).errors?.email\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.emailError}}\n </span>\n\n <div class=\"govuk-body\" [class.govuk-body--maxWidth480px]=\"field.maxWidth480px\" [ngSwitch]=\"field.type\">\n <ng-container *ngSwitchCase=\"'select'\">\n <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n <option disabled selected hidden value=\"\">{{field.disabledText}}</option>\n <option class=\"govuk-radios__item\" *ngFor=\"let item of field.options\" [value]=\"item.key\">{{item.label}}</option>\n </select>\n </ng-container>\n <ng-container *ngSwitchCase=\"'group-select'\">\n <select class=\"govuk-select\" (change)=\"fieldChanged(field, form)\" [attr.disabled]=\"disabled(field, form)\" [name]=\"'select_' + field.name\" [id]=\"'select_' + field.name\" [formControlName]=\"field.name\">\n <option selected value=\"\">{{field.disabledText}}</option>\n <optgroup *ngFor = 'let grp of filteredSkillsByServices' label=\"{{grp.group | titlecase}}\">\n <option *ngFor = 'let item of grp.options' [value]=\"item.key\">{{item.label}}</option> \n </optgroup>\n </select>\n </ng-container>\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <div class=\"govuk-checkboxes govuk-checkboxes--small\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n [attr.disabled]=\"disabled(field, form)\"\n [formControlName]=\"i\"\n (change)=\"toggleSelectAll($event, form, item, field)\"\n [value]=\"item.key\" [id]=\"'checkbox_' + item.key\"\n [name]=\"'checkbox_' + item.key\"\n />\n <label\n [for]=\"'checkbox_' + item.key\"\n class=\"govuk-label govuk-checkboxes__label\"\n [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n >{{item.label}}</label>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'checkbox-large'\">\n <div class=\"govuk-checkboxes\" [formGroupName]=\"field.name\" [attr.field]=\"field.name\" [id]=\"'checkbox_' + field.name\">\n <div *ngFor=\"let item of field.options; let i = index\" class=\"govuk-checkboxes__item\">\n <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n [attr.disabled]=\"disabled(field, form)\"\n [formControlName]=\"i\"\n (change)=\"toggleSelectAll($event, form, item, field)\"\n [value]=\"item.key\" [id]=\"'checkbox_' + item.key\"\n [name]=\"'checkbox_' + item.key\"\n />\n <label\n [for]=\"'checkbox_' + item.key\"\n class=\"govuk-label govuk-checkboxes__label\"\n [ngClass]=\"{'govuk-!-font-weight-bold': item.selectAll}\"\n >{{item.label}}</label>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'radio'\">\n <div class=\"govuk-radios\">\n <div *ngFor=\"let item of field.options\" class=\"govuk-radios__item\">\n <input type=\"radio\"\n [formControlName]=\"field.name\"\n [id]=\"'radio_' + item.key\"\n [attr.disabled]=\"disabled(field, form)\"\n [checked]=\"item.key === form.get(field.name).value\"\n class=\"govuk-radios__input\"\n [value]=\"item.key\"\n (change)=\"fieldChanged(field, form)\"\n />\n <label [for]=\"'radio_' + item.key\" class=\"govuk-label govuk-radios__label\">{{item.label}}</label>\n </div>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'find-person'\">\n <xuilib-find-person subTitle=\"\" (personSelected)=\"updatePersonControls($event, field)\"\n (personFieldChanged)=\"inputChanged(field)\"\n [submitted]=\"submitted\"\n [disabled]=\"disabled(field, form)\"\n [domain]=\"form.get(field.domainField)?.value\"\n [findPersonGroup]=\"form\"\n [selectedPerson]=\"form.get(field.name)?.value?.email\"\n [userIncluded]=\"false\"\n ></xuilib-find-person>\n </ng-container>\n <ng-container *ngSwitchCase=\"'find-location'\">\n <xuilib-find-location (locationFieldChanged)=\"inputChanged(field)\"\n [form]=\"form\"\n [fields]=\"config.fields\"\n [locationTitle]=\"field.locationTitle\"\n [enableAddLocationButton]=\"field.enableAddButton\"\n [disabled]=\"disabled(field, form)\"\n [disableInputField]=\"field.disable\"\n [selectedLocations]=\"form.get(field.name)?.value\"\n [submitted]=\"submitted\"\n [services]=\"form.get(field.findLocationField)?.value\"\n [field]=\"field\"\n ></xuilib-find-location>\n </ng-container>\n <ng-container *ngSwitchCase=\"'find-service'\">\n <xuilib-find-service (serviceFieldChanged)=\"inputChanged(field)\"\n [form]=\"form\"\n [enableAddServiceButton]=\"field.enableAddButton\"\n [disabled]=\"disabled(field, form)\"\n [selectedServices]=\"form.get(field.name)?.value\"\n [services]=\"field.options\"\n [field]=\"field\"\n ></xuilib-find-service>\n </ng-container>\n <ng-container *ngSwitchCase=\"'text-input'\">\n <input class=\"govuk-input\" type=\"text\"\n [formControlName]=\"field.name\"\n [id]=\"field.name\"\n [attr.disabled]=\"disabled(field, form)\"\n (change)=\"fieldChanged(field, form)\"\n />\n </ng-container>\n <ng-container *ngSwitchCase=\"'email-input'\">\n <input class=\"govuk-input\" type=\"email\"\n [formControlName]=\"field.name\"\n [id]=\"field.name\"\n [attr.disabled]=\"disabled(field, form)\"\n (change)=\"fieldChanged(field, form)\"\n />\n </ng-container>\n </div>\n </div>\n </ng-container>\n </ng-container>\n\n </div>\n <hr class=\"govuk-section-break govuk-section-break--m\"/>\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-full\">\n <button\n class=\"govuk-button govuk-!-margin-right-1 govuk-!-margin-bottom-0\"\n type=\"submit\"\n id=\"applyFilter\"\n [disabled]=\"config.enableDisabledButton && form.invalid\"\n >{{config.applyButtonText || 'Apply'}}</button>\n <button *ngIf=\"config.showCancelFilterButton\"\n class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n type=\"button\"\n id=\"cancelFilter\"\n (click)=\"cancelFilter()\">{{ config.cancelButtonText || 'Cancel'}}</button>\n </div>\n </div>\n</form>\n",
1705
1836
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
1706
1837
  encapsulation: i0.ViewEncapsulation.None,
1707
1838
  styles: [".contain-classes .elevated-break{margin-bottom:20px}@media (min-width:40.0625em){.contain-classes .elevated-break{margin-bottom:30px}}.contain-classes .govuk-body--maxWidth480px{max-width:480px}.contain-classes .xui-generic-filter .select-all{margin-bottom:10px}.contain-classes .xui-generic-filter .govuk-checkboxes{display:flex;flex-direction:column;flex-wrap:wrap}.contain-classes .xui-generic-filter .govuk-checkboxes>div{flex-grow:1;flex-shrink:0}.contain-classes .xui-generic-filter__field-title{display:flex;align-items:center;margin-bottom:10px}.contain-classes .govuk-select{width:100%}"]
@@ -5285,6 +5416,7 @@
5285
5416
  * @return {?}
5286
5417
  */function (s) { return s.key !== _this.tempSelectedService.key; }));
5287
5418
  this.tempSelectedService = null;
5419
+ this.serviceFieldChanged.emit();
5288
5420
  };
5289
5421
  /**
5290
5422
  * @param {?} service
@@ -5312,6 +5444,7 @@
5312
5444
  this.services.splice(index, 0, service);
5313
5445
  this.SortAnOptions();
5314
5446
  }
5447
+ this.serviceFieldChanged.emit();
5315
5448
  }
5316
5449
  };
5317
5450
  /**