npm - @symphony-talent/component-library - Versions diffs - 4.227.0 → 4.229.0 - Mend

@symphony-talent/component-library 4.227.0 → 4.229.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 (154) hide show

package/esm2020/lib/molecules/settings-detail-navigation-item/settings-detail-navigation-item.component.mjs CHANGED Viewed

@@ -13,7 +13,7 @@ export class SettingsDetailNavigationItemComponent {
     }
 }
 SettingsDetailNavigationItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SettingsDetailNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: SettingsDetailNavigationItemComponent, selector: "symphony-settings-detail-navigation-item", inputs: { settingDetailNavigationModel: "settingDetailNavigationModel" }, outputs: { settingNavigationClicked: "settingNavigationClicked" }, ngImport: i0, template: "<div *ngIf=\"settingDetailNavigationModel\"\n  class=\"setting-navigation-item-wrap sfx-cursor-pointer\"\n  [ngClass]=\"{ active: settingDetailNavigationModel.isActive }\"\n  (click)=\"onSettingNavigationClick($event)\"\n  title=\"{{ settingDetailNavigationModel.settingNavigationText }}\"\n  id=\"navigation-tab-{{ settingDetailNavigationModel.settingNavigationText | trimId}}\"\n>\n  <symphony-paragraph\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n    class=\"sfx-font-bold\"\n  >\n    {{ settingDetailNavigationModel.settingNavigationText }}\n  </symphony-paragraph>\n  <symphony-icon\n    class=\"icon-position\"\n    [size]=\"'14px'\"\n    [icon]=\"'si-arrow-bold-next'\"\n    *ngIf=\"settingDetailNavigationModel.isActive\"\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n  ></symphony-icon>\n</div>\n", styles: [".setting-navigation-item-wrap{display:flex;justify-content:space-between;padding:10px 15px;border-radius:4px}.setting-navigation-item-wrap .icon-position{position:relative;top:2px}.setting-navigation-item-wrap.active{background:#f3efff}.setting-navigation-item-wrap:hover{color:#712ace}\n"], components: [{ type: i1.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "trimId": i4.TrimIdPipe } });
+SettingsDetailNavigationItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: SettingsDetailNavigationItemComponent, selector: "symphony-settings-detail-navigation-item", inputs: { settingDetailNavigationModel: "settingDetailNavigationModel" }, outputs: { settingNavigationClicked: "settingNavigationClicked" }, ngImport: i0, template: "<div *ngIf=\"settingDetailNavigationModel\"\n  class=\"setting-navigation-item-wrap sfx-cursor-pointer\"\n  [ngClass]=\"{ active: settingDetailNavigationModel.isActive }\"\n  (click)=\"onSettingNavigationClick($event)\"\n  title=\"{{ settingDetailNavigationModel.settingNavigationText }}\"\n  id=\"navigation-tab-{{ settingDetailNavigationModel.settingNavigationText | trimId}}\"\n>\n  <symphony-paragraph\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n    class=\"sfx-font-bold\"\n  >\n    {{ settingDetailNavigationModel.settingNavigationText }}\n  </symphony-paragraph>\n  <symphony-icon\n    class=\"icon-position\"\n    [size]=\"'14px'\"\n    [icon]=\"'si-arrow-bold-next'\"\n    *ngIf=\"settingDetailNavigationModel.isActive\"\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n  ></symphony-icon>\n</div>\n", styles: [".setting-navigation-item-wrap{display:flex;justify-content:space-between;padding:10px 15px;border-radius:4px}.setting-navigation-item-wrap .icon-position{position:relative;top:2px}.setting-navigation-item-wrap.active{background:#f3efff}.setting-navigation-item-wrap:hover{color:#712ace}\n"], components: [{ type: i1.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "trimId": i4.TrimIdPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: SettingsDetailNavigationItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-settings-detail-navigation-item', template: "<div *ngIf=\"settingDetailNavigationModel\"\n  class=\"setting-navigation-item-wrap sfx-cursor-pointer\"\n  [ngClass]=\"{ active: settingDetailNavigationModel.isActive }\"\n  (click)=\"onSettingNavigationClick($event)\"\n  title=\"{{ settingDetailNavigationModel.settingNavigationText }}\"\n  id=\"navigation-tab-{{ settingDetailNavigationModel.settingNavigationText | trimId}}\"\n>\n  <symphony-paragraph\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n    class=\"sfx-font-bold\"\n  >\n    {{ settingDetailNavigationModel.settingNavigationText }}\n  </symphony-paragraph>\n  <symphony-icon\n    class=\"icon-position\"\n    [size]=\"'14px'\"\n    [icon]=\"'si-arrow-bold-next'\"\n    *ngIf=\"settingDetailNavigationModel.isActive\"\n    [ngClass]=\"{ 'sfx-v2-purple1': settingDetailNavigationModel.isActive }\"\n  ></symphony-icon>\n</div>\n", styles: [".setting-navigation-item-wrap{display:flex;justify-content:space-between;padding:10px 15px;border-radius:4px}.setting-navigation-item-wrap .icon-position{position:relative;top:2px}.setting-navigation-item-wrap.active{background:#f3efff}.setting-navigation-item-wrap:hover{color:#712ace}\n"] }]

package/esm2020/lib/molecules/task/task.component.mjs CHANGED Viewed

@@ -15,7 +15,7 @@ export class TaskComponent {
     }
 }
 TaskComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TaskComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TaskComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: TaskComponent, selector: "symphony-task", inputs: { taskModel: "taskModel" }, ngImport: i0, template: "<div class=\"sfx-task\">\n  <symphony-task-icon\n    class=\"task-icon\"\n    [isComplete]=\"taskModel.isComplete\"\n  ></symphony-task-icon>\n  <div class=\"task-content\">\n    <symphony-h3 [text]=\"taskModel.title\"></symphony-h3>\n    <div class=\"time-and-assigned\">\n      <symphony-paragraph [text]=\"taskModel.dueDate\"></symphony-paragraph>\n      <symphony-paragraph [text]=\"taskModel.assignee\"></symphony-paragraph>\n    </div>\n  </div>\n  <symphony-contextual-menu\n    class=\"task-more-option\"\n    *ngIf=\"taskModel.moreActions && taskModel.moreActions.items.length > 0\"\n    [model]=\"taskModel.moreActions\"\n  >\n  </symphony-contextual-menu>\n</div>\n", styles: ["*{font-family:neuzeit-grotesk,sans-serif!important}.sfx-task{display:flex;align-items:center;padding:30px 0;border-bottom:1px solid #d9d9d9}.sfx-task symphony-task{font-size:14px;letter-spacing:-1px}.sfx-task symphony-task-icon{margin-right:20px}.sfx-task .task-content{width:80%;height:50px}.sfx-task symphony-contextual-menu{margin-left:auto}.sfx-task symphony-paragraph{display:inline-block;margin-right:20px}.sfx-task .time-and-assigned{margin-bottom:-10px}\n"], components: [{ type: i1.TaskIconComponent, selector: "symphony-task-icon", inputs: ["isComplete"] }, { type: i2.H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i4.ContextualMenuComponent, selector: "symphony-contextual-menu", inputs: ["model"], outputs: ["itemClick"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TaskComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: TaskComponent, selector: "symphony-task", inputs: { taskModel: "taskModel" }, ngImport: i0, template: "<div class=\"sfx-task\">\n  <symphony-task-icon\n    class=\"task-icon\"\n    [isComplete]=\"taskModel.isComplete\"\n  ></symphony-task-icon>\n  <div class=\"task-content\">\n    <symphony-h3 [text]=\"taskModel.title\"></symphony-h3>\n    <div class=\"time-and-assigned\">\n      <symphony-paragraph [text]=\"taskModel.dueDate\"></symphony-paragraph>\n      <symphony-paragraph [text]=\"taskModel.assignee\"></symphony-paragraph>\n    </div>\n  </div>\n  <symphony-contextual-menu\n    class=\"task-more-option\"\n    *ngIf=\"taskModel.moreActions && taskModel.moreActions.items.length > 0\"\n    [model]=\"taskModel.moreActions\"\n  >\n  </symphony-contextual-menu>\n</div>\n", styles: ["*{font-family:neuzeit-grotesk,sans-serif!important}.sfx-task{display:flex;align-items:center;padding:30px 0;border-bottom:1px solid #d9d9d9}.sfx-task symphony-task{font-size:14px;letter-spacing:-1px}.sfx-task symphony-task-icon{margin-right:20px}.sfx-task .task-content{width:80%;height:50px}.sfx-task symphony-contextual-menu{margin-left:auto}.sfx-task symphony-paragraph{display:inline-block;margin-right:20px}.sfx-task .time-and-assigned{margin-bottom:-10px}\n"], components: [{ type: i1.TaskIconComponent, selector: "symphony-task-icon", inputs: ["isComplete"] }, { type: i2.H3Component, selector: "symphony-h3", inputs: ["text", "isSecondary"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i4.ContextualMenuComponent, selector: "symphony-contextual-menu", inputs: ["model"], outputs: ["itemClick"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TaskComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-task', template: "<div class=\"sfx-task\">\n  <symphony-task-icon\n    class=\"task-icon\"\n    [isComplete]=\"taskModel.isComplete\"\n  ></symphony-task-icon>\n  <div class=\"task-content\">\n    <symphony-h3 [text]=\"taskModel.title\"></symphony-h3>\n    <div class=\"time-and-assigned\">\n      <symphony-paragraph [text]=\"taskModel.dueDate\"></symphony-paragraph>\n      <symphony-paragraph [text]=\"taskModel.assignee\"></symphony-paragraph>\n    </div>\n  </div>\n  <symphony-contextual-menu\n    class=\"task-more-option\"\n    *ngIf=\"taskModel.moreActions && taskModel.moreActions.items.length > 0\"\n    [model]=\"taskModel.moreActions\"\n  >\n  </symphony-contextual-menu>\n</div>\n", styles: ["*{font-family:neuzeit-grotesk,sans-serif!important}.sfx-task{display:flex;align-items:center;padding:30px 0;border-bottom:1px solid #d9d9d9}.sfx-task symphony-task{font-size:14px;letter-spacing:-1px}.sfx-task symphony-task-icon{margin-right:20px}.sfx-task .task-content{width:80%;height:50px}.sfx-task symphony-contextual-menu{margin-left:auto}.sfx-task symphony-paragraph{display:inline-block;margin-right:20px}.sfx-task .time-and-assigned{margin-bottom:-10px}\n"] }]

package/esm2020/lib/molecules/task-status/task-status.component.mjs CHANGED Viewed

@@ -50,7 +50,7 @@ export class TaskStatusComponent {
     }
 }
 TaskStatusComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TaskStatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TaskStatusComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: TaskStatusComponent, selector: "symphony-task-status", inputs: { taskStatusModel: "taskStatusModel" }, outputs: { cancelTask: "cancelTask", retryTask: "retryTask" }, ngImport: i0, template: "<!-- Task Status - Card-based Design -->\n<div class=\"task-status\" *ngIf=\"taskStatusModel\">\n  <!-- Task Status Card -->\n  <div class=\"task-card\" \n       [class.success-state]=\"taskStatusModel.showCompleted\"\n       [class.error-state]=\"taskStatusModel.hasError\"\n       [class.progress-state]=\"taskStatusModel.showProgressBar\">\n    \n    <!-- Card Header -->\n    <div class=\"task-header\">\n      <!-- Status Icon -->\n      <div class=\"task-icon-container\">\n        <!-- Success Icon (completion state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showCompleted\"\n          class=\"task-icon success-icon\"\n          [icon]=\"'si-confirmation'\"\n        ></symphony-icon>\n        \n        <!-- Error Icon (error state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.hasError\"\n          class=\"task-icon error-icon\"\n          [icon]=\"'si-pending-incomplete'\"\n        ></symphony-icon>\n        \n        <!-- Processing Icon (progress state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n          class=\"task-icon processing-icon\"\n          [icon]=\"taskStatusModel.processingIcon || 'si-chatbot'\"\n        ></symphony-icon>\n      </div>\n      \n      <!-- Status Text and Task Name -->\n      <div class=\"task-content\">\n        <symphony-h4 class=\"task-status-text\">\n          {{ getTaskStatusText() }}\n        </symphony-h4>\n        <symphony-paragraph class=\"task-name\">\n          {{ getTaskName() }}\n        </symphony-paragraph>\n      </div>\n      \n      <!-- Progress Percentage or Actions -->\n      <div class=\"task-actions\">\n        <!-- Progress Percentage -->\n        <symphony-paragraph\n          *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n          class=\"progress-text\">\n          {{ getProgressText() }}\n        </symphony-paragraph>\n        \n        <!-- Cancel Button (only during progress) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showCancel && !taskStatusModel.showCompleted && !taskStatusModel.hasError\"\n          class=\"cancel-btn\"\n          [icon]=\"'si-close-modal'\"\n          (clicked)=\"onCancelTask()\">\n        </symphony-icon>\n      </div>\n    </div>\n    \n    <!-- Card Body -->\n    <div class=\"task-body\">\n      <!-- Progress Bar -->\n      <symphony-sfx-progress-bar\n        *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n        [progress]=\"taskStatusModel.progress\"\n        class=\"progress-bar\">\n      </symphony-sfx-progress-bar>\n      \n      <!-- Error Message -->\n      <div *ngIf=\"taskStatusModel.hasError\" class=\"error-content\">\n        <symphony-paragraph class=\"error-message\">\n          {{ getErrorMessage() }}\n        </symphony-paragraph>\n        <symphony-icon-wrapper \n          *ngIf=\"shouldShowRetry()\"\n          class=\"retry-icon\"\n          (clicked)=\"onRetryTask()\">\n          <symphony-icon [icon]=\"'si-refresh'\"></symphony-icon>\n        </symphony-icon-wrapper>\n      </div>\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}.task-status .task-card{background:#F1F2F5;border:1px solid #D2D8E5;border-radius:8px;padding:16px;margin:8px 0;transition:all .3s ease;min-height:80px}.task-status .task-card.success-state{border-color:#2cb45f;background:#f8fff9}.task-status .task-card.error-state{border-color:#ac4463;background:#fff8f8}.task-status .task-card.progress-state{border-color:#2b8ff3;background:#f8f9ff}.task-status .task-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}.task-status .task-icon-container{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%}.task-status .task-icon-container .task-icon{font-size:18px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%}.task-status .task-icon-container .success-icon{color:#2cb45f;background:#d2f4de}.task-status .task-icon-container .error-icon{color:#ac4463;background:#f4e2e7}.task-status .task-icon-container .processing-icon{color:#2b8ff3;background:white}.task-status .task-content{flex:1;min-width:0}.task-status .task-content .task-status-text{margin:0 0 4px;font-weight:600;font-size:.875rem;color:#08203e}.task-status .task-content .task-name{margin:0;font-size:.75rem;color:#5b6d80;line-height:1.4;word-wrap:break-word}.task-status .task-actions{flex-shrink:0;display:flex;align-items:center;gap:8px}.task-status .task-actions .progress-text{margin:0;font-weight:600;font-size:.75rem;color:#2b8ff3;min-width:35px;text-align:right}.task-status .task-actions .cancel-btn{cursor:pointer;font-size:16px;color:#5b6d80;transition:color .2s ease;padding:4px}.task-status .task-actions .cancel-btn:hover{color:#ac4463}.task-status .task-body .progress-bar{margin:0}.task-status .task-body .error-content{display:flex;align-items:center;justify-content:space-between;gap:12px}.task-status .task-body .error-content .error-message{margin:0;font-size:.75rem;color:#ac4463;line-height:1.4;flex:1}.task-status .task-body .error-content .retry-icon{flex-shrink:0;width:32px;height:32px}.task-status .task-body .error-content .retry-icon ::ng-deep .icon-wrapper{width:32px;height:32px;border:1px solid #AC4463;color:#ac4463;padding:6px;font-size:14px}.task-status .task-body .error-content .retry-icon ::ng-deep .icon-wrapper:hover{background:#AC4463;color:#fff}.task-status symphony-sfx-progress-bar{transition:all .3s ease;float:none}\n"], components: [{ type: i1.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i2.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i4.SfxProgressBarComponent, selector: "symphony-sfx-progress-bar", inputs: ["progress"] }, { type: i5.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+TaskStatusComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: TaskStatusComponent, selector: "symphony-task-status", inputs: { taskStatusModel: "taskStatusModel" }, outputs: { cancelTask: "cancelTask", retryTask: "retryTask" }, ngImport: i0, template: "<!-- Task Status - Card-based Design -->\n<div class=\"task-status\" *ngIf=\"taskStatusModel\">\n  <!-- Task Status Card -->\n  <div class=\"task-card\" \n       [class.success-state]=\"taskStatusModel.showCompleted\"\n       [class.error-state]=\"taskStatusModel.hasError\"\n       [class.progress-state]=\"taskStatusModel.showProgressBar\">\n    \n    <!-- Card Header -->\n    <div class=\"task-header\">\n      <!-- Status Icon -->\n      <div class=\"task-icon-container\">\n        <!-- Success Icon (completion state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showCompleted\"\n          class=\"task-icon success-icon\"\n          [icon]=\"'si-confirmation'\"\n        ></symphony-icon>\n        \n        <!-- Error Icon (error state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.hasError\"\n          class=\"task-icon error-icon\"\n          [icon]=\"'si-pending-incomplete'\"\n        ></symphony-icon>\n        \n        <!-- Processing Icon (progress state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n          class=\"task-icon processing-icon\"\n          [icon]=\"taskStatusModel.processingIcon || 'si-chatbot'\"\n        ></symphony-icon>\n      </div>\n      \n      <!-- Status Text and Task Name -->\n      <div class=\"task-content\">\n        <symphony-h4 class=\"task-status-text\">\n          {{ getTaskStatusText() }}\n        </symphony-h4>\n        <symphony-paragraph class=\"task-name\">\n          {{ getTaskName() }}\n        </symphony-paragraph>\n      </div>\n      \n      <!-- Progress Percentage or Actions -->\n      <div class=\"task-actions\">\n        <!-- Progress Percentage -->\n        <symphony-paragraph\n          *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n          class=\"progress-text\">\n          {{ getProgressText() }}\n        </symphony-paragraph>\n        \n        <!-- Cancel Button (only during progress) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showCancel && !taskStatusModel.showCompleted && !taskStatusModel.hasError\"\n          class=\"cancel-btn\"\n          [icon]=\"'si-close-modal'\"\n          (clicked)=\"onCancelTask()\">\n        </symphony-icon>\n      </div>\n    </div>\n    \n    <!-- Card Body -->\n    <div class=\"task-body\">\n      <!-- Progress Bar -->\n      <symphony-sfx-progress-bar\n        *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n        [progress]=\"taskStatusModel.progress\"\n        class=\"progress-bar\">\n      </symphony-sfx-progress-bar>\n      \n      <!-- Error Message -->\n      <div *ngIf=\"taskStatusModel.hasError\" class=\"error-content\">\n        <symphony-paragraph class=\"error-message\">\n          {{ getErrorMessage() }}\n        </symphony-paragraph>\n        <symphony-icon-wrapper \n          *ngIf=\"shouldShowRetry()\"\n          class=\"retry-icon\"\n          (clicked)=\"onRetryTask()\">\n          <symphony-icon [icon]=\"'si-refresh'\"></symphony-icon>\n        </symphony-icon-wrapper>\n      </div>\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}.task-status .task-card{background:#F1F2F5;border:1px solid #D2D8E5;border-radius:8px;padding:16px;margin:8px 0;transition:all .3s ease;min-height:80px}.task-status .task-card.success-state{border-color:#2cb45f;background:#f8fff9}.task-status .task-card.error-state{border-color:#ac4463;background:#fff8f8}.task-status .task-card.progress-state{border-color:#2b8ff3;background:#f8f9ff}.task-status .task-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}.task-status .task-icon-container{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%}.task-status .task-icon-container .task-icon{font-size:18px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%}.task-status .task-icon-container .success-icon{color:#2cb45f;background:#d2f4de}.task-status .task-icon-container .error-icon{color:#ac4463;background:#f4e2e7}.task-status .task-icon-container .processing-icon{color:#2b8ff3;background:white}.task-status .task-content{flex:1;min-width:0}.task-status .task-content .task-status-text{margin:0 0 4px;font-weight:600;font-size:.875rem;color:#08203e}.task-status .task-content .task-name{margin:0;font-size:.75rem;color:#5b6d80;line-height:1.4;word-wrap:break-word}.task-status .task-actions{flex-shrink:0;display:flex;align-items:center;gap:8px}.task-status .task-actions .progress-text{margin:0;font-weight:600;font-size:.75rem;color:#2b8ff3;min-width:35px;text-align:right}.task-status .task-actions .cancel-btn{cursor:pointer;font-size:16px;color:#5b6d80;transition:color .2s ease;padding:4px}.task-status .task-actions .cancel-btn:hover{color:#ac4463}.task-status .task-body .progress-bar{margin:0}.task-status .task-body .error-content{display:flex;align-items:center;justify-content:space-between;gap:12px}.task-status .task-body .error-content .error-message{margin:0;font-size:.75rem;color:#ac4463;line-height:1.4;flex:1}.task-status .task-body .error-content .retry-icon{flex-shrink:0;width:32px;height:32px}.task-status .task-body .error-content .retry-icon ::ng-deep .icon-wrapper{width:32px;height:32px;border:1px solid #AC4463;color:#ac4463;padding:6px;font-size:14px}.task-status .task-body .error-content .retry-icon ::ng-deep .icon-wrapper:hover{background:#AC4463;color:#fff}.task-status symphony-sfx-progress-bar{transition:all .3s ease;float:none}\n"], components: [{ type: i1.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i2.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i4.SfxProgressBarComponent, selector: "symphony-sfx-progress-bar", inputs: ["progress"] }, { type: i5.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: TaskStatusComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-task-status', template: "<!-- Task Status - Card-based Design -->\n<div class=\"task-status\" *ngIf=\"taskStatusModel\">\n  <!-- Task Status Card -->\n  <div class=\"task-card\" \n       [class.success-state]=\"taskStatusModel.showCompleted\"\n       [class.error-state]=\"taskStatusModel.hasError\"\n       [class.progress-state]=\"taskStatusModel.showProgressBar\">\n    \n    <!-- Card Header -->\n    <div class=\"task-header\">\n      <!-- Status Icon -->\n      <div class=\"task-icon-container\">\n        <!-- Success Icon (completion state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showCompleted\"\n          class=\"task-icon success-icon\"\n          [icon]=\"'si-confirmation'\"\n        ></symphony-icon>\n        \n        <!-- Error Icon (error state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.hasError\"\n          class=\"task-icon error-icon\"\n          [icon]=\"'si-pending-incomplete'\"\n        ></symphony-icon>\n        \n        <!-- Processing Icon (progress state) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n          class=\"task-icon processing-icon\"\n          [icon]=\"taskStatusModel.processingIcon || 'si-chatbot'\"\n        ></symphony-icon>\n      </div>\n      \n      <!-- Status Text and Task Name -->\n      <div class=\"task-content\">\n        <symphony-h4 class=\"task-status-text\">\n          {{ getTaskStatusText() }}\n        </symphony-h4>\n        <symphony-paragraph class=\"task-name\">\n          {{ getTaskName() }}\n        </symphony-paragraph>\n      </div>\n      \n      <!-- Progress Percentage or Actions -->\n      <div class=\"task-actions\">\n        <!-- Progress Percentage -->\n        <symphony-paragraph\n          *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n          class=\"progress-text\">\n          {{ getProgressText() }}\n        </symphony-paragraph>\n        \n        <!-- Cancel Button (only during progress) -->\n        <symphony-icon\n          *ngIf=\"taskStatusModel.showCancel && !taskStatusModel.showCompleted && !taskStatusModel.hasError\"\n          class=\"cancel-btn\"\n          [icon]=\"'si-close-modal'\"\n          (clicked)=\"onCancelTask()\">\n        </symphony-icon>\n      </div>\n    </div>\n    \n    <!-- Card Body -->\n    <div class=\"task-body\">\n      <!-- Progress Bar -->\n      <symphony-sfx-progress-bar\n        *ngIf=\"taskStatusModel.showProgressBar && !taskStatusModel.hasError\"\n        [progress]=\"taskStatusModel.progress\"\n        class=\"progress-bar\">\n      </symphony-sfx-progress-bar>\n      \n      <!-- Error Message -->\n      <div *ngIf=\"taskStatusModel.hasError\" class=\"error-content\">\n        <symphony-paragraph class=\"error-message\">\n          {{ getErrorMessage() }}\n        </symphony-paragraph>\n        <symphony-icon-wrapper \n          *ngIf=\"shouldShowRetry()\"\n          class=\"retry-icon\"\n          (clicked)=\"onRetryTask()\">\n          <symphony-icon [icon]=\"'si-refresh'\"></symphony-icon>\n        </symphony-icon-wrapper>\n      </div>\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}.task-status .task-card{background:#F1F2F5;border:1px solid #D2D8E5;border-radius:8px;padding:16px;margin:8px 0;transition:all .3s ease;min-height:80px}.task-status .task-card.success-state{border-color:#2cb45f;background:#f8fff9}.task-status .task-card.error-state{border-color:#ac4463;background:#fff8f8}.task-status .task-card.progress-state{border-color:#2b8ff3;background:#f8f9ff}.task-status .task-header{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}.task-status .task-icon-container{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%}.task-status .task-icon-container .task-icon{font-size:18px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%}.task-status .task-icon-container .success-icon{color:#2cb45f;background:#d2f4de}.task-status .task-icon-container .error-icon{color:#ac4463;background:#f4e2e7}.task-status .task-icon-container .processing-icon{color:#2b8ff3;background:white}.task-status .task-content{flex:1;min-width:0}.task-status .task-content .task-status-text{margin:0 0 4px;font-weight:600;font-size:.875rem;color:#08203e}.task-status .task-content .task-name{margin:0;font-size:.75rem;color:#5b6d80;line-height:1.4;word-wrap:break-word}.task-status .task-actions{flex-shrink:0;display:flex;align-items:center;gap:8px}.task-status .task-actions .progress-text{margin:0;font-weight:600;font-size:.75rem;color:#2b8ff3;min-width:35px;text-align:right}.task-status .task-actions .cancel-btn{cursor:pointer;font-size:16px;color:#5b6d80;transition:color .2s ease;padding:4px}.task-status .task-actions .cancel-btn:hover{color:#ac4463}.task-status .task-body .progress-bar{margin:0}.task-status .task-body .error-content{display:flex;align-items:center;justify-content:space-between;gap:12px}.task-status .task-body .error-content .error-message{margin:0;font-size:.75rem;color:#ac4463;line-height:1.4;flex:1}.task-status .task-body .error-content .retry-icon{flex-shrink:0;width:32px;height:32px}.task-status .task-body .error-content .retry-icon ::ng-deep .icon-wrapper{width:32px;height:32px;border:1px solid #AC4463;color:#ac4463;padding:6px;font-size:14px}.task-status .task-body .error-content .retry-icon ::ng-deep .icon-wrapper:hover{background:#AC4463;color:#fff}.task-status symphony-sfx-progress-bar{transition:all .3s ease;float:none}\n"] }]

package/esm2020/lib/organisms/action-bar/action-bar.component.mjs CHANGED Viewed

@@ -15,7 +15,7 @@ export class ActionBarComponent {
     }
 }
 ActionBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ActionBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarComponent, selector: "symphony-action-bar", inputs: { isToggled: "isToggled", hasActionToggle: "hasActionToggle", hasSelectionCounter: "hasSelectionCounter", hasSeparator: "hasSeparator", model: "model" }, outputs: { toggleClick: "toggleClick" }, ngImport: i0, template: "<div class=\"sfx-title-wrap sfx-pb-30 sfx-action-bar\">\n  <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3 sfx-p-0 sfx-action-button\">\n    <div class=\"max-contentwidth\" (click)=\"toggleClicked()\" *ngIf=\"hasActionToggle\">\n      <symphony-icon-wrapper\n        [ngClass]=\"{ 'action-arrow-down': isToggled }\"\n        class=\"sfx-d-inline-block\"\n        ><symphony-icon\n          [icon]=\"'si-arrow-bold-next'\"\n          [size]=\"'13px'\"\n        ></symphony-icon>\n      </symphony-icon-wrapper>\n      <symphony-paragraph class=\"sfx-d-inline-block sfx-ml-20\"\n        >Actions</symphony-paragraph\n      >\n    </div>\n    <symphony-action-bar-selection-counter *ngIf=\"hasSelectionCounter\" [hasSeparator]=\"hasSeparator\" [model]=\"model\"></symphony-action-bar-selection-counter>\n  </div>\n  <div class=\"col-xs-12 col-sm-6 col-md-8 col-lg-9 sfx-p-0\">\n    <div class=\"pull-right sfx-actions-controls\">\n      <ng-content select=\"[grid-controls]\"></ng-content>\n    </div>\n  </div>\n</div>\n<div\n  *ngIf=\"isToggled\"\n  class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-border-bottom-gray-1 sfx-p-0\"\n>\n  <div class=\"col-xs-11 col-sm-11 col-md-11 col-lg-11 sfx-pl-0 sfx-actions-items\">\n    <ng-content select=\"[grid-actions]\"></ng-content>\n  </div>\n</div>\n", styles: [".sfx-action-bar{display:inline-block;width:100%;border-bottom:2px solid #000000}.sfx-action-bar .sfx-action-button,.sfx-action-bar .sfx-action-button .max-contentwidth{display:flex;align-items:center}.sfx-action-bar .sfx-action-button .icon-wrapper{padding:10px 0}.sfx-action-bar .sfx-action-button .icon-wrapper i{font-weight:600;margin-left:1px}.sfx-action-bar .sfx-action-button .action-arrow-down{transform:rotate(90deg)}.sfx-action-bar .sfx-action-button .action-arrow-down i{margin-left:0}.sfx-actions-items{margin-top:1.875rem;padding-bottom:1.25rem}\n"], components: [{ type: i1.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i4.ActionBarSelectionCounterComponent, selector: "symphony-action-bar-selection-counter", inputs: ["model", "hasSeparator"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None });
+ActionBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: ActionBarComponent, selector: "symphony-action-bar", inputs: { isToggled: "isToggled", hasActionToggle: "hasActionToggle", hasSelectionCounter: "hasSelectionCounter", hasSeparator: "hasSeparator", model: "model" }, outputs: { toggleClick: "toggleClick" }, ngImport: i0, template: "<div class=\"sfx-title-wrap sfx-pb-30 sfx-action-bar\">\n  <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3 sfx-p-0 sfx-action-button\">\n    <div class=\"max-contentwidth\" (click)=\"toggleClicked()\" *ngIf=\"hasActionToggle\">\n      <symphony-icon-wrapper\n        [ngClass]=\"{ 'action-arrow-down': isToggled }\"\n        class=\"sfx-d-inline-block\"\n        ><symphony-icon\n          [icon]=\"'si-arrow-bold-next'\"\n          [size]=\"'13px'\"\n        ></symphony-icon>\n      </symphony-icon-wrapper>\n      <symphony-paragraph class=\"sfx-d-inline-block sfx-ml-20\"\n        >Actions</symphony-paragraph\n      >\n    </div>\n    <symphony-action-bar-selection-counter *ngIf=\"hasSelectionCounter\" [hasSeparator]=\"hasSeparator\" [model]=\"model\"></symphony-action-bar-selection-counter>\n  </div>\n  <div class=\"col-xs-12 col-sm-6 col-md-8 col-lg-9 sfx-p-0\">\n    <div class=\"pull-right sfx-actions-controls\">\n      <ng-content select=\"[grid-controls]\"></ng-content>\n    </div>\n  </div>\n</div>\n<div\n  *ngIf=\"isToggled\"\n  class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-border-bottom-gray-1 sfx-p-0\"\n>\n  <div class=\"col-xs-11 col-sm-11 col-md-11 col-lg-11 sfx-pl-0 sfx-actions-items\">\n    <ng-content select=\"[grid-actions]\"></ng-content>\n  </div>\n</div>\n", styles: [".sfx-action-bar{display:inline-block;width:100%;border-bottom:2px solid #000000}.sfx-action-bar .sfx-action-button,.sfx-action-bar .sfx-action-button .max-contentwidth{display:flex;align-items:center}.sfx-action-bar .sfx-action-button .icon-wrapper{padding:10px 0}.sfx-action-bar .sfx-action-button .icon-wrapper i{font-weight:600;margin-left:1px}.sfx-action-bar .sfx-action-button .action-arrow-down{transform:rotate(90deg)}.sfx-action-bar .sfx-action-button .action-arrow-down i{margin-left:0}.sfx-actions-items{margin-top:1.875rem;padding-bottom:1.25rem}\n"], components: [{ type: i1.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i4.ActionBarSelectionCounterComponent, selector: "symphony-action-bar-selection-counter", inputs: ["model", "hasSeparator"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: ActionBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-action-bar', encapsulation: ViewEncapsulation.None, template: "<div class=\"sfx-title-wrap sfx-pb-30 sfx-action-bar\">\n  <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3 sfx-p-0 sfx-action-button\">\n    <div class=\"max-contentwidth\" (click)=\"toggleClicked()\" *ngIf=\"hasActionToggle\">\n      <symphony-icon-wrapper\n        [ngClass]=\"{ 'action-arrow-down': isToggled }\"\n        class=\"sfx-d-inline-block\"\n        ><symphony-icon\n          [icon]=\"'si-arrow-bold-next'\"\n          [size]=\"'13px'\"\n        ></symphony-icon>\n      </symphony-icon-wrapper>\n      <symphony-paragraph class=\"sfx-d-inline-block sfx-ml-20\"\n        >Actions</symphony-paragraph\n      >\n    </div>\n    <symphony-action-bar-selection-counter *ngIf=\"hasSelectionCounter\" [hasSeparator]=\"hasSeparator\" [model]=\"model\"></symphony-action-bar-selection-counter>\n  </div>\n  <div class=\"col-xs-12 col-sm-6 col-md-8 col-lg-9 sfx-p-0\">\n    <div class=\"pull-right sfx-actions-controls\">\n      <ng-content select=\"[grid-controls]\"></ng-content>\n    </div>\n  </div>\n</div>\n<div\n  *ngIf=\"isToggled\"\n  class=\"col-xs-12 col-sm-12 col-md-12 col-lg-12 sfx-border-bottom-gray-1 sfx-p-0\"\n>\n  <div class=\"col-xs-11 col-sm-11 col-md-11 col-lg-11 sfx-pl-0 sfx-actions-items\">\n    <ng-content select=\"[grid-actions]\"></ng-content>\n  </div>\n</div>\n", styles: [".sfx-action-bar{display:inline-block;width:100%;border-bottom:2px solid #000000}.sfx-action-bar .sfx-action-button,.sfx-action-bar .sfx-action-button .max-contentwidth{display:flex;align-items:center}.sfx-action-bar .sfx-action-button .icon-wrapper{padding:10px 0}.sfx-action-bar .sfx-action-button .icon-wrapper i{font-weight:600;margin-left:1px}.sfx-action-bar .sfx-action-button .action-arrow-down{transform:rotate(90deg)}.sfx-action-bar .sfx-action-button .action-arrow-down i{margin-left:0}.sfx-actions-items{margin-top:1.875rem;padding-bottom:1.25rem}\n"] }]

package/esm2020/lib/organisms/addition-modal/addition-modal.component.mjs CHANGED Viewed

@@ -22,7 +22,7 @@ export class AdditionModalComponent {
     }
 }
 AdditionModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdditionModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AdditionModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdditionModalComponent, selector: "symphony-addition-modal", inputs: { model: "model" }, outputs: { buttonClicked: "buttonClicked", closeButtonClicked: "closeButtonClicked" }, ngImport: i0, template: "<div *ngIf=\"model\" class=\"sfx sfx-modal\">\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 [text]=\"model.title\"></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)=\"onCloseButtonClick()\"\n          ></symphony-icon>\n        </div>\n      </div>\n    </div>\n  </section>\n  <section class=\"modal-body sfx-p-30\">\n    <symphony-paragraph>{{ model.content }}</symphony-paragraph>\n    <symphony-input-text\n      [maxlength]=\"model.maxlength\"\n      (textChange)=\"onTextChanged($event)\"\n    ></symphony-input-text>\n    <symphony-paragraph class=\"sfx-txt-red\">{{ model.message }}</symphony-paragraph>\n  </section>\n  <section class=\"modal-footer sfx-pt-30 sfx-pb-40\">\n    <symphony-button\n      *ngIf=\"model.btnSecondary\"\n      [text]=\"model.btnSecondary\"\n      [isSecondary]=\"true\"\n      (clicked)=\"onCloseButtonClick()\"\n    ></symphony-button>\n    <symphony-button\n      [disabled]=\"!valueToAdd?.length\"\n      class=\"sfx-ml-20\"\n      [text]=\"model.btnPrimary\"\n      (clicked)=\"onButtonClick()\"\n    ></symphony-button>\n  </section>\n</div>\n", components: [{ type: i1.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i4.InputTextComponent, selector: "symphony-input-text", inputs: ["placeholder", "icon", "label", "isInverse", "size", "value", "maxlength", "isDisabled", "textInfo", "textLink", "textClick", "isLabelView"], outputs: ["textChange"] }, { type: i5.ButtonComponent, selector: "symphony-button", inputs: ["text", "disabled", "isSecondary", "isInverse"], outputs: ["clicked"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+AdditionModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AdditionModalComponent, selector: "symphony-addition-modal", inputs: { model: "model" }, outputs: { buttonClicked: "buttonClicked", closeButtonClicked: "closeButtonClicked" }, ngImport: i0, template: "<div *ngIf=\"model\" class=\"sfx sfx-modal\">\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 [text]=\"model.title\"></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)=\"onCloseButtonClick()\"\n          ></symphony-icon>\n        </div>\n      </div>\n    </div>\n  </section>\n  <section class=\"modal-body sfx-p-30\">\n    <symphony-paragraph>{{ model.content }}</symphony-paragraph>\n    <symphony-input-text\n      [maxlength]=\"model.maxlength\"\n      (textChange)=\"onTextChanged($event)\"\n    ></symphony-input-text>\n    <symphony-paragraph class=\"sfx-txt-red\">{{ model.message }}</symphony-paragraph>\n  </section>\n  <section class=\"modal-footer sfx-pt-30 sfx-pb-40\">\n    <symphony-button\n      *ngIf=\"model.btnSecondary\"\n      [text]=\"model.btnSecondary\"\n      [isSecondary]=\"true\"\n      (clicked)=\"onCloseButtonClick()\"\n    ></symphony-button>\n    <symphony-button\n      [disabled]=\"!valueToAdd?.length\"\n      class=\"sfx-ml-20\"\n      [text]=\"model.btnPrimary\"\n      (clicked)=\"onButtonClick()\"\n    ></symphony-button>\n  </section>\n</div>\n", components: [{ type: i1.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i4.InputTextComponent, selector: "symphony-input-text", inputs: ["placeholder", "icon", "label", "isInverse", "size", "value", "maxlength", "isDisabled", "textInfo", "textLink", "textClick", "isLabelView"], outputs: ["textChange"] }, { type: i5.ButtonComponent, selector: "symphony-button", inputs: ["text", "disabled", "isSecondary", "isInverse"], outputs: ["clicked"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AdditionModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-addition-modal', template: "<div *ngIf=\"model\" class=\"sfx sfx-modal\">\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 [text]=\"model.title\"></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)=\"onCloseButtonClick()\"\n          ></symphony-icon>\n        </div>\n      </div>\n    </div>\n  </section>\n  <section class=\"modal-body sfx-p-30\">\n    <symphony-paragraph>{{ model.content }}</symphony-paragraph>\n    <symphony-input-text\n      [maxlength]=\"model.maxlength\"\n      (textChange)=\"onTextChanged($event)\"\n    ></symphony-input-text>\n    <symphony-paragraph class=\"sfx-txt-red\">{{ model.message }}</symphony-paragraph>\n  </section>\n  <section class=\"modal-footer sfx-pt-30 sfx-pb-40\">\n    <symphony-button\n      *ngIf=\"model.btnSecondary\"\n      [text]=\"model.btnSecondary\"\n      [isSecondary]=\"true\"\n      (clicked)=\"onCloseButtonClick()\"\n    ></symphony-button>\n    <symphony-button\n      [disabled]=\"!valueToAdd?.length\"\n      class=\"sfx-ml-20\"\n      [text]=\"model.btnPrimary\"\n      (clicked)=\"onButtonClick()\"\n    ></symphony-button>\n  </section>\n</div>\n" }]

package/esm2020/lib/organisms/ai-search-assistant-drawer/ai-search-assistant-drawer.component.mjs CHANGED Viewed

@@ -179,7 +179,7 @@ export class AISearchAssistantDrawerComponent {
     }
 }
 AISearchAssistantDrawerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AISearchAssistantDrawerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-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: { startOverClicked: "startOverClicked", undoClicked: "undoClicked", redoClicked: "redoClicked", 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  <symphony-tooltip-wrapper\n    [tooltipHtml]=\"model.isOpen ? 'Close Tala Assistant' : 'Tala Assisted Messaging'\"\n    [placement]=\"'left'\"\n    class=\"toolTipV2\"\n  >\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      [id]=\"getPendoId('aiAssistantToggle')\">\n      <symphony-icon [icon]=\"model.isOpen ? 'si-arrow-next' : 'si-arrow-prev'\"></symphony-icon>\n    </button>\n  </symphony-tooltip-wrapper>\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        <symphony-tooltip-wrapper\n          [tooltipHtml]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n          [placement]=\"'left'\"\n          class=\"toolTipV2\"\n        >\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            [id]=\"getPendoId('aiSuggestionsToggle')\"\n            [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n            <symphony-icon [icon]=\"'si-arrow-hide-reveal'\"></symphony-icon>\n          </button>\n        </symphony-tooltip-wrapper>\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        [showStartOverButton]=\"config.showStartOverButton\"\n        [startOverDisabled]=\"config.startOverDisabled\"\n        [startOverButtonId]=\"getPendoId('aiStartOverButton')\"\n        [startOverButtonTitle]=\"'Start Again'\"\n        (startOverClicked)=\"onStartOverClick()\"\n        [showUndoRedoButtons]=\"config.showUndoRedoButtons\"\n        [undoDisabled]=\"config.undoDisabled\"\n        [undoButtonId]=\"getPendoId('aiUndoButton')\"\n        (undoClicked)=\"onUndoClick()\"\n        [redoDisabled]=\"config.redoDisabled\"\n        [redoButtonId]=\"getPendoId('aiRedoButton')\"\n        (redoClicked)=\"onRedoClick()\">\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}.toolTipV2 .tooltip{max-width:none!important;width:auto!important}.toolTipV2 .tooltip .tooltip-inner{background-color:#565656!important;padding:8px 15px;border-radius:.625rem;max-width:none!important;width:-webkit-max-content!important;width:-moz-max-content!important;width:max-content!important;font-size:12px;color:#fff;white-space:nowrap}.toolTipV2 .sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.right{left:5px!important}.toolTipV2 .sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.left{left:-5px!important}.toolTipV2 .sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#565656}.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-container>symphony-tooltip-wrapper:has(.ai-drawer-edge-toggle){position:absolute!important;top:50%!important;left:-48px!important;transform:translateY(-50%)!important;z-index:10001!important;width:48px!important;height:48px!important;display:block!important}.ai-drawer-container.open>symphony-tooltip-wrapper:has(.ai-drawer-edge-toggle){left:-35px!important}.ai-drawer-container .toolTipV2 .tooltip .tooltip-inner{background-color:#565656;padding:8px 15px;border-radius:.625rem;max-width:250px;font-size:12px;color:#fff;width:-webkit-max-content;width:-moz-max-content;width:max-content}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.right{left:5px!important}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.left{left:-5px!important}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#565656}.ai-drawer-edge-toggle{position:relative;top:0;left:0;transform:none;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);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: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{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: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: i1.TooltipWrapperComponent, selector: "symphony-tooltip-wrapper", inputs: ["placement", "tooltipHtml", "toolTipClass"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i4.TaskStatusComponent, selector: "symphony-task-status", inputs: ["taskStatusModel"], outputs: ["cancelTask", "retryTask"] }, { type: i5.InputTextareaWithSendComponent, selector: "symphony-input-textarea-with-send", inputs: ["placeholder", "isDisabled", "maxCharacterLimit", "showCharacterCount", "minRows", "maxRows", "sendButtonIcon", "sendButtonAriaLabel", "autoResize", "showStartOverButton", "showUndoRedoButtons", "startOverButtonId", "startOverDisabled", "startOverButtonIcon", "startOverButtonTitle", "undoButtonId", "undoDisabled", "undoButtonIcon", "redoButtonId", "redoDisabled", "redoButtonIcon"], outputs: ["sendClicked", "enterPressed", "valueChanged", "startOverClicked", "undoClicked", "redoClicked"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "newLineToBr": i8.NewLineToBrPipe }, encapsulation: i0.ViewEncapsulation.None });
+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: { startOverClicked: "startOverClicked", undoClicked: "undoClicked", redoClicked: "redoClicked", 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  <symphony-tooltip-wrapper\n    [tooltipHtml]=\"model.isOpen ? 'Close Tala Assistant' : 'Tala Assisted Messaging'\"\n    [placement]=\"'left'\"\n    class=\"toolTipV2\"\n  >\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      [id]=\"getPendoId('aiAssistantToggle')\">\n      <symphony-icon [icon]=\"model.isOpen ? 'si-arrow-next' : 'si-arrow-prev'\"></symphony-icon>\n    </button>\n  </symphony-tooltip-wrapper>\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        <symphony-tooltip-wrapper\n          [tooltipHtml]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n          [placement]=\"'left'\"\n          class=\"toolTipV2\"\n        >\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            [id]=\"getPendoId('aiSuggestionsToggle')\"\n            [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n            <symphony-icon [icon]=\"'si-arrow-hide-reveal'\"></symphony-icon>\n          </button>\n        </symphony-tooltip-wrapper>\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        [showStartOverButton]=\"config.showStartOverButton\"\n        [startOverDisabled]=\"config.startOverDisabled\"\n        [startOverButtonId]=\"getPendoId('aiStartOverButton')\"\n        [startOverButtonTitle]=\"'Start Again'\"\n        (startOverClicked)=\"onStartOverClick()\"\n        [showUndoRedoButtons]=\"config.showUndoRedoButtons\"\n        [undoDisabled]=\"config.undoDisabled\"\n        [undoButtonId]=\"getPendoId('aiUndoButton')\"\n        (undoClicked)=\"onUndoClick()\"\n        [redoDisabled]=\"config.redoDisabled\"\n        [redoButtonId]=\"getPendoId('aiRedoButton')\"\n        (redoClicked)=\"onRedoClick()\">\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}.toolTipV2 .tooltip{max-width:none!important;width:auto!important}.toolTipV2 .tooltip .tooltip-inner{background-color:#565656!important;padding:8px 15px;border-radius:.625rem;max-width:none!important;width:-webkit-max-content!important;width:-moz-max-content!important;width:max-content!important;font-size:12px;color:#fff;white-space:nowrap}.toolTipV2 .sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.right{left:5px!important}.toolTipV2 .sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.left{left:-5px!important}.toolTipV2 .sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#565656}.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-container>symphony-tooltip-wrapper:has(.ai-drawer-edge-toggle){position:absolute!important;top:50%!important;left:-48px!important;transform:translateY(-50%)!important;z-index:10001!important;width:48px!important;height:48px!important;display:block!important}.ai-drawer-container.open>symphony-tooltip-wrapper:has(.ai-drawer-edge-toggle){left:-35px!important}.ai-drawer-container .toolTipV2 .tooltip .tooltip-inner{background-color:#565656;padding:8px 15px;border-radius:.625rem;max-width:250px;font-size:12px;color:#fff;width:-webkit-max-content;width:-moz-max-content;width:max-content}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.right{left:5px!important}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.left{left:-5px!important}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#565656}.ai-drawer-edge-toggle{position:relative;top:0;left:0;transform:none;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);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: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{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: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: i1.TooltipWrapperComponent, selector: "symphony-tooltip-wrapper", inputs: ["placement", "tooltipHtml", "toolTipClass"] }, { type: i2.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i4.TaskStatusComponent, selector: "symphony-task-status", inputs: ["taskStatusModel"], outputs: ["cancelTask", "retryTask"] }, { type: i5.InputTextareaWithSendComponent, selector: "symphony-input-textarea-with-send", inputs: ["placeholder", "isDisabled", "maxCharacterLimit", "showCharacterCount", "minRows", "maxRows", "sendButtonIcon", "sendButtonAriaLabel", "autoResize", "showStartOverButton", "showUndoRedoButtons", "startOverButtonId", "startOverDisabled", "startOverButtonIcon", "startOverButtonTitle", "undoButtonId", "undoDisabled", "undoButtonIcon", "redoButtonId", "redoDisabled", "redoButtonIcon"], outputs: ["sendClicked", "enterPressed", "valueChanged", "startOverClicked", "undoClicked", "redoClicked"] }], directives: [{ type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "newLineToBr": i8.NewLineToBrPipe }, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AISearchAssistantDrawerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-ai-search-assistant-drawer', encapsulation: ViewEncapsulation.None, 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  <symphony-tooltip-wrapper\n    [tooltipHtml]=\"model.isOpen ? 'Close Tala Assistant' : 'Tala Assisted Messaging'\"\n    [placement]=\"'left'\"\n    class=\"toolTipV2\"\n  >\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      [id]=\"getPendoId('aiAssistantToggle')\">\n      <symphony-icon [icon]=\"model.isOpen ? 'si-arrow-next' : 'si-arrow-prev'\"></symphony-icon>\n    </button>\n  </symphony-tooltip-wrapper>\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        <symphony-tooltip-wrapper\n          [tooltipHtml]=\"model.isSuggestionsOpen ? 'Hide suggestions' : 'Show suggestions'\"\n          [placement]=\"'left'\"\n          class=\"toolTipV2\"\n        >\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            [id]=\"getPendoId('aiSuggestionsToggle')\"\n            [disabled]=\"model.isLoading || model.aiTaskStatus?.showProgressBar\">\n            <symphony-icon [icon]=\"'si-arrow-hide-reveal'\"></symphony-icon>\n          </button>\n        </symphony-tooltip-wrapper>\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        [showStartOverButton]=\"config.showStartOverButton\"\n        [startOverDisabled]=\"config.startOverDisabled\"\n        [startOverButtonId]=\"getPendoId('aiStartOverButton')\"\n        [startOverButtonTitle]=\"'Start Again'\"\n        (startOverClicked)=\"onStartOverClick()\"\n        [showUndoRedoButtons]=\"config.showUndoRedoButtons\"\n        [undoDisabled]=\"config.undoDisabled\"\n        [undoButtonId]=\"getPendoId('aiUndoButton')\"\n        (undoClicked)=\"onUndoClick()\"\n        [redoDisabled]=\"config.redoDisabled\"\n        [redoButtonId]=\"getPendoId('aiRedoButton')\"\n        (redoClicked)=\"onRedoClick()\">\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}.toolTipV2 .tooltip{max-width:none!important;width:auto!important}.toolTipV2 .tooltip .tooltip-inner{background-color:#565656!important;padding:8px 15px;border-radius:.625rem;max-width:none!important;width:-webkit-max-content!important;width:-moz-max-content!important;width:max-content!important;font-size:12px;color:#fff;white-space:nowrap}.toolTipV2 .sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.right{left:5px!important}.toolTipV2 .sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#565656}.toolTipV2 .sfx-info-tooltip.item-tooltip.left{left:-5px!important}.toolTipV2 .sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#565656}.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-container>symphony-tooltip-wrapper:has(.ai-drawer-edge-toggle){position:absolute!important;top:50%!important;left:-48px!important;transform:translateY(-50%)!important;z-index:10001!important;width:48px!important;height:48px!important;display:block!important}.ai-drawer-container.open>symphony-tooltip-wrapper:has(.ai-drawer-edge-toggle){left:-35px!important}.ai-drawer-container .toolTipV2 .tooltip .tooltip-inner{background-color:#565656;padding:8px 15px;border-radius:.625rem;max-width:250px;font-size:12px;color:#fff;width:-webkit-max-content;width:-moz-max-content;width:max-content}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.top .tooltip-arrow.arrow{border-top-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.right{left:5px!important}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.right .tooltip-arrow.arrow{border-right-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.bottom .tooltip-arrow.arrow{border-bottom-color:#565656}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.left{left:-5px!important}.ai-drawer-container .toolTipV2 .sfx-info-tooltip.item-tooltip.left .tooltip-arrow.arrow{border-left-color:#565656}.ai-drawer-edge-toggle{position:relative;top:0;left:0;transform:none;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);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: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{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: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"] }]

package/esm2020/lib/organisms/assigned-to-widget/assigned-to-widget.component.mjs CHANGED Viewed

@@ -17,7 +17,7 @@ export class AssignedToWidgetComponent {
     }
 }
 AssignedToWidgetComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AssignedToWidgetComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-AssignedToWidgetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AssignedToWidgetComponent, selector: "symphony-assigned-to-widget", inputs: { assignWidgetModel: "assignWidgetModel" }, outputs: { addClick: "addClick" }, ngImport: i0, template: "<symphony-widget-list-container-template *ngIf=\"assignWidgetModel\">\n  <symphony-h4 widget-title>{{\n    assignWidgetModel.title\n  }}</symphony-h4>\n  <symphony-icon-wrapper id=\"assignedTo-widget-add\" *ngIf=\"!assignWidgetModel.isLoading\" widget-icon (click)=\"onAddClick()\">\n    <symphony-icon [icon]=\"'si-edit'\"></symphony-icon>\n  </symphony-icon-wrapper>\n  <div widget-content *ngIf=\"!assignWidgetModel.isLoading\">\n    <symphony-widget-list-template\n      class=\"widget-list-container-wrap\"\n      *ngFor=\"let assignedItem of assignWidgetModel.assignWidgetList\"\n    >\n      <symphony-icon\n        [ngClass]=\"{ 'icon-yellow': assignedItem.isAssigned, 'icon-grey': !assignedItem.isAssigned }\"\n        widget-list-icon\n        [icon]=\"'si-assign-to-actions'\"\n      ></symphony-icon>\n      <symphony-paragraph\n        *ngIf=\"assignedItem.isAssigned\"\n        widget-list-content-title\n        class=\"sfx-font-bold\"\n        >{{ assignedItem.title }}</symphony-paragraph\n      >\n      <symphony-paragraph\n        widget-list-content-detail\n        >{{ assignedItem.textContent\n        }}<span class=\"sfx-font-bold\"\n          >&nbsp;{{ assignedItem.date }}</span\n        ></symphony-paragraph\n      >\n    </symphony-widget-list-template>\n  </div>\n  <div widget-content *ngIf=\"assignWidgetModel.isLoading\">\n    <symphony-sfx-loader></symphony-sfx-loader>\n  </div>\n</symphony-widget-list-container-template>\n", styles: [".widget-list-container-wrap .icon-yellow{background:#EAE851;width:40px;display:block;height:40px;border-radius:50%;color:#334860}.widget-list-container-wrap .icon-grey{background:#F1F2F5;color:#c3cbdc;width:40px;display:block;height:40px;border-radius:50%}\n"], components: [{ type: i1.WidgetListContainerTemplateComponent, selector: "symphony-widget-list-container-template" }, { type: i2.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i3.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: i4.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i5.WidgetListTemplateComponent, selector: "symphony-widget-list-template" }, { type: i6.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }, { type: i7.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+AssignedToWidgetComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: AssignedToWidgetComponent, selector: "symphony-assigned-to-widget", inputs: { assignWidgetModel: "assignWidgetModel" }, outputs: { addClick: "addClick" }, ngImport: i0, template: "<symphony-widget-list-container-template *ngIf=\"assignWidgetModel\">\n  <symphony-h4 widget-title>{{\n    assignWidgetModel.title\n  }}</symphony-h4>\n  <symphony-icon-wrapper id=\"assignedTo-widget-add\" *ngIf=\"!assignWidgetModel.isLoading\" widget-icon (click)=\"onAddClick()\">\n    <symphony-icon [icon]=\"'si-edit'\"></symphony-icon>\n  </symphony-icon-wrapper>\n  <div widget-content *ngIf=\"!assignWidgetModel.isLoading\">\n    <symphony-widget-list-template\n      class=\"widget-list-container-wrap\"\n      *ngFor=\"let assignedItem of assignWidgetModel.assignWidgetList\"\n    >\n      <symphony-icon\n        [ngClass]=\"{ 'icon-yellow': assignedItem.isAssigned, 'icon-grey': !assignedItem.isAssigned }\"\n        widget-list-icon\n        [icon]=\"'si-assign-to-actions'\"\n      ></symphony-icon>\n      <symphony-paragraph\n        *ngIf=\"assignedItem.isAssigned\"\n        widget-list-content-title\n        class=\"sfx-font-bold\"\n        >{{ assignedItem.title }}</symphony-paragraph\n      >\n      <symphony-paragraph\n        widget-list-content-detail\n        >{{ assignedItem.textContent\n        }}<span class=\"sfx-font-bold\"\n          >&nbsp;{{ assignedItem.date }}</span\n        ></symphony-paragraph\n      >\n    </symphony-widget-list-template>\n  </div>\n  <div widget-content *ngIf=\"assignWidgetModel.isLoading\">\n    <symphony-sfx-loader></symphony-sfx-loader>\n  </div>\n</symphony-widget-list-container-template>\n", styles: [".widget-list-container-wrap .icon-yellow{background:#EAE851;width:40px;display:block;height:40px;border-radius:50%;color:#334860}.widget-list-container-wrap .icon-grey{background:#F1F2F5;color:#c3cbdc;width:40px;display:block;height:40px;border-radius:50%}\n"], components: [{ type: i1.WidgetListContainerTemplateComponent, selector: "symphony-widget-list-container-template" }, { type: i2.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i3.IconWrapperComponent, selector: "symphony-icon-wrapper", inputs: ["backgroundColor", "isInverse", "hasHoverWithoutBorder", "isDisabled"], outputs: ["clicked"] }, { type: i4.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i5.WidgetListTemplateComponent, selector: "symphony-widget-list-template" }, { type: i6.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i7.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }], directives: [{ type: i8.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i8.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: AssignedToWidgetComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-assigned-to-widget', template: "<symphony-widget-list-container-template *ngIf=\"assignWidgetModel\">\n  <symphony-h4 widget-title>{{\n    assignWidgetModel.title\n  }}</symphony-h4>\n  <symphony-icon-wrapper id=\"assignedTo-widget-add\" *ngIf=\"!assignWidgetModel.isLoading\" widget-icon (click)=\"onAddClick()\">\n    <symphony-icon [icon]=\"'si-edit'\"></symphony-icon>\n  </symphony-icon-wrapper>\n  <div widget-content *ngIf=\"!assignWidgetModel.isLoading\">\n    <symphony-widget-list-template\n      class=\"widget-list-container-wrap\"\n      *ngFor=\"let assignedItem of assignWidgetModel.assignWidgetList\"\n    >\n      <symphony-icon\n        [ngClass]=\"{ 'icon-yellow': assignedItem.isAssigned, 'icon-grey': !assignedItem.isAssigned }\"\n        widget-list-icon\n        [icon]=\"'si-assign-to-actions'\"\n      ></symphony-icon>\n      <symphony-paragraph\n        *ngIf=\"assignedItem.isAssigned\"\n        widget-list-content-title\n        class=\"sfx-font-bold\"\n        >{{ assignedItem.title }}</symphony-paragraph\n      >\n      <symphony-paragraph\n        widget-list-content-detail\n        >{{ assignedItem.textContent\n        }}<span class=\"sfx-font-bold\"\n          >&nbsp;{{ assignedItem.date }}</span\n        ></symphony-paragraph\n      >\n    </symphony-widget-list-template>\n  </div>\n  <div widget-content *ngIf=\"assignWidgetModel.isLoading\">\n    <symphony-sfx-loader></symphony-sfx-loader>\n  </div>\n</symphony-widget-list-container-template>\n", styles: [".widget-list-container-wrap .icon-yellow{background:#EAE851;width:40px;display:block;height:40px;border-radius:50%;color:#334860}.widget-list-container-wrap .icon-grey{background:#F1F2F5;color:#c3cbdc;width:40px;display:block;height:40px;border-radius:50%}\n"] }]

package/esm2020/lib/organisms/candidate-card/candidate-card.component.mjs CHANGED Viewed

@@ -20,7 +20,7 @@ export class CandidateCardComponent {
     }
 }
 CandidateCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-CandidateCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: CandidateCardComponent, selector: "symphony-candidate-card", inputs: { model: "model" }, ngImport: i0, template: "<section class=\"candidate-card\" *ngIf=\"model\">\n  <symphony-icon\n    *ngIf=\"model.hasSentIcon\"\n    class=\"candidate-card__status-icon\"\n    [icon]=\"'si-confirmation'\"\n    [iconColor]=\"'#16b783'\"\n    [size]=\"'18px'\"\n  ></symphony-icon>\n\n  <div class=\"candidate-card__header\">\n    <symphony-avatar\n      class=\"candidate-card__avatar\"\n      [firstName]=\"model.firstName || model.fullName\"\n      [lastName]=\"model.lastName\"\n      [sizePx]=\"48\"\n      [fontSizePx]=\"18\"\n    ></symphony-avatar>\n\n    <div class=\"candidate-card__identity\">\n      <symphony-h4 [text]=\"displayName || 'Candidate'\"></symphony-h4>\n\n      <symphony-paragraph\n        *ngFor=\"let item of displayMetaItems\"\n        [text]=\"item\"\n        [isSecondary]=\"false\"\n      ></symphony-paragraph>\n    </div>\n  </div>\n</section>\n", styles: [".candidate-card{position:relative;display:flex;flex-direction:column;gap:16px;padding:20px;background:#ffffff;border:1px solid #dfe3eb;border-radius:10px}.candidate-card__header{display:flex;align-items:flex-start;gap:15px}.candidate-card__status-icon{position:absolute;top:20px;right:20px;line-height:1}.candidate-card__avatar{flex-shrink:0}.candidate-card__identity{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}\n"], components: [{ type: i1.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i2.AvatarComponent, selector: "symphony-avatar", inputs: ["firstName", "lastName", "sizePx", "fontSizePx"] }, { type: i3.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i4.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+CandidateCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: CandidateCardComponent, selector: "symphony-candidate-card", inputs: { model: "model" }, ngImport: i0, template: "<section class=\"candidate-card\" *ngIf=\"model\">\n  <symphony-icon\n    *ngIf=\"model.hasSentIcon\"\n    class=\"candidate-card__status-icon\"\n    [icon]=\"'si-confirmation'\"\n    [iconColor]=\"'#16b783'\"\n    [size]=\"'18px'\"\n  ></symphony-icon>\n\n  <div class=\"candidate-card__header\">\n    <symphony-avatar\n      class=\"candidate-card__avatar\"\n      [firstName]=\"model.firstName || model.fullName\"\n      [lastName]=\"model.lastName\"\n      [sizePx]=\"48\"\n      [fontSizePx]=\"18\"\n    ></symphony-avatar>\n\n    <div class=\"candidate-card__identity\">\n      <symphony-h4 [text]=\"displayName || 'Candidate'\"></symphony-h4>\n\n      <symphony-paragraph\n        *ngFor=\"let item of displayMetaItems\"\n        [text]=\"item\"\n        [isSecondary]=\"false\"\n      ></symphony-paragraph>\n    </div>\n  </div>\n</section>\n", styles: [".candidate-card{position:relative;display:flex;flex-direction:column;gap:16px;padding:20px;background:#ffffff;border:1px solid #dfe3eb;border-radius:10px}.candidate-card__header{display:flex;align-items:flex-start;gap:15px}.candidate-card__status-icon{position:absolute;top:20px;right:20px;line-height:1}.candidate-card__avatar{flex-shrink:0}.candidate-card__identity{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}\n"], components: [{ type: i1.IconComponent, selector: "symphony-icon", inputs: ["icon", "isSecondary", "size", "iconColor"], outputs: ["clicked"] }, { type: i2.AvatarComponent, selector: "symphony-avatar", inputs: ["firstName", "lastName", "sizePx", "fontSizePx"] }, { type: i3.H4Component, selector: "symphony-h4", inputs: ["text", "isSecondary"] }, { type: i4.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateCardComponent, decorators: [{
             type: Component,
             args: [{ selector: 'symphony-candidate-card', template: "<section class=\"candidate-card\" *ngIf=\"model\">\n  <symphony-icon\n    *ngIf=\"model.hasSentIcon\"\n    class=\"candidate-card__status-icon\"\n    [icon]=\"'si-confirmation'\"\n    [iconColor]=\"'#16b783'\"\n    [size]=\"'18px'\"\n  ></symphony-icon>\n\n  <div class=\"candidate-card__header\">\n    <symphony-avatar\n      class=\"candidate-card__avatar\"\n      [firstName]=\"model.firstName || model.fullName\"\n      [lastName]=\"model.lastName\"\n      [sizePx]=\"48\"\n      [fontSizePx]=\"18\"\n    ></symphony-avatar>\n\n    <div class=\"candidate-card__identity\">\n      <symphony-h4 [text]=\"displayName || 'Candidate'\"></symphony-h4>\n\n      <symphony-paragraph\n        *ngFor=\"let item of displayMetaItems\"\n        [text]=\"item\"\n        [isSecondary]=\"false\"\n      ></symphony-paragraph>\n    </div>\n  </div>\n</section>\n", styles: [".candidate-card{position:relative;display:flex;flex-direction:column;gap:16px;padding:20px;background:#ffffff;border:1px solid #dfe3eb;border-radius:10px}.candidate-card__header{display:flex;align-items:flex-start;gap:15px}.candidate-card__status-icon{position:absolute;top:20px;right:20px;line-height:1}.candidate-card__avatar{flex-shrink:0}.candidate-card__identity{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}\n"] }]

package/esm2020/lib/organisms/candidate-list/candidate-list.component.mjs ADDED Viewed

@@ -0,0 +1,84 @@
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+import * as i1 from "../../atoms/input-text/input-text.component";
+import * as i2 from "../../atoms/sfx-loader/sfx-loader.component";
+import * as i3 from "../../atoms/paragraph/paragraph.component";
+import * as i4 from "../../molecules/candidate-item/candidate-item.component";
+import * as i5 from "@angular/common";
+export class CandidateListComponent {
+    constructor() {
+        this.candidatesValue = [];
+        this.maxHeight = '380px';
+        this.label = '';
+        this.searchPlaceholder = 'Search by Name, Email or Title';
+        this.noMatchText = 'No matches found';
+        this.errorText = 'Something went wrong. Please try again.';
+        this.isLoading = false;
+        this.hasError = false;
+        this.showSearch = true;
+        this.selectionChanged = new EventEmitter();
+        this.searchChanged = new EventEmitter();
+        this.searchTerm = '';
+        this.filteredCandidates = [];
+    }
+    set candidates(candidates) {
+        this.candidatesValue = Array.isArray(candidates) ? candidates : [];
+        this.applyFilter();
+    }
+    get candidates() {
+        return this.candidatesValue;
+    }
+    trackByCandidate(index, candidate) {
+        return candidate?.id ?? index;
+    }
+    handleSelectionChanged(event) {
+        this.selectionChanged.emit(event);
+    }
+    handleSearchChange(value) {
+        this.searchTerm = value ?? '';
+        this.applyFilter();
+        this.searchChanged.emit(this.searchTerm);
+    }
+    applyFilter() {
+        const term = this.searchTerm.trim().toLowerCase();
+        if (!term) {
+            this.filteredCandidates = [...this.candidatesValue];
+            return;
+        }
+        this.filteredCandidates = this.candidatesValue.filter((candidate) => {
+            const name = candidate?.name?.toLowerCase() ?? '';
+            const email = candidate?.email?.toLowerCase() ?? '';
+            const title = candidate?.title?.toLowerCase() ?? '';
+            return name.includes(term) || email.includes(term) || title.includes(term);
+        });
+    }
+}
+CandidateListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+CandidateListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.2", type: CandidateListComponent, selector: "symphony-candidate-list", inputs: { candidates: "candidates", maxHeight: "maxHeight", label: "label", searchPlaceholder: "searchPlaceholder", noMatchText: "noMatchText", errorText: "errorText", isLoading: "isLoading", hasError: "hasError", showSearch: "showSearch" }, outputs: { selectionChanged: "selectionChanged", searchChanged: "searchChanged" }, ngImport: i0, template: "<div class=\"sfx-candidate-list\">\n  <div class=\"sfx-candidate-list__search\" *ngIf=\"showSearch\">\n    <symphony-input-text\n      [placeholder]=\"searchPlaceholder\"\n      icon=\"si-search-new\"\n      [label]=\"label\"\n      [isInverse]=\"false\"\n      [value]=\"searchTerm\"\n      [isDisabled]=\"false\"\n      [isLabelView]=\"false\"\n      (textChange)=\"handleSearchChange($event)\"\n    ></symphony-input-text>\n  </div>\n\n  <div class=\"sfx-candidate-list__wrapper\" [style.maxHeight]=\"maxHeight\">\n    <ng-container *ngIf=\"isLoading; else loadedState\">\n      <div class=\"sfx-candidate-list__state sfx-candidate-list__state--loading\">\n        <symphony-sfx-loader></symphony-sfx-loader>\n      </div>\n    </ng-container>\n\n    <ng-template #loadedState>\n      <ng-container *ngIf=\"hasError; else readyState\">\n        <div class=\"sfx-candidate-list__state sfx-candidate-list__state--error\">\n          <symphony-paragraph\n            class=\"sfx-candidate-list__state-message\"\n            [fontSize]=\"'14px'\"\n          >\n            {{ errorText }}\n          </symphony-paragraph>\n        </div>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #readyState>\n      <ng-container *ngIf=\"filteredCandidates?.length; else emptyState\">\n        <ul class=\"sfx-candidate-list__items list-unstyled\">\n          <li\n            class=\"sfx-candidate-list__item\"\n            *ngFor=\"let candidate of filteredCandidates; trackBy: trackByCandidate\"\n          >\n            <symphony-candidate-item\n              [candidate]=\"candidate\"\n              (selectionChanged)=\"handleSelectionChanged($event)\"\n            ></symphony-candidate-item>\n          </li>\n        </ul>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #emptyState>\n      <div class=\"sfx-candidate-list__state sfx-candidate-list__state--empty\">\n        <symphony-paragraph\n          class=\"sfx-candidate-list__state-message\"\n          [fontSize]=\"'14px'\"\n        >\n          {{ noMatchText }}\n        </symphony-paragraph>\n      </div>\n    </ng-template>\n  </div>\n</div>\n", styles: [".sfx-candidate-list{display:flex;flex-direction:column;gap:12px}.sfx-candidate-list__search{width:100%}.sfx-candidate-list__wrapper{border:1px solid #e5e7eb;border-radius:10px;overflow-y:auto}.sfx-candidate-list__items{margin:0;padding:0}.sfx-candidate-list__item{border-bottom:1px solid #e5e7eb}.sfx-candidate-list__item:last-child{border-bottom:none}.sfx-candidate-list__state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px 16px;text-align:center;min-height:160px}.sfx-candidate-list__state-message{color:#4b5563}\n"], components: [{ type: i1.InputTextComponent, selector: "symphony-input-text", inputs: ["placeholder", "icon", "label", "isInverse", "size", "value", "maxlength", "isDisabled", "textInfo", "textLink", "textClick", "isLabelView"], outputs: ["textChange"] }, { type: i2.SfxLoaderComponent, selector: "symphony-sfx-loader", inputs: ["leftStyle", "message", "hasCustomMessage"] }, { type: i3.ParagraphComponent, selector: "symphony-paragraph", inputs: ["text", "isSecondary", "isFontBold", "fontSize", "fontWeight"] }, { type: i4.CandidateItemComponent, selector: "symphony-candidate-item", inputs: ["candidate"], outputs: ["selectionChanged"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'symphony-candidate-list', template: "<div class=\"sfx-candidate-list\">\n  <div class=\"sfx-candidate-list__search\" *ngIf=\"showSearch\">\n    <symphony-input-text\n      [placeholder]=\"searchPlaceholder\"\n      icon=\"si-search-new\"\n      [label]=\"label\"\n      [isInverse]=\"false\"\n      [value]=\"searchTerm\"\n      [isDisabled]=\"false\"\n      [isLabelView]=\"false\"\n      (textChange)=\"handleSearchChange($event)\"\n    ></symphony-input-text>\n  </div>\n\n  <div class=\"sfx-candidate-list__wrapper\" [style.maxHeight]=\"maxHeight\">\n    <ng-container *ngIf=\"isLoading; else loadedState\">\n      <div class=\"sfx-candidate-list__state sfx-candidate-list__state--loading\">\n        <symphony-sfx-loader></symphony-sfx-loader>\n      </div>\n    </ng-container>\n\n    <ng-template #loadedState>\n      <ng-container *ngIf=\"hasError; else readyState\">\n        <div class=\"sfx-candidate-list__state sfx-candidate-list__state--error\">\n          <symphony-paragraph\n            class=\"sfx-candidate-list__state-message\"\n            [fontSize]=\"'14px'\"\n          >\n            {{ errorText }}\n          </symphony-paragraph>\n        </div>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #readyState>\n      <ng-container *ngIf=\"filteredCandidates?.length; else emptyState\">\n        <ul class=\"sfx-candidate-list__items list-unstyled\">\n          <li\n            class=\"sfx-candidate-list__item\"\n            *ngFor=\"let candidate of filteredCandidates; trackBy: trackByCandidate\"\n          >\n            <symphony-candidate-item\n              [candidate]=\"candidate\"\n              (selectionChanged)=\"handleSelectionChanged($event)\"\n            ></symphony-candidate-item>\n          </li>\n        </ul>\n      </ng-container>\n    </ng-template>\n\n    <ng-template #emptyState>\n      <div class=\"sfx-candidate-list__state sfx-candidate-list__state--empty\">\n        <symphony-paragraph\n          class=\"sfx-candidate-list__state-message\"\n          [fontSize]=\"'14px'\"\n        >\n          {{ noMatchText }}\n        </symphony-paragraph>\n      </div>\n    </ng-template>\n  </div>\n</div>\n", styles: [".sfx-candidate-list{display:flex;flex-direction:column;gap:12px}.sfx-candidate-list__search{width:100%}.sfx-candidate-list__wrapper{border:1px solid #e5e7eb;border-radius:10px;overflow-y:auto}.sfx-candidate-list__items{margin:0;padding:0}.sfx-candidate-list__item{border-bottom:1px solid #e5e7eb}.sfx-candidate-list__item:last-child{border-bottom:none}.sfx-candidate-list__state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px 16px;text-align:center;min-height:160px}.sfx-candidate-list__state-message{color:#4b5563}\n"] }]
+        }], propDecorators: { candidates: [{
+                type: Input
+            }], maxHeight: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], searchPlaceholder: [{
+                type: Input
+            }], noMatchText: [{
+                type: Input
+            }], errorText: [{
+                type: Input
+            }], isLoading: [{
+                type: Input
+            }], hasError: [{
+                type: Input
+            }], showSearch: [{
+                type: Input
+            }], selectionChanged: [{
+                type: Output
+            }], searchChanged: [{
+                type: Output
+            }] } });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FuZGlkYXRlLWxpc3QuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9vcmdhbmlzbXMvY2FuZGlkYXRlLWxpc3QvY2FuZGlkYXRlLWxpc3QuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9vcmdhbmlzbXMvY2FuZGlkYXRlLWxpc3QvY2FuZGlkYXRlLWxpc3QuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQzs7Ozs7OztBQVd2RSxNQUFNLE9BQU8sc0JBQXNCO0lBTG5DO1FBTVUsb0JBQWUsR0FBeUIsRUFBRSxDQUFDO1FBWTFDLGNBQVMsR0FBRyxPQUFPLENBQUM7UUFDcEIsVUFBSyxHQUFHLEVBQUUsQ0FBQztRQUNYLHNCQUFpQixHQUFHLGdDQUFnQyxDQUFDO1FBQ3JELGdCQUFXLEdBQUcsa0JBQWtCLENBQUM7UUFDakMsY0FBUyxHQUFHLHlDQUF5QyxDQUFDO1FBQ3RELGNBQVMsR0FBRyxLQUFLLENBQUM7UUFDbEIsYUFBUSxHQUFHLEtBQUssQ0FBQztRQUNqQixlQUFVLEdBQUcsSUFBSSxDQUFDO1FBRWpCLHFCQUFnQixHQUFHLElBQUksWUFBWSxFQUErQixDQUFDO1FBQ25FLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUVyRCxlQUFVLEdBQUcsRUFBRSxDQUFDO1FBQ2hCLHVCQUFrQixHQUF5QixFQUFFLENBQUM7S0E2Qi9DO0lBcERDLElBQ0ksVUFBVSxDQUFDLFVBQWdDO1FBQzdDLElBQUksQ0FBQyxlQUFlLEdBQUcsS0FBSyxDQUFDLE9BQU8sQ0FBQyxVQUFVLENBQUMsQ0FBQyxDQUFDLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7UUFDbkUsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFFRCxJQUFJLFVBQVU7UUFDWixPQUFPLElBQUksQ0FBQyxlQUFlLENBQUM7SUFDOUIsQ0FBQztJQWlCRCxnQkFBZ0IsQ0FBQyxLQUFhLEVBQUUsU0FBNkI7UUFDM0QsT0FBTyxTQUFTLEVBQUUsRUFBRSxJQUFJLEtBQUssQ0FBQztJQUNoQyxDQUFDO0lBRUQsc0JBQXNCLENBQUMsS0FBa0M7UUFDdkQsSUFBSSxDQUFDLGdCQUFnQixDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNwQyxDQUFDO0lBRUQsa0JBQWtCLENBQUMsS0FBYTtRQUM5QixJQUFJLENBQUMsVUFBVSxHQUFHLEtBQUssSUFBSSxFQUFFLENBQUM7UUFDOUIsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ25CLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUMzQyxDQUFDO0lBRU8sV0FBVztRQUNqQixNQUFNLElBQUksR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksRUFBRSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ2xELElBQUksQ0FBQyxJQUFJLEVBQUU7WUFDVCxJQUFJLENBQUMsa0JBQWtCLEdBQUcsQ0FBQyxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUMsQ0FBQztZQUNwRCxPQUFPO1NBQ1I7UUFDRCxJQUFJLENBQUMsa0JBQWtCLEdBQUcsSUFBSSxDQUFDLGVBQWUsQ0FBQyxNQUFNLENBQUMsQ0FBQyxTQUFTLEVBQUUsRUFBRTtZQUNsRSxNQUFNLElBQUksR0FBRyxTQUFTLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUUsQ0FBQztZQUNsRCxNQUFNLEtBQUssR0FBRyxTQUFTLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUUsQ0FBQztZQUNwRCxNQUFNLEtBQUssR0FBRyxTQUFTLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUUsQ0FBQztZQUNwRCxPQUFPLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksS0FBSyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsSUFBSSxLQUFLLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQzdFLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzs7bUhBdERVLHNCQUFzQjt1R0FBdEIsc0JBQXNCLG9ZQ1huQywwbEVBOERBOzJGRG5EYSxzQkFBc0I7a0JBTGxDLFNBQVM7K0JBQ0UseUJBQXlCOzhCQVEvQixVQUFVO3NCQURiLEtBQUs7Z0JBVUcsU0FBUztzQkFBakIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csaUJBQWlCO3NCQUF6QixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFFSSxnQkFBZ0I7c0JBQXpCLE1BQU07Z0JBQ0csYUFBYTtzQkFBdEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge1xuICBDYW5kaWRhdGVJdGVtTW9kZWwsXG4gIENhbmRpZGF0ZUl0ZW1TZWxlY3Rpb25FdmVudCxcbn0gZnJvbSAnLi4vLi4vbW9sZWN1bGVzL2NhbmRpZGF0ZS1pdGVtL2NhbmRpZGF0ZS1pdGVtLm1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnc3ltcGhvbnktY2FuZGlkYXRlLWxpc3QnLFxuICB0ZW1wbGF0ZVVybDogJy4vY2FuZGlkYXRlLWxpc3QuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9jYW5kaWRhdGUtbGlzdC5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBDYW5kaWRhdGVMaXN0Q29tcG9uZW50IHtcbiAgcHJpdmF0ZSBjYW5kaWRhdGVzVmFsdWU6IENhbmRpZGF0ZUl0ZW1Nb2RlbFtdID0gW107XG5cbiAgQElucHV0KClcbiAgc2V0IGNhbmRpZGF0ZXMoY2FuZGlkYXRlczogQ2FuZGlkYXRlSXRlbU1vZGVsW10pIHtcbiAgICB0aGlzLmNhbmRpZGF0ZXNWYWx1ZSA9IEFycmF5LmlzQXJyYXkoY2FuZGlkYXRlcykgPyBjYW5kaWRhdGVzIDogW107XG4gICAgdGhpcy5hcHBseUZpbHRlcigpO1xuICB9XG5cbiAgZ2V0IGNhbmRpZGF0ZXMoKTogQ2FuZGlkYXRlSXRlbU1vZGVsW10ge1xuICAgIHJldHVybiB0aGlzLmNhbmRpZGF0ZXNWYWx1ZTtcbiAgfVxuXG4gIEBJbnB1dCgpIG1heEhlaWdodCA9ICczODBweCc7XG4gIEBJbnB1dCgpIGxhYmVsID0gJyc7XG4gIEBJbnB1dCgpIHNlYXJjaFBsYWNlaG9sZGVyID0gJ1NlYXJjaCBieSBOYW1lLCBFbWFpbCBvciBUaXRsZSc7XG4gIEBJbnB1dCgpIG5vTWF0Y2hUZXh0ID0gJ05vIG1hdGNoZXMgZm91bmQnO1xuICBASW5wdXQoKSBlcnJvclRleHQgPSAnU29tZXRoaW5nIHdlbnQgd3JvbmcuIFBsZWFzZSB0cnkgYWdhaW4uJztcbiAgQElucHV0KCkgaXNMb2FkaW5nID0gZmFsc2U7XG4gIEBJbnB1dCgpIGhhc0Vycm9yID0gZmFsc2U7XG4gIEBJbnB1dCgpIHNob3dTZWFyY2ggPSB0cnVlO1xuXG4gIEBPdXRwdXQoKSBzZWxlY3Rpb25DaGFuZ2VkID0gbmV3IEV2ZW50RW1pdHRlcjxDYW5kaWRhdGVJdGVtU2VsZWN0aW9uRXZlbnQ+KCk7XG4gIEBPdXRwdXQoKSBzZWFyY2hDaGFuZ2VkID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG5cbiAgc2VhcmNoVGVybSA9ICcnO1xuICBmaWx0ZXJlZENhbmRpZGF0ZXM6IENhbmRpZGF0ZUl0ZW1Nb2RlbFtdID0gW107XG5cbiAgdHJhY2tCeUNhbmRpZGF0ZShpbmRleDogbnVtYmVyLCBjYW5kaWRhdGU6IENhbmRpZGF0ZUl0ZW1Nb2RlbCk6IHN0cmluZyB8IG51bWJlciB7XG4gICAgcmV0dXJuIGNhbmRpZGF0ZT8uaWQgPz8gaW5kZXg7XG4gIH1cblxuICBoYW5kbGVTZWxlY3Rpb25DaGFuZ2VkKGV2ZW50OiBDYW5kaWRhdGVJdGVtU2VsZWN0aW9uRXZlbnQpOiB2b2lkIHtcbiAgICB0aGlzLnNlbGVjdGlvbkNoYW5nZWQuZW1pdChldmVudCk7XG4gIH1cblxuICBoYW5kbGVTZWFyY2hDaGFuZ2UodmFsdWU6IHN0cmluZyk6IHZvaWQge1xuICAgIHRoaXMuc2VhcmNoVGVybSA9IHZhbHVlID8/ICcnO1xuICAgIHRoaXMuYXBwbHlGaWx0ZXIoKTtcbiAgICB0aGlzLnNlYXJjaENoYW5nZWQuZW1pdCh0aGlzLnNlYXJjaFRlcm0pO1xuICB9XG5cbiAgcHJpdmF0ZSBhcHBseUZpbHRlcigpOiB2b2lkIHtcbiAgICBjb25zdCB0ZXJtID0gdGhpcy5zZWFyY2hUZXJtLnRyaW0oKS50b0xvd2VyQ2FzZSgpO1xuICAgIGlmICghdGVybSkge1xuICAgICAgdGhpcy5maWx0ZXJlZENhbmRpZGF0ZXMgPSBbLi4udGhpcy5jYW5kaWRhdGVzVmFsdWVdO1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB0aGlzLmZpbHRlcmVkQ2FuZGlkYXRlcyA9IHRoaXMuY2FuZGlkYXRlc1ZhbHVlLmZpbHRlcigoY2FuZGlkYXRlKSA9PiB7XG4gICAgICBjb25zdCBuYW1lID0gY2FuZGlkYXRlPy5uYW1lPy50b0xvd2VyQ2FzZSgpID8/ICcnO1xuICAgICAgY29uc3QgZW1haWwgPSBjYW5kaWRhdGU/LmVtYWlsPy50b0xvd2VyQ2FzZSgpID8/ICcnO1xuICAgICAgY29uc3QgdGl0bGUgPSBjYW5kaWRhdGU/LnRpdGxlPy50b0xvd2VyQ2FzZSgpID8/ICcnO1xuICAgICAgcmV0dXJuIG5hbWUuaW5jbHVkZXModGVybSkgfHwgZW1haWwuaW5jbHVkZXModGVybSkgfHwgdGl0bGUuaW5jbHVkZXModGVybSk7XG4gICAgfSk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJzZngtY2FuZGlkYXRlLWxpc3RcIj5cbiAgPGRpdiBjbGFzcz1cInNmeC1jYW5kaWRhdGUtbGlzdF9fc2VhcmNoXCIgKm5nSWY9XCJzaG93U2VhcmNoXCI+XG4gICAgPHN5bXBob255LWlucHV0LXRleHRcbiAgICAgIFtwbGFjZWhvbGRlcl09XCJzZWFyY2hQbGFjZWhvbGRlclwiXG4gICAgICBpY29uPVwic2ktc2VhcmNoLW5ld1wiXG4gICAgICBbbGFiZWxdPVwibGFiZWxcIlxuICAgICAgW2lzSW52ZXJzZV09XCJmYWxzZVwiXG4gICAgICBbdmFsdWVdPVwic2VhcmNoVGVybVwiXG4gICAgICBbaXNEaXNhYmxlZF09XCJmYWxzZVwiXG4gICAgICBbaXNMYWJlbFZpZXddPVwiZmFsc2VcIlxuICAgICAgKHRleHRDaGFuZ2UpPVwiaGFuZGxlU2VhcmNoQ2hhbmdlKCRldmVudClcIlxuICAgID48L3N5bXBob255LWlucHV0LXRleHQ+XG4gIDwvZGl2PlxuXG4gIDxkaXYgY2xhc3M9XCJzZngtY2FuZGlkYXRlLWxpc3RfX3dyYXBwZXJcIiBbc3R5bGUubWF4SGVpZ2h0XT1cIm1heEhlaWdodFwiPlxuICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJpc0xvYWRpbmc7IGVsc2UgbG9hZGVkU3RhdGVcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJzZngtY2FuZGlkYXRlLWxpc3RfX3N0YXRlIHNmeC1jYW5kaWRhdGUtbGlzdF9fc3RhdGUtLWxvYWRpbmdcIj5cbiAgICAgICAgPHN5bXBob255LXNmeC1sb2FkZXI+PC9zeW1waG9ueS1zZngtbG9hZGVyPlxuICAgICAgPC9kaXY+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgICA8bmctdGVtcGxhdGUgI2xvYWRlZFN0YXRlPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImhhc0Vycm9yOyBlbHNlIHJlYWR5U3RhdGVcIj5cbiAgICAgICAgPGRpdiBjbGFzcz1cInNmeC1jYW5kaWRhdGUtbGlzdF9fc3RhdGUgc2Z4LWNhbmRpZGF0ZS1saXN0X19zdGF0ZS0tZXJyb3JcIj5cbiAgICAgICAgICA8c3ltcGhvbnktcGFyYWdyYXBoXG4gICAgICAgICAgICBjbGFzcz1cInNmeC1jYW5kaWRhdGUtbGlzdF9fc3RhdGUtbWVzc2FnZVwiXG4gICAgICAgICAgICBbZm9udFNpemVdPVwiJzE0cHgnXCJcbiAgICAgICAgICA+XG4gICAgICAgICAgICB7eyBlcnJvclRleHQgfX1cbiAgICAgICAgICA8L3N5bXBob255LXBhcmFncmFwaD5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLXRlbXBsYXRlPlxuXG4gICAgPG5nLXRlbXBsYXRlICNyZWFkeVN0YXRlPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImZpbHRlcmVkQ2FuZGlkYXRlcz8ubGVuZ3RoOyBlbHNlIGVtcHR5U3RhdGVcIj5cbiAgICAgICAgPHVsIGNsYXNzPVwic2Z4LWNhbmRpZGF0ZS1saXN0X19pdGVtcyBsaXN0LXVuc3R5bGVkXCI+XG4gICAgICAgICAgPGxpXG4gICAgICAgICAgICBjbGFzcz1cInNmeC1jYW5kaWRhdGUtbGlzdF9faXRlbVwiXG4gICAgICAgICAgICAqbmdGb3I9XCJsZXQgY2FuZGlkYXRlIG9mIGZpbHRlcmVkQ2FuZGlkYXRlczsgdHJhY2tCeTogdHJhY2tCeUNhbmRpZGF0ZVwiXG4gICAgICAgICAgPlxuICAgICAgICAgICAgPHN5bXBob255LWNhbmRpZGF0ZS1pdGVtXG4gICAgICAgICAgICAgIFtjYW5kaWRhdGVdPVwiY2FuZGlkYXRlXCJcbiAgICAgICAgICAgICAgKHNlbGVjdGlvbkNoYW5nZWQpPVwiaGFuZGxlU2VsZWN0aW9uQ2hhbmdlZCgkZXZlbnQpXCJcbiAgICAgICAgICAgID48L3N5bXBob255LWNhbmRpZGF0ZS1pdGVtPlxuICAgICAgICAgIDwvbGk+XG4gICAgICAgIDwvdWw+XG4gICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLXRlbXBsYXRlPlxuXG4gICAgPG5nLXRlbXBsYXRlICNlbXB0eVN0YXRlPlxuICAgICAgPGRpdiBjbGFzcz1cInNmeC1jYW5kaWRhdGUtbGlzdF9fc3RhdGUgc2Z4LWNhbmRpZGF0ZS1saXN0X19zdGF0ZS0tZW1wdHlcIj5cbiAgICAgICAgPHN5bXBob255LXBhcmFncmFwaFxuICAgICAgICAgIGNsYXNzPVwic2Z4LWNhbmRpZGF0ZS1saXN0X19zdGF0ZS1tZXNzYWdlXCJcbiAgICAgICAgICBbZm9udFNpemVdPVwiJzE0cHgnXCJcbiAgICAgICAgPlxuICAgICAgICAgIHt7IG5vTWF0Y2hUZXh0IH19XG4gICAgICAgIDwvc3ltcGhvbnktcGFyYWdyYXBoPlxuICAgICAgPC9kaXY+XG4gICAgPC9uZy10ZW1wbGF0ZT5cbiAgPC9kaXY+XG48L2Rpdj5cbiJdfQ==

package/esm2020/lib/organisms/candidate-list/candidate-list.module.mjs ADDED Viewed

@@ -0,0 +1,38 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { CandidateListComponent } from './candidate-list.component';
+import { CandidateItemModule } from '../../molecules/candidate-item/candidate-item.module';
+import { InputTextModule } from '../../atoms/input-text/input-text.module';
+import { SfxLoaderModule } from '../../atoms/sfx-loader/sfx-loader.module';
+import { ParagraphModule } from '../../atoms/paragraph/paragraph.module';
+import * as i0 from "@angular/core";
+export class CandidateListModule {
+}
+CandidateListModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+CandidateListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateListModule, declarations: [CandidateListComponent], imports: [CommonModule,
+        CandidateItemModule,
+        InputTextModule,
+        SfxLoaderModule,
+        ParagraphModule], exports: [CandidateListComponent] });
+CandidateListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateListModule, imports: [[
+            CommonModule,
+            CandidateItemModule,
+            InputTextModule,
+            SfxLoaderModule,
+            ParagraphModule,
+        ]] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.2", ngImport: i0, type: CandidateListModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [CandidateListComponent],
+                    imports: [
+                        CommonModule,
+                        CandidateItemModule,
+                        InputTextModule,
+                        SfxLoaderModule,
+                        ParagraphModule,
+                    ],
+                    exports: [CandidateListComponent],
+                }]
+        }] });
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2FuZGlkYXRlLWxpc3QubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50LWxpYnJhcnkvc3JjL2xpYi9vcmdhbmlzbXMvY2FuZGlkYXRlLWxpc3QvY2FuZGlkYXRlLWxpc3QubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBQ3BFLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHNEQUFzRCxDQUFDO0FBQzNGLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSwwQ0FBMEMsQ0FBQztBQUMzRSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sMENBQTBDLENBQUM7QUFDM0UsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHdDQUF3QyxDQUFDOztBQWF6RSxNQUFNLE9BQU8sbUJBQW1COztnSEFBbkIsbUJBQW1CO2lIQUFuQixtQkFBbUIsaUJBVmYsc0JBQXNCLGFBRW5DLFlBQVk7UUFDWixtQkFBbUI7UUFDbkIsZUFBZTtRQUNmLGVBQWU7UUFDZixlQUFlLGFBRVAsc0JBQXNCO2lIQUVyQixtQkFBbUIsWUFUckI7WUFDUCxZQUFZO1lBQ1osbUJBQW1CO1lBQ25CLGVBQWU7WUFDZixlQUFlO1lBQ2YsZUFBZTtTQUNoQjsyRkFHVSxtQkFBbUI7a0JBWC9CLFFBQVE7bUJBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsc0JBQXNCLENBQUM7b0JBQ3RDLE9BQU8sRUFBRTt3QkFDUCxZQUFZO3dCQUNaLG1CQUFtQjt3QkFDbkIsZUFBZTt3QkFDZixlQUFlO3dCQUNmLGVBQWU7cUJBQ2hCO29CQUNELE9BQU8sRUFBRSxDQUFDLHNCQUFzQixDQUFDO2lCQUNsQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ2FuZGlkYXRlTGlzdENvbXBvbmVudCB9IGZyb20gJy4vY2FuZGlkYXRlLWxpc3QuY29tcG9uZW50JztcbmltcG9ydCB7IENhbmRpZGF0ZUl0ZW1Nb2R1bGUgfSBmcm9tICcuLi8uLi9tb2xlY3VsZXMvY2FuZGlkYXRlLWl0ZW0vY2FuZGlkYXRlLWl0ZW0ubW9kdWxlJztcbmltcG9ydCB7IElucHV0VGV4dE1vZHVsZSB9IGZyb20gJy4uLy4uL2F0b21zL2lucHV0LXRleHQvaW5wdXQtdGV4dC5tb2R1bGUnO1xuaW1wb3J0IHsgU2Z4TG9hZGVyTW9kdWxlIH0gZnJvbSAnLi4vLi4vYXRvbXMvc2Z4LWxvYWRlci9zZngtbG9hZGVyLm1vZHVsZSc7XG5pbXBvcnQgeyBQYXJhZ3JhcGhNb2R1bGUgfSBmcm9tICcuLi8uLi9hdG9tcy9wYXJhZ3JhcGgvcGFyYWdyYXBoLm1vZHVsZSc7XG5cbkBOZ01vZHVsZSh7XG4gIGRlY2xhcmF0aW9uczogW0NhbmRpZGF0ZUxpc3RDb21wb25lbnRdLFxuICBpbXBvcnRzOiBbXG4gICAgQ29tbW9uTW9kdWxlLFxuICAgIENhbmRpZGF0ZUl0ZW1Nb2R1bGUsXG4gICAgSW5wdXRUZXh0TW9kdWxlLFxuICAgIFNmeExvYWRlck1vZHVsZSxcbiAgICBQYXJhZ3JhcGhNb2R1bGUsXG4gIF0sXG4gIGV4cG9ydHM6IFtDYW5kaWRhdGVMaXN0Q29tcG9uZW50XSxcbn0pXG5leHBvcnQgY2xhc3MgQ2FuZGlkYXRlTGlzdE1vZHVsZSB7fVxuIl19