@symphony-talent/component-library 3.49.0 → 3.49.1

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.
@@ -1,7 +1,7 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { Component, Input, NgModule, EventEmitter, Output, Pipe, Injectable, ViewEncapsulation, ViewChild } from '@angular/core';
3
3
  import * as i1 from '@angular/common';
4
- import { SlicePipe, CommonModule } from '@angular/common';
4
+ import { SlicePipe, CommonModule, DecimalPipe } from '@angular/common';
5
5
  import * as i1$1 from 'ngx-bootstrap/dropdown';
6
6
  import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
7
7
  import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@@ -5096,10 +5096,10 @@ class InputEditableTextComponent {
5096
5096
  }
5097
5097
  }
5098
5098
  InputEditableTextComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5099
- 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", validate: "validate", editMode: "editMode" }, ngImport: i0, template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\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\n *ngIf=\"model.isInEditMode\"\n class=\"editMode\"\n [ngClass]=\"{\n invalid: model.isInvalid\n }\"\n >\n <span class=\"sfx-pr-10\"\n ><input\n type=\"{{ type }}\"\n *ngIf=\"maxMinPlaceholder\"\n [placeholder]=\"maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n <input\n type=\"{{ type }}\"\n *ngIf=\"!maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n </span>\n <span class=\"edit-i-postion\"\n ><symphony-icon\n [ngClass]=\"{\n 'invalid-confirm': model.isInvalid\n }\"\n [icon]=\"'si-confirmation'\"\n (click)=\"onConfirmClick()\"\n ></symphony-icon\n ></span>\n <span class=\"sfx-ml-10 edit-i-postion\"\n ><symphony-icon\n [icon]=\"'si-close-modal'\"\n (click)=\"onCloseClick()\"\n ></symphony-icon\n ></span>\n </div>\n</div>\n", styles: [".color-sample{float:left;border-radius:50%;height:30px;width:30px;margin-top:10px;margin-right:20px}.background-color-black{background-color:#000}.background-color-grey{background-color:#bababa}.background-color-light-grey-1{background-color:#d0d0d0}.background-color-light-grey-2{background-color:#d9d9d9}.background-color-light-grey-3{background-color:#ebebeb}.background-color-medium-black{background-color:#464646}.background-color-space-grey{background-color:#141414}.background-color-white{background-color:#fff}.background-color-green{background-color:#00d56b}.background-color-ice-blue{background-color:#03bcce}.background-color-lavender{background-color:#af5af9}.background-color-orange{background-color:#ffa700}.background-color-pink{background-color:#ff6cff}.background-color-purple{background-color:#801afc}.background-color-red{background-color:#f0001e}.background-color-skyblue{background-color:#007dbb}.background-color-turquoise{background-color:#00ebb5}.background-color-yellow{background-color:#fde928}.background-color-cyan{background-color:#00ffd8}.background-color-strong-orange{background-color:#ffa700}.background-color-soft-lime-green{background-color:#67f95a}.background-color-bright-violet{background-color:#7428fd}.background-color-lime-green{background-color:#00bb5e}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;width:75px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}.editMode{border:1px solid #d9d9d9;padding:7.5px 10px;border-radius:4px}.editMode.invalid{border:1px solid #f0001e}.editMode .edit-i-postion{position:relative;top:2px}.editMode .min-max-placeholder::placeholder{color:#bababa}.invalid-confirm{color:#d0d0d0}.invalid-confirm:hover{cursor:no-drop}.invalid-confirm i{pointer-events:none}\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: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], encapsulation: i0.ViewEncapsulation.None });
5099
+ 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", validate: "validate", editMode: "editMode" }, ngImport: i0, template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\n <div>\n <symphony-paragraph\n >{{ model.inputMask\n }}{{ model.value | number: \"1.0\":\"en-US\" }}</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\n *ngIf=\"model.isInEditMode\"\n class=\"editMode\"\n [ngClass]=\"{\n invalid: model.isInvalid\n }\"\n >\n <span class=\"sfx-pr-10\"\n ><input\n type=\"{{ type }}\"\n *ngIf=\"maxMinPlaceholder\"\n [placeholder]=\"maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n <input\n type=\"{{ type }}\"\n *ngIf=\"!maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n </span>\n <span class=\"edit-i-postion\"\n ><symphony-icon\n [ngClass]=\"{\n 'invalid-confirm': model.isInvalid\n }\"\n [icon]=\"'si-confirmation'\"\n (click)=\"onConfirmClick()\"\n ></symphony-icon\n ></span>\n <span class=\"sfx-ml-10 edit-i-postion\"\n ><symphony-icon\n [icon]=\"'si-close-modal'\"\n (click)=\"onCloseClick()\"\n ></symphony-icon\n ></span>\n </div>\n</div>\n", styles: [".color-sample{float:left;border-radius:50%;height:30px;width:30px;margin-top:10px;margin-right:20px}.background-color-black{background-color:#000}.background-color-grey{background-color:#bababa}.background-color-light-grey-1{background-color:#d0d0d0}.background-color-light-grey-2{background-color:#d9d9d9}.background-color-light-grey-3{background-color:#ebebeb}.background-color-medium-black{background-color:#464646}.background-color-space-grey{background-color:#141414}.background-color-white{background-color:#fff}.background-color-green{background-color:#00d56b}.background-color-ice-blue{background-color:#03bcce}.background-color-lavender{background-color:#af5af9}.background-color-orange{background-color:#ffa700}.background-color-pink{background-color:#ff6cff}.background-color-purple{background-color:#801afc}.background-color-red{background-color:#f0001e}.background-color-skyblue{background-color:#007dbb}.background-color-turquoise{background-color:#00ebb5}.background-color-yellow{background-color:#fde928}.background-color-cyan{background-color:#00ffd8}.background-color-strong-orange{background-color:#ffa700}.background-color-soft-lime-green{background-color:#67f95a}.background-color-bright-violet{background-color:#7428fd}.background-color-lime-green{background-color:#00bb5e}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;width:75px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}.editMode{border:1px solid #d9d9d9;padding:7.5px 10px;border-radius:4px}.editMode.invalid{border:1px solid #f0001e}.editMode .edit-i-postion{position:relative;top:2px}.editMode .min-max-placeholder::placeholder{color:#bababa}.invalid-confirm{color:#d0d0d0}.invalid-confirm:hover{cursor:no-drop}.invalid-confirm i{pointer-events:none}\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: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "number": i1.DecimalPipe }, encapsulation: i0.ViewEncapsulation.None });
5100
5100
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: InputEditableTextComponent, decorators: [{
5101
5101
  type: Component,
5102
- args: [{ selector: 'symphony-input-editable-text', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\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\n *ngIf=\"model.isInEditMode\"\n class=\"editMode\"\n [ngClass]=\"{\n invalid: model.isInvalid\n }\"\n >\n <span class=\"sfx-pr-10\"\n ><input\n type=\"{{ type }}\"\n *ngIf=\"maxMinPlaceholder\"\n [placeholder]=\"maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n <input\n type=\"{{ type }}\"\n *ngIf=\"!maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n </span>\n <span class=\"edit-i-postion\"\n ><symphony-icon\n [ngClass]=\"{\n 'invalid-confirm': model.isInvalid\n }\"\n [icon]=\"'si-confirmation'\"\n (click)=\"onConfirmClick()\"\n ></symphony-icon\n ></span>\n <span class=\"sfx-ml-10 edit-i-postion\"\n ><symphony-icon\n [icon]=\"'si-close-modal'\"\n (click)=\"onCloseClick()\"\n ></symphony-icon\n ></span>\n </div>\n</div>\n", styles: [".color-sample{float:left;border-radius:50%;height:30px;width:30px;margin-top:10px;margin-right:20px}.background-color-black{background-color:#000}.background-color-grey{background-color:#bababa}.background-color-light-grey-1{background-color:#d0d0d0}.background-color-light-grey-2{background-color:#d9d9d9}.background-color-light-grey-3{background-color:#ebebeb}.background-color-medium-black{background-color:#464646}.background-color-space-grey{background-color:#141414}.background-color-white{background-color:#fff}.background-color-green{background-color:#00d56b}.background-color-ice-blue{background-color:#03bcce}.background-color-lavender{background-color:#af5af9}.background-color-orange{background-color:#ffa700}.background-color-pink{background-color:#ff6cff}.background-color-purple{background-color:#801afc}.background-color-red{background-color:#f0001e}.background-color-skyblue{background-color:#007dbb}.background-color-turquoise{background-color:#00ebb5}.background-color-yellow{background-color:#fde928}.background-color-cyan{background-color:#00ffd8}.background-color-strong-orange{background-color:#ffa700}.background-color-soft-lime-green{background-color:#67f95a}.background-color-bright-violet{background-color:#7428fd}.background-color-lime-green{background-color:#00bb5e}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;width:75px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}.editMode{border:1px solid #d9d9d9;padding:7.5px 10px;border-radius:4px}.editMode.invalid{border:1px solid #f0001e}.editMode .edit-i-postion{position:relative;top:2px}.editMode .min-max-placeholder::placeholder{color:#bababa}.invalid-confirm{color:#d0d0d0}.invalid-confirm:hover{cursor:no-drop}.invalid-confirm i{pointer-events:none}\n"] }]
5102
+ args: [{ selector: 'symphony-input-editable-text', encapsulation: ViewEncapsulation.None, template: "<div *ngIf=\"model\">\n <div *ngIf=\"!model.isInEditMode\">\n <div class=\"flex sfx-pt-10\">\n <div>\n <symphony-paragraph\n >{{ model.inputMask\n }}{{ model.value | number: \"1.0\":\"en-US\" }}</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\n *ngIf=\"model.isInEditMode\"\n class=\"editMode\"\n [ngClass]=\"{\n invalid: model.isInvalid\n }\"\n >\n <span class=\"sfx-pr-10\"\n ><input\n type=\"{{ type }}\"\n *ngIf=\"maxMinPlaceholder\"\n [placeholder]=\"maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n <input\n type=\"{{ type }}\"\n *ngIf=\"!maxMinPlaceholder\"\n [(ngModel)]=\"model.value\"\n [ngClass]=\"{\n 'min-max-placeholder': model.minValue && model.maxValue\n }\"\n (keyup)=\"onValidate($event)\"\n />\n </span>\n <span class=\"edit-i-postion\"\n ><symphony-icon\n [ngClass]=\"{\n 'invalid-confirm': model.isInvalid\n }\"\n [icon]=\"'si-confirmation'\"\n (click)=\"onConfirmClick()\"\n ></symphony-icon\n ></span>\n <span class=\"sfx-ml-10 edit-i-postion\"\n ><symphony-icon\n [icon]=\"'si-close-modal'\"\n (click)=\"onCloseClick()\"\n ></symphony-icon\n ></span>\n </div>\n</div>\n", styles: [".color-sample{float:left;border-radius:50%;height:30px;width:30px;margin-top:10px;margin-right:20px}.background-color-black{background-color:#000}.background-color-grey{background-color:#bababa}.background-color-light-grey-1{background-color:#d0d0d0}.background-color-light-grey-2{background-color:#d9d9d9}.background-color-light-grey-3{background-color:#ebebeb}.background-color-medium-black{background-color:#464646}.background-color-space-grey{background-color:#141414}.background-color-white{background-color:#fff}.background-color-green{background-color:#00d56b}.background-color-ice-blue{background-color:#03bcce}.background-color-lavender{background-color:#af5af9}.background-color-orange{background-color:#ffa700}.background-color-pink{background-color:#ff6cff}.background-color-purple{background-color:#801afc}.background-color-red{background-color:#f0001e}.background-color-skyblue{background-color:#007dbb}.background-color-turquoise{background-color:#00ebb5}.background-color-yellow{background-color:#fde928}.background-color-cyan{background-color:#00ffd8}.background-color-strong-orange{background-color:#ffa700}.background-color-soft-lime-green{background-color:#67f95a}.background-color-bright-violet{background-color:#7428fd}.background-color-lime-green{background-color:#00bb5e}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;width:75px}input:focus{outline:none}.flex{display:flex}.no-icon-padding{padding-right:23px}.editMode{border:1px solid #d9d9d9;padding:7.5px 10px;border-radius:4px}.editMode.invalid{border:1px solid #f0001e}.editMode .edit-i-postion{position:relative;top:2px}.editMode .min-max-placeholder::placeholder{color:#bababa}.invalid-confirm{color:#d0d0d0}.invalid-confirm:hover{cursor:no-drop}.invalid-confirm i{pointer-events:none}\n"] }]
5103
5103
  }], ctorParameters: function () { return []; }, propDecorators: { model: [{
5104
5104
  type: Input
5105
5105
  }], type: [{
@@ -5235,7 +5235,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
5235
5235
  }] } });
