vcomply-workflow-engine 3.4.11 → 3.4.13

package/fesm2015/vcomply-workflow-engine.mjs

@@ -16,8 +16,6 @@ import { VcomplyEditorModule } from '@vcomply/editor';
 import * as i4 from 'ng2-date-picker';
 import { DpDatePickerModule } from 'ng2-date-picker';
 import { nanoid } from 'nanoid';
-import * as i1$4 from 'ngx-lottie';
-import { LottieModule } from 'ngx-lottie';
 import moment from 'moment/moment';
 import { cloneDeep as cloneDeep$1 } from 'lodash-es';
 import * as i4$1 from 'ngx-material-timepicker';
@@ -28,6 +26,8 @@ import { NavigationStart, NavigationEnd, NavigationError } from '@angular/router
 import { __awaiter, __rest } from 'tslib';
 import cloneDeep$2 from 'lodash-es/cloneDeep';
 import * as XLSX from 'xlsx';
+import * as i1$4 from 'ngx-lottie';
+import { LottieModule } from 'ngx-lottie';
 import player from 'lottie-web';
 
 class WorkflowEngineService {
@@ -6265,19 +6265,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
             }] } });
 
 class LoaderInlineComponent {
-    constructor() {
-        this.options = {
-            path: './assets/vLoader.json',
-        };
+    constructor(config) {
+        if (config) {
+            this.env = config.envConfig;
+        }
+        this.vLoader = this.env.vLoader;
     }
     ngOnInit() { }
 }
-LoaderInlineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoaderInlineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LoaderInlineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoaderInlineComponent, selector: "app-loader-inline", ngImport: i0, template: "<div class=\"inline-loader\">\r\n  <ng-lottie width=\"300px\" height=\"300px\" [options]=\"options\"></ng-lottie>\r\n</div>", styles: [".inline-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:absolute;background:transparent;z-index:9;inset:0}\n"], dependencies: [{ kind: "component", type: i1$4.LottieComponent, selector: "ng-lottie", inputs: ["width", "height"] }] });
+LoaderInlineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoaderInlineComponent, deps: [{ token: Configurations, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+LoaderInlineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoaderInlineComponent, selector: "app-loader-inline", ngImport: i0, template: "<div class=\"inline-loader\">\r\n  <img src=\"{{vLoader}}\" alt=\"\" />\r\n  <div class=\"loader-index\">\r\n    <div class=\"loader-index-circle\"></div>\r\n  </div>\r\n</div>", styles: [".inline-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:absolute;background:transparent;z-index:9;inset:0}.inline-loader img{width:45px;position:relative;z-index:2}.inline-loader .loader-index{width:100%;height:100%;position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center}.inline-loader .loader-index-circle{background:#fff;width:65px;height:65px;border-radius:50%;border:4px solid transparent;border-top-color:#dbdbdb;animation:1.5s spin infinite linear}@keyframes spin{to{transform:rotate(360deg)}}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoaderInlineComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-loader-inline', template: "<div class=\"inline-loader\">\r\n  <ng-lottie width=\"300px\" height=\"300px\" [options]=\"options\"></ng-lottie>\r\n</div>", styles: [".inline-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:absolute;background:transparent;z-index:9;inset:0}\n"] }]
-        }], ctorParameters: function () { return []; } });
+            args: [{ selector: 'app-loader-inline', template: "<div class=\"inline-loader\">\r\n  <img src=\"{{vLoader}}\" alt=\"\" />\r\n  <div class=\"loader-index\">\r\n    <div class=\"loader-index-circle\"></div>\r\n  </div>\r\n</div>", styles: [".inline-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:absolute;background:transparent;z-index:9;inset:0}.inline-loader img{width:45px;position:relative;z-index:2}.inline-loader .loader-index{width:100%;height:100%;position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center}.inline-loader .loader-index-circle{background:#fff;width:65px;height:65px;border-radius:50%;border:4px solid transparent;border-top-color:#dbdbdb;animation:1.5s spin infinite linear}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
+        }], ctorParameters: function () {
+        return [{ type: Configurations, decorators: [{
+                        type: Optional
+                    }] }];
+    } });
 
 class GrcObjectContainerComponent {
     constructor(grcService, apiService, authService, uiKitService) {
@@ -6355,7 +6360,6 @@ class GrcObjectContainerComponent {
         this.resetForm = new EventEmitter();
         this.hideElementsFromMoreOptions = new EventEmitter();
         this.hideMoreOption = [];
-        this.getSubscriptionDetails();
     }
     ngOnDestroy() {
         this.resetGRCForm();
@@ -6365,12 +6369,12 @@ class GrcObjectContainerComponent {
         this.grcPayload.type = this.grcType;
         this.listObject = this.grcService.LIST_OBJECT;
         this._initiateAPI();
+        this.getSubscriptionDetails();
     }
     getSubscriptionDetails() {
         this.authService.getSubscriptionDetails().subscribe((res) => {
-            var _a, _b;
-            console.log('subscription list ===>', res, !((_a = res[0]) === null || _a === void 0 ? void 0 : _a.risk_flag));
-            if (!((_b = res[0]) === null || _b === void 0 ? void 0 : _b.risk_flag)) {
+            var _a;
+            if (!((_a = res[0]) === null || _a === void 0 ? void 0 : _a.risk_flag)) {
                 this.hideMoreOption.push('LINK_RISK_CATEGORIES_RISKS');
                 this.hideElementsFromMoreOptions.emit(this.hideMoreOption);
             }
@@ -17995,10 +17999,10 @@ class ReviewFrequencyComponent {
     }
 }
 ReviewFrequencyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReviewFrequencyComponent, deps: [{ token: SnackBarService }], target: i0.ɵɵFactoryTarget.Component });
-ReviewFrequencyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ReviewFrequencyComponent, selector: "app-review-frequency", inputs: { reviewCompleteDays: "reviewCompleteDays", reviewNOtCompletedDays: "reviewNOtCompletedDays" }, outputs: { closeReviewFrequency: "closeReviewFrequency", backToUserList: "backToUserList", saveReviewFrequency: "saveReviewFrequency" }, ngImport: i0, template: "<app-snack-bar></app-snack-bar>\r\n\r\n<div class=\"review-frequency\">\r\n    <div class=\"review-frequency-head vx-d-flex vx-align-center vx-pl-4 vx-pr-4\">\r\n        <i class=\"icons arrow vx-fs-16 vx-mr-2\" (click)=\"close()\">&#xe91d;</i> <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Review Frequency</div>\r\n    </div>\r\n    <div class=\"review-frequency-body\">\r\n      <div class=\"review-frequency-message\">\r\n          <div class=\"review-frequency-icon\"><img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/bulb.svg\" alt=\"\"></div>\r\n          <div class=\"review-frequency-inner vx-fs-12 vx-paragraph-txt vx-lh-5 vx-w-100\">\r\n              The review period begins after the responsibility is completed. This means that if a responsibility is\r\n              completed on the specified due date, the review will take place after the due date. In some\r\n              circumstances this may be fine. In others, such as a responsibility with a regulatory due date, this may\r\n              result in non-compliance with an external obligation. Accordingly, when adding the \u201CReview\u201D option to a\r\n              responsibility, it is important to carefully consider the due date for a responsibility and how\r\n              incorporating a review of the responsibility affects when a responsibility is completed.\r\n          </div>\r\n      </div>\r\n      <div class=\"review-frequency-body-inner vx-mt-2 vx-mb-4\">\r\n        <div class=\"frequency-due-date\">\r\n            <div class=\"frequency-due-date-item vx-mt-3\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW OPENS:</div>\r\n                <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                    The responsibility can be reviewed\r\n                    <input class=\"countNum\" [(ngModel)]=\"reviewCompleteDays\" (focusout)=\"onValueChange()\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                    {{ reviewCompleteDays > 1 ? 'days' : 'day' }} <span class=\"vx-fw-500\">after</span> it has been completed. Where this occurs, this will show as the review being <span class=\"completed-text vx-fw-500\">completed on time</span>.\r\n                </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">EXTENSION:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility can be reviewed\r\n                <input class=\"countNum\" [(ngModel)]=\"reviewNOtCompletedDays\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"delay-text vx-fw-500\">completed with delay</span>.\r\n              </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW CLOSES:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility cannot be reviewed\r\n                <span class=\"vx-fw-500 vx-label-txt vx-ml-1\">{{reviewNOtCompletedDays}}</span>\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"notcompleted-text vx-fw-500\">not completed</span>.\r\n              </div>\r\n            </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <app-floating-bar \r\n     [showWorkflow]=\"false\"\r\n     [isDisabled]=\"(reviewCompleteDays<1)?true:false\"\r\n     (closeEvent)=\"save()\" (closeList)=\"closeReviewFrequency.emit()\"> <span  class=\"name\">This responsibility needs to be reviewed within <b>{{reviewCompleteDays}}</b> {{reviewCompleteDays > 1 ? 'days': 'day'}} after it has been completed.</span>\r\n    </app-floating-bar>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/header/header.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/popover/popover.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .review-frequency{position:fixed;top:0;right:31.25rem;bottom:0;left:0}@media screen and (max-width: 1280px){::ng-deep .review-frequency{right:30px}}::ng-deep .review-frequency:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .review-frequency-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .review-frequency-head .arrow{cursor:pointer}::ng-deep .review-frequency-body{background:#fff;height:calc(100vh - 7.75rem);padding:2rem 2rem 1rem}::ng-deep .review-frequency-body-inner{height:calc(100vh - 18.75rem);overflow:hidden;overflow-y:auto}::ng-deep .review-frequency-message{position:relative}::ng-deep .review-frequency-inner{background:#fbfbfb;border:1px solid #f1f1f1;border-radius:.25rem;padding:.5rem .5rem .5rem 1.75rem!important}::ng-deep .review-frequency-icon{background:#fff;box-shadow:1px 1px 4px #1c5bd140;border-radius:.25rem;width:2rem;height:2rem;padding:.125rem;position:absolute;left:-1rem;top:1rem}::ng-deep .review-frequency-icon img{width:100%}::ng-deep .review-frequency app-floating-bar .userGroup-floating-bar{margin:0 2rem}::ng-deep .frequency-due-date-item-box{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-due-date-item-box input.countNum{-moz-appearance:textfield;border:none;border-bottom:1px solid #DBDBDB;color:#161b2f;display:inline-block;font-size:13px;text-align:center;width:2.75rem;padding:.125rem;margin:0 .5rem;outline:none}::ng-deep .frequency-due-date-item-box input.countNum::-webkit-inner-spin-button,::ng-deep .frequency-due-date-item-box input.countNum::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-due-date-item-box .completed-text{color:#34aa44}::ng-deep .frequency-due-date-item-box .delay-text{color:#f0b819}::ng-deep .frequency-due-date-item-box .notcompleted-text{color:#d93b41}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SnackBarComponent, selector: "app-snack-bar" }, { kind: "component", type: FloatingBarComponent, selector: "app-floating-bar", inputs: ["selectedData", "selectedGroups", "displayElementKey", "elementId", "singularText", "pluralText", "showNextButton", "showFrequencyText", "showWorkflow", "workflowText", "currentFrequency", "isDisabled", "workflowList", "selectedWorkflow", "workflowPlaceHolder", "mode", "defaultSelected", "groupsEnabled", "nonRemovableUsersList", "removePosition"], outputs: ["closeEvent", "deleteEvent", "closeList", "deleteGroupEvent", "workflowTypeChanged"] }] });
+ReviewFrequencyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ReviewFrequencyComponent, selector: "app-review-frequency", inputs: { reviewCompleteDays: "reviewCompleteDays", reviewNOtCompletedDays: "reviewNOtCompletedDays" }, outputs: { closeReviewFrequency: "closeReviewFrequency", backToUserList: "backToUserList", saveReviewFrequency: "saveReviewFrequency" }, ngImport: i0, template: "<app-snack-bar></app-snack-bar>\r\n\r\n<div class=\"review-frequency\">\r\n    <div class=\"review-frequency-head vx-d-flex vx-align-center vx-pl-4 vx-pr-4\">\r\n        <i class=\"icons arrow vx-fs-16 vx-mr-2\" (click)=\"close()\">&#xe91d;</i> <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Review Frequency</div>\r\n    </div>\r\n    <div class=\"review-frequency-body\">\r\n      <div class=\"review-frequency-message\">\r\n          <div class=\"review-frequency-icon\"><img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/bulb.svg\" alt=\"\"></div>\r\n          <div class=\"review-frequency-inner vx-fs-12 vx-paragraph-txt vx-lh-5 vx-w-100\">\r\n              The review period begins after the responsibility is completed. This means that if a responsibility is\r\n              completed on the specified due date, the review will take place after the due date. In some\r\n              circumstances this may be fine. In others, such as a responsibility with a regulatory due date, this may\r\n              result in non-compliance with an external obligation. Accordingly, when adding the \u201CReview\u201D option to a\r\n              responsibility, it is important to carefully consider the due date for a responsibility and how\r\n              incorporating a review of the responsibility affects when a responsibility is completed.\r\n          </div>\r\n      </div>\r\n      <div class=\"review-frequency-body-inner vx-mt-2 vx-mb-4\">\r\n        <div class=\"frequency-due-date\">\r\n            <div class=\"frequency-due-date-item vx-mt-3\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW OPENS:</div>\r\n                <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                    The responsibility can be reviewed\r\n                    <input class=\"countNum\" [(ngModel)]=\"reviewCompleteDays\" (focusout)=\"onValueChange()\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                    {{ reviewCompleteDays > 1 ? 'days' : 'day' }} <span class=\"vx-fw-500\">after</span> it has been completed. Where this occurs, this will show as the review being <span class=\"completed-text vx-fw-500\">completed on time</span>.\r\n                </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">EXTENSION:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility can be reviewed\r\n                <input class=\"countNum\" [(ngModel)]=\"reviewNOtCompletedDays\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"delay-text vx-fw-500\">completed with delay</span>.\r\n              </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW CLOSES:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility cannot be reviewed\r\n                <span class=\"vx-fw-500 vx-label-txt vx-ml-1\">{{reviewNOtCompletedDays}}</span>\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"notcompleted-text vx-fw-500\">not completed</span>.\r\n              </div>\r\n            </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <app-floating-bar \r\n     [showWorkflow]=\"false\"\r\n     [isDisabled]=\"(reviewCompleteDays<1)?true:false\"\r\n     (closeEvent)=\"save()\" (closeList)=\"closeReviewFrequency.emit()\"> <span  class=\"name\">This responsibility needs to be reviewed within <b>{{reviewCompleteDays}}</b> {{reviewCompleteDays > 1 ? 'days': 'day'}} after it has been completed.</span>\r\n    </app-floating-bar>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/header/header.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/popover/popover.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .review-frequency{position:fixed;top:0;right:31.25rem;bottom:0;left:0;z-index:-1}@media screen and (max-width: 1280px){::ng-deep .review-frequency{right:30px}}::ng-deep .review-frequency:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .review-frequency-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .review-frequency-head .arrow{cursor:pointer}::ng-deep .review-frequency-body{background:#fff;height:calc(100vh - 7.75rem);padding:2rem 2rem 1rem}::ng-deep .review-frequency-body-inner{height:calc(100vh - 18.75rem);overflow:hidden;overflow-y:auto}::ng-deep .review-frequency-message{position:relative}::ng-deep .review-frequency-inner{background:#fbfbfb;border:1px solid #f1f1f1;border-radius:.25rem;padding:.5rem .5rem .5rem 1.75rem!important}::ng-deep .review-frequency-icon{background:#fff;box-shadow:1px 1px 4px #1c5bd140;border-radius:.25rem;width:2rem;height:2rem;padding:.125rem;position:absolute;left:-1rem;top:1rem}::ng-deep .review-frequency-icon img{width:100%}::ng-deep .review-frequency app-floating-bar .userGroup-floating-bar{margin:0 2rem}::ng-deep .frequency-due-date-item-box{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-due-date-item-box input.countNum{-moz-appearance:textfield;border:none;border-bottom:1px solid #DBDBDB;color:#161b2f;display:inline-block;font-size:13px;text-align:center;width:2.75rem;padding:.125rem;margin:0 .5rem;outline:none}::ng-deep .frequency-due-date-item-box input.countNum::-webkit-inner-spin-button,::ng-deep .frequency-due-date-item-box input.countNum::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-due-date-item-box .completed-text{color:#34aa44}::ng-deep .frequency-due-date-item-box .delay-text{color:#f0b819}::ng-deep .frequency-due-date-item-box .notcompleted-text{color:#d93b41}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: SnackBarComponent, selector: "app-snack-bar" }, { kind: "component", type: FloatingBarComponent, selector: "app-floating-bar", inputs: ["selectedData", "selectedGroups", "displayElementKey", "elementId", "singularText", "pluralText", "showNextButton", "showFrequencyText", "showWorkflow", "workflowText", "currentFrequency", "isDisabled", "workflowList", "selectedWorkflow", "workflowPlaceHolder", "mode", "defaultSelected", "groupsEnabled", "nonRemovableUsersList", "removePosition"], outputs: ["closeEvent", "deleteEvent", "closeList", "deleteGroupEvent", "workflowTypeChanged"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ReviewFrequencyComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-review-frequency', template: "<app-snack-bar></app-snack-bar>\r\n\r\n<div class=\"review-frequency\">\r\n    <div class=\"review-frequency-head vx-d-flex vx-align-center vx-pl-4 vx-pr-4\">\r\n        <i class=\"icons arrow vx-fs-16 vx-mr-2\" (click)=\"close()\">&#xe91d;</i> <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Review Frequency</div>\r\n    </div>\r\n    <div class=\"review-frequency-body\">\r\n      <div class=\"review-frequency-message\">\r\n          <div class=\"review-frequency-icon\"><img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/bulb.svg\" alt=\"\"></div>\r\n          <div class=\"review-frequency-inner vx-fs-12 vx-paragraph-txt vx-lh-5 vx-w-100\">\r\n              The review period begins after the responsibility is completed. This means that if a responsibility is\r\n              completed on the specified due date, the review will take place after the due date. In some\r\n              circumstances this may be fine. In others, such as a responsibility with a regulatory due date, this may\r\n              result in non-compliance with an external obligation. Accordingly, when adding the \u201CReview\u201D option to a\r\n              responsibility, it is important to carefully consider the due date for a responsibility and how\r\n              incorporating a review of the responsibility affects when a responsibility is completed.\r\n          </div>\r\n      </div>\r\n      <div class=\"review-frequency-body-inner vx-mt-2 vx-mb-4\">\r\n        <div class=\"frequency-due-date\">\r\n            <div class=\"frequency-due-date-item vx-mt-3\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW OPENS:</div>\r\n                <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                    The responsibility can be reviewed\r\n                    <input class=\"countNum\" [(ngModel)]=\"reviewCompleteDays\" (focusout)=\"onValueChange()\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                    {{ reviewCompleteDays > 1 ? 'days' : 'day' }} <span class=\"vx-fw-500\">after</span> it has been completed. Where this occurs, this will show as the review being <span class=\"completed-text vx-fw-500\">completed on time</span>.\r\n                </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">EXTENSION:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility can be reviewed\r\n                <input class=\"countNum\" [(ngModel)]=\"reviewNOtCompletedDays\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"delay-text vx-fw-500\">completed with delay</span>.\r\n              </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW CLOSES:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility cannot be reviewed\r\n                <span class=\"vx-fw-500 vx-label-txt vx-ml-1\">{{reviewNOtCompletedDays}}</span>\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"notcompleted-text vx-fw-500\">not completed</span>.\r\n              </div>\r\n            </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <app-floating-bar \r\n     [showWorkflow]=\"false\"\r\n     [isDisabled]=\"(reviewCompleteDays<1)?true:false\"\r\n     (closeEvent)=\"save()\" (closeList)=\"closeReviewFrequency.emit()\"> <span  class=\"name\">This responsibility needs to be reviewed within <b>{{reviewCompleteDays}}</b> {{reviewCompleteDays > 1 ? 'days': 'day'}} after it has been completed.</span>\r\n    </app-floating-bar>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/header/header.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/popover/popover.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .review-frequency{position:fixed;top:0;right:31.25rem;bottom:0;left:0}@media screen and (max-width: 1280px){::ng-deep .review-frequency{right:30px}}::ng-deep .review-frequency:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .review-frequency-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .review-frequency-head .arrow{cursor:pointer}::ng-deep .review-frequency-body{background:#fff;height:calc(100vh - 7.75rem);padding:2rem 2rem 1rem}::ng-deep .review-frequency-body-inner{height:calc(100vh - 18.75rem);overflow:hidden;overflow-y:auto}::ng-deep .review-frequency-message{position:relative}::ng-deep .review-frequency-inner{background:#fbfbfb;border:1px solid #f1f1f1;border-radius:.25rem;padding:.5rem .5rem .5rem 1.75rem!important}::ng-deep .review-frequency-icon{background:#fff;box-shadow:1px 1px 4px #1c5bd140;border-radius:.25rem;width:2rem;height:2rem;padding:.125rem;position:absolute;left:-1rem;top:1rem}::ng-deep .review-frequency-icon img{width:100%}::ng-deep .review-frequency app-floating-bar .userGroup-floating-bar{margin:0 2rem}::ng-deep .frequency-due-date-item-box{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-due-date-item-box input.countNum{-moz-appearance:textfield;border:none;border-bottom:1px solid #DBDBDB;color:#161b2f;display:inline-block;font-size:13px;text-align:center;width:2.75rem;padding:.125rem;margin:0 .5rem;outline:none}::ng-deep .frequency-due-date-item-box input.countNum::-webkit-inner-spin-button,::ng-deep .frequency-due-date-item-box input.countNum::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-due-date-item-box .completed-text{color:#34aa44}::ng-deep .frequency-due-date-item-box .delay-text{color:#f0b819}::ng-deep .frequency-due-date-item-box .notcompleted-text{color:#d93b41}\n"] }]
+            args: [{ selector: 'app-review-frequency', template: "<app-snack-bar></app-snack-bar>\r\n\r\n<div class=\"review-frequency\">\r\n    <div class=\"review-frequency-head vx-d-flex vx-align-center vx-pl-4 vx-pr-4\">\r\n        <i class=\"icons arrow vx-fs-16 vx-mr-2\" (click)=\"close()\">&#xe91d;</i> <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Review Frequency</div>\r\n    </div>\r\n    <div class=\"review-frequency-body\">\r\n      <div class=\"review-frequency-message\">\r\n          <div class=\"review-frequency-icon\"><img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/bulb.svg\" alt=\"\"></div>\r\n          <div class=\"review-frequency-inner vx-fs-12 vx-paragraph-txt vx-lh-5 vx-w-100\">\r\n              The review period begins after the responsibility is completed. This means that if a responsibility is\r\n              completed on the specified due date, the review will take place after the due date. In some\r\n              circumstances this may be fine. In others, such as a responsibility with a regulatory due date, this may\r\n              result in non-compliance with an external obligation. Accordingly, when adding the \u201CReview\u201D option to a\r\n              responsibility, it is important to carefully consider the due date for a responsibility and how\r\n              incorporating a review of the responsibility affects when a responsibility is completed.\r\n          </div>\r\n      </div>\r\n      <div class=\"review-frequency-body-inner vx-mt-2 vx-mb-4\">\r\n        <div class=\"frequency-due-date\">\r\n            <div class=\"frequency-due-date-item vx-mt-3\">\r\n                <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW OPENS:</div>\r\n                <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                    The responsibility can be reviewed\r\n                    <input class=\"countNum\" [(ngModel)]=\"reviewCompleteDays\" (focusout)=\"onValueChange()\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                    {{ reviewCompleteDays > 1 ? 'days' : 'day' }} <span class=\"vx-fw-500\">after</span> it has been completed. Where this occurs, this will show as the review being <span class=\"completed-text vx-fw-500\">completed on time</span>.\r\n                </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">EXTENSION:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility can be reviewed\r\n                <input class=\"countNum\" [(ngModel)]=\"reviewNOtCompletedDays\" type=\"number\" onkeydown=\"return event.keyCode !== 190\" min=\"0\" oninput=\"this.value = Math.abs(this.value)\">\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"delay-text vx-fw-500\">completed with delay</span>.\r\n              </div>\r\n            </div>\r\n  \r\n            <div class=\"frequency-due-date-item vx-mt-5\">\r\n              <div class=\"vx-fs-11 vx-fw-500 vx-label-txt vx-tt-uppercase vx-mb-1\">COMPLETION WINDOW CLOSES:</div>\r\n              <div class=\"frequency-due-date-item-box vx-fs-13 vx-paragraph-txt vx-p-3 vx-pt-4 vx-pb-4 vx-d-block\">\r\n                The responsibility cannot be reviewed\r\n                <span class=\"vx-fw-500 vx-label-txt vx-ml-1\">{{reviewNOtCompletedDays}}</span>\r\n                {{ reviewNOtCompletedDays > 1 ? 'days' : 'day' }}<span class=\"vx-fw-500\"> after</span> the review due date. Where this occurs, this will show as the review being <span class=\"notcompleted-text vx-fw-500\">not completed</span>.\r\n              </div>\r\n            </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <app-floating-bar \r\n     [showWorkflow]=\"false\"\r\n     [isDisabled]=\"(reviewCompleteDays<1)?true:false\"\r\n     (closeEvent)=\"save()\" (closeList)=\"closeReviewFrequency.emit()\"> <span  class=\"name\">This responsibility needs to be reviewed within <b>{{reviewCompleteDays}}</b> {{reviewCompleteDays > 1 ? 'days': 'day'}} after it has been completed.</span>\r\n    </app-floating-bar>\r\n</div>", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/mixin/mixin.css\";@import\"https://cdn.v-comply.com/design-system/css/header/header.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/button/button.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/popover/popover.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .review-frequency{position:fixed;top:0;right:31.25rem;bottom:0;left:0;z-index:-1}@media screen and (max-width: 1280px){::ng-deep .review-frequency{right:30px}}::ng-deep .review-frequency:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .review-frequency-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .review-frequency-head .arrow{cursor:pointer}::ng-deep .review-frequency-body{background:#fff;height:calc(100vh - 7.75rem);padding:2rem 2rem 1rem}::ng-deep .review-frequency-body-inner{height:calc(100vh - 18.75rem);overflow:hidden;overflow-y:auto}::ng-deep .review-frequency-message{position:relative}::ng-deep .review-frequency-inner{background:#fbfbfb;border:1px solid #f1f1f1;border-radius:.25rem;padding:.5rem .5rem .5rem 1.75rem!important}::ng-deep .review-frequency-icon{background:#fff;box-shadow:1px 1px 4px #1c5bd140;border-radius:.25rem;width:2rem;height:2rem;padding:.125rem;position:absolute;left:-1rem;top:1rem}::ng-deep .review-frequency-icon img{width:100%}::ng-deep .review-frequency app-floating-bar .userGroup-floating-bar{margin:0 2rem}::ng-deep .frequency-due-date-item-box{border-radius:.25rem;border:1px solid #f1f1f1}::ng-deep .frequency-due-date-item-box input.countNum{-moz-appearance:textfield;border:none;border-bottom:1px solid #DBDBDB;color:#161b2f;display:inline-block;font-size:13px;text-align:center;width:2.75rem;padding:.125rem;margin:0 .5rem;outline:none}::ng-deep .frequency-due-date-item-box input.countNum::-webkit-inner-spin-button,::ng-deep .frequency-due-date-item-box input.countNum::-webkit-outer-spin-button{-webkit-appearance:none}::ng-deep .frequency-due-date-item-box .completed-text{color:#34aa44}::ng-deep .frequency-due-date-item-box .delay-text{color:#f0b819}::ng-deep .frequency-due-date-item-box .notcompleted-text{color:#d93b41}\n"] }]
         }], ctorParameters: function () { return [{ type: SnackBarService }]; }, propDecorators: { reviewCompleteDays: [{
                 type: Input
             }], reviewNOtCompletedDays: [{
@@ -22749,19 +22753,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
             }] } });
 
 class LoaderComponent$1 {
-    constructor() {
-        this.options = {
-            path: './assets/vLoader.json',
-        };
+    constructor(config) {
+        if (config) {
+            this.env = config.envConfig;
+        }
+        this.vLoader = this.env.vLoader;
     }
     ngOnInit() { }
 }
-LoaderComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoaderComponent$1, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LoaderComponent$1.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoaderComponent$1, selector: "app-loader", ngImport: i0, template: "<div class=\"main-loader\">\r\n  <ng-lottie width=\"300px\" height=\"300px\" [options]=\"options\"></ng-lottie>\r\n</div>", styles: [".main-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:fixed;background:transparent;z-index:99;inset:0}\n"], dependencies: [{ kind: "component", type: i1$4.LottieComponent, selector: "ng-lottie", inputs: ["width", "height"] }] });
+LoaderComponent$1.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoaderComponent$1, deps: [{ token: Configurations, optional: true }], target: i0.ɵɵFactoryTarget.Component });
+LoaderComponent$1.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: LoaderComponent$1, selector: "app-loader", ngImport: i0, template: "<div class=\"main-loader\">\r\n  <img src=\"{{vLoader}}\" alt=\"\" />\r\n  <div class=\"loader-index\">\r\n    <div class=\"loader-index-circle\"></div>\r\n  </div>\r\n</div>", styles: [".main-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:fixed;background:transparent;z-index:99;inset:0}.main-loader img{width:45px;position:relative;z-index:2}.main-loader .loader-index{width:100%;height:100%;position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center}.main-loader .loader-index-circle{background:#fff;width:65px;height:65px;border-radius:50%;border:4px solid transparent;border-top-color:#dbdbdb;animation:1.5s spin infinite linear}@keyframes spin{to{transform:rotate(360deg)}}\n"] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: LoaderComponent$1, decorators: [{
             type: Component,
-            args: [{ selector: 'app-loader', template: "<div class=\"main-loader\">\r\n  <ng-lottie width=\"300px\" height=\"300px\" [options]=\"options\"></ng-lottie>\r\n</div>", styles: [".main-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:fixed;background:transparent;z-index:99;inset:0}\n"] }]
-        }], ctorParameters: function () { return []; } });
+            args: [{ selector: 'app-loader', template: "<div class=\"main-loader\">\r\n  <img src=\"{{vLoader}}\" alt=\"\" />\r\n  <div class=\"loader-index\">\r\n    <div class=\"loader-index-circle\"></div>\r\n  </div>\r\n</div>", styles: [".main-loader{display:flex;overflow:hidden;align-items:center;justify-content:center;text-align:center;position:fixed;background:transparent;z-index:99;inset:0}.main-loader img{width:45px;position:relative;z-index:2}.main-loader .loader-index{width:100%;height:100%;position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center}.main-loader .loader-index-circle{background:#fff;width:65px;height:65px;border-radius:50%;border:4px solid transparent;border-top-color:#dbdbdb;animation:1.5s spin infinite linear}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
+        }], ctorParameters: function () {
+        return [{ type: Configurations, decorators: [{
+                        type: Optional
+                    }] }];
+    } });
 
 class ProgramListingComponent {
     constructor(responsibilityService) {
@@ -27791,10 +27800,10 @@ class CheckboxListComponent {
     }
 }
 CheckboxListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CheckboxListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CheckboxListComponent, selector: "app-checkbox-list", inputs: { itemsList: "itemsList", selectedItems: "selectedItems", identifierKey: "identifierKey", displayKey: "displayKey", tooltipKey: "tooltipKey", config: "config", twoColumn: "twoColumn" }, outputs: { closeList: "closeList", saveList: "saveList" }, ngImport: i0, template: "<div class=\"add-risk-rc\" [class.animate]=\"animation\">\r\n    <div class=\"add-risk-rc-head vx-d-flex vx-align-center vx-justify-between vx-pl-4 vx-pr-4\">\r\n        <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">{{config?.panelTitle}}</div>\r\n        <!-- <button class=\"add-risk-rc-close\" (click)=close()>\r\n            <i class=\"icons\">&#xe90d;</i>\r\n        </button> -->\r\n    </div>\r\n    <div class=\"add-risk-rc-body\">\r\n        <div class=\"search-block\">\r\n            <i class=\"icons\">&#xe90b;</i>\r\n            <input type=\"text\" placeholder=\"{{config?.searchPlaceholder}}\" [(ngModel)]=\"searchItem\" />\r\n        </div>\r\n        <ng-container *ngIf=\"(itemsList | search:searchItem:displayKey) as searchList\">\r\n            <div class=\"body-top\" *ngIf=\"config?.selectAllEnabled && searchList?.length > 0 && searchItem?.trim()?.length === 0 \">\r\n                <app-cs-checkbox [ngValue]=\"itemsList?.length === selectedItems?.length && selectedItems?.length > 0\"\r\n                    (ngValueChange)=\"selectAll($event)\"><strong> {{itemsList?.length === selectedItems?.length &&\r\n                        selectedItems?.length > 0?'Deselect All':'Select All'}}</strong>\r\n                </app-cs-checkbox>\r\n            </div>\r\n            <div class=\"add-risk-rc-list\">\r\n                <ul [class.two-column]=\"twoColumn\" *ngIf=\"searchList?.length > 0\">\r\n                    <li *ngFor=\"let item  of searchList\" #ulElement>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow !== 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                            (ngValueChange)=\"selectItem(item[identifierKey],$event)\"\r\n                            [appTooltip]=\"tooltipKey ? item[tooltipKey]: item[displayKey]\" placement=\"bottom-left\" delay=\"0\"\r\n                            [tooltipMandatory]=\"true\">\r\n                            {{item[displayKey]}}{{item?.parent_items?.length && config.workflow === 'policy'? ' < ' + item?.parent_items?.join(' < '):'' }}\r\n                        </app-cs-checkbox>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow === 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                        (ngValueChange)=\"selectItem(item[identifierKey],$event)\">\r\n                            <ul class=\"add-category-name\">\r\n                                <li *ngFor=\"let data of item?.parent_items; let i = index\" [appTooltip]=\"data\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"i > 0;\" class=\"icons\">&#xe910;</i>{{data}}\r\n                                </li>\r\n                                <li  [appTooltip]=\"item[displayKey]\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"item?.parent_items?.length > 0\" class=\"icons\">&#xe910;</i> {{item[displayKey]}}\r\n                                </li>\r\n                            </ul>\r\n                        </app-cs-checkbox>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <app-no-data *ngIf=\"searchList.length === 0\"\r\n                [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\"\r\n                [noDataText]=\"config?.noDataText?.length > 0 ? config?.noDataText:'No data to display'\"></app-no-data>\r\n        </ng-container>\r\n\r\n        <app-floating-bar [selectedData]=\"selectedItems|listMapper:itemsList:identifierKey\" [displayElementKey]=\"displayKey\"\r\n            [singularText]=\"config?.floatingTextSingular\"\r\n            [pluralText]=\"config?.floatingTextPlural ?config?.floatingTextPlural:'Users selected'\" (closeEvent)=\"save()\"\r\n            (closeList)=\"close()\" [isDisabled]=\"selectedItems.length === 0 || itemsList.length === 0 \"\r\n            (deleteEvent)=\"deleteItem($event)\"></app-floating-bar>\r\n    </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .add-risk-rc{position:fixed;inset:0 500px 0 0;z-index:1}::ng-deep .add-risk-rc:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .add-risk-rc-head{background:#fbfbfb;height:2.75rem;border-bottom:1px solid #f1f1f1}::ng-deep .add-risk-rc-close{background:transparent;border:none;outline:none;cursor:pointer;color:#000;font-size:12px;display:inline-block;padding:0}::ng-deep .add-risk-rc-body{background:#fff;height:calc(100vh - 2.75rem);padding:2rem}::ng-deep .add-risk-rc-body .search-block{position:relative}::ng-deep .add-risk-rc-body .search-block input{height:2.75rem;line-height:1.5rem;padding:.5rem 1rem .5rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .add-risk-rc-body .search-block input:focus{border-color:#1e5dd3}::ng-deep .add-risk-rc-body .search-block i{position:absolute;left:1rem;font-size:12px;font-weight:400;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .add-risk-rc-body .body-top{display:flex;justify-content:space-between;padding:.5rem 0 0}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox{display:flex}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox label span.value strong{color:#161b2f;font-size:12px;font-weight:600;white-space:nowrap}::ng-deep .add-risk-rc-body .add-risk-rc-list{margin:1rem 0;display:block;align-items:flex-start;flex-wrap:wrap;height:calc(100vh - 16rem);overflow:hidden;overflow-y:auto}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar-track{background-color:transparent}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .add-risk-rc-body .add-risk-rc-list ul{padding:0;margin:0}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li{width:100%;padding:0 0 1rem;list-style:none}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio{display:flex}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label{width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label span.value,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label span.value{width:auto;justify-content:flex-start;line-height:18px!important;font-size:12px!important;color:#161b2f!important}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name{display:flex;justify-content:flex-start;width:auto;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li{list-style:none;color:#747576;font-size:12px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:auto;padding:0 8px 0 0;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li i,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li i{font-size:8px;padding-right:8px}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:first-child,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:first-child{color:#1e5dd3;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:last-of-type,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:last-of-type{color:#34aa44}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column{display:flex;flex-wrap:wrap}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column li{width:50%;padding-right:20px}::ng-deep .add-risk-rc-body app-no-data .no-data-wrapper{height:calc(100vh - 200px)}::ng-deep .add-risk-rc.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both;z-index:-1}::ng-deep .add-risk-rc .message-footer{background:#1e5dd3;border-radius:5px;margin:0 0 0 30px;width:calc(100% - 60px);position:relative;bottom:0}::ng-deep .add-risk-rc .message-footer .message{padding:15px;display:flex;align-items:flex-start}::ng-deep .add-risk-rc .message-footer .message i{width:auto;font-size:16px;color:#fff}::ng-deep .add-risk-rc .message-footer .message span{color:#fff;font-size:12px;line-height:18px;padding-left:9px;font-weight:300}::ng-deep .add-risk-rc .message-footer .footer{border-top:1px solid #1483ef;display:flex;justify-content:space-between;align-items:center;padding:10px 15px}::ng-deep .add-risk-rc .message-footer .footer span{color:#fff;font-size:14px}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper{display:flex}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button{width:60px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:11px;font-weight:500;border:1px solid #fff;text-transform:uppercase;border-radius:2px;outline:none;padding:0;margin:0}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.outline{background:#1e5dd3;color:#fff}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.fill{background:#fff;color:#1e5dd3}@keyframes animate-right{0%{transform:translate(100%)}to{transform:translate(0)}}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CsCheckboxComponent$1, selector: "app-cs-checkbox", inputs: ["disabled", "ngValue", "value", "readonly", "oneLine"], outputs: ["ngValueChange"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NoDataComponent$1, selector: "app-no-data", inputs: ["action", "noDataImage", "noDataText", "noDataButton", "noDataSecButton", "altText", "smallButton", "button"], outputs: ["buttonAction"] }, { kind: "component", type: FloatingBarComponent, selector: "app-floating-bar", inputs: ["selectedData", "selectedGroups", "displayElementKey", "elementId", "singularText", "pluralText", "showNextButton", "showFrequencyText", "showWorkflow", "workflowText", "currentFrequency", "isDisabled", "workflowList", "selectedWorkflow", "workflowPlaceHolder", "mode", "defaultSelected", "groupsEnabled", "nonRemovableUsersList", "removePosition"], outputs: ["closeEvent", "deleteEvent", "closeList", "deleteGroupEvent", "workflowTypeChanged"] }, { kind: "pipe", type: ListMapperPipe, name: "listMapper" }, { kind: "pipe", type: SearchPipe$1, name: "search" }] });
+CheckboxListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CheckboxListComponent, selector: "app-checkbox-list", inputs: { itemsList: "itemsList", selectedItems: "selectedItems", identifierKey: "identifierKey", displayKey: "displayKey", tooltipKey: "tooltipKey", config: "config", twoColumn: "twoColumn" }, outputs: { closeList: "closeList", saveList: "saveList" }, ngImport: i0, template: "<div class=\"add-risk-rc\" [class.animate]=\"animation\">\r\n    <div class=\"add-risk-rc-head vx-d-flex vx-align-center vx-justify-between vx-pl-4 vx-pr-4\">\r\n        <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">{{config?.panelTitle}}</div>\r\n        <!-- <button class=\"add-risk-rc-close\" (click)=close()>\r\n            <i class=\"icons\">&#xe90d;</i>\r\n        </button> -->\r\n    </div>\r\n    <div class=\"add-risk-rc-body\">\r\n        <div class=\"search-block\">\r\n            <i class=\"icons\">&#xe90b;</i>\r\n            <input type=\"text\" placeholder=\"{{config?.searchPlaceholder}}\" [(ngModel)]=\"searchItem\" />\r\n        </div>\r\n        <ng-container *ngIf=\"(itemsList | search:searchItem:displayKey) as searchList\">\r\n            <div class=\"body-top\" *ngIf=\"config?.selectAllEnabled && searchList?.length > 0 && searchItem?.trim()?.length === 0 \">\r\n                <app-cs-checkbox [ngValue]=\"itemsList?.length === selectedItems?.length && selectedItems?.length > 0\"\r\n                    (ngValueChange)=\"selectAll($event)\"><strong> {{itemsList?.length === selectedItems?.length &&\r\n                        selectedItems?.length > 0?'Deselect All':'Select All'}}</strong>\r\n                </app-cs-checkbox>\r\n            </div>\r\n            <div class=\"add-risk-rc-list\" *ngIf=\"searchList?.length > 0\">\r\n                <ul [class.two-column]=\"twoColumn\">\r\n                    <li *ngFor=\"let item  of searchList\" #ulElement>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow !== 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                            (ngValueChange)=\"selectItem(item[identifierKey],$event)\"\r\n                            [appTooltip]=\"tooltipKey ? item[tooltipKey]: item[displayKey]\" placement=\"bottom-left\" delay=\"0\"\r\n                            [tooltipMandatory]=\"true\">\r\n                            {{item[displayKey]}}{{item?.parent_items?.length && config.workflow === 'policy'? ' < ' + item?.parent_items?.join(' < '):'' }}\r\n                        </app-cs-checkbox>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow === 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                        (ngValueChange)=\"selectItem(item[identifierKey],$event)\">\r\n                            <ul class=\"add-category-name\">\r\n                                <li *ngFor=\"let data of item?.parent_items; let i = index\" [appTooltip]=\"data\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"i > 0;\" class=\"icons\">&#xe910;</i>{{data}}\r\n                                </li>\r\n                                <li  [appTooltip]=\"item[displayKey]\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"item?.parent_items?.length > 0\" class=\"icons\">&#xe910;</i> {{item[displayKey]}}\r\n                                </li>\r\n                            </ul>\r\n                        </app-cs-checkbox>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <app-no-data *ngIf=\"searchList.length === 0\"\r\n                [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\"\r\n                [noDataText]=\"config?.noDataText?.length > 0 ? config?.noDataText:'No data to display'\"></app-no-data>\r\n        </ng-container>\r\n\r\n        <app-floating-bar [selectedData]=\"selectedItems|listMapper:itemsList:identifierKey\" [displayElementKey]=\"displayKey\"\r\n            [singularText]=\"config?.floatingTextSingular\"\r\n            [pluralText]=\"config?.floatingTextPlural ?config?.floatingTextPlural:'Users selected'\" (closeEvent)=\"save()\"\r\n            (closeList)=\"close()\" [isDisabled]=\"selectedItems.length === 0 || itemsList.length === 0 \"\r\n            (deleteEvent)=\"deleteItem($event)\"></app-floating-bar>\r\n    </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .add-risk-rc{position:fixed;inset:0 500px 0 0;z-index:1}::ng-deep .add-risk-rc:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .add-risk-rc-head{background:#fbfbfb;height:2.75rem;border-bottom:1px solid #f1f1f1}::ng-deep .add-risk-rc-close{background:transparent;border:none;outline:none;cursor:pointer;color:#000;font-size:12px;display:inline-block;padding:0}::ng-deep .add-risk-rc-body{background:#fff;height:calc(100vh - 2.75rem);padding:2rem}::ng-deep .add-risk-rc-body .search-block{position:relative}::ng-deep .add-risk-rc-body .search-block input{height:2.75rem;line-height:1.5rem;padding:.5rem 1rem .5rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .add-risk-rc-body .search-block input:focus{border-color:#1e5dd3}::ng-deep .add-risk-rc-body .search-block i{position:absolute;left:1rem;font-size:12px;font-weight:400;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .add-risk-rc-body .body-top{display:flex;justify-content:space-between;padding:.5rem 0 0}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox{display:flex}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox label span.value strong{color:#161b2f;font-size:12px;font-weight:600;white-space:nowrap}::ng-deep .add-risk-rc-body .add-risk-rc-list{margin:1rem 0;display:block;align-items:flex-start;flex-wrap:wrap;height:calc(100vh - 16rem);overflow:hidden;overflow-y:auto}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar-track{background-color:transparent}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .add-risk-rc-body .add-risk-rc-list ul{padding:0;margin:0}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li{width:100%;padding:0 0 1rem;list-style:none}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio{display:flex}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label{width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label span.value,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label span.value{width:auto;justify-content:flex-start;line-height:18px!important;font-size:12px!important;color:#161b2f!important}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name{display:flex;justify-content:flex-start;width:auto;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li{list-style:none;color:#747576;font-size:12px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:auto;padding:0 8px 0 0;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li i,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li i{font-size:8px;padding-right:8px}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:first-child,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:first-child{color:#1e5dd3;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:last-of-type,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:last-of-type{color:#34aa44}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column{display:flex;flex-wrap:wrap}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column li{width:50%;padding-right:20px}::ng-deep .add-risk-rc-body app-no-data .no-data-wrapper{height:calc(100vh - 200px)}::ng-deep .add-risk-rc.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both;z-index:-1}::ng-deep .add-risk-rc .message-footer{background:#1e5dd3;border-radius:5px;margin:0 0 0 30px;width:calc(100% - 60px);position:relative;bottom:0}::ng-deep .add-risk-rc .message-footer .message{padding:15px;display:flex;align-items:flex-start}::ng-deep .add-risk-rc .message-footer .message i{width:auto;font-size:16px;color:#fff}::ng-deep .add-risk-rc .message-footer .message span{color:#fff;font-size:12px;line-height:18px;padding-left:9px;font-weight:300}::ng-deep .add-risk-rc .message-footer .footer{border-top:1px solid #1483ef;display:flex;justify-content:space-between;align-items:center;padding:10px 15px}::ng-deep .add-risk-rc .message-footer .footer span{color:#fff;font-size:14px}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper{display:flex}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button{width:60px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:11px;font-weight:500;border:1px solid #fff;text-transform:uppercase;border-radius:2px;outline:none;padding:0;margin:0}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.outline{background:#1e5dd3;color:#fff}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.fill{background:#fff;color:#1e5dd3}@keyframes animate-right{0%{transform:translate(100%)}to{transform:translate(0)}}\n"], dependencies: [{ kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CsCheckboxComponent$1, selector: "app-cs-checkbox", inputs: ["disabled", "ngValue", "value", "readonly", "oneLine"], outputs: ["ngValueChange"] }, { kind: "directive", type: ToolTipDirective, selector: "[appTooltip]", inputs: ["appTooltip", "placement", "type", "tooltipMandatory", "showTooltip", "animate"] }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: NoDataComponent$1, selector: "app-no-data", inputs: ["action", "noDataImage", "noDataText", "noDataButton", "noDataSecButton", "altText", "smallButton", "button"], outputs: ["buttonAction"] }, { kind: "component", type: FloatingBarComponent, selector: "app-floating-bar", inputs: ["selectedData", "selectedGroups", "displayElementKey", "elementId", "singularText", "pluralText", "showNextButton", "showFrequencyText", "showWorkflow", "workflowText", "currentFrequency", "isDisabled", "workflowList", "selectedWorkflow", "workflowPlaceHolder", "mode", "defaultSelected", "groupsEnabled", "nonRemovableUsersList", "removePosition"], outputs: ["closeEvent", "deleteEvent", "closeList", "deleteGroupEvent", "workflowTypeChanged"] }, { kind: "pipe", type: ListMapperPipe, name: "listMapper" }, { kind: "pipe", type: SearchPipe$1, name: "search" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CheckboxListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-checkbox-list', template: "<div class=\"add-risk-rc\" [class.animate]=\"animation\">\r\n    <div class=\"add-risk-rc-head vx-d-flex vx-align-center vx-justify-between vx-pl-4 vx-pr-4\">\r\n        <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">{{config?.panelTitle}}</div>\r\n        <!-- <button class=\"add-risk-rc-close\" (click)=close()>\r\n            <i class=\"icons\">&#xe90d;</i>\r\n        </button> -->\r\n    </div>\r\n    <div class=\"add-risk-rc-body\">\r\n        <div class=\"search-block\">\r\n            <i class=\"icons\">&#xe90b;</i>\r\n            <input type=\"text\" placeholder=\"{{config?.searchPlaceholder}}\" [(ngModel)]=\"searchItem\" />\r\n        </div>\r\n        <ng-container *ngIf=\"(itemsList | search:searchItem:displayKey) as searchList\">\r\n            <div class=\"body-top\" *ngIf=\"config?.selectAllEnabled && searchList?.length > 0 && searchItem?.trim()?.length === 0 \">\r\n                <app-cs-checkbox [ngValue]=\"itemsList?.length === selectedItems?.length && selectedItems?.length > 0\"\r\n                    (ngValueChange)=\"selectAll($event)\"><strong> {{itemsList?.length === selectedItems?.length &&\r\n                        selectedItems?.length > 0?'Deselect All':'Select All'}}</strong>\r\n                </app-cs-checkbox>\r\n            </div>\r\n            <div class=\"add-risk-rc-list\">\r\n                <ul [class.two-column]=\"twoColumn\" *ngIf=\"searchList?.length > 0\">\r\n                    <li *ngFor=\"let item  of searchList\" #ulElement>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow !== 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                            (ngValueChange)=\"selectItem(item[identifierKey],$event)\"\r\n                            [appTooltip]=\"tooltipKey ? item[tooltipKey]: item[displayKey]\" placement=\"bottom-left\" delay=\"0\"\r\n                            [tooltipMandatory]=\"true\">\r\n                            {{item[displayKey]}}{{item?.parent_items?.length && config.workflow === 'policy'? ' < ' + item?.parent_items?.join(' < '):'' }}\r\n                        </app-cs-checkbox>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow === 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                        (ngValueChange)=\"selectItem(item[identifierKey],$event)\">\r\n                            <ul class=\"add-category-name\">\r\n                                <li *ngFor=\"let data of item?.parent_items; let i = index\" [appTooltip]=\"data\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"i > 0;\" class=\"icons\">&#xe910;</i>{{data}}\r\n                                </li>\r\n                                <li  [appTooltip]=\"item[displayKey]\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"item?.parent_items?.length > 0\" class=\"icons\">&#xe910;</i> {{item[displayKey]}}\r\n                                </li>\r\n                            </ul>\r\n                        </app-cs-checkbox>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <app-no-data *ngIf=\"searchList.length === 0\"\r\n                [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\"\r\n                [noDataText]=\"config?.noDataText?.length > 0 ? config?.noDataText:'No data to display'\"></app-no-data>\r\n        </ng-container>\r\n\r\n        <app-floating-bar [selectedData]=\"selectedItems|listMapper:itemsList:identifierKey\" [displayElementKey]=\"displayKey\"\r\n            [singularText]=\"config?.floatingTextSingular\"\r\n            [pluralText]=\"config?.floatingTextPlural ?config?.floatingTextPlural:'Users selected'\" (closeEvent)=\"save()\"\r\n            (closeList)=\"close()\" [isDisabled]=\"selectedItems.length === 0 || itemsList.length === 0 \"\r\n            (deleteEvent)=\"deleteItem($event)\"></app-floating-bar>\r\n    </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .add-risk-rc{position:fixed;inset:0 500px 0 0;z-index:1}::ng-deep .add-risk-rc:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .add-risk-rc-head{background:#fbfbfb;height:2.75rem;border-bottom:1px solid #f1f1f1}::ng-deep .add-risk-rc-close{background:transparent;border:none;outline:none;cursor:pointer;color:#000;font-size:12px;display:inline-block;padding:0}::ng-deep .add-risk-rc-body{background:#fff;height:calc(100vh - 2.75rem);padding:2rem}::ng-deep .add-risk-rc-body .search-block{position:relative}::ng-deep .add-risk-rc-body .search-block input{height:2.75rem;line-height:1.5rem;padding:.5rem 1rem .5rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .add-risk-rc-body .search-block input:focus{border-color:#1e5dd3}::ng-deep .add-risk-rc-body .search-block i{position:absolute;left:1rem;font-size:12px;font-weight:400;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .add-risk-rc-body .body-top{display:flex;justify-content:space-between;padding:.5rem 0 0}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox{display:flex}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox label span.value strong{color:#161b2f;font-size:12px;font-weight:600;white-space:nowrap}::ng-deep .add-risk-rc-body .add-risk-rc-list{margin:1rem 0;display:block;align-items:flex-start;flex-wrap:wrap;height:calc(100vh - 16rem);overflow:hidden;overflow-y:auto}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar-track{background-color:transparent}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .add-risk-rc-body .add-risk-rc-list ul{padding:0;margin:0}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li{width:100%;padding:0 0 1rem;list-style:none}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio{display:flex}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label{width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label span.value,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label span.value{width:auto;justify-content:flex-start;line-height:18px!important;font-size:12px!important;color:#161b2f!important}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name{display:flex;justify-content:flex-start;width:auto;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li{list-style:none;color:#747576;font-size:12px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:auto;padding:0 8px 0 0;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li i,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li i{font-size:8px;padding-right:8px}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:first-child,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:first-child{color:#1e5dd3;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:last-of-type,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:last-of-type{color:#34aa44}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column{display:flex;flex-wrap:wrap}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column li{width:50%;padding-right:20px}::ng-deep .add-risk-rc-body app-no-data .no-data-wrapper{height:calc(100vh - 200px)}::ng-deep .add-risk-rc.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both;z-index:-1}::ng-deep .add-risk-rc .message-footer{background:#1e5dd3;border-radius:5px;margin:0 0 0 30px;width:calc(100% - 60px);position:relative;bottom:0}::ng-deep .add-risk-rc .message-footer .message{padding:15px;display:flex;align-items:flex-start}::ng-deep .add-risk-rc .message-footer .message i{width:auto;font-size:16px;color:#fff}::ng-deep .add-risk-rc .message-footer .message span{color:#fff;font-size:12px;line-height:18px;padding-left:9px;font-weight:300}::ng-deep .add-risk-rc .message-footer .footer{border-top:1px solid #1483ef;display:flex;justify-content:space-between;align-items:center;padding:10px 15px}::ng-deep .add-risk-rc .message-footer .footer span{color:#fff;font-size:14px}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper{display:flex}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button{width:60px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:11px;font-weight:500;border:1px solid #fff;text-transform:uppercase;border-radius:2px;outline:none;padding:0;margin:0}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.outline{background:#1e5dd3;color:#fff}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.fill{background:#fff;color:#1e5dd3}@keyframes animate-right{0%{transform:translate(100%)}to{transform:translate(0)}}\n"] }]
+            args: [{ selector: 'app-checkbox-list', template: "<div class=\"add-risk-rc\" [class.animate]=\"animation\">\r\n    <div class=\"add-risk-rc-head vx-d-flex vx-align-center vx-justify-between vx-pl-4 vx-pr-4\">\r\n        <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">{{config?.panelTitle}}</div>\r\n        <!-- <button class=\"add-risk-rc-close\" (click)=close()>\r\n            <i class=\"icons\">&#xe90d;</i>\r\n        </button> -->\r\n    </div>\r\n    <div class=\"add-risk-rc-body\">\r\n        <div class=\"search-block\">\r\n            <i class=\"icons\">&#xe90b;</i>\r\n            <input type=\"text\" placeholder=\"{{config?.searchPlaceholder}}\" [(ngModel)]=\"searchItem\" />\r\n        </div>\r\n        <ng-container *ngIf=\"(itemsList | search:searchItem:displayKey) as searchList\">\r\n            <div class=\"body-top\" *ngIf=\"config?.selectAllEnabled && searchList?.length > 0 && searchItem?.trim()?.length === 0 \">\r\n                <app-cs-checkbox [ngValue]=\"itemsList?.length === selectedItems?.length && selectedItems?.length > 0\"\r\n                    (ngValueChange)=\"selectAll($event)\"><strong> {{itemsList?.length === selectedItems?.length &&\r\n                        selectedItems?.length > 0?'Deselect All':'Select All'}}</strong>\r\n                </app-cs-checkbox>\r\n            </div>\r\n            <div class=\"add-risk-rc-list\" *ngIf=\"searchList?.length > 0\">\r\n                <ul [class.two-column]=\"twoColumn\">\r\n                    <li *ngFor=\"let item  of searchList\" #ulElement>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow !== 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                            (ngValueChange)=\"selectItem(item[identifierKey],$event)\"\r\n                            [appTooltip]=\"tooltipKey ? item[tooltipKey]: item[displayKey]\" placement=\"bottom-left\" delay=\"0\"\r\n                            [tooltipMandatory]=\"true\">\r\n                            {{item[displayKey]}}{{item?.parent_items?.length && config.workflow === 'policy'? ' < ' + item?.parent_items?.join(' < '):'' }}\r\n                        </app-cs-checkbox>\r\n                        <app-cs-checkbox *ngIf=\"config.workflow === 'policy'\" [ngValue]=\"selectedItems.includes(item[identifierKey])\"\r\n                        (ngValueChange)=\"selectItem(item[identifierKey],$event)\">\r\n                            <ul class=\"add-category-name\">\r\n                                <li *ngFor=\"let data of item?.parent_items; let i = index\" [appTooltip]=\"data\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"i > 0;\" class=\"icons\">&#xe910;</i>{{data}}\r\n                                </li>\r\n                                <li  [appTooltip]=\"item[displayKey]\" placement=\"bottom-left\" type=\"black\" delay=\"0\" [tooltipMandatory]=\"true\">\r\n                                    <i *ngIf=\"item?.parent_items?.length > 0\" class=\"icons\">&#xe910;</i> {{item[displayKey]}}\r\n                                </li>\r\n                            </ul>\r\n                        </app-cs-checkbox>\r\n                    </li>\r\n                </ul>\r\n            </div>\r\n            <app-no-data *ngIf=\"searchList.length === 0\"\r\n                [noDataImage]=\"'https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/search-data.svg'\"\r\n                [noDataText]=\"config?.noDataText?.length > 0 ? config?.noDataText:'No data to display'\"></app-no-data>\r\n        </ng-container>\r\n\r\n        <app-floating-bar [selectedData]=\"selectedItems|listMapper:itemsList:identifierKey\" [displayElementKey]=\"displayKey\"\r\n            [singularText]=\"config?.floatingTextSingular\"\r\n            [pluralText]=\"config?.floatingTextPlural ?config?.floatingTextPlural:'Users selected'\" (closeEvent)=\"save()\"\r\n            (closeList)=\"close()\" [isDisabled]=\"selectedItems.length === 0 || itemsList.length === 0 \"\r\n            (deleteEvent)=\"deleteItem($event)\"></app-floating-bar>\r\n    </div>\r\n</div>\r\n", styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";@import\"https://cdn.v-comply.com/design-system/css/display/display.css\";@import\"https://cdn.v-comply.com/design-system/css/alignment/alignment.css\";@import\"https://cdn.v-comply.com/design-system/css/text/text.css\";@import\"https://cdn.v-comply.com/design-system/css/color/color.css\";@import\"https://cdn.v-comply.com/design-system/css/width/width.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-top.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-left.css\";@import\"https://cdn.v-comply.com/design-system/css/margin/margin-right.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-top.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-bottom.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-left.css\";@import\"https://cdn.v-comply.com/design-system/css/padding/padding-right.css\";::ng-deep .add-risk-rc{position:fixed;inset:0 500px 0 0;z-index:1}::ng-deep .add-risk-rc:before{background:#1E5DD3;content:\"\";position:absolute;top:0;left:0;right:0;width:100%;height:3px}::ng-deep .add-risk-rc-head{background:#fbfbfb;height:2.75rem;border-bottom:1px solid #f1f1f1}::ng-deep .add-risk-rc-close{background:transparent;border:none;outline:none;cursor:pointer;color:#000;font-size:12px;display:inline-block;padding:0}::ng-deep .add-risk-rc-body{background:#fff;height:calc(100vh - 2.75rem);padding:2rem}::ng-deep .add-risk-rc-body .search-block{position:relative}::ng-deep .add-risk-rc-body .search-block input{height:2.75rem;line-height:1.5rem;padding:.5rem 1rem .5rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .add-risk-rc-body .search-block input:focus{border-color:#1e5dd3}::ng-deep .add-risk-rc-body .search-block i{position:absolute;left:1rem;font-size:12px;font-weight:400;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .add-risk-rc-body .body-top{display:flex;justify-content:space-between;padding:.5rem 0 0}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox{display:flex}::ng-deep .add-risk-rc-body .body-top app-cs-checkbox label span.value strong{color:#161b2f;font-size:12px;font-weight:600;white-space:nowrap}::ng-deep .add-risk-rc-body .add-risk-rc-list{margin:1rem 0;display:block;align-items:flex-start;flex-wrap:wrap;height:calc(100vh - 16rem);overflow:hidden;overflow-y:auto}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar-track{background-color:transparent}::ng-deep .add-risk-rc-body .add-risk-rc-list::-webkit-scrollbar{width:3px;height:3px;background-color:transparent;position:absolute}::ng-deep .add-risk-rc-body .add-risk-rc-list ul{padding:0;margin:0}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li{width:100%;padding:0 0 1rem;list-style:none}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio{display:flex}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label{width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox label span.value,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio label span.value{width:auto;justify-content:flex-start;line-height:18px!important;font-size:12px!important;color:#161b2f!important}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name{display:flex;justify-content:flex-start;width:auto;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li{list-style:none;color:#747576;font-size:12px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;width:auto;padding:0 8px 0 0;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li i,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li i{font-size:8px;padding-right:8px}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:first-child,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:first-child{color:#1e5dd3;max-width:100%}::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-checkbox ul.add-category-name li:last-of-type,::ng-deep .add-risk-rc-body .add-risk-rc-list ul li app-cs-radio ul.add-category-name li:last-of-type{color:#34aa44}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column{display:flex;flex-wrap:wrap}::ng-deep .add-risk-rc-body .add-risk-rc-list ul.two-column li{width:50%;padding-right:20px}::ng-deep .add-risk-rc-body app-no-data .no-data-wrapper{height:calc(100vh - 200px)}::ng-deep .add-risk-rc.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both;z-index:-1}::ng-deep .add-risk-rc .message-footer{background:#1e5dd3;border-radius:5px;margin:0 0 0 30px;width:calc(100% - 60px);position:relative;bottom:0}::ng-deep .add-risk-rc .message-footer .message{padding:15px;display:flex;align-items:flex-start}::ng-deep .add-risk-rc .message-footer .message i{width:auto;font-size:16px;color:#fff}::ng-deep .add-risk-rc .message-footer .message span{color:#fff;font-size:12px;line-height:18px;padding-left:9px;font-weight:300}::ng-deep .add-risk-rc .message-footer .footer{border-top:1px solid #1483ef;display:flex;justify-content:space-between;align-items:center;padding:10px 15px}::ng-deep .add-risk-rc .message-footer .footer span{color:#fff;font-size:14px}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper{display:flex}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button{width:60px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:11px;font-weight:500;border:1px solid #fff;text-transform:uppercase;border-radius:2px;outline:none;padding:0;margin:0}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.outline{background:#1e5dd3;color:#fff}::ng-deep .add-risk-rc .message-footer .footer .button-wrapper button.fill{background:#fff;color:#1e5dd3}@keyframes animate-right{0%{transform:translate(100%)}to{transform:translate(0)}}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { itemsList: [{
                 type: Input
             }], selectedItems: [{