@symphony-talent/component-library 4.201.0 → 4.203.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.
Files changed (31) hide show
  1. package/esm2020/lib/atoms/icon/icon.enum.mjs +2 -1
  2. package/esm2020/lib/design-guide/icon-explorer/icon-explorer.helper.mjs +9 -3
  3. package/esm2020/lib/organisms/ai-search-assistant-drawer/ai-search-assistant-drawer.component.mjs +11 -12
  4. package/esm2020/lib/organisms/merge-contacts-modal/merge-contacts-modal.component.mjs +41 -3
  5. package/esm2020/lib/organisms/merge-contacts-modal/merge-contacts-modal.model.mjs +1 -1
  6. package/esm2020/projects/component-library/lib/atoms/icon/icon.enum.mjs +2 -1
  7. package/esm2020/projects/component-library/lib/design-guide/icon-explorer/icon-explorer.helper.mjs +9 -3
  8. package/esm2020/projects/component-library/lib/organisms/ai-search-assistant-drawer/ai-search-assistant-drawer.component.mjs +11 -12
  9. package/esm2020/projects/component-library/lib/organisms/merge-contacts-modal/merge-contacts-modal.component.mjs +41 -3
  10. package/esm2020/projects/component-library/lib/organisms/merge-contacts-modal/merge-contacts-modal.model.mjs +1 -1
  11. package/fesm2015/symphony-talent-component-library-projects-component-library.mjs +51 -8
  12. package/fesm2015/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
  13. package/fesm2015/symphony-talent-component-library.mjs +51 -8
  14. package/fesm2015/symphony-talent-component-library.mjs.map +1 -1
  15. package/fesm2020/symphony-talent-component-library-projects-component-library.mjs +53 -8
  16. package/fesm2020/symphony-talent-component-library-projects-component-library.mjs.map +1 -1
  17. package/fesm2020/symphony-talent-component-library.mjs +53 -8
  18. package/fesm2020/symphony-talent-component-library.mjs.map +1 -1
  19. package/lib/atoms/icon/icon.enum.d.ts +2 -1
  20. package/lib/organisms/merge-contacts-modal/merge-contacts-modal.component.d.ts +9 -2
  21. package/lib/organisms/merge-contacts-modal/merge-contacts-modal.model.d.ts +6 -0
  22. package/package.json +1 -1
  23. package/projects/component-library/global-assets/iconography/library-fonts/library-icons.eot +0 -0
  24. package/projects/component-library/global-assets/iconography/library-fonts/library-icons.svg +2 -1
  25. package/projects/component-library/global-assets/iconography/library-fonts/library-icons.ttf +0 -0
  26. package/projects/component-library/global-assets/iconography/library-fonts/library-icons.woff +0 -0
  27. package/projects/component-library/global-assets/iconography/library-icons.css +8 -5
  28. package/projects/component-library/global-assets/iconography/{sfx icons-v9.json → sfx icons-v10.json } +48 -17
  29. package/projects/component-library/lib/atoms/icon/icon.enum.d.ts +2 -1
  30. package/projects/component-library/lib/organisms/merge-contacts-modal/merge-contacts-modal.component.d.ts +9 -2
  31. package/projects/component-library/lib/organisms/merge-contacts-modal/merge-contacts-modal.model.d.ts +6 -0
@@ -1623,6 +1623,7 @@ var Icons;
1623
1623
  Icons["LICENSE"] = "si-license";
1624
1624
  Icons["REPORTS"] = "si-reports";
1625
1625
  Icons["SFXINSIGHTS"] = "si-sfx-insights-b";
1626
+ Icons["SPARKLES"] = "si-ai-withoutBorder";
1626
1627
  })(Icons || (Icons = {}));
1627
1628
 
