@salla.sa/ui-ai-kit-core 2.2.0 → 2.2.2

package/dist/collection/components/ai-chat-header/ai-chat-header.js

@@ -14,7 +14,6 @@ export class AiChatHeader {
     agentAvatar = '';
     /** Human mode: show the back button */
     showBack = true;
-    isDraggable = false;
     /** Human mode: status indicator variant */
     statusIndicator = 'online';
     /** Browser mode: page title shown in the header */
@@ -27,18 +26,36 @@ export class AiChatHeader {
     conversationActiveId = '';
     /** Conversation list: show skeleton loading state */
     conversationLoading = false;
+    /** Conversation list: show error state */
+    conversationError = false;
+    /** Conversation list: error message text */
+    conversationErrorText = 'تعذّر تحميل المحادثات';
+    /** Conversation list: retry button label */
+    conversationRetryLabel = 'إعادة المحاولة';
+    /** Conversation list: empty state label */
+    conversationEmptyText = 'لا توجد محادثات';
+    /** Conversation list: ID of the conversation currently being deleted — shows a spinner on that item */
+    conversationDeletingId = '';
     /** Show a shimmer skeleton in place of the conversation title (e.g. while loading conversation) */
     titleLoading = false;
     avatarError = false;
     dropdownOpen = false;
+    /** Internally managed — true when the parent ai-chat-container has position="float" */
+    isFloating = false;
+    parentPositionObserver = null;
     /** Cancel / close button */
     closeClick;
     /** Pencil-edit button (agent mode) */
-    editClick;
+    newChatClick;
     /** Title / chevron click → open conversation list (agent mode) */
     dropdownClick;
-    /** More options button */
+    /** More options button — also fires a composed event so ai-chat-container can auto-cycle position */
     positionClick;
+    /**
+     * Composed + bubbling event that ai-chat-container listens to internally
+     * to automatically cycle its position. Fires alongside positionClick.
+     */
+    headerPositionClick;
     /** Back-arrow button (human mode) */
     backClick;
     /**
@@ -52,11 +69,50 @@ export class AiChatHeader {
     conversationSelect;
     /** Fired when a conversation delete button is clicked */
     conversationDelete;
+    /** Fired when the retry button is clicked in the conversation list error state */
+    conversationRetry;
     handleDocumentClick(event) {
         if (this.dropdownOpen && !this.el.contains(event.target)) {
             this.dropdownOpen = false;
         }
     }
+    connectedCallback() {
+        // Initial sync will happen in componentDidLoad
+    }
+    componentDidLoad() {
+        // By this point, the element is fully in the DOM and parent relationships are established
+        // Small delay to ensure parent custom elements are fully upgraded
+        requestAnimationFrame(() => {
+            this.syncFloatingState();
+            this.observeParentPosition();
+        });
+    }
+    disconnectedCallback() {
+        this.parentPositionObserver?.disconnect();
+        this.parentPositionObserver = null;
+    }
+    observeParentPosition() {
+        if (this.parentPositionObserver)
+            return; // Already observing
+        const container = this.el.closest('ai-chat-container');
+        if (container) {
+            this.parentPositionObserver = new MutationObserver(() => this.syncFloatingState());
+            this.parentPositionObserver.observe(container, { attributes: true, attributeFilter: ['position'] });
+        }
+    }
+    syncFloatingState() {
+        const container = this.el.closest('ai-chat-container');
+        if (container) {
+            const newState = container.getAttribute('position') === 'float';
+            if (this.isFloating !== newState) {
+                this.isFloating = newState;
+            }
+            return;
+        }
+        if (this.isFloating !== false) {
+            this.isFloating = false;
+        }
+    }
     renderIcon(name, width, height) {
         const icon = iconRegistry[name];
         if (!icon)
@@ -74,7 +130,7 @@ export class AiChatHeader {
             } }));
     }
     renderDragBtn() {
-        return (this.isDraggable && (h("button", { class: "action-btn drag-btn", "aria-label": "\u0633\u062D\u0628 / Drag", onPointerDown: (e) => {
+        return (this.isFloating && (h("button", { class: "action-btn drag-btn", "aria-label": "\u0633\u062D\u0628 / Drag", onPointerDown: (e) => {
                 e.preventDefault();
                 this.headerDragStart.emit({ clientX: e.clientX, clientY: e.clientY });
             } }, this.renderIcon('drag', 11, 15))));
@@ -88,10 +144,14 @@ export class AiChatHeader {
         e.stopPropagation();
         this.conversationDelete.emit(e.detail);
     };
+    handleConversationRetry = (e) => {
+        e.stopPropagation();
+        this.conversationRetry.emit();
+    };
     renderConversationDropdown() {
         if (!this.dropdownOpen || this.mode !== 'agent')
             return null;
-        return (h("div", { class: "conversation-dropdown" }, h("ai-conversation-list", { items: this.conversationItems, activeId: this.conversationActiveId, loading: this.conversationLoading, onConversationSelect: this.handleConversationSelect, onConversationDelete: this.handleConversationDelete })));
+        return (h("div", { class: "conversation-dropdown" }, 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 })));
     }
     renderAgentMode() {
         return [
@@ -102,25 +162,25 @@ export class AiChatHeader {
                     this.dropdownOpen = !this.dropdownOpen;
                     this.dropdownClick.emit();
                 }, "aria-haspopup": "listbox", "aria-expanded": this.dropdownOpen, "aria-label": `${this.conversation}, افتح قائمة المحادثات` }, this.titleLoading ? (h("span", { class: "title-skeleton", "aria-busy": "true", "aria-label": "\u062C\u0627\u0631\u064A \u0627\u0644\u062A\u062D\u0645\u064A\u0644" })) : (h("span", { class: "title" }, this.conversation)), !this.titleLoading && (h("span", { class: `dropdown-chevron${this.dropdownOpen ? ' open' : ''}` }, this.renderIcon('chevron-down', 24, 24)))),
-            h("div", { class: "actions" }, h("button", { class: "action-btn", "aria-label": "\u062A\u0639\u062F\u064A\u0644 / Edit", onClick: () => this.editClick.emit() }, this.renderIcon('pencil-edit', 22, 22)), h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => this.positionClick.emit() }, this.renderIcon('hand', 22, 22)), h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
+            h("div", { class: "actions" }, 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)), 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)), h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
         ];
     }
     renderHumanMode() {
         return [
             this.renderDragBtn(),
             h("div", { class: "content human" }, this.showBack && (h("button", { class: "back-btn", "aria-label": "\u0631\u062C\u0648\u0639 / Back", onClick: () => this.backClick.emit() }, this.renderIcon('arrow-right', 24, 24))), h("div", { class: "avatar-wrapper" }, this.renderAvatar(), h("span", { class: `online-dot status-${this.statusIndicator}` }, this.renderIcon('online-dot', 10, 10))), h("div", { class: "text-block" }, h("span", { class: "agent-name" }, this.agentName), this.agentStatus && h("span", { class: "agent-status" }, this.agentStatus))),
-            h("div", { class: "actions" }, h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => this.positionClick.emit() }, this.renderIcon('hand', 22, 22)), h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
+            h("div", { class: "actions" }, 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)), h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
         ];
     }
     renderBrowserMode() {
         return [
             this.renderDragBtn(),
             h("div", { class: "content browser" }, h("button", { class: "back-btn", "aria-label": "\u0631\u062C\u0648\u0639 / Back", onClick: () => this.backClick.emit() }, this.renderIcon('arrow-right', 24, 24)), h("span", { class: "browser-title" }, this.pageTitle), 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))),
