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

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 (51) hide show
  1. package/bundles/hmcts-rpx-xui-common-lib.umd.js +169 -69
  2. package/bundles/hmcts-rpx-xui-common-lib.umd.js.map +1 -1
  3. package/bundles/hmcts-rpx-xui-common-lib.umd.min.js +1 -1
  4. package/bundles/hmcts-rpx-xui-common-lib.umd.min.js.map +1 -1
  5. package/esm2015/lib/components/find-location/find-location.component.js +3 -3
  6. package/esm2015/lib/components/find-service/find-service.component.js +21 -5
  7. package/esm2015/lib/components/generic-filter/generic-filter.component.js +1 -1
  8. package/esm2015/lib/components/search-location/search-location.component.js +1 -1
  9. package/esm2015/lib/components/search-service/search-service.component.js +3 -3
  10. package/esm2015/lib/components/share-case/share-case.component.js +10 -3
  11. package/esm2015/lib/gov-ui/components/gov-uk-checkboxes/gov-uk-checkboxes.component.js +80 -6
  12. package/esm2015/lib/gov-ui/components/gov-uk-input/gov-uk-input.component.js +3 -3
  13. package/esm2015/lib/gov-ui/components/gov-uk-label/gov-uk-label.component.js +3 -2
  14. package/esm2015/lib/gov-ui/components/gov-uk-radios/gov-uk-radios.component.js +1 -1
  15. package/esm2015/lib/gov-ui/components/gov-uk-select/gov-uk-select.component.js +2 -2
  16. package/esm2015/lib/gov-ui/models/checkboxes-model.js +6 -8
  17. package/esm2015/lib/gov-ui/models/gov-ui-config-model.js +5 -1
  18. package/esm2015/lib/gov-ui/models/radio-buttons.model.js +22 -0
  19. package/esm2015/lib/models/person.model.js +3 -1
  20. package/esm5/lib/components/find-location/find-location.component.js +3 -3
  21. package/esm5/lib/components/find-service/find-service.component.js +18 -5
  22. package/esm5/lib/components/generic-filter/generic-filter.component.js +1 -1
  23. package/esm5/lib/components/search-location/search-location.component.js +1 -1
  24. package/esm5/lib/components/search-service/search-service.component.js +3 -3
  25. package/esm5/lib/components/share-case/share-case.component.js +10 -3
  26. package/esm5/lib/gov-ui/components/gov-uk-checkboxes/gov-uk-checkboxes.component.js +100 -6
  27. package/esm5/lib/gov-ui/components/gov-uk-input/gov-uk-input.component.js +3 -3
  28. package/esm5/lib/gov-ui/components/gov-uk-label/gov-uk-label.component.js +3 -2
  29. package/esm5/lib/gov-ui/components/gov-uk-radios/gov-uk-radios.component.js +1 -1
  30. package/esm5/lib/gov-ui/components/gov-uk-select/gov-uk-select.component.js +2 -2
  31. package/esm5/lib/gov-ui/models/checkboxes-model.js +6 -8
  32. package/esm5/lib/gov-ui/models/gov-ui-config-model.js +5 -1
  33. package/esm5/lib/gov-ui/models/radio-buttons.model.js +22 -0
  34. package/esm5/lib/models/person.model.js +3 -1
  35. package/fesm2015/hmcts-rpx-xui-common-lib.js +133 -50
  36. package/fesm2015/hmcts-rpx-xui-common-lib.js.map +1 -1
  37. package/fesm5/hmcts-rpx-xui-common-lib.js +170 -71
  38. package/fesm5/hmcts-rpx-xui-common-lib.js.map +1 -1
  39. package/hmcts-rpx-xui-common-lib.metadata.json +1 -1
  40. package/lib/components/find-service/find-service.component.d.ts +3 -1
  41. package/lib/components/share-case/share-case.component.d.ts +2 -0
  42. package/lib/exui-common-lib.module.d.ts +4 -3
  43. package/lib/gov-ui/components/gov-uk-checkboxes/gov-uk-checkboxes.component.d.ts +14 -5
  44. package/lib/gov-ui/components/gov-uk-input/gov-uk-input.component.d.ts +1 -2
  45. package/lib/gov-ui/components/gov-uk-label/gov-uk-label.component.d.ts +1 -0
  46. package/lib/gov-ui/components/gov-uk-radios/gov-uk-radios.component.d.ts +2 -2
  47. package/lib/gov-ui/models/checkboxes-model.d.ts +4 -7
  48. package/lib/gov-ui/models/gov-ui-config-model.d.ts +2 -0
  49. package/lib/gov-ui/models/radio-buttons.model.d.ts +9 -0
  50. package/lib/models/person.model.d.ts +2 -0
  51. package/package.json +1 -1
@@ -1671,7 +1671,7 @@
1671
1671
  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",
1672
1672
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
1673
1673
  encapsulation: i0.ViewEncapsulation.None,
