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

package/bundles/hmcts-rpx-xui-common-lib.umd.js

@@ -3071,6 +3071,7 @@
             this.users = []; // users of this organisation the cases can be shared with
             // users of this organisation the cases can be shared with
             this.confirmLink = '';
+            this.showRemoveUsers = false;
             this.unselect = new i0.EventEmitter();
             this.synchronizeStore = new i0.EventEmitter();
         }
@@ -3233,8 +3234,8 @@
         ShareCaseComponent.decorators = [
             { type: i0.Component, args: [{
                         selector: 'xuilib-share-case',
-                        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",
-                        styles: [""]
+                        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",
+                        styles: ["select{width:100%}"]
                     }] }
         ];
         /** @nocollapse */
@@ -3248,6 +3249,8 @@
             shareCases$: [{ type: i0.Input }],
             users: [{ type: i0.Input }],
             confirmLink: [{ type: i0.Input }],
+            addUserLabel: [{ type: i0.Input }],
+            showRemoveUsers: [{ type: i0.Input }],
             unselect: [{ type: i0.Output }],
             synchronizeStore: [{ type: i0.Output }],
             userSelect: [{ type: i0.ViewChild, args: [UserSelectComponent,] }]
@@ -3833,6 +3836,7 @@
         JUDICIAL: "Judicial",
         CASEWORKER: "Legal Ops",
         ADMIN: "Admin",
+        CTSC: "CTSC User",
         ALL: "All",
     };
     /** @enum {string} */
@@ -3840,6 +3844,7 @@
         JUDICIAL: "JUDICIAL",
         CASEWORKER: "LEGAL_OPERATIONS",
         ADMIN: "ADMIN",
+        CTSC: "CTSC",
         ALL: "ALL",
     };
 
@@ -5822,6 +5827,57 @@
         return GovUkCheckboxComponent;
     }());
 
+    /**
+     * @fileoverview added by tsickle
+     * Generated from: lib/gov-ui/util/helpers/html-templates.helper.ts
+     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    /*
+     * Helper Class
+     * Used for dynamic templates manipulation
+     * */
+    var /*
+     * Helper Class
+     * Used for dynamic templates manipulation
+     * */ HtmlTemplatesHelper = /** @class */ (function () {
+        function HtmlTemplatesHelper() {
+        }
+        /*
+        * Sets described by string depending if
+        * there is an error, error and hit or nothing
+        * */
+        /*
+          * Sets described by string depending if
+          * there is an error, error and hit or nothing
+          * */
+        /**
+         * @param {?} errorMessage
+         * @param {?} config
+         * @return {?}
+         */
+        HtmlTemplatesHelper.setDescribedBy = /*
+          * Sets described by string depending if
+          * there is an error, error and hit or nothing
+          * */
+            /**
+             * @param {?} errorMessage
+             * @param {?} config
+             * @return {?}
+             */
+            function (errorMessage, config) {
+                if (!errorMessage) {
+                    return config.hint ? config.id + "-hint" : null;
+                }
+                else if (errorMessage && errorMessage.isInvalid) {
+                    return config.hint ? config.id + "-hint " + config.id + "-error" : config.id + "-error";
+                }
+                else {
+                    return config.hint ? config.id + "-hint" : null;
+                }
+            };
+        return HtmlTemplatesHelper;
+    }());
+
     /**
      * @fileoverview added by tsickle
      * Generated from: lib/gov-ui/components/gov-uk-checkboxes/gov-uk-checkboxes.component.ts
@@ -5837,15 +5893,99 @@
     var GovUkCheckboxesComponent = /** @class */ (function () {
         function GovUkCheckboxesComponent() {
         }
+        /**
+         * @return {?}
+         */
+        GovUkCheckboxesComponent.prototype.ngOnInit = /**
+         * @return {?}
+         */
+            function () {
+                this.columns = this.setColumns();
+            };
+        /**
+         * @return {?}
+         */
+        GovUkCheckboxesComponent.prototype.setDescribedBy = /**
+         * @return {?}
+         */
+            function () {
+                return HtmlTemplatesHelper.setDescribedBy(this.errorMessage, this.config);
+            };
+        /**
+         * @param {?} checked
+         * @param {?} value
+         * @return {?}
+         */
+        GovUkCheckboxesComponent.prototype.onChecked = /**
+         * @param {?} checked
+         * @param {?} value
+         * @return {?}
+         */
+            function (checked, value) {
+                /** @type {?} */
+                var formControl = this.group.get(this.config.name);
+                /** @type {?} */
+                var array = formControl.value ? formControl.value : [];
+                if (!checked) {
+                    /** @type {?} */
+                    var modifiedArray = array.filter(( /**
+                     * @param {?} item
+                     * @return {?}
+                     */function (item) { return item !== value; }));
+                    formControl.setValue(modifiedArray);
+                }
+                else {
+                    formControl.setValue(__spread(array, [value]));
+                }
+            };
+        /**
+         * @param {?} value
+         * @return {?}
+         */
+        GovUkCheckboxesComponent.prototype.isChecked = /**
+         * @param {?} value
+         * @return {?}
+         */
+            function (value) {
+                /** @type {?} */
+                var formControl = this.group.get(this.config.name);
+                return formControl.value && formControl.value.includes(value);
+            };
+        /**
+         * @private
+         * @return {?}
+         */
+        GovUkCheckboxesComponent.prototype.setColumns = /**
+         * @private
+         * @return {?}
+         */
+            function () {
+                if (this.config.rows && this.config.rows > 1) {
+                    /** @type {?} */
+                    var array = [];
+                    for (var i = 0; i < this.items.length; i += this.config.rows) {
+                        /** @type {?} */
+                        var arrayChunk = this.items.slice(i, i + this.config.rows);
+                        array.push(arrayChunk);
+                    }
+                    return array;
+                }
+                else {
+                    return [this.items];
+                }
+            };
         GovUkCheckboxesComponent.decorators = [
             { type: i0.Component, args: [{
                         selector: 'xuilib-gov-uk-checkboxes',
-                        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>"
+                        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",
+                        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}"]
                     }] }
         ];
         GovUkCheckboxesComponent.propDecorators = {
-            options: [{ type: i0.Input }],
-            errors: [{ type: i0.Input }]
+            group: [{ type: i0.Input }],
+            config: [{ type: i0.Input }],
+            items: [{ type: i0.Input }],
+            errorMessage: [{ type: i0.Input }]
         };
         return GovUkCheckboxesComponent;
     }());
