@iggycodes/experimentlab-react 0.1.0

package/dist/index.d.mts

@@ -0,0 +1,123 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+import { z } from 'zod';
+
+declare const RuleSchema: z.ZodObject<{
+    attribute: z.ZodString;
+    operator: z.ZodEnum<["eq", "neq", "contains", "in", "nin"]>;
+    value: z.ZodAny;
+}, "strip", z.ZodTypeAny, {
+    attribute: string;
+    operator: "eq" | "neq" | "contains" | "in" | "nin";
+    value?: any;
+}, {
+    attribute: string;
+    operator: "eq" | "neq" | "contains" | "in" | "nin";
+    value?: any;
+}>;
+declare const VariantSchema: z.ZodObject<{
+    id: z.ZodString;
+    name: z.ZodString;
+    weight: z.ZodNumber;
+}, "strip", z.ZodTypeAny, {
+    id: string;
+    name: string;
+    weight: number;
+}, {
+    id: string;
+    name: string;
+    weight: number;
+}>;
+type Rule = z.infer<typeof RuleSchema>;
+type Variant = z.infer<typeof VariantSchema>;
+
+interface ExperimentManifest {
+    flags: Array<{
+        key: string;
+        enabled: boolean;
+        rollout?: number;
+        rules?: Rule[];
+    }>;
+    experiments: Array<{
+        key: string;
+        variants: Variant[];
+        rollout: number;
+        status: string;
+        metrics?: string[];
+        winningVariantId?: string | null;
+        rules?: Rule[];
+    }>;
+}
+type Listener = () => void;
+declare const EMPTY_STATE: {
+    manifest: ExperimentManifest | null;
+    loading: boolean;
+};
+interface Event {
+    type: "exposure" | "track";
+    userId: string;
+    name: string;
+    variantId?: string;
+    payload?: Record<string, any>;
+    timestamp: string;
+}
+declare class ExperimentClient {
+    private publishableKey;
+    private userId;
+    private baseUrl;
+    private context;
+    private manifest;
+    private listeners;
+    private loading;
+    private state;
+    private eventQueue;
+    private seenExposures;
+    private flushTimer;
+    private assignments;
+    private STORAGE_KEY;
+    private onEvent?;
+    constructor(options: {
+        publishableKey: string;
+        userId: string;
+        baseUrl?: string;
+        context?: Record<string, any>;
+        onEvent?: (event: Event) => void;
+    });
+    private loadAssignments;
+    private saveAssignments;
+    setContext(context: Record<string, any>): void;
+    init(): Promise<void>;
+    private updateState;
+    subscribe(listener: Listener): () => boolean;
+    private notify;
+    getFlag(key: string): boolean;
+    getExperimentVariant(key: string): Variant | null;
+    track(name: string, payload?: Record<string, any>): void;
+    private trackExposure;
+    private enqueue;
+    flush(): Promise<void>;
+    getSnapshot(): {
+        manifest: ExperimentManifest | null;
+        loading: boolean;
+    };
+}
+
+interface ExperimentProviderProps {
+    client?: ExperimentClient;
+    publishableKey?: string;
+    userId?: string;
+    baseUrl?: string;
+    context?: Record<string, any>;
+    children: React.ReactNode;
+}
+declare function ExperimentProvider({ client, publishableKey, userId, baseUrl, context, children }: ExperimentProviderProps): react_jsx_runtime.JSX.Element;
+declare function useExperimentClient(): ExperimentClient | null;
+declare function useFlag(key: string): boolean;
+declare function useExperiment(key: string): Variant | null;
+declare function useTrack(): (name: string, payload?: Record<string, any>) => void;
+declare function useManifest(): {
+    manifest: ExperimentManifest | null;
+    loading: boolean;
+};
+
+export { EMPTY_STATE, type Event, ExperimentClient, type ExperimentManifest, ExperimentProvider, type ExperimentProviderProps, type Variant, useExperiment, useExperimentClient, useFlag, useManifest, useTrack };