1674
- styles: [".contain-classes .elevated-break{position:relative;top:-10px}.contain-classes .xui-generic-filter .select-all{margin-bottom:10px}.contain-classes .xui-generic-filter .govuk-checkboxes{display:flex;flex-wrap:wrap}.contain-classes .xui-generic-filter .govuk-checkboxes>div{flex-grow:1;flex-shrink:0}"]
1674
+ 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%}"]
1675
1675
  }] }
1676
1676
  ];
1677
1677
  /** @nocollapse */
@@ -3071,6 +3071,7 @@
3071
3071
  this.users = []; // users of this organisation the cases can be shared with
3072
3072
  // users of this organisation the cases can be shared with
3073
3073
  this.confirmLink = '';
3074
+ this.showRemoveUsers = false;
3074
3075
  this.unselect = new i0.EventEmitter();
3075
3076
  this.synchronizeStore = new i0.EventEmitter();
3076
3077
  }
@@ -3233,8 +3234,8 @@
3233
3234
  ShareCaseComponent.decorators = [
3234
3235
  { type: i0.Component, args: [{
3235
3236
  selector: 'xuilib-share-case',
3236
- template: "<div id=\"add-user\">\n <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"add-user-input\">Enter email address</label>\n <span id=\"add-user-hint\" class=\"govuk-hint\">\n Search by name or email address. You can only add people from your organisation individually - but you can add as many as you like.\n </span>\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <xuilib-user-select\n id=\"add-user-input\"\n aria-describedby=\"add-user-hint\"\n [users]=\"users\"\n (selected)=\"onSelectedUser($event)\">\n </xuilib-user-select>\n </div>\n <div class=\"govuk-grid-column-one-thirds\">\n <button id=\"btn-add-user\" (click)=\"addUser()\" class=\"govuk-button\" [disabled]=\"isDisabledAdd()\" title=\"Add user to the case\">Add</button>\n </div>\n </div>\n <details id=\"add-user-help\" class=\"govuk-details\" data-module=\"govuk-details\">\n <summary class=\"govuk-details__summary\">\n <span id=\"content-why-can-not-find-email\" class=\"govuk-details__summary-text\">\n Can\u2019t find an email address?\n </span>\n </summary>\n <div id=\"content-reason-can-not-find-email\" class=\"govuk-details__text\">\n If you can\u2019t find your colleague\u2019s email address, they will need to complete their registration. Contact your\n administrator for help.\n </div>\n </details>\n</div>\n\n<div id=\"cases\">\n <h3 id=\"title-selected-cases\" class=\"govuk-heading-m\">Selected cases</h3>\n <div *ngIf=\"shareCases && shareCases.length > 0\" class=\"govuk-accordion\" data-module=\"govuk-accordion\" id=\"accordion-with-summary-sections\">\n <xuilib-selected-case-list\n [shareCases$]=\"shareCases$\"\n [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n (unselect)=\"onUnselect($event)\"\n (synchronizeStore)=\"onSynchronizeStore($event)\"\n >\n </xuilib-selected-case-list>\n </div>\n\n <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\">\n No cases to display.\n </div>\n\n</div>\n\n<div id=\"share-case-nav\">\n <button class=\"govuk-button\" [disabled]=\"isDisabledContinue()\" title=\"Continue\" [routerLink]=\"confirmLink\">Continue</button>\n</div>\n",
3237
- styles: [""]
3237
+ template: "<div id=\"add-user\">\n <div class=\"govuk-form-group\">\n <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"add-user-input\">{{addUserLabel}}</label>\n <span id=\"add-user-hint\" class=\"govuk-hint\">\n Search by name or email address. You can share access with as many people as you need.\n </span>\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <xuilib-user-select\n id=\"add-user-input\"\n aria-describedby=\"add-user-hint\"\n [users]=\"users\"\n (selected)=\"onSelectedUser($event)\">\n </xuilib-user-select>\n </div>\n <div class=\"govuk-grid-column-one-thirds\">\n <button id=\"btn-add-user\" (click)=\"addUser()\" class=\"govuk-button govuk-button--secondary\" [disabled]=\"isDisabledAdd()\" title=\"Add user to selected cases\">Add</button>\n </div>\n </div>\n <details id=\"add-user-help\" class=\"govuk-details\" data-module=\"govuk-details\">\n <summary class=\"govuk-details__summary\">\n <span id=\"content-why-can-not-find-email\" class=\"govuk-details__summary-text\">\n Can't find an email address?\n </span>\n </summary>\n <div id=\"content-reason-can-not-find-email\" class=\"govuk-details__text\">\n If you can't find your colleague's email address, they will need to complete their registration. Contact your\n administrator for help.\n </div>\n </details>\n </div>\n <div class=\"govuk-form-group\" *ngIf=\"showRemoveUsers\">\n <label class=\"govuk-label govuk-!-font-weight-bold\" for=\"remove-user-input\">Remove a person from all cases</label>\n <span id=\"remove-user-hint\" class=\"govuk-hint\">\n Select a person to remove them from all selected cases.\n </span>\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n <select class=\"govuk-select\" id=\"remove-user-input\" aria-describedby=\"remove-user-hint\">\n <option value=\"{{user}}\" *ngFor=\"let user of users\">{{user.email}}</option>\n </select>\n </div>\n <div class=\"govuk-grid-column-one-thirds\">\n <button id=\"btn-remove-user\" class=\"govuk-button govuk-button--secondary\" title=\"Remove user from selected cases\">Remove</button>\n </div>\n </div>\n </div>\n</div>\n\n<div id=\"cases\">\n <h3 id=\"title-selected-cases\" class=\"govuk-heading-m\">Selected cases</h3>\n <div *ngIf=\"shareCases && shareCases.length > 0\" class=\"govuk-accordion\" data-module=\"govuk-accordion\" id=\"accordion-with-summary-sections\">\n <xuilib-selected-case-list\n [shareCases$]=\"shareCases$\"\n [removeUserFromCaseToggleOn]=\"removeUserFromCaseToggleOn\"\n (unselect)=\"onUnselect($event)\"\n (synchronizeStore)=\"onSynchronizeStore($event)\"\n >\n </xuilib-selected-case-list>\n </div>\n\n <div id=\"noCaseDisplay\" *ngIf=\"shareCases && shareCases.length === 0\" class=\"govuk-hint\">\n No cases to display.\n </div>\n\n</div>\n\n<div id=\"share-case-nav\" class=\"govuk-button-group\">\n <button class=\"govuk-button\" data-module=\"govuk-button\" [disabled]=\"isDisabledContinue()\" title=\"Continue\" [routerLink]=\"confirmLink\">Continue</button>\n <button class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\" title=\"Cancel\">Cancel</button>\n</div>\n",
3238
+ styles: ["select{width:100%}"]
3238
3239
  }] }
3239
3240
  ];
