@outlit/browser 0.4.0 → 1.0.0

package/dist/react/index.mjs

@@ -4,6 +4,7 @@ import { createContext, useCallback, useEffect, useRef, useState } from "react";
 // src/tracker.ts
 import {
   DEFAULT_API_HOST,
+  buildBillingEvent,
   buildCalendarEvent,
   buildCustomEvent,
   buildFormEvent,
@@ -709,7 +710,7 @@ var Outlit = class {
    * Links the anonymous visitor to a known user.
    *
    * When email or userId is provided, also sets the current user identity
-   * for stage events (activate, engaged, paid).
+   * for stage events (activate, engaged, inactive).
    */
   identify(options) {
     if (!this.isTrackingEnabled) {
@@ -770,37 +771,22 @@ var Outlit = class {
     this.identify({ email: identity.email, userId: identity.userId, traits: identity.traits });
   }
   /**
-   * Mark the current user as activated.
-   * This is typically called after a user completes onboarding or a key activation milestone.
-   * Requires the user to be identified (via setUser or identify with userId).
+   * User namespace methods for contact journey stages.
    */
-  activate(properties) {
-    this.sendStageEvent("activated", properties);
-  }
-  /**
-   * Mark the current user as engaged.
-   * This is typically called when a user reaches a usage milestone.
-   * Can also be computed automatically by the engagement cron.
-   */
-  engaged(properties) {
-    this.sendStageEvent("engaged", properties);
-  }
-  /**
-   * Mark the current user as paid.
-   * This is typically called after a successful payment/subscription.
-   * Can also be triggered by Stripe integration.
-   */
-  paid(properties) {
-    this.sendStageEvent("paid", properties);
-  }
+  user = {
+    identify: (options) => this.identify(options),
+    activate: (properties) => this.sendStageEvent("activated", properties),
+    engaged: (properties) => this.sendStageEvent("engaged", properties),
+    inactive: (properties) => this.sendStageEvent("inactive", properties)
+  };
   /**
-   * Mark the current user as churned.
-   * This is typically called when a subscription is cancelled.
-   * Can also be triggered by Stripe integration.
+   * Customer namespace methods for billing status.
    */
-  churned(properties) {
-    this.sendStageEvent("churned", properties);
-  }
+  customer = {
+    trialing: (options) => this.sendBillingEvent("trialing", options),
+    paid: (options) => this.sendBillingEvent("paid", options),
+    churned: (options) => this.sendBillingEvent("churned", options)
+  };
   /**
    * Internal method to send a stage event.
    */
@@ -823,6 +809,26 @@ var Outlit = class {
     });
     this.enqueue(event);
   }
+  sendBillingEvent(status, options) {
+    if (!this.isTrackingEnabled) {
+      console.warn("[Outlit] Tracking not enabled. Call enableTracking() first.");
+      return;
+    }
+    if (!options.customerId && !options.stripeCustomerId && !options.domain) {
+      console.warn("[Outlit] customer.* requires customerId, stripeCustomerId, or domain");
+      return;
+    }
+    const event = buildBillingEvent({
+      url: window.location.href,
+      referrer: document.referrer,
+      status,
+      customerId: options.customerId,
+      stripeCustomerId: options.stripeCustomerId,
+      domain: options.domain,
+      properties: options.properties
+    });
+    this.enqueue(event);
+  }
   /**
    * Get the current visitor ID.
    * Returns null if tracking is not enabled.
@@ -939,8 +945,11 @@ var Outlit = class {
         const blob = new Blob([JSON.stringify(payload)], { type: "application/json" });
         const sent = navigator.sendBeacon(url, blob);
         if (sent) return;
+        console.warn(
+          `[Outlit] sendBeacon failed for ${events.length} events, falling back to fetch`
+        );
       }
-      await fetch(url, {
+      const response = await fetch(url, {
         method: "POST",
         headers: {
           "Content-Type": "application/json"
@@ -948,8 +957,13 @@ var Outlit = class {
         body: JSON.stringify(payload),
         keepalive: true
       });
+      if (!response.ok) {
+        console.warn(
+          `[Outlit] Server returned ${response.status} when sending ${events.length} events`
+        );
+      }
     } catch (error) {
-      console.warn("[Outlit] Failed to send events:", error);
+      console.warn(`[Outlit] Failed to send ${events.length} events:`, error);
     }
   }
 };
@@ -1057,6 +1071,16 @@ function useOutlit() {
     },
     [outlit]
   );
+  const userIdentify = useCallback2(
+    (options) => {
+      if (!outlit) {
+        console.warn("[Outlit] Not initialized. Make sure OutlitProvider is mounted.");
+        return;
+      }
+      outlit.user.identify(options);
+    },
+    [outlit]
+  );
   const getVisitorId = useCallback2(() => {
     if (!outlit) return null;
     return outlit.getVisitorId();
@@ -1084,7 +1108,7 @@ function useOutlit() {
         console.warn("[Outlit] Not initialized. Make sure OutlitProvider is mounted.");
         return;
       }
-      outlit.activate(properties);
+      outlit.user.activate(properties);
     },
     [outlit]
   );
@@ -1094,27 +1118,47 @@ function useOutlit() {
         console.warn("[Outlit] Not initialized. Make sure OutlitProvider is mounted.");
         return;
       }
-      outlit.engaged(properties);
+      outlit.user.engaged(properties);
     },
     [outlit]
   );
-  const paid = useCallback2(
+  const inactive = useCallback2(
     (properties) => {
       if (!outlit) {
         console.warn("[Outlit] Not initialized. Make sure OutlitProvider is mounted.");
         return;
       }
-      outlit.paid(properties);
+      outlit.user.inactive(properties);
+    },
+    [outlit]
+  );
+  const trialing = useCallback2(
+    (options) => {
+      if (!outlit) {
+        console.warn("[Outlit] Not initialized. Make sure OutlitProvider is mounted.");
+        return;
+      }
+      outlit.customer.trialing(options);
+    },
+    [outlit]
+  );
+  const paid = useCallback2(
+    (options) => {
+      if (!outlit) {
+        console.warn("[Outlit] Not initialized. Make sure OutlitProvider is mounted.");
+        return;
+      }
+      outlit.customer.paid(options);
     },
     [outlit]
   );
   const churned = useCallback2(
-    (properties) => {
+    (options) => {
       if (!outlit) {
         console.warn("[Outlit] Not initialized. Make sure OutlitProvider is mounted.");
         return;
       }
-      outlit.churned(properties);
+      outlit.customer.churned(options);
     },
     [outlit]
   );
@@ -1124,10 +1168,17 @@ function useOutlit() {
     getVisitorId,
     setUser,
     clearUser,
-    activate,
-    engaged,
-    paid,
-    churned,
+    user: {
+      identify: userIdentify,
+      activate,
+      engaged,
+      inactive
+    },
+    customer: {
+      trialing,
+      paid,
+      churned
+    },
     isInitialized,
     isTrackingEnabled,
     enableTracking