@mj-biz-apps/forms-ng 0.0.0 → 0.2.0

package/dist/lib/dashboard/components/question-breakdown.component.js

@@ -0,0 +1,213 @@
+import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
+import { FormsDistributionChartComponent } from './distribution-chart.component';
+import * as i0 from "@angular/core";
+function FormsQuestionBreakdownComponent_Case_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-forms-distribution-chart", 4);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("buckets", ctx_r0.breakdown.buckets);
+} }
+function FormsQuestionBreakdownComponent_Case_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-forms-distribution-chart", 4);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("buckets", ctx_r0.breakdown.buckets);
+} }
+function FormsQuestionBreakdownComponent_Case_8_Conditional_0_Conditional_1_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 10);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const seg_r2 = ctx;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate3(" ", seg_r2.promoters, " promoters \u00B7 ", seg_r2.passives, " passives \u00B7 ", seg_r2.detractors, " detractors ");
+} }
+function FormsQuestionBreakdownComponent_Case_8_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 6)(1, "span", 8);
+    i0.ɵɵtext(2);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "span", 9);
+    i0.ɵɵtext(4, "NPS");
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(5, FormsQuestionBreakdownComponent_Case_8_Conditional_0_Conditional_1_Conditional_5_Template, 2, 3, "span", 10);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_5_0;
+    const n_r3 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(n_r3.npsScore);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional((tmp_5_0 = n_r3.npsSegments) ? 5 : -1, tmp_5_0);
+} }
+function FormsQuestionBreakdownComponent_Case_8_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 5);
+    i0.ɵɵconditionalCreate(1, FormsQuestionBreakdownComponent_Case_8_Conditional_0_Conditional_1_Template, 6, 2, "div", 6);
+    i0.ɵɵelementStart(2, "dl", 7)(3, "div")(4, "dt");
+    i0.ɵɵtext(5, "Average");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "dd");
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(8, "div")(9, "dt");
+    i0.ɵɵtext(10, "Min");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(11, "dd");
+    i0.ɵɵtext(12);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(13, "div")(14, "dt");
+    i0.ɵɵtext(15, "Max");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "dd");
+    i0.ɵɵtext(17);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(18, "div")(19, "dt");
+    i0.ɵɵtext(20, "Answered");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(21, "dd");
+    i0.ɵɵtext(22);
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    const n_r3 = ctx;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(n_r3.npsScore !== null ? 1 : -1);
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(ctx_r0.fmt(n_r3.average));
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r0.fmt(n_r3.min));
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r0.fmt(n_r3.max));
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(n_r3.answered);
+} }
+function FormsQuestionBreakdownComponent_Case_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, FormsQuestionBreakdownComponent_Case_8_Conditional_0_Template, 23, 5, "div", 5);
+} if (rf & 2) {
+    let tmp_1_0;
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵconditional((tmp_1_0 = ctx_r0.breakdown.numeric) ? 0 : -1, tmp_1_0);
+} }
+function FormsQuestionBreakdownComponent_Case_9_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 11);
+    i0.ɵɵtext(1, "No answers yet.");
+    i0.ɵɵelementEnd();
+} }
+function FormsQuestionBreakdownComponent_Case_9_Conditional_1_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "li");
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const t_r4 = ctx.$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(t_r4);
+} }
+function FormsQuestionBreakdownComponent_Case_9_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "ul", 12);
+    i0.ɵɵrepeaterCreate(1, FormsQuestionBreakdownComponent_Case_9_Conditional_1_For_2_Template, 2, 1, "li", null, i0.ɵɵrepeaterTrackByIndex);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r0.breakdown.textAnswers);
+} }
+function FormsQuestionBreakdownComponent_Case_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, FormsQuestionBreakdownComponent_Case_9_Conditional_0_Template, 2, 0, "p", 11)(1, FormsQuestionBreakdownComponent_Case_9_Conditional_1_Template, 3, 0, "ul", 12);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(ctx_r0.breakdown.textAnswers.length === 0 ? 0 : 1);
+} }
+/**
+ * Renders one question's breakdown card, switching by kind:
+ * - distribution/boolean → bar chart
+ * - numeric → aggregates (with NPS score + segments when applicable)
+ * - freeText → verbatim list
+ */
+export class FormsQuestionBreakdownComponent {
+    breakdown;
+    get typeLabel() {
+        return this.breakdown.type;
+    }
+    fmt(value) {
+        if (value === null)
+            return '—';
+        return Number.isInteger(value) ? String(value) : value.toFixed(2);
+    }
+    static ɵfac = function FormsQuestionBreakdownComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FormsQuestionBreakdownComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FormsQuestionBreakdownComponent, selectors: [["mj-forms-question-breakdown"]], inputs: { breakdown: "breakdown" }, decls: 10, vars: 4, consts: [[1, "card"], [1, "card-head"], [1, "prompt"], [1, "meta"], [3, "buckets"], [1, "numeric"], [1, "nps"], [1, "agg"], [1, "nps-score"], [1, "nps-label"], [1, "nps-seg"], [1, "empty"], [1, "text-list"]], template: function FormsQuestionBreakdownComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "article", 0)(1, "header", 1)(2, "h3", 2);
+            i0.ɵɵtext(3);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(4, "span", 3);
+            i0.ɵɵtext(5);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵconditionalCreate(6, FormsQuestionBreakdownComponent_Case_6_Template, 1, 1, "mj-forms-distribution-chart", 4)(7, FormsQuestionBreakdownComponent_Case_7_Template, 1, 1, "mj-forms-distribution-chart", 4)(8, FormsQuestionBreakdownComponent_Case_8_Template, 1, 1)(9, FormsQuestionBreakdownComponent_Case_9_Template, 2, 1);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            let tmp_2_0;
+            i0.ɵɵadvance(3);
+            i0.ɵɵtextInterpolate(ctx.breakdown.prompt);
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate2("", ctx.typeLabel, " \u00B7 ", ctx.breakdown.answeredCount, " answered");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional((tmp_2_0 = ctx.breakdown.kind) === "distribution" ? 6 : tmp_2_0 === "boolean" ? 7 : tmp_2_0 === "numeric" ? 8 : tmp_2_0 === "freeText" ? 9 : -1);
+        } }, dependencies: [FormsDistributionChartComponent], styles: [".card[_ngcontent-%COMP%] {\n        padding: var(--mj-space-4);\n        background: var(--mj-bg-surface-card);\n        border: 1px solid var(--mj-border-subtle);\n        border-radius: var(--mj-radius-lg);\n        box-shadow: var(--mj-shadow-sm);\n      }\n      .card-head[_ngcontent-%COMP%] {\n        margin-bottom: var(--mj-space-3);\n      }\n      .prompt[_ngcontent-%COMP%] {\n        margin: 0 0 var(--mj-space-1);\n        font-size: 15px;\n        font-weight: 600;\n        color: var(--mj-text-primary);\n      }\n      .meta[_ngcontent-%COMP%] {\n        font-size: 12px;\n        color: var(--mj-text-muted);\n      }\n      .empty[_ngcontent-%COMP%] {\n        color: var(--mj-text-muted);\n        font-style: italic;\n        margin: 0;\n      }\n      .nps[_ngcontent-%COMP%] {\n        display: flex;\n        align-items: baseline;\n        gap: var(--mj-space-2);\n        flex-wrap: wrap;\n        margin-bottom: var(--mj-space-3);\n      }\n      .nps-score[_ngcontent-%COMP%] {\n        font-size: 28px;\n        font-weight: 700;\n        color: var(--mj-brand-primary);\n        font-variant-numeric: tabular-nums;\n      }\n      .nps-label[_ngcontent-%COMP%] {\n        font-size: 12px;\n        text-transform: uppercase;\n        letter-spacing: 0.04em;\n        color: var(--mj-text-secondary);\n      }\n      .nps-seg[_ngcontent-%COMP%] {\n        font-size: 12px;\n        color: var(--mj-text-muted);\n      }\n      .agg[_ngcontent-%COMP%] {\n        display: grid;\n        grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));\n        gap: var(--mj-space-2);\n        margin: 0;\n      }\n      .agg[_ngcontent-%COMP%]   div[_ngcontent-%COMP%] {\n        background: var(--mj-bg-surface-sunken);\n        border-radius: var(--mj-radius-sm);\n        padding: var(--mj-space-2);\n      }\n      .agg[_ngcontent-%COMP%]   dt[_ngcontent-%COMP%] {\n        font-size: 11px;\n        color: var(--mj-text-muted);\n        text-transform: uppercase;\n      }\n      .agg[_ngcontent-%COMP%]   dd[_ngcontent-%COMP%] {\n        margin: 0;\n        font-size: 16px;\n        font-weight: 600;\n        color: var(--mj-text-primary);\n        font-variant-numeric: tabular-nums;\n      }\n      .text-list[_ngcontent-%COMP%] {\n        list-style: none;\n        margin: 0;\n        padding: 0;\n        max-height: 240px;\n        overflow-y: auto;\n        display: flex;\n        flex-direction: column;\n        gap: var(--mj-space-1-5);\n      }\n      .text-list[_ngcontent-%COMP%]   li[_ngcontent-%COMP%] {\n        font-size: 13px;\n        color: var(--mj-text-primary);\n        padding: var(--mj-space-2);\n        background: var(--mj-bg-surface-sunken);\n        border-radius: var(--mj-radius-sm);\n      }"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormsQuestionBreakdownComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-forms-question-breakdown', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsDistributionChartComponent], template: `
+    <article class="card">
+      <header class="card-head">
+        <h3 class="prompt">{{ breakdown.prompt }}</h3>
+        <span class="meta">{{ typeLabel }} · {{ breakdown.answeredCount }} answered</span>
+      </header>
+
+      @switch (breakdown.kind) {
+        @case ('distribution') {
+          <mj-forms-distribution-chart [buckets]="breakdown.buckets"></mj-forms-distribution-chart>
+        }
+        @case ('boolean') {
+          <mj-forms-distribution-chart [buckets]="breakdown.buckets"></mj-forms-distribution-chart>
+        }
+        @case ('numeric') {
+          @if (breakdown.numeric; as n) {
+            <div class="numeric">
+              @if (n.npsScore !== null) {
+                <div class="nps">
+                  <span class="nps-score">{{ n.npsScore }}</span>
+                  <span class="nps-label">NPS</span>
+                  @if (n.npsSegments; as seg) {
+                    <span class="nps-seg">
+                      {{ seg.promoters }} promoters · {{ seg.passives }} passives · {{ seg.detractors }} detractors
+                    </span>
+                  }
+                </div>
+              }
+              <dl class="agg">
+                <div><dt>Average</dt><dd>{{ fmt(n.average) }}</dd></div>
+                <div><dt>Min</dt><dd>{{ fmt(n.min) }}</dd></div>
+                <div><dt>Max</dt><dd>{{ fmt(n.max) }}</dd></div>
+                <div><dt>Answered</dt><dd>{{ n.answered }}</dd></div>
+              </dl>
+            </div>
+          }
+        }
+        @case ('freeText') {
+          @if (breakdown.textAnswers.length === 0) {
+            <p class="empty">No answers yet.</p>
+          } @else {
+            <ul class="text-list">
+              @for (t of breakdown.textAnswers; track $index) {
+                <li>{{ t }}</li>
+              }
+            </ul>
+          }
+        }
+      }
+    </article>
+  `, styles: ["\n      .card {\n        padding: var(--mj-space-4);\n        background: var(--mj-bg-surface-card);\n        border: 1px solid var(--mj-border-subtle);\n        border-radius: var(--mj-radius-lg);\n        box-shadow: var(--mj-shadow-sm);\n      }\n      .card-head {\n        margin-bottom: var(--mj-space-3);\n      }\n      .prompt {\n        margin: 0 0 var(--mj-space-1);\n        font-size: 15px;\n        font-weight: 600;\n        color: var(--mj-text-primary);\n      }\n      .meta {\n        font-size: 12px;\n        color: var(--mj-text-muted);\n      }\n      .empty {\n        color: var(--mj-text-muted);\n        font-style: italic;\n        margin: 0;\n      }\n      .nps {\n        display: flex;\n        align-items: baseline;\n        gap: var(--mj-space-2);\n        flex-wrap: wrap;\n        margin-bottom: var(--mj-space-3);\n      }\n      .nps-score {\n        font-size: 28px;\n        font-weight: 700;\n        color: var(--mj-brand-primary);\n        font-variant-numeric: tabular-nums;\n      }\n      .nps-label {\n        font-size: 12px;\n        text-transform: uppercase;\n        letter-spacing: 0.04em;\n        color: var(--mj-text-secondary);\n      }\n      .nps-seg {\n        font-size: 12px;\n        color: var(--mj-text-muted);\n      }\n      .agg {\n        display: grid;\n        grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));\n        gap: var(--mj-space-2);\n        margin: 0;\n      }\n      .agg div {\n        background: var(--mj-bg-surface-sunken);\n        border-radius: var(--mj-radius-sm);\n        padding: var(--mj-space-2);\n      }\n      .agg dt {\n        font-size: 11px;\n        color: var(--mj-text-muted);\n        text-transform: uppercase;\n      }\n      .agg dd {\n        margin: 0;\n        font-size: 16px;\n        font-weight: 600;\n        color: var(--mj-text-primary);\n        font-variant-numeric: tabular-nums;\n      }\n      .text-list {\n        list-style: none;\n        margin: 0;\n        padding: 0;\n        max-height: 240px;\n        overflow-y: auto;\n        display: flex;\n        flex-direction: column;\n        gap: var(--mj-space-1-5);\n      }\n      .text-list li {\n        font-size: 13px;\n        color: var(--mj-text-primary);\n        padding: var(--mj-space-2);\n        background: var(--mj-bg-surface-sunken);\n        border-radius: var(--mj-radius-sm);\n      }\n    "] }]
+    }], null, { breakdown: [{
+            type: Input,
+            args: [{ required: true }]
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FormsQuestionBreakdownComponent, { className: "FormsQuestionBreakdownComponent", filePath: "lib/dashboard/components/question-breakdown.component.ts", lineNumber: 160 }); })();
+//# sourceMappingURL=question-breakdown.component.js.map

package/dist/lib/dashboard/components/question-breakdown.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"question-breakdown.component.js","sourceRoot":"","sources":["../../../../src/lib/dashboard/components/question-breakdown.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/dashboard/components/response-detail.component.d.ts

@@ -0,0 +1,11 @@
+import { EventEmitter } from '@angular/core';
+import type { ResponseDetail } from '../models/reporting.model';
+import * as i0 from "@angular/core";
+/** Single-response detail: each answer labelled by its question from the snapshot. */
+export declare class FormsResponseDetailComponent {
+    detail: ResponseDetail;
+    back: EventEmitter<void>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormsResponseDetailComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormsResponseDetailComponent, "mj-forms-response-detail", never, { "detail": { "alias": "detail"; "required": true; }; }, { "back": "back"; }, never, never, true, never>;
+}
+//# sourceMappingURL=response-detail.component.d.ts.map

package/dist/lib/dashboard/components/response-detail.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"response-detail.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/dashboard/components/response-detail.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsC,YAAY,EAAiB,MAAM,eAAe,CAAC;AAChG,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;;AAEhE,sFAAsF;AACtF,qBAqGa,4BAA4B;IACZ,MAAM,EAAG,cAAc,CAAC;IACzC,IAAI,qBAA4B;yCAF/B,4BAA4B;2CAA5B,4BAA4B;CAGxC"}

package/dist/lib/dashboard/components/response-detail.component.js

@@ -0,0 +1,113 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
+import * as i0 from "@angular/core";
+const _forTrack0 = ($index, $item) => $item.questionId;
+function FormsResponseDetailComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "span", 7);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1("Submitted ", ctx_r0.detail.submittedAt.toLocaleString());
+} }
+function FormsResponseDetailComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "p", 8);
+    i0.ɵɵtext(1, "This response has no answers.");
+    i0.ɵɵdomElementEnd();
+} }
+function FormsResponseDetailComponent_Conditional_12_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 10)(1, "dt");
+    i0.ɵɵtext(2);
+    i0.ɵɵdomElementEnd();
+    i0.ɵɵdomElementStart(3, "dd");
+    i0.ɵɵtext(4);
+    i0.ɵɵdomElementEnd()();
+} if (rf & 2) {
+    const a_r2 = ctx.$implicit;
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(a_r2.prompt);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(a_r2.displayValue || "\u2014");
+} }
+function FormsResponseDetailComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "dl", 9);
+    i0.ɵɵrepeaterCreate(1, FormsResponseDetailComponent_Conditional_12_For_2_Template, 5, 2, "div", 10, _forTrack0);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r0.detail.answers);
+} }
+/** Single-response detail: each answer labelled by its question from the snapshot. */
+export class FormsResponseDetailComponent {
+    detail;
+    back = new EventEmitter();
+    static ɵfac = function FormsResponseDetailComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FormsResponseDetailComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FormsResponseDetailComponent, selectors: [["mj-forms-response-detail"]], inputs: { detail: "detail" }, outputs: { back: "back" }, decls: 13, vars: 6, consts: [[1, "detail"], [1, "detail-head"], ["type", "button", 1, "back", 3, "click"], [1, "fa-solid", "fa-arrow-left"], [1, "meta"], [1, "status"], [1, "respondent"], [1, "ts"], [1, "empty"], [1, "answers"], [1, "answer"]], template: function FormsResponseDetailComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵdomElementStart(0, "div", 0)(1, "header", 1)(2, "button", 2);
+            i0.ɵɵdomListener("click", function FormsResponseDetailComponent_Template_button_click_2_listener() { return ctx.back.emit(); });
+            i0.ɵɵdomElement(3, "i", 3);
+            i0.ɵɵtext(4, " Back to responses ");
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(5, "div", 4)(6, "span", 5);
+            i0.ɵɵtext(7);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵdomElementStart(8, "span", 6);
+            i0.ɵɵtext(9);
+            i0.ɵɵdomElementEnd();
+            i0.ɵɵconditionalCreate(10, FormsResponseDetailComponent_Conditional_10_Template, 2, 1, "span", 7);
+            i0.ɵɵdomElementEnd()();
+            i0.ɵɵconditionalCreate(11, FormsResponseDetailComponent_Conditional_11_Template, 2, 0, "p", 8)(12, FormsResponseDetailComponent_Conditional_12_Template, 3, 0, "dl", 9);
+            i0.ɵɵdomElementEnd();
+        } if (rf & 2) {
+            i0.ɵɵadvance(6);
+            i0.ɵɵclassProp("status--complete", ctx.detail.status === "Complete");
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate(ctx.detail.status);
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate(ctx.detail.respondent);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.detail.submittedAt ? 10 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.detail.answers.length === 0 ? 11 : 12);
+        } }, styles: [".detail-head[_ngcontent-%COMP%] {\n        display: flex;\n        flex-direction: column;\n        gap: var(--mj-space-2);\n        margin-bottom: var(--mj-space-4);\n      }\n      .back[_ngcontent-%COMP%] {\n        align-self: flex-start;\n        background: none;\n        border: none;\n        color: var(--mj-brand-primary);\n        cursor: pointer;\n        font-size: 13px;\n        padding: 0;\n      }\n      .meta[_ngcontent-%COMP%] {\n        display: flex;\n        gap: var(--mj-space-2);\n        align-items: center;\n        flex-wrap: wrap;\n      }\n      .respondent[_ngcontent-%COMP%] {\n        font-weight: 600;\n        color: var(--mj-text-primary);\n      }\n      .ts[_ngcontent-%COMP%] {\n        font-size: 12px;\n        color: var(--mj-text-muted);\n      }\n      .status[_ngcontent-%COMP%] {\n        display: inline-block;\n        padding: 2px var(--mj-space-2);\n        border-radius: var(--mj-radius-full);\n        font-size: 11px;\n        background: var(--mj-bg-surface-sunken);\n        color: var(--mj-text-secondary);\n      }\n      .status--complete[_ngcontent-%COMP%] {\n        background: var(--mj-status-success);\n        color: var(--mj-text-inverse);\n      }\n      .empty[_ngcontent-%COMP%] {\n        color: var(--mj-text-muted);\n        font-style: italic;\n      }\n      .answers[_ngcontent-%COMP%] {\n        margin: 0;\n        display: flex;\n        flex-direction: column;\n        gap: var(--mj-space-3);\n      }\n      .answer[_ngcontent-%COMP%]   dt[_ngcontent-%COMP%] {\n        font-size: 13px;\n        font-weight: 600;\n        color: var(--mj-text-secondary);\n        margin-bottom: var(--mj-space-1);\n      }\n      .answer[_ngcontent-%COMP%]   dd[_ngcontent-%COMP%] {\n        margin: 0;\n        font-size: 14px;\n        color: var(--mj-text-primary);\n        white-space: pre-wrap;\n      }"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormsResponseDetailComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-forms-response-detail', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
+    <div class="detail">
+      <header class="detail-head">
+        <button type="button" class="back" (click)="back.emit()">
+          <i class="fa-solid fa-arrow-left"></i> Back to responses
+        </button>
+        <div class="meta">
+          <span class="status" [class.status--complete]="detail.status === 'Complete'">{{ detail.status }}</span>
+          <span class="respondent">{{ detail.respondent }}</span>
+          @if (detail.submittedAt) {
+            <span class="ts">Submitted {{ detail.submittedAt.toLocaleString() }}</span>
+          }
+        </div>
+      </header>
+
+      @if (detail.answers.length === 0) {
+        <p class="empty">This response has no answers.</p>
+      } @else {
+        <dl class="answers">
+          @for (a of detail.answers; track a.questionId) {
+            <div class="answer">
+              <dt>{{ a.prompt }}</dt>
+              <dd>{{ a.displayValue || '—' }}</dd>
+            </div>
+          }
+        </dl>
+      }
+    </div>
+  `, styles: ["\n      .detail-head {\n        display: flex;\n        flex-direction: column;\n        gap: var(--mj-space-2);\n        margin-bottom: var(--mj-space-4);\n      }\n      .back {\n        align-self: flex-start;\n        background: none;\n        border: none;\n        color: var(--mj-brand-primary);\n        cursor: pointer;\n        font-size: 13px;\n        padding: 0;\n      }\n      .meta {\n        display: flex;\n        gap: var(--mj-space-2);\n        align-items: center;\n        flex-wrap: wrap;\n      }\n      .respondent {\n        font-weight: 600;\n        color: var(--mj-text-primary);\n      }\n      .ts {\n        font-size: 12px;\n        color: var(--mj-text-muted);\n      }\n      .status {\n        display: inline-block;\n        padding: 2px var(--mj-space-2);\n        border-radius: var(--mj-radius-full);\n        font-size: 11px;\n        background: var(--mj-bg-surface-sunken);\n        color: var(--mj-text-secondary);\n      }\n      .status--complete {\n        background: var(--mj-status-success);\n        color: var(--mj-text-inverse);\n      }\n      .empty {\n        color: var(--mj-text-muted);\n        font-style: italic;\n      }\n      .answers {\n        margin: 0;\n        display: flex;\n        flex-direction: column;\n        gap: var(--mj-space-3);\n      }\n      .answer dt {\n        font-size: 13px;\n        font-weight: 600;\n        color: var(--mj-text-secondary);\n        margin-bottom: var(--mj-space-1);\n      }\n      .answer dd {\n        margin: 0;\n        font-size: 14px;\n        color: var(--mj-text-primary);\n        white-space: pre-wrap;\n      }\n    "] }]
+    }], null, { detail: [{
+            type: Input,
+            args: [{ required: true }]
+        }], back: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FormsResponseDetailComponent, { className: "FormsResponseDetailComponent", filePath: "lib/dashboard/components/response-detail.component.ts", lineNumber: 106 }); })();
+//# sourceMappingURL=response-detail.component.js.map

