carriera-intern-components 1.1.28 → 1.1.29

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 (8) hide show
  1. package/app/components/rating_review/rating-review/rating-review/rating-review.component.d.ts +4 -4
  2. package/app/components/rating_review/review-modal/review-modal.component.d.ts +9 -18
  3. package/app/utils/constants/input-character-sets.constants.d.ts +3 -3
  4. package/fesm2022/carriera-intern-components.mjs +39 -66
  5. package/fesm2022/carriera-intern-components.mjs.map +1 -1
  6. package/package.json +1 -1
  7. package/src/styles/popover.scss +21 -0
  8. package/src/styles/review_variables.scss +3 -0
package/fesm2022/carriera-intern-components.mjs CHANGED
@@ -7185,17 +7185,16 @@ class SingleReviewComponent {
7185
7185
  event.preventDefault();
7186
7186
  }
7187
7187
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SingleReviewComponent, deps: [{ token: DateFormatingPipe }], target: i0.ɵɵFactoryTarget.Component });
7188
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: SingleReviewComponent, isStandalone: true, selector: "cai-single-review", inputs: { type: "type", singleReview: "singleReview" }, outputs: { deleteReview: "deleteReview", onAddedReview: "onAddedReview", onEditedReview: "onEditedReview" }, providers: [DateFormatingPipe], ngImport: i0, template: "@let avatarFile = singleReview.companyUser?.avatarFile; @let driver =\navatarFile?.driver; @let companyUser = this.singleReview.companyUser; @let\ncurrentUser = this.singleReview.isItCurrentCompanyUser; @let comment =\nthis.singleReview.comment; @let edited = this.singleReview.isEdited; @let\nactiveLike = this.singleReview.thumb === 'like'; @let activeDislike =\nthis.singleReview.thumb === 'dislike'; @let currentRating =\nthis.singleReview.thumb;\n<div\n class=\"review-wrapper\"\n [class]=\"{\n 'not-editing': !editing(),\n 'dark-mode': type === ReviewType.Table,\n 'modal-type': type === ReviewType.Modal,\n 'details-type': type === ReviewType.Details\n }\"\n (click)=\"onExpandToggle()\"\n>\n @if(type === ReviewType.Modal){\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"driver!\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(You)</span>\n\n } @if(!editing() && currentRating){\n <span class=\"dot\">\u2022</span>\n\n <svg-icon\n [name]=\"currentRating === 'like' ? 'cai-like' : 'cai-dislike'\"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n } @if(editing()){\n <span class=\"description\">{{\n !edited ? \"\u2022 Posting Publicly\" : \"\u2022 Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"activeLike\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"activeDislike\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n } }@else if(type === ReviewType.Table || type === ReviewType.Details) {\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"avatarFile!.driver\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <div class=\"column\">\n <div class=\"upper-row\">\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(Me)</span>\n\n } @if(!editing()){\n <svg-icon\n [name]=\"\n currentRating === 'like'\n ? 'cai-like'\n : currentRating === 'dislike'\n ? 'cai-dislike'\n : ''\n \"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n }\n </div>\n <div class=\"lower-row\">\n @if(editing()){\n <span class=\"description\">{{\n !edited ? \"Posting Publicly\" : \"Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n </div>\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"currentRating === 'like'\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"currentRating === 'dislike'\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(canExpand() && !expanded()){\n <svg-icon name=\"cai-expand\" class=\"expand-icon\" />\n }@else if(canExpand() && !currentUser && expanded()){\n <svg-icon name=\"cai-expand\" class=\"collapse-icon\" />\n } @else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n }}\n</div>\n@if(type === ReviewType.Table){\n<div class=\"bottom-divider-light\"></div>\n\n} @if(currentUser && ReviewType.Details){\n<div class=\"bottom-divider-dark\"></div>\n}\n<!-- @if(currentUser && (type === ReviewType.Details || type ===\nReviewType.Modal)){\n<div class=\"bottom-divider-dark\"></div>\n\n} -->\n", styles: ["svg-icon{width:18px!important;height:18px!important;display:grid;place-items:center;color:#919191}svg-icon svg{display:grid;place-items:center;width:18px;height:18px}.column{display:flex;flex-direction:column}.personal{font-weight:700;line-height:18px;color:#f77d3b}.edited{color:#3b73ed;font-weight:500;line-height:18px}.current-rating-like{color:#56b4ac!important}.current-rating-dislike{color:#e66767!important}.active-like :hover .like-icon{color:red}.review-wrapper.modal-type{background-color:#1d1d1d;max-width:456px;border-radius:2px;padding:2px}.review-wrapper.modal-type.not-editing{background-color:transparent}.review-wrapper.modal-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .info .name{color:#000}.review-wrapper.modal-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.modal-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;line-height:18px;white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word;font-size:14px!important}.review-wrapper.modal-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.modal-type.not-editing .controls .pencil-icon{color:#919191!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover{background-color:#91919133!important;color:#424242!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.modal-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.modal-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.modal-type.not-editing:hover{background-color:#eee}.review-wrapper.modal-type.not-editing:hover .controls{visibility:visible}.review-wrapper.modal-type .upper{padding:2px 2px 2px 4px;display:flex;justify-content:space-between}.review-wrapper.modal-type .upper .info{display:flex;align-items:center;gap:4px}.review-wrapper.modal-type .upper .info .name{line-height:18px;font-weight:600;color:#fff}.review-wrapper.modal-type .upper .info .dot{color:#919191}.review-wrapper.modal-type .upper .info .description,.review-wrapper.modal-type .upper .info .edit-time{color:#919191;font-weight:500;line-height:18px}.review-wrapper.modal-type .upper .rating{display:flex;gap:4px;align-items:center;padding-bottom:4px}.review-wrapper.modal-type .upper .rating .like-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .like-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .like-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .like-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .like-icon.like-active :hover path{fill:#b6dfdb}.review-wrapper.modal-type .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.modal-type .upper .rating .dislike-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .dislike-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .dislike-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .dislike-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active :hover path{fill:#e87c7c}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.modal-type .upper .rating .separator{border:1px solid #919191;height:14px}.review-wrapper.modal-type .upper .rating svg-icon{width:18px;height:18px;display:grid;place-items:center;background-color:#ffffffb2}.review-wrapper.modal-type .upper .rating svg-icon:hover{cursor:pointer}.review-wrapper.modal-type .upper .rating .checkmark-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.modal-type .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .checkmark-icon path{fill:#1d1d1d}.review-wrapper.modal-type .upper .rating .cancel-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .cancel-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .cancel-icon path{fill:#1d1d1d}.review-wrapper.modal-type .lower{font-size:14px!important;font-weight:400!important;padding:2px 4px 4px;line-height:18px;cursor:text}.profile-img{width:22px}.lower{color:#fff;outline:none;overflow-y:auto;padding:2px 4px 4px;text-indent:0;display:block;background-color:#1d1d1d;border-radius:2px;font-size:11px;font-weight:400}.lower:hover{cursor:pointer}.lower:empty:after{content:attr(data-placeholder);color:#919191;line-height:14px}.svg-group{position:relative;display:flex;align-items:center}.bottom-divider-dark{margin-top:6px;border-bottom:1px solid #DADADA}.bottom-divider-light{border-bottom:1px solid #424242}svg-icon{display:inline-block;border-radius:1px;display:grid;place-items:center}svg-icon:hover{cursor:pointer}svg-icon svg{width:14px;height:14px}.review-wrapper.dark-mode{background-color:#dadada!important;color:#919191;padding:2px}.review-wrapper.dark-mode .upper{display:flex;align-items:center;padding:0 2px}.review-wrapper.dark-mode .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.dark-mode .upper .info .column{font-size:11px}.review-wrapper.dark-mode .upper .info .column .upper-row{display:flex;gap:4px}.review-wrapper.dark-mode .upper .info .column .upper-row .name{font-weight:600;color:#424242}.review-wrapper.dark-mode .upper .info .column .upper-row svg-icon{width:18px!important;height:18px;display:flex;align-items:center}.review-wrapper.dark-mode .upper .info .column .lower-row{display:flex;gap:4px}.review-wrapper.dark-mode .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.dark-mode .upper .rating .like-icon{width:14px;height:14px}.review-wrapper.dark-mode .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.dark-mode .upper .rating .like-icon:hover:not(.like-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .dislike-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.dark-mode .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.dark-mode .upper .rating .dislike-icon:hover:not(.dislike-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .checkmark-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.dark-mode .upper .rating .checkmark-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .cancel-icon svg{fill:transparent!important;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;visibility:hidden}.review-wrapper.dark-mode .upper .controls .pencil-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover path{fill:#dadada}.review-wrapper.dark-mode .upper .controls .trash-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .trash-icon:hover path{fill:#dadada}.review-wrapper.dark-mode:hover{cursor:pointer}.review-wrapper.dark-mode:hover .controls{visibility:visible!important}.review-wrapper.dark-mode .lower{background-color:#dadada!important;color:#2f2f2f;line-height:14px}.review-wrapper.dark-mode.not-editing{background-color:#2f2f2f!important}.review-wrapper.dark-mode.not-editing .upper{background-color:transparent}.review-wrapper.dark-mode.not-editing .upper .name{color:#fff!important}.review-wrapper.dark-mode.not-editing .lower{background-color:#2f2f2f!important;color:#fff!important}.review-wrapper.dark-mode.not-editing:hover,.review-wrapper.dark-mode.not-editing:hover .lower{background-color:#424242!important}.review-wrapper.dark-mode.not-editing:hover .expand-icon,.review-wrapper.dark-mode.not-editing:hover .collapse-icon{opacity:1}.review-wrapper.details-type{background-color:#1d1d1d;max-width:300px;padding:2px;border-radius:2px}.review-wrapper.details-type.not-editing{background-color:transparent}.review-wrapper.details-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .info .column{display:flex}.review-wrapper.details-type.not-editing .upper .info .column .upper-row .name{font-weight:600;color:#424242!important;font-size:11px}.review-wrapper.details-type.not-editing .upper .rating .svg-group svg-icon{background-color:red!important}.review-wrapper.details-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.details-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;word-break:break-word;overflow-wrap:break-word}.review-wrapper.details-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.details-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.details-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.details-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.details-type.not-editing:hover{background-color:#eee}.review-wrapper.details-type.not-editing:hover .controls{visibility:visible}.review-wrapper.details-type .upper{display:flex;align-items:start;padding:0 2px}.review-wrapper.details-type .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.details-type .upper .info .column{display:flex;font-size:11px}.review-wrapper.details-type .upper .info .column .upper-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .upper-row .name{font-weight:600;color:#fff;line-height:14px!important}.review-wrapper.details-type .upper .info .column .upper-row .personal{line-height:14px}.review-wrapper.details-type .upper .info .column .upper-row svg-icon{width:14px!important;height:14px;display:flex;align-items:center}.review-wrapper.details-type .upper .info .column .lower-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .lower-row .description{font-weight:500;line-height:14px;font-size:11px;color:#919191}.review-wrapper.details-type .upper .info .column .lower-row .edit-time{line-height:14px;color:#919191;font-weight:500;font-size:11px}.review-wrapper.details-type .upper .info .column .lower-row .edited{line-height:14px}.review-wrapper.details-type .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.details-type .upper .rating svg-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.details-type .upper .rating .like-icon.like-active{color:#56b4ac;background-color:transparent}.review-wrapper.details-type .upper .rating .like-icon:hover:not(.like-active){color:#ccc}.review-wrapper.details-type .upper .rating .dislike-icon.dislike-active{color:#e66767}.review-wrapper.details-type .upper .rating .dislike-icon:hover:not(.dislike-active){color:#ccc}.review-wrapper.details-type .upper .rating .checkmark-icon{background-color:#919191!important;color:#1d1d1d;transition:transform .2s ease-in-out}.review-wrapper.details-type .upper .rating .checkmark-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.details-type .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out;color:#1d1d1d}.review-wrapper.details-type .upper .rating .cancel-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.details-type .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;opacity:0;pointer-events:none}.review-wrapper.details-type .upper .controls .svg-group{display:flex;height:100%;align-items:start;padding:2px}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover path{fill:#dadada}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover path{fill:#dadada}.review-wrapper.details-type .lower{line-height:14px!important;padding:2px 4px!important;cursor:text}.review-wrapper.details-type:hover{cursor:pointer}.review-wrapper.details-type:hover .controls{opacity:1!important;pointer-events:auto!important}.expand-icon{padding:4px 2px;margin-left:auto;opacity:0}.expand-icon path{fill:#ccc}.collapse-icon{transform:rotate(180deg);padding:4px 2px;margin-left:auto;opacity:0}.collapse-icon path{fill:#ccc}\n"], dependencies: [{ kind: "component", type: SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "svgClass", "class", "viewBox", "svgAriaLabel", "onSVGLoaded", "svgStyle"] }, { kind: "component", type: AvatarComponent, selector: "cai-avatar", inputs: ["driver", "size", "rounded", "inverse"] }, { kind: "ngmodule", type: NgbPopoverModule }, { kind: "ngmodule", type: NgbModule }, { kind: "directive", type: i2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "ngmodule", type: NgbTooltipModule }] });
7188
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: SingleReviewComponent, isStandalone: true, selector: "cai-single-review", inputs: { type: "type", singleReview: "singleReview" }, outputs: { deleteReview: "deleteReview", onAddedReview: "onAddedReview", onEditedReview: "onEditedReview" }, providers: [DateFormatingPipe], ngImport: i0, template: "@let avatarFile = singleReview.companyUser?.avatarFile; @let driver =\navatarFile?.driver; @let companyUser = this.singleReview.companyUser; @let\ncurrentUser = this.singleReview.isItCurrentCompanyUser; @let comment =\nthis.singleReview.comment; @let edited = this.singleReview.isEdited; @let\nactiveLike = this.singleReview.thumb === 'like'; @let activeDislike =\nthis.singleReview.thumb === 'dislike'; @let currentRating =\nthis.singleReview.thumb;\n<div\n class=\"review-wrapper\"\n [class]=\"{\n 'not-editing': !editing(),\n 'dark-mode': type === ReviewType.Table,\n 'modal-type': type === ReviewType.Modal,\n 'details-type': type === ReviewType.Details\n }\"\n (click)=\"onExpandToggle()\"\n>\n @if(type === ReviewType.Modal){\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"driver!\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(You)</span>\n\n } @if(!editing() && currentRating){\n <span class=\"dot\">\u2022</span>\n\n <svg-icon\n [name]=\"currentRating === 'like' ? 'cai-like' : 'cai-dislike'\"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n } @if(editing()){\n <span class=\"description\">{{\n !edited ? \"\u2022 Posting Publicly\" : \"\u2022 Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"activeLike\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"activeDislike\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n } }@else if(type === ReviewType.Table || type === ReviewType.Details) {\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"avatarFile!.driver\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <div class=\"column\">\n <div class=\"upper-row\">\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(Me)</span>\n\n } @if(!editing()){\n <svg-icon\n [name]=\"\n currentRating === 'like'\n ? 'cai-like'\n : currentRating === 'dislike'\n ? 'cai-dislike'\n : ''\n \"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n }\n </div>\n <div class=\"lower-row\">\n @if(editing()){\n <span class=\"description\">{{\n !edited ? \"Posting Publicly\" : \"Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n </div>\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"currentRating === 'like'\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"currentRating === 'dislike'\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(canExpand() && !expanded()){\n <svg-icon name=\"cai-expand\" class=\"expand-icon\" />\n }@else if(canExpand() && !currentUser && expanded()){\n <svg-icon name=\"cai-expand\" class=\"collapse-icon\" />\n } @else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n }}\n</div>\n<!-- @if(type === ReviewType.Table){\n<div class=\"bottom-divider-light\"></div>\n} --> \n@if(currentUser && type === ReviewType.Details){\n<div class=\"bottom-divider-dark\"></div>\n}\n<!-- @if(currentUser && (type === ReviewType.Details || type ===\nReviewType.Modal)){\n<div class=\"bottom-divider-dark\"></div>\n\n} -->\n", styles: ["svg-icon{width:18px!important;height:18px!important;display:grid;place-items:center;color:#919191}svg-icon svg{display:grid;place-items:center;width:18px;height:18px}.column{display:flex;flex-direction:column}.personal{font-weight:700;line-height:18px;color:#f77d3b}.edited{color:#3b73ed;font-weight:500;line-height:18px}.current-rating-like{color:#56b4ac!important}.current-rating-dislike{color:#e66767!important}.active-like :hover .like-icon{color:red}.review-wrapper.modal-type{background-color:#1d1d1d;max-width:456px;border-radius:2px;padding:2px;margin-left:6px;margin-right:6px}.review-wrapper.modal-type.not-editing{background-color:transparent}.review-wrapper.modal-type.not-editing .upper{padding:2px 2px 0 4px}.review-wrapper.modal-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .info .name{color:#000}.review-wrapper.modal-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.modal-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;line-height:18px;white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word;font-size:14px!important}.review-wrapper.modal-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.modal-type.not-editing .controls .pencil-icon{color:#919191!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover{background-color:#91919133!important;color:#424242!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.modal-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.modal-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.modal-type.not-editing:hover{background-color:#eee}.review-wrapper.modal-type.not-editing:hover .controls{visibility:visible}.review-wrapper.modal-type .upper{padding:2px 2px 2px 4px;display:flex;justify-content:space-between}.review-wrapper.modal-type .upper .info{display:flex;align-items:center;gap:4px}.review-wrapper.modal-type .upper .info .name{line-height:18px;font-weight:600;color:#fff}.review-wrapper.modal-type .upper .info .dot{color:#919191}.review-wrapper.modal-type .upper .info .description,.review-wrapper.modal-type .upper .info .edit-time{color:#919191;font-weight:500;line-height:18px}.review-wrapper.modal-type .upper .rating{display:flex;gap:4px;align-items:center;padding-bottom:4px}.review-wrapper.modal-type .upper .rating .like-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .like-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .like-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .like-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .like-icon.like-active :hover path{fill:#b6dfdb}.review-wrapper.modal-type .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.modal-type .upper .rating .dislike-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .dislike-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .dislike-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .dislike-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active :hover path{fill:#e87c7c}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.modal-type .upper .rating .separator{border:1px solid #919191;height:14px}.review-wrapper.modal-type .upper .rating svg-icon{width:18px;height:18px;display:grid;place-items:center;background-color:#ffffffb2}.review-wrapper.modal-type .upper .rating svg-icon:hover{cursor:pointer}.review-wrapper.modal-type .upper .rating .checkmark-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.modal-type .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .checkmark-icon path{fill:#1d1d1d}.review-wrapper.modal-type .upper .rating .cancel-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .cancel-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .cancel-icon path{fill:#1d1d1d}.review-wrapper.modal-type .lower{font-size:14px!important;font-weight:400!important;padding:2px 4px 4px;line-height:18px;cursor:text}.profile-img{width:22px}.lower{color:#fff;outline:none;overflow-y:auto;padding:2px 4px 4px;text-indent:0;display:block;background-color:#1d1d1d;border-radius:2px;font-size:11px;font-weight:400}.lower:hover{cursor:pointer}.lower:empty:after{content:attr(data-placeholder);color:#919191;line-height:14px}.svg-group{position:relative;display:flex;align-items:center}.bottom-divider-dark{margin-top:6px;margin-left:6px;margin-right:6px;border-bottom:1px solid #DADADA}.bottom-divider-light{border-bottom:1px solid #424242}svg-icon{display:inline-block;border-radius:1px;display:grid;place-items:center}svg-icon:hover{cursor:pointer}svg-icon svg{width:14px;height:14px}.review-wrapper.dark-mode{background-color:#dadada!important;color:#919191;border-radius:2px;max-width:252px;padding:2px}.review-wrapper.dark-mode.not-editing{background-color:transparent}.review-wrapper.dark-mode.not-editing:hover{background-color:#eee}.review-wrapper.dark-mode.not-editing .upper{display:flex;align-items:start}.review-wrapper.dark-mode.not-editing .upper .info{display:flex;align-items:center;padding:0!important}.review-wrapper.dark-mode.not-editing .upper .info .column{display:flex}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row{display:flex;align-items:center;line-height:14px;height:14px}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row .name{font-weight:600;color:#fff!important;font-size:11px}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row .personal{line-height:14px!important}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row .current-rating-like{transform:scaleX(-1)}.review-wrapper.dark-mode.not-editing .upper .info .column .lower-row{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:500;line-height:14px!important}.review-wrapper.dark-mode.not-editing .upper .info .column .lower-row .edit-time{color:#919191}.review-wrapper.dark-mode.not-editing .upper .info .column .lower-row .edited{color:#92b1f5;line-height:14px!important}.review-wrapper.dark-mode.not-editing .upper .rating .svg-group svg-icon{background-color:red!important}.review-wrapper.dark-mode.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.dark-mode .upper{display:flex;align-items:start;padding:0 2px}.review-wrapper.dark-mode .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.dark-mode .upper .info .column{font-size:11px}.review-wrapper.dark-mode .upper .info .column .upper-row{display:flex;gap:4px}.review-wrapper.dark-mode .upper .info .column .upper-row .name{font-weight:600;font-size:11px;line-height:14px;color:#424242}.review-wrapper.dark-mode .upper .info .column .upper-row svg-icon{width:18px!important;height:18px;display:flex;align-items:center}.review-wrapper.dark-mode .upper .info .column .lower-row{display:flex}.review-wrapper.dark-mode .upper .info .column .lower-row .description{line-height:14px;font-size:11px}.review-wrapper.dark-mode .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.dark-mode .upper .rating .like-icon{width:14px;height:14px}.review-wrapper.dark-mode .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.dark-mode .upper .rating .like-icon.like-active:hover path{fill:#b6dfdb}.review-wrapper.dark-mode .upper .rating .like-icon:hover:not(.like-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .dislike-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.dark-mode .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.dark-mode .upper .rating .dislike-icon.dislike-active:hover path{fill:#e87c7c}.review-wrapper.dark-mode .upper .rating .dislike-icon:hover:not(.dislike-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .checkmark-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.dark-mode .upper .rating .checkmark-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .cancel-icon svg{fill:transparent!important;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;visibility:hidden}.review-wrapper.dark-mode .upper .controls .pencil-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover path{fill:#dadada}.review-wrapper.dark-mode .upper .controls .trash-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .trash-icon:hover path{fill:#dadada}.review-wrapper.dark-mode:hover{cursor:pointer}.review-wrapper.dark-mode:hover .controls{visibility:visible!important}.review-wrapper.dark-mode .lower{background-color:#dadada!important;color:#2f2f2f;line-height:14px}.review-wrapper.dark-mode.not-editing{background-color:#2f2f2f!important}.review-wrapper.dark-mode.not-editing .upper{background-color:transparent}.review-wrapper.dark-mode.not-editing .upper .name{color:#fff!important}.review-wrapper.dark-mode.not-editing .lower{background-color:#2f2f2f!important;color:#fff!important}.review-wrapper.dark-mode.not-editing:hover,.review-wrapper.dark-mode.not-editing:hover .lower{background-color:#424242!important}.review-wrapper.dark-mode.not-editing:hover .expand-icon,.review-wrapper.dark-mode.not-editing:hover .collapse-icon{opacity:1}.review-wrapper.details-type{background-color:#1d1d1d;max-width:300px;padding:2px;border-radius:2px}.review-wrapper.details-type.not-editing{background-color:transparent}.review-wrapper.details-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .info .column{display:flex}.review-wrapper.details-type.not-editing .upper .info .column .upper-row .name{font-weight:600;color:#424242!important;font-size:11px}.review-wrapper.details-type.not-editing .upper .rating .svg-group svg-icon{background-color:red!important}.review-wrapper.details-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.details-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;word-break:break-word;overflow-wrap:break-word}.review-wrapper.details-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.details-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.details-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.details-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.details-type.not-editing:hover{background-color:#eee}.review-wrapper.details-type.not-editing:hover .controls{visibility:visible}.review-wrapper.details-type .upper{display:flex;align-items:start}.review-wrapper.details-type .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.details-type .upper .info .column{display:flex;font-size:11px}.review-wrapper.details-type .upper .info .column .upper-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .upper-row .name{font-weight:600;color:#fff;line-height:14px!important}.review-wrapper.details-type .upper .info .column .upper-row .personal{line-height:14px}.review-wrapper.details-type .upper .info .column .upper-row svg-icon{width:14px!important;height:14px;display:flex;align-items:center}.review-wrapper.details-type .upper .info .column .lower-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .lower-row .description{font-weight:500;line-height:14px;font-size:11px;color:#919191}.review-wrapper.details-type .upper .info .column .lower-row .edit-time{line-height:14px;color:#919191;font-weight:500;font-size:11px}.review-wrapper.details-type .upper .info .column .lower-row .edited{line-height:14px}.review-wrapper.details-type .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.details-type .upper .rating svg-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.details-type .upper .rating .like-icon.like-active{color:#56b4ac;background-color:transparent}.review-wrapper.details-type .upper .rating .like-icon:hover:not(.like-active){color:#ccc}.review-wrapper.details-type .upper .rating .dislike-icon.dislike-active{color:#e66767}.review-wrapper.details-type .upper .rating .dislike-icon:hover:not(.dislike-active){color:#ccc}.review-wrapper.details-type .upper .rating .checkmark-icon{background-color:#919191!important;color:#1d1d1d;transition:transform .2s ease-in-out}.review-wrapper.details-type .upper .rating .checkmark-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.details-type .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out;color:#1d1d1d}.review-wrapper.details-type .upper .rating .cancel-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.details-type .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;opacity:0;pointer-events:none}.review-wrapper.details-type .upper .controls .svg-group{display:flex;height:100%;align-items:start;padding:2px}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover path{fill:#dadada}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover path{fill:#dadada}.review-wrapper.details-type .lower{line-height:14px!important;padding:2px 4px!important;cursor:text}.review-wrapper.details-type:hover{cursor:pointer}.review-wrapper.details-type:hover .controls{opacity:1!important;pointer-events:auto!important}.expand-icon{padding:4px 2px;margin-left:auto;opacity:0}.expand-icon path{fill:#ccc}.collapse-icon{transform:rotate(180deg);padding:4px 2px;margin-left:auto;opacity:0}.collapse-icon path{fill:#ccc}\n"], dependencies: [{ kind: "component", type: SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "svgClass", "class", "viewBox", "svgAriaLabel", "onSVGLoaded", "svgStyle"] }, { kind: "component", type: AvatarComponent, selector: "cai-avatar", inputs: ["driver", "size", "rounded", "inverse"] }, { kind: "ngmodule", type: NgbModule }, { kind: "directive", type: i2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "ngmodule", type: NgbTooltipModule }] });
7189
7189
  }
