@memberjunction/ng-explorer-core 5.35.0 → 5.37.0

package/dist/lib/conversation-feedback/conversation-feedback.js

@@ -0,0 +1,809 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Component, ChangeDetectorRef, HostListener, inject } from '@angular/core';
+import { RegisterClass } from '@memberjunction/global';
+import { BaseResourceComponent } from '@memberjunction/ng-shared';
+import { RunQuery } from '@memberjunction/core';
+import { ApplicationManager } from '@memberjunction/ng-base-application';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/common";
+import * as i2 from "@angular/forms";
+import * as i3 from "@memberjunction/ng-ui-components";
+import * as i4 from "@memberjunction/ng-pagination";
+function ConversationFeedbackResource_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 1);
+    i0.ɵɵelement(1, "div", 4);
+    i0.ɵɵtext(2, " Loading...");
+    i0.ɵɵelementEnd();
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 15);
+    i0.ɵɵelement(1, "i", 44);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementStart(3, "button", 45);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Conditional_14_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.error = null); });
+    i0.ɵɵtext(4, "\u00D7");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.error, " ");
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_85_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 1);
+    i0.ɵɵelement(1, "div", 4);
+    i0.ɵɵtext(2, " Loading feedback...");
+    i0.ɵɵelementEnd();
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 46);
+    i0.ɵɵelement(1, "i", 47);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3, "No feedback matches the current filters.");
+    i0.ɵɵelementEnd()();
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 66);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const row_r6 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(row_r6.comments);
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 67);
+    i0.ɵɵtext(1, "(no comment)");
+    i0.ɵɵelementEnd();
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 69);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const row_r6 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(row_r6.messageSnippet);
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 67);
+    i0.ɵɵtext(1, "\u2014");
+    i0.ɵɵelementEnd();
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 71);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const row_r6 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(row_r6.raterEmail);
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "tr", 64);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Template_tr_click_0_listener() { const row_r6 = i0.ɵɵrestoreView(_r5).$implicit; const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.openDrawer(row_r6)); });
+    i0.ɵɵelementStart(1, "td", 50)(2, "span", 65);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementStart(4, "small");
+    i0.ɵɵtext(5, "/10");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(6, "td", 51);
+    i0.ɵɵconditionalCreate(7, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_7_Template, 2, 1, "div", 66)(8, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_8_Template, 2, 0, "span", 67);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "td", 52)(10, "span", 68);
+    i0.ɵɵtext(11);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(12, "td", 53);
+    i0.ɵɵconditionalCreate(13, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_13_Template, 2, 1, "span", 69)(14, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_14_Template, 2, 0, "span", 67);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "td", 54)(16, "div", 70);
+    i0.ɵɵtext(17);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(18, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Conditional_18_Template, 2, 1, "div", 71);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "td", 55)(20, "span", 72);
+    i0.ɵɵtext(21);
+    i0.ɵɵpipe(22, "date");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const row_r6 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵclassProp("expanded", (ctx_r1.selectedRow == null ? null : ctx_r1.selectedRow.ratingID) === row_r6.ratingID);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngClass", ctx_r1.bandClassFor(row_r6.rating));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", row_r6.rating);
+    i0.ɵɵadvance(4);
+    i0.ɵɵconditional(row_r6.comments ? 7 : 8);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(row_r6.agentName || "\u2014");
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(row_r6.messageSnippet ? 13 : 14);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(row_r6.raterName || row_r6.raterEmail || "\u2014");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(row_r6.raterEmail && row_r6.raterName ? 18 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(22, 10, row_r6.createdAt, "short"));
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 58);
+    i0.ɵɵtext(1);
+    i0.ɵɵpipe(2, "number");
+    i0.ɵɵpipe(3, "number");
+    i0.ɵɵpipe(4, "number");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate4(" ", i0.ɵɵpipeBind1(2, 4, ctx_r1.rangeStart), "-", i0.ɵɵpipeBind1(3, 6, ctx_r1.rangeEnd), " of ", i0.ɵɵpipeBind1(4, 8, ctx_r1.totalRowCount), " ", ctx_r1.totalRowCount === 1 ? "rating" : "ratings", " ");
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Conditional_21_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-pagination", 73);
+    i0.ɵɵlistener("PageChange", function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Conditional_21_Template_mj_pagination_PageChange_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r1 = i0.ɵɵnextContext(4); return i0.ɵɵresetView(ctx_r1.onPageChange($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(4);
+    i0.ɵɵproperty("TotalRowCount", ctx_r1.totalRowCount)("PageNumber", ctx_r1.currentPage)("PageSize", ctx_r1.pageSize)("IsLoading", ctx_r1.loading);
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_27_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "option", 63);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const size_r8 = ctx.$implicit;
+    i0.ɵɵproperty("ngValue", size_r8);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(size_r8);
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 48)(1, "table", 49)(2, "thead")(3, "tr")(4, "th", 50);
+    i0.ɵɵtext(5, "Rating");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "th", 51);
+    i0.ɵɵtext(7, "Comments");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "th", 52);
+    i0.ɵɵtext(9, "Agent");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "th", 53);
+    i0.ɵɵtext(11, "Message");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "th", 54);
+    i0.ɵɵtext(13, "Rater");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(14, "th", 55);
+    i0.ɵɵtext(15, "When");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(16, "tbody");
+    i0.ɵɵrepeaterCreate(17, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_18_Template, 23, 13, "tr", 56, i0.ɵɵcomponentInstance().trackByRatingID, true);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(19, "div", 57);
+    i0.ɵɵconditionalCreate(20, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Conditional_20_Template, 5, 10, "span", 58)(21, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Conditional_21_Template, 1, 4, "mj-pagination", 59);
+    i0.ɵɵelementStart(22, "label", 60)(23, "span", 61);
+    i0.ɵɵtext(24, "Rows");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(25, "select", 62);
+    i0.ɵɵlistener("ngModelChange", function ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Template_select_ngModelChange_25_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onPageSizeChange($event)); });
+    i0.ɵɵrepeaterCreate(26, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_For_27_Template, 2, 2, "option", 63, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(17);
+    i0.ɵɵrepeater(ctx_r1.rows);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r1.isSinglePage ? 20 : 21);
+    i0.ɵɵadvance(5);
+    i0.ɵɵproperty("ngModel", ctx_r1.pageSize);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.pageSizeOptions);
+} }
+function ConversationFeedbackResource_Conditional_2_Conditional_86_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_0_Template, 4, 0, "div", 46)(1, ConversationFeedbackResource_Conditional_2_Conditional_86_Conditional_1_Template, 28, 2);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵconditional(ctx_r1.rows.length === 0 ? 0 : 1);
+} }
+function ConversationFeedbackResource_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 5)(1, "div", 6)(2, "div", 7)(3, "div", 8);
+    i0.ɵɵelement(4, "i", 9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div")(6, "h1", 10);
+    i0.ɵɵtext(7, "Agent Feedback");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "p", 11);
+    i0.ɵɵtext(9, "User ratings and comments on AI messages");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(10, "div", 12)(11, "button", 13);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_11_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.loadFeedback()); });
+    i0.ɵɵelement(12, "i", 14);
+    i0.ɵɵtext(13, " Refresh ");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵconditionalCreate(14, ConversationFeedbackResource_Conditional_2_Conditional_14_Template, 5, 1, "div", 15);
+    i0.ɵɵelementStart(15, "div", 16)(16, "div", 17)(17, "div", 18);
+    i0.ɵɵelement(18, "i", 9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "div", 19)(20, "div", 20);
+    i0.ɵɵtext(21);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(22, "div", 21);
+    i0.ɵɵtext(23, "Total Ratings");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(24, "div", 17)(25, "div", 22);
+    i0.ɵɵelement(26, "i", 23);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(27, "div", 19)(28, "div", 20);
+    i0.ɵɵtext(29);
+    i0.ɵɵelementStart(30, "span", 24);
+    i0.ɵɵtext(31, "/10");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(32, "div", 21);
+    i0.ɵɵtext(33, "Avg Rating");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(34, "div", 17)(35, "div", 25);
+    i0.ɵɵelement(36, "i", 26);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(37, "div", 19)(38, "div", 27);
+    i0.ɵɵtext(39);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(40, "div", 21);
+    i0.ɵɵtext(41, "Positive (8-10)");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(42, "div", 17)(43, "div", 28);
+    i0.ɵɵelement(44, "i", 29);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(45, "div", 19)(46, "div", 30);
+    i0.ɵɵtext(47);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(48, "div", 21);
+    i0.ɵɵtext(49, "Negative (1-3)");
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵelementStart(50, "div", 31)(51, "div", 32)(52, "div", 33)(53, "span", 34);
+    i0.ɵɵtext(54, "Date Range");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(55, "div", 35)(56, "button", 36);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_56_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setDateRange("1d")); });
+    i0.ɵɵtext(57, "1d");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(58, "button", 36);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_58_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setDateRange("7d")); });
+    i0.ɵɵtext(59, "7d");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(60, "button", 36);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_60_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setDateRange("30d")); });
+    i0.ɵɵtext(61, "30d");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(62, "button", 36);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_62_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setDateRange("90d")); });
+    i0.ɵɵtext(63, "90d");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(64, "button", 36);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_64_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setDateRange("all")); });
+    i0.ɵɵtext(65, "All");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(66, "div", 33)(67, "span", 34);
+    i0.ɵɵtext(68, "Rating Band");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(69, "div", 35)(70, "button", 36);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_70_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setBand("all")); });
+    i0.ɵɵtext(71, "All");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(72, "button", 37);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_72_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setBand("high")); });
+    i0.ɵɵtext(73, "High 8-10");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(74, "button", 38);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_74_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setBand("mid")); });
+    i0.ɵɵtext(75, "Mid 4-7");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(76, "button", 39);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_2_Template_button_click_76_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.setBand("low")); });
+    i0.ɵɵtext(77, "Low 1-3");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(78, "div", 40)(79, "span", 34);
+    i0.ɵɵtext(80, "Search");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(81, "input", 41);
+    i0.ɵɵtwoWayListener("ngModelChange", function ConversationFeedbackResource_Conditional_2_Template_input_ngModelChange_81_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.searchTerm, $event) || (ctx_r1.searchTerm = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("input", function ConversationFeedbackResource_Conditional_2_Template_input_input_81_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onSearchChange()); });
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(82, "div", 42);
+    i0.ɵɵtext(83);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(84, "div", 43);
+    i0.ɵɵconditionalCreate(85, ConversationFeedbackResource_Conditional_2_Conditional_85_Template, 3, 0, "div", 1);
+    i0.ɵɵconditionalCreate(86, ConversationFeedbackResource_Conditional_2_Conditional_86_Template, 2, 1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(11);
+    i0.ɵɵproperty("disabled", ctx_r1.loading);
+    i0.ɵɵadvance();
+    i0.ɵɵclassProp("fa-spin", ctx_r1.loading);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.error ? 14 : -1);
+    i0.ɵɵadvance(7);
+    i0.ɵɵtextInterpolate(ctx_r1.stats.total);
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate(ctx_r1.stats.avgRating);
+    i0.ɵɵadvance(10);
+    i0.ɵɵtextInterpolate1("", ctx_r1.stats.percentPositive, "%");
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate1("", ctx_r1.stats.percentNegative, "%");
+    i0.ɵɵadvance(9);
+    i0.ɵɵclassProp("active", ctx_r1.dateRange === "1d");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.dateRange === "7d");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.dateRange === "30d");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.dateRange === "90d");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.dateRange === "all");
+    i0.ɵɵadvance(6);
+    i0.ɵɵclassProp("active", ctx_r1.ratingBand === "all");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.ratingBand === "high");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.ratingBand === "mid");
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("active", ctx_r1.ratingBand === "low");
+    i0.ɵɵadvance(5);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.searchTerm);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate2(" ", ctx_r1.totalRowCount, " ", ctx_r1.totalRowCount === 1 ? "rating" : "ratings", " match the current filters ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.loading ? 85 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(!ctx_r1.loading ? 86 : -1);
+} }
+function ConversationFeedbackResource_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r9 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 74);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDrawer()); });
+    i0.ɵɵelementEnd();
+} }
+function ConversationFeedbackResource_Conditional_5_Conditional_23_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 85);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const r_r11 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(r_r11.comments);
+} }
+function ConversationFeedbackResource_Conditional_5_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 86);
+    i0.ɵɵtext(1, "(no comment was provided)");
+    i0.ɵɵelementEnd();
+} }
+function ConversationFeedbackResource_Conditional_5_Conditional_48_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtext(0);
+} if (rf & 2) {
+    const r_r11 = i0.ɵɵnextContext();
+    i0.ɵɵtextInterpolate1(" ", r_r11.messageText, " ");
+} }
+function ConversationFeedbackResource_Conditional_5_Conditional_49_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 67);
+    i0.ɵɵtext(1, "(message text unavailable)");
+    i0.ɵɵelementEnd();
+} }
+function ConversationFeedbackResource_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 75)(1, "div", 76);
+    i0.ɵɵelement(2, "i", 9);
+    i0.ɵɵelementStart(3, "div", 77)(4, "h2", 78);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "div", 79)(7, "span", 65);
+    i0.ɵɵtext(8);
+    i0.ɵɵelementStart(9, "small");
+    i0.ɵɵtext(10, "/10");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(11, "span");
+    i0.ɵɵtext(12, " Rated by ");
+    i0.ɵɵelementStart(13, "strong");
+    i0.ɵɵtext(14);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtext(15);
+    i0.ɵɵpipe(16, "date");
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵelementStart(17, "button", 80);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_5_Template_button_click_17_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDrawer()); });
+    i0.ɵɵelement(18, "i", 81);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(19, "div", 82)(20, "div", 83)(21, "div", 84);
+    i0.ɵɵtext(22, "Reviewer Comment");
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(23, ConversationFeedbackResource_Conditional_5_Conditional_23_Template, 2, 1, "div", 85)(24, ConversationFeedbackResource_Conditional_5_Conditional_24_Template, 2, 0, "div", 86);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(25, "div", 83)(26, "div", 87)(27, "div", 88)(28, "div", 89);
+    i0.ɵɵtext(29, "Agent");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(30, "div", 90);
+    i0.ɵɵtext(31);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(32, "div", 88)(33, "div", 89);
+    i0.ɵɵtext(34, "Conversation");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(35, "div", 90);
+    i0.ɵɵtext(36);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(37, "div", 88)(38, "div", 89);
+    i0.ɵɵtext(39, "Message Role");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(40, "div", 90);
+    i0.ɵɵtext(41);
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵelementStart(42, "div", 83)(43, "div", 91)(44, "div", 92);
+    i0.ɵɵelement(45, "i", 93);
+    i0.ɵɵtext(46, " Rated Message ");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(47, "div", 94);
+    i0.ɵɵconditionalCreate(48, ConversationFeedbackResource_Conditional_5_Conditional_48_Template, 1, 1)(49, ConversationFeedbackResource_Conditional_5_Conditional_49_Template, 2, 0, "span", 67);
+    i0.ɵɵelementEnd()()()();
+    i0.ɵɵelementStart(50, "div", 95)(51, "button", 96);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_5_Template_button_click_51_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.closeDrawer()); });
+    i0.ɵɵtext(52, "Close");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(53, "button", 97);
+    i0.ɵɵlistener("click", function ConversationFeedbackResource_Conditional_5_Template_button_click_53_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openConversation()); });
+    i0.ɵɵelement(54, "i", 98);
+    i0.ɵɵtext(55, " Open Conversation ");
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const r_r11 = ctx;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate1(" Feedback on ", r_r11.agentName || "AI message", " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("ngClass", ctx_r1.bandClassFor(r_r11.rating));
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", r_r11.rating);
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(r_r11.raterName || r_r11.raterEmail || "Unknown user");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" \u00B7 ", i0.ɵɵpipeBind2(16, 12, r_r11.createdAt, "medium"), " ");
+    i0.ɵɵadvance(8);
+    i0.ɵɵconditional(r_r11.comments ? 23 : 24);
+    i0.ɵɵadvance(8);
+    i0.ɵɵtextInterpolate(r_r11.agentName || "\u2014");
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(r_r11.conversationName || "\u2014");
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(r_r11.messageRole || "\u2014");
+    i0.ɵɵadvance(7);
+    i0.ɵɵconditional(r_r11.messageText ? 48 : 49);
+    i0.ɵɵadvance(5);
+    i0.ɵɵproperty("disabled", !r_r11.conversationID)("title", r_r11.conversationID ? "Open the source conversation" : "No conversation linked");
+} }
+let ConversationFeedbackResource = class ConversationFeedbackResource extends BaseResourceComponent {
+    isInitializing = true;
+    loading = false;
+    statsLoading = false;
+    error = null;
+    ratingBand = 'all';
+    dateRange = '7d';
+    searchTerm = '';
+    rows = [];
+    totalRowCount = 0;
+    pageSize = 10;
+    currentPage = 1;
+    pageSizeOptions = [10, 25, 50, 100];
+    stats = { total: 0, avgRating: 0, percentPositive: 0, percentNegative: 0 };
+    selectedRow = null;
+    searchDebounceTimer = null;
+    cdr = inject(ChangeDetectorRef);
+    appManager = inject(ApplicationManager);
+    async GetResourceDisplayName() {
+        return 'Agent Feedback';
+    }
+    async GetResourceIconClass() {
+        return 'fa-solid fa-comment-dots';
+    }
+    async ngOnInit() {
+        this.isInitializing = false;
+        this.cdr.detectChanges();
+        await this.applyFilters();
+        this.NotifyLoadComplete();
+    }
+    /** Manual refresh from the page header — same path as a filter change. */
+    async loadFeedback() {
+        await this.applyFilters();
+    }
+    setBand(band) {
+        if (this.ratingBand === band)
+            return;
+        this.ratingBand = band;
+        this.currentPage = 1;
+        void this.applyFilters();
+    }
+    setDateRange(range) {
+        if (this.dateRange === range)
+            return;
+        this.dateRange = range;
+        this.currentPage = 1;
+        void this.applyFilters();
+    }
+    /**
+     * Search input fires on every keystroke; debounce so we don't slam the
+     * server while the user is typing. 250ms is enough to feel responsive
+     * without firing on intermediate states.
+     */
+    onSearchChange() {
+        if (this.searchDebounceTimer)
+            clearTimeout(this.searchDebounceTimer);
+        this.searchDebounceTimer = setTimeout(() => {
+            this.currentPage = 1;
+            void this.applyFilters();
+        }, 250);
+    }
+    onPageChange(event) {
+        if (event.PageNumber === this.currentPage)
+            return;
+        this.currentPage = event.PageNumber;
+        void this.loadRows();
+    }
+    onPageSizeChange(size) {
+        const next = Number(size);
+        if (!next || next === this.pageSize)
+            return;
+        this.pageSize = next;
+        this.currentPage = 1;
+        void this.loadRows();
+    }
+    openDrawer(row) {
+        this.selectedRow = row;
+        this.cdr.detectChanges();
+    }
+    closeDrawer() {
+        this.selectedRow = null;
+        this.cdr.detectChanges();
+    }
+    async openConversation() {
+        if (!this.selectedRow?.conversationID)
+            return;
+        const conversationID = this.selectedRow.conversationID;
+        // The Chat app owns the Conversations nav item; the active app (Agent
+        // Feedback) does not, so we must target Chat explicitly. Fall back to
+        // scanning all apps for a nav item whose DriverClass is the chat resource.
+        let appId = this.appManager.GetAppByName('Chat')?.ID;
+        let navItemLabel = 'Conversations';
+        if (!appId) {
+            for (const app of this.appManager.GetAllApps()) {
+                const navItems = await app.GetNavItems();
+                const match = navItems.find(n => n.DriverClass === 'ChatConversationsResource');
+                if (match) {
+                    appId = app.ID;
+                    navItemLabel = match.Label;
+                    break;
+                }
+            }
+        }
+        if (!appId) {
+            this.error = 'Could not find a Chat application to open this conversation in.';
+            this.cdr.detectChanges();
+            return;
+        }
+        this.closeDrawer();
+        await this.navigationService.OpenNavItemByName(navItemLabel, { conversationId: conversationID }, appId);
+    }
+    onEscape() {
+        if (this.selectedRow)
+            this.closeDrawer();
+    }
+    bandClassFor(rating) {
+        if (rating >= 8)
+            return 'rating-high';
+        if (rating >= 4)
+            return 'rating-mid';
+        return 'rating-low';
+    }
+    trackByRatingID = (_, row) => row.ratingID;
+    /** 1-based index of the first row on the current page (0 when empty). */
+    get rangeStart() {
+        if (this.totalRowCount === 0)
+            return 0;
+        return (this.currentPage - 1) * this.pageSize + 1;
+    }
+    /** 1-based index of the last row on the current page (clamped to total). */
+    get rangeEnd() {
+        return Math.min(this.currentPage * this.pageSize, this.totalRowCount);
+    }
+    /**
+     * True when the filtered set fits on a single page — in this case
+     * mj-pagination hides itself, so the footer renders a fallback summary
+     * line. When false we let mj-pagination own the bar (it has its own
+     * `1-N of M` summary on the left + nav controls on the right).
+     */
+    get isSinglePage() {
+        if (this.totalRowCount <= 0)
+            return false;
+        return Math.ceil(this.totalRowCount / this.pageSize) <= 1;
+    }
+    /**
+     * Run both the rows-query (paged) and the stats-query (aggregate) against
+     * the current filter state. Called when filters change or on initial load.
+     */
+    async applyFilters() {
+        await Promise.all([this.loadRows(), this.loadStats()]);
+    }
+    /**
+     * Fetch the current page of rows from the server. The mj-pagination
+     * footer reads `totalRowCount` to derive the page count.
+     */
+    async loadRows() {
+        this.loading = true;
+        this.error = null;
+        this.cdr.detectChanges();
+        try {
+            const rq = new RunQuery();
+            const result = await rq.RunQuery({
+                QueryName: 'ListConversationDetailFeedback',
+                CategoryPath: '/MJ/Conversations',
+                Parameters: this.buildQueryParameters(),
+                StartRow: (this.currentPage - 1) * this.pageSize,
+                MaxRows: this.pageSize
+            });
+            if (!result.Success) {
+                this.error = result.ErrorMessage || 'Failed to load feedback';
+                this.rows = [];
+                this.totalRowCount = 0;
+                return;
+            }
+            this.rows = (result.Results ?? []).map((r) => this.mapRow(r));
+            this.totalRowCount = result.TotalRowCount ?? this.rows.length;
+        }
+        catch (e) {
+            this.error = e?.message || 'Failed to load feedback';
+            this.rows = [];
+            this.totalRowCount = 0;
+        }
+        finally {
+            this.loading = false;
+            this.cdr.detectChanges();
+        }
+    }
+    /**
+     * Aggregate counts over the same filter universe as `loadRows()`. Runs in
+     * parallel with the rows query so the stat cards and the table stay in
+     * sync after every filter change.
+     */
+    async loadStats() {
+        this.statsLoading = true;
+        this.cdr.detectChanges();
+        try {
+            const rq = new RunQuery();
+            const result = await rq.RunQuery({
+                QueryName: 'ListConversationDetailFeedbackStats',
+                CategoryPath: '/MJ/Conversations',
+                Parameters: this.buildQueryParameters()
+            });
+            const row = result.Results?.[0] || {};
+            const total = Number(row.Total ?? 0);
+            const avg = Number(row.AvgRating ?? 0);
+            const pos = Number(row.PositiveCount ?? 0);
+            const neg = Number(row.NegativeCount ?? 0);
+            this.stats = {
+                total,
+                avgRating: total ? Math.round(avg * 10) / 10 : 0,
+                percentPositive: total ? Math.round((pos / total) * 100) : 0,
+                percentNegative: total ? Math.round((neg / total) * 100) : 0
+            };
+        }
+        catch (e) {
+            // Stats are non-critical — the table is the primary surface. Log and
+            // leave the previous stats values in place.
+            console.warn('[Feedback] stats query failed', e);
+        }
+        finally {
+            this.statsLoading = false;
+            this.cdr.detectChanges();
+        }
+    }
+    /**
+     * Build the Nunjucks-bound parameter set passed to both queries. Server-side
+     * filtering: emit only the keys that actually have a value so the SQL's
+     * `{% if X %}` blocks stay inert when filters are at their default.
+     */
+    buildQueryParameters() {
+        const params = {};
+        if (this.ratingBand === 'high') {
+            params.MinRating = 8;
+        }
+        else if (this.ratingBand === 'mid') {
+            params.MinRating = 4;
+            params.MaxRating = 7;
+        }
+        else if (this.ratingBand === 'low') {
+            params.MaxRating = 3;
+        }
+        const cutoffIso = this.dateRangeCutoffIso();
+        if (cutoffIso) {
+            params.StartDate = cutoffIso;
+        }
+        const term = this.searchTerm.trim();
+        if (term) {
+            params.SearchText = term;
+        }
+        return params;
+    }
+    dateRangeCutoffIso() {
+        if (this.dateRange === 'all')
+            return null;
+        const days = this.dateRange === '1d' ? 1
+            : this.dateRange === '7d' ? 7
+                : this.dateRange === '30d' ? 30
+                    : 90;
+        const cutoff = new Date(Date.now() - days * 24 * 60 * 60 * 1000);
+        return cutoff.toISOString();
+    }
+    mapRow(r) {
+        const message = r.MessageText ?? null;
+        const snippet = message
+            ? (message.length > 160 ? message.slice(0, 160) + '…' : message)
+            : null;
+        return {
+            ratingID: r.RatingID,
+            rating: r.Rating,
+            comments: r.Comments ?? null,
+            createdAt: r.RatedAt ?? '',
+            raterName: r.RaterName ?? null,
+            raterEmail: r.RaterEmail ?? null,
+            conversationDetailID: r.ConversationDetailID,
+            conversationID: r.ConversationID ?? null,
+            conversationName: r.ConversationName ?? null,
+            messageText: message,
+            messageSnippet: snippet,
+            messageRole: r.MessageRole ?? null,
+            agentID: r.AgentID ?? null,
+            agentName: r.AgentName ?? null
+        };
+    }
+    static ɵfac = /*@__PURE__*/ (() => { let ɵConversationFeedbackResource_BaseFactory; return function ConversationFeedbackResource_Factory(__ngFactoryType__) { return (ɵConversationFeedbackResource_BaseFactory || (ɵConversationFeedbackResource_BaseFactory = i0.ɵɵgetInheritedFactory(ConversationFeedbackResource)))(__ngFactoryType__ || ConversationFeedbackResource); }; })();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ConversationFeedbackResource, selectors: [["mj-conversation-feedback"]], hostBindings: function ConversationFeedbackResource_HostBindings(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("keydown.escape", function ConversationFeedbackResource_keydown_escape_HostBindingHandler() { return ctx.onEscape(); }, i0.ɵɵresolveDocument);
+        } }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 6, vars: 6, consts: [[1, "feedback-container"], [1, "loading-overlay"], [1, "slideout-backdrop"], ["role", "dialog", "aria-modal", "true", "aria-labelledby", "slideout-title", 1, "slideout-panel"], [1, "spinner"], [1, "sticky-header"], [1, "page-header"], [1, "page-title-area"], [1, "page-icon"], [1, "fa-solid", "fa-comment-dots"], [1, "page-title"], [1, "page-subtitle"], [1, "page-actions"], [1, "btn-action", 3, "click", "disabled"], [1, "fa-solid", "fa-arrows-rotate"], [1, "error-banner"], [1, "stats-grid"], [1, "stat-card"], [1, "stat-icon", "stat-icon-total"], [1, "stat-content"], [1, "stat-value"], [1, "stat-label"], [1, "stat-icon", "stat-icon-avg"], [1, "fa-solid", "fa-star"], [1, "stat-unit"], [1, "stat-icon", "stat-icon-positive"], [1, "fa-solid", "fa-thumbs-up"], [1, "stat-value", "rating-high-text"], [1, "stat-icon", "stat-icon-negative"], [1, "fa-solid", "fa-thumbs-down"], [1, "stat-value", "rating-low-text"], [1, "filter-bar"], [1, "filter-row"], [1, "filter-group"], [1, "filter-label"], [1, "btn-group"], [1, "btn-filter", 3, "click"], [1, "btn-filter", "band-high", 3, "click"], [1, "btn-filter", "band-mid", 3, "click"], [1, "btn-filter", "band-low", 3, "click"], [1, "filter-group", "filter-search"], ["type", "text", "placeholder", "Search comments, message, agent, rater...", 1, "input-search", 3, "ngModelChange", "input", "ngModel"], [1, "diagnostic-line"], [1, "scrollable-content"], [1, "fa-solid", "fa-triangle-exclamation"], ["aria-label", "Dismiss error", 3, "click"], [1, "empty-state"], [1, "fa-solid", "fa-comment-slash"], [1, "feedback-table-wrapper"], [1, "feedback-table"], [1, "col-rating"], [1, "col-comment"], [1, "col-agent"], [1, "col-message"], [1, "col-rater"], [1, "col-when"], [1, "feedback-row", 3, "expanded"], [1, "pagination-bar"], [1, "pagination-summary"], [1, "feedback-pagination", 3, "TotalRowCount", "PageNumber", "PageSize", "IsLoading"], [1, "page-size-control"], [1, "page-size-label"], [1, "page-size-select", 3, "ngModelChange", "ngModel"], [3, "ngValue"], [1, "feedback-row", 3, "click"], [1, "rating-badge", 3, "ngClass"], [1, "comment-text", "clamped"], [1, "muted"], [1, "agent-name"], [1, "message-snippet"], [1, "rater-name"], [1, "rater-email"], [1, "when"], [1, "feedback-pagination", 3, "PageChange", "TotalRowCount", "PageNumber", "PageSize", "IsLoading"], [1, "slideout-backdrop", 3, "click"], [1, "slideout-header"], [1, "slideout-title"], [1, "slideout-title-text"], ["id", "slideout-title", 1, "slideout-title-line"], [1, "slideout-subtitle"], ["title", "Close (Esc)", "aria-label", "Close", 1, "slideout-close", 3, "click"], [1, "fa-solid", "fa-xmark"], [1, "slideout-content"], [1, "slideout-section"], [1, "section-label"], [1, "comment-body"], [1, "comment-body", "muted"], [1, "meta-grid"], [1, "meta-card"], [1, "meta-label"], [1, "meta-value"], [1, "message-card"], [1, "message-card-header"], [1, "fa-solid", "fa-message"], [1, "message-card-body"], [1, "slideout-footer"], ["mjButton", "", "variant", "flat", "size", "lg", 3, "click"], ["mjButton", "", "variant", "primary", "size", "lg", 3, "click", "disabled", "title"], [1, "fa-solid", "fa-arrow-up-right-from-square"]], template: function ConversationFeedbackResource_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0);
+            i0.ɵɵconditionalCreate(1, ConversationFeedbackResource_Conditional_1_Template, 3, 0, "div", 1);
+            i0.ɵɵconditionalCreate(2, ConversationFeedbackResource_Conditional_2_Template, 87, 31);
+            i0.ɵɵconditionalCreate(3, ConversationFeedbackResource_Conditional_3_Template, 1, 0, "div", 2);
+            i0.ɵɵelementStart(4, "aside", 3);
+            i0.ɵɵconditionalCreate(5, ConversationFeedbackResource_Conditional_5_Template, 56, 15);
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            let tmp_4_0;
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.isInitializing ? 1 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.isInitializing ? 2 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.selectedRow ? 3 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("open", !!ctx.selectedRow);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional((tmp_4_0 = ctx.selectedRow) ? 5 : -1, tmp_4_0);
+        } }, dependencies: [i1.NgClass, i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.SelectControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.MJButtonDirective, i4.PaginationComponent, i1.DecimalPipe, i1.DatePipe], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n}\n\n.feedback-container[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n  overflow: hidden;\n}\n\n\n\n\n\n.sticky-header[_ngcontent-%COMP%] {\n  flex-shrink: 0;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  box-shadow: var(--mj-shadow-sm);\n  z-index: 10;\n}\n\n\n\n\n\n.page-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 1rem 1.5rem;\n}\n\n.page-title-area[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 0.75rem; }\n\n.page-icon[_ngcontent-%COMP%] {\n  width: 40px; height: 40px;\n  display: flex; align-items: center; justify-content: center;\n  background: var(--mj-brand-accent-subtle);\n  color: var(--mj-brand-primary);\n  border-radius: var(--mj-radius-md);\n  font-size: 1.125rem;\n}\n\n.page-title[_ngcontent-%COMP%] {\n  font-size: 1.25rem;\n  font-weight: 700;\n  margin: 0;\n  letter-spacing: -0.02em;\n  color: var(--mj-text-primary);\n}\n\n.page-subtitle[_ngcontent-%COMP%] {\n  font-size: 0.8125rem;\n  color: var(--mj-text-secondary);\n  margin: 0;\n}\n\n.page-actions[_ngcontent-%COMP%] { display: flex; align-items: center; gap: 0.5rem; }\n\n.btn-action[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.4rem;\n  padding: 0.4rem 0.875rem;\n  font-size: 0.8125rem;\n  font-weight: 500;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: background 180ms, border-color 180ms, color 180ms;\n}\n.btn-action[_ngcontent-%COMP%]:hover:not(:disabled) {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-primary);\n}\n.btn-action[_ngcontent-%COMP%]:disabled { opacity: 0.5; cursor: default; }\n\n\n\n\n\n.stats-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 0.75rem;\n  padding: 0 1.5rem 1rem;\n}\n\n@media (min-width: 768px) {\n  .stats-grid[_ngcontent-%COMP%] {\n    grid-template-columns: repeat(4, 1fr);\n    gap: 1rem;\n  }\n}\n\n.stat-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-sm);\n  padding: 1rem 1.25rem;\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.stat-icon[_ngcontent-%COMP%] {\n  width: 44px;\n  height: 44px;\n  border-radius: var(--mj-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.125rem;\n  flex-shrink: 0;\n}\n\n.stat-icon-total[_ngcontent-%COMP%] {\n  background: var(--mj-brand-accent-subtle);\n  color: var(--mj-brand-primary);\n}\n.stat-icon-avg[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-tertiary) 16%, transparent);\n  color: var(--mj-brand-tertiary);\n}\n.stat-icon-positive[_ngcontent-%COMP%] {\n  background: var(--rating-high-bg, #ecfdf5);\n  color: var(--rating-high, #10b981);\n}\n.stat-icon-negative[_ngcontent-%COMP%] {\n  background: var(--mj-status-error-bg);\n  color: var(--mj-status-error);\n}\n\n.stat-content[_ngcontent-%COMP%] { flex: 1; min-width: 0; }\n\n.stat-value[_ngcontent-%COMP%] {\n  font-size: 1.5rem;\n  font-weight: 700;\n  letter-spacing: -0.02em;\n  color: var(--mj-text-primary);\n  line-height: 1.1;\n}\n.stat-unit[_ngcontent-%COMP%] {\n  font-size: 0.8125rem;\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n  margin-left: 2px;\n}\n.stat-label[_ngcontent-%COMP%] {\n  font-size: 0.6875rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  margin-top: 0.125rem;\n}\n\n.rating-high-text[_ngcontent-%COMP%] { color: var(--rating-high, #10b981); }\n.rating-low-text[_ngcontent-%COMP%]  { color: var(--mj-status-error); }\n\n\n\n\n\n.filter-bar[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  padding: 0.75rem 1.5rem 1rem;\n  background: var(--mj-bg-surface);\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.filter-row[_ngcontent-%COMP%] {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.filter-group[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 0.3rem;\n}\n\n.filter-search[_ngcontent-%COMP%] {\n  flex: 0 1 auto;\n  width: 280px;\n  min-width: 200px;\n  max-width: 360px;\n}\n\n.filter-label[_ngcontent-%COMP%] {\n  font-size: 0.6875rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n}\n\n.btn-group[_ngcontent-%COMP%] { display: flex; gap: 0; }\n.btn-group[_ngcontent-%COMP%]   .btn-filter[_ngcontent-%COMP%]:first-child { border-radius: var(--mj-radius-sm) 0 0 var(--mj-radius-sm); }\n.btn-group[_ngcontent-%COMP%]   .btn-filter[_ngcontent-%COMP%]:last-child  { border-radius: 0 var(--mj-radius-sm) var(--mj-radius-sm) 0; }\n.btn-group[_ngcontent-%COMP%]   .btn-filter[_ngcontent-%COMP%]:not(:first-child) { margin-left: -1px; }\n\n.btn-filter[_ngcontent-%COMP%] {\n  padding: 0.4rem 0.75rem;\n  font-size: 0.8125rem;\n  font-weight: 500;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: background 180ms, color 180ms, border-color 180ms;\n  white-space: nowrap;\n}\n.btn-filter[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.btn-filter.active[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-brand-on-primary);\n  border-color: var(--mj-brand-primary);\n  z-index: 1;\n  position: relative;\n}\n.btn-filter.band-high.active[_ngcontent-%COMP%] {\n  background: var(--rating-high, #10b981);\n  border-color: var(--rating-high, #10b981);\n  color: var(--mj-text-inverse);\n}\n.btn-filter.band-mid.active[_ngcontent-%COMP%] {\n  background: var(--rating-mid, #f59e0b);\n  border-color: var(--rating-mid, #f59e0b);\n  color: var(--mj-text-inverse);\n}\n.btn-filter.band-low.active[_ngcontent-%COMP%] {\n  background: var(--mj-status-error);\n  border-color: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n}\n\n.input-search[_ngcontent-%COMP%] {\n  padding: 0.45rem 0.75rem;\n  font-size: 0.875rem;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n  width: 100%;\n}\n.input-search[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n\n.diagnostic-line[_ngcontent-%COMP%] {\n  font-size: 0.6875rem;\n  color: var(--mj-text-secondary);\n  letter-spacing: 0.02em;\n}\n\n\n\n\n\n.error-banner[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.625rem;\n  margin: 0 1.5rem 0.75rem;\n  padding: 0.75rem 1rem;\n  background: var(--mj-status-error-bg);\n  border: 1px solid color-mix(in srgb, var(--mj-status-error) 35%, transparent);\n  border-radius: var(--mj-radius-md);\n  color: var(--mj-status-error-text);\n  font-size: 0.8125rem;\n  font-weight: 500;\n}\n.error-banner[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  margin-left: auto;\n  background: none;\n  border: none;\n  cursor: pointer;\n  font-size: 1.125rem;\n  color: var(--mj-status-error);\n  padding: 0 0.25rem;\n}\n\n\n\n\n\n.scrollable-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: 1.25rem 1.5rem 1.5rem;\n}\n\n.loading-overlay[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.625rem;\n  padding: 3rem;\n  color: var(--mj-text-secondary);\n  font-size: 0.8125rem;\n  font-weight: 500;\n}\n.spinner[_ngcontent-%COMP%] {\n  width: 20px; height: 20px;\n  border: 2px solid var(--mj-border-default);\n  border-top-color: var(--mj-brand-primary);\n  border-radius: 50%;\n  animation: _ngcontent-%COMP%_spin 0.6s linear infinite;\n}\n@keyframes _ngcontent-%COMP%_spin { to { transform: rotate(360deg); } }\n\n\n\n\n\n.empty-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 4rem 1.25rem;\n  color: var(--mj-text-secondary);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n}\n.empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 2.25rem;\n  margin-bottom: 0.875rem;\n  opacity: 0.5;\n}\n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n  font-size: 0.875rem;\n  font-weight: 500;\n  margin: 0;\n}\n\n\n\n\n\n.feedback-table-wrapper[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-sm);\n  overflow: auto;\n}\n\n.feedback-table[_ngcontent-%COMP%] {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: 0.8125rem;\n  table-layout: fixed;\n}\n\n.feedback-table[_ngcontent-%COMP%]   thead[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n.feedback-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n  text-align: left;\n  font-size: 0.6875rem;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  padding: 0.75rem 0.875rem;\n}\n.feedback-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n  padding: 0.875rem;\n  border-bottom: 1px solid var(--mj-border-default);\n  color: var(--mj-text-primary);\n  vertical-align: top;\n}\n\n.feedback-row[_ngcontent-%COMP%] {\n  cursor: pointer;\n  transition: background 180ms;\n}\n.feedback-row[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-hover); }\n.feedback-row.expanded[_ngcontent-%COMP%] { background: var(--mj-brand-accent-subtle); }\n\n.col-rating[_ngcontent-%COMP%]  { width: 90px; }\n.col-comment[_ngcontent-%COMP%] { width: 28%; }\n.col-agent[_ngcontent-%COMP%]   { width: 14%; }\n.col-message[_ngcontent-%COMP%] { width: 26%; }\n.col-rater[_ngcontent-%COMP%]   { width: 16%; }\n.col-when[_ngcontent-%COMP%]    { width: 12%; }\n\n.rating-badge[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: baseline;\n  gap: 2px;\n  padding: 0.35rem 0.625rem;\n  border-radius: var(--mj-radius-md);\n  font-size: 0.875rem;\n  font-weight: 700;\n  letter-spacing: -0.02em;\n}\n.rating-badge[_ngcontent-%COMP%]   small[_ngcontent-%COMP%] {\n  font-size: 0.625rem;\n  font-weight: 500;\n  opacity: 0.7;\n}\n.rating-badge.rating-high[_ngcontent-%COMP%] { background: var(--rating-high-bg, #ecfdf5); color: var(--rating-high, #10b981); }\n.rating-badge.rating-mid[_ngcontent-%COMP%]  { background: var(--rating-mid-bg,  #fffbeb); color: var(--rating-mid,  #f59e0b); }\n.rating-badge.rating-low[_ngcontent-%COMP%]  { background: var(--mj-status-error-bg);     color: var(--mj-status-error); }\n\n.comment-text[_ngcontent-%COMP%] {\n  white-space: pre-wrap;\n  word-break: break-word;\n  line-height: 1.5;\n}\n.comment-text.clamped[_ngcontent-%COMP%] {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  line-clamp: 2;\n  overflow: hidden;\n}\n.message-snippet[_ngcontent-%COMP%] {\n  color: var(--mj-text-secondary);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  line-clamp: 2;\n  overflow: hidden;\n}\n\n\n\n.pagination-bar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  margin-top: 0.5rem;\n  font-size: 0.8125rem;\n  color: var(--mj-text-secondary);\n}\n.pagination-summary[_ngcontent-%COMP%] {\n  flex: 1;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n  padding: 0.5rem 0;\n}\n.feedback-pagination[_ngcontent-%COMP%] {\n  display: block;\n  flex: 1;\n  min-width: 0;\n}\n\n.page-size-control[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n  flex-shrink: 0;\n}\n.page-size-label[_ngcontent-%COMP%] {\n  font-size: 0.6875rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n}\n.page-size-select[_ngcontent-%COMP%] {\n  padding: 0.3rem 0.5rem;\n  font-size: 0.8125rem;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n  cursor: pointer;\n}\n.page-size-select[_ngcontent-%COMP%]:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n\n.agent-name[_ngcontent-%COMP%] { font-weight: 500; color: var(--mj-text-primary); }\n.rater-name[_ngcontent-%COMP%] { font-weight: 500; color: var(--mj-text-primary); }\n.rater-email[_ngcontent-%COMP%] { font-size: 0.6875rem; color: var(--mj-text-secondary); margin-top: 2px; }\n.when[_ngcontent-%COMP%] { color: var(--mj-text-secondary); font-size: 0.75rem; white-space: nowrap; }\n.muted[_ngcontent-%COMP%] { color: var(--mj-text-secondary); font-style: italic; }\n\n\n\n\n\n\n\n\n\n.slideout-backdrop[_ngcontent-%COMP%] {\n  position: absolute;\n  inset: 0;\n  background: var(--mj-bg-overlay, rgba(28, 28, 34, 0.45));\n  z-index: 100;\n  animation: _ngcontent-%COMP%_feedback-fadeIn 0.2s ease;\n}\n@keyframes _ngcontent-%COMP%_feedback-fadeIn { from { opacity: 0; } to { opacity: 1; } }\n\n.slideout-panel[_ngcontent-%COMP%] {\n  position: absolute;\n  top: 0;\n  right: 0;\n  height: 100%;\n  width: 560px;\n  max-width: 100%;\n  background: var(--mj-bg-surface);\n  box-shadow: -8px 0 32px var(--mj-bg-overlay, rgba(0, 0, 0, 0.25));\n  z-index: 101;\n  display: flex;\n  flex-direction: column;\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  transform: translateX(100%);\n  overflow: hidden;\n}\n.slideout-panel.open[_ngcontent-%COMP%] { transform: translateX(0); }\n\n\n\n.slideout-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 20px 24px;\n  background: var(--mj-brand-accent-subtle);\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.slideout-title[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n.slideout-title[_ngcontent-%COMP%]    > i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n  font-size: 22px;\n  flex-shrink: 0;\n  line-height: 1.2;\n}\n.slideout-title-text[_ngcontent-%COMP%] { min-width: 0; }\n.slideout-title-line[_ngcontent-%COMP%] {\n  font-weight: 700;\n  font-size: 17px;\n  color: var(--mj-text-primary);\n  margin: 0 0 6px;\n  line-height: 1.3;\n  word-break: break-word;\n}\n.slideout-subtitle[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  font-size: 12px;\n  color: var(--mj-text-secondary);\n  flex-wrap: wrap;\n}\n.slideout-subtitle[_ngcontent-%COMP%]   strong[_ngcontent-%COMP%] { color: var(--mj-text-primary); font-weight: 600; }\n\n.slideout-close[_ngcontent-%COMP%] {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--mj-bg-surface-hover);\n  border: none;\n  border-radius: 8px;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: all 0.2s ease;\n  flex-shrink: 0;\n}\n.slideout-close[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-active);\n  color: var(--mj-text-primary);\n}\n\n\n\n.slideout-content[_ngcontent-%COMP%] {\n  flex: 1;\n  overflow-y: auto;\n  padding: 0;\n  background: var(--mj-bg-surface);\n}\n.slideout-section[_ngcontent-%COMP%] {\n  padding: 20px 24px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n.slideout-section[_ngcontent-%COMP%]:last-child { border-bottom: none; }\n\n.section-label[_ngcontent-%COMP%] {\n  font-size: 11px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  margin-bottom: 0.5rem;\n}\n.comment-body[_ngcontent-%COMP%] {\n  font-size: 14px;\n  line-height: 1.55;\n  color: var(--mj-text-primary);\n  white-space: pre-wrap;\n  word-break: break-word;\n}\n.comment-body.muted[_ngcontent-%COMP%] { font-style: italic; color: var(--mj-text-secondary); }\n\n.meta-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 0.75rem;\n}\n.meta-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 0.75rem 0.875rem;\n}\n.meta-label[_ngcontent-%COMP%] {\n  font-size: 0.625rem;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  font-weight: 600;\n  margin-bottom: 0.25rem;\n}\n.meta-value[_ngcontent-%COMP%] {\n  font-size: 0.8125rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  word-break: break-word;\n}\n\n.message-card[_ngcontent-%COMP%] {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  overflow: hidden;\n}\n.message-card-header[_ngcontent-%COMP%] {\n  padding: 0.75rem 1.125rem;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n  font-size: 0.8125rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n.message-card-body[_ngcontent-%COMP%] {\n  padding: 1rem 1.125rem;\n  font-size: 0.875rem;\n  line-height: 1.55;\n  color: var(--mj-text-primary);\n  white-space: pre-wrap;\n  word-break: break-word;\n  max-height: 320px;\n  overflow-y: auto;\n}\n\n\n\n.slideout-footer[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 12px;\n  justify-content: flex-end;\n  padding: 16px 24px;\n  background: var(--mj-bg-page);\n  border-top: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.slideout-footer[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] { min-width: 96px; }\n.slideout-footer[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { margin-right: 6px; }"] });
+};
+ConversationFeedbackResource = __decorate([
+    RegisterClass(BaseResourceComponent, 'ConversationFeedbackResource')
+], ConversationFeedbackResource);
+export { ConversationFeedbackResource };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ConversationFeedbackResource, [{
+        type: Component,
+        args: [{ standalone: false, selector: 'mj-conversation-feedback', template: "<div class=\"feedback-container\">\n\n  @if (isInitializing) {\n    <div class=\"loading-overlay\"><div class=\"spinner\"></div> Loading...</div>\n  }\n\n  @if (!isInitializing) {\n\n    <div class=\"sticky-header\">\n      <div class=\"page-header\">\n        <div class=\"page-title-area\">\n          <div class=\"page-icon\"><i class=\"fa-solid fa-comment-dots\"></i></div>\n          <div>\n            <h1 class=\"page-title\">Agent Feedback</h1>\n            <p class=\"page-subtitle\">User ratings and comments on AI messages</p>\n          </div>\n        </div>\n        <div class=\"page-actions\">\n          <button class=\"btn-action\" (click)=\"loadFeedback()\" [disabled]=\"loading\">\n            <i class=\"fa-solid fa-arrows-rotate\" [class.fa-spin]=\"loading\"></i> Refresh\n          </button>\n        </div>\n      </div>\n\n      @if (error) {\n        <div class=\"error-banner\">\n          <i class=\"fa-solid fa-triangle-exclamation\"></i>\n          {{ error }}\n          <button (click)=\"error = null\" aria-label=\"Dismiss error\">\u00D7</button>\n        </div>\n      }\n\n      <div class=\"stats-grid\">\n        <div class=\"stat-card\">\n          <div class=\"stat-icon stat-icon-total\"><i class=\"fa-solid fa-comment-dots\"></i></div>\n          <div class=\"stat-content\">\n            <div class=\"stat-value\">{{ stats.total }}</div>\n            <div class=\"stat-label\">Total Ratings</div>\n          </div>\n        </div>\n        <div class=\"stat-card\">\n          <div class=\"stat-icon stat-icon-avg\"><i class=\"fa-solid fa-star\"></i></div>\n          <div class=\"stat-content\">\n            <div class=\"stat-value\">{{ stats.avgRating }}<span class=\"stat-unit\">/10</span></div>\n            <div class=\"stat-label\">Avg Rating</div>\n          </div>\n        </div>\n        <div class=\"stat-card\">\n          <div class=\"stat-icon stat-icon-positive\"><i class=\"fa-solid fa-thumbs-up\"></i></div>\n          <div class=\"stat-content\">\n            <div class=\"stat-value rating-high-text\">{{ stats.percentPositive }}%</div>\n            <div class=\"stat-label\">Positive (8-10)</div>\n          </div>\n        </div>\n        <div class=\"stat-card\">\n          <div class=\"stat-icon stat-icon-negative\"><i class=\"fa-solid fa-thumbs-down\"></i></div>\n          <div class=\"stat-content\">\n            <div class=\"stat-value rating-low-text\">{{ stats.percentNegative }}%</div>\n            <div class=\"stat-label\">Negative (1-3)</div>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"filter-bar\">\n        <div class=\"filter-row\">\n          <div class=\"filter-group\">\n            <span class=\"filter-label\">Date Range</span>\n            <div class=\"btn-group\">\n              <button class=\"btn-filter\" [class.active]=\"dateRange === '1d'\"  (click)=\"setDateRange('1d')\">1d</button>\n              <button class=\"btn-filter\" [class.active]=\"dateRange === '7d'\"  (click)=\"setDateRange('7d')\">7d</button>\n              <button class=\"btn-filter\" [class.active]=\"dateRange === '30d'\" (click)=\"setDateRange('30d')\">30d</button>\n              <button class=\"btn-filter\" [class.active]=\"dateRange === '90d'\" (click)=\"setDateRange('90d')\">90d</button>\n              <button class=\"btn-filter\" [class.active]=\"dateRange === 'all'\" (click)=\"setDateRange('all')\">All</button>\n            </div>\n          </div>\n          <div class=\"filter-group\">\n            <span class=\"filter-label\">Rating Band</span>\n            <div class=\"btn-group\">\n              <button class=\"btn-filter\" [class.active]=\"ratingBand === 'all'\"  (click)=\"setBand('all')\">All</button>\n              <button class=\"btn-filter band-high\" [class.active]=\"ratingBand === 'high'\" (click)=\"setBand('high')\">High 8-10</button>\n              <button class=\"btn-filter band-mid\"  [class.active]=\"ratingBand === 'mid'\"  (click)=\"setBand('mid')\">Mid 4-7</button>\n              <button class=\"btn-filter band-low\"  [class.active]=\"ratingBand === 'low'\"  (click)=\"setBand('low')\">Low 1-3</button>\n            </div>\n          </div>\n          <div class=\"filter-group filter-search\">\n            <span class=\"filter-label\">Search</span>\n            <input\n              type=\"text\"\n              class=\"input-search\"\n              [(ngModel)]=\"searchTerm\"\n              (input)=\"onSearchChange()\"\n              placeholder=\"Search comments, message, agent, rater...\" />\n          </div>\n        </div>\n        <div class=\"diagnostic-line\">\n          {{ totalRowCount }} {{ totalRowCount === 1 ? 'rating' : 'ratings' }} match the current filters\n        </div>\n      </div>\n    </div>\n\n    <div class=\"scrollable-content\">\n      @if (loading) {\n        <div class=\"loading-overlay\"><div class=\"spinner\"></div> Loading feedback...</div>\n      }\n\n      @if (!loading) {\n        @if (rows.length === 0) {\n          <div class=\"empty-state\">\n            <i class=\"fa-solid fa-comment-slash\"></i>\n            <p>No feedback matches the current filters.</p>\n          </div>\n        } @else {\n          <div class=\"feedback-table-wrapper\">\n            <table class=\"feedback-table\">\n              <thead>\n                <tr>\n                  <th class=\"col-rating\">Rating</th>\n                  <th class=\"col-comment\">Comments</th>\n                  <th class=\"col-agent\">Agent</th>\n                  <th class=\"col-message\">Message</th>\n                  <th class=\"col-rater\">Rater</th>\n                  <th class=\"col-when\">When</th>\n                </tr>\n              </thead>\n              <tbody>\n                @for (row of rows; track trackByRatingID($index, row)) {\n                  <tr\n                    class=\"feedback-row\"\n                    [class.expanded]=\"selectedRow?.ratingID === row.ratingID\"\n                    (click)=\"openDrawer(row)\">\n                    <td class=\"col-rating\">\n                      <span class=\"rating-badge\" [ngClass]=\"bandClassFor(row.rating)\">\n                        {{ row.rating }}<small>/10</small>\n                      </span>\n                    </td>\n                    <td class=\"col-comment\">\n                      @if (row.comments) {\n                        <div class=\"comment-text clamped\">{{ row.comments }}</div>\n                      } @else {\n                        <span class=\"muted\">(no comment)</span>\n                      }\n                    </td>\n                    <td class=\"col-agent\">\n                      <span class=\"agent-name\">{{ row.agentName || '\u2014' }}</span>\n                    </td>\n                    <td class=\"col-message\">\n                      @if (row.messageSnippet) {\n                        <span class=\"message-snippet\">{{ row.messageSnippet }}</span>\n                      } @else {\n                        <span class=\"muted\">\u2014</span>\n                      }\n                    </td>\n                    <td class=\"col-rater\">\n                      <div class=\"rater-name\">{{ row.raterName || row.raterEmail || '\u2014' }}</div>\n                      @if (row.raterEmail && row.raterName) {\n                        <div class=\"rater-email\">{{ row.raterEmail }}</div>\n                      }\n                    </td>\n                    <td class=\"col-when\">\n                      <span class=\"when\">{{ row.createdAt | date:'short' }}</span>\n                    </td>\n                  </tr>\n                }\n              </tbody>\n            </table>\n          </div>\n\n          <!--\n            Bottom bar. When the filtered set spans multiple pages mj-pagination\n            renders its own full-width `1-N of M | controls` row. When it fits\n            on a single page mj-pagination self-hides, so the footer renders\n            a single fallback summary line in its place.\n          -->\n          <!--\n            Bottom bar: mj-pagination on the left (it has its own internal\n            `1-N of M | nav controls` layout) + page-size selector hugging the\n            right edge. The selector lives outside mj-pagination because the\n            shared component doesn't expose a size-change output; the parent\n            owns PageSize.\n          -->\n          <div class=\"pagination-bar\">\n            @if (isSinglePage) {\n              <span class=\"pagination-summary\">\n                {{ rangeStart | number }}-{{ rangeEnd | number }} of {{ totalRowCount | number }}\n                {{ totalRowCount === 1 ? 'rating' : 'ratings' }}\n              </span>\n            } @else {\n              <mj-pagination\n                class=\"feedback-pagination\"\n                [TotalRowCount]=\"totalRowCount\"\n                [PageNumber]=\"currentPage\"\n                [PageSize]=\"pageSize\"\n                [IsLoading]=\"loading\"\n                (PageChange)=\"onPageChange($event)\">\n              </mj-pagination>\n            }\n\n            <label class=\"page-size-control\">\n              <span class=\"page-size-label\">Rows</span>\n              <select\n                class=\"page-size-select\"\n                [ngModel]=\"pageSize\"\n                (ngModelChange)=\"onPageSizeChange($event)\">\n                @for (size of pageSizeOptions; track size) {\n                  <option [ngValue]=\"size\">{{ size }}</option>\n                }\n              </select>\n            </label>\n          </div>\n        }\n      }\n    </div>\n  }\n\n  <!-- ===== Detail slide-out panel ===== -->\n  @if (selectedRow) {\n    <div class=\"slideout-backdrop\" (click)=\"closeDrawer()\"></div>\n  }\n\n  <aside class=\"slideout-panel\"\n         [class.open]=\"!!selectedRow\"\n         role=\"dialog\"\n         aria-modal=\"true\"\n         aria-labelledby=\"slideout-title\">\n    @if (selectedRow; as r) {\n      <div class=\"slideout-header\">\n        <div class=\"slideout-title\">\n          <i class=\"fa-solid fa-comment-dots\"></i>\n          <div class=\"slideout-title-text\">\n            <h2 id=\"slideout-title\" class=\"slideout-title-line\">\n              Feedback on {{ r.agentName || 'AI message' }}\n            </h2>\n            <div class=\"slideout-subtitle\">\n              <span class=\"rating-badge\" [ngClass]=\"bandClassFor(r.rating)\">\n                {{ r.rating }}<small>/10</small>\n              </span>\n              <span>\n                Rated by <strong>{{ r.raterName || r.raterEmail || 'Unknown user' }}</strong>\n                \u00B7 {{ r.createdAt | date:'medium' }}\n              </span>\n            </div>\n          </div>\n        </div>\n        <button class=\"slideout-close\" (click)=\"closeDrawer()\" title=\"Close (Esc)\" aria-label=\"Close\">\n          <i class=\"fa-solid fa-xmark\"></i>\n        </button>\n      </div>\n\n      <div class=\"slideout-content\">\n        <div class=\"slideout-section\">\n          <div class=\"section-label\">Reviewer Comment</div>\n          @if (r.comments) {\n            <div class=\"comment-body\">{{ r.comments }}</div>\n          } @else {\n            <div class=\"comment-body muted\">(no comment was provided)</div>\n          }\n        </div>\n\n        <div class=\"slideout-section\">\n          <div class=\"meta-grid\">\n            <div class=\"meta-card\">\n              <div class=\"meta-label\">Agent</div>\n              <div class=\"meta-value\">{{ r.agentName || '\u2014' }}</div>\n            </div>\n            <div class=\"meta-card\">\n              <div class=\"meta-label\">Conversation</div>\n              <div class=\"meta-value\">{{ r.conversationName || '\u2014' }}</div>\n            </div>\n            <div class=\"meta-card\">\n              <div class=\"meta-label\">Message Role</div>\n              <div class=\"meta-value\">{{ r.messageRole || '\u2014' }}</div>\n            </div>\n          </div>\n        </div>\n\n        <div class=\"slideout-section\">\n          <div class=\"message-card\">\n            <div class=\"message-card-header\">\n              <i class=\"fa-solid fa-message\"></i> Rated Message\n            </div>\n            <div class=\"message-card-body\">\n              @if (r.messageText) {\n                {{ r.messageText }}\n              } @else {\n                <span class=\"muted\">(message text unavailable)</span>\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div class=\"slideout-footer\">\n        <button mjButton variant=\"flat\" size=\"lg\" (click)=\"closeDrawer()\">Close</button>\n        <button mjButton variant=\"primary\" size=\"lg\"\n                (click)=\"openConversation()\"\n                [disabled]=\"!r.conversationID\"\n                [title]=\"r.conversationID ? 'Open the source conversation' : 'No conversation linked'\">\n          <i class=\"fa-solid fa-arrow-up-right-from-square\"></i>\n          Open Conversation\n        </button>\n      </div>\n    }\n  </aside>\n</div>\n", styles: [":host {\n  display: block;\n  height: 100%;\n}\n\n.feedback-container {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n  overflow: hidden;\n}\n\n/* -----------------------------------------------------------------------------\n   Sticky Header\n   ----------------------------------------------------------------------------- */\n.sticky-header {\n  flex-shrink: 0;\n  background: var(--mj-bg-surface);\n  border-bottom: 1px solid var(--mj-border-default);\n  box-shadow: var(--mj-shadow-sm);\n  z-index: 10;\n}\n\n/* -----------------------------------------------------------------------------\n   Page Header\n   ----------------------------------------------------------------------------- */\n.page-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 1rem 1.5rem;\n}\n\n.page-title-area { display: flex; align-items: center; gap: 0.75rem; }\n\n.page-icon {\n  width: 40px; height: 40px;\n  display: flex; align-items: center; justify-content: center;\n  background: var(--mj-brand-accent-subtle);\n  color: var(--mj-brand-primary);\n  border-radius: var(--mj-radius-md);\n  font-size: 1.125rem;\n}\n\n.page-title {\n  font-size: 1.25rem;\n  font-weight: 700;\n  margin: 0;\n  letter-spacing: -0.02em;\n  color: var(--mj-text-primary);\n}\n\n.page-subtitle {\n  font-size: 0.8125rem;\n  color: var(--mj-text-secondary);\n  margin: 0;\n}\n\n.page-actions { display: flex; align-items: center; gap: 0.5rem; }\n\n.btn-action {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.4rem;\n  padding: 0.4rem 0.875rem;\n  font-size: 0.8125rem;\n  font-weight: 500;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: background 180ms, border-color 180ms, color 180ms;\n}\n.btn-action:hover:not(:disabled) {\n  background: var(--mj-bg-surface-hover);\n  border-color: var(--mj-border-strong);\n  color: var(--mj-text-primary);\n}\n.btn-action:disabled { opacity: 0.5; cursor: default; }\n\n/* -----------------------------------------------------------------------------\n   Stats Grid\n   ----------------------------------------------------------------------------- */\n.stats-grid {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 0.75rem;\n  padding: 0 1.5rem 1rem;\n}\n\n@media (min-width: 768px) {\n  .stats-grid {\n    grid-template-columns: repeat(4, 1fr);\n    gap: 1rem;\n  }\n}\n\n.stat-card {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-sm);\n  padding: 1rem 1.25rem;\n  display: flex;\n  align-items: center;\n  gap: 1rem;\n}\n\n.stat-icon {\n  width: 44px;\n  height: 44px;\n  border-radius: var(--mj-radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.125rem;\n  flex-shrink: 0;\n}\n\n.stat-icon-total {\n  background: var(--mj-brand-accent-subtle);\n  color: var(--mj-brand-primary);\n}\n.stat-icon-avg {\n  background: color-mix(in srgb, var(--mj-brand-tertiary) 16%, transparent);\n  color: var(--mj-brand-tertiary);\n}\n.stat-icon-positive {\n  background: var(--rating-high-bg, #ecfdf5);\n  color: var(--rating-high, #10b981);\n}\n.stat-icon-negative {\n  background: var(--mj-status-error-bg);\n  color: var(--mj-status-error);\n}\n\n.stat-content { flex: 1; min-width: 0; }\n\n.stat-value {\n  font-size: 1.5rem;\n  font-weight: 700;\n  letter-spacing: -0.02em;\n  color: var(--mj-text-primary);\n  line-height: 1.1;\n}\n.stat-unit {\n  font-size: 0.8125rem;\n  color: var(--mj-text-secondary);\n  font-weight: 500;\n  margin-left: 2px;\n}\n.stat-label {\n  font-size: 0.6875rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  margin-top: 0.125rem;\n}\n\n.rating-high-text { color: var(--rating-high, #10b981); }\n.rating-low-text  { color: var(--mj-status-error); }\n\n/* -----------------------------------------------------------------------------\n   Filter Bar\n   ----------------------------------------------------------------------------- */\n.filter-bar {\n  display: flex;\n  flex-direction: column;\n  gap: 0.75rem;\n  padding: 0.75rem 1.5rem 1rem;\n  background: var(--mj-bg-surface);\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.filter-row {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 1rem;\n  align-items: flex-end;\n}\n\n.filter-group {\n  display: flex;\n  flex-direction: column;\n  gap: 0.3rem;\n}\n\n.filter-search {\n  flex: 0 1 auto;\n  width: 280px;\n  min-width: 200px;\n  max-width: 360px;\n}\n\n.filter-label {\n  font-size: 0.6875rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n}\n\n.btn-group { display: flex; gap: 0; }\n.btn-group .btn-filter:first-child { border-radius: var(--mj-radius-sm) 0 0 var(--mj-radius-sm); }\n.btn-group .btn-filter:last-child  { border-radius: 0 var(--mj-radius-sm) var(--mj-radius-sm) 0; }\n.btn-group .btn-filter:not(:first-child) { margin-left: -1px; }\n\n.btn-filter {\n  padding: 0.4rem 0.75rem;\n  font-size: 0.8125rem;\n  font-weight: 500;\n  border: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: background 180ms, color 180ms, border-color 180ms;\n  white-space: nowrap;\n}\n.btn-filter:hover { background: var(--mj-bg-surface-hover); color: var(--mj-text-primary); }\n.btn-filter.active {\n  background: var(--mj-brand-primary);\n  color: var(--mj-brand-on-primary);\n  border-color: var(--mj-brand-primary);\n  z-index: 1;\n  position: relative;\n}\n.btn-filter.band-high.active {\n  background: var(--rating-high, #10b981);\n  border-color: var(--rating-high, #10b981);\n  color: var(--mj-text-inverse);\n}\n.btn-filter.band-mid.active {\n  background: var(--rating-mid, #f59e0b);\n  border-color: var(--rating-mid, #f59e0b);\n  color: var(--mj-text-inverse);\n}\n.btn-filter.band-low.active {\n  background: var(--mj-status-error);\n  border-color: var(--mj-status-error);\n  color: var(--mj-text-inverse);\n}\n\n.input-search {\n  padding: 0.45rem 0.75rem;\n  font-size: 0.875rem;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n  width: 100%;\n}\n.input-search:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n\n.diagnostic-line {\n  font-size: 0.6875rem;\n  color: var(--mj-text-secondary);\n  letter-spacing: 0.02em;\n}\n\n/* -----------------------------------------------------------------------------\n   Error banner\n   ----------------------------------------------------------------------------- */\n.error-banner {\n  display: flex;\n  align-items: center;\n  gap: 0.625rem;\n  margin: 0 1.5rem 0.75rem;\n  padding: 0.75rem 1rem;\n  background: var(--mj-status-error-bg);\n  border: 1px solid color-mix(in srgb, var(--mj-status-error) 35%, transparent);\n  border-radius: var(--mj-radius-md);\n  color: var(--mj-status-error-text);\n  font-size: 0.8125rem;\n  font-weight: 500;\n}\n.error-banner button {\n  margin-left: auto;\n  background: none;\n  border: none;\n  cursor: pointer;\n  font-size: 1.125rem;\n  color: var(--mj-status-error);\n  padding: 0 0.25rem;\n}\n\n/* -----------------------------------------------------------------------------\n   Scrollable Content\n   ----------------------------------------------------------------------------- */\n.scrollable-content {\n  flex: 1;\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: 1.25rem 1.5rem 1.5rem;\n}\n\n.loading-overlay {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 0.625rem;\n  padding: 3rem;\n  color: var(--mj-text-secondary);\n  font-size: 0.8125rem;\n  font-weight: 500;\n}\n.spinner {\n  width: 20px; height: 20px;\n  border: 2px solid var(--mj-border-default);\n  border-top-color: var(--mj-brand-primary);\n  border-radius: 50%;\n  animation: spin 0.6s linear infinite;\n}\n@keyframes spin { to { transform: rotate(360deg); } }\n\n/* -----------------------------------------------------------------------------\n   Empty State\n   ----------------------------------------------------------------------------- */\n.empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 4rem 1.25rem;\n  color: var(--mj-text-secondary);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n}\n.empty-state i {\n  font-size: 2.25rem;\n  margin-bottom: 0.875rem;\n  opacity: 0.5;\n}\n.empty-state p {\n  font-size: 0.875rem;\n  font-weight: 500;\n  margin: 0;\n}\n\n/* -----------------------------------------------------------------------------\n   Feedback Table\n   ----------------------------------------------------------------------------- */\n.feedback-table-wrapper {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  box-shadow: var(--mj-shadow-sm);\n  overflow: auto;\n}\n\n.feedback-table {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: 0.8125rem;\n  table-layout: fixed;\n}\n\n.feedback-table thead {\n  background: var(--mj-bg-surface-sunken);\n  border-bottom: 1px solid var(--mj-border-default);\n}\n.feedback-table th {\n  text-align: left;\n  font-size: 0.6875rem;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  padding: 0.75rem 0.875rem;\n}\n.feedback-table td {\n  padding: 0.875rem;\n  border-bottom: 1px solid var(--mj-border-default);\n  color: var(--mj-text-primary);\n  vertical-align: top;\n}\n\n.feedback-row {\n  cursor: pointer;\n  transition: background 180ms;\n}\n.feedback-row:hover { background: var(--mj-bg-surface-hover); }\n.feedback-row.expanded { background: var(--mj-brand-accent-subtle); }\n\n.col-rating  { width: 90px; }\n.col-comment { width: 28%; }\n.col-agent   { width: 14%; }\n.col-message { width: 26%; }\n.col-rater   { width: 16%; }\n.col-when    { width: 12%; }\n\n.rating-badge {\n  display: inline-flex;\n  align-items: baseline;\n  gap: 2px;\n  padding: 0.35rem 0.625rem;\n  border-radius: var(--mj-radius-md);\n  font-size: 0.875rem;\n  font-weight: 700;\n  letter-spacing: -0.02em;\n}\n.rating-badge small {\n  font-size: 0.625rem;\n  font-weight: 500;\n  opacity: 0.7;\n}\n.rating-badge.rating-high { background: var(--rating-high-bg, #ecfdf5); color: var(--rating-high, #10b981); }\n.rating-badge.rating-mid  { background: var(--rating-mid-bg,  #fffbeb); color: var(--rating-mid,  #f59e0b); }\n.rating-badge.rating-low  { background: var(--mj-status-error-bg);     color: var(--mj-status-error); }\n\n.comment-text {\n  white-space: pre-wrap;\n  word-break: break-word;\n  line-height: 1.5;\n}\n.comment-text.clamped {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  line-clamp: 2;\n  overflow: hidden;\n}\n.message-snippet {\n  color: var(--mj-text-secondary);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  line-clamp: 2;\n  overflow: hidden;\n}\n/* Bottom row: mj-pagination (or the single-page summary) takes flex:1; the\n   page-size selector hugs the right edge next to the nav controls. */\n.pagination-bar {\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  margin-top: 0.5rem;\n  font-size: 0.8125rem;\n  color: var(--mj-text-secondary);\n}\n.pagination-summary {\n  flex: 1;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n  padding: 0.5rem 0;\n}\n.feedback-pagination {\n  display: block;\n  flex: 1;\n  min-width: 0;\n}\n\n.page-size-control {\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n  flex-shrink: 0;\n}\n.page-size-label {\n  font-size: 0.6875rem;\n  font-weight: 600;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n}\n.page-size-select {\n  padding: 0.3rem 0.5rem;\n  font-size: 0.8125rem;\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-sm);\n  background: var(--mj-bg-surface);\n  color: var(--mj-text-primary);\n  cursor: pointer;\n}\n.page-size-select:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 18%, transparent);\n}\n\n.agent-name { font-weight: 500; color: var(--mj-text-primary); }\n.rater-name { font-weight: 500; color: var(--mj-text-primary); }\n.rater-email { font-size: 0.6875rem; color: var(--mj-text-secondary); margin-top: 2px; }\n.when { color: var(--mj-text-secondary); font-size: 0.75rem; white-space: nowrap; }\n.muted { color: var(--mj-text-secondary); font-style: italic; }\n\n/* -----------------------------------------------------------------------------\n   Slide-out Panel \u2014 matches the MJ slideout pattern used elsewhere in Explorer\n   (see api-key-edit-panel.component.css). Scoped to the feedback-container\n   via `position: absolute` so the MJ Explorer chrome (tab bar, app nav) sits\n   above it correctly \u2014 `position: fixed` would otherwise be re-anchored by\n   any ancestor with a `transform` set.\n   ----------------------------------------------------------------------------- */\n.slideout-backdrop {\n  position: absolute;\n  inset: 0;\n  background: var(--mj-bg-overlay, rgba(28, 28, 34, 0.45));\n  z-index: 100;\n  animation: feedback-fadeIn 0.2s ease;\n}\n@keyframes feedback-fadeIn { from { opacity: 0; } to { opacity: 1; } }\n\n.slideout-panel {\n  position: absolute;\n  top: 0;\n  right: 0;\n  height: 100%;\n  width: 560px;\n  max-width: 100%;\n  background: var(--mj-bg-surface);\n  box-shadow: -8px 0 32px var(--mj-bg-overlay, rgba(0, 0, 0, 0.25));\n  z-index: 101;\n  display: flex;\n  flex-direction: column;\n  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  transform: translateX(100%);\n  overflow: hidden;\n}\n.slideout-panel.open { transform: translateX(0); }\n\n/* Header */\n.slideout-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 1rem;\n  padding: 20px 24px;\n  background: var(--mj-brand-accent-subtle);\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.slideout-title {\n  display: flex;\n  align-items: flex-start;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n}\n.slideout-title > i {\n  color: var(--mj-brand-primary);\n  font-size: 22px;\n  flex-shrink: 0;\n  line-height: 1.2;\n}\n.slideout-title-text { min-width: 0; }\n.slideout-title-line {\n  font-weight: 700;\n  font-size: 17px;\n  color: var(--mj-text-primary);\n  margin: 0 0 6px;\n  line-height: 1.3;\n  word-break: break-word;\n}\n.slideout-subtitle {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  font-size: 12px;\n  color: var(--mj-text-secondary);\n  flex-wrap: wrap;\n}\n.slideout-subtitle strong { color: var(--mj-text-primary); font-weight: 600; }\n\n.slideout-close {\n  width: 36px;\n  height: 36px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--mj-bg-surface-hover);\n  border: none;\n  border-radius: 8px;\n  color: var(--mj-text-secondary);\n  cursor: pointer;\n  transition: all 0.2s ease;\n  flex-shrink: 0;\n}\n.slideout-close:hover {\n  background: var(--mj-bg-surface-active);\n  color: var(--mj-text-primary);\n}\n\n/* Content */\n.slideout-content {\n  flex: 1;\n  overflow-y: auto;\n  padding: 0;\n  background: var(--mj-bg-surface);\n}\n.slideout-section {\n  padding: 20px 24px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n.slideout-section:last-child { border-bottom: none; }\n\n.section-label {\n  font-size: 11px;\n  font-weight: 700;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  margin-bottom: 0.5rem;\n}\n.comment-body {\n  font-size: 14px;\n  line-height: 1.55;\n  color: var(--mj-text-primary);\n  white-space: pre-wrap;\n  word-break: break-word;\n}\n.comment-body.muted { font-style: italic; color: var(--mj-text-secondary); }\n\n.meta-grid {\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 0.75rem;\n}\n.meta-card {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-md);\n  padding: 0.75rem 0.875rem;\n}\n.meta-label {\n  font-size: 0.625rem;\n  text-transform: uppercase;\n  letter-spacing: 0.05em;\n  color: var(--mj-text-secondary);\n  font-weight: 600;\n  margin-bottom: 0.25rem;\n}\n.meta-value {\n  font-size: 0.8125rem;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  word-break: break-word;\n}\n\n.message-card {\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  overflow: hidden;\n}\n.message-card-header {\n  padding: 0.75rem 1.125rem;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-sunken);\n  font-size: 0.8125rem;\n  font-weight: 700;\n  color: var(--mj-text-primary);\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n}\n.message-card-body {\n  padding: 1rem 1.125rem;\n  font-size: 0.875rem;\n  line-height: 1.55;\n  color: var(--mj-text-primary);\n  white-space: pre-wrap;\n  word-break: break-word;\n  max-height: 320px;\n  overflow-y: auto;\n}\n\n/* Footer */\n.slideout-footer {\n  display: flex;\n  gap: 12px;\n  justify-content: flex-end;\n  padding: 16px 24px;\n  background: var(--mj-bg-page);\n  border-top: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n.slideout-footer button { min-width: 96px; }\n.slideout-footer button i { margin-right: 6px; }\n"] }]
+    }], null, { onEscape: [{
+            type: HostListener,
+            args: ['document:keydown.escape']
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ConversationFeedbackResource, { className: "ConversationFeedbackResource", filePath: "src/lib/conversation-feedback/conversation-feedback.ts", lineNumber: 34 }); })();
+//# sourceMappingURL=conversation-feedback.js.map