@absolutejs/voice 0.0.22-beta.492 → 0.0.22-beta.494

package/dist/index.d.ts

@@ -86,6 +86,8 @@ export type { VoiceAgentUIInput, VoiceAgentUIState, } from "./agentState";
 export { createInMemoryDNCList, isPhoneOnDNC, isWithinCampaignWindow, normalizePhoneNumber, shouldRetryCampaignAttempt, summarizeVoiceCampaignDispositions, } from "./campaignControls";
 export type { VoiceCampaignDisposition, VoiceCampaignDispositionRetryPolicy, VoiceCampaignDispositionRetryRule, VoiceCampaignDispositionSummary, VoiceCampaignWindowCheckInput, VoiceDNCList, } from "./campaignControls";
 export { createVoiceBackchannelDriver } from "./backchannel";
+export { createVoiceOAuth2TokenSource } from "./oauth2TokenSource";
+export type { CreateVoiceOAuth2TokenSourceOptions, VoiceOAuth2TokenResponse, VoiceOAuth2TokenSource, } from "./oauth2TokenSource";
 export type { VoiceBackchannelCue, VoiceBackchannelDriver, VoiceBackchannelDriverOptions, } from "./backchannel";
 export { createVoiceIVRSession, describeVoiceIVRPlan, evaluateVoiceIVRPlan, } from "./ivrPlan";
 export type { VoiceIVRBranch, VoiceIVRDecision, VoiceIVRInput, VoiceIVRMatch, VoiceIVRPlan, VoiceIVRSession, } from "./ivrPlan";

package/dist/index.js

@@ -35663,6 +35663,66 @@ var createVoiceBackchannelDriver = (options) => {
     }
   };
 };