7190
7190
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SingleReviewComponent, decorators: [{
7191
7191
  type: Component,
7192
7192
  args: [{ selector: 'cai-single-review', imports: [
7193
7193
  SvgIconComponent,
7194
7194
  AvatarComponent,
7195
- NgbPopoverModule,
7196
7195
  NgbModule,
7197
7196
  NgbTooltipModule,
7198
- ], providers: [DateFormatingPipe], template: "@let avatarFile = singleReview.companyUser?.avatarFile; @let driver =\navatarFile?.driver; @let companyUser = this.singleReview.companyUser; @let\ncurrentUser = this.singleReview.isItCurrentCompanyUser; @let comment =\nthis.singleReview.comment; @let edited = this.singleReview.isEdited; @let\nactiveLike = this.singleReview.thumb === 'like'; @let activeDislike =\nthis.singleReview.thumb === 'dislike'; @let currentRating =\nthis.singleReview.thumb;\n<div\n class=\"review-wrapper\"\n [class]=\"{\n 'not-editing': !editing(),\n 'dark-mode': type === ReviewType.Table,\n 'modal-type': type === ReviewType.Modal,\n 'details-type': type === ReviewType.Details\n }\"\n (click)=\"onExpandToggle()\"\n>\n @if(type === ReviewType.Modal){\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"driver!\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(You)</span>\n\n } @if(!editing() && currentRating){\n <span class=\"dot\">\u2022</span>\n\n <svg-icon\n [name]=\"currentRating === 'like' ? 'cai-like' : 'cai-dislike'\"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n } @if(editing()){\n <span class=\"description\">{{\n !edited ? \"\u2022 Posting Publicly\" : \"\u2022 Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"activeLike\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"activeDislike\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n } }@else if(type === ReviewType.Table || type === ReviewType.Details) {\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"avatarFile!.driver\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <div class=\"column\">\n <div class=\"upper-row\">\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(Me)</span>\n\n } @if(!editing()){\n <svg-icon\n [name]=\"\n currentRating === 'like'\n ? 'cai-like'\n : currentRating === 'dislike'\n ? 'cai-dislike'\n : ''\n \"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n }\n </div>\n <div class=\"lower-row\">\n @if(editing()){\n <span class=\"description\">{{\n !edited ? \"Posting Publicly\" : \"Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n </div>\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"currentRating === 'like'\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"currentRating === 'dislike'\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(canExpand() && !expanded()){\n <svg-icon name=\"cai-expand\" class=\"expand-icon\" />\n }@else if(canExpand() && !currentUser && expanded()){\n <svg-icon name=\"cai-expand\" class=\"collapse-icon\" />\n } @else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n }}\n</div>\n@if(type === ReviewType.Table){\n<div class=\"bottom-divider-light\"></div>\n\n} @if(currentUser && ReviewType.Details){\n<div class=\"bottom-divider-dark\"></div>\n}\n<!-- @if(currentUser && (type === ReviewType.Details || type ===\nReviewType.Modal)){\n<div class=\"bottom-divider-dark\"></div>\n\n} -->\n", styles: ["svg-icon{width:18px!important;height:18px!important;display:grid;place-items:center;color:#919191}svg-icon svg{display:grid;place-items:center;width:18px;height:18px}.column{display:flex;flex-direction:column}.personal{font-weight:700;line-height:18px;color:#f77d3b}.edited{color:#3b73ed;font-weight:500;line-height:18px}.current-rating-like{color:#56b4ac!important}.current-rating-dislike{color:#e66767!important}.active-like :hover .like-icon{color:red}.review-wrapper.modal-type{background-color:#1d1d1d;max-width:456px;border-radius:2px;padding:2px}.review-wrapper.modal-type.not-editing{background-color:transparent}.review-wrapper.modal-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .info .name{color:#000}.review-wrapper.modal-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.modal-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;line-height:18px;white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word;font-size:14px!important}.review-wrapper.modal-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.modal-type.not-editing .controls .pencil-icon{color:#919191!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover{background-color:#91919133!important;color:#424242!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.modal-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.modal-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.modal-type.not-editing:hover{background-color:#eee}.review-wrapper.modal-type.not-editing:hover .controls{visibility:visible}.review-wrapper.modal-type .upper{padding:2px 2px 2px 4px;display:flex;justify-content:space-between}.review-wrapper.modal-type .upper .info{display:flex;align-items:center;gap:4px}.review-wrapper.modal-type .upper .info .name{line-height:18px;font-weight:600;color:#fff}.review-wrapper.modal-type .upper .info .dot{color:#919191}.review-wrapper.modal-type .upper .info .description,.review-wrapper.modal-type .upper .info .edit-time{color:#919191;font-weight:500;line-height:18px}.review-wrapper.modal-type .upper .rating{display:flex;gap:4px;align-items:center;padding-bottom:4px}.review-wrapper.modal-type .upper .rating .like-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .like-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .like-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .like-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .like-icon.like-active :hover path{fill:#b6dfdb}.review-wrapper.modal-type .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.modal-type .upper .rating .dislike-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .dislike-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .dislike-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .dislike-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active :hover path{fill:#e87c7c}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.modal-type .upper .rating .separator{border:1px solid #919191;height:14px}.review-wrapper.modal-type .upper .rating svg-icon{width:18px;height:18px;display:grid;place-items:center;background-color:#ffffffb2}.review-wrapper.modal-type .upper .rating svg-icon:hover{cursor:pointer}.review-wrapper.modal-type .upper .rating .checkmark-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.modal-type .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .checkmark-icon path{fill:#1d1d1d}.review-wrapper.modal-type .upper .rating .cancel-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .cancel-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .cancel-icon path{fill:#1d1d1d}.review-wrapper.modal-type .lower{font-size:14px!important;font-weight:400!important;padding:2px 4px 4px;line-height:18px;cursor:text}.profile-img{width:22px}.lower{color:#fff;outline:none;overflow-y:auto;padding:2px 4px 4px;text-indent:0;display:block;background-color:#1d1d1d;border-radius:2px;font-size:11px;font-weight:400}.lower:hover{cursor:pointer}.lower:empty:after{content:attr(data-placeholder);color:#919191;line-height:14px}.svg-group{position:relative;display:flex;align-items:center}.bottom-divider-dark{margin-top:6px;border-bottom:1px solid #DADADA}.bottom-divider-light{border-bottom:1px solid #424242}svg-icon{display:inline-block;border-radius:1px;display:grid;place-items:center}svg-icon:hover{cursor:pointer}svg-icon svg{width:14px;height:14px}.review-wrapper.dark-mode{background-color:#dadada!important;color:#919191;padding:2px}.review-wrapper.dark-mode .upper{display:flex;align-items:center;padding:0 2px}.review-wrapper.dark-mode .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.dark-mode .upper .info .column{font-size:11px}.review-wrapper.dark-mode .upper .info .column .upper-row{display:flex;gap:4px}.review-wrapper.dark-mode .upper .info .column .upper-row .name{font-weight:600;color:#424242}.review-wrapper.dark-mode .upper .info .column .upper-row svg-icon{width:18px!important;height:18px;display:flex;align-items:center}.review-wrapper.dark-mode .upper .info .column .lower-row{display:flex;gap:4px}.review-wrapper.dark-mode .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.dark-mode .upper .rating .like-icon{width:14px;height:14px}.review-wrapper.dark-mode .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.dark-mode .upper .rating .like-icon:hover:not(.like-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .dislike-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.dark-mode .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.dark-mode .upper .rating .dislike-icon:hover:not(.dislike-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .checkmark-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.dark-mode .upper .rating .checkmark-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .cancel-icon svg{fill:transparent!important;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;visibility:hidden}.review-wrapper.dark-mode .upper .controls .pencil-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover path{fill:#dadada}.review-wrapper.dark-mode .upper .controls .trash-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .trash-icon:hover path{fill:#dadada}.review-wrapper.dark-mode:hover{cursor:pointer}.review-wrapper.dark-mode:hover .controls{visibility:visible!important}.review-wrapper.dark-mode .lower{background-color:#dadada!important;color:#2f2f2f;line-height:14px}.review-wrapper.dark-mode.not-editing{background-color:#2f2f2f!important}.review-wrapper.dark-mode.not-editing .upper{background-color:transparent}.review-wrapper.dark-mode.not-editing .upper .name{color:#fff!important}.review-wrapper.dark-mode.not-editing .lower{background-color:#2f2f2f!important;color:#fff!important}.review-wrapper.dark-mode.not-editing:hover,.review-wrapper.dark-mode.not-editing:hover .lower{background-color:#424242!important}.review-wrapper.dark-mode.not-editing:hover .expand-icon,.review-wrapper.dark-mode.not-editing:hover .collapse-icon{opacity:1}.review-wrapper.details-type{background-color:#1d1d1d;max-width:300px;padding:2px;border-radius:2px}.review-wrapper.details-type.not-editing{background-color:transparent}.review-wrapper.details-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .info .column{display:flex}.review-wrapper.details-type.not-editing .upper .info .column .upper-row .name{font-weight:600;color:#424242!important;font-size:11px}.review-wrapper.details-type.not-editing .upper .rating .svg-group svg-icon{background-color:red!important}.review-wrapper.details-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.details-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;word-break:break-word;overflow-wrap:break-word}.review-wrapper.details-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.details-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.details-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.details-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.details-type.not-editing:hover{background-color:#eee}.review-wrapper.details-type.not-editing:hover .controls{visibility:visible}.review-wrapper.details-type .upper{display:flex;align-items:start;padding:0 2px}.review-wrapper.details-type .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.details-type .upper .info .column{display:flex;font-size:11px}.review-wrapper.details-type .upper .info .column .upper-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .upper-row .name{font-weight:600;color:#fff;line-height:14px!important}.review-wrapper.details-type .upper .info .column .upper-row .personal{line-height:14px}.review-wrapper.details-type .upper .info .column .upper-row svg-icon{width:14px!important;height:14px;display:flex;align-items:center}.review-wrapper.details-type .upper .info .column .lower-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .lower-row .description{font-weight:500;line-height:14px;font-size:11px;color:#919191}.review-wrapper.details-type .upper .info .column .lower-row .edit-time{line-height:14px;color:#919191;font-weight:500;font-size:11px}.review-wrapper.details-type .upper .info .column .lower-row .edited{line-height:14px}.review-wrapper.details-type .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.details-type .upper .rating svg-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.details-type .upper .rating .like-icon.like-active{color:#56b4ac;background-color:transparent}.review-wrapper.details-type .upper .rating .like-icon:hover:not(.like-active){color:#ccc}.review-wrapper.details-type .upper .rating .dislike-icon.dislike-active{color:#e66767}.review-wrapper.details-type .upper .rating .dislike-icon:hover:not(.dislike-active){color:#ccc}.review-wrapper.details-type .upper .rating .checkmark-icon{background-color:#919191!important;color:#1d1d1d;transition:transform .2s ease-in-out}.review-wrapper.details-type .upper .rating .checkmark-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.details-type .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out;color:#1d1d1d}.review-wrapper.details-type .upper .rating .cancel-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.details-type .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;opacity:0;pointer-events:none}.review-wrapper.details-type .upper .controls .svg-group{display:flex;height:100%;align-items:start;padding:2px}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover path{fill:#dadada}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover path{fill:#dadada}.review-wrapper.details-type .lower{line-height:14px!important;padding:2px 4px!important;cursor:text}.review-wrapper.details-type:hover{cursor:pointer}.review-wrapper.details-type:hover .controls{opacity:1!important;pointer-events:auto!important}.expand-icon{padding:4px 2px;margin-left:auto;opacity:0}.expand-icon path{fill:#ccc}.collapse-icon{transform:rotate(180deg);padding:4px 2px;margin-left:auto;opacity:0}.collapse-icon path{fill:#ccc}\n"] }]
7197
+ ], providers: [DateFormatingPipe], template: "@let avatarFile = singleReview.companyUser?.avatarFile; @let driver =\navatarFile?.driver; @let companyUser = this.singleReview.companyUser; @let\ncurrentUser = this.singleReview.isItCurrentCompanyUser; @let comment =\nthis.singleReview.comment; @let edited = this.singleReview.isEdited; @let\nactiveLike = this.singleReview.thumb === 'like'; @let activeDislike =\nthis.singleReview.thumb === 'dislike'; @let currentRating =\nthis.singleReview.thumb;\n<div\n class=\"review-wrapper\"\n [class]=\"{\n 'not-editing': !editing(),\n 'dark-mode': type === ReviewType.Table,\n 'modal-type': type === ReviewType.Modal,\n 'details-type': type === ReviewType.Details\n }\"\n (click)=\"onExpandToggle()\"\n>\n @if(type === ReviewType.Modal){\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"driver!\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(You)</span>\n\n } @if(!editing() && currentRating){\n <span class=\"dot\">\u2022</span>\n\n <svg-icon\n [name]=\"currentRating === 'like' ? 'cai-like' : 'cai-dislike'\"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n } @if(editing()){\n <span class=\"description\">{{\n !edited ? \"\u2022 Posting Publicly\" : \"\u2022 Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"activeLike\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"activeDislike\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n } }@else if(type === ReviewType.Table || type === ReviewType.Details) {\n <div class=\"upper\">\n <div class class=\"info\">\n <cai-avatar\n [driver]=\"avatarFile!.driver\"\n [size]=\"avatarFile!.size\"\n [rounded]=\"avatarFile!.rounded\"\n ></cai-avatar>\n <div class=\"column\">\n <div class=\"upper-row\">\n <span class=\"name\">{{ companyUser?.fullName }}</span>\n @if(currentUser && !editing()){\n <span class=\"personal\">(Me)</span>\n\n } @if(!editing()){\n <svg-icon\n [name]=\"\n currentRating === 'like'\n ? 'cai-like'\n : currentRating === 'dislike'\n ? 'cai-dislike'\n : ''\n \"\n [class.current-rating-like]=\"currentRating === 'like'\"\n [class.current-rating-dislike]=\"currentRating === 'dislike'\"\n ></svg-icon>\n }\n </div>\n <div class=\"lower-row\">\n @if(editing()){\n <span class=\"description\">{{\n !edited ? \"Posting Publicly\" : \"Edit Review\"\n }}</span>\n } @if(!editing()){\n <span class=\"edit-time\">{{ newTime() }}</span>\n @if(edited){\n <span class=\"edited\">\u2022 Edited</span>\n } }\n </div>\n </div>\n </div>\n\n @if(editing()){\n <div class=\"rating\">\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeLike ? 'Remove' : 'Like'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n (click)=\"onRate('like')\"\n [class.like-active]=\"currentRating === 'like'\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n [ngbTooltip]=\"activeDislike ? 'Remove' : 'Dislike'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-dislike\"\n class=\"dislike-icon\"\n (click)=\"onRate('dislike')\"\n [class.dislike-active]=\"currentRating === 'dislike'\"\n >\n </svg-icon>\n </div>\n\n <div class=\"separator\"></div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Post Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-checkmark\"\n class=\"checkmark-icon\"\n (click)=\"onSaveChanges()\"\n ></svg-icon>\n </div>\n\n <div\n class=\"svg-group\"\n ngbTooltip=\"Cancel\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"onCancelReview()\"\n ></svg-icon>\n </div>\n </div>\n }@else if(canExpand() && !expanded()){\n <svg-icon name=\"cai-expand\" class=\"expand-icon\" />\n }@else if(canExpand() && !currentUser && expanded()){\n <svg-icon name=\"cai-expand\" class=\"collapse-icon\" />\n } @else if(currentUser){\n <div class=\"controls\">\n <div\n class=\"svg-group\"\n ngbTooltip=\"Edit Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-edit\"\n (click)=\"onEdit()\"\n class=\"pencil-icon\"\n ></svg-icon>\n </div>\n <div\n class=\"svg-group\"\n ngbTooltip=\"Delete Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"top\"\n >\n <svg-icon\n name=\"cai-delete\"\n class=\"trash-icon\"\n (click)=\"onDelete()\"\n ></svg-icon>\n </div>\n </div>\n }\n </div>\n @if(comment || currentContent() || editing()){\n <div\n class=\"lower\"\n [contentEditable]=\"editing() ? 'true' : 'false'\"\n data-placeholder=\"Share details of your own experience...\"\n (input)=\"onChangeContent($event)\"\n [innerHTML]=\"renderedContent()\"\n (keydown)=\"limitLength($event)\"\n ></div>\n }}\n</div>\n<!-- @if(type === ReviewType.Table){\n<div class=\"bottom-divider-light\"></div>\n} --> \n@if(currentUser && type === ReviewType.Details){\n<div class=\"bottom-divider-dark\"></div>\n}\n<!-- @if(currentUser && (type === ReviewType.Details || type ===\nReviewType.Modal)){\n<div class=\"bottom-divider-dark\"></div>\n\n} -->\n", styles: ["svg-icon{width:18px!important;height:18px!important;display:grid;place-items:center;color:#919191}svg-icon svg{display:grid;place-items:center;width:18px;height:18px}.column{display:flex;flex-direction:column}.personal{font-weight:700;line-height:18px;color:#f77d3b}.edited{color:#3b73ed;font-weight:500;line-height:18px}.current-rating-like{color:#56b4ac!important}.current-rating-dislike{color:#e66767!important}.active-like :hover .like-icon{color:red}.review-wrapper.modal-type{background-color:#1d1d1d;max-width:456px;border-radius:2px;padding:2px;margin-left:6px;margin-right:6px}.review-wrapper.modal-type.not-editing{background-color:transparent}.review-wrapper.modal-type.not-editing .upper{padding:2px 2px 0 4px}.review-wrapper.modal-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .info .name{color:#000}.review-wrapper.modal-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.modal-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.modal-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;line-height:18px;white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word;font-size:14px!important}.review-wrapper.modal-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.modal-type.not-editing .controls .pencil-icon{color:#919191!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover{background-color:#91919133!important;color:#424242!important}.review-wrapper.modal-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.modal-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.modal-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.modal-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.modal-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.modal-type.not-editing:hover{background-color:#eee}.review-wrapper.modal-type.not-editing:hover .controls{visibility:visible}.review-wrapper.modal-type .upper{padding:2px 2px 2px 4px;display:flex;justify-content:space-between}.review-wrapper.modal-type .upper .info{display:flex;align-items:center;gap:4px}.review-wrapper.modal-type .upper .info .name{line-height:18px;font-weight:600;color:#fff}.review-wrapper.modal-type .upper .info .dot{color:#919191}.review-wrapper.modal-type .upper .info .description,.review-wrapper.modal-type .upper .info .edit-time{color:#919191;font-weight:500;line-height:18px}.review-wrapper.modal-type .upper .rating{display:flex;gap:4px;align-items:center;padding-bottom:4px}.review-wrapper.modal-type .upper .rating .like-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .like-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .like-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .like-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .like-icon.like-active :hover path{fill:#b6dfdb}.review-wrapper.modal-type .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.modal-type .upper .rating .dislike-icon{display:grid;place-items:center;background-color:transparent!important}.review-wrapper.modal-type .upper .rating .dislike-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .dislike-icon:hover path{fill:#ccc}.review-wrapper.modal-type .upper .rating .dislike-icon path{fill:#919191}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active :hover path{fill:#e87c7c}.review-wrapper.modal-type .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.modal-type .upper .rating .separator{border:1px solid #919191;height:14px}.review-wrapper.modal-type .upper .rating svg-icon{width:18px;height:18px;display:grid;place-items:center;background-color:#ffffffb2}.review-wrapper.modal-type .upper .rating svg-icon:hover{cursor:pointer}.review-wrapper.modal-type .upper .rating .checkmark-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.modal-type .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .checkmark-icon path{fill:#1d1d1d}.review-wrapper.modal-type .upper .rating .cancel-icon{transition:transform .2s ease-in-out}.review-wrapper.modal-type .upper .rating .cancel-icon:hover{background-color:#fff;transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.modal-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.modal-type .upper .rating .cancel-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.modal-type .upper .rating .cancel-icon path{fill:#1d1d1d}.review-wrapper.modal-type .lower{font-size:14px!important;font-weight:400!important;padding:2px 4px 4px;line-height:18px;cursor:text}.profile-img{width:22px}.lower{color:#fff;outline:none;overflow-y:auto;padding:2px 4px 4px;text-indent:0;display:block;background-color:#1d1d1d;border-radius:2px;font-size:11px;font-weight:400}.lower:hover{cursor:pointer}.lower:empty:after{content:attr(data-placeholder);color:#919191;line-height:14px}.svg-group{position:relative;display:flex;align-items:center}.bottom-divider-dark{margin-top:6px;margin-left:6px;margin-right:6px;border-bottom:1px solid #DADADA}.bottom-divider-light{border-bottom:1px solid #424242}svg-icon{display:inline-block;border-radius:1px;display:grid;place-items:center}svg-icon:hover{cursor:pointer}svg-icon svg{width:14px;height:14px}.review-wrapper.dark-mode{background-color:#dadada!important;color:#919191;border-radius:2px;max-width:252px;padding:2px}.review-wrapper.dark-mode.not-editing{background-color:transparent}.review-wrapper.dark-mode.not-editing:hover{background-color:#eee}.review-wrapper.dark-mode.not-editing .upper{display:flex;align-items:start}.review-wrapper.dark-mode.not-editing .upper .info{display:flex;align-items:center;padding:0!important}.review-wrapper.dark-mode.not-editing .upper .info .column{display:flex}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row{display:flex;align-items:center;line-height:14px;height:14px}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row .name{font-weight:600;color:#fff!important;font-size:11px}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row .personal{line-height:14px!important}.review-wrapper.dark-mode.not-editing .upper .info .column .upper-row .current-rating-like{transform:scaleX(-1)}.review-wrapper.dark-mode.not-editing .upper .info .column .lower-row{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:500;line-height:14px!important}.review-wrapper.dark-mode.not-editing .upper .info .column .lower-row .edit-time{color:#919191}.review-wrapper.dark-mode.not-editing .upper .info .column .lower-row .edited{color:#92b1f5;line-height:14px!important}.review-wrapper.dark-mode.not-editing .upper .rating .svg-group svg-icon{background-color:red!important}.review-wrapper.dark-mode.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.dark-mode .upper{display:flex;align-items:start;padding:0 2px}.review-wrapper.dark-mode .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.dark-mode .upper .info .column{font-size:11px}.review-wrapper.dark-mode .upper .info .column .upper-row{display:flex;gap:4px}.review-wrapper.dark-mode .upper .info .column .upper-row .name{font-weight:600;font-size:11px;line-height:14px;color:#424242}.review-wrapper.dark-mode .upper .info .column .upper-row svg-icon{width:18px!important;height:18px;display:flex;align-items:center}.review-wrapper.dark-mode .upper .info .column .lower-row{display:flex}.review-wrapper.dark-mode .upper .info .column .lower-row .description{line-height:14px;font-size:11px}.review-wrapper.dark-mode .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.dark-mode .upper .rating .like-icon{width:14px;height:14px}.review-wrapper.dark-mode .upper .rating .like-icon.like-active path{fill:#56b4ac}.review-wrapper.dark-mode .upper .rating .like-icon.like-active:hover path{fill:#b6dfdb}.review-wrapper.dark-mode .upper .rating .like-icon:hover:not(.like-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .dislike-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.dark-mode .upper .rating .dislike-icon.dislike-active path{fill:#e66767}.review-wrapper.dark-mode .upper .rating .dislike-icon.dislike-active:hover path{fill:#e87c7c}.review-wrapper.dark-mode .upper .rating .dislike-icon:hover:not(.dislike-active) path{fill:#424242}.review-wrapper.dark-mode .upper .rating .checkmark-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.dark-mode .upper .rating .checkmark-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .checkmark-icon svg{fill:#ffffffb2;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover{background-color:#424242!important;transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.dark-mode .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.dark-mode .upper .rating .cancel-icon path{fill:#dadada}.review-wrapper.dark-mode .upper .rating .cancel-icon svg{fill:transparent!important;width:14px;border-radius:1px}.review-wrapper.dark-mode .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;visibility:hidden}.review-wrapper.dark-mode .upper .controls .pencil-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .pencil-icon:hover path{fill:#dadada}.review-wrapper.dark-mode .upper .controls .trash-icon{padding:2px}.review-wrapper.dark-mode .upper .controls .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.dark-mode .upper .controls .trash-icon:hover path{fill:#dadada}.review-wrapper.dark-mode:hover{cursor:pointer}.review-wrapper.dark-mode:hover .controls{visibility:visible!important}.review-wrapper.dark-mode .lower{background-color:#dadada!important;color:#2f2f2f;line-height:14px}.review-wrapper.dark-mode.not-editing{background-color:#2f2f2f!important}.review-wrapper.dark-mode.not-editing .upper{background-color:transparent}.review-wrapper.dark-mode.not-editing .upper .name{color:#fff!important}.review-wrapper.dark-mode.not-editing .lower{background-color:#2f2f2f!important;color:#fff!important}.review-wrapper.dark-mode.not-editing:hover,.review-wrapper.dark-mode.not-editing:hover .lower{background-color:#424242!important}.review-wrapper.dark-mode.not-editing:hover .expand-icon,.review-wrapper.dark-mode.not-editing:hover .collapse-icon{opacity:1}.review-wrapper.details-type{background-color:#1d1d1d;max-width:300px;padding:2px;border-radius:2px}.review-wrapper.details-type.not-editing{background-color:transparent}.review-wrapper.details-type.not-editing .upper .info{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .info .column{display:flex}.review-wrapper.details-type.not-editing .upper .info .column .upper-row .name{font-weight:600;color:#424242!important;font-size:11px}.review-wrapper.details-type.not-editing .upper .rating .svg-group svg-icon{background-color:red!important}.review-wrapper.details-type.not-editing .upper .controls{display:flex;align-items:center}.review-wrapper.details-type.not-editing .upper .edit-time{font-size:14px}.review-wrapper.details-type.not-editing .lower{background-color:transparent;color:#000;max-width:100%;word-break:break-word;overflow-wrap:break-word}.review-wrapper.details-type.not-editing .controls{display:flex;gap:4px;visibility:hidden}.review-wrapper.details-type.not-editing .controls .pencil-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls .trash-icon:hover{background-color:#f4bebe!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover path{fill:#c20c0c!important}.review-wrapper.details-type.not-editing .controls .trash-icon:hover+span{opacity:1}.review-wrapper.details-type.not-editing .controls svg-icon{display:grid;place-items:center;width:18px;height:18px;padding:2px;cursor:pointer}.review-wrapper.details-type.not-editing .controls svg-icon:hover{background-color:#aaa}.review-wrapper.details-type.not-editing .controls svg-icon:hover path{fill:#424242}.review-wrapper.details-type.not-editing:hover{background-color:#eee}.review-wrapper.details-type.not-editing:hover .controls{visibility:visible}.review-wrapper.details-type .upper{display:flex;align-items:start}.review-wrapper.details-type .upper .info{display:flex;align-items:center;gap:4px;padding:0 2px}.review-wrapper.details-type .upper .info .column{display:flex;font-size:11px}.review-wrapper.details-type .upper .info .column .upper-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .upper-row .name{font-weight:600;color:#fff;line-height:14px!important}.review-wrapper.details-type .upper .info .column .upper-row .personal{line-height:14px}.review-wrapper.details-type .upper .info .column .upper-row svg-icon{width:14px!important;height:14px;display:flex;align-items:center}.review-wrapper.details-type .upper .info .column .lower-row{display:flex;align-items:center;gap:4px}.review-wrapper.details-type .upper .info .column .lower-row .description{font-weight:500;line-height:14px;font-size:11px;color:#919191}.review-wrapper.details-type .upper .info .column .lower-row .edit-time{line-height:14px;color:#919191;font-weight:500;font-size:11px}.review-wrapper.details-type .upper .info .column .lower-row .edited{line-height:14px}.review-wrapper.details-type .upper .rating{display:flex;margin-left:auto;gap:4px;padding:2px 0}.review-wrapper.details-type .upper .rating svg-icon{width:14px;height:14px;display:grid;place-items:center}.review-wrapper.details-type .upper .rating .like-icon.like-active{color:#56b4ac;background-color:transparent}.review-wrapper.details-type .upper .rating .like-icon:hover:not(.like-active){color:#ccc}.review-wrapper.details-type .upper .rating .dislike-icon.dislike-active{color:#e66767}.review-wrapper.details-type .upper .rating .dislike-icon:hover:not(.dislike-active){color:#ccc}.review-wrapper.details-type .upper .rating .checkmark-icon{background-color:#919191!important;color:#1d1d1d;transition:transform .2s ease-in-out}.review-wrapper.details-type .upper .rating .checkmark-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .checkmark-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .checkmark-icon:hover svg{transform:scale(.8181818182)}.review-wrapper.details-type .upper .rating .cancel-icon{background-color:#919191!important;transition:transform .2s ease-in-out;color:#1d1d1d}.review-wrapper.details-type .upper .rating .cancel-icon:hover{background-color:#fff!important;transform:scale(1.2222222222)}.review-wrapper.details-type .upper .rating .cancel-icon:hover+span{opacity:1}.review-wrapper.details-type .upper .rating .cancel-icon:hover svg{transform:scale(1.2222222222)}.review-wrapper.details-type .upper .controls{margin-left:auto;display:flex;gap:4px;padding:0 2px;opacity:0;pointer-events:none}.review-wrapper.details-type .upper .controls .svg-group{display:flex;height:100%;align-items:start;padding:2px}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .pencil-icon:hover path{fill:#dadada}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover{background-color:#6c6c6c}.review-wrapper.details-type .upper .controls .svg-group .trash-icon:hover path{fill:#dadada}.review-wrapper.details-type .lower{line-height:14px!important;padding:2px 4px!important;cursor:text}.review-wrapper.details-type:hover{cursor:pointer}.review-wrapper.details-type:hover .controls{opacity:1!important;pointer-events:auto!important}.expand-icon{padding:4px 2px;margin-left:auto;opacity:0}.expand-icon path{fill:#ccc}.collapse-icon{transform:rotate(180deg);padding:4px 2px;margin-left:auto;opacity:0}.collapse-icon path{fill:#ccc}\n"] }]
7199
7198
  }], ctorParameters: () => [{ type: DateFormatingPipe }], propDecorators: { type: [{
7200
7199
  type: Input,
7201
7200
  args: [{ required: true }]
@@ -7211,19 +7210,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
7211
7210
  }] } });
