@symphony-talent/component-library 4.231.0 → 4.233.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/atoms/contextual-menu/contextual-menu.component.mjs +2 -2
- package/esm2020/lib/atoms/grid/framework/custom-detail-with-grid/custom-detail-with-grid.component.mjs +57 -3
- package/esm2020/lib/atoms/pill/pill.component.mjs +2 -2
- package/esm2020/lib/molecules/candidate-item/candidate-item.component.mjs +8 -5
- package/esm2020/lib/molecules/candidate-item/candidate-item.model.mjs +1 -1
- package/esm2020/lib/pages/modals/notification-modal/notification-modal.component.mjs +2 -2
- package/esm2020/projects/component-library/lib/atoms/contextual-menu/contextual-menu.component.mjs +2 -2
- package/esm2020/projects/component-library/lib/atoms/grid/framework/custom-detail-with-grid/custom-detail-with-grid.component.mjs +57 -3
- package/esm2020/projects/component-library/lib/atoms/pill/pill.component.mjs +2 -2
- package/esm2020/projects/component-library/lib/molecules/candidate-item/candidate-item.component.mjs +8 -5
- package/esm2020/projects/component-library/lib/molecules/candidate-item/candidate-item.model.mjs +1 -1
- package/esm2020/projects/component-library/lib/pages/modals/notification-modal/notification-modal.component.mjs +2 -2
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +79 -15
- package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2015/symphony-talent-component-library.mjs +79 -15
- package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +69 -12
- package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
- package/fesm2020/symphony-talent-component-library.mjs +69 -12
- package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
- package/lib/atoms/grid/framework/custom-detail-with-grid/custom-detail-with-grid.component.d.ts +16 -1
- package/lib/molecules/candidate-item/candidate-item.component.d.ts +1 -0
- package/lib/molecules/candidate-item/candidate-item.model.d.ts +1 -0
- package/package.json +1 -1
- package/projects/component-library/lib/atoms/grid/framework/custom-detail-with-grid/custom-detail-with-grid.component.d.ts +16 -1
- package/projects/component-library/lib/molecules/candidate-item/candidate-item.component.d.ts +1 -0
- package/projects/component-library/lib/molecules/candidate-item/candidate-item.model.d.ts +1 -0
|
@@ -403,10 +403,10 @@ class ContextualMenuComponent {
|
|
|
403
403
|
}
|
|
404
404
|
}
|
|
405
405
|
ContextualMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ContextualMenuComponent, deps: [{ token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
|
|
406
|
-
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 } });
|
|
406
|
+
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 } });
|
|
407
407
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ContextualMenuComponent, decorators: [{
|
|
408
408
|
type: Component,
|
|
409
|
-
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"] }]
|
|
409
|
+
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"] }]
|
|
410
410
|
}], ctorParameters: function () { return [{ type: Document, decorators: [{
|
|
411
411
|
type: Inject,
|
|
412
412
|
args: [DOCUMENT]
|
|
@@ -977,6 +977,7 @@ class CustomDetailWithGridComponent {
|
|
|
977
977
|
constructor() {
|
|
978
978
|
this.defaultNotesCharacterLimit = 500;
|
|
979
979
|
this.resizeTimeoutId = null;
|
|
980
|
+
this.nestedDetailGridInfoId = null;
|
|
980
981
|
this.detailRendererParams = {};
|
|
981
982
|
this.title = 'Detail Records';
|
|
982
983
|
this.notesTitle = 'Internal Session Notes';
|
|
@@ -994,6 +995,10 @@ class CustomDetailWithGridComponent {
|
|
|
994
995
|
this.nestedSuppressRowClickSelection = true;
|
|
995
996
|
this.nestedSuppressContextMenu = true;
|
|
996
997
|
this.nestedSuppressAutoSizeColumns = false;
|
|
998
|
+
this.nestedRowModelType = 'clientSide';
|
|
999
|
+
this.nestedDatasource = null;
|
|
1000
|
+
this.nestedPageSize = 20;
|
|
1001
|
+
this.nestedCacheBlockSize = 20;
|
|
997
1002
|
this.nestedColumnDefs = [];
|
|
998
1003
|
this.nestedDefaultColDef = {
|
|
999
1004
|
flex: 1,
|
|
@@ -1029,6 +1034,11 @@ class CustomDetailWithGridComponent {
|
|
|
1029
1034
|
this.detailRendererParams?.nestedSuppressContextMenu !== false;
|
|
1030
1035
|
this.nestedSuppressAutoSizeColumns =
|
|
1031
1036
|
this.detailRendererParams?.nestedSuppressAutoSizeColumns === true;
|
|
1037
|
+
this.nestedRowModelType = this.detailRendererParams?.nestedRowModelType || 'clientSide';
|
|
1038
|
+
this.nestedPageSize = this.detailRendererParams?.nestedPageSize || 20;
|
|
1039
|
+
this.nestedCacheBlockSize =
|
|
1040
|
+
this.detailRendererParams?.nestedCacheBlockSize || this.nestedPageSize;
|
|
1041
|
+
this.nestedDatasource = this.resolveNestedDatasource(params);
|
|
1032
1042
|
this.nestedFrameworkComponents = this.getNestedFrameworkComponents();
|
|
1033
1043
|
this.nestedDefaultColDef = {
|
|
1034
1044
|
flex: 1,
|
|
@@ -1042,11 +1052,25 @@ class CustomDetailWithGridComponent {
|
|
|
1042
1052
|
}
|
|
1043
1053
|
refresh(params) {
|
|
1044
1054
|
this.agInit(params);
|
|
1055
|
+
this.applyNestedDatasource();
|
|
1056
|
+
if (this.nestedRowModelType !== 'serverSide') {
|
|
1057
|
+
this.nestedGridApi?.setRowData?.(this.nestedRowData);
|
|
1058
|
+
}
|
|
1045
1059
|
this.resizeNestedGridColumns();
|
|
1046
1060
|
return true;
|
|
1047
1061
|
}
|
|
1048
1062
|
onNestedGridReady(gridReadyEvent) {
|
|
1049
1063
|
this.nestedGridApi = gridReadyEvent.api;
|
|
1064
|
+
this.registerNestedDetailGrid(gridReadyEvent);
|
|
1065
|
+
this.applyNestedDatasource();
|
|
1066
|
+
if (this.detailRendererParams?.onNestedGridReady) {
|
|
1067
|
+
this.detailRendererParams.onNestedGridReady(gridReadyEvent, this.params);
|
|
1068
|
+
}
|
|
1069
|
+
this.resizeNestedGridColumns();
|
|
1070
|
+
}
|
|
1071
|
+
setNestedRowData(rowData) {
|
|
1072
|
+
this.nestedRowData = rowData || [];
|
|
1073
|
+
this.nestedGridApi?.setRowData?.(this.nestedRowData);
|
|
1050
1074
|
this.resizeNestedGridColumns();
|
|
1051
1075
|
}
|
|
1052
1076
|
onWindowResize() {
|
|
@@ -1111,11 +1135,41 @@ class CustomDetailWithGridComponent {
|
|
|
1111
1135
|
...(this.detailRendererParams?.nestedFrameworkComponents || {})
|
|
1112
1136
|
};
|
|
1113
1137
|
}
|
|
1138
|
+
resolveNestedDatasource(params) {
|
|
1139
|
+
if (this.detailRendererParams?.nestedDatasourceFactory) {
|
|
1140
|
+
return this.detailRendererParams.nestedDatasourceFactory(params?.data, params);
|
|
1141
|
+
}
|
|
1142
|
+
return this.detailRendererParams?.nestedDatasource || null;
|
|
1143
|
+
}
|
|
1144
|
+
applyNestedDatasource() {
|
|
1145
|
+
if (this.nestedRowModelType === 'serverSide' &&
|
|
1146
|
+
this.nestedDatasource &&
|
|
1147
|
+
this.nestedGridApi) {
|
|
1148
|
+
this.nestedGridApi.setServerSideDatasource(this.nestedDatasource);
|
|
1149
|
+
}
|
|
1150
|
+
}
|
|
1151
|
+
registerNestedDetailGrid(gridReadyEvent) {
|
|
1152
|
+
const parentNodeId = this.params?.node?.id;
|
|
1153
|
+
const addDetailGridInfo = this.params?.api?.addDetailGridInfo;
|
|
1154
|
+
if (!parentNodeId || !addDetailGridInfo) {
|
|
1155
|
+
return;
|
|
1156
|
+
}
|
|
1157
|
+
this.nestedDetailGridInfoId = `detail_${parentNodeId}`;
|
|
1158
|
+
addDetailGridInfo.call(this.params.api, this.nestedDetailGridInfoId, {
|
|
1159
|
+
id: this.nestedDetailGridInfoId,
|
|
1160
|
+
api: gridReadyEvent.api,
|
|
1161
|
+
columnApi: gridReadyEvent.columnApi,
|
|
1162
|
+
});
|
|
1163
|
+
}
|
|
1114
1164
|
destroy() {
|
|
1115
1165
|
if (this.resizeTimeoutId !== null) {
|
|
1116
1166
|
clearTimeout(this.resizeTimeoutId);
|
|
1117
1167
|
this.resizeTimeoutId = null;
|
|
1118
1168
|
}
|
|
1169
|
+
if (this.nestedDetailGridInfoId && this.params?.api?.removeDetailGridInfo) {
|
|
1170
|
+
this.params.api.removeDetailGridInfo(this.nestedDetailGridInfoId);
|
|
1171
|
+
this.nestedDetailGridInfoId = null;
|
|
1172
|
+
}
|
|
1119
1173
|
}
|
|
1120
1174
|
resizeNestedGridColumns() {
|
|
1121
1175
|
if (this.nestedSuppressAutoSizeColumns || !this.nestedGridApi) {
|
|
@@ -1131,10 +1185,10 @@ class CustomDetailWithGridComponent {
|
|
|
1131
1185
|
}
|
|
1132
1186
|
}
|
|
1133
1187
|
CustomDetailWithGridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CustomDetailWithGridComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1134
|
-
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 });
|
|
1188
|
+
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 });
|
|
1135
1189
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CustomDetailWithGridComponent, decorators: [{
|
|
1136
1190
|
type: Component,
|
|
1137
|
-
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"] }]
|
|
1191
|
+
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"] }]
|
|
1138
1192
|
}], propDecorators: { onWindowResize: [{
|
|
1139
1193
|
type: HostListener,
|
|
1140
1194
|
args: ['window:resize']
|
|
@@ -2713,10 +2767,10 @@ class PillComponent {
|
|
|
2713
2767
|
}
|
|
2714
2768
|
}
|
|
2715
2769
|
PillComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PillComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2716
|
-
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:
|
|
2770
|
+
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 });
|
|
2717
2771
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: PillComponent, decorators: [{
|
|
2718
2772
|
type: Component,
|
|
2719
|
-
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:
|
|
2773
|
+
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"] }]
|
|
2720
2774
|
}], ctorParameters: function () { return []; }, propDecorators: { pillLabel: [{
|
|
2721
2775
|
type: Input
|
|
2722
2776
|
}], isInverse: [{
|
|
@@ -4277,14 +4331,17 @@ class CandidateItemComponent {
|
|
|
4277
4331
|
get candidate() {
|
|
4278
4332
|
return this.candidateValue;
|
|
4279
4333
|
}
|
|
4334
|
+
get isRowDisabled() {
|
|
4335
|
+
return !!this.candidate?.isRowDisabled;
|
|
4336
|
+
}
|
|
4280
4337
|
handleRowClick() {
|
|
4281
|
-
if (!this.candidate) {
|
|
4338
|
+
if (!this.candidate || this.isRowDisabled) {
|
|
4282
4339
|
return;
|
|
4283
4340
|
}
|
|
4284
4341
|
this.setSelection(!this.isSelected);
|
|
4285
4342
|
}
|
|
4286
4343
|
handleCheckboxClicked(event) {
|
|
4287
|
-
if (!this.candidate) {
|
|
4344
|
+
if (!this.candidate || this.isRowDisabled) {
|
|
4288
4345
|
return;
|
|
4289
4346
|
}
|
|
4290
4347
|
this.setSelection(event.isActive);
|
|
@@ -4304,10 +4361,10 @@ class CandidateItemComponent {
|
|
|
4304
4361
|
}
|
|
4305
4362
|
}
|
|
4306
4363
|
CandidateItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4307
|
-
CandidateItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: CandidateItemComponent, selector: "symphony-candidate-item", inputs: { candidate: "candidate" }, outputs: { selectionChanged: "selectionChanged" }, ngImport: i0, template: "<div
|
|
4364
|
+
CandidateItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: CandidateItemComponent, selector: "symphony-candidate-item", inputs: { candidate: "candidate" }, outputs: { selectionChanged: "selectionChanged" }, ngImport: i0, template: "<div\n class=\"sfx-candidate-item\"\n [class.sfx-candidate-item--disabled]=\"isRowDisabled\"\n (click)=\"handleRowClick()\"\n>\n <div class=\"sfx-candidate-item__checkbox\" (click)=\"$event.stopPropagation()\">\n <symphony-input-checkbox\n [isActive]=\"isSelected\"\n [isRequired]=\"false\"\n (clicked)=\"handleCheckboxClicked($event)\"\n ></symphony-input-checkbox>\n </div>\n\n <div class=\"sfx-candidate-item__details\">\n <symphony-paragraph\n class=\"sfx-candidate-item__name\"\n [text]=\"candidate?.name\"\n [fontSize]=\"'14px'\"\n [fontWeight]=\"500\"\n ></symphony-paragraph>\n <symphony-paragraph\n class=\"sfx-candidate-item__subtext\"\n [fontSize]=\"'13px'\"\n >\n <span class=\"sfx-candidate-item__email\">{{ candidate?.email }}</span>\n <span\n class=\"sfx-candidate-item__separator\"\n *ngIf=\"candidate?.email && candidate?.title\"\n > · </span>\n <span class=\"sfx-candidate-item__title\">{{ candidate?.title }}</span>\n </symphony-paragraph>\n </div>\n\n <div class=\"sfx-candidate-item__status\" *ngIf=\"candidate?.status\">\n <symphony-status-pill [statusPillModel]=\"candidate.status\"></symphony-status-pill>\n </div>\n</div>\n", styles: [".sfx-candidate-item{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer}.sfx-candidate-item__checkbox{flex-shrink:0;display:flex;align-items:center}.sfx-candidate-item__details{flex:1;min-width:0}.sfx-candidate-item__details .sfx-candidate-item__name,.sfx-candidate-item__details .sfx-candidate-item__subtext{display:block}.sfx-candidate-item__status{flex-shrink:0;margin-left:auto}.sfx-candidate-item:hover{background-color:#f9fafb}.sfx-candidate-item--disabled{opacity:.5;cursor:default}.sfx-candidate-item--disabled .sfx-candidate-item__checkbox{pointer-events:none}.sfx-candidate-item--disabled:hover{background-color:transparent}\n"], components: [{ type: InputCheckboxComponent, selector: "symphony-input-checkbox", inputs: ["isActive", "label", "isRequired"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: StatusPillComponent, selector: "symphony-status-pill", inputs: ["statusPillModel"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
4308
4365
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateItemComponent, decorators: [{
|
|
4309
4366
|
type: Component,
|
|
4310
|
-
args: [{ selector: 'symphony-candidate-item', template: "<div
|
|
4367
|
+
args: [{ selector: 'symphony-candidate-item', template: "<div\n class=\"sfx-candidate-item\"\n [class.sfx-candidate-item--disabled]=\"isRowDisabled\"\n (click)=\"handleRowClick()\"\n>\n <div class=\"sfx-candidate-item__checkbox\" (click)=\"$event.stopPropagation()\">\n <symphony-input-checkbox\n [isActive]=\"isSelected\"\n [isRequired]=\"false\"\n (clicked)=\"handleCheckboxClicked($event)\"\n ></symphony-input-checkbox>\n </div>\n\n <div class=\"sfx-candidate-item__details\">\n <symphony-paragraph\n class=\"sfx-candidate-item__name\"\n [text]=\"candidate?.name\"\n [fontSize]=\"'14px'\"\n [fontWeight]=\"500\"\n ></symphony-paragraph>\n <symphony-paragraph\n class=\"sfx-candidate-item__subtext\"\n [fontSize]=\"'13px'\"\n >\n <span class=\"sfx-candidate-item__email\">{{ candidate?.email }}</span>\n <span\n class=\"sfx-candidate-item__separator\"\n *ngIf=\"candidate?.email && candidate?.title\"\n > · </span>\n <span class=\"sfx-candidate-item__title\">{{ candidate?.title }}</span>\n </symphony-paragraph>\n </div>\n\n <div class=\"sfx-candidate-item__status\" *ngIf=\"candidate?.status\">\n <symphony-status-pill [statusPillModel]=\"candidate.status\"></symphony-status-pill>\n </div>\n</div>\n", styles: [".sfx-candidate-item{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer}.sfx-candidate-item__checkbox{flex-shrink:0;display:flex;align-items:center}.sfx-candidate-item__details{flex:1;min-width:0}.sfx-candidate-item__details .sfx-candidate-item__name,.sfx-candidate-item__details .sfx-candidate-item__subtext{display:block}.sfx-candidate-item__status{flex-shrink:0;margin-left:auto}.sfx-candidate-item:hover{background-color:#f9fafb}.sfx-candidate-item--disabled{opacity:.5;cursor:default}.sfx-candidate-item--disabled .sfx-candidate-item__checkbox{pointer-events:none}.sfx-candidate-item--disabled:hover{background-color:transparent}\n"] }]
|
|
4311
4368
|
}], propDecorators: { candidate: [{
|
|
4312
4369
|
type: Input
|
|
4313
4370
|
}], selectionChanged: [{
|
|
@@ -10662,10 +10719,10 @@ class NotificationModalComponent {
|
|
|
10662
10719
|
}
|
|
10663
10720
|
}
|
|
10664
10721
|
NotificationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NotificationModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10665
|
-
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 });
|
|
10722
|
+
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 });
|
|
10666
10723
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: NotificationModalComponent, decorators: [{
|
|
10667
10724
|
type: Component,
|
|
10668
|
-
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"] }]
|
|
10725
|
+
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"] }]
|
|
10669
10726
|
}], propDecorators: { model: [{
|
|
10670
10727
|
type: Input
|
|
10671
10728
|
}], closeButtonClicked: [{
|