@coframe/sdk 1.1.30 → 1.1.32

package/dist/pkg/feature-flags.esm.mjs

@@ -96,6 +96,206 @@ const setUserTokenCookie = (uuid, logger) => {
     setCookie(USER_TOKEN_COOKIE_KEY, uuid);
 };
 
+const FEATURE_FLAG_EVENT_TYPE = 'feature_flag_called';
+const FEATURE_FLAG_BATCH_BYTES = 48 * 1024;
+function resolveFeatureFlagIngestBase(customUrl) {
+    const normalized = customUrl === null || customUrl === void 0 ? void 0 : customUrl.trim().replace(/\/+$/, '');
+    return normalized || "https://ingest.app.coframe.com/ingest/v2";
+}
+function featureFlagEventsEndpoint(ingestBase, projectId) {
+    return `${ingestBase}/batched_events/${projectId}/`;
+}
+function featureFlagValue(result) {
+    var _a;
+    return (_a = result.variant) !== null && _a !== void 0 ? _a : result.enabled;
+}
+function snapshotPayload(payload) {
+    return payload === null
+        ? null
+        : JSON.parse(JSON.stringify(payload));
+}
+function newEventId() {
+    const cryptoObject = globalThis.crypto;
+    if ((cryptoObject === null || cryptoObject === void 0 ? void 0 : cryptoObject.randomUUID) || (cryptoObject === null || cryptoObject === void 0 ? void 0 : cryptoObject.getRandomValues)) {
+        return generateUUID();
+    }
+    return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (char) => {
+        const random = Math.floor(Math.random() * 16);
+        return (char === 'x' ? random : (random & 0x3) | 0x8).toString(16);
+    });
+}
+function createFeatureFlagTrackingEvent(access) {
+    var _a;
+    const { result, response } = access;
+    const errors = [];
+    if (response.errorsWhileComputingFlags) {
+        errors.push('errors_while_computing_flags');
+    }
+    if (!result)
+        errors.push('flag_missing');
+    return {
+        event_id: newEventId(),
+        project_id: access.projectId,
+        session_id: access.sessionId,
+        type: FEATURE_FLAG_EVENT_TYPE,
+        time: new Date().toISOString(),
+        url: access.url,
+        user_token: access.userToken,
+        content: {
+            metadata: {
+                key: access.key,
+                ...(result
+                    ? {
+                        value: featureFlagValue(result),
+                        payload: snapshotPayload('payload' in result ? ((_a = result.payload) !== null && _a !== void 0 ? _a : null) : null),
+                        version: result.metadata.version,
+                        reason: result.reason,
+                    }
+                    : {}),
+                request_id: response.requestId,
+                snapshot_version: response.snapshotVersion,
+                ...(errors.length > 0 ? { error: errors.join(',') } : {}),
+            },
+        },
+    };
+}
+function jsonBytes(value) {
+    return new TextEncoder().encode(JSON.stringify(value)).byteLength;
+}
+function chunkFeatureFlagEvents(events) {
+    const chunks = [];
+    let current = [];
+    for (const event of events) {
+        if (current.length > 0 &&
+            jsonBytes([...current, event]) > FEATURE_FLAG_BATCH_BYTES) {
+            chunks.push(current);
+            current = [];
+        }
+        current.push(event);
+    }
+    if (current.length > 0)
+        chunks.push(current);
+    return chunks;
+}
+
+const FLUSH_INTERVAL_MS = 3000;
+const BATCH_SIZE = 32;
+const MAX_QUEUE_SIZE = 1000;
+let config$1;
+let ingestBase = '';
+let sessionId = '';
+let consentAllowed = true;
+let queue = [];
+let flushTimer;
+let warnedQueueFull = false;
+let warnedTransport = false;
+function installLifecycle() {
+    if (typeof window === 'undefined')
+        return;
+    flushTimer = window.setInterval(flushFeatureFlagBrowserEvents, FLUSH_INTERVAL_MS);
+    window.addEventListener('pagehide', flushFeatureFlagBrowserEvents);
+    if (typeof document !== 'undefined') {
+        document.addEventListener('visibilitychange', flushWhenHidden);
+    }
+}
+function removeLifecycle() {
+    if (typeof window === 'undefined')
+        return;
+    if (flushTimer !== undefined)
+        window.clearInterval(flushTimer);
+    flushTimer = undefined;
+    window.removeEventListener('pagehide', flushFeatureFlagBrowserEvents);
+    if (typeof document !== 'undefined') {
+        document.removeEventListener('visibilitychange', flushWhenHidden);
+    }
+}
+function flushWhenHidden() {
+    if (typeof document !== 'undefined' &&
+        document.visibilityState === 'hidden') {
+        flushFeatureFlagBrowserEvents();
+    }
+}
+function configureFeatureFlagBrowserTracking(nextConfig) {
+    removeLifecycle();
+    const nextIngestBase = resolveFeatureFlagIngestBase(nextConfig.ingestUrl);
+    const sameTarget = (config$1 === null || config$1 === void 0 ? void 0 : config$1.projectId) === nextConfig.projectId && ingestBase === nextIngestBase;
+    if (!sameTarget) {
+        flushFeatureFlagBrowserEvents();
+        queue = [];
+    }
+    config$1 = nextConfig;
+    ingestBase = nextIngestBase;
+    consentAllowed = nextConfig.consentAllowed;
+    warnedQueueFull = false;
+    warnedTransport = false;
+    sessionId || (sessionId = generateUUID());
+    installLifecycle();
+}
+function updateFeatureFlagTrackingUserToken(nextUserToken) {
+    if (config$1)
+        config$1.userToken = nextUserToken;
+}
+function setFeatureFlagTrackingConsent(enabled) {
+    consentAllowed = enabled;
+    if (enabled) {
+        flushFeatureFlagBrowserEvents();
+    }
+}
+function trackFeatureFlagBrowserAccess(key, result, response) {
+    if (!config$1)
+        return;
+    const access = {
+        projectId: config$1.projectId,
+        sessionId,
+        userToken: config$1.userToken,
+        url: typeof window === 'undefined' ? '' : window.location.href,
+        key,
+        result,
+        response,
+    };
+    queue.push(createFeatureFlagTrackingEvent(access));
+    if (queue.length > MAX_QUEUE_SIZE) {
+        queue.shift();
+        if (!warnedQueueFull) {
+            warnedQueueFull = true;
+            console.warn('[Coframe] Feature Flag tracking queue is full');
+        }
+    }
+    if (consentAllowed && queue.length >= BATCH_SIZE) {
+        flushFeatureFlagBrowserEvents();
+    }
+}
+function flushFeatureFlagBrowserEvents() {
+    if (!config$1 || !consentAllowed || queue.length === 0)
+        return;
+    const events = queue;
+    queue = [];
+    const endpoint = featureFlagEventsEndpoint(ingestBase, config$1.projectId);
+    if (typeof navigator === 'undefined' || !navigator.sendBeacon) {
+        if (!warnedTransport) {
+            warnedTransport = true;
+            console.warn('[Coframe] Feature Flag tracking requires navigator.sendBeacon');
+        }
+        return;
+    }
+    try {
+        for (const chunk of chunkFeatureFlagEvents(events)) {
+            const blob = new Blob([JSON.stringify(chunk)], { type: 'text/plain' });
+            if (!navigator.sendBeacon(endpoint, blob))
+                warnTransport();
+        }
+    }
+    catch (_a) {
+        warnTransport();
+    }
+}
+function warnTransport() {
+    if (warnedTransport)
+        return;
+    warnedTransport = true;
+    console.warn('[Coframe] Failed to send Feature Flag tracking beacon');
+}
+
 const DEFAULT_TIMEOUT_MS = 3000;
 const DEFAULT_CACHE_TTL_MS = 5 * 60 * 1000;
 const CACHE_PREFIX = 'coframe.featureFlags.';
