@buni.ai/chatbot-angular 1.0.28 → 1.0.29
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/index.esm.js +47 -7
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +47 -7
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -528,27 +528,33 @@ class BuniChatWidget {
|
|
|
528
528
|
if (!this.widgetElement || !this.chatIframe || !this.triggerIframe)
|
|
529
529
|
return;
|
|
530
530
|
const position = ((_a = this.options.config) === null || _a === void 0 ? void 0 : _a.position) || "bottom-right";
|
|
531
|
+
// Use a conservative initial height; the iframe will report the exact
|
|
532
|
+
// rendered card height via "minimal_card_size" and we'll resize then.
|
|
533
|
+
const initialMinimalHeight = "420px";
|
|
531
534
|
this.widgetElement.style.cssText = `
|
|
532
535
|
position: fixed;
|
|
533
536
|
pointer-events: none;
|
|
534
537
|
z-index: 999999;
|
|
535
538
|
width: min(calc(100vw - 1.5rem), 390px);
|
|
536
539
|
max-width: min(calc(100vw - 1.5rem), 390px);
|
|
537
|
-
height:
|
|
538
|
-
max-height:
|
|
539
|
-
min-height: 0;
|
|
540
|
+
height: ${initialMinimalHeight};
|
|
541
|
+
max-height: ${initialMinimalHeight};
|
|
540
542
|
transition: width 0.3s ease, height 0.3s ease, border-radius 0.3s ease;
|
|
541
543
|
${this.getPositionStyles(position, true)}
|
|
542
544
|
display: block;
|
|
543
|
-
overflow:
|
|
545
|
+
overflow: hidden;
|
|
546
|
+
border-radius: 16px;
|
|
547
|
+
box-shadow: 0 18px 40px -24px rgba(15, 23, 42, 0.45);
|
|
544
548
|
box-sizing: border-box;
|
|
545
549
|
`;
|
|
546
550
|
this.triggerIframe.style.display = "none";
|
|
547
551
|
this.chatIframe.style.display = "block";
|
|
548
552
|
this.chatIframe.style.visibility = "visible";
|
|
549
553
|
this.chatIframe.style.width = "100%";
|
|
550
|
-
this.chatIframe.style.height =
|
|
551
|
-
this.chatIframe.style.maxHeight =
|
|
554
|
+
this.chatIframe.style.height = initialMinimalHeight;
|
|
555
|
+
this.chatIframe.style.maxHeight = initialMinimalHeight;
|
|
556
|
+
this.chatIframe.style.borderRadius = "0";
|
|
557
|
+
this.chatIframe.style.boxShadow = "none";
|
|
552
558
|
}
|
|
553
559
|
async openChat() {
|
|
554
560
|
if (!this.chatIframe || !this.widgetElement || !this.triggerIframe)
|
|
@@ -599,6 +605,11 @@ class BuniChatWidget {
|
|
|
599
605
|
this.triggerIframe.style.display = "none";
|
|
600
606
|
this.chatIframe.style.display = "block";
|
|
601
607
|
this.chatIframe.style.visibility = "visible";
|
|
608
|
+
// Restore full-mode iframe styles that may have been overridden in minimal mode
|
|
609
|
+
this.chatIframe.style.height = "100%";
|
|
610
|
+
this.chatIframe.style.maxHeight = "100%";
|
|
611
|
+
this.chatIframe.style.borderRadius = isMobile ? "0" : "16px";
|
|
612
|
+
this.chatIframe.style.boxShadow = isMobile ? "none" : "0 8px 32px rgba(0,0,0,0.15)";
|
|
602
613
|
this.state.isMinimized = false;
|
|
603
614
|
this.state.isOpen = true;
|
|
604
615
|
this.displayMode = "full";
|
|
@@ -727,8 +738,17 @@ class BuniChatWidget {
|
|
|
727
738
|
this.options.onNewMessage(data);
|
|
728
739
|
}
|
|
729
740
|
break;
|
|
730
|
-
case "minimized":
|
|
741
|
+
case "minimized": {
|
|
731
742
|
this.syncServerBehaviorFromData(data);
|
|
743
|
+
const reportedDisplayMode = (data === null || data === void 0 ? void 0 : data.displayMode) === "minimal" || (data === null || data === void 0 ? void 0 : data.displayMode) === "hidden"
|
|
744
|
+
? data.displayMode
|
|
745
|
+
: null;
|
|
746
|
+
if (reportedDisplayMode === "hidden") {
|
|
747
|
+
this.closeChat();
|
|
748
|
+
this.displayMode = "hidden";
|
|
749
|
+
this.state.displayMode = "hidden";
|
|
750
|
+
break;
|
|
751
|
+
}
|
|
732
752
|
if (this.isMinimalModeEnabled()) {
|
|
733
753
|
this.displayMode = "minimal";
|
|
734
754
|
this.state.displayMode = "minimal";
|
|
@@ -741,6 +761,7 @@ class BuniChatWidget {
|
|
|
741
761
|
this.closeChat();
|
|
742
762
|
}
|
|
743
763
|
break;
|
|
764
|
+
}
|
|
744
765
|
case "new_unread_message":
|
|
745
766
|
// Update unread count in trigger
|
|
746
767
|
this.state.unreadCount++;
|
|
@@ -762,6 +783,25 @@ class BuniChatWidget {
|
|
|
762
783
|
this.options.onError(data.error);
|
|
763
784
|
}
|
|
764
785
|
break;
|
|
786
|
+
case "maximized":
|
|
787
|
+
// The iframe has switched to full mode (e.g. user clicked expand from
|
|
788
|
+
// minimal card). Resize the host container to the configured full size.
|
|
789
|
+
void this.openChat();
|
|
790
|
+
break;
|
|
791
|
+
case "minimal_card_size":
|
|
792
|
+
// The iframe reports its rendered card height so we can shrink the
|
|
793
|
+
// container to wrap the card tightly. Without this the host-page
|
|
794
|
+
// box-shadow renders around the full container, appearing as padding.
|
|
795
|
+
// Only apply when still in minimal mode to avoid overriding a pending
|
|
796
|
+
// full-mode transition.
|
|
797
|
+
if (this.widgetElement && this.chatIframe && (data === null || data === void 0 ? void 0 : data.height) > 0 && this.displayMode === "minimal") {
|
|
798
|
+
const h = `${data.height}px`;
|
|
799
|
+
this.widgetElement.style.height = h;
|
|
800
|
+
this.widgetElement.style.maxHeight = h;
|
|
801
|
+
this.chatIframe.style.height = h;
|
|
802
|
+
this.chatIframe.style.maxHeight = h;
|
|
803
|
+
}
|
|
804
|
+
break;
|
|
765
805
|
}
|
|
766
806
|
});
|
|
767
807
|
}
|