3240
3241
  /** @nocollapse */
@@ -3248,6 +3249,8 @@
3248
3249
  shareCases$: [{ type: i0.Input }],
3249
3250
  users: [{ type: i0.Input }],
3250
3251
  confirmLink: [{ type: i0.Input }],
3252
+ addUserLabel: [{ type: i0.Input }],
3253
+ showRemoveUsers: [{ type: i0.Input }],
3251
3254
  unselect: [{ type: i0.Output }],
3252
3255
  synchronizeStore: [{ type: i0.Output }],
3253
3256
  userSelect: [{ type: i0.ViewChild, args: [UserSelectComponent,] }]
@@ -3833,6 +3836,7 @@
3833
3836
  JUDICIAL: "Judicial",
3834
3837
  CASEWORKER: "Legal Ops",
3835
3838
  ADMIN: "Admin",
3839
+ CTSC: "CTSC User",
3836
3840
  ALL: "All",
3837
3841
  };
3838
3842
  /** @enum {string} */
@@ -3840,6 +3844,7 @@
3840
3844
  JUDICIAL: "JUDICIAL",
3841
3845
  CASEWORKER: "LEGAL_OPERATIONS",
3842
3846
  ADMIN: "ADMIN",
3847
+ CTSC: "CTSC",
3843
3848
  ALL: "ALL",
3844
3849
  };
3845
3850
 
@@ -4241,7 +4246,7 @@
4241
4246
  { type: i0.Component, args: [{
4242
4247
  selector: 'exui-search-location',
4243
4248
  template: "<div class=\"auto-complete-container\">\n <input\n id=\"inputLocationSearch\"\n (input)=\"onInput()\"\n [formControl]=\"form.controls.searchTerm\"\n [matAutocomplete]=\"autoSearchLocation\"\n class=\"govuk-input\"\n [attr.disabled]=\"disabled\">\n <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchLocation=\"matAutocomplete\">\n <mat-option *ngFor=\"let location of locations\"\n (onSelectionChange)=\"onSelectionChange(location)\">\n {{ location.site_name }}\n </mat-option>\n <mat-option *ngIf=\"!locations.length && showAutocomplete && term && term.length >= this.minSearchCharacters\">No results found</mat-option>\n </mat-autocomplete>\n</div>\n",
4244
- styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:rgba(0,0,0,.256863) 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width:641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:550px;display:inline-block;margin-right:4px}.autocomplete__input{line-height:24px;font-size:19px}"]
4249
+ styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:rgba(0,0,0,.256863) 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width:641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{display:inline-block;margin-right:4px;width:calc(100% - 4px)}.autocomplete__input{line-height:24px;font-size:19px}"]
4245
4250
  }] }
4246
4251
  ];
4247
4252
  /** @nocollapse */
