@edvak99/voice-receptionist-widget 1.1.2 → 1.1.4

package/lib/services/staff-media.service.d.ts

@@ -0,0 +1,52 @@
+import { StaffMediaJoinResult, StaffMediaMode } from '../models/staff-media.types';
+import * as i0 from "@angular/core";
+export type StaffMediaConnectionState = 'idle' | 'connecting' | 'connected' | 'disconnecting' | 'error';
+/**
+ * Browser softphone for staff Listen / Take Over via LiveKit.
+ * Secrets stay on the server — FE only uses short-lived clientToken + livekitUrl.
+ *
+ * Root-provided on purpose: the session must survive navigating away from the
+ * Live Monitor page, otherwise switching dashboard tabs would drop the call.
+ */
+export declare class StaffMediaService {
+    readonly connectionState: import("@angular/core").WritableSignal<StaffMediaConnectionState>;
+    readonly mode: import("@angular/core").WritableSignal<StaffMediaMode | null>;
+    readonly micEnabled: import("@angular/core").WritableSignal<boolean>;
+    readonly error: import("@angular/core").WritableSignal<string | null>;
+    readonly activeCallId: import("@angular/core").WritableSignal<string | null>;
+    /** False when the browser blocks autoplay — UI should offer an "enable sound" action. */
+    readonly audioPlaybackAllowed: import("@angular/core").WritableSignal<boolean>;
+    /** True once remote caller audio is actually attached and playing. */
+    readonly remoteAudioAttached: import("@angular/core").WritableSignal<boolean>;
+    private room;
+    private audioContainer;
+    private readonly attached;
+    get isConnected(): boolean;
+    /** True when a softphone session is live for this call, regardless of page. */
+    isConnectedTo(callId: string): boolean;
+    /**
+     * getUserMedia only exists in a secure context (https or localhost) and, inside an
+     * iframe, requires allow="microphone". Returns null when capture is possible.
+     */
+    microphoneBlockedReason(): string | null;
+    join(join: StaffMediaJoinResult): Promise<void>;
+    setMicrophoneEnabled(enabled: boolean): Promise<void>;
+    toggleMicrophone(): Promise<void>;
+    /** Retry blocked autoplay — must be called from a user gesture. */
+    startAudioPlayback(): Promise<void>;
+    disconnect(): Promise<void>;
+    private readonly onTrackSubscribed;
+    private readonly onTrackUnsubscribed;
+    private readonly onParticipantDisconnected;
+    /** Staff tracks are dropped server-side as soon as they appear. */
+    private readonly onTrackPublished;
+    private attachExistingRemoteTracks;
+    private isStaff;
+    private detachKey;
+    private ensureAudioContainer;
+    private enableMicrophone;
+    private friendlyError;
+    private cleanupLocal;
+    static ɵfac: i0.ɵɵFactoryDeclaration<StaffMediaService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<StaffMediaService>;
+}

package/lib/ui/eds-avatar.component.d.ts

@@ -1,8 +1,11 @@
 import * as i0 from "@angular/core";