package/dist/lib/dashboard/components/response-detail.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"response-detail.component.js","sourceRoot":"","sources":["../../../../src/lib/dashboard/components/response-detail.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;;;;IAkBpF,kCAAiB;IAAA,YAAmD;IAAA,oBAAO;;;IAA1D,cAAmD;IAAnD,+EAAmD;;;IAMxE,+BAAiB;IAAA,6CAA6B;IAAA,oBAAI;;;IAK5C,AADF,kCAAoB,SACd;IAAA,YAAc;IAAA,oBAAK;IACvB,6BAAI;IAAA,YAA2B;IACjC,AADiC,oBAAK,EAChC;;;IAFA,eAAc;IAAd,iCAAc;IACd,eAA2B;IAA3B,mDAA2B;;;IAJrC,gCAAoB;IAClB,+GAKC;IACH,oBAAK;;;IANH,cAKC;IALD,oCAKC;;AA7BX,sFAAsF;AAsGtF,MAAM,OAAO,4BAA4B;IACZ,MAAM,CAAkB;IACzC,IAAI,GAAG,IAAI,YAAY,EAAQ,CAAC;sHAF/B,4BAA4B;6DAA5B,4BAA4B;YA9FjC,AADF,AADF,iCAAoB,gBACU,gBAC+B;YAAtB,4GAAS,eAAW,IAAC;YACtD,0BAAsC;YAAC,mCACzC;YAAA,oBAAS;YAEP,AADF,iCAAkB,cAC6D;YAAA,YAAmB;YAAA,oBAAO;YACvG,kCAAyB;YAAA,YAAuB;YAAA,oBAAO;YACvD,iGAA0B;YAI9B,AADE,oBAAM,EACC;YAIP,AAFF,8FAAmC,yEAE1B;YAUX,oBAAM;;YApBqB,eAAuD;YAAvD,oEAAuD;YAAC,cAAmB;YAAnB,uCAAmB;YACvE,eAAuB;YAAvB,2CAAuB;YAChD,cAEC;YAFD,kDAEC;YAIL,cAWC;YAXD,2DAWC;;;iFAuEM,4BAA4B;cArGxC,SAAS;2BACE,0BAA0B,cACxB,IAAI,mBACC,uBAAuB,CAAC,MAAM,YACrC;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BT;;kBAsEA,KAAK;mBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;;kBACxB,MAAM;;kFAFI,4BAA4B"}

