@bigz-app/booking-widget 0.3.9 → 0.3.10

package/dist/components/PromoDialog.d.ts

@@ -2,6 +2,6 @@ interface PromoDialogProps {
     onClose: () => void;
     onCtaClick: () => void;
 }
-export declare function PromoDialog({ onClose, onCtaClick }: PromoDialogProps): import("react/jsx-runtime").JSX.Element;
+export declare function PromoDialog({ onClose, onCtaClick }: PromoDialogProps): import("react").ReactPortal | null;
 export {};
 //# sourceMappingURL=PromoDialog.d.ts.map

package/dist/components/PromoDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PromoDialog.d.ts","sourceRoot":"","sources":["../../src/components/PromoDialog.tsx"],"names":[],"mappings":"AAIA,UAAU,gBAAgB;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,gBAAgB,2CA6apE"}
+{"version":3,"file":"PromoDialog.d.ts","sourceRoot":"","sources":["../../src/components/PromoDialog.tsx"],"names":[],"mappings":"AAKA,UAAU,gBAAgB;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,EAAE,gBAAgB,sCAocpE"}

package/dist/index.cjs

@@ -12248,8 +12248,21 @@ function NextEventsPreview({ events, onEventSelect, onShowAll, showAllButtonText
 function PromoDialog({ onClose, onCtaClick }) {
     const [copied, setCopied] = React__default.useState(false);
     const [isVisible, setIsVisible] = React__default.useState(false);
+    const [portalContainer, setPortalContainer] = React__default.useState(null);
     // Hardcoded Xmas surf school content
     const discountCode = "X-MAS";
+    // Create portal container on mount to escape stacking context issues
+    React__default.useEffect(() => {
+        const container = document.createElement("div");
+        container.id = "bigz-promo-dialog-portal";
+        container.style.position = "relative";
+        container.style.zIndex = "2147483647"; // Maximum z-index value
+        document.body.appendChild(container);
+        setPortalContainer(container);
+        return () => {
+            document.body.removeChild(container);
+        };
+    }, []);
     // Animate in on mount
     React__default.useEffect(() => {
         const timer = setTimeout(() => setIsVisible(true), 50);
@@ -12281,7 +12294,11 @@ function PromoDialog({ onClose, onCtaClick }) {
         setIsVisible(false);
         setTimeout(onCtaClick, 200);
     };
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("style", { children: `
+    // Don't render until portal container is ready
+    if (!portalContainer) {
+        return null;
+    }
+    const dialogContent = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("style", { children: `
 					@keyframes promo-wave {
 						0%, 100% { transform: translateX(0) translateY(0); }
 						25% { transform: translateX(5px) translateY(-3px); }
@@ -12311,7 +12328,7 @@ function PromoDialog({ onClose, onCtaClick }) {
                     inset: 0,
                     backgroundColor: "rgba(0, 20, 40, 0.85)",
                     backdropFilter: "blur(8px)",
-                    zIndex: 9998,
+                    zIndex: 60,
                     opacity: isVisible ? 1 : 0,
                     transition: "opacity 300ms ease-out",
                 } }), jsxRuntime.jsx("div", { style: {
@@ -12319,7 +12336,7 @@ function PromoDialog({ onClose, onCtaClick }) {
                     top: "50%",
                     left: "50%",
                     transform: `translate(-50%, -50%) scale(${isVisible ? 1 : 0.9})`,
-                    zIndex: 9999,
+                    zIndex: 61,
                     width: "92%",
                     maxWidth: "440px",
                     opacity: isVisible ? 1 : 0,
@@ -12500,6 +12517,8 @@ function PromoDialog({ onClose, onCtaClick }) {
                                         fontSize: "12px",
                                         color: "rgba(255,255,255,0.6)",
                                     }, children: "G\u00FCltig f\u00FCr alle Buchungen bis 31. Dezember 2025" })] })] }) })] }));
+    // Use portal to render at document body level, escaping any stacking context
+    return ReactDOM.createPortal(dialogContent, portalContainer);
 }
 
 // Predefined themes & Style Provider have been moved to ../styles/StyleProvider.tsx