+export type EdsAvatarTone = 'gray' | 'brand' | 'green' | 'amber' | 'violet' | 'rose';
+export type EdsAvatarShape = 'circle' | 'box';
 export declare class EdsAvatarComponent {
     readonly initials: import("@angular/core").InputSignal<string>;
-    readonly tone: import("@angular/core").InputSignal<"brand" | "gray">;
+    readonly tone: import("@angular/core").InputSignal<string>;
+    readonly shape: import("@angular/core").InputSignal<EdsAvatarShape>;
     readonly gradient: import("@angular/core").InputSignal<boolean>;
     static ɵfac: i0.ɵɵFactoryDeclaration<EdsAvatarComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<EdsAvatarComponent, "eds-avatar", never, { "initials": { "alias": "initials"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "gradient": { "alias": "gradient"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<EdsAvatarComponent, "eds-avatar", never, { "initials": { "alias": "initials"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "gradient": { "alias": "gradient"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
 }

package/lib/ui/eds-button.component.d.ts

@@ -2,7 +2,7 @@ import * as i0 from "@angular/core";
 export type ButtonVariant = 'primary' | 'secondary' | 'ghost' | 'danger' | 'positive';
 export declare class EdsButtonComponent {
     readonly variant: import("@angular/core").InputSignal<ButtonVariant>;
-    readonly type: import("@angular/core").InputSignal<"button" | "submit">;
+    readonly type: import("@angular/core").InputSignal<"submit" | "button">;
     readonly disabled: import("@angular/core").InputSignal<boolean>;
     static ɵfac: i0.ɵɵFactoryDeclaration<EdsButtonComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<EdsButtonComponent, "eds-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;

package/lib/utils/call-history-display.util.d.ts

@@ -0,0 +1,21 @@
+/** Call history table helpers — resolution badges + result chips. */
+export type HistoryResolution = 'resolved' | 'needs_attention';
+export declare function historyResolution(input: {
+    outcome?: string;
+    risk?: 'urgent' | 'review' | null;
+}): HistoryResolution;
+export declare function historyResolutionLabel(resolution: HistoryResolution): string;
+export declare function resultChipIcon(label: string): string;
+export declare function callerMetaLine(input: {
+    dob?: string | null;
+    age?: number | null;
+    gender?: string | null;
+    phone?: string | null;
+    name?: string | null;
+    matched?: boolean;
+}): string;
+/** Age in whole years from YYYY-MM-DD (or partial ISO). */
+export declare function ageFromDob(dob: string | null | undefined, at?: Date): number | null;
+export declare function isUnknownCaller(name: string | null | undefined, matched?: boolean): boolean;
+/** Derive result chips from explicit actions, else from outcome text. */
+export declare function historyResultChips(results: string[] | undefined, outcome: string): string[];

package/lib/utils/outbound-purpose.util.d.ts

@@ -3,12 +3,31 @@ export declare const REQUIRED_FIELD_OPTIONS: {
     value: OutboundRequiredField;
     label: string;
 }[];
+/** Live dialer values used to fill opening-template tokens. */
+export interface OpeningPreviewValues {
+    patientName?: string;
+    appointmentDate?: string;
+    appointmentTime?: string;
+    providerName?: string;
+    practiceName?: string;
+    locationName?: string;
+    visitType?: string;
+    customScript?: string;
+}
 export declare function requiredFieldLabel(field: OutboundRequiredField): string;
 export declare function formatRequiredFields(fields: OutboundRequiredField[]): string;
 /** Substitute placeholder tokens with sample values. */
 export declare function substitutePlaceholders(text: string, placeholders: OutboundPurposePlaceholder[]): string;
 /** Live preview: sampleOpening if set, else openingTemplate with substitutions. */
 export declare function renderOpeningPreview(sampleOpening: string, openingTemplate: string, placeholders: OutboundPurposePlaceholder[]): string;
+/**
+ * Dialer preview: prefer openingTemplate and fill with live patient/appointment values.
+ * Unfilled tokens show as [Label] so staff see what is still missing.
+ */
+export declare function renderLiveOpeningPreview(purpose: Pick<OutboundPurpose, 'openingTemplate' | 'sampleOpening' | 'placeholders'>, live: OpeningPreviewValues): string;
+/** Human-friendly date/time for opening lines (from ISO or form fields). */
+export declare function formatOpeningDate(isoOrYmd: string | null | undefined): string;
+export declare function formatOpeningTime(isoOrHm: string | null | undefined, fallbackIso?: string | null): string;
 export declare function purposeShowsCustomScript(purpose: OutboundPurpose): boolean;
 export declare function isCustomScriptRequired(purpose: OutboundPurpose): boolean;
 export declare function isPurposeFormValid(purpose: OutboundPurpose | null, values: Record<string, string>): boolean;

package/lib/utils/transcript-timing.util.d.ts

@@ -14,4 +14,4 @@ export declare function buildTimedTranscript(lines: TranscriptLine[], durationSe
 export declare function activeTranscriptIndex(lines: TimedTranscriptLine[], currentSec: number): number;
 export declare function formatPlaybackTime(seconds: number): string;
 export declare function toolStateClass(state: ToolEvent['state']): string;
-export declare function transcriptRoleLabel(who: TranscriptLine['who']): string;
+export declare function transcriptRoleLabel(who: TranscriptLine['who'], callerName?: string | null, callerMatched?: boolean): string;

package/lib/utils/welcome-message.util.d.ts

@@ -1,5 +1,5 @@
 import { AgentSettings } from '../models/ai-receptionist.types';
-export declare const WELCOME_MESSAGE_MAX = 500;
+export declare const WELCOME_MESSAGE_MAX = 1000;
 export declare function buildAutoWelcomeTemplate(practiceName: string, agentName: string): string;
 export declare function resolveWelcomePreview(welcomeMessage: string | undefined, practiceName: string, agentName: string): string;
 export declare function computeEffectiveWelcomeMessage(settings: Pick<AgentSettings, 'general'>): string;

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@edvak99/voice-receptionist-widget",
-  "version": "1.1.2",
+  "version": "1.1.4",
   "description": "Edvak AI Receptionist — embeddable Angular routes and UI for EHR hosts",
   "peerDependencies": {
     "@angular/common": "^19.2.0",
     "@angular/core": "^19.2.0",
     "@angular/forms": "^19.2.0",
     "@angular/router": "^19.2.0",
+    "livekit-client": "^2.15.0",
     "rxjs": "^7.8.0",
     "socket.io-client": "^4.8.0"
   },

package/styles/_index.scss

@@ -1,47 +1,12 @@
-/* @edvak99/voice-receptionist-widget styles — import in host global styles */
+/* @edvak99/voice-receptionist-widget styles — import in host global styles.
+ *
+ * Tokens live on eds-app-shell / .voice-receptionist-host only (see eds.scss).
+ * This entry must NOT set unprefixed --color-primary (etc.) on :root.
+ */
 
 @use './eds';
 @use './chat-ui';
 
-:root {
-  --color-primary: #3681f4;
-  --color-primary-hover: #2f6de0;
-  --color-primary-light: #eaf2ff;
-  --color-accent: #5aa2ff;
-  --color-accent-light: #d6e8ff;
-  --color-bg: #f7faff;
-  --color-surface: #ffffff;
-  --color-surface-alt: #f8fafc;
-  --color-sidebar-bg: #0f172a;
-  --color-chat-ai: #f1f5f9;
-  --color-text: #0f172a;
-  --color-text-muted: #64748b;
-  --color-text-soft: #94a3b8;
-  --color-border: #e2e8f0;
-  --color-border-strong: #cbd5e1;
-  --color-success: #22c55e;
-  --color-success-soft: #ecfdf3;
-  --color-warning: #f59e0b;
-  --color-warning-soft: #fffbeb;
-  --color-danger: #ef4444;
-  --color-danger-soft: #fef2f2;
-  --color-info: #3b82f6;
-  --color-info-soft: #eff6ff;
-  --color-primary-soft: var(--color-primary-light);
-  --shadow-sm: 0 2px 6px rgba(0, 0, 0, 0.05);
-  --shadow-md: 0 6px 16px rgba(0, 0, 0, 0.08);
-  --shadow-card: var(--shadow-sm);
-  --shadow-modal: var(--shadow-md);
-  --radius-sm: 8px;
-  --radius-md: 10px;
-  --radius-lg: 12px;
-  --radius-xl: 16px;
-  --sidebar-width: 240px;
-  --space-sm: 16px;
-  --space-md: 24px;
-  --space-lg: 32px;
-}
-
 .visually-hidden {
   position: absolute;
   width: 1px;

package/styles/chat-ui.scss

@@ -5,9 +5,9 @@
   flex-direction: column;
   gap: 12px;
   padding: 16px;
-  background: var(--color-bg);
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-lg);
+  background: var(--eds-color-bg);
+  border: 1px solid var(--eds-color-border);
+  border-radius: var(--eds-radius-lg);
   scroll-behavior: smooth;
 }
 
@@ -36,31 +36,31 @@
   gap: 4px;
   max-width: min(78%, 520px);
   padding: 10px 14px;
-  border-radius: var(--radius-lg);
+  border-radius: var(--eds-radius-lg);
   transition: background 150ms ease, box-shadow 150ms ease;
 }
 
 .chat-bubble--agent,
 .chat-bubble--ai {
-  background: var(--color-chat-ai);
-  border: 1px solid var(--color-border);
-  border-bottom-left-radius: var(--radius-sm);
-  box-shadow: var(--shadow-sm);
+  background: var(--eds-color-chat-ai);
+  border: 1px solid var(--eds-color-border);
+  border-bottom-left-radius: var(--eds-radius-sm);
+  box-shadow: var(--eds-shadow-sm);
 
   .chat-label {
-    color: var(--color-accent);
+    color: var(--eds-color-accent);
   }
 
   .chat-content {
-    color: var(--color-text);
+    color: var(--eds-color-text);
   }
 }
 
 .chat-bubble--caller,
 .chat-bubble--user {
-  background: var(--color-primary);
+  background: var(--eds-color-primary);
   color: #fff;
-  border-bottom-right-radius: var(--radius-sm);
+  border-bottom-right-radius: var(--eds-radius-sm);
   box-shadow: 0 4px 12px rgba(54, 129, 244, 0.22);
 
   .chat-label {
@@ -80,21 +80,21 @@
 .chat-bubble--tool {
   max-width: min(92%, 640px);
   padding: 8px 14px;
-  background: var(--color-primary-light);
-  border: 1px dashed var(--color-accent-light);
-  border-radius: var(--radius-md);
+  background: var(--eds-color-primary-light);
+  border: 1px dashed var(--eds-color-accent-light);
+  border-radius: var(--eds-radius-md);
   text-align: center;
 
   .chat-label {
     justify-content: center;
-    color: var(--color-text-muted);
+    color: var(--eds-color-text-muted);
     font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
     font-size: 11.5px;
   }
 
   .chat-content {
     font-size: 12.5px;
-    color: var(--color-text-muted);
+    color: var(--eds-color-text-muted);
     text-align: left;
   }
 }
@@ -128,6 +128,6 @@
 
 .chat-time {
   font-size: 10.5px;
-  color: var(--color-text-soft);
+  color: var(--eds-color-text-soft);
   margin-top: 2px;
 }