@schematichq/schematic-react 1.2.5 → 1.2.6

package/dist/schematic-react.cjs.js

@@ -72,20 +72,20 @@ var __toESM2 = (mod, isNodeMode, target) => (target = mod != null ? __create2(__
 var require_browser_polyfill = __commonJS({
   "node_modules/cross-fetch/dist/browser-polyfill.js"(exports) {
     (function(self2) {
-      var irrelevant = function(exports2) {
+      var irrelevant = (function(exports2) {
         var g = typeof globalThis !== "undefined" && globalThis || typeof self2 !== "undefined" && self2 || // eslint-disable-next-line no-undef
         typeof global !== "undefined" && global || {};
         var support = {
           searchParams: "URLSearchParams" in g,
           iterable: "Symbol" in g && "iterator" in Symbol,
-          blob: "FileReader" in g && "Blob" in g && function() {
+          blob: "FileReader" in g && "Blob" in g && (function() {
             try {
               new Blob();
               return true;
             } catch (e) {
               return false;
             }
-          }(),
+          })(),
           formData: "FormData" in g,
           arrayBuffer: "ArrayBuffer" in g
         };
@@ -387,12 +387,12 @@ var require_browser_polyfill = __commonJS({
           }
           this.method = normalizeMethod(options.method || this.method || "GET");
           this.mode = options.mode || this.mode || null;
-          this.signal = options.signal || this.signal || function() {
+          this.signal = options.signal || this.signal || (function() {
             if ("AbortController" in g) {
               var ctrl = new AbortController();
               return ctrl.signal;
             }
-          }();
+          })();
           this.referrer = null;
           if ((this.method === "GET" || this.method === "HEAD") && body) {
             throw new TypeError("Body not allowed for GET or HEAD requests");
@@ -599,7 +599,7 @@ var require_browser_polyfill = __commonJS({
         exports2.Response = Response;
         exports2.fetch = fetch2;
         return exports2;
-      }({});
+      })({});
     })(typeof self !== "undefined" ? self : exports);
   }
 });
@@ -623,10 +623,7 @@ function rng() {
 }
 var randomUUID = typeof crypto !== "undefined" && crypto.randomUUID && crypto.randomUUID.bind(crypto);
 var native_default = { randomUUID };
-function v4(options, buf, offset) {
-  if (native_default.randomUUID && !buf && !options) {
-    return native_default.randomUUID();
-  }
+function _v4(options, buf, offset) {
   options = options || {};
   const rnds = options.random ?? options.rng?.() ?? rng();
   if (rnds.length < 16) {
@@ -646,6 +643,12 @@ function v4(options, buf, offset) {
   }
   return unsafeStringify(rnds);
 }
+function v4(options, buf, offset) {
+  if (native_default.randomUUID && !buf && !options) {
+    return native_default.randomUUID();
+  }
+  return _v4(options, buf, offset);
+}
 var v4_default = v4;
 var import_polyfill = __toESM2(require_browser_polyfill());
 function CheckFlagResponseDataFromJSON(json) {
@@ -796,7 +799,7 @@ function contextString(context) {
   }, {});
   return JSON.stringify(sortedContext);
 }
-var version = "1.2.3";
+var version = "1.2.6";
 var anonymousIdKey = "schematicId";
 var Schematic = class {
   additionalHeaders = {};
@@ -807,6 +810,7 @@ var Schematic = class {
   debugEnabled = false;
   offlineEnabled = false;
   eventQueue;
+  contextDependentEventQueue;
   eventUrl = "https://c.schematichq.com";
   flagCheckListeners = {};
   flagValueListeners = {};
@@ -820,6 +824,7 @@ var Schematic = class {
   constructor(apiKey, options) {
     this.apiKey = apiKey;
     this.eventQueue = [];
+    this.contextDependentEventQueue = [];
     this.useWebSocket = options?.useWebSocket ?? false;
     this.debugEnabled = options?.debug ?? false;
     this.offlineEnabled = options?.offline ?? false;
@@ -862,6 +867,7 @@ var Schematic = class {
     if (typeof window !== "undefined" && window?.addEventListener) {
       window.addEventListener("beforeunload", () => {
         this.flushEventQueue();
+        this.flushContextDependentEventQueue();
       });
     }
     if (this.offlineEnabled) {
@@ -1120,6 +1126,7 @@ var Schematic = class {
   setContext = async (context) => {
     if (this.isOffline() || !this.useWebSocket) {
       this.context = context;
+      this.flushContextDependentEventQueue();
       this.setIsPending(false);
       return Promise.resolve();
     }
@@ -1142,6 +1149,25 @@ var Schematic = class {
    */
   track = (body) => {
     const { company, user, event, traits, quantity = 1 } = body;
+    if (!this.hasContext(company, user)) {
+      this.debug(`track: queuing event "${event}" until context is available`);
+      const queuedEvent = {
+        api_key: this.apiKey,
+        body: {
+          company,
+          event,
+          traits: traits ?? {},
+          user,
+          quantity
+        },
+        sent_at: (/* @__PURE__ */ new Date()).toISOString(),
+        tracker_event_id: v4_default(),
+        tracker_user_id: this.getAnonymousId(),
+        type: "track"
+      };
+      this.contextDependentEventQueue.push(queuedEvent);
+      return Promise.resolve();
+    }
     const trackData = {
       company: company ?? this.context.company,
       event,
@@ -1204,6 +1230,38 @@ var Schematic = class {
   /**
    * Event processing
    */
+  hasContext = (company, user) => {
+    const hasProvidedContext = company !== void 0 && company !== null && Object.keys(company).length > 0 || user !== void 0 && user !== null && Object.keys(user).length > 0;
+    const hasInstanceContext = this.context.company !== void 0 && this.context.company !== null && Object.keys(this.context.company).length > 0 || this.context.user !== void 0 && this.context.user !== null && Object.keys(this.context.user).length > 0;
+    return hasProvidedContext || hasInstanceContext;
+  };
+  flushContextDependentEventQueue = () => {
+    this.debug(
+      `flushing ${this.contextDependentEventQueue.length} context-dependent events`
+    );
+    while (this.contextDependentEventQueue.length > 0) {
+      const event = this.contextDependentEventQueue.shift();
+      if (event) {
+        if (event.type === "track" && typeof event.body === "object" && event.body !== null) {
+          const trackBody = event.body;
+          const updatedBody = {
+            ...trackBody,
+            company: trackBody.company ?? this.context.company,
+            user: trackBody.user ?? this.context.user
+          };
+          const updatedEvent = {
+            ...event,
+            body: updatedBody,
+            sent_at: (/* @__PURE__ */ new Date()).toISOString()
+            // Update timestamp to actual send time
+          };
+          this.sendEvent(updatedEvent);
+        } else {
+          this.sendEvent(event);
+        }
+      }
+    }
+  };
   flushEventQueue = () => {
     while (this.eventQueue.length > 0) {
       const event = this.eventQueue.shift();
@@ -1233,7 +1291,7 @@ var Schematic = class {
       tracker_user_id: this.getAnonymousId(),
       type: eventType
     };
-    if (document?.hidden) {
+    if (typeof document !== "undefined" && document?.hidden) {
       return this.storeEvent(event);
     } else {
       return this.sendEvent(event);
@@ -1362,6 +1420,7 @@ var Schematic = class {
             this.notifyFlagCheckListeners(flag.flag, flagCheck);
             this.notifyFlagValueListeners(flag.flag, flagCheck.value);
           });
+          this.flushContextDependentEventQueue();
           this.setIsPending(false);
           if (!resolved) {
             resolved = true;
@@ -1505,7 +1564,7 @@ var notifyFlagValueListener = (listener, value) => {
 var import_react = __toESM(require("react"));
 
 // src/version.ts
-var version2 = "1.2.5";
+var version2 = "1.2.6";
 
 // src/context/schematic.tsx
 var import_jsx_runtime = require("react/jsx-runtime");

package/dist/schematic-react.d.ts

@@ -11,6 +11,7 @@ import { Schematic } from '@schematichq/schematic-js';
 import { SchematicContext } from '@schematichq/schematic-js';
 import * as SchematicJS from '@schematichq/schematic-js';
 import { SchematicOptions } from '@schematichq/schematic-js';
+import { StoragePersister } from '@schematichq/schematic-js';
 import { Traits } from '@schematichq/schematic-js';
 import { UsagePeriod } from '@schematichq/schematic-js';
 
@@ -62,6 +63,8 @@ declare type SchematicProviderPropsWithPublishableKey = BaseSchematicProviderPro
     publishableKey: string;
 };
 
+export { StoragePersister }
+
 export { Traits }
 
 export { UsagePeriod }

package/dist/schematic-react.esm.js

@@ -27,20 +27,20 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var require_browser_polyfill = __commonJS({
   "node_modules/cross-fetch/dist/browser-polyfill.js"(exports) {
     (function(self2) {
-      var irrelevant = function(exports2) {
+      var irrelevant = (function(exports2) {
         var g = typeof globalThis !== "undefined" && globalThis || typeof self2 !== "undefined" && self2 || // eslint-disable-next-line no-undef
         typeof global !== "undefined" && global || {};
         var support = {
           searchParams: "URLSearchParams" in g,
           iterable: "Symbol" in g && "iterator" in Symbol,
-          blob: "FileReader" in g && "Blob" in g && function() {
+          blob: "FileReader" in g && "Blob" in g && (function() {
             try {
               new Blob();
               return true;
             } catch (e) {
               return false;
             }
-          }(),
+          })(),
           formData: "FormData" in g,
           arrayBuffer: "ArrayBuffer" in g
         };
@@ -342,12 +342,12 @@ var require_browser_polyfill = __commonJS({
           }
           this.method = normalizeMethod(options.method || this.method || "GET");
           this.mode = options.mode || this.mode || null;
-          this.signal = options.signal || this.signal || function() {
+          this.signal = options.signal || this.signal || (function() {
             if ("AbortController" in g) {
               var ctrl = new AbortController();
               return ctrl.signal;
             }
-          }();
+          })();
           this.referrer = null;
           if ((this.method === "GET" || this.method === "HEAD") && body) {
             throw new TypeError("Body not allowed for GET or HEAD requests");
@@ -554,7 +554,7 @@ var require_browser_polyfill = __commonJS({
         exports2.Response = Response;
         exports2.fetch = fetch2;
         return exports2;
-      }({});
+      })({});
     })(typeof self !== "undefined" ? self : exports);
   }
 });
@@ -578,10 +578,7 @@ function rng() {
 }
 var randomUUID = typeof crypto !== "undefined" && crypto.randomUUID && crypto.randomUUID.bind(crypto);
 var native_default = { randomUUID };
-function v4(options, buf, offset) {
-  if (native_default.randomUUID && !buf && !options) {
-    return native_default.randomUUID();
-  }
+function _v4(options, buf, offset) {
   options = options || {};
   const rnds = options.random ?? options.rng?.() ?? rng();
   if (rnds.length < 16) {
@@ -601,6 +598,12 @@ function v4(options, buf, offset) {
   }
   return unsafeStringify(rnds);
 }
+function v4(options, buf, offset) {
+  if (native_default.randomUUID && !buf && !options) {
+    return native_default.randomUUID();
+  }
+  return _v4(options, buf, offset);
+}
 var v4_default = v4;
 var import_polyfill = __toESM(require_browser_polyfill());
 function CheckFlagResponseDataFromJSON(json) {
@@ -751,7 +754,7 @@ function contextString(context) {
   }, {});
   return JSON.stringify(sortedContext);
 }
-var version = "1.2.3";
+var version = "1.2.6";
 var anonymousIdKey = "schematicId";
 var Schematic = class {
   additionalHeaders = {};
@@ -762,6 +765,7 @@ var Schematic = class {
   debugEnabled = false;
   offlineEnabled = false;
   eventQueue;
+  contextDependentEventQueue;
   eventUrl = "https://c.schematichq.com";
   flagCheckListeners = {};
   flagValueListeners = {};
@@ -775,6 +779,7 @@ var Schematic = class {
   constructor(apiKey, options) {
     this.apiKey = apiKey;
     this.eventQueue = [];
+    this.contextDependentEventQueue = [];
     this.useWebSocket = options?.useWebSocket ?? false;
     this.debugEnabled = options?.debug ?? false;
     this.offlineEnabled = options?.offline ?? false;
@@ -817,6 +822,7 @@ var Schematic = class {
     if (typeof window !== "undefined" && window?.addEventListener) {
       window.addEventListener("beforeunload", () => {
         this.flushEventQueue();
+        this.flushContextDependentEventQueue();
       });
     }
     if (this.offlineEnabled) {
@@ -1075,6 +1081,7 @@ var Schematic = class {
   setContext = async (context) => {
     if (this.isOffline() || !this.useWebSocket) {
       this.context = context;
+      this.flushContextDependentEventQueue();
       this.setIsPending(false);
       return Promise.resolve();
     }
@@ -1097,6 +1104,25 @@ var Schematic = class {
    */
   track = (body) => {
     const { company, user, event, traits, quantity = 1 } = body;
+    if (!this.hasContext(company, user)) {
+      this.debug(`track: queuing event "${event}" until context is available`);
+      const queuedEvent = {
+        api_key: this.apiKey,
+        body: {
+          company,
+          event,
+          traits: traits ?? {},
+          user,
+          quantity
+        },
+        sent_at: (/* @__PURE__ */ new Date()).toISOString(),
+        tracker_event_id: v4_default(),
+        tracker_user_id: this.getAnonymousId(),
+        type: "track"
+      };
+      this.contextDependentEventQueue.push(queuedEvent);
+      return Promise.resolve();
+    }
     const trackData = {
       company: company ?? this.context.company,
       event,
@@ -1159,6 +1185,38 @@ var Schematic = class {
   /**
    * Event processing
    */
+  hasContext = (company, user) => {
+    const hasProvidedContext = company !== void 0 && company !== null && Object.keys(company).length > 0 || user !== void 0 && user !== null && Object.keys(user).length > 0;
+    const hasInstanceContext = this.context.company !== void 0 && this.context.company !== null && Object.keys(this.context.company).length > 0 || this.context.user !== void 0 && this.context.user !== null && Object.keys(this.context.user).length > 0;
+    return hasProvidedContext || hasInstanceContext;
+  };
+  flushContextDependentEventQueue = () => {
+    this.debug(
+      `flushing ${this.contextDependentEventQueue.length} context-dependent events`
+    );
+    while (this.contextDependentEventQueue.length > 0) {
+      const event = this.contextDependentEventQueue.shift();
+      if (event) {
+        if (event.type === "track" && typeof event.body === "object" && event.body !== null) {
+          const trackBody = event.body;
+          const updatedBody = {
+            ...trackBody,
+            company: trackBody.company ?? this.context.company,
+            user: trackBody.user ?? this.context.user
+          };
+          const updatedEvent = {
+            ...event,
+            body: updatedBody,
+            sent_at: (/* @__PURE__ */ new Date()).toISOString()
+            // Update timestamp to actual send time
+          };
+          this.sendEvent(updatedEvent);
+        } else {
+          this.sendEvent(event);
+        }
+      }
+    }
+  };
   flushEventQueue = () => {
     while (this.eventQueue.length > 0) {
       const event = this.eventQueue.shift();
@@ -1188,7 +1246,7 @@ var Schematic = class {
       tracker_user_id: this.getAnonymousId(),
       type: eventType
     };
-    if (document?.hidden) {
+    if (typeof document !== "undefined" && document?.hidden) {
       return this.storeEvent(event);
     } else {
       return this.sendEvent(event);
@@ -1317,6 +1375,7 @@ var Schematic = class {
             this.notifyFlagCheckListeners(flag.flag, flagCheck);
             this.notifyFlagValueListeners(flag.flag, flagCheck.value);
           });
+          this.flushContextDependentEventQueue();
           this.setIsPending(false);
           if (!resolved) {
             resolved = true;
@@ -1460,7 +1519,7 @@ var notifyFlagValueListener = (listener, value) => {
 import React, { createContext, useEffect, useMemo, useRef } from "react";
 
 // src/version.ts
-var version2 = "1.2.5";
+var version2 = "1.2.6";
 
 // src/context/schematic.tsx
 import { jsx } from "react/jsx-runtime";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schematichq/schematic-react",
-  "version": "1.2.5",
+  "version": "1.2.6",
   "main": "dist/schematic-react.cjs.js",
   "module": "dist/schematic-react.esm.js",
   "types": "dist/schematic-react.d.ts",
@@ -25,33 +25,38 @@
     "format": "prettier --write \"src/**/*.{ts,tsx}\"",
     "lint": "eslint src --ext ts,tsx --report-unused-disable-directives --fix",
     "test": "jest --config jest.config.js",
+    "test:reactnative": "jest --config jest.config.reactnative.js",
     "tsc": "npx tsc",
     "prepare": "husky"
   },
   "dependencies": {
-    "@schematichq/schematic-js": "^1.2.3"
+    "@schematichq/schematic-js": "^1.2.6"
   },
   "devDependencies": {
     "@eslint/js": "^9.24.0",
     "@microsoft/api-extractor": "^7.52.2",
-    "@types/jest": "^29.5.14",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.8.0",
+    "@testing-library/react": "^16.3.0",
+    "@types/jest": "^30.0.0",
     "@types/react": "^19.1.1",
     "esbuild": "^0.25.2",
     "esbuild-jest": "^0.5.0",
     "eslint": "^9.24.0",
-    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^5.1.0",
+    "eslint-plugin-react-hooks": "^5.2.0",
     "globals": "^16.0.0",
     "husky": "^9.1.7",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
-    "jest-esbuild": "^0.3.0",
+    "jest": "^30.0.0",
+    "jest-environment-jsdom": "^30.0.0",
+    "jest-esbuild": "^0.4.0",
     "jest-fetch-mock": "^3.0.3",
-    "prettier": "^3.4.2",
-    "react": "^19.1.0",
+    "prettier": "^3.6.2",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
     "ts-jest": "^29.3.0",
-    "typescript": "^5.7.3",
+    "typescript": "^5.9.2",
     "typescript-eslint": "^8.29.1"
   },
   "peerDependencies": {