@symphony-talent/component-library 3.4.0 → 3.5.0

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

@@ -7,6 +7,7 @@ import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import * as i1$2 from 'ag-grid-angular';
 import { AgGridModule } from 'ag-grid-angular';
+import * as i4 from '@angular/forms';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { Subject, timer } from 'rxjs';
 import { debounceTime, distinctUntilChanged, delay } from 'rxjs/operators';
@@ -2943,6 +2944,91 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
             args: [{ selector: 'symphony-two-column-body-template', template: "<!-- filter area -->\n\n<div class=\"modal-header sfx-p-30\">\n  <div class=\"col-headers row\">\n    <div class=\"left-col-header col-xs-6 col-sm-6 col-md-6 sfx-pr-30\">\n      <ng-content select=\"[sfx-left-col-header]\"></ng-content>\n    </div>\n    <div class=\"right-col-header col-xs-6 col-sm-6 col-md-6 sfx-pl-30\">\n      <ng-content select=\"[sfx-right-col-header]\"></ng-content>\n    </div>\n  </div>\n</div>\n<!-- main body -->\n<div class=\"modal-body sfx-px-0\">\n  <div class=\"row\">\n    <div class=\"sfx-checkbox-list col-xs-12 col-sm-6 col-md-6 sfx-p-30\">\n      <ng-content select=\"[sfx-left-column]\"></ng-content>\n    </div>\n    <div class=\"sfx-price-totals col-xs-12 col-sm-6 col-md-6 sfx-p-30\">\n      <ng-content select=\"[sfx-right-column]\"></ng-content>\n    </div>\n  </div>\n</div>\n", styles: [".sfx-checkbox-list{border-right:1px solid #e5e5e5}\n"] }]
         }], ctorParameters: function () { return []; } });
 