@@ -4498,8 +4503,8 @@
4498
4503
  FindLocationComponent.decorators = [
4499
4504
  { type: i0.Component, args: [{
4500
4505
  selector: 'xuilib-find-location',
4501
- template: "<div class=\"location-picker-custom\">\n <div class=\"search-location\">\n <div>\n <label id=\"input-selected-location-label\" *ngIf=\"locationTitle\">{{locationTitle}}</label>\n </div>\n <exui-search-location class=\"search-location\"\n [locations]=\"locations\"\n [selectedLocations]=\"selectedLocations\"\n [singleMode]=\"field.maxSelected === 1\"\n [bookingCheck]=\"field.bookingCheckType\"\n [delay]=\"300\"\n [disabled]=\"disabled\"\n [serviceIds]=\"serviceIds\"\n (locationInputChanged)=\"onInputChanged($event)\"\n (locationSelected)=\"onLocationSelected($event)\"\n (searchLocationChanged)=\"onSearchInputChanged()\"\n [locationType]=\"'case-management'\"></exui-search-location>\n <a href=\"javascript:void(0)\" (click)=\"addLocation()\" class=\"govuk-button\" data-module=\"govuk-button\" *ngIf=\"enableAddLocationButton\">\n Add location\n </a>\n </div>\n <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n <li class=\"location-selection\" *ngFor=\"let selection of selectedLocations\">\n <a class=\"hmcts-filter__tag\" (click)=\"removeLocation(selection)\" href=\"javascript:void(0)\">\n {{ selection.site_name }}\n </a>\n </li>\n </ul>\n</div>\n",
4502
- styles: [""]
4506
+ template: "<div class=\"location-picker-custom\">\n <div class=\"search-location\">\n <div>\n <label id=\"input-selected-location-label\" *ngIf=\"locationTitle\">{{locationTitle}}</label>\n </div>\n\n <div class=\"search-location__input-container\">\n <exui-search-location class=\"search-location__input\"\n [locations]=\"locations\"\n [selectedLocations]=\"selectedLocations\"\n [singleMode]=\"field.maxSelected === 1\"\n [bookingCheck]=\"field.bookingCheckType\"\n [delay]=\"300\"\n [disabled]=\"disabled\"\n [serviceIds]=\"serviceIds\"\n (locationInputChanged)=\"onInputChanged($event)\"\n (locationSelected)=\"onLocationSelected($event)\"\n (searchLocationChanged)=\"onSearchInputChanged()\"\n [locationType]=\"'case-management'\"></exui-search-location>\n <a href=\"javascript:void(0)\" (click)=\"addLocation()\" class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\" data-module=\"govuk-button\" *ngIf=\"enableAddLocationButton\">\n Add\n </a>\n </div>\n </div>\n <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n <li class=\"location-selection\" *ngFor=\"let selection of selectedLocations\">\n <a class=\"hmcts-filter__tag\" (click)=\"removeLocation(selection)\" href=\"javascript:void(0)\">\n {{ selection.site_name }}\n </a>\n </li>\n </ul>\n</div>\n",
4507
+ styles: [".search-location__input-container{display:flex}.search-location .auto-complete-container{min-width:unset;width:calc(100% - 4px)}.search-location__input{flex:1 0 auto}.search-location .govuk-button--secondary{background-color:#ddd}"]
4503
4508
  }] }
4504
4509
  ];
