@voxket-ai/voxket-live 1.1.63 → 1.1.65

package/README.md

@@ -531,6 +531,155 @@ client.on('transcription.received', (transcription) => {
 });
 ```
 
+---
+
+## 📝 **Rich Content & Markdown Support**
+
+The Voxket SDK automatically detects and renders rich content in chat messages, including **GitHub Flavored Markdown (GFM)** with full support for tables, links, code blocks, and more.
+
+### ✨ **Supported Markdown Features**
+
+#### 📋 **Tables with Embedded Links**
+
+Agent messages can include formatted tables with clickable links embedded within table cells:
+
+```markdown
+| CRA Partner | Registration Link | Description |
+|-------------|-------------------|-------------|
+| **CAMS** | [Click here to register](https://app.camsnps.in/register) | Computer Age Management Services |
+| **KFintech** | [Register now](https://kfintech.com/register) | Widely used platform |
+```
+
+**Renders as:**
+
+| CRA Partner | Registration Link | Description |
+|-------------|-------------------|-------------|
+| **CAMS** | [Click here to register](https://app.camsnps.in/register) | Computer Age Management Services |
+| **KFintech** | [Register now](https://kfintech.com/register) | Widely used platform |
+
+#### 🔗 **Links**
+
+```markdown
+Check out [Voxket AI](https://voxket.ai) for more information!
+
+Visit https://voxket.ai (auto-linked)
+```
+
+**Features:**
+- ✅ Embedded links in text: `[text](url)`
+- ✅ Auto-detection of bare URLs
+- ✅ External link icon indicator
+- ✅ Opens in new tab with `target="_blank"`
+- ✅ Proper security with `rel="noopener noreferrer"`
+
+#### 📋 **Lists**
+
+```markdown
+**Unordered Lists:**
+- Item one
+- Item two
+  - Nested item
+  - Another nested item
+
+**Ordered Lists:**
+1. First step
+2. Second step
+3. Third step
+```
+
+#### 💻 **Code Blocks**
+
+````markdown
+Inline code: `const greeting = "Hello"`
+
+```javascript
+// Syntax-highlighted code block
+function greet(name) {
+  return `Hello, ${name}!`;
+}
+```
+````
+
+**Features:**
+- ✅ Syntax highlighting for 180+ languages
+- ✅ Inline code with backticks
+- ✅ Multi-line code blocks with language specification
+- ✅ Theme-aware styling (dark/light modes)
+
+#### 📐 **Headings & Formatting**
+
+```markdown
+# Heading 1
+## Heading 2
+### Heading 3
+
+**Bold text**
+*Italic text*
+~~Strikethrough~~
+
+> Blockquote for important information
+```
+
+#### 🖼️ **Images**
+
+```markdown
+![Alt text](https://example.com/image.png)
+```
+
+**Features:**
+- ✅ Automatic lazy loading
+- ✅ Responsive sizing
+- ✅ Rounded corners with shadow
+
+---
+
+### 🎨 **Theming for Rich Content**
+
+All markdown elements automatically adapt to your chosen theme:
+
+```tsx
+<VoxketWidget
+  theme="dark"  // Markdown content uses dark theme styling
+  // ... other props
+/>
+```
+
+**Theme Support:**
+- 🌙 **Dark Mode:** Light text on dark backgrounds, blue links
+- ☀️ **Light Mode:** Dark text on light backgrounds, darker blue links  
+- 💎 **Custom Themes:** Markdown inherits your custom theme colors
+
+---
+
+### 🤖 **Agent-Side Markdown**
+
+For AI agents to send markdown content, simply return markdown-formatted text in the agent's response:
+
+**Example Agent Response:**
+```json
+{
+  "type": "text",
+  "content": "Here's the information you requested:\n\n| Feature | Status |\n|---------|--------|\n| Voice | ✅ Available |\n| Chat | ✅ Available |\n\nFor more details, visit [our docs](https://docs.voxket.ai)."
+}
+```
+
+The SDK will **automatically detect** markdown patterns and render them appropriately!
+
+---
+
+### 🔍 **Automatic Detection**
+
+The SDK intelligently detects markdown content using multiple strategies:
+
+- ✅ Explicit metadata: `{ metadata: { format: 'markdown' } }`
+- ✅ Pattern matching: Headers, lists, tables, code blocks, links
+- ✅ Structure analysis: README-like content, multiple sections
+- ✅ Fallback: Plain text with auto-linked URLs
+
+**No configuration needed** - it just works!
+
+---
+
 ### 🤖 **Agent State Events**
 
 ```javascript

package/dist/components/common/welcome.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 import { ThemeType } from '../../styles';
-import { SessionModality } from '../../types/core';
+import { ModalityValue } from '../../types/core';
 interface WelcomeProps {
     disabled: boolean;
     onStartCall: () => void;
@@ -15,7 +15,7 @@ interface WelcomeProps {
     title?: string;
     subTitle?: string;
     theme?: ThemeType;
-    modalities?: SessionModality[];
+    modalities?: ModalityValue[];
 }
 export declare const Welcome: React.ForwardRefExoticComponent<WelcomeProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/widget.d.ts

@@ -1,6 +1,6 @@
 import { ThemeType } from '../styles';
 import { VoxketClient } from '../core/client';
-import { SessionModality, VoxketError } from '../types/core';
+import { VoxketError, ModalityValue } from '../types/core';
 export type DisplayType = 'fullscreen' | 'widget' | 'popup';
 export type PopupPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
 export interface VoxketWidgetProps {
@@ -31,7 +31,7 @@ export interface VoxketWidgetProps {
     enableSessionLogging?: boolean;
     onSessionLogsUpdate?: (logs: any[]) => void;
     onSessionMetricsUpdate?: (metrics: any) => void;
-    modalities?: SessionModality[];
+    modalities?: ModalityValue[];
     displayType?: DisplayType;
     showToolExecMessage?: boolean;
     popupPosition?: PopupPosition;

package/dist/core/client.d.ts

@@ -2,12 +2,12 @@ import { Room, ConnectionState } from 'livekit-client';
 import { VoxketEventEmitter } from './event-emitter';
 import { PluginManager } from '../plugins/plugin-system';
 import { RenderUIOptions } from './ui-renderer';
-import { VoxketConfig, SessionConfig, VoxketSession, VoxketEvents, SessionState, SessionMetrics, AgentInfo, ParticipantInfo, ChatMessage, TranscriptionSegment, SessionModality, VoxketError } from '../types/core';
+import { VoxketConfig, SessionConfig, VoxketSession, VoxketEvents, SessionState, SessionMetrics, AgentInfo, ParticipantInfo, ChatMessage, TranscriptionSegment, ModalityValue, VoxketError } from '../types/core';
 import { VoxketInteractiveView, ViewPresentationMode, InteractiveUIState, RpcEvents } from '../types/rpc';
 export interface VoxketClientConfig extends VoxketConfig {
     agentId?: string;
     participantName?: string;
-    modalities?: SessionModality[];
+    modalities?: ModalityValue[];
     participantMetadata?: Record<string, any>;
     onConnected?: () => void;
     onDisconnected?: (reason?: string) => void;
@@ -54,7 +54,7 @@ export declare class VoxketClient extends VoxketEventEmitter<VoxketEvents & RpcE
      * Setup RPC event forwarding from RpcManager
      */
     private setupRpcEventForwarding;
-    connect(agentId?: string, participantName?: string, modalities?: SessionModality[], participantMetadata?: Record<string, any>): Promise<{
+    connect(agentId?: string, participantName?: string, modalities?: ModalityValue[], participantMetadata?: Record<string, any>): Promise<{
         serverUrl: string;
         participantToken: string;
         voxketSessionId: string;
@@ -64,7 +64,7 @@ export declare class VoxketClient extends VoxketEventEmitter<VoxketEvents & RpcE
     createSession(config: SessionConfig): Promise<VoxketSession>;
     startSession(agentId?: string, options?: {
         participantName?: string;
-        modalities?: SessionModality[];
+        modalities?: ModalityValue[];
         metadata?: Record<string, any>;
         participantMetadata?: Record<string, any>;
     }): Promise<VoxketSession>;

package/dist/core/connection-manager.d.ts

@@ -1,6 +1,6 @@
 import { Room, ConnectionState } from 'livekit-client';
 import { VoxketEventEmitter } from './event-emitter';
-import { VoxketEvents, AgentInfo, ParticipantInfo, SessionModality } from '../types/core';
+import { VoxketEvents, AgentInfo, ParticipantInfo, ModalityValue } from '../types/core';
 export interface ConnectionConfig {
     baseUrl: string;
     appId?: string;
@@ -36,7 +36,7 @@ export declare class ConnectionManager {
     /**
      * Fetch connection details from the server
      */
-    fetchConnectionDetails(agentId: string, participantName: string, modalities: SessionModality[], participantMetadata?: Record<string, any>): Promise<{
+    fetchConnectionDetails(agentId: string, participantName: string, modalities: ModalityValue[], participantMetadata?: Record<string, any>): Promise<{
         serverUrl: string;
         participantToken: string;
         voxketSessionId: string;
@@ -45,7 +45,7 @@ export declare class ConnectionManager {
     /**
      * Connect to the room
      */
-    connect(agentId: string, participantName: string, modalities: SessionModality[], participantMetadata?: Record<string, any>): Promise<{
+    connect(agentId: string, participantName: string, modalities: ModalityValue[], participantMetadata?: Record<string, any>): Promise<{
         serverUrl: string;
         participantToken: string;
         voxketSessionId: string;

package/dist/core/ui-renderer.d.ts

@@ -1,10 +1,10 @@
 import { default as React } from 'react';
 import { DisplayType, PopupPosition } from '../components/widget';
 import { WidgetTheme } from '../styles';
-import { SessionModality, VoxketConfig } from '../types/core';
+import { ModalityValue, VoxketConfig } from '../types/core';
 export interface RenderUIOptions {
     target?: string | HTMLElement;
-    modality?: SessionModality[];
+    modality?: ModalityValue[];
     theme?: WidgetTheme | 'dark' | 'light' | 'vox';
     component?: 'widget' | 'session' | 'chat-only' | 'voice-only';
     className?: string;