@databuddy/sdk 2.3.0 → 2.3.2

package/dist/react/index.d.ts

@@ -1,9 +1,6 @@
-import { D as DatabuddyConfig } from '../shared/@databuddy/sdk.CeYE_kaj.js';
-import * as react from 'react';
-import { ReactNode } from 'react';
-import * as jotai_vanilla_internals from 'jotai/vanilla/internals';
-import { d as FlagsConfig, c as FlagState } from '../shared/@databuddy/sdk.OK9Nbqlf.js';
-export { b as FlagResult, e as FlagsContext } from '../shared/@databuddy/sdk.OK9Nbqlf.js';
+import { D as DatabuddyConfig } from '../shared/@databuddy/sdk.C9b3SVYK.js';
+import React, { ReactNode } from 'react';
+import { F as FlagsConfig, a as FeatureState, b as FlagState, c as FlagsContext } from '../shared/@databuddy/sdk.B6nwxnPC.js';
 
 /**
  * React/Next.js component that injects the Databuddy tracking script.
@@ -56,18 +53,61 @@ export { b as FlagResult, e as FlagsContext } from '../shared/@databuddy/sdk.OK9
  */
 declare function Databuddy(props: DatabuddyConfig): null;
 
+/** biome-ignore-all lint/correctness/noUnusedImports: we need to import React to use the createContext function */
+
 interface FlagsProviderProps extends FlagsConfig {
     children: ReactNode;
 }
-declare function FlagsProvider({ children, ...config }: FlagsProviderProps): react.FunctionComponentElement<{
-    children?: ReactNode;
-    store?: jotai_vanilla_internals.INTERNAL_Store;
-}>;
-declare function useFlags(): {
-    isEnabled: (key: string) => FlagState;
-    fetchAllFlags: () => Promise<void> | undefined;
-    updateUser: (user: FlagsConfig["user"]) => void;
-    refresh: (forceClear?: boolean) => void;
-};
+/**
+ * Flags provider component
+ * Creates a manager instance and provides flag methods to children
+ */
+declare function FlagsProvider({ children, ...config }: FlagsProviderProps): React.JSX.Element;
+/**
+ * Access the full flags context
+ * @example
+ * const { isOn, getFlag, refresh } = useFlags();
+ */
+declare function useFlags(): FlagsContext;
+/**
+ * Get a flag's full state with loading/error handling
+ * @example
+ * const flag = useFlag("my-feature");
+ * if (flag.loading) return <Skeleton />;
+ * return flag.on ? <NewFeature /> : <OldFeature />;
+ */
+declare function useFlag(key: string): FlagState;
+/**
+ * Simple feature check - returns { on, loading, value, variant }
+ * @example
+ * const { on, loading } = useFeature("dark-mode");
+ * if (loading) return <Skeleton />;
+ * return on ? <DarkTheme /> : <LightTheme />;
+ */
+declare function useFeature(key: string): FeatureState;
+/**
+ * Boolean-only feature check with default value
+ * Useful for SSR-safe rendering where you need a boolean immediately
+ * @example
+ * const isDarkMode = useFeatureOn("dark-mode", false);
+ * return isDarkMode ? <DarkTheme /> : <LightTheme />;
+ */
+declare function useFeatureOn(key: string, defaultValue?: boolean): boolean;
+/**
+ * Get a flag's typed value
+ * @example
+ * const maxItems = useFlagValue("max-items", 10);
+ * const theme = useFlagValue<"light" | "dark">("theme", "light");
+ */
+declare function useFlagValue<T extends boolean | string | number = boolean>(key: string, defaultValue?: T): T;
+/**
+ * Get variant for A/B testing
+ * @example
+ * const variant = useVariant("checkout-experiment");
+ * if (variant === "control") return <OldCheckout />;
+ * if (variant === "treatment-a") return <NewCheckoutA />;
+ * return <NewCheckoutB />;
+ */
+declare function useVariant(key: string): string | undefined;
 