7212
7211
 
7213
7212
  class ReviewModalComponent {
7213
+ //enums
7214
7214
  ReviewType = ReviewType;
7215
7215
  ngOnInit() {
7216
7216
  this.initializeReviewsData();
7217
- console.log('rivjui', this.ratingReviews);
7218
7217
  }
7219
7218
  ngOnChanges(changes) {
7220
7219
  if (changes['ratingReviews']) {
7221
7220
  this.initializeReviewsData();
7222
- //this.settingDates();
7223
7221
  }
7224
7222
  }
7225
7223
  ratingReviews;
7226
7224
  modaltype;
7225
+ activeLikes = signal(false);
7226
+ activeDislikes = signal(false);
7227
+ activeReviews = signal(false);
7228
+ disabled = signal(false);
7229
+ addingReview = signal(false);
7227
7230
  presentReviews = [];
7228
7231
  testReview = {
7229
7232
  ratingId: 5,
@@ -7254,10 +7257,10 @@ class ReviewModalComponent {
7254
7257
  departmentId: 2,
7255
7258
  },
7256
7259
  };
7257
- currentType = '';
7258
7260
  countLikes = 0;
7259
7261
  countDislikes = 0;
7260
7262
  countReviews = 0;
7263
+ hasPersonalReview = false;
7261
7264
  onReturnMost() {
7262
7265
  if (this.countLikes > this.countDislikes) {
7263
7266
  return 'likes';
@@ -7267,11 +7270,6 @@ class ReviewModalComponent {
7267
7270
  }
7268
7271
  return '';
7269
7272
  }
7270
- activeLikes = signal(false);
7271
- activeDislikes = signal(false);
7272
- activeReviews = signal(false);
7273
- disabled = signal(false);
7274
- addingReview = signal(false);
7275
7273
  /**
7276
7274
  * Emits an event when a review is successfully deleted.
7277
7275
  * This event carries no data.
@@ -7284,8 +7282,7 @@ class ReviewModalComponent {
7284
7282
  onAddReview() {
7285
7283
  this.addingReview.set(true);
7286
7284
  this.disabled.set(true);
7287
- /* this.personalReviewSet = true;
7288
- this.hasPersonalReview = true; */
7285
+ this.hasPersonalReview = true;
7289
7286
  const newId = this.ratingReviews.length > 0
7290
7287
  ? Math.max(...this.ratingReviews.map((r) => r.reviewId)) + 1
7291
7288
  : 1;
@@ -7299,20 +7296,16 @@ class ReviewModalComponent {
7299
7296
  createdAt: date.toString(),
7300
7297
  updatedAt: '',
7301
7298
  };
7302
- console.log('iz add review', this.ratingReviews);
7303
7299
  }
7304
7300
  onEditedReview(ev) {
7305
- console.log('ovo je u edited', ev.edited, ev.review);
7306
- const index = this.ratingReviews.findIndex(r => r.reviewId === ev.review.reviewId);
7301
+ const index = this.ratingReviews.findIndex((r) => r.reviewId === ev.review.reviewId);
7307
7302
  if (index > -1) {
7308
7303
  this.ratingReviews[index] = ev.review;
7309
7304
  this.presentReviews = [...this.ratingReviews];
7310
7305
  this.initializeReviewsData();
7311
7306
  }
7312
- console.log('review edited', this.ratingReviews, ' present edited', this.presentReviews);
7313
7307
  }
7314
7308
  onGetReview(ev) {
7315
- console.log('primio sam review', ev.review);
7316
7309
  if (ev.review.isEdited) {
7317
7310
  const index = this.ratingReviews.findIndex((r) => r.reviewId === ev.review.reviewId);
7318
7311
  if (index > -1) {
@@ -7324,9 +7317,20 @@ class ReviewModalComponent {
7324
7317
  }
7325
7318
  this.addingReview.set(false);
7326
7319
  this.presentReviews = [...this.ratingReviews];
7327
- console.log('review add', this.ratingReviews, ' present add', this.presentReviews);
7328
7320
  this.initializeReviewsData();
7329
7321
  }
7322
+ handleSearch(event) {
7323
+ if (!event) {
7324
+ this.presentReviews = [...this.ratingReviews];
7325
+ return;
7326
+ }
7327
+ const search = event.toString().toLowerCase().trim();
7328
+ this.presentReviews = this.ratingReviews.filter((r) => r.companyUser.fullName.toLowerCase().includes(search) ||
7329
+ r.comment.toLowerCase().includes(search));
7330
+ }
7331
+ handleClear(event) {
7332
+ this.presentReviews = [...this.ratingReviews];
7333
+ }
7330
7334
  /**
7331
7335
  * Initializes review data when the component is initialized or when the `reviews` input changes.
7332
7336
  * It copies the original reviews array, resets counters, calculates new counts, and
@@ -7442,50 +7446,20 @@ class ReviewModalComponent {
7442
7446
  onDeleteReview(id) {
7443
7447
  this.ratingReviews = this.ratingReviews.filter((review) => review.reviewId !== id);
7444
7448
  this.addingReview.set(false);
7449
+ this.hasPersonalReview = false;
7445
7450
  this.disabled.set(false);
7446
7451
  this.initializeReviewsData();
7447
- console.log('reviews', this.ratingReviews);
7448
- console.log('present reviews', this.presentReviews);
7449
- console.log(this.addingReview());
7450
7452
  }
7451
- activeFilter = 'all';
7452
- /**
7453
- * Switches active state of an filter button.
7454
- * Initial state is all which selects all present reviews.
7455
- * @param value The value of selected filter.
7456
- */
7457
- setActiveFilter(value) {
7458
- this.activeFilter = value;
7459
- switch (value) {
7460
- case 'all':
7461
- this.presentReviews = [...this.ratingReviews];
7462
- break;
7463
- case 'rating':
7464
- this.presentReviews = this.ratingReviews.filter((x) => x.comment == '');
7465
- break;
7466
- case 'review':
7467
- this.presentReviews = this.ratingReviews.filter((x) => x.comment != '');
7468
- break;
7469
- default:
7470
- break;
7471
- }
7472
- }
7473
- personalReviewSet = false;
7474
- activeInput = false;
7475
- toggleActiveInput() {
7476
- this.activeInput = !this.activeInput;
7477
- }
7478
- hasPersonalReview = false;
7479
7453
  onCheckPersonal() {
7480
7454
  this.ratingReviews.forEach((x) => {
7481
- if (x.isItCurrentCompanyUser == true) {
7455
+ if (x.isItCurrentCompanyUser) {
7482
7456
  this.hasPersonalReview = true;
7483
7457
  return;
7484
7458
  }
7485
7459
  });
7486
7460
  }
7487
7461
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ReviewModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
7488
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: ReviewModalComponent, isStandalone: true, selector: "cai-review-modal", inputs: { ratingReviews: "ratingReviews", modaltype: "modaltype" }, outputs: { reviewDeleted: "reviewDeleted" }, usesOnChanges: true, ngImport: i0, template: "@let reviewsLength = presentReviews.length;\n<div\n [class]=\"{\n 'modal-wrapper': modaltype === ReviewType.Modal,\n 'table-wrapper': modaltype === ReviewType.Table,\n 'details-wrapper': modaltype === ReviewType.Details,\n dark: modaltype === ReviewType.Table\n }\"\n>\n <div class=\"main-window\">\n <!-- FILTER BOX -->\n <div class=\"box\">\n <div\n [class]=\"{\n filter: true,\n }\"\n >\n <div class=\"column\">\n <div class=\"rating_review\">\n @if(modaltype !== ReviewType.Details){\n <div class=\"left-side\">\n <p class=\"count-heading\">Rating & Review</p>\n <div class=\"circle\">\n {{ countReviews }}\n </div>\n @if(modaltype === ReviewType.Modal && reviewsLength !== 0){\n <div class=\"y-divider\"></div>\n }\n </div>\n } @if(modaltype !== ReviewType.Table){\n <div class=\"counter\">\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(true);\n activeDislikes.set(false);\n onChangePresentReviews('likes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeLikes(),\n 'non-active-group': !activeLikes(),\n 'empty-state': countLikes === 0\n }\"\n [ngbTooltip]=\"activeLikes() ? 'Remove Filter' : 'Filter Likes'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n [class.active]=\"activeLikes()\"\n [class.most-likes]=\"onReturnMost() === 'likes'\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n activeLikes.set(false);\n $event.stopPropagation();\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countLikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(false);\n activeDislikes.set(true);\n onChangePresentReviews('dislikes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeDislikes(),\n 'non-active-group': !activeDislikes(),\n 'empty-state': countDislikes === 0\n }\"\n [ngbTooltip]=\"\n activeDislikes() ? 'Remove Filter' : 'Filter Dislikes'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-dislike\"\n [class.active]=\"activeDislikes()\"\n [class.most-dislikes]=\"onReturnMost() === 'dislikes'\"\n class=\"dislike-icon\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeDislikes.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countDislikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(true);\n activeLikes.set(false);\n activeDislikes.set(false);\n onChangePresentReviews('reviews')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeReviews(),\n 'non-active-group': !activeReviews(),\n 'empty-state': countReviews === 0\n }\"\n [ngbTooltip]=\"\n activeReviews() ? 'Remove Filter' : 'Filter Reviews'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-edit2\"\n [class.active]=\"activeReviews()\"\n class=\"pencil-icon\"\n ></svg-icon>\n\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeReviews.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n\n <span class=\"count\">{{ countReviews }}</span>\n </div>\n </div>\n }\n </div>\n @if(ratingReviews && reviewsLength > 0){\n <div class=\"date-group\">\n <span>Date</span>\n <svg-icon name=\"cai-sort-descending\"></svg-icon>\n </div>\n\n } @if(modaltype === ReviewType.Modal || modaltype === ReviewType.Details){\n <div\n class=\"filter-group\"\n [ngStyle]=\"{\n display: addingReview() && reviewsLength === 0 ? 'none' : 'flex'\n }\"\n ngbTooltip=\"Add New\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n (click)=\"onAddReview()\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n }\n </div>\n @if(modaltype === ReviewType.Table){ } @if(modaltype ===\n ReviewType.Details){\n <div class=\"bottom-divider-light\"></div>\n }\n </div>\n @if(modaltype=== 'Table' && reviewsLength > 0){\n <div class=\"input-container\">\n <cai-input\n [config]=\"{\n type: 'text',\n name: 'Find Title',\n icon: 'cai-search',\n inverse: true\n }\"\n />\n </div>\n <div class=\"btn-filters\">\n <div\n [class.active]=\"currentActiveFilter === 'all'\"\n (click)=\"onChangePresentReviews('all')\"\n >\n ALL\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'rating'\"\n (click)=\"onChangePresentReviews('rating')\"\n >\n RATING\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'reviews'\"\n (click)=\"onChangePresentReviews('reviews')\"\n >\n REVIEW\n </div>\n </div>\n }\n </div>\n\n <!-- MAIN MODAL -->\n <div class=\"reviews-window\">\n @if(modaltype==='Table' && !hasPersonalReview){\n <div class=\"add-review\" (click)=\"onAddReview()\">\n <p>ADD REVIEW</p>\n <div class=\"filter-group\">\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n </div>\n } @if(ratingReviews && reviewsLength == 0 && !addingReview()){\n <div class=\"ilustration\">\n <svg-icon\n [name]=\"\n modaltype !== 'Table' ? 'cai-illustration' : 'cai-illustration-dark'\n \"\n ></svg-icon>\n </div>\n }@else { @if (addingReview()) {\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"this.testReview\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } @for(review of presentReviews; track review.ratingId){\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"review\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } }\n <!-- MAIN MODAL -->\n </div>\n </div>\n</div>\n", styles: ["svg-icon svg{width:18px;height:18px}svg-icon svg path{fill-opacity:1}p{margin:0!important}button{border:none!important}.y-divider{border:1px solid #DADADA;height:18px}.x-divider{width:100%;border-bottom:1px solid #EEEEEE}.column{display:flex;width:100%}.disabled-btn{background-color:#f7f7f7!important;color:#ccc!important}.modal-wrapper{max-width:468px;display:flex;flex-direction:column;gap:4px;position:absolute;width:100%}.modal-wrapper .filter{padding:4px 6px}.modal-wrapper .filter .left-side .count-heading{line-height:18px;font-size:14px;color:#424242}.modal-wrapper .filter .left-side .circle{padding:2px 5px;width:21px}.modal-wrapper .filter-group{padding:0}.modal-wrapper .heading-wrapper{display:flex;flex-direction:column;gap:12px;padding:4px 6px}.table-wrapper{margin-top:4px;max-width:260px;padding:4px;border-radius:3px}.table-wrapper .filter{padding:0 0 0 4px;margin-bottom:4px}.table-wrapper .filter .left-side{display:flex;align-items:center}.table-wrapper .filter .left-side .count-heading{text-transform:uppercase;font-size:11px;line-height:14px;font-weight:800}.table-wrapper .filter .left-side .circle{background-color:#424242}.table-wrapper .filter .date-group span{font-size:11px;line-height:14px;font-weight:500}.table-wrapper .filter .date-group svg-icon{width:18px;height:18px}.table-wrapper .btn-filters div{font-size:11px;line-height:14px;font-weight:700}.details-wrapper{max-width:312px}.heading{display:flex;width:100%;justify-content:space-between;padding:4px 6px}.heading .heading-text{display:flex;gap:6px;align-items:center}.heading .heading-text p{font-weight:800;font-size:18px}.heading .heading-text span{background-color:#919191;color:#fff;font-weight:700;vertical-align:middle;padding:4px 8px;border-radius:2px}.heading .icons{display:flex;justify-content:space-between;align-items:center;min-width:60px}.heading .icons svg-icon{width:18px;height:18px;display:grid;place-items:center;cursor:pointer}.heading .icons svg-icon path{fill:#919191}.menu{padding:4px;display:flex;background-color:#eee;border-radius:2px;justify-content:space-evenly}.menu div{border-radius:2px;padding:4px 8px;font-size:14px;font-weight:700;color:#aaa;width:33%;text-align:center}.menu div.active{background-color:#fff;color:#3b73ed}.box{display:flex;flex-direction:column}.btn-filters{display:flex;border-radius:2px;padding:4px;gap:4px;justify-content:space-between;background-color:#1d1d1d}.btn-filters div{width:33%;text-align:center;border-radius:1px;padding:2px 8px;gap:10px;font-weight:700;color:#919191}.btn-filters div:hover{cursor:pointer}.btn-filters div.active{background-color:#2f2f2f;color:#fff}.add-review{display:flex;justify-content:space-between;align-items:center;padding:4px 6px}.add-review p{color:#92b1f5}.add-review .plus-icon path{fill:#92b1f5!important}.add-review .plus-icon:hover{background-color:transparent!important}.add-review:hover{background-color:#3b73ed3f;cursor:pointer}.add-review:hover p{color:#fff}.filter{display:flex;padding:6px;align-items:center;flex-direction:column}.rating_review{display:flex;align-items:center;gap:6px;margin-right:auto}.rating_review .left-side{display:flex;gap:4px;align-items:center}.rating_review .counter{display:flex;align-items:center;gap:4px}.filter-group{display:flex;justify-content:center;position:relative;align-items:center;border-radius:2px;padding:4px!important;gap:4px}.filter-group.active-group{background-color:#6c6c6c}.filter-group.active-group .cancel-icon path{fill:#fff}.filter-group.active-group .count{color:#fff}.filter-group.active-group:hover{background-color:#424242}.filter-group.active-group:hover .cancel-icon{display:flex}.filter-group.active-group:hover .count{display:none}.filter-group.non-active-group:hover{background-color:#eee!important;cursor:pointer}.filter-group.non-active-group:hover svg-icon path{fill:#424242!important}.filter-group.non-active-group:hover:has(.most-likes) .like-icon path{fill:#56b4ac!important}.filter-group.non-active-group:hover:has(.most-dislikes) .dislike-icon path{fill:#e66767!important}.filter-group svg-icon{width:18px;height:18px;display:grid;place-items:center;color:#919191;background-color:transparent}.filter-group svg-icon:hover{background-color:transparent}.filter-group .cancel-icon{width:14px;height:14px;display:none}.filter-group .like-icon svg{margin-bottom:auto!important}.filter-group .like-icon.active,.filter-group .like-icon.most-likes{color:#56b4ac;background-color:transparent}.filter-group .dislike-icon.active,.filter-group .dislike-icon.most-dislikes{color:#e66767;background-color:transparent}.filter-group .pencil-icon.active{opacity:.7;background-color:transparent}.filter-group .pencil-icon.active path{fill:#fff!important}.filter-group .plus-icon{width:26px;height:26px;display:grid;place-items:center;position:relative}.filter-group .plus-icon svg{width:18px;height:18px}.filter-group .plus-icon path{fill:#6692f1}.filter-group .plus-icon:hover{cursor:pointer;background-color:#e9effd}.filter-group .plus-icon:hover path{fill:#0b49d1}.filter-group .count{font-weight:800;font-size:11px;width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:#919191}.filter-group .most-likes .like-icon{color:green!important}.filter-group .most-dislikes .dislike-icon{color:red!important}p{font-weight:800}.date-group{font-weight:500;display:flex;align-items:center;gap:4px;padding-left:6px;line-height:18px}.date-group svg-icon{width:18px;height:18px;display:grid;place-items:center}.circle{width:18px;height:18px;border-radius:60px;background-color:#6c6c6c;color:#fff;padding:4px 5px;display:flex;justify-content:center;align-items:center;font-size:11px;font-weight:700}.disabled{pointer-events:none!important}.disabled svg path{fill:#ccc!important}.main-window .ilustration{width:100%!important;object-fit:contain;object-position:center}.main-window .ilustration svg-icon{width:100%!important}.main-window .ilustration svg-icon svg{width:100%!important;height:100%!important}.reviews-window{height:100%!important;padding:0 6px 6px 4px;display:flex;flex-direction:column;gap:4px}.button-wrapper{display:flex;flex-direction:column;gap:12px}.buttons{display:flex;justify-content:space-between}.buttons button{font-size:14px;font-weight:700;padding:6px;border-radius:2px;cursor:pointer}.buttons .delete-close{display:flex;gap:12px}.buttons .delete-close .delete{color:#df3c3c;width:100px}.buttons .delete-close .close{width:150px}.buttons .save-btn{background-color:#3b73ed;color:#fff;min-width:150px}.dark{background-color:#2f2f2f!important;color:#fff}.dark .count-heading{color:#fff}.input-container{width:100%;margin-bottom:4px;margin-top:4px}.empty-state{cursor:none;pointer-events:none}.empty-state svg-icon path{fill:#91919166}.empty-state span{color:#91919166}.bottom-divider-light{width:100%;margin-top:6px;border-bottom:1px solid #DADADA}\n"], dependencies: [{ kind: "component", type: SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "svgClass", "class", "viewBox", "svgAriaLabel", "onSVGLoaded", "svgStyle"] }, { kind: "component", type: SingleReviewComponent, selector: "cai-single-review", inputs: ["type", "singleReview"], outputs: ["deleteReview", "onAddedReview", "onEditedReview"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: NgbPopoverModule }, { kind: "ngmodule", type: NgbTooltipModule }, { kind: "directive", type: i2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: InputComponent, selector: "cai-input", inputs: ["id", "config", "options", "preselectedOptions", "isLoading", "labelColors", "hideValidation", "showNoResults", "preselectedUnit"], outputs: ["onBlur", "onFocused", "onValueChange", "onOptionAdded", "onAdd", "onSelectionChange", "onSelectedObject", "onSelectedGroup", "onClear", "onAutofill", "onScrolledToBottom", "onScrolledToBottomGroup", "onSearch"] }] });
7462
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: ReviewModalComponent, isStandalone: true, selector: "cai-review-modal", inputs: { ratingReviews: "ratingReviews", modaltype: "modaltype" }, outputs: { reviewDeleted: "reviewDeleted" }, usesOnChanges: true, ngImport: i0, template: "@let reviewsLength = presentReviews.length;\n<div\n [class]=\"{\n 'modal-wrapper': modaltype === ReviewType.Modal,\n 'table-wrapper': modaltype === ReviewType.Table,\n 'details-wrapper': modaltype === ReviewType.Details,\n dark: modaltype === ReviewType.Table\n }\"\n>\n <div class=\"main-window\">\n <!-- FILTER BOX -->\n <div class=\"box\">\n <div\n [class]=\"{\n filter: true,\n }\"\n >\n <div class=\"column\">\n <div class=\"rating_review\">\n @if(modaltype !== ReviewType.Details){\n <div class=\"left-side\">\n <p class=\"count-heading\">Rating & Review</p>\n <div class=\"circle\">\n {{ countReviews }}\n </div>\n @if(modaltype === ReviewType.Modal && reviewsLength !== 0){\n <div class=\"y-divider\"></div>\n }\n </div>\n } @if(modaltype !== ReviewType.Table){\n <div class=\"counter\">\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(true);\n activeDislikes.set(false);\n onChangePresentReviews('likes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeLikes(),\n 'non-active-group': !activeLikes(),\n 'empty-state': countLikes === 0\n }\"\n [ngbTooltip]=\"activeLikes() ? 'Remove Filter' : 'Filter Likes'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n [class.active]=\"activeLikes()\"\n [class.most-likes]=\"onReturnMost() === 'likes'\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n activeLikes.set(false);\n $event.stopPropagation();\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countLikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(false);\n activeDislikes.set(true);\n onChangePresentReviews('dislikes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeDislikes(),\n 'non-active-group': !activeDislikes(),\n 'empty-state': countDislikes === 0\n }\"\n [ngbTooltip]=\"\n activeDislikes() ? 'Remove Filter' : 'Filter Dislikes'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-dislike\"\n [class.active]=\"activeDislikes()\"\n [class.most-dislikes]=\"onReturnMost() === 'dislikes'\"\n class=\"dislike-icon\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeDislikes.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countDislikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(true);\n activeLikes.set(false);\n activeDislikes.set(false);\n onChangePresentReviews('reviews')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeReviews(),\n 'non-active-group': !activeReviews(),\n 'empty-state': countReviews === 0\n }\"\n [ngbTooltip]=\"\n activeReviews() ? 'Remove Filter' : 'Filter Reviews'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-edit2\"\n [class.active]=\"activeReviews()\"\n class=\"pencil-icon\"\n ></svg-icon>\n\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeReviews.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n\n <span class=\"count\">{{ countReviews }}</span>\n </div>\n </div>\n }\n </div>\n @if(ratingReviews && reviewsLength > 0){\n <div class=\"date-group\">\n <span>Date</span>\n <svg-icon name=\"cai-sort-descending\"></svg-icon>\n </div>\n\n } @if(modaltype === ReviewType.Modal){\n <div\n class=\"filter-group\"\n [ngStyle]=\"{\n display: addingReview() && reviewsLength === 0 ? 'none' : 'flex'\n }\"\n ngbTooltip=\"Add New\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n (click)=\"onAddReview()\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n }\n </div>\n @if(modaltype ===\n ReviewType.Details){\n <div class=\"bottom-divider-light\"></div>\n }\n </div>\n @if(modaltype === ReviewType.Table && reviewsLength > 0){\n <div class=\"input-container\">\n <cai-input\n id=\"search\"\n formControlName=\"search\"\n [config]=\"{\n type: 'text',\n icon: 'cai-search',\n inverse: true,\n size: 22,\n name: 'Find Title',\n placeholderBehavior: 'fade',\n placeholderColor: '#AAAAAA',\n }\"\n (onValueChange)=\"handleSearch($event)\"\n (onClear)=\"handleClear($event)\"\n ></cai-input>\n </div>\n <div class=\"btn-filters\">\n <div\n [class.active]=\"currentActiveFilter === 'all'\"\n (click)=\"onChangePresentReviews('all')\"\n >\n ALL\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'rating'\"\n (click)=\"onChangePresentReviews('rating')\"\n >\n RATING\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'reviews'\"\n (click)=\"onChangePresentReviews('reviews')\"\n >\n REVIEW\n </div>\n </div>\n }\n </div>\n\n <!-- MAIN MODAL -->\n <div class=\"reviews-window\">\n @if(modaltype === ReviewType.Table && !hasPersonalReview){\n <div class=\"add-review\" (click)=\"onAddReview()\">\n <span>ADD REVIEW</span>\n <div class=\"filter-group\">\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n </div>\n } @if(ratingReviews && reviewsLength == 0 && !addingReview()){\n <div class=\"ilustration\">\n <svg-icon\n [name]=\"\n modaltype !== ReviewType.Table ? 'cai-illustration' : 'cai-illustration-dark'\n \"\n ></svg-icon>\n </div>\n }@else { @if (addingReview()) {\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"this.testReview\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } @for(review of presentReviews; track review.ratingId){\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"review\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } }\n <!-- MAIN MODAL -->\n </div>\n </div>\n</div>\n", styles: ["svg-icon svg{width:18px;height:18px}svg-icon svg path{fill-opacity:1}p{margin:0!important}button{border:none!important}.y-divider{border:1px solid #DADADA;height:18px}.x-divider{width:100%;border-bottom:1px solid #EEEEEE}.column{display:flex;width:100%;height:26px!important}.disabled-btn{background-color:#f7f7f7!important;color:#ccc!important}.modal-wrapper{max-width:468px;display:flex;flex-direction:column;gap:4px;position:absolute;width:100%}.modal-wrapper .filter{padding:4px 6px}.modal-wrapper .filter .left-side .count-heading{line-height:18px;font-size:14px;color:#424242}.modal-wrapper .filter .left-side .circle{padding:2px 5px;width:21px}.modal-wrapper .filter-group{padding:0}.modal-wrapper .heading-wrapper{display:flex;flex-direction:column;gap:12px;padding:4px 6px}.table-wrapper{max-width:260px;padding:4px;border-radius:3px}.table-wrapper .reviews-window{height:100%!important;display:flex;flex-direction:column;gap:2px}.table-wrapper .filter{padding:0 0 0 4px;margin-bottom:4px;height:18px}.table-wrapper .filter .left-side{display:flex;align-items:center}.table-wrapper .filter .left-side .count-heading{text-transform:uppercase;font-size:11px;line-height:14px;font-weight:800}.table-wrapper .filter .left-side .circle{background-color:#424242}.table-wrapper .filter .date-group span{font-size:11px;line-height:14px;font-weight:500}.table-wrapper .filter .date-group svg-icon{width:18px;height:18px}.table-wrapper .btn-filters{margin:4px 0}.table-wrapper .btn-filters div{font-size:11px;line-height:14px;font-weight:700}.table-wrapper .add-review{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 4px 4px;height:26px;border-radius:2px}.table-wrapper .add-review span{line-height:18px;font-size:11px;font-weight:700;color:#92b1f5}.table-wrapper .add-review .filter-group{padding:0!important;display:flex;align-items:center}.table-wrapper .add-review .filter-group svg{width:14px;height:14px}.table-wrapper .add-review .filter-group .plus-icon{width:14px!important;height:14px!important}.table-wrapper .add-review .filter-group .plus-icon path{fill:#92b1f5!important}.table-wrapper .add-review .filter-group .plus-icon:hover{background-color:transparent!important}.table-wrapper .add-review:hover{background-color:#3b73ed3f;cursor:pointer}.table-wrapper .add-review:hover span path{fill:#fff}.details-wrapper{max-width:300px}.heading{display:flex;width:100%;justify-content:space-between;padding:4px 6px}.heading .heading-text{display:flex;gap:6px;align-items:center}.heading .heading-text p{font-weight:800;font-size:18px}.heading .heading-text span{background-color:#919191;color:#fff;font-weight:700;vertical-align:middle;padding:4px 8px;border-radius:2px}.heading .icons{display:flex;justify-content:space-between;align-items:center;min-width:60px}.heading .icons svg-icon{width:18px;height:18px;display:grid;place-items:center;cursor:pointer}.heading .icons svg-icon path{fill:#919191}.menu{padding:4px;display:flex;background-color:#eee;border-radius:2px;justify-content:space-evenly}.menu div{border-radius:2px;padding:4px 8px;font-size:14px;font-weight:700;color:#aaa;width:33%;text-align:center}.menu div.active{background-color:#fff;color:#3b73ed}.box{display:flex;flex-direction:column}.btn-filters{display:flex;border-radius:2px;padding:4px;gap:4px;justify-content:space-between;background-color:#1d1d1d}.btn-filters div{width:33%;text-align:center;border-radius:1px;padding:2px 8px;gap:10px;font-weight:700;color:#919191}.btn-filters div:hover{cursor:pointer}.btn-filters div.active{background-color:#2f2f2f;color:#fff}.filter{display:flex;align-items:center;flex-direction:column}.rating_review{display:flex;align-items:center;gap:6px;margin-right:auto}.rating_review .left-side{display:flex;gap:4px;align-items:center}.rating_review .counter{display:flex;align-items:center;gap:4px}.filter-group{display:flex;justify-content:center;position:relative;align-items:center;border-radius:2px;padding:4px!important;gap:4px}.filter-group.active-group{background-color:#6c6c6c;cursor:pointer}.filter-group.active-group .cancel-icon path{fill:#fff}.filter-group.active-group .count{color:#fff}.filter-group.active-group:hover{background-color:#424242}.filter-group.active-group:hover .cancel-icon{display:flex}.filter-group.active-group:hover .count{display:none}.filter-group.non-active-group:hover{background-color:#eee!important;cursor:pointer}.filter-group.non-active-group:hover svg-icon path{fill:#424242!important}.filter-group.non-active-group:hover:has(.most-likes) .like-icon path{fill:#56b4ac!important}.filter-group.non-active-group:hover:has(.most-dislikes) .dislike-icon path{fill:#e66767!important}.filter-group svg-icon{width:18px;height:18px;display:grid;place-items:center;color:#919191;background-color:transparent}.filter-group svg-icon:hover{background-color:transparent}.filter-group .cancel-icon{width:14px;height:14px;display:none}.filter-group .like-icon svg{margin-bottom:auto!important}.filter-group .like-icon.active,.filter-group .like-icon.most-likes{color:#56b4ac;background-color:transparent}.filter-group .dislike-icon.active,.filter-group .dislike-icon.most-dislikes{color:#e66767;background-color:transparent}.filter-group .pencil-icon.active{opacity:.7;background-color:transparent}.filter-group .pencil-icon.active path{fill:#fff!important}.filter-group .plus-icon{width:26px;height:26px;display:grid;place-items:center;position:relative}.filter-group .plus-icon svg{width:18px;height:18px}.filter-group .plus-icon path{fill:#6692f1}.filter-group .plus-icon:hover{cursor:pointer;background-color:#e9effd}.filter-group .plus-icon:hover path{fill:#0b49d1}.filter-group .count{font-weight:800;font-size:11px;width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:#919191}.filter-group .most-likes .like-icon{color:green!important}.filter-group .most-dislikes .dislike-icon{color:red!important}p{font-weight:800}.date-group{font-weight:500;display:flex;align-items:center;gap:4px;padding-left:6px;line-height:18px}.date-group svg-icon{width:18px;height:18px;display:grid;place-items:center}.circle{width:18px;height:18px;border-radius:60px;background-color:#6c6c6c;color:#fff;padding:4px 5px;display:flex;justify-content:center;align-items:center;font-size:11px;font-weight:700}.disabled{pointer-events:none!important}.disabled svg path{fill:#ccc!important}.main-window .ilustration{width:100%!important;object-fit:contain;object-position:center}.main-window .ilustration svg-icon{width:100%!important}.main-window .ilustration svg-icon svg{width:100%!important;height:100%!important}.reviews-window{height:100%!important;display:flex;flex-direction:column;gap:4px}.button-wrapper{display:flex;flex-direction:column;gap:12px}.buttons{display:flex;justify-content:space-between}.buttons button{font-size:14px;font-weight:700;padding:6px;border-radius:2px;cursor:pointer}.buttons .delete-close{display:flex;gap:12px}.buttons .delete-close .delete{color:#df3c3c;width:100px}.buttons .delete-close .close{width:150px}.buttons .save-btn{background-color:#3b73ed;color:#fff;min-width:150px}.dark{background-color:#2f2f2f!important;color:#fff}.dark .count-heading{color:#fff}.empty-state{cursor:none;pointer-events:none}.empty-state svg-icon path{fill:#91919166}.empty-state span{color:#91919166}.bottom-divider-light{width:100%;margin-top:6px;margin-bottom:4px;border-bottom:1px solid #DADADA}\n"], dependencies: [{ kind: "component", type: SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "svgClass", "class", "viewBox", "svgAriaLabel", "onSVGLoaded", "svgStyle"] }, { kind: "component", type: SingleReviewComponent, selector: "cai-single-review", inputs: ["type", "singleReview"], outputs: ["deleteReview", "onAddedReview", "onEditedReview"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: NgbTooltipModule }, { kind: "directive", type: i2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: InputComponent, selector: "cai-input", inputs: ["id", "config", "options", "preselectedOptions", "isLoading", "labelColors", "hideValidation", "showNoResults", "preselectedUnit"], outputs: ["onBlur", "onFocused", "onValueChange", "onOptionAdded", "onAdd", "onSelectionChange", "onSelectedObject", "onSelectedGroup", "onClear", "onAutofill", "onScrolledToBottom", "onScrolledToBottomGroup", "onSearch"] }] });
7489
7463
  }
