@symphony-talent/component-library 4.232.0 → 4.233.0

package/fesm2015/symphony-talent-component-library-projects-component-library.mjs

@@ -403,10 +403,10 @@ class ContextualMenuComponent {
     }
 }
 ContextualMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ContextualMenuComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
-ContextualMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ContextualMenuComponent, selector: "symphony-contextual-menu", inputs: { model: "model" }, outputs: { itemClick: "itemClick" }, host: { properties: { "class.open": "this.isDropdownOpen" } }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], ngImport: i0, template: "<div\n  class=\"btn-group\"\n  [ngClass]=\"{ 'is-inverse': model.isInverse }\"\n  dropdown\n  #dropdown=\"bs-dropdown\"\n  [container]=\"dropdownContainer\"\n  (isOpenChange)=\"onDropdownOpenChange($event)\"\n>\n  <button\n    id=\"button-basic\"\n    dropdownToggle\n    type=\"button\"\n    class=\"btn dropdown-toggle\"\n    [ngClass]=\"{\n      'has-border': model.hasBorder\n    }\"\n    aria-controls=\"dropdown-basic\"\n    aria-label=\"more-actions-menu\"\n  >\n    <i class=\"si-more-options\"></i>\n  </button>\n  <ul\n    id=\"dropdown-basic\"\n    *dropdownMenu\n    class=\"dropdown-menu\"\n    [ngClass]=\"{\n      'contextual-menu__dropdown-menu': model.appendToBody\n    }\"\n    role=\"menu\"\n    aria-labelledby=\"button-basic\"\n  >\n    <li role=\"menuitem\" *ngFor=\"let item of model.items\">\n      <a\n        class=\"dropdown-item\"\n        href=\"#\" id=\"dropdown-item-{{item | trimId}}\"\n        (click)=\"$event.preventDefault(); onItemClick(item)\"\n        >{{ item }}</a\n      >\n    </li>\n  </ul>\n</div>\n", styles: [".btn-group .has-border{border-radius:50%;border:2px solid #000;height:40px;width:40px;padding:9px 0;cursor:pointer;text-align:center}.btn-group button.dropdown-toggle.btn{display:flex;align-items:center;justify-content:center;background:#ffffff;padding:0;font-size:18px;line-height:26px;box-shadow:none;width:40px;height:40px;min-height:40px;border-radius:50%!important;color:#000}.btn-group button.dropdown-toggle.btn:hover{background:#000000;color:#fff!important}.btn-group button.dropdown-toggle.btn .si-more-options{font-size:18px}.btn-group .dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit}.btn-group .dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.btn-group .dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.btn-group .dropdown-menu li a.not-allowed{cursor:not-allowed}.btn-group .dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn{background:#000;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn:hover{background:#fff;color:#000!important}.contextual-menu__dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit;right:-30px}.contextual-menu__dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.contextual-menu__dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.contextual-menu__dropdown-menu li a.not-allowed{cursor:not-allowed}.contextual-menu__dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.open button.dropdown-toggle.btn{background:#000000;color:#fff}\n"], directives: [{ type: i1$1.BsDropdownDirective, selector: "[bsDropdown],[dropdown]", inputs: ["autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen", "placement", "triggers", "container", "dropup"], outputs: ["onShown", "onHidden", "isOpenChange"], exportAs: ["bs-dropdown"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i1$1.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "trimId": TrimIdPipe } });
+ContextualMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ContextualMenuComponent, selector: "symphony-contextual-menu", inputs: { model: "model" }, outputs: { itemClick: "itemClick" }, host: { properties: { "class.open": "this.isDropdownOpen" } }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], ngImport: i0, template: "<div\n  class=\"btn-group\"\n  [ngClass]=\"{ 'is-inverse': model.isInverse }\"\n  dropdown\n  #dropdown=\"bs-dropdown\"\n  [container]=\"dropdownContainer\"\n  (isOpenChange)=\"onDropdownOpenChange($event)\"\n>\n  <button\n    id=\"button-basic\"\n    dropdownToggle\n    type=\"button\"\n    class=\"btn dropdown-toggle\"\n    [ngClass]=\"{\n      'has-border': model.hasBorder\n    }\"\n    aria-controls=\"dropdown-basic\"\n    aria-label=\"more-actions-menu\"\n  >\n    <i class=\"si-more-options\"></i>\n  </button>\n  <ul\n    id=\"dropdown-basic\"\n    *dropdownMenu\n    class=\"dropdown-menu\"\n    [ngClass]=\"{\n      'contextual-menu__dropdown-menu': model.appendToBody\n    }\"\n    role=\"menu\"\n    aria-labelledby=\"button-basic\"\n  >\n    <li role=\"menuitem\" *ngFor=\"let item of model.items\">\n      <a\n        class=\"dropdown-item\"\n        href=\"#\" id=\"dropdown-item-{{item | trimId}}\"\n        (click)=\"$event.preventDefault(); onItemClick(item)\"\n        >{{ item }}</a\n      >\n    </li>\n  </ul>\n</div>\n", styles: [".btn-group .has-border{border-radius:50%;border:2px solid #000;height:40px;width:40px;padding:9px 0;cursor:pointer;text-align:center}.btn-group button.dropdown-toggle.btn{display:flex;align-items:center;justify-content:center;background:#ffffff;padding:0;font-size:18px;line-height:26px;box-shadow:none;width:40px;height:40px;min-height:40px;border-radius:50%!important;color:#000}.btn-group button.dropdown-toggle.btn:hover{background:#000000;color:#fff!important}.btn-group button.dropdown-toggle.btn .si-more-options{font-size:18px}.btn-group .dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit}.btn-group .dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.btn-group .dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.btn-group .dropdown-menu li a.not-allowed{cursor:not-allowed}.btn-group .dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn{background:#000;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn:hover{background:#fff;color:#000!important}.contextual-menu__dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit;right:-30px;padding-top:10px!important;padding-bottom:10px!important}.contextual-menu__dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.contextual-menu__dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.contextual-menu__dropdown-menu li a.not-allowed{cursor:not-allowed}.contextual-menu__dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.open button.dropdown-toggle.btn{background:#000000;color:#fff}\n"], directives: [{ type: i1$1.BsDropdownDirective, selector: "[bsDropdown],[dropdown]", inputs: ["autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen", "placement", "triggers", "container", "dropup"], outputs: ["onShown", "onHidden", "isOpenChange"], exportAs: ["bs-dropdown"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$1.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { type: i1$1.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "trimId": TrimIdPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ContextualMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-contextual-menu', template: "<div\n  class=\"btn-group\"\n  [ngClass]=\"{ 'is-inverse': model.isInverse }\"\n  dropdown\n  #dropdown=\"bs-dropdown\"\n  [container]=\"dropdownContainer\"\n  (isOpenChange)=\"onDropdownOpenChange($event)\"\n>\n  <button\n    id=\"button-basic\"\n    dropdownToggle\n    type=\"button\"\n    class=\"btn dropdown-toggle\"\n    [ngClass]=\"{\n      'has-border': model.hasBorder\n    }\"\n    aria-controls=\"dropdown-basic\"\n    aria-label=\"more-actions-menu\"\n  >\n    <i class=\"si-more-options\"></i>\n  </button>\n  <ul\n    id=\"dropdown-basic\"\n    *dropdownMenu\n    class=\"dropdown-menu\"\n    [ngClass]=\"{\n      'contextual-menu__dropdown-menu': model.appendToBody\n    }\"\n    role=\"menu\"\n    aria-labelledby=\"button-basic\"\n  >\n    <li role=\"menuitem\" *ngFor=\"let item of model.items\">\n      <a\n        class=\"dropdown-item\"\n        href=\"#\" id=\"dropdown-item-{{item | trimId}}\"\n        (click)=\"$event.preventDefault(); onItemClick(item)\"\n        >{{ item }}</a\n      >\n    </li>\n  </ul>\n</div>\n", styles: [".btn-group .has-border{border-radius:50%;border:2px solid #000;height:40px;width:40px;padding:9px 0;cursor:pointer;text-align:center}.btn-group button.dropdown-toggle.btn{display:flex;align-items:center;justify-content:center;background:#ffffff;padding:0;font-size:18px;line-height:26px;box-shadow:none;width:40px;height:40px;min-height:40px;border-radius:50%!important;color:#000}.btn-group button.dropdown-toggle.btn:hover{background:#000000;color:#fff!important}.btn-group button.dropdown-toggle.btn .si-more-options{font-size:18px}.btn-group .dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit}.btn-group .dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.btn-group .dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.btn-group .dropdown-menu li a.not-allowed{cursor:not-allowed}.btn-group .dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn{background:#000;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn:hover{background:#fff;color:#000!important}.contextual-menu__dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit;right:-30px}.contextual-menu__dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.contextual-menu__dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.contextual-menu__dropdown-menu li a.not-allowed{cursor:not-allowed}.contextual-menu__dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.open button.dropdown-toggle.btn{background:#000000;color:#fff}\n"] }]
+            args: [{ selector: 'symphony-contextual-menu', template: "<div\n  class=\"btn-group\"\n  [ngClass]=\"{ 'is-inverse': model.isInverse }\"\n  dropdown\n  #dropdown=\"bs-dropdown\"\n  [container]=\"dropdownContainer\"\n  (isOpenChange)=\"onDropdownOpenChange($event)\"\n>\n  <button\n    id=\"button-basic\"\n    dropdownToggle\n    type=\"button\"\n    class=\"btn dropdown-toggle\"\n    [ngClass]=\"{\n      'has-border': model.hasBorder\n    }\"\n    aria-controls=\"dropdown-basic\"\n    aria-label=\"more-actions-menu\"\n  >\n    <i class=\"si-more-options\"></i>\n  </button>\n  <ul\n    id=\"dropdown-basic\"\n    *dropdownMenu\n    class=\"dropdown-menu\"\n    [ngClass]=\"{\n      'contextual-menu__dropdown-menu': model.appendToBody\n    }\"\n    role=\"menu\"\n    aria-labelledby=\"button-basic\"\n  >\n    <li role=\"menuitem\" *ngFor=\"let item of model.items\">\n      <a\n        class=\"dropdown-item\"\n        href=\"#\" id=\"dropdown-item-{{item | trimId}}\"\n        (click)=\"$event.preventDefault(); onItemClick(item)\"\n        >{{ item }}</a\n      >\n    </li>\n  </ul>\n</div>\n", styles: [".btn-group .has-border{border-radius:50%;border:2px solid #000;height:40px;width:40px;padding:9px 0;cursor:pointer;text-align:center}.btn-group button.dropdown-toggle.btn{display:flex;align-items:center;justify-content:center;background:#ffffff;padding:0;font-size:18px;line-height:26px;box-shadow:none;width:40px;height:40px;min-height:40px;border-radius:50%!important;color:#000}.btn-group button.dropdown-toggle.btn:hover{background:#000000;color:#fff!important}.btn-group button.dropdown-toggle.btn .si-more-options{font-size:18px}.btn-group .dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit}.btn-group .dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.btn-group .dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.btn-group .dropdown-menu li a.not-allowed{cursor:not-allowed}.btn-group .dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn{background:#000;color:#fff}.btn-group.is-inverse button.dropdown-toggle.btn:hover{background:#fff;color:#000!important}.contextual-menu__dropdown-menu{min-width:240px;margin-top:10px;border:none;border-radius:10px;padding-top:20px;padding-bottom:20px;right:-10px;left:auto;box-shadow:0 0 30px rgba(0,0,0,.2);max-height:none;overflow:inherit;right:-30px;padding-top:10px!important;padding-bottom:10px!important}.contextual-menu__dropdown-menu li a.dropdown-item{padding:0 20px;line-height:40px;color:#000;font-weight:500}.contextual-menu__dropdown-menu li a.dropdown-item:hover{background:#E4E7EF;color:#000}.contextual-menu__dropdown-menu li a.not-allowed{cursor:not-allowed}.contextual-menu__dropdown-menu:before{content:\"\\e252\";font-family:Glyphicons Halflings!important;font-size:14px;transform:rotate(180deg);display:inline-block;position:absolute;top:-13px;right:23px;color:#fff}.btn-group.open button.dropdown-toggle.btn{background:#000000;color:#fff}\n"] }]
         }], ctorParameters: function () {
         return [{ type: Document, decorators: [{
                         type: Inject,
@@ -981,6 +981,7 @@ class CustomDetailWithGridComponent {
     constructor() {
         this.defaultNotesCharacterLimit = 500;
         this.resizeTimeoutId = null;
+        this.nestedDetailGridInfoId = null;
         this.detailRendererParams = {};
         this.title = 'Detail Records';
         this.notesTitle = 'Internal Session Notes';
@@ -998,6 +999,10 @@ class CustomDetailWithGridComponent {
         this.nestedSuppressRowClickSelection = true;
         this.nestedSuppressContextMenu = true;
         this.nestedSuppressAutoSizeColumns = false;
+        this.nestedRowModelType = 'clientSide';
+        this.nestedDatasource = null;
+        this.nestedPageSize = 20;
+        this.nestedCacheBlockSize = 20;
         this.nestedColumnDefs = [];
         this.nestedDefaultColDef = {
             flex: 1,
@@ -1008,7 +1013,7 @@ class CustomDetailWithGridComponent {
         this.nestedRowData = [];
     }
     agInit(params) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
         this.params = params;
         this.detailRendererParams = params;
         this.title = ((_a = params === null || params === void 0 ? void 0 : params.data) === null || _a === void 0 ? void 0 : _a.detailTitle) || ((_b = this.detailRendererParams) === null || _b === void 0 ? void 0 : _b.title) || 'Detail Records';
@@ -1034,18 +1039,40 @@ class CustomDetailWithGridComponent {
             ((_p = this.detailRendererParams) === null || _p === void 0 ? void 0 : _p.nestedSuppressContextMenu) !== false;
         this.nestedSuppressAutoSizeColumns =
             ((_q = this.detailRendererParams) === null || _q === void 0 ? void 0 : _q.nestedSuppressAutoSizeColumns) === true;
+        this.nestedRowModelType = ((_r = this.detailRendererParams) === null || _r === void 0 ? void 0 : _r.nestedRowModelType) || 'clientSide';
+        this.nestedPageSize = ((_s = this.detailRendererParams) === null || _s === void 0 ? void 0 : _s.nestedPageSize) || 20;
+        this.nestedCacheBlockSize =
+            ((_t = this.detailRendererParams) === null || _t === void 0 ? void 0 : _t.nestedCacheBlockSize) || this.nestedPageSize;
+        this.nestedDatasource = this.resolveNestedDatasource(params);
         this.nestedFrameworkComponents = this.getNestedFrameworkComponents();
-        this.nestedDefaultColDef = Object.assign({ flex: 1, suppressMenu: true, suppressMovable: true, wrapText: true }, (((_r = this.detailRendererParams) === null || _r === void 0 ? void 0 : _r.nestedDefaultColDef) || {}));
-        this.nestedRowData = ((_s = params === null || params === void 0 ? void 0 : params.data) === null || _s === void 0 ? void 0 : _s.detailRowData) || [];
+        this.nestedDefaultColDef = Object.assign({ flex: 1, suppressMenu: true, suppressMovable: true, wrapText: true }, (((_u = this.detailRendererParams) === null || _u === void 0 ? void 0 : _u.nestedDefaultColDef) || {}));
+        this.nestedRowData = ((_v = params === null || params === void 0 ? void 0 : params.data) === null || _v === void 0 ? void 0 : _v.detailRowData) || [];
         this.nestedColumnDefs = this.getNestedColumnDefs(params);
     }
     refresh(params) {
+        var _a, _b;
         this.agInit(params);
+        this.applyNestedDatasource();
+        if (this.nestedRowModelType !== 'serverSide') {
+            (_b = (_a = this.nestedGridApi) === null || _a === void 0 ? void 0 : _a.setRowData) === null || _b === void 0 ? void 0 : _b.call(_a, this.nestedRowData);
+        }
         this.resizeNestedGridColumns();
         return true;
     }
     onNestedGridReady(gridReadyEvent) {
+        var _a;
         this.nestedGridApi = gridReadyEvent.api;
+        this.registerNestedDetailGrid(gridReadyEvent);
+        this.applyNestedDatasource();
+        if ((_a = this.detailRendererParams) === null || _a === void 0 ? void 0 : _a.onNestedGridReady) {
+            this.detailRendererParams.onNestedGridReady(gridReadyEvent, this.params);
+        }
+        this.resizeNestedGridColumns();
+    }
+    setNestedRowData(rowData) {
+        var _a, _b;
+        this.nestedRowData = rowData || [];
+        (_b = (_a = this.nestedGridApi) === null || _a === void 0 ? void 0 : _a.setRowData) === null || _b === void 0 ? void 0 : _b.call(_a, this.nestedRowData);
         this.resizeNestedGridColumns();
     }
     onWindowResize() {
@@ -1113,11 +1140,44 @@ class CustomDetailWithGridComponent {
         var _a;
         return Object.assign({ moreActions: EventSettingsMoreOptionsComponent }, (((_a = this.detailRendererParams) === null || _a === void 0 ? void 0 : _a.nestedFrameworkComponents) || {}));
     }
+    resolveNestedDatasource(params) {
+        var _a, _b;
+        if ((_a = this.detailRendererParams) === null || _a === void 0 ? void 0 : _a.nestedDatasourceFactory) {
+            return this.detailRendererParams.nestedDatasourceFactory(params === null || params === void 0 ? void 0 : params.data, params);
+        }
+        return ((_b = this.detailRendererParams) === null || _b === void 0 ? void 0 : _b.nestedDatasource) || null;
+    }
+    applyNestedDatasource() {
+        if (this.nestedRowModelType === 'serverSide' &&
+            this.nestedDatasource &&
+            this.nestedGridApi) {
+            this.nestedGridApi.setServerSideDatasource(this.nestedDatasource);
+        }
+    }
+    registerNestedDetailGrid(gridReadyEvent) {
+        var _a, _b, _c, _d;
+        const parentNodeId = (_b = (_a = this.params) === null || _a === void 0 ? void 0 : _a.node) === null || _b === void 0 ? void 0 : _b.id;
+        const addDetailGridInfo = (_d = (_c = this.params) === null || _c === void 0 ? void 0 : _c.api) === null || _d === void 0 ? void 0 : _d.addDetailGridInfo;
+        if (!parentNodeId || !addDetailGridInfo) {
+            return;
+        }
+        this.nestedDetailGridInfoId = `detail_${parentNodeId}`;
+        addDetailGridInfo.call(this.params.api, this.nestedDetailGridInfoId, {
+            id: this.nestedDetailGridInfoId,
+            api: gridReadyEvent.api,
+            columnApi: gridReadyEvent.columnApi,
+        });
+    }
     destroy() {
+        var _a, _b;
         if (this.resizeTimeoutId !== null) {
             clearTimeout(this.resizeTimeoutId);
             this.resizeTimeoutId = null;
         }
+        if (this.nestedDetailGridInfoId && ((_b = (_a = this.params) === null || _a === void 0 ? void 0 : _a.api) === null || _b === void 0 ? void 0 : _b.removeDetailGridInfo)) {
+            this.params.api.removeDetailGridInfo(this.nestedDetailGridInfoId);
+            this.nestedDetailGridInfoId = null;
+        }
     }
     resizeNestedGridColumns() {
         if (this.nestedSuppressAutoSizeColumns || !this.nestedGridApi) {
@@ -1134,10 +1194,10 @@ class CustomDetailWithGridComponent {
     }
 }
 CustomDetailWithGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CustomDetailWithGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CustomDetailWithGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: CustomDetailWithGridComponent, selector: "symphony-custom-detail-with-grid", host: { listeners: { "window:resize": "onWindowResize()" } }, ngImport: i0, template: "<div class=\"custom-detail-with-grid\">\n  <div class=\"custom-detail-with-grid__header\">\n    <div class=\"custom-detail-with-grid__header-top sfx-mb-10\">\n      <h4 class=\"sfx-m-0\">{{ title }}</h4>\n      <symphony-button-v2\n        *ngIf=\"showActionButton\"\n        [text]=\"actionButtonText\"\n        (clicked)=\"onViewAllClick()\"\n      ></symphony-button-v2>\n    </div>\n\n    <div *ngIf=\"shouldShowNotesSection\" class=\"custom-detail-with-grid__notes sfx-mb-15\">\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-title sfx-d-block sfx-font-bold sfx-mb-5\"\n        [text]=\"notesTitle\"\n      ></symphony-paragraph>\n\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-description sfx-d-block\"\n        [text]=\"displayedNotesDescription\"\n      ></symphony-paragraph>\n\n      <button\n        *ngIf=\"shouldShowNotesToggle\"\n        type=\"button\"\n        class=\"custom-detail-with-grid__notes-toggle\"\n        (click)=\"toggleNotesExpansion()\"\n      >\n        {{ isNotesExpanded ? 'See Less' : 'See More' }}\n      </button>\n    </div>\n  </div>\n\n  <div class=\"custom-detail-with-grid__grid\">\n    <ag-grid-angular\n      class=\"ag-theme-alpine sfx-lib-gird-dropdown custom-detail-with-grid__nested-grid\"\n      [columnDefs]=\"nestedColumnDefs\"\n      [defaultColDef]=\"nestedDefaultColDef\"\n      [frameworkComponents]=\"nestedFrameworkComponents\"\n      [rowHeight]=\"nestedRowHeight\"\n      [rowData]=\"nestedRowData\"\n      [suppressRowClickSelection]=\"nestedSuppressRowClickSelection\"\n      [suppressContextMenu]=\"nestedSuppressContextMenu\"\n      [rowSelection]=\"nestedRowSelection\"\n      (gridReady)=\"onNestedGridReady($event)\"\n    ></ag-grid-angular>\n  </div>\n</div>\n", styles: ["symphony-custom-detail-with-grid{display:block;height:100%;width:100%}symphony-custom-detail-with-grid .custom-detail-with-grid{display:flex;flex-direction:column;height:100%;width:100%;padding:20px}symphony-custom-detail-with-grid .custom-detail-with-grid__header{display:flex;flex-direction:column}symphony-custom-detail-with-grid .custom-detail-with-grid__header-top{align-items:center;display:flex;justify-content:space-between}symphony-custom-detail-with-grid .custom-detail-with-grid__notes{background-color:#f0f4ff;border:1px solid #d1e0ff;border-radius:8px;padding:16px}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-title{color:#324158}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-description{white-space:normal}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-toggle{background:none;border:0;color:#0091fb;cursor:pointer;display:block;line-height:20px;margin-top:8px;padding:0;text-align:left;font-size:13px}symphony-custom-detail-with-grid .custom-detail-with-grid__grid{display:block;flex:1;min-height:180px;overflow:hidden;width:100%;border-radius:10px}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid{display:block;height:100%;width:100%;background:#fff}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-cell,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-header-cell{padding-left:5px!important}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options.open .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options.open .btn-group button.dropdown-toggle.btn:hover,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}\n"], components: [{ type: ButtonV2Component, selector: "symphony-button-v2" }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i1$3.AgGridAngular, selector: "ag-grid-angular", inputs: ["alignedGrids", "rowData", "columnDefs", "excelStyles", "pinnedTopRowData", "pinnedBottomRowData", "chartThemes", "components", "frameworkComponents", "rowStyle", "context", "autoGroupColumnDef", "localeText", "icons", "datasource", "serverSideDatasource", "viewportDatasource", "groupRowRendererParams", "aggFuncs", "fullWidthCellRendererParams", "defaultColGroupDef", "defaultColDef", "defaultExportParams", "columnTypes", "rowClassRules", "detailGridOptions", "detailCellRendererParams", "loadingCellRendererParams", "loadingOverlayComponentParams", "noRowsOverlayComponentParams", "popupParent", "colResizeDefault", "reduxStore", "statusBar", "sideBar", "chartThemeOverrides", "customChartThemes", "sortingOrder", "rowClass", "rowSelection", "overlayLoadingTemplate", "overlayNoRowsTemplate", "quickFilterText", "rowModelType", "editType", "domLayout", "clipboardDeliminator", "rowGroupPanelShow", "multiSortKey", "pivotColumnGroupTotals", "pivotRowTotals", "pivotPanelShow", "fillHandleDirection", "rowHeight", "detailRowHeight", "rowBuffer", "colWidth", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "groupDefaultExpanded", "minColWidth", "maxColWidth", "viewportRowModelPageSize", "viewportRowModelBufferSize", "autoSizePadding", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "tooltipShowDelay", "cacheOverflowSize", "paginationPageSize", "cacheBlockSize", "infiniteInitialRowCount", "scrollbarWidth", "batchUpdateWaitMillis", "asyncTransactionWaitMillis", "blockLoadDebounceMillis", "keepDetailRowsCount", "undoRedoCellEditingLimit", "cellFlashDelay", "cellFadeDelay", "localeTextFunc", "groupRowInnerRenderer", "groupRowInnerRendererFramework", "dateComponent", "dateComponentFramework", "groupRowRenderer", "groupRowRendererFramework", "isExternalFilterPresent", "getRowHeight", "doesExternalFilterPass", "getRowClass", "getRowStyle", "getRowClassRules", "traverseNode", "getContextMenuItems", "getMainMenuItems", "processRowPostCreate", "processCellForClipboard", "groupRowAggNodes", "getRowNodeId", "isFullWidthCell", "fullWidthCellRenderer", "fullWidthCellRendererFramework", "processSecondaryColDef", "processSecondaryColGroupDef", "getBusinessKeyForNode", "sendToClipboard", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getDetailRowData", "processCellFromClipboard", "getDocument", "postProcessPopup", "getChildCount", "getDataPath", "loadingCellRenderer", "loadingCellRendererFramework", "loadingOverlayComponent", "loadingOverlayComponentFramework", "noRowsOverlayComponent", "noRowsOverlayComponentFramework", "detailCellRenderer", "detailCellRendererFramework", "defaultGroupSortComparator", "isRowMaster", "isRowSelectable", "postSort", "processHeaderForClipboard", "paginationNumberFormatter", "processDataFromClipboard", "getServerSideGroupKey", "isServerSideGroup", "suppressKeyboardEvent", "createChartContainer", "processChartOptions", "getChartToolbarItems", "fillOperation", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowClickSelection", "suppressCellSelection", "suppressHorizontalScroll", "alwaysShowVerticalScroll", "debug", "enableBrowserTooltips", "enableCellExpressions", "angularCompileRows", "angularCompileFilters", "groupSuppressAutoColumn", "groupSelectsChildren", "groupIncludeFooter", "groupIncludeTotalFooter", "groupUseEntireRow", "groupSuppressBlankHeader", "suppressMenuHide", "suppressRowDeselection", "unSortIcon", "suppressMultiSort", "singleClickEdit", "suppressLoadingOverlay", "suppressNoRowsOverlay", "suppressAutoSize", "skipHeaderOnAutoSize", "suppressParentsInRowNodes", "suppressColumnMoveAnimation", "suppressMovableColumns", "suppressFieldDotNotation", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "suppressClearOnFillReduction", "deltaSort", "suppressTouch", "suppressAsyncEvents", "allowContextMenuWithControlKey", "suppressContextMenu", "rememberGroupStateWhenNewData", "enableCellChangeFlash", "suppressDragLeaveHidesColumns", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "suppressCopyRowsToClipboard", "copyHeadersToClipboard", "pivotMode", "suppressAggFuncInHeader", "suppressColumnVirtualisation", "suppressAggAtRootLevel", "suppressFocusAfterRefresh", "functionsPassive", "functionsReadOnly", "animateRows", "groupSelectsFiltered", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "enableRtl", "suppressClickEdit", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "enableMultiRowDragging", "enableGroupEdit", "embedFullWidthRows", "deprecatedEmbedFullWidthRows", "suppressPaginationPanel", "floatingFilter", "groupHideOpenParents", "groupMultiAutoColumn", "pagination", "stopEditingWhenGridLosesFocus", "paginationAutoPageSize", "suppressScrollOnNewData", "purgeClosedRowNodes", "cacheQuickFilter", "deltaRowDataMode", "ensureDomOrder", "accentedSort", "suppressChangeDetection", "valueCache", "valueCacheNeverExpires", "aggregateOnlyChangedColumns", "suppressAnimationFrame", "suppressExcelExport", "suppressCsvExport", "treeData", "masterDetail", "suppressMultiRangeSelection", "enterMovesDownAfterEdit", "enterMovesDown", "suppressPropertyNamesCheck", "rowMultiSelectWithClick", "suppressEnterpriseResetOnNewColumns", "enableOldSetFilterModel", "suppressRowHoverHighlight", "suppressRowTransform", "suppressClipboardPaste", "suppressLastEmptyLineOnPaste", "serverSideSortingAlwaysResets", "reactNext", "suppressSetColumnStateEvents", "suppressColumnStateEvents", "enableCharts", "deltaColumnMode", "suppressMaintainUnsortedOrder", "enableCellTextSelection", "suppressBrowserResizeObserver", "suppressMaxRenderedRowRestriction", "excludeChildrenWhenTreeDataFiltering", "tooltipMouseTrack", "keepDetailRows", "paginateChildRows", "preventDefaultOnContextMenu", "undoRedoCellEditing", "allowDragFromColumnsToolPanel", "immutableData", "immutableColumns", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "applyColumnDefOrder", "debounceVerticalScrollbar", "detailRowAutoHeight", "gridOptions", "modules"], outputs: ["columnEverythingChanged", "newColumnsLoaded", "columnPivotModeChanged", "columnRowGroupChanged", "expandOrCollapseAll", "columnPivotChanged", "gridColumnsChanged", "columnValueChanged", "columnMoved", "columnVisible", "columnPinned", "columnGroupOpened", "columnResized", "displayedColumnsChanged", "virtualColumnsChanged", "rowGroupOpened", "rowDataChanged", "rowDataUpdated", "pinnedRowDataChanged", "rangeSelectionChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "toolPanelVisibleChanged", "modelUpdated", "pasteStart", "pasteEnd", "fillStart", "fillEnd", "cellClicked", "cellDoubleClicked", "cellMouseDown", "cellContextMenu", "cellValueChanged", "rowValueChanged", "cellFocused", "rowSelected", "selectionChanged", "cellKeyDown", "cellKeyPress", "cellMouseOver", "cellMouseOut", "filterChanged", "filterModified", "filterOpened", "sortChanged", "virtualRowRemoved", "rowClicked", "rowDoubleClicked", "gridReady", "gridSizeChanged", "viewportChanged", "scrollbarWidthChanged", "firstDataRendered", "dragStarted", "dragStopped", "checkboxChanged", "rowEditingStarted", "rowEditingStopped", "cellEditingStarted", "cellEditingStopped", "bodyScroll", "animationQueueEmpty", "heightScaleChanged", "paginationChanged", "componentStateChanged", "bodyHeightChanged", "displayedColumnsWidthChanged", "scrollVisibilityChanged", "columnHoverChanged", "flashCells", "paginationPixelOffsetChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "popupToFront", "columnRowGroupChangeRequest", "columnPivotChangeRequest", "columnValueChangeRequest", "columnAggFuncChangeRequest", "keyboardFocus", "mouseFocus"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
+CustomDetailWithGridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: CustomDetailWithGridComponent, selector: "symphony-custom-detail-with-grid", host: { listeners: { "window:resize": "onWindowResize()" } }, ngImport: i0, template: "<div class=\"custom-detail-with-grid\">\n  <div class=\"custom-detail-with-grid__header\">\n    <div class=\"custom-detail-with-grid__header-top sfx-mb-10\">\n      <h4 class=\"sfx-m-0\">{{ title }}</h4>\n      <symphony-button-v2\n        *ngIf=\"showActionButton\"\n        [text]=\"actionButtonText\"\n        (clicked)=\"onViewAllClick()\"\n      ></symphony-button-v2>\n    </div>\n\n    <div *ngIf=\"shouldShowNotesSection\" class=\"custom-detail-with-grid__notes sfx-mb-15\">\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-title sfx-d-block sfx-font-bold sfx-mb-5\"\n        [text]=\"notesTitle\"\n      ></symphony-paragraph>\n\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-description sfx-d-block\"\n        [text]=\"displayedNotesDescription\"\n      ></symphony-paragraph>\n\n      <button\n        *ngIf=\"shouldShowNotesToggle\"\n        type=\"button\"\n        class=\"custom-detail-with-grid__notes-toggle\"\n        (click)=\"toggleNotesExpansion()\"\n      >\n        {{ isNotesExpanded ? 'See Less' : 'See More' }}\n      </button>\n    </div>\n  </div>\n\n  <div class=\"custom-detail-with-grid__grid\">\n    <ag-grid-angular\n      class=\"ag-theme-alpine sfx-lib-gird-dropdown custom-detail-with-grid__nested-grid\"\n      [columnDefs]=\"nestedColumnDefs\"\n      [defaultColDef]=\"nestedDefaultColDef\"\n      [frameworkComponents]=\"nestedFrameworkComponents\"\n      [rowHeight]=\"nestedRowHeight\"\n      [rowModelType]=\"nestedRowModelType\"\n      [paginationPageSize]=\"nestedPageSize\"\n      [cacheBlockSize]=\"nestedCacheBlockSize\"\n      [maxConcurrentDatasourceRequests]=\"1\"\n      [serverSideSortingAlwaysResets]=\"true\"\n      [rowData]=\"nestedRowData\"\n      [suppressRowClickSelection]=\"nestedSuppressRowClickSelection\"\n      [suppressContextMenu]=\"nestedSuppressContextMenu\"\n      [rowSelection]=\"nestedRowSelection\"\n      (gridReady)=\"onNestedGridReady($event)\"\n    ></ag-grid-angular>\n  </div>\n</div>\n", styles: ["symphony-custom-detail-with-grid{display:block;height:100%;width:100%}symphony-custom-detail-with-grid .custom-detail-with-grid{display:flex;flex-direction:column;height:100%;width:100%;padding:20px}symphony-custom-detail-with-grid .custom-detail-with-grid__header{display:flex;flex-direction:column}symphony-custom-detail-with-grid .custom-detail-with-grid__header-top{align-items:center;display:flex;justify-content:space-between}symphony-custom-detail-with-grid .custom-detail-with-grid__notes{background-color:#f0f4ff;border:1px solid #d1e0ff;border-radius:8px;padding:16px}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-title{color:#324158}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-description{white-space:normal}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-toggle{background:none;border:0;color:#0091fb;cursor:pointer;display:block;line-height:20px;margin-top:8px;padding:0;text-align:left;font-size:13px}symphony-custom-detail-with-grid .custom-detail-with-grid__grid{display:block;flex:1;min-height:180px;overflow:hidden;width:100%;border-radius:10px}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid{display:block;height:100%;width:100%;background:#fff}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-cell,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-header-cell{padding-left:5px!important}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options.open .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options.open .btn-group button.dropdown-toggle.btn:hover,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}\n"], components: [{ type: ButtonV2Component, selector: "symphony-button-v2" }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i1$3.AgGridAngular, selector: "ag-grid-angular", inputs: ["alignedGrids", "rowData", "columnDefs", "excelStyles", "pinnedTopRowData", "pinnedBottomRowData", "chartThemes", "components", "frameworkComponents", "rowStyle", "context", "autoGroupColumnDef", "localeText", "icons", "datasource", "serverSideDatasource", "viewportDatasource", "groupRowRendererParams", "aggFuncs", "fullWidthCellRendererParams", "defaultColGroupDef", "defaultColDef", "defaultExportParams", "columnTypes", "rowClassRules", "detailGridOptions", "detailCellRendererParams", "loadingCellRendererParams", "loadingOverlayComponentParams", "noRowsOverlayComponentParams", "popupParent", "colResizeDefault", "reduxStore", "statusBar", "sideBar", "chartThemeOverrides", "customChartThemes", "sortingOrder", "rowClass", "rowSelection", "overlayLoadingTemplate", "overlayNoRowsTemplate", "quickFilterText", "rowModelType", "editType", "domLayout", "clipboardDeliminator", "rowGroupPanelShow", "multiSortKey", "pivotColumnGroupTotals", "pivotRowTotals", "pivotPanelShow", "fillHandleDirection", "rowHeight", "detailRowHeight", "rowBuffer", "colWidth", "headerHeight", "groupHeaderHeight", "floatingFiltersHeight", "pivotHeaderHeight", "pivotGroupHeaderHeight", "groupDefaultExpanded", "minColWidth", "maxColWidth", "viewportRowModelPageSize", "viewportRowModelBufferSize", "autoSizePadding", "maxBlocksInCache", "maxConcurrentDatasourceRequests", "tooltipShowDelay", "cacheOverflowSize", "paginationPageSize", "cacheBlockSize", "infiniteInitialRowCount", "scrollbarWidth", "batchUpdateWaitMillis", "asyncTransactionWaitMillis", "blockLoadDebounceMillis", "keepDetailRowsCount", "undoRedoCellEditingLimit", "cellFlashDelay", "cellFadeDelay", "localeTextFunc", "groupRowInnerRenderer", "groupRowInnerRendererFramework", "dateComponent", "dateComponentFramework", "groupRowRenderer", "groupRowRendererFramework", "isExternalFilterPresent", "getRowHeight", "doesExternalFilterPass", "getRowClass", "getRowStyle", "getRowClassRules", "traverseNode", "getContextMenuItems", "getMainMenuItems", "processRowPostCreate", "processCellForClipboard", "groupRowAggNodes", "getRowNodeId", "isFullWidthCell", "fullWidthCellRenderer", "fullWidthCellRendererFramework", "processSecondaryColDef", "processSecondaryColGroupDef", "getBusinessKeyForNode", "sendToClipboard", "navigateToNextHeader", "tabToNextHeader", "navigateToNextCell", "tabToNextCell", "getDetailRowData", "processCellFromClipboard", "getDocument", "postProcessPopup", "getChildCount", "getDataPath", "loadingCellRenderer", "loadingCellRendererFramework", "loadingOverlayComponent", "loadingOverlayComponentFramework", "noRowsOverlayComponent", "noRowsOverlayComponentFramework", "detailCellRenderer", "detailCellRendererFramework", "defaultGroupSortComparator", "isRowMaster", "isRowSelectable", "postSort", "processHeaderForClipboard", "paginationNumberFormatter", "processDataFromClipboard", "getServerSideGroupKey", "isServerSideGroup", "suppressKeyboardEvent", "createChartContainer", "processChartOptions", "getChartToolbarItems", "fillOperation", "suppressMakeColumnVisibleAfterUnGroup", "suppressRowClickSelection", "suppressCellSelection", "suppressHorizontalScroll", "alwaysShowVerticalScroll", "debug", "enableBrowserTooltips", "enableCellExpressions", "angularCompileRows", "angularCompileFilters", "groupSuppressAutoColumn", "groupSelectsChildren", "groupIncludeFooter", "groupIncludeTotalFooter", "groupUseEntireRow", "groupSuppressBlankHeader", "suppressMenuHide", "suppressRowDeselection", "unSortIcon", "suppressMultiSort", "singleClickEdit", "suppressLoadingOverlay", "suppressNoRowsOverlay", "suppressAutoSize", "skipHeaderOnAutoSize", "suppressParentsInRowNodes", "suppressColumnMoveAnimation", "suppressMovableColumns", "suppressFieldDotNotation", "enableRangeSelection", "enableRangeHandle", "enableFillHandle", "suppressClearOnFillReduction", "deltaSort", "suppressTouch", "suppressAsyncEvents", "allowContextMenuWithControlKey", "suppressContextMenu", "rememberGroupStateWhenNewData", "enableCellChangeFlash", "suppressDragLeaveHidesColumns", "suppressMiddleClickScrolls", "suppressPreventDefaultOnMouseWheel", "suppressCopyRowsToClipboard", "copyHeadersToClipboard", "pivotMode", "suppressAggFuncInHeader", "suppressColumnVirtualisation", "suppressAggAtRootLevel", "suppressFocusAfterRefresh", "functionsPassive", "functionsReadOnly", "animateRows", "groupSelectsFiltered", "groupRemoveSingleChildren", "groupRemoveLowestSingleChildren", "enableRtl", "suppressClickEdit", "rowDragManaged", "suppressRowDrag", "suppressMoveWhenRowDragging", "enableMultiRowDragging", "enableGroupEdit", "embedFullWidthRows", "deprecatedEmbedFullWidthRows", "suppressPaginationPanel", "floatingFilter", "groupHideOpenParents", "groupMultiAutoColumn", "pagination", "stopEditingWhenGridLosesFocus", "paginationAutoPageSize", "suppressScrollOnNewData", "purgeClosedRowNodes", "cacheQuickFilter", "deltaRowDataMode", "ensureDomOrder", "accentedSort", "suppressChangeDetection", "valueCache", "valueCacheNeverExpires", "aggregateOnlyChangedColumns", "suppressAnimationFrame", "suppressExcelExport", "suppressCsvExport", "treeData", "masterDetail", "suppressMultiRangeSelection", "enterMovesDownAfterEdit", "enterMovesDown", "suppressPropertyNamesCheck", "rowMultiSelectWithClick", "suppressEnterpriseResetOnNewColumns", "enableOldSetFilterModel", "suppressRowHoverHighlight", "suppressRowTransform", "suppressClipboardPaste", "suppressLastEmptyLineOnPaste", "serverSideSortingAlwaysResets", "reactNext", "suppressSetColumnStateEvents", "suppressColumnStateEvents", "enableCharts", "deltaColumnMode", "suppressMaintainUnsortedOrder", "enableCellTextSelection", "suppressBrowserResizeObserver", "suppressMaxRenderedRowRestriction", "excludeChildrenWhenTreeDataFiltering", "tooltipMouseTrack", "keepDetailRows", "paginateChildRows", "preventDefaultOnContextMenu", "undoRedoCellEditing", "allowDragFromColumnsToolPanel", "immutableData", "immutableColumns", "pivotSuppressAutoColumn", "suppressExpandablePivotGroups", "applyColumnDefOrder", "debounceVerticalScrollbar", "detailRowAutoHeight", "gridOptions", "modules"], outputs: ["columnEverythingChanged", "newColumnsLoaded", "columnPivotModeChanged", "columnRowGroupChanged", "expandOrCollapseAll", "columnPivotChanged", "gridColumnsChanged", "columnValueChanged", "columnMoved", "columnVisible", "columnPinned", "columnGroupOpened", "columnResized", "displayedColumnsChanged", "virtualColumnsChanged", "rowGroupOpened", "rowDataChanged", "rowDataUpdated", "pinnedRowDataChanged", "rangeSelectionChanged", "chartCreated", "chartRangeSelectionChanged", "chartOptionsChanged", "chartDestroyed", "toolPanelVisibleChanged", "modelUpdated", "pasteStart", "pasteEnd", "fillStart", "fillEnd", "cellClicked", "cellDoubleClicked", "cellMouseDown", "cellContextMenu", "cellValueChanged", "rowValueChanged", "cellFocused", "rowSelected", "selectionChanged", "cellKeyDown", "cellKeyPress", "cellMouseOver", "cellMouseOut", "filterChanged", "filterModified", "filterOpened", "sortChanged", "virtualRowRemoved", "rowClicked", "rowDoubleClicked", "gridReady", "gridSizeChanged", "viewportChanged", "scrollbarWidthChanged", "firstDataRendered", "dragStarted", "dragStopped", "checkboxChanged", "rowEditingStarted", "rowEditingStopped", "cellEditingStarted", "cellEditingStopped", "bodyScroll", "animationQueueEmpty", "heightScaleChanged", "paginationChanged", "componentStateChanged", "bodyHeightChanged", "displayedColumnsWidthChanged", "scrollVisibilityChanged", "columnHoverChanged", "flashCells", "paginationPixelOffsetChanged", "rowDragEnter", "rowDragMove", "rowDragLeave", "rowDragEnd", "popupToFront", "columnRowGroupChangeRequest", "columnPivotChangeRequest", "columnValueChangeRequest", "columnAggFuncChangeRequest", "keyboardFocus", "mouseFocus"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CustomDetailWithGridComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-custom-detail-with-grid', encapsulation: ViewEncapsulation.None, template: "<div class=\"custom-detail-with-grid\">\n  <div class=\"custom-detail-with-grid__header\">\n    <div class=\"custom-detail-with-grid__header-top sfx-mb-10\">\n      <h4 class=\"sfx-m-0\">{{ title }}</h4>\n      <symphony-button-v2\n        *ngIf=\"showActionButton\"\n        [text]=\"actionButtonText\"\n        (clicked)=\"onViewAllClick()\"\n      ></symphony-button-v2>\n    </div>\n\n    <div *ngIf=\"shouldShowNotesSection\" class=\"custom-detail-with-grid__notes sfx-mb-15\">\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-title sfx-d-block sfx-font-bold sfx-mb-5\"\n        [text]=\"notesTitle\"\n      ></symphony-paragraph>\n\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-description sfx-d-block\"\n        [text]=\"displayedNotesDescription\"\n      ></symphony-paragraph>\n\n      <button\n        *ngIf=\"shouldShowNotesToggle\"\n        type=\"button\"\n        class=\"custom-detail-with-grid__notes-toggle\"\n        (click)=\"toggleNotesExpansion()\"\n      >\n        {{ isNotesExpanded ? 'See Less' : 'See More' }}\n      </button>\n    </div>\n  </div>\n\n  <div class=\"custom-detail-with-grid__grid\">\n    <ag-grid-angular\n      class=\"ag-theme-alpine sfx-lib-gird-dropdown custom-detail-with-grid__nested-grid\"\n      [columnDefs]=\"nestedColumnDefs\"\n      [defaultColDef]=\"nestedDefaultColDef\"\n      [frameworkComponents]=\"nestedFrameworkComponents\"\n      [rowHeight]=\"nestedRowHeight\"\n      [rowData]=\"nestedRowData\"\n      [suppressRowClickSelection]=\"nestedSuppressRowClickSelection\"\n      [suppressContextMenu]=\"nestedSuppressContextMenu\"\n      [rowSelection]=\"nestedRowSelection\"\n      (gridReady)=\"onNestedGridReady($event)\"\n    ></ag-grid-angular>\n  </div>\n</div>\n", styles: ["symphony-custom-detail-with-grid{display:block;height:100%;width:100%}symphony-custom-detail-with-grid .custom-detail-with-grid{display:flex;flex-direction:column;height:100%;width:100%;padding:20px}symphony-custom-detail-with-grid .custom-detail-with-grid__header{display:flex;flex-direction:column}symphony-custom-detail-with-grid .custom-detail-with-grid__header-top{align-items:center;display:flex;justify-content:space-between}symphony-custom-detail-with-grid .custom-detail-with-grid__notes{background-color:#f0f4ff;border:1px solid #d1e0ff;border-radius:8px;padding:16px}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-title{color:#324158}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-description{white-space:normal}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-toggle{background:none;border:0;color:#0091fb;cursor:pointer;display:block;line-height:20px;margin-top:8px;padding:0;text-align:left;font-size:13px}symphony-custom-detail-with-grid .custom-detail-with-grid__grid{display:block;flex:1;min-height:180px;overflow:hidden;width:100%;border-radius:10px}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid{display:block;height:100%;width:100%;background:#fff}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-cell,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-header-cell{padding-left:5px!important}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options.open .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options.open .btn-group button.dropdown-toggle.btn:hover,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}\n"] }]
+            args: [{ selector: 'symphony-custom-detail-with-grid', encapsulation: ViewEncapsulation.None, template: "<div class=\"custom-detail-with-grid\">\n  <div class=\"custom-detail-with-grid__header\">\n    <div class=\"custom-detail-with-grid__header-top sfx-mb-10\">\n      <h4 class=\"sfx-m-0\">{{ title }}</h4>\n      <symphony-button-v2\n        *ngIf=\"showActionButton\"\n        [text]=\"actionButtonText\"\n        (clicked)=\"onViewAllClick()\"\n      ></symphony-button-v2>\n    </div>\n\n    <div *ngIf=\"shouldShowNotesSection\" class=\"custom-detail-with-grid__notes sfx-mb-15\">\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-title sfx-d-block sfx-font-bold sfx-mb-5\"\n        [text]=\"notesTitle\"\n      ></symphony-paragraph>\n\n      <symphony-paragraph\n        class=\"custom-detail-with-grid__notes-description sfx-d-block\"\n        [text]=\"displayedNotesDescription\"\n      ></symphony-paragraph>\n\n      <button\n        *ngIf=\"shouldShowNotesToggle\"\n        type=\"button\"\n        class=\"custom-detail-with-grid__notes-toggle\"\n        (click)=\"toggleNotesExpansion()\"\n      >\n        {{ isNotesExpanded ? 'See Less' : 'See More' }}\n      </button>\n    </div>\n  </div>\n\n  <div class=\"custom-detail-with-grid__grid\">\n    <ag-grid-angular\n      class=\"ag-theme-alpine sfx-lib-gird-dropdown custom-detail-with-grid__nested-grid\"\n      [columnDefs]=\"nestedColumnDefs\"\n      [defaultColDef]=\"nestedDefaultColDef\"\n      [frameworkComponents]=\"nestedFrameworkComponents\"\n      [rowHeight]=\"nestedRowHeight\"\n      [rowModelType]=\"nestedRowModelType\"\n      [paginationPageSize]=\"nestedPageSize\"\n      [cacheBlockSize]=\"nestedCacheBlockSize\"\n      [maxConcurrentDatasourceRequests]=\"1\"\n      [serverSideSortingAlwaysResets]=\"true\"\n      [rowData]=\"nestedRowData\"\n      [suppressRowClickSelection]=\"nestedSuppressRowClickSelection\"\n      [suppressContextMenu]=\"nestedSuppressContextMenu\"\n      [rowSelection]=\"nestedRowSelection\"\n      (gridReady)=\"onNestedGridReady($event)\"\n    ></ag-grid-angular>\n  </div>\n</div>\n", styles: ["symphony-custom-detail-with-grid{display:block;height:100%;width:100%}symphony-custom-detail-with-grid .custom-detail-with-grid{display:flex;flex-direction:column;height:100%;width:100%;padding:20px}symphony-custom-detail-with-grid .custom-detail-with-grid__header{display:flex;flex-direction:column}symphony-custom-detail-with-grid .custom-detail-with-grid__header-top{align-items:center;display:flex;justify-content:space-between}symphony-custom-detail-with-grid .custom-detail-with-grid__notes{background-color:#f0f4ff;border:1px solid #d1e0ff;border-radius:8px;padding:16px}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-title{color:#324158}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-description{white-space:normal}symphony-custom-detail-with-grid .custom-detail-with-grid__notes-toggle{background:none;border:0;color:#0091fb;cursor:pointer;display:block;line-height:20px;margin-top:8px;padding:0;text-align:left;font-size:13px}symphony-custom-detail-with-grid .custom-detail-with-grid__grid{display:block;flex:1;min-height:180px;overflow:hidden;width:100%;border-radius:10px}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid{display:block;height:100%;width:100%;background:#fff}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-cell,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid.ag-theme-alpine .ag-header-cell{padding-left:5px!important}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .more-options.open .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group.open button.dropdown-toggle.btn,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options.open .btn-group button.dropdown-toggle.btn:hover,symphony-custom-detail-with-grid .custom-detail-with-grid__nested-grid .ag-row.ag-row-hover .more-options .btn-group button.dropdown-toggle.btn:hover{background:#f1f2f5!important;color:#334860}\n"] }]
         }], propDecorators: { onWindowResize: [{
                 type: HostListener,
                 args: ['window:resize']
@@ -2719,10 +2779,10 @@ class PillComponent {
     }
 }
 PillComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-PillComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: PillComponent, selector: "symphony-pill", inputs: { pillLabel: "pillLabel", isInverse: "isInverse", hasClose: "hasClose", tooltipLabel: "tooltipLabel" }, outputs: { removePill: "removePill" }, ngImport: i0, template: "<span *ngIf=\"tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    tooltip=\"{{tooltipLabel}}\"\n    placement=\"top\"\n    containerClass=\"sfx-info-tooltip pill-tooltip\"\n    [adaptivePosition]=\"false\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>\n\n<span *ngIf=\"!tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>", styles: [".sfx-pill-item{font-family:neuzeit_groteskbold;background-color:#f1f1f1;color:#000;padding:10px 20px;border-radius:25px;text-align:center;font-weight:600;margin-right:10px;margin-top:10px;position:relative}.sfx-pill-item:hover,.sfx-pill-item.inverse-pill{background-color:#000;color:#fff}.sfx-pill-item.has-close{padding:10px 20px 10px 38px}.sfx-pill-item i{font-size:18px;position:absolute;left:14px;top:11px;transform:rotate(45deg)}.sfx-d-inline-block{display:inline-block}.sfx-cursor-pointer{cursor:pointer}.sfx-info-tooltip{min-width:100px}.sfx-info-tooltip.pill-tooltip{min-width:80px;opacity:1;top:-5px!important}.sfx-info-tooltip.pill-tooltip .tooltip-inner{border-radius:10px;box-shadow:0 0 20px rgba(0,0,0,.2);font-weight:600}.sfx-info-tooltip.pill-tooltip .tooltip-arrow.arrow{border-top-color:#fff}.sfx-info-tooltip .tooltip-inner{background-color:#fff;padding:8px 15px;border-radius:0;max-width:160px;font-size:13px;color:#000}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$2.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["containerClass", "tooltipAnimation", "tooltipFadeDuration", "isOpen", "tooltipHtml", "tooltip", "tooltipPlacement", "placement", "tooltipIsOpen", "tooltipEnable", "isDisabled", "tooltipAppendToBody", "container", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "delay", "tooltipTrigger", "triggers", "adaptivePosition"], outputs: ["tooltipChange", "tooltipStateChanged", "onShown", "onHidden"], exportAs: ["bs-tooltip"] }], encapsulation: i0.ViewEncapsulation.None });
+PillComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: PillComponent, selector: "symphony-pill", inputs: { pillLabel: "pillLabel", isInverse: "isInverse", hasClose: "hasClose", tooltipLabel: "tooltipLabel" }, outputs: { removePill: "removePill" }, ngImport: i0, template: "<span *ngIf=\"tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    tooltip=\"{{tooltipLabel}}\"\n    placement=\"top\"\n    containerClass=\"sfx-info-tooltip pill-tooltip\"\n    [adaptivePosition]=\"false\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>\n\n<span *ngIf=\"!tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>", styles: [".sfx-pill-item{font-family:runda,sans-serif;background-color:#f1f1f1;color:#000;padding:10px 20px;border-radius:25px;text-align:center;font-weight:600;margin-right:10px;margin-top:10px;position:relative}.sfx-pill-item:hover,.sfx-pill-item.inverse-pill{background-color:#000;color:#fff}.sfx-pill-item.has-close{padding:10px 20px 10px 38px}.sfx-pill-item i{font-size:18px;position:absolute;left:14px;top:11px;transform:rotate(45deg)}.sfx-d-inline-block{display:inline-block}.sfx-cursor-pointer{cursor:pointer}.sfx-info-tooltip{min-width:100px}.sfx-info-tooltip.pill-tooltip{min-width:80px;opacity:1;top:-5px!important}.sfx-info-tooltip.pill-tooltip .tooltip-inner{border-radius:10px;box-shadow:0 0 20px rgba(0,0,0,.2);font-weight:600}.sfx-info-tooltip.pill-tooltip .tooltip-arrow.arrow{border-top-color:#fff}.sfx-info-tooltip .tooltip-inner{background-color:#fff;padding:8px 15px;border-radius:0;max-width:160px;font-size:13px;color:#000}\n"], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1$2.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["containerClass", "tooltipAnimation", "tooltipFadeDuration", "isOpen", "tooltipHtml", "tooltip", "tooltipPlacement", "placement", "tooltipIsOpen", "tooltipEnable", "isDisabled", "tooltipAppendToBody", "container", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "delay", "tooltipTrigger", "triggers", "adaptivePosition"], outputs: ["tooltipChange", "tooltipStateChanged", "onShown", "onHidden"], exportAs: ["bs-tooltip"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PillComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-pill', encapsulation: ViewEncapsulation.None, template: "<span *ngIf=\"tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    tooltip=\"{{tooltipLabel}}\"\n    placement=\"top\"\n    containerClass=\"sfx-info-tooltip pill-tooltip\"\n    [adaptivePosition]=\"false\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>\n\n<span *ngIf=\"!tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>", styles: [".sfx-pill-item{font-family:neuzeit_groteskbold;background-color:#f1f1f1;color:#000;padding:10px 20px;border-radius:25px;text-align:center;font-weight:600;margin-right:10px;margin-top:10px;position:relative}.sfx-pill-item:hover,.sfx-pill-item.inverse-pill{background-color:#000;color:#fff}.sfx-pill-item.has-close{padding:10px 20px 10px 38px}.sfx-pill-item i{font-size:18px;position:absolute;left:14px;top:11px;transform:rotate(45deg)}.sfx-d-inline-block{display:inline-block}.sfx-cursor-pointer{cursor:pointer}.sfx-info-tooltip{min-width:100px}.sfx-info-tooltip.pill-tooltip{min-width:80px;opacity:1;top:-5px!important}.sfx-info-tooltip.pill-tooltip .tooltip-inner{border-radius:10px;box-shadow:0 0 20px rgba(0,0,0,.2);font-weight:600}.sfx-info-tooltip.pill-tooltip .tooltip-arrow.arrow{border-top-color:#fff}.sfx-info-tooltip .tooltip-inner{background-color:#fff;padding:8px 15px;border-radius:0;max-width:160px;font-size:13px;color:#000}\n"] }]
+            args: [{ selector: 'symphony-pill', encapsulation: ViewEncapsulation.None, template: "<span *ngIf=\"tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    tooltip=\"{{tooltipLabel}}\"\n    placement=\"top\"\n    containerClass=\"sfx-info-tooltip pill-tooltip\"\n    [adaptivePosition]=\"false\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>\n\n<span *ngIf=\"!tooltipLabel\"\n    class=\"sfx-d-inline-block sfx-pill-item\"\n    [ngClass]=\"{'inverse-pill': isInverse }\"\n    [ngClass]=\"{'has-close': hasClose }\"\n    >\n    <i *ngIf=\"hasClose\" (click)=\"onRemoveClick()\"\n        class=\"si-add sfx-cursor-pointer\"\n    ></i>\n    {{ pillLabel }}\n</span>", styles: [".sfx-pill-item{font-family:runda,sans-serif;background-color:#f1f1f1;color:#000;padding:10px 20px;border-radius:25px;text-align:center;font-weight:600;margin-right:10px;margin-top:10px;position:relative}.sfx-pill-item:hover,.sfx-pill-item.inverse-pill{background-color:#000;color:#fff}.sfx-pill-item.has-close{padding:10px 20px 10px 38px}.sfx-pill-item i{font-size:18px;position:absolute;left:14px;top:11px;transform:rotate(45deg)}.sfx-d-inline-block{display:inline-block}.sfx-cursor-pointer{cursor:pointer}.sfx-info-tooltip{min-width:100px}.sfx-info-tooltip.pill-tooltip{min-width:80px;opacity:1;top:-5px!important}.sfx-info-tooltip.pill-tooltip .tooltip-inner{border-radius:10px;box-shadow:0 0 20px rgba(0,0,0,.2);font-weight:600}.sfx-info-tooltip.pill-tooltip .tooltip-arrow.arrow{border-top-color:#fff}.sfx-info-tooltip .tooltip-inner{background-color:#fff;padding:8px 15px;border-radius:0;max-width:160px;font-size:13px;color:#000}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { pillLabel: [{
                 type: Input
             }], isInverse: [{
@@ -10680,10 +10740,10 @@ class NotificationModalComponent {
     }
 }
 NotificationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NotificationModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NotificationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NotificationModalComponent, selector: "symphony-notification-modal", inputs: { model: "model" }, outputs: { closeButtonClicked: "closeButtonClicked", primaryButtonClicked: "primaryButtonClicked", secondaryButtonClicked: "secondaryButtonClicked" }, ngImport: i0, template: "<div class=\"sfx sfx-modal notification-modal\">\n  <section class=\"modal-body notification-modal__body sfx-p-30\">\n    <symphony-icon\n      class=\"notification-modal__close-button\"\n      [icon]=\"'si-close-modal'\"\n      (clicked)=\"onCloseButtonClick()\"\n    ></symphony-icon>\n\n    <div *ngIf=\"model?.icon && model.icon !== ''\" class=\"notification-modal__icon\">\n      <symphony-icon\n        [icon]=\"model.icon\"\n        [size]=\"model?.iconSize || '60px'\"\n        [iconColor]=\"model?.iconColor || '#16b783'\"\n      ></symphony-icon>\n    </div>\n\n    <symphony-h3\n      *ngIf=\"model?.heading\"\n      class=\"notification-modal__heading\"\n      [text]=\"model.heading\"\n    ></symphony-h3>\n\n    <symphony-paragraph *ngIf=\"model?.bodyText\" class=\"notification-modal__message\">\n      <span *ngIf=\"model?.candidateCount !== undefined\" class=\"notification-modal__count\">\n        {{ model.candidateCount }}\n      </span>\n      <span>\n        {{ model.bodyText }}\n      </span>\n    </symphony-paragraph>\n\n    <section\n      *ngIf=\"model?.summaryTitle || model?.summaryItems?.length || hasCandidateCards\"\n      class=\"notification-modal__summary\"\n    >\n      <symphony-paragraph *ngIf=\"model?.summaryTitle\" class=\"notification-modal__summary-title\">\n        {{ model.summaryTitle }}\n        <span\n          *ngIf=\"model?.candidateCount !== undefined\"\n          class=\"notification-modal__count notification-modal__count--summary\"\n        >\n          ({{ model.candidateCount }})\n        </span>\n      </symphony-paragraph>\n\n      <div *ngIf=\"hasCandidateCards\" class=\"notification-modal__candidate-cards\">\n        <symphony-candidate-card\n          *ngFor=\"let candidateCard of model?.candidateCards\"\n          [model]=\"candidateCard\"\n        ></symphony-candidate-card>\n      </div>\n\n      <ng-container *ngIf=\"!hasCandidateCards\">\n        <div *ngFor=\"let item of model?.summaryItems\" class=\"notification-modal__summary-row\">\n          <symphony-paragraph class=\"notification-modal__summary-label\">{{ item.label }}</symphony-paragraph>\n          <symphony-paragraph class=\"notification-modal__summary-value\">{{ item.value }}</symphony-paragraph>\n        </div>\n      </ng-container>\n\n      <ng-content select=\"[notification-modal-body]\"></ng-content>\n    </section>\n\n    <div\n      *ngIf=\"model?.secondaryButtonText || model?.primaryButtonText\"\n      class=\"notification-modal__actions\"\n    >\n      <symphony-button-v2\n        *ngIf=\"model?.secondaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--secondary\"\n        [text]=\"model.secondaryButtonText\"\n        [disabled]=\"model.secondaryButtonDisabled\"\n        [isSecondary]=\"true\"\n        (clicked)=\"onSecondaryButtonClick()\"\n      ></symphony-button-v2>\n\n      <symphony-button-v2\n        *ngIf=\"model?.primaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--primary\"\n        [text]=\"model.primaryButtonText\"\n        [disabled]=\"model.primaryButtonDisabled\"\n        (clicked)=\"onPrimaryButtonClick($event)\"\n      ></symphony-button-v2>\n    </div>\n  </section>\n</div>\n", styles: [".notification-modal__body{padding:40px 30px;position:relative;text-align:center}.notification-modal__close-button{position:absolute;right:30px;top:30px;cursor:pointer}.notification-modal__icon{display:inline-flex;margin-bottom:10px}.notification-modal__heading{display:block;margin-bottom:10px}.notification-modal__message{display:block;margin-bottom:20px}.notification-modal__message p.body-copy-primary,.notification-modal__message p.body-copy-secondary{color:#5b6d80;font-size:16px}.notification-modal__summary{background:#f9fafb;border:1px solid #dce2ea;border-radius:10px;margin-bottom:30px;padding:30px 20px 25px;text-align:left}.notification-modal__summary-title{display:block;margin-bottom:15px}.notification-modal__summary-title p.body-copy-primary,.notification-modal__summary-title p.body-copy-secondary{font-size:18px}.notification-modal__candidate-cards{display:flex;flex-direction:column;gap:15px}.notification-modal__summary-row{display:grid;grid-gap:5px;gap:5px;grid-template-columns:150px repeat(1,minmax(220px,1fr));padding:5px 0}.notification-modal__summary-label p.body-copy-primary,.notification-modal__summary-label p.body-copy-secondary{color:#6a768a}.notification-modal__actions{display:flex;gap:15px;justify-content:center}.notification-modal__button{flex:1 1 0}.notification-modal__button button{min-width:0;width:100%}\n"], components: [{ type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: CandidateCardComponent, selector: "symphony-candidate-card", inputs: ["model"] }, { type: ButtonV2Component, selector: "symphony-button-v2" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], encapsulation: i0.ViewEncapsulation.None });
+NotificationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: NotificationModalComponent, selector: "symphony-notification-modal", inputs: { model: "model" }, outputs: { closeButtonClicked: "closeButtonClicked", primaryButtonClicked: "primaryButtonClicked", secondaryButtonClicked: "secondaryButtonClicked" }, ngImport: i0, template: "<div class=\"sfx sfx-modal notification-modal\">\n  <section class=\"modal-body notification-modal__body sfx-p-30\">\n    <symphony-icon\n      class=\"notification-modal__close-button\"\n      [icon]=\"'si-close-modal'\"\n      (clicked)=\"onCloseButtonClick()\"\n    ></symphony-icon>\n\n    <div *ngIf=\"model?.icon && model.icon !== ''\" class=\"notification-modal__icon\">\n      <symphony-icon\n        [icon]=\"model.icon\"\n        [size]=\"model?.iconSize || '60px'\"\n        [iconColor]=\"model?.iconColor || '#16b783'\"\n      ></symphony-icon>\n    </div>\n\n    <symphony-h3\n      *ngIf=\"model?.heading\"\n      class=\"notification-modal__heading\"\n      [text]=\"model.heading\"\n    ></symphony-h3>\n\n    <symphony-paragraph *ngIf=\"model?.bodyText\" class=\"notification-modal__message\">\n      <span *ngIf=\"model?.candidateCount !== undefined\" class=\"notification-modal__count\">\n        {{ model.candidateCount }}\n      </span>\n      <span>\n        {{ model.bodyText }}\n      </span>\n    </symphony-paragraph>\n\n    <section\n      *ngIf=\"model?.summaryTitle || model?.summaryItems?.length || hasCandidateCards\"\n      class=\"notification-modal__summary\"\n    >\n      <symphony-paragraph *ngIf=\"model?.summaryTitle\" class=\"notification-modal__summary-title\">\n        {{ model.summaryTitle }}\n        <span\n          *ngIf=\"model?.candidateCount !== undefined\"\n          class=\"notification-modal__count notification-modal__count--summary\"\n        >\n          ({{ model.candidateCount }})\n        </span>\n      </symphony-paragraph>\n\n      <div *ngIf=\"hasCandidateCards\" class=\"notification-modal__candidate-cards\">\n        <symphony-candidate-card\n          *ngFor=\"let candidateCard of model?.candidateCards\"\n          [model]=\"candidateCard\"\n        ></symphony-candidate-card>\n      </div>\n\n      <ng-container *ngIf=\"!hasCandidateCards\">\n        <div *ngFor=\"let item of model?.summaryItems\" class=\"notification-modal__summary-row\">\n          <symphony-paragraph class=\"notification-modal__summary-label\">{{ item.label }}</symphony-paragraph>\n          <symphony-paragraph class=\"notification-modal__summary-value\">{{ item.value }}</symphony-paragraph>\n        </div>\n      </ng-container>\n\n      <ng-content select=\"[notification-modal-body]\"></ng-content>\n    </section>\n\n    <div\n      *ngIf=\"model?.secondaryButtonText || model?.primaryButtonText\"\n      class=\"notification-modal__actions\"\n    >\n      <symphony-button-v2\n        *ngIf=\"model?.secondaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--secondary\"\n        [text]=\"model.secondaryButtonText\"\n        [disabled]=\"model.secondaryButtonDisabled\"\n        [isSecondary]=\"true\"\n        (clicked)=\"onSecondaryButtonClick()\"\n      ></symphony-button-v2>\n\n      <symphony-button-v2\n        *ngIf=\"model?.primaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--primary\"\n        [text]=\"model.primaryButtonText\"\n        [disabled]=\"model.primaryButtonDisabled\"\n        (clicked)=\"onPrimaryButtonClick($event)\"\n      ></symphony-button-v2>\n    </div>\n  </section>\n</div>\n", styles: [".notification-modal__body{padding:40px 30px;position:relative;text-align:center}.notification-modal__close-button{position:absolute;right:30px;top:30px;cursor:pointer}.notification-modal__icon{display:inline-flex;margin-bottom:10px}.notification-modal__heading{display:block;margin-bottom:10px}.notification-modal__message{display:block;margin-bottom:20px}.notification-modal__message p.body-copy-primary,.notification-modal__message p.body-copy-secondary{color:#5b6d80;font-size:16px}.notification-modal__summary{background:#f9fafb;border:1px solid #dce2ea;border-radius:10px;margin-bottom:30px;padding:30px 20px 25px;text-align:left}.notification-modal__summary-title{display:block;margin-bottom:15px}.notification-modal__summary-title p.body-copy-primary,.notification-modal__summary-title p.body-copy-secondary{font-size:18px}.notification-modal__candidate-cards{display:flex;flex-direction:column;gap:15px;max-height:320px;overflow-y:auto}.notification-modal__summary-row{display:grid;grid-gap:5px;gap:5px;grid-template-columns:150px repeat(1,minmax(220px,1fr));padding:5px 0}.notification-modal__summary-label p.body-copy-primary,.notification-modal__summary-label p.body-copy-secondary{color:#6a768a}.notification-modal__actions{display:flex;gap:15px;justify-content:center}.notification-modal__button{flex:1 1 0}.notification-modal__button button{min-width:0;width:100%}\n"], components: [{ type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: CandidateCardComponent, selector: "symphony-candidate-card", inputs: ["model"] }, { type: ButtonV2Component, selector: "symphony-button-v2" }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NotificationModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-notification-modal', encapsulation: ViewEncapsulation.None, template: "<div class=\"sfx sfx-modal notification-modal\">\n  <section class=\"modal-body notification-modal__body sfx-p-30\">\n    <symphony-icon\n      class=\"notification-modal__close-button\"\n      [icon]=\"'si-close-modal'\"\n      (clicked)=\"onCloseButtonClick()\"\n    ></symphony-icon>\n\n    <div *ngIf=\"model?.icon && model.icon !== ''\" class=\"notification-modal__icon\">\n      <symphony-icon\n        [icon]=\"model.icon\"\n        [size]=\"model?.iconSize || '60px'\"\n        [iconColor]=\"model?.iconColor || '#16b783'\"\n      ></symphony-icon>\n    </div>\n\n    <symphony-h3\n      *ngIf=\"model?.heading\"\n      class=\"notification-modal__heading\"\n      [text]=\"model.heading\"\n    ></symphony-h3>\n\n    <symphony-paragraph *ngIf=\"model?.bodyText\" class=\"notification-modal__message\">\n      <span *ngIf=\"model?.candidateCount !== undefined\" class=\"notification-modal__count\">\n        {{ model.candidateCount }}\n      </span>\n      <span>\n        {{ model.bodyText }}\n      </span>\n    </symphony-paragraph>\n\n    <section\n      *ngIf=\"model?.summaryTitle || model?.summaryItems?.length || hasCandidateCards\"\n      class=\"notification-modal__summary\"\n    >\n      <symphony-paragraph *ngIf=\"model?.summaryTitle\" class=\"notification-modal__summary-title\">\n        {{ model.summaryTitle }}\n        <span\n          *ngIf=\"model?.candidateCount !== undefined\"\n          class=\"notification-modal__count notification-modal__count--summary\"\n        >\n          ({{ model.candidateCount }})\n        </span>\n      </symphony-paragraph>\n\n      <div *ngIf=\"hasCandidateCards\" class=\"notification-modal__candidate-cards\">\n        <symphony-candidate-card\n          *ngFor=\"let candidateCard of model?.candidateCards\"\n          [model]=\"candidateCard\"\n        ></symphony-candidate-card>\n      </div>\n\n      <ng-container *ngIf=\"!hasCandidateCards\">\n        <div *ngFor=\"let item of model?.summaryItems\" class=\"notification-modal__summary-row\">\n          <symphony-paragraph class=\"notification-modal__summary-label\">{{ item.label }}</symphony-paragraph>\n          <symphony-paragraph class=\"notification-modal__summary-value\">{{ item.value }}</symphony-paragraph>\n        </div>\n      </ng-container>\n\n      <ng-content select=\"[notification-modal-body]\"></ng-content>\n    </section>\n\n    <div\n      *ngIf=\"model?.secondaryButtonText || model?.primaryButtonText\"\n      class=\"notification-modal__actions\"\n    >\n      <symphony-button-v2\n        *ngIf=\"model?.secondaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--secondary\"\n        [text]=\"model.secondaryButtonText\"\n        [disabled]=\"model.secondaryButtonDisabled\"\n        [isSecondary]=\"true\"\n        (clicked)=\"onSecondaryButtonClick()\"\n      ></symphony-button-v2>\n\n      <symphony-button-v2\n        *ngIf=\"model?.primaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--primary\"\n        [text]=\"model.primaryButtonText\"\n        [disabled]=\"model.primaryButtonDisabled\"\n        (clicked)=\"onPrimaryButtonClick($event)\"\n      ></symphony-button-v2>\n    </div>\n  </section>\n</div>\n", styles: [".notification-modal__body{padding:40px 30px;position:relative;text-align:center}.notification-modal__close-button{position:absolute;right:30px;top:30px;cursor:pointer}.notification-modal__icon{display:inline-flex;margin-bottom:10px}.notification-modal__heading{display:block;margin-bottom:10px}.notification-modal__message{display:block;margin-bottom:20px}.notification-modal__message p.body-copy-primary,.notification-modal__message p.body-copy-secondary{color:#5b6d80;font-size:16px}.notification-modal__summary{background:#f9fafb;border:1px solid #dce2ea;border-radius:10px;margin-bottom:30px;padding:30px 20px 25px;text-align:left}.notification-modal__summary-title{display:block;margin-bottom:15px}.notification-modal__summary-title p.body-copy-primary,.notification-modal__summary-title p.body-copy-secondary{font-size:18px}.notification-modal__candidate-cards{display:flex;flex-direction:column;gap:15px}.notification-modal__summary-row{display:grid;grid-gap:5px;gap:5px;grid-template-columns:150px repeat(1,minmax(220px,1fr));padding:5px 0}.notification-modal__summary-label p.body-copy-primary,.notification-modal__summary-label p.body-copy-secondary{color:#6a768a}.notification-modal__actions{display:flex;gap:15px;justify-content:center}.notification-modal__button{flex:1 1 0}.notification-modal__button button{min-width:0;width:100%}\n"] }]
+            args: [{ selector: 'symphony-notification-modal', encapsulation: ViewEncapsulation.None, template: "<div class=\"sfx sfx-modal notification-modal\">\n  <section class=\"modal-body notification-modal__body sfx-p-30\">\n    <symphony-icon\n      class=\"notification-modal__close-button\"\n      [icon]=\"'si-close-modal'\"\n      (clicked)=\"onCloseButtonClick()\"\n    ></symphony-icon>\n\n    <div *ngIf=\"model?.icon && model.icon !== ''\" class=\"notification-modal__icon\">\n      <symphony-icon\n        [icon]=\"model.icon\"\n        [size]=\"model?.iconSize || '60px'\"\n        [iconColor]=\"model?.iconColor || '#16b783'\"\n      ></symphony-icon>\n    </div>\n\n    <symphony-h3\n      *ngIf=\"model?.heading\"\n      class=\"notification-modal__heading\"\n      [text]=\"model.heading\"\n    ></symphony-h3>\n\n    <symphony-paragraph *ngIf=\"model?.bodyText\" class=\"notification-modal__message\">\n      <span *ngIf=\"model?.candidateCount !== undefined\" class=\"notification-modal__count\">\n        {{ model.candidateCount }}\n      </span>\n      <span>\n        {{ model.bodyText }}\n      </span>\n    </symphony-paragraph>\n\n    <section\n      *ngIf=\"model?.summaryTitle || model?.summaryItems?.length || hasCandidateCards\"\n      class=\"notification-modal__summary\"\n    >\n      <symphony-paragraph *ngIf=\"model?.summaryTitle\" class=\"notification-modal__summary-title\">\n        {{ model.summaryTitle }}\n        <span\n          *ngIf=\"model?.candidateCount !== undefined\"\n          class=\"notification-modal__count notification-modal__count--summary\"\n        >\n          ({{ model.candidateCount }})\n        </span>\n      </symphony-paragraph>\n\n      <div *ngIf=\"hasCandidateCards\" class=\"notification-modal__candidate-cards\">\n        <symphony-candidate-card\n          *ngFor=\"let candidateCard of model?.candidateCards\"\n          [model]=\"candidateCard\"\n        ></symphony-candidate-card>\n      </div>\n\n      <ng-container *ngIf=\"!hasCandidateCards\">\n        <div *ngFor=\"let item of model?.summaryItems\" class=\"notification-modal__summary-row\">\n          <symphony-paragraph class=\"notification-modal__summary-label\">{{ item.label }}</symphony-paragraph>\n          <symphony-paragraph class=\"notification-modal__summary-value\">{{ item.value }}</symphony-paragraph>\n        </div>\n      </ng-container>\n\n      <ng-content select=\"[notification-modal-body]\"></ng-content>\n    </section>\n\n    <div\n      *ngIf=\"model?.secondaryButtonText || model?.primaryButtonText\"\n      class=\"notification-modal__actions\"\n    >\n      <symphony-button-v2\n        *ngIf=\"model?.secondaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--secondary\"\n        [text]=\"model.secondaryButtonText\"\n        [disabled]=\"model.secondaryButtonDisabled\"\n        [isSecondary]=\"true\"\n        (clicked)=\"onSecondaryButtonClick()\"\n      ></symphony-button-v2>\n\n      <symphony-button-v2\n        *ngIf=\"model?.primaryButtonText\"\n        class=\"notification-modal__button notification-modal__button--primary\"\n        [text]=\"model.primaryButtonText\"\n        [disabled]=\"model.primaryButtonDisabled\"\n        (clicked)=\"onPrimaryButtonClick($event)\"\n      ></symphony-button-v2>\n    </div>\n  </section>\n</div>\n", styles: [".notification-modal__body{padding:40px 30px;position:relative;text-align:center}.notification-modal__close-button{position:absolute;right:30px;top:30px;cursor:pointer}.notification-modal__icon{display:inline-flex;margin-bottom:10px}.notification-modal__heading{display:block;margin-bottom:10px}.notification-modal__message{display:block;margin-bottom:20px}.notification-modal__message p.body-copy-primary,.notification-modal__message p.body-copy-secondary{color:#5b6d80;font-size:16px}.notification-modal__summary{background:#f9fafb;border:1px solid #dce2ea;border-radius:10px;margin-bottom:30px;padding:30px 20px 25px;text-align:left}.notification-modal__summary-title{display:block;margin-bottom:15px}.notification-modal__summary-title p.body-copy-primary,.notification-modal__summary-title p.body-copy-secondary{font-size:18px}.notification-modal__candidate-cards{display:flex;flex-direction:column;gap:15px;max-height:320px;overflow-y:auto}.notification-modal__summary-row{display:grid;grid-gap:5px;gap:5px;grid-template-columns:150px repeat(1,minmax(220px,1fr));padding:5px 0}.notification-modal__summary-label p.body-copy-primary,.notification-modal__summary-label p.body-copy-secondary{color:#6a768a}.notification-modal__actions{display:flex;gap:15px;justify-content:center}.notification-modal__button{flex:1 1 0}.notification-modal__button button{min-width:0;width:100%}\n"] }]
         }], propDecorators: { model: [{
                 type: Input
             }], closeButtonClicked: [{