@ninetailed/experience.js 7.12.0-beta.0 → 7.13.0-beta.0

package/index.cjs.js

@@ -559,7 +559,7 @@ const selectPluginsHavingExperienceSelectionMiddleware = plugins => {
   return filteredPlugins;
 };
 
-const createPassThroughMiddleware = () => {
+const createPassThroughMiddleware$1 = () => {
   return ({
     experience,
     variant,
@@ -579,7 +579,7 @@ function createExperienceSelectionMiddleware({
   profile
 }) {
   if (profile === null) {
-    return createPassThroughMiddleware();
+    return createPassThroughMiddleware$1();
   }
   const pluginsWithMiddleware = selectPluginsHavingExperienceSelectionMiddleware(plugins);
   const middlewareFunctions = [];
@@ -631,6 +631,110 @@ const makeExperienceSelectMiddleware = ({
   };
 };
 
+/**
+ * Type guard that checks if an object implements the HasChangesModificationMiddleware interface
+ *
+ * @param arg Object to check
+ * @returns Boolean indicating if the object implements HasChangesModificationMiddleware
+ */
+const hasChangesModificationMiddleware = arg => {
+  return typeof arg === 'object' && arg !== null && 'getChangesModificationMiddleware' in arg && typeof arg.getChangesModificationMiddleware === 'function';
+};
+
+/**
+ * Selects plugins that implement the HasChangesModificationMiddleware interface
+ *
+ * @param plugins Array of Ninetailed plugins
+ * @returns Array of plugins that implement HasChangesModificationMiddleware
+ */
+const selectPluginsHavingChangesModificationMiddleware = plugins => {
+  const filteredPlugins = [];
+  for (const plugin of plugins) {
+    if (hasChangesModificationMiddleware(plugin)) {
+      filteredPlugins.push(plugin);
+    }
+  }
+  return filteredPlugins;
+};
+
+/**
+ * Creates a pass-through middleware that doesn't modify changes
+ */
+const createPassThroughMiddleware = () => {
+  return ({
+    changes
+  }) => {
+    return {
+      changes
+    };
+  };
+};
+/**
+ * Creates a middleware function by composing middleware from multiple plugins
+ */
+function createChangesModificationMiddleware({
+  plugins,
+  changes
+}) {
+  const pluginsWithMiddleware = selectPluginsHavingChangesModificationMiddleware(plugins);
+  const middlewareFunctions = [];
+  for (const plugin of pluginsWithMiddleware) {
+    const middleware = plugin.getChangesModificationMiddleware({
+      changes
+    });
+    if (middleware !== undefined) {
+      middlewareFunctions.push(middleware);
+    }
+  }
+  // If no middleware functions were found, return a pass-through middleware
+  if (middlewareFunctions.length === 0) {
+    return createPassThroughMiddleware();
+  }
+  // Compose middleware functions using pipe
+  return experience_jsShared.pipe(...middlewareFunctions);
+}
+/**
+ * Creates a changes modification middleware system with change notification
+ *
+ * This follows the same pattern as the experience selection middleware system
+ */
+const makeChangesModificationMiddleware = ({
+  plugins,
+  onChange,
+  changes
+}) => {
+  let removeChangeListeners = [];
+  const pluginsHavingChangeEmitters = selectPluginsHavingOnChangeEmitter(plugins);
+  const middleware = createChangesModificationMiddleware({
+    plugins,
+    changes
+  });
+  const addListeners = () => {
+    removeChangeListeners = pluginsHavingChangeEmitters.map(plugin => {
+      const listener = () => {
+        // When a plugin changes, recreate the middleware and notify
+        const updatedMiddleware = createChangesModificationMiddleware({
+          plugins,
+          changes
+        });
+        onChange(updatedMiddleware);
+      };
+      return plugin.onChangeEmitter.addListener(listener);
+    });
+  };
+  // WARNING: This specific implementation using forEach is required.
+  // DO NOT replace with for...of or other loop constructs as they will break functionality.
+  // The exact reason is uncertain but appears related to the transpiler.
+  const removeListeners = () => {
+    removeChangeListeners.forEach(removeListener => removeListener());
+  };
+  return {
+    addListeners,
+    removeListeners,
+    middleware
+  };
+};
+
 class EventBuilder {
   constructor(buildRequestContext) {
     this.buildRequestContext = buildRequestContext || buildClientNinetailedRequestContext;
@@ -1040,15 +1144,77 @@ class Ninetailed {
     };
     /**
      * Registers a callback to be notified when changes occur in the profile state.
+     * Uses the changes modification middleware system to process changes.
+     * Changes are processed in the following order:
      *
      * @param cb - Callback function that receives the changes state
      * @returns Function to unsubscribe from changes updates
      */
     this.onChangesChange = cb => {
+      // Initially notify with current state
       this.notifyChangesCallback(cb, this._profileState);
-      return this.onProfileChange(profileState => {
-        this.notifyChangesCallback(cb, profileState);
+      let middlewareChangeListeners = [];
+      const removeProfileChangeListener = this.onProfileChange(profileState => {
+        // Clean up any existing middleware listeners
+        middlewareChangeListeners.forEach(removeListener => removeListener());
+        middlewareChangeListeners = [];
+        // If we're in loading or error state, simply pass through
+        if (profileState.status !== 'success') {
+          this.notifyChangesCallback(cb, profileState);
+          return;
+        }
+        // Set up middleware for changes
+        const {
+          addListeners,
+          removeListeners,
+          middleware: changesModificationMiddleware
+        } = makeChangesModificationMiddleware({
+          plugins: this.plugins,
+          changes: profileState.changes || [],
+          onChange: updatedMiddleware => {
+            // When plugin state changes, reapply middleware to current changes
+            if (profileState.status === 'success' && profileState.changes) {
+              const {
+                changes: modifiedChanges
+              } = updatedMiddleware({
+                changes: profileState.changes
+              });
+              cb({
+                status: 'success',
+                changes: modifiedChanges,
+                error: null
+              });
+            }
+          }
+        });
+        // Add listeners for plugin changes
+        addListeners();
+        middlewareChangeListeners.push(removeListeners);
+        // Apply middleware to current changes
+        if (profileState.changes) {
+          const {
+            changes: modifiedChanges
+          } = changesModificationMiddleware({
+            changes: profileState.changes
+          });
+          cb({
+            status: 'success',
+            changes: modifiedChanges,
+            error: null
+          });
+        } else {
+          cb({
+            status: 'success',
+            changes: [],
+            error: null
+          });
+        }
       });
+      // Return a function that cleans up all listeners
+      return () => {
+        removeProfileChangeListener();
+        middlewareChangeListeners.forEach(removeListener => removeListener());
+      };
     };
     this.onIsInitialized = onIsInitializedCallback => {
       if (typeof onIsInitializedCallback === 'function') {
@@ -1411,6 +1577,7 @@ exports.PROFILE_RESET = PROFILE_RESET;
 exports.SET_ENABLED_FEATURES = SET_ENABLED_FEATURES;
 exports.buildClientNinetailedRequestContext = buildClientNinetailedRequestContext;
 exports.decodeExperienceVariantsMap = decodeExperienceVariantsMap;
+exports.makeChangesModificationMiddleware = makeChangesModificationMiddleware;
 exports.makeExperienceSelectMiddleware = makeExperienceSelectMiddleware;
 exports.selectPluginsHavingExperienceSelectionMiddleware = selectPluginsHavingExperienceSelectionMiddleware;
 exports.selectPluginsHavingOnChangeEmitter = selectPluginsHavingOnChangeEmitter;

package/index.esm.js

@@ -523,7 +523,7 @@ const selectPluginsHavingExperienceSelectionMiddleware = plugins => {
   return filteredPlugins;
 };
 
-const createPassThroughMiddleware = () => {
+const createPassThroughMiddleware$1 = () => {
   return ({
     experience,
     variant,
@@ -543,7 +543,7 @@ function createExperienceSelectionMiddleware({
   profile
 }) {
   if (profile === null) {
-    return createPassThroughMiddleware();
+    return createPassThroughMiddleware$1();
   }
   const pluginsWithMiddleware = selectPluginsHavingExperienceSelectionMiddleware(plugins);
   const middlewareFunctions = [];
@@ -596,6 +596,115 @@ const makeExperienceSelectMiddleware = ({
   };
 };
 
+/**
+ * Type guard that checks if an object implements the HasChangesModificationMiddleware interface
+ *
+ * @param arg Object to check
+ * @returns Boolean indicating if the object implements HasChangesModificationMiddleware
+ */
+const hasChangesModificationMiddleware = arg => {
+  return typeof arg === 'object' && arg !== null && 'getChangesModificationMiddleware' in arg && typeof arg.getChangesModificationMiddleware === 'function';
+};
+
+/**
+ * Selects plugins that implement the HasChangesModificationMiddleware interface
+ *
+ * @param plugins Array of Ninetailed plugins
+ * @returns Array of plugins that implement HasChangesModificationMiddleware
+ */
+const selectPluginsHavingChangesModificationMiddleware = plugins => {
+  const filteredPlugins = [];
+  for (const plugin of plugins) {
+    if (hasChangesModificationMiddleware(plugin)) {
+      filteredPlugins.push(plugin);
+    }
+  }
+  return filteredPlugins;
+};
+
+/**
+ * Creates a pass-through middleware that doesn't modify changes
+ */
+const createPassThroughMiddleware = () => {
+  return ({
+    changes
+  }) => {
+    return {
+      changes
+    };
+  };
+};
+
+/**
+ * Creates a middleware function by composing middleware from multiple plugins
+ */
+function createChangesModificationMiddleware({
+  plugins,
+  changes
+}) {
+  const pluginsWithMiddleware = selectPluginsHavingChangesModificationMiddleware(plugins);
+  const middlewareFunctions = [];
+  for (const plugin of pluginsWithMiddleware) {
+    const middleware = plugin.getChangesModificationMiddleware({
+      changes
+    });
+    if (middleware !== undefined) {
+      middlewareFunctions.push(middleware);
+    }
+  }
+
+  // If no middleware functions were found, return a pass-through middleware
+  if (middlewareFunctions.length === 0) {
+    return createPassThroughMiddleware();
+  }
+
+  // Compose middleware functions using pipe
+  return pipe(...middlewareFunctions);
+}
+
+/**
+ * Creates a changes modification middleware system with change notification
+ *
+ * This follows the same pattern as the experience selection middleware system
+ */
+const makeChangesModificationMiddleware = ({
+  plugins,
+  onChange,
+  changes
+}) => {
+  let removeChangeListeners = [];
+  const pluginsHavingChangeEmitters = selectPluginsHavingOnChangeEmitter(plugins);
+  const middleware = createChangesModificationMiddleware({
+    plugins,
+    changes
+  });
+  const addListeners = () => {
+    removeChangeListeners = pluginsHavingChangeEmitters.map(plugin => {
+      const listener = () => {
+        // When a plugin changes, recreate the middleware and notify
+        const updatedMiddleware = createChangesModificationMiddleware({
+          plugins,
+          changes
+        });
+        onChange(updatedMiddleware);
+      };
+      return plugin.onChangeEmitter.addListener(listener);
+    });
+  };
+
+  // WARNING: This specific implementation using forEach is required.
+  // DO NOT replace with for...of or other loop constructs as they will break functionality.
+  // The exact reason is uncertain but appears related to the transpiler.
+  const removeListeners = () => {
+    removeChangeListeners.forEach(removeListener => removeListener());
+  };
+  return {
+    addListeners,
+    removeListeners,
+    middleware
+  };
+};
+
 class EventBuilder {
   constructor(buildRequestContext) {
     this.buildRequestContext = void 0;
@@ -1023,15 +1132,82 @@ class Ninetailed {
     };
     /**
      * Registers a callback to be notified when changes occur in the profile state.
+     * Uses the changes modification middleware system to process changes.
+     * Changes are processed in the following order:
      *
      * @param cb - Callback function that receives the changes state
      * @returns Function to unsubscribe from changes updates
      */
     this.onChangesChange = cb => {
+      // Initially notify with current state
       this.notifyChangesCallback(cb, this._profileState);
-      return this.onProfileChange(profileState => {
-        this.notifyChangesCallback(cb, profileState);
+      let middlewareChangeListeners = [];
+      const removeProfileChangeListener = this.onProfileChange(profileState => {
+        // Clean up any existing middleware listeners
+        middlewareChangeListeners.forEach(removeListener => removeListener());
+        middlewareChangeListeners = [];
+
+        // If we're in loading or error state, simply pass through
+        if (profileState.status !== 'success') {
+          this.notifyChangesCallback(cb, profileState);
+          return;
+        }
+
+        // Set up middleware for changes
+        const {
+          addListeners,
+          removeListeners,
+          middleware: changesModificationMiddleware
+        } = makeChangesModificationMiddleware({
+          plugins: this.plugins,
+          changes: profileState.changes || [],
+          onChange: updatedMiddleware => {
+            // When plugin state changes, reapply middleware to current changes
+            if (profileState.status === 'success' && profileState.changes) {
+              const {
+                changes: modifiedChanges
+              } = updatedMiddleware({
+                changes: profileState.changes
+              });
+              cb({
+                status: 'success',
+                changes: modifiedChanges,
+                error: null
+              });
+            }
+          }
+        });
+
+        // Add listeners for plugin changes
+        addListeners();
+        middlewareChangeListeners.push(removeListeners);
+
+        // Apply middleware to current changes
+        if (profileState.changes) {
+          const {
+            changes: modifiedChanges
+          } = changesModificationMiddleware({
+            changes: profileState.changes
+          });
+          cb({
+            status: 'success',
+            changes: modifiedChanges,
+            error: null
+          });
+        } else {
+          cb({
+            status: 'success',
+            changes: [],
+            error: null
+          });
+        }
       });
+
+      // Return a function that cleans up all listeners
+      return () => {
+        removeProfileChangeListener();
+        middlewareChangeListeners.forEach(removeListener => removeListener());
+      };
     };
     this.onIsInitialized = onIsInitializedCallback => {
       if (typeof onIsInitializedCallback === 'function') {
@@ -1343,4 +1519,4 @@ const selectVariant = (baseline, variants, {
   };
 };
 
-export { ANONYMOUS_ID, CHANGES_FALLBACK_CACHE, COMPONENT, COMPONENT_START, CONSENT, DEBUG_FLAG, EMPTY_MERGE_ID, EXPERIENCES_FALLBACK_CACHE, EventBuilder, HAS_SEEN_STICKY_COMPONENT, LEGACY_ANONYMOUS_ID, Ninetailed, NinetailedCorePlugin, OnChangeEmitter, PAGE_HIDDEN, PLUGIN_NAME, PROFILE_CHANGE, PROFILE_FALLBACK_CACHE, PROFILE_RESET, SET_ENABLED_FEATURES, buildClientNinetailedRequestContext, decodeExperienceVariantsMap, makeExperienceSelectMiddleware, selectPluginsHavingExperienceSelectionMiddleware, selectPluginsHavingOnChangeEmitter, selectVariant };
+export { ANONYMOUS_ID, CHANGES_FALLBACK_CACHE, COMPONENT, COMPONENT_START, CONSENT, DEBUG_FLAG, EMPTY_MERGE_ID, EXPERIENCES_FALLBACK_CACHE, EventBuilder, HAS_SEEN_STICKY_COMPONENT, LEGACY_ANONYMOUS_ID, Ninetailed, NinetailedCorePlugin, OnChangeEmitter, PAGE_HIDDEN, PLUGIN_NAME, PROFILE_CHANGE, PROFILE_FALLBACK_CACHE, PROFILE_RESET, SET_ENABLED_FEATURES, buildClientNinetailedRequestContext, decodeExperienceVariantsMap, makeChangesModificationMiddleware, makeExperienceSelectMiddleware, selectPluginsHavingExperienceSelectionMiddleware, selectPluginsHavingOnChangeEmitter, selectVariant };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ninetailed/experience.js",
-  "version": "7.12.0-beta.0",
+  "version": "7.13.0-beta.0",
   "description": "Ninetailed SDK for javascript",
   "license": "MIT",
   "repository": {
@@ -9,8 +9,8 @@
     "directory": "packages/sdks/javascript"
   },
   "dependencies": {
-    "@ninetailed/experience.js-plugin-analytics": "7.12.0-beta.0",
-    "@ninetailed/experience.js-shared": "7.12.0-beta.0",
+    "@ninetailed/experience.js-plugin-analytics": "7.13.0-beta.0",
+    "@ninetailed/experience.js-shared": "7.13.0-beta.0",
     "analytics": "0.8.1",
     "uuid": "9.0.0"
   },

package/src/index.d.ts

@@ -8,6 +8,7 @@ export * from './lib/plugins/selectPluginsHavingExperienceSelectionMiddleware';
 export * from './lib/plugins/selectPluginsHavingOnChangeEmitter';
 export * from './lib/types/interfaces/RequiresEventBuilder';
 export * from './lib/types/interfaces/HasExperienceSelectionMiddleware';
+export * from './lib/types/interfaces/HasChangesModificationMiddleware';
 export * from './lib/types/interfaces/InterestedInSeenElements';
 export * from './lib/types/interfaces/InterestedInProfileChange';
 export * from './lib/types/interfaces/InterestedInHiddenPage';

package/src/lib/Ninetailed.d.ts

@@ -82,11 +82,13 @@ export declare class Ninetailed implements NinetailedInstance {
     onSelectVariant: <Baseline extends Reference, Variant extends Reference>({ baseline, experiences }: OnSelectVariantArgs<Baseline, Variant>, cb: OnSelectVariantCallback<Baseline, Variant>) => () => void;
     /**
      * Registers a callback to be notified when changes occur in the profile state.
+     * Uses the changes modification middleware system to process changes.
+     * Changes are processed in the following order:
      *
      * @param cb - Callback function that receives the changes state
      * @returns Function to unsubscribe from changes updates
      */
-    onChangesChange: (cb: OnChangesChangeCallback) => import("analytics").DetachListeners;
+    onChangesChange: (cb: OnChangesChangeCallback) => () => void;
     /**
      * Helper method to extract changes state from profile state and notify callback
      * @private

package/src/lib/experience/index.d.ts

@@ -2,3 +2,4 @@ export * from './types';
 export { EXPERIENCE_TRAIT_PREFIX, selectDistribution, isExperienceMatch, selectVariant as selectExperienceVariant, selectHasVariants as selectHasExperienceVariants, selectVariants as selectExperienceVariants, selectBaselineWithVariants as selectExperienceBaselineWithVariants, selectExperience, selectActiveExperiments, } from '@ninetailed/experience.js-shared';
 export { decodeExperienceVariantsMap } from './decodeExperienceVariantsMap';
 export { makeExperienceSelectMiddleware } from './makeExperienceSelectMiddleware';
+export { makeChangesModificationMiddleware } from './makeChangesModificationMiddleware';

package/src/lib/experience/makeChangesModificationMiddleware.d.ts

@@ -0,0 +1,31 @@
+import { Change } from '@ninetailed/experience.js-shared';
+import { NinetailedPlugin } from '@ninetailed/experience.js-plugin-analytics';
+import { ChangesModificationMiddleware } from '../types/interfaces/HasChangesModificationMiddleware';
+/**
+ * Arguments for creating a changes modification middleware
+ */
+type CreateChangesModificationMiddlewareArg = {
+    plugins: NinetailedPlugin[];
+    changes: Change[];
+};
+/**
+ * Arguments for making a changes modification middleware with change notification
+ */
+type MakeChangesModificationMiddlewareArg = CreateChangesModificationMiddlewareArg & {
+    onChange: (middleware: ChangesModificationMiddleware) => void;
+};
+/**
+ * Result of creating a changes modification middleware
+ */
+interface ChangesModificationMiddlewareResult {
+    addListeners: () => void;
+    removeListeners: () => void;
+    middleware: ChangesModificationMiddleware;
+}
+/**
+ * Creates a changes modification middleware system with change notification
+ *
+ * This follows the same pattern as the experience selection middleware system
+ */
+export declare const makeChangesModificationMiddleware: ({ plugins, onChange, changes, }: MakeChangesModificationMiddlewareArg) => ChangesModificationMiddlewareResult;
+export {};

package/src/lib/experience/types/index.d.ts

@@ -1 +1 @@
-export type { Reference, Baseline, VariantRef, ExperienceConfiguration, BaselineWithVariants, Distribution, ExperienceType, } from '@ninetailed/experience.js-shared';
+export type { Reference, Baseline, VariantRef, ExperienceConfiguration, EntryReplacement, InlineVariable, Distribution, ExperienceType, } from '@ninetailed/experience.js-shared';

package/src/lib/guards/hasChangesModificationMiddleware.d.ts

@@ -0,0 +1,8 @@
+import { HasChangesModificationMiddleware } from '../types/interfaces/HasChangesModificationMiddleware';
+/**
+ * Type guard that checks if an object implements the HasChangesModificationMiddleware interface
+ *
+ * @param arg Object to check
+ * @returns Boolean indicating if the object implements HasChangesModificationMiddleware
+ */
+export declare const hasChangesModificationMiddleware: (arg: unknown) => arg is HasChangesModificationMiddleware;

package/src/lib/plugins/selectPluginsHavingChangesModificationMiddleware.d.ts

@@ -0,0 +1,9 @@
+import { NinetailedPlugin } from '@ninetailed/experience.js-plugin-analytics';
+import { HasChangesModificationMiddleware } from '../types/interfaces/HasChangesModificationMiddleware';
+/**
+ * Selects plugins that implement the HasChangesModificationMiddleware interface
+ *
+ * @param plugins Array of Ninetailed plugins
+ * @returns Array of plugins that implement HasChangesModificationMiddleware
+ */
+export declare const selectPluginsHavingChangesModificationMiddleware: (plugins: NinetailedPlugin[]) => HasChangesModificationMiddleware[];

package/src/lib/types/ProfileChangedPayload.d.ts

@@ -1,4 +1,5 @@
-import { type Profile } from '@ninetailed/experience.js-shared';
+import type { Profile, Change } from '@ninetailed/experience.js-shared';
 export type ProfileChangedPayload = {
     profile: Profile | null;
+    changes: Change[] | null;
 };

package/src/lib/types/interfaces/HasChangesModificationMiddleware.d.ts

@@ -0,0 +1,30 @@
+import { Change } from '@ninetailed/experience.js-shared';
+/**
+ * Arguments passed to changes modification middleware
+ */
+export interface ChangesModificationMiddlewareArg {
+    changes: Change[];
+}
+/**
+ * A middleware function that can modify changes
+ */
+export type ChangesModificationMiddleware = (arg: ChangesModificationMiddlewareArg) => ChangesModificationMiddlewareArg;
+/**
+ * Arguments for building a changes modification middleware
+ */
+export type BuildChangesModificationMiddlewareArg = {
+    changes: Change[];
+};
+/**
+ * Type for a function that builds changes modification middleware
+ */
+export type BuildChangesModificationMiddleware = (arg: BuildChangesModificationMiddlewareArg) => ChangesModificationMiddleware | undefined;
+/**
+ * Interface for plugins that can provide changes modification middleware
+ */
+export interface HasChangesModificationMiddleware {
+    /**
+     * Returns a middleware function that can modify changes
+     */
+    getChangesModificationMiddleware: BuildChangesModificationMiddleware;
+}