vcomply-workflow-engine 6.0.79 → 6.0.80

package/fesm2022/vcomply-workflow-engine.mjs

@@ -11789,10 +11789,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
 const DEFAULT_TIME = '11:30 PM';
 const DEFAULT_24HR = '23:30:00';
 
+const API = {
+    subscriptionList: `subscriptionList`,
+    goToPolicyWorkroom: `/all/policy/workroom?id=`,
+    editPolicy: `/all/policy/edit-policy?id=`,
+    responsibilityList: `sailsResponsibilitiesList`,
+};
+const PROGRAM_LIST_API = {
+    programList: 'sailsProgramList',
+    categoryList: 'sailsProgramCategories',
+};
+
 class FrequencyService {
-    constructor(http, authService, config) {
+    constructor(http, authService, grcService, config) {
         this.http = http;
         this.authService = authService;
+        this.grcService = grcService;
         this.monthArray = [
             'January',
             'February',
@@ -12336,6 +12348,18 @@ class FrequencyService {
             .post(this.env.responsibilityPost + 'manage_responsibilities_reports_count', payload, { headers })
             .pipe(retry(1));
     }
+    getAllResponsibilities(pageNo) {
+        const businessCycle = this.grcService.getBusinessCycle();
+        const formattedCycle = businessCycle.selected_cycle
+            ? dayjs(businessCycle.selected_cycle.split('-')[0]).format('YYYY-MM-DD') +
+                ':' +
+                dayjs(businessCycle.selected_cycle.split('-')[1]).format('YYYY-MM-DD')
+            : '';
+        const headers = new HttpHeaders()
+            .set('token', this.authService.getAuthorizationToken())
+            .set('biz_cycle', formattedCycle);
+        return this.http.get(this.env.complianceGet + API.responsibilityList + `&page=${pageNo}&limit=10`, { headers });
+    }
     formatDate() {
         const currentDate = new Date();
         const day = String(currentDate?.getDate()).padStart(2, '0');
@@ -12590,7 +12614,7 @@ class FrequencyService {
         const month = monthNames[date.getMonth()];
         return `${day}-${month}-${year}~~0`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FrequencyService, deps: [{ token: i1.HttpClient }, { token: AuthService$1 }, { token: Configurations, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FrequencyService, deps: [{ token: i1.HttpClient }, { token: AuthService$1 }, { token: GrcService }, { token: Configurations, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FrequencyService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FrequencyService, decorators: [{
@@ -12598,7 +12622,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: AuthService$1 }, { type: Configurations, decorators: [{
+        }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: AuthService$1 }, { type: GrcService }, { type: Configurations, decorators: [{
                     type: Optional
                 }] }]; } });
 
@@ -13856,7 +13880,6 @@ class LinkResponsibilityListComponent {
     ngOnInit() {
         this.getResponsibilityValues();
         this.getResponsibilityList();
-        this.setResponsibilitiesCount();
     }
     back() {
         this.closeButton.emit();
@@ -13880,20 +13903,55 @@ class LinkResponsibilityListComponent {
             this.animation = false;
         }, 300);
     }
-    getResponsibilityList() {
+    getResponsibilityList(pageNo = 1) {
         this.responsibilityLoader = true;
         this.frequencyService
-            ?.getResponsibilityList(this.responsibilityPayload)
-            .subscribe((res) => {
-            this.responsibilitiesData = res[0];
-            this.responsibilityLoader = false;
+            ?.getAllResponsibilities(pageNo).subscribe({
+            next: (res) => {
+                if (res?.data) {
+                    this.responsibilitiesData = this.mapResponsibilitiesData(res.data);
+                }
+                this.responsibilityLoader = false;
+            },
+            error: () => {
+                this.responsibilityLoader = false;
+            }
         });
     }
+    mapResponsibilitiesData(res) {
+        const pageSize = 10;
+        const currentPage = res?.page || 1;
+        const totalItems = res?.total || 0;
+        const startIndex = (currentPage - 1) * pageSize + 1;
+        const endIndex = Math.min(startIndex + pageSize - 1, totalItems);
+        return {
+            data: res.responsibilities.map((item) => ({
+                ReportId: item?.rid,
+                ReportName: item?.title,
+                ControlId: item?.id ? `[CID-${item.id}]` : '',
+                status: item?.status,
+                frequency: item?.frequency,
+                assignor: item?.assignor,
+                assignees: item?.assignees,
+                responsibilityCenters: item?.responsibility_centers,
+                reviewers: item?.reviewers,
+                type: item?.type,
+                complianceType: item?.compliance_type,
+                category_details_array: item?.category_details_array || [],
+            })),
+            total_responsibilities: totalItems,
+            total_pages: Math.ceil(totalItems / pageSize),
+            responsibilityCurrentPage: currentPage,
+            responsibilities_from: startIndex,
+            responsibilities_to: endIndex
+        };
+    }
     responsibilityPageChange(pageNumber) {
-        this.responsibilityCurrentPage = pageNumber;
-        this.responsibilityPayload.pageNo = this.responsibilityCurrentPage;
-        this.responsibilityPayload.searchText = this.responsibilitySearchText;
-        this.getResponsibilityList();
+        if (pageNumber !== this.responsibilitiesData.responsibilityCurrentPage) {
+            this.responsibilityCurrentPage = pageNumber;
+            this.responsibilityPayload.pageNo = pageNumber;
+            this.getResponsibilityList(pageNumber);
+        }
     }
     deleteItem(item) {
         const index = this.selectedResponsibilityId.findIndex((element) => element == item[this.respIdKey]);
@@ -13920,7 +13978,6 @@ class LinkResponsibilityListComponent {
         this.responsibilityCurrentPage = 1;
         this.responsibilityPayload.pageNo = this.responsibilityCurrentPage;
         this.getResponsibilityList();
-        this.setResponsibilitiesCount();
     }
     setResponsibilitiesCount() {
         const payload = JSON.parse(JSON.stringify(this.responsibilityPayload));
@@ -13974,11 +14031,11 @@ class LinkResponsibilityListComponent {
             : false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinkResponsibilityListComponent, deps: [{ token: FrequencyService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinkResponsibilityListComponent, selector: "app-link-responsibility-list", inputs: { onCompletionOfResponsibility: "onCompletionOfResponsibility", feature: "feature", respIdKey: "respIdKey", selectedResponsibilityValues: "selectedResponsibilityValues", radioSelection: "radioSelection" }, outputs: { closeButton: "closeButton", selectedResponsibility: "selectedResponsibility" }, ngImport: i0, template: "<div class=\"frequency-responsibility-list\" [class.animate]=\"animation\">\n  <div\n    class=\"frequency-responsibility-list-head vx-p-3 vx-d-flex vx-align-center vx-justify-between\"\n  >\n    <div class=\"vx-d-flex vx-align-center\">\n      <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Responsibility</div>\n    </div>\n  </div>\n  <div class=\"frequency-responsibility-list-body\">\n    <div\n      *ngIf=\"responsibilitiesData?.allResponsibilityCount > 0\"\n      class=\"vx-d-flex vx-align-center vx-justify-between vx-mb-2\"\n    >\n      <ng-container *ngFor=\"let tab of responsibilityTabs; let i = index\">\n        <div\n          class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\"\n          [class.active]=\"currentTab === i + 1 || (currentTab === 0 && i === 3)\"\n          (click)=\"onClickTabChange(tab)\"\n          [class.pointer-none]=\"responsibilityLoader\"\n        >\n          <div class=\"left vx-d-block vx-w-100\">\n            <div class=\"label vx-d-flex vx-align-center\">\n              <label\n                class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\"\n                >{{ tab.name }}</label\n              >\n            </div>\n          </div>\n          <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\n            <span\n              class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\"\n              >{{\n                responsibilityTabCount[typeToCountProperty[tab.type]] || 0\n              }}</span\n            >\n          </div>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"frequency-responsibility-list-search vx-mb-2\">\n      <i class=\"icons vx-fs-12\">&#xe90b;</i>\n      <input\n        type=\"text\"\n        [(ngModel)]=\"responsibilitySearchText\"\n        (keyup.enter)=\"search()\"\n        placeholder=\"Search Responsibilities\"\n      />\n    </div>\n    <app-pagination\n      *ngIf=\"!responsibilityLoader && responsibilitiesData?.total_pages > 1\"\n      [start]=\"responsibilitiesData?.responsibilities_from\"\n      [end]=\"responsibilitiesData?.responsibilities_to\"\n      [total]=\"responsibilitiesData?.total_responsibilities\"\n      [pageCount]=\"responsibilitiesData?.total_pages\"\n      [currentPage]=\"responsibilityCurrentPage\"\n      (selectedPage)=\"responsibilityPageChange($event)\"\n    >\n    </app-pagination>\n    <app-loader-inline *ngIf=\"responsibilityLoader\"></app-loader-inline>\n    <div\n      class=\"frequency-responsibility-list-mid vx-mb-4\"\n      [class.with-pagination]=\"\n        !responsibilityLoader && responsibilitiesData?.total_pages > 1\n      \"\n    >\n      <app-no-data\n        *ngIf=\"\n          responsibilitiesData?.data?.length === 0 && !responsibilityLoader\n        \"\n        [noDataImage]=\"noDataImagePath\"\n        [noDataText]=\"noDataMessage\"\n      ></app-no-data>\n      <ng-container\n        *ngIf=\"responsibilitiesData?.data?.length > 0 && !responsibilityLoader\"\n      >\n        <div class=\"table-header\">\n          <div class=\"table-row\">\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              #\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITIES\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility-center\"\n              *ngIf=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITY CENTER\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\"\n            >\n              PROGRAMS\n            </div>\n          </div>\n        </div>\n        <div class=\"table-body\">\n          <div\n            class=\"table-row\"\n            [class.active]=\"\n              selectedResponsibilityId?.includes(responsibility?.ReportId)\n            \"\n            *ngFor=\"\n              let responsibility of responsibilitiesData?.data;\n              let i = index\n            \"\n          >\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              <div\n                class=\"sr-no\"\n                [appTooltip]=\"responsibilitiesData?.responsibilities_from + i\"\n                placement=\"bottom\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibilitiesData?.responsibilities_from + i }}\n              </div>\n              <app-cs-checkbox\n                [ngValue]=\"\n                  selectedResponsibilityId?.includes(responsibility?.ReportId)\n                \"\n                (ngValueChange)=\"selectResp(responsibility?.ReportId, $event)\"\n              >\n              </app-cs-checkbox>\n            </div>\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              <div\n                class=\"value vx-fs-12 vx-label-txt vx-pr-5\"\n                [appTooltip]=\"responsibility?.ReportName\"\n                placement=\"bottom-left\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibility?.ControlId }} {{ responsibility?.ReportName }}\n              </div>\n            </div>\n\n            <div\n              *ngIf=\"\n                responsibility?.category_details_array[0]\n                  ?.category_name as categoryName\n              \"\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\"\n            >\n              <div class=\"program-inner vx-d-block\">\n                <div\n                  class=\"program-value vx-fs-11 vx-label-txt vx-pr-5\"\n                  [appTooltip]=\"\n                    responsibility?.category_details_array[0]?.category_name ??\n                    '--'\n                  \"\n                  placement=\"bottom-left\"\n                  delay=\"0\"\n                  type=\"black\"\n                  [tooltipMandatory]=\"true\"\n                >\n                  {{ categoryName ?? \"--\" }}\n                </div>\n                <div\n                  *ngIf=\"\n                    responsibility?.category_details_array[0]\n                      ?.parent_category_name?.length\n                  \"\n                  class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                >\n                  <div\n                    class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                  >\n                    Within\n                  </div>\n                  <div\n                    *ngIf=\"\n                      responsibility?.category_details_array[0]?.parent_category_name\n                        ?.slice()\n                        ?.reverse()\n                        ?.join(' < ') as parent_category\n                    \"\n                    class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                    [appTooltip]=\"parent_category\"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"true\"\n                  >\n                    {{ parent_category }}\n                  </div>\n                </div>\n              </div>\n              <button\n                *ngIf=\"responsibility?.category_details_array?.length >= 2\"\n                appPopover\n                (click)=\"programPopup.popover()\"\n                placement=\"right\"\n                class=\"program-count vx-fs-11 vx-fw-500 vx-txt-white vx-p-0 vx-pl-1 vx-pr-1 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"\n              >\n                +{{ responsibility?.category_details_array?.length - 1 }}\n              </button>\n              <app-popover #programPopup>\n                <div class=\"wf-action-list\">\n                  <ul class=\"action-item\">\n                    <li\n                      *ngFor=\"\n                        let subCategory of responsibility?.category_details_array\n                          | slice : 1\n                      \"\n                    >\n                      <div class=\"avatar-card\">\n                        <div class=\"vx-d-block vx-w-100\">\n                          <span\n                            class=\"value\"\n                            [appTooltip]=\"subCategory?.category_name\"\n                            placement=\"bottom-left\"\n                            delay=\"0\"\n                            type=\"black\"\n                            [tooltipMandatory]=\"true\"\n                            >{{ subCategory?.category_name }}</span\n                          >\n                          <div\n                            *ngIf=\"\n                              responsibility?.category_details_array[0]\n                                ?.parent_category_name?.length\n                            \"\n                            class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                          >\n                            <div\n                              class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                            >\n                              Within\n                            </div>\n                            <div\n                              *ngIf=\"\n                                responsibility?.category_details_array[0]?.parent_category_name\n                                  ?.slice()\n                                  ?.reverse()\n                                  ?.join(' < ') as parent_category\n                              \"\n                              class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                              [appTooltip]=\"parent_category\"\n                              placement=\"bottom-left\"\n                              delay=\"0\"\n                              type=\"black\"\n                              [tooltipMandatory]=\"true\"\n                            >\n                              {{ parent_category }}\n                            </div>\n                          </div>\n                        </div>\n                      </div>\n                    </li>\n                  </ul>\n                </div>\n              </app-popover>\n            </div>\n          </div>\n        </div>\n      </ng-container>\n    </div>\n    <app-floating-bar\n      *ngIf=\"!responsibilityLoader\"\n      [selectedData]=\"isValidObj ? selectedResponsibilityValues : []\"\n      [displayElementKey]=\"'ReportName'\"\n      (closeList)=\"back()\"\n      (closeEvent)=\"save($event)\"\n      (deleteEvent)=\"deleteItem($event)\"\n      [isDisabled]=\"!isValidObj\"\n    ></app-floating-bar>\n  </div>\n</div>\n", 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\";@import\"https://cdn.v-comply.com/design-system/css/table-card/table-card.css\";::ng-deep .frequency-responsibility-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:31.25rem;bottom:0;left:0}::ng-deep .frequency-responsibility-list.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both}::ng-deep .frequency-responsibility-list-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-responsibility-list-head .arrow{cursor:pointer}::ng-deep .frequency-responsibility-list-body{background:#fff;height:calc(100vh - 2.75rem);padding:1.5rem .75rem 1.5rem 2rem}::ng-deep .frequency-responsibility-list-body app-pagination .wk-pagination-sec-ds{border-radius:0;padding:0 0 .5rem}::ng-deep .frequency-responsibility-list-body app-floating-bar .floating-bar{padding:0;position:relative;left:-1rem;width:calc(100% + 2rem)}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar{padding-left:0!important;padding-right:0!important}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar .userGroup-floating-bar-container .left .chip span{max-width:240px}::ng-deep .frequency-responsibility-list-search{position:relative}::ng-deep .frequency-responsibility-list-search input{height:2.75rem;line-height:1.5rem;padding:.75rem .75rem .75rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .frequency-responsibility-list-search input::placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search i{position:absolute;left:1rem;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .frequency-responsibility-list-mid{height:calc(100vh - 17.5rem);overflow:auto}::ng-deep .frequency-responsibility-list-mid::-webkit-scrollbar-track{background-color:#fff}::ng-deep .frequency-responsibility-list-mid.with-pagination{height:calc(100vh - 19.5rem)}::ng-deep .frequency-responsibility-list-mid .table-header{background:#fff;position:sticky;top:0;z-index:1}::ng-deep .frequency-responsibility-list-mid .table-header .table-column{color:#161b2f!important;line-height:.75rem!important;min-height:1.875rem!important}::ng-deep .frequency-responsibility-list-mid .table-body{position:relative}::ng-deep .frequency-responsibility-list-mid .table-body .table-row{background:#fff;border-radius:.25rem;border:1px solid #f1f1f1;margin-bottom:.25rem}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial .sr-no,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial .sr-no{opacity:0}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial app-cs-checkbox,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial app-cs-checkbox{opacity:1}::ng-deep .frequency-responsibility-list-mid .table-row{display:flex;justify-content:space-between;position:relative}::ng-deep .frequency-responsibility-list-mid .table-row .table-column{color:#747576;min-height:2.5rem;position:relative;width:100%}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial{width:2rem;max-width:2rem;justify-content:center}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial .sr-no{width:1rem;background:#f8f8f8;writing-mode:vertical-lr;color:#747576;font-size:.625rem;font-weight:500;display:flex;height:2.5rem;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{position:absolute;top:.75rem;left:.5rem;width:1rem;height:1rem;opacity:0;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox .radio-item{position:absolute}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{display:flex}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility{width:calc(100% - 15.5rem);min-width:calc(100% - 15.5rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility.with-rc{width:calc(100% - 31rem);min-width:calc(100% - 31rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center{width:15.5rem;min-width:15.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program{width:13.5rem;min-width:13.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}@keyframes animate-right{0%{transform:translate(5px);opacity:0}to{transform:translate(0);opacity:1}}.wf-action-list{width:220px}.wf-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.wf-action-list ul.action-item{display:block}.wf-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.wf-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.wf-action-list ul.action-item li .avatar-card.within-con{display:block}.wf-action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;overflow:hidden;background:#1e5dd3;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.wf-action-list ul.action-item li .avatar-card .avatar img{width:100%}.wf-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.wf-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.wf-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#747576;cursor:pointer;margin-right:5px}.wf-action-list ul.action-item li .avatar-card.no-image{display:block}.wf-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.wf-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}\n"], dependencies: [{ 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: "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$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: "component", type: CsCheckboxComponent, selector: "app-cs-checkbox", inputs: ["disabled", "ngValue", "value", "readonly", "oneLine"], outputs: ["ngValueChange"] }, { kind: "component", type: NoDataComponent, selector: "app-no-data", inputs: ["action", "noDataImage", "noDataText", "noDataButton", "noDataSecButton", "altText", "smallButton", "button"], outputs: ["buttonAction"] }, { kind: "component", type: LoaderInlineComponent, selector: "app-loader-inline" }, { kind: "component", type: PopoverComponent, selector: "app-popover", inputs: ["dontCloseonClick"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "placement"] }, { kind: "pipe", type: i1$1.SlicePipe, name: "slice" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LinkResponsibilityListComponent, selector: "app-link-responsibility-list", inputs: { onCompletionOfResponsibility: "onCompletionOfResponsibility", feature: "feature", respIdKey: "respIdKey", selectedResponsibilityValues: "selectedResponsibilityValues", radioSelection: "radioSelection" }, outputs: { closeButton: "closeButton", selectedResponsibility: "selectedResponsibility" }, ngImport: i0, template: "<div class=\"frequency-responsibility-list\" [class.animate]=\"animation\">\n  <div\n    class=\"frequency-responsibility-list-head vx-p-3 vx-d-flex vx-align-center vx-justify-between\"\n  >\n    <div class=\"vx-d-flex vx-align-center\">\n      <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Responsibility</div>\n    </div>\n  </div>\n  <div class=\"frequency-responsibility-list-body\">\n    <div\n      *ngIf=\"responsibilitiesData?.allResponsibilityCount > 0\"\n      class=\"vx-d-flex vx-align-center vx-justify-between vx-mb-2\"\n    >\n      <ng-container *ngFor=\"let tab of responsibilityTabs; let i = index\">\n        <div\n          class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\"\n          [class.active]=\"currentTab === i + 1 || (currentTab === 0 && i === 3)\"\n          (click)=\"onClickTabChange(tab)\"\n          [class.pointer-none]=\"responsibilityLoader\"\n        >\n          <div class=\"left vx-d-block vx-w-100\">\n            <div class=\"label vx-d-flex vx-align-center\">\n              <label\n                class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\"\n                >{{ tab.name }}</label\n              >\n            </div>\n          </div>\n          <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\n            <span\n              class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\"\n              >{{\n                responsibilityTabCount[typeToCountProperty[tab.type]] || 0\n              }}</span\n            >\n          </div>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"frequency-responsibility-list-search vx-mb-2\">\n      <i class=\"icons vx-fs-12\">&#xe90b;</i>\n      <input\n        type=\"text\"\n        [(ngModel)]=\"responsibilitySearchText\"\n        (keyup.enter)=\"search()\"\n        placeholder=\"Search Responsibilities\"\n      />\n    </div>\n    <app-pagination\n      *ngIf=\"!responsibilityLoader && responsibilitiesData?.total_pages > 1\"\n      [start]=\"responsibilitiesData?.responsibilities_from\"\n      [end]=\"responsibilitiesData?.responsibilities_to\"\n      [total]=\"responsibilitiesData?.total_responsibilities\"\n      [pageCount]=\"responsibilitiesData?.total_pages\"\n      [currentPage]=\"responsibilitiesData?.responsibilityCurrentPage\"\n      (selectedPage)=\"responsibilityPageChange($event)\"\n    >\n    </app-pagination>\n    <app-loader-inline *ngIf=\"responsibilityLoader\"></app-loader-inline>\n    <div\n      class=\"frequency-responsibility-list-mid vx-mb-4\"\n      [class.with-pagination]=\"\n        !responsibilityLoader && responsibilitiesData?.total_pages > 1\n      \"\n    >\n      <app-no-data\n        *ngIf=\"\n          responsibilitiesData?.data?.length === 0 && !responsibilityLoader\n        \"\n        [noDataImage]=\"noDataImagePath\"\n        [noDataText]=\"noDataMessage\"\n      ></app-no-data>\n      <ng-container\n        *ngIf=\"responsibilitiesData?.data?.length > 0 && !responsibilityLoader\"\n      >\n        <div class=\"table-header\">\n          <div class=\"table-row\">\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              #\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITIES\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility-center\"\n              *ngIf=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITY CENTER\n            </div>\n          </div>\n        </div>\n        <div class=\"table-body\">\n          <div\n            class=\"table-row\"\n            [class.active]=\"\n              selectedResponsibilityId?.includes(responsibility?.ReportId)\n            \"\n            *ngFor=\"\n              let responsibility of responsibilitiesData?.data;\n              let i = index\n            \"\n          >\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              <div\n                class=\"sr-no\"\n                [appTooltip]=\"responsibilitiesData?.responsibilities_from + i\"\n                placement=\"bottom\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibilitiesData?.responsibilities_from + i }}\n              </div>\n              <app-cs-checkbox\n                [ngValue]=\"\n                  selectedResponsibilityId?.includes(responsibility?.ReportId)\n                \"\n                (ngValueChange)=\"selectResp(responsibility?.ReportId, $event)\"\n              >\n              </app-cs-checkbox>\n            </div>\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              <div\n                class=\"value vx-fs-12 vx-label-txt vx-pr-5\"\n                [appTooltip]=\"responsibility?.ReportName\"\n                placement=\"bottom-left\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibility?.ControlId }} {{ responsibility?.ReportName }}\n              </div>\n            </div>\n\n            <div\n              *ngIf=\"\n                responsibility?.category_details_array[0]\n                  ?.category_name as categoryName\n              \"\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\"\n            >\n              <div class=\"program-inner vx-d-block\">\n                <div\n                  class=\"program-value vx-fs-11 vx-label-txt vx-pr-5\"\n                  [appTooltip]=\"\n                    responsibility?.category_details_array[0]?.category_name ??\n                    '--'\n                  \"\n                  placement=\"bottom-left\"\n                  delay=\"0\"\n                  type=\"black\"\n                  [tooltipMandatory]=\"true\"\n                >\n                  {{ categoryName ?? \"--\" }}\n                </div>\n                <div\n                  *ngIf=\"\n                    responsibility?.category_details_array[0]\n                      ?.parent_category_name?.length\n                  \"\n                  class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                >\n                  <div\n                    class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                  >\n                    Within\n                  </div>\n                  <div\n                    *ngIf=\"\n                      responsibility?.category_details_array[0]?.parent_category_name\n                        ?.slice()\n                        ?.reverse()\n                        ?.join(' < ') as parent_category\n                    \"\n                    class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                    [appTooltip]=\"parent_category\"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"true\"\n                  >\n                    {{ parent_category }}\n                  </div>\n                </div>\n              </div>\n              <button\n                *ngIf=\"responsibility?.category_details_array?.length >= 2\"\n                appPopover\n                (click)=\"programPopup.popover()\"\n                placement=\"right\"\n                class=\"program-count vx-fs-11 vx-fw-500 vx-txt-white vx-p-0 vx-pl-1 vx-pr-1 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"\n              >\n                +{{ responsibility?.category_details_array?.length - 1 }}\n              </button>\n              <app-popover #programPopup>\n                <div class=\"wf-action-list\">\n                  <ul class=\"action-item\">\n                    <li\n                      *ngFor=\"\n                        let subCategory of responsibility?.category_details_array\n                          | slice : 1\n                      \"\n                    >\n                      <div class=\"avatar-card\">\n                        <div class=\"vx-d-block vx-w-100\">\n                          <span\n                            class=\"value\"\n                            [appTooltip]=\"subCategory?.category_name\"\n                            placement=\"bottom-left\"\n                            delay=\"0\"\n                            type=\"black\"\n                            [tooltipMandatory]=\"true\"\n                            >{{ subCategory?.category_name }}</span\n                          >\n                          <div\n                            *ngIf=\"\n                              responsibility?.category_details_array[0]\n                                ?.parent_category_name?.length\n                            \"\n                            class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                          >\n                            <div\n                              class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                            >\n                              Within\n                            </div>\n                            <div\n                              *ngIf=\"\n                                responsibility?.category_details_array[0]?.parent_category_name\n                                  ?.slice()\n                                  ?.reverse()\n                                  ?.join(' < ') as parent_category\n                              \"\n                              class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                              [appTooltip]=\"parent_category\"\n                              placement=\"bottom-left\"\n                              delay=\"0\"\n                              type=\"black\"\n                              [tooltipMandatory]=\"true\"\n                            >\n                              {{ parent_category }}\n                            </div>\n                          </div>\n                        </div>\n                      </div>\n                    </li>\n                  </ul>\n                </div>\n              </app-popover>\n            </div>\n          </div>\n        </div>\n      </ng-container>\n    </div>\n    <app-floating-bar\n      *ngIf=\"!responsibilityLoader\"\n      [selectedData]=\"isValidObj ? selectedResponsibilityValues : []\"\n      [displayElementKey]=\"'ReportName'\"\n      (closeList)=\"back()\"\n      (closeEvent)=\"save($event)\"\n      (deleteEvent)=\"deleteItem($event)\"\n      [isDisabled]=\"!isValidObj\"\n    ></app-floating-bar>\n  </div>\n</div>\n", 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\";@import\"https://cdn.v-comply.com/design-system/css/table-card/table-card.css\";::ng-deep .frequency-responsibility-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:31.25rem;bottom:0;left:0}::ng-deep .frequency-responsibility-list.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both}::ng-deep .frequency-responsibility-list-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-responsibility-list-head .arrow{cursor:pointer}::ng-deep .frequency-responsibility-list-body{background:#fff;height:calc(100vh - 2.75rem);padding:1.5rem .75rem 1.5rem 2rem}::ng-deep .frequency-responsibility-list-body app-pagination .wk-pagination-sec-ds{border-radius:0;padding:0 0 .5rem}::ng-deep .frequency-responsibility-list-body app-floating-bar .floating-bar{padding:0;position:relative;left:-1rem;width:calc(100% + 2rem)}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar{padding-left:0!important;padding-right:0!important}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar .userGroup-floating-bar-container .left .chip span{max-width:240px}::ng-deep .frequency-responsibility-list-search{position:relative}::ng-deep .frequency-responsibility-list-search input{height:2.75rem;line-height:1.5rem;padding:.75rem .75rem .75rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .frequency-responsibility-list-search input::placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search i{position:absolute;left:1rem;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .frequency-responsibility-list-mid{height:calc(100vh - 17.5rem);overflow:auto}::ng-deep .frequency-responsibility-list-mid::-webkit-scrollbar-track{background-color:#fff}::ng-deep .frequency-responsibility-list-mid.with-pagination{height:calc(100vh - 19.5rem)}::ng-deep .frequency-responsibility-list-mid .table-header{background:#fff;position:sticky;top:0;z-index:1}::ng-deep .frequency-responsibility-list-mid .table-header .table-column{color:#161b2f!important;line-height:.75rem!important;min-height:1.875rem!important}::ng-deep .frequency-responsibility-list-mid .table-body{position:relative}::ng-deep .frequency-responsibility-list-mid .table-body .table-row{background:#fff;border-radius:.25rem;border:1px solid #f1f1f1;margin-bottom:.25rem}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial .sr-no,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial .sr-no{opacity:0}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial app-cs-checkbox,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial app-cs-checkbox{opacity:1}::ng-deep .frequency-responsibility-list-mid .table-row{display:flex;justify-content:left;position:relative}::ng-deep .frequency-responsibility-list-mid .table-row .table-column{color:#747576;min-height:2.5rem;position:relative;width:100%}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial{width:2rem;max-width:2rem;justify-content:center}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial .sr-no{width:1rem;background:#f8f8f8;writing-mode:vertical-lr;color:#747576;font-size:.625rem;font-weight:500;display:flex;height:2.5rem;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{position:absolute;top:.75rem;left:.5rem;width:1rem;height:1rem;opacity:0;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox .radio-item{position:absolute}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{display:flex}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility{width:calc(100% - 15.5rem);min-width:calc(100% - 15.5rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility.with-rc{width:calc(100% - 31rem);min-width:calc(100% - 31rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center{width:15.5rem;min-width:15.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program{width:13.5rem;min-width:13.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}@keyframes animate-right{0%{transform:translate(5px);opacity:0}to{transform:translate(0);opacity:1}}.wf-action-list{width:220px}.wf-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.wf-action-list ul.action-item{display:block}.wf-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.wf-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.wf-action-list ul.action-item li .avatar-card.within-con{display:block}.wf-action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;overflow:hidden;background:#1e5dd3;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.wf-action-list ul.action-item li .avatar-card .avatar img{width:100%}.wf-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.wf-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.wf-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#747576;cursor:pointer;margin-right:5px}.wf-action-list ul.action-item li .avatar-card.no-image{display:block}.wf-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.wf-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}\n"], dependencies: [{ 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: "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$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: "component", type: CsCheckboxComponent, selector: "app-cs-checkbox", inputs: ["disabled", "ngValue", "value", "readonly", "oneLine"], outputs: ["ngValueChange"] }, { kind: "component", type: NoDataComponent, selector: "app-no-data", inputs: ["action", "noDataImage", "noDataText", "noDataButton", "noDataSecButton", "altText", "smallButton", "button"], outputs: ["buttonAction"] }, { kind: "component", type: LoaderInlineComponent, selector: "app-loader-inline" }, { kind: "component", type: PopoverComponent, selector: "app-popover", inputs: ["dontCloseonClick"] }, { kind: "directive", type: PopoverDirective, selector: "[appPopover]", inputs: ["refrence", "placement"] }, { kind: "component", type: PaginationComponentUI, selector: "app-pagination", inputs: ["activeAlphabet", "pageCount", "start", "end", "total", "currentPage"], outputs: ["selectedPage", "selectedAlphabet"] }, { kind: "pipe", type: i1$1.SlicePipe, name: "slice" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinkResponsibilityListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-link-responsibility-list', template: "<div class=\"frequency-responsibility-list\" [class.animate]=\"animation\">\n  <div\n    class=\"frequency-responsibility-list-head vx-p-3 vx-d-flex vx-align-center vx-justify-between\"\n  >\n    <div class=\"vx-d-flex vx-align-center\">\n      <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Responsibility</div>\n    </div>\n  </div>\n  <div class=\"frequency-responsibility-list-body\">\n    <div\n      *ngIf=\"responsibilitiesData?.allResponsibilityCount > 0\"\n      class=\"vx-d-flex vx-align-center vx-justify-between vx-mb-2\"\n    >\n      <ng-container *ngFor=\"let tab of responsibilityTabs; let i = index\">\n        <div\n          class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\"\n          [class.active]=\"currentTab === i + 1 || (currentTab === 0 && i === 3)\"\n          (click)=\"onClickTabChange(tab)\"\n          [class.pointer-none]=\"responsibilityLoader\"\n        >\n          <div class=\"left vx-d-block vx-w-100\">\n            <div class=\"label vx-d-flex vx-align-center\">\n              <label\n                class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\"\n                >{{ tab.name }}</label\n              >\n            </div>\n          </div>\n          <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\n            <span\n              class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\"\n              >{{\n                responsibilityTabCount[typeToCountProperty[tab.type]] || 0\n              }}</span\n            >\n          </div>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"frequency-responsibility-list-search vx-mb-2\">\n      <i class=\"icons vx-fs-12\">&#xe90b;</i>\n      <input\n        type=\"text\"\n        [(ngModel)]=\"responsibilitySearchText\"\n        (keyup.enter)=\"search()\"\n        placeholder=\"Search Responsibilities\"\n      />\n    </div>\n    <app-pagination\n      *ngIf=\"!responsibilityLoader && responsibilitiesData?.total_pages > 1\"\n      [start]=\"responsibilitiesData?.responsibilities_from\"\n      [end]=\"responsibilitiesData?.responsibilities_to\"\n      [total]=\"responsibilitiesData?.total_responsibilities\"\n      [pageCount]=\"responsibilitiesData?.total_pages\"\n      [currentPage]=\"responsibilityCurrentPage\"\n      (selectedPage)=\"responsibilityPageChange($event)\"\n    >\n    </app-pagination>\n    <app-loader-inline *ngIf=\"responsibilityLoader\"></app-loader-inline>\n    <div\n      class=\"frequency-responsibility-list-mid vx-mb-4\"\n      [class.with-pagination]=\"\n        !responsibilityLoader && responsibilitiesData?.total_pages > 1\n      \"\n    >\n      <app-no-data\n        *ngIf=\"\n          responsibilitiesData?.data?.length === 0 && !responsibilityLoader\n        \"\n        [noDataImage]=\"noDataImagePath\"\n        [noDataText]=\"noDataMessage\"\n      ></app-no-data>\n      <ng-container\n        *ngIf=\"responsibilitiesData?.data?.length > 0 && !responsibilityLoader\"\n      >\n        <div class=\"table-header\">\n          <div class=\"table-row\">\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              #\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITIES\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility-center\"\n              *ngIf=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITY CENTER\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\"\n            >\n              PROGRAMS\n            </div>\n          </div>\n        </div>\n        <div class=\"table-body\">\n          <div\n            class=\"table-row\"\n            [class.active]=\"\n              selectedResponsibilityId?.includes(responsibility?.ReportId)\n            \"\n            *ngFor=\"\n              let responsibility of responsibilitiesData?.data;\n              let i = index\n            \"\n          >\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              <div\n                class=\"sr-no\"\n                [appTooltip]=\"responsibilitiesData?.responsibilities_from + i\"\n                placement=\"bottom\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibilitiesData?.responsibilities_from + i }}\n              </div>\n              <app-cs-checkbox\n                [ngValue]=\"\n                  selectedResponsibilityId?.includes(responsibility?.ReportId)\n                \"\n                (ngValueChange)=\"selectResp(responsibility?.ReportId, $event)\"\n              >\n              </app-cs-checkbox>\n            </div>\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              <div\n                class=\"value vx-fs-12 vx-label-txt vx-pr-5\"\n                [appTooltip]=\"responsibility?.ReportName\"\n                placement=\"bottom-left\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibility?.ControlId }} {{ responsibility?.ReportName }}\n              </div>\n            </div>\n\n            <div\n              *ngIf=\"\n                responsibility?.category_details_array[0]\n                  ?.category_name as categoryName\n              \"\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\"\n            >\n              <div class=\"program-inner vx-d-block\">\n                <div\n                  class=\"program-value vx-fs-11 vx-label-txt vx-pr-5\"\n                  [appTooltip]=\"\n                    responsibility?.category_details_array[0]?.category_name ??\n                    '--'\n                  \"\n                  placement=\"bottom-left\"\n                  delay=\"0\"\n                  type=\"black\"\n                  [tooltipMandatory]=\"true\"\n                >\n                  {{ categoryName ?? \"--\" }}\n                </div>\n                <div\n                  *ngIf=\"\n                    responsibility?.category_details_array[0]\n                      ?.parent_category_name?.length\n                  \"\n                  class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                >\n                  <div\n                    class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                  >\n                    Within\n                  </div>\n                  <div\n                    *ngIf=\"\n                      responsibility?.category_details_array[0]?.parent_category_name\n                        ?.slice()\n                        ?.reverse()\n                        ?.join(' < ') as parent_category\n                    \"\n                    class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                    [appTooltip]=\"parent_category\"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"true\"\n                  >\n                    {{ parent_category }}\n                  </div>\n                </div>\n              </div>\n              <button\n                *ngIf=\"responsibility?.category_details_array?.length >= 2\"\n                appPopover\n                (click)=\"programPopup.popover()\"\n                placement=\"right\"\n                class=\"program-count vx-fs-11 vx-fw-500 vx-txt-white vx-p-0 vx-pl-1 vx-pr-1 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"\n              >\n                +{{ responsibility?.category_details_array?.length - 1 }}\n              </button>\n              <app-popover #programPopup>\n                <div class=\"wf-action-list\">\n                  <ul class=\"action-item\">\n                    <li\n                      *ngFor=\"\n                        let subCategory of responsibility?.category_details_array\n                          | slice : 1\n                      \"\n                    >\n                      <div class=\"avatar-card\">\n                        <div class=\"vx-d-block vx-w-100\">\n                          <span\n                            class=\"value\"\n                            [appTooltip]=\"subCategory?.category_name\"\n                            placement=\"bottom-left\"\n                            delay=\"0\"\n                            type=\"black\"\n                            [tooltipMandatory]=\"true\"\n                            >{{ subCategory?.category_name }}</span\n                          >\n                          <div\n                            *ngIf=\"\n                              responsibility?.category_details_array[0]\n                                ?.parent_category_name?.length\n                            \"\n                            class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                          >\n                            <div\n                              class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                            >\n                              Within\n                            </div>\n                            <div\n                              *ngIf=\"\n                                responsibility?.category_details_array[0]?.parent_category_name\n                                  ?.slice()\n                                  ?.reverse()\n                                  ?.join(' < ') as parent_category\n                              \"\n                              class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                              [appTooltip]=\"parent_category\"\n                              placement=\"bottom-left\"\n                              delay=\"0\"\n                              type=\"black\"\n                              [tooltipMandatory]=\"true\"\n                            >\n                              {{ parent_category }}\n                            </div>\n                          </div>\n                        </div>\n                      </div>\n                    </li>\n                  </ul>\n                </div>\n              </app-popover>\n            </div>\n          </div>\n        </div>\n      </ng-container>\n    </div>\n    <app-floating-bar\n      *ngIf=\"!responsibilityLoader\"\n      [selectedData]=\"isValidObj ? selectedResponsibilityValues : []\"\n      [displayElementKey]=\"'ReportName'\"\n      (closeList)=\"back()\"\n      (closeEvent)=\"save($event)\"\n      (deleteEvent)=\"deleteItem($event)\"\n      [isDisabled]=\"!isValidObj\"\n    ></app-floating-bar>\n  </div>\n</div>\n", 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\";@import\"https://cdn.v-comply.com/design-system/css/table-card/table-card.css\";::ng-deep .frequency-responsibility-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:31.25rem;bottom:0;left:0}::ng-deep .frequency-responsibility-list.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both}::ng-deep .frequency-responsibility-list-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-responsibility-list-head .arrow{cursor:pointer}::ng-deep .frequency-responsibility-list-body{background:#fff;height:calc(100vh - 2.75rem);padding:1.5rem .75rem 1.5rem 2rem}::ng-deep .frequency-responsibility-list-body app-pagination .wk-pagination-sec-ds{border-radius:0;padding:0 0 .5rem}::ng-deep .frequency-responsibility-list-body app-floating-bar .floating-bar{padding:0;position:relative;left:-1rem;width:calc(100% + 2rem)}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar{padding-left:0!important;padding-right:0!important}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar .userGroup-floating-bar-container .left .chip span{max-width:240px}::ng-deep .frequency-responsibility-list-search{position:relative}::ng-deep .frequency-responsibility-list-search input{height:2.75rem;line-height:1.5rem;padding:.75rem .75rem .75rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .frequency-responsibility-list-search input::placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search i{position:absolute;left:1rem;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .frequency-responsibility-list-mid{height:calc(100vh - 17.5rem);overflow:auto}::ng-deep .frequency-responsibility-list-mid::-webkit-scrollbar-track{background-color:#fff}::ng-deep .frequency-responsibility-list-mid.with-pagination{height:calc(100vh - 19.5rem)}::ng-deep .frequency-responsibility-list-mid .table-header{background:#fff;position:sticky;top:0;z-index:1}::ng-deep .frequency-responsibility-list-mid .table-header .table-column{color:#161b2f!important;line-height:.75rem!important;min-height:1.875rem!important}::ng-deep .frequency-responsibility-list-mid .table-body{position:relative}::ng-deep .frequency-responsibility-list-mid .table-body .table-row{background:#fff;border-radius:.25rem;border:1px solid #f1f1f1;margin-bottom:.25rem}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial .sr-no,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial .sr-no{opacity:0}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial app-cs-checkbox,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial app-cs-checkbox{opacity:1}::ng-deep .frequency-responsibility-list-mid .table-row{display:flex;justify-content:space-between;position:relative}::ng-deep .frequency-responsibility-list-mid .table-row .table-column{color:#747576;min-height:2.5rem;position:relative;width:100%}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial{width:2rem;max-width:2rem;justify-content:center}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial .sr-no{width:1rem;background:#f8f8f8;writing-mode:vertical-lr;color:#747576;font-size:.625rem;font-weight:500;display:flex;height:2.5rem;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{position:absolute;top:.75rem;left:.5rem;width:1rem;height:1rem;opacity:0;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox .radio-item{position:absolute}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{display:flex}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility{width:calc(100% - 15.5rem);min-width:calc(100% - 15.5rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility.with-rc{width:calc(100% - 31rem);min-width:calc(100% - 31rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center{width:15.5rem;min-width:15.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program{width:13.5rem;min-width:13.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}@keyframes animate-right{0%{transform:translate(5px);opacity:0}to{transform:translate(0);opacity:1}}.wf-action-list{width:220px}.wf-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.wf-action-list ul.action-item{display:block}.wf-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.wf-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.wf-action-list ul.action-item li .avatar-card.within-con{display:block}.wf-action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;overflow:hidden;background:#1e5dd3;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.wf-action-list ul.action-item li .avatar-card .avatar img{width:100%}.wf-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.wf-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.wf-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#747576;cursor:pointer;margin-right:5px}.wf-action-list ul.action-item li .avatar-card.no-image{display:block}.wf-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.wf-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}\n"] }]
+            args: [{ selector: 'app-link-responsibility-list', template: "<div class=\"frequency-responsibility-list\" [class.animate]=\"animation\">\n  <div\n    class=\"frequency-responsibility-list-head vx-p-3 vx-d-flex vx-align-center vx-justify-between\"\n  >\n    <div class=\"vx-d-flex vx-align-center\">\n      <div class=\"vx-fs-14 vx-fw-500 vx-label-txt\">Select a Responsibility</div>\n    </div>\n  </div>\n  <div class=\"frequency-responsibility-list-body\">\n    <div\n      *ngIf=\"responsibilitiesData?.allResponsibilityCount > 0\"\n      class=\"vx-d-flex vx-align-center vx-justify-between vx-mb-2\"\n    >\n      <ng-container *ngFor=\"let tab of responsibilityTabs; let i = index\">\n        <div\n          class=\"vx-table-card vx-bg-white vx-d-flex vx-justify-between vx-align-center vx-mr-1 vx-pt-2 vx-pb-2 vx-pl-3 vx-pr-3 vx-w-100\"\n          [class.active]=\"currentTab === i + 1 || (currentTab === 0 && i === 3)\"\n          (click)=\"onClickTabChange(tab)\"\n          [class.pointer-none]=\"responsibilityLoader\"\n        >\n          <div class=\"left vx-d-block vx-w-100\">\n            <div class=\"label vx-d-flex vx-align-center\">\n              <label\n                class=\"vx-paragraph-txt vx-fw-500 vx-tt-uppercase vx-d-flex vx-justify-between vx-align-center\"\n                >{{ tab.name }}</label\n              >\n            </div>\n          </div>\n          <div class=\"right vx-d-flex vx-justify-end vx-w-100\">\n            <span\n              class=\"vx-txt-white vx-fw-500 vx-d-inline-block vx-text-center\"\n              >{{\n                responsibilityTabCount[typeToCountProperty[tab.type]] || 0\n              }}</span\n            >\n          </div>\n        </div>\n      </ng-container>\n    </div>\n\n    <div class=\"frequency-responsibility-list-search vx-mb-2\">\n      <i class=\"icons vx-fs-12\">&#xe90b;</i>\n      <input\n        type=\"text\"\n        [(ngModel)]=\"responsibilitySearchText\"\n        (keyup.enter)=\"search()\"\n        placeholder=\"Search Responsibilities\"\n      />\n    </div>\n    <app-pagination\n      *ngIf=\"!responsibilityLoader && responsibilitiesData?.total_pages > 1\"\n      [start]=\"responsibilitiesData?.responsibilities_from\"\n      [end]=\"responsibilitiesData?.responsibilities_to\"\n      [total]=\"responsibilitiesData?.total_responsibilities\"\n      [pageCount]=\"responsibilitiesData?.total_pages\"\n      [currentPage]=\"responsibilitiesData?.responsibilityCurrentPage\"\n      (selectedPage)=\"responsibilityPageChange($event)\"\n    >\n    </app-pagination>\n    <app-loader-inline *ngIf=\"responsibilityLoader\"></app-loader-inline>\n    <div\n      class=\"frequency-responsibility-list-mid vx-mb-4\"\n      [class.with-pagination]=\"\n        !responsibilityLoader && responsibilitiesData?.total_pages > 1\n      \"\n    >\n      <app-no-data\n        *ngIf=\"\n          responsibilitiesData?.data?.length === 0 && !responsibilityLoader\n        \"\n        [noDataImage]=\"noDataImagePath\"\n        [noDataText]=\"noDataMessage\"\n      ></app-no-data>\n      <ng-container\n        *ngIf=\"responsibilitiesData?.data?.length > 0 && !responsibilityLoader\"\n      >\n        <div class=\"table-header\">\n          <div class=\"table-row\">\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              #\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITIES\n            </div>\n            <div\n              class=\"table-column vx-fs-11 vx-fw-500 vx-lh-5 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility-center\"\n              *ngIf=\"isOnCompletionRc\"\n            >\n              RESPONSIBILITY CENTER\n            </div>\n          </div>\n        </div>\n        <div class=\"table-body\">\n          <div\n            class=\"table-row\"\n            [class.active]=\"\n              selectedResponsibilityId?.includes(responsibility?.ReportId)\n            \"\n            *ngFor=\"\n              let responsibility of responsibilitiesData?.data;\n              let i = index\n            \"\n          >\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center serial\"\n            >\n              <div\n                class=\"sr-no\"\n                [appTooltip]=\"responsibilitiesData?.responsibilities_from + i\"\n                placement=\"bottom\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibilitiesData?.responsibilities_from + i }}\n              </div>\n              <app-cs-checkbox\n                [ngValue]=\"\n                  selectedResponsibilityId?.includes(responsibility?.ReportId)\n                \"\n                (ngValueChange)=\"selectResp(responsibility?.ReportId, $event)\"\n              >\n              </app-cs-checkbox>\n            </div>\n            <div\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center responsibility\"\n              [class.with-rc]=\"isOnCompletionRc\"\n            >\n              <div\n                class=\"value vx-fs-12 vx-label-txt vx-pr-5\"\n                [appTooltip]=\"responsibility?.ReportName\"\n                placement=\"bottom-left\"\n                delay=\"0\"\n                type=\"black\"\n                [tooltipMandatory]=\"true\"\n              >\n                {{ responsibility?.ControlId }} {{ responsibility?.ReportName }}\n              </div>\n            </div>\n\n            <div\n              *ngIf=\"\n                responsibility?.category_details_array[0]\n                  ?.category_name as categoryName\n              \"\n              class=\"table-column vx-pl-1 vx-pr-1 vx-d-flex vx-align-center program\"\n            >\n              <div class=\"program-inner vx-d-block\">\n                <div\n                  class=\"program-value vx-fs-11 vx-label-txt vx-pr-5\"\n                  [appTooltip]=\"\n                    responsibility?.category_details_array[0]?.category_name ??\n                    '--'\n                  \"\n                  placement=\"bottom-left\"\n                  delay=\"0\"\n                  type=\"black\"\n                  [tooltipMandatory]=\"true\"\n                >\n                  {{ categoryName ?? \"--\" }}\n                </div>\n                <div\n                  *ngIf=\"\n                    responsibility?.category_details_array[0]\n                      ?.parent_category_name?.length\n                  \"\n                  class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                >\n                  <div\n                    class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                  >\n                    Within\n                  </div>\n                  <div\n                    *ngIf=\"\n                      responsibility?.category_details_array[0]?.parent_category_name\n                        ?.slice()\n                        ?.reverse()\n                        ?.join(' < ') as parent_category\n                    \"\n                    class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                    [appTooltip]=\"parent_category\"\n                    placement=\"bottom-left\"\n                    delay=\"0\"\n                    type=\"black\"\n                    [tooltipMandatory]=\"true\"\n                  >\n                    {{ parent_category }}\n                  </div>\n                </div>\n              </div>\n              <button\n                *ngIf=\"responsibility?.category_details_array?.length >= 2\"\n                appPopover\n                (click)=\"programPopup.popover()\"\n                placement=\"right\"\n                class=\"program-count vx-fs-11 vx-fw-500 vx-txt-white vx-p-0 vx-pl-1 vx-pr-1 vx-m-0 vx-d-flex vx-align-center vx-justify-center\"\n              >\n                +{{ responsibility?.category_details_array?.length - 1 }}\n              </button>\n              <app-popover #programPopup>\n                <div class=\"wf-action-list\">\n                  <ul class=\"action-item\">\n                    <li\n                      *ngFor=\"\n                        let subCategory of responsibility?.category_details_array\n                          | slice : 1\n                      \"\n                    >\n                      <div class=\"avatar-card\">\n                        <div class=\"vx-d-block vx-w-100\">\n                          <span\n                            class=\"value\"\n                            [appTooltip]=\"subCategory?.category_name\"\n                            placement=\"bottom-left\"\n                            delay=\"0\"\n                            type=\"black\"\n                            [tooltipMandatory]=\"true\"\n                            >{{ subCategory?.category_name }}</span\n                          >\n                          <div\n                            *ngIf=\"\n                              responsibility?.category_details_array[0]\n                                ?.parent_category_name?.length\n                            \"\n                            class=\"within-part vx-d-flex vx-align-center vx-pr-3\"\n                          >\n                            <div\n                              class=\"within-box vx-fs-9 vx-fw-600 vx-tt-uppercase vx-pl-1 vx-pr-1 vx-mr-2 vx-lh-3 vx-txt-blue\"\n                            >\n                              Within\n                            </div>\n                            <div\n                              *ngIf=\"\n                                responsibility?.category_details_array[0]?.parent_category_name\n                                  ?.slice()\n                                  ?.reverse()\n                                  ?.join(' < ') as parent_category\n                              \"\n                              class=\"within-value vx-fs-11 vx-paragraph-txt\"\n                              [appTooltip]=\"parent_category\"\n                              placement=\"bottom-left\"\n                              delay=\"0\"\n                              type=\"black\"\n                              [tooltipMandatory]=\"true\"\n                            >\n                              {{ parent_category }}\n                            </div>\n                          </div>\n                        </div>\n                      </div>\n                    </li>\n                  </ul>\n                </div>\n              </app-popover>\n            </div>\n          </div>\n        </div>\n      </ng-container>\n    </div>\n    <app-floating-bar\n      *ngIf=\"!responsibilityLoader\"\n      [selectedData]=\"isValidObj ? selectedResponsibilityValues : []\"\n      [displayElementKey]=\"'ReportName'\"\n      (closeList)=\"back()\"\n      (closeEvent)=\"save($event)\"\n      (deleteEvent)=\"deleteItem($event)\"\n      [isDisabled]=\"!isValidObj\"\n    ></app-floating-bar>\n  </div>\n</div>\n", 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\";@import\"https://cdn.v-comply.com/design-system/css/table-card/table-card.css\";::ng-deep .frequency-responsibility-list{border-top:3px solid #1e5dd3;position:fixed;top:0;right:31.25rem;bottom:0;left:0}::ng-deep .frequency-responsibility-list.animate{animation:animate-right .2s cubic-bezier(.25,.46,.45,.94) both}::ng-deep .frequency-responsibility-list-head{background:#fbfbfb;border-bottom:1px solid #f1f1f1;height:2.75rem}::ng-deep .frequency-responsibility-list-head .arrow{cursor:pointer}::ng-deep .frequency-responsibility-list-body{background:#fff;height:calc(100vh - 2.75rem);padding:1.5rem .75rem 1.5rem 2rem}::ng-deep .frequency-responsibility-list-body app-pagination .wk-pagination-sec-ds{border-radius:0;padding:0 0 .5rem}::ng-deep .frequency-responsibility-list-body app-floating-bar .floating-bar{padding:0;position:relative;left:-1rem;width:calc(100% + 2rem)}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar{padding-left:0!important;padding-right:0!important}::ng-deep .frequency-responsibility-list-body app-floating-bar .userGroup-floating-bar .userGroup-floating-bar-container .left .chip span{max-width:240px}::ng-deep .frequency-responsibility-list-search{position:relative}::ng-deep .frequency-responsibility-list-search input{height:2.75rem;line-height:1.5rem;padding:.75rem .75rem .75rem 2.5rem;outline:none;border:1px solid #7475763f;border-radius:.25rem;width:100%;font-size:14px;color:#747576}::ng-deep .frequency-responsibility-list-search input::placeholder{color:#747576;opacity:1}::ng-deep .frequency-responsibility-list-search i{position:absolute;left:1rem;top:1rem;pointer-events:none;color:#f1f1f1}::ng-deep .frequency-responsibility-list-mid{height:calc(100vh - 17.5rem);overflow:auto}::ng-deep .frequency-responsibility-list-mid::-webkit-scrollbar-track{background-color:#fff}::ng-deep .frequency-responsibility-list-mid.with-pagination{height:calc(100vh - 19.5rem)}::ng-deep .frequency-responsibility-list-mid .table-header{background:#fff;position:sticky;top:0;z-index:1}::ng-deep .frequency-responsibility-list-mid .table-header .table-column{color:#161b2f!important;line-height:.75rem!important;min-height:1.875rem!important}::ng-deep .frequency-responsibility-list-mid .table-body{position:relative}::ng-deep .frequency-responsibility-list-mid .table-body .table-row{background:#fff;border-radius:.25rem;border:1px solid #f1f1f1;margin-bottom:.25rem}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial .sr-no,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial .sr-no{opacity:0}::ng-deep .frequency-responsibility-list-mid .table-body .table-row:hover .table-column.serial app-cs-checkbox,::ng-deep .frequency-responsibility-list-mid .table-body .table-row.active .table-column.serial app-cs-checkbox{opacity:1}::ng-deep .frequency-responsibility-list-mid .table-row{display:flex;justify-content:left;position:relative}::ng-deep .frequency-responsibility-list-mid .table-row .table-column{color:#747576;min-height:2.5rem;position:relative;width:100%}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial{width:2rem;max-width:2rem;justify-content:center}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial .sr-no{width:1rem;background:#f8f8f8;writing-mode:vertical-lr;color:#747576;font-size:.625rem;font-weight:500;display:flex;height:2.5rem;align-items:center;justify-content:center;position:relative;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{position:absolute;top:.75rem;left:.5rem;width:1rem;height:1rem;opacity:0;transition:all .2s ease-in-out}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox .radio-item{position:absolute}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.serial app-cs-checkbox{display:flex}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility{width:calc(100% - 15.5rem);min-width:calc(100% - 15.5rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility.with-rc{width:calc(100% - 31rem);min-width:calc(100% - 31rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility .value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center{width:15.5rem;min-width:15.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.responsibility-center button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program{width:13.5rem;min-width:13.5rem}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-inner{max-width:calc(100% - 2rem)}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program .program-value{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}::ng-deep .frequency-responsibility-list-mid .table-row .table-column.program button.program-count{background:#1e5dd3;border-radius:.125rem;border:none;min-width:1.5rem;height:1.25rem}@keyframes animate-right{0%{transform:translate(5px);opacity:0}to{transform:translate(0);opacity:1}}.wf-action-list{width:220px}.wf-action-list ul{padding:0;margin:0;animation:scale-up-center .2s cubic-bezier(.39,.575,.565,1) both;background:#fff;box-shadow:0 3px 6px #1c5bd140;border-radius:4px;max-height:220px;overflow:auto}.wf-action-list ul.action-item{display:block}.wf-action-list ul.action-item li{list-style:none;border:none;border-bottom:1px solid #f1f1f1;display:block;width:100%;padding:0;background:transparent;border-radius:0;margin:0;height:auto;justify-content:flex-start;box-shadow:none}.wf-action-list ul.action-item li .avatar-card{display:flex;align-items:center;width:100%;padding:7.5px}.wf-action-list ul.action-item li .avatar-card.within-con{display:block}.wf-action-list ul.action-item li .avatar-card .avatar{height:24px;width:24px!important;overflow:hidden;background:#1e5dd3;color:#fff;font-size:10px;display:inline-flex;margin-right:5px;border-radius:50%;align-items:center;justify-content:center;text-transform:uppercase}.wf-action-list ul.action-item li .avatar-card .avatar img{width:100%}.wf-action-list ul.action-item li .avatar-card .avatar+span.value{width:calc(100% - 29px)}.wf-action-list ul.action-item li .avatar-card span.value{width:100%;color:#6e717e;text-decoration:none;background:transparent;font-size:12px;text-transform:capitalize;display:block;font-weight:400;text-align-last:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}.wf-action-list ul.action-item li .avatar-card span.value i{font-size:8px;color:#747576;cursor:pointer;margin-right:5px}.wf-action-list ul.action-item li .avatar-card.no-image{display:block}.wf-action-list ul.action-item li .avatar-card.no-image span.value{width:100%;display:block}.wf-action-list ul.action-item li:first-child{animation:action-list-open .25s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(2){animation:action-list-open .35s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(3){animation:action-list-open .45s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(4){animation:action-list-open .55s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(5){animation:action-list-open .65s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(6){animation:action-list-open .75s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(7){animation:action-list-open .85s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(8){animation:action-list-open .95s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(9){animation:action-list-open 1.05s cubic-bezier(.25,.46,.45,.94) both}.wf-action-list ul.action-item li:nth-child(10){animation:action-list-open 1.15s cubic-bezier(.25,.46,.45,.94) both}@keyframes action-list-open{0%{transform:translateY(50px)}to{transform:translateY(0)}}@keyframes scale-up-center{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}\n"] }]
         }], ctorParameters: function () { return [{ type: FrequencyService }]; }, propDecorators: { onCompletionOfResponsibility: [{
                 type: Input
             }], feature: [{
@@ -14756,7 +14813,7 @@ class WorkflowCaseComponent {
     // field selector and de-selector
     onFieldClicked(event) {
         this.fieldClicked = event;
-        this.pickerToggle(true);
+        this.pickerToggle(event ? true : false);
     }
     addMoreInfo(event) {
         this.additionalOptionStatus[event.code] = event.checked;
@@ -14862,7 +14919,7 @@ class WorkflowCaseComponent {
         if (this.openedFrom === 'COMPLIANCE_WORKROOM') {
             this.payload.source = this.source;
             payload.responsibilities_Linked = payload?.responsibilities_Linked?.map((item) => {
-                return item?.EncryptedReportId;
+                return item?.ReportId;
             });
             payload.responsibilities_Linked.push(this.responsibilityData?.rid);
         }
@@ -14882,9 +14939,6 @@ class WorkflowCaseComponent {
                 this.assessmentQuestion?.questionId;
             payload.linked_assessment_issues.auditee_id =
                 this.assessmentQuestion?.auditeeId;
-            payload.responsibilities_Linked = [
-                this.responsibilityData?.rid,
-            ];
             payload.source = this.source;
         }
     }
@@ -20202,14 +20256,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 type: Input
             }] } });
 
-const API = {
-    subscriptionList: `subscriptionList`,
-};
-const PROGRAM_LIST_API = {
-    programList: 'sailsProgramList',
-    categoryList: 'sailsProgramCategories',
-};
-
 class ProgramsService {
     constructor(http, authService, config) {
         this.http = http;
@@ -32790,7 +32836,7 @@ class WorkflowComplianceComponent {
                     ...this.responsibilityForm?.category,
                     ...linkedCategoryIds,
                     ...[entrustForm?.program[0]?.category_id],
-                ])?.toString()
+                ])?.reverse().toString()
                 : '',
             cc_member_email: moreOptions?.OVERSEER
                 ? this.returnIds(this.overseerUserList, 'uid').toString()
@@ -33021,6 +33067,7 @@ class WorkflowComplianceComponent {
                 .subscribe((res) => {
                 this.responsibilityData = res;
                 this.loader = false;
+                this.entrustLoader = false;
                 this.uiKitService.isLoader = false;
                 this.showSmiley = true;
                 this.uiKitService.isSmileyOn = true;
@@ -38298,6 +38345,7 @@ class WorkflowPolicyComponent {
         }
     }
     linkDocumentWithPolicy(document) {
+        let url = '';
         if (document.fileName &&
             (document.fileExtension === 'pdf' ||
                 document.fileExtension === 'PDF' ||
@@ -38306,23 +38354,18 @@ class WorkflowPolicyComponent {
             this.policyService
                 .extractFile(document.fileExtension, document.filePath, this.policyId)
                 .subscribe((res) => {
-                if (res) {
+                if (res && this.policyId) {
                     if (res.message === 'done' || res.content) {
                         this.loader = false;
                         if (document.fileExtension === 'docx' ||
                             document.fileExtension === 'DOCX') {
-                            this.router.navigate(['/policy/edit-policy'], {
-                                queryParams: { id: this.policyId },
-                                relativeTo: this.route,
-                            });
+                            url = this.baseURL + API.editPolicy + this.policyId;
                         }
                         else if (document.fileExtension === 'pdf' ||
                             document.fileExtension === 'PDF') {
-                            this.router.navigate(['/policy/workroom'], {
-                                queryParams: { id: this.policyId },
-                                relativeTo: this.route,
-                            });
+                            url = this.baseURL + API.goToPolicyWorkroom + this.policyId;
                         }
+                        this.iframeService.redirectIfInIframe(url, true);
                     }
                 }
             }, (err) => {
@@ -40489,6 +40532,7 @@ class AddMultipleRiskComponent {
             this.loader = false;
             this.showExcel = false;
             this.showSmiley = true;
+            this.submitWorkflow();
             this.riskData = res;
         }, (err) => {
             console.error(err);
@@ -40497,6 +40541,14 @@ class AddMultipleRiskComponent {
             this.snackBar.show('OOPS! Something went wrong and the page could not be loaded. Could you please try one more time?', 'alert');
         });
     }
+    submitWorkflow() {
+        const message = { type: 'submit' };
+        const targetOrigin = this.getOrigin();
+        window.parent.postMessage(message, targetOrigin);
+    }
+    getOrigin() {
+        return window.location.origin;
+    }
     returnIds(item, key) {
         switch (key) {
             case 'rc_id':
@@ -43680,12 +43732,21 @@ class ImportAnAssessmentComponent {
                 this.assessmentData = {};
                 this.isShowLoader = false;
                 this.showSmiley = true;
+                this.submitWorkflow();
             },
             error: (err) => {
                 this.isShowLoader = false;
             },
         });
     }
+    submitWorkflow() {
+        const message = { type: 'submit' };
+        const targetOrigin = this.getOrigin();
+        window.parent.postMessage(message, targetOrigin);
+    }
+    getOrigin() {
+        return window.location.origin;
+    }
     smileyAction(id) {
         if (id === smileyActions.VIEW_ASSESSMENTS) {
             this.disconnectRefresh.emit(false);
@@ -46025,6 +46086,7 @@ class AddMultipleResponsibilityComponent {
             this.loader = false;
             this.showExcel = false;
             this.showSmiley = true;
+            this.submitWorkflow();
             this.responsibilityData = res;
         }, (err) => {
             console.error(err);
@@ -46033,6 +46095,14 @@ class AddMultipleResponsibilityComponent {
             this.snackBar.show('OOPS! Something went wrong and the page could not be loaded. Could you please try one more time?', 'alert');
         });
     }
+    submitWorkflow() {
+        const message = { type: 'submit' };
+        const targetOrigin = this.getOrigin();
+        window.parent.postMessage(message, targetOrigin);
+    }
+    getOrigin() {
+        return window.location.origin;
+    }
     returnIds(item, key) {
         switch (key) {
             case 'rc_id':
@@ -46925,6 +46995,7 @@ class AddMultipleResponsibilityWithTabComponent {
             this.loader = false;
             this.showExcel = false;
             this.showSmiley = true;
+            this.submitWorkflow();
             this.responsibilityData = res;
         }, (err) => {
             console.log(err);
@@ -46933,6 +47004,14 @@ class AddMultipleResponsibilityWithTabComponent {
             this.snackBar.show('OOPS! Something went wrong and the page could not be loaded. Could you please try one more time?', 'alert');
         });
     }
+    submitWorkflow() {
+        const message = { type: 'submit' };
+        const targetOrigin = this.getOrigin();
+        window.parent.postMessage(message, targetOrigin);
+    }
+    getOrigin() {
+        return window.location.origin;
+    }
     returnIds(item, key) {
         switch (key) {
             case 'rc_id':
@@ -52020,7 +52099,8 @@ class LinkResponsibilityModule {
             FormgroupModule$1,
             NoDataModule$1,
             VLoaderModule,
-            PopoverModule], exports: [LinkResponsibilityListComponent] }); }
+            PopoverModule,
+            PaginationModule$1], exports: [LinkResponsibilityListComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinkResponsibilityModule, imports: [CommonModule,
             FormsModule,
             PipesModule,
@@ -52028,7 +52108,8 @@ class LinkResponsibilityModule {
             FormgroupModule$1,
             NoDataModule$1,
             VLoaderModule,
-            PopoverModule] }); }
+            PopoverModule,
+            PaginationModule$1] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LinkResponsibilityModule, decorators: [{
             type: NgModule,
@@ -52042,7 +52123,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                         FormgroupModule$1,
                         NoDataModule$1,
                         VLoaderModule,
-                        PopoverModule
+                        PopoverModule,
+                        PaginationModule$1
                     ],
                     exports: [LinkResponsibilityListComponent],
                 }]