@@ -5995,57 +6135,6 @@
         return GovUkErrorMessageComponent;
     }());
 
-    /**
-     * @fileoverview added by tsickle
-     * Generated from: lib/gov-ui/util/helpers/html-templates.helper.ts
-     * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
-     */
-    /*
-     * Helper Class
-     * Used for dynamic templates manipulation
-     * */
-    var /*
-     * Helper Class
-     * Used for dynamic templates manipulation
-     * */ HtmlTemplatesHelper = /** @class */ (function () {
-        function HtmlTemplatesHelper() {
-        }
-        /*
-        * Sets described by string depending if
-        * there is an error, error and hit or nothing
-        * */
-        /*
-          * Sets described by string depending if
-          * there is an error, error and hit or nothing
-          * */
-        /**
-         * @param {?} errorMessage
-         * @param {?} config
-         * @return {?}
-         */
-        HtmlTemplatesHelper.setDescribedBy = /*
-          * Sets described by string depending if
-          * there is an error, error and hit or nothing
-          * */
-            /**
-             * @param {?} errorMessage
-             * @param {?} config
-             * @return {?}
-             */
-            function (errorMessage, config) {
-                if (!errorMessage) {
-                    return config.hint ? config.id + "-hint" : null;
-                }
-                else if (errorMessage && errorMessage.isInvalid) {
-                    return config.hint ? config.id + "-hint " + config.id + "-error" : config.id + "-error";
-                }
-                else {
-                    return config.hint ? config.id + "-hint" : null;
-                }
-            };
-        return HtmlTemplatesHelper;
-    }());
-
     /**
      * @fileoverview added by tsickle
      * Generated from: lib/gov-ui/components/gov-uk-fieldset/gov-uk-fieldset.component.ts
@@ -6193,7 +6282,7 @@
              * @return {?}
              */
             function () {
-                this.config.classes = 'govuk-label--m';
+                this.config.classes = typeof (this.config.classes) === 'string' ? this.config.classes : 'govuk-label govuk-label--m';
             };
         /**
          * @return {?}
@@ -6207,7 +6296,7 @@
         GovUkInputComponent.decorators = [
             { type: i0.Component, args: [{
                         selector: 'xuilib-gov-uk-input',
-                        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",
+                        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",
                         styles: [".gov-uk-input input:disabled{background:#b1b4b6}"]
                     }] }
         ];
@@ -6238,7 +6327,8 @@
         GovUkLabelComponent.decorators = [
             { type: i0.Component, args: [{
                         selector: 'xuilib-gov-label',
-                        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>"
+                        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",
+                        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}"]
                     }] }
         ];
         /** @nocollapse */
@@ -6357,7 +6447,7 @@
         GovUkSelectComponent.decorators = [
             { type: i0.Component, args: [{
                         selector: 'xuilib-gov-select',
-                        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>"
+                        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"
                     }] }
         ];
         /** @nocollapse */