@@ -239,7 +439,7 @@ async function fetchFeatureFlags(context) {
         window.clearTimeout(timeout);
     }
 }
-async function initializeFeatureFlags(nextConfig, nextProjectId, nextUserToken, nextUserContext) {
+async function initializeFeatureFlags(nextConfig, nextProjectId, nextUserToken, nextUserContext, trackingConsentAllowed = true) {
     var _a;
     if (!nextConfig)
         return;
@@ -247,6 +447,12 @@ async function initializeFeatureFlags(nextConfig, nextProjectId, nextUserToken,
     projectId = nextProjectId;
     userToken = nextUserToken;
     userContext = nextUserContext;
+    configureFeatureFlagBrowserTracking({
+        projectId: nextProjectId,
+        userToken: nextUserToken,
+        ingestUrl: nextConfig.ingestUrl,
+        consentAllowed: trackingConsentAllowed,
+    });
     requestGeneration += 1;
     inFlight = undefined;
     inFlightContextKey = undefined;
@@ -334,6 +540,7 @@ function updateFeatureFlagUserToken(nextUserToken) {
     if (nextUserToken === userToken)
         return;
     userToken = nextUserToken;
+    updateFeatureFlagTrackingUserToken(nextUserToken);
     requestGeneration += 1;
     inFlight = undefined;
     inFlightContextKey = undefined;
@@ -360,23 +567,43 @@ function onFeatureFlags(callback) {
             listeners.splice(index, 1);
     };
 }
-function getFeatureFlagResult(key) {
+function peekFeatureFlagResult(key) {
     return response === null || response === void 0 ? void 0 : response.flags[key];
 }
-function getFeatureFlag(key) {
+let warnedTrackingFailure = false;
+function trackFeatureFlagAccess(key) {
+    if (!response)
+        return;
+    try {
+        trackFeatureFlagBrowserAccess(key, response.flags[key], response);
+    }
+    catch (_a) {
+        if (!warnedTrackingFailure) {
+            warnedTrackingFailure = true;
+            console.warn('[Coframe] Feature Flag tracking failed');
+        }
+    }
+}
+function getFeatureFlagResult(key, options = {}) {
+    const result = peekFeatureFlagResult(key);
+    if (options.sendEvent !== false)
+        trackFeatureFlagAccess(key);
+    return result;
+}
+function getFeatureFlag(key, options) {
     var _a;
-    const result = getFeatureFlagResult(key);
+    const result = getFeatureFlagResult(key, options);
     if (!result)
         return undefined;
     return (_a = result.variant) !== null && _a !== void 0 ? _a : result.enabled;
 }
 function isFeatureEnabled(key, options) {
     var _a, _b;
-    return (_b = (_a = getFeatureFlagResult(key)) === null || _a === void 0 ? void 0 : _a.enabled) !== null && _b !== void 0 ? _b : options === null || options === void 0 ? void 0 : options.defaultValue;
+    return (_b = (_a = getFeatureFlagResult(key, options)) === null || _a === void 0 ? void 0 : _a.enabled) !== null && _b !== void 0 ? _b : options === null || options === void 0 ? void 0 : options.defaultValue;
 }
-function getFeatureFlagPayload(key) {
+function getFeatureFlagPayload(key, options) {
     var _a;
-    const result = getFeatureFlagResult(key);
+    const result = getFeatureFlagResult(key, options);
     if (!result)
         return undefined;
     return 'payload' in result ? ((_a = result.payload) !== null && _a !== void 0 ? _a : null) : null;
@@ -509,6 +736,7 @@ function persistIdentity() {
 }
 function applyConsent(enabled) {
     setCookiesEnabled(enabled);
+    setFeatureFlagTrackingConsent(enabled);
     if (enabled)
         persistIdentity();
 }
@@ -550,6 +778,7 @@ function installConsentSync() {
     subscribeToCmd((cmd) => typeof cmd.cookiesEnabled === 'boolean', (cmd) => applyConsent(!!cmd.cookiesEnabled));
 }
 function initFeatureFlags(options) {
+    var _a, _b;
     const queuedConsent = getQueuedConsent();
     installConsentSync();
     const queuedUserToken = options.userToken ? undefined : getQueuedUserToken();
@@ -571,8 +800,9 @@ function initFeatureFlags(options) {
     if (options.reloadOnSpaNavigation !== false) {
         installSpaNavigationReload();
     }
-    const { selector, requestTimeoutMs, cacheTtlMs } = options;
-    return initializeFeatureFlags({ selector, requestTimeoutMs, cacheTtlMs }, options.projectId, currentUserToken, options.userContext);
+    const { selector, requestTimeoutMs, cacheTtlMs, ingestUrl } = options;
+    const trackingConsentAllowed = (_b = (_a = options.consent) !== null && _a !== void 0 ? _a : queuedConsent) !== null && _b !== void 0 ? _b : true;
+    return initializeFeatureFlags({ selector, requestTimeoutMs, cacheTtlMs, ingestUrl }, options.projectId, currentUserToken, options.userContext, trackingConsentAllowed);
 }
 function setUserToken(userToken) {
     currentUserToken = requireIdentity(userToken);

package/dist/pkg/react.cjs.js

@@ -62,29 +62,35 @@ function useCoframeVariant(experimentId) {
     var _a;
     return (_a = useCoframeTreatment(experimentId)) === null || _a === void 0 ? void 0 : _a.variantId;
 }
-function useFeatureFlagResult(key) {
-    const [result, setResult] = React.useState(() => featureFlags.getFeatureFlagResult(key));
+function useFeatureFlagResult(key, options) {
+    const [result, setResult] = React.useState(() => featureFlags.getFeatureFlagResult(key, { sendEvent: false }));
+    const sendEvent = options === null || options === void 0 ? void 0 : options.sendEvent;
     React.useEffect(() => {
-        setResult(featureFlags.getFeatureFlagResult(key));
-        return featureFlags.onFeatureFlags(() => setResult(featureFlags.getFeatureFlagResult(key)));
-    }, [key]);
+        let subscribing = true;
+        const unsubscribe = featureFlags.onFeatureFlags(() => setResult(featureFlags.getFeatureFlagResult(key, {
+            sendEvent: subscribing ? false : sendEvent,
+        })));
+        subscribing = false;
+        setResult(featureFlags.getFeatureFlagResult(key, { sendEvent }));
+        return unsubscribe;
+    }, [key, sendEvent]);
     return result;
 }
-function useFeatureFlagVariantKey(key) {
+function useFeatureFlagVariantKey(key, options) {
     var _a;
-    const result = useFeatureFlagResult(key);
+    const result = useFeatureFlagResult(key, options);
     if (!result)
         return undefined;
     return (_a = result.variant) !== null && _a !== void 0 ? _a : result.enabled;
 }
 const useFeatureFlag = useFeatureFlagVariantKey;
-function useFeatureFlagEnabled(key) {
+function useFeatureFlagEnabled(key, options) {
     var _a;
-    return (_a = useFeatureFlagResult(key)) === null || _a === void 0 ? void 0 : _a.enabled;
+    return (_a = useFeatureFlagResult(key, options)) === null || _a === void 0 ? void 0 : _a.enabled;
 }
-function useFeatureFlagPayload(key) {
+function useFeatureFlagPayload(key, options) {
     var _a;
-    const result = useFeatureFlagResult(key);
+    const result = useFeatureFlagResult(key, options);
     if (!result)
         return undefined;
     return 'payload' in result ? ((_a = result.payload) !== null && _a !== void 0 ? _a : null) : null;

package/dist/pkg/react.esm.mjs

@@ -61,29 +61,35 @@ function useCoframeVariant(experimentId) {
     var _a;
     return (_a = useCoframeTreatment(experimentId)) === null || _a === void 0 ? void 0 : _a.variantId;
 }
-function useFeatureFlagResult(key) {
-    const [result, setResult] = useState(() => getFeatureFlagResult(key));
+function useFeatureFlagResult(key, options) {
+    const [result, setResult] = useState(() => getFeatureFlagResult(key, { sendEvent: false }));
+    const sendEvent = options === null || options === void 0 ? void 0 : options.sendEvent;
     useEffect(() => {
-        setResult(getFeatureFlagResult(key));
-        return onFeatureFlags(() => setResult(getFeatureFlagResult(key)));
-    }, [key]);
+        let subscribing = true;
+        const unsubscribe = onFeatureFlags(() => setResult(getFeatureFlagResult(key, {
+            sendEvent: subscribing ? false : sendEvent,
+        })));
+        subscribing = false;
+        setResult(getFeatureFlagResult(key, { sendEvent }));
+        return unsubscribe;
+    }, [key, sendEvent]);
     return result;
 }
-function useFeatureFlagVariantKey(key) {
+function useFeatureFlagVariantKey(key, options) {
     var _a;
-    const result = useFeatureFlagResult(key);
+    const result = useFeatureFlagResult(key, options);
     if (!result)
         return undefined;
     return (_a = result.variant) !== null && _a !== void 0 ? _a : result.enabled;
 }
 const useFeatureFlag = useFeatureFlagVariantKey;
-function useFeatureFlagEnabled(key) {
+function useFeatureFlagEnabled(key, options) {
     var _a;
-    return (_a = useFeatureFlagResult(key)) === null || _a === void 0 ? void 0 : _a.enabled;
+    return (_a = useFeatureFlagResult(key, options)) === null || _a === void 0 ? void 0 : _a.enabled;
 }
-function useFeatureFlagPayload(key) {
+function useFeatureFlagPayload(key, options) {
     var _a;
-    const result = useFeatureFlagResult(key);
+    const result = useFeatureFlagResult(key, options);
     if (!result)
         return undefined;
     return 'payload' in result ? ((_a = result.payload) !== null && _a !== void 0 ? _a : null) : null;