@edvak99/voice-receptionist-widget 1.1.2 → 1.1.4

package/fesm2022/edvak99-voice-receptionist-widget-dashboard-page.component-CxbO0eDS.mjs

@@ -0,0 +1,440 @@
+import * as i0 from '@angular/core';
+import { inject, DestroyRef, EventEmitter, signal, Output, Input, ChangeDetectionStrategy, Component } from '@angular/core';
+import { Router, ActivatedRoute, RouterLink } from '@angular/router';
+import { DatePipe } from '@angular/common';
+import { A as AiReceptionistApiService, t as toE164Phone, c as callerMetaLine, r as resultChipIcon, h as historyResultChips, a as historyResolutionLabel, b as historyResolution } from './edvak99-voice-receptionist-widget-ai-receptionist-api.service-48cifVPF.mjs';
+import { L as LiveCallsListService, E as EdsPulseDotComponent } from './edvak99-voice-receptionist-widget-eds-pulse-dot.component-BPY6xN7C.mjs';
+import { i as isNeedsReview } from './edvak99-voice-receptionist-widget-call-review.util-Deh3jPgo.mjs';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import * as i1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { Subject, debounceTime, distinctUntilChanged, switchMap, of, catchError } from 'rxjs';
+import { r as requiredFieldLabel, a as renderLiveOpeningPreview, f as formatOpeningTime, b as formatOpeningDate, p as purposeShowsCustomScript, i as isCustomScriptRequired, c as isPurposeFormValid } from './edvak99-voice-receptionist-widget-outbound-purpose.util-Bdh4QfFe.mjs';
+import { E as EdsButtonComponent } from './edvak99-voice-receptionist-widget-eds-button.component-Bg5T5BN8.mjs';
+import { M as ModalComponent } from './edvak99-voice-receptionist-widget-modal.component-COfi7biN.mjs';
+import { T as ToastService, E as EdsIconComponent } from './edvak99-voice-receptionist-widget-edvak99-voice-receptionist-widget-BsBQIS_f.mjs';
+import { E as EdsAvatarComponent } from './edvak99-voice-receptionist-widget-eds-avatar.component-CWRiJGfv.mjs';
+import { E as EdsElapsedPipe } from './edvak99-voice-receptionist-widget-eds-elapsed.pipe-BFCiJOT3.mjs';
+
+const E164_PATTERN = /^\+[1-9]\d{6,14}$/;
+class OutboundDialModalComponent {
+    constructor() {
+        this.api = inject(AiReceptionistApiService);
+        this.toast = inject(ToastService);
+        this.destroyRef = inject(DestroyRef);
+        this.open = false;
+        this.closed = new EventEmitter();
+        this.dialed = new EventEmitter();
+        this.purposes = signal([]);
+        this.loading = signal(true);
+        this.submitting = signal(false);
+        this.serverError = signal(null);
+        this.patientHits = signal([]);
+        this.searchingPatients = signal(false);
+        this.selectedPatient = signal(null);
+        this.appointments = signal([]);
+        this.loadingAppointments = signal(false);
+        this.selectedAppointmentId = signal(null);
+        this.showManualEntry = signal(false);
+        this.practiceName = signal('');
+        /** Bumps OnPush re-render when plain ngModel fields change. */
+        this.formEpoch = signal(0);
+        this.patientQuery = '';
+        this.phone = '';
+        this.name = '';
+        this.purposeId = '';
+        this.appointmentDate = '';
+        this.appointmentTime = '';
+        this.providerName = '';
+        this.customScript = '';
+        this.requiredFieldLabel = requiredFieldLabel;
+        this.search$ = new Subject();
+        this.search$
+            .pipe(debounceTime(280), distinctUntilChanged(), switchMap((q) => {
+            const query = q.trim();
+            if (query.length < 2) {
+                this.searchingPatients.set(false);
+                this.patientHits.set([]);
+                return of([]);
+            }
+            this.searchingPatients.set(true);
+            return this.api.searchPatientsForOutbound(query, 10).pipe(catchError(() => of([])));
+        }), takeUntilDestroyed(this.destroyRef))
+            .subscribe((hits) => {
+            this.searchingPatients.set(false);
+            if (!this.selectedPatient()) {
+                this.patientHits.set(hits);
+            }
+        });
+    }
+    ngOnChanges(changes) {
+        if (changes['open']?.currentValue) {
+            this.resetForm();
+            this.loadPurposes();
+            this.loadPracticeName();
+        }
+    }
+    get selectedPurpose() {
+        return this.purposes().find((p) => p.purposeId === this.purposeId) ?? null;
+    }
+    get selectedAppointment() {
+        const id = this.selectedAppointmentId();
+        if (!id)
+            return null;
+        return this.appointments().find((a) => a.appointmentId === id) ?? null;
+    }
+    get previewText() {
+        this.formEpoch(); // depend for CD when form fields change
+        const p = this.selectedPurpose;
+        if (!p)
+            return '—';
+        const appt = this.selectedAppointment;
+        const dateSource = appt?.startTime || this.appointmentDate;
+        const timeSource = appt?.startTime || this.appointmentTime;
+        return renderLiveOpeningPreview(p, {
+            patientName: this.name.trim() || this.selectedPatient()?.fullName || '',
+            appointmentDate: formatOpeningDate(dateSource),
+            appointmentTime: formatOpeningTime(this.appointmentTime || timeSource, appt?.startTime),
+            providerName: this.providerName.trim() || appt?.providerName || '',
+            practiceName: this.practiceName(),
+            locationName: appt?.locationName || '',
+            visitType: appt?.visitType || '',
+            customScript: this.customScript.trim(),
+        });
+    }
+    showsField(field) {
+        return this.selectedPurpose?.requiredFields.includes(field) ?? false;
+    }
+    showsCustomScript() {
+        const p = this.selectedPurpose;
+        return p ? purposeShowsCustomScript(p) : false;
+    }
+    customScriptRequired() {
+        const p = this.selectedPurpose;
+        return p ? isCustomScriptRequired(p) : false;
+    }
+    canPlaceCall() {
+        if (!E164_PATTERN.test(this.phone.trim()))
+            return false;
+        return isPurposeFormValid(this.selectedPurpose, {
+            phone: this.phone,
+            name: this.name,
+            appointmentDate: this.appointmentDate,
+            appointmentTime: this.appointmentTime,
+            providerName: this.providerName,
+            customScript: this.customScript,
+        });
+    }
+    touchForm() {
+        this.formEpoch.update((n) => n + 1);
+    }
+    onPatientQueryChange(value) {
+        this.patientQuery = value;
+        if (this.selectedPatient())
+            return;
+        this.search$.next(value);
+    }
+    selectPatient(patient) {
+        this.selectedPatient.set(patient);
+        this.patientHits.set([]);
+        this.patientQuery = patient.fullName;
+        this.name = patient.fullName;
+        this.phone = toE164Phone(patient.phone) || '';
+        this.showManualEntry.set(!this.phone);
+        this.selectedAppointmentId.set(null);
+        this.clearApptDerivedFields();
+        this.touchForm();
+        this.loadAppointments(patient.patientId);
+    }
+    clearPatient() {
+        this.selectedPatient.set(null);
+        this.patientQuery = '';
+        this.patientHits.set([]);
+        this.appointments.set([]);
+        this.selectedAppointmentId.set(null);
+        this.name = '';
+        this.phone = '';
+        this.clearApptDerivedFields();
+        this.touchForm();
+    }
+    selectAppointment(appt) {
+        this.selectedAppointmentId.set(appt?.appointmentId ?? null);
+        if (!appt) {
+            this.clearApptDerivedFields();
+            this.touchForm();
+            return;
+        }
+        this.applyAppointmentFields(appt);
+        this.preferAppointmentPurpose();
+        this.touchForm();
+    }
+    onPurposeChange() {
+        const appt = this.selectedAppointment;
+        if (appt) {
+            this.applyAppointmentFields(appt);
+        }
+        else {
+            this.clearApptDerivedFields();
+        }
+        this.customScript = '';
+        this.serverError.set(null);
+        this.touchForm();
+    }
+    close() {
+        this.closed.emit();
+    }
+    submit() {
+        this.serverError.set(null);
+        if (!this.canPlaceCall() || !this.selectedPurpose)
+            return;
+        this.submitting.set(true);
+        const patient = this.selectedPatient();
+        const apptId = this.selectedAppointmentId();
+        const body = {
+            phone: this.phone.trim(),
+            name: this.name.trim(),
+            purpose: this.purposeId,
+            ...(this.appointmentDate ? { appointmentDate: this.appointmentDate } : {}),
+            ...(this.appointmentTime ? { appointmentTime: this.appointmentTime } : {}),
+            ...(this.providerName ? { providerName: this.providerName.trim() } : {}),
+            ...(this.customScript ? { customScript: this.customScript.trim() } : {}),
+            ...(patient?.patientId ? { patientId: patient.patientId } : {}),
+            ...(apptId ? { appointmentId: apptId } : {}),
+        };
+        this.api.placeOutboundCall(body).subscribe({
+            next: (res) => {
+                this.submitting.set(false);
+                const msg = res.message ?? 'Outbound call started.';
+                this.toast.show(msg, 'success', 5000);
+                this.dialed.emit();
+                this.close();
+            },
+            error: (err) => {
+                this.submitting.set(false);
+                const msg = err?.message ?? 'Failed to place outbound call.';
+                this.serverError.set(msg);
+                this.toast.show(msg, 'error', 5000);
+            },
+        });
+    }
+    preferAppointmentPurpose() {
+        const current = this.selectedPurpose;
+        const needsAppt = !!current &&
+            (current.requiredFields.includes('appointmentDate') ||
+                current.requiredFields.includes('appointmentTime'));
+        if (needsAppt)
+            return;
+        const confirm = this.purposes().find((p) => p.isActive &&
+            p.requiredFields.includes('appointmentDate') &&
+            p.requiredFields.includes('appointmentTime')) ??
+            this.purposes().find((p) => p.isActive && /confirm/i.test(p.label + p.purposeId));
+        if (confirm) {
+            this.purposeId = confirm.purposeId;
+        }
+    }
+    applyAppointmentFields(appt) {
+        const start = appt.startTime ? new Date(appt.startTime) : null;
+        if (start && !Number.isNaN(start.getTime())) {
+            const y = start.getFullYear();
+            const m = String(start.getMonth() + 1).padStart(2, '0');
+            const d = String(start.getDate()).padStart(2, '0');
+            const hh = String(start.getHours()).padStart(2, '0');
+            const mm = String(start.getMinutes()).padStart(2, '0');
+            this.appointmentDate = `${y}-${m}-${d}`;
+            this.appointmentTime = `${hh}:${mm}`;
+        }
+        if (appt.providerName) {
+            this.providerName = appt.providerName;
+        }
+    }
+    clearApptDerivedFields() {
+        this.appointmentDate = '';
+        this.appointmentTime = '';
+        this.providerName = '';
+    }
+    loadAppointments(patientId) {
+        this.loadingAppointments.set(true);
+        this.appointments.set([]);
+        this.api.listPatientAppointmentsForOutbound(patientId, 20).subscribe({
+            next: (rows) => {
+                this.appointments.set(rows);
+                this.loadingAppointments.set(false);
+                if (rows.length === 1) {
+                    this.selectAppointment(rows[0]);
+                }
+            },
+            error: () => {
+                this.loadingAppointments.set(false);
+                this.appointments.set([]);
+            },
+        });
+    }
+    loadPracticeName() {
+        this.api.getSettings().subscribe({
+            next: ({ data }) => {
+                const name = String(data.general?.['practiceName'] ?? '').trim();
+                this.practiceName.set(name || 'our office');
+            },
+            error: () => this.practiceName.set('our office'),
+        });
+    }
+    resetForm() {
+        this.patientQuery = '';
+        this.phone = '';
+        this.name = '';
+        this.purposeId = '';
+        this.appointmentDate = '';
+        this.appointmentTime = '';
+        this.providerName = '';
+        this.customScript = '';
+        this.patientHits.set([]);
+        this.selectedPatient.set(null);
+        this.appointments.set([]);
+        this.selectedAppointmentId.set(null);
+        this.searchingPatients.set(false);
+        this.loadingAppointments.set(false);
+        this.showManualEntry.set(false);
+        this.serverError.set(null);
+        this.submitting.set(false);
+        this.formEpoch.set(0);
+    }
+    loadPurposes() {
+        this.loading.set(true);
+        this.api.getOutboundPurposes(false).subscribe({
+            next: ({ purposes }) => {
+                this.purposes.set(purposes);
+                if (purposes.length && !this.purposeId) {
+                    this.purposeId = purposes[0].purposeId;
+                }
+                this.loading.set(false);
+            },
+            error: () => {
+                this.loading.set(false);
+                this.serverError.set('Failed to load outbound purposes.');
+            },
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: OutboundDialModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: OutboundDialModalComponent, isStandalone: true, selector: "eds-outbound-dial-modal", inputs: { open: "open" }, outputs: { closed: "closed", dialed: "dialed" }, usesOnChanges: true, ngImport: i0, template: "@if (open) {\n  <app-modal\n    title=\"Outbound call\"\n    subtitle=\"Search a patient, pick an appointment, then dial\"\n    maxWidth=\"600px\"\n    (closed)=\"close()\"\n  >\n    @if (loading()) {\n      <p class=\"eds-body-sm\">Loading purposes\u2026</p>\n    } @else {\n      <form class=\"dial-form\" (ngSubmit)=\"submit()\" novalidate autocomplete=\"off\">\n        <div class=\"dial-form__field dial-form__typeahead\">\n          <span class=\"eds-label\">Patient <span class=\"dial-form__req\">*</span></span>\n\n          @if (selectedPatient(); as patient) {\n            <div class=\"dial-form__chip\">\n              <div class=\"dial-form__chip-main\">\n                <strong>{{ patient.fullName }}</strong>\n                <span class=\"dial-form__chip-meta\">\n                  @if (patient.phone) {\n                    {{ patient.phone }}\n                  }\n                  @if (patient.dob) {\n                    \u00B7 DOB {{ patient.dob }}\n                  }\n                </span>\n              </div>\n              <button type=\"button\" class=\"dial-form__chip-clear\" (click)=\"clearPatient()\">\n                Change\n              </button>\n            </div>\n          } @else {\n            <input\n              type=\"search\"\n              class=\"dial-form__input\"\n              [ngModel]=\"patientQuery\"\n              (ngModelChange)=\"onPatientQueryChange($event)\"\n              name=\"patientQuery\"\n              placeholder=\"Search by name or phone\"\n              autocomplete=\"off\"\n             />\n            @if (searchingPatients()) {\n              <span class=\"dial-form__hint\">Searching\u2026</span>\n            }\n            @if (patientHits().length) {\n              <ul class=\"dial-form__hits\" role=\"listbox\">\n                @for (hit of patientHits(); track hit.patientId) {\n                  <li>\n                    <button\n                      type=\"button\"\n                      class=\"dial-form__hit\"\n                      role=\"option\"\n                      (click)=\"selectPatient(hit)\"\n                    >\n                      <span class=\"dial-form__hit-name\">{{ hit.fullName }}</span>\n                      <span class=\"dial-form__hit-meta\">\n                        {{ hit.phone || 'No phone' }}\n                        @if (hit.dob) {\n                          \u00B7 {{ hit.dob }}\n                        }\n                      </span>\n                    </button>\n                  </li>\n                }\n              </ul>\n            }\n          }\n        </div>\n\n        @if (selectedPatient()) {\n          <div class=\"dial-form__field\">\n            <span class=\"eds-label\">Appointment</span>\n            @if (loadingAppointments()) {\n              <span class=\"dial-form__hint\">Loading appointments\u2026</span>\n            } @else if (!appointments().length) {\n              <span class=\"dial-form__hint\">No upcoming appointments \u2014 dial without one, or enter details below.</span>\n            } @else {\n              <ul class=\"dial-form__appts\">\n                <li>\n                  <label class=\"dial-form__appt\">\n                    <input\n                      type=\"radio\"\n                      name=\"appointmentId\"\n                      [checked]=\"!selectedAppointmentId()\"\n                      (change)=\"selectAppointment(null)\"\n                      autocomplete=\"off\"\n                     />\n                    <span>No appointment (purpose-only)</span>\n                  </label>\n                </li>\n                @for (appt of appointments(); track appt.appointmentId) {\n                  <li>\n                    <label class=\"dial-form__appt\">\n                      <input\n                        type=\"radio\"\n                        name=\"appointmentId\"\n                        [checked]=\"selectedAppointmentId() === appt.appointmentId\"\n                        (change)=\"selectAppointment(appt)\"\n                        autocomplete=\"off\"\n                       />\n                      <span class=\"dial-form__appt-body\">\n                        <strong>\n                          {{ appt.startTime ? (appt.startTime | date: 'medium') : 'TBD' }}\n                        </strong>\n                        <span class=\"dial-form__hit-meta\">\n                          {{ appt.providerName || 'Provider TBD' }}\n                          @if (appt.locationName) {\n                            \u00B7 {{ appt.locationName }}\n                          }\n                          @if (appt.visitType) {\n                            \u00B7 {{ appt.visitType }}\n                          }\n                          @if (appt.status) {\n                            \u00B7 {{ appt.status }}\n                          }\n                        </span>\n                      </span>\n                    </label>\n                  </li>\n                }\n              </ul>\n            }\n          </div>\n        }\n\n        <button\n          type=\"button\"\n          class=\"dial-form__toggle\"\n          (click)=\"showManualEntry.set(!showManualEntry())\"\n        >\n          {{ showManualEntry() ? 'Hide' : 'Show' }} phone / name\n          @if (!selectedPatient()) {\n            (required if no patient selected)\n          }\n        </button>\n\n        @if (showManualEntry() || !selectedPatient()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">Phone <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"tel\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"phone\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"phone\"\n              placeholder=\"+14155550100\"\n              autocomplete=\"off\"\n              required\n             />\n            <span class=\"dial-form__hint\">E.164 format, e.g. +14155550100</span>\n          </label>\n\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">Patient name <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"text\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"name\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"name\"\n              placeholder=\"Maria Garcia\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        <label class=\"dial-form__field\">\n          <span class=\"eds-label\">Purpose <span class=\"dial-form__req\">*</span></span>\n          <select\n            class=\"dial-form__input\"\n            [(ngModel)]=\"purposeId\"\n            name=\"purposeId\"\n            (ngModelChange)=\"onPurposeChange()\"\n            required\n            autocomplete=\"off\"\n          >\n            @for (p of purposes(); track p.purposeId) {\n              <option [value]=\"p.purposeId\">{{ p.label }}</option>\n            }\n          </select>\n        </label>\n\n        @if (showsField('appointmentDate') && !selectedAppointmentId()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">{{ requiredFieldLabel('appointmentDate') }} <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"date\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"appointmentDate\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"appointmentDate\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        @if (showsField('appointmentTime') && !selectedAppointmentId()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">{{ requiredFieldLabel('appointmentTime') }} <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"time\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"appointmentTime\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"appointmentTime\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        @if (showsField('providerName') && !selectedAppointmentId()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">{{ requiredFieldLabel('providerName') }} <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"text\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"providerName\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"providerName\"\n              placeholder=\"Dr. Patel\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        @if (selectedAppointmentId() && (showsField('appointmentDate') || showsField('appointmentTime') || showsField('providerName'))) {\n          <p class=\"dial-form__hint\">\n            Date, time, and provider are taken from the selected appointment\n            @if (appointmentDate || appointmentTime || providerName) {\n              ({{ appointmentDate }}\n              @if (appointmentTime) {\n                {{ appointmentTime }}\n              }\n              @if (providerName) {\n                \u00B7 {{ providerName }}\n              })\n            }.\n          </p>\n        }\n\n        @if (showsCustomScript()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">\n              Custom script\n              @if (customScriptRequired()) {\n                <span class=\"dial-form__req\">*</span>\n              }\n            </span>\n            <textarea\n              class=\"dial-form__textarea\"\n              rows=\"4\"\n              [(ngModel)]=\"customScript\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"customScript\"\n              [required]=\"customScriptRequired()\"\n              placeholder=\"What should the agent say or do?\"\n              autocomplete=\"off\"\n            ></textarea>\n          </label>\n        }\n\n        <section class=\"dial-form__preview eds-card\">\n          <h3 class=\"eds-label\">Opening preview</h3>\n          <p class=\"dial-form__preview-text\">{{ previewText }}</p>\n          @if (selectedAppointmentId()) {\n            <p class=\"dial-form__hint\">\n              Filled from the selected appointment and purpose template. Switch purpose to change the script.\n            </p>\n          } @else {\n            <p class=\"dial-form__hint\">\n              Select an appointment to fill date, time, and provider into this message.\n            </p>\n          }\n        </section>\n\n        @if (serverError()) {\n          <p class=\"dial-form__error\" role=\"alert\">{{ serverError() }}</p>\n        }\n\n        <footer class=\"dial-form__footer\">\n          <eds-button variant=\"secondary\" type=\"button\" (click)=\"close()\" [disabled]=\"submitting()\">\n            Cancel\n          </eds-button>\n          <eds-button variant=\"primary\" type=\"submit\" [disabled]=\"submitting() || !canPlaceCall()\">\n            {{ submitting() ? 'Dialing\u2026' : 'Place call' }}\n          </eds-button>\n        </footer>\n      </form>\n    }\n  </app-modal>\n}\n", styles: [".dial-form{display:flex;flex-direction:column;gap:12px}.dial-form__field{display:flex;flex-direction:column;gap:6px}.dial-form__typeahead{position:relative}.dial-form__input,.dial-form__textarea{padding:8px 10px;border:1px solid var(--eds-border-subtle, #e4e4e7);border-radius:8px;font:inherit}.dial-form__textarea{resize:vertical}.dial-form__hint{font-size:12px;color:var(--eds-text-secondary)}.dial-form__req{color:#dc2626}.dial-form__chip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--eds-border-subtle, #e4e4e7);border-radius:8px;background:var(--eds-surface-muted, #f8fafc)}.dial-form__chip-main{display:flex;flex-direction:column;gap:2px;min-width:0}.dial-form__chip-meta,.dial-form__hit-meta{font-size:12px;color:var(--eds-text-secondary)}.dial-form__chip-clear{flex-shrink:0;border:none;background:transparent;color:var(--eds-primary, #2563eb);font:inherit;font-size:13px;cursor:pointer;padding:4px}.dial-form__hits,.dial-form__appts{list-style:none;margin:0;padding:0;border:1px solid var(--eds-border-subtle, #e4e4e7);border-radius:8px;overflow:hidden;max-height:220px;overflow-y:auto}.dial-form__hits{position:absolute;z-index:5;left:0;right:0;top:calc(100% + 4px);background:var(--eds-surface, #fff);box-shadow:0 8px 24px #0f172a1f}.dial-form__hit{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:10px 12px;border:none;border-bottom:1px solid var(--eds-border-subtle, #f1f5f9);background:transparent;text-align:left;font:inherit;cursor:pointer}.dial-form__hit:hover{background:var(--eds-surface-muted, #f8fafc)}.dial-form__hit-name{font-weight:600}.dial-form__appt{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-bottom:1px solid var(--eds-border-subtle, #f1f5f9);cursor:pointer}.dial-form__appt:last-child,.dial-form__hit:last-child{border-bottom:none}.dial-form__appt-body{display:flex;flex-direction:column;gap:2px}.dial-form__toggle{align-self:flex-start;border:none;background:transparent;color:var(--eds-primary, #2563eb);font:inherit;font-size:13px;cursor:pointer;padding:0}.dial-form__preview{padding:12px;background:var(--eds-surface-muted, #f8fafc)}.dial-form__preview-text{margin:8px 0 0;font-size:14px;line-height:1.5;white-space:pre-wrap}.dial-form__error{color:#b91c1c;font-size:13px;margin:0}.dial-form__footer{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ModalComponent, selector: "app-modal", inputs: ["title", "subtitle", "maxWidth"], outputs: ["closed"] }, { kind: "component", type: EdsButtonComponent, selector: "eds-button", inputs: ["variant", "type", "disabled"] }, { kind: "pipe", type: DatePipe, name: "date" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: OutboundDialModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'eds-outbound-dial-modal', imports: [FormsModule, ModalComponent, EdsButtonComponent, DatePipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (open) {\n  <app-modal\n    title=\"Outbound call\"\n    subtitle=\"Search a patient, pick an appointment, then dial\"\n    maxWidth=\"600px\"\n    (closed)=\"close()\"\n  >\n    @if (loading()) {\n      <p class=\"eds-body-sm\">Loading purposes\u2026</p>\n    } @else {\n      <form class=\"dial-form\" (ngSubmit)=\"submit()\" novalidate autocomplete=\"off\">\n        <div class=\"dial-form__field dial-form__typeahead\">\n          <span class=\"eds-label\">Patient <span class=\"dial-form__req\">*</span></span>\n\n          @if (selectedPatient(); as patient) {\n            <div class=\"dial-form__chip\">\n              <div class=\"dial-form__chip-main\">\n                <strong>{{ patient.fullName }}</strong>\n                <span class=\"dial-form__chip-meta\">\n                  @if (patient.phone) {\n                    {{ patient.phone }}\n                  }\n                  @if (patient.dob) {\n                    \u00B7 DOB {{ patient.dob }}\n                  }\n                </span>\n              </div>\n              <button type=\"button\" class=\"dial-form__chip-clear\" (click)=\"clearPatient()\">\n                Change\n              </button>\n            </div>\n          } @else {\n            <input\n              type=\"search\"\n              class=\"dial-form__input\"\n              [ngModel]=\"patientQuery\"\n              (ngModelChange)=\"onPatientQueryChange($event)\"\n              name=\"patientQuery\"\n              placeholder=\"Search by name or phone\"\n              autocomplete=\"off\"\n             />\n            @if (searchingPatients()) {\n              <span class=\"dial-form__hint\">Searching\u2026</span>\n            }\n            @if (patientHits().length) {\n              <ul class=\"dial-form__hits\" role=\"listbox\">\n                @for (hit of patientHits(); track hit.patientId) {\n                  <li>\n                    <button\n                      type=\"button\"\n                      class=\"dial-form__hit\"\n                      role=\"option\"\n                      (click)=\"selectPatient(hit)\"\n                    >\n                      <span class=\"dial-form__hit-name\">{{ hit.fullName }}</span>\n                      <span class=\"dial-form__hit-meta\">\n                        {{ hit.phone || 'No phone' }}\n                        @if (hit.dob) {\n                          \u00B7 {{ hit.dob }}\n                        }\n                      </span>\n                    </button>\n                  </li>\n                }\n              </ul>\n            }\n          }\n        </div>\n\n        @if (selectedPatient()) {\n          <div class=\"dial-form__field\">\n            <span class=\"eds-label\">Appointment</span>\n            @if (loadingAppointments()) {\n              <span class=\"dial-form__hint\">Loading appointments\u2026</span>\n            } @else if (!appointments().length) {\n              <span class=\"dial-form__hint\">No upcoming appointments \u2014 dial without one, or enter details below.</span>\n            } @else {\n              <ul class=\"dial-form__appts\">\n                <li>\n                  <label class=\"dial-form__appt\">\n                    <input\n                      type=\"radio\"\n                      name=\"appointmentId\"\n                      [checked]=\"!selectedAppointmentId()\"\n                      (change)=\"selectAppointment(null)\"\n                      autocomplete=\"off\"\n                     />\n                    <span>No appointment (purpose-only)</span>\n                  </label>\n                </li>\n                @for (appt of appointments(); track appt.appointmentId) {\n                  <li>\n                    <label class=\"dial-form__appt\">\n                      <input\n                        type=\"radio\"\n                        name=\"appointmentId\"\n                        [checked]=\"selectedAppointmentId() === appt.appointmentId\"\n                        (change)=\"selectAppointment(appt)\"\n                        autocomplete=\"off\"\n                       />\n                      <span class=\"dial-form__appt-body\">\n                        <strong>\n                          {{ appt.startTime ? (appt.startTime | date: 'medium') : 'TBD' }}\n                        </strong>\n                        <span class=\"dial-form__hit-meta\">\n                          {{ appt.providerName || 'Provider TBD' }}\n                          @if (appt.locationName) {\n                            \u00B7 {{ appt.locationName }}\n                          }\n                          @if (appt.visitType) {\n                            \u00B7 {{ appt.visitType }}\n                          }\n                          @if (appt.status) {\n                            \u00B7 {{ appt.status }}\n                          }\n                        </span>\n                      </span>\n                    </label>\n                  </li>\n                }\n              </ul>\n            }\n          </div>\n        }\n\n        <button\n          type=\"button\"\n          class=\"dial-form__toggle\"\n          (click)=\"showManualEntry.set(!showManualEntry())\"\n        >\n          {{ showManualEntry() ? 'Hide' : 'Show' }} phone / name\n          @if (!selectedPatient()) {\n            (required if no patient selected)\n          }\n        </button>\n\n        @if (showManualEntry() || !selectedPatient()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">Phone <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"tel\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"phone\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"phone\"\n              placeholder=\"+14155550100\"\n              autocomplete=\"off\"\n              required\n             />\n            <span class=\"dial-form__hint\">E.164 format, e.g. +14155550100</span>\n          </label>\n\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">Patient name <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"text\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"name\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"name\"\n              placeholder=\"Maria Garcia\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        <label class=\"dial-form__field\">\n          <span class=\"eds-label\">Purpose <span class=\"dial-form__req\">*</span></span>\n          <select\n            class=\"dial-form__input\"\n            [(ngModel)]=\"purposeId\"\n            name=\"purposeId\"\n            (ngModelChange)=\"onPurposeChange()\"\n            required\n            autocomplete=\"off\"\n          >\n            @for (p of purposes(); track p.purposeId) {\n              <option [value]=\"p.purposeId\">{{ p.label }}</option>\n            }\n          </select>\n        </label>\n\n        @if (showsField('appointmentDate') && !selectedAppointmentId()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">{{ requiredFieldLabel('appointmentDate') }} <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"date\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"appointmentDate\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"appointmentDate\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        @if (showsField('appointmentTime') && !selectedAppointmentId()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">{{ requiredFieldLabel('appointmentTime') }} <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"time\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"appointmentTime\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"appointmentTime\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        @if (showsField('providerName') && !selectedAppointmentId()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">{{ requiredFieldLabel('providerName') }} <span class=\"dial-form__req\">*</span></span>\n            <input\n              type=\"text\"\n              class=\"dial-form__input\"\n              [(ngModel)]=\"providerName\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"providerName\"\n              placeholder=\"Dr. Patel\"\n              required\n              autocomplete=\"off\"\n             />\n          </label>\n        }\n\n        @if (selectedAppointmentId() && (showsField('appointmentDate') || showsField('appointmentTime') || showsField('providerName'))) {\n          <p class=\"dial-form__hint\">\n            Date, time, and provider are taken from the selected appointment\n            @if (appointmentDate || appointmentTime || providerName) {\n              ({{ appointmentDate }}\n              @if (appointmentTime) {\n                {{ appointmentTime }}\n              }\n              @if (providerName) {\n                \u00B7 {{ providerName }}\n              })\n            }.\n          </p>\n        }\n\n        @if (showsCustomScript()) {\n          <label class=\"dial-form__field\">\n            <span class=\"eds-label\">\n              Custom script\n              @if (customScriptRequired()) {\n                <span class=\"dial-form__req\">*</span>\n              }\n            </span>\n            <textarea\n              class=\"dial-form__textarea\"\n              rows=\"4\"\n              [(ngModel)]=\"customScript\"\n              (ngModelChange)=\"touchForm()\"\n              name=\"customScript\"\n              [required]=\"customScriptRequired()\"\n              placeholder=\"What should the agent say or do?\"\n              autocomplete=\"off\"\n            ></textarea>\n          </label>\n        }\n\n        <section class=\"dial-form__preview eds-card\">\n          <h3 class=\"eds-label\">Opening preview</h3>\n          <p class=\"dial-form__preview-text\">{{ previewText }}</p>\n          @if (selectedAppointmentId()) {\n            <p class=\"dial-form__hint\">\n              Filled from the selected appointment and purpose template. Switch purpose to change the script.\n            </p>\n          } @else {\n            <p class=\"dial-form__hint\">\n              Select an appointment to fill date, time, and provider into this message.\n            </p>\n          }\n        </section>\n\n        @if (serverError()) {\n          <p class=\"dial-form__error\" role=\"alert\">{{ serverError() }}</p>\n        }\n\n        <footer class=\"dial-form__footer\">\n          <eds-button variant=\"secondary\" type=\"button\" (click)=\"close()\" [disabled]=\"submitting()\">\n            Cancel\n          </eds-button>\n          <eds-button variant=\"primary\" type=\"submit\" [disabled]=\"submitting() || !canPlaceCall()\">\n            {{ submitting() ? 'Dialing\u2026' : 'Place call' }}\n          </eds-button>\n        </footer>\n      </form>\n    }\n  </app-modal>\n}\n", styles: [".dial-form{display:flex;flex-direction:column;gap:12px}.dial-form__field{display:flex;flex-direction:column;gap:6px}.dial-form__typeahead{position:relative}.dial-form__input,.dial-form__textarea{padding:8px 10px;border:1px solid var(--eds-border-subtle, #e4e4e7);border-radius:8px;font:inherit}.dial-form__textarea{resize:vertical}.dial-form__hint{font-size:12px;color:var(--eds-text-secondary)}.dial-form__req{color:#dc2626}.dial-form__chip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--eds-border-subtle, #e4e4e7);border-radius:8px;background:var(--eds-surface-muted, #f8fafc)}.dial-form__chip-main{display:flex;flex-direction:column;gap:2px;min-width:0}.dial-form__chip-meta,.dial-form__hit-meta{font-size:12px;color:var(--eds-text-secondary)}.dial-form__chip-clear{flex-shrink:0;border:none;background:transparent;color:var(--eds-primary, #2563eb);font:inherit;font-size:13px;cursor:pointer;padding:4px}.dial-form__hits,.dial-form__appts{list-style:none;margin:0;padding:0;border:1px solid var(--eds-border-subtle, #e4e4e7);border-radius:8px;overflow:hidden;max-height:220px;overflow-y:auto}.dial-form__hits{position:absolute;z-index:5;left:0;right:0;top:calc(100% + 4px);background:var(--eds-surface, #fff);box-shadow:0 8px 24px #0f172a1f}.dial-form__hit{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:10px 12px;border:none;border-bottom:1px solid var(--eds-border-subtle, #f1f5f9);background:transparent;text-align:left;font:inherit;cursor:pointer}.dial-form__hit:hover{background:var(--eds-surface-muted, #f8fafc)}.dial-form__hit-name{font-weight:600}.dial-form__appt{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-bottom:1px solid var(--eds-border-subtle, #f1f5f9);cursor:pointer}.dial-form__appt:last-child,.dial-form__hit:last-child{border-bottom:none}.dial-form__appt-body{display:flex;flex-direction:column;gap:2px}.dial-form__toggle{align-self:flex-start;border:none;background:transparent;color:var(--eds-primary, #2563eb);font:inherit;font-size:13px;cursor:pointer;padding:0}.dial-form__preview{padding:12px;background:var(--eds-surface-muted, #f8fafc)}.dial-form__preview-text{margin:8px 0 0;font-size:14px;line-height:1.5;white-space:pre-wrap}.dial-form__error{color:#b91c1c;font-size:13px;margin:0}.dial-form__footer{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { open: [{
+                type: Input
+            }], closed: [{
+                type: Output
+            }], dialed: [{
+                type: Output
+            }] } });
+
+class DashboardPageComponent {
+    constructor() {
+        this.api = inject(AiReceptionistApiService);
+        this.liveCallsList = inject(LiveCallsListService);
+        this.router = inject(Router);
+        this.route = inject(ActivatedRoute);
+        this.data = signal(null);
+        this.loading = signal(true);
+        this.liveCalls = this.liveCallsList.calls;
+        this.liveCallsLoading = this.liveCallsList.loading;
+        this.liveCallsError = this.liveCallsList.error;
+        this.outboundOpen = signal(false);
+        this.statTiles = [
+            { key: 'activeCalls', label: 'Live calls', icon: 'graphic_eq' },
+            { key: 'answeredToday', label: 'Calls today', icon: 'call' },
+            { key: 'tasksCreated', label: 'Open tasks', icon: 'task_alt' },
+            {
+                key: 'appointmentsBooked',
+                label: 'Appointments booked',
+                icon: 'event_available',
+            },
+            { key: 'completionRate', label: 'AI handled', icon: 'trending_up', suffix: '%' },
+        ];
+        this.isNeedsReview = isNeedsReview;
+        this.callerMetaLine = callerMetaLine;
+        this.resultChipIcon = resultChipIcon;
+        this.historyResultChips = historyResultChips;
+        this.historyResolutionLabel = historyResolutionLabel;
+    }
+    ngOnInit() {
+        this.liveCallsList.start();
+        this.api.getDashboard().subscribe(({ data }) => {
+            this.data.set(data);
+            this.loading.set(false);
+        });
+    }
+    ngOnDestroy() {
+        this.liveCallsList.stop();
+    }
+    statValue(key) {
+        if (key === 'activeCalls') {
+            return this.liveCallsList.calls().length;
+        }
+        return this.data()?.stats[key] ?? 0;
+    }
+    statusTone(status) {
+        const normalized = status || 'ai';
+        const map = {
+            ai: 'brand',
+            'needs-help': 'notice',
+            'human-requested': 'violet',
+            urgent: 'neg',
+            takeover: 'violet',
+            transferring: 'notice',
+        };
+        return map[normalized] ?? 'brand';
+    }
+    statusLabel(status) {
+        return status || 'ai';
+    }
+    historyAvatarTone(row) {
+        if (!row.name?.trim() || /^unknown/i.test(row.name) || row.initials === '?')
+            return 'gray';
+        return 'brand';
+    }
+    resolutionOf(row) {
+        return historyResolution({ outcome: row.outcome, risk: row.risk });
+    }
+    formatDuration(sec) {
+        const m = Math.floor(sec / 60);
+        const s = sec % 60;
+        return `${m}:${s.toString().padStart(2, '0')}`;
+    }
+    exportCsv() {
+        // mock export
+    }
+    openOutboundDial() {
+        this.outboundOpen.set(true);
+    }
+    closeOutboundDial() {
+        this.outboundOpen.set(false);
+    }
+    openHistoryDetail(id) {
+        void this.router.navigate(['../history', id], { relativeTo: this.route });
+    }
+    callDetailLink(callId) {
+        return ['../history', callId];
+    }
+    appointmentDetailLink(callId) {
+        return callId ? ['../history', callId] : ['../history'];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DashboardPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: DashboardPageComponent, isStandalone: true, selector: "eds-dashboard-page", ngImport: i0, template: "<div class=\"eds-page dashboard-page\">\n  <header class=\"dashboard-page__header\">\n    <div>\n      <h1 class=\"eds-h1\">Dashboard</h1>\n      <p class=\"eds-body-sm\">AI receptionist overview and live activity</p>\n    </div>\n    <div class=\"dashboard-page__actions\">\n      <eds-button variant=\"secondary\" (click)=\"exportCsv()\">\n        <eds-icon name=\"download\" [size]=\"18\" /> Export\n      </eds-button>\n      <eds-button variant=\"primary\" (click)=\"openOutboundDial()\">\n        <eds-icon name=\"call_made\" [size]=\"18\" /> New outbound call\n      </eds-button>\n    </div>\n  </header>\n\n  @if (loading()) {\n    <p class=\"eds-body-sm\">Loading dashboard\u2026</p>\n  } @else if (data()) {\n    <section class=\"dashboard-page__stats\">\n      @for (tile of statTiles; track tile.key) {\n        @if (tile.key === 'appointmentsBooked') {\n          <a routerLink=\"../appointments\" class=\"eds-card dashboard-page__stat dashboard-page__stat--link\">\n            <eds-icon [name]=\"tile.icon\" [size]=\"22\" />\n            <span class=\"eds-label\">{{ tile.label }}</span>\n            <span class=\"dashboard-page__stat-value\">\n              {{ statValue(tile.key) }}{{ tile.suffix ?? '' }}\n            </span>\n          </a>\n        } @else if (tile.key === 'activeCalls') {\n          <a routerLink=\"../live\" class=\"eds-card dashboard-page__stat dashboard-page__stat--link\">\n            <eds-icon [name]=\"tile.icon\" [size]=\"22\" />\n            <span class=\"eds-label\">{{ tile.label }}</span>\n            <span class=\"dashboard-page__stat-value\">\n              {{ statValue(tile.key) }}{{ tile.suffix ?? '' }}\n            </span>\n          </a>\n        } @else {\n          <article class=\"eds-card dashboard-page__stat\">\n            <eds-icon [name]=\"tile.icon\" [size]=\"22\" />\n            <span class=\"eds-label\">{{ tile.label }}</span>\n            <span class=\"dashboard-page__stat-value\">\n              {{ statValue(tile.key) }}{{ tile.suffix ?? '' }}\n            </span>\n          </article>\n        }\n      }\n    </section>\n\n    <section class=\"dashboard-page__grid\">\n      <article class=\"eds-card dashboard-page__panel\">\n        <header class=\"dashboard-page__panel-head\">\n          <h2 class=\"eds-h2\">Live calls</h2>\n          <eds-pulse-dot />\n        </header>\n        <ul class=\"dashboard-page__live-list\">\n          @if (liveCallsError()) {\n            <li class=\"dashboard-page__live-error eds-body-sm\" role=\"alert\">{{ liveCallsError() }}</li>\n          }\n          @if (liveCallsLoading() && liveCalls().length === 0) {\n            <li class=\"eds-body-sm\">Loading live calls\u2026</li>\n          }\n          @for (call of liveCalls(); track call.id) {\n            <li>\n              <a [routerLink]=\"['../live', call.id]\" class=\"dashboard-page__live-row\">\n                <eds-avatar [initials]=\"call.initials\" tone=\"brand\" />\n                <div class=\"dashboard-page__live-meta\">\n                  <span class=\"eds-body-sm-bold\">{{ call.name }}</span>\n                  <span class=\"eds-body-sm\">{{ call.reason }}</span>\n                </div>\n                <span class=\"eds-mono-sm\">{{ call.started | edsElapsed }}</span>\n              </a>\n            </li>\n          } @empty {\n            @if (!liveCallsLoading()) {\n              <li class=\"eds-body-sm\">No active calls right now.</li>\n            }\n          }\n        </ul>\n      </article>\n\n      <article class=\"eds-card dashboard-page__panel\">\n        <header class=\"dashboard-page__panel-head\">\n          <h2 class=\"eds-h2\">Tasks created</h2>\n          <a routerLink=\"../tasks\" class=\"eds-body-sm\">View all</a>\n        </header>\n        <ul class=\"dashboard-page__attention-list\">\n          @for (task of data()!.latestTasks; track task.id) {\n            <li>\n              <a\n                [routerLink]=\"task.callId ? callDetailLink(task.callId) : ['../tasks']\"\n                class=\"dashboard-page__attention-row\"\n                [attr.aria-label]=\"'View task: ' + task.title\"\n              >\n               \n                <div>\n                  <span class=\"eds-body-sm-bold\">{{ task.title }}</span>\n                  <span class=\"eds-body-sm\">\n                    {{ task.patient }} \u00B7 {{ task.created | date: 'short' }}\n                  </span>\n                </div>\n                <eds-icon name=\"chevron_right\" [size]=\"20\" />\n              </a>\n            </li>\n          } @empty {\n            <li class=\"eds-body-sm\">No AI-created tasks yet.</li>\n          }\n        </ul>\n      </article>\n\n      <article class=\"eds-card dashboard-page__panel\">\n        <header class=\"dashboard-page__panel-head\">\n          <h2 class=\"eds-h2\">Appointments created</h2>\n          <a routerLink=\"../appointments\" class=\"eds-body-sm\">View all</a>\n        </header>\n        <ul class=\"dashboard-page__attention-list\">\n          @for (appointment of data()!.latestAppointments; track appointment.id) {\n            <li>\n              <a\n                [routerLink]=\"appointmentDetailLink(appointment.callId)\"\n                class=\"dashboard-page__attention-row\"\n                [attr.aria-label]=\"'View appointment for ' + appointment.patientName\"\n              >\n          \n                <div>\n                  <span class=\"eds-body-sm-bold\">{{ appointment.patientName }}</span>\n                  <span class=\"eds-body-sm\">\n                    {{ appointment.providerName ?? 'Provider not assigned' }}\n                    \u00B7 {{ appointment.startTime ? (appointment.startTime | date: 'short') : 'Time pending' }}\n                  </span>\n                </div>\n                <eds-icon name=\"chevron_right\" [size]=\"20\" />\n              </a>\n            </li>\n          } @empty {\n            <li class=\"eds-body-sm\">No AI-booked appointments yet.</li>\n          }\n        </ul>\n      </article>\n\n    </section>\n\n    <article class=\"eds-card dashboard-page__history\">\n      <header class=\"dashboard-page__panel-head\">\n        <h2 class=\"eds-h2\">Recent Call History</h2>\n        <a routerLink=\"../history\" class=\"eds-body-sm\">View all</a>\n      </header>\n      <div class=\"dashboard-page__history-wrap\">\n        <table class=\"dashboard-page__history-table\">\n          <thead>\n            <tr>\n              <th>Time</th>\n              <th>Patient/Caller</th>\n              <th></th>\n              <th>Goal Timeline</th>\n              <th>Handled By</th>\n              <th>Resolution</th>\n              <th>Result</th>\n              <th>Duration</th>\n              <th>Reviewed</th>\n            </tr>\n          </thead>\n          <tbody>\n            @for (row of data()!.recentHistory; track row.id) {\n              <tr\n                class=\"dashboard-page__history-row\"\n                [class.dashboard-page__history-row--needs-review]=\"isNeedsReview(row.review)\"\n                tabindex=\"0\"\n                role=\"link\"\n                [attr.aria-label]=\"'View call details for ' + row.name\"\n                (click)=\"openHistoryDetail(row.id)\"\n                (keyup.enter)=\"openHistoryDetail(row.id)\"\n              >\n                <td>\n                  <div class=\"dashboard-page__time\">\n                    @if (row.started) {\n                      <span class=\"dashboard-page__time-main\">{{ row.started | date: 'shortTime' }}</span>\n                      <span class=\"dashboard-page__time-sub\">{{ row.started | date: 'MMM d, y' }}</span>\n                    } @else {\n                      <span class=\"dashboard-page__time-main\">{{ row.whenLabel || '\u2014' }}</span>\n                    }\n                  </div>\n                </td>\n\n                <td>\n                  <div class=\"dashboard-page__caller\">\n                    <eds-avatar\n                      class=\"dashboard-page__avatar\"\n                      [initials]=\"row.initials || '?'\"\n                      [tone]=\"historyAvatarTone(row)\"\n                     />\n                    <div class=\"dashboard-page__caller-text\">\n                      <span class=\"dashboard-page__caller-name\">{{ row.name || 'Unknown Caller' }}</span>\n                      <span class=\"dashboard-page__caller-meta\">\n                        {{\n                          callerMetaLine({\n                            dob: row.dob,\n                            age: row.age,\n                            gender: row.gender,\n                            phone: row.phone,\n                            name: row.name,\n                          })\n                        }}\n                      </span>\n                    </div>\n                  </div>\n                </td>\n\n                <td>\n                  <span\n                    class=\"dashboard-page__dir\"\n                    [class.dashboard-page__dir--in]=\"row.direction === 'inbound'\"\n                    [class.dashboard-page__dir--out]=\"row.direction === 'outbound'\"\n                    [attr.title]=\"row.direction === 'inbound' ? 'Inbound' : 'Outbound'\"\n                  >\n                    <eds-icon\n                      [name]=\"row.direction === 'inbound' ? 'call_received' : 'call_made'\"\n                      [size]=\"16\"\n                     />\n                  </span>\n                </td>\n\n                <td>\n                  <span class=\"dashboard-page__goal\">{{ row.reason || '\u2014' }}</span>\n                </td>\n\n                <td>\n                  <span\n                    class=\"dashboard-page__handler\"\n                    [class.dashboard-page__handler--ai]=\"(row.handledBy || 'ai') === 'ai'\"\n                    [class.dashboard-page__handler--staff]=\"row.handledBy === 'staff'\"\n                  >\n                    {{ row.handledBy === 'staff' ? 'STAFF' : 'AI' }}\n                  </span>\n                </td>\n\n                <td>\n                  @if (resolutionOf(row); as resolution) {\n                    <span\n                      class=\"dashboard-page__resolution\"\n                      [class.dashboard-page__resolution--ok]=\"resolution === 'resolved'\"\n                      [class.dashboard-page__resolution--attn]=\"resolution === 'needs_attention'\"\n                    >\n                      {{ historyResolutionLabel(resolution) }}\n                    </span>\n                  }\n                </td>\n\n                <td>\n                  <div class=\"dashboard-page__results\">\n                    @for (chip of historyResultChips(row.results, row.outcome); track chip) {\n                      <span class=\"dashboard-page__result-chip\">\n                        <eds-icon [name]=\"resultChipIcon(chip)\" [size]=\"14\" />\n                        {{ chip }}\n                      </span>\n                    } @empty {\n                      <span class=\"dashboard-page__muted\">\u2014</span>\n                    }\n                  </div>\n                </td>\n\n                <td class=\"dashboard-page__duration\">\n                  {{ row.durationLabel ?? formatDuration(row.duration) }}\n                </td>\n\n                <td class=\"dashboard-page__reviewed\">\n                  @if (row.review === 'reviewed') {\n                    <span class=\"dashboard-page__reviewed-ok\" title=\"Reviewed\">\n                      <eds-icon name=\"check_circle\" [size]=\"20\" />\n                    </span>\n                  }\n                </td>\n              </tr>\n            } @empty {\n              <tr>\n                <td colspan=\"9\" class=\"dashboard-page__muted\">No recent calls.</td>\n              </tr>\n            }\n          </tbody>\n        </table>\n      </div>\n    </article>\n  }\n</div>\n\n<eds-outbound-dial-modal\n  [open]=\"outboundOpen()\"\n  (closed)=\"closeOutboundDial()\"\n  (dialed)=\"closeOutboundDial()\"\n/>\n", styles: [".dashboard-page__header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:24px}.dashboard-page__actions{display:flex;gap:8px;flex-shrink:0}.dashboard-page__stats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:20px}.dashboard-page__stat{display:flex;flex-direction:column;gap:6px;padding:16px}.dashboard-page__stat--link{text-decoration:none;color:inherit;cursor:pointer;transition:border-color .15s ease}.dashboard-page__stat--link:hover{border-color:var(--eds-text-brand)}.dashboard-page__review-queue{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;margin-bottom:20px;border-left:4px solid #f59e0b}.dashboard-page__review-link{white-space:nowrap;font-weight:600;text-decoration:none;color:var(--eds-text-brand)}.dashboard-page__row--needs-review{border-left:3px solid #f59e0b}.dashboard-page__history-wrap{overflow-x:auto}.dashboard-page__history-table{width:100%;border-collapse:collapse;min-width:980px}.dashboard-page__history-table thead th{text-align:left;padding:12px 14px;font-family:var(--eds-font-inter, \"Inter\", sans-serif);font-size:13px;font-weight:600;letter-spacing:normal;text-transform:none;color:var(--eds-text-table-header, #4d5573);background:#f4f4f5;border-bottom:1px solid var(--eds-border-default, #e4e4e7);white-space:nowrap}.dashboard-page__history-table tbody td{padding:14px;vertical-align:middle;border-bottom:1px solid #f1f5f9;font-family:var(--eds-font-inter, \"Inter\", sans-serif);font-size:13px;font-weight:400;color:var(--eds-text-primary, #18181b)}.dashboard-page__history-row{cursor:pointer}.dashboard-page__history-row:hover td{background:#fafafa}.dashboard-page__history-row:focus-visible{outline:2px solid var(--eds-brand-500, #2563eb);outline-offset:-2px}.dashboard-page__history-row--needs-review td:first-child{box-shadow:inset 3px 0 #f59e0b}.dashboard-page__time{display:flex;flex-direction:column;gap:2px;white-space:nowrap}.dashboard-page__time-main{font-weight:600;font-size:13px}.dashboard-page__time-sub{font-size:12px;color:var(--eds-text-secondary, #71717a)}.dashboard-page__caller{display:flex;align-items:center;gap:10px;min-width:200px}.dashboard-page__avatar ::ng-deep .eds-avatar{width:36px;height:36px;border-radius:10px;font-size:12px}.dashboard-page__caller-text{display:flex;flex-direction:column;gap:2px;min-width:0}.dashboard-page__caller-name{font-weight:600;font-size:13px;color:#18181b}.dashboard-page__caller-meta{font-size:12px;color:var(--eds-text-secondary, #71717a);white-space:nowrap}.dashboard-page__dir{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px}.dashboard-page__dir--in{background:#eff6ff;color:#2563eb}.dashboard-page__dir--out{background:#f5f3ff;color:#7c3aed}.dashboard-page__goal{font-size:13px;color:#3f3f46}.dashboard-page__handler{display:inline-flex;align-items:center;padding:3px 8px;border-radius:6px;font-size:12px;font-weight:500}.dashboard-page__handler--ai{background:#f5f3ff;color:#7c3aed}.dashboard-page__handler--staff{background:#eff6ff;color:#2563eb}.dashboard-page__resolution{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap}.dashboard-page__resolution--ok{background:#ecfdf5;color:#047857}.dashboard-page__resolution--attn{background:#fff7ed;color:#c2410c}.dashboard-page__results{display:flex;flex-wrap:wrap;gap:6px;max-width:260px}.dashboard-page__result-chip{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:6px;background:#f4f4f5;color:#52525b;font-size:11px;font-weight:500;white-space:nowrap}.dashboard-page__duration{font-variant-numeric:tabular-nums;font-size:13px;color:#3f3f46;white-space:nowrap}.dashboard-page__reviewed{text-align:center;width:56px}.dashboard-page__reviewed-ok{display:inline-flex;color:#16a34a}.dashboard-page__muted{color:var(--eds-text-secondary, #71717a);font-size:13px}.dashboard-page__attention-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:8px;border-radius:var(--eds-radius-md);text-decoration:none;color:inherit;border-bottom:1px solid var(--eds-border-default)}.dashboard-page__attention-row:hover{background:var(--eds-surface-l1)}.dashboard-page__attention-row:last-child{border-bottom:none}.dashboard-page__stat-value{font-size:28px;font-weight:600;color:var(--eds-text-primary);letter-spacing:-.02em}.dashboard-page__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-bottom:20px}.dashboard-page__panel{padding:16px}.dashboard-page__panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.dashboard-page__live-list,.dashboard-page__attention-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.dashboard-page__live-row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;padding:8px;border-radius:var(--eds-radius-md);text-decoration:none;color:inherit}.dashboard-page__live-row:hover{background:var(--eds-surface-l1)}.dashboard-page__live-meta{display:flex;flex-direction:column;min-width:0}.dashboard-page__history{padding:16px;overflow-x:auto}@media(max-width:1200px){.dashboard-page__stats{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.dashboard-page__stats{grid-template-columns:repeat(2,1fr)}.dashboard-page__grid{grid-template-columns:1fr}}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "component", type: EdsAvatarComponent, selector: "eds-avatar", inputs: ["initials", "tone", "shape", "gradient"] }, { kind: "component", type: EdsButtonComponent, selector: "eds-button", inputs: ["variant", "type", "disabled"] }, { kind: "component", type: EdsIconComponent, selector: "eds-icon", inputs: ["name", "size", "fill", "weight"] }, { kind: "component", type: EdsPulseDotComponent, selector: "eds-pulse-dot" }, { kind: "pipe", type: EdsElapsedPipe, name: "edsElapsed" }, { kind: "component", type: OutboundDialModalComponent, selector: "eds-outbound-dial-modal", inputs: ["open"], outputs: ["closed", "dialed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: DashboardPageComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'eds-dashboard-page', imports: [
+                        RouterLink,
+                        DatePipe,
+                        EdsAvatarComponent,
+                        EdsButtonComponent,
+                        EdsIconComponent,
+                        EdsPulseDotComponent,
+                        EdsElapsedPipe,
+                        OutboundDialModalComponent,
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"eds-page dashboard-page\">\n  <header class=\"dashboard-page__header\">\n    <div>\n      <h1 class=\"eds-h1\">Dashboard</h1>\n      <p class=\"eds-body-sm\">AI receptionist overview and live activity</p>\n    </div>\n    <div class=\"dashboard-page__actions\">\n      <eds-button variant=\"secondary\" (click)=\"exportCsv()\">\n        <eds-icon name=\"download\" [size]=\"18\" /> Export\n      </eds-button>\n      <eds-button variant=\"primary\" (click)=\"openOutboundDial()\">\n        <eds-icon name=\"call_made\" [size]=\"18\" /> New outbound call\n      </eds-button>\n    </div>\n  </header>\n\n  @if (loading()) {\n    <p class=\"eds-body-sm\">Loading dashboard\u2026</p>\n  } @else if (data()) {\n    <section class=\"dashboard-page__stats\">\n      @for (tile of statTiles; track tile.key) {\n        @if (tile.key === 'appointmentsBooked') {\n          <a routerLink=\"../appointments\" class=\"eds-card dashboard-page__stat dashboard-page__stat--link\">\n            <eds-icon [name]=\"tile.icon\" [size]=\"22\" />\n            <span class=\"eds-label\">{{ tile.label }}</span>\n            <span class=\"dashboard-page__stat-value\">\n              {{ statValue(tile.key) }}{{ tile.suffix ?? '' }}\n            </span>\n          </a>\n        } @else if (tile.key === 'activeCalls') {\n          <a routerLink=\"../live\" class=\"eds-card dashboard-page__stat dashboard-page__stat--link\">\n            <eds-icon [name]=\"tile.icon\" [size]=\"22\" />\n            <span class=\"eds-label\">{{ tile.label }}</span>\n            <span class=\"dashboard-page__stat-value\">\n              {{ statValue(tile.key) }}{{ tile.suffix ?? '' }}\n            </span>\n          </a>\n        } @else {\n          <article class=\"eds-card dashboard-page__stat\">\n            <eds-icon [name]=\"tile.icon\" [size]=\"22\" />\n            <span class=\"eds-label\">{{ tile.label }}</span>\n            <span class=\"dashboard-page__stat-value\">\n              {{ statValue(tile.key) }}{{ tile.suffix ?? '' }}\n            </span>\n          </article>\n        }\n      }\n    </section>\n\n    <section class=\"dashboard-page__grid\">\n      <article class=\"eds-card dashboard-page__panel\">\n        <header class=\"dashboard-page__panel-head\">\n          <h2 class=\"eds-h2\">Live calls</h2>\n          <eds-pulse-dot />\n        </header>\n        <ul class=\"dashboard-page__live-list\">\n          @if (liveCallsError()) {\n            <li class=\"dashboard-page__live-error eds-body-sm\" role=\"alert\">{{ liveCallsError() }}</li>\n          }\n          @if (liveCallsLoading() && liveCalls().length === 0) {\n            <li class=\"eds-body-sm\">Loading live calls\u2026</li>\n          }\n          @for (call of liveCalls(); track call.id) {\n            <li>\n              <a [routerLink]=\"['../live', call.id]\" class=\"dashboard-page__live-row\">\n                <eds-avatar [initials]=\"call.initials\" tone=\"brand\" />\n                <div class=\"dashboard-page__live-meta\">\n                  <span class=\"eds-body-sm-bold\">{{ call.name }}</span>\n                  <span class=\"eds-body-sm\">{{ call.reason }}</span>\n                </div>\n                <span class=\"eds-mono-sm\">{{ call.started | edsElapsed }}</span>\n              </a>\n            </li>\n          } @empty {\n            @if (!liveCallsLoading()) {\n              <li class=\"eds-body-sm\">No active calls right now.</li>\n            }\n          }\n        </ul>\n      </article>\n\n      <article class=\"eds-card dashboard-page__panel\">\n        <header class=\"dashboard-page__panel-head\">\n          <h2 class=\"eds-h2\">Tasks created</h2>\n          <a routerLink=\"../tasks\" class=\"eds-body-sm\">View all</a>\n        </header>\n        <ul class=\"dashboard-page__attention-list\">\n          @for (task of data()!.latestTasks; track task.id) {\n            <li>\n              <a\n                [routerLink]=\"task.callId ? callDetailLink(task.callId) : ['../tasks']\"\n                class=\"dashboard-page__attention-row\"\n                [attr.aria-label]=\"'View task: ' + task.title\"\n              >\n               \n                <div>\n                  <span class=\"eds-body-sm-bold\">{{ task.title }}</span>\n                  <span class=\"eds-body-sm\">\n                    {{ task.patient }} \u00B7 {{ task.created | date: 'short' }}\n                  </span>\n                </div>\n                <eds-icon name=\"chevron_right\" [size]=\"20\" />\n              </a>\n            </li>\n          } @empty {\n            <li class=\"eds-body-sm\">No AI-created tasks yet.</li>\n          }\n        </ul>\n      </article>\n\n      <article class=\"eds-card dashboard-page__panel\">\n        <header class=\"dashboard-page__panel-head\">\n          <h2 class=\"eds-h2\">Appointments created</h2>\n          <a routerLink=\"../appointments\" class=\"eds-body-sm\">View all</a>\n        </header>\n        <ul class=\"dashboard-page__attention-list\">\n          @for (appointment of data()!.latestAppointments; track appointment.id) {\n            <li>\n              <a\n                [routerLink]=\"appointmentDetailLink(appointment.callId)\"\n                class=\"dashboard-page__attention-row\"\n                [attr.aria-label]=\"'View appointment for ' + appointment.patientName\"\n              >\n          \n                <div>\n                  <span class=\"eds-body-sm-bold\">{{ appointment.patientName }}</span>\n                  <span class=\"eds-body-sm\">\n                    {{ appointment.providerName ?? 'Provider not assigned' }}\n                    \u00B7 {{ appointment.startTime ? (appointment.startTime | date: 'short') : 'Time pending' }}\n                  </span>\n                </div>\n                <eds-icon name=\"chevron_right\" [size]=\"20\" />\n              </a>\n            </li>\n          } @empty {\n            <li class=\"eds-body-sm\">No AI-booked appointments yet.</li>\n          }\n        </ul>\n      </article>\n\n    </section>\n\n    <article class=\"eds-card dashboard-page__history\">\n      <header class=\"dashboard-page__panel-head\">\n        <h2 class=\"eds-h2\">Recent Call History</h2>\n        <a routerLink=\"../history\" class=\"eds-body-sm\">View all</a>\n      </header>\n      <div class=\"dashboard-page__history-wrap\">\n        <table class=\"dashboard-page__history-table\">\n          <thead>\n            <tr>\n              <th>Time</th>\n              <th>Patient/Caller</th>\n              <th></th>\n              <th>Goal Timeline</th>\n              <th>Handled By</th>\n              <th>Resolution</th>\n              <th>Result</th>\n              <th>Duration</th>\n              <th>Reviewed</th>\n            </tr>\n          </thead>\n          <tbody>\n            @for (row of data()!.recentHistory; track row.id) {\n              <tr\n                class=\"dashboard-page__history-row\"\n                [class.dashboard-page__history-row--needs-review]=\"isNeedsReview(row.review)\"\n                tabindex=\"0\"\n                role=\"link\"\n                [attr.aria-label]=\"'View call details for ' + row.name\"\n                (click)=\"openHistoryDetail(row.id)\"\n                (keyup.enter)=\"openHistoryDetail(row.id)\"\n              >\n                <td>\n                  <div class=\"dashboard-page__time\">\n                    @if (row.started) {\n                      <span class=\"dashboard-page__time-main\">{{ row.started | date: 'shortTime' }}</span>\n                      <span class=\"dashboard-page__time-sub\">{{ row.started | date: 'MMM d, y' }}</span>\n                    } @else {\n                      <span class=\"dashboard-page__time-main\">{{ row.whenLabel || '\u2014' }}</span>\n                    }\n                  </div>\n                </td>\n\n                <td>\n                  <div class=\"dashboard-page__caller\">\n                    <eds-avatar\n                      class=\"dashboard-page__avatar\"\n                      [initials]=\"row.initials || '?'\"\n                      [tone]=\"historyAvatarTone(row)\"\n                     />\n                    <div class=\"dashboard-page__caller-text\">\n                      <span class=\"dashboard-page__caller-name\">{{ row.name || 'Unknown Caller' }}</span>\n                      <span class=\"dashboard-page__caller-meta\">\n                        {{\n                          callerMetaLine({\n                            dob: row.dob,\n                            age: row.age,\n                            gender: row.gender,\n                            phone: row.phone,\n                            name: row.name,\n                          })\n                        }}\n                      </span>\n                    </div>\n                  </div>\n                </td>\n\n                <td>\n                  <span\n                    class=\"dashboard-page__dir\"\n                    [class.dashboard-page__dir--in]=\"row.direction === 'inbound'\"\n                    [class.dashboard-page__dir--out]=\"row.direction === 'outbound'\"\n                    [attr.title]=\"row.direction === 'inbound' ? 'Inbound' : 'Outbound'\"\n                  >\n                    <eds-icon\n                      [name]=\"row.direction === 'inbound' ? 'call_received' : 'call_made'\"\n                      [size]=\"16\"\n                     />\n                  </span>\n                </td>\n\n                <td>\n                  <span class=\"dashboard-page__goal\">{{ row.reason || '\u2014' }}</span>\n                </td>\n\n                <td>\n                  <span\n                    class=\"dashboard-page__handler\"\n                    [class.dashboard-page__handler--ai]=\"(row.handledBy || 'ai') === 'ai'\"\n                    [class.dashboard-page__handler--staff]=\"row.handledBy === 'staff'\"\n                  >\n                    {{ row.handledBy === 'staff' ? 'STAFF' : 'AI' }}\n                  </span>\n                </td>\n\n                <td>\n                  @if (resolutionOf(row); as resolution) {\n                    <span\n                      class=\"dashboard-page__resolution\"\n                      [class.dashboard-page__resolution--ok]=\"resolution === 'resolved'\"\n                      [class.dashboard-page__resolution--attn]=\"resolution === 'needs_attention'\"\n                    >\n                      {{ historyResolutionLabel(resolution) }}\n                    </span>\n                  }\n                </td>\n\n                <td>\n                  <div class=\"dashboard-page__results\">\n                    @for (chip of historyResultChips(row.results, row.outcome); track chip) {\n                      <span class=\"dashboard-page__result-chip\">\n                        <eds-icon [name]=\"resultChipIcon(chip)\" [size]=\"14\" />\n                        {{ chip }}\n                      </span>\n                    } @empty {\n                      <span class=\"dashboard-page__muted\">\u2014</span>\n                    }\n                  </div>\n                </td>\n\n                <td class=\"dashboard-page__duration\">\n                  {{ row.durationLabel ?? formatDuration(row.duration) }}\n                </td>\n\n                <td class=\"dashboard-page__reviewed\">\n                  @if (row.review === 'reviewed') {\n                    <span class=\"dashboard-page__reviewed-ok\" title=\"Reviewed\">\n                      <eds-icon name=\"check_circle\" [size]=\"20\" />\n                    </span>\n                  }\n                </td>\n              </tr>\n            } @empty {\n              <tr>\n                <td colspan=\"9\" class=\"dashboard-page__muted\">No recent calls.</td>\n              </tr>\n            }\n          </tbody>\n        </table>\n      </div>\n    </article>\n  }\n</div>\n\n<eds-outbound-dial-modal\n  [open]=\"outboundOpen()\"\n  (closed)=\"closeOutboundDial()\"\n  (dialed)=\"closeOutboundDial()\"\n/>\n", styles: [".dashboard-page__header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:24px}.dashboard-page__actions{display:flex;gap:8px;flex-shrink:0}.dashboard-page__stats{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:20px}.dashboard-page__stat{display:flex;flex-direction:column;gap:6px;padding:16px}.dashboard-page__stat--link{text-decoration:none;color:inherit;cursor:pointer;transition:border-color .15s ease}.dashboard-page__stat--link:hover{border-color:var(--eds-text-brand)}.dashboard-page__review-queue{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;margin-bottom:20px;border-left:4px solid #f59e0b}.dashboard-page__review-link{white-space:nowrap;font-weight:600;text-decoration:none;color:var(--eds-text-brand)}.dashboard-page__row--needs-review{border-left:3px solid #f59e0b}.dashboard-page__history-wrap{overflow-x:auto}.dashboard-page__history-table{width:100%;border-collapse:collapse;min-width:980px}.dashboard-page__history-table thead th{text-align:left;padding:12px 14px;font-family:var(--eds-font-inter, \"Inter\", sans-serif);font-size:13px;font-weight:600;letter-spacing:normal;text-transform:none;color:var(--eds-text-table-header, #4d5573);background:#f4f4f5;border-bottom:1px solid var(--eds-border-default, #e4e4e7);white-space:nowrap}.dashboard-page__history-table tbody td{padding:14px;vertical-align:middle;border-bottom:1px solid #f1f5f9;font-family:var(--eds-font-inter, \"Inter\", sans-serif);font-size:13px;font-weight:400;color:var(--eds-text-primary, #18181b)}.dashboard-page__history-row{cursor:pointer}.dashboard-page__history-row:hover td{background:#fafafa}.dashboard-page__history-row:focus-visible{outline:2px solid var(--eds-brand-500, #2563eb);outline-offset:-2px}.dashboard-page__history-row--needs-review td:first-child{box-shadow:inset 3px 0 #f59e0b}.dashboard-page__time{display:flex;flex-direction:column;gap:2px;white-space:nowrap}.dashboard-page__time-main{font-weight:600;font-size:13px}.dashboard-page__time-sub{font-size:12px;color:var(--eds-text-secondary, #71717a)}.dashboard-page__caller{display:flex;align-items:center;gap:10px;min-width:200px}.dashboard-page__avatar ::ng-deep .eds-avatar{width:36px;height:36px;border-radius:10px;font-size:12px}.dashboard-page__caller-text{display:flex;flex-direction:column;gap:2px;min-width:0}.dashboard-page__caller-name{font-weight:600;font-size:13px;color:#18181b}.dashboard-page__caller-meta{font-size:12px;color:var(--eds-text-secondary, #71717a);white-space:nowrap}.dashboard-page__dir{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px}.dashboard-page__dir--in{background:#eff6ff;color:#2563eb}.dashboard-page__dir--out{background:#f5f3ff;color:#7c3aed}.dashboard-page__goal{font-size:13px;color:#3f3f46}.dashboard-page__handler{display:inline-flex;align-items:center;padding:3px 8px;border-radius:6px;font-size:12px;font-weight:500}.dashboard-page__handler--ai{background:#f5f3ff;color:#7c3aed}.dashboard-page__handler--staff{background:#eff6ff;color:#2563eb}.dashboard-page__resolution{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap}.dashboard-page__resolution--ok{background:#ecfdf5;color:#047857}.dashboard-page__resolution--attn{background:#fff7ed;color:#c2410c}.dashboard-page__results{display:flex;flex-wrap:wrap;gap:6px;max-width:260px}.dashboard-page__result-chip{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:6px;background:#f4f4f5;color:#52525b;font-size:11px;font-weight:500;white-space:nowrap}.dashboard-page__duration{font-variant-numeric:tabular-nums;font-size:13px;color:#3f3f46;white-space:nowrap}.dashboard-page__reviewed{text-align:center;width:56px}.dashboard-page__reviewed-ok{display:inline-flex;color:#16a34a}.dashboard-page__muted{color:var(--eds-text-secondary, #71717a);font-size:13px}.dashboard-page__attention-row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:8px;border-radius:var(--eds-radius-md);text-decoration:none;color:inherit;border-bottom:1px solid var(--eds-border-default)}.dashboard-page__attention-row:hover{background:var(--eds-surface-l1)}.dashboard-page__attention-row:last-child{border-bottom:none}.dashboard-page__stat-value{font-size:28px;font-weight:600;color:var(--eds-text-primary);letter-spacing:-.02em}.dashboard-page__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-bottom:20px}.dashboard-page__panel{padding:16px}.dashboard-page__panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.dashboard-page__live-list,.dashboard-page__attention-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.dashboard-page__live-row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;padding:8px;border-radius:var(--eds-radius-md);text-decoration:none;color:inherit}.dashboard-page__live-row:hover{background:var(--eds-surface-l1)}.dashboard-page__live-meta{display:flex;flex-direction:column;min-width:0}.dashboard-page__history{padding:16px;overflow-x:auto}@media(max-width:1200px){.dashboard-page__stats{grid-template-columns:repeat(3,1fr)}}@media(max-width:900px){.dashboard-page__stats{grid-template-columns:repeat(2,1fr)}.dashboard-page__grid{grid-template-columns:1fr}}\n"] }]
+        }] });
+
+export { DashboardPageComponent };
+//# sourceMappingURL=edvak99-voice-receptionist-widget-dashboard-page.component-CxbO0eDS.mjs.map