package/dist/lib/dashboard/components/response-list.component.d.ts

@@ -0,0 +1,27 @@
+import { EventEmitter } from '@angular/core';
+import type { ResponseListRow } from '../models/reporting.model';
+import * as i0 from "@angular/core";
+/** Status filter values for the response list. */
+type StatusFilter = 'all' | 'Complete' | 'Partial';
+/**
+ * Individual-response list with text search + status filter (simple cross-tab).
+ * A semantic, token-styled table — clicking a row emits the response id so the
+ * dashboard can open the detail view. Horizontal scroll is contained.
+ */
+export declare class FormsResponseListComponent {
+    open: EventEmitter<string>;
+    readonly search: import("@angular/core").WritableSignal<string>;
+    readonly statusFilter: import("@angular/core").WritableSignal<StatusFilter>;
+    readonly statusFilters: {
+        value: StatusFilter;
+        label: string;
+    }[];
+    private readonly _rows;
+    set rows(value: ResponseListRow[]);
+    readonly filtered: import("@angular/core").Signal<ResponseListRow[]>;
+    submittedLabel(r: ResponseListRow): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormsResponseListComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormsResponseListComponent, "mj-forms-response-list", never, { "rows": { "alias": "rows"; "required": true; }; }, { "open": "open"; }, never, never, true, never>;
+}
+export {};
+//# sourceMappingURL=response-list.component.d.ts.map