-            h("div", { class: "actions" }, h("button", { class: "action-btn", "aria-label": "\u0627\u0644\u0639\u0631\u0636 / Position", onClick: () => this.positionClick.emit() }, this.renderIcon('hand', 22, 22)), h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
+            h("div", { class: "actions" }, 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)), h("button", { class: "action-btn", "aria-label": "\u0625\u063A\u0644\u0627\u0642 / Close", onClick: () => this.closeClick.emit() }, this.renderIcon('cancel', 22, 22))),
         ];
     }
     render() {
-        return (h(Host, { key: '8e1fe67030a0cb1eb94327f093327fb23d4faf01' }, h("div", { key: '14766bd663e5fe027f1a3320bd3f16d79e9feb45', class: "header-wrapper" }, h("div", { key: 'bef30f621ba3b148f4af055347eb707bc8f64b15', class: "header-container" }, this.mode === 'agent' ? this.renderAgentMode() : this.mode === 'human' ? this.renderHumanMode() : this.renderBrowserMode()), this.renderConversationDropdown())));
+        return (h(Host, { key: '874ee1e0eb62a59a4c9713111856594ef03dd435' }, h("div", { key: 'd8887800ad270c7878f41bdc930b2ca6b1280935', class: "header-wrapper" }, h("div", { key: 'a4fc7e86851cc1cdce6c686880b9f4ee33342fb7', class: "header-container" }, this.mode === 'agent' ? this.renderAgentMode() : this.mode === 'human' ? this.renderHumanMode() : this.renderBrowserMode()), this.renderConversationDropdown())));
     }
     static get is() { return "ai-chat-header"; }
     static get encapsulation() { return "shadow"; }