4505
4510
  FindLocationComponent.propDecorators = {
@@ -5208,10 +5213,14 @@
5208
5213
  * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
5209
5214
  */
5210
5215
  var FindServiceComponent = /** @class */ (function () {
5211
- function FindServiceComponent() {
5216
+ function FindServiceComponent(fb) {
5217
+ this.fb = fb;
5212
5218
  this.serviceTitle = 'Search for a service by name';
5213
5219
  this.enableAddServiceButton = true;
5214
5220
  this.disableInputField = false;
5221
+ this.form = this.fb.group({
5222
+ searchTerm: ['']
5223
+ });
5215
5224
  }
5216
5225
  /**
5217
5226
  * @return {?}
@@ -5225,10 +5234,16 @@
5225
5234
  FindServiceComponent.decorators = [
5226
5235
  { type: i0.Component, args: [{
5227
5236
  selector: 'xuilib-find-service',
5228
- template: "<div class=\"service-picker-custom\">\n <div class=\"search-service\">\n <div>\n <label id=\"input-selected-service-label\" *ngIf=\"serviceTitle\">{{serviceTitle}}</label>\n </div>\n <exui-search-service class=\"search-service\"\n [services]=\"services\"\n [selectedServices]=\"selectedServices\"\n [delay]=\"300\"\n [disabled]=\"disabled\"></exui-search-service>\n <a href=\"javascript:void(0)\" (click)=\"addService()\" class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\" \n data-module=\"govuk-button\" *ngIf=\"enableAddServiceButton\" id=\"add-service\">\n Add\n </a>\n </div>\n <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n <li class=\"service-selection\" *ngFor=\"let selection of selectedServices\">\n <a class=\"hmcts-filter__tag\" href=\"javascript:void(0)\">\n {{ selection.name }}\n </a>\n </li>\n </ul>\n </div>",
5229
- styles: ["#add-service{background-color:#ddd}"]
5237
+ template: "<div class=\"service-picker-custom\">\n <div class=\"search-service\">\n <div class=\"govuk-body\">\n <label id=\"input-selected-service-label\" *ngIf=\"serviceTitle\">{{serviceTitle}}</label>\n </div>\n <div class=\"search-service__input-container\">\n <exui-search-service class=\"search-service__input\"\n [services]=\"services\"\n [selectedServices]=\"selectedServices\"\n [delay]=\"300\"\n [disabled]=\"disabled\"></exui-search-service>\n <a href=\"javascript:void(0)\" (click)=\"addService()\" class=\"govuk-button govuk-button--secondary govuk-!-margin-bottom-0\"\n data-module=\"govuk-button\" *ngIf=\"enableAddServiceButton\" id=\"add-service\">\n Add\n </a>\n </div>\n </div>\n <ul class=\"hmcts-filter-tags selection-container\" *ngIf=\"field.maxSelected != 1\">\n <li class=\"service-selection\" *ngFor=\"let selection of selectedServices\">\n <a class=\"hmcts-filter__tag\" href=\"javascript:void(0)\">\n {{ selection.name }}\n </a>\n </li>\n </ul>\n</div>\n",
5238
+ styles: ["#add-service{background-color:#ddd}.search-service__input-container{display:flex}.search-service__input{flex:1 0 auto}"]
5230
5239
  }] }
5231
5240
  ];
5241
+ /** @nocollapse */
5242
+ FindServiceComponent.ctorParameters = function () {
5243
+ return [
5244
+ { type: forms.FormBuilder }
5245
+ ];
5246
+ };
5232
5247
  FindServiceComponent.propDecorators = {
5233
5248
  field: [{ type: i0.Input }],
5234
5249
  fields: [{ type: i0.Input }],
@@ -5514,8 +5529,8 @@
5514
5529
  SearchServiceComponent.decorators = [
5515
5530
  { type: i0.Component, args: [{
5516
5531
  selector: 'exui-search-service',
5517
- template: "<div class=\"auto-complete-container\">\n <input\n id=\"inputServiceSearch\"\n (input)=\"onInput()\"\n [formControl]=\"form?.controls.searchTerm\"\n [matAutocomplete]=\"autoSearchService\"\n class=\"govuk-input\"\n [attr.disabled]=\"disabled\">\n <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchService=\"matAutocomplete\">\n <mat-option *ngFor=\"let service of services\" (onSelectionChange)=\"onSelectionChange()\">\n {{ service.name }}\n </mat-option>\n <mat-option *ngIf=\"!services?.length && showAutocomplete && term && term.length >= this.minSearchCharacters\">No results found</mat-option>\n </mat-autocomplete>\n</div>\n",
5518
- styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:100%;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:rgba(0,0,0,.256863) 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width:641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{min-width:250px;display:inline-block;margin-right:4px}.autocomplete__input{line-height:24px;font-size:19px}"]
5532
+ template: "<div class=\"auto-complete-container\">\n <input\n id=\"inputServiceSearch\"\n (input)=\"onInput()\"\n [formControl]=\"form?.controls?.searchTerm\"\n [matAutocomplete]=\"autoSearchService\"\n class=\"govuk-input\"\n [attr.disabled]=\"disabled\">\n <mat-autocomplete class=\"mat-autocomplete-panel-extend\" autoActiveFirstOption #autoSearchService=\"matAutocomplete\">\n <mat-option *ngFor=\"let service of services\" (onSelectionChange)=\"onSelectionChange()\">\n {{ service.name }}\n </mat-option>\n <mat-option *ngIf=\"!services?.length && showAutocomplete && term && term.length >= this.minSearchCharacters\">No results found</mat-option>\n </mat-autocomplete>\n</div>\n",
5533
+ styles: [".autocomplete__input--show-all-values{padding:5px 34px 5px 5px;cursor:pointer}.autocomplete__dropdown-arrow-down{z-index:-1;display:inline-block;position:absolute;right:8px;width:24px;height:24px;top:10px}.autocomplete__menu{background-color:#fff;border:2px solid #0b0c0c;border-top:0;color:#0b0c0c;margin:0;max-height:342px;overflow-x:hidden;padding:0;width:calc(100% - 4px)}.autocomplete__menu--visible{display:block}.autocomplete__menu--hidden{display:none}.autocomplete__menu--overlay{box-shadow:rgba(0,0,0,.256863) 0 2px 6px;left:0;position:absolute;top:100%;z-index:100}.autocomplete__menu--inline{position:relative}.autocomplete__option{border-bottom:solid #b1b4b6;border-width:1px 0;cursor:pointer;display:block;position:relative}.autocomplete__option>*{pointer-events:none}.autocomplete__option:first-of-type{border-top-width:0}.autocomplete__option:last-of-type{border-bottom-width:0}.autocomplete__option--odd{background-color:#fafafa}.autocomplete__option--focused,.autocomplete__option:hover{background-color:#1d70b8;border-color:#1d70b8;color:#fff;outline:0}.autocomplete__option--no-results{background-color:#fafafa;color:#646b6f;cursor:not-allowed}.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.25}.autocomplete__hint,.autocomplete__option{padding:5px}@media (min-width:641px){.autocomplete__hint,.autocomplete__input,.autocomplete__option{font-size:13px;line-height:1.31579}}.div-action{display:inline-block}.add-location{display:inline}.remove-location-button{margin:5px}.hide-autocomplete{display:none}.auto-complete-container{width:calc(100% - 4px);display:inline-block;margin-right:4px}.autocomplete__input{line-height:24px;font-size:19px}"]
5519
5534
  }] }
5520
5535
  ];
5521
5536
  SearchServiceComponent.propDecorators = {
@@ -5812,6 +5827,57 @@
5812
5827
  return GovUkCheckboxComponent;
5813
5828
  }());
5814
5829
 
5830
+ /**
5831
+ * @fileoverview added by tsickle
5832
+ * Generated from: lib/gov-ui/util/helpers/html-templates.helper.ts
5833
+ * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
5834
+ */
5835
+ /*
5836
+ * Helper Class
5837
+ * Used for dynamic templates manipulation
5838
+ * */
5839
+ var /*
5840
+ * Helper Class
5841
+ * Used for dynamic templates manipulation
5842
+ * */ HtmlTemplatesHelper = /** @class */ (function () {
5843
+ function HtmlTemplatesHelper() {
5844
+ }
5845
+ /*
5846
+ * Sets described by string depending if
5847
+ * there is an error, error and hit or nothing
5848
+ * */
5849
+ /*
5850
+ * Sets described by string depending if
5851
+ * there is an error, error and hit or nothing
5852
+ * */
5853
+ /**
5854
+ * @param {?} errorMessage
5855
+ * @param {?} config
5856
+ * @return {?}
5857
+ */
5858
+ HtmlTemplatesHelper.setDescribedBy = /*
5859
+ * Sets described by string depending if
5860
+ * there is an error, error and hit or nothing
5861
+ * */
5862
+ /**
5863
+ * @param {?} errorMessage
5864
+ * @param {?} config
5865
+ * @return {?}
5866
+ */
5867
+ function (errorMessage, config) {
5868
+ if (!errorMessage) {
5869
+ return config.hint ? config.id + "-hint" : null;
5870
+ }
5871
+ else if (errorMessage && errorMessage.isInvalid) {
5872
+ return config.hint ? config.id + "-hint " + config.id + "-error" : config.id + "-error";
5873
+ }
5874
+ else {
5875
+ return config.hint ? config.id + "-hint" : null;
5876
+ }
5877
+ };
5878
+ return HtmlTemplatesHelper;
5879
+ }());
5880
+
5815
5881
  /**
5816
5882
  * @fileoverview added by tsickle
5817
5883
  * Generated from: lib/gov-ui/components/gov-uk-checkboxes/gov-uk-checkboxes.component.ts
@@ -5827,15 +5893,99 @@
5827
5893
  var GovUkCheckboxesComponent = /** @class */ (function () {
5828
5894
  function GovUkCheckboxesComponent() {
5829
5895
  }
5896
+ /**
5897
+ * @return {?}
5898
+ */
5899
+ GovUkCheckboxesComponent.prototype.ngOnInit = /**
5900
+ * @return {?}
5901
+ */
5902
+ function () {
5903
+ this.columns = this.setColumns();
5904
+ };
5905
+ /**
5906
+ * @return {?}
5907
+ */
5908
+ GovUkCheckboxesComponent.prototype.setDescribedBy = /**
5909
+ * @return {?}
5910
+ */
5911
+ function () {
5912
+ return HtmlTemplatesHelper.setDescribedBy(this.errorMessage, this.config);
5913
+ };
5914
+ /**
5915
+ * @param {?} checked
5916
+ * @param {?} value
5917
+ * @return {?}
5918
+ */
5919
+ GovUkCheckboxesComponent.prototype.onChecked = /**
5920
+ * @param {?} checked
5921
+ * @param {?} value
5922
+ * @return {?}
5923
+ */
5924
+ function (checked, value) {
5925
+ /** @type {?} */
5926
+ var formControl = this.group.get(this.config.name);
5927
+ /** @type {?} */
5928
+ var array = formControl.value ? formControl.value : [];
5929
+ if (!checked) {
5930
+ /** @type {?} */
5931
+ var modifiedArray = array.filter(( /**
5932
+ * @param {?} item
5933
+ * @return {?}
5934
+ */function (item) { return item !== value; }));
5935
+ formControl.setValue(modifiedArray);
5936
+ }
5937
+ else {
5938
+ formControl.setValue(__spread(array, [value]));
5939
+ }
5940
+ };
5941
+ /**
5942
+ * @param {?} value
5943
+ * @return {?}
5944
+ */
5945
+ GovUkCheckboxesComponent.prototype.isChecked = /**
5946
+ * @param {?} value
5947
+ * @return {?}
5948
+ */
5949
+ function (value) {
5950
+ /** @type {?} */
5951
+ var formControl = this.group.get(this.config.name);
5952
+ return formControl.value && formControl.value.includes(value);
5953
+ };
5954
+ /**
5955
+ * @private
5956
+ * @return {?}
5957
+ */
5958
+ GovUkCheckboxesComponent.prototype.setColumns = /**
5959
+ * @private
5960
+ * @return {?}
5961
+ */
5962
+ function () {
5963
+ if (this.config.rows && this.config.rows > 1) {
5964
+ /** @type {?} */
5965
+ var array = [];
5966
+ for (var i = 0; i < this.items.length; i += this.config.rows) {
5967
+ /** @type {?} */
5968
+ var arrayChunk = this.items.slice(i, i + this.config.rows);
5969
+ array.push(arrayChunk);
5970
+ }
5971
+ return array;
5972
+ }
5973
+ else {
5974
+ return [this.items];
5975
+ }
5976
+ };
5830
5977
  GovUkCheckboxesComponent.decorators = [
5831
5978
  { type: i0.Component, args: [{
5832
5979
  selector: 'xuilib-gov-uk-checkboxes',
5833
- template: "<xuilib-gov-uk-form-group-wrapper\n[error]=\"errors\"\n[config]=\"options.config\"\n[group]=\"options.key\">\n<div class=\"govuk-checkboxes\">\n <xuilib-gov-checkbox *ngFor=\"let item of options.items\"\n [group]=\"item.group\"\n [config]=\"item.config\">\n </xuilib-gov-checkbox>\n</div>\n</xuilib-gov-uk-form-group-wrapper>"
5980
+ template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n [ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n <xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n <span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n </span>\n\n <xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n <div class=\"govuk-checkboxes govuk-checkboxes--small govuk-checkboxes-multi-column\" data-module=\"govuk-checkboxes\">\n <div class=\"govuk-checkboxes-multi-column__single\" *ngFor=\"let columnItems of columns\">\n <div class=\"govuk-checkboxes__item\" *ngFor=\"let item of columnItems\">\n <input type=\"checkbox\" class=\"govuk-checkboxes__input\"\n [id]=\"item.id\" [name]=\"item.id\" [checked]=\"isChecked(item.value)\" [value]=\"item.value\"\n [attr.aria-describedby]=\"setDescribedBy()\"\n (change)=\"onChecked($event.target.checked, item.value)\"\n >\n <label class=\"govuk-label govuk-checkboxes__label\" [for]=\"item.id\">\n {{ item.label }}\n </label>\n <div *ngIf=\"item.hint\" class=\"govuk-hint govuk-checkboxes__hint\">\n {{ item.hint }}\n </div>\n </div>\n </div>\n </div>\n</div>\n",
5981
+ styles: [".govuk-checkboxes-multi-column{display:flex;flex-wrap:wrap;margin-left:-20px;margin-right:-20px}.govuk-checkboxes-multi-column__single{padding-left:20px;padding-right:20px}"]
5834
5982
  }] }
5835
5983
  ];
5836
5984
  GovUkCheckboxesComponent.propDecorators = {
5837
- options: [{ type: i0.Input }],
5838
- errors: [{ type: i0.Input }]
5985
+ group: [{ type: i0.Input }],
5986
+ config: [{ type: i0.Input }],
5987
+ items: [{ type: i0.Input }],
5988
+ errorMessage: [{ type: i0.Input }]
5839
5989
  };
5840
5990
  return GovUkCheckboxesComponent;
5841
5991
  }());
@@ -5985,57 +6135,6 @@
5985
6135
  return GovUkErrorMessageComponent;
5986
6136
  }());
5987
6137
 
5988
- /**
5989
- * @fileoverview added by tsickle
5990
- * Generated from: lib/gov-ui/util/helpers/html-templates.helper.ts
5991
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
5992
- */
5993
- /*
5994
- * Helper Class
5995
- * Used for dynamic templates manipulation
5996
- * */
5997
- var /*
5998
- * Helper Class
5999
- * Used for dynamic templates manipulation
6000
- * */ HtmlTemplatesHelper = /** @class */ (function () {
6001
- function HtmlTemplatesHelper() {
6002
- }
6003
- /*
6004
- * Sets described by string depending if
6005
- * there is an error, error and hit or nothing
6006
- * */
6007
- /*
6008
- * Sets described by string depending if
6009
- * there is an error, error and hit or nothing
6010
- * */
6011
- /**
6012
- * @param {?} errorMessage
6013
- * @param {?} config
6014
- * @return {?}
6015
- */
6016
- HtmlTemplatesHelper.setDescribedBy = /*
6017
- * Sets described by string depending if
6018
- * there is an error, error and hit or nothing
6019
- * */
6020
- /**
6021
- * @param {?} errorMessage
6022
- * @param {?} config
6023
- * @return {?}
6024
- */
6025
- function (errorMessage, config) {
6026
- if (!errorMessage) {
6027
- return config.hint ? config.id + "-hint" : null;
6028
- }
6029
- else if (errorMessage && errorMessage.isInvalid) {
6030
- return config.hint ? config.id + "-hint " + config.id + "-error" : config.id + "-error";
6031
- }
6032
- else {
6033
- return config.hint ? config.id + "-hint" : null;
6034
- }
6035
- };
6036
- return HtmlTemplatesHelper;
6037
- }());
6038
-
6039
6138
  /**
6040
6139
  * @fileoverview added by tsickle
6041
6140
  * Generated from: lib/gov-ui/components/gov-uk-fieldset/gov-uk-fieldset.component.ts
@@ -6183,7 +6282,7 @@
6183
6282
  * @return {?}
6184
6283
  */
6185
6284
  function () {
6186
- this.config.classes = 'govuk-label--m';
6285
+ this.config.classes = typeof (this.config.classes) === 'string' ? this.config.classes : 'govuk-label govuk-label--m';
6187
6286
  };
6188
6287
  /**
6189
6288
  * @return {?}
@@ -6197,7 +6296,7 @@
6197
6296
  GovUkInputComponent.decorators = [
6198
6297
  { type: i0.Component, args: [{
6199
6298
  selector: 'xuilib-gov-uk-input',
6200
- template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n</span>\n\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<input class=\"govuk-input\"\n [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n [id]=\"config.id\"\n [name]=\"config.name\"\n [type]=\"config.type\"\n [attr.aria-invalid]=\"errorMessage?.isInvalid\"\n [formControlName]=\"config.name\"\n [attr.aria-describedby]='setDescribedBy()'>\n</div>\n",
6299
+ template: "<div class=\"govuk-form-group gov-uk-input\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n</span>\n\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<input class=\"govuk-input\"\n [class.govuk-!-width-full]=\"config.fullWidth\"\n [ngClass]=\"{'govuk-input--error': errorMessage?.isInvalid}\"\n [id]=\"config.id\"\n [name]=\"config.name\"\n [type]=\"config.type\"\n [attr.aria-invalid]=\"errorMessage?.isInvalid\"\n [formControlName]=\"config.name\"\n [attr.aria-describedby]='setDescribedBy()'>\n</div>\n",
6201
6300
  styles: [".gov-uk-input input:disabled{background:#b1b4b6}"]
6202
6301
  }] }
6203
6302
  ];
@@ -6228,7 +6327,8 @@
6228
6327
  GovUkLabelComponent.decorators = [
6229
6328
  { type: i0.Component, args: [{
6230
6329
  selector: 'xuilib-gov-label',
6231
- template: "<h1 *ngIf=\"config.isPageHeading else noHeading\">\n <label *ngIf=\"config.label\" [class]=\"config.classes + ' govuk-label'\"\n [for]=\"config.id\" [innerHTML]=\"config.label\">\n </label>\n</h1>\n<ng-template #noHeading>\n <label *ngIf=\"config.label\" [class]=\"config.classes + ' govuk-label'\"\n [for]=\"config.id\" [innerHTML]=\"config.label\">\n </label>\n</ng-template>"
6330
+ template: "<h1 *ngIf=\"config.isPageHeading else noHeading\">\n <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n <span>{{ config.label }}</span>\n <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n </label>\n</h1>\n<ng-template #noHeading>\n <label *ngIf=\"config.label\" [for]=\"config.id\" [class]=\"config.classes + ' govuk-label'\">\n <span>{{ config.label }}</span>\n <span class=\"govuk-label__optional\" *ngIf=\"config.optional\">(optional)</span>\n </label>\n</ng-template>\n",
6331
+ styles: [".govuk-label{display:flex;align-items:center;flex-wrap:wrap}.govuk-label__optional{font-weight:400;font-size:16px;display:inline-block;margin-left:.75rem}"]
6232
6332
  }] }
6233
6333
  ];
6234
6334
  /** @nocollapse */
@@ -6347,7 +6447,7 @@
6347
6447
  GovUkSelectComponent.decorators = [
6348
6448
  { type: i0.Component, args: [{
6349
6449
  selector: 'xuilib-gov-select',
6350
- template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<select class=\"govuk-select\" [id]=\"config.id\" [name]=\"config.id\" [formControlName]=\"config.id\" [attr.aria-describedby]='setDescribedBy()'>\n<option value=\"{{item.value}}\" *ngFor=\"let item of items\">{{item.label}}</option>\n</select>\n</div>"
6450
+ template: "<div class=\"govuk-form-group\" [formGroup]=\"group\"\n[ngClass]=\"{'govuk-form-group--error': errorMessage?.isInvalid}\">\n<xuilib-gov-label [config]=\"config\"></xuilib-gov-label>\n<span *ngIf=\"config.hint\" [id]=\"config.id +'-hint'\" class=\"govuk-hint\">\n {{config.hint}}\n</span>\n<xuilib-gov-uk-error-message [config]=\"config\" [errorMessage]=\"errorMessage\"></xuilib-gov-uk-error-message>\n\n<select class=\"govuk-select\"\n [class.govuk-!-width-full]=\"config.fullWidth\"\n [id]=\"config.id\" [name]=\"config.id\" [formControlName]=\"config.id\" [attr.aria-describedby]='setDescribedBy()'>\n <option value=\"{{item.value}}\" *ngFor=\"let item of items\">{{item.label}}</option>\n</select>\n</div>\n"
6351
6451
  }] }
6352
6452
  ];
6353
6453
  /** @nocollapse */