@salla.sa/ui-ai-kit-core 2.2.2 → 2.2.4
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-card.cjs.entry.js +2 -2
- package/dist/cjs/ai-chat-header.cjs.entry.js +1 -1
- package/dist/cjs/ai-chat-message.cjs.entry.js +2 -2
- package/dist/cjs/ai-conversation-summary.cjs.entry.js +1 -1
- package/dist/cjs/ai-in-chat-browser.cjs.entry.js +1 -1
- package/dist/cjs/ai-link.cjs.entry.js +1 -1
- package/dist/cjs/ai-rating.cjs.entry.js +4 -4
- package/dist/cjs/ai-route-decision.cjs.entry.js +1 -1
- package/dist/cjs/ai-suggestion.cjs.entry.js +2 -2
- package/dist/cjs/ai-voice-input.cjs.entry.js +1 -1
- package/dist/collection/components/ai-card/ai-card.css +22 -0
- package/dist/collection/components/ai-card/ai-card.js +1 -1
- package/dist/collection/components/ai-chat-header/ai-chat-header.js +1 -1
- package/dist/collection/components/ai-chat-message/ai-chat-message.css +0 -10
- package/dist/collection/components/ai-chat-message/ai-chat-message.js +1 -1
- package/dist/collection/components/ai-conversation-summary/ai-conversation-summary.js +1 -1
- package/dist/collection/components/ai-in-chat-browser/ai-in-chat-browser.js +1 -1
- package/dist/collection/components/ai-link/ai-link.js +1 -1
- package/dist/collection/components/ai-rating/ai-rating.css +9 -1
- package/dist/collection/components/ai-rating/ai-rating.js +3 -3
- package/dist/collection/components/ai-route-decision/ai-route-decision.js +1 -1
- package/dist/collection/components/ai-suggestion/ai-suggestion.js +2 -2
- package/dist/collection/components/ai-voice-input/ai-voice-input.js +1 -1
- package/dist/components/ai-card.js +1 -1
- package/dist/components/ai-chat-header.js +1 -1
- package/dist/components/ai-chat-message.js +1 -1
- package/dist/components/ai-conversation-summary.js +1 -1
- package/dist/components/ai-in-chat-browser.js +1 -1
- package/dist/components/ai-link.js +1 -1
- package/dist/components/ai-message-input.js +1 -1
- package/dist/components/ai-rating.js +1 -1
- package/dist/components/ai-route-decision.js +1 -1
- package/dist/components/ai-suggestion.js +1 -1
- package/dist/components/ai-voice-input.js +1 -1
- package/dist/components/{p-bGFmyIp1.js → p-BlCeQ9Hu.js} +1 -1
- package/dist/components/p-DCJWSYj-.js +1 -0
- package/dist/esm/ai-card.entry.js +2 -2
- package/dist/esm/ai-chat-header.entry.js +1 -1
- package/dist/esm/ai-chat-message.entry.js +2 -2
- package/dist/esm/ai-conversation-summary.entry.js +1 -1
- package/dist/esm/ai-in-chat-browser.entry.js +1 -1
- package/dist/esm/ai-link.entry.js +1 -1
- package/dist/esm/ai-rating.entry.js +4 -4
- package/dist/esm/ai-route-decision.entry.js +1 -1
- package/dist/esm/ai-suggestion.entry.js +2 -2
- package/dist/esm/ai-voice-input.entry.js +1 -1
- package/dist/ui-ai-kit/{p-5f005ec5.entry.js → p-11c960d8.entry.js} +1 -1
- package/dist/ui-ai-kit/{p-278895fd.entry.js → p-2fd7529e.entry.js} +1 -1
- package/dist/ui-ai-kit/{p-d02f2db5.entry.js → p-79309690.entry.js} +1 -1
- package/dist/ui-ai-kit/{p-83f46030.entry.js → p-8b1d056d.entry.js} +1 -1
- package/dist/ui-ai-kit/{p-6bd54e29.entry.js → p-9a8614d0.entry.js} +1 -1
- package/dist/ui-ai-kit/{p-062cad02.entry.js → p-9af03dbd.entry.js} +1 -1
- package/dist/ui-ai-kit/{p-187db371.entry.js → p-a5f53c8c.entry.js} +1 -1
- package/dist/ui-ai-kit/p-cde479ea.entry.js +1 -0
- package/dist/ui-ai-kit/{p-e6236df2.entry.js → p-e1a2a622.entry.js} +1 -1
- package/dist/ui-ai-kit/p-efb68380.entry.js +1 -0
- package/dist/ui-ai-kit/ui-ai-kit.esm.js +1 -1
- package/package.json +1 -1
- package/dist/components/p-Ba0urr6Q.js +0 -1
- package/dist/ui-ai-kit/p-338d55d3.entry.js +0 -1
- package/dist/ui-ai-kit/p-8fabdbe8.entry.js +0 -1
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var index = require('./index-Cc05u4ND.js');
|
|
4
4
|
|
|
5
|
-
const aiCardCss = () => `:host{--ai-card-border:1px solid var(--ai-border-default);--ai-card-radius:16px;--ai-card-padding:16px;--ai-card-gap:12px;--ai-card-shadow:var(--ai-shadow-sm);display:block}.card{background:var(--ai-bg-card);border:var(--ai-card-border);border-radius:var(--ai-card-radius);padding:var(--ai-card-padding);box-shadow:var(--ai-card-shadow);box-sizing:border-box;overflow:hidden;color:var(--ai-text-primary);width:100%;display:flex;flex-direction:column;gap:var(--ai-card-gap);text-align:start;font-size:14px;line-height:20px}.card--no-padding{padding:0}.card--no-shadow{box-shadow:none}`;
|
|
5
|
+
const aiCardCss = () => `:host{--ai-card-border:1px solid var(--ai-border-default);--ai-card-radius:16px;--ai-card-padding:16px;--ai-card-gap:12px;--ai-card-shadow:var(--ai-shadow-sm);--ai-card-header-padding:16px;--ai-card-footer-padding:16px;display:block}.card{background:var(--ai-bg-card);border:var(--ai-card-border);border-radius:var(--ai-card-radius);padding:var(--ai-card-padding);box-shadow:var(--ai-card-shadow);box-sizing:border-box;overflow:hidden;color:var(--ai-text-primary);width:100%;display:flex;flex-direction:column;gap:var(--ai-card-gap);text-align:start;font-size:14px;line-height:20px}.card--no-padding{padding:0}.card--no-shadow{box-shadow:none}::slotted([slot="header"]){padding:var(--ai-card-header-padding);margin:calc(var(--ai-card-padding) * -1) calc(var(--ai-card-padding) * -1) 0}::slotted([slot="footer"]){padding:var(--ai-card-footer-padding);margin:0 calc(var(--ai-card-padding) * -1) calc(var(--ai-card-padding) * -1)}.card--no-padding ::slotted([slot="header"]){margin:0}.card--no-padding ::slotted([slot="footer"]){margin:0}`;
|
|
6
6
|
|
|
7
7
|
const AiCard = class {
|
|
8
8
|
constructor(hostRef) {
|
|
@@ -17,7 +17,7 @@ const AiCard = class {
|
|
|
17
17
|
card: true,
|
|
18
18
|
'card--no-padding': this.noPadding,
|
|
19
19
|
'card--no-shadow': this.noShadow,
|
|
20
|
-
} }, index.h("slot", { key: '
|
|
20
|
+
} }, index.h("slot", { key: '149e85041e3318ea8e5dfa7ddf67e6236e49e6e8', name: "header" }), index.h("slot", { key: '774d0408e091a0603e5feac3bc5927cf698b5c8c' }), index.h("slot", { key: 'be0157314b280caa5c9b4f038ca6ca4aec2f8c8f', name: "footer" }))));
|
|
21
21
|
}
|
|
22
22
|
};
|
|
23
23
|
AiCard.style = aiCardCss();
|
|
@@ -199,7 +199,7 @@ const AiChatHeader = class {
|
|
|
199
199
|
];
|
|
200
200
|
}
|
|
201
201
|
render() {
|
|
202
|
-
return (index.h(index.Host, { key: '
|
|
202
|
+
return (index.h(index.Host, { key: '80236bfcbfac98d3efa3955f03aab4ef68c9cfea' }, index.h("div", { key: 'dcc4142bba1d5f07782dbc7b0a3ec287e0154223', class: "header-wrapper" }, index.h("div", { key: 'ca0ff9a2946cead0b86cb82390624894ed414378', class: "header-container" }, this.mode === 'agent' ? this.renderAgentMode() : this.mode === 'human' ? this.renderHumanMode() : this.renderBrowserMode()), this.renderConversationDropdown())));
|
|
203
203
|
}
|
|
204
204
|
};
|
|
205
205
|
AiChatHeader.style = aiChatHeaderCss();
|
|
@@ -1389,7 +1389,7 @@ function createDOMPurify() {
|
|
|
1389
1389
|
}
|
|
1390
1390
|
var purify = createDOMPurify();
|
|
1391
1391
|
|
|
1392
|
-
const aiChatMessageCss = () => `:host{--ai-msg-user-bg:var(--ai-user-bubble-bg);--ai-msg-user-border:1px solid var(--ai-border-default);--ai-msg-agent-bg:var(--ai-agent-bubble-bg);--ai-msg-agent-border:1px solid var(--ai-border-default);--ai-msg-border-radius:16px;--ai-msg-padding:16px;--ai-msg-font-size:14px;--ai-msg-action-active-bg:var(--ai-accent);--ai-user-msg-max-width:80%;--ai-agent-msg-max-width:80%;display:block}.message-row{display:flex}.user-row{flex-direction:column;align-items:flex-end}.user-bubble{background:var(--ai-msg-user-bg);color:var(--ai-text-primary);border:var(--ai-msg-user-border);border-radius:var(--ai-msg-border-radius);padding:var(--ai-msg-padding);font-size:var(--ai-msg-font-size);max-width:var(--ai-user-msg-max-width);line-height:1.5;word-break:break-word;box-shadow:var(--ai-shadow-sm)}.user-row .timestamp{font-size:12px;color:var(--ai-text-secondary);margin-top:4px}.agent-row{flex-direction:row;justify-content:flex-start}.agent-bubble-wrapper{display:flex;flex-direction:column;gap:6px;width:100%;max-width:var(--ai-msg-agent-max-width);min-width:0}.agent-bubble{background:var(--ai-msg-agent-bg);color:var(--ai-text-primary);border:var(--ai-msg-agent-border);border-radius:var(--ai-msg-border-radius);padding:var(--ai-msg-padding);font-size:var(--ai-msg-font-size);line-height:1.6;word-break:break-word;box-shadow:var(--ai-shadow-sm);display:flex;flex-direction:column;gap:12px}.message-content{white-space:pre-wrap}.message-content p{margin:0 0 8px 0}.message-content p:last-child{margin-bottom:0}.message-content h2{font-size:16px;font-weight:700;margin:0 0 8px 0}.message-content h3{font-size:15px;font-weight:600;margin:0 0 6px 0}.message-content strong{font-weight:700}.message-content em{font-style:italic}.message-content code{background:var(--ai-bg-surface);border-radius:4px;padding:1px 5px;font-family:var(--ai-font-family-mono);font-size:13px;color:var(--ai-text-primary)}.message-content pre{background:var(--ai-bg-surface);border-radius:8px;padding:10px 12px;overflow-x:auto;margin:8px 0}.message-content pre code{background:none;padding:0;font-size:13px}.message-content ul,.message-content ol{padding-inline-start:20px;margin:4px 0 8px 0}.message-content li{margin-bottom:3px}.actions-bar{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;height:
|
|
1392
|
+
const aiChatMessageCss = () => `:host{--ai-msg-user-bg:var(--ai-user-bubble-bg);--ai-msg-user-border:1px solid var(--ai-border-default);--ai-msg-agent-bg:var(--ai-agent-bubble-bg);--ai-msg-agent-border:1px solid var(--ai-border-default);--ai-msg-border-radius:16px;--ai-msg-padding:16px;--ai-msg-font-size:14px;--ai-msg-action-active-bg:var(--ai-accent);--ai-user-msg-max-width:80%;--ai-agent-msg-max-width:80%;display:block}.message-row{display:flex}.user-row{flex-direction:column;align-items:flex-end}.user-bubble{background:var(--ai-msg-user-bg);color:var(--ai-text-primary);border:var(--ai-msg-user-border);border-radius:var(--ai-msg-border-radius);padding:var(--ai-msg-padding);font-size:var(--ai-msg-font-size);max-width:var(--ai-user-msg-max-width);line-height:1.5;word-break:break-word;box-shadow:var(--ai-shadow-sm)}.user-row .timestamp{font-size:12px;color:var(--ai-text-secondary);margin-top:4px}.agent-row{flex-direction:row;justify-content:flex-start}.agent-bubble-wrapper{display:flex;flex-direction:column;gap:6px;width:100%;max-width:var(--ai-msg-agent-max-width);min-width:0}.agent-bubble{background:var(--ai-msg-agent-bg);color:var(--ai-text-primary);border:var(--ai-msg-agent-border);border-radius:var(--ai-msg-border-radius);padding:var(--ai-msg-padding);font-size:var(--ai-msg-font-size);line-height:1.6;word-break:break-word;box-shadow:var(--ai-shadow-sm);display:flex;flex-direction:column;gap:12px}.message-content{white-space:pre-wrap}.message-content p{margin:0 0 8px 0}.message-content p:last-child{margin-bottom:0}.message-content h2{font-size:16px;font-weight:700;margin:0 0 8px 0}.message-content h3{font-size:15px;font-weight:600;margin:0 0 6px 0}.message-content strong{font-weight:700}.message-content em{font-style:italic}.message-content code{background:var(--ai-bg-surface);border-radius:4px;padding:1px 5px;font-family:var(--ai-font-family-mono);font-size:13px;color:var(--ai-text-primary)}.message-content pre{background:var(--ai-bg-surface);border-radius:8px;padding:10px 12px;overflow-x:auto;margin:8px 0}.message-content pre code{background:none;padding:0;font-size:13px}.message-content ul,.message-content ol{padding-inline-start:20px;margin:4px 0 8px 0}.message-content li{margin-bottom:3px}.actions-bar{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;height:32px}.action-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;background:var(--ai-bg-card);border:1px solid var(--ai-border-default);cursor:pointer;color:var(--ai-text-primary);transition:background 0.15s, color 0.15s;padding:0;flex-shrink:0}.action-btn:hover{background:var(--ai-bg-surface)}.action-btn.copy-success{background:var(--ai-msg-action-active-bg);color:var(--ai-accent-text);border-color:var(--ai-accent)}.feedback-group{display:flex;align-items:center;border:1px solid var(--ai-border-default);border-radius:8px;overflow:hidden;background:var(--ai-bg-card)}.feedback-btn{display:flex;align-items:center;justify-content:center;height:32px;padding:0 8px;background:var(--ai-bg-card);border:none;border-inline-start:1px solid var(--ai-border-default);cursor:pointer;color:var(--ai-text-primary);transition:background 0.15s, color 0.15s}.feedback-btn:first-child{border-inline-start:none}.feedback-btn:hover{background:var(--ai-bg-surface)}.feedback-btn.active{background:var(--ai-msg-action-active-bg);color:var(--ai-accent-text)}.icon-wrap{display:flex;align-items:center;justify-content:center;line-height:0}.agent-info{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;color:var(--ai-text-muted)}.agent-info-name,.agent-info-time{font-size:12px;color:inherit;line-height:16px;white-space:nowrap}.agent-info .icon-wrap{display:flex;align-items:center;color:inherit;opacity:0.6;flex-shrink:0}.typing-indicator{display:flex;align-items:center;gap:5px;padding:4px 2px}.typing-dot{width:8px;height:8px;border-radius:50%;background:var(--ai-text-muted);animation:typingBounce 1.2s ease-in-out infinite}.typing-dot:nth-child(2){animation-delay:0.2s}.typing-dot:nth-child(3){animation-delay:0.4s}@keyframes typingBounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-6px)}}.streaming-cursor{display:inline-block;width:2px;height:1em;background:currentColor;vertical-align:text-bottom;margin-inline-start:2px;animation:cursorBlink 0.8s step-start infinite}@keyframes cursorBlink{0%,100%{opacity:1}50%{opacity:0}}`;
|
|
1393
1393
|
|
|
1394
1394
|
const SANITIZE_CONFIG = {
|
|
1395
1395
|
ALLOWED_TAGS: ['p', 'br', 'strong', 'em', 'del', 'code', 'pre', 'ul', 'ol', 'li', 'h2', 'h3', 'a', 'blockquote', 'table', 'thead', 'tbody', 'tr', 'th', 'td'],
|
|
@@ -1597,7 +1597,7 @@ const AiChatMessage = class {
|
|
|
1597
1597
|
} })), index.h("slot", null), showActions && this.renderActionsBar()), (this.agentName || this.timestamp) && (index.h("div", { class: "agent-info" }, this.agentName && index.h("span", { class: "agent-info-name" }, this.agentName), this.agentName && this.timestamp && this.renderIcon('eclipse', 10), this.timestamp && index.h("span", { class: "agent-info-time" }, this.getRelativeTime()))))));
|
|
1598
1598
|
}
|
|
1599
1599
|
render() {
|
|
1600
|
-
return index.h(index.Host, { key: '
|
|
1600
|
+
return index.h(index.Host, { key: 'f8a49971896742ae952d84efb1527ed0db440876' }, this.role === 'user' ? this.renderUserMessage() : this.renderAgentMessage());
|
|
1601
1601
|
}
|
|
1602
1602
|
};
|
|
1603
1603
|
AiChatMessage.style = aiChatMessageCss();
|
|
@@ -25,7 +25,7 @@ const AiConversationSummary = class {
|
|
|
25
25
|
return index.h("span", { class: "icon-wrap", innerHTML: svg });
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
28
|
-
return (index.h(index.Host, { key: '
|
|
28
|
+
return (index.h(index.Host, { key: 'f69a767b9111f035799fbad9e26f6cd278d2cd5e' }, index.h("div", { key: '2b598f0ebcf118c75d58a92173d31250b7b71aaa', class: "summary-card" }, index.h("div", { key: 'fba36d83ef95feaaff7a88847c2ad8eed7b2a009', class: "summary-header" }, index.h("div", { key: 'f2840d65175456326a9f2c2d389b788f4dfc6622', class: "sparkle-avatar" }, this.renderIcon('sparkle', 14, 14)), index.h("span", { key: 'e90eca9ddf0b1b610a05d3a68fba69853c3c87e5', class: "summary-title" }, this.conversation), index.h("div", { key: 'ab9dd453aab0b04b00493dac0a7b5ad74b194190', class: "summary-badges" }, this.messageCount > 0 && (index.h("span", { key: 'e5664fb004a19d72334f157121125a01ff09f56a', class: "badge" }, this.renderIcon('list', 12, 12), this.messageCount)), this.language && (index.h("span", { key: 'af0784ee45ed3169514d198dc1236e781fe48ac6', class: "badge lang-badge" }, this.language)))), this.summary && (index.h("p", { key: 'c0c2be2118abbe62a31adc65e6fa8907f155bb49', class: "summary-body", ref: el => el && (el.textContent = this.summary) })), index.h("div", { key: '61c139e33e9e247508e830e319fc9cc014451526', class: "summary-slot" }, index.h("slot", { key: '5ebbbdb3319c6a8ca9f8e98a58c6336e7a25c159' })))));
|
|
29
29
|
}
|
|
30
30
|
};
|
|
31
31
|
AiConversationSummary.style = aiConversationSummaryCss();
|
|
@@ -37,7 +37,7 @@ const AiInChatBrowser = class {
|
|
|
37
37
|
};
|
|
38
38
|
render() {
|
|
39
39
|
const displayTitle = this.getDisplayTitle();
|
|
40
|
-
return (index.h(index.Host, { key: '
|
|
40
|
+
return (index.h(index.Host, { key: 'd79ede7857bc7edc13a4c8cdbbf5b4f7312d9766' }, index.h("div", { key: '57ccda6f9670e9ae2ca76b768f31ecf62b9ec8e9', class: "browser-content" }, this.isLoading && (index.h("div", { key: 'f868050d91fc24f9a13a760d34805b6a443ff865', class: "browser-loading" }, index.h("div", { key: 'b90a07a822a1978875fd5590783d9e9a6ac319b9', class: "loading-bar" }))), this.hasError ? (index.h("div", { class: "browser-error" }, index.h("span", { class: "error-text" }, "\u062A\u0639\u0630\u0651\u0631 \u062A\u062D\u0645\u064A\u0644 \u0627\u0644\u0635\u0641\u062D\u0629"), index.h("span", { class: "error-url" }, this.url))) : (this.url && (index.h("iframe", { class: "browser-iframe", src: this.url, onLoad: this.handleIframeLoad, onError: this.handleIframeError, sandbox: "allow-scripts allow-same-origin allow-forms allow-popups", referrerPolicy: "no-referrer", title: displayTitle }))))));
|
|
41
41
|
}
|
|
42
42
|
static get watchers() { return {
|
|
43
43
|
"url": [{
|
|
@@ -26,7 +26,7 @@ const AiLink = class {
|
|
|
26
26
|
}
|
|
27
27
|
render() {
|
|
28
28
|
const rel = this.rel || (this.target === '_blank' ? 'noopener noreferrer' : undefined);
|
|
29
|
-
return (index.h(index.Host, { key: '
|
|
29
|
+
return (index.h(index.Host, { key: 'e0e34a4c2a3534a3b449bac613c6f7cb512420d3' }, index.h("span", { key: '5776ddc64676ecaabb4f36a0e9833026dc730c23', class: "link__label" }, this.label, index.h("slot", { key: '436a334a51bea342b839d5fad9743aaf6b66a94d' })), index.h("a", { key: '3880c1429a8a24a9dee700c9f0592ac673ce68f0', class: "link", href: this.href, target: this.target, rel: rel }, this.renderShareIcon())));
|
|
30
30
|
}
|
|
31
31
|
};
|
|
32
32
|
AiLink.style = aiLinkCss();
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var index = require('./index-Cc05u4ND.js');
|
|
4
4
|
var iconRegistry = require('./icon-registry-D-m8GW4D.js');
|
|
5
5
|
|
|
6
|
-
const aiRatingCss = () => `:host{--ai-rating-question-size:16px;--ai-rating-subtitle-size:14px;--ai-rating-gap:8px;--ai-rating-emoji-size:24px;--ai-rating-btn-padding:6px;--ai-rating-btn-border:1px solid var(--ai-border-light);--ai-rating-btn-radius:9999px;--ai-rating-btn-bg-hover:var(--ai-bg-surface);--ai-rating-btn-border-hover:1px solid var(--ai-border-default);--ai-rating-btn-bg-active:var(--ai-warning-bg);--ai-rating-btn-border-active:1px solid var(--ai-warning-border);--ai-rating-btn-shadow-active:var(--ai-shadow-active);--ai-rating-label-size:16px;display:block}.rating{display:flex;flex-direction:column;align-items:center;gap:var(--ai-rating-gap);width:100%}.rating__text{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;text-align:center}.rating__question{margin:0;font-size:var(--ai-rating-question-size);font-weight:500;line-height:24px;color:var(--ai-text-primary)}.rating__subtitle{margin:0;font-size:var(--ai-rating-subtitle-size);font-weight:400;line-height:20px;color:var(--ai-text-secondary)}.rating__icons{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;flex-wrap:wrap}.emoji-btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--ai-rating-btn-padding);border:var(--ai-rating-btn-border);border-radius:var(--ai-rating-btn-radius);background:transparent;cursor:pointer;transition:background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;outline:none}.emoji-btn:focus-visible{outline:2px solid var(--ai-warning-border);outline-offset:2px}.emoji-btn:hover:not(:disabled),.emoji-btn--hovered{background:var(--ai-rating-btn-bg-hover);border:var(--ai-rating-btn-border-hover);transform:scale(1.1)}.emoji-btn--active{background:var(--ai-rating-btn-bg-active) !important;border:var(--ai-rating-btn-border-active) !important;box-shadow:var(--ai-rating-btn-shadow-active);transform:scale(1.18) !important}.emoji-btn--disabled{opacity:0.45;cursor:not-allowed;pointer-events:none}.emoji-btn__icon{font-size:var(--ai-rating-emoji-size);line-height:1;display:inline-flex;align-items:center;justify-content:center;width:var(--ai-rating-emoji-size);height:var(--ai-rating-emoji-size);pointer-events:none}.rating__hover-label{margin:0;font-size:var(--ai-rating-label-size);font-weight:500;line-height:24px;color:var(--ai-text-primary);text-align:center;width:100%;
|
|
6
|
+
const aiRatingCss = () => `:host{--ai-rating-question-size:16px;--ai-rating-subtitle-size:14px;--ai-rating-gap:8px;--ai-rating-emoji-size:24px;--ai-rating-btn-padding:6px;--ai-rating-btn-border:1px solid var(--ai-border-light);--ai-rating-btn-radius:9999px;--ai-rating-btn-bg-hover:var(--ai-bg-surface);--ai-rating-btn-border-hover:1px solid var(--ai-border-default);--ai-rating-btn-bg-active:var(--ai-warning-bg);--ai-rating-btn-border-active:1px solid var(--ai-warning-border);--ai-rating-btn-shadow-active:var(--ai-shadow-active);--ai-rating-label-size:16px;display:block}.rating{display:flex;flex-direction:column;align-items:center;gap:var(--ai-rating-gap);width:100%}.rating__text{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;text-align:center}.rating__question{margin:0;font-size:var(--ai-rating-question-size);font-weight:500;line-height:24px;color:var(--ai-text-primary)}.rating__subtitle{margin:0;font-size:var(--ai-rating-subtitle-size);font-weight:400;line-height:20px;color:var(--ai-text-secondary)}.rating__icons{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;flex-wrap:wrap}.emoji-btn{display:inline-flex;align-items:center;justify-content:center;padding:var(--ai-rating-btn-padding);border:var(--ai-rating-btn-border);border-radius:var(--ai-rating-btn-radius);background:transparent;cursor:pointer;transition:background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;outline:none}.emoji-btn:focus-visible{outline:2px solid var(--ai-warning-border);outline-offset:2px}.emoji-btn:hover:not(:disabled),.emoji-btn--hovered{background:var(--ai-rating-btn-bg-hover);border:var(--ai-rating-btn-border-hover);transform:scale(1.1)}.emoji-btn--active{background:var(--ai-rating-btn-bg-active) !important;border:var(--ai-rating-btn-border-active) !important;box-shadow:var(--ai-rating-btn-shadow-active);transform:scale(1.18) !important}.emoji-btn--disabled{opacity:0.45;cursor:not-allowed;pointer-events:none}.emoji-btn__icon{font-size:var(--ai-rating-emoji-size);line-height:1;display:inline-flex;align-items:center;justify-content:center;width:var(--ai-rating-emoji-size);height:var(--ai-rating-emoji-size);pointer-events:none}.rating__hover-label{margin:0;font-size:var(--ai-rating-label-size);font-weight:500;line-height:24px;color:var(--ai-text-primary);text-align:center;width:100%;min-height:24px;opacity:0;visibility:hidden;transition:opacity 0.15s ease, visibility 0.15s ease}.rating__hover-label--visible{opacity:1;visibility:visible}.rating--success{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px 0;animation:fadeIn 0.2s ease}.rating__success-message{margin:0;font-size:var(--ai-rating-question-size);font-weight:500;line-height:24px;color:var(--ai-text-primary);text-align:center}@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}`;
|
|
7
7
|
|
|
8
8
|
const EMOJI_OPTIONS = [
|
|
9
9
|
{ value: 1, icon: 'emoji-angry', label: 'سيئ جداً' },
|
|
@@ -47,7 +47,7 @@ const AiRating = class {
|
|
|
47
47
|
if (this.submitted) {
|
|
48
48
|
return (index.h(index.Host, null, index.h("ai-card", null, index.h("div", { class: "rating rating--success" }, index.h("ai-icon", { name: "check-circle", size: 32 }), index.h("p", { class: "rating__success-message" }, this.successMessage)))));
|
|
49
49
|
}
|
|
50
|
-
return (index.h(index.Host, null, index.h("ai-card", null, index.h("div", { class: "rating" }, index.h("div", { class: "rating__text" }, index.h("p", { class: "rating__question" }, this.question), index.h("p", { class: "rating__subtitle" }, this.subtitle)), index.h("div", { class: "rating__icons", role: "group", "aria-label": this.question }, EMOJI_OPTIONS.map(opt => {
|
|
50
|
+
return (index.h(index.Host, null, index.h("ai-card", null, index.h("div", { class: "rating" }, index.h("div", { class: "rating__text" }, index.h("p", { class: "rating__question" }, this.question), index.h("p", { class: "rating__subtitle" }, this.subtitle)), index.h("div", { class: "rating__icons", role: "group", "aria-label": this.question, onMouseLeave: () => (this.hovered = null) }, EMOJI_OPTIONS.map(opt => {
|
|
51
51
|
const isActive = this.value === opt.value;
|
|
52
52
|
const isHovered = this.hovered === opt.value;
|
|
53
53
|
const icon = iconRegistry.iconRegistry[opt.icon];
|
|
@@ -56,8 +56,8 @@ const AiRating = class {
|
|
|
56
56
|
'emoji-btn--active': isActive,
|
|
57
57
|
'emoji-btn--hovered': isHovered && !isActive,
|
|
58
58
|
'emoji-btn--disabled': this.disabled,
|
|
59
|
-
}, "aria-label": opt.label, "aria-pressed": isActive ? 'true' : 'false', disabled: this.disabled, onClick: () => this.select(opt.value), onMouseEnter: () => (this.hovered = opt.value)
|
|
60
|
-
})),
|
|
59
|
+
}, "aria-label": opt.label, "aria-pressed": isActive ? 'true' : 'false', disabled: this.disabled, onClick: () => this.select(opt.value), onMouseEnter: () => (this.hovered = opt.value) }, index.h("span", { class: "emoji-btn__icon", "aria-hidden": "true" }, index.h("svg", { width: 24, height: 24, viewBox: icon.viewBox, xmlns: "http://www.w3.org/2000/svg", ref: (el) => el && (el.innerHTML = icon.content) }))));
|
|
60
|
+
})), index.h("p", { class: { 'rating__hover-label': true, 'rating__hover-label--visible': label !== null } }, label ?? '\u00A0')))));
|
|
61
61
|
}
|
|
62
62
|
};
|
|
63
63
|
AiRating.style = aiRatingCss();
|
|
@@ -40,7 +40,7 @@ const AiRouteDecision = class {
|
|
|
40
40
|
this.routeExpand.emit(this._expanded);
|
|
41
41
|
}
|
|
42
42
|
render() {
|
|
43
|
-
return (index.h(index.Host, { key: '
|
|
43
|
+
return (index.h(index.Host, { key: 'f12718d142cff27d62c0a0299b029be2e2d88b86' }, index.h("div", { key: '4fcef90f887300c4884cd981737bf8ce8b796eca', class: `route-pill ${this._expanded ? 'expanded' : ''}` }, index.h("button", { key: '09eadc07b41b96fb56b4bcd937165de92507ac84', class: "route-pill-main", onClick: () => this.handleToggle() }, index.h("span", { key: 'd13744692a45c74976f89b582142ae09339015f5', class: "route-icon" }, this.renderIcon('route', 14, 14)), index.h("span", { key: '4f995cc09a72ba74310df17cf78735c27a910314', class: "agent-label" }, this.agentIcon && index.h("span", { key: '272dd78f38bbbb4ef845b7a41530d205368faf7e', class: "agent-emoji", "aria-hidden": "true" }, this.agentIcon), this.selectedAgent), this.confidence > 0 && (index.h("span", { key: 'a061317c9d5b8dad243dce0bb80e927eae04eb3d', class: "confidence-badge" }, this.confidence, "%")), index.h("span", { key: '4342bdf38aa85a5c5d6bd054504c91bccc7901e9', class: `expand-icon ${this._expanded ? 'expanded' : ''}` }, this.renderIcon('arrow-right', 12, 12))), this._expanded && (index.h("div", { key: 'ab5340148e832baafdd38e17a748a52b83b25c96', class: "route-details" }, this.reason && index.h("p", { key: '7854838ea405c5fdb5ebe11fb3df36a9898be445', class: "reason-text" }, this.reason), this.confidence > 0 && (index.h("div", { key: 'baf946426ad7cda94d2acfbb9f8945b5b40a823c', class: "confidence-bar-wrap" }, index.h("div", { key: 'a6e08f412706ce18e16030dd4d475d57befdd9e7', class: "confidence-bar", style: { width: `${this.confidence}%` } }))), this.detectedLanguage && (index.h("div", { key: '58af2dbca56082dcf2910cc44ac553d6f2af015a', class: "meta-row" }, this.renderIcon('list', 12, 12), index.h("span", { key: '63517ed8802764542de330897372c6a01348d0a6', class: "lang-chip" }, this.detectedLanguage))))))));
|
|
44
44
|
}
|
|
45
45
|
};
|
|
46
46
|
AiRouteDecision.style = aiRouteDecisionCss();
|
|
@@ -20,10 +20,10 @@ const AiSuggestion = class {
|
|
|
20
20
|
this.suggestionClick.emit(this.label);
|
|
21
21
|
}
|
|
22
22
|
render() {
|
|
23
|
-
return (index.h(index.Host, { key: '
|
|
23
|
+
return (index.h(index.Host, { key: 'c2eb388d152586755e9cc10ac57b519e8ff84b4d' }, index.h("button", { key: '0b9f6ec6d8c57365e2c29bfe1bfc33993d3cb498', class: {
|
|
24
24
|
chip: true,
|
|
25
25
|
'chip--disabled': this.disabled,
|
|
26
|
-
}, disabled: this.disabled, onClick: () => this.handleClick() }, index.h("span", { key: '
|
|
26
|
+
}, disabled: this.disabled, onClick: () => this.handleClick() }, index.h("span", { key: 'd4fabc4c8176cd6837e609bad369e8edfc779855', class: "chip__label" }, this.label, index.h("slot", { key: 'a1074453e53982f10fd2115c2b15d7a7b20eda07' })))));
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
29
|
AiSuggestion.style = aiSuggestionCss();
|
|
@@ -279,7 +279,7 @@ const VoiceInput = class {
|
|
|
279
279
|
};
|
|
280
280
|
render() {
|
|
281
281
|
const remaining = MAX_RECORDING_TIME - this.recordingDuration;
|
|
282
|
-
return (index.h(index.Host, { key: '
|
|
282
|
+
return (index.h(index.Host, { key: 'ca20fe9dda634af0da1ef6da59880279f0775a9f' }, index.h("div", { key: 'dc3328cc1ef74e9683bc6c34e1d3279b2ca2ffa2', class: "wrapper" }, index.h("div", { key: 'b4a4d2799b8c541dc03679686107cc486373e76b', class: `glow${this.state === 'recording' ? ' visible' : ''}`, "aria-hidden": "true" }), index.h("div", { key: 'f4fa8c638e68528dffd96db627bd80d4c7103143', class: "input-container" }, this.state === 'idle' ? (index.h("div", { class: "recording-row" }, index.h("button", { type: "button", class: "submit-button", onClick: this.startRecording, disabled: this.disabled, "aria-label": "Start recording" }, index.h("ai-icon", { name: "mic", size: 16 })), this.error && (index.h("div", { class: "error-message", role: "alert" }, this.error)))) : (index.h("div", { class: "recording-row" }, index.h("button", { type: "button", class: "cancel-button", onClick: this.cancelRecording, "aria-label": "Cancel" }, index.h("ai-icon", { name: "cancel", size: 14 })), index.h("div", { class: `timer${remaining <= 5 ? ' warning' : ''}` }, this.formatDuration(this.recordingDuration)), this.showWaveform && index.h("canvas", { ref: el => (this.canvasRef = el), class: "waveform", height: "32" }), index.h("button", { type: "button", class: `submit-button${this.submitPulse ? ' pulse' : ''}`, onClick: this.stopRecording, "aria-label": "Send" }, index.h("ai-icon", { name: "arrow-up", size: 14 }))))))));
|
|
283
283
|
}
|
|
284
284
|
};
|
|
285
285
|
VoiceInput.style = aiVoiceInputCss();
|
|
@@ -5,6 +5,8 @@
|
|
|
5
5
|
--ai-card-padding: 16px;
|
|
6
6
|
--ai-card-gap: 12px;
|
|
7
7
|
--ai-card-shadow: var(--ai-shadow-sm);
|
|
8
|
+
--ai-card-header-padding: 16px;
|
|
9
|
+
--ai-card-footer-padding: 16px;
|
|
8
10
|
display: block;
|
|
9
11
|
}
|
|
10
12
|
|
|
@@ -35,3 +37,23 @@
|
|
|
35
37
|
.card--no-shadow {
|
|
36
38
|
box-shadow: none;
|
|
37
39
|
}
|
|
40
|
+
|
|
41
|
+
/* ─── Card Header & Footer ───────────────────────────────────────────────── */
|
|
42
|
+
::slotted([slot="header"]) {
|
|
43
|
+
padding: var(--ai-card-header-padding);
|
|
44
|
+
margin: calc(var(--ai-card-padding) * -1) calc(var(--ai-card-padding) * -1) 0;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
::slotted([slot="footer"]) {
|
|
48
|
+
padding: var(--ai-card-footer-padding);
|
|
49
|
+
margin: 0 calc(var(--ai-card-padding) * -1) calc(var(--ai-card-padding) * -1);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
/* When card has no padding, header and footer shouldn't have negative margins */
|
|
53
|
+
.card--no-padding ::slotted([slot="header"]) {
|
|
54
|
+
margin: 0;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.card--no-padding ::slotted([slot="footer"]) {
|
|
58
|
+
margin: 0;
|
|
59
|
+
}
|
|
@@ -9,7 +9,7 @@ export class AiCard {
|
|
|
9
9
|
card: true,
|
|
10
10
|
'card--no-padding': this.noPadding,
|
|
11
11
|
'card--no-shadow': this.noShadow,
|
|
12
|
-
} }, h("slot", { key: '
|
|
12
|
+
} }, h("slot", { key: '149e85041e3318ea8e5dfa7ddf67e6236e49e6e8', name: "header" }), h("slot", { key: '774d0408e091a0603e5feac3bc5927cf698b5c8c' }), h("slot", { key: 'be0157314b280caa5c9b4f038ca6ca4aec2f8c8f', name: "footer" }))));
|
|
13
13
|
}
|
|
14
14
|
static get is() { return "ai-card"; }
|
|
15
15
|
static get encapsulation() { return "shadow"; }
|
|
@@ -180,7 +180,7 @@ export class AiChatHeader {
|
|
|
180
180
|
];
|
|
181
181
|
}
|
|
182
182
|
render() {
|
|
183
|
-
return (h(Host, { key: '
|
|
183
|
+
return (h(Host, { key: '80236bfcbfac98d3efa3955f03aab4ef68c9cfea' }, h("div", { key: 'dcc4142bba1d5f07782dbc7b0a3ec287e0154223', class: "header-wrapper" }, h("div", { key: 'ca0ff9a2946cead0b86cb82390624894ed414378', class: "header-container" }, this.mode === 'agent' ? this.renderAgentMode() : this.mode === 'human' ? this.renderHumanMode() : this.renderBrowserMode()), this.renderConversationDropdown())));
|
|
184
184
|
}
|
|
185
185
|
static get is() { return "ai-chat-header"; }
|
|
186
186
|
static get encapsulation() { return "shadow"; }
|
|
@@ -149,17 +149,7 @@
|
|
|
149
149
|
align-items: center;
|
|
150
150
|
justify-content: flex-start;
|
|
151
151
|
gap: 6px;
|
|
152
|
-
height: 0;
|
|
153
|
-
overflow: hidden;
|
|
154
|
-
opacity: 0;
|
|
155
|
-
pointer-events: none;
|
|
156
|
-
transition: height 0.15s ease, opacity 0.15s ease;
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
.agent-bubble:hover .actions-bar {
|
|
160
152
|
height: 32px;
|
|
161
|
-
opacity: 1;
|
|
162
|
-
pointer-events: auto;
|
|
163
153
|
}
|
|
164
154
|
|
|
165
155
|
.action-btn {
|
|
@@ -201,7 +201,7 @@ export class AiChatMessage {
|
|
|
201
201
|
} })), h("slot", null), showActions && this.renderActionsBar()), (this.agentName || this.timestamp) && (h("div", { class: "agent-info" }, this.agentName && h("span", { class: "agent-info-name" }, this.agentName), this.agentName && this.timestamp && this.renderIcon('eclipse', 10), this.timestamp && h("span", { class: "agent-info-time" }, this.getRelativeTime()))))));
|
|
202
202
|
}
|
|
203
203
|
render() {
|
|
204
|
-
return h(Host, { key: '
|
|
204
|
+
return h(Host, { key: 'f8a49971896742ae952d84efb1527ed0db440876' }, this.role === 'user' ? this.renderUserMessage() : this.renderAgentMessage());
|
|
205
205
|
}
|
|
206
206
|
static get is() { return "ai-chat-message"; }
|
|
207
207
|
static get encapsulation() { return "shadow"; }
|
|
@@ -17,7 +17,7 @@ export class AiConversationSummary {
|
|
|
17
17
|
return h("span", { class: "icon-wrap", innerHTML: svg });
|
|
18
18
|
}
|
|
19
19
|
render() {
|
|
20
|
-
return (h(Host, { key: '
|
|
20
|
+
return (h(Host, { key: 'f69a767b9111f035799fbad9e26f6cd278d2cd5e' }, h("div", { key: '2b598f0ebcf118c75d58a92173d31250b7b71aaa', class: "summary-card" }, h("div", { key: 'fba36d83ef95feaaff7a88847c2ad8eed7b2a009', class: "summary-header" }, h("div", { key: 'f2840d65175456326a9f2c2d389b788f4dfc6622', class: "sparkle-avatar" }, this.renderIcon('sparkle', 14, 14)), h("span", { key: 'e90eca9ddf0b1b610a05d3a68fba69853c3c87e5', class: "summary-title" }, this.conversation), h("div", { key: 'ab9dd453aab0b04b00493dac0a7b5ad74b194190', class: "summary-badges" }, this.messageCount > 0 && (h("span", { key: 'e5664fb004a19d72334f157121125a01ff09f56a', class: "badge" }, this.renderIcon('list', 12, 12), this.messageCount)), this.language && (h("span", { key: 'af0784ee45ed3169514d198dc1236e781fe48ac6', class: "badge lang-badge" }, this.language)))), this.summary && (h("p", { key: 'c0c2be2118abbe62a31adc65e6fa8907f155bb49', class: "summary-body", ref: el => el && (el.textContent = this.summary) })), h("div", { key: '61c139e33e9e247508e830e319fc9cc014451526', class: "summary-slot" }, h("slot", { key: '5ebbbdb3319c6a8ca9f8e98a58c6336e7a25c159' })))));
|
|
21
21
|
}
|
|
22
22
|
static get is() { return "ai-conversation-summary"; }
|
|
23
23
|
static get encapsulation() { return "shadow"; }
|
|
@@ -29,7 +29,7 @@ export class AiInChatBrowser {
|
|
|
29
29
|
};
|
|
30
30
|
render() {
|
|
31
31
|
const displayTitle = this.getDisplayTitle();
|
|
32
|
-
return (h(Host, { key: '
|
|
32
|
+
return (h(Host, { key: 'd79ede7857bc7edc13a4c8cdbbf5b4f7312d9766' }, h("div", { key: '57ccda6f9670e9ae2ca76b768f31ecf62b9ec8e9', class: "browser-content" }, this.isLoading && (h("div", { key: 'f868050d91fc24f9a13a760d34805b6a443ff865', class: "browser-loading" }, h("div", { key: 'b90a07a822a1978875fd5590783d9e9a6ac319b9', class: "loading-bar" }))), this.hasError ? (h("div", { class: "browser-error" }, h("span", { class: "error-text" }, "\u062A\u0639\u0630\u0651\u0631 \u062A\u062D\u0645\u064A\u0644 \u0627\u0644\u0635\u0641\u062D\u0629"), h("span", { class: "error-url" }, this.url))) : (this.url && (h("iframe", { class: "browser-iframe", src: this.url, onLoad: this.handleIframeLoad, onError: this.handleIframeError, sandbox: "allow-scripts allow-same-origin allow-forms allow-popups", referrerPolicy: "no-referrer", title: displayTitle }))))));
|
|
33
33
|
}
|
|
34
34
|
static get is() { return "ai-in-chat-browser"; }
|
|
35
35
|
static get encapsulation() { return "shadow"; }
|
|
@@ -18,7 +18,7 @@ export class AiLink {
|
|
|
18
18
|
}
|
|
19
19
|
render() {
|
|
20
20
|
const rel = this.rel || (this.target === '_blank' ? 'noopener noreferrer' : undefined);
|
|
21
|
-
return (h(Host, { key: '
|
|
21
|
+
return (h(Host, { key: 'e0e34a4c2a3534a3b449bac613c6f7cb512420d3' }, h("span", { key: '5776ddc64676ecaabb4f36a0e9833026dc730c23', class: "link__label" }, this.label, h("slot", { key: '436a334a51bea342b839d5fad9743aaf6b66a94d' })), h("a", { key: '3880c1429a8a24a9dee700c9f0592ac673ce68f0', class: "link", href: this.href, target: this.target, rel: rel }, this.renderShareIcon())));
|
|
22
22
|
}
|
|
23
23
|
static get is() { return "ai-link"; }
|
|
24
24
|
static get encapsulation() { return "shadow"; }
|
|
@@ -130,7 +130,15 @@
|
|
|
130
130
|
color: var(--ai-text-primary);
|
|
131
131
|
text-align: center;
|
|
132
132
|
width: 100%;
|
|
133
|
-
|
|
133
|
+
min-height: 24px;
|
|
134
|
+
opacity: 0;
|
|
135
|
+
visibility: hidden;
|
|
136
|
+
transition: opacity 0.15s ease, visibility 0.15s ease;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.rating__hover-label--visible {
|
|
140
|
+
opacity: 1;
|
|
141
|
+
visibility: visible;
|
|
134
142
|
}
|
|
135
143
|
|
|
136
144
|
/* ─── Success state ──────────────────────────────────────────────────────── */
|
|
@@ -38,7 +38,7 @@ export class AiRating {
|
|
|
38
38
|
if (this.submitted) {
|
|
39
39
|
return (h(Host, null, h("ai-card", null, h("div", { class: "rating rating--success" }, h("ai-icon", { name: "check-circle", size: 32 }), h("p", { class: "rating__success-message" }, this.successMessage)))));
|
|
40
40
|
}
|
|
41
|
-
return (h(Host, null, h("ai-card", null, h("div", { class: "rating" }, h("div", { class: "rating__text" }, h("p", { class: "rating__question" }, this.question), h("p", { class: "rating__subtitle" }, this.subtitle)), h("div", { class: "rating__icons", role: "group", "aria-label": this.question }, EMOJI_OPTIONS.map(opt => {
|
|
41
|
+
return (h(Host, null, h("ai-card", null, h("div", { class: "rating" }, h("div", { class: "rating__text" }, h("p", { class: "rating__question" }, this.question), h("p", { class: "rating__subtitle" }, this.subtitle)), h("div", { class: "rating__icons", role: "group", "aria-label": this.question, onMouseLeave: () => (this.hovered = null) }, EMOJI_OPTIONS.map(opt => {
|
|
42
42
|
const isActive = this.value === opt.value;
|
|
43
43
|
const isHovered = this.hovered === opt.value;
|
|
44
44
|
const icon = iconRegistry[opt.icon];
|
|
@@ -47,8 +47,8 @@ export class AiRating {
|
|
|
47
47
|
'emoji-btn--active': isActive,
|
|
48
48
|
'emoji-btn--hovered': isHovered && !isActive,
|
|
49
49
|
'emoji-btn--disabled': this.disabled,
|
|
50
|
-
}, "aria-label": opt.label, "aria-pressed": isActive ? 'true' : 'false', disabled: this.disabled, onClick: () => this.select(opt.value), onMouseEnter: () => (this.hovered = opt.value)
|
|
51
|
-
})),
|
|
50
|
+
}, "aria-label": opt.label, "aria-pressed": isActive ? 'true' : 'false', disabled: this.disabled, onClick: () => this.select(opt.value), onMouseEnter: () => (this.hovered = opt.value) }, h("span", { class: "emoji-btn__icon", "aria-hidden": "true" }, h("svg", { width: 24, height: 24, viewBox: icon.viewBox, xmlns: "http://www.w3.org/2000/svg", ref: (el) => el && (el.innerHTML = icon.content) }))));
|
|
51
|
+
})), h("p", { class: { 'rating__hover-label': true, 'rating__hover-label--visible': label !== null } }, label ?? '\u00A0')))));
|
|
52
52
|
}
|
|
53
53
|
static get is() { return "ai-rating"; }
|
|
54
54
|
static get encapsulation() { return "shadow"; }
|
|
@@ -31,7 +31,7 @@ export class AiRouteDecision {
|
|
|
31
31
|
this.routeExpand.emit(this._expanded);
|
|
32
32
|
}
|
|
33
33
|
render() {
|
|
34
|
-
return (h(Host, { key: '
|
|
34
|
+
return (h(Host, { key: 'f12718d142cff27d62c0a0299b029be2e2d88b86' }, h("div", { key: '4fcef90f887300c4884cd981737bf8ce8b796eca', class: `route-pill ${this._expanded ? 'expanded' : ''}` }, h("button", { key: '09eadc07b41b96fb56b4bcd937165de92507ac84', class: "route-pill-main", onClick: () => this.handleToggle() }, h("span", { key: 'd13744692a45c74976f89b582142ae09339015f5', class: "route-icon" }, this.renderIcon('route', 14, 14)), h("span", { key: '4f995cc09a72ba74310df17cf78735c27a910314', class: "agent-label" }, this.agentIcon && h("span", { key: '272dd78f38bbbb4ef845b7a41530d205368faf7e', class: "agent-emoji", "aria-hidden": "true" }, this.agentIcon), this.selectedAgent), this.confidence > 0 && (h("span", { key: 'a061317c9d5b8dad243dce0bb80e927eae04eb3d', class: "confidence-badge" }, this.confidence, "%")), h("span", { key: '4342bdf38aa85a5c5d6bd054504c91bccc7901e9', class: `expand-icon ${this._expanded ? 'expanded' : ''}` }, this.renderIcon('arrow-right', 12, 12))), this._expanded && (h("div", { key: 'ab5340148e832baafdd38e17a748a52b83b25c96', class: "route-details" }, this.reason && h("p", { key: '7854838ea405c5fdb5ebe11fb3df36a9898be445', class: "reason-text" }, this.reason), this.confidence > 0 && (h("div", { key: 'baf946426ad7cda94d2acfbb9f8945b5b40a823c', class: "confidence-bar-wrap" }, h("div", { key: 'a6e08f412706ce18e16030dd4d475d57befdd9e7', class: "confidence-bar", style: { width: `${this.confidence}%` } }))), this.detectedLanguage && (h("div", { key: '58af2dbca56082dcf2910cc44ac553d6f2af015a', class: "meta-row" }, this.renderIcon('list', 12, 12), h("span", { key: '63517ed8802764542de330897372c6a01348d0a6', class: "lang-chip" }, this.detectedLanguage))))))));
|
|
35
35
|
}
|
|
36
36
|
static get is() { return "ai-route-decision"; }
|
|
37
37
|
static get encapsulation() { return "shadow"; }
|
|
@@ -11,10 +11,10 @@ export class AiSuggestion {
|
|
|
11
11
|
this.suggestionClick.emit(this.label);
|
|
12
12
|
}
|
|
13
13
|
render() {
|
|
14
|
-
return (h(Host, { key: '
|
|
14
|
+
return (h(Host, { key: 'c2eb388d152586755e9cc10ac57b519e8ff84b4d' }, h("button", { key: '0b9f6ec6d8c57365e2c29bfe1bfc33993d3cb498', class: {
|
|
15
15
|
chip: true,
|
|
16
16
|
'chip--disabled': this.disabled,
|
|
17
|
-
}, disabled: this.disabled, onClick: () => this.handleClick() }, h("span", { key: '
|
|
17
|
+
}, disabled: this.disabled, onClick: () => this.handleClick() }, h("span", { key: 'd4fabc4c8176cd6837e609bad369e8edfc779855', class: "chip__label" }, this.label, h("slot", { key: 'a1074453e53982f10fd2115c2b15d7a7b20eda07' })))));
|
|
18
18
|
}
|
|
19
19
|
static get is() { return "ai-suggestion"; }
|
|
20
20
|
static get encapsulation() { return "shadow"; }
|
|
@@ -269,7 +269,7 @@ export class VoiceInput {
|
|
|
269
269
|
};
|
|
270
270
|
render() {
|
|
271
271
|
const remaining = MAX_RECORDING_TIME - this.recordingDuration;
|
|
272
|
-
return (h(Host, { key: '
|
|
272
|
+
return (h(Host, { key: 'ca20fe9dda634af0da1ef6da59880279f0775a9f' }, h("div", { key: 'dc3328cc1ef74e9683bc6c34e1d3279b2ca2ffa2', class: "wrapper" }, h("div", { key: 'b4a4d2799b8c541dc03679686107cc486373e76b', class: `glow${this.state === 'recording' ? ' visible' : ''}`, "aria-hidden": "true" }), h("div", { key: 'f4fa8c638e68528dffd96db627bd80d4c7103143', class: "input-container" }, this.state === 'idle' ? (h("div", { class: "recording-row" }, h("button", { type: "button", class: "submit-button", onClick: this.startRecording, disabled: this.disabled, "aria-label": "Start recording" }, h("ai-icon", { name: "mic", size: 16 })), this.error && (h("div", { class: "error-message", role: "alert" }, this.error)))) : (h("div", { class: "recording-row" }, h("button", { type: "button", class: "cancel-button", onClick: this.cancelRecording, "aria-label": "Cancel" }, h("ai-icon", { name: "cancel", size: 14 })), h("div", { class: `timer${remaining <= 5 ? ' warning' : ''}` }, this.formatDuration(this.recordingDuration)), this.showWaveform && h("canvas", { ref: el => (this.canvasRef = el), class: "waveform", height: "32" }), h("button", { type: "button", class: `submit-button${this.submitPulse ? ' pulse' : ''}`, onClick: this.stopRecording, "aria-label": "Send" }, h("ai-icon", { name: "arrow-up", size: 14 }))))))));
|
|
273
273
|
}
|
|
274
274
|
static get is() { return "ai-voice-input"; }
|
|
275
275
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{A as
|
|
1
|
+
import{A as o,d as s}from"./p-DCJWSYj-.js";const p=o,r=s;export{p as AiCard,r as defineCustomElement}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as t,H as i,c as e,h as n,d as a,t as o}from"./p-BPkf7wZg.js";import{i as s}from"./p-DlD8m3rf.js";import{d as r}from"./p-CFSr3KcL.js";const l=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.closeClick=e(this,"closeClick"),this.newChatClick=e(this,"newChatClick"),this.dropdownClick=e(this,"dropdownClick"),this.positionClick=e(this,"positionClick"),this.headerPositionClick=e(this,"headerPositionClick"),this.backClick=e(this,"backClick"),this.headerDragStart=e(this,"headerDragStart"),this.openExternal=e(this,"openExternal"),this.conversationSelect=e(this,"conversationSelect"),this.conversationDelete=e(this,"conversationDelete"),this.conversationRetry=e(this,"conversationRetry")}get el(){return this}mode="agent";conversation="محادثة جديدة";agentName="";agentStatus="";agentAvatar="";showBack=!0;statusIndicator="online";pageTitle="";pageUrl="";conversationItems=[];conversationActiveId="";conversationLoading=!1;conversationError=!1;conversationErrorText="تعذّر تحميل المحادثات";conversationRetryLabel="إعادة المحاولة";conversationEmptyText="لا توجد محادثات";conversationDeletingId="";titleLoading=!1;avatarError=!1;dropdownOpen=!1;isFloating=!1;parentPositionObserver=null;closeClick;newChatClick;dropdownClick;positionClick;headerPositionClick;backClick;headerDragStart;openExternal;conversationSelect;conversationDelete;conversationRetry;handleDocumentClick(t){this.dropdownOpen&&!this.el.contains(t.target)&&(this.dropdownOpen=!1)}connectedCallback(){}componentDidLoad(){requestAnimationFrame((()=>{this.syncFloatingState(),this.observeParentPosition()}))}disconnectedCallback(){this.parentPositionObserver?.disconnect(),this.parentPositionObserver=null}observeParentPosition(){if(this.parentPositionObserver)return;const t=this.el.closest("ai-chat-container");t&&(this.parentPositionObserver=new MutationObserver((()=>this.syncFloatingState())),this.parentPositionObserver.observe(t,{attributes:!0,attributeFilter:["position"]}))}syncFloatingState(){const t=this.el.closest("ai-chat-container");if(t){const i="float"===t.getAttribute("position");this.isFloating!==i&&(this.isFloating=i)}else!1!==this.isFloating&&(this.isFloating=!1)}renderIcon(t,i,e){const a=s[t];return a?n("span",{class:"icon-wrap",innerHTML:`<svg width="${i}" height="${e}" viewBox="${a.viewBox}" fill="none" xmlns="http://www.w3.org/2000/svg">${a.content}</svg>`}):null}renderAvatar(){const t=this.agentName?this.agentName.charAt(0):"?";return!this.agentAvatar||this.avatarError?n("div",{class:"avatar-fallback"},t):n("img",{class:"avatar",src:this.agentAvatar,alt:this.agentName,onError:()=>{this.avatarError=!0}})}renderDragBtn(){return this.isFloating&&n("button",{class:"action-btn drag-btn","aria-label":"سحب / Drag",onPointerDown:t=>{t.preventDefault(),this.headerDragStart.emit({clientX:t.clientX,clientY:t.clientY})}},this.renderIcon("drag",11,15))}handleConversationSelect=t=>{t.stopPropagation(),this.conversationSelect.emit(t.detail),this.dropdownOpen=!1};handleConversationDelete=t=>{t.stopPropagation(),this.conversationDelete.emit(t.detail)};handleConversationRetry=t=>{t.stopPropagation(),this.conversationRetry.emit()};renderConversationDropdown(){return this.dropdownOpen&&"agent"===this.mode?n("div",{class:"conversation-dropdown"},n("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})):null}renderAgentMode(){return[this.renderDragBtn(),n("div",{class:"content agent dropdown-trigger",role:"button",onClick:()=>{this.titleLoading||(this.dropdownOpen=!this.dropdownOpen,this.dropdownClick.emit())},"aria-haspopup":"listbox","aria-expanded":this.dropdownOpen,"aria-label":this.conversation+", افتح قائمة المحادثات"},this.titleLoading?n("span",{class:"title-skeleton","aria-busy":"true","aria-label":"جاري التحميل"}):n("span",{class:"title"},this.conversation),!this.titleLoading&&n("span",{class:"dropdown-chevron"+(this.dropdownOpen?" open":"")},this.renderIcon("chevron-down",24,24))),n("div",{class:"actions"},n("button",{class:"action-btn","aria-label":"محادثة جديدة / New Chat",onClick:()=>this.newChatClick.emit()},this.renderIcon("pencil-edit",22,22)),n("button",{class:"action-btn","aria-label":"العرض / Position",onClick:()=>{this.positionClick.emit(),this.headerPositionClick.emit()}},this.renderIcon("hand",22,22)),n("button",{class:"action-btn","aria-label":"إغلاق / Close",onClick:()=>this.closeClick.emit()},this.renderIcon("cancel",22,22)))]}renderHumanMode(){return[this.renderDragBtn(),n("div",{class:"content human"},this.showBack&&n("button",{class:"back-btn","aria-label":"رجوع / Back",onClick:()=>this.backClick.emit()},this.renderIcon("arrow-right",24,24)),n("div",{class:"avatar-wrapper"},this.renderAvatar(),n("span",{class:"online-dot status-"+this.statusIndicator},this.renderIcon("online-dot",10,10))),n("div",{class:"text-block"},n("span",{class:"agent-name"},this.agentName),this.agentStatus&&n("span",{class:"agent-status"},this.agentStatus))),n("div",{class:"actions"},n("button",{class:"action-btn","aria-label":"العرض / Position",onClick:()=>{this.positionClick.emit(),this.headerPositionClick.emit()}},this.renderIcon("hand",22,22)),n("button",{class:"action-btn","aria-label":"إغلاق / Close",onClick:()=>this.closeClick.emit()},this.renderIcon("cancel",22,22)))]}renderBrowserMode(){return[this.renderDragBtn(),n("div",{class:"content browser"},n("button",{class:"back-btn","aria-label":"رجوع / Back",onClick:()=>this.backClick.emit()},this.renderIcon("arrow-right",24,24)),n("span",{class:"browser-title"},this.pageTitle),n("button",{class:"browser-link-btn","aria-label":"فتح في نافذة جديدة / Open externally",onClick:()=>this.openExternal.emit(this.pageUrl)},this.renderIcon("link",14,14))),n("div",{class:"actions"},n("button",{class:"action-btn","aria-label":"العرض / Position",onClick:()=>{this.positionClick.emit(),this.headerPositionClick.emit()}},this.renderIcon("hand",22,22)),n("button",{class:"action-btn","aria-label":"إغلاق / Close",onClick:()=>this.closeClick.emit()},this.renderIcon("cancel",22,22)))]}render(){return n(a,{key:"874ee1e0eb62a59a4c9713111856594ef03dd435"},n("div",{key:"d8887800ad270c7878f41bdc930b2ca6b1280935",class:"header-wrapper"},n("div",{key:"a4fc7e86851cc1cdce6c686880b9f4ee33342fb7",class:"header-container"},"agent"===this.mode?this.renderAgentMode():"human"===this.mode?this.renderHumanMode():this.renderBrowserMode()),this.renderConversationDropdown()))}static get style(){return":host{display:block;position:relative;z-index:10}.header-wrapper{position:relative;display:flex;flex-direction:column}.header-container{display:flex;align-items:center;gap:8px;padding:16px;background:var(--ai-bg-card);border-bottom:1px solid var(--ai-border-light);width:100%;box-sizing:border-box}.drag-btn{cursor:grab;color:var(--ai-text-muted)}.drag-btn:active{cursor:grabbing}.action-btn,.back-btn{width:40px;height:40px;padding:4px;display:flex;align-items:center;justify-content:center;background:var(--ai-bg-card);border:none;border-radius:8px;cursor:pointer;flex-shrink:0;color:var(--ai-text-primary);transition:background 0.15s ease}.action-btn:hover,.back-btn:hover{background:var(--ai-bg-surface)}.action-btn:focus-visible,.back-btn:focus-visible{outline:2px solid var(--ai-focus-ring);outline-offset:2px}.action-btn:active,.back-btn:active{background:var(--ai-bg-surface)}.actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.content{flex:1 0 0;display:flex;align-items:center;justify-content:flex-start;min-width:0}.content.agent{gap:4px;height:40px}.content.human{gap:8px}.content.browser{gap:8px}.dropdown-trigger{display:flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;padding:0;flex-shrink:0;color:var(--ai-text-primary)}.dropdown-chevron{display:inline-flex;transition:transform 0.2s ease}.dropdown-chevron.open{transform:rotate(180deg)}.dropdown-trigger:focus-visible{outline:2px solid var(--ai-focus-ring);outline-offset:2px}.title{font-size:16px;font-weight:700;color:var(--ai-text-primary);white-space:nowrap;line-height:normal;min-width:0;overflow:hidden;text-overflow:ellipsis}@keyframes title-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.title-skeleton{display:inline-block;width:120px;height:16px;border-radius:8px;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:title-shimmer 1.6s ease-in-out infinite}.browser-title{font-size:14px;font-weight:600;color:var(--ai-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;line-height:20px}.browser-link-btn{width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;background:none;border:none;border-radius:8px;cursor:pointer;flex-shrink:0;color:var(--ai-text-secondary)}.browser-link-btn:focus-visible{outline:2px solid var(--ai-focus-ring);outline-offset:2px}.avatar-wrapper{position:relative;width:40px;height:40px;flex-shrink:0}.avatar{width:40px;height:40px;border-radius:9999px;border:1px solid var(--ai-border-default);object-fit:cover;display:block}.avatar-fallback{width:40px;height:40px;border-radius:9999px;border:1px solid var(--ai-border-default);background:var(--ai-bg-surface);color:var(--ai-text-primary);font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.online-dot{position:absolute;bottom:0;inset-inline-end:0;width:10px;height:10px;display:inline-flex;align-items:center;justify-content:center;color:var(--ai-bg-card);}.online-dot.status-online{color:#22c55e;}.online-dot.status-offline{color:#9ca3af;}.online-dot.status-busy{color:#ef4444;}.online-dot.status-away{color:#f59e0b;}.text-block{display:flex;flex-direction:column;align-items:flex-start;gap:0;flex-shrink:0}.agent-name{font-size:14px;font-weight:500;color:var(--ai-text-primary);line-height:20px;white-space:nowrap}.agent-status{font-size:14px;font-weight:400;color:var(--ai-text-secondary);line-height:20px;white-space:nowrap}.icon-wrap{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.icon-wrap svg{display:block}:host-context([dir='ltr']) .back-btn .icon-wrap,:host([dir='ltr']) .back-btn .icon-wrap{transform:scaleX(-1)}.conversation-dropdown{position:absolute;top:100%;left:0;right:0;z-index:20;height:360px;display:flex;flex-direction:column;background:var(--ai-bg-surface);border-bottom:1px solid var(--ai-border-light);box-shadow:var(--ai-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));animation:slideDown 0.2s ease;overflow:hidden}.conversation-dropdown ai-conversation-list{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}"}},[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"]]]),c=l,h=function(){"undefined"!=typeof customElements&&["ai-chat-header","ai-conversation-list"].forEach((t=>{switch(t){case"ai-chat-header":customElements.get(o(t))||customElements.define(o(t),l);break;case"ai-conversation-list":customElements.get(o(t))||r()}}))};export{c as AiChatHeader,h as defineCustomElement}
|
|
1
|
+
import{p as t,H as i,c as e,h as a,d as n,t as o}from"./p-BPkf7wZg.js";import{i as s}from"./p-DlD8m3rf.js";import{d as r}from"./p-CFSr3KcL.js";const l=t(class extends i{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.closeClick=e(this,"closeClick"),this.newChatClick=e(this,"newChatClick"),this.dropdownClick=e(this,"dropdownClick"),this.positionClick=e(this,"positionClick"),this.headerPositionClick=e(this,"headerPositionClick"),this.backClick=e(this,"backClick"),this.headerDragStart=e(this,"headerDragStart"),this.openExternal=e(this,"openExternal"),this.conversationSelect=e(this,"conversationSelect"),this.conversationDelete=e(this,"conversationDelete"),this.conversationRetry=e(this,"conversationRetry")}get el(){return this}mode="agent";conversation="محادثة جديدة";agentName="";agentStatus="";agentAvatar="";showBack=!0;statusIndicator="online";pageTitle="";pageUrl="";conversationItems=[];conversationActiveId="";conversationLoading=!1;conversationError=!1;conversationErrorText="تعذّر تحميل المحادثات";conversationRetryLabel="إعادة المحاولة";conversationEmptyText="لا توجد محادثات";conversationDeletingId="";titleLoading=!1;avatarError=!1;dropdownOpen=!1;isFloating=!1;parentPositionObserver=null;closeClick;newChatClick;dropdownClick;positionClick;headerPositionClick;backClick;headerDragStart;openExternal;conversationSelect;conversationDelete;conversationRetry;handleDocumentClick(t){this.dropdownOpen&&!this.el.contains(t.target)&&(this.dropdownOpen=!1)}connectedCallback(){}componentDidLoad(){requestAnimationFrame((()=>{this.syncFloatingState(),this.observeParentPosition()}))}disconnectedCallback(){this.parentPositionObserver?.disconnect(),this.parentPositionObserver=null}observeParentPosition(){if(this.parentPositionObserver)return;const t=this.el.closest("ai-chat-container");t&&(this.parentPositionObserver=new MutationObserver((()=>this.syncFloatingState())),this.parentPositionObserver.observe(t,{attributes:!0,attributeFilter:["position"]}))}syncFloatingState(){const t=this.el.closest("ai-chat-container");if(t){const i="float"===t.getAttribute("position");this.isFloating!==i&&(this.isFloating=i)}else!1!==this.isFloating&&(this.isFloating=!1)}renderIcon(t,i,e){const n=s[t];return n?a("span",{class:"icon-wrap",innerHTML:`<svg width="${i}" height="${e}" viewBox="${n.viewBox}" fill="none" xmlns="http://www.w3.org/2000/svg">${n.content}</svg>`}):null}renderAvatar(){const t=this.agentName?this.agentName.charAt(0):"?";return!this.agentAvatar||this.avatarError?a("div",{class:"avatar-fallback"},t):a("img",{class:"avatar",src:this.agentAvatar,alt:this.agentName,onError:()=>{this.avatarError=!0}})}renderDragBtn(){return this.isFloating&&a("button",{class:"action-btn drag-btn","aria-label":"سحب / Drag",onPointerDown:t=>{t.preventDefault(),this.headerDragStart.emit({clientX:t.clientX,clientY:t.clientY})}},this.renderIcon("drag",11,15))}handleConversationSelect=t=>{t.stopPropagation(),this.conversationSelect.emit(t.detail),this.dropdownOpen=!1};handleConversationDelete=t=>{t.stopPropagation(),this.conversationDelete.emit(t.detail)};handleConversationRetry=t=>{t.stopPropagation(),this.conversationRetry.emit()};renderConversationDropdown(){return this.dropdownOpen&&"agent"===this.mode?a("div",{class:"conversation-dropdown"},a("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})):null}renderAgentMode(){return[this.renderDragBtn(),a("div",{class:"content agent dropdown-trigger",role:"button",onClick:()=>{this.titleLoading||(this.dropdownOpen=!this.dropdownOpen,this.dropdownClick.emit())},"aria-haspopup":"listbox","aria-expanded":this.dropdownOpen,"aria-label":this.conversation+", افتح قائمة المحادثات"},this.titleLoading?a("span",{class:"title-skeleton","aria-busy":"true","aria-label":"جاري التحميل"}):a("span",{class:"title"},this.conversation),!this.titleLoading&&a("span",{class:"dropdown-chevron"+(this.dropdownOpen?" open":"")},this.renderIcon("chevron-down",24,24))),a("div",{class:"actions"},a("button",{class:"action-btn","aria-label":"محادثة جديدة / New Chat",onClick:()=>this.newChatClick.emit()},this.renderIcon("pencil-edit",22,22)),a("button",{class:"action-btn","aria-label":"العرض / Position",onClick:()=>{this.positionClick.emit(),this.headerPositionClick.emit()}},this.renderIcon("hand",22,22)),a("button",{class:"action-btn","aria-label":"إغلاق / Close",onClick:()=>this.closeClick.emit()},this.renderIcon("cancel",22,22)))]}renderHumanMode(){return[this.renderDragBtn(),a("div",{class:"content human"},this.showBack&&a("button",{class:"back-btn","aria-label":"رجوع / Back",onClick:()=>this.backClick.emit()},this.renderIcon("arrow-right",24,24)),a("div",{class:"avatar-wrapper"},this.renderAvatar(),a("span",{class:"online-dot status-"+this.statusIndicator},this.renderIcon("online-dot",10,10))),a("div",{class:"text-block"},a("span",{class:"agent-name"},this.agentName),this.agentStatus&&a("span",{class:"agent-status"},this.agentStatus))),a("div",{class:"actions"},a("button",{class:"action-btn","aria-label":"العرض / Position",onClick:()=>{this.positionClick.emit(),this.headerPositionClick.emit()}},this.renderIcon("hand",22,22)),a("button",{class:"action-btn","aria-label":"إغلاق / Close",onClick:()=>this.closeClick.emit()},this.renderIcon("cancel",22,22)))]}renderBrowserMode(){return[this.renderDragBtn(),a("div",{class:"content browser"},a("button",{class:"back-btn","aria-label":"رجوع / Back",onClick:()=>this.backClick.emit()},this.renderIcon("arrow-right",24,24)),a("span",{class:"browser-title"},this.pageTitle),a("button",{class:"browser-link-btn","aria-label":"فتح في نافذة جديدة / Open externally",onClick:()=>this.openExternal.emit(this.pageUrl)},this.renderIcon("link",14,14))),a("div",{class:"actions"},a("button",{class:"action-btn","aria-label":"العرض / Position",onClick:()=>{this.positionClick.emit(),this.headerPositionClick.emit()}},this.renderIcon("hand",22,22)),a("button",{class:"action-btn","aria-label":"إغلاق / Close",onClick:()=>this.closeClick.emit()},this.renderIcon("cancel",22,22)))]}render(){return a(n,{key:"80236bfcbfac98d3efa3955f03aab4ef68c9cfea"},a("div",{key:"dcc4142bba1d5f07782dbc7b0a3ec287e0154223",class:"header-wrapper"},a("div",{key:"ca0ff9a2946cead0b86cb82390624894ed414378",class:"header-container"},"agent"===this.mode?this.renderAgentMode():"human"===this.mode?this.renderHumanMode():this.renderBrowserMode()),this.renderConversationDropdown()))}static get style(){return":host{display:block;position:relative;z-index:10}.header-wrapper{position:relative;display:flex;flex-direction:column}.header-container{display:flex;align-items:center;gap:8px;padding:16px;background:var(--ai-bg-card);border-bottom:1px solid var(--ai-border-light);width:100%;box-sizing:border-box}.drag-btn{cursor:grab;color:var(--ai-text-muted)}.drag-btn:active{cursor:grabbing}.action-btn,.back-btn{width:40px;height:40px;padding:4px;display:flex;align-items:center;justify-content:center;background:var(--ai-bg-card);border:none;border-radius:8px;cursor:pointer;flex-shrink:0;color:var(--ai-text-primary);transition:background 0.15s ease}.action-btn:hover,.back-btn:hover{background:var(--ai-bg-surface)}.action-btn:focus-visible,.back-btn:focus-visible{outline:2px solid var(--ai-focus-ring);outline-offset:2px}.action-btn:active,.back-btn:active{background:var(--ai-bg-surface)}.actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.content{flex:1 0 0;display:flex;align-items:center;justify-content:flex-start;min-width:0}.content.agent{gap:4px;height:40px}.content.human{gap:8px}.content.browser{gap:8px}.dropdown-trigger{display:flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;padding:0;flex-shrink:0;color:var(--ai-text-primary)}.dropdown-chevron{display:inline-flex;transition:transform 0.2s ease}.dropdown-chevron.open{transform:rotate(180deg)}.dropdown-trigger:focus-visible{outline:2px solid var(--ai-focus-ring);outline-offset:2px}.title{font-size:16px;font-weight:700;color:var(--ai-text-primary);white-space:nowrap;line-height:normal;min-width:0;overflow:hidden;text-overflow:ellipsis}@keyframes title-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.title-skeleton{display:inline-block;width:120px;height:16px;border-radius:8px;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:title-shimmer 1.6s ease-in-out infinite}.browser-title{font-size:14px;font-weight:600;color:var(--ai-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;line-height:20px}.browser-link-btn{width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;background:none;border:none;border-radius:8px;cursor:pointer;flex-shrink:0;color:var(--ai-text-secondary)}.browser-link-btn:focus-visible{outline:2px solid var(--ai-focus-ring);outline-offset:2px}.avatar-wrapper{position:relative;width:40px;height:40px;flex-shrink:0}.avatar{width:40px;height:40px;border-radius:9999px;border:1px solid var(--ai-border-default);object-fit:cover;display:block}.avatar-fallback{width:40px;height:40px;border-radius:9999px;border:1px solid var(--ai-border-default);background:var(--ai-bg-surface);color:var(--ai-text-primary);font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;flex-shrink:0}.online-dot{position:absolute;bottom:0;inset-inline-end:0;width:10px;height:10px;display:inline-flex;align-items:center;justify-content:center;color:var(--ai-bg-card);}.online-dot.status-online{color:#22c55e;}.online-dot.status-offline{color:#9ca3af;}.online-dot.status-busy{color:#ef4444;}.online-dot.status-away{color:#f59e0b;}.text-block{display:flex;flex-direction:column;align-items:flex-start;gap:0;flex-shrink:0}.agent-name{font-size:14px;font-weight:500;color:var(--ai-text-primary);line-height:20px;white-space:nowrap}.agent-status{font-size:14px;font-weight:400;color:var(--ai-text-secondary);line-height:20px;white-space:nowrap}.icon-wrap{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.icon-wrap svg{display:block}:host-context([dir='ltr']) .back-btn .icon-wrap,:host([dir='ltr']) .back-btn .icon-wrap{transform:scaleX(-1)}.conversation-dropdown{position:absolute;top:100%;left:0;right:0;z-index:20;height:360px;display:flex;flex-direction:column;background:var(--ai-bg-surface);border-bottom:1px solid var(--ai-border-light);box-shadow:var(--ai-shadow-md, 0 4px 12px rgba(0, 0, 0, 0.08));animation:slideDown 0.2s ease;overflow:hidden}.conversation-dropdown ai-conversation-list{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}@keyframes slideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}"}},[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"]]]),c=l,h=function(){"undefined"!=typeof customElements&&["ai-chat-header","ai-conversation-list"].forEach((t=>{switch(t){case"ai-chat-header":customElements.get(o(t))||customElements.define(o(t),l);break;case"ai-conversation-list":customElements.get(o(t))||r()}}))};export{c as AiChatHeader,h as defineCustomElement}
|