5236
5236
 
5237
5237
  class AdvertiseModalComponent {
5238
- constructor() {
5238
+ constructor(decimalPipe) {
5239
+ this.decimalPipe = decimalPipe;
5239
5240
  this.buttonClicked = new EventEmitter();
5240
5241
  this.closeButtonClicked = new EventEmitter();
5241
5242
  this.postingBoardChange = new EventEmitter();
@@ -5340,19 +5341,21 @@ class AdvertiseModalComponent {
5340
5341
  }
5341
5342
  }
5342
5343
  addLineItem(invoiceAreaIndex, selectedBoard) {
5344
+ let formattedBoardPrice = this.decimalPipe.transform(selectedBoard.boardPrice, '1.0', 'en-US');
5343
5345
  this.orderSummary.invoiceAreas[invoiceAreaIndex].lineItems.push({
5344
5346
  textLeft: selectedBoard.boardName,
5345
- textRight: `$${selectedBoard.boardPrice}`
5347
+ textRight: `$${formattedBoardPrice}`
5346
5348
  });
5347
5349
  }
5348
5350
  calculateInvoiceAreaTotal(invoiceAreaIndex) {
5349
5351
  let invoiceAreaTotal = 0;
5350
5352
  this.orderSummary.invoiceAreas[invoiceAreaIndex].lineItems.forEach(li => {
5351
- invoiceAreaTotal = invoiceAreaTotal + +li.textRight.replace('$', '');
5353
+ invoiceAreaTotal =
5354
+ invoiceAreaTotal + +li.textRight.replace('$', '').replace(',', '');
5352
5355
  });
5353
- this.orderSummary.invoiceAreas[invoiceAreaIndex].subTotal.textRight = `$${invoiceAreaTotal *
5354
- this.model.jobsToAdvertise.length}`;
5355
- this.orderSummary.invoiceAreas[invoiceAreaIndex].total.textRight = `$${invoiceAreaTotal}`;
5356
+ let subTotal = invoiceAreaTotal * this.model.jobsToAdvertise.length;
5357
+ this.orderSummary.invoiceAreas[invoiceAreaIndex].subTotal.textRight = `$${this.decimalPipe.transform(subTotal, '1.0', 'en-US')}`;
5358
+ this.orderSummary.invoiceAreas[invoiceAreaIndex].total.textRight = `$${this.decimalPipe.transform(invoiceAreaTotal.toString().replace(',', ''), '1.0', 'en-US')}`;
5356
5359
  return invoiceAreaTotal * this.model.jobsToAdvertise.length;
5357
5360
  }
5358
5361
  calculateOrderTotal(payPerClickAreaTotal, jobBoardAreaTotal) {
@@ -5360,10 +5363,11 @@ class AdvertiseModalComponent {
5360
5363
  .length;
5361
5364
  const jobToAdvertiseCount = this.model.jobsToAdvertise.length;
5362
5365
  const orderSummaryText = `(${selectedJobBoards}) Boards x ${this.model.jobsToAdvertise.length} Jobs = (${selectedJobBoards * jobToAdvertiseCount}) Ads`;
5366
+ let currentTotal = payPerClickAreaTotal + jobBoardAreaTotal;
5363
5367
  this.orderSummary.total = {
5364
5368
  label: 'Current Total',
5365
5369
  textLeft: '',
5366
- textRight: `$${payPerClickAreaTotal + jobBoardAreaTotal}`
5370
+ textRight: `$${this.decimalPipe.transform(currentTotal.toString().replace(',', ''), '1.0', 'en-US')}`
5367
5371
  };
5368
5372
  }
5369
5373
  updateOrderSummary() {
@@ -5423,12 +5427,12 @@ class AdvertiseModalComponent {
5423
5427
  this.postingBoardChange.emit(this.model);
5424
5428
  }
5425
5429
  }
5426
- AdvertiseModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertiseModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5430
+ AdvertiseModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertiseModalComponent, deps: [{ token: i1.DecimalPipe }], target: i0.ɵɵFactoryTarget.Component });
5427
5431
  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", postingBoardChange: "postingBoardChange", keywordSearchChange: "keywordSearchChange" }, usesOnChanges: true, ngImport: i0, template: "<symphony-two-column-modal-template *ngIf=\"!model.navigation.showCancel\">\n <symphony-h4\n *ngIf=\"model.navigation.showJobBoardsSelection && !model.isLoading\"\n sfx-modal-title\n >Select Your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showOrderReview\" sfx-modal-title\n >Review you Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showConfirmation\" sfx-modal-title\n >Confirmation of your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showProcessing\" sfx-modal-title\n >Processing Order...</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.isLoading\" sfx-modal-title\n >Loading Job Boards...</symphony-h4\n >\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]=\"subTitle\">\n </symphony-h5-with-icon>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showJobBoardsSelection\"\n [showHeader]=\"true\"\n sfx-modal-body-area\n >\n <symphony-input-text\n sfx-left-col-header\n [noMargin]=\"true\"\n [placeholder]=\"'Search Ad Boards'\"\n [icon]=\"'si-search-new'\"\n (textChange)=\"onKeywordSearch($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]=\"fundsInfo\"\n ></symphony-h5-with-icon>\n </div>\n <div sfx-left-column class=\"posting-boards sfx-pr-10\">\n <symphony-advertise-postingboard-selection-list\n [model]=\"model.jobBoards\"\n (postingBoardChange)=\"onPostingBoardChange($event)\"\n ></symphony-advertise-postingboard-selection-list>\n </div>\n\n <symphony-order-summary\n sfx-right-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showOrderReview\"\n sfx-modal-body-area\n class=\"height-wrapper\"\n >\n <symphony-order-summary\n sfx-left-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n\n <div\n sfx-right-column\n class=\"posting-boards phaser center-h-v light-grey-bg\"\n >\n <symphony-phaser-card [model]=\"phaserCardReview\"></symphony-phaser-card>\n </div>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showConfirmation\"\n sfx-modal-body-area\n class=\"height-wrapper\"\n >\n <symphony-order-summary\n sfx-left-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n <div\n sfx-right-column\n class=\"posting-boards phaser center-h-v light-grey-bg\"\n >\n <symphony-phaser-card\n [model]=\"phaserCardConfirmation\"\n ></symphony-phaser-card>\n </div>\n </symphony-two-column-body-template>\n\n <div\n *ngIf=\"!model.isLoading && model.navigation.showProcessing\"\n sfx-modal-body-area\n class=\"posting-boards sfx-p-30\"\n >\n <div class=\"processing-container\">\n <symphony-paragraph\n ><b>SmashFlyX</b> is submitting your order to your selected job boards.\n Some orders happen immediately, while others take a little more time.\n Check your order status if you don't recieve a confirmation in the next\n 24hours.</symphony-paragraph\n >\n </div>\n <div class=\"sfx-mt-80\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n </div>\n\n <div class=\"loader-container\" *ngIf=\"model.isLoading\" sfx-modal-body-area>\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-primary\n [text]=\"'Review Order'\"\n [disabled]=\"isJobBoardNextButtonDisabled\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-back\n [text]=\"'Edit Order'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-primary\n [text]=\"'Buy'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showConfirmation\"\n sfx-button-primary\n [text]=\"'Finish & Close'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n</symphony-two-column-modal-template>\n<symphony-confirmation-modal\n *ngIf=\"!model.isLoading && model.navigation.showCancel\"\n (buttonClicked)=\"onButtonClick($event)\"\n (closeButtonClicked)=\"onCloseButtonClick()\"\n [model]=\"cancelContent\"\n>\n</symphony-confirmation-modal>\n", styles: [".right-col-header-inner{padding-top:10px}.posting-boards{height:400px;overflow-x:auto}.posting-boards.phaser{overflow:hidden;padding:40px 80px;min-height:480px}.height-wrapper .order-summary,.height-wrapper .sfx-price-totals{padding:0}.height-wrapper .sfx-checkbox-list{min-height:480px}.light-grey-bg{background:#ebebeb}.center-h-v{display:flex;align-items:center;justify-content:center}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.loader-container{padding-top:246px;padding-bottom:245px}.complete-container{text-align:center;margin-top:25%}.success-icon-spacing{margin-top:25px}.processing-container{width:400px;text-align:justify}.stage{display:flex;height:240px;width:100%}.box{align-self:flex-end;animation-duration:2s;animation-iteration-count:1;height:200px;margin:0 auto;transform-origin:bottom;width:200px}.bounce-7{animation-name:bounce-7;animation-timing-function:cubic-bezier(.24,.82,.24,.82)}@keyframes bounce-7{0%{transform:scale(1) translateY(0)}10%{transform:scale(1.1,.9) translateY(0)}30%{transform:scale(.9,1.1) translateY(-15px)}50%{transform:scale(1.05,.95) translateY(0)}57%{transform:scale(1) translateY(-7px)}64%{transform:scale(1) translateY(0)}to{transform:scale(1) translateY(0)}}\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", inputs: ["showHeader"] }, { type: InputTextComponent, selector: "symphony-input-text", inputs: ["placeholder", "icon", "label", "isInverse", "noMargin"], outputs: ["textChange"] }, { type: AdvertisePostingboardSelectionListComponent, selector: "symphony-advertise-postingboard-selection-list", inputs: ["model"], outputs: ["postingBoardChange"] }, { type: OrderSummaryComponent, selector: "symphony-order-summary", inputs: ["model"] }, { type: PhaserCardComponent, selector: "symphony-phaser-card", inputs: ["model", "isClickable", "hasHover"], outputs: ["cardClicked", "cardHover"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary"] }, { type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message"] }, { type: ButtonComponent, selector: "symphony-button", inputs: ["text", "disabled", "isSecondary", "isInverse"], outputs: ["clicked"] }, { type: ConfirmationModalComponent, selector: "symphony-confirmation-modal", inputs: ["model"], outputs: ["buttonClicked", "closeButtonClicked"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
5428
5432
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdvertiseModalComponent, decorators: [{
5429
5433
  type: Component,
5430
5434
  args: [{ selector: 'symphony-advertise-modal', encapsulation: ViewEncapsulation.None, template: "<symphony-two-column-modal-template *ngIf=\"!model.navigation.showCancel\">\n <symphony-h4\n *ngIf=\"model.navigation.showJobBoardsSelection && !model.isLoading\"\n sfx-modal-title\n >Select Your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showOrderReview\" sfx-modal-title\n >Review you Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showConfirmation\" sfx-modal-title\n >Confirmation of your Job Ad Buys</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.navigation.showProcessing\" sfx-modal-title\n >Processing Order...</symphony-h4\n >\n <symphony-h4 *ngIf=\"model.isLoading\" sfx-modal-title\n >Loading Job Boards...</symphony-h4\n >\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]=\"subTitle\">\n </symphony-h5-with-icon>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showJobBoardsSelection\"\n [showHeader]=\"true\"\n sfx-modal-body-area\n >\n <symphony-input-text\n sfx-left-col-header\n [noMargin]=\"true\"\n [placeholder]=\"'Search Ad Boards'\"\n [icon]=\"'si-search-new'\"\n (textChange)=\"onKeywordSearch($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]=\"fundsInfo\"\n ></symphony-h5-with-icon>\n </div>\n <div sfx-left-column class=\"posting-boards sfx-pr-10\">\n <symphony-advertise-postingboard-selection-list\n [model]=\"model.jobBoards\"\n (postingBoardChange)=\"onPostingBoardChange($event)\"\n ></symphony-advertise-postingboard-selection-list>\n </div>\n\n <symphony-order-summary\n sfx-right-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showOrderReview\"\n sfx-modal-body-area\n class=\"height-wrapper\"\n >\n <symphony-order-summary\n sfx-left-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n\n <div\n sfx-right-column\n class=\"posting-boards phaser center-h-v light-grey-bg\"\n >\n <symphony-phaser-card [model]=\"phaserCardReview\"></symphony-phaser-card>\n </div>\n </symphony-two-column-body-template>\n\n <symphony-two-column-body-template\n *ngIf=\"!model.isLoading && model.navigation.showConfirmation\"\n sfx-modal-body-area\n class=\"height-wrapper\"\n >\n <symphony-order-summary\n sfx-left-column\n [model]=\"orderSummary\"\n ></symphony-order-summary>\n <div\n sfx-right-column\n class=\"posting-boards phaser center-h-v light-grey-bg\"\n >\n <symphony-phaser-card\n [model]=\"phaserCardConfirmation\"\n ></symphony-phaser-card>\n </div>\n </symphony-two-column-body-template>\n\n <div\n *ngIf=\"!model.isLoading && model.navigation.showProcessing\"\n sfx-modal-body-area\n class=\"posting-boards sfx-p-30\"\n >\n <div class=\"processing-container\">\n <symphony-paragraph\n ><b>SmashFlyX</b> is submitting your order to your selected job boards.\n Some orders happen immediately, while others take a little more time.\n Check your order status if you don't recieve a confirmation in the next\n 24hours.</symphony-paragraph\n >\n </div>\n <div class=\"sfx-mt-80\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n </div>\n\n <div class=\"loader-container\" *ngIf=\"model.isLoading\" sfx-modal-body-area>\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showJobBoardsSelection\"\n sfx-button-primary\n [text]=\"'Review Order'\"\n [disabled]=\"isJobBoardNextButtonDisabled\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-back\n [text]=\"'Edit Order'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-secondary\n [text]=\"'Cancel'\"\n [isSecondary]=\"true\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n <symphony-button\n *ngIf=\"model.navigation.showOrderReview\"\n sfx-button-primary\n [text]=\"'Buy'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n\n <symphony-button\n *ngIf=\"model.navigation.showConfirmation\"\n sfx-button-primary\n [text]=\"'Finish & Close'\"\n [disabled]=\"false\"\n [isInverse]=\"true\"\n (clicked)=\"onButtonClick($event)\"\n ></symphony-button>\n</symphony-two-column-modal-template>\n<symphony-confirmation-modal\n *ngIf=\"!model.isLoading && model.navigation.showCancel\"\n (buttonClicked)=\"onButtonClick($event)\"\n (closeButtonClicked)=\"onCloseButtonClick()\"\n [model]=\"cancelContent\"\n>\n</symphony-confirmation-modal>\n", styles: [".right-col-header-inner{padding-top:10px}.posting-boards{height:400px;overflow-x:auto}.posting-boards.phaser{overflow:hidden;padding:40px 80px;min-height:480px}.height-wrapper .order-summary,.height-wrapper .sfx-price-totals{padding:0}.height-wrapper .sfx-checkbox-list{min-height:480px}.light-grey-bg{background:#ebebeb}.center-h-v{display:flex;align-items:center;justify-content:center}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#fff}::-webkit-scrollbar-thumb{background:#d4d4d4;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}.loader-container{padding-top:246px;padding-bottom:245px}.complete-container{text-align:center;margin-top:25%}.success-icon-spacing{margin-top:25px}.processing-container{width:400px;text-align:justify}.stage{display:flex;height:240px;width:100%}.box{align-self:flex-end;animation-duration:2s;animation-iteration-count:1;height:200px;margin:0 auto;transform-origin:bottom;width:200px}.bounce-7{animation-name:bounce-7;animation-timing-function:cubic-bezier(.24,.82,.24,.82)}@keyframes bounce-7{0%{transform:scale(1) translateY(0)}10%{transform:scale(1.1,.9) translateY(0)}30%{transform:scale(.9,1.1) translateY(-15px)}50%{transform:scale(1.05,.95) translateY(0)}57%{transform:scale(1) translateY(-7px)}64%{transform:scale(1) translateY(0)}to{transform:scale(1) translateY(0)}}\n"] }]
5431
- }], ctorParameters: function () { return []; }, propDecorators: { model: [{
5435
+ }], ctorParameters: function () { return [{ type: i1.DecimalPipe }]; }, propDecorators: { model: [{
5432
5436
  type: Input
5433
5437
  }], buttonClicked: [{
5434
5438
  type: Output
@@ -5584,7 +5588,7 @@ ModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "1
5584
5588
  OrderSummaryModule,
5585
5589
  ConfirmationModalModule,
5586
5590
  PhaserCardModule], exports: [AdvertiseModalComponent] });
5587
- ModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ModalModule, imports: [[
5591
+ ModalModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ModalModule, providers: [DecimalPipe], imports: [[
5588
5592
  CommonModule,
5589
5593
  TwoColumnModalModule,
5590
5594
  TwoColumnBodyTemplateModule,
@@ -5630,6 +5634,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
5630
5634
  ConfirmationModalModule,
5631
5635
  PhaserCardModule
5632
5636
  ],
5637
+ providers: [DecimalPipe],
5633
5638
  exports: [AdvertiseModalComponent]
5634
5639
  }]
5635
5640
  }] });