-export { Databuddy, FlagState, FlagsConfig, FlagsProvider, useFlags };
+export { Databuddy, FlagsProvider, useFeature, useFeatureOn, useFlag, useFlagValue, useFlags, useVariant };

package/dist/react/index.mjs

@@ -1,9 +1,10 @@
 'use client';
 
-import { i as isScriptInjected, c as createScript, B as BrowserFlagStorage, C as CoreFlagsManager, l as logger } from '../shared/@databuddy/sdk.Cn2tDA8H.mjs';
+import { i as isScriptInjected, c as createScript } from '../shared/@databuddy/sdk.F8Xt1uF7.mjs';
 import { d as detectClientId } from '../shared/@databuddy/sdk.BUsPV0LH.mjs';
-import { createStore, atom, Provider, useAtom } from 'jotai';
-import { useRef, useEffect, createElement } from 'react';
+import React, { useRef, useMemo, useEffect, useSyncExternalStore, createContext, useContext } from 'react';
+import { B as BrowserFlagStorage, C as CoreFlagsManager } from '../shared/@databuddy/sdk.Du7SE7-M.mjs';
+import { l as logger } from '../shared/@databuddy/sdk.3kaCzyfu.mjs';
 
 function Databuddy(props) {
   const clientId = detectClientId(props.clientId);
@@ -22,101 +23,192 @@ function Databuddy(props) {
   return null;
 }
 
-const flagsStore = createStore();
-const managerAtom = atom(null);
-const memoryFlagsAtom = atom({});
+const FlagsReactContext = createContext(null);
+function createFlagState(result, isLoading, isPending) {
+  if (isPending) {
+    return {
+      on: false,
+      enabled: false,
+      status: "pending",
+      loading: true,
+      isLoading: true,
+      isReady: false
+    };
+  }
+  if (isLoading || !result) {
+    return {
+      on: false,
+      enabled: false,
+      status: "loading",
+      loading: true,
+      isLoading: true,
+      isReady: false
+    };
+  }
+  const status = result.reason === "ERROR" ? "error" : "ready";
+  return {
+    on: result.enabled,
+    enabled: result.enabled,
+    status,
+    loading: false,
+    isLoading: false,
+    isReady: true,
+    value: result.value,
+    variant: result.variant
+  };
+}
 function FlagsProvider({ children, ...config }) {
-  const managerRef = useRef(null);
-  useEffect(() => {
+  const storeRef = useRef({ flags: {}, isReady: false });
+  const listenersRef = useRef(/* @__PURE__ */ new Set());
+  const manager = useMemo(() => {
     const storage = config.skipStorage ? void 0 : new BrowserFlagStorage();
-    const manager = new CoreFlagsManager({
+    return new CoreFlagsManager({
       config,
       storage,
       onFlagsUpdate: (flags) => {
-        flagsStore.set(memoryFlagsAtom, flags);
+        storeRef.current = { ...storeRef.current, flags };
+        for (const listener of listenersRef.current) {
+          listener();
+        }
+      },
+      onReady: () => {
+        storeRef.current = { ...storeRef.current, isReady: true };
+        for (const listener of listenersRef.current) {
+          listener();
+        }
       }
     });
-    managerRef.current = manager;
-    flagsStore.set(managerAtom, manager);
-    return () => {
-      managerRef.current = null;
-      flagsStore.set(managerAtom, null);
-    };
-  }, [
-    config.clientId,
-    config.apiUrl,
-    config.user?.userId,
-    config.user?.email,
-    config.disabled,
-    config.debug,
-    config.skipStorage,
-    config.isPending,
-    config.autoFetch
-  ]);
+  }, [config.clientId]);
+  const prevConfigRef = useRef(config);
   useEffect(() => {
-    if (managerRef.current) {
-      managerRef.current.updateConfig(config);
+    const prevConfig = prevConfigRef.current;
+    const configChanged = prevConfig.apiUrl !== config.apiUrl || prevConfig.isPending !== config.isPending || prevConfig.user?.userId !== config.user?.userId || prevConfig.user?.email !== config.user?.email || prevConfig.environment !== config.environment || prevConfig.disabled !== config.disabled || prevConfig.autoFetch !== config.autoFetch || prevConfig.cacheTtl !== config.cacheTtl || prevConfig.staleTime !== config.staleTime;
+    if (configChanged) {
+      prevConfigRef.current = config;
+      manager.updateConfig(config);
     }
-  }, [
-    config.clientId,
-    config.apiUrl,
-    config.user?.userId,
-    config.user?.email,
-    config.disabled,
-    config.debug,
-    config.skipStorage,
-    config.isPending,
-    config.autoFetch
-  ]);
-  return createElement(Provider, { store: flagsStore }, children);
+  }, [manager, config]);
+  useEffect(() => {
+    return () => {
+      manager.destroy();
+    };
+  }, [manager]);
+  const subscribe = useMemo(
+    () => (callback) => {
+      listenersRef.current.add(callback);
+      return () => {
+        listenersRef.current.delete(callback);
+      };
+    },
+    []
+  );
+  const getSnapshot = useMemo(() => () => storeRef.current, []);
+  const store = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+  const contextValue = useMemo(
+    () => ({
+      // Cleaner API: getFlag returns FlagState
+      getFlag: (key) => {
+        const result = store.flags[key];
+        const managerState = manager.isEnabled(key);
+        return createFlagState(
+          result,
+          managerState.isLoading,
+          config.isPending ?? false
+        );
+      },
+      // Simple boolean check
+      isOn: (key) => {
+        const result = store.flags[key];
+        if (result) {
+          return result.enabled;
+        }
+        const state = manager.isEnabled(key);
+        return state.enabled;
+      },
+      // Get typed value
+      getValue: (key, defaultValue) => {
+        const result = store.flags[key];
+        if (result) {
+          return result.value;
+        }
+        return manager.getValue(key, defaultValue);
+      },
+      // Async fetch
+      fetchFlag: (key) => manager.getFlag(key),
+      fetchAllFlags: () => manager.fetchAllFlags(),
+      updateUser: (user) => manager.updateUser(user),
+      refresh: (forceClear = false) => manager.refresh(forceClear),
+      isReady: store.isReady,
+      // Deprecated: kept for backwards compatibility
+      isEnabled: (key) => {
+        const result = store.flags[key];
+        const managerState = manager.isEnabled(key);
+        return createFlagState(
+          result,
+          managerState.isLoading,
+          config.isPending ?? false
+        );
+      }
+    }),
+    [manager, store, config.isPending]
+  );
+  return /* @__PURE__ */ React.createElement(FlagsReactContext.Provider, { value: contextValue }, children);
 }
 function useFlags() {
-  const [manager] = useAtom(managerAtom, { store: flagsStore });
-  const [memoryFlags] = useAtom(memoryFlagsAtom, {
-    store: flagsStore
-  });
-  logger.debug("useFlags called with manager:", {
-    hasManager: !!manager,
-    memoryFlagsCount: Object.keys(memoryFlags).length,
-    memoryFlags: Object.keys(memoryFlags)
-  });
-  const isEnabled = (key) => {
-    if (!manager) {
-      return {
+  const context = useContext(FlagsReactContext);
+  if (!context) {
+    logger.warn("useFlags called outside FlagsProvider");
+    return {
+      isEnabled: () => createFlagState(void 0, false, false),
+      getFlag: () => createFlagState(void 0, false, false),
+      isOn: () => false,
+      getValue: (_key, defaultValue) => defaultValue ?? false,
+      fetchFlag: async () => ({
         enabled: false,
-        isLoading: false,
-        isReady: false
-      };
-    }
-    return manager.isEnabled(key);
-  };
-  const fetchAllFlags = () => {
-    if (!manager) {
-      logger.warn("No manager for bulk fetch");
-      return;
-    }
-    return manager.fetchAllFlags();
-  };
-  const updateUser = (user) => {
-    if (!manager) {
-      logger.warn("No manager for user update");
-      return;
-    }
-    manager.updateUser(user);
-  };
-  const refresh = (forceClear = false) => {
-    if (!manager) {
-      logger.warn("No manager for refresh");
-      return;
-    }
-    manager.refresh(forceClear);
-  };
+        value: false,
+        payload: null,
+        reason: "NO_PROVIDER"
+      }),
+      fetchAllFlags: async () => {
+      },
+      updateUser: () => {
+      },
+      refresh: async () => {
+      },
+      isReady: false
+    };
+  }
+  return context;
+}
+function useFlag(key) {
+  const { getFlag } = useFlags();
+  return getFlag(key);
+}
+function useFeature(key) {
+  const flag = useFlag(key);
   return {
-    isEnabled,
-    fetchAllFlags,
-    updateUser,
-    refresh
+    on: flag.on,
+    loading: flag.loading,
+    status: flag.status,
+    value: flag.value,
+    variant: flag.variant
   };
 }
+function useFeatureOn(key, defaultValue = false) {
+  const { isOn, isReady } = useFlags();
+  const flag = useFlag(key);
+  if (flag.loading || !isReady) {
+    return defaultValue;
+  }
+  return isOn(key);
+}
+function useFlagValue(key, defaultValue) {
+  const { getValue } = useFlags();
+  return getValue(key, defaultValue);
+}
+function useVariant(key) {
+  const flag = useFlag(key);
+  return flag.variant;
+}
 
-export { Databuddy, FlagsProvider, useFlags };
+export { Databuddy, FlagsProvider, useFeature, useFeatureOn, useFlag, useFlagValue, useFlags, useVariant };

package/dist/shared/@databuddy/sdk.3kaCzyfu.mjs

@@ -0,0 +1,199 @@
+class Logger {
+  debugEnabled = false;
+  /**
+   * Enable or disable debug logging
+   */
+  setDebug(enabled) {
+    this.debugEnabled = enabled;
+  }
+  /**
+   * Log debug messages (only when debug is enabled)
+   */
+  debug(...args) {
+    if (this.debugEnabled) {
+      console.log("[Databuddy]", ...args);
+    }
+  }
+  /**
+   * Log info messages (always enabled)
+   */
+  info(...args) {
+    console.info("[Databuddy]", ...args);
+  }
+  /**
+   * Log warning messages (always enabled)
+   */
+  warn(...args) {
+    console.warn("[Databuddy]", ...args);
+  }
+  /**
+   * Log error messages (always enabled)
+   */
+  error(...args) {
+    console.error("[Databuddy]", ...args);
+  }
+  /**
+   * Log with table format (only when debug is enabled)
+   */
+  table(data) {
+    if (this.debugEnabled) {
+      console.table(data);
+    }
+  }
+  /**
+   * Time a function execution (only when debug is enabled)
+   */
+  time(label) {
+    if (this.debugEnabled) {
+      console.time(`[Databuddy] ${label}`);
+    }
+  }
+  /**
+   * End timing a function execution (only when debug is enabled)
+   */
+  timeEnd(label) {
+    if (this.debugEnabled) {
+      console.timeEnd(`[Databuddy] ${label}`);
+    }
+  }
+  /**
+   * Log JSON data (only when debug is enabled)
+   */
+  json(data) {
+    if (this.debugEnabled) {
+      console.log("[Databuddy]", JSON.stringify(data, null, 2));
+    }
+  }
+}
+const logger = new Logger();
+
+const DEFAULT_RESULT = {
+  enabled: false,
+  value: false,
+  payload: null,
+  reason: "DEFAULT"
+};
+function getCacheKey(key, user) {
+  if (!(user?.userId || user?.email)) {
+    return key;
+  }
+  return `${key}:${user.userId ?? ""}:${user.email ?? ""}`;
+}
+function buildQueryParams(config, user) {
+  const params = new URLSearchParams();
+  params.set("clientId", config.clientId);
+  const u = user ?? config.user;
+  if (u?.userId) {
+    params.set("userId", u.userId);
+  }
+  if (u?.email) {
+    params.set("email", u.email);
+  }
+  if (u?.properties) {
+    params.set("properties", JSON.stringify(u.properties));
+  }
+  if (config.environment) {
+    params.set("environment", config.environment);
+  }
+  return params;
+}
+async function fetchFlags(apiUrl, keys, params) {
+  const batchParams = new URLSearchParams(params);
+  batchParams.set("keys", keys.join(","));
+  const url = `${apiUrl}/public/v1/flags/bulk?${batchParams}`;
+  const response = await fetch(url);
+  if (!response.ok) {
+    const result = {};
+    for (const key of keys) {
+      result[key] = { ...DEFAULT_RESULT, reason: "ERROR" };
+    }
+    return result;
+  }
+  const data = await response.json();
+  return data.flags ?? {};
+}
+async function fetchAllFlags(apiUrl, params) {
+  const url = `${apiUrl}/public/v1/flags/bulk?${params}`;
+  const response = await fetch(url);
+  if (!response.ok) {
+    return {};
+  }
+  const data = await response.json();
+  return data.flags ?? {};
+}
+function isCacheValid(entry) {
+  if (!entry) {
+    return false;
+  }
+  return Date.now() <= entry.expiresAt;
+}
+function isCacheStale(entry) {
+  return Date.now() > entry.staleAt;
+}
+function createCacheEntry(result, ttl, staleTime) {
+  const now = Date.now();
+  return {
+    result,
+    staleAt: now + (staleTime ?? ttl / 2),
+    expiresAt: now + ttl
+  };
+}
+class RequestBatcher {
+  pending = /* @__PURE__ */ new Map();
+  timer = null;
+  batchDelayMs;
+  apiUrl;
+  params;
+  constructor(apiUrl, params, batchDelayMs = 10) {
+    this.apiUrl = apiUrl;
+    this.params = params;
+    this.batchDelayMs = batchDelayMs;
+  }
+  request(key) {
+    return new Promise((resolve, reject) => {
+      const existing = this.pending.get(key);
+      if (existing) {
+        existing.push({ resolve, reject });
+      } else {
+        this.pending.set(key, [{ resolve, reject }]);
+      }
+      if (!this.timer) {
+        this.timer = setTimeout(() => this.flush(), this.batchDelayMs);
+      }
+    });
+  }
+  async flush() {
+    this.timer = null;
+    const keys = [...this.pending.keys()];
+    const callbacks = new Map(this.pending);
+    this.pending.clear();
+    if (keys.length === 0) {
+      return;
+    }
+    try {
+      const results = await fetchFlags(this.apiUrl, keys, this.params);
+      for (const [key, cbs] of callbacks) {
+        const result = results[key] ?? { ...DEFAULT_RESULT, reason: "NOT_FOUND" };
+        for (const cb of cbs) {
+          cb.resolve(result);
+        }
+      }
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error("Fetch failed");
+      for (const cbs of callbacks.values()) {
+        for (const cb of cbs) {
+          cb.reject(error);
+        }
+      }
+    }
+  }
+  destroy() {
+    if (this.timer) {
+      clearTimeout(this.timer);
+      this.timer = null;
+    }
+    this.pending.clear();
+  }
+}
+
+export { DEFAULT_RESULT as D, RequestBatcher as R, isCacheStale as a, buildQueryParams as b, createCacheEntry as c, fetchAllFlags as f, getCacheKey as g, isCacheValid as i, logger as l };