@hmcts/rpx-xui-common-lib 1.7.38 → 1.7.41

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.
@@ -121,4 +121,4 @@ if (false) {
121
121
  /** @type {?} */
122
122
  FilterError.prototype.error;
123
123
  }
124
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsdGVyLm1vZGVsLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGhtY3RzL3JweC14dWktY29tbW9uLWxpYi8iLCJzb3VyY2VzIjpbImxpYi9tb2RlbHMvZmlsdGVyLm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBT0Esa0NBU0M7OztJQVJDLDBCQUFXOztJQUNYLDhCQUE0Qjs7SUFDNUIsbUNBQStCOztJQUMvQix1Q0FBd0I7O0lBQ3hCLHdDQUF5Qjs7SUFDekIscUNBQThCOztJQUM5Qiw0Q0FBK0I7O0lBQy9CLDhDQUFpQzs7Ozs7QUFHbkMsdUNBMEJDOzs7SUF6QkMsaUNBQWE7O0lBQ2Isb0NBQTREOztJQUM1RCx3Q0FBb0I7O0lBQ3BCLHdDQUFvQjs7SUFDcEIsNkNBQTBCOztJQUMxQiw2Q0FBMEI7O0lBQzFCLG9EQUFrQzs7SUFDbEMsb0RBQWtDOztJQUNsQyw0Q0FBMEI7O0lBQzFCLDBDQUF1Qjs7SUFDdkIsNENBQXlCOztJQUN6Qiw0Q0FBMEI7O0lBQzFCLDhDQUE2Qjs7SUFDN0IsNENBQXlCOztJQUN6Qiw4Q0FBMkI7O0lBQzNCLHdDQUFxQjs7SUFDckIsb0NBQWtCOztJQUNsQix5Q0FBc0I7O0lBQ3RCLGlDQUFzQjs7SUFDdEIsbUNBQW9COztJQUNwQixrQ0FBZTs7SUFDZixxQ0FBa0I7O0lBQ2xCLDBDQUF1Qjs7SUFDdkIsaURBQThCOztJQUM5Qiw2Q0FBb0M7Ozs7O0FBR3RDLG1DQUlDOzs7SUFIQywyQkFBVzs7SUFDWCw4QkFBZ0I7O0lBQ2hCLCtCQUF5Qzs7QUFHM0M7SUFBQTtJQU1BLENBQUM7SUFBRCw2QkFBQztBQUFELENBQUMsQUFORCxJQU1DOzs7O0lBTEMsc0NBQW9COztJQUNwQix5Q0FBZ0Q7O0lBQ2hELDZDQUFzQjs7SUFDdEIsNkNBQXNCOztJQUN0QixzQ0FBcUI7Ozs7O0FBR3ZCLGlDQUdDOzs7SUFGQywyQkFBYTs7SUFDYiw0QkFBYyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJvb2tpbmdDaGVja1R5cGUgfSBmcm9tICcuL2xvY2F0aW9uLm1vZGVsJztcbmltcG9ydCB7IFBlcnNvblJvbGUgfSBmcm9tICcuL3BlcnNvbi5tb2RlbCc7XG5cbmV4cG9ydCB0eXBlIEZpbHRlckZpZWxkVHlwZSA9ICdjaGVja2JveCcgfCAncmFkaW8nIHwgJ3NlbGVjdCcgfCAnZmluZC1wZXJzb24nIHwgJ2ZpbmQtbG9jYXRpb24nIHwgJ2NoZWNrYm94LWxhcmdlJyB8ICdmaW5kLXNlcnZpY2UnO1xuXG5leHBvcnQgdHlwZSBGaWx0ZXJQZXJzaXN0ZW5jZSA9ICdsb2NhbCcgfCAnc2Vzc2lvbicgfCAnbWVtb3J5JztcblxuZXhwb3J0IGludGVyZmFjZSBGaWx0ZXJDb25maWcge1xuICBpZDogc3RyaW5nO1xuICBmaWVsZHM6IEZpbHRlckZpZWxkQ29uZmlnW107XG4gIHBlcnNpc3RlbmNlOiBGaWx0ZXJQZXJzaXN0ZW5jZTtcbiAgYXBwbHlCdXR0b25UZXh0OiBzdHJpbmc7XG4gIGNhbmNlbEJ1dHRvblRleHQ6IHN0cmluZztcbiAgY2FuY2VsU2V0dGluZz86IEZpbHRlclNldHRpbmc7XG4gIGVuYWJsZURpc2FibGVkQnV0dG9uPzogYm9vbGVhbjtcbiAgc2hvd0NhbmNlbEZpbHRlckJ1dHRvbj86IGJvb2xlYW47XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgRmlsdGVyRmllbGRDb25maWcge1xuICBuYW1lOiBzdHJpbmc7XG4gIG9wdGlvbnM6IHsga2V5OiBzdHJpbmcsIGxhYmVsOiBzdHJpbmcsIHNlbGVjdEFsbD86IHRydWUgfVtdO1xuICBtaW5TZWxlY3RlZDogbnVtYmVyO1xuICBtYXhTZWxlY3RlZDogbnVtYmVyO1xuICBtaW5TZWxlY3RlZEVycm9yPzogc3RyaW5nO1xuICBtYXhTZWxlY3RlZEVycm9yPzogc3RyaW5nO1xuICBkaXNwbGF5TWF4U2VsZWN0ZWRFcnJvcj86IGJvb2xlYW47XG4gIGRpc3BsYXlNaW5TZWxlY3RlZEVycm9yPzogYm9vbGVhbjtcbiAgbGluZUJyZWFrQmVmb3JlPzogYm9vbGVhbjtcbiAgc2hvd0NvbmRpdGlvbj86IHN0cmluZztcbiAgZW5hYmxlQ29uZGl0aW9uPzogc3RyaW5nO1xuICBlbmFibGVBZGRCdXR0b24/OiBib29sZWFuO1xuICBjaGFuZ2VSZXNldEZpZWxkcz86IHN0cmluZ1tdO1xuICBmaW5kUGVyc29uRmllbGQ/OiBzdHJpbmc7XG4gIGZpbmRMb2NhdGlvbkZpZWxkPzogc3RyaW5nO1xuICBkb21haW5GaWVsZD86IHN0cmluZztcbiAgZGlzYWJsZT86IGJvb2xlYW47XG4gIGRpc2FibGVkVGV4dD86IHN0cmluZztcbiAgdHlwZTogRmlsdGVyRmllbGRUeXBlO1xuICBkb21haW4/OiBQZXJzb25Sb2xlO1xuICB0aXRsZT86IHN0cmluZztcbiAgc3ViVGl0bGU/OiBzdHJpbmc7XG4gIGxvY2F0aW9uVGl0bGU/OiBzdHJpbmc7XG4gIHJhZGlvU2VsZWN0aW9uQ2hhbmdlPzogc3RyaW5nO1xuICBib29raW5nQ2hlY2tUeXBlPzogQm9va2luZ0NoZWNrVHlwZTtcbn1cblxuZXhwb3J0IGludGVyZmFjZSBGaWx0ZXJTZXR0aW5nIHtcbiAgaWQ6IHN0cmluZztcbiAgcmVzZXQ/OiBib29sZWFuO1xuICBmaWVsZHM6IHsgbmFtZTogc3RyaW5nLCB2YWx1ZTogYW55W10gfVtdO1xufVxuXG5leHBvcnQgY2xhc3MgUmFkaW9GaWx0ZXJGaWVsZENvbmZpZyBpbXBsZW1lbnRzIEZpbHRlckZpZWxkQ29uZmlnIHtcbiAgcHVibGljIG5hbWU6IHN0cmluZztcbiAgcHVibGljIG9wdGlvbnM6IHsga2V5OiBzdHJpbmcsIGxhYmVsOiBzdHJpbmd9W107XG4gIHB1YmxpYyBtaW5TZWxlY3RlZDogMTtcbiAgcHVibGljIG1heFNlbGVjdGVkOiAxO1xuICBwdWJsaWMgdHlwZTogJ3JhZGlvJztcbn1cblxuZXhwb3J0IGludGVyZmFjZSBGaWx0ZXJFcnJvciB7XG4gIG5hbWU6IHN0cmluZztcbiAgZXJyb3I6IHN0cmluZztcbn1cbiJdfQ==
124
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsdGVyLm1vZGVsLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGhtY3RzL3JweC14dWktY29tbW9uLWxpYi8iLCJzb3VyY2VzIjpbImxpYi9tb2RlbHMvZmlsdGVyLm1vZGVsLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBT0Esa0NBU0M7OztJQVJDLDBCQUFXOztJQUNYLDhCQUE0Qjs7SUFDNUIsbUNBQStCOztJQUMvQix1Q0FBd0I7O0lBQ3hCLHdDQUF5Qjs7SUFDekIscUNBQThCOztJQUM5Qiw0Q0FBK0I7O0lBQy9CLDhDQUFpQzs7Ozs7QUFHbkMsdUNBMEJDOzs7SUF6QkMsaUNBQWE7O0lBQ2Isb0NBQTREOztJQUM1RCx3Q0FBb0I7O0lBQ3BCLHdDQUFvQjs7SUFDcEIsNkNBQTBCOztJQUMxQiw2Q0FBMEI7O0lBQzFCLG9EQUFrQzs7SUFDbEMsb0RBQWtDOztJQUNsQyw0Q0FBMEI7O0lBQzFCLDBDQUF1Qjs7SUFDdkIsNENBQXlCOztJQUN6Qiw0Q0FBMEI7O0lBQzFCLDhDQUE2Qjs7SUFDN0IsNENBQXlCOztJQUN6Qiw4Q0FBMkI7O0lBQzNCLHdDQUFxQjs7SUFDckIsb0NBQWtCOztJQUNsQix5Q0FBc0I7O0lBQ3RCLGlDQUFzQjs7SUFDdEIsbUNBQW9COztJQUNwQixrQ0FBZTs7SUFDZixxQ0FBa0I7O0lBQ2xCLDBDQUF1Qjs7SUFDdkIsaURBQThCOztJQUM5Qiw2Q0FBb0M7Ozs7O0FBR3RDLG1DQUlDOzs7SUFIQywyQkFBVzs7SUFDWCw4QkFBZ0I7O0lBQ2hCLCtCQUF5Qzs7QUFHM0M7SUFBQTtJQU1BLENBQUM7SUFBRCw2QkFBQztBQUFELENBQUMsQUFORCxJQU1DOzs7O0lBTEMsc0NBQW9COztJQUNwQix5Q0FBZ0Q7O0lBQ2hELDZDQUFzQjs7SUFDdEIsNkNBQXNCOztJQUN0QixzQ0FBcUI7Ozs7O0FBR3ZCLGlDQUdDOzs7SUFGQywyQkFBYTs7SUFDYiw0QkFBYyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEJvb2tpbmdDaGVja1R5cGUgfSBmcm9tICcuL2xvY2F0aW9uLm1vZGVsJztcbmltcG9ydCB7IFBlcnNvblJvbGUgfSBmcm9tICcuL3BlcnNvbi5tb2RlbCc7XG5cbmV4cG9ydCB0eXBlIEZpbHRlckZpZWxkVHlwZSA9ICdjaGVja2JveCcgfCAncmFkaW8nIHwgJ3NlbGVjdCcgfCAnZmluZC1wZXJzb24nIHwgJ2ZpbmQtbG9jYXRpb24nIHwgJ2NoZWNrYm94LWxhcmdlJyB8ICdmaW5kLXNlcnZpY2UnIHwgJ3RleHQtaW5wdXQnO1xuXG5leHBvcnQgdHlwZSBGaWx0ZXJQZXJzaXN0ZW5jZSA9ICdsb2NhbCcgfCAnc2Vzc2lvbicgfCAnbWVtb3J5JztcblxuZXhwb3J0IGludGVyZmFjZSBGaWx0ZXJDb25maWcge1xuICBpZDogc3RyaW5nO1xuICBmaWVsZHM6IEZpbHRlckZpZWxkQ29uZmlnW107XG4gIHBlcnNpc3RlbmNlOiBGaWx0ZXJQZXJzaXN0ZW5jZTtcbiAgYXBwbHlCdXR0b25UZXh0OiBzdHJpbmc7XG4gIGNhbmNlbEJ1dHRvblRleHQ6IHN0cmluZztcbiAgY2FuY2VsU2V0dGluZz86IEZpbHRlclNldHRpbmc7XG4gIGVuYWJsZURpc2FibGVkQnV0dG9uPzogYm9vbGVhbjtcbiAgc2hvd0NhbmNlbEZpbHRlckJ1dHRvbj86IGJvb2xlYW47XG59XG5cbmV4cG9ydCBpbnRlcmZhY2UgRmlsdGVyRmllbGRDb25maWcge1xuICBuYW1lOiBzdHJpbmc7XG4gIG9wdGlvbnM6IHsga2V5OiBzdHJpbmcsIGxhYmVsOiBzdHJpbmcsIHNlbGVjdEFsbD86IHRydWUgfVtdO1xuICBtaW5TZWxlY3RlZDogbnVtYmVyO1xuICBtYXhTZWxlY3RlZDogbnVtYmVyO1xuICBtaW5TZWxlY3RlZEVycm9yPzogc3RyaW5nO1xuICBtYXhTZWxlY3RlZEVycm9yPzogc3RyaW5nO1xuICBkaXNwbGF5TWF4U2VsZWN0ZWRFcnJvcj86IGJvb2xlYW47XG4gIGRpc3BsYXlNaW5TZWxlY3RlZEVycm9yPzogYm9vbGVhbjtcbiAgbGluZUJyZWFrQmVmb3JlPzogYm9vbGVhbjtcbiAgc2hvd0NvbmRpdGlvbj86IHN0cmluZztcbiAgZW5hYmxlQ29uZGl0aW9uPzogc3RyaW5nO1xuICBlbmFibGVBZGRCdXR0b24/OiBib29sZWFuO1xuICBjaGFuZ2VSZXNldEZpZWxkcz86IHN0cmluZ1tdO1xuICBmaW5kUGVyc29uRmllbGQ/OiBzdHJpbmc7XG4gIGZpbmRMb2NhdGlvbkZpZWxkPzogc3RyaW5nO1xuICBkb21haW5GaWVsZD86IHN0cmluZztcbiAgZGlzYWJsZT86IGJvb2xlYW47XG4gIGRpc2FibGVkVGV4dD86IHN0cmluZztcbiAgdHlwZTogRmlsdGVyRmllbGRUeXBlO1xuICBkb21haW4/OiBQZXJzb25Sb2xlO1xuICB0aXRsZT86IHN0cmluZztcbiAgc3ViVGl0bGU/OiBzdHJpbmc7XG4gIGxvY2F0aW9uVGl0bGU/OiBzdHJpbmc7XG4gIHJhZGlvU2VsZWN0aW9uQ2hhbmdlPzogc3RyaW5nO1xuICBib29raW5nQ2hlY2tUeXBlPzogQm9va2luZ0NoZWNrVHlwZTtcbn1cblxuZXhwb3J0IGludGVyZmFjZSBGaWx0ZXJTZXR0aW5nIHtcbiAgaWQ6IHN0cmluZztcbiAgcmVzZXQ/OiBib29sZWFuO1xuICBmaWVsZHM6IHsgbmFtZTogc3RyaW5nLCB2YWx1ZTogYW55W10gfVtdO1xufVxuXG5leHBvcnQgY2xhc3MgUmFkaW9GaWx0ZXJGaWVsZENvbmZpZyBpbXBsZW1lbnRzIEZpbHRlckZpZWxkQ29uZmlnIHtcbiAgcHVibGljIG5hbWU6IHN0cmluZztcbiAgcHVibGljIG9wdGlvbnM6IHsga2V5OiBzdHJpbmcsIGxhYmVsOiBzdHJpbmd9W107XG4gIHB1YmxpYyBtaW5TZWxlY3RlZDogMTtcbiAgcHVibGljIG1heFNlbGVjdGVkOiAxO1xuICBwdWJsaWMgdHlwZTogJ3JhZGlvJztcbn1cblxuZXhwb3J0IGludGVyZmFjZSBGaWx0ZXJFcnJvciB7XG4gIG5hbWU6IHN0cmluZztcbiAgZXJyb3I6IHN0cmluZztcbn1cbiJdfQ==
@@ -574,7 +574,7 @@ function minSelectedValidator(min) {
574
574
  * @param {?} value
575
575
  * @return {?}
576
576
  */
577
- value => value)).length >= min ? null : { minLength: true };
577
+ value => value)).length >= min ? null : { minlength: true };
578
578
  });
