@salla.sa/ui-ai-kit-core 2.2.4 → 2.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/ai-chat-container.cjs.entry.js +65 -3
- package/dist/cjs/ai-chat-header.cjs.entry.js +32 -13
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/ui-ai-kit.cjs.js +1 -1
- package/dist/collection/components/ai-chat-container/ai-chat-container.css +4 -0
- package/dist/collection/components/ai-chat-container/ai-chat-container.js +64 -2
- package/dist/collection/components/ai-chat-header/ai-chat-header.js +74 -14
- package/dist/components/ai-chat-container.js +1 -1
- package/dist/components/ai-chat-header.js +1 -1
- package/dist/esm/ai-chat-container.entry.js +65 -3
- package/dist/esm/ai-chat-header.entry.js +32 -13
- package/dist/esm/loader.js +1 -1
- package/dist/esm/ui-ai-kit.js +1 -1
- package/dist/types/components/ai-chat-container/ai-chat-container.d.ts +10 -1
- package/dist/types/components/ai-chat-header/ai-chat-header.d.ts +8 -0
- package/dist/types/components.d.ts +22 -0
- package/dist/ui-ai-kit/p-3007f89b.entry.js +1 -0
- package/dist/ui-ai-kit/p-e9ac7197.entry.js +1 -0
- package/dist/ui-ai-kit/ui-ai-kit.esm.js +1 -1
- package/package.json +1 -1
- package/dist/ui-ai-kit/p-1b247096.entry.js +0 -1
- package/dist/ui-ai-kit/p-2fd7529e.entry.js +0 -1
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-Cc05u4ND.js');
|
|
4
4
|
|
|
5
|
-
const aiChatContainerCss = () => `:host{display:contents}.chat-container{font-family:var(--ai-font-family);display:flex;flex-direction:column;overflow:hidden;position:relative;background-color:var(--ai-container-bg, var(--ai-bg-card));border:1px solid var(--ai-border-default);z-index:50;box-sizing:border-box}.messages-area{flex:1;overflow-y:auto;min-height:0;scrollbar-width:thin;padding:var(--ai-spacing-2xl, 16px);scrollbar-color:var(--ai-scrollbar-thumb) transparent}.messages-area::-webkit-scrollbar{width:3px}.messages-area::-webkit-scrollbar-track{background:transparent}.messages-area::-webkit-scrollbar-thumb{background:var(--ai-scrollbar-thumb);border-radius:99px}.messages-area::-webkit-scrollbar-thumb:hover{background:var(--ai-scrollbar-thumb-hover)}.chat-container.left,.chat-container.right{position:fixed;top:0;bottom:0;transition:transform 300ms cubic-bezier(0.4, 0, 0.2, 1)}.chat-container.left{left:0;transform:translateX(-100%)}.chat-container.right{right:0;transform:translateX(100%)}.chat-container.left.open,.chat-container.right.open{transform:translateX(0)}.chat-container.float{position:fixed;border-radius:16px;box-shadow:var(--ai-shadow-float);opacity:0;pointer-events:none;transform:scale(0.95);transform-origin:bottom left;transition:opacity 200ms ease, transform 200ms ease}.chat-container.float.open{opacity:1;pointer-events:auto;transform:scale(1)}.watermark{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none;width:133px;height:133px}.watermark .watermark-circle-svg{position:absolute;top:0;left:0}.watermark .watermark-star-svg{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.watermark .watermark-circle{fill:var(--ai-watermark-circle, #FCFCFC)}.watermark .watermark-star{fill:var(--ai-watermark-star, #FAFAFA)}:host(.dark) .watermark .watermark-circle{fill:var(--ai-watermark-circle, #222222)}:host(.dark) .watermark .watermark-star{fill:var(--ai-watermark-star, #292B2C)}.chat-container.mobile{width:100% !important}.chat-container.float.mobile{left:0 !important;right:0 !important;top:0 !important;bottom:0 !important;height:100% !important;border-radius:0 !important}@media (max-width: 767px){.chat-container{width:100% !important}.chat-container.float{left:0 !important;right:0 !important;top:0 !important;bottom:0 !important;height:100% !important;border-radius:0 !important}}@keyframes skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.skeleton-messages{display:flex;flex-direction:column;gap:20px;padding:8px 0}.skeleton-row{display:flex;align-items:flex-start;gap:10px}.skeleton-row.agent{flex-direction:row}.skeleton-row.user{flex-direction:row-reverse}.skeleton-avatar{width:32px;height:32px;min-width:32px;border-radius:50%;background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(0,0,0,0.06) 25%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}.skeleton-bubble{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:16px;background-color:var(--ai-bg-surface, #f9fafb);max-width:75%;min-width:120px}.skeleton-row.user .skeleton-bubble{background-color:var(--ai-user-bubble-bg, var(--ai-accent, #004956));border-radius:16px}.skeleton-line{height:12px;border-radius:6px;background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(0,0,0,0.06) 25%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}.skeleton-row.user .skeleton-line{background:linear-gradient(90deg, rgba(255,255,255,0.08) 25%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0.08) 75%);background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}:host(.dark) .skeleton-avatar{background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(255,255,255,0.06) 25%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}:host(.dark) .skeleton-bubble{background-color:var(--ai-bg-surface, #1f2937)}:host(.dark) .skeleton-line{background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(255,255,255,0.06) 25%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:48px 24px;flex:1}.error-icon{color:var(--ai-text-muted, #9ca3af);opacity:0.7}.error-text{margin:0;font-size:14px;line-height:1.5;color:var(--ai-text-secondary, #6b7280)}.error-retry-btn{display:inline-flex;align-items:center;justify-content:center;padding:8px 20px;border-radius:9999px;border:1px solid var(--ai-border-default);background-color:var(--ai-bg-surface, #f9fafb);color:var(--ai-text-primary);font-size:13px;font-weight:500;font-family:inherit;cursor:pointer;transition:background-color 0.15s ease, border-color 0.15s ease}.error-retry-btn:hover{background-color:var(--ai-hover-overlay, rgba(0, 0, 0, 0.04));border-color:var(--ai-accent, #004956)}.error-retry-btn:focus-visible{outline:2px solid var(--ai-focus-ring-color, var(--ai-focus-ring));outline-offset:2px}:host(.dark) .error-retry-btn{background-color:var(--ai-bg-surface, #1f2937);color:var(--ai-text-primary, #f9fafb)}:host(.dark) .error-retry-btn:hover{background-color:var(--ai-hover-overlay, rgba(255, 255, 255, 0.06))}`;
|
|
5
|
+
const aiChatContainerCss = () => `:host{display:contents}.chat-container{font-family:var(--ai-font-family);display:flex;flex-direction:column;overflow:hidden;position:relative;background-color:var(--ai-container-bg, var(--ai-bg-card));border:1px solid var(--ai-border-default);z-index:50;box-sizing:border-box}.messages-area{flex:1;overflow-y:auto;min-height:0;scrollbar-width:thin;padding:var(--ai-spacing-2xl, 16px);scrollbar-color:var(--ai-scrollbar-thumb) transparent}.messages-area::-webkit-scrollbar{width:3px}.messages-area::-webkit-scrollbar-track{background:transparent}.messages-area::-webkit-scrollbar-thumb{background:var(--ai-scrollbar-thumb);border-radius:99px}.messages-area::-webkit-scrollbar-thumb:hover{background:var(--ai-scrollbar-thumb-hover)}.chat-container.left,.chat-container.right{position:fixed;top:0;bottom:0;transition:transform 300ms cubic-bezier(0.4, 0, 0.2, 1)}.chat-container.left{left:0;transform:translateX(-100%)}.chat-container.right{right:0;transform:translateX(100%)}.chat-container.left.open,.chat-container.right.open{transform:translateX(0)}.chat-container.float{position:fixed;border-radius:16px;box-shadow:var(--ai-shadow-float);opacity:0;pointer-events:none;transform:scale(0.95);transform-origin:bottom left;transition:opacity 200ms ease, transform 200ms ease}:host([direction="ltr"]) .chat-container.float{transform-origin:bottom right}.chat-container.float.open{opacity:1;pointer-events:auto;transform:scale(1)}.watermark{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none;width:133px;height:133px}.watermark .watermark-circle-svg{position:absolute;top:0;left:0}.watermark .watermark-star-svg{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.watermark .watermark-circle{fill:var(--ai-watermark-circle, #FCFCFC)}.watermark .watermark-star{fill:var(--ai-watermark-star, #FAFAFA)}:host(.dark) .watermark .watermark-circle{fill:var(--ai-watermark-circle, #222222)}:host(.dark) .watermark .watermark-star{fill:var(--ai-watermark-star, #292B2C)}.chat-container.mobile{width:100% !important}.chat-container.float.mobile{left:0 !important;right:0 !important;top:0 !important;bottom:0 !important;height:100% !important;border-radius:0 !important}@media (max-width: 767px){.chat-container{width:100% !important}.chat-container.float{left:0 !important;right:0 !important;top:0 !important;bottom:0 !important;height:100% !important;border-radius:0 !important}}@keyframes skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.skeleton-messages{display:flex;flex-direction:column;gap:20px;padding:8px 0}.skeleton-row{display:flex;align-items:flex-start;gap:10px}.skeleton-row.agent{flex-direction:row}.skeleton-row.user{flex-direction:row-reverse}.skeleton-avatar{width:32px;height:32px;min-width:32px;border-radius:50%;background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(0,0,0,0.06) 25%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}.skeleton-bubble{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:16px;background-color:var(--ai-bg-surface, #f9fafb);max-width:75%;min-width:120px}.skeleton-row.user .skeleton-bubble{background-color:var(--ai-user-bubble-bg, var(--ai-accent, #004956));border-radius:16px}.skeleton-line{height:12px;border-radius:6px;background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(0,0,0,0.06) 25%, rgba(0,0,0,0.1) 50%, rgba(0,0,0,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}.skeleton-row.user .skeleton-line{background:linear-gradient(90deg, rgba(255,255,255,0.08) 25%, rgba(255,255,255,0.15) 50%, rgba(255,255,255,0.08) 75%);background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}:host(.dark) .skeleton-avatar{background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(255,255,255,0.06) 25%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}:host(.dark) .skeleton-bubble{background-color:var(--ai-bg-surface, #1f2937)}:host(.dark) .skeleton-line{background:var(--ai-shimmer-gradient, linear-gradient(90deg, rgba(255,255,255,0.06) 25%, rgba(255,255,255,0.1) 50%, rgba(255,255,255,0.06) 75%));background-size:200% 100%;animation:skeleton-shimmer 1.6s ease-in-out infinite}.error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:48px 24px;flex:1}.error-icon{color:var(--ai-text-muted, #9ca3af);opacity:0.7}.error-text{margin:0;font-size:14px;line-height:1.5;color:var(--ai-text-secondary, #6b7280)}.error-retry-btn{display:inline-flex;align-items:center;justify-content:center;padding:8px 20px;border-radius:9999px;border:1px solid var(--ai-border-default);background-color:var(--ai-bg-surface, #f9fafb);color:var(--ai-text-primary);font-size:13px;font-weight:500;font-family:inherit;cursor:pointer;transition:background-color 0.15s ease, border-color 0.15s ease}.error-retry-btn:hover{background-color:var(--ai-hover-overlay, rgba(0, 0, 0, 0.04));border-color:var(--ai-accent, #004956)}.error-retry-btn:focus-visible{outline:2px solid var(--ai-focus-ring-color, var(--ai-focus-ring));outline-offset:2px}:host(.dark) .error-retry-btn{background-color:var(--ai-bg-surface, #1f2937);color:var(--ai-text-primary, #f9fafb)}:host(.dark) .error-retry-btn:hover{background-color:var(--ai-hover-overlay, rgba(255, 255, 255, 0.06))}`;
|
|
6
6
|
|
|
7
7
|
const ChatContainer = class {
|
|
8
8
|
constructor(hostRef) {
|
|
@@ -51,6 +51,7 @@ const ChatContainer = class {
|
|
|
51
51
|
dragState = null;
|
|
52
52
|
mutationObserver = null;
|
|
53
53
|
resizeObserver = null;
|
|
54
|
+
dirObserver = null;
|
|
54
55
|
// Named arrow so we can reliably add/remove it without leaking
|
|
55
56
|
dragListener = (e) => {
|
|
56
57
|
if (typeof window === 'undefined')
|
|
@@ -102,10 +103,21 @@ const ChatContainer = class {
|
|
|
102
103
|
}
|
|
103
104
|
componentWillLoad() {
|
|
104
105
|
this.checkMobile();
|
|
106
|
+
// Auto-detect direction from the DOM if not explicitly set via prop
|
|
107
|
+
this.syncDirectionFromDom();
|
|
108
|
+
// Normalize default position to match direction
|
|
109
|
+
if (this.position === 'left' && this.direction === 'ltr') {
|
|
110
|
+
this.position = 'right';
|
|
111
|
+
}
|
|
105
112
|
}
|
|
106
113
|
componentDidLoad() {
|
|
107
114
|
if (typeof window === 'undefined')
|
|
108
115
|
return;
|
|
116
|
+
// Set default float position to the correct side based on direction
|
|
117
|
+
if (this.direction === 'ltr') {
|
|
118
|
+
const containerWidth = this.containerRef?.offsetWidth || this.parsePropToPx(this.width);
|
|
119
|
+
this.floatLeft = `${window.innerWidth - containerWidth - 24}px`;
|
|
120
|
+
}
|
|
109
121
|
// Use ResizeObserver for responsive mobile detection instead of window.resize
|
|
110
122
|
if (typeof ResizeObserver !== 'undefined') {
|
|
111
123
|
this.resizeObserver = new ResizeObserver(() => {
|
|
@@ -119,6 +131,17 @@ const ChatContainer = class {
|
|
|
119
131
|
if (this.position === 'float') {
|
|
120
132
|
this.setupDrag();
|
|
121
133
|
}
|
|
134
|
+
// Watch document.documentElement for dir attribute changes (e.g. Storybook toolbar)
|
|
135
|
+
if (typeof MutationObserver !== 'undefined') {
|
|
136
|
+
this.dirObserver = new MutationObserver(() => {
|
|
137
|
+
const prev = this.direction;
|
|
138
|
+
this.syncDirectionFromDom();
|
|
139
|
+
if (this.direction !== prev) {
|
|
140
|
+
this.applyDirectionDefaults(prev);
|
|
141
|
+
}
|
|
142
|
+
});
|
|
143
|
+
this.dirObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['dir'] });
|
|
144
|
+
}
|
|
122
145
|
this.mutationObserver = new MutationObserver(() => {
|
|
123
146
|
if (this.autoScroll && this.messagesAreaRef) {
|
|
124
147
|
requestAnimationFrame(() => {
|
|
@@ -140,6 +163,7 @@ const ChatContainer = class {
|
|
|
140
163
|
if (newVal === 'float') {
|
|
141
164
|
this.setupDrag();
|
|
142
165
|
}
|
|
166
|
+
this.positionChange.emit(newVal);
|
|
143
167
|
}
|
|
144
168
|
disconnectedCallback() {
|
|
145
169
|
if (typeof window !== 'undefined') {
|
|
@@ -148,6 +172,7 @@ const ChatContainer = class {
|
|
|
148
172
|
this.el.removeEventListener('headerDragStart', this.dragListener);
|
|
149
173
|
this.mutationObserver?.disconnect();
|
|
150
174
|
this.resizeObserver?.disconnect();
|
|
175
|
+
this.dirObserver?.disconnect();
|
|
151
176
|
}
|
|
152
177
|
/** Programmatically scroll the messages area to the bottom */
|
|
153
178
|
async scrollToBottom() {
|
|
@@ -163,12 +188,49 @@ const ChatContainer = class {
|
|
|
163
188
|
async cyclePosition() {
|
|
164
189
|
const docked = this.direction === 'rtl' ? 'left' : 'right';
|
|
165
190
|
this.position = this.position === 'float' ? docked : 'float';
|
|
166
|
-
this.positionChange.emit(this.position);
|
|
167
191
|
}
|
|
168
192
|
handleWindowResize = () => {
|
|
169
193
|
this.checkMobile();
|
|
170
194
|
this.clampFloatPosition();
|
|
171
195
|
};
|
|
196
|
+
/** Read direction from the nearest [dir] ancestor or <html dir>. */
|
|
197
|
+
syncDirectionFromDom() {
|
|
198
|
+
if (typeof document === 'undefined')
|
|
199
|
+
return;
|
|
200
|
+
const closest = this.el.closest('[dir]');
|
|
201
|
+
const domDir = closest?.getAttribute('dir') ?? document.documentElement.getAttribute('dir') ?? document.documentElement.dir;
|
|
202
|
+
if (domDir === 'ltr' || domDir === 'rtl') {
|
|
203
|
+
this.direction = domDir;
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
/**
|
|
207
|
+
* After a direction change, normalize position and float offset.
|
|
208
|
+
* @param prevDir the direction before the change
|
|
209
|
+
*/
|
|
210
|
+
applyDirectionDefaults(prevDir) {
|
|
211
|
+
const oldDocked = prevDir === 'rtl' ? 'left' : 'right';
|
|
212
|
+
const newDocked = this.direction === 'rtl' ? 'left' : 'right';
|
|
213
|
+
// If was docked on the old side, flip to new docked side
|
|
214
|
+
if (this.position === oldDocked) {
|
|
215
|
+
this.position = newDocked;
|
|
216
|
+
}
|
|
217
|
+
// Reset float anchor to the correct default side
|
|
218
|
+
if (this.direction === 'ltr' && typeof window !== 'undefined') {
|
|
219
|
+
const w = this.containerRef?.offsetWidth || this.parsePropToPx(this.width);
|
|
220
|
+
this.floatLeft = `${window.innerWidth - w - 24}px`;
|
|
221
|
+
}
|
|
222
|
+
else {
|
|
223
|
+
this.floatLeft = '24px';
|
|
224
|
+
}
|
|
225
|
+
}
|
|
226
|
+
parsePropToPx(value) {
|
|
227
|
+
const num = parseFloat(value);
|
|
228
|
+
if (value.endsWith('rem'))
|
|
229
|
+
return num * 16;
|
|
230
|
+
if (value.endsWith('%') && typeof window !== 'undefined')
|
|
231
|
+
return (num / 100) * window.innerWidth;
|
|
232
|
+
return num;
|
|
233
|
+
}
|
|
172
234
|
checkMobile() {
|
|
173
235
|
if (typeof window !== 'undefined') {
|
|
174
236
|
this.isMobile = window.innerWidth < 768;
|
|
@@ -235,7 +297,7 @@ const ChatContainer = class {
|
|
|
235
297
|
return (index.h("div", { class: "error-state", role: "alert" }, index.h("svg", { class: "error-icon", width: "48", height: "48", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("circle", { cx: "12", cy: "12", r: "10", stroke: "currentColor", "stroke-width": "1.5" }), index.h("path", { d: "M12 7v6", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round" }), index.h("circle", { cx: "12", cy: "16.5", r: "0.75", fill: "currentColor" })), index.h("p", { class: "error-text" }, this.errorText), index.h("button", { class: "error-retry-btn", type: "button", onClick: () => this.retryClick.emit() }, this.retryLabel)));
|
|
236
298
|
}
|
|
237
299
|
render() {
|
|
238
|
-
return (index.h(index.Host, { key: '
|
|
300
|
+
return (index.h(index.Host, { key: '92739e10d04132efe3428b4568b84dbb743f2ced', class: { dark: this.isDark() } }, index.h("div", { key: '3846f4aa16275a9ee42d88600a39f9fdec4b9380', class: this.getContainerClasses(), style: this.getContainerStyle(), ref: el => (this.containerRef = el) }, this.showWatermark && !this.loading && !this.error && (index.h("div", { key: '674c8c8075b1bd7e02c6e6925fefddaffbf07da7', class: "watermark" }, index.h("svg", { key: '1dd03d917460057d5985c52760b8fcfec2ba185f', class: "watermark-circle-svg", width: "133", height: "133", viewBox: "0 0 133 133", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { key: '80e4ad2dc46b7196113e10e7604bec0df5434e81', filter: "url(#wm_circle_shadow)" }, index.h("circle", { key: '65ae6aa94aae8057c2d78a77799fbbe2ae7d4642', cx: "66.415", cy: "66.415", r: "66.415", class: "watermark-circle" })), index.h("defs", { key: 'd180bfb115a5bc946b5b65f17fa746bd3a2671b5' }, index.h("filter", { key: 'f0c88495d1fafe3ce77f0a41ebf20edeacd9f63f', id: "wm_circle_shadow", x: "0", y: "0", width: "132.83", height: "135.83", filterUnits: "userSpaceOnUse", "color-interpolation-filters": "sRGB" }, index.h("feFlood", { key: '673f789a1d59c36fa0a22a73de81b4d42589488e', "flood-opacity": "0", result: "BackgroundImageFix" }), index.h("feBlend", { key: '297e94e150f4ff65b740d10b1fefb8a2d86e6eba', mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), index.h("feColorMatrix", { key: '7481822fe991f1b39a8ef4b1d55f152ebe5a74dc', in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), index.h("feOffset", { key: 'b8587f0e9191d4d0d1a2109640dcc4d8510d1329', dy: "3" }), index.h("feGaussianBlur", { key: 'c103c56cdc19f38d8766f1f822261baa52c3c8f7', stdDeviation: "3" }), index.h("feComposite", { key: 'e648998eac51783c4d24c2605d7af0f75f9694d9', in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), index.h("feColorMatrix", { key: 'e51ea8682d8b47e2d1b3fa18f0e1c98f61cf9442', type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0" }), index.h("feBlend", { key: 'c8920059343daac0ab791217f0e35bf696d22c78', mode: "normal", in2: "shape", result: "effect1_innerShadow" })))), index.h("svg", { key: '3d305842745d57d75b2328f2118120881408d918', class: "watermark-star-svg", width: "78", height: "78", viewBox: "0 0 78 78", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { key: 'e04b6580b99cb9007d44089eb19c56e68d5a3500', filter: "url(#wm_star_shadow)" }, index.h("path", { key: '8ecd34ab83c4ce2c99b6197079d31dc7111aba81', d: "M38.7421 0C39.5691 0 40.2689 0.286272 40.8414 0.858815C41.414 1.43136 41.7002 2.13113 41.7002 2.95814C41.7002 8.87442 43.1952 14.3772 46.1851 19.4665C49.1115 24.4285 53.0557 28.3727 58.0177 31.299C63.107 34.289 68.6097 35.7839 74.526 35.7839C75.353 35.7839 76.0528 36.0702 76.6254 36.6428C77.1979 37.2153 77.4842 37.9151 77.4842 38.7421C77.4842 39.5691 77.1979 40.2689 76.6254 40.8414C76.0528 41.414 75.353 41.7002 74.526 41.7002C68.6097 41.7002 63.107 43.1952 58.0177 46.1851C53.0557 49.1115 49.1115 53.0557 46.1851 58.0177C43.1952 63.107 41.7002 68.6097 41.7002 74.526C41.7002 75.353 41.414 76.0528 40.8414 76.6254C40.2689 77.1979 39.5691 77.4842 38.7421 77.4842C37.9151 77.4842 37.2153 77.1979 36.6428 76.6254C36.0702 76.0528 35.7839 75.353 35.7839 74.526C35.7839 68.6097 34.289 63.107 31.299 58.0177C28.3727 53.0557 24.4285 49.1115 19.4665 46.1851C14.3772 43.1952 8.87442 41.7002 2.95814 41.7002C2.13113 41.7002 1.43136 41.414 0.858815 40.8414C0.286272 40.2689 0 39.5691 0 38.7421C0 37.9151 0.286272 37.2153 0.858815 36.6428C1.43136 36.0702 2.13113 35.7839 2.95814 35.7839C8.87442 35.7839 14.3772 34.289 19.4665 31.299C24.4285 28.3727 28.3727 24.4285 31.299 19.4665C34.289 14.3772 35.7839 8.87442 35.7839 2.95814C35.7839 2.13113 36.0702 1.43136 36.6428 0.858815C37.2153 0.286272 37.9151 0 38.7421 0Z", class: "watermark-star" })), index.h("defs", { key: '28c637d943109a521e6c64918a47bf917e6907db' }, index.h("filter", { key: '5cfaebbcffa9cfe42aa4bd194dd9c4117aaeed89', id: "wm_star_shadow", x: "0", y: "0", width: "77.4844", height: "79.4841", filterUnits: "userSpaceOnUse", "color-interpolation-filters": "sRGB" }, index.h("feFlood", { key: 'b6557267404cff0579970925d571978295044920', "flood-opacity": "0", result: "BackgroundImageFix" }), index.h("feBlend", { key: 'fb5825214d17c41ae4b31225ed58d698b35d0f94', mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), index.h("feColorMatrix", { key: 'afea4f8ea013f7a8fa7a508379c0a94e9b8dbf67', in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), index.h("feOffset", { key: '56471c8c7f7247bdc6f8c985a67eb21d1bf94fff', dy: "2" }), index.h("feGaussianBlur", { key: '2d8674ba7260cbf634046dbe6a3b3931d01d46e2', stdDeviation: "2" }), index.h("feComposite", { key: '98fe007a1fa727d95ae0c7c61658a0df1659e978', in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), index.h("feColorMatrix", { key: 'c4960302961214dae4091d028df699a7938ca2c6', type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0" }), index.h("feBlend", { key: '087483fdb9064cd948984348ce6b4a921a47e144', mode: "normal", in2: "shape", result: "effect1_innerShadow" })))))), index.h("slot", { key: '7aa772c82a168b2a7d9119738971c67bebd686c4', name: "header" }), index.h("div", { key: 'd5403fd1a67f1ac7ef86e86290005f539b1d1607', class: "messages-area", ref: el => (this.messagesAreaRef = el) }, this.loading ? this.renderSkeleton() : this.error ? this.renderError() : index.h("slot", null)), index.h("slot", { key: 'bcc75c332581807e6bf2c5a769cf6daeeaa97352', name: "footer" }))));
|
|
239
301
|
}
|
|
240
302
|
static get watchers() { return {
|
|
241
303
|
"isOpen": [{
|
|
@@ -57,11 +57,18 @@ const AiChatHeader = class {
|
|
|
57
57
|
conversationDeletingId = '';
|
|
58
58
|
/** Show a shimmer skeleton in place of the conversation title (e.g. while loading conversation) */
|
|
59
59
|
titleLoading = false;
|
|
60
|
+
/** Hide the new-chat (pencil-edit) button */
|
|
61
|
+
disableNewChat = false;
|
|
62
|
+
/** Hide the conversation-list dropdown trigger (title chevron) */
|
|
63
|
+
disableConversationList = false;
|
|
60
64
|
avatarError = false;
|
|
61
65
|
dropdownOpen = false;
|
|
62
66
|
/** Internally managed — true when the parent ai-chat-container has position="float" */
|
|
63
67
|
isFloating = false;
|
|
68
|
+
/** Internally managed — true when viewport width < 768px (matches ai-chat-container logic) */
|
|
69
|
+
isMobile = false;
|
|
64
70
|
parentPositionObserver = null;
|
|
71
|
+
handleWindowResize = () => this.checkMobile();
|
|
65
72
|
/** Cancel / close button */
|
|
66
73
|
closeClick;
|
|
67
74
|
/** Pencil-edit button (agent mode) */
|
|
@@ -96,7 +103,7 @@ const AiChatHeader = class {
|
|
|
96
103
|
}
|
|
97
104
|
}
|
|
98
105
|
connectedCallback() {
|
|
99
|
-
|
|
106
|
+
this.checkMobile();
|
|
100
107
|
}
|
|
101
108
|
componentDidLoad() {
|
|
102
109
|
// By this point, the element is fully in the DOM and parent relationships are established
|
|
@@ -105,10 +112,21 @@ const AiChatHeader = class {
|
|
|
105
112
|
this.syncFloatingState();
|
|
106
113
|
this.observeParentPosition();
|
|
107
114
|
});
|
|
115
|
+
if (typeof window !== 'undefined') {
|
|
116
|
+
window.addEventListener('resize', this.handleWindowResize);
|
|
117
|
+
}
|
|
108
118
|
}
|
|
109
119
|
disconnectedCallback() {
|
|
110
120
|
this.parentPositionObserver?.disconnect();
|
|
111
121
|
this.parentPositionObserver = null;
|
|
122
|
+
if (typeof window !== 'undefined') {
|
|
123
|
+
window.removeEventListener('resize', this.handleWindowResize);
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
checkMobile() {
|
|
127
|
+
if (typeof window !== 'undefined') {
|
|
128
|
+
this.isMobile = window.innerWidth < 768;
|
|
129
|
+
}
|
|
112
130
|
}
|
|
113
131
|
observeParentPosition() {
|
|
114
132
|
if (this.parentPositionObserver)
|
|
@@ -149,7 +167,7 @@ const AiChatHeader = class {
|
|
|
149
167
|
} }));
|
|
150
168
|
}
|
|
151
169
|
renderDragBtn() {
|
|
152
|
-
return (this.isFloating && (index.h("button", { class: "action-btn drag-btn", "aria-label": "\u0633\u062D\u0628 / Drag", onPointerDown: (e) => {
|
|
170
|
+
return (this.isFloating && !this.isMobile && (index.h("button", { class: "action-btn drag-btn", "aria-label": "\u0633\u062D\u0628 / Drag", onPointerDown: (e) => {
|
|
153
171
|
e.preventDefault();
|
|
154
172
|
this.headerDragStart.emit({ clientX: e.clientX, clientY: e.clientY });
|
|
155
173
|
} }, this.renderIcon('drag', 11, 15))));
|
|
@@ -168,38 +186,39 @@ const AiChatHeader = class {
|
|
|
168
186
|
this.conversationRetry.emit();
|
|
169
187
|
};
|
|
170
188
|
renderConversationDropdown() {
|
|
171
|
-
if (!this.dropdownOpen || this.mode !== 'agent')
|
|
189
|
+
if (!this.dropdownOpen || this.mode !== 'agent' || this.disableConversationList)
|
|
172
190
|
return null;
|
|
173
191
|
return (index.h("div", { class: "conversation-dropdown" }, index.h("ai-conversation-list", { items: this.conversationItems, activeId: this.conversationActiveId, loading: this.conversationLoading, error: this.conversationError, errorText: this.conversationErrorText, retryLabel: this.conversationRetryLabel, emptyText: this.conversationEmptyText, deletingId: this.conversationDeletingId, onConversationSelect: this.handleConversationSelect, onConversationDelete: this.handleConversationDelete, onRetryClick: this.handleConversationRetry })));
|
|
174
192
|
}
|
|
175
193
|
renderAgentMode() {
|
|
194
|
+
const titleContent = this.disableConversationList ? (index.h("div", { class: "content agent" }, this.titleLoading ? (index.h("span", { class: "title-skeleton", "aria-busy": "true", "aria-label": "\u062C\u0627\u0631\u064A \u0627\u0644\u062A\u062D\u0645\u064A\u0644" })) : (index.h("span", { class: "title" }, this.conversation)))) : (index.h("div", { class: "content agent dropdown-trigger", role: "button", onClick: () => {
|
|
195
|
+
if (this.titleLoading)
|
|
196
|
+
return;
|
|
197
|
+
this.dropdownOpen = !this.dropdownOpen;
|
|
198
|
+
this.dropdownClick.emit();
|
|
199
|
+
}, "aria-haspopup": "listbox", "aria-expanded": this.dropdownOpen, "aria-label": `${this.conversation}, افتح قائمة المحادثات` }, this.titleLoading ? (index.h("span", { class: "title-skeleton", "aria-busy": "true", "aria-label": "\u062C\u0627\u0631\u064A \u0627\u0644\u062A\u062D\u0645\u064A\u0644" })) : (index.h("span", { class: "title" }, this.conversation)), !this.titleLoading && (index.h("span", { class: `dropdown-chevron${this.dropdownOpen ? ' open' : ''}` }, this.renderIcon('chevron-down', 24, 24)))));
|
|
176
200
|
return [
|
|
177
201
|
this.renderDragBtn(),
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
return;
|
|
181
|
-
this.dropdownOpen = !this.dropdownOpen;
|
|
182
|
-
this.dropdownClick.emit();
|
|
183
|
-
}, "aria-haspopup": "listbox", "aria-expanded": this.dropdownOpen, "aria-label": `${this.conversation}, افتح قائمة المحادثات` }, this.titleLoading ? (index.h("span", { class: "title-skeleton", "aria-busy": "true", "aria-label": "\u062C\u0627\u0631\u064A \u0627\u0644\u062A\u062D\u0645\u064A\u0644" })) : (index.h("span", { class: "title" }, this.conversation)), !this.titleLoading && (index.h("span", { class: `dropdown-chevron${this.dropdownOpen ? ' open' : ''}` }, this.renderIcon('chevron-down', 24, 24)))),
|
|
184
|
-
index.h("div", { class: "actions" }, index.h("button", { class: "action-btn", "aria-label": "\u0645\u062D\u0627\u062F\u062B\u0629 \u062C\u062F\u064A\u062F\u0629 / New Chat", onClick: () => this.newChatClick.emit() }, this.renderIcon('pencil-edit', 22, 22)), index.h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => { this.positionClick.emit(); this.headerPositionClick.emit(); } }, this.renderIcon('hand', 22, 22)), index.h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
|
|
202
|
+
titleContent,
|
|
203
|
+
index.h("div", { class: "actions" }, !this.disableNewChat && (index.h("button", { class: "action-btn", "aria-label": "\u0645\u062D\u0627\u062F\u062B\u0629 \u062C\u062F\u064A\u062F\u0629 / New Chat", onClick: () => this.newChatClick.emit() }, this.renderIcon('pencil-edit', 22, 22))), !this.isMobile && (index.h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => { this.positionClick.emit(); this.headerPositionClick.emit(); } }, this.renderIcon('hand', 22, 22))), index.h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
|
|
185
204
|
];
|
|
186
205
|
}
|
|
187
206
|
renderHumanMode() {
|
|
188
207
|
return [
|
|
189
208
|
this.renderDragBtn(),
|
|
190
209
|
index.h("div", { class: "content human" }, this.showBack && (index.h("button", { class: "back-btn", "aria-label": "\u0631\u062C\u0648\u0639 / Back", onClick: () => this.backClick.emit() }, this.renderIcon('arrow-right', 24, 24))), index.h("div", { class: "avatar-wrapper" }, this.renderAvatar(), index.h("span", { class: `online-dot status-${this.statusIndicator}` }, this.renderIcon('online-dot', 10, 10))), index.h("div", { class: "text-block" }, index.h("span", { class: "agent-name" }, this.agentName), this.agentStatus && index.h("span", { class: "agent-status" }, this.agentStatus))),
|
|
191
|
-
index.h("div", { class: "actions" }, index.h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => { this.positionClick.emit(); this.headerPositionClick.emit(); } }, this.renderIcon('hand', 22, 22)), index.h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
|
|
210
|
+
index.h("div", { class: "actions" }, !this.isMobile && (index.h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => { this.positionClick.emit(); this.headerPositionClick.emit(); } }, this.renderIcon('hand', 22, 22))), index.h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
|
|
192
211
|
];
|
|
193
212
|
}
|
|
194
213
|
renderBrowserMode() {
|
|
195
214
|
return [
|
|
196
215
|
this.renderDragBtn(),
|
|
197
216
|
index.h("div", { class: "content browser" }, index.h("button", { class: "back-btn", "aria-label": "\u0631\u062C\u0648\u0639 / Back", onClick: () => this.backClick.emit() }, this.renderIcon('arrow-right', 24, 24)), index.h("span", { class: "browser-title" }, this.pageTitle), index.h("button", { class: "browser-link-btn", "aria-label": "\u0641\u062A\u062D \u0641\u064A \u0646\u0627\u0641\u0630\u0629 \u062C\u062F\u064A\u062F\u0629 / Open externally", onClick: () => this.openExternal.emit(this.pageUrl) }, this.renderIcon('link', 14, 14))),
|
|
198
|
-
index.h("div", { class: "actions" }, index.h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => { this.positionClick.emit(); this.headerPositionClick.emit(); } }, this.renderIcon('hand', 22, 22)), index.h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
|
|
217
|
+
index.h("div", { class: "actions" }, !this.isMobile && (index.h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => { this.positionClick.emit(); this.headerPositionClick.emit(); } }, this.renderIcon('hand', 22, 22))), index.h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
|
|
199
218
|
];
|
|
200
219
|
}
|
|
201
220
|
render() {
|
|
202
|
-
return (index.h(index.Host, { key: '
|
|
221
|
+
return (index.h(index.Host, { key: '4c51abf7f5fb572ec62191c0b097a4fdf9b218c3' }, index.h("div", { key: 'c05febe2f984bad8e80b9f0d9f2ceeebc812a9b4', class: "header-wrapper" }, index.h("div", { key: '927c606ae5452a9a5c1e19edd2145f9e1ee42d2c', class: "header-container" }, this.mode === 'agent' ? this.renderAgentMode() : this.mode === 'human' ? this.renderHumanMode() : this.renderBrowserMode()), this.renderConversationDropdown())));
|
|
203
222
|
}
|
|
204
223
|
};
|
|
205
224
|
AiChatHeader.style = aiChatHeaderCss();
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -5,7 +5,7 @@ var index = require('./index-Cc05u4ND.js');
|
|
|
5
5
|
const defineCustomElements = async (win, options) => {
|
|
6
6
|
if (typeof window === 'undefined') return undefined;
|
|
7
7
|
await index.globalScripts();
|
|
8
|
-
return index.bootstrapLazy([["ai-message-input.cjs",[[513,"ai-message-input",{"placeholder":[1],"disabled":[4],"showVoiceButton":[4,"show-voice-button"],"maxLength":[2,"max-length"],"isRecording":[4,"is-recording"],"inputValue":[32],"showVoiceRecorder":[32],"isMultiline":[32],"setInputValue":[64]},null,{"isRecording":[{"onIsRecordingChange":0}]}]]],["ai-rating.cjs",[[513,"ai-rating",{"question":[1],"subtitle":[1],"successMessage":[1,"success-message"],"value":[1026],"disabled":[4],"hovered":[32],"submitted":[32]}]]],["ai-chat-header.cjs",[[513,"ai-chat-header",{"mode":[1],"conversation":[1],"agentName":[1,"agent-name"],"agentStatus":[1,"agent-status"],"agentAvatar":[1,"agent-avatar"],"showBack":[4,"show-back"],"statusIndicator":[1,"status-indicator"],"pageTitle":[1,"page-title"],"pageUrl":[1,"page-url"],"conversationItems":[16],"conversationActiveId":[1,"conversation-active-id"],"conversationLoading":[4,"conversation-loading"],"conversationError":[4,"conversation-error"],"conversationErrorText":[1,"conversation-error-text"],"conversationRetryLabel":[1,"conversation-retry-label"],"conversationEmptyText":[1,"conversation-empty-text"],"conversationDeletingId":[1,"conversation-deleting-id"],"titleLoading":[4,"title-loading"],"avatarError":[32],"dropdownOpen":[32],"isFloating":[32]},[[4,"click","handleDocumentClick"]]]]],["ai-agent-error.cjs",[[513,"ai-agent-error",{"headline":[1],"message":[1],"errorCode":[1,"error-code"],"retryable":[4],"retryLabel":[1,"retry-label"],"dismissible":[4]}]]],["ai-chat-container.cjs",[[769,"ai-chat-container",{"isOpen":[4,"is-open"],"position":[1537],"width":[1],"autoScroll":[4,"auto-scroll"],"showWatermark":[4,"show-watermark"],"floatHeight":[1,"float-height"],"theme":[1],"loading":[4],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"direction":[513],"isMobile":[32],"floatLeft":[32],"floatTop":[32],"scrollToBottom":[64],"cyclePosition":[64]},[[0,"headerPositionClick","handleHeaderPositionClick"]],{"isOpen":[{"isOpenChanged":0}],"position":[{"positionChanged":0}]}]]],["ai-chat-message.cjs",[[769,"ai-chat-message",{"role":[1],"content":[1],"format":[1],"agentName":[1,"agent-name"],"timestamp":[1],"showActions":[4,"show-actions"],"enableRegenerate":[4,"enable-regenerate"],"feedbackValue":[1025,"feedback-value"],"copySuccess":[32]}]]],["ai-conversation-summary.cjs",[[769,"ai-conversation-summary",{"conversation":[1],"summary":[1],"messageCount":[2,"message-count"],"language":[1]}]]],["ai-in-chat-browser.cjs",[[513,"ai-in-chat-browser",{"url":[1],"pageTitle":[1,"page-title"],"isLoading":[32],"hasError":[32]},null,{"url":[{"onUrlChange":0}]}]]],["ai-link.cjs",[[769,"ai-link",{"label":[1],"href":[1],"target":[1],"rel":[1]}]]],["ai-loading.cjs",[[513,"ai-loading",{"mode":[1],"statusText":[1,"status-text"],"thinkingSubtext":[1,"thinking-subtext"],"steps":[16],"headerTitle":[1,"header-title"],"currentAgent":[1,"current-agent"],"showAgentBadges":[4,"show-agent-badges"],"expanded":[1028],"collapsible":[4],"_expanded":[32]}]]],["ai-route-decision.cjs",[[513,"ai-route-decision",{"selectedAgent":[1,"selected-agent"],"agentIcon":[1,"agent-icon"],"reason":[1],"confidence":[2],"detectedLanguage":[1,"detected-language"],"expanded":[1028],"_expanded":[32]}]]],["ai-suggestion.cjs",[[769,"ai-suggestion",{"label":[1],"disabled":[4]}]]],["ai-voice-input.cjs",[[513,"ai-voice-input",{"disabled":[4],"showWaveform":[4,"show-waveform"],"autoStart":[4,"auto-start"],"errorText":[1,"error-text"],"waveformColor":[1,"waveform-color"],"state":[32],"error":[32],"recordingDuration":[32],"submitPulse":[32]}]]],["ai-card.cjs",[[769,"ai-card",{"noPadding":[4,"no-padding"],"noShadow":[4,"no-shadow"]}]]],["ai-conversation-list.cjs",[[513,"ai-conversation-list",{"items":[16],"activeId":[1,"active-id"],"loading":[4],"emptyText":[1,"empty-text"],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"deletingId":[1,"deleting-id"]}]]],["ai-icon.cjs",[[513,"ai-icon",{"name":[1],"size":[2]}]]]], options);
|
|
8
|
+
return index.bootstrapLazy([["ai-message-input.cjs",[[513,"ai-message-input",{"placeholder":[1],"disabled":[4],"showVoiceButton":[4,"show-voice-button"],"maxLength":[2,"max-length"],"isRecording":[4,"is-recording"],"inputValue":[32],"showVoiceRecorder":[32],"isMultiline":[32],"setInputValue":[64]},null,{"isRecording":[{"onIsRecordingChange":0}]}]]],["ai-rating.cjs",[[513,"ai-rating",{"question":[1],"subtitle":[1],"successMessage":[1,"success-message"],"value":[1026],"disabled":[4],"hovered":[32],"submitted":[32]}]]],["ai-chat-header.cjs",[[513,"ai-chat-header",{"mode":[1],"conversation":[1],"agentName":[1,"agent-name"],"agentStatus":[1,"agent-status"],"agentAvatar":[1,"agent-avatar"],"showBack":[4,"show-back"],"statusIndicator":[1,"status-indicator"],"pageTitle":[1,"page-title"],"pageUrl":[1,"page-url"],"conversationItems":[16],"conversationActiveId":[1,"conversation-active-id"],"conversationLoading":[4,"conversation-loading"],"conversationError":[4,"conversation-error"],"conversationErrorText":[1,"conversation-error-text"],"conversationRetryLabel":[1,"conversation-retry-label"],"conversationEmptyText":[1,"conversation-empty-text"],"conversationDeletingId":[1,"conversation-deleting-id"],"titleLoading":[4,"title-loading"],"disableNewChat":[4,"disable-new-chat"],"disableConversationList":[4,"disable-conversation-list"],"avatarError":[32],"dropdownOpen":[32],"isFloating":[32],"isMobile":[32]},[[4,"click","handleDocumentClick"]]]]],["ai-agent-error.cjs",[[513,"ai-agent-error",{"headline":[1],"message":[1],"errorCode":[1,"error-code"],"retryable":[4],"retryLabel":[1,"retry-label"],"dismissible":[4]}]]],["ai-chat-container.cjs",[[769,"ai-chat-container",{"isOpen":[4,"is-open"],"position":[1537],"width":[1],"autoScroll":[4,"auto-scroll"],"showWatermark":[4,"show-watermark"],"floatHeight":[1,"float-height"],"theme":[1],"loading":[4],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"direction":[513],"isMobile":[32],"floatLeft":[32],"floatTop":[32],"scrollToBottom":[64],"cyclePosition":[64]},[[0,"headerPositionClick","handleHeaderPositionClick"]],{"isOpen":[{"isOpenChanged":0}],"position":[{"positionChanged":0}]}]]],["ai-chat-message.cjs",[[769,"ai-chat-message",{"role":[1],"content":[1],"format":[1],"agentName":[1,"agent-name"],"timestamp":[1],"showActions":[4,"show-actions"],"enableRegenerate":[4,"enable-regenerate"],"feedbackValue":[1025,"feedback-value"],"copySuccess":[32]}]]],["ai-conversation-summary.cjs",[[769,"ai-conversation-summary",{"conversation":[1],"summary":[1],"messageCount":[2,"message-count"],"language":[1]}]]],["ai-in-chat-browser.cjs",[[513,"ai-in-chat-browser",{"url":[1],"pageTitle":[1,"page-title"],"isLoading":[32],"hasError":[32]},null,{"url":[{"onUrlChange":0}]}]]],["ai-link.cjs",[[769,"ai-link",{"label":[1],"href":[1],"target":[1],"rel":[1]}]]],["ai-loading.cjs",[[513,"ai-loading",{"mode":[1],"statusText":[1,"status-text"],"thinkingSubtext":[1,"thinking-subtext"],"steps":[16],"headerTitle":[1,"header-title"],"currentAgent":[1,"current-agent"],"showAgentBadges":[4,"show-agent-badges"],"expanded":[1028],"collapsible":[4],"_expanded":[32]}]]],["ai-route-decision.cjs",[[513,"ai-route-decision",{"selectedAgent":[1,"selected-agent"],"agentIcon":[1,"agent-icon"],"reason":[1],"confidence":[2],"detectedLanguage":[1,"detected-language"],"expanded":[1028],"_expanded":[32]}]]],["ai-suggestion.cjs",[[769,"ai-suggestion",{"label":[1],"disabled":[4]}]]],["ai-voice-input.cjs",[[513,"ai-voice-input",{"disabled":[4],"showWaveform":[4,"show-waveform"],"autoStart":[4,"auto-start"],"errorText":[1,"error-text"],"waveformColor":[1,"waveform-color"],"state":[32],"error":[32],"recordingDuration":[32],"submitPulse":[32]}]]],["ai-card.cjs",[[769,"ai-card",{"noPadding":[4,"no-padding"],"noShadow":[4,"no-shadow"]}]]],["ai-conversation-list.cjs",[[513,"ai-conversation-list",{"items":[16],"activeId":[1,"active-id"],"loading":[4],"emptyText":[1,"empty-text"],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"deletingId":[1,"deleting-id"]}]]],["ai-icon.cjs",[[513,"ai-icon",{"name":[1],"size":[2]}]]]], options);
|
|
9
9
|
};
|
|
10
10
|
|
|
11
11
|
exports.setNonce = index.setNonce;
|
|
@@ -18,7 +18,7 @@ var patchBrowser = () => {
|
|
|
18
18
|
|
|
19
19
|
patchBrowser().then(async (options) => {
|
|
20
20
|
await index.globalScripts();
|
|
21
|
-
return index.bootstrapLazy([["ai-message-input.cjs",[[513,"ai-message-input",{"placeholder":[1],"disabled":[4],"showVoiceButton":[4,"show-voice-button"],"maxLength":[2,"max-length"],"isRecording":[4,"is-recording"],"inputValue":[32],"showVoiceRecorder":[32],"isMultiline":[32],"setInputValue":[64]},null,{"isRecording":[{"onIsRecordingChange":0}]}]]],["ai-rating.cjs",[[513,"ai-rating",{"question":[1],"subtitle":[1],"successMessage":[1,"success-message"],"value":[1026],"disabled":[4],"hovered":[32],"submitted":[32]}]]],["ai-chat-header.cjs",[[513,"ai-chat-header",{"mode":[1],"conversation":[1],"agentName":[1,"agent-name"],"agentStatus":[1,"agent-status"],"agentAvatar":[1,"agent-avatar"],"showBack":[4,"show-back"],"statusIndicator":[1,"status-indicator"],"pageTitle":[1,"page-title"],"pageUrl":[1,"page-url"],"conversationItems":[16],"conversationActiveId":[1,"conversation-active-id"],"conversationLoading":[4,"conversation-loading"],"conversationError":[4,"conversation-error"],"conversationErrorText":[1,"conversation-error-text"],"conversationRetryLabel":[1,"conversation-retry-label"],"conversationEmptyText":[1,"conversation-empty-text"],"conversationDeletingId":[1,"conversation-deleting-id"],"titleLoading":[4,"title-loading"],"avatarError":[32],"dropdownOpen":[32],"isFloating":[32]},[[4,"click","handleDocumentClick"]]]]],["ai-agent-error.cjs",[[513,"ai-agent-error",{"headline":[1],"message":[1],"errorCode":[1,"error-code"],"retryable":[4],"retryLabel":[1,"retry-label"],"dismissible":[4]}]]],["ai-chat-container.cjs",[[769,"ai-chat-container",{"isOpen":[4,"is-open"],"position":[1537],"width":[1],"autoScroll":[4,"auto-scroll"],"showWatermark":[4,"show-watermark"],"floatHeight":[1,"float-height"],"theme":[1],"loading":[4],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"direction":[513],"isMobile":[32],"floatLeft":[32],"floatTop":[32],"scrollToBottom":[64],"cyclePosition":[64]},[[0,"headerPositionClick","handleHeaderPositionClick"]],{"isOpen":[{"isOpenChanged":0}],"position":[{"positionChanged":0}]}]]],["ai-chat-message.cjs",[[769,"ai-chat-message",{"role":[1],"content":[1],"format":[1],"agentName":[1,"agent-name"],"timestamp":[1],"showActions":[4,"show-actions"],"enableRegenerate":[4,"enable-regenerate"],"feedbackValue":[1025,"feedback-value"],"copySuccess":[32]}]]],["ai-conversation-summary.cjs",[[769,"ai-conversation-summary",{"conversation":[1],"summary":[1],"messageCount":[2,"message-count"],"language":[1]}]]],["ai-in-chat-browser.cjs",[[513,"ai-in-chat-browser",{"url":[1],"pageTitle":[1,"page-title"],"isLoading":[32],"hasError":[32]},null,{"url":[{"onUrlChange":0}]}]]],["ai-link.cjs",[[769,"ai-link",{"label":[1],"href":[1],"target":[1],"rel":[1]}]]],["ai-loading.cjs",[[513,"ai-loading",{"mode":[1],"statusText":[1,"status-text"],"thinkingSubtext":[1,"thinking-subtext"],"steps":[16],"headerTitle":[1,"header-title"],"currentAgent":[1,"current-agent"],"showAgentBadges":[4,"show-agent-badges"],"expanded":[1028],"collapsible":[4],"_expanded":[32]}]]],["ai-route-decision.cjs",[[513,"ai-route-decision",{"selectedAgent":[1,"selected-agent"],"agentIcon":[1,"agent-icon"],"reason":[1],"confidence":[2],"detectedLanguage":[1,"detected-language"],"expanded":[1028],"_expanded":[32]}]]],["ai-suggestion.cjs",[[769,"ai-suggestion",{"label":[1],"disabled":[4]}]]],["ai-voice-input.cjs",[[513,"ai-voice-input",{"disabled":[4],"showWaveform":[4,"show-waveform"],"autoStart":[4,"auto-start"],"errorText":[1,"error-text"],"waveformColor":[1,"waveform-color"],"state":[32],"error":[32],"recordingDuration":[32],"submitPulse":[32]}]]],["ai-card.cjs",[[769,"ai-card",{"noPadding":[4,"no-padding"],"noShadow":[4,"no-shadow"]}]]],["ai-conversation-list.cjs",[[513,"ai-conversation-list",{"items":[16],"activeId":[1,"active-id"],"loading":[4],"emptyText":[1,"empty-text"],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"deletingId":[1,"deleting-id"]}]]],["ai-icon.cjs",[[513,"ai-icon",{"name":[1],"size":[2]}]]]], options);
|
|
21
|
+
return index.bootstrapLazy([["ai-message-input.cjs",[[513,"ai-message-input",{"placeholder":[1],"disabled":[4],"showVoiceButton":[4,"show-voice-button"],"maxLength":[2,"max-length"],"isRecording":[4,"is-recording"],"inputValue":[32],"showVoiceRecorder":[32],"isMultiline":[32],"setInputValue":[64]},null,{"isRecording":[{"onIsRecordingChange":0}]}]]],["ai-rating.cjs",[[513,"ai-rating",{"question":[1],"subtitle":[1],"successMessage":[1,"success-message"],"value":[1026],"disabled":[4],"hovered":[32],"submitted":[32]}]]],["ai-chat-header.cjs",[[513,"ai-chat-header",{"mode":[1],"conversation":[1],"agentName":[1,"agent-name"],"agentStatus":[1,"agent-status"],"agentAvatar":[1,"agent-avatar"],"showBack":[4,"show-back"],"statusIndicator":[1,"status-indicator"],"pageTitle":[1,"page-title"],"pageUrl":[1,"page-url"],"conversationItems":[16],"conversationActiveId":[1,"conversation-active-id"],"conversationLoading":[4,"conversation-loading"],"conversationError":[4,"conversation-error"],"conversationErrorText":[1,"conversation-error-text"],"conversationRetryLabel":[1,"conversation-retry-label"],"conversationEmptyText":[1,"conversation-empty-text"],"conversationDeletingId":[1,"conversation-deleting-id"],"titleLoading":[4,"title-loading"],"disableNewChat":[4,"disable-new-chat"],"disableConversationList":[4,"disable-conversation-list"],"avatarError":[32],"dropdownOpen":[32],"isFloating":[32],"isMobile":[32]},[[4,"click","handleDocumentClick"]]]]],["ai-agent-error.cjs",[[513,"ai-agent-error",{"headline":[1],"message":[1],"errorCode":[1,"error-code"],"retryable":[4],"retryLabel":[1,"retry-label"],"dismissible":[4]}]]],["ai-chat-container.cjs",[[769,"ai-chat-container",{"isOpen":[4,"is-open"],"position":[1537],"width":[1],"autoScroll":[4,"auto-scroll"],"showWatermark":[4,"show-watermark"],"floatHeight":[1,"float-height"],"theme":[1],"loading":[4],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"direction":[513],"isMobile":[32],"floatLeft":[32],"floatTop":[32],"scrollToBottom":[64],"cyclePosition":[64]},[[0,"headerPositionClick","handleHeaderPositionClick"]],{"isOpen":[{"isOpenChanged":0}],"position":[{"positionChanged":0}]}]]],["ai-chat-message.cjs",[[769,"ai-chat-message",{"role":[1],"content":[1],"format":[1],"agentName":[1,"agent-name"],"timestamp":[1],"showActions":[4,"show-actions"],"enableRegenerate":[4,"enable-regenerate"],"feedbackValue":[1025,"feedback-value"],"copySuccess":[32]}]]],["ai-conversation-summary.cjs",[[769,"ai-conversation-summary",{"conversation":[1],"summary":[1],"messageCount":[2,"message-count"],"language":[1]}]]],["ai-in-chat-browser.cjs",[[513,"ai-in-chat-browser",{"url":[1],"pageTitle":[1,"page-title"],"isLoading":[32],"hasError":[32]},null,{"url":[{"onUrlChange":0}]}]]],["ai-link.cjs",[[769,"ai-link",{"label":[1],"href":[1],"target":[1],"rel":[1]}]]],["ai-loading.cjs",[[513,"ai-loading",{"mode":[1],"statusText":[1,"status-text"],"thinkingSubtext":[1,"thinking-subtext"],"steps":[16],"headerTitle":[1,"header-title"],"currentAgent":[1,"current-agent"],"showAgentBadges":[4,"show-agent-badges"],"expanded":[1028],"collapsible":[4],"_expanded":[32]}]]],["ai-route-decision.cjs",[[513,"ai-route-decision",{"selectedAgent":[1,"selected-agent"],"agentIcon":[1,"agent-icon"],"reason":[1],"confidence":[2],"detectedLanguage":[1,"detected-language"],"expanded":[1028],"_expanded":[32]}]]],["ai-suggestion.cjs",[[769,"ai-suggestion",{"label":[1],"disabled":[4]}]]],["ai-voice-input.cjs",[[513,"ai-voice-input",{"disabled":[4],"showWaveform":[4,"show-waveform"],"autoStart":[4,"auto-start"],"errorText":[1,"error-text"],"waveformColor":[1,"waveform-color"],"state":[32],"error":[32],"recordingDuration":[32],"submitPulse":[32]}]]],["ai-card.cjs",[[769,"ai-card",{"noPadding":[4,"no-padding"],"noShadow":[4,"no-shadow"]}]]],["ai-conversation-list.cjs",[[513,"ai-conversation-list",{"items":[16],"activeId":[1,"active-id"],"loading":[4],"emptyText":[1,"empty-text"],"error":[4],"errorText":[1,"error-text"],"retryLabel":[1,"retry-label"],"deletingId":[1,"deleting-id"]}]]],["ai-icon.cjs",[[513,"ai-icon",{"name":[1],"size":[2]}]]]], options);
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
exports.setNonce = index.setNonce;
|
|
@@ -41,6 +41,7 @@ export class ChatContainer {
|
|
|
41
41
|
dragState = null;
|
|
42
42
|
mutationObserver = null;
|
|
43
43
|
resizeObserver = null;
|
|
44
|
+
dirObserver = null;
|
|
44
45
|
// Named arrow so we can reliably add/remove it without leaking
|
|
45
46
|
dragListener = (e) => {
|
|
46
47
|
if (typeof window === 'undefined')
|
|
@@ -92,10 +93,21 @@ export class ChatContainer {
|
|
|
92
93
|
}
|
|
93
94
|
componentWillLoad() {
|
|
94
95
|
this.checkMobile();
|
|
96
|
+
// Auto-detect direction from the DOM if not explicitly set via prop
|
|
97
|
+
this.syncDirectionFromDom();
|
|
98
|
+
// Normalize default position to match direction
|
|
99
|
+
if (this.position === 'left' && this.direction === 'ltr') {
|
|
100
|
+
this.position = 'right';
|
|
101
|
+
}
|
|
95
102
|
}
|
|
96
103
|
componentDidLoad() {
|
|
97
104
|
if (typeof window === 'undefined')
|
|
98
105
|
return;
|
|
106
|
+
// Set default float position to the correct side based on direction
|
|
107
|
+
if (this.direction === 'ltr') {
|
|
108
|
+
const containerWidth = this.containerRef?.offsetWidth || this.parsePropToPx(this.width);
|
|
109
|
+
this.floatLeft = `${window.innerWidth - containerWidth - 24}px`;
|
|
110
|
+
}
|
|
99
111
|
// Use ResizeObserver for responsive mobile detection instead of window.resize
|
|
100
112
|
if (typeof ResizeObserver !== 'undefined') {
|
|
101
113
|
this.resizeObserver = new ResizeObserver(() => {
|
|
@@ -109,6 +121,17 @@ export class ChatContainer {
|
|
|
109
121
|
if (this.position === 'float') {
|
|
110
122
|
this.setupDrag();
|
|
111
123
|
}
|
|
124
|
+
// Watch document.documentElement for dir attribute changes (e.g. Storybook toolbar)
|
|
125
|
+
if (typeof MutationObserver !== 'undefined') {
|
|
126
|
+
this.dirObserver = new MutationObserver(() => {
|
|
127
|
+
const prev = this.direction;
|
|
128
|
+
this.syncDirectionFromDom();
|
|
129
|
+
if (this.direction !== prev) {
|
|
130
|
+
this.applyDirectionDefaults(prev);
|
|
131
|
+
}
|
|
132
|
+
});
|
|
133
|
+
this.dirObserver.observe(document.documentElement, { attributes: true, attributeFilter: ['dir'] });
|
|
134
|
+
}
|
|
112
135
|
this.mutationObserver = new MutationObserver(() => {
|
|
113
136
|
if (this.autoScroll && this.messagesAreaRef) {
|
|
114
137
|
requestAnimationFrame(() => {
|
|
@@ -130,6 +153,7 @@ export class ChatContainer {
|
|
|
130
153
|
if (newVal === 'float') {
|
|
131
154
|
this.setupDrag();
|
|
132
155
|
}
|
|
156
|
+
this.positionChange.emit(newVal);
|
|
133
157
|
}
|
|
134
158
|
disconnectedCallback() {
|
|
135
159
|
if (typeof window !== 'undefined') {
|
|
@@ -138,6 +162,7 @@ export class ChatContainer {
|
|
|
138
162
|
this.el.removeEventListener('headerDragStart', this.dragListener);
|
|
139
163
|
this.mutationObserver?.disconnect();
|
|
140
164
|
this.resizeObserver?.disconnect();
|
|
165
|
+
this.dirObserver?.disconnect();
|
|
141
166
|
}
|
|
142
167
|
/** Programmatically scroll the messages area to the bottom */
|
|
143
168
|
async scrollToBottom() {
|
|
@@ -153,12 +178,49 @@ export class ChatContainer {
|
|
|
153
178
|
async cyclePosition() {
|
|
154
179
|
const docked = this.direction === 'rtl' ? 'left' : 'right';
|
|
155
180
|
this.position = this.position === 'float' ? docked : 'float';
|
|
156
|
-
this.positionChange.emit(this.position);
|
|
157
181
|
}
|
|
158
182
|
handleWindowResize = () => {
|
|
159
183
|
this.checkMobile();
|
|
160
184
|
this.clampFloatPosition();
|
|
161
185
|
};
|
|
186
|
+
/** Read direction from the nearest [dir] ancestor or <html dir>. */
|
|
187
|
+
syncDirectionFromDom() {
|
|
188
|
+
if (typeof document === 'undefined')
|
|
189
|
+
return;
|
|
190
|
+
const closest = this.el.closest('[dir]');
|
|
191
|
+
const domDir = closest?.getAttribute('dir') ?? document.documentElement.getAttribute('dir') ?? document.documentElement.dir;
|
|
192
|
+
if (domDir === 'ltr' || domDir === 'rtl') {
|
|
193
|
+
this.direction = domDir;
|
|
194
|
+
}
|
|
195
|
+
}
|
|
196
|
+
/**
|
|
197
|
+
* After a direction change, normalize position and float offset.
|
|
198
|
+
* @param prevDir the direction before the change
|
|
199
|
+
*/
|
|
200
|
+
applyDirectionDefaults(prevDir) {
|
|
201
|
+
const oldDocked = prevDir === 'rtl' ? 'left' : 'right';
|
|
202
|
+
const newDocked = this.direction === 'rtl' ? 'left' : 'right';
|
|
203
|
+
// If was docked on the old side, flip to new docked side
|
|
204
|
+
if (this.position === oldDocked) {
|
|
205
|
+
this.position = newDocked;
|
|
206
|
+
}
|
|
207
|
+
// Reset float anchor to the correct default side
|
|
208
|
+
if (this.direction === 'ltr' && typeof window !== 'undefined') {
|
|
209
|
+
const w = this.containerRef?.offsetWidth || this.parsePropToPx(this.width);
|
|
210
|
+
this.floatLeft = `${window.innerWidth - w - 24}px`;
|
|
211
|
+
}
|
|
212
|
+
else {
|
|
213
|
+
this.floatLeft = '24px';
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
parsePropToPx(value) {
|
|
217
|
+
const num = parseFloat(value);
|
|
218
|
+
if (value.endsWith('rem'))
|
|
219
|
+
return num * 16;
|
|
220
|
+
if (value.endsWith('%') && typeof window !== 'undefined')
|
|
221
|
+
return (num / 100) * window.innerWidth;
|
|
222
|
+
return num;
|
|
223
|
+
}
|
|
162
224
|
checkMobile() {
|
|
163
225
|
if (typeof window !== 'undefined') {
|
|
164
226
|
this.isMobile = window.innerWidth < 768;
|
|
@@ -225,7 +287,7 @@ export class ChatContainer {
|
|
|
225
287
|
return (h("div", { class: "error-state", role: "alert" }, h("svg", { class: "error-icon", width: "48", height: "48", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { cx: "12", cy: "12", r: "10", stroke: "currentColor", "stroke-width": "1.5" }), h("path", { d: "M12 7v6", stroke: "currentColor", "stroke-width": "1.5", "stroke-linecap": "round" }), h("circle", { cx: "12", cy: "16.5", r: "0.75", fill: "currentColor" })), h("p", { class: "error-text" }, this.errorText), h("button", { class: "error-retry-btn", type: "button", onClick: () => this.retryClick.emit() }, this.retryLabel)));
|
|
226
288
|
}
|
|
227
289
|
render() {
|
|
228
|
-
return (h(Host, { key: '
|
|
290
|
+
return (h(Host, { key: '92739e10d04132efe3428b4568b84dbb743f2ced', class: { dark: this.isDark() } }, h("div", { key: '3846f4aa16275a9ee42d88600a39f9fdec4b9380', class: this.getContainerClasses(), style: this.getContainerStyle(), ref: el => (this.containerRef = el) }, this.showWatermark && !this.loading && !this.error && (h("div", { key: '674c8c8075b1bd7e02c6e6925fefddaffbf07da7', class: "watermark" }, h("svg", { key: '1dd03d917460057d5985c52760b8fcfec2ba185f', class: "watermark-circle-svg", width: "133", height: "133", viewBox: "0 0 133 133", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: '80e4ad2dc46b7196113e10e7604bec0df5434e81', filter: "url(#wm_circle_shadow)" }, h("circle", { key: '65ae6aa94aae8057c2d78a77799fbbe2ae7d4642', cx: "66.415", cy: "66.415", r: "66.415", class: "watermark-circle" })), h("defs", { key: 'd180bfb115a5bc946b5b65f17fa746bd3a2671b5' }, h("filter", { key: 'f0c88495d1fafe3ce77f0a41ebf20edeacd9f63f', id: "wm_circle_shadow", x: "0", y: "0", width: "132.83", height: "135.83", filterUnits: "userSpaceOnUse", "color-interpolation-filters": "sRGB" }, h("feFlood", { key: '673f789a1d59c36fa0a22a73de81b4d42589488e', "flood-opacity": "0", result: "BackgroundImageFix" }), h("feBlend", { key: '297e94e150f4ff65b740d10b1fefb8a2d86e6eba', mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), h("feColorMatrix", { key: '7481822fe991f1b39a8ef4b1d55f152ebe5a74dc', in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), h("feOffset", { key: 'b8587f0e9191d4d0d1a2109640dcc4d8510d1329', dy: "3" }), h("feGaussianBlur", { key: 'c103c56cdc19f38d8766f1f822261baa52c3c8f7', stdDeviation: "3" }), h("feComposite", { key: 'e648998eac51783c4d24c2605d7af0f75f9694d9', in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), h("feColorMatrix", { key: 'e51ea8682d8b47e2d1b3fa18f0e1c98f61cf9442', type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0" }), h("feBlend", { key: 'c8920059343daac0ab791217f0e35bf696d22c78', mode: "normal", in2: "shape", result: "effect1_innerShadow" })))), h("svg", { key: '3d305842745d57d75b2328f2118120881408d918', class: "watermark-star-svg", width: "78", height: "78", viewBox: "0 0 78 78", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { key: 'e04b6580b99cb9007d44089eb19c56e68d5a3500', filter: "url(#wm_star_shadow)" }, h("path", { key: '8ecd34ab83c4ce2c99b6197079d31dc7111aba81', d: "M38.7421 0C39.5691 0 40.2689 0.286272 40.8414 0.858815C41.414 1.43136 41.7002 2.13113 41.7002 2.95814C41.7002 8.87442 43.1952 14.3772 46.1851 19.4665C49.1115 24.4285 53.0557 28.3727 58.0177 31.299C63.107 34.289 68.6097 35.7839 74.526 35.7839C75.353 35.7839 76.0528 36.0702 76.6254 36.6428C77.1979 37.2153 77.4842 37.9151 77.4842 38.7421C77.4842 39.5691 77.1979 40.2689 76.6254 40.8414C76.0528 41.414 75.353 41.7002 74.526 41.7002C68.6097 41.7002 63.107 43.1952 58.0177 46.1851C53.0557 49.1115 49.1115 53.0557 46.1851 58.0177C43.1952 63.107 41.7002 68.6097 41.7002 74.526C41.7002 75.353 41.414 76.0528 40.8414 76.6254C40.2689 77.1979 39.5691 77.4842 38.7421 77.4842C37.9151 77.4842 37.2153 77.1979 36.6428 76.6254C36.0702 76.0528 35.7839 75.353 35.7839 74.526C35.7839 68.6097 34.289 63.107 31.299 58.0177C28.3727 53.0557 24.4285 49.1115 19.4665 46.1851C14.3772 43.1952 8.87442 41.7002 2.95814 41.7002C2.13113 41.7002 1.43136 41.414 0.858815 40.8414C0.286272 40.2689 0 39.5691 0 38.7421C0 37.9151 0.286272 37.2153 0.858815 36.6428C1.43136 36.0702 2.13113 35.7839 2.95814 35.7839C8.87442 35.7839 14.3772 34.289 19.4665 31.299C24.4285 28.3727 28.3727 24.4285 31.299 19.4665C34.289 14.3772 35.7839 8.87442 35.7839 2.95814C35.7839 2.13113 36.0702 1.43136 36.6428 0.858815C37.2153 0.286272 37.9151 0 38.7421 0Z", class: "watermark-star" })), h("defs", { key: '28c637d943109a521e6c64918a47bf917e6907db' }, h("filter", { key: '5cfaebbcffa9cfe42aa4bd194dd9c4117aaeed89', id: "wm_star_shadow", x: "0", y: "0", width: "77.4844", height: "79.4841", filterUnits: "userSpaceOnUse", "color-interpolation-filters": "sRGB" }, h("feFlood", { key: 'b6557267404cff0579970925d571978295044920', "flood-opacity": "0", result: "BackgroundImageFix" }), h("feBlend", { key: 'fb5825214d17c41ae4b31225ed58d698b35d0f94', mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), h("feColorMatrix", { key: 'afea4f8ea013f7a8fa7a508379c0a94e9b8dbf67', in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), h("feOffset", { key: '56471c8c7f7247bdc6f8c985a67eb21d1bf94fff', dy: "2" }), h("feGaussianBlur", { key: '2d8674ba7260cbf634046dbe6a3b3931d01d46e2', stdDeviation: "2" }), h("feComposite", { key: '98fe007a1fa727d95ae0c7c61658a0df1659e978', in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), h("feColorMatrix", { key: 'c4960302961214dae4091d028df699a7938ca2c6', type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0" }), h("feBlend", { key: '087483fdb9064cd948984348ce6b4a921a47e144', mode: "normal", in2: "shape", result: "effect1_innerShadow" })))))), h("slot", { key: '7aa772c82a168b2a7d9119738971c67bebd686c4', name: "header" }), h("div", { key: 'd5403fd1a67f1ac7ef86e86290005f539b1d1607', class: "messages-area", ref: el => (this.messagesAreaRef = el) }, this.loading ? this.renderSkeleton() : this.error ? this.renderError() : h("slot", null)), h("slot", { key: 'bcc75c332581807e6bf2c5a769cf6daeeaa97352', name: "footer" }))));
|
|
229
291
|
}
|
|
230
292
|
static get is() { return "ai-chat-container"; }
|
|
231
293
|
static get encapsulation() { return "shadow"; }
|