@keyframelabs/elements 0.4.0 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -159,7 +159,7 @@ customElements.define('my-embed', KflEmbedElement);
159
159
 
160
160
  ## Supported agents and real-time LLMs
161
161
 
162
- Supports ElevenLabs and OpenAI Realtime.
162
+ Supports ElevenLabs, OpenAI Realtime, and KFL Voice Agent.
163
163
 
164
164
  For `PersonaEmbed`, this is determined by the values you set in the Keyframe platform dashboard.
165
165
 
@@ -272,10 +272,10 @@ type SessionDetails = {
272
272
  };
273
273
 
274
274
  type VoiceAgentDetails = {
275
- type: 'elevenlabs' | 'openai';
275
+ type: 'elevenlabs' | 'openai' | 'kfl';
276
276
  token?: string; // For openai (ephemeral client secret)
277
277
  agent_id?: string; // For elevenlabs
278
- signed_url?: string; // For elevenlabs
278
+ signed_url?: string; // For elevenlabs/kfl
279
279
  system_prompt?: string; // For openai
280
280
  voice?: string; // For openai
281
281
  };
@@ -6,12 +6,13 @@
6
6
  * minimize/expand toggle, corner positioning CSS, button color styling.
7
7
  */
8
8
  export declare class KflEmbedElement extends HTMLElement {
9
- static get observedAttributes(): ("publishable-key" | "api-base-url" | "initial-state" | "controlled-widget-state" | "active-width" | "active-height" | "minimized-width" | "minimized-height" | "inline" | "corner" | "hide-ui" | "show-minimize-button" | "controlled-show-minimize-button" | "button-color" | "button-color-opacity" | "video-fit" | "preview-image")[];
9
+ static get observedAttributes(): ("publishable-key" | "api-base-url" | "initial-state" | "controlled-widget-state" | "active-width" | "active-height" | "minimized-width" | "minimized-height" | "inline" | "corner" | "hide-ui" | "show-minimize-button" | "controlled-show-minimize-button" | "button-color" | "button-color-opacity" | "video-fit" | "preview-image" | "call-to-action")[];
10
10
  private shadow;
11
11
  private embed;
12
12
  private _widgetState;
13
13
  private _connected;
14
14
  private _connecting;
15
+ private _initialized;
15
16
  private widgetEl;
16
17
  private innerEl;
17
18
  private containerEl;
@@ -25,6 +26,12 @@ export declare class KflEmbedElement extends HTMLElement {
25
26
  private revealBtn;
26
27
  private toolbarEl;
27
28
  private micBtn;
29
+ private readonly _onJoinClick;
30
+ private readonly _onEndCallClick;
31
+ private readonly _onMicClick;
32
+ private readonly _onToggleClick;
33
+ private readonly _onRevealClick;
34
+ private readonly _onInnerClick;
28
35
  constructor();
29
36
  connectedCallback(): void;
30
37
  disconnectedCallback(): void;
@@ -38,17 +45,32 @@ export declare class KflEmbedElement extends HTMLElement {
38
45
  isMicOn(): boolean;
39
46
  canTurnOnMic(): boolean;
40
47
  setEmotion(_emotion: 'neutral' | 'angry' | 'sad' | 'happy'): void;
48
+ private _initDom;
49
+ private _requireElement;
50
+ private _resolveInitialState;
51
+ private _renderJoinLabel;
52
+ private _applyPreviewImage;
53
+ private _readRenderConfig;
41
54
  private _getAttrNum;
42
55
  private _getCorner;
43
56
  private _applyLayout;
44
57
  private _applyState;
58
+ private _renderJoinButton;
59
+ private _renderToolbar;
60
+ private _renderToggleButton;
61
+ private _renderRevealButton;
62
+ private _renderJoinButtonColor;
45
63
  private _shouldShowMinimizeButton;
46
64
  private _handleJoinCall;
47
65
  private _handleToggle;
66
+ private _handleInnerClick;
48
67
  private _handleEndCall;
49
68
  private _handleReveal;
69
+ private _setWidgetState;
50
70
  private _handleMicToggle;
51
71
  private _updateMicIcon;
72
+ private _hasLiveSession;
73
+ private _disconnectSession;
52
74
  private _resetToMinimized;
53
75
  private _showError;
54
76
  private _connect;
@@ -28,3 +28,8 @@ export declare function createEventEmitter<T extends Record<string, any>>(): {
28
28
  removeAllListeners(): void;
29
29
  };
30
30
  export declare function floatTo16BitPCM(float32: Float32Array): Uint8Array;
31
+ /**
32
+ * Create an AudioWorkletNode that captures mono PCM input and posts
33
+ * Float32Array chunks (1024 samples = 64ms at 16kHz) to its message port.
34
+ */
35
+ export declare function createPcmWorkletNode(ctx: AudioContext): Promise<AudioWorkletNode>;
@@ -1,5 +1,6 @@
1
1
  import { ElevenLabsAgent, ElevenLabsConfig } from './elevenlabs';
2
- import { OpenAIRealtimeAgent, OpenAIRealtimeConfig, TurnDetection } from './openai-realtime';
2
+ import { OpenAIRealtimeAgent, OpenAIRealtimeConfig } from './openai-realtime';
3
+ import { KflAgent, KflAgentConfig } from './kfl';
3
4
  /**
4
5
  * Agent implementations for voice AI platforms.
5
6
  *
@@ -9,10 +10,11 @@ import { OpenAIRealtimeAgent, OpenAIRealtimeConfig, TurnDetection } from './open
9
10
  export { BaseAgent, DEFAULT_INPUT_SAMPLE_RATE } from './base';
10
11
  export type { Agent, AgentConfig, AgentEventMap, AgentState, Emotion } from './types';
11
12
  export { ElevenLabsAgent, type ElevenLabsConfig };
12
- export { OpenAIRealtimeAgent, type OpenAIRealtimeConfig, type TurnDetection };
13
- export { SAMPLE_RATE, base64ToBytes, bytesToBase64, resamplePcm, createEventEmitter, floatTo16BitPCM } from './audio-utils';
13
+ export { OpenAIRealtimeAgent, type OpenAIRealtimeConfig };
14
+ export { KflAgent, type KflAgentConfig };
15
+ export { SAMPLE_RATE, base64ToBytes, bytesToBase64, resamplePcm, createEventEmitter, floatTo16BitPCM, createPcmWorkletNode } from './audio-utils';
14
16
  /** Supported agent types */
15
- export type AgentType = 'elevenlabs' | 'openai';
17
+ export type AgentType = 'elevenlabs' | 'openai' | 'kfl';
16
18
  /** Agent type metadata */
17
19
  export interface AgentTypeInfo {
18
20
  id: AgentType;
@@ -25,9 +27,10 @@ export declare const AGENT_REGISTRY: AgentTypeInfo[];
25
27
  export interface AgentConfigMap {
26
28
  elevenlabs: ElevenLabsConfig;
27
29
  openai: OpenAIRealtimeConfig;
30
+ kfl: KflAgentConfig;
28
31
  }
29
32
  /** Union type of all agent instances */
30
- export type AnyAgent = ElevenLabsAgent | OpenAIRealtimeAgent;
33
+ export type AnyAgent = ElevenLabsAgent | OpenAIRealtimeAgent | KflAgent;
31
34
  /**
32
35
  * Create an agent instance by type.
33
36
  *
@@ -39,6 +42,7 @@ export type AnyAgent = ElevenLabsAgent | OpenAIRealtimeAgent;
39
42
  */
40
43
  export declare function createAgent(type: 'elevenlabs'): ElevenLabsAgent;
41
44
  export declare function createAgent(type: 'openai'): OpenAIRealtimeAgent;
45
+ export declare function createAgent(type: 'kfl'): KflAgent;
42
46
  export declare function createAgent(type: AgentType): AnyAgent;
43
47
  /**
44
48
  * Get agent type metadata by ID.
@@ -0,0 +1,26 @@
1
+ import { AgentConfig } from './types';
2
+ import { BaseAgent } from './base';
3
+ export interface KflAgentConfig extends AgentConfig {
4
+ /** WebSocket endpoint for kfl-voice-agent (wss://.../ws) */
5
+ wsUrl: string;
6
+ /** Optional ping interval override (ms) */
7
+ pingIntervalMs?: number;
8
+ }
9
+ export declare class KflAgent extends BaseAgent {
10
+ protected readonly agentName = "KflVoiceAgent";
11
+ private connectResolve;
12
+ private connectReject;
13
+ private connectTimeout;
14
+ private pingInterval;
15
+ private sourceInputSampleRate;
16
+ private turnEnded;
17
+ connect(config: KflAgentConfig): Promise<void>;
18
+ sendAudio(pcmData: Uint8Array): void;
19
+ close(): void;
20
+ protected handleParsedMessage(message: unknown): void;
21
+ private startPings;
22
+ private stopPings;
23
+ private clearConnectTimeout;
24
+ private resolvePendingConnect;
25
+ private rejectPendingConnect;
26
+ }
@@ -1,28 +1,9 @@
1
1
  import { AgentConfig } from './types';
2
2
  import { BaseAgent } from './base';
3
- /**
4
- * Turn detection configuration for OpenAI Realtime.
5
- * @see https://developers.openai.com/api/docs/guides/realtime-vad
6
- */
7
- export type TurnDetection = {
8
- type: 'server_vad';
9
- /** Activation threshold 0-1. Higher = requires louder audio. */
10
- threshold?: number;
11
- /** Audio (ms) to include before detected speech. */
12
- prefix_padding_ms?: number;
13
- /** Silence duration (ms) before speech stop is detected. */
14
- silence_duration_ms?: number;
15
- } | {
16
- type: 'semantic_vad';
17
- /** How eager the model is to consider a turn finished. Default: 'auto'. */
18
- eagerness?: 'low' | 'medium' | 'high' | 'auto';
19
- };
20
3
  /** OpenAI Realtime specific configuration */
21
4
  export interface OpenAIRealtimeConfig extends AgentConfig {
22
5
  /** Model to use (defaults to gpt-realtime) */
23
6
  model?: string;
24
- /** Turn detection / VAD settings. Defaults to semantic_vad with eagerness 'high'. */
25
- turnDetection?: TurnDetection;
26
7
  }
27
8
  /**
28
9
  * OpenAI Realtime agent implementation.
package/dist/index.d.ts CHANGED
@@ -3,8 +3,8 @@ export type { PersonaEmbedOptions } from './PersonaEmbed';
3
3
  export { PersonaView } from './PersonaView';
4
4
  export type { PersonaViewOptions } from './PersonaView';
5
5
  export type { EmbedStatus, VideoFit, VoiceAgentDetails, SessionDetails, BaseCallbacks, } from './types';
6
- export { createAgent, ElevenLabsAgent, OpenAIRealtimeAgent, BaseAgent, AGENT_REGISTRY, getAgentInfo, } from './agents';
7
- export type { AgentType, AgentConfig, AgentEventMap, Agent, AnyAgent, AgentTypeInfo, ElevenLabsConfig, OpenAIRealtimeConfig, TurnDetection, } from './agents';
6
+ export { createAgent, ElevenLabsAgent, OpenAIRealtimeAgent, KflAgent, BaseAgent, AGENT_REGISTRY, getAgentInfo, } from './agents';
7
+ export type { AgentType, AgentConfig, AgentEventMap, Agent, AnyAgent, AgentTypeInfo, ElevenLabsConfig, OpenAIRealtimeConfig, KflAgentConfig, } from './agents';
8
8
  export type { AgentState } from '@keyframelabs/sdk';
9
9
  export { floatTo16BitPCM, resamplePcm, base64ToBytes, bytesToBase64, SAMPLE_RATE, createEventEmitter, } from './agents';
10
10
  export { KflEmbedElement } from './KflEmbedElement';