package/dist/index.d.ts

@@ -0,0 +1,123 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import React from 'react';
+import { z } from 'zod';
+
+declare const RuleSchema: z.ZodObject<{
+    attribute: z.ZodString;
+    operator: z.ZodEnum<["eq", "neq", "contains", "in", "nin"]>;
+    value: z.ZodAny;
+}, "strip", z.ZodTypeAny, {
+    attribute: string;
+    operator: "eq" | "neq" | "contains" | "in" | "nin";
+    value?: any;
+}, {
+    attribute: string;
+    operator: "eq" | "neq" | "contains" | "in" | "nin";
+    value?: any;
+}>;
+declare const VariantSchema: z.ZodObject<{
+    id: z.ZodString;
+    name: z.ZodString;
+    weight: z.ZodNumber;
+}, "strip", z.ZodTypeAny, {
+    id: string;
+    name: string;
+    weight: number;
+}, {
+    id: string;
+    name: string;
+    weight: number;
+}>;
+type Rule = z.infer<typeof RuleSchema>;
+type Variant = z.infer<typeof VariantSchema>;
+
+interface ExperimentManifest {
+    flags: Array<{
+        key: string;
+        enabled: boolean;
+        rollout?: number;
+        rules?: Rule[];
+    }>;
+    experiments: Array<{
+        key: string;
+        variants: Variant[];
+        rollout: number;
+        status: string;
+        metrics?: string[];
+        winningVariantId?: string | null;
+        rules?: Rule[];
+    }>;
+}
+type Listener = () => void;
+declare const EMPTY_STATE: {
+    manifest: ExperimentManifest | null;
+    loading: boolean;
+};
+interface Event {
+    type: "exposure" | "track";
+    userId: string;
+    name: string;
+    variantId?: string;
+    payload?: Record<string, any>;
+    timestamp: string;
+}
+declare class ExperimentClient {
+    private publishableKey;
+    private userId;
+    private baseUrl;
+    private context;
+    private manifest;
+    private listeners;
+    private loading;
+    private state;
+    private eventQueue;
+    private seenExposures;
+    private flushTimer;
+    private assignments;
+    private STORAGE_KEY;
+    private onEvent?;
+    constructor(options: {
+        publishableKey: string;
+        userId: string;
+        baseUrl?: string;
+        context?: Record<string, any>;
+        onEvent?: (event: Event) => void;
+    });
+    private loadAssignments;
+    private saveAssignments;
+    setContext(context: Record<string, any>): void;
+    init(): Promise<void>;
+    private updateState;
+    subscribe(listener: Listener): () => boolean;
+    private notify;
+    getFlag(key: string): boolean;
+    getExperimentVariant(key: string): Variant | null;
+    track(name: string, payload?: Record<string, any>): void;
+    private trackExposure;
+    private enqueue;
+    flush(): Promise<void>;
+    getSnapshot(): {
+        manifest: ExperimentManifest | null;
+        loading: boolean;
+    };
+}
+
+interface ExperimentProviderProps {
+    client?: ExperimentClient;
+    publishableKey?: string;
+    userId?: string;
+    baseUrl?: string;
+    context?: Record<string, any>;
+    children: React.ReactNode;
+}
+declare function ExperimentProvider({ client, publishableKey, userId, baseUrl, context, children }: ExperimentProviderProps): react_jsx_runtime.JSX.Element;
+declare function useExperimentClient(): ExperimentClient | null;
+declare function useFlag(key: string): boolean;
+declare function useExperiment(key: string): Variant | null;
+declare function useTrack(): (name: string, payload?: Record<string, any>) => void;
+declare function useManifest(): {
+    manifest: ExperimentManifest | null;
+    loading: boolean;
+};
+
+export { EMPTY_STATE, type Event, ExperimentClient, type ExperimentManifest, ExperimentProvider, type ExperimentProviderProps, type Variant, useExperiment, useExperimentClient, useFlag, useManifest, useTrack };