7490
7464
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ReviewModalComponent, decorators: [{
7491
7465
  type: Component,
@@ -7493,16 +7467,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
7493
7467
  SvgIconComponent,
7494
7468
  SingleReviewComponent,
7495
7469
  CommonModule,
7496
- NgbPopoverModule,
7497
7470
  NgbTooltipModule,
7498
7471
  InputComponent,
7499
- ], template: "@let reviewsLength = presentReviews.length;\n<div\n [class]=\"{\n 'modal-wrapper': modaltype === ReviewType.Modal,\n 'table-wrapper': modaltype === ReviewType.Table,\n 'details-wrapper': modaltype === ReviewType.Details,\n dark: modaltype === ReviewType.Table\n }\"\n>\n <div class=\"main-window\">\n <!-- FILTER BOX -->\n <div class=\"box\">\n <div\n [class]=\"{\n filter: true,\n }\"\n >\n <div class=\"column\">\n <div class=\"rating_review\">\n @if(modaltype !== ReviewType.Details){\n <div class=\"left-side\">\n <p class=\"count-heading\">Rating & Review</p>\n <div class=\"circle\">\n {{ countReviews }}\n </div>\n @if(modaltype === ReviewType.Modal && reviewsLength !== 0){\n <div class=\"y-divider\"></div>\n }\n </div>\n } @if(modaltype !== ReviewType.Table){\n <div class=\"counter\">\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(true);\n activeDislikes.set(false);\n onChangePresentReviews('likes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeLikes(),\n 'non-active-group': !activeLikes(),\n 'empty-state': countLikes === 0\n }\"\n [ngbTooltip]=\"activeLikes() ? 'Remove Filter' : 'Filter Likes'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n [class.active]=\"activeLikes()\"\n [class.most-likes]=\"onReturnMost() === 'likes'\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n activeLikes.set(false);\n $event.stopPropagation();\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countLikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(false);\n activeDislikes.set(true);\n onChangePresentReviews('dislikes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeDislikes(),\n 'non-active-group': !activeDislikes(),\n 'empty-state': countDislikes === 0\n }\"\n [ngbTooltip]=\"\n activeDislikes() ? 'Remove Filter' : 'Filter Dislikes'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-dislike\"\n [class.active]=\"activeDislikes()\"\n [class.most-dislikes]=\"onReturnMost() === 'dislikes'\"\n class=\"dislike-icon\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeDislikes.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countDislikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(true);\n activeLikes.set(false);\n activeDislikes.set(false);\n onChangePresentReviews('reviews')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeReviews(),\n 'non-active-group': !activeReviews(),\n 'empty-state': countReviews === 0\n }\"\n [ngbTooltip]=\"\n activeReviews() ? 'Remove Filter' : 'Filter Reviews'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-edit2\"\n [class.active]=\"activeReviews()\"\n class=\"pencil-icon\"\n ></svg-icon>\n\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeReviews.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n\n <span class=\"count\">{{ countReviews }}</span>\n </div>\n </div>\n }\n </div>\n @if(ratingReviews && reviewsLength > 0){\n <div class=\"date-group\">\n <span>Date</span>\n <svg-icon name=\"cai-sort-descending\"></svg-icon>\n </div>\n\n } @if(modaltype === ReviewType.Modal || modaltype === ReviewType.Details){\n <div\n class=\"filter-group\"\n [ngStyle]=\"{\n display: addingReview() && reviewsLength === 0 ? 'none' : 'flex'\n }\"\n ngbTooltip=\"Add New\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n (click)=\"onAddReview()\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n }\n </div>\n @if(modaltype === ReviewType.Table){ } @if(modaltype ===\n ReviewType.Details){\n <div class=\"bottom-divider-light\"></div>\n }\n </div>\n @if(modaltype=== 'Table' && reviewsLength > 0){\n <div class=\"input-container\">\n <cai-input\n [config]=\"{\n type: 'text',\n name: 'Find Title',\n icon: 'cai-search',\n inverse: true\n }\"\n />\n </div>\n <div class=\"btn-filters\">\n <div\n [class.active]=\"currentActiveFilter === 'all'\"\n (click)=\"onChangePresentReviews('all')\"\n >\n ALL\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'rating'\"\n (click)=\"onChangePresentReviews('rating')\"\n >\n RATING\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'reviews'\"\n (click)=\"onChangePresentReviews('reviews')\"\n >\n REVIEW\n </div>\n </div>\n }\n </div>\n\n <!-- MAIN MODAL -->\n <div class=\"reviews-window\">\n @if(modaltype==='Table' && !hasPersonalReview){\n <div class=\"add-review\" (click)=\"onAddReview()\">\n <p>ADD REVIEW</p>\n <div class=\"filter-group\">\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n </div>\n } @if(ratingReviews && reviewsLength == 0 && !addingReview()){\n <div class=\"ilustration\">\n <svg-icon\n [name]=\"\n modaltype !== 'Table' ? 'cai-illustration' : 'cai-illustration-dark'\n \"\n ></svg-icon>\n </div>\n }@else { @if (addingReview()) {\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"this.testReview\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } @for(review of presentReviews; track review.ratingId){\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"review\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } }\n <!-- MAIN MODAL -->\n </div>\n </div>\n</div>\n", styles: ["svg-icon svg{width:18px;height:18px}svg-icon svg path{fill-opacity:1}p{margin:0!important}button{border:none!important}.y-divider{border:1px solid #DADADA;height:18px}.x-divider{width:100%;border-bottom:1px solid #EEEEEE}.column{display:flex;width:100%}.disabled-btn{background-color:#f7f7f7!important;color:#ccc!important}.modal-wrapper{max-width:468px;display:flex;flex-direction:column;gap:4px;position:absolute;width:100%}.modal-wrapper .filter{padding:4px 6px}.modal-wrapper .filter .left-side .count-heading{line-height:18px;font-size:14px;color:#424242}.modal-wrapper .filter .left-side .circle{padding:2px 5px;width:21px}.modal-wrapper .filter-group{padding:0}.modal-wrapper .heading-wrapper{display:flex;flex-direction:column;gap:12px;padding:4px 6px}.table-wrapper{margin-top:4px;max-width:260px;padding:4px;border-radius:3px}.table-wrapper .filter{padding:0 0 0 4px;margin-bottom:4px}.table-wrapper .filter .left-side{display:flex;align-items:center}.table-wrapper .filter .left-side .count-heading{text-transform:uppercase;font-size:11px;line-height:14px;font-weight:800}.table-wrapper .filter .left-side .circle{background-color:#424242}.table-wrapper .filter .date-group span{font-size:11px;line-height:14px;font-weight:500}.table-wrapper .filter .date-group svg-icon{width:18px;height:18px}.table-wrapper .btn-filters div{font-size:11px;line-height:14px;font-weight:700}.details-wrapper{max-width:312px}.heading{display:flex;width:100%;justify-content:space-between;padding:4px 6px}.heading .heading-text{display:flex;gap:6px;align-items:center}.heading .heading-text p{font-weight:800;font-size:18px}.heading .heading-text span{background-color:#919191;color:#fff;font-weight:700;vertical-align:middle;padding:4px 8px;border-radius:2px}.heading .icons{display:flex;justify-content:space-between;align-items:center;min-width:60px}.heading .icons svg-icon{width:18px;height:18px;display:grid;place-items:center;cursor:pointer}.heading .icons svg-icon path{fill:#919191}.menu{padding:4px;display:flex;background-color:#eee;border-radius:2px;justify-content:space-evenly}.menu div{border-radius:2px;padding:4px 8px;font-size:14px;font-weight:700;color:#aaa;width:33%;text-align:center}.menu div.active{background-color:#fff;color:#3b73ed}.box{display:flex;flex-direction:column}.btn-filters{display:flex;border-radius:2px;padding:4px;gap:4px;justify-content:space-between;background-color:#1d1d1d}.btn-filters div{width:33%;text-align:center;border-radius:1px;padding:2px 8px;gap:10px;font-weight:700;color:#919191}.btn-filters div:hover{cursor:pointer}.btn-filters div.active{background-color:#2f2f2f;color:#fff}.add-review{display:flex;justify-content:space-between;align-items:center;padding:4px 6px}.add-review p{color:#92b1f5}.add-review .plus-icon path{fill:#92b1f5!important}.add-review .plus-icon:hover{background-color:transparent!important}.add-review:hover{background-color:#3b73ed3f;cursor:pointer}.add-review:hover p{color:#fff}.filter{display:flex;padding:6px;align-items:center;flex-direction:column}.rating_review{display:flex;align-items:center;gap:6px;margin-right:auto}.rating_review .left-side{display:flex;gap:4px;align-items:center}.rating_review .counter{display:flex;align-items:center;gap:4px}.filter-group{display:flex;justify-content:center;position:relative;align-items:center;border-radius:2px;padding:4px!important;gap:4px}.filter-group.active-group{background-color:#6c6c6c}.filter-group.active-group .cancel-icon path{fill:#fff}.filter-group.active-group .count{color:#fff}.filter-group.active-group:hover{background-color:#424242}.filter-group.active-group:hover .cancel-icon{display:flex}.filter-group.active-group:hover .count{display:none}.filter-group.non-active-group:hover{background-color:#eee!important;cursor:pointer}.filter-group.non-active-group:hover svg-icon path{fill:#424242!important}.filter-group.non-active-group:hover:has(.most-likes) .like-icon path{fill:#56b4ac!important}.filter-group.non-active-group:hover:has(.most-dislikes) .dislike-icon path{fill:#e66767!important}.filter-group svg-icon{width:18px;height:18px;display:grid;place-items:center;color:#919191;background-color:transparent}.filter-group svg-icon:hover{background-color:transparent}.filter-group .cancel-icon{width:14px;height:14px;display:none}.filter-group .like-icon svg{margin-bottom:auto!important}.filter-group .like-icon.active,.filter-group .like-icon.most-likes{color:#56b4ac;background-color:transparent}.filter-group .dislike-icon.active,.filter-group .dislike-icon.most-dislikes{color:#e66767;background-color:transparent}.filter-group .pencil-icon.active{opacity:.7;background-color:transparent}.filter-group .pencil-icon.active path{fill:#fff!important}.filter-group .plus-icon{width:26px;height:26px;display:grid;place-items:center;position:relative}.filter-group .plus-icon svg{width:18px;height:18px}.filter-group .plus-icon path{fill:#6692f1}.filter-group .plus-icon:hover{cursor:pointer;background-color:#e9effd}.filter-group .plus-icon:hover path{fill:#0b49d1}.filter-group .count{font-weight:800;font-size:11px;width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:#919191}.filter-group .most-likes .like-icon{color:green!important}.filter-group .most-dislikes .dislike-icon{color:red!important}p{font-weight:800}.date-group{font-weight:500;display:flex;align-items:center;gap:4px;padding-left:6px;line-height:18px}.date-group svg-icon{width:18px;height:18px;display:grid;place-items:center}.circle{width:18px;height:18px;border-radius:60px;background-color:#6c6c6c;color:#fff;padding:4px 5px;display:flex;justify-content:center;align-items:center;font-size:11px;font-weight:700}.disabled{pointer-events:none!important}.disabled svg path{fill:#ccc!important}.main-window .ilustration{width:100%!important;object-fit:contain;object-position:center}.main-window .ilustration svg-icon{width:100%!important}.main-window .ilustration svg-icon svg{width:100%!important;height:100%!important}.reviews-window{height:100%!important;padding:0 6px 6px 4px;display:flex;flex-direction:column;gap:4px}.button-wrapper{display:flex;flex-direction:column;gap:12px}.buttons{display:flex;justify-content:space-between}.buttons button{font-size:14px;font-weight:700;padding:6px;border-radius:2px;cursor:pointer}.buttons .delete-close{display:flex;gap:12px}.buttons .delete-close .delete{color:#df3c3c;width:100px}.buttons .delete-close .close{width:150px}.buttons .save-btn{background-color:#3b73ed;color:#fff;min-width:150px}.dark{background-color:#2f2f2f!important;color:#fff}.dark .count-heading{color:#fff}.input-container{width:100%;margin-bottom:4px;margin-top:4px}.empty-state{cursor:none;pointer-events:none}.empty-state svg-icon path{fill:#91919166}.empty-state span{color:#91919166}.bottom-divider-light{width:100%;margin-top:6px;border-bottom:1px solid #DADADA}\n"] }]
7472
+ ], template: "@let reviewsLength = presentReviews.length;\n<div\n [class]=\"{\n 'modal-wrapper': modaltype === ReviewType.Modal,\n 'table-wrapper': modaltype === ReviewType.Table,\n 'details-wrapper': modaltype === ReviewType.Details,\n dark: modaltype === ReviewType.Table\n }\"\n>\n <div class=\"main-window\">\n <!-- FILTER BOX -->\n <div class=\"box\">\n <div\n [class]=\"{\n filter: true,\n }\"\n >\n <div class=\"column\">\n <div class=\"rating_review\">\n @if(modaltype !== ReviewType.Details){\n <div class=\"left-side\">\n <p class=\"count-heading\">Rating & Review</p>\n <div class=\"circle\">\n {{ countReviews }}\n </div>\n @if(modaltype === ReviewType.Modal && reviewsLength !== 0){\n <div class=\"y-divider\"></div>\n }\n </div>\n } @if(modaltype !== ReviewType.Table){\n <div class=\"counter\">\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(true);\n activeDislikes.set(false);\n onChangePresentReviews('likes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeLikes(),\n 'non-active-group': !activeLikes(),\n 'empty-state': countLikes === 0\n }\"\n [ngbTooltip]=\"activeLikes() ? 'Remove Filter' : 'Filter Likes'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-like\"\n class=\"like-icon\"\n [class.active]=\"activeLikes()\"\n [class.most-likes]=\"onReturnMost() === 'likes'\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n activeLikes.set(false);\n $event.stopPropagation();\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countLikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(false);\n activeLikes.set(false);\n activeDislikes.set(true);\n onChangePresentReviews('dislikes')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeDislikes(),\n 'non-active-group': !activeDislikes(),\n 'empty-state': countDislikes === 0\n }\"\n [ngbTooltip]=\"\n activeDislikes() ? 'Remove Filter' : 'Filter Dislikes'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-dislike\"\n [class.active]=\"activeDislikes()\"\n [class.most-dislikes]=\"onReturnMost() === 'dislikes'\"\n class=\"dislike-icon\"\n ></svg-icon>\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeDislikes.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n <span class=\"count\">{{ countDislikes }}</span>\n </div>\n <div\n (click)=\"\n activeReviews.set(true);\n activeLikes.set(false);\n activeDislikes.set(false);\n onChangePresentReviews('reviews')\n \"\n [class]=\"{\n 'filter-group': true,\n 'active-group': activeReviews(),\n 'non-active-group': !activeReviews(),\n 'empty-state': countReviews === 0\n }\"\n [ngbTooltip]=\"\n activeReviews() ? 'Remove Filter' : 'Filter Reviews'\n \"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-edit2\"\n [class.active]=\"activeReviews()\"\n class=\"pencil-icon\"\n ></svg-icon>\n\n <svg-icon\n name=\"cai-cancel\"\n class=\"cancel-icon\"\n (click)=\"\n $event.stopPropagation();\n activeReviews.set(false);\n onChangePresentReviews('all')\n \"\n ></svg-icon>\n\n <span class=\"count\">{{ countReviews }}</span>\n </div>\n </div>\n }\n </div>\n @if(ratingReviews && reviewsLength > 0){\n <div class=\"date-group\">\n <span>Date</span>\n <svg-icon name=\"cai-sort-descending\"></svg-icon>\n </div>\n\n } @if(modaltype === ReviewType.Modal){\n <div\n class=\"filter-group\"\n [ngStyle]=\"{\n display: addingReview() && reviewsLength === 0 ? 'none' : 'flex'\n }\"\n ngbTooltip=\"Add New\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n (click)=\"onAddReview()\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n }\n </div>\n @if(modaltype ===\n ReviewType.Details){\n <div class=\"bottom-divider-light\"></div>\n }\n </div>\n @if(modaltype === ReviewType.Table && reviewsLength > 0){\n <div class=\"input-container\">\n <cai-input\n id=\"search\"\n formControlName=\"search\"\n [config]=\"{\n type: 'text',\n icon: 'cai-search',\n inverse: true,\n size: 22,\n name: 'Find Title',\n placeholderBehavior: 'fade',\n placeholderColor: '#AAAAAA',\n }\"\n (onValueChange)=\"handleSearch($event)\"\n (onClear)=\"handleClear($event)\"\n ></cai-input>\n </div>\n <div class=\"btn-filters\">\n <div\n [class.active]=\"currentActiveFilter === 'all'\"\n (click)=\"onChangePresentReviews('all')\"\n >\n ALL\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'rating'\"\n (click)=\"onChangePresentReviews('rating')\"\n >\n RATING\n </div>\n <div\n [class.active]=\"currentActiveFilter === 'reviews'\"\n (click)=\"onChangePresentReviews('reviews')\"\n >\n REVIEW\n </div>\n </div>\n }\n </div>\n\n <!-- MAIN MODAL -->\n <div class=\"reviews-window\">\n @if(modaltype === ReviewType.Table && !hasPersonalReview){\n <div class=\"add-review\" (click)=\"onAddReview()\">\n <span>ADD REVIEW</span>\n <div class=\"filter-group\">\n <svg-icon\n name=\"cai-plus\"\n class=\"plus-icon\"\n [class.disabled]=\"disabled()\"\n ></svg-icon>\n </div>\n </div>\n } @if(ratingReviews && reviewsLength == 0 && !addingReview()){\n <div class=\"ilustration\">\n <svg-icon\n [name]=\"\n modaltype !== ReviewType.Table ? 'cai-illustration' : 'cai-illustration-dark'\n \"\n ></svg-icon>\n </div>\n }@else { @if (addingReview()) {\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"this.testReview\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } @for(review of presentReviews; track review.ratingId){\n <cai-single-review\n [type]=\"modaltype\"\n [singleReview]=\"review\"\n (deleteReview)=\"onDeleteReview($event)\"\n (onEditedReview)=\"onEditedReview($event)\"\n (onAddedReview)=\"onGetReview($event)\"\n />\n } }\n <!-- MAIN MODAL -->\n </div>\n </div>\n</div>\n", styles: ["svg-icon svg{width:18px;height:18px}svg-icon svg path{fill-opacity:1}p{margin:0!important}button{border:none!important}.y-divider{border:1px solid #DADADA;height:18px}.x-divider{width:100%;border-bottom:1px solid #EEEEEE}.column{display:flex;width:100%;height:26px!important}.disabled-btn{background-color:#f7f7f7!important;color:#ccc!important}.modal-wrapper{max-width:468px;display:flex;flex-direction:column;gap:4px;position:absolute;width:100%}.modal-wrapper .filter{padding:4px 6px}.modal-wrapper .filter .left-side .count-heading{line-height:18px;font-size:14px;color:#424242}.modal-wrapper .filter .left-side .circle{padding:2px 5px;width:21px}.modal-wrapper .filter-group{padding:0}.modal-wrapper .heading-wrapper{display:flex;flex-direction:column;gap:12px;padding:4px 6px}.table-wrapper{max-width:260px;padding:4px;border-radius:3px}.table-wrapper .reviews-window{height:100%!important;display:flex;flex-direction:column;gap:2px}.table-wrapper .filter{padding:0 0 0 4px;margin-bottom:4px;height:18px}.table-wrapper .filter .left-side{display:flex;align-items:center}.table-wrapper .filter .left-side .count-heading{text-transform:uppercase;font-size:11px;line-height:14px;font-weight:800}.table-wrapper .filter .left-side .circle{background-color:#424242}.table-wrapper .filter .date-group span{font-size:11px;line-height:14px;font-weight:500}.table-wrapper .filter .date-group svg-icon{width:18px;height:18px}.table-wrapper .btn-filters{margin:4px 0}.table-wrapper .btn-filters div{font-size:11px;line-height:14px;font-weight:700}.table-wrapper .add-review{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 4px 4px;height:26px;border-radius:2px}.table-wrapper .add-review span{line-height:18px;font-size:11px;font-weight:700;color:#92b1f5}.table-wrapper .add-review .filter-group{padding:0!important;display:flex;align-items:center}.table-wrapper .add-review .filter-group svg{width:14px;height:14px}.table-wrapper .add-review .filter-group .plus-icon{width:14px!important;height:14px!important}.table-wrapper .add-review .filter-group .plus-icon path{fill:#92b1f5!important}.table-wrapper .add-review .filter-group .plus-icon:hover{background-color:transparent!important}.table-wrapper .add-review:hover{background-color:#3b73ed3f;cursor:pointer}.table-wrapper .add-review:hover span path{fill:#fff}.details-wrapper{max-width:300px}.heading{display:flex;width:100%;justify-content:space-between;padding:4px 6px}.heading .heading-text{display:flex;gap:6px;align-items:center}.heading .heading-text p{font-weight:800;font-size:18px}.heading .heading-text span{background-color:#919191;color:#fff;font-weight:700;vertical-align:middle;padding:4px 8px;border-radius:2px}.heading .icons{display:flex;justify-content:space-between;align-items:center;min-width:60px}.heading .icons svg-icon{width:18px;height:18px;display:grid;place-items:center;cursor:pointer}.heading .icons svg-icon path{fill:#919191}.menu{padding:4px;display:flex;background-color:#eee;border-radius:2px;justify-content:space-evenly}.menu div{border-radius:2px;padding:4px 8px;font-size:14px;font-weight:700;color:#aaa;width:33%;text-align:center}.menu div.active{background-color:#fff;color:#3b73ed}.box{display:flex;flex-direction:column}.btn-filters{display:flex;border-radius:2px;padding:4px;gap:4px;justify-content:space-between;background-color:#1d1d1d}.btn-filters div{width:33%;text-align:center;border-radius:1px;padding:2px 8px;gap:10px;font-weight:700;color:#919191}.btn-filters div:hover{cursor:pointer}.btn-filters div.active{background-color:#2f2f2f;color:#fff}.filter{display:flex;align-items:center;flex-direction:column}.rating_review{display:flex;align-items:center;gap:6px;margin-right:auto}.rating_review .left-side{display:flex;gap:4px;align-items:center}.rating_review .counter{display:flex;align-items:center;gap:4px}.filter-group{display:flex;justify-content:center;position:relative;align-items:center;border-radius:2px;padding:4px!important;gap:4px}.filter-group.active-group{background-color:#6c6c6c;cursor:pointer}.filter-group.active-group .cancel-icon path{fill:#fff}.filter-group.active-group .count{color:#fff}.filter-group.active-group:hover{background-color:#424242}.filter-group.active-group:hover .cancel-icon{display:flex}.filter-group.active-group:hover .count{display:none}.filter-group.non-active-group:hover{background-color:#eee!important;cursor:pointer}.filter-group.non-active-group:hover svg-icon path{fill:#424242!important}.filter-group.non-active-group:hover:has(.most-likes) .like-icon path{fill:#56b4ac!important}.filter-group.non-active-group:hover:has(.most-dislikes) .dislike-icon path{fill:#e66767!important}.filter-group svg-icon{width:18px;height:18px;display:grid;place-items:center;color:#919191;background-color:transparent}.filter-group svg-icon:hover{background-color:transparent}.filter-group .cancel-icon{width:14px;height:14px;display:none}.filter-group .like-icon svg{margin-bottom:auto!important}.filter-group .like-icon.active,.filter-group .like-icon.most-likes{color:#56b4ac;background-color:transparent}.filter-group .dislike-icon.active,.filter-group .dislike-icon.most-dislikes{color:#e66767;background-color:transparent}.filter-group .pencil-icon.active{opacity:.7;background-color:transparent}.filter-group .pencil-icon.active path{fill:#fff!important}.filter-group .plus-icon{width:26px;height:26px;display:grid;place-items:center;position:relative}.filter-group .plus-icon svg{width:18px;height:18px}.filter-group .plus-icon path{fill:#6692f1}.filter-group .plus-icon:hover{cursor:pointer;background-color:#e9effd}.filter-group .plus-icon:hover path{fill:#0b49d1}.filter-group .count{font-weight:800;font-size:11px;width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:#919191}.filter-group .most-likes .like-icon{color:green!important}.filter-group .most-dislikes .dislike-icon{color:red!important}p{font-weight:800}.date-group{font-weight:500;display:flex;align-items:center;gap:4px;padding-left:6px;line-height:18px}.date-group svg-icon{width:18px;height:18px;display:grid;place-items:center}.circle{width:18px;height:18px;border-radius:60px;background-color:#6c6c6c;color:#fff;padding:4px 5px;display:flex;justify-content:center;align-items:center;font-size:11px;font-weight:700}.disabled{pointer-events:none!important}.disabled svg path{fill:#ccc!important}.main-window .ilustration{width:100%!important;object-fit:contain;object-position:center}.main-window .ilustration svg-icon{width:100%!important}.main-window .ilustration svg-icon svg{width:100%!important;height:100%!important}.reviews-window{height:100%!important;display:flex;flex-direction:column;gap:4px}.button-wrapper{display:flex;flex-direction:column;gap:12px}.buttons{display:flex;justify-content:space-between}.buttons button{font-size:14px;font-weight:700;padding:6px;border-radius:2px;cursor:pointer}.buttons .delete-close{display:flex;gap:12px}.buttons .delete-close .delete{color:#df3c3c;width:100px}.buttons .delete-close .close{width:150px}.buttons .save-btn{background-color:#3b73ed;color:#fff;min-width:150px}.dark{background-color:#2f2f2f!important;color:#fff}.dark .count-heading{color:#fff}.empty-state{cursor:none;pointer-events:none}.empty-state svg-icon path{fill:#91919166}.empty-state span{color:#91919166}.bottom-divider-light{width:100%;margin-top:6px;margin-bottom:4px;border-bottom:1px solid #DADADA}\n"] }]
7500
7473
  }], propDecorators: { ratingReviews: [{
7501
- type: Input,
7502
- args: [{ required: true }]
7474
+ type: Input
7503
7475
  }], modaltype: [{
7504
- type: Input,
7505
- args: [{ required: true }]
7476
+ type: Input
7506
7477
  }], reviewDeleted: [{
7507
7478
  type: Output
7508
7479
  }] } });
