@buni.ai/chatbot-angular 1.0.28 → 1.0.29

package/dist/index.esm.js

@@ -526,27 +526,33 @@ class BuniChatWidget {
         if (!this.widgetElement || !this.chatIframe || !this.triggerIframe)
             return;
         const position = ((_a = this.options.config) === null || _a === void 0 ? void 0 : _a.position) || "bottom-right";
+        // Use a conservative initial height; the iframe will report the exact
+        // rendered card height via "minimal_card_size" and we'll resize then.
+        const initialMinimalHeight = "420px";
         this.widgetElement.style.cssText = `
       position: fixed;
       pointer-events: none;
       z-index: 999999;
       width: min(calc(100vw - 1.5rem), 390px);
       max-width: min(calc(100vw - 1.5rem), 390px);
-      height: auto;
-      max-height: none;
-      min-height: 0;
+      height: ${initialMinimalHeight};
+      max-height: ${initialMinimalHeight};
       transition: width 0.3s ease, height 0.3s ease, border-radius 0.3s ease;
       ${this.getPositionStyles(position, true)}
       display: block;
-      overflow: visible;
+      overflow: hidden;
+      border-radius: 16px;
+      box-shadow: 0 18px 40px -24px rgba(15, 23, 42, 0.45);
       box-sizing: border-box;
     `;
         this.triggerIframe.style.display = "none";
         this.chatIframe.style.display = "block";
         this.chatIframe.style.visibility = "visible";
         this.chatIframe.style.width = "100%";
-        this.chatIframe.style.height = "min(calc(100vh - 1.5rem), 520px)";
-        this.chatIframe.style.maxHeight = "min(calc(100vh - 1.5rem), 520px)";
+        this.chatIframe.style.height = initialMinimalHeight;
+        this.chatIframe.style.maxHeight = initialMinimalHeight;
+        this.chatIframe.style.borderRadius = "0";
+        this.chatIframe.style.boxShadow = "none";
     }
     async openChat() {
         if (!this.chatIframe || !this.widgetElement || !this.triggerIframe)
@@ -597,6 +603,11 @@ class BuniChatWidget {
         this.triggerIframe.style.display = "none";
         this.chatIframe.style.display = "block";
         this.chatIframe.style.visibility = "visible";
+        // Restore full-mode iframe styles that may have been overridden in minimal mode
+        this.chatIframe.style.height = "100%";
+        this.chatIframe.style.maxHeight = "100%";
+        this.chatIframe.style.borderRadius = isMobile ? "0" : "16px";
+        this.chatIframe.style.boxShadow = isMobile ? "none" : "0 8px 32px rgba(0,0,0,0.15)";
         this.state.isMinimized = false;
         this.state.isOpen = true;
         this.displayMode = "full";
@@ -725,8 +736,17 @@ class BuniChatWidget {
                         this.options.onNewMessage(data);
                     }
                     break;
-                case "minimized":
+                case "minimized": {
                     this.syncServerBehaviorFromData(data);
+                    const reportedDisplayMode = (data === null || data === void 0 ? void 0 : data.displayMode) === "minimal" || (data === null || data === void 0 ? void 0 : data.displayMode) === "hidden"
+                        ? data.displayMode
+                        : null;
+                    if (reportedDisplayMode === "hidden") {
+                        this.closeChat();
+                        this.displayMode = "hidden";
+                        this.state.displayMode = "hidden";
+                        break;
+                    }
                     if (this.isMinimalModeEnabled()) {
                         this.displayMode = "minimal";
                         this.state.displayMode = "minimal";
@@ -739,6 +759,7 @@ class BuniChatWidget {
                         this.closeChat();
                     }
                     break;
+                }
                 case "new_unread_message":
                     // Update unread count in trigger
                     this.state.unreadCount++;
@@ -760,6 +781,25 @@ class BuniChatWidget {
                         this.options.onError(data.error);
                     }
                     break;
+                case "maximized":
+                    // The iframe has switched to full mode (e.g. user clicked expand from
+                    // minimal card). Resize the host container to the configured full size.
+                    void this.openChat();
+                    break;
+                case "minimal_card_size":
+                    // The iframe reports its rendered card height so we can shrink the
+                    // container to wrap the card tightly. Without this the host-page
+                    // box-shadow renders around the full container, appearing as padding.
+                    // Only apply when still in minimal mode to avoid overriding a pending
+                    // full-mode transition.
+                    if (this.widgetElement && this.chatIframe && (data === null || data === void 0 ? void 0 : data.height) > 0 && this.displayMode === "minimal") {
+                        const h = `${data.height}px`;
+                        this.widgetElement.style.height = h;
+                        this.widgetElement.style.maxHeight = h;
+                        this.chatIframe.style.height = h;
+                        this.chatIframe.style.maxHeight = h;
+                    }
+                    break;
             }
         });
     }