+// src/oauth2TokenSource.ts
+var createVoiceOAuth2TokenSource = (options) => {
+  const fetchImpl = options.fetch ?? globalThis.fetch.bind(globalThis);
+  const refreshSkewMs = (options.refreshSkewSeconds ?? 60) * 1000;
+  let cached;
+  let pending;
+  const fetchToken = async () => {
+    const body = new URLSearchParams;
+    body.set("grant_type", options.grantType ?? "client_credentials");
+    body.set("client_id", options.clientId);
+    body.set("client_secret", options.clientSecret);
+    if (options.scope) {
+      body.set("scope", options.scope);
+    }
+    if (options.audience) {
+      body.set("audience", options.audience);
+    }
+    const response = await fetchImpl(options.tokenUrl, {
+      body: body.toString(),
+      headers: {
+        accept: "application/json",
+        "content-type": "application/x-www-form-urlencoded"
+      },
+      method: "POST"
+    });
+    if (!response.ok) {
+      const text = await response.text().catch(() => "");
+      throw new Error(`OAuth2 token request failed: ${response.status} ${response.statusText}${text ? ` \u2014 ${text.slice(0, 200)}` : ""}`);
+    }
+    const json = await response.json();
+    if (!json.access_token) {
+      throw new Error("OAuth2 token response missing access_token");
+    }
+    const ttlMs = typeof json.expires_in === "number" && json.expires_in > 0 ? json.expires_in * 1000 : 5 * 60 * 1000;
+    cached = {
+      expiresAt: Date.now() + ttlMs,
+      value: json.access_token
+    };
+    return json.access_token;
+  };
+  return {
+    invalidate: () => {
+      cached = undefined;
+      pending = undefined;
+    },
+    token: async () => {
+      const now = Date.now();
+      if (cached && cached.expiresAt - refreshSkewMs > now) {
+        return cached.value;
+      }
+      if (pending) {
+        return pending;
+      }
+      pending = fetchToken().finally(() => {
+        pending = undefined;
+      });
+      return pending;
+    }
+  };
+};
 // src/ivrPlan.ts
 var speechMatchesPattern = (pattern, speech) => {
   const normalized = speech.toLowerCase().trim();
@@ -47075,6 +47135,7 @@ export {
   createVoiceObservabilityExportRoutes,
   createVoiceObservabilityExportReplayRoutes,
   createVoiceOTELHTTPExporter,
+  createVoiceOAuth2TokenSource,
   createVoiceMonitorWebhookNotifier,
   createVoiceMonitorSession,
   createVoiceMonitorRuntimeBinding,

package/dist/oauth2TokenSource.d.ts

@@ -0,0 +1,21 @@
+export type VoiceOAuth2TokenResponse = {
+    access_token: string;
+    expires_in?: number;
+    token_type?: string;
+};
+export type VoiceOAuth2TokenSource = {
+    invalidate: () => void;
+    token: () => Promise<string>;
+};
+export type CreateVoiceOAuth2TokenSourceOptions = {
+    audience?: string;
+    clientId: string;
+    clientSecret: string;
+    fetch?: typeof fetch;
+    grantType?: "client_credentials";
+    /** seconds remaining before expiry to refresh proactively, default 60 */
+    refreshSkewSeconds?: number;
+    scope?: string;
+    tokenUrl: string;
+};
+export declare const createVoiceOAuth2TokenSource: (options: CreateVoiceOAuth2TokenSourceOptions) => VoiceOAuth2TokenSource;

package/dist/react/VoiceWidget.d.ts

@@ -0,0 +1,33 @@
+import type { VoiceControllerOptions } from "../types";
+export type VoiceWidgetTheme = {
+    accent?: string;
+    background?: string;
+    errorAccent?: string;
+    fontFamily?: string;
+    foreground?: string;
+    radius?: number | string;
+};
+export type VoiceWidgetLabels = {
+    callEnded?: string;
+    connecting?: string;
+    endCall?: string;
+    idle?: string;
+    listening?: string;
+    mute?: string;
+    speaking?: string;
+    startCall?: string;
+    thinking?: string;
+    unmute?: string;
+};
+export type VoiceWidgetProps = {
+    className?: string;
+    controllerOptions?: VoiceControllerOptions;
+    labels?: VoiceWidgetLabels;
+    /** Voice runtime URL. Default '/voice'. */
+    path?: string;
+    /** Optional callback for diagnostic events surfaced by the controller. */
+    onError?: (error: string) => void;
+    theme?: VoiceWidgetTheme;
+    title?: string;
+};
+export declare const VoiceWidget: ({ className, controllerOptions, labels: labelsOverride, onError, path, theme: themeOverride, title, }: VoiceWidgetProps) => import("react/jsx-runtime").JSX.Element;

package/dist/react/index.d.ts

@@ -35,6 +35,8 @@ export { useVoiceDeliveryRuntime } from "./useVoiceDeliveryRuntime";
 export { useVoiceCampaignDialerProof } from "./useVoiceCampaignDialerProof";
 export { useVoiceStream } from "./useVoiceStream";
 export { useVoiceController } from "./useVoiceController";
+export { VoiceWidget } from "./VoiceWidget";
+export type { VoiceWidgetLabels, VoiceWidgetProps, VoiceWidgetTheme, } from "./VoiceWidget";
 export { useVoiceProviderStatus } from "./useVoiceProviderStatus";
 export { useVoiceProviderCapabilities } from "./useVoiceProviderCapabilities";
 export { useVoiceProviderContracts } from "./useVoiceProviderContracts";

package/dist/react/index.js

@@ -12450,8 +12450,237 @@ var useVoiceController = (path, options = {}) => {
     toggleRecording: () => controller.toggleRecording()
   };
 };
+// src/react/VoiceWidget.tsx
+import { useMemo, useRef as useRef26 } from "react";
+
+// src/agentState.ts
+var deriveVoiceAgentUIState = (input) => {
+  if (!input.isConnected) {
+    return "idle";
+  }
+  if (input.isPlaying) {
+    return "speaking";
+  }
+  if (input.isRecording && input.hasActivePartial) {
+    return "listening";
+  }
+  if (input.isRecording) {
+    return "listening";
+  }
+  if (input.lastTranscriptAt && !input.lastAssistantAt) {
+    return "thinking";
+  }
+  if (input.lastTranscriptAt && input.lastAssistantAt && input.lastTranscriptAt > input.lastAssistantAt) {
+    return "thinking";
+  }
+  return "idle";
+};
+var describeVoiceAgentUIState = (state) => {
+  switch (state) {
+    case "idle":
+      return "Idle";
+    case "listening":
+      return "Listening";
+    case "speaking":
+      return "Speaking";
+    case "thinking":
+      return "Thinking";
+  }
+};
+var voiceAgentUIStateOrder = [
+  "idle",
+  "listening",
+  "thinking",
+  "speaking"
+];
+
+// src/react/VoiceWidget.tsx
+import { jsxDEV as jsxDEV22 } from "react/jsx-dev-runtime";
+var DEFAULT_THEME = {
+  accent: "#3b82f6",
+  background: "#0f172a",
+  errorAccent: "#ef4444",
+  fontFamily: 'ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
+  foreground: "#f8fafc",
+  radius: 16
+};
+var DEFAULT_LABELS = {
+  callEnded: "Call ended",
+  connecting: "Connecting\u2026",
+  endCall: "End call",
+  idle: "Idle",
+  listening: "Listening",
+  mute: "Mute",
+  speaking: "Speaking",
+  startCall: "Start call",
+  thinking: "Thinking",
+  unmute: "Unmute"
+};
+var stateLabel = (state, labels) => {
+  switch (state) {
+    case "listening":
+      return labels.listening;
+    case "speaking":
+      return labels.speaking;
+    case "thinking":
+      return labels.thinking;
+    case "idle":
+      return labels.idle;
+  }
+};
+var resolveRadius = (radius) => typeof radius === "number" ? `${radius}px` : radius;
+var VoiceWidget = ({
+  className,
+  controllerOptions,
+  labels: labelsOverride,
+  onError,
+  path = "/voice",
+  theme: themeOverride,
+  title
+}) => {
+  const theme = { ...DEFAULT_THEME, ...themeOverride };
+  const labels = { ...DEFAULT_LABELS, ...labelsOverride };
+  const lastErrorRef = useRef26(null);
+  const controller = useVoiceController(path, controllerOptions);
+  if (controller.error && controller.error !== lastErrorRef.current) {
+    lastErrorRef.current = controller.error;
+    onError?.(controller.error);
+  }
+  const lastAssistantAt = useMemo(() => {
+    const last = controller.assistantAudio.at(-1);
+    return last?.receivedAt;
+  }, [controller.assistantAudio]);
+  const lastTranscriptAt = useMemo(() => {
+    const lastTurn = controller.turns.at(-1);
+    return lastTurn?.committedAt;
+  }, [controller.turns]);
+  const agentState = deriveVoiceAgentUIState({
+    hasActivePartial: controller.partial.length > 0,
+    isConnected: controller.isConnected,
+    isPlaying: false,
+    isRecording: controller.isRecording,
+    lastAssistantAt,
+    lastTranscriptAt
+  });
+  const connecting = !controller.isConnected && controller.status !== "idle" && !controller.error;
+  const containerStyle = {
+    background: theme.background,
+    borderRadius: resolveRadius(theme.radius),
+    color: theme.foreground,
+    fontFamily: theme.fontFamily,
+    minWidth: 240,
+    padding: "20px 22px"
+  };
+  const statusDotStyle = {
+    background: controller.error ? theme.errorAccent : agentState === "idle" ? "rgba(148, 163, 184, 0.6)" : theme.accent,
+    borderRadius: "50%",
+    boxShadow: agentState === "speaking" ? `0 0 12px ${theme.accent}` : undefined,
+    height: 10,
+    width: 10
+  };
+  const buttonStyle = (variant) => ({
+    background: variant === "primary" ? theme.accent : variant === "danger" ? theme.errorAccent : "transparent",
+    border: variant === "secondary" ? `1px solid rgba(255,255,255,0.18)` : "none",
+    borderRadius: 12,
+    color: theme.foreground,
+    cursor: "pointer",
+    fontSize: 14,
+    fontWeight: 500,
+    padding: "10px 14px"
+  });
+  const handleStart = () => {
+    controller.startRecording();
+  };
+  const handleStop = () => {
+    controller.stopRecording();
+  };
+  const handleEnd = () => {
+    controller.close();
+  };
+  const showStart = !controller.isRecording && controller.status !== "completed";
+  const showStop = controller.isRecording;
+  return /* @__PURE__ */ jsxDEV22("div", {
+    "aria-live": "polite",
+    className,
+    "data-agent-state": agentState,
+    role: "region",
+    style: containerStyle,
+    children: [
+      /* @__PURE__ */ jsxDEV22("div", {
+        style: {
+          alignItems: "center",
+          display: "flex",
+          gap: 10,
+          marginBottom: 12
+        },
+        children: [
+          /* @__PURE__ */ jsxDEV22("span", {
+            "aria-hidden": "true",
+            style: statusDotStyle
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV22("strong", {
+            style: { fontSize: 15 },
+            children: title ?? "Voice"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV22("span", {
+            style: {
+              fontSize: 13,
+              marginLeft: "auto",
+              opacity: 0.7
+            },
+            children: controller.error ? "Error" : connecting ? labels.connecting : controller.status === "completed" ? labels.callEnded : stateLabel(agentState, labels)
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      controller.partial ? /* @__PURE__ */ jsxDEV22("p", {
+        style: {
+          fontSize: 13,
+          margin: "8px 0 12px",
+          opacity: 0.85,
+          wordBreak: "break-word"
+        },
+        children: [
+          "\u201C",
+          controller.partial,
+          "\u201D"
+        ]
+      }, undefined, true, undefined, this) : null,
+      /* @__PURE__ */ jsxDEV22("div", {
+        style: { display: "flex", gap: 10 },
+        children: [
+          showStart ? /* @__PURE__ */ jsxDEV22("button", {
+            onClick: handleStart,
+            style: buttonStyle("primary"),
+            type: "button",
+            children: labels.startCall
+          }, undefined, false, undefined, this) : null,
+          showStop ? /* @__PURE__ */ jsxDEV22("button", {
+            onClick: handleStop,
+            style: buttonStyle("secondary"),
+            type: "button",
+            children: labels.mute
+          }, undefined, false, undefined, this) : null,
+          controller.isConnected ? /* @__PURE__ */ jsxDEV22("button", {
+            onClick: handleEnd,
+            style: buttonStyle("danger"),
+            type: "button",
+            children: labels.endCall
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this),
+      controller.error ? /* @__PURE__ */ jsxDEV22("p", {
+        style: {
+          color: theme.errorAccent,
+          fontSize: 12,
+          marginTop: 12
+        },
+        children: controller.error
+      }, undefined, false, undefined, this) : null
+    ]
+  }, undefined, true, undefined, this);
+};
 // src/react/useVoiceWorkflowStatus.tsx
-import { useEffect as useEffect26, useRef as useRef26, useSyncExternalStore as useSyncExternalStore26 } from "react";
+import { useEffect as useEffect26, useRef as useRef27, useSyncExternalStore as useSyncExternalStore26 } from "react";
 
 // src/client/workflowStatus.ts
 var fetchVoiceWorkflowStatus = async (path = "/evals/scenarios/json", options = {}) => {
@@ -12534,7 +12763,7 @@ var createVoiceWorkflowStatusStore = (path = "/evals/scenarios/json", options =
 
 // src/react/useVoiceWorkflowStatus.tsx
 var useVoiceWorkflowStatus = (path = "/evals/scenarios/json", options = {}) => {
-  const storeRef = useRef26(null);
+  const storeRef = useRef27(null);
   if (!storeRef.current) {
     storeRef.current = createVoiceWorkflowStatusStore(path, options);
   }
@@ -12575,6 +12804,7 @@ export {
   useVoiceCampaignDialerProof,
   useVoiceCallDebugger,
   useVoiceAgentSquadStatus,
+  VoiceWidget,
   VoiceTurnQuality,
   VoiceTurnLatency,
   VoiceTraceTimeline,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@absolutejs/voice",
-  "version": "0.0.22-beta.492",
+  "version": "0.0.22-beta.494",
   "description": "Voice primitives and Elysia plugin for AbsoluteJS",
   "repository": {
     "type": "git",