package/dist/index.js

@@ -0,0 +1,326 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var index_exports = {};
+__export(index_exports, {
+  EMPTY_STATE: () => EMPTY_STATE,
+  ExperimentClient: () => ExperimentClient,
+  ExperimentProvider: () => ExperimentProvider,
+  useExperiment: () => useExperiment,
+  useExperimentClient: () => useExperimentClient,
+  useFlag: () => useFlag,
+  useManifest: () => useManifest,
+  useTrack: () => useTrack
+});
+module.exports = __toCommonJS(index_exports);
+var import_react = require("react");
+
+// ../sdk-core/src/index.ts
+function stableHash(input) {
+  let hash = 5381;
+  for (let i = 0; i < input.length; i += 1) {
+    hash = hash * 33 ^ input.charCodeAt(i);
+  }
+  return Math.abs(hash >>> 0);
+}
+function bucket(userId, key) {
+  return stableHash(`${userId}:${key}`) % 100;
+}
+function evaluateRules(rules, context) {
+  if (!rules || rules.length === 0) return true;
+  return rules.every((rule) => {
+    const attrValue = context[rule.attribute];
+    if (attrValue === void 0) return false;
+    switch (rule.operator) {
+      case "eq":
+        return attrValue === rule.value;
+      case "neq":
+        return attrValue !== rule.value;
+      case "contains":
+        return String(attrValue).includes(String(rule.value));
+      case "in":
+        return Array.isArray(rule.value) && rule.value.includes(attrValue);
+      case "nin":
+        return Array.isArray(rule.value) && !rule.value.includes(attrValue);
+      default:
+        return false;
+    }
+  });
+}
+var EMPTY_STATE = { manifest: null, loading: false };
+var ExperimentClient = class {
+  publishableKey;
+  userId;
+  baseUrl;
+  context;
+  manifest = null;
+  listeners = /* @__PURE__ */ new Set();
+  loading = false;
+  state = EMPTY_STATE;
+  eventQueue = [];
+  seenExposures = /* @__PURE__ */ new Set();
+  flushTimer = null;
+  assignments = {};
+  STORAGE_KEY = "exp_assignments";
+  onEvent;
+  constructor(options) {
+    this.publishableKey = options.publishableKey;
+    this.userId = options.userId;
+    this.baseUrl = options.baseUrl || "";
+    this.context = options.context || {};
+    this.onEvent = options.onEvent;
+    if (typeof window !== "undefined") {
+      this.loadAssignments();
+      window.addEventListener("visibilitychange", () => {
+        if (window.document.visibilityState === "hidden") {
+          this.flush();
+        }
+      });
+    }
+  }
+  loadAssignments() {
+    try {
+      const raw = localStorage.getItem(this.STORAGE_KEY);
+      if (raw) this.assignments = JSON.parse(raw);
+    } catch (e) {
+      console.error("[Experiment SDK] Failed to load assignments", e);
+    }
+  }
+  saveAssignments() {
+    if (typeof window === "undefined") return;
+    try {
+      localStorage.setItem(this.STORAGE_KEY, JSON.stringify(this.assignments));
+    } catch (e) {
+      console.error("[Experiment SDK] Failed to save assignments", e);
+    }
+  }
+  setContext(context) {
+    this.context = { ...this.context, ...context };
+    this.notify();
+  }
+  async init() {
+    if (this.loading) return;
+    this.loading = true;
+    this.updateState();
+    try {
+      const res = await fetch(`${this.baseUrl}/api/v1/client/manifest?apiKey=${this.publishableKey}`);
+      if (!res.ok) throw new Error("Failed to fetch manifest");
+      this.manifest = await res.json();
+    } catch (err) {
+      console.error("[Experiment SDK] Initialization failed", err);
+    } finally {
+      this.loading = false;
+      this.updateState();
+      this.notify();
+    }
+  }
+  updateState() {
+    this.state = {
+      manifest: this.manifest,
+      loading: this.loading
+    };
+  }
+  subscribe(listener) {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+  notify() {
+    this.listeners.forEach((l) => l());
+  }
+  getFlag(key) {
+    if (!this.manifest) return false;
+    const flag = this.manifest.flags.find((f) => f.key === key);
+    if (!flag || !flag.enabled) return false;
+    if (!evaluateRules(flag.rules, this.context)) return false;
+    const rollout = flag.rollout ?? 100;
+    return bucket(this.userId, key) < rollout;
+  }
+  getExperimentVariant(key) {
+    if (!this.manifest) return null;
+    const experiment = this.manifest.experiments.find((e) => e.key === key);
+    if (!experiment) return null;
+    if (this.assignments[key]) {
+      const existing = experiment.variants.find((v) => v.id === this.assignments[key]);
+      if (existing) {
+        this.trackExposure(key, existing.id);
+        return existing;
+      }
+    }
+    if (experiment.status === "completed" && experiment.winningVariantId) {
+      const winner = experiment.variants.find((v) => v.id === experiment.winningVariantId) ?? null;
+      if (winner) {
+        this.assignments[key] = winner.id;
+        this.saveAssignments();
+      }
+      return winner;
+    }
+    if (experiment.status !== "active") return null;
+    if (!evaluateRules(experiment.rules, this.context)) return null;
+    const value = bucket(this.userId, key);
+    if (value >= experiment.rollout) return null;
+    let cursor = 0;
+    const selected = experiment.variants.find((variant) => {
+      cursor += variant.weight;
+      return value < cursor;
+    }) ?? experiment.variants[0];
+    this.assignments[key] = selected.id;
+    this.saveAssignments();
+    this.trackExposure(key, selected.id);
+    return selected;
+  }
+  track(name, payload) {
+    this.enqueue({
+      type: "track",
+      userId: this.userId,
+      name,
+      payload,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString()
+    });
+  }
+  trackExposure(experimentKey, variantId) {
+    if (this.seenExposures.has(experimentKey)) return;
+    this.seenExposures.add(experimentKey);
+    this.enqueue({
+      type: "exposure",
+      userId: this.userId,
+      name: experimentKey,
+      variantId,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString()
+    });
+  }
+  enqueue(event) {
+    this.eventQueue.push(event);
+    if (this.onEvent) {
+      this.onEvent(event);
+    }
+    if (this.eventQueue.length >= 10) {
+      this.flush();
+    } else if (!this.flushTimer) {
+      this.flushTimer = setTimeout(() => this.flush(), 5e3);
+    }
+  }
+  async flush() {
+    if (this.flushTimer) {
+      clearTimeout(this.flushTimer);
+      this.flushTimer = null;
+    }
+    if (this.eventQueue.length === 0) return;
+    const events = [...this.eventQueue];
+    this.eventQueue = [];
+    try {
+      await fetch(`${this.baseUrl}/api/v1/client/events?apiKey=${this.publishableKey}`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(events)
+      });
+    } catch (err) {
+      console.error("[Experiment SDK] Failed to flush events", err);
+    }
+  }
+  getSnapshot() {
+    return this.state;
+  }
+};
+
+// src/index.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var ExperimentContext = (0, import_react.createContext)(null);
+function ExperimentProvider({
+  client,
+  publishableKey,
+  userId,
+  baseUrl,
+  context,
+  children
+}) {
+  const resolvedClient = (0, import_react.useMemo)(() => {
+    if (client) return client;
+    if (publishableKey) {
+      return new ExperimentClient({
+        publishableKey,
+        userId: userId || "anonymous",
+        baseUrl: baseUrl || "",
+        context: context || {}
+      });
+    }
+    return null;
+  }, [client, publishableKey, userId, baseUrl]);
+  (0, import_react.useEffect)(() => {
+    if (resolvedClient) {
+      resolvedClient.init().catch(() => {
+      });
+    }
+  }, [resolvedClient]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ExperimentContext.Provider, { value: resolvedClient, children });
+}
+function useExperimentClient() {
+  return (0, import_react.useContext)(ExperimentContext);
+}
+function useFlag(key) {
+  const client = useExperimentClient();
+  (0, import_react.useSyncExternalStore)(
+    (l) => client ? client.subscribe(l) : () => {
+    },
+    () => client ? client.getSnapshot() : EMPTY_STATE,
+    () => client ? client.getSnapshot() : EMPTY_STATE
+  );
+  if (!client) return false;
+  return client.getFlag(key);
+}
+function useExperiment(key) {
+  const client = useExperimentClient();
+  (0, import_react.useSyncExternalStore)(
+    (l) => client ? client.subscribe(l) : () => {
+    },
+    () => client ? client.getSnapshot() : EMPTY_STATE,
+    () => client ? client.getSnapshot() : EMPTY_STATE
+  );
+  if (!client) return null;
+  return client.getExperimentVariant(key);
+}
+function useTrack() {
+  const client = useExperimentClient();
+  return (name, payload) => {
+    if (client) {
+      client.track(name, payload);
+    }
+  };
+}
+function useManifest() {
+  const client = useExperimentClient();
+  const state = (0, import_react.useSyncExternalStore)(
+    (l) => client ? client.subscribe(l) : () => {
+    },
+    () => client ? client.getSnapshot() : EMPTY_STATE,
+    () => client ? client.getSnapshot() : EMPTY_STATE
+  );
+  return { manifest: state.manifest, loading: state.loading };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  EMPTY_STATE,
+  ExperimentClient,
+  ExperimentProvider,
+  useExperiment,
+  useExperimentClient,
+  useFlag,
+  useManifest,
+  useTrack
+});