@@ -7517,9 +7488,8 @@ class RatingReviewComponent {
7517
7488
  }
7518
7489
  }
7519
7490
  ratingReviews;
7491
+ inCard;
7520
7492
  modaltype;
7521
- presentReviews = [];
7522
- currentType = '';
7523
7493
  countLikes = 0;
7524
7494
  countDislikes = 0;
7525
7495
  countReviews = 0;
@@ -7544,8 +7514,6 @@ class RatingReviewComponent {
7544
7514
  * @private
7545
7515
  */
7546
7516
  initializeReviewsData() {
7547
- this.presentReviews = [...this.ratingReviews];
7548
- this.currentType = this.modaltype;
7549
7517
  if (this.ratingReviews) {
7550
7518
  this.resetCounts();
7551
7519
  this.calculateReviewCounts();
@@ -7579,18 +7547,23 @@ class RatingReviewComponent {
7579
7547
  });
7580
7548
  }
7581
7549
  show = signal(false);
7582
- onToggleShow() {
7583
- this.show.set(!this.show());
7550
+ handleOpen() {
7551
+ this.show.set(true);
7552
+ }
7553
+ handleClose() {
7554
+ this.show.set(false);
7584
7555
  }
7585
7556
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RatingReviewComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
7586
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: RatingReviewComponent, isStandalone: true, selector: "cai-rating-review", inputs: { ratingReviews: "ratingReviews", modaltype: "modaltype" }, usesOnChanges: true, ngImport: i0, template: "<div\n [class]=\"{\n 'filter-toggle': true,\n active: show()\n }\"\n>\n <div\n class=\"filter-wrapper\"\n (click)=\"onToggleShow()\"\n ngbPopover=\"Show Rating & Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n popoverClass=\"custom-popover-dark\"\n placement=\"bottom\"\n >\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countLikes === 0,\n 'most-likes': onReturnMost() == 'likes'\n }\"\n >\n <svg-icon class=\"like-icon\" name=\"cai-like\" class=\"like-icon\" />\n <span>{{ countLikes }}</span>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countDislikes === 0,\n 'most-dislikes': onReturnMost() === 'dislikes'\n }\"\n >\n <svg-icon class=\"dislike-icon\" name=\"cai-dislike\" class=\"dislike-icon\" />\n <span>{{ countDislikes }}</span>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countReviews === 0\n }\"\n >\n <svg-icon class=\"edit-icon\" name=\"cai-edit2\" class=\"edit-icon\" />\n <span>{{ countReviews }}</span>\n </div>\n </div>\n</div>\n@if(show()){\n<cai-review-modal [ratingReviews]=\"presentReviews\" [modaltype]=\"currentType\" />\n}\n", styles: ["svg-icon{width:18px;height:18px;display:grid;justify-content:center;align-items:center}svg-icon.like-icon svg{margin-bottom:auto!important}svg-icon svg{width:16.2px!important;height:14.18px!important;display:flex;flex-direction:column;justify-content:center;align-items:center}svg-icon svg path{fill-opacity:1!important}.filter-toggle{height:100%;display:flex;align-items:center}.filter-toggle .filter-wrapper{display:flex;align-items:center;gap:8px;border-radius:2px;padding:4px;position:relative}.filter-toggle:hover>.filter-wrapper{background-color:#91919133;cursor:pointer}.filter-toggle .toggle-group{display:flex;align-items:center;justify-content:center;gap:4px}.filter-toggle .toggle-group svg-icon path{fill:#919191}.filter-toggle .toggle-group.empty-state svg-icon path{fill:#91919166}.filter-toggle .toggle-group.empty-state span{color:#91919166}.filter-toggle .toggle-group.most-likes svg-icon path{fill:#56b4ac}.filter-toggle .toggle-group.most-dislikes svg-icon path{fill:#e66767}.filter-toggle svg-icon.like-icon,.filter-toggle svg-icon .edit-icon{transform:scaleX(-1)}.filter-toggle span{font-weight:600;font-size:11px}.filter-toggle.active .filter-wrapper{background-color:#2f2f2f}.filter-toggle.active .toggle-group{color:#fff}.filter-toggle.active .toggle-group.empty-state{color:#aaa}::ng-deep .popover .popover-arrow{display:none!important}::ng-deep .popover .popover-body{font-weight:600;font-size:11px;border-radius:3px;padding:2px 6px;white-space:nowrap;pointer-events:none}::ng-deep .popover.custom-popover-dark{background-color:#424242!important}::ng-deep .popover.custom-popover-dark .popover-body{color:#fff!important}::ng-deep .popover.custom-popover-light{background-color:#ccc!important}::ng-deep .popover.custom-popover-light .popover-body{color:#2f2f2f!important}::ng-deep .popover.custom-popover-delete{background-color:#df3c3c!important}::ng-deep .popover.custom-popover-delete .popover-body{color:#fff!important}\n"], dependencies: [{ kind: "component", type: ReviewModalComponent, selector: "cai-review-modal", inputs: ["ratingReviews", "modaltype"], outputs: ["reviewDeleted"] }, { kind: "component", type: SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "svgClass", "class", "viewBox", "svgAriaLabel", "onSVGLoaded", "svgStyle"] }, { kind: "ngmodule", type: NgbPopoverModule }, { kind: "directive", type: i2.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "ngbPopover", "popoverTitle", "placement", "popperOptions", "triggers", "positionTarget", "container", "disablePopover", "popoverClass", "popoverContext", "openDelay", "closeDelay"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }] });
7557
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: RatingReviewComponent, isStandalone: true, selector: "cai-rating-review", inputs: { ratingReviews: "ratingReviews", inCard: "inCard", modaltype: "modaltype" }, usesOnChanges: true, ngImport: i0, template: "<div\n [class]=\"{\n 'filter-toggle': true,\n active: show()\n }\"\n [ngbPopover]=\"popoverReview\"\n popoverClass=\"tagPopover popover-review\"\n (hidden)=\"handleClose()\"\n container=\"body\"\n placement=\"bottom-start\"\n [autoClose]=\"'outside'\"\n (shown)=\"handleOpen()\"\n>\n <div\n class=\"filter-wrapper\"\n [ngbTooltip]=\"inCard ? 'Show Rating & Review' : 'Show Reviews'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countLikes === 0,\n 'most-likes': onReturnMost() == 'likes'\n }\"\n >\n <svg-icon class=\"like-icon\" name=\"cai-like\" class=\"like-icon\" />\n <div>{{ countLikes }}</div>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countDislikes === 0,\n 'most-dislikes': onReturnMost() === 'dislikes'\n }\"\n >\n <svg-icon class=\"dislike-icon\" name=\"cai-dislike\" class=\"dislike-icon\" />\n <div>{{ countDislikes }}</div>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countReviews === 0\n }\"\n >\n <svg-icon class=\"edit-icon\" name=\"cai-edit2\" class=\"edit-icon\" />\n <div>{{ countReviews }}</div>\n </div>\n </div>\n</div>\n<ng-template #popoverReview>\n <div class=\"popover-review\">\n <cai-review-modal [ratingReviews]=\"ratingReviews\" [modaltype]=\"modaltype\" />\n </div>\n</ng-template>\n", styles: ["svg-icon{width:18px;height:18px;display:grid;justify-content:center;align-items:center}svg-icon svg{width:16.2px!important;height:14.18px!important;display:flex;flex-direction:column;justify-content:center;align-items:center}svg-icon svg path{fill-opacity:1!important}.filter-toggle{max-width:140px;height:100%;display:flex;align-items:center}.filter-toggle .filter-wrapper{width:100%;display:flex;justify-content:space-between;align-items:center;gap:8px;border-radius:2px;padding:4px;position:relative}.filter-toggle:hover>.filter-wrapper{background-color:#91919133;cursor:pointer}.filter-toggle .toggle-group{display:flex;align-items:center;justify-content:center;gap:4px}.filter-toggle .toggle-group div{width:16px;height:14px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;line-height:14px;text-align:center}.filter-toggle .toggle-group svg-icon path{fill:#919191}.filter-toggle .toggle-group.empty-state svg-icon path{fill:#91919166}.filter-toggle .toggle-group.empty-state span{color:#91919166}.filter-toggle .toggle-group.most-likes svg-icon path{fill:#56b4ac}.filter-toggle .toggle-group.most-dislikes svg-icon path{fill:#e66767}.filter-toggle span{font-weight:600;font-size:11px}.filter-toggle.active .filter-wrapper{background-color:#2f2f2f}.filter-toggle.active .toggle-group{color:#fff}.filter-toggle.active .toggle-group.empty-state{color:#aaa}::ng-deep .popover .popover-arrow{display:none!important}::ng-deep .popover .popover-body{font-weight:600;font-size:11px;border-radius:3px;padding:2px 6px;white-space:nowrap;pointer-events:none}::ng-deep .popover.custom-popover-dark{background-color:#424242!important}::ng-deep .popover.custom-popover-dark .popover-body{color:#fff!important}::ng-deep .popover.custom-popover-light{background-color:#ccc!important}::ng-deep .popover.custom-popover-light .popover-body{color:#2f2f2f!important}::ng-deep .popover.custom-popover-delete{background-color:#df3c3c!important}::ng-deep .popover.custom-popover-delete .popover-body{color:#fff!important}\n"], dependencies: [{ kind: "component", type: ReviewModalComponent, selector: "cai-review-modal", inputs: ["ratingReviews", "modaltype"], outputs: ["reviewDeleted"] }, { kind: "component", type: SvgIconComponent, selector: "svg-icon", inputs: ["src", "name", "stretch", "applyClass", "svgClass", "class", "viewBox", "svgAriaLabel", "onSVGLoaded", "svgStyle"] }, { kind: "ngmodule", type: NgbTooltipModule }, { kind: "directive", type: i2.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "ngmodule", type: NgbPopoverModule }, { kind: "directive", type: i2.NgbPopover, selector: "[ngbPopover]", inputs: ["animation", "autoClose", "ngbPopover", "popoverTitle", "placement", "popperOptions", "triggers", "positionTarget", "container", "disablePopover", "popoverClass", "popoverContext", "openDelay", "closeDelay"], outputs: ["shown", "hidden"], exportAs: ["ngbPopover"] }] });
7587
7558
  }
