@sonordev/site-kit 7.1.2 → 7.2.0

package/dist/chunk-YCJT4JJG.js

@@ -1,837 +0,0 @@
-'use client';
-import { DEFAULT_ENGAGE_Z_INDEX } from './chunk-NDF4A5JM.js';
-import { getOrCreateVisitorId } from './chunk-24QZEO3Q.js';
-import { resolveAnalyticsTarget } from './chunk-43OCZ3JA.js';
-import { sonorFetch } from './chunk-3SDOQUUF.js';
-import React, { useState, useEffect, useCallback, useRef, createElement } from 'react';
-import ReactDOM from 'react-dom';
-import dynamic from 'next/dynamic';
-import { usePathname } from 'next/navigation';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-
-// src/engage/element-rules.ts
-function hasControlOrSpace(value) {
-  for (let i = 0; i < value.length; i++) {
-    const code = value.charCodeAt(i);
-    if (code <= 32 || code >= 127 && code <= 159) return true;
-  }
-  return false;
-}
-function isSitePath(value) {
-  return value.startsWith("/") && !value.startsWith("//") && !value.startsWith("/\\");
-}
-function safeActionUrl(raw) {
-  if (typeof raw !== "string") return void 0;
-  const value = raw.trim();
-  if (!value || hasControlOrSpace(value)) return void 0;
-  if (value.startsWith("#") || isSitePath(value)) return value;
-  const scheme = /^([a-z][a-z0-9+.-]*):/i.exec(value)?.[1]?.toLowerCase();
-  return scheme && ["http", "https", "mailto", "tel"].includes(scheme) ? value : void 0;
-}
-function safeImageSrc(raw) {
-  if (typeof raw !== "string") return void 0;
-  const value = raw.trim();
-  if (!value || hasControlOrSpace(value)) return void 0;
-  if (isSitePath(value)) return value;
-  return /^https?:\/\//i.test(value) ? value : void 0;
-}
-function matchPath(pathname, pattern) {
-  if (pattern.endsWith("*")) return pathname.startsWith(pattern.slice(0, -1));
-  return pathname === pattern;
-}
-function deviceFromUserAgent(ua) {
-  if (/tablet|ipad|playbook|silk/i.test(ua)) return "tablet";
-  if (/mobile|iphone|ipod|android|blackberry|opera mini|iemobile/i.test(ua)) return "mobile";
-  return "desktop";
-}
-function seenKey(elementId) {
-  return `_engage_${elementId}`;
-}
-function isEligible(element, pathname, device, store, now = Date.now()) {
-  const pages = element.targeting?.pages;
-  if (pages) {
-    if (pages.exclude?.some((p) => matchPath(pathname, p))) return false;
-    if (pages.include && !pages.include.some((p) => matchPath(pathname, p))) return false;
-  }
-  if (element.targeting?.devices && !element.targeting.devices.includes(device)) return false;
-  const frequency = element.trigger?.frequency;
-  if (frequency) {
-    const key = seenKey(element.id);
-    if (frequency.type === "once") {
-      if (store.local?.getItem(key)) return false;
-    } else if (frequency.type === "once-per-session") {
-      if (store.session?.getItem(key)) return false;
-    } else if (frequency.type === "every-n-days" && frequency.days) {
-      const last = store.local?.getItem(key);
-      if (last && now - parseInt(last, 10) < frequency.days * 864e5) return false;
-    }
-  }
-  return true;
-}
-function activateElement(active, id, elements) {
-  if (active.includes(id)) return active;
-  const typeOf = (elementId) => elements.find((e) => e.id === elementId)?.type;
-  if (typeOf(id) === "popup" && active.some((other) => typeOf(other) === "popup")) return active;
-  return [...active, id];
-}
-function handleAction(action, node, onClose, onAction) {
-  if (!action?.action || action.action === "none") return;
-  if (onAction) {
-    onAction(action, node);
-  }
-  switch (action.action) {
-    case "link": {
-      const url = safeActionUrl(action.url);
-      if (url) {
-        if (action.newTab) {
-          window.open(url, "_blank", "noopener,noreferrer");
-        } else {
-          window.location.href = url;
-        }
-      }
-      break;
-    }
-    case "scroll":
-      if (action.target) {
-        const element = document.querySelector(action.target);
-        element?.scrollIntoView({ behavior: "smooth" });
-      }
-      break;
-    case "close":
-      onClose?.();
-      break;
-    case "copy":
-      if (action.text) {
-        navigator.clipboard.writeText(action.text).catch(console.error);
-      }
-      break;
-    case "share":
-      if (navigator.share) {
-        navigator.share({
-          title: document.title,
-          url: window.location.href
-        }).catch(console.error);
-      }
-      break;
-    case "download": {
-      const url = safeActionUrl(action.url);
-      if (url) {
-        const a = document.createElement("a");
-        a.href = url;
-        a.download = "";
-        a.click();
-      }
-      break;
-    }
-  }
-}
-var animationKeyframes = `
-@keyframes engageFadeIn { from { opacity: 0; } to { opacity: 1; } }
-@keyframes engageFadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
-@keyframes engageFadeInDown { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } }
-@keyframes engageSlideInLeft { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } }
-@keyframes engageSlideInRight { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }
-@keyframes engageSlideInUp { from { opacity: 0; transform: translateY(100%); } to { opacity: 1; transform: translateY(0); } }
-@keyframes engageScaleIn { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } }
-@keyframes engageBounceIn { 0% { opacity: 0; transform: scale(0.3); } 50% { transform: scale(1.05); } 70% { transform: scale(0.9); } 100% { opacity: 1; transform: scale(1); } }
-`;
-function getAnimationStyle(animation, delay, duration) {
-  if (!animation || animation === "none") return {};
-  const animationMap = {
-    fadeIn: "engageFadeIn",
-    fadeInUp: "engageFadeInUp",
-    fadeInDown: "engageFadeInDown",
-    slideInLeft: "engageSlideInLeft",
-    slideInRight: "engageSlideInRight",
-    slideInUp: "engageSlideInUp",
-    scaleIn: "engageScaleIn",
-    bounceIn: "engageBounceIn"
-  };
-  const animationName = animationMap[animation];
-  if (!animationName) return {};
-  return {
-    animation: `${animationName} ${duration || 300}ms ease-out ${delay || 0}ms forwards`,
-    opacity: 0
-    // Start invisible, animation will show it
-  };
-}
-function NodeRenderer({ node, onClose, onAction, context }) {
-  const [isHovered, setIsHovered] = useState(false);
-  const { type, props = {}, style = {}, children } = node;
-  const computedStyle = { ...style };
-  if (props.animation) {
-    Object.assign(computedStyle, getAnimationStyle(
-      props.animation,
-      props.animationDelay,
-      props.animationDuration
-    ));
-  }
-  if (isHovered) {
-    if (props.hoverScale && props.hoverScale !== "none") {
-      computedStyle.transform = `scale(${props.hoverScale})`;
-      computedStyle.transition = "transform 0.2s ease";
-    }
-    if (props.hoverShadow && props.hoverShadow !== "none") {
-      const shadowMap = {
-        sm: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
-        md: "0 4px 6px -1px rgb(0 0 0 / 0.1)",
-        lg: "0 10px 15px -3px rgb(0 0 0 / 0.1)"
-      };
-      computedStyle.boxShadow = shadowMap[props.hoverShadow];
-    }
-  }
-  const eventHandlers = {
-    onMouseEnter: () => setIsHovered(true),
-    onMouseLeave: () => setIsHovered(false)
-  };
-  if (props.onClick) {
-    eventHandlers.onClick = (e) => {
-      e.preventDefault();
-      handleAction(props.onClick, node, onClose, onAction);
-    };
-    computedStyle.cursor = "pointer";
-  }
-  const renderedChildren = children?.map((child) => /* @__PURE__ */ jsx(
-    NodeRenderer,
-    {
-      node: child,
-      onClose,
-      onAction,
-      context
-    },
-    child.id
-  ));
-  switch (type) {
-    case "Container":
-    case "Box":
-    case "Section":
-      return /* @__PURE__ */ jsx("div", { style: computedStyle, ...eventHandlers, children: renderedChildren });
-    case "Text":
-      return /* @__PURE__ */ jsx("p", { style: computedStyle, ...eventHandlers, children: resolveText(props.text, context) });
-    case "Heading":
-      const HeadingTag = `h${props.level || 2}`;
-      return createElement(
-        HeadingTag,
-        { style: computedStyle, ...eventHandlers },
-        resolveText(props.text, context)
-      );
-    case "Button":
-    case "BookingButton":
-    case "BuyNow":
-    case "AddToCart":
-    case "EventRSVP":
-      return /* @__PURE__ */ jsx(
-        "button",
-        {
-          style: computedStyle,
-          ...eventHandlers,
-          type: "button",
-          "aria-label": typeof props.ariaLabel === "string" ? props.ariaLabel : void 0,
-          children: resolveText(props.text || props.label, context) || "Button"
-        }
-      );
-    case "Image":
-      return /* @__PURE__ */ jsx(
-        "img",
-        {
-          src: safeImageSrc(props.src),
-          alt: props.alt || "",
-          style: computedStyle,
-          ...eventHandlers
-        }
-      );
-    case "Link":
-      return /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: safeActionUrl(props.href) ?? "#",
-          target: props.newTab ? "_blank" : void 0,
-          rel: props.newTab ? "noopener noreferrer" : void 0,
-          style: computedStyle,
-          ...eventHandlers,
-          children: resolveText(props.text, context) || renderedChildren
-        }
-      );
-    case "Input":
-      return /* @__PURE__ */ jsx(
-        "input",
-        {
-          type: props.inputType || "text",
-          placeholder: props.placeholder,
-          style: computedStyle,
-          ...eventHandlers
-        }
-      );
-    case "Divider":
-      return /* @__PURE__ */ jsx("hr", { style: { border: "none", borderTop: "1px solid var(--sk-border, #e5e7eb)", ...computedStyle } });
-    case "Spacer":
-      return /* @__PURE__ */ jsx("div", { style: { ...computedStyle, width: props.width, height: props.height } });
-    case "Icon":
-      return /* @__PURE__ */ jsx("span", { style: computedStyle, ...eventHandlers, children: props.icon || "\u2605" });
-    case "FormEmbed":
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          style: computedStyle,
-          "data-engage-form": props.form_id,
-          ...eventHandlers,
-          children: /* @__PURE__ */ jsxs("div", { style: { padding: "16px", background: "var(--sk-bg-elevated, #f5f5f5)", borderRadius: "8px", textAlign: "center" }, children: [
-            "Form: ",
-            props.form_id || "Not configured"
-          ] })
-        }
-      );
-    case "ProductCard":
-    case "EventCard":
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          style: computedStyle,
-          "data-engage-offering": props.offering_id,
-          ...eventHandlers,
-          children: renderedChildren
-        }
-      );
-    default:
-      console.warn(`[DesignRenderer] Unknown node type: ${type}`);
-      return /* @__PURE__ */ jsx("div", { style: computedStyle, ...eventHandlers, children: renderedChildren });
-  }
-}
-function resolveText(text, context) {
-  if (!text) return "";
-  if (!context) return text;
-  return text.replace(/\{\{(\w+(?:\.\w+)*)\}\}/g, (match, path) => {
-    const value = getNestedValue(context, path);
-    return value !== void 0 ? String(value) : match;
-  });
-}
-function getNestedValue(obj, path) {
-  return path.split(".").reduce((acc, key) => acc?.[key], obj);
-}
-function DesignRenderer({
-  design,
-  onClose,
-  onAction,
-  context
-}) {
-  React.useEffect(() => {
-    if (typeof document === "undefined") return;
-    const styleId = "engage-design-renderer-animations";
-    if (!document.getElementById(styleId)) {
-      const styleSheet = document.createElement("style");
-      styleSheet.id = styleId;
-      styleSheet.textContent = animationKeyframes;
-      document.head.appendChild(styleSheet);
-    }
-  }, []);
-  const rootStyle = {
-    ...design.style
-  };
-  return /* @__PURE__ */ jsx("div", { style: rootStyle, "data-engage-design": design.id, children: design.children?.map((node) => /* @__PURE__ */ jsx(
-    NodeRenderer,
-    {
-      node,
-      onClose,
-      onAction,
-      context
-    },
-    node.id
-  )) });
-}
-var LazyBlocksPopup = dynamic(
-  () => import('./BlocksPopup-EA6LYL25.js').then((m) => ({ default: m.BlocksPopup })),
-  { ssr: false }
-);
-var LazyChatWidget = dynamic(
-  () => import('./ChatWidget-UCDWMWCW.js').then((m) => ({ default: m.ChatWidget })),
-  { ssr: false }
-);
-function EngageWidget(props) {
-  const target = resolveAnalyticsTarget(props);
-  if (!target) return null;
-  return /* @__PURE__ */ jsx(AllowedEngageWidget, { ...props, ...target });
-}
-function AllowedEngageWidget({
-  apiUrl: propApiUrl,
-  apiKey: propApiKey,
-  projectId: propProjectId,
-  position = "bottom-right",
-  offsetBottom,
-  zIndex = DEFAULT_ENGAGE_Z_INDEX,
-  chatEnabled = true,
-  popupsEnabled = true,
-  debug = false
-}) {
-  const pathname = usePathname();
-  const [elements, setElements] = useState([]);
-  const [activeElements, setActiveElements] = useState([]);
-  const [dismissedElements, setDismissedElements] = useState(/* @__PURE__ */ new Set());
-  const [chatReady, setChatReady] = useState(false);
-  useEffect(() => {
-    if (!popupsEnabled) return;
-    async function loadElements() {
-      const apiUrl = propApiUrl;
-      const apiKey = propApiKey;
-      if (!apiKey) {
-        if (debug) console.warn("[Engage] No API key configured");
-        return;
-      }
-      const visitorId = getOrCreateVisitorId();
-      const url = typeof window !== "undefined" ? window.location.href : "";
-      try {
-        const response = await sonorFetch(
-          `${apiUrl.replace(/\/$/, "")}/engage/widget/elements?url=${encodeURIComponent(url)}&visitorId=${encodeURIComponent(visitorId)}&deviceType=${getDeviceType()}`,
-          {},
-          { apiKey }
-        );
-        if (!response.ok) {
-          if (debug) console.error("[Engage] Error loading elements:", response.statusText);
-          return;
-        }
-        const json = await response.json();
-        const elementsList = json.data?.elements ?? json.elements ?? [];
-        if (debug) console.log("[Engage] Loaded elements:", elementsList);
-        setElements(elementsList);
-      } catch (error) {
-        if (debug) console.error("[Engage] Error loading elements:", error);
-      }
-    }
-    loadElements();
-  }, [propApiUrl, propApiKey, debug, popupsEnabled]);
-  useEffect(() => {
-    if (!chatEnabled) return;
-    const id = typeof requestIdleCallback !== "undefined" ? requestIdleCallback(() => setChatReady(true), { timeout: 3e3 }) : setTimeout(() => setChatReady(true), 1);
-    return () => {
-      typeof cancelIdleCallback !== "undefined" ? cancelIdleCallback(id) : clearTimeout(id);
-    };
-  }, [chatEnabled]);
-  useEffect(() => {
-    if (!elements.length) return;
-    const store = { local: storageOrNull("local"), session: storageOrNull("session") };
-    const device = getDeviceType();
-    const eligible = elements.filter(
-      (element) => !dismissedElements.has(element.id) && isEligible(element, pathname, device, store)
-    );
-    if (debug) console.log("[Engage] Eligible elements:", eligible);
-    const eligibleIds = new Set(eligible.map((e) => e.id));
-    setActiveElements((prev) => {
-      const kept = prev.filter((id) => eligibleIds.has(id));
-      return kept.length === prev.length ? prev : kept;
-    });
-    const activate = (id) => {
-      setActiveElements((prev) => activateElement(prev, id, elements));
-    };
-    const cleanups = [];
-    eligible.forEach((element) => {
-      const trigger = element.trigger;
-      if (trigger?.type === "immediate" || !trigger?.type) {
-        activate(element.id);
-      } else if (trigger?.type === "delay" && trigger.delay) {
-        const timer = setTimeout(() => activate(element.id), trigger.delay * 1e3);
-        cleanups.push(() => clearTimeout(timer));
-      } else if (trigger?.type === "exit-intent") {
-        const handleMouseLeave = (e) => {
-          if (e.clientY < 10) {
-            activate(element.id);
-            document.removeEventListener("mouseleave", handleMouseLeave);
-          }
-        };
-        document.addEventListener("mouseleave", handleMouseLeave);
-        cleanups.push(() => document.removeEventListener("mouseleave", handleMouseLeave));
-      } else if (trigger?.type === "scroll" && trigger.scrollPercentage) {
-        const handleScroll = () => {
-          const scrollPercent = window.scrollY / (document.body.scrollHeight - window.innerHeight) * 100;
-          if (scrollPercent >= (trigger.scrollPercentage || 50)) {
-            activate(element.id);
-            window.removeEventListener("scroll", handleScroll);
-          }
-        };
-        window.addEventListener("scroll", handleScroll, { passive: true });
-        cleanups.push(() => window.removeEventListener("scroll", handleScroll));
-      }
-    });
-    return () => {
-      cleanups.forEach((fn) => fn());
-    };
-  }, [elements, pathname, dismissedElements, debug]);
-  const recordSeen = useCallback((elementId) => {
-    const element = elements.find((e) => e.id === elementId);
-    if (!element?.trigger?.frequency) return;
-    try {
-      if (element.trigger.frequency.type === "once-per-session") {
-        sessionStorage.setItem(seenKey(elementId), "true");
-      } else {
-        localStorage.setItem(seenKey(elementId), Date.now().toString());
-      }
-    } catch {
-    }
-  }, [elements]);
-  const handleDismiss = useCallback((elementId) => {
-    setDismissedElements((prev) => /* @__PURE__ */ new Set([...prev, elementId]));
-    setActiveElements((prev) => prev.filter((id) => id !== elementId));
-    recordSeen(elementId);
-  }, [recordSeen]);
-  if (typeof document === "undefined") return null;
-  return ReactDOM.createPortal(
-    /* @__PURE__ */ jsxs(Fragment, { children: [
-      activeElements.map((elementId) => {
-        const element = elements.find((e) => e.id === elementId);
-        if (!element) return null;
-        return /* @__PURE__ */ jsx(
-          EngageElementRenderer,
-          {
-            element,
-            onDismiss: () => handleDismiss(element.id),
-            onEngaged: () => recordSeen(element.id),
-            zIndex,
-            apiUrl: propApiUrl,
-            apiKey: propApiKey
-          },
-          element.id
-        );
-      }),
-      chatEnabled && chatReady && /* @__PURE__ */ jsx(
-        LazyChatWidget,
-        {
-          projectId: propProjectId ?? void 0,
-          config: {
-            position,
-            offsetBottom,
-            zIndex,
-            buttonColor: "#2563eb"
-            // Default blue-600 (AA on white), overridden by --sk-primary CSS var or API brand_primary
-          }
-        }
-      )
-    ] }),
-    document.body
-  );
-}
-function trackEngageEvent(apiUrl, apiKey, endpoint, data) {
-  if (!apiKey) return;
-  const visitorId = typeof localStorage !== "undefined" ? localStorage.getItem("_sk_vid") : null;
-  sonorFetch(`${apiUrl.replace(/\/$/, "")}/engage/widget/${endpoint}`, {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({ ...data, visitorId, pageUrl: window.location.href }),
-    keepalive: true
-  }, { apiKey, retries: 0 }).catch(() => {
-  });
-}
-function handleEngageAction(action, _node, element, apiUrl, apiKey) {
-  trackEngageEvent(apiUrl, apiKey, "click", {
-    elementId: element.id,
-    action: action.action
-  });
-  switch (action.action) {
-    case "navigate": {
-      const url = safeActionUrl(action.url);
-      if (url) window.location.href = url;
-      break;
-    }
-    case "open-url": {
-      const url = safeActionUrl(action.url);
-      if (url) window.open(url, "_blank", "noopener,noreferrer");
-      break;
-    }
-    case "submit-form":
-    case "submit_form":
-      window.dispatchEvent(new CustomEvent("engage:submit-form", {
-        detail: { formId: action.formId || action.url, elementId: element.id }
-      }));
-      break;
-    case "track-conversion":
-      window.dispatchEvent(new CustomEvent("engage:conversion", {
-        detail: { action, elementId: element.id }
-      }));
-      break;
-    default:
-      window.dispatchEvent(new CustomEvent("engage:action", {
-        detail: { action, elementId: element.id }
-      }));
-      break;
-  }
-}
-function EngageElementRenderer({
-  element,
-  onDismiss,
-  onEngaged,
-  zIndex,
-  apiUrl,
-  apiKey
-}) {
-  const containerRef = useRef(null);
-  const impressionTrackedRef = useRef(false);
-  useEffect(() => {
-    const el = containerRef.current;
-    if (!el || impressionTrackedRef.current) return;
-    const observer = new IntersectionObserver(
-      ([entry]) => {
-        if (entry.isIntersecting && !impressionTrackedRef.current) {
-          impressionTrackedRef.current = true;
-          trackEngageEvent(apiUrl, apiKey, "impression", { elementId: element.id });
-          observer.disconnect();
-        }
-      },
-      { threshold: 0.5 }
-    );
-    observer.observe(el);
-    return () => observer.disconnect();
-  }, [apiUrl, apiKey, element.id]);
-  const onAction = useCallback(
-    (action, node) => {
-      if (action.action !== "close") onEngaged();
-      handleEngageAction(action, node, element, apiUrl, apiKey);
-    },
-    [element, apiUrl, apiKey, onEngaged]
-  );
-  if (element.blocks?.length) {
-    return /* @__PURE__ */ jsx(
-      BlocksElement,
-      {
-        element,
-        onDismiss,
-        onEngaged,
-        zIndex,
-        apiUrl,
-        apiKey,
-        rootRef: containerRef
-      }
-    );
-  }
-  if (element.design_json) {
-    if (element.type === "popup") {
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: containerRef,
-          "data-engage-element": element.id,
-          style: {
-            position: "fixed",
-            top: 0,
-            left: 0,
-            right: 0,
-            bottom: 0,
-            backgroundColor: "rgba(0,0,0,0.5)",
-            display: "flex",
-            alignItems: "center",
-            justifyContent: "center",
-            zIndex
-          },
-          onClick: onDismiss,
-          children: /* @__PURE__ */ jsx("div", { onClick: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx(
-            DesignRenderer,
-            {
-              design: element.design_json,
-              onClose: onDismiss,
-              onAction
-            }
-          ) })
-        }
-      );
-    }
-    if (element.type === "bar") {
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: containerRef,
-          "data-engage-element": element.id,
-          style: {
-            position: "fixed",
-            top: 0,
-            left: 0,
-            right: 0,
-            zIndex
-          },
-          children: /* @__PURE__ */ jsx(
-            DesignRenderer,
-            {
-              design: element.design_json,
-              onClose: onDismiss,
-              onAction
-            }
-          )
-        }
-      );
-    }
-    if (element.type === "nudge" || element.type === "slide-in") {
-      const position = element.config?.position || "bottom-right";
-      const positionStyles = {
-        "bottom-right": { bottom: 20, right: 20 },
-        "bottom-left": { bottom: 20, left: 20 },
-        "top-right": { top: 20, right: 20 },
-        "top-left": { top: 20, left: 20 }
-      };
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          ref: containerRef,
-          "data-engage-element": element.id,
-          style: {
-            position: "fixed",
-            zIndex,
-            ...positionStyles[position]
-          },
-          children: /* @__PURE__ */ jsx(
-            DesignRenderer,
-            {
-              design: element.design_json,
-              onClose: onDismiss,
-              onAction
-            }
-          )
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx("div", { ref: containerRef, "data-engage-element": element.id, children: /* @__PURE__ */ jsx(
-      DesignRenderer,
-      {
-        design: element.design_json,
-        onClose: onDismiss,
-        onAction
-      }
-    ) });
-  }
-  if (element.type === "popup") {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          position: "fixed",
-          top: 0,
-          left: 0,
-          right: 0,
-          bottom: 0,
-          backgroundColor: "rgba(0,0,0,0.5)",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          zIndex
-        },
-        onClick: onDismiss,
-        children: /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              backgroundColor: "var(--sk-bg, #ffffff)",
-              padding: 24,
-              borderRadius: 8,
-              maxWidth: 500,
-              width: "90%"
-            },
-            onClick: (e) => e.stopPropagation(),
-            children: [
-              /* @__PURE__ */ jsx(
-                "button",
-                {
-                  onClick: onDismiss,
-                  style: {
-                    position: "absolute",
-                    top: 8,
-                    right: 8,
-                    background: "none",
-                    border: "none",
-                    fontSize: 24,
-                    cursor: "pointer"
-                  },
-                  children: "\xD7"
-                }
-              ),
-              element.config?.title && /* @__PURE__ */ jsx("h2", { children: element.config.title }),
-              element.config?.message && /* @__PURE__ */ jsx("p", { children: element.config.message })
-            ]
-          }
-        )
-      }
-    );
-  }
-  if (element.type === "bar") {
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        style: {
-          position: "fixed",
-          top: 0,
-          left: 0,
-          right: 0,
-          backgroundColor: element.config?.backgroundColor || "var(--sk-primary, #2563eb)",
-          color: element.config?.textColor || "var(--sk-bg, #ffffff)",
-          padding: "12px 24px",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          gap: 16,
-          zIndex
-        },
-        children: [
-          /* @__PURE__ */ jsx("span", { children: element.config?.message }),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              onClick: onDismiss,
-              style: {
-                background: "none",
-                border: "none",
-                color: "inherit",
-                fontSize: 20,
-                cursor: "pointer"
-              },
-              children: "\xD7"
-            }
-          )
-        ]
-      }
-    );
-  }
-  return null;
-}
-var PLACEMENT = {
-  popup: "popup",
-  bar: "bar",
-  nudge: "slide-in",
-  "slide-in": "slide-in"
-};
-function BlocksElement({
-  element,
-  onDismiss,
-  onEngaged,
-  zIndex,
-  apiUrl,
-  apiKey,
-  rootRef
-}) {
-  const layout = element.layout;
-  const position = layout?.corner ?? element.config?.position;
-  const corner = position === "bottom-left" || position === "top-left" || position === "top-right" ? position : "bottom-right";
-  return /* @__PURE__ */ jsx(
-    LazyBlocksPopup,
-    {
-      blocks: element.blocks,
-      placement: layout?.placement ?? PLACEMENT[element.type] ?? "popup",
-      edge: layout?.edge,
-      accent: layout?.accent,
-      corner,
-      zIndex,
-      rootRef,
-      elementId: element.id,
-      onClose: onDismiss,
-      onButton: (url) => {
-        onEngaged();
-        trackEngageEvent(apiUrl, apiKey, "click", { elementId: element.id, action: "navigate", url });
-      }
-    }
-  );
-}
-function getDeviceType() {
-  if (typeof navigator === "undefined") return "desktop";
-  return deviceFromUserAgent(navigator.userAgent);
-}
-function storageOrNull(kind) {
-  try {
-    return kind === "local" ? window.localStorage : window.sessionStorage;
-  } catch {
-    return null;
-  }
-}
-
-export { DesignRenderer, EngageWidget };