package/dist/lib/dashboard/components/response-list.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"response-list.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/dashboard/components/response-list.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsC,YAAY,EAAmC,MAAM,eAAe,CAAC;AAElH,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;;AAEjE,kDAAkD;AAClD,KAAK,YAAY,GAAG,KAAK,GAAG,UAAU,GAAG,SAAS,CAAC;AAEnD;;;;GAIG;AACH,qBA2Ja,0BAA0B;IAC3B,IAAI,uBAA8B;IAE5C,SAAgB,MAAM,iDAAc;IACpC,SAAgB,YAAY,uDAA+B;IAE3D,SAAgB,aAAa,EAAE;QAAE,KAAK,EAAE,YAAY,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAIrE;IAEF,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAiC;IACvD,IACI,IAAI,CAAC,KAAK,EAAE,eAAe,EAAE,EAEhC;IAED,SAAgB,QAAQ,oDAQrB;IAEI,cAAc,CAAC,CAAC,EAAE,eAAe,GAAG,MAAM;yCA5BtC,0BAA0B;2CAA1B,0BAA0B;CA+BtC"}

package/dist/lib/dashboard/components/response-list.component.js

@@ -0,0 +1,196 @@
+import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, computed, signal } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/forms";
+const _forTrack0 = ($index, $item) => $item.value;
+const _forTrack1 = ($index, $item) => $item.responseId;
+function FormsResponseListComponent_For_4_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 6);
+    i0.ɵɵlistener("click", function FormsResponseListComponent_For_4_Template_button_click_0_listener() { const f_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.statusFilter.set(f_r2.value)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const f_r2 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("chip--active", ctx_r2.statusFilter() === f_r2.value);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", f_r2.label, " ");
+} }
+function FormsResponseListComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 4);
+    i0.ɵɵtext(1, "No responses match.");
+    i0.ɵɵelementEnd();
+} }
+function FormsResponseListComponent_Conditional_6_For_15_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "tr", 9);
+    i0.ɵɵlistener("click", function FormsResponseListComponent_Conditional_6_For_15_Template_tr_click_0_listener() { const r_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.open.emit(r_r5.responseId)); })("keydown.enter", function FormsResponseListComponent_Conditional_6_For_15_Template_tr_keydown_enter_0_listener() { const r_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.open.emit(r_r5.responseId)); });
+    i0.ɵɵelementStart(1, "td")(2, "span", 10);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(4, "td");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "td", 11);
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "td");
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "td", 12);
+    i0.ɵɵelement(11, "i", 13);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const r_r5 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵclassProp("status--complete", r_r5.status === "Complete");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", r_r5.status, " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(r_r5.respondent);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(r_r5.answeredCount);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(ctx_r2.submittedLabel(r_r5));
+} }
+function FormsResponseListComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 5)(1, "table", 7)(2, "thead")(3, "tr")(4, "th");
+    i0.ɵɵtext(5, "Status");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "th");
+    i0.ɵɵtext(7, "Respondent");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "th");
+    i0.ɵɵtext(9, "Answered");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "th");
+    i0.ɵɵtext(11, "Submitted");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(12, "th");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(13, "tbody");
+    i0.ɵɵrepeaterCreate(14, FormsResponseListComponent_Conditional_6_For_15_Template, 12, 6, "tr", 8, _forTrack1);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(14);
+    i0.ɵɵrepeater(ctx_r2.filtered());
+} }
+/**
+ * Individual-response list with text search + status filter (simple cross-tab).
+ * A semantic, token-styled table — clicking a row emits the response id so the
+ * dashboard can open the detail view. Horizontal scroll is contained.
+ */
+export class FormsResponseListComponent {
+    open = new EventEmitter();
+    search = signal('', ...(ngDevMode ? [{ debugName: "search" }] : []));
+    statusFilter = signal('all', ...(ngDevMode ? [{ debugName: "statusFilter" }] : []));
+    statusFilters = [
+        { value: 'all', label: 'All' },
+        { value: 'Complete', label: 'Complete' },
+        { value: 'Partial', label: 'Partial' },
+    ];
+    _rows = signal([], ...(ngDevMode ? [{ debugName: "_rows" }] : []));
+    set rows(value) {
+        this._rows.set(value ?? []);
+    }
+    filtered = computed(() => {
+        const term = this.search().trim().toLowerCase();
+        const status = this.statusFilter();
+        return this._rows().filter((r) => {
+            if (status !== 'all' && r.status !== status)
+                return false;
+            if (term && !r.respondent.toLowerCase().includes(term))
+                return false;
+            return true;
+        });
+    }, ...(ngDevMode ? [{ debugName: "filtered" }] : []));
+    submittedLabel(r) {
+        return r.submittedAt ? r.submittedAt.toLocaleString() : '—';
+    }
+    static ɵfac = function FormsResponseListComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || FormsResponseListComponent)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: FormsResponseListComponent, selectors: [["mj-forms-response-list"]], inputs: { rows: "rows" }, outputs: { open: "open" }, decls: 7, vars: 2, consts: [[1, "toolbar"], ["type", "search", "placeholder", "Search respondent...", "aria-label", "Search responses by respondent", 1, "search", 3, "ngModelChange", "ngModel"], ["role", "group", "aria-label", "Filter by status", 1, "filters"], ["type", "button", 1, "chip", 3, "chip--active"], [1, "empty"], [1, "table-scroll"], ["type", "button", 1, "chip", 3, "click"], [1, "grid"], ["tabindex", "0"], ["tabindex", "0", 3, "click", "keydown.enter"], [1, "status"], [1, "num"], [1, "open-cell"], [1, "fa-solid", "fa-chevron-right"]], template: function FormsResponseListComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "input", 1);
+            i0.ɵɵlistener("ngModelChange", function FormsResponseListComponent_Template_input_ngModelChange_1_listener($event) { return ctx.search.set($event); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(2, "div", 2);
+            i0.ɵɵrepeaterCreate(3, FormsResponseListComponent_For_4_Template, 2, 3, "button", 3, _forTrack0);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵconditionalCreate(5, FormsResponseListComponent_Conditional_5_Template, 2, 0, "p", 4)(6, FormsResponseListComponent_Conditional_6_Template, 16, 0, "div", 5);
+        } if (rf & 2) {
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngModel", ctx.search());
+            i0.ɵɵadvance(2);
+            i0.ɵɵrepeater(ctx.statusFilters);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.filtered().length === 0 ? 5 : 6);
+        } }, dependencies: [FormsModule, i1.DefaultValueAccessor, i1.NgControlStatus, i1.NgModel], styles: ["[_nghost-%COMP%] {\n        display: block;\n      }\n      .toolbar[_ngcontent-%COMP%] {\n        display: flex;\n        gap: var(--mj-space-2);\n        flex-wrap: wrap;\n        align-items: center;\n        margin-bottom: var(--mj-space-3);\n      }\n      .search[_ngcontent-%COMP%] {\n        flex: 1 1 220px;\n        padding: var(--mj-space-2);\n        border: 1px solid var(--mj-border-default);\n        border-radius: var(--mj-radius-md);\n        background: var(--mj-bg-surface);\n        color: var(--mj-text-primary);\n        font-size: 13px;\n      }\n      .filters[_ngcontent-%COMP%] {\n        display: flex;\n        gap: var(--mj-space-1);\n      }\n      .chip[_ngcontent-%COMP%] {\n        padding: var(--mj-space-1) var(--mj-space-2-5);\n        border: 1px solid var(--mj-border-default);\n        border-radius: var(--mj-radius-full);\n        background: var(--mj-bg-surface);\n        color: var(--mj-text-secondary);\n        font-size: 12px;\n        cursor: pointer;\n      }\n      .chip--active[_ngcontent-%COMP%] {\n        background: var(--mj-brand-primary);\n        border-color: var(--mj-brand-primary);\n        color: var(--mj-text-inverse);\n      }\n      .empty[_ngcontent-%COMP%] {\n        color: var(--mj-text-muted);\n        font-style: italic;\n        margin: 0;\n      }\n      .table-scroll[_ngcontent-%COMP%] {\n        overflow-x: auto;\n      }\n      .grid[_ngcontent-%COMP%] {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 13px;\n      }\n      .grid[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n        text-align: left;\n        padding: var(--mj-space-2);\n        color: var(--mj-text-muted);\n        font-size: 11px;\n        text-transform: uppercase;\n        letter-spacing: 0.04em;\n        border-bottom: 1px solid var(--mj-border-default);\n      }\n      .grid[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n        padding: var(--mj-space-2);\n        color: var(--mj-text-primary);\n        border-bottom: 1px solid var(--mj-border-subtle);\n      }\n      .grid[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%] {\n        cursor: pointer;\n      }\n      .grid[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:hover {\n        background: var(--mj-bg-surface-hover);\n      }\n      .num[_ngcontent-%COMP%] {\n        font-variant-numeric: tabular-nums;\n      }\n      .status[_ngcontent-%COMP%] {\n        display: inline-block;\n        padding: 2px var(--mj-space-2);\n        border-radius: var(--mj-radius-full);\n        font-size: 11px;\n        background: var(--mj-bg-surface-sunken);\n        color: var(--mj-text-secondary);\n      }\n      .status--complete[_ngcontent-%COMP%] {\n        background: var(--mj-status-success);\n        color: var(--mj-text-inverse);\n      }\n      .open-cell[_ngcontent-%COMP%] {\n        color: var(--mj-text-muted);\n        text-align: right;\n      }"], changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(FormsResponseListComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-forms-response-list', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule], template: `
+    <div class="toolbar">
+      <input
+        class="search"
+        type="search"
+        placeholder="Search respondent..."
+        [ngModel]="search()"
+        (ngModelChange)="search.set($event)"
+        aria-label="Search responses by respondent" />
+      <div class="filters" role="group" aria-label="Filter by status">
+        @for (f of statusFilters; track f.value) {
+          <button
+            type="button"
+            class="chip"
+            [class.chip--active]="statusFilter() === f.value"
+            (click)="statusFilter.set(f.value)">
+            {{ f.label }}
+          </button>
+        }
+      </div>
+    </div>
+
+    @if (filtered().length === 0) {
+      <p class="empty">No responses match.</p>
+    } @else {
+      <div class="table-scroll">
+        <table class="grid">
+          <thead>
+            <tr>
+              <th>Status</th>
+              <th>Respondent</th>
+              <th>Answered</th>
+              <th>Submitted</th>
+              <th></th>
+            </tr>
+          </thead>
+          <tbody>
+            @for (r of filtered(); track r.responseId) {
+              <tr (click)="open.emit(r.responseId)" tabindex="0"
+                  (keydown.enter)="open.emit(r.responseId)">
+                <td>
+                  <span class="status" [class.status--complete]="r.status === 'Complete'">
+                    {{ r.status }}
+                  </span>
+                </td>
+                <td>{{ r.respondent }}</td>
+                <td class="num">{{ r.answeredCount }}</td>
+                <td>{{ submittedLabel(r) }}</td>
+                <td class="open-cell"><i class="fa-solid fa-chevron-right"></i></td>
+              </tr>
+            }
+          </tbody>
+        </table>
+      </div>
+    }
+  `, styles: ["\n      :host {\n        display: block;\n      }\n      .toolbar {\n        display: flex;\n        gap: var(--mj-space-2);\n        flex-wrap: wrap;\n        align-items: center;\n        margin-bottom: var(--mj-space-3);\n      }\n      .search {\n        flex: 1 1 220px;\n        padding: var(--mj-space-2);\n        border: 1px solid var(--mj-border-default);\n        border-radius: var(--mj-radius-md);\n        background: var(--mj-bg-surface);\n        color: var(--mj-text-primary);\n        font-size: 13px;\n      }\n      .filters {\n        display: flex;\n        gap: var(--mj-space-1);\n      }\n      .chip {\n        padding: var(--mj-space-1) var(--mj-space-2-5);\n        border: 1px solid var(--mj-border-default);\n        border-radius: var(--mj-radius-full);\n        background: var(--mj-bg-surface);\n        color: var(--mj-text-secondary);\n        font-size: 12px;\n        cursor: pointer;\n      }\n      .chip--active {\n        background: var(--mj-brand-primary);\n        border-color: var(--mj-brand-primary);\n        color: var(--mj-text-inverse);\n      }\n      .empty {\n        color: var(--mj-text-muted);\n        font-style: italic;\n        margin: 0;\n      }\n      .table-scroll {\n        overflow-x: auto;\n      }\n      .grid {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 13px;\n      }\n      .grid th {\n        text-align: left;\n        padding: var(--mj-space-2);\n        color: var(--mj-text-muted);\n        font-size: 11px;\n        text-transform: uppercase;\n        letter-spacing: 0.04em;\n        border-bottom: 1px solid var(--mj-border-default);\n      }\n      .grid td {\n        padding: var(--mj-space-2);\n        color: var(--mj-text-primary);\n        border-bottom: 1px solid var(--mj-border-subtle);\n      }\n      .grid tbody tr {\n        cursor: pointer;\n      }\n      .grid tbody tr:hover {\n        background: var(--mj-bg-surface-hover);\n      }\n      .num {\n        font-variant-numeric: tabular-nums;\n      }\n      .status {\n        display: inline-block;\n        padding: 2px var(--mj-space-2);\n        border-radius: var(--mj-radius-full);\n        font-size: 11px;\n        background: var(--mj-bg-surface-sunken);\n        color: var(--mj-text-secondary);\n      }\n      .status--complete {\n        background: var(--mj-status-success);\n        color: var(--mj-text-inverse);\n      }\n      .open-cell {\n        color: var(--mj-text-muted);\n        text-align: right;\n      }\n    "] }]
+    }], null, { open: [{
+            type: Output
+        }], rows: [{
+            type: Input,
+            args: [{ required: true }]
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(FormsResponseListComponent, { className: "FormsResponseListComponent", filePath: "lib/dashboard/components/response-list.component.ts", lineNumber: 168 }); })();
+//# sourceMappingURL=response-list.component.js.map

package/dist/lib/dashboard/components/response-list.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"response-list.component.js","sourceRoot":"","sources":["../../../../src/lib/dashboard/components/response-list.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/dashboard/components/summary-stats.component.d.ts

@@ -0,0 +1,12 @@
+import type { FormSummaryStats } from '../models/reporting.model';
+import * as i0 from "@angular/core";
+/** Top-line stat cards: total responses, completion rate, avg time, last submit. */
+export declare class FormsSummaryStatsComponent {
+    stats: FormSummaryStats;
+    pct(fraction: number): string;
+    get durationLabel(): string;
+    get lastLabel(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<FormsSummaryStatsComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<FormsSummaryStatsComponent, "mj-forms-summary-stats", never, { "stats": { "alias": "stats"; "required": true; }; }, {}, never, never, true, never>;
+}
+//# sourceMappingURL=summary-stats.component.d.ts.map

package/dist/lib/dashboard/components/summary-stats.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"summary-stats.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/dashboard/components/summary-stats.component.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;;AAElE,oFAAoF;AACpF,qBAwEa,0BAA0B;IACV,KAAK,EAAG,gBAAgB,CAAC;IAE7C,GAAG,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM;IAIpC,IAAW,aAAa,IAAI,MAAM,CAOjC;IAED,IAAW,SAAS,IAAI,MAAM,CAI7B;yCApBU,0BAA0B;2CAA1B,0BAA0B;CAqBtC"}