7588
7559
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RatingReviewComponent, decorators: [{
7589
7560
  type: Component,
7590
- args: [{ selector: 'cai-rating-review', imports: [ReviewModalComponent, SvgIconComponent, NgbPopoverModule], template: "<div\n [class]=\"{\n 'filter-toggle': true,\n active: show()\n }\"\n>\n <div\n class=\"filter-wrapper\"\n (click)=\"onToggleShow()\"\n ngbPopover=\"Show Rating & Review\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n popoverClass=\"custom-popover-dark\"\n placement=\"bottom\"\n >\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countLikes === 0,\n 'most-likes': onReturnMost() == 'likes'\n }\"\n >\n <svg-icon class=\"like-icon\" name=\"cai-like\" class=\"like-icon\" />\n <span>{{ countLikes }}</span>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countDislikes === 0,\n 'most-dislikes': onReturnMost() === 'dislikes'\n }\"\n >\n <svg-icon class=\"dislike-icon\" name=\"cai-dislike\" class=\"dislike-icon\" />\n <span>{{ countDislikes }}</span>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countReviews === 0\n }\"\n >\n <svg-icon class=\"edit-icon\" name=\"cai-edit2\" class=\"edit-icon\" />\n <span>{{ countReviews }}</span>\n </div>\n </div>\n</div>\n@if(show()){\n<cai-review-modal [ratingReviews]=\"presentReviews\" [modaltype]=\"currentType\" />\n}\n", styles: ["svg-icon{width:18px;height:18px;display:grid;justify-content:center;align-items:center}svg-icon.like-icon svg{margin-bottom:auto!important}svg-icon svg{width:16.2px!important;height:14.18px!important;display:flex;flex-direction:column;justify-content:center;align-items:center}svg-icon svg path{fill-opacity:1!important}.filter-toggle{height:100%;display:flex;align-items:center}.filter-toggle .filter-wrapper{display:flex;align-items:center;gap:8px;border-radius:2px;padding:4px;position:relative}.filter-toggle:hover>.filter-wrapper{background-color:#91919133;cursor:pointer}.filter-toggle .toggle-group{display:flex;align-items:center;justify-content:center;gap:4px}.filter-toggle .toggle-group svg-icon path{fill:#919191}.filter-toggle .toggle-group.empty-state svg-icon path{fill:#91919166}.filter-toggle .toggle-group.empty-state span{color:#91919166}.filter-toggle .toggle-group.most-likes svg-icon path{fill:#56b4ac}.filter-toggle .toggle-group.most-dislikes svg-icon path{fill:#e66767}.filter-toggle svg-icon.like-icon,.filter-toggle svg-icon .edit-icon{transform:scaleX(-1)}.filter-toggle span{font-weight:600;font-size:11px}.filter-toggle.active .filter-wrapper{background-color:#2f2f2f}.filter-toggle.active .toggle-group{color:#fff}.filter-toggle.active .toggle-group.empty-state{color:#aaa}::ng-deep .popover .popover-arrow{display:none!important}::ng-deep .popover .popover-body{font-weight:600;font-size:11px;border-radius:3px;padding:2px 6px;white-space:nowrap;pointer-events:none}::ng-deep .popover.custom-popover-dark{background-color:#424242!important}::ng-deep .popover.custom-popover-dark .popover-body{color:#fff!important}::ng-deep .popover.custom-popover-light{background-color:#ccc!important}::ng-deep .popover.custom-popover-light .popover-body{color:#2f2f2f!important}::ng-deep .popover.custom-popover-delete{background-color:#df3c3c!important}::ng-deep .popover.custom-popover-delete .popover-body{color:#fff!important}\n"] }]
7561
+ args: [{ selector: 'cai-rating-review', imports: [ReviewModalComponent, SvgIconComponent, NgbTooltipModule, NgbPopoverModule], template: "<div\n [class]=\"{\n 'filter-toggle': true,\n active: show()\n }\"\n [ngbPopover]=\"popoverReview\"\n popoverClass=\"tagPopover popover-review\"\n (hidden)=\"handleClose()\"\n container=\"body\"\n placement=\"bottom-start\"\n [autoClose]=\"'outside'\"\n (shown)=\"handleOpen()\"\n>\n <div\n class=\"filter-wrapper\"\n [ngbTooltip]=\"inCard ? 'Show Rating & Review' : 'Show Reviews'\"\n triggers=\"mouseenter:mouseleave\"\n tabindex=\"0\"\n tooltipClass=\"tooltip tooltip-m-b-2\"\n placement=\"bottom\"\n >\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countLikes === 0,\n 'most-likes': onReturnMost() == 'likes'\n }\"\n >\n <svg-icon class=\"like-icon\" name=\"cai-like\" class=\"like-icon\" />\n <div>{{ countLikes }}</div>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countDislikes === 0,\n 'most-dislikes': onReturnMost() === 'dislikes'\n }\"\n >\n <svg-icon class=\"dislike-icon\" name=\"cai-dislike\" class=\"dislike-icon\" />\n <div>{{ countDislikes }}</div>\n </div>\n <div\n [class]=\"{\n 'toggle-group': true,\n 'empty-state': countReviews === 0\n }\"\n >\n <svg-icon class=\"edit-icon\" name=\"cai-edit2\" class=\"edit-icon\" />\n <div>{{ countReviews }}</div>\n </div>\n </div>\n</div>\n<ng-template #popoverReview>\n <div class=\"popover-review\">\n <cai-review-modal [ratingReviews]=\"ratingReviews\" [modaltype]=\"modaltype\" />\n </div>\n</ng-template>\n", styles: ["svg-icon{width:18px;height:18px;display:grid;justify-content:center;align-items:center}svg-icon svg{width:16.2px!important;height:14.18px!important;display:flex;flex-direction:column;justify-content:center;align-items:center}svg-icon svg path{fill-opacity:1!important}.filter-toggle{max-width:140px;height:100%;display:flex;align-items:center}.filter-toggle .filter-wrapper{width:100%;display:flex;justify-content:space-between;align-items:center;gap:8px;border-radius:2px;padding:4px;position:relative}.filter-toggle:hover>.filter-wrapper{background-color:#91919133;cursor:pointer}.filter-toggle .toggle-group{display:flex;align-items:center;justify-content:center;gap:4px}.filter-toggle .toggle-group div{width:16px;height:14px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;line-height:14px;text-align:center}.filter-toggle .toggle-group svg-icon path{fill:#919191}.filter-toggle .toggle-group.empty-state svg-icon path{fill:#91919166}.filter-toggle .toggle-group.empty-state span{color:#91919166}.filter-toggle .toggle-group.most-likes svg-icon path{fill:#56b4ac}.filter-toggle .toggle-group.most-dislikes svg-icon path{fill:#e66767}.filter-toggle span{font-weight:600;font-size:11px}.filter-toggle.active .filter-wrapper{background-color:#2f2f2f}.filter-toggle.active .toggle-group{color:#fff}.filter-toggle.active .toggle-group.empty-state{color:#aaa}::ng-deep .popover .popover-arrow{display:none!important}::ng-deep .popover .popover-body{font-weight:600;font-size:11px;border-radius:3px;padding:2px 6px;white-space:nowrap;pointer-events:none}::ng-deep .popover.custom-popover-dark{background-color:#424242!important}::ng-deep .popover.custom-popover-dark .popover-body{color:#fff!important}::ng-deep .popover.custom-popover-light{background-color:#ccc!important}::ng-deep .popover.custom-popover-light .popover-body{color:#2f2f2f!important}::ng-deep .popover.custom-popover-delete{background-color:#df3c3c!important}::ng-deep .popover.custom-popover-delete .popover-body{color:#fff!important}\n"] }]
7591
7562
  }], propDecorators: { ratingReviews: [{
7592
7563
  type: Input,
7593
7564
  args: [{ required: true }]
7565
+ }], inCard: [{
7566
+ type: Input
7594
7567
  }], modaltype: [{
7595
7568
  type: Input,
7596
7569
  args: [{ required: true }]