@copilotz/chat-ui 0.2.1 → 0.3.0
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/dist/index.cjs +905 -564
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +75 -1
- package/dist/index.d.ts +75 -1
- package/dist/index.js +801 -466
- package/dist/index.js.map +1 -1
- package/dist/styles.css +3 -0
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -85,6 +85,10 @@ interface ChatMessage {
|
|
|
85
85
|
reasoning?: string;
|
|
86
86
|
/** Whether reasoning tokens are still being streamed */
|
|
87
87
|
isReasoningStreaming?: boolean;
|
|
88
|
+
/** Agent/sender identity for multi-agent conversations */
|
|
89
|
+
senderName?: string;
|
|
90
|
+
/** Agent ID of the sender (for multi-agent conversations) */
|
|
91
|
+
senderAgentId?: string;
|
|
88
92
|
}
|
|
89
93
|
interface ChatThread {
|
|
90
94
|
id: string;
|
|
@@ -111,6 +115,8 @@ interface ChatConfig {
|
|
|
111
115
|
enabled?: boolean;
|
|
112
116
|
label?: string;
|
|
113
117
|
hideIfSingle?: boolean;
|
|
118
|
+
/** 'single' = classic single-agent dropdown (default). 'multi' = participants + target selectors. */
|
|
119
|
+
mode?: 'single' | 'multi';
|
|
114
120
|
};
|
|
115
121
|
labels?: {
|
|
116
122
|
inputPlaceholder?: string;
|
|
@@ -279,6 +285,12 @@ interface ChatV2Props {
|
|
|
279
285
|
agentOptions?: AgentOption[];
|
|
280
286
|
selectedAgentId?: string | null;
|
|
281
287
|
onSelectAgent?: (agentId: string) => void;
|
|
288
|
+
/** IDs of agents participating in this conversation */
|
|
289
|
+
participantIds?: string[];
|
|
290
|
+
onParticipantsChange?: (ids: string[]) => void;
|
|
291
|
+
/** ID of the agent this message is directed at */
|
|
292
|
+
targetAgentId?: string | null;
|
|
293
|
+
onTargetAgentChange?: (agentId: string | null) => void;
|
|
282
294
|
suggestions?: string[];
|
|
283
295
|
messageSuggestions?: Record<string, string[]>;
|
|
284
296
|
enabledFeatures?: string[];
|
|
@@ -314,6 +326,8 @@ interface AgentOption {
|
|
|
314
326
|
name: string;
|
|
315
327
|
description?: string;
|
|
316
328
|
avatarUrl?: string;
|
|
329
|
+
/** Custom color for multi-agent display. Auto-assigned if not provided. */
|
|
330
|
+
color?: string;
|
|
317
331
|
}
|
|
318
332
|
type MessageAction = 'copy' | 'edit' | 'delete' | 'regenerate' | 'retry';
|
|
319
333
|
interface MessageActionEvent {
|
|
@@ -400,13 +414,63 @@ interface ChatHeaderProps {
|
|
|
400
414
|
showCustomComponentButton?: boolean;
|
|
401
415
|
isMobile?: boolean;
|
|
402
416
|
showAgentSelector?: boolean;
|
|
417
|
+
isMultiAgentMode?: boolean;
|
|
403
418
|
agentOptions?: AgentOption[];
|
|
404
419
|
selectedAgentId?: string | null;
|
|
405
420
|
onSelectAgent?: (agentId: string) => void;
|
|
421
|
+
participantIds?: string[];
|
|
422
|
+
onParticipantsChange?: (ids: string[]) => void;
|
|
406
423
|
className?: string;
|
|
407
424
|
}
|
|
408
425
|
declare const ChatHeader: React__default.FC<ChatHeaderProps>;
|
|
409
426
|
|
|
427
|
+
interface ParticipantsSelectorProps {
|
|
428
|
+
/** All available agents */
|
|
429
|
+
agents: AgentOption[];
|
|
430
|
+
/** Currently selected participant IDs */
|
|
431
|
+
participantIds: string[];
|
|
432
|
+
/** Callback when participants change */
|
|
433
|
+
onParticipantsChange: (ids: string[]) => void;
|
|
434
|
+
/** Label for the selector */
|
|
435
|
+
label?: string;
|
|
436
|
+
/** Maximum participants to show in collapsed view */
|
|
437
|
+
maxVisible?: number;
|
|
438
|
+
/** Disabled state */
|
|
439
|
+
disabled?: boolean;
|
|
440
|
+
}
|
|
441
|
+
/**
|
|
442
|
+
* Multi-select dropdown for choosing which agents participate in the conversation.
|
|
443
|
+
*/
|
|
444
|
+
declare const ParticipantsSelector: React__default.FC<ParticipantsSelectorProps>;
|
|
445
|
+
interface TargetAgentSelectorProps {
|
|
446
|
+
/** Available agents (should be filtered to participants only) */
|
|
447
|
+
agents: AgentOption[];
|
|
448
|
+
/** Currently targeted agent ID */
|
|
449
|
+
targetAgentId: string | null;
|
|
450
|
+
/** Callback when target changes */
|
|
451
|
+
onTargetChange: (agentId: string | null) => void;
|
|
452
|
+
/** Label for the selector */
|
|
453
|
+
label?: string;
|
|
454
|
+
/** Placeholder when no target is selected */
|
|
455
|
+
placeholder?: string;
|
|
456
|
+
/** Disabled state */
|
|
457
|
+
disabled?: boolean;
|
|
458
|
+
}
|
|
459
|
+
/**
|
|
460
|
+
* Single-select dropdown for choosing which agent to address with @mention.
|
|
461
|
+
*/
|
|
462
|
+
declare const TargetAgentSelector: React__default.FC<TargetAgentSelectorProps>;
|
|
463
|
+
interface AgentBadgeProps {
|
|
464
|
+
agent: AgentOption;
|
|
465
|
+
onRemove?: () => void;
|
|
466
|
+
showRemove?: boolean;
|
|
467
|
+
size?: 'sm' | 'md';
|
|
468
|
+
}
|
|
469
|
+
/**
|
|
470
|
+
* Badge displaying an agent with optional remove button.
|
|
471
|
+
*/
|
|
472
|
+
declare const AgentBadge: React__default.FC<AgentBadgeProps>;
|
|
473
|
+
|
|
410
474
|
interface ChatInputProps {
|
|
411
475
|
value: string;
|
|
412
476
|
onChange: (value: string) => void;
|
|
@@ -457,6 +521,8 @@ interface MessageProps {
|
|
|
457
521
|
onToggleExpanded?: (messageId: string) => void;
|
|
458
522
|
/** When true, hides the avatar and name (for grouped consecutive messages from same sender) */
|
|
459
523
|
isGrouped?: boolean;
|
|
524
|
+
/** Available agents for resolving multi-agent display (colors, avatars) */
|
|
525
|
+
agentOptions?: AgentOption[];
|
|
460
526
|
}
|
|
461
527
|
declare const Message: React__default.FC<MessageProps>;
|
|
462
528
|
|
|
@@ -682,5 +748,13 @@ declare const chatUtils: {
|
|
|
682
748
|
createThread: (title: string) => ChatThread;
|
|
683
749
|
generateThreadTitle: (firstMessage: string) => string;
|
|
684
750
|
};
|
|
751
|
+
/** Deterministic color for an agent based on its ID. */
|
|
752
|
+
declare function getAgentColor(agentId: string): string;
|
|
753
|
+
/** Up to 2-letter initials from an agent name. */
|
|
754
|
+
declare function getAgentInitials(name: string): string;
|
|
755
|
+
/** Assign colors to agents that don't have a custom color. Returns a new array. */
|
|
756
|
+
declare function assignAgentColors(agents: AgentOption[]): (AgentOption & {
|
|
757
|
+
color: string;
|
|
758
|
+
})[];
|
|
685
759
|
|
|
686
|
-
export { type AgentOption, type AudioAttachment, type ChatCallbacks, type ChatConfig, ChatHeader, type ChatHeaderConfig, type ChatHeaderProps, ChatInput, type ChatMarkdownConfig, type ChatMessage, type ChatState, type ChatThread, ChatUI, type ChatUserContext, ChatUserContextProvider, type ChatV2Props, type CreateVoiceProvider, type CustomField, type FileUploadProgress, type MediaAttachment, type MemoryItem, Message, type MessageAction, type MessageActionEvent, Sidebar, type SidebarConfig, type SidebarProps, type StateCallback, type StreamingUpdate, ThreadManager, type ToolCall, type UserCustomField, UserMenu, type UserMenuCallbacks, type UserMenuConfig, type UserMenuProps, type UserMenuUser, UserProfile, type UserProfileConfig, type UserProfileProps, type UserProfileUser, type VoiceComposerState, type VoiceProvider, type VoiceProviderHandlers, type VoiceProviderOptions, type VoiceReviewMode, type VoiceSegment, type VoiceTranscript, type VoiceTranscriptMode, chatConfigPresets, chatUtils, cn, configUtils, createObjectUrlFromDataUrl, defaultChatConfig, featureFlags, formatDate, mergeConfig, themeUtils, useChatUserContext, validateConfig };
|
|
760
|
+
export { AgentBadge, type AgentOption, type AudioAttachment, type ChatCallbacks, type ChatConfig, ChatHeader, type ChatHeaderConfig, type ChatHeaderProps, ChatInput, type ChatMarkdownConfig, type ChatMessage, type ChatState, type ChatThread, ChatUI, type ChatUserContext, ChatUserContextProvider, type ChatV2Props, type CreateVoiceProvider, type CustomField, type FileUploadProgress, type MediaAttachment, type MemoryItem, Message, type MessageAction, type MessageActionEvent, ParticipantsSelector, Sidebar, type SidebarConfig, type SidebarProps, type StateCallback, type StreamingUpdate, TargetAgentSelector, ThreadManager, type ToolCall, type UserCustomField, UserMenu, type UserMenuCallbacks, type UserMenuConfig, type UserMenuProps, type UserMenuUser, UserProfile, type UserProfileConfig, type UserProfileProps, type UserProfileUser, type VoiceComposerState, type VoiceProvider, type VoiceProviderHandlers, type VoiceProviderOptions, type VoiceReviewMode, type VoiceSegment, type VoiceTranscript, type VoiceTranscriptMode, assignAgentColors, chatConfigPresets, chatUtils, cn, configUtils, createObjectUrlFromDataUrl, defaultChatConfig, featureFlags, formatDate, getAgentColor, getAgentInitials, mergeConfig, themeUtils, useChatUserContext, validateConfig };
|
package/dist/index.d.ts
CHANGED
|
@@ -85,6 +85,10 @@ interface ChatMessage {
|
|
|
85
85
|
reasoning?: string;
|
|
86
86
|
/** Whether reasoning tokens are still being streamed */
|
|
87
87
|
isReasoningStreaming?: boolean;
|
|
88
|
+
/** Agent/sender identity for multi-agent conversations */
|
|
89
|
+
senderName?: string;
|
|
90
|
+
/** Agent ID of the sender (for multi-agent conversations) */
|
|
91
|
+
senderAgentId?: string;
|
|
88
92
|
}
|
|
89
93
|
interface ChatThread {
|
|
90
94
|
id: string;
|
|
@@ -111,6 +115,8 @@ interface ChatConfig {
|
|
|
111
115
|
enabled?: boolean;
|
|
112
116
|
label?: string;
|
|
113
117
|
hideIfSingle?: boolean;
|
|
118
|
+
/** 'single' = classic single-agent dropdown (default). 'multi' = participants + target selectors. */
|
|
119
|
+
mode?: 'single' | 'multi';
|
|
114
120
|
};
|
|
115
121
|
labels?: {
|
|
116
122
|
inputPlaceholder?: string;
|
|
@@ -279,6 +285,12 @@ interface ChatV2Props {
|
|
|
279
285
|
agentOptions?: AgentOption[];
|
|
280
286
|
selectedAgentId?: string | null;
|
|
281
287
|
onSelectAgent?: (agentId: string) => void;
|
|
288
|
+
/** IDs of agents participating in this conversation */
|
|
289
|
+
participantIds?: string[];
|
|
290
|
+
onParticipantsChange?: (ids: string[]) => void;
|
|
291
|
+
/** ID of the agent this message is directed at */
|
|
292
|
+
targetAgentId?: string | null;
|
|
293
|
+
onTargetAgentChange?: (agentId: string | null) => void;
|
|
282
294
|
suggestions?: string[];
|
|
283
295
|
messageSuggestions?: Record<string, string[]>;
|
|
284
296
|
enabledFeatures?: string[];
|
|
@@ -314,6 +326,8 @@ interface AgentOption {
|
|
|
314
326
|
name: string;
|
|
315
327
|
description?: string;
|
|
316
328
|
avatarUrl?: string;
|
|
329
|
+
/** Custom color for multi-agent display. Auto-assigned if not provided. */
|
|
330
|
+
color?: string;
|
|
317
331
|
}
|
|
318
332
|
type MessageAction = 'copy' | 'edit' | 'delete' | 'regenerate' | 'retry';
|
|
319
333
|
interface MessageActionEvent {
|
|
@@ -400,13 +414,63 @@ interface ChatHeaderProps {
|
|
|
400
414
|
showCustomComponentButton?: boolean;
|
|
401
415
|
isMobile?: boolean;
|
|
402
416
|
showAgentSelector?: boolean;
|
|
417
|
+
isMultiAgentMode?: boolean;
|
|
403
418
|
agentOptions?: AgentOption[];
|
|
404
419
|
selectedAgentId?: string | null;
|
|
405
420
|
onSelectAgent?: (agentId: string) => void;
|
|
421
|
+
participantIds?: string[];
|
|
422
|
+
onParticipantsChange?: (ids: string[]) => void;
|
|
406
423
|
className?: string;
|
|
407
424
|
}
|
|
408
425
|
declare const ChatHeader: React__default.FC<ChatHeaderProps>;
|
|
409
426
|
|
|
427
|
+
interface ParticipantsSelectorProps {
|
|
428
|
+
/** All available agents */
|
|
429
|
+
agents: AgentOption[];
|
|
430
|
+
/** Currently selected participant IDs */
|
|
431
|
+
participantIds: string[];
|
|
432
|
+
/** Callback when participants change */
|
|
433
|
+
onParticipantsChange: (ids: string[]) => void;
|
|
434
|
+
/** Label for the selector */
|
|
435
|
+
label?: string;
|
|
436
|
+
/** Maximum participants to show in collapsed view */
|
|
437
|
+
maxVisible?: number;
|
|
438
|
+
/** Disabled state */
|
|
439
|
+
disabled?: boolean;
|
|
440
|
+
}
|
|
441
|
+
/**
|
|
442
|
+
* Multi-select dropdown for choosing which agents participate in the conversation.
|
|
443
|
+
*/
|
|
444
|
+
declare const ParticipantsSelector: React__default.FC<ParticipantsSelectorProps>;
|
|
445
|
+
interface TargetAgentSelectorProps {
|
|
446
|
+
/** Available agents (should be filtered to participants only) */
|
|
447
|
+
agents: AgentOption[];
|
|
448
|
+
/** Currently targeted agent ID */
|
|
449
|
+
targetAgentId: string | null;
|
|
450
|
+
/** Callback when target changes */
|
|
451
|
+
onTargetChange: (agentId: string | null) => void;
|
|
452
|
+
/** Label for the selector */
|
|
453
|
+
label?: string;
|
|
454
|
+
/** Placeholder when no target is selected */
|
|
455
|
+
placeholder?: string;
|
|
456
|
+
/** Disabled state */
|
|
457
|
+
disabled?: boolean;
|
|
458
|
+
}
|
|
459
|
+
/**
|
|
460
|
+
* Single-select dropdown for choosing which agent to address with @mention.
|
|
461
|
+
*/
|
|
462
|
+
declare const TargetAgentSelector: React__default.FC<TargetAgentSelectorProps>;
|
|
463
|
+
interface AgentBadgeProps {
|
|
464
|
+
agent: AgentOption;
|
|
465
|
+
onRemove?: () => void;
|
|
466
|
+
showRemove?: boolean;
|
|
467
|
+
size?: 'sm' | 'md';
|
|
468
|
+
}
|
|
469
|
+
/**
|
|
470
|
+
* Badge displaying an agent with optional remove button.
|
|
471
|
+
*/
|
|
472
|
+
declare const AgentBadge: React__default.FC<AgentBadgeProps>;
|
|
473
|
+
|
|
410
474
|
interface ChatInputProps {
|
|
411
475
|
value: string;
|
|
412
476
|
onChange: (value: string) => void;
|
|
@@ -457,6 +521,8 @@ interface MessageProps {
|
|
|
457
521
|
onToggleExpanded?: (messageId: string) => void;
|
|
458
522
|
/** When true, hides the avatar and name (for grouped consecutive messages from same sender) */
|
|
459
523
|
isGrouped?: boolean;
|
|
524
|
+
/** Available agents for resolving multi-agent display (colors, avatars) */
|
|
525
|
+
agentOptions?: AgentOption[];
|
|
460
526
|
}
|
|
461
527
|
declare const Message: React__default.FC<MessageProps>;
|
|
462
528
|
|
|
@@ -682,5 +748,13 @@ declare const chatUtils: {
|
|
|
682
748
|
createThread: (title: string) => ChatThread;
|
|
683
749
|
generateThreadTitle: (firstMessage: string) => string;
|
|
684
750
|
};
|
|
751
|
+
/** Deterministic color for an agent based on its ID. */
|
|
752
|
+
declare function getAgentColor(agentId: string): string;
|
|
753
|
+
/** Up to 2-letter initials from an agent name. */
|
|
754
|
+
declare function getAgentInitials(name: string): string;
|
|
755
|
+
/** Assign colors to agents that don't have a custom color. Returns a new array. */
|
|
756
|
+
declare function assignAgentColors(agents: AgentOption[]): (AgentOption & {
|
|
757
|
+
color: string;
|
|
758
|
+
})[];
|
|
685
759
|
|
|
686
|
-
export { type AgentOption, type AudioAttachment, type ChatCallbacks, type ChatConfig, ChatHeader, type ChatHeaderConfig, type ChatHeaderProps, ChatInput, type ChatMarkdownConfig, type ChatMessage, type ChatState, type ChatThread, ChatUI, type ChatUserContext, ChatUserContextProvider, type ChatV2Props, type CreateVoiceProvider, type CustomField, type FileUploadProgress, type MediaAttachment, type MemoryItem, Message, type MessageAction, type MessageActionEvent, Sidebar, type SidebarConfig, type SidebarProps, type StateCallback, type StreamingUpdate, ThreadManager, type ToolCall, type UserCustomField, UserMenu, type UserMenuCallbacks, type UserMenuConfig, type UserMenuProps, type UserMenuUser, UserProfile, type UserProfileConfig, type UserProfileProps, type UserProfileUser, type VoiceComposerState, type VoiceProvider, type VoiceProviderHandlers, type VoiceProviderOptions, type VoiceReviewMode, type VoiceSegment, type VoiceTranscript, type VoiceTranscriptMode, chatConfigPresets, chatUtils, cn, configUtils, createObjectUrlFromDataUrl, defaultChatConfig, featureFlags, formatDate, mergeConfig, themeUtils, useChatUserContext, validateConfig };
|
|
760
|
+
export { AgentBadge, type AgentOption, type AudioAttachment, type ChatCallbacks, type ChatConfig, ChatHeader, type ChatHeaderConfig, type ChatHeaderProps, ChatInput, type ChatMarkdownConfig, type ChatMessage, type ChatState, type ChatThread, ChatUI, type ChatUserContext, ChatUserContextProvider, type ChatV2Props, type CreateVoiceProvider, type CustomField, type FileUploadProgress, type MediaAttachment, type MemoryItem, Message, type MessageAction, type MessageActionEvent, ParticipantsSelector, Sidebar, type SidebarConfig, type SidebarProps, type StateCallback, type StreamingUpdate, TargetAgentSelector, ThreadManager, type ToolCall, type UserCustomField, UserMenu, type UserMenuCallbacks, type UserMenuConfig, type UserMenuProps, type UserMenuUser, UserProfile, type UserProfileConfig, type UserProfileProps, type UserProfileUser, type VoiceComposerState, type VoiceProvider, type VoiceProviderHandlers, type VoiceProviderOptions, type VoiceReviewMode, type VoiceSegment, type VoiceTranscript, type VoiceTranscriptMode, assignAgentColors, chatConfigPresets, chatUtils, cn, configUtils, createObjectUrlFromDataUrl, defaultChatConfig, featureFlags, formatDate, getAgentColor, getAgentInitials, mergeConfig, themeUtils, useChatUserContext, validateConfig };
|