+class InputEditableTextComponent {
+    constructor() {
+        this.type = 'number';
+        this.confirm = new EventEmitter();
+    }
+    onEditClick() {
+        this.model.isInEditMode = true;
+        this.previousValue = this.model.value;
+    }
+    onConfirmClick() {
+        this.model.isInEditMode = false;
+        this.confirm.emit(this.model);
+    }
+    onCloseClick() {
+        this.model.value = this.previousValue;
+        this.model.isInEditMode = false;
+    }
+}
+InputEditableTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+InputEditableTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: InputEditableTextComponent, selector: "symphony-input-editable-text", inputs: { model: "model", type: "type" }, outputs: { confirm: "confirm" }, ngImport: i0, template: "<div *ngIf=\"model\">\n  <div *ngIf=\"!model.isInEditMode\">\n    <div class=\"flex\">\n      <div>\n        <symphony-paragraph\n          >{{ model.inputMask }}{{ model.value }}</symphony-paragraph\n        >\n      </div>\n      <div *ngIf=\"model.isEditable\" (click)=\"onEditClick()\" class=\"sfx-pl-10\">\n        <symphony-icon [icon]=\"'si-edit'\" [size]=\"'14px'\"></symphony-icon>\n      </div>\n      <div *ngIf=\"!model.isEditable\" class=\"no-icon-padding\"></div>\n    </div>\n  </div>\n  <div *ngIf=\"model.isInEditMode\">\n    <span class=\"sfx-pr-10\"\n      >{{ model.inputMask }}<input type=\"{{ type }}\" [(ngModel)]=\"model.value\"\n    /></span>\n    <span\n      ><symphony-icon\n        [icon]=\"'si-confirmation'\"\n        [size]=\"'14px'\"\n        (click)=\"onConfirmClick()\"\n      ></symphony-icon\n    ></span>\n    <span\n      ><symphony-icon\n        [icon]=\"'si-close-modal'\"\n        [size]=\"'14px'\"\n        (click)=\"onCloseClick()\"\n      ></symphony-icon\n    ></span>\n  </div>\n</div>\n", styles: ["input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;padding:0}input{border-width:0px;border:none;text-align:right;width:21px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}\n"], components: [{ type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'symphony-input-editable-text', template: "<div *ngIf=\"model\">\n  <div *ngIf=\"!model.isInEditMode\">\n    <div class=\"flex\">\n      <div>\n        <symphony-paragraph\n          >{{ model.inputMask }}{{ model.value }}</symphony-paragraph\n        >\n      </div>\n      <div *ngIf=\"model.isEditable\" (click)=\"onEditClick()\" class=\"sfx-pl-10\">\n        <symphony-icon [icon]=\"'si-edit'\" [size]=\"'14px'\"></symphony-icon>\n      </div>\n      <div *ngIf=\"!model.isEditable\" class=\"no-icon-padding\"></div>\n    </div>\n  </div>\n  <div *ngIf=\"model.isInEditMode\">\n    <span class=\"sfx-pr-10\"\n      >{{ model.inputMask }}<input type=\"{{ type }}\" [(ngModel)]=\"model.value\"\n    /></span>\n    <span\n      ><symphony-icon\n        [icon]=\"'si-confirmation'\"\n        [size]=\"'14px'\"\n        (click)=\"onConfirmClick()\"\n      ></symphony-icon\n    ></span>\n    <span\n      ><symphony-icon\n        [icon]=\"'si-close-modal'\"\n        [size]=\"'14px'\"\n        (click)=\"onCloseClick()\"\n      ></symphony-icon\n    ></span>\n  </div>\n</div>\n", styles: ["input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;padding:0}input{border-width:0px;border:none;text-align:right;width:21px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { model: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], confirm: [{
+                type: Output
+            }] } });
+
+class AdvertisePostingboardSelectionItemComponent {
+    constructor() {
+        this.priceChange = new EventEmitter();
+        this.postingBoardSelect = new EventEmitter();
+    }
+    ngOnInit() {
+        this.mapModel();
+    }
+    onBoardPriceChange(priceChangeEvent) {
+        this.model.boardPrice = +priceChangeEvent.value;
+        this.priceChange.emit(this.model);
+    }
+    onPostingBoardSelect(postingBoardSelectEvent) {
+        this.model.isSelected = postingBoardSelectEvent.isActive;
+        this.postingBoardSelect.emit(this.model);
+    }
+    mapModel() {
+        var _a;
+        if (this.model) {
+            this.editableTextModel = {
+                inputMask: '$',
+                value: (_a = this.model.boardPrice) === null || _a === void 0 ? void 0 : _a.toString(),
+                isEditable: this.model.isEditable,
+                isInEditMode: this.model.isInEditMode,
+                id: this.model.id,
+            };
+        }
+    }
+}
+AdvertisePostingboardSelectionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+AdvertisePostingboardSelectionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertisePostingboardSelectionItemComponent, selector: "symphony-advertise-postingboard-selection-item", inputs: { model: "model" }, outputs: { priceChange: "priceChange", postingBoardSelect: "postingBoardSelect" }, ngImport: i0, template: "<div *ngIf=\"model\" class=\"posting-board-selection-item\">\n  <div class=\"inline-block\">\n    <symphony-input-checkbox\n      [label]=\"model.boardName\"\n      [isActive]=\"model.isSelected\"\n      (clicked)=\"onPostingBoardSelect($event)\"\n    ></symphony-input-checkbox>\n  </div>\n  <div class=\"inline-block pull-right sfx-pt-10 sfx-pr-10\">\n    <symphony-input-editable-text\n      [model]=\"editableTextModel\"\n      (confirm)=\"onBoardPriceChange($event)\"\n    ></symphony-input-editable-text>\n  </div>\n</div>\n", styles: [".inline-block{display:inline-block}\n"], components: [{ type: InputCheckboxComponent, selector: "symphony-input-checkbox", inputs: ["isActive", "label", "isRequired"], outputs: ["clicked"] }, { type: InputEditableTextComponent, selector: "symphony-input-editable-text", inputs: ["model", "type"], outputs: ["confirm"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'symphony-advertise-postingboard-selection-item', template: "<div *ngIf=\"model\" class=\"posting-board-selection-item\">\n  <div class=\"inline-block\">\n    <symphony-input-checkbox\n      [label]=\"model.boardName\"\n      [isActive]=\"model.isSelected\"\n      (clicked)=\"onPostingBoardSelect($event)\"\n    ></symphony-input-checkbox>\n  </div>\n  <div class=\"inline-block pull-right sfx-pt-10 sfx-pr-10\">\n    <symphony-input-editable-text\n      [model]=\"editableTextModel\"\n      (confirm)=\"onBoardPriceChange($event)\"\n    ></symphony-input-editable-text>\n  </div>\n</div>\n", styles: [".inline-block{display:inline-block}\n"] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { model: [{
+                type: Input
+            }], priceChange: [{
+                type: Output
+            }], postingBoardSelect: [{
+                type: Output
+            }] } });
+
+class AdvertisePostingboardSelectionListComponent {
+    constructor() { }
+}
+AdvertisePostingboardSelectionListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+AdvertisePostingboardSelectionListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertisePostingboardSelectionListComponent, selector: "symphony-advertise-postingboard-selection-list", inputs: { model: "model" }, ngImport: i0, template: "<symphony-advertise-postingboard-selection-item\n  *ngFor=\"let item of model\"\n  [model]=\"item\"\n></symphony-advertise-postingboard-selection-item>\n", styles: [""], components: [{ type: AdvertisePostingboardSelectionItemComponent, selector: "symphony-advertise-postingboard-selection-item", inputs: ["model"], outputs: ["priceChange", "postingBoardSelect"] }], directives: [{ type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'symphony-advertise-postingboard-selection-list', template: "<symphony-advertise-postingboard-selection-item\n  *ngFor=\"let item of model\"\n  [model]=\"item\"\n></symphony-advertise-postingboard-selection-item>\n", styles: [""] }]
+        }], ctorParameters: function () { return []; }, propDecorators: { model: [{
+                type: Input
+            }] } });
+
 class AdvertiseModalComponent {
     constructor() {
         this.model = {
@@ -2961,13 +3047,14 @@ class AdvertiseModalComponent {
             primaryButtonText: '',
             secondaryButtonText: '',
         };
-        this.keywordSearchChange = new EventEmitter();
         this.buttonClicked = new EventEmitter();
         this.closeButtonClicked = new EventEmitter();
     }
+    ngOnInit() {
+        this.filteredPostingBoardList = this.model.jobBoards;
+    }
     keywordSearch(keyword) {
-        this.keywordSearchChange.emit(keyword);
-        console.log(keyword);
+        this.filteredPostingBoardList = this.model.jobBoards.filter((board) => board.boardName.toLowerCase().includes(keyword));
     }
     onButtonClick(text) {
         this.buttonClicked.emit(text);
@@ -2977,14 +3064,12 @@ class AdvertiseModalComponent {
     }
 }
 AdvertiseModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertiseModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AdvertiseModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertiseModalComponent, selector: "symphony-advertise-modal", inputs: { model: "model" }, outputs: { keywordSearchChange: "keywordSearchChange", buttonClicked: "buttonClicked", closeButtonClicked: "closeButtonClicked" }, ngImport: i0, template: "<symphony-two-column-modal-template>\n  <symphony-h4 sfx-modal-title>{{ model.title }}</symphony-h4>\n  <symphony-icon\n    sfx-close-button\n    [icon]=\"'si-close-modal'\"\n    (clicked)=\"onCloseButtonClick()\"\n  ></symphony-icon>\n  <symphony-h5-with-icon sfx-modal-subtitle [model]=\"model.subtitle\">\n  </symphony-h5-with-icon>\n  <symphony-two-column-body-template sfx-modal-body-area>\n    <symphony-input-text\n      sfx-left-col-header\n      [noMargin]=\"true\"\n      [placeholder]=\"'Search Ad Boards'\"\n      [icon]=\"'si-search-new'\"\n      (textChange)=\"keywordSearch($event)\"\n    >\n    </symphony-input-text>\n    <div class=\"right-col-header-inner\" sfx-right-col-header>\n      <symphony-h5-with-icon\n        sfx-right-col-header\n        *ngIf=\"model.showFunds\"\n        class=\"pull-right\"\n        [model]=\"model.fundsInfo\"\n      ></symphony-h5-with-icon>\n    </div>\n    <symphony-placeholder\n      sfx-left-column\n      [label]=\"'sfx-left-column'\"\n      [height]=\"'400px'\"\n    ></symphony-placeholder>\n    <symphony-placeholder\n      sfx-right-column\n      [label]=\"'sfx-right-column'\"\n      [height]=\"'400px'\"\n    ></symphony-placeholder>\n  </symphony-two-column-body-template>\n  <symphony-button\n    sfx-button-secondary\n    [text]=\"model.secondaryButtonText\"\n    [isSecondary]=\"true\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n  <symphony-button\n    sfx-button-primary\n    [text]=\"model.primaryButtonText\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n</symphony-two-column-modal-template>\n", styles: [".right-col-header-inner{padding-top:10px}\n"], components: [{ type: TwoColumnModalTemplateComponent, selector: "symphony-two-column-modal-template" }, { type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: H5WithIconComponent, selector: "symphony-h5-with-icon", inputs: ["model"] }, { type: TwoColumnBodyTemplateComponent, selector: "symphony-two-column-body-template" }, { type: InputTextComponent, selector: "symphony-input-text", inputs: ["placeholder", "icon", "label", "isInverse", "noMargin"], outputs: ["textChange"] }, { type: PlaceholderComponent, selector: "symphony-placeholder", inputs: ["type", "label", "tooltip", "tooltipPlacement", "height", "width"] }, { type: ButtonComponent, selector: "symphony-button", inputs: ["text", "disabled", "isSecondary", "isInverse"], outputs: ["clicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+AdvertiseModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdvertiseModalComponent, selector: "symphony-advertise-modal", inputs: { model: "model" }, outputs: { buttonClicked: "buttonClicked", closeButtonClicked: "closeButtonClicked" }, ngImport: i0, template: "<symphony-two-column-modal-template>\n  <symphony-h4 sfx-modal-title>{{ model.title }}</symphony-h4>\n  <symphony-icon\n    sfx-close-button\n    [icon]=\"'si-close-modal'\"\n    (clicked)=\"onCloseButtonClick()\"\n  ></symphony-icon>\n  <symphony-h5-with-icon sfx-modal-subtitle [model]=\"model.subtitle\">\n  </symphony-h5-with-icon>\n  <symphony-two-column-body-template sfx-modal-body-area>\n    <symphony-input-text\n      sfx-left-col-header\n      [noMargin]=\"true\"\n      [placeholder]=\"'Search Ad Boards'\"\n      [icon]=\"'si-search-new'\"\n      (textChange)=\"keywordSearch($event)\"\n    >\n    </symphony-input-text>\n    <div class=\"right-col-header-inner\" sfx-right-col-header>\n      <symphony-h5-with-icon\n        sfx-right-col-header\n        *ngIf=\"model.showFunds\"\n        class=\"pull-right\"\n        [model]=\"model.fundsInfo\"\n      ></symphony-h5-with-icon>\n    </div>\n    <div sfx-left-column class=\"posting-boards\">\n      <symphony-advertise-postingboard-selection-list\n        [model]=\"filteredPostingBoardList\"\n      ></symphony-advertise-postingboard-selection-list>\n    </div>\n\n    <symphony-placeholder\n      sfx-right-column\n      [label]=\"'sfx-right-column'\"\n      [height]=\"'400px'\"\n    ></symphony-placeholder>\n  </symphony-two-column-body-template>\n  <symphony-button\n    sfx-button-secondary\n    [text]=\"model.secondaryButtonText\"\n    [isSecondary]=\"true\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n  <symphony-button\n    sfx-button-primary\n    [text]=\"model.primaryButtonText\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n</symphony-two-column-modal-template>\n", styles: [".right-col-header-inner{padding-top:10px}.posting-boards{height:400px;overflow-x:auto}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}\n"], components: [{ type: TwoColumnModalTemplateComponent, selector: "symphony-two-column-modal-template" }, { type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: H5WithIconComponent, selector: "symphony-h5-with-icon", inputs: ["model"] }, { type: TwoColumnBodyTemplateComponent, selector: "symphony-two-column-body-template" }, { type: InputTextComponent, selector: "symphony-input-text", inputs: ["placeholder", "icon", "label", "isInverse", "noMargin"], outputs: ["textChange"] }, { type: AdvertisePostingboardSelectionListComponent, selector: "symphony-advertise-postingboard-selection-list", inputs: ["model"] }, { type: PlaceholderComponent, selector: "symphony-placeholder", inputs: ["type", "label", "tooltip", "tooltipPlacement", "height", "width"] }, { type: ButtonComponent, selector: "symphony-button", inputs: ["text", "disabled", "isSecondary", "isInverse"], outputs: ["clicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertiseModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'symphony-advertise-modal', template: "<symphony-two-column-modal-template>\n  <symphony-h4 sfx-modal-title>{{ model.title }}</symphony-h4>\n  <symphony-icon\n    sfx-close-button\n    [icon]=\"'si-close-modal'\"\n    (clicked)=\"onCloseButtonClick()\"\n  ></symphony-icon>\n  <symphony-h5-with-icon sfx-modal-subtitle [model]=\"model.subtitle\">\n  </symphony-h5-with-icon>\n  <symphony-two-column-body-template sfx-modal-body-area>\n    <symphony-input-text\n      sfx-left-col-header\n      [noMargin]=\"true\"\n      [placeholder]=\"'Search Ad Boards'\"\n      [icon]=\"'si-search-new'\"\n      (textChange)=\"keywordSearch($event)\"\n    >\n    </symphony-input-text>\n    <div class=\"right-col-header-inner\" sfx-right-col-header>\n      <symphony-h5-with-icon\n        sfx-right-col-header\n        *ngIf=\"model.showFunds\"\n        class=\"pull-right\"\n        [model]=\"model.fundsInfo\"\n      ></symphony-h5-with-icon>\n    </div>\n    <symphony-placeholder\n      sfx-left-column\n      [label]=\"'sfx-left-column'\"\n      [height]=\"'400px'\"\n    ></symphony-placeholder>\n    <symphony-placeholder\n      sfx-right-column\n      [label]=\"'sfx-right-column'\"\n      [height]=\"'400px'\"\n    ></symphony-placeholder>\n  </symphony-two-column-body-template>\n  <symphony-button\n    sfx-button-secondary\n    [text]=\"model.secondaryButtonText\"\n    [isSecondary]=\"true\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n  <symphony-button\n    sfx-button-primary\n    [text]=\"model.primaryButtonText\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n</symphony-two-column-modal-template>\n", styles: [".right-col-header-inner{padding-top:10px}\n"] }]
+            args: [{ selector: 'symphony-advertise-modal', template: "<symphony-two-column-modal-template>\n  <symphony-h4 sfx-modal-title>{{ model.title }}</symphony-h4>\n  <symphony-icon\n    sfx-close-button\n    [icon]=\"'si-close-modal'\"\n    (clicked)=\"onCloseButtonClick()\"\n  ></symphony-icon>\n  <symphony-h5-with-icon sfx-modal-subtitle [model]=\"model.subtitle\">\n  </symphony-h5-with-icon>\n  <symphony-two-column-body-template sfx-modal-body-area>\n    <symphony-input-text\n      sfx-left-col-header\n      [noMargin]=\"true\"\n      [placeholder]=\"'Search Ad Boards'\"\n      [icon]=\"'si-search-new'\"\n      (textChange)=\"keywordSearch($event)\"\n    >\n    </symphony-input-text>\n    <div class=\"right-col-header-inner\" sfx-right-col-header>\n      <symphony-h5-with-icon\n        sfx-right-col-header\n        *ngIf=\"model.showFunds\"\n        class=\"pull-right\"\n        [model]=\"model.fundsInfo\"\n      ></symphony-h5-with-icon>\n    </div>\n    <div sfx-left-column class=\"posting-boards\">\n      <symphony-advertise-postingboard-selection-list\n        [model]=\"filteredPostingBoardList\"\n      ></symphony-advertise-postingboard-selection-list>\n    </div>\n\n    <symphony-placeholder\n      sfx-right-column\n      [label]=\"'sfx-right-column'\"\n      [height]=\"'400px'\"\n    ></symphony-placeholder>\n  </symphony-two-column-body-template>\n  <symphony-button\n    sfx-button-secondary\n    [text]=\"model.secondaryButtonText\"\n    [isSecondary]=\"true\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n  <symphony-button\n    sfx-button-primary\n    [text]=\"model.primaryButtonText\"\n    [isInverse]=\"true\"\n    (clicked)=\"onButtonClick($event)\"\n  ></symphony-button>\n</symphony-two-column-modal-template>\n", styles: [".right-col-header-inner{padding-top:10px}.posting-boards{height:400px;overflow-x:auto}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { model: [{
                 type: Input
-            }], keywordSearchChange: [{
-                type: Output
             }], buttonClicked: [{
                 type: Output
             }], closeButtonClicked: [{
@@ -3019,6 +3104,48 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
                 }]
         }] });
 
+class InputEditableTextModule {
+}
+InputEditableTextModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+InputEditableTextModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextModule, declarations: [InputEditableTextComponent], imports: [CommonModule, IconModule, FormsModule, ParagraphModule], exports: [InputEditableTextComponent] });
+InputEditableTextModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextModule, imports: [[CommonModule, IconModule, FormsModule, ParagraphModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [InputEditableTextComponent],
+                    imports: [CommonModule, IconModule, FormsModule, ParagraphModule],
+                    exports: [InputEditableTextComponent],
+                }]
+        }] });
+
+class AdvertisePostingboardSelectionItemModule {
+}
+AdvertisePostingboardSelectionItemModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AdvertisePostingboardSelectionItemModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemModule, declarations: [AdvertisePostingboardSelectionItemComponent], imports: [CommonModule, InputEditableTextModule, InputCheckboxModule], exports: [AdvertisePostingboardSelectionItemComponent] });
+AdvertisePostingboardSelectionItemModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemModule, imports: [[CommonModule, InputEditableTextModule, InputCheckboxModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionItemModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AdvertisePostingboardSelectionItemComponent],
+                    imports: [CommonModule, InputEditableTextModule, InputCheckboxModule],
+                    exports: [AdvertisePostingboardSelectionItemComponent],
+                }]
+        }] });
+
+class AdvertisePostingboardSelectionListModule {
+}
+AdvertisePostingboardSelectionListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+AdvertisePostingboardSelectionListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListModule, declarations: [AdvertisePostingboardSelectionListComponent], imports: [CommonModule, AdvertisePostingboardSelectionItemModule], exports: [AdvertisePostingboardSelectionListComponent] });
+AdvertisePostingboardSelectionListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListModule, imports: [[CommonModule, AdvertisePostingboardSelectionItemModule]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertisePostingboardSelectionListModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [AdvertisePostingboardSelectionListComponent],
+                    imports: [CommonModule, AdvertisePostingboardSelectionItemModule],
+                    exports: [AdvertisePostingboardSelectionListComponent],
+                }]
+        }] });
+
 class ModalModule {
 }
 ModalModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -3032,7 +3159,8 @@ ModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "1
         InputTextModule,
         ButtonModule,
         PlaceholderModule,
-        H5WithIconModule], exports: [AdvertiseModalComponent] });
+        H5WithIconModule,
+        AdvertisePostingboardSelectionListModule], exports: [AdvertiseModalComponent] });
 ModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ModalModule, imports: [[
             CommonModule,
             TwoColumnModalModule,
@@ -3045,6 +3173,7 @@ ModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "1
             ButtonModule,
             PlaceholderModule,
             H5WithIconModule,
+            AdvertisePostingboardSelectionListModule,
         ]] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ModalModule, decorators: [{
             type: NgModule,
@@ -3062,6 +3191,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
                         ButtonModule,
                         PlaceholderModule,
                         H5WithIconModule,
+                        AdvertisePostingboardSelectionListModule,
                     ],
                     exports: [AdvertiseModalComponent],
                 }]