1628
1629
  class IconWrapperComponent {
@@ -5193,6 +5194,7 @@ class MergeContactsModalComponent {
5193
5194
  constructor() {
5194
5195
  this.isLoading = false;
5195
5196
  this.hasError = false;
5197
+ this.stepCopy = {};
5196
5198
  this.next = new EventEmitter();
5197
5199
  this.cancel = new EventEmitter();
5198
5200
  this.notDuplicate = new EventEmitter();
@@ -5267,18 +5269,51 @@ class MergeContactsModalComponent {
5267
5269
  const [baseUrl] = url.split('#');
5268
5270
  return `${baseUrl}#/candidateprofileview?id=${id}`;
5269
5271
  }
5272
+ getStepTitle(step) {
5273
+ var _a;
5274
+ return (_a = this.getStepCopy(step)) === null || _a === void 0 ? void 0 : _a.title;
5275
+ }
5276
+ getStepDescription(step) {
5277
+ var _a;
5278
+ return (_a = this.getStepCopy(step)) === null || _a === void 0 ? void 0 : _a.description;
5279
+ }
5280
+ getStepCopy(step) {
5281
+ if (this.confirmSuggestion && step === 1) {
5282
+ return this.getConfirmSuggestionCopy();
5283
+ }
5284
+ return this.getConfiguredStepCopy(step);
5285
+ }
5286
+ getConfirmSuggestionCopy() {
5287
+ var _a, _b, _c;
5288
+ const confirmCopy = Object.assign(Object.assign({}, ((_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a.confirmStepCopy) !== null && _b !== void 0 ? _b : {})), ((_c = this.confirmStepCopy) !== null && _c !== void 0 ? _c : {}));
5289
+ if (confirmCopy.title || confirmCopy.description) {
5290
+ return confirmCopy;
5291
+ }
5292
+ return this.getConfiguredStepCopy(1);
5293
+ }
5294
+ getConfiguredStepCopy(step) {
5295
+ var _a, _b, _c;
5296
+ const modelCopy = (_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a.stepCopy) === null || _b === void 0 ? void 0 : _b[step];
5297
+ const inputCopy = (_c = this.stepCopy) === null || _c === void 0 ? void 0 : _c[step];
5298
+ if (modelCopy || inputCopy) {
5299
+ return Object.assign(Object.assign({}, modelCopy), inputCopy);
5300
+ }
5301
+ return undefined;
5302
+ }
5270
5303
  }
5271
5304
  MergeContactsModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MergeContactsModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
5272
- MergeContactsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: MergeContactsModalComponent, selector: "symphony-merge-contacts-modal", inputs: { model: "model", isLoading: "isLoading", hasError: "hasError", selected: "selected", confirmSuggestion: "confirmSuggestion", showSuccessToast: "showSuccessToast", showFailureToast: "showFailureToast", currentStep: "currentStep" }, outputs: { next: "next", cancel: "cancel", notDuplicate: "notDuplicate", selectionChange: "selectionChange", hideSuccessToast: "hideSuccessToast", hideFailureToast: "hideFailureToast", requestConfirmSuggestion: "requestConfirmSuggestion", requestCancelConfirmSuggestion: "requestCancelConfirmSuggestion" }, ngImport: i0, template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <symphony-h4 *ngIf=\"currentStep === 1\" text=\"Manage Duplicates\"></symphony-h4>\n <symphony-h4 *ngIf=\"currentStep === 2\" text=\"Merge Contacts\"></symphony-h4>\n </div>\n <div class=\"col-xs-4 col-sm-4 col-md-4 col-lg-4\">\n <symphony-icon\n class=\"pull-right\"\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCancel()\"\n ></symphony-icon>\n </div>\n <div class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-mt-15\">\n <symphony-paragraph\n *ngIf=\"currentStep === 1\"\n text=\"The contacts below are potential duplicates. Please compare their data and select the one you would like to merge.\"\n ></symphony-paragraph>\n <symphony-paragraph\n *ngIf=\"currentStep === 2\"\n text=\"Using the fields below, choose a Primary Contact, and then select the data you would like to merge and keep in that Primary Contact Record. Merging contacts is irreversible.\"\n ></symphony-paragraph> \n </div>\n </div>\n </div>\n </section>\n <section class=\"modal-body sfx-p-30\">\n <ng-container *ngIf=\"currentStep === 1\">\n <div class=\"toaster-alert-container-global\">\n <symphony-toaster-alert\n *ngIf=\"showSuccessToast\"\n [alertModel]=\"successToast\"\n (hideAlert)=\"onHideSuccessToast()\"\n ></symphony-toaster-alert>\n <symphony-toaster-alert\n *ngIf=\"showFailureToast\"\n [alertModel]=\"failureToast\"\n (hideAlert)=\"onHideFailureToast()\"\n ></symphony-toaster-alert>\n </div>\n <div *ngIf=\"isLoading\" class=\"sfx-mt-30 sfx-mb-30\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n <div *ngIf=\"hasError\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"Something has went wrong. Try again later or contact support\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && (!model?.suggestions || model.suggestions.length === 0)\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"No more duplicates exist for this selected contact. Please try again later\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && !confirmSuggestion && model?.suggestions?.length\" class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion.value }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 [text]=\"'Potential Duplicates (' + (model?.suggestions?.length || 0) + ')'\"></symphony-h5>\n <div class=\"scrollable-container card-wrapper\">\n <div\n *ngFor=\"let suggestion of model.suggestions; let i = index\"\n class=\"suggestion-card\"\n [ngClass]=\"{ selected: selected === suggestion }\"\n (click)=\"onSelect(suggestion)\"\n >\n <div class=\"card-header\">\n <symphony-input-radio\n [radioID]=\"suggestion.id\"\n [name]=\"'merge-suggestions'\"\n [isActive]=\"selected === suggestion\"\n (clicked)=\"onSelect(suggestion)\"\n ></symphony-input-radio> \n <div class=\"card-title sfx-font-bold\">\n {{ suggestion.name }} [{{ suggestion.id }}]\n </div>\n <div class=\"card-actions\" (click)=\"$event.stopPropagation()\">\n <symphony-grid-cell-clicked-open-new-tab\n [newTabUrl]=\"getContactUrl(suggestion.id)\"\n ></symphony-grid-cell-clicked-open-new-tab>\n <symphony-icon-wrapper\n class=\"not-duplicate-icon-global\"\n title=\"Mark not duplicate\"\n (clicked)=\"onNotDuplicate(suggestion)\"\n >\n <symphony-icon [icon]=\"'si-exclude'\"></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"suggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ suggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of suggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"suggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ suggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"suggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of suggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!isLoading && !hasError && confirmSuggestion\">\n <symphony-h5 text=\"Are you sure you want to remove this contact as a potential duplicate? \"></symphony-h5>\n <div class=\"sfx-mt-20 radio-action\">\n <symphony-icon class=\"pending-icon\" [icon]=\"'si-pending-incomplete'\"></symphony-icon>\n <symphony-paragraph class=\"sfx-font-italic\" text=\"Doing so is irreversible and this contact will never be shown as a potential duplicate of this contact again.\"></symphony-paragraph>\n </div>\n <div class=\"row sfx-mt-30\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Duplicate\"></symphony-h5>\n <div class=\"card-wrapper sfx-mt-20\">\n <div class=\"suggestion-card confirm-card\">\n <div class=\"card-header\">\n <div class=\"card-title sfx-font-bold\">\n {{ confirmSuggestion.name }} [{{ confirmSuggestion.id }}]\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ confirmSuggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of confirmSuggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ confirmSuggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"confirmSuggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of confirmSuggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"confirm-actions\">\n <symphony-button-v2\n text=\"Cancel\"\n [isSecondary]=\"true\"\n (clicked)=\"cancelNotDuplicate()\"\n ></symphony-button-v2>\n <symphony-button-v2\n text=\"Confirm\"\n (clicked)=\"confirmOnNotDuplicate()\"\n ></symphony-button-v2>\n </div>\n </div>\n </ng-container>\n <ng-content *ngIf=\"currentStep === 2\"></ng-content>\n </section>\n <section *ngIf=\"currentStep === 1\" class=\"modal-footer\">\n <symphony-button-v2 text=\"Close\" [isSecondary]=\"true\" (clicked)=\"onCancel()\"></symphony-button-v2>\n <symphony-button-v2 text=\"Next\" [disabled]=\"!selected || !!confirmSuggestion\" (clicked)=\"onNext()\"></symphony-button-v2>\n </section>\n</div>\n", styles: [".scrollable-container{max-height:500px;display:flex;flex-direction:column;overflow-y:auto;padding:20px 10px;gap:10px}.radio-item{display:flex;align-items:flex-start;gap:5px}.radio-label{display:flex;align-items:center;gap:1px}.radio-details{padding-left:24px}.radio-action{margin-left:auto;display:flex}.icon-upwards{margin-top:-1px!important;margin-bottom:auto}.modal-footer{display:flex;gap:10px;width:100%;justify-content:flex-end}.confirm-actions{display:flex;gap:10px;margin-top:20px}.suggestion-confirm{margin-top:38px}.pending-icon{margin-right:8px}.suggestion-card{border:1px solid #e4e7ef;border-radius:10px;padding:20px;background:#ffffff}.suggestion-card .card-header{display:flex;align-items:flex-start}.suggestion-card .card-title{flex:1;word-break:break-word}.suggestion-card .card-actions{margin-left:auto;display:flex;gap:10px}.suggestion-card .card-body{margin-top:15px;display:flex;flex-direction:column;gap:8px}.suggestion-card .info-row{display:flex;align-items:baseline;gap:8px;word-break:break-word}.suggestion-card .match-criteria{margin-top:10px}.suggestion-card .match-label{font-size:12px;font-weight:500;margin-bottom:8px}.suggestion-card .criteria-list{display:flex;flex-wrap:wrap;gap:8px}\n"], components: [{ type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: ToasterAlertComponent, selector: "symphony-toaster-alert", inputs: ["alertModel", "showAlert"], outputs: ["hideAlert", "refreshClicked"] }, { type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }, { type: H5Component, selector: "symphony-h5", inputs: ["text", "isSecondary"] }, { type: InputRadioComponent, selector: "symphony-input-radio", inputs: ["isActive", "name", "label", "isRequired", "radioID"], outputs: ["clicked"] }, { type: GridCellClickedOpenNewTabComponent, selector: "symphony-grid-cell-clicked-open-new-tab", inputs: ["newTabUrl"] }, { type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: StatusPillComponent, selector: "symphony-status-pill", inputs: ["statusPillModel"] }, { 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"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
5305
+ MergeContactsModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: MergeContactsModalComponent, selector: "symphony-merge-contacts-modal", inputs: { model: "model", isLoading: "isLoading", hasError: "hasError", stepCopy: "stepCopy", confirmStepCopy: "confirmStepCopy", selected: "selected", confirmSuggestion: "confirmSuggestion", showSuccessToast: "showSuccessToast", showFailureToast: "showFailureToast", currentStep: "currentStep" }, outputs: { next: "next", cancel: "cancel", notDuplicate: "notDuplicate", selectionChange: "selectionChange", hideSuccessToast: "hideSuccessToast", hideFailureToast: "hideFailureToast", requestConfirmSuggestion: "requestConfirmSuggestion", requestCancelConfirmSuggestion: "requestCancelConfirmSuggestion" }, ngImport: i0, template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <ng-container *ngIf=\"getStepTitle(currentStep) as stepTitle\">\n <symphony-h4 [text]=\"stepTitle\"></symphony-h4>\n </ng-container> \n </div>\n <div class=\"col-xs-4 col-sm-4 col-md-4 col-lg-4\">\n <symphony-icon\n class=\"pull-right\"\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCancel()\"\n ></symphony-icon>\n </div>\n <div\n class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-mt-15\"\n *ngIf=\"getStepDescription(currentStep)\"\n >\n <ng-container *ngIf=\"getStepDescription(currentStep) as stepDescription\">\n <symphony-paragraph [text]=\"stepDescription\"></symphony-paragraph>\n </ng-container> \n </div>\n </div>\n </div>\n </section>\n <section class=\"modal-body sfx-p-30\" *ngIf=\"currentStep === 1\">\n <ng-container>\n <div class=\"toaster-alert-container-global\">\n <symphony-toaster-alert\n *ngIf=\"showSuccessToast\"\n [alertModel]=\"successToast\"\n (hideAlert)=\"onHideSuccessToast()\"\n ></symphony-toaster-alert>\n <symphony-toaster-alert\n *ngIf=\"showFailureToast\"\n [alertModel]=\"failureToast\"\n (hideAlert)=\"onHideFailureToast()\"\n ></symphony-toaster-alert>\n </div>\n <div *ngIf=\"isLoading\" class=\"sfx-mt-30 sfx-mb-30\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n <div *ngIf=\"hasError\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"We couldn't retrieve the candidate data. The information cannot be displayed at this time, please try again.\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && (!model?.suggestions || model.suggestions.length === 0)\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"No more duplicates exist for this selected contact. Please try again later\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && !confirmSuggestion && model?.suggestions?.length\" class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion.value }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 [text]=\"'Potential Duplicates (' + (model?.suggestions?.length || 0) + ')'\"></symphony-h5>\n <div class=\"scrollable-container card-wrapper\">\n <div\n *ngFor=\"let suggestion of model.suggestions; let i = index\"\n class=\"suggestion-card\"\n [ngClass]=\"{ selected: selected === suggestion }\"\n (click)=\"onSelect(suggestion)\"\n >\n <div class=\"card-header\">\n <symphony-input-radio\n [radioID]=\"suggestion.id\"\n [name]=\"'merge-suggestions'\"\n [isActive]=\"selected === suggestion\"\n (clicked)=\"onSelect(suggestion)\"\n ></symphony-input-radio> \n <div class=\"card-title sfx-font-bold\">\n {{ suggestion.name }} [{{ suggestion.id }}]\n </div>\n <div class=\"card-actions\" (click)=\"$event.stopPropagation()\">\n <symphony-grid-cell-clicked-open-new-tab\n [newTabUrl]=\"getContactUrl(suggestion.id)\"\n ></symphony-grid-cell-clicked-open-new-tab>\n <symphony-icon-wrapper\n class=\"not-duplicate-icon-global\"\n title=\"Mark not duplicate\"\n (clicked)=\"onNotDuplicate(suggestion)\"\n >\n <symphony-icon [icon]=\"'si-exclude'\"></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"suggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ suggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of suggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"suggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ suggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"suggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of suggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!isLoading && !hasError && confirmSuggestion\">\n <div class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Duplicate\"></symphony-h5>\n <div class=\"card-wrapper sfx-mt-20\">\n <div class=\"suggestion-card confirm-card\">\n <div class=\"card-header\">\n <div class=\"card-title sfx-font-bold\">\n {{ confirmSuggestion.name }} [{{ confirmSuggestion.id }}]\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ confirmSuggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of confirmSuggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ confirmSuggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"confirmSuggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of confirmSuggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </section>\n <section *ngIf=\"currentStep === 2\" class=\"modal-body merge-contacts-body\">\n <ng-content></ng-content>\n </section>\n <section *ngIf=\"currentStep === 1\" class=\"modal-footer\">\n <ng-container *ngIf=\"!confirmSuggestion; else confirmActions\">\n <symphony-button-v2 text=\"Close\" [isSecondary]=\"true\" (clicked)=\"onCancel()\"></symphony-button-v2>\n <symphony-button-v2 text=\"Next\" [disabled]=\"!selected || !!confirmSuggestion\" (clicked)=\"onNext()\"></symphony-button-v2>\n </ng-container>\n <ng-template #confirmActions>\n <div class=\"confirm-actions\">\n <symphony-button-v2\n text=\"Back\"\n [isSecondary]=\"true\"\n (clicked)=\"cancelNotDuplicate()\"\n ></symphony-button-v2>\n <symphony-button-v2\n text=\"Confirm\"\n (clicked)=\"confirmOnNotDuplicate()\"\n ></symphony-button-v2>\n </div>\n </ng-template>\n </section>\n</div>\n", styles: [".scrollable-container{max-height:500px;display:flex;flex-direction:column;overflow-y:auto;padding:20px 10px;gap:10px}.radio-item{display:flex;align-items:flex-start;gap:5px}.radio-label{display:flex;align-items:center;gap:1px}.radio-details{padding-left:24px}.radio-action{margin-left:auto;display:flex}.icon-upwards{margin-top:-1px!important;margin-bottom:auto}.modal-footer{display:flex;gap:10px;width:100%;justify-content:flex-end}.confirm-actions{display:flex;gap:10px}.suggestion-confirm{margin-top:38px}.pending-icon{margin-right:8px}.suggestion-card{border:1px solid #e4e7ef;border-radius:10px;padding:20px;background:#ffffff}.suggestion-card .card-header{display:flex;align-items:flex-start}.suggestion-card .card-title{flex:1;word-break:break-word}.suggestion-card .card-actions{margin-left:auto;display:flex;gap:10px}.suggestion-card .card-body{margin-top:15px;display:flex;flex-direction:column;gap:8px}.suggestion-card .info-row{display:flex;align-items:baseline;gap:8px;word-break:break-word}.suggestion-card .match-criteria{margin-top:10px}.suggestion-card .match-label{font-size:12px;font-weight:500;margin-bottom:8px}.suggestion-card .criteria-list{display:flex;flex-wrap:wrap;gap:8px}.sfx-modal.modal-container .modal-body.merge-contacts-body{padding:0}\n"], components: [{ type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: ToasterAlertComponent, selector: "symphony-toaster-alert", inputs: ["alertModel", "showAlert"], outputs: ["hideAlert", "refreshClicked"] }, { type: SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }, { type: H5Component, selector: "symphony-h5", inputs: ["text", "isSecondary"] }, { type: InputRadioComponent, selector: "symphony-input-radio", inputs: ["isActive", "name", "label", "isRequired", "radioID"], outputs: ["clicked"] }, { type: GridCellClickedOpenNewTabComponent, selector: "symphony-grid-cell-clicked-open-new-tab", inputs: ["newTabUrl"] }, { type: IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: StatusPillComponent, selector: "symphony-status-pill", inputs: ["statusPillModel"] }, { 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"] }, { type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
5273
5306
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: MergeContactsModalComponent, decorators: [{
5274
5307
  type: Component,
5275
- args: [{ selector: 'symphony-merge-contacts-modal', template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <symphony-h4 *ngIf=\"currentStep === 1\" text=\"Manage Duplicates\"></symphony-h4>\n <symphony-h4 *ngIf=\"currentStep === 2\" text=\"Merge Contacts\"></symphony-h4>\n </div>\n <div class=\"col-xs-4 col-sm-4 col-md-4 col-lg-4\">\n <symphony-icon\n class=\"pull-right\"\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCancel()\"\n ></symphony-icon>\n </div>\n <div class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-mt-15\">\n <symphony-paragraph\n *ngIf=\"currentStep === 1\"\n text=\"The contacts below are potential duplicates. Please compare their data and select the one you would like to merge.\"\n ></symphony-paragraph>\n <symphony-paragraph\n *ngIf=\"currentStep === 2\"\n text=\"Using the fields below, choose a Primary Contact, and then select the data you would like to merge and keep in that Primary Contact Record. Merging contacts is irreversible.\"\n ></symphony-paragraph> \n </div>\n </div>\n </div>\n </section>\n <section class=\"modal-body sfx-p-30\">\n <ng-container *ngIf=\"currentStep === 1\">\n <div class=\"toaster-alert-container-global\">\n <symphony-toaster-alert\n *ngIf=\"showSuccessToast\"\n [alertModel]=\"successToast\"\n (hideAlert)=\"onHideSuccessToast()\"\n ></symphony-toaster-alert>\n <symphony-toaster-alert\n *ngIf=\"showFailureToast\"\n [alertModel]=\"failureToast\"\n (hideAlert)=\"onHideFailureToast()\"\n ></symphony-toaster-alert>\n </div>\n <div *ngIf=\"isLoading\" class=\"sfx-mt-30 sfx-mb-30\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n <div *ngIf=\"hasError\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"Something has went wrong. Try again later or contact support\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && (!model?.suggestions || model.suggestions.length === 0)\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"No more duplicates exist for this selected contact. Please try again later\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && !confirmSuggestion && model?.suggestions?.length\" class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion.value }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 [text]=\"'Potential Duplicates (' + (model?.suggestions?.length || 0) + ')'\"></symphony-h5>\n <div class=\"scrollable-container card-wrapper\">\n <div\n *ngFor=\"let suggestion of model.suggestions; let i = index\"\n class=\"suggestion-card\"\n [ngClass]=\"{ selected: selected === suggestion }\"\n (click)=\"onSelect(suggestion)\"\n >\n <div class=\"card-header\">\n <symphony-input-radio\n [radioID]=\"suggestion.id\"\n [name]=\"'merge-suggestions'\"\n [isActive]=\"selected === suggestion\"\n (clicked)=\"onSelect(suggestion)\"\n ></symphony-input-radio> \n <div class=\"card-title sfx-font-bold\">\n {{ suggestion.name }} [{{ suggestion.id }}]\n </div>\n <div class=\"card-actions\" (click)=\"$event.stopPropagation()\">\n <symphony-grid-cell-clicked-open-new-tab\n [newTabUrl]=\"getContactUrl(suggestion.id)\"\n ></symphony-grid-cell-clicked-open-new-tab>\n <symphony-icon-wrapper\n class=\"not-duplicate-icon-global\"\n title=\"Mark not duplicate\"\n (clicked)=\"onNotDuplicate(suggestion)\"\n >\n <symphony-icon [icon]=\"'si-exclude'\"></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"suggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ suggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of suggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"suggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ suggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"suggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of suggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!isLoading && !hasError && confirmSuggestion\">\n <symphony-h5 text=\"Are you sure you want to remove this contact as a potential duplicate? \"></symphony-h5>\n <div class=\"sfx-mt-20 radio-action\">\n <symphony-icon class=\"pending-icon\" [icon]=\"'si-pending-incomplete'\"></symphony-icon>\n <symphony-paragraph class=\"sfx-font-italic\" text=\"Doing so is irreversible and this contact will never be shown as a potential duplicate of this contact again.\"></symphony-paragraph>\n </div>\n <div class=\"row sfx-mt-30\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Duplicate\"></symphony-h5>\n <div class=\"card-wrapper sfx-mt-20\">\n <div class=\"suggestion-card confirm-card\">\n <div class=\"card-header\">\n <div class=\"card-title sfx-font-bold\">\n {{ confirmSuggestion.name }} [{{ confirmSuggestion.id }}]\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ confirmSuggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of confirmSuggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ confirmSuggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"confirmSuggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of confirmSuggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"confirm-actions\">\n <symphony-button-v2\n text=\"Cancel\"\n [isSecondary]=\"true\"\n (clicked)=\"cancelNotDuplicate()\"\n ></symphony-button-v2>\n <symphony-button-v2\n text=\"Confirm\"\n (clicked)=\"confirmOnNotDuplicate()\"\n ></symphony-button-v2>\n </div>\n </div>\n </ng-container>\n <ng-content *ngIf=\"currentStep === 2\"></ng-content>\n </section>\n <section *ngIf=\"currentStep === 1\" class=\"modal-footer\">\n <symphony-button-v2 text=\"Close\" [isSecondary]=\"true\" (clicked)=\"onCancel()\"></symphony-button-v2>\n <symphony-button-v2 text=\"Next\" [disabled]=\"!selected || !!confirmSuggestion\" (clicked)=\"onNext()\"></symphony-button-v2>\n </section>\n</div>\n", styles: [".scrollable-container{max-height:500px;display:flex;flex-direction:column;overflow-y:auto;padding:20px 10px;gap:10px}.radio-item{display:flex;align-items:flex-start;gap:5px}.radio-label{display:flex;align-items:center;gap:1px}.radio-details{padding-left:24px}.radio-action{margin-left:auto;display:flex}.icon-upwards{margin-top:-1px!important;margin-bottom:auto}.modal-footer{display:flex;gap:10px;width:100%;justify-content:flex-end}.confirm-actions{display:flex;gap:10px;margin-top:20px}.suggestion-confirm{margin-top:38px}.pending-icon{margin-right:8px}.suggestion-card{border:1px solid #e4e7ef;border-radius:10px;padding:20px;background:#ffffff}.suggestion-card .card-header{display:flex;align-items:flex-start}.suggestion-card .card-title{flex:1;word-break:break-word}.suggestion-card .card-actions{margin-left:auto;display:flex;gap:10px}.suggestion-card .card-body{margin-top:15px;display:flex;flex-direction:column;gap:8px}.suggestion-card .info-row{display:flex;align-items:baseline;gap:8px;word-break:break-word}.suggestion-card .match-criteria{margin-top:10px}.suggestion-card .match-label{font-size:12px;font-weight:500;margin-bottom:8px}.suggestion-card .criteria-list{display:flex;flex-wrap:wrap;gap:8px}\n"] }]
5308
+ args: [{ selector: 'symphony-merge-contacts-modal', template: "<div class=\"sfx sfx-modal modal-container\" *ngIf=\"model\">\n <section class=\"modal-header sfx-p-30 sfx-pt-40\">\n <div class=\"modal-title\">\n <div class=\"row\">\n <div class=\"col-xs-8 col-sm-8 col-md-8 col-lg-8\">\n <ng-container *ngIf=\"getStepTitle(currentStep) as stepTitle\">\n <symphony-h4 [text]=\"stepTitle\"></symphony-h4>\n </ng-container> \n </div>\n <div class=\"col-xs-4 col-sm-4 col-md-4 col-lg-4\">\n <symphony-icon\n class=\"pull-right\"\n [icon]=\"'si-close-modal'\"\n (clicked)=\"onCancel()\"\n ></symphony-icon>\n </div>\n <div\n class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-mt-15\"\n *ngIf=\"getStepDescription(currentStep)\"\n >\n <ng-container *ngIf=\"getStepDescription(currentStep) as stepDescription\">\n <symphony-paragraph [text]=\"stepDescription\"></symphony-paragraph>\n </ng-container> \n </div>\n </div>\n </div>\n </section>\n <section class=\"modal-body sfx-p-30\" *ngIf=\"currentStep === 1\">\n <ng-container>\n <div class=\"toaster-alert-container-global\">\n <symphony-toaster-alert\n *ngIf=\"showSuccessToast\"\n [alertModel]=\"successToast\"\n (hideAlert)=\"onHideSuccessToast()\"\n ></symphony-toaster-alert>\n <symphony-toaster-alert\n *ngIf=\"showFailureToast\"\n [alertModel]=\"failureToast\"\n (hideAlert)=\"onHideFailureToast()\"\n ></symphony-toaster-alert>\n </div>\n <div *ngIf=\"isLoading\" class=\"sfx-mt-30 sfx-mb-30\">\n <symphony-sfx-loader></symphony-sfx-loader>\n </div>\n <div *ngIf=\"hasError\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"We couldn't retrieve the candidate data. The information cannot be displayed at this time, please try again.\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && (!model?.suggestions || model.suggestions.length === 0)\" class=\"sfx-mt-30\">\n <symphony-paragraph text=\"No more duplicates exist for this selected contact. Please try again later\"></symphony-paragraph>\n </div>\n <div *ngIf=\"!isLoading && !hasError && !confirmSuggestion && model?.suggestions?.length\" class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion.value }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 [text]=\"'Potential Duplicates (' + (model?.suggestions?.length || 0) + ')'\"></symphony-h5>\n <div class=\"scrollable-container card-wrapper\">\n <div\n *ngFor=\"let suggestion of model.suggestions; let i = index\"\n class=\"suggestion-card\"\n [ngClass]=\"{ selected: selected === suggestion }\"\n (click)=\"onSelect(suggestion)\"\n >\n <div class=\"card-header\">\n <symphony-input-radio\n [radioID]=\"suggestion.id\"\n [name]=\"'merge-suggestions'\"\n [isActive]=\"selected === suggestion\"\n (clicked)=\"onSelect(suggestion)\"\n ></symphony-input-radio> \n <div class=\"card-title sfx-font-bold\">\n {{ suggestion.name }} [{{ suggestion.id }}]\n </div>\n <div class=\"card-actions\" (click)=\"$event.stopPropagation()\">\n <symphony-grid-cell-clicked-open-new-tab\n [newTabUrl]=\"getContactUrl(suggestion.id)\"\n ></symphony-grid-cell-clicked-open-new-tab>\n <symphony-icon-wrapper\n class=\"not-duplicate-icon-global\"\n title=\"Mark not duplicate\"\n (clicked)=\"onNotDuplicate(suggestion)\"\n >\n <symphony-icon [icon]=\"'si-exclude'\"></symphony-icon>\n </symphony-icon-wrapper>\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"suggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ suggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of suggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"suggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ suggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"suggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of suggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div *ngIf=\"!isLoading && !hasError && confirmSuggestion\">\n <div class=\"row\">\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Contact\"></symphony-h5>\n <p class=\"sfx-mt-20 sfx-font-bold\">{{ model.selectedContact.name }} [{{ model.selectedContact.id }}]</p>\n <p>{{ model.selectedContact.email }}</p>\n <p *ngFor=\"let criterion of model.selectedContact.criteria\">{{ criterion }}</p>\n </div>\n <div class=\"col-xs-12 col-sm-6 col-md-6 col-lg-6\">\n <symphony-h5 text=\"Selected Duplicate\"></symphony-h5>\n <div class=\"card-wrapper sfx-mt-20\">\n <div class=\"suggestion-card confirm-card\">\n <div class=\"card-header\">\n <div class=\"card-title sfx-font-bold\">\n {{ confirmSuggestion.name }} [{{ confirmSuggestion.id }}]\n </div>\n </div>\n <div class=\"card-body\">\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.email\">\n <symphony-icon [icon]=\"'si-email-send'\"></symphony-icon>\n <span>{{ confirmSuggestion.email }}</span>\n </div>\n <div class=\"info-row\" *ngFor=\"let criterion of confirmSuggestion.criteria\">\n <symphony-icon\n *ngIf=\"criterion.iconClass\"\n [icon]=\"criterion.iconClass\"\n ></symphony-icon>\n <span>{{ criterion.value }}</span>\n </div>\n <div class=\"info-row\" *ngIf=\"confirmSuggestion.atsId\">\n <span class=\"sfx-txt-gray sfx-font-bold sfx-font12\">ATS ID:</span>\n <span>{{ confirmSuggestion.atsId }}</span>\n </div>\n </div>\n <div class=\"match-criteria\" *ngIf=\"confirmSuggestion.statuses?.length\">\n <div class=\"match-label sfx-txt-gray\">Contacts share the same:</div>\n <div class=\"criteria-list\">\n <symphony-status-pill\n *ngFor=\"let status of confirmSuggestion.statuses\"\n [statusPillModel]=\"{ statusClass: 'statusGrey', value: status }\"\n ></symphony-status-pill>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </section>\n <section *ngIf=\"currentStep === 2\" class=\"modal-body merge-contacts-body\">\n <ng-content></ng-content>\n </section>\n <section *ngIf=\"currentStep === 1\" class=\"modal-footer\">\n <ng-container *ngIf=\"!confirmSuggestion; else confirmActions\">\n <symphony-button-v2 text=\"Close\" [isSecondary]=\"true\" (clicked)=\"onCancel()\"></symphony-button-v2>\n <symphony-button-v2 text=\"Next\" [disabled]=\"!selected || !!confirmSuggestion\" (clicked)=\"onNext()\"></symphony-button-v2>\n </ng-container>\n <ng-template #confirmActions>\n <div class=\"confirm-actions\">\n <symphony-button-v2\n text=\"Back\"\n [isSecondary]=\"true\"\n (clicked)=\"cancelNotDuplicate()\"\n ></symphony-button-v2>\n <symphony-button-v2\n text=\"Confirm\"\n (clicked)=\"confirmOnNotDuplicate()\"\n ></symphony-button-v2>\n </div>\n </ng-template>\n </section>\n</div>\n", styles: [".scrollable-container{max-height:500px;display:flex;flex-direction:column;overflow-y:auto;padding:20px 10px;gap:10px}.radio-item{display:flex;align-items:flex-start;gap:5px}.radio-label{display:flex;align-items:center;gap:1px}.radio-details{padding-left:24px}.radio-action{margin-left:auto;display:flex}.icon-upwards{margin-top:-1px!important;margin-bottom:auto}.modal-footer{display:flex;gap:10px;width:100%;justify-content:flex-end}.confirm-actions{display:flex;gap:10px}.suggestion-confirm{margin-top:38px}.pending-icon{margin-right:8px}.suggestion-card{border:1px solid #e4e7ef;border-radius:10px;padding:20px;background:#ffffff}.suggestion-card .card-header{display:flex;align-items:flex-start}.suggestion-card .card-title{flex:1;word-break:break-word}.suggestion-card .card-actions{margin-left:auto;display:flex;gap:10px}.suggestion-card .card-body{margin-top:15px;display:flex;flex-direction:column;gap:8px}.suggestion-card .info-row{display:flex;align-items:baseline;gap:8px;word-break:break-word}.suggestion-card .match-criteria{margin-top:10px}.suggestion-card .match-label{font-size:12px;font-weight:500;margin-bottom:8px}.suggestion-card .criteria-list{display:flex;flex-wrap:wrap;gap:8px}.sfx-modal.modal-container .modal-body.merge-contacts-body{padding:0}\n"] }]
5276
5309
  }], ctorParameters: function () { return []; }, propDecorators: { model: [{
5277
5310
  type: Input
5278
5311
  }], isLoading: [{
5279
5312
  type: Input
5280
5313
  }], hasError: [{
5281
5314
  type: Input
5315
+ }], stepCopy: [{
5316
+ type: Input
5282
5317
  }], next: [{
5283
5318
  type: Output
5284
5319
  }], cancel: [{
@@ -5293,6 +5328,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImpor
5293
5328
  type: Output
5294
5329
  }], requestConfirmSuggestion: [{
5295
5330
  type: Output
5331
+ }], confirmStepCopy: [{
5332
+ type: Input
5296
5333
  }], requestCancelConfirmSuggestion: [{
5297
5334
  type: Output
5298
5335
  }], selected: [{
@@ -7074,7 +7111,13 @@ class IconExplorerHelper {
7074
7111
  iconName: 'SFXINSIGHTS',
7075
7112
  iconClass: 'si-sfx-insights-b',
7076
7113
  hasBorder: false,
7077
- }
7114
+ },
7115
+ {
7116
+ icon: Icons.SPARKLES,
7117
+ iconName: 'SPARKLES',
7118
+ iconClass: 'si-ai-withoutBorder',
7119
+ hasBorder: false,
7120
+ },
7078
7121
  ];
7079
7122
  }
7080
7123
  static getInverseIconList() {
@@ -7154,7 +7197,7 @@ class IconExplorerHelper {
7154
7197
  iconName: 'SAVE',
7155
7198
  iconClass: 'si-save',
7156
7199
  hasBorder: true,
7157
- },
7200
+ }
7158
7201
  ];
7159
7202
  }
7160
7203
  }
@@ -7635,8 +7678,8 @@ class AISearchAssistantDrawerComponent {
7635
7678
  isSuggestionsOpen: true // Default to open
7636
7679
  };
7637
7680
  this.config = {
7638
- welcomeMessage: 'Hello, I\'m Tali. How can I help you today?',
7639
- placeholder: 'Message Tali',
7681
+ welcomeMessage: 'Hello, I\'m Tala. How can I help you today?',
7682
+ placeholder: 'Message Tala',
7640
7683
  maxMessages: 100,
7641
7684
  autoScroll: true,
7642
7685
  showTimestamps: true,
@@ -7782,10 +7825,10 @@ class AISearchAssistantDrawerComponent {
7782
7825
  }
7783
7826
  }
7784
7827
  AISearchAssistantDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AISearchAssistantDrawerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
7785
- AISearchAssistantDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AISearchAssistantDrawerComponent, selector: "symphony-ai-search-assistant-drawer", inputs: { model: "model", config: "config", contextId: "contextId" }, outputs: { drawerClosed: "drawerClosed", promptSelected: "promptSelected", messageSent: "messageSent", inputChanged: "inputChanged", retryClicked: "retryClicked", taskCancelled: "taskCancelled", suggestionsToggled: "suggestionsToggled" }, viewQueries: [{ propertyName: "chatContainer", first: true, predicate: ["chatContainer"], descendants: true }, { propertyName: "messageInput", first: true, predicate: ["messageInput"], descendants: true }], ngImport: i0, template: "<!-- Drawer Container -->\n<div \n class=\"ai-drawer-container\" \n [class.open]=\"model.isOpen\"\n [id]=\"getPendoId('aiAssistantDrawer')\">\n \n <!-- Edge Toggle Button (inside drawer container) -->\n <button \n class=\"ai-drawer-edge-toggle\"\n [class.drawer-open]=\"model.isOpen\"\n (click)=\"onToggleDrawer()\"\n [attr.aria-label]=\"model.isOpen ? 'Close Tali Assistant' : 'Open Tali Assistant'\"\n [title]=\"model.isOpen ? 'Close Tali Assistant' : 'Tali Assisted Messaging'\"\n [id]=\"getPendoId('aiAssistantToggle')\">\n <symphony-icon [icon]=\"model.isOpen ? 'si-arrow-next' : 'si-arrow-prev'\"></symphony-icon>\n </button>\n \n <!-- Header -->\n <div class=\"ai-drawer-header\" *ngIf=\"model.isOpen\">\n <symphony-h4 class=\"ai-drawer-title sfx-m-0\">Tali, your Talent Acquisition Assistant</symphony-h4>\n </div>\n\n <!-- Chat Container -->\n <div class=\"ai-drawer-body\" *ngIf=\"model.isOpen\">\n \n <!-- Messages Area -->\n <div \n class=\"ai-chat-container\" \n #chatContainer>\n \n <!-- Message List -->\n <div class=\"ai-message-list sfx-mb-20\">\n <div \n *ngFor=\"let message of model.messages; trackBy: trackByMessageId\"\n class=\"ai-message-wrapper\"\n [attr.data-message-type]=\"message.type\">\n \n <!-- Timestamp Above Message -->\n <div \n class=\"ai-message-timestamp-container\"\n *ngIf=\"config.showTimestamps\">\n <span class=\"ai-message-timestamp\">\n {{ getMessageTime(message.timestamp) }}\n </span>\n </div>\n \n <!-- Message Bubble -->\n <div \n class=\"ai-message-bubble\"\n [class.user-message]=\"message.type === 'user'\"\n [class.ai-message]=\"message.type === 'ai'\"\n [class.system-message]=\"message.type === 'system'\">\n \n <!-- AI Message Icon -->\n <div \n class=\"ai-message-icon\" \n *ngIf=\"message.type === 'ai'\">\n <symphony-icon [icon]=\"'si-chatbot'\"></symphony-icon>\n </div>\n \n <div class=\"ai-message-content-wrapper\">\n <symphony-paragraph \n class=\"ai-message-content sfx-m-0\"\n [innerHTML]=\"message.content | newLineToBr\">\n </symphony-paragraph>\n </div>\n </div>\n \n <!-- Message Status (for user messages) -->\n <div \n class=\"ai-message-status\"\n *ngIf=\"message.type === 'user' && message.status\">\n <span \n class=\"ai-status-text\"\n [class.status-delivered]=\"message.status === 'delivered'\"\n [class.status-pending]=\"message.status === 'pending'\"\n [class.status-error]=\"message.status === 'error'\">\n {{ getStatusText(message.status) }}\n </span>\n </div>\n </div>\n\n <!-- AI Task Status (Progress Bar and Error Handling) -->\n\n <div \n *ngIf=\"model.aiTaskStatus\"\n class=\"ai-message-wrapper task-status-wrapper\"\n id=\"taskStatusMessage\">\n <symphony-task-status\n [taskStatusModel]=\"model.aiTaskStatus\"\n (cancelTask)=\"onCancelTask()\"\n (retryTask)=\"onRetryTask()\"\n [id]=\"getPendoId('aiTaskStatus')\">\n </symphony-task-status>\n </div>\n </div>\n </div>\n\n <!-- Suggested Prompts Section -->\n <div \n class=\"ai-suggested-prompts-section\"\n *ngIf=\"config.enableSuggestedPrompts && model.suggestedPrompts.length > 0\">\n <div class=\"ai-prompts-intro-row\">\n <symphony-paragraph class=\"ai-prompts-intro sfx-mb-15\">\n {{ model.isSuggestionsOpen ? 'Here are a few suggested prompts to get you started.' : 'Need help getting started?' }}\n </symphony-paragraph>\n <button\n class=\"ai-suggestions-toggle-compact\"\n [class.suggestions-open]=\"model.isSuggestionsOpen\"\n (click)=\"onToggleSuggestions()\"\n [attr.aria-label]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [title]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [id]=\"getPendoId('aiSuggestionsToggle')\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <symphony-icon [icon]=\"'si-arrow-hide-reveal'\"></symphony-icon>\n </button>\n </div>\n <div \n class=\"ai-suggested-prompts\" \n *ngIf=\"model.isSuggestionsOpen\"\n [class.open]=\"model.isSuggestionsOpen\"\n [id]=\"getPendoId('aiSuggestedPrompts')\"\n [class.disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <div class=\"ai-prompts-list\">\n <button\n *ngFor=\"let prompt of model.suggestedPrompts; let i = index\"\n class=\"ai-prompt-button\"\n (click)=\"onPromptClick(prompt)\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [id]=\"getPendoId('aiPromptButton-' + i)\">\n <symphony-icon \n *ngIf=\"prompt.icon\" \n [icon]=\"'si-' + prompt.icon\"\n class=\"ai-prompt-icon\">\n </symphony-icon>\n <span class=\"ai-prompt-text\">{{ prompt.text }}</span>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Footer / Input Area -->\n <div class=\"ai-drawer-footer\" *ngIf=\"model.isOpen\">\n \n <!-- Input Row -->\n <div class=\"ai-input-row\">\n <symphony-input-textarea-with-send\n #messageInput\n [(ngModel)]=\"model.inputValue\"\n [placeholder]=\"config.placeholder\"\n [isDisabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [maxCharacterLimit]=\"model.maxCharacterLimit\"\n [showCharacterCount]=\"!!model.maxCharacterLimit\"\n (sendClicked)=\"onSendMessage()\"\n (valueChanged)=\"onInputChange($event)\"\n (enterPressed)=\"onSendMessage()\"\n [id]=\"getPendoId('aiMessageInput')\">\n </symphony-input-textarea-with-send>\n </div>\n </div>\n</div> ", styles: [".sfx-p-0{padding:0}.sfx-p-5{padding:.3rem}.sfx-p-10{padding:.625rem}.sfx-p-15{padding:.9375rem}.sfx-p-20{padding:1.25rem}.sfx-p-30{padding:1.875rem}.sfx-pt-0{padding-top:0}.sfx-pt-5{padding-top:.3rem}.sfx-pt-10{padding-top:.625rem}.sfx-pt-15{padding-top:.9375rem}.sfx-pt-20{padding-top:1.25rem}.sfx-pt-25{padding-top:1.5625rem}.sfx-pt-30{padding-top:1.875rem}.sfx-pt-35{padding-top:2.1875rem}.sfx-pt-40{padding-top:2.5rem}.sfx-pt-50{padding-top:3.125rem}.sfx-pb-0{padding-bottom:0}.sfx-pb-5{padding-bottom:.3rem}.sfx-pb-10{padding-bottom:.625rem}.sfx-pb-15{padding-bottom:.9375rem}.sfx-pb-20{padding-bottom:1.25rem}.sfx-pb-25{padding-bottom:1.5625rem}.sfx-pb-30{padding-bottom:1.875rem}.sfx-pb-35{padding-bottom:2.1875rem}.sfx-pb-40{padding-bottom:2.5rem}.sfx-pb-50{padding-bottom:3.125rem}.sfx-pl-0{padding-left:0}.sfx-pl-5{padding-left:.3rem}.sfx-pl-10{padding-left:.625rem}.sfx-pl-15{padding-left:.9375rem}.sfx-pl-20{padding-left:1.25rem}.sfx-pl-25{padding-left:1.5625rem}.sfx-pl-30{padding-left:1.875rem}.sfx-pr-0{padding-right:0}.sfx-pr-5{padding-right:.3rem}.sfx-pr-10{padding-right:.625rem}.sfx-pr-15{padding-right:.9375rem}.sfx-pr-20{padding-right:1.25rem}.sfx-pr-25{padding-right:1.5625rem}.sfx-pr-30{padding-right:1.875rem}.sfx-py-15{padding-left:.9375rem;padding-right:.9375rem}.sfx-py-30{padding-left:1.875rem;padding-right:1.875rem}.sfx-px-0{padding-top:0;padding-bottom:0}.sfx-px-15{padding-top:.9375rem;padding-bottom:.9375rem}.sfx-px-20{padding-top:1.25rem;padding-bottom:1.25rem}.sfx-px-30{padding-top:1.875rem;padding-bottom:1.875rem}.sfx-m-0{margin:0}.sfx-m-5{margin:.3rem}.sfx-m-10{margin:.625rem}.sfx-m-15{margin:.9375rem}.sfx-m-20{margin:1.25rem}.sfx-m-auto{margin:0 auto}.sfx-mt-0{margin-top:0}.sfx-mt-5{margin-top:.3rem}.sfx-mt-10{margin-top:.625rem}.sfx-mt-15{margin-top:.9375rem}.sfx-mt-20{margin-top:1.25rem}.sfx-mt-25{margin-top:1.5625rem}.sfx-mt-30{margin-top:1.875rem}.sfx-mt-40{margin-top:2.5rem}.sfx-mt-80{margin-top:5rem}.sfx-mb-0{margin-bottom:0}.sfx-mb-5{margin-bottom:.3rem}.sfx-mb-10{margin-bottom:.625rem}.sfx-mb-15{margin-bottom:.9375rem}.sfx-mb-20{margin-bottom:1.25rem}.sfx-mb-25{margin-bottom:1.5625rem}.sfx-mb-30{margin-bottom:1.875rem}.sfx-mb-40{margin-bottom:2.5rem}.sfx-mb-50{margin-bottom:3.125rem}.sfx-ml-0{margin-left:0}.sfx-ml-5{margin-left:.3rem}.sfx-ml-10{margin-left:.625rem}.sfx-ml-15{margin-left:.9375rem}.sfx-ml-20{margin-left:1.25rem}.sfx-ml-auto{margin-left:auto}.sfx-mr-0{margin-right:0}.sfx-mr-5{margin-right:.3rem}.sfx-mr-10{margin-right:.625rem}.sfx-mr-15{margin-right:.9375rem}.sfx-mr-20{margin-right:1.25rem}.sfx-mr-25{margin-right:1.5625rem}.sfx-mr-30{margin-right:1.875rem}.sfx-mr-40{margin-right:2.5rem}.ai-drawer-container{position:absolute;top:0;right:0;width:100%;max-width:500px;height:100%;background-color:#fff;box-shadow:-4px 0 24px rgba(0,0,0,.15);z-index:9999;display:flex;flex-direction:column;transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.ai-drawer-container.open{transform:translate(0)}@media (max-width: 768px){.ai-drawer-container{width:100%;box-shadow:none}}.ai-drawer-edge-toggle{position:absolute;top:50%;left:-48px;transform:translateY(-50%);width:48px;height:48px;border:1px solid #D2D8E5;border-radius:8px 0 0 8px;background-color:#2b8ff3;color:#fff;cursor:pointer;box-shadow:-2px 0 8px rgba(0,0,0,.15);z-index:10001;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.ai-drawer-edge-toggle:hover{background-color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.2);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle:focus{outline:2px solid #2B8FF3;outline-offset:2px}.ai-drawer-edge-toggle symphony-icon{font-size:20px;transition:transform .2s ease;display:block;line-height:1;color:#fff}.ai-drawer-edge-toggle.drawer-open{left:-35px;background-color:#fff;color:#2b8ff3;border-color:#d2d8e5;border-radius:8px 0 0 8px;box-shadow:-2px 0 8px rgba(0,0,0,.1)}.ai-drawer-edge-toggle.drawer-open:hover{background-color:#f1f2f5;color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.15);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:18px;color:#2b8ff3}@media (max-width: 768px){.ai-drawer-edge-toggle{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle symphony-icon{font-size:18px}.ai-drawer-edge-toggle.drawer-open{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:16px}}.ai-drawer-header{display:flex;align-items:center;justify-content:center;padding:1.25rem 1.5625rem;border-bottom:1px solid #D2D8E5;background-color:#fff;position:relative;z-index:1}.ai-drawer-header .ai-drawer-title{font-size:1.125rem;font-weight:600;color:#08203e}.ai-drawer-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;z-index:1}.ai-chat-container{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding:.9375rem 1.5625rem}.ai-chat-container::-webkit-scrollbar{width:6px}.ai-chat-container::-webkit-scrollbar-track{background:#F1F2F5}.ai-chat-container::-webkit-scrollbar-thumb{background:#C3CBDC;border-radius:3px}.ai-chat-container::-webkit-scrollbar-thumb:hover{background:#5B6D80}.ai-message-list{display:flex;flex-direction:column;gap:.9375rem}.ai-message-wrapper{display:flex;flex-direction:column}.ai-message-wrapper[data-message-type=user]{align-items:flex-end}.ai-message-wrapper[data-message-type=ai],.ai-message-wrapper[data-message-type=system],.ai-message-wrapper.ai-loading-message{align-items:flex-start}.ai-message-timestamp-container{margin-bottom:.625rem;text-align:center;width:100%;align-self:center}.ai-message-timestamp-container .ai-message-timestamp{font-size:.75rem;color:#82919f;font-weight:500}.ai-message-bubble{max-width:80%;border-radius:12px;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;animation:messageSlideIn .3s ease-out;display:flex;gap:.625rem}.ai-message-bubble.user-message{background-color:#2b8ff3;color:#fff;border-bottom-right-radius:4px;padding:.625rem .9375rem;justify-content:flex-end}.ai-message-bubble.user-message .ai-message-content-wrapper{display:flex;flex-direction:column;align-items:flex-end}.ai-message-bubble.ai-message{background-color:#fff;border:1px solid #D2D8E5;color:#08203e;border-bottom-left-radius:4px;padding:.625rem .9375rem;align-items:flex-start}.ai-message-bubble.ai-message .ai-message-icon{flex:0 0 auto;width:24px;height:24px;background-color:#f0f8ff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}.ai-message-bubble.ai-message .ai-message-icon symphony-icon{color:#2b8ff3;font-size:.875rem}.ai-message-bubble.ai-message .ai-message-content-wrapper{flex:1;display:flex;flex-direction:column}.ai-message-bubble.system-message{background-color:#f1f2f5;border:1px solid #E4E7EF;color:#5b6d80;border-radius:8px;text-align:center;max-width:90%;padding:.625rem .9375rem;justify-content:center}.ai-message-bubble.system-message .ai-message-content{font-size:.875rem}@media (max-width: 768px){.ai-message-bubble{max-width:90%}}.ai-message-status{margin-top:.3rem;text-align:right}.ai-message-status .ai-status-text{display:inline-flex;gap:4px;font-size:.75rem;font-weight:500}.ai-message-status .ai-status-text.status-delivered{color:#5b6d80}.ai-message-status .ai-status-text.status-delivered .ai-status-icon{color:#2cb45f;font-size:12px}.ai-message-status .ai-status-text.status-pending{color:#5b6d80}.ai-message-status .ai-status-text.status-pending .ai-status-loader{width:12px;height:12px}.ai-message-status .ai-status-text.status-error{color:#ac4463}.ai-message-status .ai-status-text.status-error .ai-status-icon{color:#ac4463;font-size:12px}.ai-loading-message .ai-message-bubble .ai-message-icon{flex:0 0 auto;width:24px;height:24px;background-color:#f0f8ff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}.ai-loading-message .ai-message-bubble .ai-message-icon symphony-icon{color:#2b8ff3;font-size:.875rem}.ai-loading-message .ai-message-bubble .ai-loading-content{display:flex;align-items:center;gap:.625rem;flex:1}.ai-loading-message .ai-message-bubble .ai-loading-text{font-style:italic;color:#5b6d80;font-size:.875rem}.ai-suggested-prompts-section{border-top:1px solid #E4E7EF;background-color:#f1f2f5;margin-bottom:0;position:relative;min-height:48px}.ai-prompts-intro-row{position:relative;padding:12px 14px 0;display:flex;align-items:center}.ai-prompts-intro-row .ai-prompts-intro{margin:0 auto;padding:0;font-size:.875rem;color:#5b6d80;line-height:1.4;text-align:center;position:relative;max-width:calc(100% - 60px);display:block}.ai-prompts-intro-row .ai-suggestions-toggle-compact{right:8px;width:28px;height:28px;border-radius:50%;border:none;background:#fff;color:#712ace;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s;box-shadow:0 1px 4px rgba(80,0,120,.04);font-size:15px;padding:0;margin:0}.ai-prompts-intro-row .ai-suggestions-toggle-compact:hover:not(:disabled){background:#f3f0ff;color:#5a21a4}.ai-prompts-intro-row .ai-suggestions-toggle-compact:focus{outline:2px solid #814DFF;outline-offset:2px}.ai-prompts-intro-row .ai-suggestions-toggle-compact:disabled{opacity:.5;cursor:not-allowed}.ai-prompts-intro-row .ai-suggestions-toggle-compact symphony-icon{font-size:15px;transition:transform .2s;transform:rotate(0)}.ai-prompts-intro-row .ai-suggestions-toggle-compact.suggestions-open symphony-icon{transform:rotate(180deg)}.ai-suggested-prompts{position:static;max-height:0;overflow:hidden;transition:max-height .3s cubic-bezier(.4,0,.2,1);opacity:0;padding:1.25rem 1.5625rem;background-color:#f1f2f5}.ai-suggested-prompts.open{max-height:500px;opacity:1}.ai-suggested-prompts.disabled{opacity:.7;pointer-events:none}.ai-suggested-prompts .ai-prompt-button:disabled{cursor:not-allowed;opacity:.7}.ai-suggested-prompts .ai-prompts-intro{font-size:.875rem;color:#5b6d80;text-align:center;line-height:1.4}.ai-suggested-prompts .ai-prompts-list{display:flex;flex-direction:column;gap:.625rem}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button{display:flex;align-items:center;gap:.625rem;padding:.625rem .9375rem;border:1px solid #C5AEFF;border-radius:24px;background-color:transparent;color:#712ace;cursor:pointer;transition:all .2s ease;text-align:left;font-size:.875rem;min-height:48px}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:hover{background-color:#f3f0ff;border-color:#9d79ff;transform:translateY(-1px)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:active{transform:translateY(0)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-icon{flex:0 0 auto;color:#712ace;font-size:16px;display:flex}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-text{flex:1;font-weight:400;line-height:1.3}.ai-drawer-footer{padding:.9375rem 1.5625rem 1.25rem;border-top:1px solid #D2D8E5;background-color:#fff;position:relative;z-index:1}.ai-suggested-prompts-section+.ai-drawer-footer{padding-top:.3rem;padding-bottom:.9375rem}.ai-input-row symphony-input-textarea-with-send{width:100%}.ai-footer-actions{text-align:center}.ai-footer-actions symphony-button-v2{font-size:.75rem;color:#5b6d80}.ai-footer-actions symphony-button-v2:hover{color:#08203e}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (prefers-contrast: high){.ai-drawer-container{border:2px solid #08203E}.ai-message-bubble.user-message{border:1px solid #0a5cae}.ai-message-bubble.ai-message{border:2px solid #5B6D80}.ai-message-bubble.system-message{border:2px solid #C3CBDC}}@media (prefers-reduced-motion: reduce){.ai-drawer-container,.ai-message-bubble,.ai-drawer-edge-toggle{transition:none;animation:none}}\n"], components: [{ type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: TaskStatusComponent, selector: "symphony-task-status", inputs: ["taskStatusModel"], outputs: ["cancelTask", "retryTask"] }, { type: InputTextareaWithSendComponent, selector: "symphony-input-textarea-with-send", inputs: ["placeholder", "isDisabled", "maxCharacterLimit", "showCharacterCount", "minRows", "maxRows", "sendButtonIcon", "sendButtonAriaLabel", "autoResize"], outputs: ["sendClicked", "enterPressed", "valueChanged"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "newLineToBr": NewLineToBrPipe } });
7828
+ AISearchAssistantDrawerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AISearchAssistantDrawerComponent, selector: "symphony-ai-search-assistant-drawer", inputs: { model: "model", config: "config", contextId: "contextId" }, outputs: { drawerClosed: "drawerClosed", promptSelected: "promptSelected", messageSent: "messageSent", inputChanged: "inputChanged", retryClicked: "retryClicked", taskCancelled: "taskCancelled", suggestionsToggled: "suggestionsToggled" }, viewQueries: [{ propertyName: "chatContainer", first: true, predicate: ["chatContainer"], descendants: true }, { propertyName: "messageInput", first: true, predicate: ["messageInput"], descendants: true }], ngImport: i0, template: "<!-- Drawer Container -->\n<div \n class=\"ai-drawer-container\" \n [class.open]=\"model.isOpen\"\n [id]=\"getPendoId('aiAssistantDrawer')\">\n \n <!-- Edge Toggle Button (inside drawer container) -->\n <button \n class=\"ai-drawer-edge-toggle\"\n [class.drawer-open]=\"model.isOpen\"\n (click)=\"onToggleDrawer()\"\n [attr.aria-label]=\"model.isOpen ? 'Close Tala Assistant' : 'Open Tala Assistant'\"\n [title]=\"model.isOpen ? 'Close Tala Assistant' : 'Tala Assisted Messaging'\"\n [id]=\"getPendoId('aiAssistantToggle')\">\n <symphony-icon [icon]=\"model.isOpen ? 'si-arrow-next' : 'si-arrow-prev'\"></symphony-icon>\n </button>\n \n <!-- Header -->\n <div class=\"ai-drawer-header\" *ngIf=\"model.isOpen\">\n <div class=\"ai-drawer-header\" *ngIf=\"model.isOpen\">\n <div class=\"ai-drawer-title sfx-m-0\">\n Build your email with \n <span class=\"ai-drawer-title-highlight\">Tala</span>, Symphony Talent's AI-powered Talent Acquisition Assistant.\n </div>\n </div>\n </div>\n\n <!-- Chat Container -->\n <div class=\"ai-drawer-body\" *ngIf=\"model.isOpen\">\n \n <!-- Messages Area -->\n <div \n class=\"ai-chat-container\" \n #chatContainer>\n \n <!-- Message List -->\n <div class=\"ai-message-list sfx-mb-20\">\n <div \n *ngFor=\"let message of model.messages; trackBy: trackByMessageId\"\n class=\"ai-message-wrapper\"\n [attr.data-message-type]=\"message.type\">\n \n <!-- Timestamp Above Message -->\n <div \n class=\"ai-message-timestamp-container\"\n *ngIf=\"config.showTimestamps\">\n <span class=\"ai-message-timestamp\">\n {{ getMessageTime(message.timestamp) }}\n </span>\n </div>\n \n <!-- Message Bubble -->\n <div \n class=\"ai-message-bubble\"\n [class.user-message]=\"message.type === 'user'\"\n [class.ai-message]=\"message.type === 'ai'\"\n [class.system-message]=\"message.type === 'system'\">\n \n <!-- AI Message Icon -->\n <div \n class=\"ai-message-icon\" \n *ngIf=\"message.type === 'ai'\">\n <symphony-icon [icon]=\"'si-ai-withoutBorder'\"></symphony-icon>\n </div>\n \n <div class=\"ai-message-content-wrapper\">\n <symphony-paragraph \n class=\"ai-message-content sfx-m-0\"\n [innerHTML]=\"message.content | newLineToBr\">\n </symphony-paragraph>\n </div>\n </div>\n \n <!-- Message Status (for user messages) -->\n <div \n class=\"ai-message-status\"\n *ngIf=\"message.type === 'user' && message.status\">\n <span \n class=\"ai-status-text\"\n [class.status-delivered]=\"message.status === 'delivered'\"\n [class.status-pending]=\"message.status === 'pending'\"\n [class.status-error]=\"message.status === 'error'\">\n {{ getStatusText(message.status) }}\n </span>\n </div>\n </div>\n\n <!-- AI Task Status (Progress Bar and Error Handling) -->\n\n <div \n *ngIf=\"model.aiTaskStatus\"\n class=\"ai-message-wrapper task-status-wrapper\"\n id=\"taskStatusMessage\">\n <symphony-task-status\n [taskStatusModel]=\"model.aiTaskStatus\"\n (cancelTask)=\"onCancelTask()\"\n (retryTask)=\"onRetryTask()\"\n [id]=\"getPendoId('aiTaskStatus')\">\n </symphony-task-status>\n </div>\n </div>\n </div>\n\n <!-- Suggested Prompts Section -->\n <div \n class=\"ai-suggested-prompts-section\"\n *ngIf=\"config.enableSuggestedPrompts && model.suggestedPrompts.length > 0\">\n <div class=\"ai-prompts-intro-row\">\n <symphony-paragraph class=\"ai-prompts-intro sfx-mb-15\">\n {{ model.isSuggestionsOpen ? 'Here are a few suggested prompts to get you started.' : 'Need help getting started?' }}\n </symphony-paragraph>\n <button\n class=\"ai-suggestions-toggle-compact\"\n [class.suggestions-open]=\"model.isSuggestionsOpen\"\n (click)=\"onToggleSuggestions()\"\n [attr.aria-label]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [title]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [id]=\"getPendoId('aiSuggestionsToggle')\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <symphony-icon [icon]=\"'si-arrow-hide-reveal'\"></symphony-icon>\n </button>\n </div>\n <div \n class=\"ai-suggested-prompts\" \n *ngIf=\"model.isSuggestionsOpen\"\n [class.open]=\"model.isSuggestionsOpen\"\n [id]=\"getPendoId('aiSuggestedPrompts')\"\n [class.disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <div class=\"ai-prompts-list\">\n <button\n *ngFor=\"let prompt of model.suggestedPrompts; let i = index\"\n class=\"ai-prompt-button\"\n (click)=\"onPromptClick(prompt)\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [id]=\"getPendoId('aiPromptButton-' + i)\">\n <symphony-icon \n *ngIf=\"prompt.icon\" \n [icon]=\"'si-' + prompt.icon\"\n class=\"ai-prompt-icon\">\n </symphony-icon>\n <span class=\"ai-prompt-text\">{{ prompt.text }}</span>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Footer / Input Area -->\n <div class=\"ai-drawer-footer\" *ngIf=\"model.isOpen\">\n \n <!-- Input Row -->\n <div class=\"ai-input-row\">\n <symphony-input-textarea-with-send\n #messageInput\n [(ngModel)]=\"model.inputValue\"\n [placeholder]=\"config.placeholder\"\n [isDisabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [maxCharacterLimit]=\"model.maxCharacterLimit\"\n [showCharacterCount]=\"!!model.maxCharacterLimit\"\n (sendClicked)=\"onSendMessage()\"\n (valueChanged)=\"onInputChange($event)\"\n (enterPressed)=\"onSendMessage()\"\n [id]=\"getPendoId('aiMessageInput')\">\n </symphony-input-textarea-with-send>\n </div>\n </div>\n</div> ", styles: [".sfx-p-0{padding:0}.sfx-p-5{padding:.3rem}.sfx-p-10{padding:.625rem}.sfx-p-15{padding:.9375rem}.sfx-p-20{padding:1.25rem}.sfx-p-30{padding:1.875rem}.sfx-pt-0{padding-top:0}.sfx-pt-5{padding-top:.3rem}.sfx-pt-10{padding-top:.625rem}.sfx-pt-15{padding-top:.9375rem}.sfx-pt-20{padding-top:1.25rem}.sfx-pt-25{padding-top:1.5625rem}.sfx-pt-30{padding-top:1.875rem}.sfx-pt-35{padding-top:2.1875rem}.sfx-pt-40{padding-top:2.5rem}.sfx-pt-50{padding-top:3.125rem}.sfx-pb-0{padding-bottom:0}.sfx-pb-5{padding-bottom:.3rem}.sfx-pb-10{padding-bottom:.625rem}.sfx-pb-15{padding-bottom:.9375rem}.sfx-pb-20{padding-bottom:1.25rem}.sfx-pb-25{padding-bottom:1.5625rem}.sfx-pb-30{padding-bottom:1.875rem}.sfx-pb-35{padding-bottom:2.1875rem}.sfx-pb-40{padding-bottom:2.5rem}.sfx-pb-50{padding-bottom:3.125rem}.sfx-pl-0{padding-left:0}.sfx-pl-5{padding-left:.3rem}.sfx-pl-10{padding-left:.625rem}.sfx-pl-15{padding-left:.9375rem}.sfx-pl-20{padding-left:1.25rem}.sfx-pl-25{padding-left:1.5625rem}.sfx-pl-30{padding-left:1.875rem}.sfx-pr-0{padding-right:0}.sfx-pr-5{padding-right:.3rem}.sfx-pr-10{padding-right:.625rem}.sfx-pr-15{padding-right:.9375rem}.sfx-pr-20{padding-right:1.25rem}.sfx-pr-25{padding-right:1.5625rem}.sfx-pr-30{padding-right:1.875rem}.sfx-py-15{padding-left:.9375rem;padding-right:.9375rem}.sfx-py-30{padding-left:1.875rem;padding-right:1.875rem}.sfx-px-0{padding-top:0;padding-bottom:0}.sfx-px-15{padding-top:.9375rem;padding-bottom:.9375rem}.sfx-px-20{padding-top:1.25rem;padding-bottom:1.25rem}.sfx-px-30{padding-top:1.875rem;padding-bottom:1.875rem}.sfx-m-0{margin:0}.sfx-m-5{margin:.3rem}.sfx-m-10{margin:.625rem}.sfx-m-15{margin:.9375rem}.sfx-m-20{margin:1.25rem}.sfx-m-auto{margin:0 auto}.sfx-mt-0{margin-top:0}.sfx-mt-5{margin-top:.3rem}.sfx-mt-10{margin-top:.625rem}.sfx-mt-15{margin-top:.9375rem}.sfx-mt-20{margin-top:1.25rem}.sfx-mt-25{margin-top:1.5625rem}.sfx-mt-30{margin-top:1.875rem}.sfx-mt-40{margin-top:2.5rem}.sfx-mt-80{margin-top:5rem}.sfx-mb-0{margin-bottom:0}.sfx-mb-5{margin-bottom:.3rem}.sfx-mb-10{margin-bottom:.625rem}.sfx-mb-15{margin-bottom:.9375rem}.sfx-mb-20{margin-bottom:1.25rem}.sfx-mb-25{margin-bottom:1.5625rem}.sfx-mb-30{margin-bottom:1.875rem}.sfx-mb-40{margin-bottom:2.5rem}.sfx-mb-50{margin-bottom:3.125rem}.sfx-ml-0{margin-left:0}.sfx-ml-5{margin-left:.3rem}.sfx-ml-10{margin-left:.625rem}.sfx-ml-15{margin-left:.9375rem}.sfx-ml-20{margin-left:1.25rem}.sfx-ml-auto{margin-left:auto}.sfx-mr-0{margin-right:0}.sfx-mr-5{margin-right:.3rem}.sfx-mr-10{margin-right:.625rem}.sfx-mr-15{margin-right:.9375rem}.sfx-mr-20{margin-right:1.25rem}.sfx-mr-25{margin-right:1.5625rem}.sfx-mr-30{margin-right:1.875rem}.sfx-mr-40{margin-right:2.5rem}.ai-drawer-container{position:absolute;top:0;right:0;width:100%;max-width:500px;height:100%;background-color:#fff;box-shadow:-4px 0 24px rgba(0,0,0,.15);z-index:9999;display:flex;flex-direction:column;transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.ai-drawer-container.open{transform:translate(0)}@media (max-width: 768px){.ai-drawer-container{width:100%;box-shadow:none}}.ai-drawer-edge-toggle{position:absolute;top:50%;left:-48px;transform:translateY(-50%);width:48px;height:48px;border:1px solid #D2D8E5;border-radius:8px 0 0 8px;background-color:#2b8ff3;color:#fff;cursor:pointer;box-shadow:-2px 0 8px rgba(0,0,0,.15);z-index:10001;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.ai-drawer-edge-toggle:hover{background-color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.2);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle:focus{outline:2px solid #2B8FF3;outline-offset:2px}.ai-drawer-edge-toggle symphony-icon{font-size:20px;transition:transform .2s ease;display:block;line-height:1;color:#fff}.ai-drawer-edge-toggle.drawer-open{left:-35px;background-color:#fff;color:#2b8ff3;border-color:#d2d8e5;border-radius:8px 0 0 8px;box-shadow:-2px 0 8px rgba(0,0,0,.1)}.ai-drawer-edge-toggle.drawer-open:hover{background-color:#f1f2f5;color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.15);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:18px;color:#2b8ff3}@media (max-width: 768px){.ai-drawer-edge-toggle{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle symphony-icon{font-size:18px}.ai-drawer-edge-toggle.drawer-open{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:16px}}.ai-drawer-header{display:flex;align-items:center;justify-content:center;padding:.625rem .9375rem;border-bottom:1px solid #D2D8E5;background-color:#c5aeff;position:relative;z-index:1}.ai-drawer-header .ai-drawer-title{font-size:18px;color:#000;text-align:center}.ai-drawer-header .ai-drawer-title-highlight{font-weight:700}.ai-drawer-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;z-index:1}.ai-chat-container{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding:.9375rem 1.5625rem}.ai-chat-container::-webkit-scrollbar{width:6px}.ai-chat-container::-webkit-scrollbar-track{background:#F1F2F5}.ai-chat-container::-webkit-scrollbar-thumb{background:#C3CBDC;border-radius:3px}.ai-chat-container::-webkit-scrollbar-thumb:hover{background:#5B6D80}.ai-message-list{display:flex;flex-direction:column;gap:.9375rem}.ai-message-wrapper{display:flex;flex-direction:column}.ai-message-wrapper[data-message-type=user]{align-items:flex-end}.ai-message-wrapper[data-message-type=ai],.ai-message-wrapper[data-message-type=system],.ai-message-wrapper.ai-loading-message{align-items:flex-start}.ai-message-timestamp-container{margin-bottom:.625rem;text-align:center;width:100%;align-self:center}.ai-message-timestamp-container .ai-message-timestamp{font-size:.75rem;color:#82919f;font-weight:500}.ai-message-bubble{max-width:80%;border-radius:12px;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;animation:messageSlideIn .3s ease-out;display:flex;gap:.625rem}.ai-message-bubble.user-message{background-color:#2b8ff3;color:#fff;border-bottom-right-radius:4px;padding:.625rem .9375rem;justify-content:flex-end}.ai-message-bubble.user-message .ai-message-content-wrapper{display:flex;flex-direction:column;align-items:flex-end}.ai-message-bubble.ai-message{background-color:#fff;border:1px solid #D2D8E5;color:#08203e;border-bottom-left-radius:4px;padding:.625rem .9375rem;align-items:flex-start}.ai-message-bubble.ai-message .ai-message-icon{flex:0 0 auto;width:24px;height:24px;display:flex;align-items:center;justify-content:center;margin-top:2px;background:linear-gradient(90deg,#a21aff,#351cc1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}.ai-message-bubble.ai-message .ai-message-icon symphony-icon{font-size:.875rem}.ai-message-bubble.ai-message .ai-message-content-wrapper{flex:1;display:flex;flex-direction:column}.ai-message-bubble.system-message{background-color:#f1f2f5;border:1px solid #E4E7EF;color:#5b6d80;border-radius:8px;text-align:center;max-width:90%;padding:.625rem .9375rem;justify-content:center}.ai-message-bubble.system-message .ai-message-content{font-size:.875rem}@media (max-width: 768px){.ai-message-bubble{max-width:90%}}.ai-message-status{margin-top:.3rem;text-align:right}.ai-message-status .ai-status-text{display:inline-flex;gap:4px;font-size:.75rem;font-weight:500}.ai-message-status .ai-status-text.status-delivered{color:#5b6d80}.ai-message-status .ai-status-text.status-delivered .ai-status-icon{color:#2cb45f;font-size:12px}.ai-message-status .ai-status-text.status-pending{color:#5b6d80}.ai-message-status .ai-status-text.status-pending .ai-status-loader{width:12px;height:12px}.ai-message-status .ai-status-text.status-error{color:#ac4463}.ai-message-status .ai-status-text.status-error .ai-status-icon{color:#ac4463;font-size:12px}.ai-loading-message .ai-message-bubble .ai-message-icon{flex:0 0 auto;width:24px;height:24px;background-color:#f0f8ff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}.ai-loading-message .ai-message-bubble .ai-message-icon symphony-icon{color:#2b8ff3;font-size:.875rem}.ai-loading-message .ai-message-bubble .ai-loading-content{display:flex;align-items:center;gap:.625rem;flex:1}.ai-loading-message .ai-message-bubble .ai-loading-text{font-style:italic;color:#5b6d80;font-size:.875rem}.ai-suggested-prompts-section{border-top:1px solid #E4E7EF;background-color:#f1f2f5;margin-bottom:0;position:relative;min-height:48px}.ai-prompts-intro-row{position:relative;padding:12px 14px 0;display:flex;align-items:center}.ai-prompts-intro-row .ai-prompts-intro{margin:0 auto;padding:0;font-size:.875rem;color:#5b6d80;line-height:1.4;text-align:center;position:relative;max-width:calc(100% - 60px);display:block}.ai-prompts-intro-row .ai-suggestions-toggle-compact{right:8px;width:28px;height:28px;border-radius:50%;border:none;background:#fff;color:#712ace;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s;box-shadow:0 1px 4px rgba(80,0,120,.04);font-size:15px;padding:0;margin:0}.ai-prompts-intro-row .ai-suggestions-toggle-compact:hover:not(:disabled){background:#f3f0ff;color:#5a21a4}.ai-prompts-intro-row .ai-suggestions-toggle-compact:focus{outline:2px solid #814DFF;outline-offset:2px}.ai-prompts-intro-row .ai-suggestions-toggle-compact:disabled{opacity:.5;cursor:not-allowed}.ai-prompts-intro-row .ai-suggestions-toggle-compact symphony-icon{font-size:15px;transition:transform .2s;transform:rotate(0)}.ai-prompts-intro-row .ai-suggestions-toggle-compact.suggestions-open symphony-icon{transform:rotate(180deg)}.ai-suggested-prompts{position:static;max-height:0;overflow:hidden;transition:max-height .3s cubic-bezier(.4,0,.2,1);opacity:0;padding:1.25rem 1.5625rem;background-color:#f1f2f5}.ai-suggested-prompts.open{max-height:500px;opacity:1}.ai-suggested-prompts.disabled{opacity:.7;pointer-events:none}.ai-suggested-prompts .ai-prompt-button:disabled{cursor:not-allowed;opacity:.7}.ai-suggested-prompts .ai-prompts-intro{font-size:.875rem;color:#5b6d80;text-align:center;line-height:1.4}.ai-suggested-prompts .ai-prompts-list{display:flex;flex-direction:column;gap:.625rem}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button{display:flex;align-items:center;gap:.625rem;padding:.625rem .9375rem;border:1px solid #C5AEFF;border-radius:24px;background-color:transparent;color:#712ace;cursor:pointer;transition:all .2s ease;text-align:left;font-size:.875rem;min-height:48px}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:hover{background-color:#f3f0ff;border-color:#9d79ff;transform:translateY(-1px)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:active{transform:translateY(0)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-icon{flex:0 0 auto;color:#712ace;font-size:16px;display:flex}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-text{flex:1;font-weight:400;line-height:1.3}.ai-drawer-footer{padding:.9375rem 1.5625rem 1.25rem;border-top:1px solid #D2D8E5;background-color:#fff;position:relative;z-index:1}.ai-suggested-prompts-section+.ai-drawer-footer{padding-top:.3rem;padding-bottom:.9375rem}.ai-input-row symphony-input-textarea-with-send{width:100%}.ai-footer-actions{text-align:center}.ai-footer-actions symphony-button-v2{font-size:.75rem;color:#5b6d80}.ai-footer-actions symphony-button-v2:hover{color:#08203e}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (prefers-contrast: high){.ai-drawer-container{border:2px solid #08203E}.ai-message-bubble.user-message{border:1px solid #0a5cae}.ai-message-bubble.ai-message{border:2px solid #5B6D80}.ai-message-bubble.system-message{border:2px solid #C3CBDC}}@media (prefers-reduced-motion: reduce){.ai-drawer-container,.ai-message-bubble,.ai-drawer-edge-toggle{transition:none;animation:none}}\n"], components: [{ type: IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: TaskStatusComponent, selector: "symphony-task-status", inputs: ["taskStatusModel"], outputs: ["cancelTask", "retryTask"] }, { type: InputTextareaWithSendComponent, selector: "symphony-input-textarea-with-send", inputs: ["placeholder", "isDisabled", "maxCharacterLimit", "showCharacterCount", "minRows", "maxRows", "sendButtonIcon", "sendButtonAriaLabel", "autoResize"], outputs: ["sendClicked", "enterPressed", "valueChanged"] }], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "newLineToBr": NewLineToBrPipe } });
7786
7829
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AISearchAssistantDrawerComponent, decorators: [{
7787
7830
  type: Component,
7788
- args: [{ selector: 'symphony-ai-search-assistant-drawer', template: "<!-- Drawer Container -->\n<div \n class=\"ai-drawer-container\" \n [class.open]=\"model.isOpen\"\n [id]=\"getPendoId('aiAssistantDrawer')\">\n \n <!-- Edge Toggle Button (inside drawer container) -->\n <button \n class=\"ai-drawer-edge-toggle\"\n [class.drawer-open]=\"model.isOpen\"\n (click)=\"onToggleDrawer()\"\n [attr.aria-label]=\"model.isOpen ? 'Close Tali Assistant' : 'Open Tali Assistant'\"\n [title]=\"model.isOpen ? 'Close Tali Assistant' : 'Tali Assisted Messaging'\"\n [id]=\"getPendoId('aiAssistantToggle')\">\n <symphony-icon [icon]=\"model.isOpen ? 'si-arrow-next' : 'si-arrow-prev'\"></symphony-icon>\n </button>\n \n <!-- Header -->\n <div class=\"ai-drawer-header\" *ngIf=\"model.isOpen\">\n <symphony-h4 class=\"ai-drawer-title sfx-m-0\">Tali, your Talent Acquisition Assistant</symphony-h4>\n </div>\n\n <!-- Chat Container -->\n <div class=\"ai-drawer-body\" *ngIf=\"model.isOpen\">\n \n <!-- Messages Area -->\n <div \n class=\"ai-chat-container\" \n #chatContainer>\n \n <!-- Message List -->\n <div class=\"ai-message-list sfx-mb-20\">\n <div \n *ngFor=\"let message of model.messages; trackBy: trackByMessageId\"\n class=\"ai-message-wrapper\"\n [attr.data-message-type]=\"message.type\">\n \n <!-- Timestamp Above Message -->\n <div \n class=\"ai-message-timestamp-container\"\n *ngIf=\"config.showTimestamps\">\n <span class=\"ai-message-timestamp\">\n {{ getMessageTime(message.timestamp) }}\n </span>\n </div>\n \n <!-- Message Bubble -->\n <div \n class=\"ai-message-bubble\"\n [class.user-message]=\"message.type === 'user'\"\n [class.ai-message]=\"message.type === 'ai'\"\n [class.system-message]=\"message.type === 'system'\">\n \n <!-- AI Message Icon -->\n <div \n class=\"ai-message-icon\" \n *ngIf=\"message.type === 'ai'\">\n <symphony-icon [icon]=\"'si-chatbot'\"></symphony-icon>\n </div>\n \n <div class=\"ai-message-content-wrapper\">\n <symphony-paragraph \n class=\"ai-message-content sfx-m-0\"\n [innerHTML]=\"message.content | newLineToBr\">\n </symphony-paragraph>\n </div>\n </div>\n \n <!-- Message Status (for user messages) -->\n <div \n class=\"ai-message-status\"\n *ngIf=\"message.type === 'user' && message.status\">\n <span \n class=\"ai-status-text\"\n [class.status-delivered]=\"message.status === 'delivered'\"\n [class.status-pending]=\"message.status === 'pending'\"\n [class.status-error]=\"message.status === 'error'\">\n {{ getStatusText(message.status) }}\n </span>\n </div>\n </div>\n\n <!-- AI Task Status (Progress Bar and Error Handling) -->\n\n <div \n *ngIf=\"model.aiTaskStatus\"\n class=\"ai-message-wrapper task-status-wrapper\"\n id=\"taskStatusMessage\">\n <symphony-task-status\n [taskStatusModel]=\"model.aiTaskStatus\"\n (cancelTask)=\"onCancelTask()\"\n (retryTask)=\"onRetryTask()\"\n [id]=\"getPendoId('aiTaskStatus')\">\n </symphony-task-status>\n </div>\n </div>\n </div>\n\n <!-- Suggested Prompts Section -->\n <div \n class=\"ai-suggested-prompts-section\"\n *ngIf=\"config.enableSuggestedPrompts && model.suggestedPrompts.length > 0\">\n <div class=\"ai-prompts-intro-row\">\n <symphony-paragraph class=\"ai-prompts-intro sfx-mb-15\">\n {{ model.isSuggestionsOpen ? 'Here are a few suggested prompts to get you started.' : 'Need help getting started?' }}\n </symphony-paragraph>\n <button\n class=\"ai-suggestions-toggle-compact\"\n [class.suggestions-open]=\"model.isSuggestionsOpen\"\n (click)=\"onToggleSuggestions()\"\n [attr.aria-label]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [title]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [id]=\"getPendoId('aiSuggestionsToggle')\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <symphony-icon [icon]=\"'si-arrow-hide-reveal'\"></symphony-icon>\n </button>\n </div>\n <div \n class=\"ai-suggested-prompts\" \n *ngIf=\"model.isSuggestionsOpen\"\n [class.open]=\"model.isSuggestionsOpen\"\n [id]=\"getPendoId('aiSuggestedPrompts')\"\n [class.disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <div class=\"ai-prompts-list\">\n <button\n *ngFor=\"let prompt of model.suggestedPrompts; let i = index\"\n class=\"ai-prompt-button\"\n (click)=\"onPromptClick(prompt)\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [id]=\"getPendoId('aiPromptButton-' + i)\">\n <symphony-icon \n *ngIf=\"prompt.icon\" \n [icon]=\"'si-' + prompt.icon\"\n class=\"ai-prompt-icon\">\n </symphony-icon>\n <span class=\"ai-prompt-text\">{{ prompt.text }}</span>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Footer / Input Area -->\n <div class=\"ai-drawer-footer\" *ngIf=\"model.isOpen\">\n \n <!-- Input Row -->\n <div class=\"ai-input-row\">\n <symphony-input-textarea-with-send\n #messageInput\n [(ngModel)]=\"model.inputValue\"\n [placeholder]=\"config.placeholder\"\n [isDisabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [maxCharacterLimit]=\"model.maxCharacterLimit\"\n [showCharacterCount]=\"!!model.maxCharacterLimit\"\n (sendClicked)=\"onSendMessage()\"\n (valueChanged)=\"onInputChange($event)\"\n (enterPressed)=\"onSendMessage()\"\n [id]=\"getPendoId('aiMessageInput')\">\n </symphony-input-textarea-with-send>\n </div>\n </div>\n</div> ", styles: [".sfx-p-0{padding:0}.sfx-p-5{padding:.3rem}.sfx-p-10{padding:.625rem}.sfx-p-15{padding:.9375rem}.sfx-p-20{padding:1.25rem}.sfx-p-30{padding:1.875rem}.sfx-pt-0{padding-top:0}.sfx-pt-5{padding-top:.3rem}.sfx-pt-10{padding-top:.625rem}.sfx-pt-15{padding-top:.9375rem}.sfx-pt-20{padding-top:1.25rem}.sfx-pt-25{padding-top:1.5625rem}.sfx-pt-30{padding-top:1.875rem}.sfx-pt-35{padding-top:2.1875rem}.sfx-pt-40{padding-top:2.5rem}.sfx-pt-50{padding-top:3.125rem}.sfx-pb-0{padding-bottom:0}.sfx-pb-5{padding-bottom:.3rem}.sfx-pb-10{padding-bottom:.625rem}.sfx-pb-15{padding-bottom:.9375rem}.sfx-pb-20{padding-bottom:1.25rem}.sfx-pb-25{padding-bottom:1.5625rem}.sfx-pb-30{padding-bottom:1.875rem}.sfx-pb-35{padding-bottom:2.1875rem}.sfx-pb-40{padding-bottom:2.5rem}.sfx-pb-50{padding-bottom:3.125rem}.sfx-pl-0{padding-left:0}.sfx-pl-5{padding-left:.3rem}.sfx-pl-10{padding-left:.625rem}.sfx-pl-15{padding-left:.9375rem}.sfx-pl-20{padding-left:1.25rem}.sfx-pl-25{padding-left:1.5625rem}.sfx-pl-30{padding-left:1.875rem}.sfx-pr-0{padding-right:0}.sfx-pr-5{padding-right:.3rem}.sfx-pr-10{padding-right:.625rem}.sfx-pr-15{padding-right:.9375rem}.sfx-pr-20{padding-right:1.25rem}.sfx-pr-25{padding-right:1.5625rem}.sfx-pr-30{padding-right:1.875rem}.sfx-py-15{padding-left:.9375rem;padding-right:.9375rem}.sfx-py-30{padding-left:1.875rem;padding-right:1.875rem}.sfx-px-0{padding-top:0;padding-bottom:0}.sfx-px-15{padding-top:.9375rem;padding-bottom:.9375rem}.sfx-px-20{padding-top:1.25rem;padding-bottom:1.25rem}.sfx-px-30{padding-top:1.875rem;padding-bottom:1.875rem}.sfx-m-0{margin:0}.sfx-m-5{margin:.3rem}.sfx-m-10{margin:.625rem}.sfx-m-15{margin:.9375rem}.sfx-m-20{margin:1.25rem}.sfx-m-auto{margin:0 auto}.sfx-mt-0{margin-top:0}.sfx-mt-5{margin-top:.3rem}.sfx-mt-10{margin-top:.625rem}.sfx-mt-15{margin-top:.9375rem}.sfx-mt-20{margin-top:1.25rem}.sfx-mt-25{margin-top:1.5625rem}.sfx-mt-30{margin-top:1.875rem}.sfx-mt-40{margin-top:2.5rem}.sfx-mt-80{margin-top:5rem}.sfx-mb-0{margin-bottom:0}.sfx-mb-5{margin-bottom:.3rem}.sfx-mb-10{margin-bottom:.625rem}.sfx-mb-15{margin-bottom:.9375rem}.sfx-mb-20{margin-bottom:1.25rem}.sfx-mb-25{margin-bottom:1.5625rem}.sfx-mb-30{margin-bottom:1.875rem}.sfx-mb-40{margin-bottom:2.5rem}.sfx-mb-50{margin-bottom:3.125rem}.sfx-ml-0{margin-left:0}.sfx-ml-5{margin-left:.3rem}.sfx-ml-10{margin-left:.625rem}.sfx-ml-15{margin-left:.9375rem}.sfx-ml-20{margin-left:1.25rem}.sfx-ml-auto{margin-left:auto}.sfx-mr-0{margin-right:0}.sfx-mr-5{margin-right:.3rem}.sfx-mr-10{margin-right:.625rem}.sfx-mr-15{margin-right:.9375rem}.sfx-mr-20{margin-right:1.25rem}.sfx-mr-25{margin-right:1.5625rem}.sfx-mr-30{margin-right:1.875rem}.sfx-mr-40{margin-right:2.5rem}.ai-drawer-container{position:absolute;top:0;right:0;width:100%;max-width:500px;height:100%;background-color:#fff;box-shadow:-4px 0 24px rgba(0,0,0,.15);z-index:9999;display:flex;flex-direction:column;transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.ai-drawer-container.open{transform:translate(0)}@media (max-width: 768px){.ai-drawer-container{width:100%;box-shadow:none}}.ai-drawer-edge-toggle{position:absolute;top:50%;left:-48px;transform:translateY(-50%);width:48px;height:48px;border:1px solid #D2D8E5;border-radius:8px 0 0 8px;background-color:#2b8ff3;color:#fff;cursor:pointer;box-shadow:-2px 0 8px rgba(0,0,0,.15);z-index:10001;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.ai-drawer-edge-toggle:hover{background-color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.2);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle:focus{outline:2px solid #2B8FF3;outline-offset:2px}.ai-drawer-edge-toggle symphony-icon{font-size:20px;transition:transform .2s ease;display:block;line-height:1;color:#fff}.ai-drawer-edge-toggle.drawer-open{left:-35px;background-color:#fff;color:#2b8ff3;border-color:#d2d8e5;border-radius:8px 0 0 8px;box-shadow:-2px 0 8px rgba(0,0,0,.1)}.ai-drawer-edge-toggle.drawer-open:hover{background-color:#f1f2f5;color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.15);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:18px;color:#2b8ff3}@media (max-width: 768px){.ai-drawer-edge-toggle{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle symphony-icon{font-size:18px}.ai-drawer-edge-toggle.drawer-open{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:16px}}.ai-drawer-header{display:flex;align-items:center;justify-content:center;padding:1.25rem 1.5625rem;border-bottom:1px solid #D2D8E5;background-color:#fff;position:relative;z-index:1}.ai-drawer-header .ai-drawer-title{font-size:1.125rem;font-weight:600;color:#08203e}.ai-drawer-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;z-index:1}.ai-chat-container{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding:.9375rem 1.5625rem}.ai-chat-container::-webkit-scrollbar{width:6px}.ai-chat-container::-webkit-scrollbar-track{background:#F1F2F5}.ai-chat-container::-webkit-scrollbar-thumb{background:#C3CBDC;border-radius:3px}.ai-chat-container::-webkit-scrollbar-thumb:hover{background:#5B6D80}.ai-message-list{display:flex;flex-direction:column;gap:.9375rem}.ai-message-wrapper{display:flex;flex-direction:column}.ai-message-wrapper[data-message-type=user]{align-items:flex-end}.ai-message-wrapper[data-message-type=ai],.ai-message-wrapper[data-message-type=system],.ai-message-wrapper.ai-loading-message{align-items:flex-start}.ai-message-timestamp-container{margin-bottom:.625rem;text-align:center;width:100%;align-self:center}.ai-message-timestamp-container .ai-message-timestamp{font-size:.75rem;color:#82919f;font-weight:500}.ai-message-bubble{max-width:80%;border-radius:12px;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;animation:messageSlideIn .3s ease-out;display:flex;gap:.625rem}.ai-message-bubble.user-message{background-color:#2b8ff3;color:#fff;border-bottom-right-radius:4px;padding:.625rem .9375rem;justify-content:flex-end}.ai-message-bubble.user-message .ai-message-content-wrapper{display:flex;flex-direction:column;align-items:flex-end}.ai-message-bubble.ai-message{background-color:#fff;border:1px solid #D2D8E5;color:#08203e;border-bottom-left-radius:4px;padding:.625rem .9375rem;align-items:flex-start}.ai-message-bubble.ai-message .ai-message-icon{flex:0 0 auto;width:24px;height:24px;background-color:#f0f8ff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}.ai-message-bubble.ai-message .ai-message-icon symphony-icon{color:#2b8ff3;font-size:.875rem}.ai-message-bubble.ai-message .ai-message-content-wrapper{flex:1;display:flex;flex-direction:column}.ai-message-bubble.system-message{background-color:#f1f2f5;border:1px solid #E4E7EF;color:#5b6d80;border-radius:8px;text-align:center;max-width:90%;padding:.625rem .9375rem;justify-content:center}.ai-message-bubble.system-message .ai-message-content{font-size:.875rem}@media (max-width: 768px){.ai-message-bubble{max-width:90%}}.ai-message-status{margin-top:.3rem;text-align:right}.ai-message-status .ai-status-text{display:inline-flex;gap:4px;font-size:.75rem;font-weight:500}.ai-message-status .ai-status-text.status-delivered{color:#5b6d80}.ai-message-status .ai-status-text.status-delivered .ai-status-icon{color:#2cb45f;font-size:12px}.ai-message-status .ai-status-text.status-pending{color:#5b6d80}.ai-message-status .ai-status-text.status-pending .ai-status-loader{width:12px;height:12px}.ai-message-status .ai-status-text.status-error{color:#ac4463}.ai-message-status .ai-status-text.status-error .ai-status-icon{color:#ac4463;font-size:12px}.ai-loading-message .ai-message-bubble .ai-message-icon{flex:0 0 auto;width:24px;height:24px;background-color:#f0f8ff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}.ai-loading-message .ai-message-bubble .ai-message-icon symphony-icon{color:#2b8ff3;font-size:.875rem}.ai-loading-message .ai-message-bubble .ai-loading-content{display:flex;align-items:center;gap:.625rem;flex:1}.ai-loading-message .ai-message-bubble .ai-loading-text{font-style:italic;color:#5b6d80;font-size:.875rem}.ai-suggested-prompts-section{border-top:1px solid #E4E7EF;background-color:#f1f2f5;margin-bottom:0;position:relative;min-height:48px}.ai-prompts-intro-row{position:relative;padding:12px 14px 0;display:flex;align-items:center}.ai-prompts-intro-row .ai-prompts-intro{margin:0 auto;padding:0;font-size:.875rem;color:#5b6d80;line-height:1.4;text-align:center;position:relative;max-width:calc(100% - 60px);display:block}.ai-prompts-intro-row .ai-suggestions-toggle-compact{right:8px;width:28px;height:28px;border-radius:50%;border:none;background:#fff;color:#712ace;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s;box-shadow:0 1px 4px rgba(80,0,120,.04);font-size:15px;padding:0;margin:0}.ai-prompts-intro-row .ai-suggestions-toggle-compact:hover:not(:disabled){background:#f3f0ff;color:#5a21a4}.ai-prompts-intro-row .ai-suggestions-toggle-compact:focus{outline:2px solid #814DFF;outline-offset:2px}.ai-prompts-intro-row .ai-suggestions-toggle-compact:disabled{opacity:.5;cursor:not-allowed}.ai-prompts-intro-row .ai-suggestions-toggle-compact symphony-icon{font-size:15px;transition:transform .2s;transform:rotate(0)}.ai-prompts-intro-row .ai-suggestions-toggle-compact.suggestions-open symphony-icon{transform:rotate(180deg)}.ai-suggested-prompts{position:static;max-height:0;overflow:hidden;transition:max-height .3s cubic-bezier(.4,0,.2,1);opacity:0;padding:1.25rem 1.5625rem;background-color:#f1f2f5}.ai-suggested-prompts.open{max-height:500px;opacity:1}.ai-suggested-prompts.disabled{opacity:.7;pointer-events:none}.ai-suggested-prompts .ai-prompt-button:disabled{cursor:not-allowed;opacity:.7}.ai-suggested-prompts .ai-prompts-intro{font-size:.875rem;color:#5b6d80;text-align:center;line-height:1.4}.ai-suggested-prompts .ai-prompts-list{display:flex;flex-direction:column;gap:.625rem}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button{display:flex;align-items:center;gap:.625rem;padding:.625rem .9375rem;border:1px solid #C5AEFF;border-radius:24px;background-color:transparent;color:#712ace;cursor:pointer;transition:all .2s ease;text-align:left;font-size:.875rem;min-height:48px}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:hover{background-color:#f3f0ff;border-color:#9d79ff;transform:translateY(-1px)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:active{transform:translateY(0)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-icon{flex:0 0 auto;color:#712ace;font-size:16px;display:flex}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-text{flex:1;font-weight:400;line-height:1.3}.ai-drawer-footer{padding:.9375rem 1.5625rem 1.25rem;border-top:1px solid #D2D8E5;background-color:#fff;position:relative;z-index:1}.ai-suggested-prompts-section+.ai-drawer-footer{padding-top:.3rem;padding-bottom:.9375rem}.ai-input-row symphony-input-textarea-with-send{width:100%}.ai-footer-actions{text-align:center}.ai-footer-actions symphony-button-v2{font-size:.75rem;color:#5b6d80}.ai-footer-actions symphony-button-v2:hover{color:#08203e}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (prefers-contrast: high){.ai-drawer-container{border:2px solid #08203E}.ai-message-bubble.user-message{border:1px solid #0a5cae}.ai-message-bubble.ai-message{border:2px solid #5B6D80}.ai-message-bubble.system-message{border:2px solid #C3CBDC}}@media (prefers-reduced-motion: reduce){.ai-drawer-container,.ai-message-bubble,.ai-drawer-edge-toggle{transition:none;animation:none}}\n"] }]
7831
+ args: [{ selector: 'symphony-ai-search-assistant-drawer', template: "<!-- Drawer Container -->\n<div \n class=\"ai-drawer-container\" \n [class.open]=\"model.isOpen\"\n [id]=\"getPendoId('aiAssistantDrawer')\">\n \n <!-- Edge Toggle Button (inside drawer container) -->\n <button \n class=\"ai-drawer-edge-toggle\"\n [class.drawer-open]=\"model.isOpen\"\n (click)=\"onToggleDrawer()\"\n [attr.aria-label]=\"model.isOpen ? 'Close Tala Assistant' : 'Open Tala Assistant'\"\n [title]=\"model.isOpen ? 'Close Tala Assistant' : 'Tala Assisted Messaging'\"\n [id]=\"getPendoId('aiAssistantToggle')\">\n <symphony-icon [icon]=\"model.isOpen ? 'si-arrow-next' : 'si-arrow-prev'\"></symphony-icon>\n </button>\n \n <!-- Header -->\n <div class=\"ai-drawer-header\" *ngIf=\"model.isOpen\">\n <div class=\"ai-drawer-header\" *ngIf=\"model.isOpen\">\n <div class=\"ai-drawer-title sfx-m-0\">\n Build your email with \n <span class=\"ai-drawer-title-highlight\">Tala</span>, Symphony Talent's AI-powered Talent Acquisition Assistant.\n </div>\n </div>\n </div>\n\n <!-- Chat Container -->\n <div class=\"ai-drawer-body\" *ngIf=\"model.isOpen\">\n \n <!-- Messages Area -->\n <div \n class=\"ai-chat-container\" \n #chatContainer>\n \n <!-- Message List -->\n <div class=\"ai-message-list sfx-mb-20\">\n <div \n *ngFor=\"let message of model.messages; trackBy: trackByMessageId\"\n class=\"ai-message-wrapper\"\n [attr.data-message-type]=\"message.type\">\n \n <!-- Timestamp Above Message -->\n <div \n class=\"ai-message-timestamp-container\"\n *ngIf=\"config.showTimestamps\">\n <span class=\"ai-message-timestamp\">\n {{ getMessageTime(message.timestamp) }}\n </span>\n </div>\n \n <!-- Message Bubble -->\n <div \n class=\"ai-message-bubble\"\n [class.user-message]=\"message.type === 'user'\"\n [class.ai-message]=\"message.type === 'ai'\"\n [class.system-message]=\"message.type === 'system'\">\n \n <!-- AI Message Icon -->\n <div \n class=\"ai-message-icon\" \n *ngIf=\"message.type === 'ai'\">\n <symphony-icon [icon]=\"'si-ai-withoutBorder'\"></symphony-icon>\n </div>\n \n <div class=\"ai-message-content-wrapper\">\n <symphony-paragraph \n class=\"ai-message-content sfx-m-0\"\n [innerHTML]=\"message.content | newLineToBr\">\n </symphony-paragraph>\n </div>\n </div>\n \n <!-- Message Status (for user messages) -->\n <div \n class=\"ai-message-status\"\n *ngIf=\"message.type === 'user' && message.status\">\n <span \n class=\"ai-status-text\"\n [class.status-delivered]=\"message.status === 'delivered'\"\n [class.status-pending]=\"message.status === 'pending'\"\n [class.status-error]=\"message.status === 'error'\">\n {{ getStatusText(message.status) }}\n </span>\n </div>\n </div>\n\n <!-- AI Task Status (Progress Bar and Error Handling) -->\n\n <div \n *ngIf=\"model.aiTaskStatus\"\n class=\"ai-message-wrapper task-status-wrapper\"\n id=\"taskStatusMessage\">\n <symphony-task-status\n [taskStatusModel]=\"model.aiTaskStatus\"\n (cancelTask)=\"onCancelTask()\"\n (retryTask)=\"onRetryTask()\"\n [id]=\"getPendoId('aiTaskStatus')\">\n </symphony-task-status>\n </div>\n </div>\n </div>\n\n <!-- Suggested Prompts Section -->\n <div \n class=\"ai-suggested-prompts-section\"\n *ngIf=\"config.enableSuggestedPrompts && model.suggestedPrompts.length > 0\">\n <div class=\"ai-prompts-intro-row\">\n <symphony-paragraph class=\"ai-prompts-intro sfx-mb-15\">\n {{ model.isSuggestionsOpen ? 'Here are a few suggested prompts to get you started.' : 'Need help getting started?' }}\n </symphony-paragraph>\n <button\n class=\"ai-suggestions-toggle-compact\"\n [class.suggestions-open]=\"model.isSuggestionsOpen\"\n (click)=\"onToggleSuggestions()\"\n [attr.aria-label]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [title]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n [id]=\"getPendoId('aiSuggestionsToggle')\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <symphony-icon [icon]=\"'si-arrow-hide-reveal'\"></symphony-icon>\n </button>\n </div>\n <div \n class=\"ai-suggested-prompts\" \n *ngIf=\"model.isSuggestionsOpen\"\n [class.open]=\"model.isSuggestionsOpen\"\n [id]=\"getPendoId('aiSuggestedPrompts')\"\n [class.disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n <div class=\"ai-prompts-list\">\n <button\n *ngFor=\"let prompt of model.suggestedPrompts; let i = index\"\n class=\"ai-prompt-button\"\n (click)=\"onPromptClick(prompt)\"\n [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [id]=\"getPendoId('aiPromptButton-' + i)\">\n <symphony-icon \n *ngIf=\"prompt.icon\" \n [icon]=\"'si-' + prompt.icon\"\n class=\"ai-prompt-icon\">\n </symphony-icon>\n <span class=\"ai-prompt-text\">{{ prompt.text }}</span>\n </button>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Footer / Input Area -->\n <div class=\"ai-drawer-footer\" *ngIf=\"model.isOpen\">\n \n <!-- Input Row -->\n <div class=\"ai-input-row\">\n <symphony-input-textarea-with-send\n #messageInput\n [(ngModel)]=\"model.inputValue\"\n [placeholder]=\"config.placeholder\"\n [isDisabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\"\n [maxCharacterLimit]=\"model.maxCharacterLimit\"\n [showCharacterCount]=\"!!model.maxCharacterLimit\"\n (sendClicked)=\"onSendMessage()\"\n (valueChanged)=\"onInputChange($event)\"\n (enterPressed)=\"onSendMessage()\"\n [id]=\"getPendoId('aiMessageInput')\">\n </symphony-input-textarea-with-send>\n </div>\n </div>\n</div> ", styles: [".sfx-p-0{padding:0}.sfx-p-5{padding:.3rem}.sfx-p-10{padding:.625rem}.sfx-p-15{padding:.9375rem}.sfx-p-20{padding:1.25rem}.sfx-p-30{padding:1.875rem}.sfx-pt-0{padding-top:0}.sfx-pt-5{padding-top:.3rem}.sfx-pt-10{padding-top:.625rem}.sfx-pt-15{padding-top:.9375rem}.sfx-pt-20{padding-top:1.25rem}.sfx-pt-25{padding-top:1.5625rem}.sfx-pt-30{padding-top:1.875rem}.sfx-pt-35{padding-top:2.1875rem}.sfx-pt-40{padding-top:2.5rem}.sfx-pt-50{padding-top:3.125rem}.sfx-pb-0{padding-bottom:0}.sfx-pb-5{padding-bottom:.3rem}.sfx-pb-10{padding-bottom:.625rem}.sfx-pb-15{padding-bottom:.9375rem}.sfx-pb-20{padding-bottom:1.25rem}.sfx-pb-25{padding-bottom:1.5625rem}.sfx-pb-30{padding-bottom:1.875rem}.sfx-pb-35{padding-bottom:2.1875rem}.sfx-pb-40{padding-bottom:2.5rem}.sfx-pb-50{padding-bottom:3.125rem}.sfx-pl-0{padding-left:0}.sfx-pl-5{padding-left:.3rem}.sfx-pl-10{padding-left:.625rem}.sfx-pl-15{padding-left:.9375rem}.sfx-pl-20{padding-left:1.25rem}.sfx-pl-25{padding-left:1.5625rem}.sfx-pl-30{padding-left:1.875rem}.sfx-pr-0{padding-right:0}.sfx-pr-5{padding-right:.3rem}.sfx-pr-10{padding-right:.625rem}.sfx-pr-15{padding-right:.9375rem}.sfx-pr-20{padding-right:1.25rem}.sfx-pr-25{padding-right:1.5625rem}.sfx-pr-30{padding-right:1.875rem}.sfx-py-15{padding-left:.9375rem;padding-right:.9375rem}.sfx-py-30{padding-left:1.875rem;padding-right:1.875rem}.sfx-px-0{padding-top:0;padding-bottom:0}.sfx-px-15{padding-top:.9375rem;padding-bottom:.9375rem}.sfx-px-20{padding-top:1.25rem;padding-bottom:1.25rem}.sfx-px-30{padding-top:1.875rem;padding-bottom:1.875rem}.sfx-m-0{margin:0}.sfx-m-5{margin:.3rem}.sfx-m-10{margin:.625rem}.sfx-m-15{margin:.9375rem}.sfx-m-20{margin:1.25rem}.sfx-m-auto{margin:0 auto}.sfx-mt-0{margin-top:0}.sfx-mt-5{margin-top:.3rem}.sfx-mt-10{margin-top:.625rem}.sfx-mt-15{margin-top:.9375rem}.sfx-mt-20{margin-top:1.25rem}.sfx-mt-25{margin-top:1.5625rem}.sfx-mt-30{margin-top:1.875rem}.sfx-mt-40{margin-top:2.5rem}.sfx-mt-80{margin-top:5rem}.sfx-mb-0{margin-bottom:0}.sfx-mb-5{margin-bottom:.3rem}.sfx-mb-10{margin-bottom:.625rem}.sfx-mb-15{margin-bottom:.9375rem}.sfx-mb-20{margin-bottom:1.25rem}.sfx-mb-25{margin-bottom:1.5625rem}.sfx-mb-30{margin-bottom:1.875rem}.sfx-mb-40{margin-bottom:2.5rem}.sfx-mb-50{margin-bottom:3.125rem}.sfx-ml-0{margin-left:0}.sfx-ml-5{margin-left:.3rem}.sfx-ml-10{margin-left:.625rem}.sfx-ml-15{margin-left:.9375rem}.sfx-ml-20{margin-left:1.25rem}.sfx-ml-auto{margin-left:auto}.sfx-mr-0{margin-right:0}.sfx-mr-5{margin-right:.3rem}.sfx-mr-10{margin-right:.625rem}.sfx-mr-15{margin-right:.9375rem}.sfx-mr-20{margin-right:1.25rem}.sfx-mr-25{margin-right:1.5625rem}.sfx-mr-30{margin-right:1.875rem}.sfx-mr-40{margin-right:2.5rem}.ai-drawer-container{position:absolute;top:0;right:0;width:100%;max-width:500px;height:100%;background-color:#fff;box-shadow:-4px 0 24px rgba(0,0,0,.15);z-index:9999;display:flex;flex-direction:column;transform:translate(100%);transition:transform .3s cubic-bezier(.4,0,.2,1)}.ai-drawer-container.open{transform:translate(0)}@media (max-width: 768px){.ai-drawer-container{width:100%;box-shadow:none}}.ai-drawer-edge-toggle{position:absolute;top:50%;left:-48px;transform:translateY(-50%);width:48px;height:48px;border:1px solid #D2D8E5;border-radius:8px 0 0 8px;background-color:#2b8ff3;color:#fff;cursor:pointer;box-shadow:-2px 0 8px rgba(0,0,0,.15);z-index:10001;display:flex;align-items:center;justify-content:center;transition:all .3s ease}.ai-drawer-edge-toggle:hover{background-color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.2);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle:focus{outline:2px solid #2B8FF3;outline-offset:2px}.ai-drawer-edge-toggle symphony-icon{font-size:20px;transition:transform .2s ease;display:block;line-height:1;color:#fff}.ai-drawer-edge-toggle.drawer-open{left:-35px;background-color:#fff;color:#2b8ff3;border-color:#d2d8e5;border-radius:8px 0 0 8px;box-shadow:-2px 0 8px rgba(0,0,0,.1)}.ai-drawer-edge-toggle.drawer-open:hover{background-color:#f1f2f5;color:#0d76de;box-shadow:-4px 0 12px rgba(0,0,0,.15);transform:translateY(-50%) scale(1.02)}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:18px;color:#2b8ff3}@media (max-width: 768px){.ai-drawer-edge-toggle{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle symphony-icon{font-size:18px}.ai-drawer-edge-toggle.drawer-open{left:-40px;width:40px;height:40px}.ai-drawer-edge-toggle.drawer-open symphony-icon{font-size:16px}}.ai-drawer-header{display:flex;align-items:center;justify-content:center;padding:.625rem .9375rem;border-bottom:1px solid #D2D8E5;background-color:#c5aeff;position:relative;z-index:1}.ai-drawer-header .ai-drawer-title{font-size:18px;color:#000;text-align:center}.ai-drawer-header .ai-drawer-title-highlight{font-weight:700}.ai-drawer-body{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;z-index:1}.ai-chat-container{flex:1;display:flex;flex-direction:column;overflow-y:auto;padding:.9375rem 1.5625rem}.ai-chat-container::-webkit-scrollbar{width:6px}.ai-chat-container::-webkit-scrollbar-track{background:#F1F2F5}.ai-chat-container::-webkit-scrollbar-thumb{background:#C3CBDC;border-radius:3px}.ai-chat-container::-webkit-scrollbar-thumb:hover{background:#5B6D80}.ai-message-list{display:flex;flex-direction:column;gap:.9375rem}.ai-message-wrapper{display:flex;flex-direction:column}.ai-message-wrapper[data-message-type=user]{align-items:flex-end}.ai-message-wrapper[data-message-type=ai],.ai-message-wrapper[data-message-type=system],.ai-message-wrapper.ai-loading-message{align-items:flex-start}.ai-message-timestamp-container{margin-bottom:.625rem;text-align:center;width:100%;align-self:center}.ai-message-timestamp-container .ai-message-timestamp{font-size:.75rem;color:#82919f;font-weight:500}.ai-message-bubble{max-width:80%;border-radius:12px;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;animation:messageSlideIn .3s ease-out;display:flex;gap:.625rem}.ai-message-bubble.user-message{background-color:#2b8ff3;color:#fff;border-bottom-right-radius:4px;padding:.625rem .9375rem;justify-content:flex-end}.ai-message-bubble.user-message .ai-message-content-wrapper{display:flex;flex-direction:column;align-items:flex-end}.ai-message-bubble.ai-message{background-color:#fff;border:1px solid #D2D8E5;color:#08203e;border-bottom-left-radius:4px;padding:.625rem .9375rem;align-items:flex-start}.ai-message-bubble.ai-message .ai-message-icon{flex:0 0 auto;width:24px;height:24px;display:flex;align-items:center;justify-content:center;margin-top:2px;background:linear-gradient(90deg,#a21aff,#351cc1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent}.ai-message-bubble.ai-message .ai-message-icon symphony-icon{font-size:.875rem}.ai-message-bubble.ai-message .ai-message-content-wrapper{flex:1;display:flex;flex-direction:column}.ai-message-bubble.system-message{background-color:#f1f2f5;border:1px solid #E4E7EF;color:#5b6d80;border-radius:8px;text-align:center;max-width:90%;padding:.625rem .9375rem;justify-content:center}.ai-message-bubble.system-message .ai-message-content{font-size:.875rem}@media (max-width: 768px){.ai-message-bubble{max-width:90%}}.ai-message-status{margin-top:.3rem;text-align:right}.ai-message-status .ai-status-text{display:inline-flex;gap:4px;font-size:.75rem;font-weight:500}.ai-message-status .ai-status-text.status-delivered{color:#5b6d80}.ai-message-status .ai-status-text.status-delivered .ai-status-icon{color:#2cb45f;font-size:12px}.ai-message-status .ai-status-text.status-pending{color:#5b6d80}.ai-message-status .ai-status-text.status-pending .ai-status-loader{width:12px;height:12px}.ai-message-status .ai-status-text.status-error{color:#ac4463}.ai-message-status .ai-status-text.status-error .ai-status-icon{color:#ac4463;font-size:12px}.ai-loading-message .ai-message-bubble .ai-message-icon{flex:0 0 auto;width:24px;height:24px;background-color:#f0f8ff;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-top:2px}.ai-loading-message .ai-message-bubble .ai-message-icon symphony-icon{color:#2b8ff3;font-size:.875rem}.ai-loading-message .ai-message-bubble .ai-loading-content{display:flex;align-items:center;gap:.625rem;flex:1}.ai-loading-message .ai-message-bubble .ai-loading-text{font-style:italic;color:#5b6d80;font-size:.875rem}.ai-suggested-prompts-section{border-top:1px solid #E4E7EF;background-color:#f1f2f5;margin-bottom:0;position:relative;min-height:48px}.ai-prompts-intro-row{position:relative;padding:12px 14px 0;display:flex;align-items:center}.ai-prompts-intro-row .ai-prompts-intro{margin:0 auto;padding:0;font-size:.875rem;color:#5b6d80;line-height:1.4;text-align:center;position:relative;max-width:calc(100% - 60px);display:block}.ai-prompts-intro-row .ai-suggestions-toggle-compact{right:8px;width:28px;height:28px;border-radius:50%;border:none;background:#fff;color:#712ace;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s;box-shadow:0 1px 4px rgba(80,0,120,.04);font-size:15px;padding:0;margin:0}.ai-prompts-intro-row .ai-suggestions-toggle-compact:hover:not(:disabled){background:#f3f0ff;color:#5a21a4}.ai-prompts-intro-row .ai-suggestions-toggle-compact:focus{outline:2px solid #814DFF;outline-offset:2px}.ai-prompts-intro-row .ai-suggestions-toggle-compact:disabled{opacity:.5;cursor:not-allowed}.ai-prompts-intro-row .ai-suggestions-toggle-compact symphony-icon{font-size:15px;transition:transform .2s;transform:rotate(0)}.ai-prompts-intro-row .ai-suggestions-toggle-compact.suggestions-open symphony-icon{transform:rotate(180deg)}.ai-suggested-prompts{position:static;max-height:0;overflow:hidden;transition:max-height .3s cubic-bezier(.4,0,.2,1);opacity:0;padding:1.25rem 1.5625rem;background-color:#f1f2f5}.ai-suggested-prompts.open{max-height:500px;opacity:1}.ai-suggested-prompts.disabled{opacity:.7;pointer-events:none}.ai-suggested-prompts .ai-prompt-button:disabled{cursor:not-allowed;opacity:.7}.ai-suggested-prompts .ai-prompts-intro{font-size:.875rem;color:#5b6d80;text-align:center;line-height:1.4}.ai-suggested-prompts .ai-prompts-list{display:flex;flex-direction:column;gap:.625rem}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button{display:flex;align-items:center;gap:.625rem;padding:.625rem .9375rem;border:1px solid #C5AEFF;border-radius:24px;background-color:transparent;color:#712ace;cursor:pointer;transition:all .2s ease;text-align:left;font-size:.875rem;min-height:48px}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:hover{background-color:#f3f0ff;border-color:#9d79ff;transform:translateY(-1px)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button:active{transform:translateY(0)}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-icon{flex:0 0 auto;color:#712ace;font-size:16px;display:flex}.ai-suggested-prompts .ai-prompts-list .ai-prompt-button .ai-prompt-text{flex:1;font-weight:400;line-height:1.3}.ai-drawer-footer{padding:.9375rem 1.5625rem 1.25rem;border-top:1px solid #D2D8E5;background-color:#fff;position:relative;z-index:1}.ai-suggested-prompts-section+.ai-drawer-footer{padding-top:.3rem;padding-bottom:.9375rem}.ai-input-row symphony-input-textarea-with-send{width:100%}.ai-footer-actions{text-align:center}.ai-footer-actions symphony-button-v2{font-size:.75rem;color:#5b6d80}.ai-footer-actions symphony-button-v2:hover{color:#08203e}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (prefers-contrast: high){.ai-drawer-container{border:2px solid #08203E}.ai-message-bubble.user-message{border:1px solid #0a5cae}.ai-message-bubble.ai-message{border:2px solid #5B6D80}.ai-message-bubble.system-message{border:2px solid #C3CBDC}}@media (prefers-reduced-motion: reduce){.ai-drawer-container,.ai-message-bubble,.ai-drawer-edge-toggle{transition:none;animation:none}}\n"] }]
7789
7832
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { model: [{
7790
7833
  type: Input
7791
7834
  }], config: [{