@@ -256,26 +316,6 @@ export class AiChatHeader {
                 "attribute": "show-back",
                 "defaultValue": "true"
             },
-            "isDraggable": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "is-draggable",
-                "defaultValue": "false"
-            },
             "statusIndicator": {
                 "type": "string",
                 "mutable": false,
@@ -401,6 +441,106 @@ export class AiChatHeader {
                 "attribute": "conversation-loading",
                 "defaultValue": "false"
             },
+            "conversationError": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Conversation list: show error state"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "conversation-error",
+                "defaultValue": "false"
+            },
+            "conversationErrorText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Conversation list: error message text"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "conversation-error-text",
+                "defaultValue": "'\u062A\u0639\u0630\u0651\u0631 \u062A\u062D\u0645\u064A\u0644 \u0627\u0644\u0645\u062D\u0627\u062F\u062B\u0627\u062A'"
+            },
+            "conversationRetryLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Conversation list: retry button label"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "conversation-retry-label",
+                "defaultValue": "'\u0625\u0639\u0627\u062F\u0629 \u0627\u0644\u0645\u062D\u0627\u0648\u0644\u0629'"
+            },
+            "conversationEmptyText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Conversation list: empty state label"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "conversation-empty-text",
+                "defaultValue": "'\u0644\u0627 \u062A\u0648\u062C\u062F \u0645\u062D\u0627\u062F\u062B\u0627\u062A'"
+            },
+            "conversationDeletingId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Conversation list: ID of the conversation currently being deleted \u2014 shows a spinner on that item"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "conversation-deleting-id",
+                "defaultValue": "''"
+            },
             "titleLoading": {
                 "type": "boolean",
                 "mutable": false,
@@ -426,7 +566,8 @@ export class AiChatHeader {
     static get states() {
         return {
             "avatarError": {},
-            "dropdownOpen": {}
+            "dropdownOpen": {},
+            "isFloating": {}
         };
     }
     static get events() {
@@ -446,8 +587,8 @@ export class AiChatHeader {
                     "references": {}
                 }
             }, {
-                "method": "editClick",
-                "name": "editClick",
+                "method": "newChatClick",
+                "name": "newChatClick",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
@@ -483,7 +624,22 @@ export class AiChatHeader {
                 "composed": true,
                 "docs": {
                     "tags": [],
-                    "text": "More options button"
+                    "text": "More options button \u2014 also fires a composed event so ai-chat-container can auto-cycle position"
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "headerPositionClick",
+                "name": "headerPositionClick",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Composed + bubbling event that ai-chat-container listens to internally\nto automatically cycle its position. Fires alongside positionClick."
                 },
                 "complexType": {
                     "original": "void",
@@ -565,6 +721,21 @@ export class AiChatHeader {
                     "resolved": "string",
                     "references": {}
                 }
+            }, {
+                "method": "conversationRetry",
+                "name": "conversationRetry",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Fired when the retry button is clicked in the conversation list error state"
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
             }];
     }
     static get elementRef() { return "el"; }

package/dist/collection/components/ai-conversation-list/ai-conversation-list.css

@@ -161,6 +161,26 @@
   line-height: 0;
 }
 
+.delete-btn--deleting {
+  opacity: 1;
+  cursor: default;
+  pointer-events: none;
+}
+
+.delete-spinner {
+  display: block;
+  width: 12px;
+  height: 12px;
+  border: 2px solid var(--ai-border-default);
+  border-top-color: var(--ai-text-muted);
+  border-radius: 50%;
+  animation: delete-spin 0.7s linear infinite;
+}
+
+@keyframes delete-spin {
+  to { transform: rotate(360deg); }
+}
+
 /* ── Empty state ───────────────────────────────────────── */
 
 .empty-state {

package/dist/collection/components/ai-conversation-list/ai-conversation-list.js

@@ -15,6 +15,8 @@ export class AiConversationList {
     errorText = 'تعذّر تحميل المحادثات';
     /** Retry button label for error state */
     retryLabel = 'إعادة المحاولة';
+    /** ID of the conversation currently being deleted — shows a spinner on that item */
+    deletingId = '';
     conversationSelect;
     conversationDelete;
     retryClick;
@@ -65,7 +67,7 @@ export class AiConversationList {
     }
     render() {
         const showEmpty = !this.loading && !this.error && this.items.length === 0;
-        return (h(Host, { key: 'f869a0422848385a43512486a021e3932e51589d' }, h("div", { key: 'b0f78202691e6329b9a73987f499c20d89b86c4b', class: "conversation-list" }, h("div", { key: '5a007fffa3fe9ef16445395966b1e14d2f516cf9', class: "list-scroll", role: "list" }, this.loading
+        return (h(Host, { key: '8cf17cedd5c41f0d6ffd2d06e557dc370041d1aa' }, h("div", { key: '50f5eeb57228f55d72acf517ed5eeb5d79e13a4b', class: "conversation-list" }, h("div", { key: '763f7cb557fb9abea75e08379d0ea9090b00ac1e', class: "list-scroll", role: "list" }, this.loading
             ? this.renderSkeleton()
             : this.error
                 ? this.renderError()
@@ -73,10 +75,14 @@ export class AiConversationList {
                     ? this.renderEmpty()
                     : this.items.map(item => {
                         const isActive = item.id === this.activeId;
-                        return (h("div", { key: item.id, class: { 'conv-item': true, 'conv-item--active': isActive }, role: "listitem", "aria-current": isActive ? 'true' : undefined, onClick: () => this.conversationSelect.emit(item.id) }, h("div", { class: "conv-item__body" }, h("p", { class: "conv-item__title" }, item.title), h("p", { class: "conv-item__preview" }, item.preview), h("div", { class: "conv-item__meta" }, h("span", { class: "conv-item__time" }, this.formatRelativeTime(item.timestamp)), item.rating != null && this.renderRatingDots(item.rating))), h("button", { class: "delete-btn", "aria-label": "\u062D\u0630\u0641 \u0627\u0644\u0645\u062D\u0627\u062F\u062B\u0629", onClick: e => {
+                        return (h("div", { key: item.id, class: { 'conv-item': true, 'conv-item--active': isActive }, role: "listitem", "aria-current": isActive ? 'true' : undefined, onClick: () => this.conversationSelect.emit(item.id) }, h("div", { class: "conv-item__body" }, h("p", { class: "conv-item__title" }, item.title), h("p", { class: "conv-item__preview" }, item.preview), h("div", { class: "conv-item__meta" }, h("span", { class: "conv-item__time" }, this.formatRelativeTime(item.timestamp)), item.rating != null && this.renderRatingDots(item.rating))), h("button", { class: { 'delete-btn': true, 'delete-btn--deleting': this.deletingId === item.id }, "aria-label": "\u062D\u0630\u0641 \u0627\u0644\u0645\u062D\u0627\u062F\u062B\u0629", disabled: this.deletingId === item.id, onClick: e => {
                                 e.stopPropagation();
+                                if (this.deletingId === item.id)
+                                    return;
                                 this.conversationDelete.emit(item.id);
-                            } }, this.renderIcon('cancel', 14, 14))));
+                            } }, this.deletingId === item.id
+                            ? h("span", { class: "delete-spinner", "aria-label": "\u062C\u0627\u0631\u064A \u0627\u0644\u062D\u0630\u0641" })
+                            : this.renderIcon('cancel', 14, 14))));
                     })))));
     }
     static get is() { return "ai-conversation-list"; }
@@ -236,6 +242,26 @@ export class AiConversationList {
                 "reflect": false,
                 "attribute": "retry-label",
                 "defaultValue": "'\u0625\u0639\u0627\u062F\u0629 \u0627\u0644\u0645\u062D\u0627\u0648\u0644\u0629'"
+            },
+            "deletingId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "ID of the conversation currently being deleted \u2014 shows a spinner on that item"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "deleting-id",
+                "defaultValue": "''"
             }
         };
     }

package/dist/collection/components/ai-in-chat-browser/ai-in-chat-browser.css

@@ -6,16 +6,6 @@
   margin: calc(-1 * var(--ai-spacing-2xl, 16px));
 }
 
-/* ── Container ──────────────────────────────────────────────────── */
-.browser-container {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  background: var(--ai-bg-card);
-  overflow: hidden;
-}
-
 /* ── Content Area ───────────────────────────────────────────────── */
 .browser-content {
   flex: 1;

package/dist/collection/components/ai-in-chat-browser/ai-in-chat-browser.js

@@ -2,14 +2,8 @@ import { Host, h } from "@stencil/core";
 export class AiInChatBrowser {
     /** The URL to display inside the in-chat browser iframe */
     url = '';
-    /** Page title shown in the browser header. Defaults to the URL hostname when empty. */
+    /** Page title used as the iframe's accessible title. Defaults to the URL hostname when empty. */
     pageTitle = '';
-    /** Show the drag handle in the header (for floating containers) */
-    isDraggable = false;
-    /** Fired when the user clicks the back / close button to dismiss the browser */
-    browserClose;
-    /** Fired when the user clicks the external-link button */
-    browserOpenExternal;
     isLoading = true;
     hasError = false;
     onUrlChange() {
@@ -20,8 +14,7 @@ export class AiInChatBrowser {
         if (this.pageTitle)
             return this.pageTitle;
         try {
-            const parsed = new URL(this.url);
-            return parsed.hostname;
+            return new URL(this.url).hostname;
         }
         catch {
             return this.url || '';
@@ -34,18 +27,9 @@ export class AiInChatBrowser {
         this.isLoading = false;
         this.hasError = true;
     };
-    handleBack = () => {
-        this.browserClose.emit();
-    };
-    handleOpenExternal = () => {
-        if (this.url) {
-            window.open(this.url, '_blank', 'noopener,noreferrer');
-        }
-        this.browserOpenExternal.emit(this.url);
-    };
     render() {
         const displayTitle = this.getDisplayTitle();
-        return (h(Host, { key: '8486b7a1506c0eb22dea066adfc98ede9e2542c4' }, h("div", { key: '8781447cadcc8f33dba9b6eb6b63e1e1cb6c0cfd', class: "browser-container" }, h("ai-chat-header", { key: 'f30265b9050991ccbe61e0eeb53015f9b56c113b', mode: "browser", pageTitle: displayTitle, pageUrl: this.url, isDraggable: this.isDraggable, onBackClick: this.handleBack, onOpenExternal: () => this.handleOpenExternal() }), h("div", { key: '2d1ecf5b11e882ab1632278edacf55fa264e1a08', class: "browser-content" }, this.isLoading && (h("div", { key: '0e3fc77efa82fb52c5a531b3b30fb81fcee339d8', class: "browser-loading" }, h("div", { key: '09db30ff5f494eedfaf7928389abda72dceb9597', 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 })))))));
+        return (h(Host, { key: '2d3bb12516396aaf8ca4df1e63e954cc06b2f01d' }, h("div", { key: '3c6f179eb59c982ab299910b5a1941d9b9d17d09', class: "browser-content" }, this.isLoading && (h("div", { key: '0228954a8cfaafed42f1efb5eb1ca5f160bc29e0', class: "browser-loading" }, h("div", { key: 'ccc49943a0af13afdbf1dcee8be0e3d712ac54d6', 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 }))))));
     }
     static get is() { return "ai-in-chat-browser"; }
     static get encapsulation() { return "shadow"; }
@@ -83,7 +67,7 @@ export class AiInChatBrowser {
             },
             "pageTitle": {
                 "type": "string",
-                "mutable": true,
+                "mutable": false,
                 "complexType": {
                     "original": "string",
                     "resolved": "string",
@@ -93,33 +77,13 @@ export class AiInChatBrowser {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Page title shown in the browser header. Defaults to the URL hostname when empty."
+                    "text": "Page title used as the iframe's accessible title. Defaults to the URL hostname when empty."
                 },
                 "getter": false,
                 "setter": false,
                 "reflect": false,
                 "attribute": "page-title",
                 "defaultValue": "''"
-            },
-            "isDraggable": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Show the drag handle in the header (for floating containers)"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "is-draggable",
-                "defaultValue": "false"
             }
         };
     }
@@ -129,39 +93,6 @@ export class AiInChatBrowser {
             "hasError": {}
         };
     }
-    static get events() {
-        return [{
-                "method": "browserClose",
-                "name": "browserClose",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Fired when the user clicks the back / close button to dismiss the browser"
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "browserOpenExternal",
-                "name": "browserOpenExternal",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Fired when the user clicks the external-link button"
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
-            }];
-    }
     static get watchers() {
         return [{
                 "propName": "url",

package/dist/collection/components/ai-link/ai-link.js

@@ -18,7 +18,7 @@ export class AiLink {
     }
     render() {
         const rel = this.rel || (this.target === '_blank' ? 'noopener noreferrer' : undefined);
-        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())));
+        return (h(Host, { key: '98087503b9a0803425b23f7ee00c95025493679d' }, h("span", { key: '41495d6375d1c539b777b3cd38e7b7af8fcbbb9b', class: "link__label" }, this.label, h("slot", { key: 'f416955b31900039f03b0e7ee2e537a22964d553' })), h("a", { key: '4f1d74ff6c600d17fcf80686aeebc5a92a4c7305', class: "link", href: this.href, target: this.target, rel: rel }, this.renderShareIcon())));
     }
     static get is() { return "ai-link"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ai-loading/ai-loading.js

@@ -72,7 +72,7 @@ export class AiLoading {
         return (h("div", { class: "steps-card" }, h("div", { class: `steps-header ${this.collapsible ? 'collapsible' : ''}`, onClick: () => this.handleToggle() }, this.renderSparkleAvatar(this.currentAgent || undefined), h("div", { class: "steps-header-center" }, h("span", { class: "steps-title" }, this.headerTitle), headerBadge()), this.collapsible && h("button", { class: `collapse-btn ${this._expanded ? 'expanded' : ''}` }, this.renderIcon('chevron-down', 20, 20))), this._expanded && total === 0 && this.renderPlanningShimmer(), this._expanded && total > 0 && (h("div", { class: "steps-body" }, this.steps.map((step, i) => (h("div", { class: `step-row ${step.status}`, onClick: () => this.stepClick.emit(step) }, h("div", { class: "step-badge-col" }, this.renderStepBadge(step, i), i < this.steps.length - 1 && h("div", { class: "step-separator" })), h("div", { class: "step-content" }, h("span", { class: "step-text" }, step.action), step.reason && h("span", { class: "step-description" }, step.reason)))))))));
     }
     render() {
-        return h(Host, { key: 'f4523c26d9ce0d9bf14b313e4b10cadd2fc2b95f' }, this.mode === 'thinking' ? this.renderThinkingMode() : this.renderStepsMode());
+        return h(Host, { key: '2053fe1e8a1fcb1ec7441a5d32952ec1f186a5bb' }, this.mode === 'thinking' ? this.renderThinkingMode() : this.renderStepsMode());
     }
     static get is() { return "ai-loading"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ai-route-decision/ai-route-decision.js

@@ -31,7 +31,7 @@ export class AiRouteDecision {
         this.routeExpand.emit(this._expanded);
     }
     render() {
-        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))))))));
+        return (h(Host, { key: 'fa9b966cf28225fa458fb00d1114fade995258c5' }, h("div", { key: '5263c969fd1672e1d302f06173dcdbe4450b162e', class: `route-pill ${this._expanded ? 'expanded' : ''}` }, h("button", { key: 'bf7800e828b0b61174f75343fcf9bca3134dfb2a', class: "route-pill-main", onClick: () => this.handleToggle() }, h("span", { key: '8531aeab0872f59417a37294e780d46962b21ead', class: "route-icon" }, this.renderIcon('route', 14, 14)), h("span", { key: '754529860d90a3ceb4f226ff85b1aecb40f4649e', class: "agent-label" }, this.agentIcon && h("span", { key: '39682d3a761d2cd6fae794fcb6036b0044f8f2dc', class: "agent-emoji", "aria-hidden": "true" }, this.agentIcon), this.selectedAgent), this.confidence > 0 && (h("span", { key: '36b3a921ab75c1faa0ece5f286703bf1b0aaca16', class: "confidence-badge" }, this.confidence, "%")), h("span", { key: 'c5199e986bf35d187cad16027f23e62addc45ecb', class: `expand-icon ${this._expanded ? 'expanded' : ''}` }, this.renderIcon('arrow-right', 12, 12))), this._expanded && (h("div", { key: '2a18ae8297ad0d71b14d01d250e15cff452c4b07', class: "route-details" }, this.reason && h("p", { key: '55f5123399929c590fc5c2122fd7220209e5ecac', class: "reason-text" }, this.reason), this.confidence > 0 && (h("div", { key: 'fbc69e8cb7820c87764f46630af8f4a77d2d879b', class: "confidence-bar-wrap" }, h("div", { key: '1db1d454ef64dcf9e4c673d0a26780bd55f563d2', class: "confidence-bar", style: { width: `${this.confidence}%` } }))), this.detectedLanguage && (h("div", { key: '8553d1a20678252b8d4f9a1e9f8b64ce3f509ae5', class: "meta-row" }, this.renderIcon('list', 12, 12), h("span", { key: 'ec104948a04498d06ed73be89778c5b6d84582a2', class: "lang-chip" }, this.detectedLanguage))))))));
     }
     static get is() { return "ai-route-decision"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ai-suggestion/ai-suggestion.js

@@ -11,10 +11,10 @@ export class AiSuggestion {
         this.suggestionClick.emit(this.label);
     }
     render() {
-        return (h(Host, { key: 'c2eb388d152586755e9cc10ac57b519e8ff84b4d' }, h("button", { key: '0b9f6ec6d8c57365e2c29bfe1bfc33993d3cb498', class: {
+        return (h(Host, { key: '510e649f8778e2298270d320f0555c4d960fb056' }, h("button", { key: 'a4ee17cbd432596804279d8a852635608125452a', class: {
                 chip: true,
                 'chip--disabled': this.disabled,
-            }, disabled: this.disabled, onClick: () => this.handleClick() }, h("span", { key: 'd4fabc4c8176cd6837e609bad369e8edfc779855', class: "chip__label" }, this.label, h("slot", { key: 'a1074453e53982f10fd2115c2b15d7a7b20eda07' })))));
+            }, disabled: this.disabled, onClick: () => this.handleClick() }, h("span", { key: 'cb2d97459b0dd6effe83bbfb81a0af9144759477', class: "chip__label" }, this.label, h("slot", { key: 'ce84f07883f24c216c45da9266af5160baea9cdc' })))));
     }
     static get is() { return "ai-suggestion"; }
     static get encapsulation() { return "shadow"; }