579
579
  }
580
580
  /**
@@ -1040,6 +1040,9 @@ class GenericFilterComponent {
1040
1040
  const validators = [];
1041
1041
  if (field.minSelected && field.minSelected > 0) {
1042
1042
  validators.push(Validators.required);
1043
+ if (field.type === 'text-input') {
1044
+ validators.push(Validators.minLength(field.minSelected));
1045
+ }
1043
1046
  }
1044
1047
  /** @type {?} */
1045
1048
  let defaultValue = null;
@@ -1190,7 +1193,7 @@ class GenericFilterComponent {
1190
1193
  for (const field of this.config.fields) {
1191
1194
  /** @type {?} */
1192
1195
  const formGroup = form.get(field.name);
1193
- if (formGroup && formGroup.errors && formGroup.errors.minLength) {
1196
+ if (formGroup && formGroup.errors && formGroup.errors.minlength) {
1194
1197
  errors.push({ name: field.name, error: field.minSelectedError });
1195
1198
  }
1196
1199
  if (formGroup && formGroup.errors && formGroup.errors.maxLength) {
@@ -1205,7 +1208,7 @@ class GenericFilterComponent {
1205
1208
  GenericFilterComponent.decorators = [
1206
1209
  { type: Component, args: [{
1207
1210
  selector: 'xuilib-generic-filter',
1208
- 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 govuk-section-break--visible elevated-break\">\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?.maxLength)}\">\n <h3 *ngIf=\"field.title\" class=\"govuk-heading-s\">{{field.title}}</h3>\n <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMinSelectedError && submitted && form.get(field.name).errors?.minLength\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n </span>\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n </span>\n <div class=\"govuk-body\" [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 [fields]=\"config.fields\"\n [title]=\"field.title\"\n [enableAddServiceButton]=\"field.enableAddButton\"\n [disabled]=\"disabled(field, form)\"\n [disableInputField]=\"field.disable\"\n [selectedServices]=\"form.get(field.name)?.value\" \n [field]=\"field\"\n ></xuilib-find-service>\n </ng-container>\n </div>\n </div>\n </div>\n <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\"/>\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",
1211
+ 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 govuk-section-break--visible elevated-break\">\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?.maxLength)}\">\n <h3 *ngIf=\"field.title\" class=\"govuk-heading-s\">{{field.title}}</h3>\n <p class=\"govuk-body\" *ngIf=\"field.subTitle\">{{field.subTitle}}</p>\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMinSelectedError && submitted && form.get(field.name).errors?.minlength\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.minSelectedError}}\n </span>\n <span [id]=\"field.name + '-error'\" class=\"govuk-error-message\" *ngIf=\"field.displayMaxSelectedError && submitted && form.get(field.name).errors?.maxLength\">\n <span class=\"govuk-visually-hidden\">Error:</span> {{field.maxSelectedError}}\n </span>\n <div class=\"govuk-body\" [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 [fields]=\"config.fields\"\n [title]=\"field.title\"\n [enableAddServiceButton]=\"field.enableAddButton\"\n [disabled]=\"disabled(field, form)\"\n [disableInputField]=\"field.disable\"\n [selectedServices]=\"form.get(field.name)?.value\"\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 </div>\n </div>\n </div>\n <hr class=\"govuk-section-break govuk-section-break--m govuk-section-break--visible\"/>\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",
1209
1212
  changeDetection: ChangeDetectionStrategy.OnPush,
1210
1213
  encapsulation: ViewEncapsulation.None,
1211
1214
  styles: [".contain-classes .elevated-break{margin-bottom:20px}@media (min-width:40.0625em){.contain-classes .elevated-break{margin-bottom:30px}}.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 .govuk-select{width:100%}"]