@neowhale/storefront 0.2.27 → 0.2.29

package/dist/react/index.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
-var chunk7KXJLHGA_cjs = require('../chunk-7KXJLHGA.cjs');
-var chunkVAA2KKCH_cjs = require('../chunk-VAA2KKCH.cjs');
+var chunkUW2U5BRY_cjs = require('../chunk-UW2U5BRY.cjs');
+var chunkV5KCIYKG_cjs = require('../chunk-V5KCIYKG.cjs');
 var react = require('react');
 var navigation = require('next/navigation');
 var vanilla = require('zustand/vanilla');
@@ -499,6 +499,44 @@ function useAnalytics() {
     },
     [track]
   );
+  const captureGeolocation = react.useCallback(
+    async (options) => {
+      if (!trackingEnabled) return null;
+      if (typeof navigator === "undefined" || !navigator.geolocation) return null;
+      try {
+        const position = await new Promise((resolve, reject) => {
+          navigator.geolocation.getCurrentPosition(resolve, reject, {
+            timeout: options?.timeout ?? 1e4,
+            enableHighAccuracy: options?.enableHighAccuracy ?? true
+          });
+        });
+        const { latitude, longitude, accuracy } = position.coords;
+        const sessionId = await getOrCreateSession();
+        if (sessionId && !sessionId.startsWith("local-")) {
+          await client.updateSession(sessionId, {
+            latitude,
+            longitude,
+            geolocation_source: "browser_gps",
+            geolocation_accuracy: accuracy
+          });
+        }
+        track("location_granted", {
+          accuracy,
+          trigger: "sdk",
+          device_type: detectDevice()
+        });
+        return position;
+      } catch (error) {
+        track("location_denied", {
+          error: error instanceof Error ? error.message : "unknown",
+          trigger: "sdk",
+          device_type: detectDevice()
+        });
+        return null;
+      }
+    },
+    [client, getOrCreateSession, track, trackingEnabled]
+  );
   return {
     track,
     trackPageView,
@@ -513,6 +551,7 @@ function useAnalytics() {
     updateSessionCart,
     updateSessionOrder,
     getOrCreateSession,
+    captureGeolocation,
     /** Whether tracking is globally enabled for this storefront */
     trackingEnabled,
     /** Configured recording sample rate (0–1) for behavioral session replays */
@@ -635,7 +674,7 @@ function PixelInitializer({ onReady, onTheme }) {
         onTheme(config.theme);
       }
       if (ctx.config.trackingEnabled && config.pixels && config.pixels.length > 0) {
-        const manager = new chunk7KXJLHGA_cjs.PixelManager(config.pixels);
+        const manager = new chunkUW2U5BRY_cjs.PixelManager(config.pixels);
         await manager.initialize();
         onReady(manager);
       }
@@ -1027,7 +1066,7 @@ function BehavioralTrackerComponent({ pathname }) {
       const baseUrl = config.proxyPath;
       const endpoint = `${baseUrl}/v1/stores/${config.storeId}/storefront/behavioral`;
       const sendBatch = async (batch) => {
-        await chunkVAA2KKCH_cjs.resilientSend(endpoint, batch, {
+        await chunkV5KCIYKG_cjs.resilientSend(endpoint, batch, {
           "Content-Type": "application/json",
           "x-api-key": config.apiKey
         });
@@ -1213,7 +1252,7 @@ function FingerprintCollector() {
     collectFingerprint().then(async (fp) => {
       const baseUrl = config.proxyPath;
       const url = `${baseUrl}/v1/stores/${config.storeId}/storefront/fingerprints`;
-      await chunkVAA2KKCH_cjs.resilientSend(url, fp, {
+      await chunkV5KCIYKG_cjs.resilientSend(url, fp, {
         "Content-Type": "application/json",
         "x-api-key": config.apiKey
       }).catch(() => {
@@ -1594,7 +1633,7 @@ function SessionRecorderComponent() {
       const sid = sessionId;
       const recorder = new SessionRecorder({
         sendChunk: async (events, sequence) => {
-          await chunkVAA2KKCH_cjs.resilientSend(url, {
+          await chunkV5KCIYKG_cjs.resilientSend(url, {
             session_id: sid,
             visitor_id: visitorId,
             events,
@@ -1673,7 +1712,7 @@ function WhaleProvider({
       trackingEnabled: trackingEnabled ?? envBool("NEXT_PUBLIC_TRACKING_ENABLED") ?? true,
       recordingRate: recordingRate ?? envNumber("NEXT_PUBLIC_RECORDING_RATE") ?? 0.1
     };
-    const client = new chunkVAA2KKCH_cjs.WhaleClient({
+    const client = new chunkV5KCIYKG_cjs.WhaleClient({
       storeId,
       apiKey,
       gatewayUrl: resolvedConfig.gatewayUrl,
@@ -2429,13 +2468,14 @@ function SectionRenderer({
   section,
   data,
   theme,
-  tracking
+  tracking,
+  onEvent
 }) {
   const [showCOA, setShowCOA] = react.useState(false);
   const el = (() => {
     switch (section.type) {
       case "hero":
-        return /* @__PURE__ */ jsxRuntime.jsx(HeroSection, { section, theme, tracking });
+        return /* @__PURE__ */ jsxRuntime.jsx(HeroSection, { section, theme, tracking, onEvent });
       case "text":
         return /* @__PURE__ */ jsxRuntime.jsx(TextSection, { section, theme });
       case "image":
@@ -2445,7 +2485,7 @@ function SectionRenderer({
       case "gallery":
         return /* @__PURE__ */ jsxRuntime.jsx(GallerySection, { section, theme });
       case "cta":
-        return /* @__PURE__ */ jsxRuntime.jsx(CTASection, { section, theme, tracking });
+        return /* @__PURE__ */ jsxRuntime.jsx(CTASection, { section, theme, tracking, onEvent });
       case "stats":
         return /* @__PURE__ */ jsxRuntime.jsx(StatsSection, { section, theme });
       case "product_card":
@@ -2455,7 +2495,7 @@ function SectionRenderer({
       case "social_links":
         return /* @__PURE__ */ jsxRuntime.jsx(SocialLinksSection, { section, theme });
       case "lead_capture":
-        return /* @__PURE__ */ jsxRuntime.jsx(LeadCaptureSection, { section, data, theme });
+        return /* @__PURE__ */ jsxRuntime.jsx(LeadCaptureSection, { section, data, theme, onEvent });
       case "divider":
         return /* @__PURE__ */ jsxRuntime.jsx(DividerSection, { theme });
       default:
@@ -2467,7 +2507,7 @@ function SectionRenderer({
     showCOA && data?.coa && /* @__PURE__ */ jsxRuntime.jsx(COAModal, { coa: data.coa, theme, onClose: () => setShowCOA(false) })
   ] });
 }
-function HeroSection({ section, theme, tracking }) {
+function HeroSection({ section, theme, tracking, onEvent }) {
   const { title, subtitle, background_image, cta_text, cta_url } = section.content;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
@@ -2509,7 +2549,10 @@ function HeroSection({ section, theme, tracking }) {
             "a",
             {
               href: cta_url,
-              onClick: () => trackClick(tracking, cta_text, cta_url),
+              onClick: () => {
+                trackClick(tracking, cta_text, cta_url);
+                onEvent?.("cta_click", { label: cta_text, url: cta_url });
+              },
               style: {
                 display: "inline-block",
                 padding: "0.875rem 2rem",
@@ -2595,7 +2638,7 @@ function GallerySection({ section, theme }) {
     }
   ) }, i)) }) });
 }
-function CTASection({ section, theme, tracking }) {
+function CTASection({ section, theme, tracking, onEvent }) {
   const { title, subtitle, buttons } = section.content;
   if (!buttons || buttons.length === 0) return null;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: "2rem 1.5rem", maxWidth: 480, margin: "0 auto", display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
@@ -2624,7 +2667,10 @@ function CTASection({ section, theme, tracking }) {
         "a",
         {
           href: btn.url,
-          onClick: () => trackClick(tracking, btn.text, btn.url, i),
+          onClick: () => {
+            trackClick(tracking, btn.text, btn.url, i);
+            onEvent?.("cta_click", { label: btn.text, url: btn.url });
+          },
           style: {
             display: "block",
             width: "100%",
@@ -2779,7 +2825,7 @@ function COAViewerSection({
     onShowCOA();
   }, style: buttonStyle, children: buttonLabel }) });
 }
-function LeadCaptureSection({ section, data, theme }) {
+function LeadCaptureSection({ section, data, theme, onEvent }) {
   const c = section.content;
   const [firstName, setFirstName] = react.useState("");
   const [email, setEmail] = react.useState("");
@@ -2816,6 +2862,7 @@ function LeadCaptureSection({ section, data, theme }) {
         throw new Error(body?.error?.message || "Something went wrong. Please try again.");
       }
       setStatus("success");
+      onEvent?.("lead", { email, first_name: firstName || void 0, source: c.source || "landing_page", landing_page_slug: slug || void 0 });
     } catch (err) {
       setErrorMsg(err instanceof Error ? err.message : "Something went wrong. Please try again.");
       setStatus("error");
@@ -3352,7 +3399,8 @@ function LandingPage({
   gatewayUrl = "https://whale-gateway.fly.dev",
   renderSection,
   onDataLoaded,
-  onError
+  onError,
+  onEvent
 }) {
   const [state, setState] = react.useState("loading");
   const [data, setData] = react.useState(null);
@@ -3400,12 +3448,13 @@ function LandingPage({
   if (state === "expired") return /* @__PURE__ */ jsxRuntime.jsx(DefaultExpired2, {});
   if (state === "error") return /* @__PURE__ */ jsxRuntime.jsx(DefaultError2, { message: errorMsg });
   if (!data) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx(PageLayout, { data, gatewayUrl, renderSection });
+  return /* @__PURE__ */ jsxRuntime.jsx(PageLayout, { data, gatewayUrl, renderSection, onEvent });
 }
 function PageLayout({
   data,
   gatewayUrl,
-  renderSection
+  renderSection,
+  onEvent
 }) {
   const { landing_page: lp, store } = data;
   const theme = {
@@ -3425,11 +3474,11 @@ function PageLayout({
     lp.custom_css && /* @__PURE__ */ jsxRuntime.jsx("style", { children: lp.custom_css }),
     logoUrl && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "1.5rem", display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoUrl, alt: store?.name || "Store", style: { height: 40, objectFit: "contain" } }) }),
     sorted.map((section) => {
-      const defaultRenderer = () => /* @__PURE__ */ jsxRuntime.jsx(SectionRenderer, { section, data: sectionData, theme }, section.id);
+      const defaultRenderer = () => /* @__PURE__ */ jsxRuntime.jsx(SectionRenderer, { section, data: sectionData, theme, onEvent }, section.id);
       if (renderSection) {
         return /* @__PURE__ */ jsxRuntime.jsx("div", { children: renderSection(section, defaultRenderer) }, section.id);
       }
-      return /* @__PURE__ */ jsxRuntime.jsx(SectionRenderer, { section, data: sectionData, theme }, section.id);
+      return /* @__PURE__ */ jsxRuntime.jsx(SectionRenderer, { section, data: sectionData, theme, onEvent }, section.id);
     }),
     store?.name && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "2rem 1.5rem", borderTop: `1px solid ${theme.surface}`, textAlign: "center" }, children: /* @__PURE__ */ jsxRuntime.jsxs("p", { style: { fontSize: "0.75rem", color: theme.muted, margin: 0 }, children: [
       "Powered by ",