@chatwidgetai/chat-widget 0.1.5 → 0.1.7
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 +7 -8
- package/dist/ai-chat-widget.umd.js +39580 -0
- package/dist/ai-chat-widget.umd.js.map +1 -0
- package/dist/api/client.d.ts +3 -1
- package/dist/api/client.d.ts.map +1 -1
- package/dist/components/ChatWidget.d.ts +1 -1
- package/dist/components/ChatWidget.d.ts.map +1 -1
- package/dist/components/ChatWindow.d.ts +1 -1
- package/dist/components/ChatWindow.d.ts.map +1 -1
- package/dist/components/Message.d.ts.map +1 -1
- package/dist/components/MessageInput.d.ts.map +1 -1
- package/dist/components/SuggestedQuestions.d.ts +2 -2
- package/dist/components/SuggestedQuestions.d.ts.map +1 -1
- package/dist/hooks/useChat.d.ts +0 -1
- package/dist/hooks/useChat.d.ts.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.esm.js +57 -318
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +57 -318
- package/dist/index.js.map +1 -1
- package/dist/types/index.d.ts +5 -122
- package/dist/types/index.d.ts.map +1 -1
- package/dist/umd.d.ts +0 -2
- package/dist/umd.d.ts.map +1 -1
- package/dist/utils/applyAppearanceStyles.d.ts +3 -3
- package/dist/utils/applyAppearanceStyles.d.ts.map +1 -1
- package/dist/utils/autoThemeDetector.d.ts.map +1 -1
- package/package.json +2 -1
package/dist/index.js
CHANGED
|
@@ -6,6 +6,9 @@ var react = require('react');
|
|
|
6
6
|
/**
|
|
7
7
|
* API Client for Widget Communication
|
|
8
8
|
* Handles all HTTP requests to the widget API
|
|
9
|
+
*
|
|
10
|
+
* Note: No API key required - widget ID acts as the access token.
|
|
11
|
+
* The widget ID should be kept confidential by the site owner.
|
|
9
12
|
*/
|
|
10
13
|
class ApiError extends Error {
|
|
11
14
|
constructor(message, status, options) {
|
|
@@ -90,7 +93,6 @@ class WidgetApiClient {
|
|
|
90
93
|
const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/config`, {
|
|
91
94
|
method: 'GET',
|
|
92
95
|
headers: {
|
|
93
|
-
'Authorization': `Bearer ${this.config.apiKey}`,
|
|
94
96
|
'Content-Type': 'application/json',
|
|
95
97
|
},
|
|
96
98
|
});
|
|
@@ -113,9 +115,6 @@ class WidgetApiClient {
|
|
|
113
115
|
const query = params.toString() ? `?${params.toString()}` : '';
|
|
114
116
|
const response = await fetch(`${baseUrl}${query}`, {
|
|
115
117
|
method: 'GET',
|
|
116
|
-
headers: {
|
|
117
|
-
'Authorization': `Bearer ${this.config.apiKey}`,
|
|
118
|
-
},
|
|
119
118
|
});
|
|
120
119
|
if (!response.ok) {
|
|
121
120
|
throw await buildApiError(response, 'Failed to load conversation');
|
|
@@ -131,9 +130,6 @@ class WidgetApiClient {
|
|
|
131
130
|
formData.append('conversationId', conversationId);
|
|
132
131
|
const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/upload`, {
|
|
133
132
|
method: 'POST',
|
|
134
|
-
headers: {
|
|
135
|
-
'Authorization': `Bearer ${this.config.apiKey}`,
|
|
136
|
-
},
|
|
137
133
|
body: formData,
|
|
138
134
|
});
|
|
139
135
|
if (!response.ok) {
|
|
@@ -150,7 +146,6 @@ class WidgetApiClient {
|
|
|
150
146
|
const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/chat`, {
|
|
151
147
|
method: 'POST',
|
|
152
148
|
headers: {
|
|
153
|
-
'Authorization': `Bearer ${this.config.apiKey}`,
|
|
154
149
|
'Content-Type': 'application/json',
|
|
155
150
|
},
|
|
156
151
|
body: JSON.stringify({
|
|
@@ -173,7 +168,6 @@ class WidgetApiClient {
|
|
|
173
168
|
const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/agent`, {
|
|
174
169
|
method: 'POST',
|
|
175
170
|
headers: {
|
|
176
|
-
'Authorization': `Bearer ${this.config.apiKey}`,
|
|
177
171
|
'Content-Type': 'application/json',
|
|
178
172
|
},
|
|
179
173
|
body: JSON.stringify({
|
|
@@ -208,7 +202,6 @@ class WidgetApiClient {
|
|
|
208
202
|
const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/feedback`, {
|
|
209
203
|
method: 'POST',
|
|
210
204
|
headers: {
|
|
211
|
-
'Authorization': `Bearer ${this.config.apiKey}`,
|
|
212
205
|
'Content-Type': 'application/json',
|
|
213
206
|
},
|
|
214
207
|
body: JSON.stringify({
|
|
@@ -235,7 +228,6 @@ class WidgetApiClient {
|
|
|
235
228
|
const response = await fetch(`${this.config.apiUrl}/api/widget/${this.config.widgetId}/validate`, {
|
|
236
229
|
method: 'POST',
|
|
237
230
|
headers: {
|
|
238
|
-
'Authorization': `Bearer ${this.config.apiKey}`,
|
|
239
231
|
'Content-Type': 'application/json',
|
|
240
232
|
},
|
|
241
233
|
body: JSON.stringify({
|
|
@@ -404,7 +396,7 @@ function deriveErrorInfo(error) {
|
|
|
404
396
|
return { message: 'Something went wrong. Please try again.' };
|
|
405
397
|
}
|
|
406
398
|
function useChat(options) {
|
|
407
|
-
const { widgetId,
|
|
399
|
+
const { widgetId, apiUrl, onMessage, onError, } = options;
|
|
408
400
|
const [state, setState] = react.useState({
|
|
409
401
|
messages: [],
|
|
410
402
|
isOpen: false,
|
|
@@ -414,7 +406,7 @@ function useChat(options) {
|
|
|
414
406
|
conversationId: '', // Will be set after loading conversation
|
|
415
407
|
config: null,
|
|
416
408
|
});
|
|
417
|
-
const apiClient = react.useRef(new WidgetApiClient({ widgetId,
|
|
409
|
+
const apiClient = react.useRef(new WidgetApiClient({ widgetId, apiUrl }));
|
|
418
410
|
// Load configuration on mount and hydrate with existing conversation if available
|
|
419
411
|
react.useEffect(() => {
|
|
420
412
|
let isMounted = true;
|
|
@@ -425,8 +417,6 @@ function useChat(options) {
|
|
|
425
417
|
const config = await apiClient.current.getConfig();
|
|
426
418
|
console.log('[useChat] Config fetched successfully:', {
|
|
427
419
|
hasAppearance: !!config.appearance,
|
|
428
|
-
hasLightMode: !!config.appearance?.lightMode,
|
|
429
|
-
hasDarkMode: !!config.appearance?.darkMode,
|
|
430
420
|
});
|
|
431
421
|
const persistConversation = config.behavior.persistConversation ?? true;
|
|
432
422
|
let conversationId = '';
|
|
@@ -473,7 +463,7 @@ function useChat(options) {
|
|
|
473
463
|
console.log('[useChat] Effect cleanup, unmounting component');
|
|
474
464
|
isMounted = false;
|
|
475
465
|
};
|
|
476
|
-
}, [widgetId,
|
|
466
|
+
}, [widgetId, apiUrl, onError]);
|
|
477
467
|
// Save conversation when messages change
|
|
478
468
|
react.useEffect(() => {
|
|
479
469
|
const persistConversation = state.config?.behavior.persistConversation ?? true;
|
|
@@ -21368,8 +21358,8 @@ function defaultUrlTransform(value) {
|
|
|
21368
21358
|
}
|
|
21369
21359
|
|
|
21370
21360
|
// SVG Icon components
|
|
21371
|
-
const ThumbsUpIcon = () => (jsxRuntime.jsx("svg", { width: "
|
|
21372
|
-
const ThumbsDownIcon = () => (jsxRuntime.jsx("svg", { width: "
|
|
21361
|
+
const ThumbsUpIcon = () => (jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3" }) }));
|
|
21362
|
+
const ThumbsDownIcon = () => (jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17" }) }));
|
|
21373
21363
|
const CheckIcon = () => (jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }));
|
|
21374
21364
|
const FeedbackButtons = ({ messageId, currentFeedback, onFeedback, }) => {
|
|
21375
21365
|
const [isSubmitting, setIsSubmitting] = react.useState(false);
|
|
@@ -21450,7 +21440,7 @@ const Message = ({ message, showTimestamp = true, enableFeedback = true, showSou
|
|
|
21450
21440
|
const showTimestampForThis = showTimestamp && !isTool && !(isAssistant && !aiHasContent);
|
|
21451
21441
|
return (jsxRuntime.jsxs("div", { className: `ai-chat-message ${messageClass}`, children: [isTool ? (
|
|
21452
21442
|
// Render tool call completion as a standalone, non-bubble event
|
|
21453
|
-
renderTool()) : (jsxRuntime.jsx("div", { className: "ai-chat-message-content", children: isAssistant ? (renderAssistant()) : isSystem ? (jsxRuntime.jsxs("div", { className: "ai-chat-system-message", children: [jsxRuntime.jsx("span", { className: "system-icon", children: "\u2139\uFE0F" }), message.message.content] })) : (userMessage) })), showTimestampForThis && (jsxRuntime.
|
|
21443
|
+
renderTool()) : (jsxRuntime.jsx("div", { className: "ai-chat-message-content", children: isAssistant ? (renderAssistant()) : isSystem ? (jsxRuntime.jsxs("div", { className: "ai-chat-system-message", children: [jsxRuntime.jsx("span", { className: "system-icon", children: "\u2139\uFE0F" }), message.message.content] })) : (userMessage) })), showTimestampForThis && (jsxRuntime.jsxs("div", { className: "ai-chat-message-meta", children: [jsxRuntime.jsx("span", { className: "ai-chat-message-timestamp", children: formatTime(message.timestamp) }), isAssistant && aiHasContent && enableFeedback && onFeedback && (jsxRuntime.jsx(FeedbackButtons, { messageId: message.id, currentFeedback: message.feedback, onFeedback: onFeedback }))] })), isAssistant && aiHasContent && showSources && message.sources && message.sources.length > 0 && (jsxRuntime.jsx(Sources, { sources: message.sources, displayMode: sourceDisplayMode }))] }));
|
|
21454
21444
|
};
|
|
21455
21445
|
|
|
21456
21446
|
const TypingIndicator = () => {
|
|
@@ -21561,15 +21551,14 @@ const MessageInput = ({ onSend, placeholder = 'Type your message...', disabled =
|
|
|
21561
21551
|
textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;
|
|
21562
21552
|
}
|
|
21563
21553
|
};
|
|
21564
|
-
|
|
21554
|
+
const canSend = value.trim() || selectedFiles.length > 0;
|
|
21565
21555
|
return (jsxRuntime.jsxs("div", { className: `ai-chat-input-container ${separateFromChat ? 'separate' : 'integrated'}`, children: [selectedFiles.length > 0 && (jsxRuntime.jsx("div", { className: "ai-chat-file-list", children: selectedFiles.map((file, index) => {
|
|
21566
21556
|
const ext = getFileExtension(file.name);
|
|
21567
|
-
return (jsxRuntime.jsxs("div", { className: "ai-chat-file-item", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-extension", children: ext }), jsxRuntime.jsxs("div", { className: "ai-chat-file-info", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-name", children: file.name }), jsxRuntime.jsx("span", { className: "ai-chat-file-size", children: formatFileSize(file.size) })] }), jsxRuntime.jsx("button", { className: "ai-chat-file-remove", onClick: () => handleRemoveFile(index), "aria-label": "Remove file", children: "
|
|
21568
|
-
}) })), jsxRuntime.jsxs("div", { className: "ai-chat-input-wrapper", children: [enableFileUpload && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", onChange: handleFileSelect, style: { display: 'none' }, multiple: true, accept: ALLOWED_EXTENSIONS.join(','), "aria-label": "File input" }), jsxRuntime.jsx("button", { className: "ai-chat-file-button", onClick: () => fileInputRef.current?.click(), disabled: disabled, "aria-label": "Attach file", children: jsxRuntime.jsx("svg", { width: "
|
|
21557
|
+
return (jsxRuntime.jsxs("div", { className: "ai-chat-file-item", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-extension", children: ext }), jsxRuntime.jsxs("div", { className: "ai-chat-file-info", children: [jsxRuntime.jsx("span", { className: "ai-chat-file-name", children: file.name }), jsxRuntime.jsx("span", { className: "ai-chat-file-size", children: formatFileSize(file.size) })] }), jsxRuntime.jsx("button", { className: "ai-chat-file-remove", onClick: () => handleRemoveFile(index), "aria-label": "Remove file", children: jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M18 6L6 18M6 6l12 12" }) }) })] }, index));
|
|
21558
|
+
}) })), jsxRuntime.jsxs("div", { className: "ai-chat-input-wrapper", children: [enableFileUpload && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", onChange: handleFileSelect, style: { display: 'none' }, multiple: true, accept: ALLOWED_EXTENSIONS.join(','), "aria-label": "File input" }), jsxRuntime.jsx("button", { className: "ai-chat-file-button", onClick: () => fileInputRef.current?.click(), disabled: disabled, "aria-label": "Attach file", children: jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) }) })] })), jsxRuntime.jsx("textarea", { ref: textareaRef, className: "ai-chat-input", value: value, onChange: handleChange, onKeyDown: handleKeyDown, placeholder: placeholder, disabled: disabled, rows: 1, "aria-label": "Message input" }), jsxRuntime.jsx("button", { className: `ai-chat-send-button ${canSend ? 'active' : ''}`, onClick: handleSend, disabled: disabled || !canSend, "aria-label": "Send message", children: jsxRuntime.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M22 2L11 13" }), jsxRuntime.jsx("path", { d: "M22 2L15 22L11 13L2 9L22 2Z" })] }) })] })] }));
|
|
21569
21559
|
};
|
|
21570
21560
|
|
|
21571
|
-
|
|
21572
|
-
const LightbulbIcon = () => (jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M9 18h6" }), jsxRuntime.jsx("path", { d: "M10 22h4" }), jsxRuntime.jsx("path", { d: "M15.09 14c.18-.98.65-1.74 1.41-2.5A4.65 4.65 0 0 0 18 8 6 6 0 0 0 6 8c0 1 .23 2.23 1.5 3.5A4.61 4.61 0 0 1 8.91 14" })] }));
|
|
21561
|
+
const ArrowIcon = () => (jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M5 12h14M12 5l7 7-7 7" }) }));
|
|
21573
21562
|
const SuggestedQuestions = ({ questions, onQuestionClick, }) => {
|
|
21574
21563
|
if (!questions || questions.length === 0) {
|
|
21575
21564
|
return null;
|
|
@@ -21579,27 +21568,25 @@ const SuggestedQuestions = ({ questions, onQuestionClick, }) => {
|
|
|
21579
21568
|
if (validQuestions.length === 0) {
|
|
21580
21569
|
return null;
|
|
21581
21570
|
}
|
|
21582
|
-
return (jsxRuntime.
|
|
21571
|
+
return (jsxRuntime.jsx("div", { className: "ai-chat-suggested-questions", children: jsxRuntime.jsx("div", { className: "ai-chat-suggested-questions-list", children: validQuestions.slice(0, 3).map((question, index) => (jsxRuntime.jsxs("button", { className: "ai-chat-suggested-question", onClick: () => onQuestionClick(question), type: "button", children: [jsxRuntime.jsx("span", { className: "ai-chat-suggested-question-text", children: question }), jsxRuntime.jsx("span", { className: "ai-chat-suggested-question-icon", children: jsxRuntime.jsx(ArrowIcon, {}) })] }, index))) }) }));
|
|
21583
21572
|
};
|
|
21584
21573
|
|
|
21574
|
+
const MinimizeIcon = () => (jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M5 12h14" }) }));
|
|
21585
21575
|
const ChatWindow = ({ messages, isLoading, isTyping, error, config, onSendMessage, onClose, onFeedback, }) => {
|
|
21586
21576
|
console.log('[ChatWindow] Rendering ChatWindow component');
|
|
21587
21577
|
const appearance = config?.appearance;
|
|
21588
21578
|
const behavior = config?.behavior;
|
|
21579
|
+
// Use simplified appearance fields
|
|
21589
21580
|
const size = appearance?.size || 'medium';
|
|
21590
|
-
|
|
21591
|
-
|
|
21592
|
-
const
|
|
21593
|
-
|
|
21594
|
-
|
|
21595
|
-
|
|
21596
|
-
|
|
21597
|
-
|
|
21598
|
-
|
|
21599
|
-
const headerTitle = themeConfig?.header?.title ?? appearance?.header?.title ?? appearance?.companyName ?? 'AI Assistant';
|
|
21600
|
-
const welcomeTitle = themeConfig?.chat?.welcomeTitle ?? 'Welcome!';
|
|
21601
|
-
const welcomeMessage = themeConfig?.chat?.welcomeMessage ?? appearance?.welcomeMessage ?? '👋 Hi there! How can I assist you today?';
|
|
21602
|
-
const inputPlaceholder = themeConfig?.footer?.inputPlaceholder ?? appearance?.placeholder ?? 'Ask me anything...';
|
|
21581
|
+
const headerTitle = appearance?.headerTitle || 'AI Assistant';
|
|
21582
|
+
const welcomeMessage = appearance?.welcomeMessage || '👋 Hi there! How can I assist you today?';
|
|
21583
|
+
const inputPlaceholder = appearance?.placeholder || 'Ask me anything...';
|
|
21584
|
+
console.log('[ChatWindow] Appearance values:', {
|
|
21585
|
+
size,
|
|
21586
|
+
headerTitle,
|
|
21587
|
+
welcomeMessage,
|
|
21588
|
+
inputPlaceholder,
|
|
21589
|
+
});
|
|
21603
21590
|
// Track if suggested questions should be shown
|
|
21604
21591
|
const [showSuggestedQuestions, setShowSuggestedQuestions] = react.useState(true);
|
|
21605
21592
|
// Hide suggested questions after first user message
|
|
@@ -21618,241 +21605,26 @@ const ChatWindow = ({ messages, isLoading, isTyping, error, config, onSendMessag
|
|
|
21618
21605
|
setShowSuggestedQuestions(false);
|
|
21619
21606
|
onSendMessage(question);
|
|
21620
21607
|
};
|
|
21621
|
-
|
|
21608
|
+
const hasMessages = messages.length > 0;
|
|
21609
|
+
return (jsxRuntime.jsxs("div", { className: `ai-chat-window size-${size}`, role: "dialog", "aria-label": "Chat window", children: [jsxRuntime.jsxs("div", { className: "ai-chat-header", children: [jsxRuntime.jsxs("div", { className: "ai-chat-header-content", children: [appearance?.logo && (jsxRuntime.jsx("img", { src: appearance.logo, alt: "Logo", className: "ai-chat-logo" })), jsxRuntime.jsx("div", { className: "ai-chat-title", children: headerTitle })] }), jsxRuntime.jsx("button", { className: "ai-chat-close-button", onClick: onClose, "aria-label": "Minimize chat", children: jsxRuntime.jsx(MinimizeIcon, {}) })] }), error && (jsxRuntime.jsx("div", { className: "ai-chat-error", role: "alert", children: error })), maxMessages && userMessageCount >= maxMessages - 2 && !isLimitReached && (jsxRuntime.jsxs("div", { className: "ai-chat-warning", role: "alert", children: [maxMessages - userMessageCount, " message", maxMessages - userMessageCount !== 1 ? 's' : '', " remaining"] })), isLimitReached && (jsxRuntime.jsx("div", { className: "ai-chat-error", role: "alert", children: "Message limit reached. Please start a new conversation." })), jsxRuntime.jsx(MessageList, { messages: messages, isTyping: isTyping, showTypingIndicator: behavior?.showTypingIndicator, showTimestamps: behavior?.showTimestamps, enableFeedback: behavior?.enableFeedback, showSources: behavior?.showSources, sourceDisplayMode: behavior?.sourceDisplayMode, welcomeMessage: welcomeMessage, onFeedback: onFeedback }), showSuggestedQuestions && !hasMessages && behavior?.suggestedQuestions && behavior.suggestedQuestions.length > 0 && (jsxRuntime.jsx(SuggestedQuestions, { questions: behavior.suggestedQuestions, onQuestionClick: handleQuestionClick })), jsxRuntime.jsx(MessageInput, { onSend: onSendMessage, placeholder: isLimitReached ? 'Message limit reached' : inputPlaceholder, disabled: isLoading || isLimitReached, enableFileUpload: behavior?.enableFileUpload })] }));
|
|
21622
21610
|
};
|
|
21623
21611
|
|
|
21624
|
-
/**
|
|
21625
|
-
* Convert shadow size to CSS box-shadow value
|
|
21626
|
-
*/
|
|
21627
|
-
function getShadowValue(size) {
|
|
21628
|
-
const shadows = {
|
|
21629
|
-
'none': 'none',
|
|
21630
|
-
'sm': '0 1px 2px 0 rgba(0, 0, 0, 0.05)',
|
|
21631
|
-
'md': '0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)',
|
|
21632
|
-
'lg': '0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)',
|
|
21633
|
-
'xl': '0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)',
|
|
21634
|
-
'2xl': '0 25px 50px -12px rgba(0, 0, 0, 0.25)',
|
|
21635
|
-
};
|
|
21636
|
-
return shadows[size] || shadows.none;
|
|
21637
|
-
}
|
|
21638
21612
|
/**
|
|
21639
21613
|
* Apply appearance configuration as CSS custom properties
|
|
21640
|
-
*
|
|
21614
|
+
* Simplified to only handle flat appearance schema
|
|
21641
21615
|
*
|
|
21642
21616
|
* @param appearance - Widget appearance configuration
|
|
21643
|
-
* @param theme - Current theme ('light' or 'dark')
|
|
21617
|
+
* @param theme - Current theme ('light' or 'dark') - kept for compatibility but not used for theme selection
|
|
21644
21618
|
*/
|
|
21645
|
-
function applyAppearanceStyles(appearance
|
|
21619
|
+
function applyAppearanceStyles(appearance) {
|
|
21646
21620
|
const styles = {};
|
|
21647
|
-
//
|
|
21648
|
-
if (appearance.
|
|
21649
|
-
styles
|
|
21650
|
-
}
|
|
21651
|
-
// Select the correct theme configuration
|
|
21652
|
-
const themeConfig = theme === 'dark' ? appearance.darkMode : appearance.lightMode;
|
|
21653
|
-
// If theme config exists and has required properties, use it
|
|
21654
|
-
if (themeConfig && themeConfig.button) {
|
|
21655
|
-
// ========================================================================
|
|
21656
|
-
// BUTTON APPEARANCE
|
|
21657
|
-
// ========================================================================
|
|
21658
|
-
const btn = themeConfig.button;
|
|
21659
|
-
if (btn.color)
|
|
21660
|
-
styles['--button-color'] = btn.color;
|
|
21661
|
-
if (btn.opacity !== undefined)
|
|
21662
|
-
styles['--button-opacity'] = btn.opacity.toString();
|
|
21663
|
-
if (btn.size)
|
|
21664
|
-
styles['--button-size'] = `${btn.size}px`;
|
|
21665
|
-
if (btn.icon)
|
|
21666
|
-
styles['--button-icon'] = btn.icon;
|
|
21667
|
-
if (btn.iconColor)
|
|
21668
|
-
styles['--button-icon-color'] = btn.iconColor;
|
|
21669
|
-
if (btn.borderRadius !== undefined)
|
|
21670
|
-
styles['--button-border-radius'] = `${btn.borderRadius}px`;
|
|
21671
|
-
if (btn.borderWidth !== undefined)
|
|
21672
|
-
styles['--button-border-width'] = `${btn.borderWidth}px`;
|
|
21673
|
-
if (btn.borderColor)
|
|
21674
|
-
styles['--button-border-color'] = btn.borderColor;
|
|
21675
|
-
if (btn.borderOpacity !== undefined)
|
|
21676
|
-
styles['--button-border-opacity'] = btn.borderOpacity.toString();
|
|
21677
|
-
if (btn.backdropBlur !== undefined)
|
|
21678
|
-
styles['--button-backdrop-blur'] = `${btn.backdropBlur}px`;
|
|
21679
|
-
if (btn.shadow)
|
|
21680
|
-
styles['--button-shadow'] = getShadowValue(btn.shadow);
|
|
21681
|
-
// ========================================================================
|
|
21682
|
-
// CARD/WINDOW APPEARANCE
|
|
21683
|
-
// ========================================================================
|
|
21684
|
-
const card = themeConfig.card;
|
|
21685
|
-
if (card.backgroundColor)
|
|
21686
|
-
styles['--card-background'] = card.backgroundColor;
|
|
21687
|
-
if (card.opacity !== undefined)
|
|
21688
|
-
styles['--card-opacity'] = card.opacity.toString();
|
|
21689
|
-
if (card.borderRadius !== undefined)
|
|
21690
|
-
styles['--card-border-radius'] = `${card.borderRadius}px`;
|
|
21691
|
-
if (card.borderWidth !== undefined)
|
|
21692
|
-
styles['--card-border-width'] = `${card.borderWidth}px`;
|
|
21693
|
-
if (card.borderColor) {
|
|
21694
|
-
styles['--card-border-color'] = card.borderColor;
|
|
21695
|
-
// Create rgba border color with opacity for box-shadow
|
|
21696
|
-
if (card.borderOpacity !== undefined) {
|
|
21697
|
-
const opacity = card.borderOpacity;
|
|
21698
|
-
// Convert hex to rgba
|
|
21699
|
-
const hex = card.borderColor.replace('#', '');
|
|
21700
|
-
const r = parseInt(hex.substring(0, 2), 16);
|
|
21701
|
-
const g = parseInt(hex.substring(2, 4), 16);
|
|
21702
|
-
const b = parseInt(hex.substring(4, 6), 16);
|
|
21703
|
-
styles['--card-border-color-rgba'] = `rgba(${r}, ${g}, ${b}, ${opacity})`;
|
|
21704
|
-
}
|
|
21705
|
-
}
|
|
21706
|
-
if (card.borderOpacity !== undefined)
|
|
21707
|
-
styles['--card-border-opacity'] = card.borderOpacity.toString();
|
|
21708
|
-
if (card.backdropBlur !== undefined)
|
|
21709
|
-
styles['--card-backdrop-blur'] = `${card.backdropBlur}px`;
|
|
21710
|
-
if (card.shadow)
|
|
21711
|
-
styles['--card-shadow'] = getShadowValue(card.shadow);
|
|
21712
|
-
// ========================================================================
|
|
21713
|
-
// HEADER APPEARANCE
|
|
21714
|
-
// ========================================================================
|
|
21715
|
-
const header = themeConfig.header;
|
|
21716
|
-
if (header.backgroundColor)
|
|
21717
|
-
styles['--header-background'] = header.backgroundColor;
|
|
21718
|
-
if (header.opacity !== undefined)
|
|
21719
|
-
styles['--header-opacity'] = header.opacity.toString();
|
|
21720
|
-
if (header.textColor)
|
|
21721
|
-
styles['--header-text-color'] = header.textColor;
|
|
21722
|
-
if (header.borderBottomWidth !== undefined)
|
|
21723
|
-
styles['--header-border-bottom-width'] = `${header.borderBottomWidth}px`;
|
|
21724
|
-
if (header.borderBottomColor)
|
|
21725
|
-
styles['--header-border-bottom-color'] = header.borderBottomColor;
|
|
21726
|
-
if (header.borderBottomOpacity !== undefined)
|
|
21727
|
-
styles['--header-border-bottom-opacity'] = header.borderBottomOpacity.toString();
|
|
21728
|
-
// ========================================================================
|
|
21729
|
-
// CHAT APPEARANCE
|
|
21730
|
-
// ========================================================================
|
|
21731
|
-
const chat = themeConfig.chat;
|
|
21732
|
-
if (chat.backgroundColor)
|
|
21733
|
-
styles['--chat-background'] = chat.backgroundColor;
|
|
21734
|
-
if (chat.opacity !== undefined)
|
|
21735
|
-
styles['--chat-opacity'] = chat.opacity.toString();
|
|
21736
|
-
// Welcome message
|
|
21737
|
-
if (chat.welcomeColor)
|
|
21738
|
-
styles['--welcome-color'] = chat.welcomeColor;
|
|
21739
|
-
// Message bubbles
|
|
21740
|
-
if (chat.enableBubbles) {
|
|
21741
|
-
if (chat.bubbleUserColor)
|
|
21742
|
-
styles['--bubble-user-color'] = chat.bubbleUserColor;
|
|
21743
|
-
if (chat.bubbleUserOpacity !== undefined)
|
|
21744
|
-
styles['--bubble-user-opacity'] = chat.bubbleUserOpacity.toString();
|
|
21745
|
-
if (chat.bubbleAssistantColor)
|
|
21746
|
-
styles['--bubble-assistant-color'] = chat.bubbleAssistantColor;
|
|
21747
|
-
if (chat.bubbleAssistantOpacity !== undefined)
|
|
21748
|
-
styles['--bubble-assistant-opacity'] = chat.bubbleAssistantOpacity.toString();
|
|
21749
|
-
if (chat.bubbleBorderWidth !== undefined)
|
|
21750
|
-
styles['--bubble-border-width'] = `${chat.bubbleBorderWidth}px`;
|
|
21751
|
-
if (chat.bubbleBorderColor)
|
|
21752
|
-
styles['--bubble-border-color'] = chat.bubbleBorderColor;
|
|
21753
|
-
if (chat.bubbleBorderOpacity !== undefined)
|
|
21754
|
-
styles['--bubble-border-opacity'] = chat.bubbleBorderOpacity.toString();
|
|
21755
|
-
}
|
|
21756
|
-
else {
|
|
21757
|
-
// Plain text mode
|
|
21758
|
-
if (chat.textColor)
|
|
21759
|
-
styles['--message-text-color'] = chat.textColor;
|
|
21760
|
-
}
|
|
21761
|
-
// ========================================================================
|
|
21762
|
-
// FOOTER APPEARANCE
|
|
21763
|
-
// ========================================================================
|
|
21764
|
-
const footer = themeConfig.footer;
|
|
21765
|
-
// Only if separate from chat
|
|
21766
|
-
if (footer.separateFromChat) {
|
|
21767
|
-
if (footer.backgroundColor)
|
|
21768
|
-
styles['--footer-background'] = footer.backgroundColor;
|
|
21769
|
-
if (footer.opacity !== undefined)
|
|
21770
|
-
styles['--footer-opacity'] = footer.opacity.toString();
|
|
21771
|
-
if (footer.borderTopWidth !== undefined)
|
|
21772
|
-
styles['--footer-border-top-width'] = `${footer.borderTopWidth}px`;
|
|
21773
|
-
if (footer.borderTopColor)
|
|
21774
|
-
styles['--footer-border-top-color'] = footer.borderTopColor;
|
|
21775
|
-
if (footer.borderTopOpacity !== undefined)
|
|
21776
|
-
styles['--footer-border-top-opacity'] = footer.borderTopOpacity.toString();
|
|
21777
|
-
}
|
|
21778
|
-
// Backdrop blur (only when floating)
|
|
21779
|
-
if (!footer.separateFromChat && footer.backdropBlur !== undefined) {
|
|
21780
|
-
styles['--footer-backdrop-blur'] = `${footer.backdropBlur}px`;
|
|
21781
|
-
}
|
|
21782
|
-
// Input field
|
|
21783
|
-
if (footer.inputBackgroundColor)
|
|
21784
|
-
styles['--input-background'] = footer.inputBackgroundColor;
|
|
21785
|
-
if (footer.inputBackgroundOpacity !== undefined)
|
|
21786
|
-
styles['--input-background-opacity'] = footer.inputBackgroundOpacity.toString();
|
|
21787
|
-
if (footer.inputBorderRadius !== undefined)
|
|
21788
|
-
styles['--input-border-radius'] = `${footer.inputBorderRadius}px`;
|
|
21789
|
-
if (footer.inputBorderWidth !== undefined)
|
|
21790
|
-
styles['--input-border-width'] = `${footer.inputBorderWidth}px`;
|
|
21791
|
-
if (footer.inputBorderColor)
|
|
21792
|
-
styles['--input-border-color'] = footer.inputBorderColor;
|
|
21793
|
-
if (footer.inputBorderOpacity !== undefined)
|
|
21794
|
-
styles['--input-border-opacity'] = footer.inputBorderOpacity.toString();
|
|
21795
|
-
if (footer.inputShadow)
|
|
21796
|
-
styles['--input-shadow'] = getShadowValue(footer.inputShadow);
|
|
21797
|
-
// Send button
|
|
21798
|
-
if (footer.buttonBackgroundColor)
|
|
21799
|
-
styles['--send-button-background'] = footer.buttonBackgroundColor;
|
|
21800
|
-
if (footer.buttonOpacity !== undefined)
|
|
21801
|
-
styles['--send-button-opacity'] = footer.buttonOpacity.toString();
|
|
21802
|
-
if (footer.buttonBorderRadius !== undefined)
|
|
21803
|
-
styles['--send-button-border-radius'] = `${footer.buttonBorderRadius}px`;
|
|
21804
|
-
if (footer.buttonBorderWidth !== undefined)
|
|
21805
|
-
styles['--send-button-border-width'] = `${footer.buttonBorderWidth}px`;
|
|
21806
|
-
if (footer.buttonBorderColor)
|
|
21807
|
-
styles['--send-button-border-color'] = footer.buttonBorderColor;
|
|
21808
|
-
if (footer.buttonBorderOpacity !== undefined)
|
|
21809
|
-
styles['--send-button-border-opacity'] = footer.buttonBorderOpacity.toString();
|
|
21810
|
-
// ========================================================================
|
|
21811
|
-
// HOVER STATES
|
|
21812
|
-
// ========================================================================
|
|
21813
|
-
const hover = themeConfig.hover;
|
|
21814
|
-
if (hover.buttonScale !== undefined)
|
|
21815
|
-
styles['--hover-button-scale'] = hover.buttonScale.toString();
|
|
21816
|
-
if (hover.buttonOpacity !== undefined)
|
|
21817
|
-
styles['--hover-button-opacity'] = hover.buttonOpacity.toString();
|
|
21818
|
-
if (hover.inputBorderColor)
|
|
21819
|
-
styles['--hover-input-border-color'] = hover.inputBorderColor;
|
|
21820
|
-
if (hover.sendButtonOpacity !== undefined)
|
|
21821
|
-
styles['--hover-send-button-opacity'] = hover.sendButtonOpacity.toString();
|
|
21822
|
-
if (hover.closeButtonOpacity !== undefined)
|
|
21823
|
-
styles['--hover-close-button-opacity'] = hover.closeButtonOpacity.toString();
|
|
21824
|
-
// ========================================================================
|
|
21825
|
-
// ACTIVE STATES
|
|
21826
|
-
// ========================================================================
|
|
21827
|
-
const active = themeConfig.active;
|
|
21828
|
-
if (active.inputBorderColor)
|
|
21829
|
-
styles['--active-input-border-color'] = active.inputBorderColor;
|
|
21830
|
-
if (active.inputShadow)
|
|
21831
|
-
styles['--active-input-shadow'] = active.inputShadow;
|
|
21832
|
-
}
|
|
21833
|
-
else {
|
|
21834
|
-
// Fallback to legacy fields if no theme config
|
|
21835
|
-
if (appearance.primaryColor)
|
|
21836
|
-
styles['--primary-color'] = appearance.primaryColor;
|
|
21837
|
-
if (appearance.borderRadius !== undefined)
|
|
21838
|
-
styles['--border-radius'] = `${appearance.borderRadius}px`;
|
|
21839
|
-
// Legacy button
|
|
21840
|
-
if (appearance.button) {
|
|
21841
|
-
const btn = appearance.button;
|
|
21842
|
-
if (btn.color)
|
|
21843
|
-
styles['--button-color'] = btn.color;
|
|
21844
|
-
if (btn.size)
|
|
21845
|
-
styles['--button-size'] = `${btn.size}px`;
|
|
21846
|
-
if (btn.borderRadius !== undefined)
|
|
21847
|
-
styles['--button-border-radius'] = `${btn.borderRadius}px`;
|
|
21848
|
-
if (btn.borderWidth !== undefined)
|
|
21849
|
-
styles['--button-border-width'] = `${btn.borderWidth}px`;
|
|
21850
|
-
if (btn.borderColor)
|
|
21851
|
-
styles['--button-border-color'] = btn.borderColor;
|
|
21852
|
-
if (btn.opacity !== undefined)
|
|
21853
|
-
styles['--button-opacity'] = btn.opacity.toString();
|
|
21854
|
-
}
|
|
21621
|
+
// Apply primary color
|
|
21622
|
+
if (appearance.primaryColor) {
|
|
21623
|
+
styles['--primary-color'] = appearance.primaryColor;
|
|
21855
21624
|
}
|
|
21625
|
+
// Note: All legacy theme system code (lightMode, darkMode, ThemeAppearanceConfig)
|
|
21626
|
+
// has been removed. The widget now uses a simplified flat appearance schema.
|
|
21627
|
+
// Theme-specific styling is handled by generateThemeStyles() using auto-detected theme.
|
|
21856
21628
|
return styles;
|
|
21857
21629
|
}
|
|
21858
21630
|
|
|
@@ -22214,19 +21986,23 @@ function detectTheme(element) {
|
|
|
22214
21986
|
* Create a MutationObserver to watch for theme changes
|
|
22215
21987
|
*/
|
|
22216
21988
|
function createThemeObserver(element, callback) {
|
|
21989
|
+
let lastTheme = detectTheme(element);
|
|
22217
21990
|
const observer = new MutationObserver(() => {
|
|
22218
21991
|
const theme = detectTheme(element);
|
|
22219
|
-
|
|
21992
|
+
if (theme !== lastTheme) {
|
|
21993
|
+
lastTheme = theme;
|
|
21994
|
+
callback(theme);
|
|
21995
|
+
}
|
|
22220
21996
|
});
|
|
22221
21997
|
// Observe body for class/style changes (common for theme switching)
|
|
22222
21998
|
observer.observe(document.body, {
|
|
22223
21999
|
attributes: true,
|
|
22224
|
-
attributeFilter: ['class', 'style', 'data-theme'],
|
|
22000
|
+
attributeFilter: ['class', 'style', 'data-theme', 'data-bs-theme'],
|
|
22225
22001
|
});
|
|
22226
22002
|
// Also observe html element
|
|
22227
22003
|
observer.observe(document.documentElement, {
|
|
22228
22004
|
attributes: true,
|
|
22229
|
-
attributeFilter: ['class', 'style', 'data-theme'],
|
|
22005
|
+
attributeFilter: ['class', 'style', 'data-theme', 'data-bs-theme'],
|
|
22230
22006
|
});
|
|
22231
22007
|
return observer;
|
|
22232
22008
|
}
|
|
@@ -22258,35 +22034,24 @@ function styleInject(css, ref) {
|
|
|
22258
22034
|
}
|
|
22259
22035
|
}
|
|
22260
22036
|
|
|
22261
|
-
var css_248z$1 = ".ai-chat-widget{--primary-color:#07f;--background-color:#fff;--text-color:#1f2937;--border-color:#e5e7eb;--user-message-bg:var(--primary-color);--user-message-text:#fff;--assistant-message-bg:#f3f4f6;--assistant-message-text:#374151;--input-bg:#fff;--input-border:#d1d5db;--shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--button-color:#07f;--button-size:56px;--button-border-radius:28px;--button-border-width:0px;--button-border-color:#07f;--button-opacity:1;--button-backdrop-blur:0px;--button-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--card-background:#fff;--card-border-radius:16px;--card-border-width:0px;--card-border-color:#e5e7eb;--card-opacity:1;--card-backdrop-blur:0px;--card-shadow:0 25px 50px -12px rgba(0,0,0,.25);--header-background:#07f;--header-text-color:#fff;--header-font-size:18px;--header-border-bottom-width:0px;--header-border-bottom-color:#e5e7eb;--header-opacity:1;--header-backdrop-blur:0px;--chat-background:#fff;--chat-opacity:1;--chat-backdrop-blur:0px;--welcome-font-size:16px;--welcome-color:#1f2937;--welcome-opacity:1;--bubble-user-color:#07f;--bubble-assistant-color:#f3f4f6;--bubble-border-radius:16px;--bubble-border-width:0px;--bubble-border-color:#e5e7eb;--bubble-opacity:1;--typing-animation-color:#f3f4f6;--typing-animation-opacity:1;--typing-animation-border-width:0px;--typing-animation-border-color:#e5e7eb;--typing-animation-border-radius:16px;--footer-background:#fff;--footer-border-top-width:1px;--footer-border-top-color:#e5e7eb;--footer-opacity:1;--footer-backdrop-blur:0px;--input-background:#fff;--input-border-radius:24px;--input-border-width:1.5px;--input-border-color:#d1d5db;--input-opacity:1;--input-shadow:0 1px 2px 0 rgba(0,0,0,.05);--send-button-background:#07f;--send-button-border-radius:20px;--send-button-border-width:0px;--send-button-border-color:#07f;--send-button-opacity:1;--hover-button-scale:1.05;--hover-button-opacity:0.9;--hover-input-border-color:#9ca3af;--hover-send-button-opacity:0.85;--hover-close-button-opacity:1;--active-input-border-color:#07f;--active-input-shadow:0 0 0 3px rgba(0,119,255,.1);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.ai-chat-widget.dark{--background-color:#001d3d;--text-color:#f9fafb;--border-color:#374151;--assistant-message-bg:#036;--assistant-message-text:#e5e7eb;--input-bg:#002855;--input-border:#374151}.ai-chat-widget.dark .ai-chat-message.system .ai-chat-message-content{background-color:#78350f;color:#fef3c7}.ai-chat-widget.dark .ai-chat-message.tool .ai-chat-message-content{background-color:#1e3a8a;color:#dbeafe}.ai-chat-widget-container{font-size:14px;line-height:1.5;position:fixed;z-index:9999}.ai-chat-widget-container.bottom-right{bottom:20px;right:20px}.ai-chat-widget-container.bottom-left{bottom:20px;left:20px}.ai-chat-widget-container.top-right{right:20px;top:20px}.ai-chat-widget-container.top-left{left:20px;top:20px}.ai-chat-button{align-items:center;backdrop-filter:blur(var(--button-backdrop-blur));-webkit-backdrop-filter:blur(var(--button-backdrop-blur));background-color:var(--button-color);border:var(--button-border-width) solid var(--button-border-color);border-radius:var(--button-border-radius);box-shadow:var(--button-shadow);color:#fff;cursor:pointer;display:flex;height:var(--button-size);justify-content:center;opacity:var(--button-opacity);transition:all .3s cubic-bezier(.4,0,.2,1);width:var(--button-size)}.ai-chat-button:hover{box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);opacity:var(--hover-button-opacity);transform:scale(var(--hover-button-scale))}.ai-chat-button:active{transform:scale(.95)}.ai-chat-button-svg{height:50%;min-height:24px;min-width:24px;width:50%}.ai-chat-button-icon{font-size:1.5em;line-height:1}.ai-chat-window{border-radius:var(--card-border-radius);box-shadow:0 0 0 var(--card-border-width) var(--card-border-color-rgba,var(--card-border-color)),var(--card-shadow);display:flex;flex-direction:column;overflow:hidden;position:absolute}.ai-chat-window>*{position:relative;z-index:1}.ai-chat-window:before{backdrop-filter:blur(var(--card-backdrop-blur));-webkit-backdrop-filter:blur(var(--card-backdrop-blur));background-color:var(--card-background);border-radius:var(--card-border-radius);content:\"\";inset:0;opacity:var(--card-opacity);pointer-events:none;position:absolute;z-index:0}.ai-chat-widget-container.bottom-right .ai-chat-window{bottom:calc(var(--button-size, 60px) + 16px);right:0}.ai-chat-widget-container.bottom-left .ai-chat-window{bottom:calc(var(--button-size, 60px) + 16px);left:0}.ai-chat-widget-container.top-right .ai-chat-window{right:0;top:calc(var(--button-size, 60px) + 16px)}.ai-chat-widget-container.top-left .ai-chat-window{left:0;top:calc(var(--button-size, 60px) + 16px)}.ai-chat-button{z-index:1}.ai-chat-window{z-index:2}.ai-chat-window.size-small{height:500px;width:380px}.ai-chat-window.size-medium{height:650px;width:440px}.ai-chat-window.size-large{height:750px;width:520px}.ai-chat-logo{border-radius:50%;height:32px;object-fit:cover;width:32px}.ai-chat-messages::-webkit-scrollbar{width:6px}.ai-chat-messages::-webkit-scrollbar-track{background:transparent}.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:var(--input-border)}.ai-chat-message{display:flex;flex-direction:column;gap:4px}.ai-chat-message.user{align-items:flex-end}.ai-chat-message.assistant{align-items:flex-start}.ai-chat-message.system{align-items:center}.ai-chat-message.tool{align-items:flex-start}.ai-chat-message-content{word-wrap:break-word;border:var(--bubble-border-width) solid var(--bubble-border-color);border-radius:var(--bubble-border-radius);font-size:15px;line-height:1.6;max-width:80%;opacity:var(--bubble-opacity);padding:12px 16px}.ai-chat-message.user .ai-chat-message-content{background-color:var(--bubble-user-color);border-bottom-right-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.1);color:var(--user-message-text)}.ai-chat-message.assistant .ai-chat-message-content{background-color:var(--bubble-assistant-color,#f3f4f6);border:1px solid var(--bubble-border-color,rgba(0,0,0,.08));border-radius:var(--bubble-border-radius,16px);border-bottom-left-radius:4px;box-shadow:none;color:var(--assistant-message-text);max-width:85%;padding:12px 16px}.ai-chat-message.assistant .ai-chat-message-content p{margin:0 0 12px}.ai-chat-message.assistant .ai-chat-message-content p:last-child{margin-bottom:0}.ai-chat-message.assistant .ai-chat-message-content ol,.ai-chat-message.assistant .ai-chat-message-content ul{margin:8px 0 12px;padding-left:24px}.ai-chat-message.assistant .ai-chat-message-content li{line-height:1.5;margin:6px 0}.ai-chat-message.assistant .ai-chat-message-content li::marker{color:var(--primary-color,#07f)}.ai-chat-message.assistant .ai-chat-message-content ol li::marker{font-weight:600}.ai-chat-message.assistant .ai-chat-message-content strong{font-weight:600}.ai-chat-message.assistant .ai-chat-message-content em{font-style:italic}.ai-chat-message.assistant .ai-chat-message-content code{background-color:rgba(0,0,0,.06);border-radius:4px;font-family:SF Mono,Consolas,Monaco,monospace;font-size:.9em;padding:2px 6px}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content code{background-color:hsla(0,0%,100%,.1)}.ai-chat-message.assistant .ai-chat-message-content pre{background-color:rgba(0,0,0,.06);border-radius:8px;margin:8px 0 12px;overflow-x:auto;padding:12px}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content pre{background-color:hsla(0,0%,100%,.08)}.ai-chat-message.assistant .ai-chat-message-content pre code{background-color:transparent;border-radius:0;padding:0}.ai-chat-message.assistant .ai-chat-message-content blockquote{border-left:3px solid var(--primary-color,#07f);color:var(--text-muted,#6b7280);margin:8px 0 12px;padding:4px 0 4px 12px}.ai-chat-message.assistant .ai-chat-message-content a{color:var(--primary-color,#07f);text-decoration:underline}.ai-chat-message.assistant .ai-chat-message-content a:hover{opacity:.8}.ai-chat-message.assistant .ai-chat-message-content h1,.ai-chat-message.assistant .ai-chat-message-content h2,.ai-chat-message.assistant .ai-chat-message-content h3,.ai-chat-message.assistant .ai-chat-message-content h4,.ai-chat-message.assistant .ai-chat-message-content h5,.ai-chat-message.assistant .ai-chat-message-content h6{font-weight:600;line-height:1.3;margin:16px 0 8px}.ai-chat-message.assistant .ai-chat-message-content h1:first-child,.ai-chat-message.assistant .ai-chat-message-content h2:first-child,.ai-chat-message.assistant .ai-chat-message-content h3:first-child{margin-top:0}.ai-chat-message.assistant .ai-chat-message-content hr{border:none;border-top:1px solid var(--border-color,#e5e7eb);margin:12px 0}.ai-chat-message.system .ai-chat-message-content{background-color:#fef3c7;border-radius:8px;color:#92400e;font-size:12px;font-style:italic;max-width:90%;text-align:center}.ai-chat-message.tool .ai-chat-message-content{background-color:#dbeafe;border-bottom-left-radius:4px;color:#1e40af;font-family:Courier New,monospace;font-size:13px}.ai-chat-tool-indicators{display:flex;gap:6px;margin-top:6px}.tool-indicator{align-items:center;background:#dbeafe;border-radius:50%;color:#1e40af;display:inline-flex;height:18px;justify-content:center;overflow:hidden;position:relative;width:18px}.tool-indicator .icon{font-size:12px;line-height:1;z-index:1}.tool-indicator.started:after{animation:ai-spin 1s linear infinite;border:2px solid rgba(30,64,175,.25);border-radius:50%;border-top-color:#1e40af;content:\"\";inset:0;position:absolute}@keyframes ai-spin{to{transform:rotate(1turn)}}.ai-chat-tool-message{align-items:center;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.2);border-radius:20px;color:#059669;display:inline-flex;gap:8px;padding:8px 14px}.ai-chat-widget.dark .ai-chat-tool-message{background:rgba(16,185,129,.15);border-color:rgba(16,185,129,.25);color:#34d399}.tool-finished{align-items:center;display:inline-flex;font-size:14px;justify-content:center}.tool-finished .tool-icon{display:none}.tool-finished .tool-check{font-size:14px;font-weight:700}.tool-name{font-size:13px;font-weight:500}.ai-chat-message-timestamp{color:rgba(0,0,0,.6);filter:invert(1) grayscale(1) contrast(1.2);font-size:11px;mix-blend-mode:difference;padding:0 4px}.ai-chat-welcome{color:var(--welcome-color);opacity:var(--welcome-opacity);padding:16px 0;text-align:left}.ai-chat-welcome-title{color:var(--primary-color);font-size:calc(var(--welcome-font-size)*1.25);font-weight:600;letter-spacing:-.01em;margin-bottom:8px}.ai-chat-welcome-text{color:var(--assistant-message-text);font-size:var(--welcome-font-size);line-height:1.6}.ai-chat-typing{align-items:center;background-color:var(--assistant-message-bg);border-radius:12px;border-bottom-left-radius:4px;display:flex;gap:4px;max-width:80px;padding:10px 14px}.ai-chat-typing-dot{animation:typingBounce 1.4s infinite;background-color:#9ca3af;border-radius:50%;height:8px;width:8px}.ai-chat-typing-dot:nth-child(2){animation-delay:.2s}.ai-chat-typing-dot:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-8px)}}.ai-chat-file-button{align-items:center;background:none;border:none;border-radius:6px;color:var(--text-color);cursor:pointer;display:flex;justify-content:center;padding:8px;transition:background-color .2s}.ai-chat-file-button:hover:not(:disabled){background-color:rgba(0,0,0,.05)}.ai-chat-file-button:disabled{cursor:not-allowed;opacity:.5}.ai-chat-file-list{display:flex;flex-wrap:wrap;gap:8px;padding:8px 12px}.ai-chat-file-item{align-items:center;background-color:rgba(0,0,0,.05);border-radius:6px;display:flex;font-size:12px;gap:8px;padding:6px 10px}.ai-chat-file-extension{background-color:var(--primary-color);border-radius:3px;color:#fff;display:inline-block;font-size:10px;font-weight:600;min-width:40px;padding:2px 6px;text-align:center;text-transform:uppercase}.ai-chat-file-info{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.ai-chat-file-name{font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-file-size{color:var(--text-muted);font-size:10px;opacity:.7}.ai-chat-file-remove{background:none;border:none;cursor:pointer;font-size:18px;line-height:1;opacity:.6;padding:0 4px;transition:opacity .2s}.ai-chat-file-remove:hover{opacity:1}.ai-chat-message-attachments{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.ai-chat-message-attachment{align-items:center;background-color:rgba(0,0,0,.08);border-radius:4px;display:inline-flex;font-size:11px;gap:4px;padding:3px 8px}.ai-chat-attachment-icon{font-size:12px}.ai-chat-attachment-ext{background-color:var(--primary-color);border-radius:2px;color:#fff;display:inline-block;font-size:9px;font-weight:600;padding:1px 4px;text-transform:uppercase}.ai-chat-attachment-name{max-width:120px;opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-sources{background-color:rgba(0,0,0,.02);border-radius:6px;font-size:12px;margin-top:8px;overflow:hidden}.ai-chat-sources-toggle{align-items:center;background:none;border:none;cursor:pointer;display:flex;gap:6px;padding:8px 10px;text-align:left;transition:background-color .2s;width:100%}.ai-chat-sources-toggle:hover{background-color:rgba(0,0,0,.03)}.ai-chat-sources-icon{color:var(--text-muted);font-size:10px;transition:transform .2s}.ai-chat-sources-title{color:var(--text-color);flex:1;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.ai-chat-source-item{border-top:1px solid rgba(0,0,0,.05);color:#6b7280;display:flex;gap:8px;padding:8px 10px}.ai-chat-source-item:last-child{border-bottom:none}.ai-chat-source-number{color:var(--primary-color);flex-shrink:0;font-weight:600}.ai-chat-source-details{display:flex;flex:1;flex-direction:column;gap:4px}.ai-chat-source-score{color:#9ca3af;font-size:11px}.ai-chat-source-content{color:#6b7280;font-size:11px;font-style:italic;line-height:1.4}.ai-chat-source-metadata{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}.ai-chat-source-meta-item{background-color:rgba(0,0,0,.05);border-radius:3px;color:#6b7280;font-size:10px;padding:2px 6px}.ai-chat-feedback{align-items:center;display:flex;gap:8px;margin-top:8px;min-height:32px}.ai-chat-feedback-button{align-items:center;background:none;border:none;border-radius:6px;cursor:pointer;display:flex;filter:drop-shadow(0 1px 2px rgba(0,0,0,.3));font-size:16px;gap:4px;overflow:hidden;padding:6px 10px;position:relative;transition:all .2s ease}.ai-chat-feedback-button:hover:not(:disabled){background-color:rgba(0,0,0,.05);transform:scale(1.2)}.ai-chat-feedback-button:active:not(:disabled){transform:scale(.95)}.ai-chat-feedback-button:disabled{cursor:not-allowed;opacity:.5}.ai-chat-feedback-button.active{background-color:rgba(0,119,255,.1)}.ai-chat-feedback-submitted{align-items:center;animation:feedbackMorph .3s cubic-bezier(.34,1.56,.64,1);display:flex;gap:6px}.ai-chat-feedback-checkmark{animation:checkmarkPop .3s cubic-bezier(.34,1.56,.64,1);color:#10b981;font-size:16px;font-weight:700}.ai-chat-feedback-text{animation:textSlideIn .3s ease;color:#10b981;font-size:13px;font-weight:500}@keyframes feedbackMorph{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes checkmarkPop{0%{opacity:0;transform:scale(0) rotate(-45deg)}50%{transform:scale(1.3) rotate(0deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}@keyframes textSlideIn{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.ai-chat-error{align-items:flex-start;background-color:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.2);border-radius:12px;color:#ef4444;display:flex;font-size:14px;font-weight:500;gap:10px;line-height:1.5;margin:8px 16px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-error{background-color:rgba(239,68,68,.15);border-color:rgba(239,68,68,.25);color:#fca5a5}.ai-chat-error:before{align-items:center;background:rgba(239,68,68,.2);border-radius:50%;content:\"⚠\";display:flex;flex-shrink:0;font-size:14px;font-weight:700;height:20px;justify-content:center;width:20px}.ai-chat-widget.dark .ai-chat-error:before{background:rgba(239,68,68,.25)}.ai-chat-warning{background-color:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.2);border-radius:12px;color:#d97706;font-size:13px;margin:8px 16px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-warning{background-color:rgba(245,158,11,.15);border-color:rgba(245,158,11,.25);color:#fbbf24}.ai-chat-suggested-questions{margin-bottom:8px;padding:12px 16px}.ai-chat-suggested-questions-label{color:#6b7280;font-size:12px;font-weight:500;margin-bottom:8px}.ai-chat-suggested-questions-list{display:flex;flex-direction:column;gap:8px}.ai-chat-suggested-question{align-items:center;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;color:#374151;cursor:pointer;display:flex;font-size:14px;gap:8px;padding:10px 12px;text-align:left;transition:all .2s ease;width:100%}.ai-chat-suggested-question:hover{background-color:#f3f4f6;border-color:var(--ai-chat-primary-color,#6366f1);box-shadow:0 2px 4px rgba(0,0,0,.05);transform:translateY(-1px)}.ai-chat-suggested-question:active{transform:translateY(0)}.ai-chat-suggested-question-icon{flex-shrink:0;font-size:16px}.ai-chat-suggested-question-text{flex:1;line-height:1.4}@media (max-width:480px){.ai-chat-window{border-radius:0!important;bottom:0!important;height:100%!important;left:0!important;position:fixed!important;right:0!important;top:0!important;width:100%!important}.ai-chat-widget-container{bottom:20px!important;right:20px!important}.ai-chat-suggested-question{font-size:13px;padding:9px 10px}}.ai-chat-action-approval{background:linear-gradient(135deg,#07f,#001d3d);border-radius:16px;box-shadow:0 4px 12px rgba(0,119,255,.3);color:#fff;margin:16px;padding:16px}.ai-chat-action-approval-content{align-items:flex-start;display:flex;gap:12px;margin-bottom:16px}.ai-chat-action-approval-icon{align-items:center;background:hsla(0,0%,100%,.2);border-radius:8px;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.ai-chat-action-approval-text{flex:1}.ai-chat-action-approval-title{font-size:15px;font-weight:600;margin-bottom:4px}.ai-chat-action-approval-description{font-size:13px;line-height:1.4;opacity:.95}.ai-chat-action-approval-buttons{display:flex;gap:8px;justify-content:flex-end}.ai-chat-action-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:500;gap:6px;padding:8px 16px;transition:all .2s ease}.ai-chat-action-button:disabled{cursor:not-allowed;opacity:.6}.ai-chat-action-button-reject{background:hsla(0,0%,100%,.2);color:#fff}.ai-chat-action-button-reject:hover:not(:disabled){background:hsla(0,0%,100%,.3)}.ai-chat-action-button-approve{background:#fff;color:#07f}.ai-chat-action-button-approve:hover:not(:disabled){background:#f0f0f0;box-shadow:0 2px 8px rgba(0,0,0,.15);transform:translateY(-1px)}.ai-chat-action-spinner{animation:ai-chat-spin .6s linear infinite;border:2px solid rgba(0,119,255,.3);border-radius:50%;border-top-color:#07f;display:inline-block;height:14px;width:14px}@keyframes ai-chat-spin{to{transform:rotate(1turn)}}";
|
|
22037
|
+
var css_248z$1 = ".ai-chat-widget{--primary-color:#07f;--background-color:#fff;--text-color:#1f2937;--border-color:#e5e7eb;--user-message-bg:var(--primary-color);--user-message-text:#fff;--assistant-message-bg:#f3f4f6;--assistant-message-text:#374151;--input-bg:#fff;--input-border:#d1d5db;--shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--button-color:#07f;--button-size:56px;--button-border-radius:28px;--button-border-width:0px;--button-border-color:#07f;--button-opacity:1;--button-backdrop-blur:0px;--button-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);--card-background:#fff;--card-border-radius:16px;--card-border-width:0px;--card-border-color:#e5e7eb;--card-opacity:1;--card-backdrop-blur:0px;--card-shadow:0 25px 50px -12px rgba(0,0,0,.25);--header-background:#07f;--header-text-color:#fff;--header-font-size:18px;--header-border-bottom-width:0px;--header-border-bottom-color:#e5e7eb;--header-opacity:1;--header-backdrop-blur:0px;--chat-background:#fff;--chat-opacity:1;--chat-backdrop-blur:0px;--welcome-font-size:16px;--welcome-color:#1f2937;--welcome-opacity:1;--bubble-user-color:#07f;--bubble-assistant-color:#f3f4f6;--bubble-border-radius:16px;--bubble-border-width:0px;--bubble-border-color:#e5e7eb;--bubble-opacity:1;--typing-animation-color:#f3f4f6;--typing-animation-opacity:1;--typing-animation-border-width:0px;--typing-animation-border-color:#e5e7eb;--typing-animation-border-radius:16px;--footer-background:#fff;--footer-border-top-width:1px;--footer-border-top-color:#e5e7eb;--footer-opacity:1;--footer-backdrop-blur:0px;--input-background:#fff;--input-border-radius:24px;--input-border-width:1.5px;--input-border-color:#d1d5db;--input-opacity:1;--input-shadow:0 1px 2px 0 rgba(0,0,0,.05);--send-button-background:#07f;--send-button-border-radius:20px;--send-button-border-width:0px;--send-button-border-color:#07f;--send-button-opacity:1;--hover-button-scale:1.05;--hover-button-opacity:0.9;--hover-input-border-color:#9ca3af;--hover-send-button-opacity:0.85;--hover-close-button-opacity:1;--active-input-border-color:#07f;--active-input-shadow:0 0 0 3px rgba(0,119,255,.1);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.ai-chat-widget.dark{--background-color:#001d3d;--text-color:#f9fafb;--border-color:#374151;--assistant-message-bg:#036;--assistant-message-text:#e5e7eb;--input-bg:#002855;--input-border:#374151}.ai-chat-widget.dark .ai-chat-message.system .ai-chat-message-content{background-color:#78350f;color:#fef3c7}.ai-chat-widget.dark .ai-chat-message.tool .ai-chat-message-content{background-color:#1e3a8a;color:#dbeafe}.ai-chat-widget-container{font-size:14px;line-height:1.5;position:fixed;z-index:9999}.ai-chat-widget-container.bottom-right{bottom:20px;right:20px}.ai-chat-widget-container.bottom-left{bottom:20px;left:20px}.ai-chat-widget-container.top-right{right:20px;top:20px}.ai-chat-widget-container.top-left{left:20px;top:20px}.ai-chat-button{align-items:center;backdrop-filter:blur(var(--button-backdrop-blur));-webkit-backdrop-filter:blur(var(--button-backdrop-blur));background-color:var(--button-color);border:var(--button-border-width) solid var(--button-border-color);border-radius:var(--button-border-radius);box-shadow:var(--button-shadow);color:#fff;cursor:pointer;display:flex;height:var(--button-size);justify-content:center;opacity:var(--button-opacity);transition:all .3s cubic-bezier(.4,0,.2,1);width:var(--button-size)}.ai-chat-button:hover{opacity:.9}.ai-chat-button:active{opacity:.8}.ai-chat-button-svg{height:50%;min-height:24px;min-width:24px;width:50%}.ai-chat-button-icon{font-size:1.5em;line-height:1}.ai-chat-window{border-radius:var(--card-border-radius);box-shadow:0 0 0 var(--card-border-width) var(--card-border-color-rgba,var(--card-border-color)),var(--card-shadow);display:flex;flex-direction:column;overflow:hidden;position:absolute}.ai-chat-window>*{position:relative;z-index:1}.ai-chat-window:before{backdrop-filter:blur(var(--card-backdrop-blur));-webkit-backdrop-filter:blur(var(--card-backdrop-blur));background-color:var(--card-background);border-radius:var(--card-border-radius);content:\"\";inset:0;opacity:var(--card-opacity);pointer-events:none;position:absolute;z-index:0}.ai-chat-widget-container.bottom-right .ai-chat-window{bottom:calc(var(--button-size, 60px) + 16px);right:0}.ai-chat-widget-container.bottom-left .ai-chat-window{bottom:calc(var(--button-size, 60px) + 16px);left:0}.ai-chat-widget-container.top-right .ai-chat-window{right:0;top:calc(var(--button-size, 60px) + 16px)}.ai-chat-widget-container.top-left .ai-chat-window{left:0;top:calc(var(--button-size, 60px) + 16px)}.ai-chat-button{z-index:1}.ai-chat-window{z-index:2}.ai-chat-window.size-small{height:500px;width:380px}.ai-chat-window.size-medium{height:650px;width:440px}.ai-chat-window.size-large{height:750px;width:520px}.ai-chat-logo{border-radius:50%;height:32px;object-fit:cover;width:32px}.ai-chat-messages::-webkit-scrollbar{width:6px}.ai-chat-messages::-webkit-scrollbar-track{background:transparent}.ai-chat-messages::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:var(--input-border)}.ai-chat-message{display:flex;flex-direction:column;gap:4px}.ai-chat-message.user{align-items:flex-end}.ai-chat-message.assistant{align-items:flex-start}.ai-chat-message.system{align-items:center}.ai-chat-message.tool{align-items:flex-start}.ai-chat-message-content{word-wrap:break-word;border:var(--bubble-border-width) solid var(--bubble-border-color);border-radius:var(--bubble-border-radius);font-size:15px;line-height:1.6;max-width:80%;opacity:var(--bubble-opacity);padding:12px 16px}.ai-chat-message.user .ai-chat-message-content{background-color:var(--bubble-user-color);border-bottom-right-radius:4px;box-shadow:0 1px 2px rgba(0,0,0,.1);color:var(--user-message-text)}.ai-chat-message.assistant .ai-chat-message-content{background-color:var(--bubble-assistant-color,#f3f4f6);border:1px solid var(--bubble-border-color,rgba(0,0,0,.08));border-radius:var(--bubble-border-radius,16px);border-bottom-left-radius:4px;box-shadow:none;color:var(--assistant-message-text);max-width:85%;padding:12px 16px}.ai-chat-message.assistant .ai-chat-message-content p{margin:0 0 12px}.ai-chat-message.assistant .ai-chat-message-content p:last-child{margin-bottom:0}.ai-chat-message.assistant .ai-chat-message-content ol,.ai-chat-message.assistant .ai-chat-message-content ul{margin:8px 0 12px;padding-left:24px}.ai-chat-message.assistant .ai-chat-message-content li{line-height:1.5;margin:6px 0}.ai-chat-message.assistant .ai-chat-message-content li::marker{color:var(--primary-color,#07f)}.ai-chat-message.assistant .ai-chat-message-content ol li::marker{font-weight:600}.ai-chat-message.assistant .ai-chat-message-content strong{font-weight:600}.ai-chat-message.assistant .ai-chat-message-content em{font-style:italic}.ai-chat-message.assistant .ai-chat-message-content code{background-color:rgba(0,0,0,.06);border-radius:4px;font-family:SF Mono,Consolas,Monaco,monospace;font-size:.9em;padding:2px 6px}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content code{background-color:hsla(0,0%,100%,.1)}.ai-chat-message.assistant .ai-chat-message-content pre{background-color:rgba(0,0,0,.06);border-radius:8px;margin:8px 0 12px;overflow-x:auto;padding:12px}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content pre{background-color:hsla(0,0%,100%,.08)}.ai-chat-message.assistant .ai-chat-message-content pre code{background-color:transparent;border-radius:0;padding:0}.ai-chat-message.assistant .ai-chat-message-content blockquote{border-left:3px solid var(--primary-color,#07f);color:var(--text-muted,#6b7280);margin:8px 0 12px;padding:4px 0 4px 12px}.ai-chat-message.assistant .ai-chat-message-content a{color:var(--primary-color,#07f);text-decoration:underline}.ai-chat-message.assistant .ai-chat-message-content a:hover{opacity:.8}.ai-chat-message.assistant .ai-chat-message-content h1,.ai-chat-message.assistant .ai-chat-message-content h2,.ai-chat-message.assistant .ai-chat-message-content h3,.ai-chat-message.assistant .ai-chat-message-content h4,.ai-chat-message.assistant .ai-chat-message-content h5,.ai-chat-message.assistant .ai-chat-message-content h6{font-weight:600;line-height:1.3;margin:16px 0 8px}.ai-chat-message.assistant .ai-chat-message-content h1:first-child,.ai-chat-message.assistant .ai-chat-message-content h2:first-child,.ai-chat-message.assistant .ai-chat-message-content h3:first-child{margin-top:0}.ai-chat-message.assistant .ai-chat-message-content hr{border:none;border-top:1px solid var(--border-color,#e5e7eb);margin:12px 0}.ai-chat-message.system .ai-chat-message-content{background-color:#fef3c7;border-radius:8px;color:#92400e;font-size:12px;font-style:italic;max-width:90%;text-align:center}.ai-chat-message.tool .ai-chat-message-content{background-color:#dbeafe;border-bottom-left-radius:4px;color:#1e40af;font-family:Courier New,monospace;font-size:13px}.ai-chat-tool-indicators{display:flex;gap:6px;margin-top:6px}.tool-indicator{align-items:center;background:#dbeafe;border-radius:50%;color:#1e40af;display:inline-flex;height:18px;justify-content:center;overflow:hidden;position:relative;width:18px}.tool-indicator .icon{font-size:12px;line-height:1;z-index:1}.tool-indicator.started:after{animation:ai-spin 1s linear infinite;border:2px solid rgba(30,64,175,.25);border-radius:50%;border-top-color:#1e40af;content:\"\";inset:0;position:absolute}@keyframes ai-spin{to{transform:rotate(1turn)}}.ai-chat-tool-message{align-items:center;background:rgba(16,185,129,.1);border:1px solid rgba(16,185,129,.2);border-radius:20px;color:#059669;display:inline-flex;gap:8px;padding:8px 14px}.ai-chat-widget.dark .ai-chat-tool-message{background:rgba(16,185,129,.15);border-color:rgba(16,185,129,.25);color:#34d399}.tool-finished{align-items:center;display:inline-flex;font-size:14px;justify-content:center}.tool-finished .tool-icon{display:none}.tool-finished .tool-check{font-size:14px;font-weight:700}.tool-name{font-size:13px;font-weight:500}.ai-chat-message-timestamp{color:rgba(0,0,0,.6);filter:invert(1) grayscale(1) contrast(1.2);mix-blend-mode:difference;padding:0 4px}.ai-chat-welcome{align-items:center;color:var(--welcome-color);display:flex;flex-direction:column;justify-content:center;min-height:200px;opacity:var(--welcome-opacity);padding:60px 32px 40px;text-align:center}.ai-chat-welcome-title{color:var(--primary-color);font-size:28px;font-weight:700;letter-spacing:-.03em;margin-bottom:12px}.ai-chat-welcome-text{color:var(--assistant-message-text);font-size:16px;line-height:1.6;max-width:280px;opacity:.7}.ai-chat-typing{align-items:center;background-color:var(--assistant-message-bg);border-radius:12px;border-bottom-left-radius:4px;display:flex;gap:4px;max-width:80px;padding:10px 14px}.ai-chat-typing-dot{animation:typingBounce 1.4s infinite;background-color:#9ca3af;border-radius:50%;height:8px;width:8px}.ai-chat-typing-dot:nth-child(2){animation-delay:.2s}.ai-chat-typing-dot:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-8px)}}.ai-chat-file-button{align-items:center;background:none;border:none;border-radius:6px;color:var(--text-color);cursor:pointer;display:flex;justify-content:center;padding:8px;transition:background-color .2s}.ai-chat-file-button:hover:not(:disabled){background-color:rgba(0,0,0,.05)}.ai-chat-file-button:disabled{cursor:not-allowed;opacity:.5}.ai-chat-file-list{display:flex;flex-wrap:wrap;gap:8px;padding:8px 12px}.ai-chat-file-item{align-items:center;background-color:rgba(0,0,0,.05);border-radius:6px;display:flex;font-size:12px;gap:8px;padding:6px 10px}.ai-chat-file-extension{background-color:var(--primary-color);border-radius:3px;color:#fff;display:inline-block;font-size:10px;font-weight:600;min-width:40px;padding:2px 6px;text-align:center;text-transform:uppercase}.ai-chat-file-info{display:flex;flex:1;flex-direction:column;gap:2px;min-width:0}.ai-chat-file-name{font-weight:500;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-file-size{color:var(--text-muted);font-size:10px;opacity:.7}.ai-chat-file-remove{align-items:center;background:none;border:none;color:inherit;cursor:pointer;display:flex;justify-content:center;opacity:.5;padding:4px;transition:opacity .15s ease}.ai-chat-file-remove:hover{opacity:1}.ai-chat-message-attachments{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.ai-chat-message-attachment{align-items:center;background-color:rgba(0,0,0,.08);border-radius:4px;display:inline-flex;font-size:11px;gap:4px;padding:3px 8px}.ai-chat-attachment-icon{font-size:12px}.ai-chat-attachment-ext{background-color:var(--primary-color);border-radius:2px;color:#fff;display:inline-block;font-size:9px;font-weight:600;padding:1px 4px;text-transform:uppercase}.ai-chat-attachment-name{max-width:120px;opacity:.8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-chat-sources{background-color:rgba(0,0,0,.02);border-radius:6px;font-size:12px;margin-top:8px;overflow:hidden}.ai-chat-sources-toggle{align-items:center;background:none;border:none;cursor:pointer;display:flex;gap:6px;padding:8px 10px;text-align:left;transition:background-color .2s;width:100%}.ai-chat-sources-toggle:hover{background-color:rgba(0,0,0,.03)}.ai-chat-sources-icon{color:var(--text-muted);font-size:10px;transition:transform .2s}.ai-chat-sources-title{color:var(--text-color);flex:1;font-size:11px;font-weight:600;letter-spacing:.5px;text-transform:uppercase}.ai-chat-source-item{border-top:1px solid rgba(0,0,0,.05);color:#6b7280;display:flex;gap:8px;padding:8px 10px}.ai-chat-source-item:last-child{border-bottom:none}.ai-chat-source-number{color:var(--primary-color);flex-shrink:0;font-weight:600}.ai-chat-source-details{display:flex;flex:1;flex-direction:column;gap:4px}.ai-chat-source-score{color:#9ca3af;font-size:11px}.ai-chat-source-content{color:#6b7280;font-size:11px;font-style:italic;line-height:1.4}.ai-chat-source-metadata{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}.ai-chat-source-meta-item{background-color:rgba(0,0,0,.05);border-radius:3px;color:#6b7280;font-size:10px;padding:2px 6px}.ai-chat-message-meta{align-items:center;display:inline-flex;gap:6px;height:20px}.ai-chat-message-timestamp{color:#71717a;font-size:11px;line-height:1}.ai-chat-feedback{gap:0}.ai-chat-feedback,.ai-chat-feedback-button{align-items:center;display:inline-flex;height:20px}.ai-chat-feedback-button{background:none!important;border:none;border-radius:0;color:#71717a;cursor:pointer;justify-content:center;padding:0 4px;transition:color .15s ease}.ai-chat-feedback-button:hover:not(:disabled){background:none!important;color:#52525b}.ai-chat-feedback-button:active:not(:disabled){opacity:.7}.ai-chat-feedback-button:disabled{cursor:not-allowed;opacity:.4}.ai-chat-feedback-button.active{background:none!important;color:var(--primary-color,#07f)}.ai-chat-feedback-submitted{align-items:center;animation:feedbackMorph .3s cubic-bezier(.34,1.56,.64,1);display:flex;gap:6px}.ai-chat-feedback-checkmark{animation:checkmarkPop .3s cubic-bezier(.34,1.56,.64,1);color:#10b981;font-size:16px;font-weight:700}.ai-chat-feedback-text{animation:textSlideIn .3s ease;color:#10b981;font-size:13px;font-weight:500}@keyframes feedbackMorph{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes checkmarkPop{0%{opacity:0;transform:scale(0) rotate(-45deg)}50%{transform:scale(1.3) rotate(0deg)}to{opacity:1;transform:scale(1) rotate(0deg)}}@keyframes textSlideIn{0%{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:translateX(0)}}.ai-chat-error{align-items:flex-start;background-color:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.2);border-radius:12px;color:#ef4444;display:flex;font-size:14px;font-weight:500;gap:10px;line-height:1.5;margin:8px 16px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-error{background-color:rgba(239,68,68,.15);border-color:rgba(239,68,68,.25);color:#fca5a5}.ai-chat-error:before{align-items:center;background:rgba(239,68,68,.2);border-radius:50%;content:\"⚠\";display:flex;flex-shrink:0;font-size:14px;font-weight:700;height:20px;justify-content:center;width:20px}.ai-chat-widget.dark .ai-chat-error:before{background:rgba(239,68,68,.25)}.ai-chat-warning{background-color:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.2);border-radius:12px;color:#d97706;font-size:13px;margin:8px 16px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-warning{background-color:rgba(245,158,11,.15);border-color:rgba(245,158,11,.25);color:#fbbf24}.ai-chat-suggested-questions{bottom:80px;left:0;padding:0 20px 16px;position:absolute;right:0;z-index:5}.ai-chat-suggested-questions-list{display:flex;flex-direction:column;gap:8px}.ai-chat-suggested-question{align-items:center;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;box-shadow:0 1px 3px rgba(0,0,0,.04);color:#374151;cursor:pointer;display:flex;font-size:14px;font-weight:500;gap:12px;justify-content:space-between;padding:14px 16px;text-align:left;transition:all .15s ease;width:100%}.ai-chat-suggested-question:hover{background:#f9fafb;border-color:rgba(0,0,0,.12);box-shadow:0 2px 8px rgba(0,0,0,.06)}.ai-chat-suggested-question:active{transform:scale(.98)}.ai-chat-suggested-question-text{flex:1;line-height:1.4}.ai-chat-suggested-question-icon{color:var(--primary-color,#07f);flex-shrink:0;opacity:.7;transition:transform .15s ease,opacity .15s ease}.ai-chat-suggested-question:hover .ai-chat-suggested-question-icon{opacity:1;transform:translateX(3px)}@media (max-width:480px){.ai-chat-window{border-radius:0!important;bottom:0!important;height:100%!important;left:0!important;position:fixed!important;right:0!important;top:0!important;width:100%!important}.ai-chat-widget-container{bottom:20px!important;right:20px!important}.ai-chat-suggested-question{font-size:13px;padding:9px 10px}}.ai-chat-action-approval{background:linear-gradient(135deg,#07f,#001d3d);border-radius:16px;box-shadow:0 4px 12px rgba(0,119,255,.3);color:#fff;margin:16px;padding:16px}.ai-chat-action-approval-content{align-items:flex-start;display:flex;gap:12px;margin-bottom:16px}.ai-chat-action-approval-icon{align-items:center;background:hsla(0,0%,100%,.2);border-radius:8px;display:flex;flex-shrink:0;height:40px;justify-content:center;width:40px}.ai-chat-action-approval-text{flex:1}.ai-chat-action-approval-title{font-size:15px;font-weight:600;margin-bottom:4px}.ai-chat-action-approval-description{font-size:13px;line-height:1.4;opacity:.95}.ai-chat-action-approval-buttons{display:flex;gap:8px;justify-content:flex-end}.ai-chat-action-button{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-family:inherit;font-size:14px;font-weight:500;gap:6px;padding:8px 16px;transition:all .2s ease}.ai-chat-action-button:disabled{cursor:not-allowed;opacity:.6}.ai-chat-action-button-reject{background:hsla(0,0%,100%,.2);color:#fff}.ai-chat-action-button-reject:hover:not(:disabled){background:hsla(0,0%,100%,.3)}.ai-chat-action-button-approve{background:#fff;color:#07f}.ai-chat-action-button-approve:hover:not(:disabled){background:#f0f0f0;box-shadow:0 2px 8px rgba(0,0,0,.15);transform:translateY(-1px)}.ai-chat-action-spinner{animation:ai-chat-spin .6s linear infinite;border:2px solid rgba(0,119,255,.3);border-radius:50%;border-top-color:#07f;display:inline-block;height:14px;width:14px}@keyframes ai-chat-spin{to{transform:rotate(1turn)}}";
|
|
22262
22038
|
styleInject(css_248z$1);
|
|
22263
22039
|
|
|
22264
|
-
var css_248z = ".ai-chat-widget{--glass-blur:20px;--glass-saturation:180%;--glass-opacity-light:0.72;--glass-opacity-dark:0.65;--glass-border-opacity:0.18;--shadow-glass:0 8px 32px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.08),inset 0 1px 0 hsla(0,0%,100%,.1);--shadow-button:0 4px 24px rgba(0,0,0,.15),0 2px 8px rgba(0,0,0,.1);--shadow-elevated:0 24px 80px rgba(0,0,0,.2),0 8px 32px rgba(0,0,0,.12);--spring-bounce:cubic-bezier(0.34,1.56,0.64,1);--spring-smooth:cubic-bezier(0.4,0,0.2,1);--spring-snappy:cubic-bezier(0.2,0,0,1);--duration-fast:0.2s;--duration-normal:0.35s;--duration-slow:0.5s}.ai-chat-button{align-items:center;backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturation));-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturation));background:linear-gradient(135deg,hsla(0,0%,100%,.25),hsla(0,0%,100%,.1));background-color:var(--button-color);border:none;border-radius:50%;box-shadow:var(--shadow-button),inset 0 1px 1px hsla(0,0%,100%,.3),inset 0 -1px 1px rgba(0,0,0,.1);cursor:pointer;display:flex;height:var(--button-size,60px);justify-content:center;overflow:hidden;position:relative;transition:transform var(--duration-normal) var(--spring-bounce),box-shadow var(--duration-normal) var(--spring-smooth);width:var(--button-size,60px)}.ai-chat-button:before{background:linear-gradient(135deg,hsla(0,0%,100%,.4),transparent 50%,transparent);inset:0;opacity:.6;pointer-events:none}.ai-chat-button:after,.ai-chat-button:before{border-radius:50%;content:\"\";position:absolute}.ai-chat-button:after{background:radial-gradient(circle at center,hsla(0,0%,100%,.3) 0,transparent 70%);inset:-2px;opacity:0;transform:scale(.8);transition:opacity var(--duration-normal) var(--spring-smooth),transform var(--duration-normal) var(--spring-bounce)}.ai-chat-button:hover{box-shadow:0 8px 40px rgba(0,0,0,.2),0 4px 16px rgba(0,0,0,.15),inset 0 1px 1px hsla(0,0%,100%,.4),inset 0 -1px 1px rgba(0,0,0,.1);transform:scale(1.08) translateY(-2px)}.ai-chat-button:hover:after{opacity:1;transform:scale(1)}.ai-chat-button:active{transform:scale(.95);transition-duration:.1s}.ai-chat-button-svg{filter:drop-shadow(0 1px 2px rgba(0,0,0,.2));height:26px;transition:transform var(--duration-normal) var(--spring-bounce);width:26px}.ai-chat-button:hover .ai-chat-button-svg{transform:scale(1.1)}.ai-chat-button.is-open .ai-chat-button-svg{transform:rotate(180deg)}.ai-chat-window{animation:windowOpen var(--duration-slow) var(--spring-bounce);backdrop-filter:blur(var(--card-backdrop-blur,24px)) saturate(var(--glass-saturation));-webkit-backdrop-filter:blur(var(--card-backdrop-blur,24px)) saturate(var(--glass-saturation));background:var(--card-background,hsla(0,0%,100%,.88));border:var(--card-border-width,1px) solid var(--card-border-color,rgba(0,0,0,.06));border-radius:var(--card-border-radius,28px);box-shadow:var(--card-shadow,0 25px 50px -12px rgba(0,0,0,.25));display:flex;flex-direction:column;overflow:hidden;position:absolute;transform-origin:bottom right}.ai-chat-widget.dark .ai-chat-window{background:var(--card-background,rgba(15,20,25,.92));border-color:var(--card-border-color,hsla(0,0%,100%,.06))}@keyframes windowOpen{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.ai-chat-window.closing{animation:windowClose var(--duration-normal) var(--spring-smooth) forwards}@keyframes windowClose{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.9) translateY(20px)}}.ai-chat-header{align-items:center;background:transparent;border-bottom:none;box-shadow:none;display:flex;justify-content:space-between;left:0;padding:16px 20px 12px;position:absolute;right:0;top:0;z-index:10}.ai-chat-header:before{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);content:\"\";height:70px;left:0;mask-image:linear-gradient(180deg,#000 0,#000 40%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 0,#000 40%,transparent);pointer-events:none;position:absolute;right:0;top:0;z-index:-1}.ai-chat-header-content{align-items:center;display:flex;flex:1;gap:12px}.ai-chat-title{font-size:18px;font-weight:700;letter-spacing:-.02em}.ai-chat-title,.ai-chat-widget.dark .ai-chat-title{color:var(--header-text-color,var(--primary-color,#07f))}.ai-chat-close-button{align-items:center;background:rgba(0,0,0,.05);border:none;border-radius:50%;color:#6b7280;cursor:pointer;display:flex;height:32px;justify-content:center;padding:0;transition:all .2s ease;width:32px}.ai-chat-widget.dark .ai-chat-close-button{background:hsla(0,0%,100%,.08);color:#9ca3af}.ai-chat-close-button:hover{background:rgba(0,0,0,.08);transform:scale(1.05)}.ai-chat-widget.dark .ai-chat-close-button:hover{background:hsla(0,0%,100%,.12)}.ai-chat-close-button:active{transform:scale(.95)}.ai-chat-messages{-webkit-overflow-scrolling:touch;background:transparent;display:flex;flex:1;flex-direction:column;gap:12px;overflow-x:hidden;overflow-y:auto;padding:60px 20px 80px;position:relative;scroll-behavior:smooth}.ai-chat-messages::-webkit-scrollbar{width:4px}.ai-chat-messages::-webkit-scrollbar-track{background:transparent}.ai-chat-messages::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:4px}.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.25)}.ai-chat-message{animation:messageSlideIn var(--duration-normal) var(--spring-bounce);display:flex;flex-direction:column;gap:4px}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(16px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.ai-chat-message-content{word-wrap:break-word;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:20px;box-shadow:0 2px 8px rgba(0,0,0,.06),inset 0 1px 0 hsla(0,0%,100%,.1);font-size:15px;line-height:1.5;max-width:85%;padding:12px 16px}.ai-chat-message.user .ai-chat-message-content{background:linear-gradient(135deg,var(--bubble-user-color) 0,color-mix(in srgb,var(--bubble-user-color) 85%,#000) 100%);border-bottom-right-radius:6px;box-shadow:0 4px 16px rgba(0,0,0,.12),inset 0 1px 0 hsla(0,0%,100%,.2);color:var(--user-message-text,#fff);margin-left:auto}.ai-chat-message.assistant .ai-chat-message-content{background:hsla(0,0%,100%,.7);border:1px solid rgba(0,0,0,.05);border-bottom-left-radius:6px;color:var(--assistant-message-text,#1f2937)}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content{background:hsla(0,0%,100%,.1);border-color:hsla(0,0%,100%,.08);color:#f0f0f0}.ai-chat-typing{align-items:center;animation:messageSlideIn var(--duration-normal) var(--spring-bounce);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:hsla(0,0%,100%,.7);border:1px solid rgba(0,0,0,.05);border-radius:20px;border-bottom-left-radius:6px;display:flex;gap:5px;max-width:70px;padding:14px 18px}.ai-chat-widget.dark .ai-chat-typing{background:hsla(0,0%,100%,.1);border-color:hsla(0,0%,100%,.08)}.ai-chat-typing-dot{animation:typingPulse 1.4s ease-in-out infinite;background:linear-gradient(135deg,var(--primary-color) 0,color-mix(in srgb,var(--primary-color) 70%,#000) 100%);border-radius:50%;height:8px;width:8px}.ai-chat-typing-dot:nth-child(2){animation-delay:.15s}.ai-chat-typing-dot:nth-child(3){animation-delay:.3s}@keyframes typingPulse{0%,60%,to{opacity:.4;transform:translateY(0) scale(1)}30%{opacity:1;transform:translateY(-6px) scale(1.1)}}.ai-chat-input-container{background:transparent;bottom:0;left:0;padding:0 20px 20px;position:absolute;right:0;z-index:10}.ai-chat-input-container:before{background:var(--card-background,#fff);bottom:0;content:\"\";height:calc(100% - 24px);left:0;position:absolute;right:0;z-index:-1}.ai-chat-widget.dark .ai-chat-input-container:before{background:var(--card-background,#1a1a2e)}.ai-chat-input-wrapper{align-items:center;background:#fff;border:1px solid rgba(0,0,0,.1);border-radius:20px;box-shadow:0 1px 4px rgba(0,0,0,.04);display:flex;gap:0;padding:4px 4px 4px 16px;position:relative;z-index:5}.ai-chat-widget.dark .ai-chat-input-wrapper{background:#1a1f25;border-color:hsla(0,0%,100%,.15)}.ai-chat-input-wrapper:focus-within{border-color:var(--primary-color);box-shadow:inset 0 1px 3px rgba(0,0,0,.04),0 0 0 4px rgba(var(--primary-color-rgb,0,119,255),.15)}.ai-chat-input{background:transparent;border:none;color:var(--text-color);flex:1;font-family:inherit;font-size:14px;line-height:1.4;max-height:120px;min-height:20px;outline:none;padding:8px 0;resize:none}.ai-chat-input::placeholder{color:rgba(0,0,0,.4)}.ai-chat-widget.dark .ai-chat-input::placeholder{color:hsla(0,0%,100%,.4)}.ai-chat-send-button{align-items:center;background:linear-gradient(135deg,var(--send-button-background,var(--primary-color)) 0,color-mix(in srgb,var(--send-button-background,var(--primary-color)) 80%,#000) 100%);border:none;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.12);color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:32px;justify-content:center;padding:0;transition:all var(--duration-fast) var(--spring-bounce);width:32px}.ai-chat-send-button:hover:not(:disabled){box-shadow:0 6px 20px rgba(0,0,0,.2),inset 0 1px 0 hsla(0,0%,100%,.3);transform:scale(1.08)}.ai-chat-send-button:active:not(:disabled){transform:scale(.95)}.ai-chat-send-button:disabled{cursor:not-allowed;opacity:.4;transform:none}.ai-chat-tool-message{align-items:center;animation:toolPulse 2s ease-in-out infinite;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:linear-gradient(135deg,rgba(16,185,129,.15),rgba(16,185,129,.08));border:1px solid rgba(16,185,129,.2);border-radius:16px;display:inline-flex;gap:10px;padding:10px 16px}@keyframes toolPulse{0%,to{box-shadow:0 0 0 0 rgba(16,185,129,.2)}50%{box-shadow:0 0 0 8px rgba(16,185,129,0)}}.tool-finished{align-items:center;animation:toolComplete .5s var(--spring-bounce);background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;color:#fff;display:inline-flex;height:28px;justify-content:center;position:relative;width:28px}@keyframes toolComplete{0%{transform:scale(0) rotate(-180deg)}to{transform:scale(1) rotate(0deg)}}.tool-indicator{align-items:center;background:linear-gradient(135deg,rgba(59,130,246,.2),rgba(59,130,246,.1));border-radius:50%;color:#3b82f6;display:inline-flex;height:24px;justify-content:center;position:relative;width:24px}.tool-indicator.started:after{animation:toolSpin .8s linear infinite;border:2px solid transparent;border-radius:50%;border-top-color:#3b82f6;content:\"\";inset:-2px;position:absolute}@keyframes toolSpin{to{transform:rotate(1turn)}}.ai-chat-welcome{animation:welcomeFadeIn var(--duration-slow) var(--spring-smooth);padding:40px 24px;text-align:center}@keyframes welcomeFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.ai-chat-welcome-title{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,var(--primary-color) 0,color-mix(in srgb,var(--primary-color) 70%,#000) 100%);-webkit-background-clip:text;background-clip:text;font-size:24px;font-weight:700;letter-spacing:-.03em;margin-bottom:8px}.ai-chat-welcome-text{color:var(--text-color);font-size:15px;line-height:1.5;opacity:.7}.ai-chat-suggested-question{align-items:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:hsla(0,0%,100%,.6);border:1px solid rgba(0,0,0,.06);border-radius:16px;color:var(--text-color);cursor:pointer;display:flex;font-size:14px;gap:10px;padding:12px 16px;text-align:left;transition:all var(--duration-fast) var(--spring-bounce);width:100%}.ai-chat-widget.dark .ai-chat-suggested-question{background:hsla(0,0%,100%,.08);border-color:hsla(0,0%,100%,.1)}.ai-chat-suggested-question:hover{background:rgba(var(--primary-color-rgb,0,119,255),.1);border-color:rgba(var(--primary-color-rgb,0,119,255),.3);transform:translateX(4px)}.ai-chat-suggested-question:active{transform:scale(.98)}.ai-chat-feedback-button{align-items:center;background:rgba(0,0,0,.04);border:none;border-radius:8px;cursor:pointer;display:flex;font-size:16px;gap:4px;padding:6px 10px;transition:all var(--duration-fast) var(--spring-bounce)}.ai-chat-feedback-button:hover:not(:disabled){background:rgba(0,0,0,.08);transform:scale(1.15)}.ai-chat-feedback-button:active:not(:disabled){transform:scale(.9)}.ai-chat-feedback-button.active{background:rgba(var(--primary-color-rgb,0,119,255),.15)}@media (max-width:480px){.ai-chat-window{animation:mobileSlideUp var(--duration-normal) var(--spring-smooth);border-radius:0!important;bottom:0!important;height:100%!important;left:0!important;position:fixed!important;right:0!important;top:0!important;width:100%!important}@keyframes mobileSlideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.ai-chat-header{padding-top:max(16px,env(safe-area-inset-top))}.ai-chat-input-container{padding-bottom:max(20px,env(safe-area-inset-bottom))}}";
|
|
22040
|
+
var css_248z = ".ai-chat-widget{--spring-bounce:cubic-bezier(0.34,1.56,0.64,1);--spring-smooth:cubic-bezier(0.4,0,0.2,1);--spring-snappy:cubic-bezier(0.2,0,0,1);--duration-fast:0.2s;--duration-normal:0.35s;--duration-slow:0.5s}.ai-chat-button{align-items:center;background:var(--button-color,var(--primary-color,#07f));border:none;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.15);cursor:pointer;display:flex;height:48px;justify-content:center;overflow:hidden;position:relative;transition:opacity .15s ease;width:48px}.ai-chat-button:hover{opacity:.9}.ai-chat-button:active{opacity:.8}.ai-chat-button-svg{height:20px;transition:transform .15s ease;width:20px}.ai-chat-button.is-open .ai-chat-button-svg{transform:rotate(0deg)}.ai-chat-window{animation:windowOpen var(--duration-slow) var(--spring-bounce);background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:0 4px 24px rgba(0,0,0,.12),0 1px 3px rgba(0,0,0,.08);display:flex;flex-direction:column;overflow:hidden;position:absolute;transform-origin:bottom right}.ai-chat-widget.dark .ai-chat-window{background:#18181b;border-color:#27272a}@keyframes windowOpen{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.ai-chat-window.closing{animation:windowClose var(--duration-normal) var(--spring-smooth) forwards}@keyframes windowClose{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.9) translateY(20px)}}.ai-chat-header{align-items:center;background:#fff;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;padding:16px 20px;position:relative;z-index:10}.ai-chat-widget.dark .ai-chat-header{background:#18181b;border-bottom-color:#27272a}.ai-chat-header-content{align-items:center;display:flex;flex:1;gap:12px}.ai-chat-logo{border-radius:10px;height:36px;object-fit:cover;width:36px}.ai-chat-title{color:#18181b;font-size:15px;font-weight:600;letter-spacing:-.01em}.ai-chat-widget.dark .ai-chat-title{color:#fafafa}.ai-chat-close-button{align-items:center;background:transparent;border:none;border-radius:8px;color:#a1a1aa;cursor:pointer;display:flex;height:32px;justify-content:center;padding:0;transition:all .15s ease;width:32px}.ai-chat-widget.dark .ai-chat-close-button{color:#71717a}.ai-chat-close-button:hover{background:#f4f4f5;color:#52525b}.ai-chat-widget.dark .ai-chat-close-button:hover{background:#27272a;color:#a1a1aa}.ai-chat-close-button:active{transform:scale(.95)}.ai-chat-messages{-webkit-overflow-scrolling:touch;background:#f4f4f5;display:flex;flex:1;flex-direction:column;gap:12px;overflow-x:hidden;overflow-y:auto;padding:16px 16px 90px;position:relative;scroll-behavior:smooth}.ai-chat-widget.dark .ai-chat-messages{background:#18181b}.ai-chat-messages::-webkit-scrollbar{width:4px}.ai-chat-messages::-webkit-scrollbar-track{background:transparent}.ai-chat-messages::-webkit-scrollbar-thumb{background:rgba(0,0,0,.15);border-radius:4px}.ai-chat-messages::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.25)}.ai-chat-message{animation:messageSlideIn var(--duration-normal) var(--spring-bounce);display:flex;flex-direction:column;gap:6px}@keyframes messageSlideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.ai-chat-message-content{word-wrap:break-word;border-radius:12px;font-size:14px;line-height:1.5;max-width:85%;padding:8px 14px}.ai-chat-message.user .ai-chat-message-content{background:var(--bubble-user-color,var(--primary-color,#07f));border-bottom-right-radius:4px;color:#fff;margin-left:auto}.ai-chat-message.assistant .ai-chat-message-content{background:#fff;border:1px solid #e5e7eb;border-bottom-left-radius:4px;color:#374151}.ai-chat-widget.dark .ai-chat-message.assistant .ai-chat-message-content{background:#18181b;border-color:#27272a;color:#e4e4e7}.ai-chat-typing{align-items:center;animation:messageSlideIn var(--duration-normal) var(--spring-bounce);background:#fff;border:1px solid #e5e7eb;border-radius:12px;border-bottom-left-radius:4px;display:flex;gap:4px;max-width:64px;padding:12px 16px}.ai-chat-widget.dark .ai-chat-typing{background:#18181b;border-color:#27272a}.ai-chat-typing-dot{animation:typingPulse 1.4s ease-in-out infinite;background:linear-gradient(135deg,var(--primary-color) 0,color-mix(in srgb,var(--primary-color) 70%,#000) 100%);border-radius:50%;height:8px;width:8px}.ai-chat-typing-dot:nth-child(2){animation-delay:.15s}.ai-chat-typing-dot:nth-child(3){animation-delay:.3s}@keyframes typingPulse{0%,60%,to{opacity:.4;transform:translateY(0) scale(1)}30%{opacity:1;transform:translateY(-6px) scale(1.1)}}.ai-chat-input-container{background:transparent;bottom:0;left:0;padding:0 16px 16px;position:absolute;right:0;z-index:10}.ai-chat-input-container:before{background:linear-gradient(0deg,#f4f4f5 80%,transparent);bottom:0;content:\"\";height:48px;left:0;pointer-events:none;position:absolute;right:0;z-index:-1}.ai-chat-widget.dark .ai-chat-input-container:before{background:linear-gradient(0deg,#18181b 80%,transparent)}.ai-chat-input-wrapper{align-items:center;background:#f4f4f5;border:1px solid #e5e7eb;border-radius:9999px;display:flex;gap:0;padding:4px 4px 4px 16px;position:relative;transition:all .15s ease;z-index:5}.ai-chat-widget.dark .ai-chat-input-wrapper{background:#27272a;border-color:#3f3f46}.ai-chat-input-wrapper:focus-within{border-color:var(--primary-color);box-shadow:0 0 0 2px rgba(var(--primary-color-rgb,0,119,255),.15)}.ai-chat-input{background:transparent;border:none;color:var(--text-color);flex:1;font-family:inherit;font-size:14px;line-height:1.4;max-height:100px;min-height:20px;outline:none;padding:8px 0;resize:none}.ai-chat-input::placeholder{color:rgba(0,0,0,.35)}.ai-chat-widget.dark .ai-chat-input::placeholder{color:hsla(0,0%,100%,.35)}.ai-chat-send-button{align-items:center;background:transparent;border:none;border-radius:8px;color:#a1a1aa;cursor:pointer;display:flex;flex-shrink:0;height:36px;justify-content:center;padding:0;transition:all .15s ease;width:36px}.ai-chat-widget.dark .ai-chat-send-button{color:#71717a}.ai-chat-send-button.active{background:var(--primary-color,#07f);color:#fff}.ai-chat-send-button.active:hover:not(:disabled){opacity:.9}.ai-chat-send-button:active:not(:disabled){transform:scale(.95)}.ai-chat-send-button:disabled{cursor:not-allowed;opacity:.4}.ai-chat-tool-message{align-items:center;animation:toolPulse 2s ease-in-out infinite;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:linear-gradient(135deg,rgba(16,185,129,.15),rgba(16,185,129,.08));border:1px solid rgba(16,185,129,.2);border-radius:16px;display:inline-flex;gap:10px;padding:10px 16px}@keyframes toolPulse{0%,to{box-shadow:0 0 0 0 rgba(16,185,129,.2)}50%{box-shadow:0 0 0 8px rgba(16,185,129,0)}}.tool-finished{align-items:center;animation:toolComplete .5s var(--spring-bounce);background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;color:#fff;display:inline-flex;height:28px;justify-content:center;position:relative;width:28px}@keyframes toolComplete{0%{transform:scale(0) rotate(-180deg)}to{transform:scale(1) rotate(0deg)}}.tool-indicator{align-items:center;background:linear-gradient(135deg,rgba(59,130,246,.2),rgba(59,130,246,.1));border-radius:50%;color:#3b82f6;display:inline-flex;height:24px;justify-content:center;position:relative;width:24px}.tool-indicator.started:after{animation:toolSpin .8s linear infinite;border:2px solid transparent;border-radius:50%;border-top-color:#3b82f6;content:\"\";inset:-2px;position:absolute}@keyframes toolSpin{to{transform:rotate(1turn)}}.ai-chat-welcome{align-items:center;animation:welcomeFadeIn var(--duration-slow) var(--spring-smooth);display:flex;flex-direction:column;justify-content:center;min-height:200px;padding:60px 32px 40px;text-align:center}@keyframes welcomeFadeIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.ai-chat-welcome-title{color:var(--primary-color);font-size:28px;font-weight:700;letter-spacing:-.03em;margin-bottom:12px}.ai-chat-welcome-text{color:var(--text-color);font-size:16px;line-height:1.6;max-width:280px;opacity:.6}.ai-chat-suggested-questions{bottom:76px;left:0;padding:0 16px 12px;position:absolute;right:0;z-index:5}.ai-chat-suggested-questions-list{display:flex;flex-direction:column;gap:6px}.ai-chat-suggested-question{align-items:center;background:#fff;border:1px solid #e5e7eb;border-radius:10px;color:#374151;cursor:pointer;display:flex;font-size:13px;font-weight:500;gap:10px;justify-content:space-between;padding:10px 14px;text-align:left;transition:all .15s ease;width:100%}.ai-chat-widget.dark .ai-chat-suggested-question{background:#18181b;border-color:#27272a;color:#e4e4e7}.ai-chat-suggested-question:hover{background:#f4f4f5;border-color:#d4d4d8}.ai-chat-widget.dark .ai-chat-suggested-question:hover{background:#27272a;border-color:#3f3f46}.ai-chat-suggested-question:active{transform:scale(.98)}.ai-chat-suggested-question-text{flex:1;line-height:1.4}.ai-chat-suggested-question-icon{color:var(--primary-color,#07f);flex-shrink:0;opacity:.7;transition:transform .15s ease,opacity .15s ease}.ai-chat-suggested-question:hover .ai-chat-suggested-question-icon{opacity:1;transform:translateX(3px)}.ai-chat-feedback-button{align-items:center;background:rgba(0,0,0,.04);border:none;border-radius:8px;cursor:pointer;display:flex;font-size:16px;gap:4px;padding:6px 10px;transition:all var(--duration-fast) var(--spring-bounce)}.ai-chat-feedback-button:hover:not(:disabled){background:rgba(0,0,0,.08);transform:scale(1.15)}.ai-chat-feedback-button:active:not(:disabled){transform:scale(.9)}.ai-chat-feedback-button.active{background:rgba(var(--primary-color-rgb,0,119,255),.15)}@media (max-width:480px){.ai-chat-window{animation:mobileSlideUp var(--duration-normal) var(--spring-smooth);border-radius:0!important;bottom:0!important;height:100%!important;left:0!important;position:fixed!important;right:0!important;top:0!important;width:100%!important}@keyframes mobileSlideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.ai-chat-header{padding-top:max(16px,env(safe-area-inset-top))}.ai-chat-input-container{padding-bottom:max(20px,env(safe-area-inset-bottom))}}";
|
|
22265
22041
|
styleInject(css_248z);
|
|
22266
22042
|
|
|
22267
22043
|
// Icon components mapping
|
|
22268
22044
|
const iconComponents = {
|
|
22269
22045
|
FiMessageCircle: () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z" }) })),
|
|
22270
|
-
FiMessageSquare: () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" }) })),
|
|
22271
|
-
FiMail: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" }), jsxRuntime.jsx("polyline", { points: "22,6 12,13 2,6" })] })),
|
|
22272
|
-
FiPhone: () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("path", { d: "M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z" }) })),
|
|
22273
|
-
FiHelpCircle: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "10" }), jsxRuntime.jsx("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }), jsxRuntime.jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })] })),
|
|
22274
|
-
FiZap: () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("polygon", { points: "13 2 3 14 12 14 11 22 21 10 12 10 13 2" }) })),
|
|
22275
|
-
FiSend: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("line", { x1: "22", y1: "2", x2: "11", y2: "13" }), jsxRuntime.jsx("polygon", { points: "22 2 15 22 11 13 2 9 22 2" })] })),
|
|
22276
|
-
FiUser: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" }), jsxRuntime.jsx("circle", { cx: "12", cy: "7", r: "4" })] })),
|
|
22277
|
-
FiUsers: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" }), jsxRuntime.jsx("circle", { cx: "9", cy: "7", r: "4" }), jsxRuntime.jsx("path", { d: "M23 21v-2a4 4 0 0 0-3-3.87" }), jsxRuntime.jsx("path", { d: "M16 3.13a4 4 0 0 1 0 7.75" })] })),
|
|
22278
|
-
FiHeadphones: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("path", { d: "M3 18v-6a9 9 0 0 1 18 0v6" }), jsxRuntime.jsx("path", { d: "M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3zM3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z" })] })),
|
|
22279
|
-
FiCpu: () => (jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntime.jsx("rect", { x: "4", y: "4", width: "16", height: "16", rx: "2", ry: "2" }), jsxRuntime.jsx("rect", { x: "9", y: "9", width: "6", height: "6" }), jsxRuntime.jsx("line", { x1: "9", y1: "1", x2: "9", y2: "4" }), jsxRuntime.jsx("line", { x1: "15", y1: "1", x2: "15", y2: "4" }), jsxRuntime.jsx("line", { x1: "9", y1: "20", x2: "9", y2: "23" }), jsxRuntime.jsx("line", { x1: "15", y1: "20", x2: "15", y2: "23" }), jsxRuntime.jsx("line", { x1: "20", y1: "9", x2: "23", y2: "9" }), jsxRuntime.jsx("line", { x1: "20", y1: "14", x2: "23", y2: "14" }), jsxRuntime.jsx("line", { x1: "1", y1: "9", x2: "4", y2: "9" }), jsxRuntime.jsx("line", { x1: "1", y1: "14", x2: "4", y2: "14" })] })),
|
|
22280
22046
|
FiChevronDown: () => (jsxRuntime.jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", children: jsxRuntime.jsx("polyline", { points: "6 9 12 15 18 9" }) })),
|
|
22281
22047
|
};
|
|
22282
|
-
const ChatWidget = ({ widgetId,
|
|
22048
|
+
const ChatWidget = ({ widgetId, apiUrl = window.location.origin, position = 'bottom-right', primaryColor, onOpen, onClose, onMessage, onError, }) => {
|
|
22283
22049
|
const [isOpen, setIsOpen] = react.useState(false);
|
|
22284
22050
|
const [autoDetectedTheme, setAutoDetectedTheme] = react.useState('light');
|
|
22285
22051
|
const widgetRef = react.useRef(null);
|
|
22286
22052
|
const containerRef = react.useRef(null);
|
|
22287
22053
|
const { messages, isLoading, isTyping, error, config, sendMessage, submitFeedback, } = useChat({
|
|
22288
22054
|
widgetId,
|
|
22289
|
-
apiKey,
|
|
22290
22055
|
apiUrl,
|
|
22291
22056
|
onMessage,
|
|
22292
22057
|
onError,
|
|
@@ -22321,7 +22086,6 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
|
|
|
22321
22086
|
console.log('[ChatWidget] Config loaded:', config ? 'YES' : 'NO');
|
|
22322
22087
|
if (config) {
|
|
22323
22088
|
console.log('[ChatWidget] Config details:', {
|
|
22324
|
-
theme: config.appearance?.theme,
|
|
22325
22089
|
accentColor: config.appearance?.primaryColor,
|
|
22326
22090
|
autoDetectedTheme,
|
|
22327
22091
|
});
|
|
@@ -22361,7 +22125,7 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
|
|
|
22361
22125
|
}, [isOpen, onClose]);
|
|
22362
22126
|
// Handle close on Escape key
|
|
22363
22127
|
react.useEffect(() => {
|
|
22364
|
-
if (!isOpen
|
|
22128
|
+
if (!isOpen)
|
|
22365
22129
|
return;
|
|
22366
22130
|
const handleEscapeKey = (event) => {
|
|
22367
22131
|
if (event.key === 'Escape') {
|
|
@@ -22371,16 +22135,10 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
|
|
|
22371
22135
|
};
|
|
22372
22136
|
document.addEventListener('keydown', handleEscapeKey);
|
|
22373
22137
|
return () => document.removeEventListener('keydown', handleEscapeKey);
|
|
22374
|
-
}, [isOpen,
|
|
22375
|
-
// Determine theme -
|
|
22138
|
+
}, [isOpen, onClose]);
|
|
22139
|
+
// Determine theme - always auto-detect from background
|
|
22376
22140
|
const appearanceConfig = config?.appearance;
|
|
22377
|
-
const
|
|
22378
|
-
// Use auto-detected theme, or explicit override
|
|
22379
|
-
const effectiveTheme = themeSetting === 'auto'
|
|
22380
|
-
? autoDetectedTheme
|
|
22381
|
-
: themeSetting === 'dark'
|
|
22382
|
-
? 'dark'
|
|
22383
|
-
: 'light';
|
|
22141
|
+
const effectiveTheme = autoDetectedTheme;
|
|
22384
22142
|
// Determine position (config takes priority over prop)
|
|
22385
22143
|
const effectivePosition = config?.appearance.position || position;
|
|
22386
22144
|
// Get accent color from config or prop
|
|
@@ -22389,17 +22147,15 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
|
|
|
22389
22147
|
const simpleAppearance = {
|
|
22390
22148
|
accentColor,
|
|
22391
22149
|
size: appearanceConfig?.size || 'small',
|
|
22392
|
-
|
|
22393
|
-
|
|
22394
|
-
|
|
22395
|
-
headerTitle: appearanceConfig?.lightMode?.header?.title,
|
|
22396
|
-
buttonIcon: appearanceConfig?.buttonIcon || appearanceConfig?.lightMode?.button?.icon,
|
|
22150
|
+
welcomeMessage: appearanceConfig?.welcomeMessage || '',
|
|
22151
|
+
placeholder: appearanceConfig?.placeholder || '',
|
|
22152
|
+
headerTitle: appearanceConfig?.headerTitle || '',
|
|
22397
22153
|
};
|
|
22398
22154
|
// Generate theme styles from accent color
|
|
22399
22155
|
const generatedStyles = generateThemeStyles(simpleAppearance, effectiveTheme);
|
|
22400
22156
|
// Also apply legacy styles for backward compatibility
|
|
22401
22157
|
const legacyStyles = appearanceConfig
|
|
22402
|
-
? applyAppearanceStyles(appearanceConfig
|
|
22158
|
+
? applyAppearanceStyles(appearanceConfig)
|
|
22403
22159
|
: {};
|
|
22404
22160
|
// Merge styles (generated takes priority for new simplified system)
|
|
22405
22161
|
const customStyles = {
|
|
@@ -22411,10 +22167,9 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
|
|
|
22411
22167
|
console.log('[ChatWidget] Theme info:', {
|
|
22412
22168
|
effectiveTheme,
|
|
22413
22169
|
autoDetectedTheme,
|
|
22414
|
-
themeSetting,
|
|
22415
22170
|
accentColor,
|
|
22416
22171
|
});
|
|
22417
|
-
}, [effectiveTheme, autoDetectedTheme,
|
|
22172
|
+
}, [effectiveTheme, autoDetectedTheme, accentColor]);
|
|
22418
22173
|
const handleToggle = () => {
|
|
22419
22174
|
const newState = !isOpen;
|
|
22420
22175
|
console.log('[ChatWidget] handleToggle called, setting isOpen to:', newState);
|
|
@@ -22436,24 +22191,8 @@ const ChatWidget = ({ widgetId, apiKey, apiUrl = window.location.origin, positio
|
|
|
22436
22191
|
}
|
|
22437
22192
|
console.log('[ChatWidget] Rendering widget', { isOpen, hasConfig: !!config });
|
|
22438
22193
|
// Get button icon based on state
|
|
22439
|
-
const
|
|
22440
|
-
|
|
22441
|
-
return iconComponents.FiChevronDown;
|
|
22442
|
-
}
|
|
22443
|
-
const themeConfig = effectiveTheme === 'dark'
|
|
22444
|
-
? appearanceConfig?.darkMode
|
|
22445
|
-
: appearanceConfig?.lightMode;
|
|
22446
|
-
const buttonIcon = themeConfig?.button?.icon || 'FiMessageCircle';
|
|
22447
|
-
return iconComponents[buttonIcon] || iconComponents.FiMessageCircle;
|
|
22448
|
-
};
|
|
22449
|
-
const buttonIconColor = (() => {
|
|
22450
|
-
const themeConfig = effectiveTheme === 'dark'
|
|
22451
|
-
? appearanceConfig?.darkMode
|
|
22452
|
-
: appearanceConfig?.lightMode;
|
|
22453
|
-
return themeConfig?.button?.iconColor || customStyles['--button-icon-color'] || '#ffffff';
|
|
22454
|
-
})();
|
|
22455
|
-
const IconComponent = getButtonIcon();
|
|
22456
|
-
return (jsxRuntime.jsx("div", { ref: containerRef, className: `ai-chat-widget ${effectiveTheme}`, style: customStyles, children: jsxRuntime.jsxs("div", { ref: widgetRef, className: `ai-chat-widget-container ${effectivePosition}`, children: [isOpen && (jsxRuntime.jsx(ChatWindow, { messages: messages, isLoading: isLoading, isTyping: isTyping, error: error, config: config, onSendMessage: sendMessage, onClose: handleToggle, onFeedback: handleFeedback })), jsxRuntime.jsx("button", { className: `ai-chat-button ${isOpen ? 'is-open' : ''}`, onClick: handleToggle, "aria-label": isOpen ? "Minimize chat" : "Open chat", style: { color: buttonIconColor }, children: jsxRuntime.jsx("div", { className: "ai-chat-button-svg", children: jsxRuntime.jsx(IconComponent, {}) }) })] }) }));
|
|
22194
|
+
const IconComponent = isOpen ? iconComponents.FiChevronDown : iconComponents.FiMessageCircle;
|
|
22195
|
+
return (jsxRuntime.jsx("div", { ref: containerRef, className: `ai-chat-widget ${effectiveTheme}`, style: customStyles, children: jsxRuntime.jsxs("div", { ref: widgetRef, className: `ai-chat-widget-container ${effectivePosition}`, children: [isOpen && (jsxRuntime.jsx(ChatWindow, { messages: messages, isLoading: isLoading, isTyping: isTyping, error: error, config: config, onSendMessage: sendMessage, onClose: handleToggle, onFeedback: handleFeedback })), jsxRuntime.jsx("button", { className: `ai-chat-button ${isOpen ? 'is-open' : ''}`, onClick: handleToggle, "aria-label": isOpen ? "Minimize chat" : "Open chat", children: jsxRuntime.jsx("div", { className: "ai-chat-button-svg", children: jsxRuntime.jsx(IconComponent, {}) }) })] }) }));
|
|
22457
22196
|
};
|
|
22458
22197
|
|
|
22459
22198
|
exports.ApiError = ApiError;
|