package/dist/index.mjs

@@ -0,0 +1,294 @@
+// src/index.tsx
+import { createContext, useContext, useEffect, useMemo, useSyncExternalStore } from "react";
+
+// ../sdk-core/src/index.ts
+function stableHash(input) {
+  let hash = 5381;
+  for (let i = 0; i < input.length; i += 1) {
+    hash = hash * 33 ^ input.charCodeAt(i);
+  }
+  return Math.abs(hash >>> 0);
+}
+function bucket(userId, key) {
+  return stableHash(`${userId}:${key}`) % 100;
+}
+function evaluateRules(rules, context) {
+  if (!rules || rules.length === 0) return true;
+  return rules.every((rule) => {
+    const attrValue = context[rule.attribute];
+    if (attrValue === void 0) return false;
+    switch (rule.operator) {
+      case "eq":
+        return attrValue === rule.value;
+      case "neq":
+        return attrValue !== rule.value;
+      case "contains":
+        return String(attrValue).includes(String(rule.value));
+      case "in":
+        return Array.isArray(rule.value) && rule.value.includes(attrValue);
+      case "nin":
+        return Array.isArray(rule.value) && !rule.value.includes(attrValue);
+      default:
+        return false;
+    }
+  });
+}
+var EMPTY_STATE = { manifest: null, loading: false };
+var ExperimentClient = class {
+  publishableKey;
+  userId;
+  baseUrl;
+  context;
+  manifest = null;
+  listeners = /* @__PURE__ */ new Set();
+  loading = false;
+  state = EMPTY_STATE;
+  eventQueue = [];
+  seenExposures = /* @__PURE__ */ new Set();
+  flushTimer = null;
+  assignments = {};
+  STORAGE_KEY = "exp_assignments";
+  onEvent;
+  constructor(options) {
+    this.publishableKey = options.publishableKey;
+    this.userId = options.userId;
+    this.baseUrl = options.baseUrl || "";
+    this.context = options.context || {};
+    this.onEvent = options.onEvent;
+    if (typeof window !== "undefined") {
+      this.loadAssignments();
+      window.addEventListener("visibilitychange", () => {
+        if (window.document.visibilityState === "hidden") {
+          this.flush();
+        }
+      });
+    }
+  }
+  loadAssignments() {
+    try {
+      const raw = localStorage.getItem(this.STORAGE_KEY);
+      if (raw) this.assignments = JSON.parse(raw);
+    } catch (e) {
+      console.error("[Experiment SDK] Failed to load assignments", e);
+    }
+  }
+  saveAssignments() {
+    if (typeof window === "undefined") return;
+    try {
+      localStorage.setItem(this.STORAGE_KEY, JSON.stringify(this.assignments));
+    } catch (e) {
+      console.error("[Experiment SDK] Failed to save assignments", e);
+    }
+  }
+  setContext(context) {
+    this.context = { ...this.context, ...context };
+    this.notify();
+  }
+  async init() {
+    if (this.loading) return;
+    this.loading = true;
+    this.updateState();
+    try {
+      const res = await fetch(`${this.baseUrl}/api/v1/client/manifest?apiKey=${this.publishableKey}`);
+      if (!res.ok) throw new Error("Failed to fetch manifest");
+      this.manifest = await res.json();
+    } catch (err) {
+      console.error("[Experiment SDK] Initialization failed", err);
+    } finally {
+      this.loading = false;
+      this.updateState();
+      this.notify();
+    }
+  }
+  updateState() {
+    this.state = {
+      manifest: this.manifest,
+      loading: this.loading
+    };
+  }
+  subscribe(listener) {
+    this.listeners.add(listener);
+    return () => this.listeners.delete(listener);
+  }
+  notify() {
+    this.listeners.forEach((l) => l());
+  }
+  getFlag(key) {
+    if (!this.manifest) return false;
+    const flag = this.manifest.flags.find((f) => f.key === key);
+    if (!flag || !flag.enabled) return false;
+    if (!evaluateRules(flag.rules, this.context)) return false;
+    const rollout = flag.rollout ?? 100;
+    return bucket(this.userId, key) < rollout;
+  }
+  getExperimentVariant(key) {
+    if (!this.manifest) return null;
+    const experiment = this.manifest.experiments.find((e) => e.key === key);
+    if (!experiment) return null;
+    if (this.assignments[key]) {
+      const existing = experiment.variants.find((v) => v.id === this.assignments[key]);
+      if (existing) {
+        this.trackExposure(key, existing.id);
+        return existing;
+      }
+    }
+    if (experiment.status === "completed" && experiment.winningVariantId) {
+      const winner = experiment.variants.find((v) => v.id === experiment.winningVariantId) ?? null;
+      if (winner) {
+        this.assignments[key] = winner.id;
+        this.saveAssignments();
+      }
+      return winner;
+    }
+    if (experiment.status !== "active") return null;
+    if (!evaluateRules(experiment.rules, this.context)) return null;
+    const value = bucket(this.userId, key);
+    if (value >= experiment.rollout) return null;
+    let cursor = 0;
+    const selected = experiment.variants.find((variant) => {
+      cursor += variant.weight;
+      return value < cursor;
+    }) ?? experiment.variants[0];
+    this.assignments[key] = selected.id;
+    this.saveAssignments();
+    this.trackExposure(key, selected.id);
+    return selected;
+  }
+  track(name, payload) {
+    this.enqueue({
+      type: "track",
+      userId: this.userId,
+      name,
+      payload,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString()
+    });
+  }
+  trackExposure(experimentKey, variantId) {
+    if (this.seenExposures.has(experimentKey)) return;
+    this.seenExposures.add(experimentKey);
+    this.enqueue({
+      type: "exposure",
+      userId: this.userId,
+      name: experimentKey,
+      variantId,
+      timestamp: (/* @__PURE__ */ new Date()).toISOString()
+    });
+  }
+  enqueue(event) {
+    this.eventQueue.push(event);
+    if (this.onEvent) {
+      this.onEvent(event);
+    }
+    if (this.eventQueue.length >= 10) {
+      this.flush();
+    } else if (!this.flushTimer) {
+      this.flushTimer = setTimeout(() => this.flush(), 5e3);
+    }
+  }
+  async flush() {
+    if (this.flushTimer) {
+      clearTimeout(this.flushTimer);
+      this.flushTimer = null;
+    }
+    if (this.eventQueue.length === 0) return;
+    const events = [...this.eventQueue];
+    this.eventQueue = [];
+    try {
+      await fetch(`${this.baseUrl}/api/v1/client/events?apiKey=${this.publishableKey}`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(events)
+      });
+    } catch (err) {
+      console.error("[Experiment SDK] Failed to flush events", err);
+    }
+  }
+  getSnapshot() {
+    return this.state;
+  }
+};
+
+// src/index.tsx
+import { jsx } from "react/jsx-runtime";
+var ExperimentContext = createContext(null);
+function ExperimentProvider({
+  client,
+  publishableKey,
+  userId,
+  baseUrl,
+  context,
+  children
+}) {
+  const resolvedClient = useMemo(() => {
+    if (client) return client;
+    if (publishableKey) {
+      return new ExperimentClient({
+        publishableKey,
+        userId: userId || "anonymous",
+        baseUrl: baseUrl || "",
+        context: context || {}
+      });
+    }
+    return null;
+  }, [client, publishableKey, userId, baseUrl]);
+  useEffect(() => {
+    if (resolvedClient) {
+      resolvedClient.init().catch(() => {
+      });
+    }
+  }, [resolvedClient]);
+  return /* @__PURE__ */ jsx(ExperimentContext.Provider, { value: resolvedClient, children });
+}
+function useExperimentClient() {
+  return useContext(ExperimentContext);
+}
+function useFlag(key) {
+  const client = useExperimentClient();
+  useSyncExternalStore(
+    (l) => client ? client.subscribe(l) : () => {
+    },
+    () => client ? client.getSnapshot() : EMPTY_STATE,
+    () => client ? client.getSnapshot() : EMPTY_STATE
+  );
+  if (!client) return false;
+  return client.getFlag(key);
+}
+function useExperiment(key) {
+  const client = useExperimentClient();
+  useSyncExternalStore(
+    (l) => client ? client.subscribe(l) : () => {
+    },
+    () => client ? client.getSnapshot() : EMPTY_STATE,
+    () => client ? client.getSnapshot() : EMPTY_STATE
+  );
+  if (!client) return null;
+  return client.getExperimentVariant(key);
+}
+function useTrack() {
+  const client = useExperimentClient();
+  return (name, payload) => {
+    if (client) {
+      client.track(name, payload);
+    }
+  };
+}
+function useManifest() {
+  const client = useExperimentClient();
+  const state = useSyncExternalStore(
+    (l) => client ? client.subscribe(l) : () => {
+    },
+    () => client ? client.getSnapshot() : EMPTY_STATE,
+    () => client ? client.getSnapshot() : EMPTY_STATE
+  );
+  return { manifest: state.manifest, loading: state.loading };
+}
+export {
+  EMPTY_STATE,
+  ExperimentClient,
+  ExperimentProvider,
+  useExperiment,
+  useExperimentClient,
+  useFlag,
+  useManifest,
+  useTrack
+};

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "@iggycodes/experimentlab-react",
+  "version": "0.1.0",
+  "description": "React hooks and context provider for ExperimentLab feature flags and A/B experiments",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsup src/index.tsx --format cjs,esm --dts --clean --external react,react-dom --no-splitting",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run"
+  },
+  "dependencies": {
+    "@iggycodes/experimentlab-core": "^0.1.0"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0",
+    "react-dom": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "tsup": "^8.3.5",
+    "typescript": "^5.6.3",
+    "vitest": "^2.1.8"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}