@outlit/browser 1.4.3 → 1.5.0

package/dist/react/index.d.mts

@@ -1,122 +1,9 @@
+import { BrowserTrackOptions, BrowserIdentifyOptions } from '@outlit/core';
+export { BrowserIdentifyOptions, BrowserTrackOptions, CustomerIdentifier, ExplicitJourneyStage, TrackerConfig } from '@outlit/core';
+import { U as UserIdentity, B as BillingOptions, O as Outlit, h as OutlitOptions } from '../tracker-DlHUyaah.mjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode } from 'react';
-import { O as Outlit, U as UserIdentity, h as OutlitOptions, B as BillingOptions } from '../tracker-CzhtZoOC.mjs';
-import { BrowserTrackOptions, BrowserIdentifyOptions } from '@outlit/core';
-export { BrowserIdentifyOptions, BrowserTrackOptions, CustomerIdentifier, ExplicitJourneyStage, TrackerConfig } from '@outlit/core';
-
-interface OutlitContextValue {
-    outlit: Outlit | null;
-    isInitialized: boolean;
-    isTrackingEnabled: boolean;
-    enableTracking: () => void;
-    disableTracking: () => void;
-}
-declare const OutlitContext: react.Context<OutlitContextValue>;
-interface OutlitProviderBaseProps {
-    children: ReactNode;
-    /**
-     * Current user identity.
-     * When provided with email or userId, calls setUser() to identify the user.
-     * When null, undefined, or missing identity fields, calls clearUser().
-     *
-     * This is the recommended way to handle user identity in server-rendered apps:
-     * pass the user from your auth system as a prop.
-     *
-     * @example
-     * ```tsx
-     * // Server component (layout.tsx)
-     * const session = await auth()
-     * return (
-     *   <OutlitProvider
-     *     publicKey="pk_xxx"
-     *     user={session?.user ? { email: session.user.email, userId: session.user.id } : null}
-     *   >
-     *     {children}
-     *   </OutlitProvider>
-     * )
-     * ```
-     */
-    user?: UserIdentity | null;
-}
-/**
- * Props for using a pre-existing Outlit instance.
- * The provider will use this instance directly without creating a new one.
- * The caller owns the instance lifecycle — shutdown() will NOT be called on unmount.
- *
- * @example
- * ```tsx
- * import { Outlit } from '@outlit/browser'
- * import { OutlitProvider } from '@outlit/browser/react'
- *
- * const outlit = new Outlit({ publicKey: 'pk_xxx', trackPageviews: false })
- *
- * function App() {
- *   const user = useAuth()
- *   return (
- *     <OutlitProvider client={outlit} user={user ? { email: user.email } : null}>
- *       {children}
- *     </OutlitProvider>
- *   )
- * }
- * ```
- */
-type NeverOutlitOptions = {
-    [K in keyof OutlitOptions]?: never;
-};
-interface OutlitProviderClientProps extends OutlitProviderBaseProps, NeverOutlitOptions {
-    /** An existing Outlit instance to use. Config props are ignored when this is provided. */
-    client: Outlit;
-}
-/**
- * Props for creating a new Outlit instance internally.
- * This is the default behavior — the provider creates and owns the instance.
- */
-interface OutlitProviderConfigProps extends OutlitProviderBaseProps, Omit<OutlitOptions, "trackPageviews"> {
-    client?: never;
-    /**
-     * Whether to automatically track pageviews.
-     * When true (default), tracks pageviews on route changes.
-     */
-    trackPageviews?: boolean;
-    /**
-     * Whether to start tracking automatically on mount.
-     * Set to false if you need to wait for user consent.
-     * Call enableTracking() (from useOutlit hook) after consent is obtained.
-     * @default true
-     */
-    autoTrack?: boolean;
-}
-type OutlitProviderProps = OutlitProviderClientProps | OutlitProviderConfigProps;
-/**
- * Outlit Provider component.
- * Initializes the client and provides it to child components via context.
- *
- * Can be used in two ways:
- *
- * 1. **Config mode** (default): Pass `publicKey` and config options to create a new instance.
- * 2. **Client mode**: Pass an existing `client` instance for shared imperative + React usage.
- *
- * @example
- * ```tsx
- * // Config mode — provider creates and owns the instance
- * <OutlitProvider publicKey="pk_xxx" trackPageviews>
- *   {children}
- * </OutlitProvider>
- * ```
- *
- * @example
- * ```tsx
- * // Client mode — use an existing instance
- * const outlit = new Outlit({ publicKey: 'pk_xxx' })
- * outlit.track('pageview') // imperative usage
- *
- * <OutlitProvider client={outlit} user={user}>
- *   {children}
- * </OutlitProvider>
- * ```
- */
-declare function OutlitProvider(props: OutlitProviderProps): react_jsx_runtime.JSX.Element;
 
 interface UseOutlitReturn {
     /**
@@ -247,4 +134,117 @@ declare function useTrack(): (eventName: string, properties?: BrowserTrackOption
  */
 declare function useIdentify(): (options: BrowserIdentifyOptions) => void;
 
+interface OutlitContextValue {
+    outlit: Outlit | null;
+    isInitialized: boolean;
+    isTrackingEnabled: boolean;
+    enableTracking: () => void;
+    disableTracking: () => void;
+}
+declare const OutlitContext: react.Context<OutlitContextValue>;
+interface OutlitProviderBaseProps {
+    children: ReactNode;
+    /**
+     * Current user identity.
+     * When provided with email or userId, calls setUser() to identify the user.
+     * When null, undefined, or missing identity fields, calls clearUser().
+     *
+     * This is the recommended way to handle user identity in server-rendered apps:
+     * pass the user from your auth system as a prop.
+     *
+     * @example
+     * ```tsx
+     * // Server component (layout.tsx)
+     * const session = await auth()
+     * return (
+     *   <OutlitProvider
+     *     publicKey="pk_xxx"
+     *     user={session?.user ? { email: session.user.email, userId: session.user.id } : null}
+     *   >
+     *     {children}
+     *   </OutlitProvider>
+     * )
+     * ```
+     */
+    user?: UserIdentity | null;
+}
+/**
+ * Props for using a pre-existing Outlit instance.
+ * The provider will use this instance directly without creating a new one.
+ * The caller owns the instance lifecycle — shutdown() will NOT be called on unmount.
+ *
+ * @example
+ * ```tsx
+ * import { Outlit } from '@outlit/browser'
+ * import { OutlitProvider } from '@outlit/browser/react'
+ *
+ * const outlit = new Outlit({ publicKey: 'pk_xxx', trackPageviews: false })
+ *
+ * function App() {
+ *   const user = useAuth()
+ *   return (
+ *     <OutlitProvider client={outlit} user={user ? { email: user.email } : null}>
+ *       {children}
+ *     </OutlitProvider>
+ *   )
+ * }
+ * ```
+ */
+type NeverOutlitOptions = {
+    [K in keyof OutlitOptions]?: never;
+};
+interface OutlitProviderClientProps extends OutlitProviderBaseProps, NeverOutlitOptions {
+    /** An existing Outlit instance to use. Config props are ignored when this is provided. */
+    client: Outlit;
+}
+/**
+ * Props for creating a new Outlit instance internally.
+ * This is the default behavior — the provider creates and owns the instance.
+ */
+interface OutlitProviderConfigProps extends OutlitProviderBaseProps, Omit<OutlitOptions, "trackPageviews"> {
+    client?: never;
+    /**
+     * Whether to automatically track pageviews.
+     * When true (default), tracks pageviews on route changes.
+     */
+    trackPageviews?: boolean;
+    /**
+     * Whether to start tracking automatically on mount.
+     * Set to false if you need to wait for user consent.
+     * Call enableTracking() (from useOutlit hook) after consent is obtained.
+     * @default true
+     */
+    autoTrack?: boolean;
+}
+type OutlitProviderProps = OutlitProviderClientProps | OutlitProviderConfigProps;
+/**
+ * Outlit Provider component.
+ * Initializes the client and provides it to child components via context.
+ *
+ * Can be used in two ways:
+ *
+ * 1. **Config mode** (default): Pass `publicKey` and config options to create a new instance.
+ * 2. **Client mode**: Pass an existing `client` instance for shared imperative + React usage.
+ *
+ * @example
+ * ```tsx
+ * // Config mode — provider creates and owns the instance
+ * <OutlitProvider publicKey="pk_xxx" trackPageviews>
+ *   {children}
+ * </OutlitProvider>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Client mode — use an existing instance
+ * const outlit = new Outlit({ publicKey: 'pk_xxx' })
+ * outlit.track('pageview') // imperative usage
+ *
+ * <OutlitProvider client={outlit} user={user}>
+ *   {children}
+ * </OutlitProvider>
+ * ```
+ */
+declare function OutlitProvider(props: OutlitProviderProps): react_jsx_runtime.JSX.Element;
+
 export { BillingOptions, OutlitContext, type OutlitContextValue, OutlitProvider, type OutlitProviderProps, type UseOutlitReturn, UserIdentity, useIdentify, useOutlit, useTrack };

package/dist/react/index.d.ts

@@ -1,122 +1,9 @@
+import { BrowserTrackOptions, BrowserIdentifyOptions } from '@outlit/core';
+export { BrowserIdentifyOptions, BrowserTrackOptions, CustomerIdentifier, ExplicitJourneyStage, TrackerConfig } from '@outlit/core';
+import { U as UserIdentity, B as BillingOptions, O as Outlit, h as OutlitOptions } from '../tracker-DlHUyaah.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode } from 'react';
-import { O as Outlit, U as UserIdentity, h as OutlitOptions, B as BillingOptions } from '../tracker-CzhtZoOC.js';
-import { BrowserTrackOptions, BrowserIdentifyOptions } from '@outlit/core';
-export { BrowserIdentifyOptions, BrowserTrackOptions, CustomerIdentifier, ExplicitJourneyStage, TrackerConfig } from '@outlit/core';
-
-interface OutlitContextValue {
-    outlit: Outlit | null;
-    isInitialized: boolean;
-    isTrackingEnabled: boolean;
-    enableTracking: () => void;
-    disableTracking: () => void;
-}
-declare const OutlitContext: react.Context<OutlitContextValue>;
-interface OutlitProviderBaseProps {
-    children: ReactNode;
-    /**
-     * Current user identity.
-     * When provided with email or userId, calls setUser() to identify the user.
-     * When null, undefined, or missing identity fields, calls clearUser().
-     *
-     * This is the recommended way to handle user identity in server-rendered apps:
-     * pass the user from your auth system as a prop.
-     *
-     * @example
-     * ```tsx
-     * // Server component (layout.tsx)
-     * const session = await auth()
-     * return (
-     *   <OutlitProvider
-     *     publicKey="pk_xxx"
-     *     user={session?.user ? { email: session.user.email, userId: session.user.id } : null}
-     *   >
-     *     {children}
-     *   </OutlitProvider>
-     * )
-     * ```
-     */
-    user?: UserIdentity | null;
-}
-/**
- * Props for using a pre-existing Outlit instance.
- * The provider will use this instance directly without creating a new one.
- * The caller owns the instance lifecycle — shutdown() will NOT be called on unmount.
- *
- * @example
- * ```tsx
- * import { Outlit } from '@outlit/browser'
- * import { OutlitProvider } from '@outlit/browser/react'
- *
- * const outlit = new Outlit({ publicKey: 'pk_xxx', trackPageviews: false })
- *
- * function App() {
- *   const user = useAuth()
- *   return (
- *     <OutlitProvider client={outlit} user={user ? { email: user.email } : null}>
- *       {children}
- *     </OutlitProvider>
- *   )
- * }
- * ```
- */
-type NeverOutlitOptions = {
-    [K in keyof OutlitOptions]?: never;
-};
-interface OutlitProviderClientProps extends OutlitProviderBaseProps, NeverOutlitOptions {
-    /** An existing Outlit instance to use. Config props are ignored when this is provided. */
-    client: Outlit;
-}
-/**
- * Props for creating a new Outlit instance internally.
- * This is the default behavior — the provider creates and owns the instance.
- */
-interface OutlitProviderConfigProps extends OutlitProviderBaseProps, Omit<OutlitOptions, "trackPageviews"> {
-    client?: never;
-    /**
-     * Whether to automatically track pageviews.
-     * When true (default), tracks pageviews on route changes.
-     */
-    trackPageviews?: boolean;
-    /**
-     * Whether to start tracking automatically on mount.
-     * Set to false if you need to wait for user consent.
-     * Call enableTracking() (from useOutlit hook) after consent is obtained.
-     * @default true
-     */
-    autoTrack?: boolean;
-}
-type OutlitProviderProps = OutlitProviderClientProps | OutlitProviderConfigProps;
-/**
- * Outlit Provider component.
- * Initializes the client and provides it to child components via context.
- *
- * Can be used in two ways:
- *
- * 1. **Config mode** (default): Pass `publicKey` and config options to create a new instance.
- * 2. **Client mode**: Pass an existing `client` instance for shared imperative + React usage.
- *
- * @example
- * ```tsx
- * // Config mode — provider creates and owns the instance
- * <OutlitProvider publicKey="pk_xxx" trackPageviews>
- *   {children}
- * </OutlitProvider>
- * ```
- *
- * @example
- * ```tsx
- * // Client mode — use an existing instance
- * const outlit = new Outlit({ publicKey: 'pk_xxx' })
- * outlit.track('pageview') // imperative usage
- *
- * <OutlitProvider client={outlit} user={user}>
- *   {children}
- * </OutlitProvider>
- * ```
- */
-declare function OutlitProvider(props: OutlitProviderProps): react_jsx_runtime.JSX.Element;
 
 interface UseOutlitReturn {
     /**
@@ -247,4 +134,117 @@ declare function useTrack(): (eventName: string, properties?: BrowserTrackOption
  */
 declare function useIdentify(): (options: BrowserIdentifyOptions) => void;
 
+interface OutlitContextValue {
+    outlit: Outlit | null;
+    isInitialized: boolean;
+    isTrackingEnabled: boolean;
+    enableTracking: () => void;
+    disableTracking: () => void;
+}
+declare const OutlitContext: react.Context<OutlitContextValue>;
+interface OutlitProviderBaseProps {
+    children: ReactNode;
+    /**
+     * Current user identity.
+     * When provided with email or userId, calls setUser() to identify the user.
+     * When null, undefined, or missing identity fields, calls clearUser().
+     *
+     * This is the recommended way to handle user identity in server-rendered apps:
+     * pass the user from your auth system as a prop.
+     *
+     * @example
+     * ```tsx
+     * // Server component (layout.tsx)
+     * const session = await auth()
+     * return (
+     *   <OutlitProvider
+     *     publicKey="pk_xxx"
+     *     user={session?.user ? { email: session.user.email, userId: session.user.id } : null}
+     *   >
+     *     {children}
+     *   </OutlitProvider>
+     * )
+     * ```
+     */
+    user?: UserIdentity | null;
+}
+/**
+ * Props for using a pre-existing Outlit instance.
+ * The provider will use this instance directly without creating a new one.
+ * The caller owns the instance lifecycle — shutdown() will NOT be called on unmount.
+ *
+ * @example
+ * ```tsx
+ * import { Outlit } from '@outlit/browser'
+ * import { OutlitProvider } from '@outlit/browser/react'
+ *
+ * const outlit = new Outlit({ publicKey: 'pk_xxx', trackPageviews: false })
+ *
+ * function App() {
+ *   const user = useAuth()
+ *   return (
+ *     <OutlitProvider client={outlit} user={user ? { email: user.email } : null}>
+ *       {children}
+ *     </OutlitProvider>
+ *   )
+ * }
+ * ```
+ */
+type NeverOutlitOptions = {
+    [K in keyof OutlitOptions]?: never;
+};
+interface OutlitProviderClientProps extends OutlitProviderBaseProps, NeverOutlitOptions {
+    /** An existing Outlit instance to use. Config props are ignored when this is provided. */
+    client: Outlit;
+}
+/**
+ * Props for creating a new Outlit instance internally.
+ * This is the default behavior — the provider creates and owns the instance.
+ */
+interface OutlitProviderConfigProps extends OutlitProviderBaseProps, Omit<OutlitOptions, "trackPageviews"> {
+    client?: never;
+    /**
+     * Whether to automatically track pageviews.
+     * When true (default), tracks pageviews on route changes.
+     */
+    trackPageviews?: boolean;
+    /**
+     * Whether to start tracking automatically on mount.
+     * Set to false if you need to wait for user consent.
+     * Call enableTracking() (from useOutlit hook) after consent is obtained.
+     * @default true
+     */
+    autoTrack?: boolean;
+}
+type OutlitProviderProps = OutlitProviderClientProps | OutlitProviderConfigProps;
+/**
+ * Outlit Provider component.
+ * Initializes the client and provides it to child components via context.
+ *
+ * Can be used in two ways:
+ *
+ * 1. **Config mode** (default): Pass `publicKey` and config options to create a new instance.
+ * 2. **Client mode**: Pass an existing `client` instance for shared imperative + React usage.
+ *
+ * @example
+ * ```tsx
+ * // Config mode — provider creates and owns the instance
+ * <OutlitProvider publicKey="pk_xxx" trackPageviews>
+ *   {children}
+ * </OutlitProvider>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Client mode — use an existing instance
+ * const outlit = new Outlit({ publicKey: 'pk_xxx' })
+ * outlit.track('pageview') // imperative usage
+ *
+ * <OutlitProvider client={outlit} user={user}>
+ *   {children}
+ * </OutlitProvider>
+ * ```
+ */
+declare function OutlitProvider(props: OutlitProviderProps): react_jsx_runtime.JSX.Element;
+
 export { BillingOptions, OutlitContext, type OutlitContextValue, OutlitProvider, type OutlitProviderProps, type UseOutlitReturn, UserIdentity, useIdentify, useOutlit, useTrack };

package/dist/react/index.js

@@ -28,6 +28,9 @@ __export(react_exports, {
 });
 module.exports = __toCommonJS(react_exports);
 
+// src/react/hooks.ts
+var import_react2 = require("react");
+
 // src/react/provider.tsx
 var import_react = require("react");
 
@@ -816,11 +819,18 @@ var Outlit = class {
       console.warn("[Outlit] Tracking not enabled. Call enableTracking() first.");
       return;
     }
+    if (!options.email && !options.userId) {
+      console.warn("[Outlit] identify requires email or userId");
+      return;
+    }
     if (options.email || options.userId) {
       const hadNoUser = !this.currentUser;
       this.currentUser = {
         email: options.email,
-        userId: options.userId
+        userId: options.userId,
+        customerId: options.customerId,
+        customerTraits: options.customerTraits,
+        traits: options.traits
       };
       if (hadNoUser) {
         this.flushPendingStageEvents();
@@ -831,6 +841,8 @@ var Outlit = class {
       referrer: document.referrer,
       email: options.email,
       userId: options.userId,
+      customerId: options.customerId,
+      customerTraits: options.customerTraits,
       traits: options.traits
     });
     this.enqueue(event);
@@ -872,7 +884,13 @@ var Outlit = class {
    */
   applyUser(identity) {
     this.currentUser = identity;
-    this.identify({ email: identity.email, userId: identity.userId, traits: identity.traits });
+    this.identify({
+      email: identity.email,
+      userId: identity.userId,
+      traits: identity.traits,
+      customerId: identity.customerId,
+      customerTraits: identity.customerTraits
+    });
     this.flushPendingStageEvents();
   }
   /**
@@ -940,13 +958,18 @@ var Outlit = class {
       console.warn("[Outlit] Tracking not enabled. Call enableTracking() first.");
       return;
     }
+    try {
+      (0, import_core3.validateCustomerIdentity)(options.customerId, options.stripeCustomerId);
+    } catch (error) {
+      console.warn("[Outlit]", error instanceof Error ? error.message : error);
+      return;
+    }
     const event = (0, import_core3.buildBillingEvent)({
       url: window.location.href,
       referrer: document.referrer,
       status,
       customerId: options.customerId,
       stripeCustomerId: options.stripeCustomerId,
-      domain: options.domain,
       properties: options.properties
     });
     this.enqueue(event);
@@ -1062,12 +1085,46 @@ var Outlit = class {
       this.flush();
     }, this.flushInterval);
   }
+  getPayloadUserIdentity() {
+    if (!this.currentUser) {
+      return void 0;
+    }
+    const { email, userId } = this.currentUser;
+    if (!email && !userId) {
+      return void 0;
+    }
+    return {
+      ...email && { email },
+      ...userId && { userId }
+    };
+  }
+  getPayloadCustomerIdentity() {
+    if (!this.currentUser) {
+      return void 0;
+    }
+    const { customerId } = this.currentUser;
+    if (!customerId) {
+      return void 0;
+    }
+    return {
+      ...customerId && { customerId }
+    };
+  }
   async sendEvents(events) {
     if (events.length === 0) return;
     if (!this.visitorId) return;
-    const userIdentity = this.currentUser ?? void 0;
+    const userIdentity = this.getPayloadUserIdentity();
+    const customerIdentity = this.getPayloadCustomerIdentity();
     const sessionId = this.sessionTracker?.getSessionId();
-    const payload = (0, import_core3.buildIngestPayload)(this.visitorId, "client", events, userIdentity, sessionId);
+    const payload = (0, import_core3.buildIngestPayload)(
+      this.visitorId,
+      "client",
+      events,
+      userIdentity,
+      sessionId,
+      void 0,
+      customerIdentity
+    );
     const url = `${this.apiHost}/api/i/v1/${this.publicKey}/events`;
     try {
       if (typeof navigator !== "undefined" && navigator.sendBeacon) {
@@ -1216,7 +1273,6 @@ function OutlitProvider(props) {
 }
 
 // src/react/hooks.ts
-var import_react2 = require("react");
 function useOutlit() {
   const { outlit, isInitialized, isTrackingEnabled, enableTracking, disableTracking } = (0, import_react2.useContext)(OutlitContext);
   const track = (0, import_react2.useCallback)(