@ninetailed/experience.js 7.6.0-beta.1 → 7.6.0-beta.3

package/{index.js → index.esm.js}

@@ -1,53 +1,14 @@
-import { FEATURES, logger, ConsoleLogSink, buildPageEvent, buildTrackEvent, buildIdentifyEvent, buildComponentViewEvent, unionBy, pipe, selectHasVariants, selectExperience, selectVariant as selectVariant$1, selectBaselineWithVariants, NinetailedApiClient, OnLogLogSink, OnErrorLogSink, PageviewProperties, Properties, Traits, isPageViewEvent, isTrackEvent, isIdentifyEvent, isComponentViewEvent } from '@ninetailed/experience.js-shared';
+import { FEATURES, buildComponentViewEvent, logger, ConsoleLogSink, buildPageEvent, buildTrackEvent, buildIdentifyEvent, unionBy, pipe, PageviewProperties, Properties, Traits, isPageViewEvent, isTrackEvent, isIdentifyEvent, isComponentViewEvent, selectHasVariants, selectExperience, selectVariant as selectVariant$1, selectBaselineWithVariants, NinetailedApiClient, OnLogLogSink, OnErrorLogSink } from '@ninetailed/experience.js-shared';
 export { EXPERIENCE_TRAIT_PREFIX, isExperienceMatch, selectActiveExperiments, selectDistribution, selectExperience, selectBaselineWithVariants as selectExperienceBaselineWithVariants, selectVariant as selectExperienceVariant, selectVariants as selectExperienceVariants, selectHasVariants as selectHasExperienceVariants } from '@ninetailed/experience.js-shared';
+import { NinetailedAnalyticsPlugin, HAS_SEEN_COMPONENT, HAS_SEEN_ELEMENT } from '@ninetailed/experience.js-plugin-analytics';
 import Analytics from 'analytics';
 import { v4 } from 'uuid';
-import { z } from 'zod';
 
-const HAS_SEEN_COMPONENT = 'has_seen_component';
-const HAS_SEEN_ELEMENT = 'has_seen_element';
 const COMPONENT = 'component';
 const COMPONENT_START = 'componentStart';
 const PAGE_HIDDEN = 'page_hidden';
 const HAS_SEEN_STICKY_COMPONENT = 'sticky_component_view';
 
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-
-function __rest(s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-}
-
-function __awaiter(thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-}
-
 const buildClientLocale = () => navigator.languages && navigator.languages.length ? navigator.languages[0] : navigator.language;
 
 const buildClientNinetailedRequestContext = () => ({
@@ -60,15 +21,15 @@ const buildClientNinetailedRequestContext = () => ({
   }
 });
 
-/**
- * Similar to _.throttle but waits for the promise to resolve.
- * There is no "wait time" because you can simply await `Promise.timeout` inside `fn` to wait some time before the next call.
+/**
+ * Similar to _.throttle but waits for the promise to resolve.
+ * There is no "wait time" because you can simply await `Promise.timeout` inside `fn` to wait some time before the next call.
  */
 function asyncThrottle(fn) {
   let runningPromise;
   let queuedPromise;
   let nextArgs;
-  return args => __awaiter(this, void 0, void 0, function* () {
+  return async args => {
     if (runningPromise) {
       nextArgs = args;
       if (queuedPromise) {
@@ -85,7 +46,7 @@ function asyncThrottle(fn) {
       runningPromise = fn(args);
       return runningPromise;
     }
-  });
+  };
 }
 
 const LEGACY_ANONYMOUS_ID = '__anon_id';
@@ -99,68 +60,262 @@ const CONSENT = '__nt-consent__';
 const SET_ENABLED_FEATURES = 'set-enabled-features';
 const EMPTY_MERGE_ID = 'nt:empty-merge-id';
 
-const PLUGIN_NAME = 'ninetailed';
+const PLUGIN_NAME = 'ninetailed:core';
 const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
-const ninetailedCorePlugin = ({
-  apiClient,
-  locale,
-  ninetailed,
-  onInitProfileId,
-  buildClientContext
-}) => {
-  let _instance;
-  let queue = [];
-  let enabledFeatures = Object.values(FEATURES);
-  const buildContext = buildClientContext || buildClientNinetailedRequestContext;
-  const flush = () => __awaiter(void 0, void 0, void 0, function* () {
-    const events = Object.assign([], queue);
+class NinetailedCorePlugin extends NinetailedAnalyticsPlugin {
+  constructor({
+    apiClient,
+    locale,
+    ninetailed,
+    onInitProfileId,
+    buildClientContext
+  }) {
+    var _this;
+    super();
+    _this = this;
+    this.name = PLUGIN_NAME;
+    this._instance = void 0;
+    this.queue = [];
+    this.enabledFeatures = Object.values(FEATURES);
+    this.buildContext = buildClientNinetailedRequestContext;
+    this.onInitProfileId = void 0;
+    this.apiClient = void 0;
+    this.locale = void 0;
+    this.ninetailed = void 0;
+    this[HAS_SEEN_STICKY_COMPONENT] = async function ({
+      payload
+    }) {
+      const ctx = _this.buildContext();
+      return _this.enqueueEvent(buildComponentViewEvent({
+        messageId: payload.meta.rid,
+        timestamp: payload.meta.ts,
+        componentId: payload.componentId,
+        experienceId: payload.experienceId,
+        variantIndex: payload.variantIndex,
+        ctx
+      }));
+    };
+    this.methods = {
+      reset: async function (...args) {
+        logger.debug('Resetting profile.');
+        const instance = args[args.length - 1];
+        instance.dispatch({
+          type: PROFILE_RESET
+        });
+        instance.storage.removeItem(ANONYMOUS_ID);
+        instance.storage.removeItem(PROFILE_FALLBACK_CACHE);
+        instance.storage.removeItem(EXPERIENCES_FALLBACK_CACHE);
+        logger.debug('Removed old profile data from localstorage.');
+        if (typeof _this.onInitProfileId === 'function') {
+          const profileId = await _this.onInitProfileId(undefined);
+          if (typeof profileId === 'string') {
+            instance.storage.setItem(ANONYMOUS_ID, profileId);
+          }
+        }
+        await _this.ninetailed.track('nt_reset');
+        logger.info('Profile reset successful.');
+        await delay(10);
+      },
+      debug: async function (...args) {
+        const enabled = args[0];
+        const instance = args[args.length - 1];
+        const consoleLogSink = new ConsoleLogSink();
+        if (enabled) {
+          instance.storage.setItem(DEBUG_FLAG, true);
+          logger.addSink(consoleLogSink);
+          logger.info('Debug mode enabled.');
+        } else {
+          instance.storage.removeItem(DEBUG_FLAG);
+          logger.info('Debug mode disabled.');
+          logger.removeSink(consoleLogSink.name);
+        }
+      }
+    };
+    this.flush = asyncThrottle(this._flush.bind(this));
+    if (onInitProfileId) {
+      this.onInitProfileId = onInitProfileId;
+    }
+    if (buildClientContext) {
+      this.buildContext = buildClientContext;
+    }
+    this.apiClient = apiClient;
+    this.ninetailed = ninetailed;
+    this.locale = locale;
+  }
+  async initialize({
+    instance
+  }) {
+    this._instance = instance;
+    if (instance.storage.getItem(DEBUG_FLAG)) {
+      logger.addSink(new ConsoleLogSink());
+      logger.info('Ninetailed Debug Mode is enabled.');
+    }
+
+    // legacy support for the old anonymousId
+    const legacyAnonymousId = instance.storage.getItem(LEGACY_ANONYMOUS_ID);
+    if (legacyAnonymousId) {
+      logger.debug('Found legacy anonymousId, migrating to new one.', legacyAnonymousId);
+      instance.storage.setItem(ANONYMOUS_ID, legacyAnonymousId);
+      instance.storage.removeItem(LEGACY_ANONYMOUS_ID);
+    }
+    if (typeof this.onInitProfileId === 'function') {
+      const profileId = await this.onInitProfileId(instance.storage.getItem(ANONYMOUS_ID));
+      if (typeof profileId === 'string') {
+        instance.storage.setItem(ANONYMOUS_ID, profileId);
+      }
+    }
+    instance.on(SET_ENABLED_FEATURES, ({
+      payload
+    }) => {
+      this.enabledFeatures = payload.features || [];
+    });
+    logger.debug('Ninetailed Core plugin initialized.');
+  }
+  pageStart(params) {
+    return this.abortNonClientEvents(params);
+  }
+  async page({
+    payload
+  }) {
+    logger.info('Sending Page event.');
+    const ctx = this.buildContext();
+    return this.enqueueEvent(buildPageEvent({
+      messageId: payload.meta.rid,
+      timestamp: payload.meta.ts,
+      properties: payload.properties,
+      ctx
+    }));
+  }
+  trackStart(params) {
+    return this.abortNonClientEvents(params);
+  }
+  async track({
+    payload
+  }) {
+    logger.info('Sending Track event.');
+    const ctx = this.buildContext();
+    return this.enqueueEvent(buildTrackEvent({
+      messageId: payload.meta.rid,
+      timestamp: payload.meta.ts,
+      event: payload.event,
+      properties: payload.properties,
+      ctx
+    }));
+  }
+  identifyStart(params) {
+    return this.abortNonClientEvents(params);
+  }
+  async identify({
+    payload
+  }) {
+    logger.info('Sending Identify event.');
+    const ctx = this.buildContext();
+    if (payload.userId === EMPTY_MERGE_ID && (!payload.traits || typeof payload.traits === 'object' && Object.keys(payload.traits).length === 0)) {
+      logger.info('Skipping Identify event as no userId and no traits are set.');
+      return;
+    }
+    return this.enqueueEvent(buildIdentifyEvent({
+      messageId: payload.meta.rid,
+      timestamp: payload.meta.ts,
+      traits: payload.traits,
+      userId: payload.userId === EMPTY_MERGE_ID ? '' : payload.userId,
+      ctx
+    }));
+  }
+  getComponentViewTrackingThreshold() {
+    return 0;
+  }
+  async onTrackExperience(properties) {
+    if (properties.experience.sticky) {
+      await this.instance.dispatch({
+        type: HAS_SEEN_STICKY_COMPONENT,
+        componentId: properties.selectedVariant.id,
+        experienceId: properties.experience.id,
+        variantIndex: properties.selectedVariantIndex
+      });
+      this.flush();
+    }
+    return Promise.resolve();
+  }
+  onTrackComponent() {
+    return Promise.resolve();
+  }
+  setItemStart({
+    abort,
+    payload
+  }) {
+    if (![ANONYMOUS_ID, DEBUG_FLAG, PROFILE_FALLBACK_CACHE, EXPERIENCES_FALLBACK_CACHE, CONSENT].includes(payload.key)) {
+      return abort();
+    }
+    return payload;
+  }
+  async enqueueEvent(event) {
+    this.queue = unionBy([event], this.queue, 'messageId');
+  }
+  abortNonClientEvents({
+    abort,
+    payload
+  }) {
+    if (typeof window !== 'object') {
+      return abort();
+    }
+    return payload;
+  }
+  get instance() {
+    if (!this._instance) {
+      throw new Error('Ninetailed Core plugin not initialized.');
+    }
+    return this._instance;
+  }
+  async _flush() {
+    const events = Object.assign([], this.queue);
     logger.info('Start flushing events.');
-    queue = [];
+    this.queue = [];
     if (!events.length) {
       return {
         success: true
       };
     }
     try {
-      const anonymousId = _instance.storage.getItem(ANONYMOUS_ID);
+      const anonymousId = this.instance.storage.getItem(ANONYMOUS_ID);
       const {
         profile,
         experiences
-      } = yield apiClient.upsertProfile({
+      } = await this.apiClient.upsertProfile({
         profileId: anonymousId,
         events
       }, {
-        locale,
-        enabledFeatures
+        locale: this.locale,
+        enabledFeatures: this.enabledFeatures
       });
-      _instance.storage.setItem(ANONYMOUS_ID, profile.id);
-      _instance.storage.setItem(PROFILE_FALLBACK_CACHE, profile);
-      _instance.storage.setItem(EXPERIENCES_FALLBACK_CACHE, experiences);
+      this.instance.storage.setItem(ANONYMOUS_ID, profile.id);
+      this.instance.storage.setItem(PROFILE_FALLBACK_CACHE, profile);
+      this.instance.storage.setItem(EXPERIENCES_FALLBACK_CACHE, experiences);
       logger.debug('Profile from api: ', profile);
       logger.debug('Experiences from api: ', experiences);
-      _instance.dispatch({
+      this.instance.dispatch({
         type: PROFILE_CHANGE,
         profile,
         experiences
       });
-      yield delay(20);
+      await delay(20);
       return {
         success: true
       };
     } catch (error) {
       logger.debug('An error occurred during flushing the events: ', error);
-      const fallbackProfile = _instance.storage.getItem(PROFILE_FALLBACK_CACHE);
-      const fallbackExperiences = _instance.storage.getItem(EXPERIENCES_FALLBACK_CACHE) || [];
+      const fallbackProfile = this.instance.storage.getItem(PROFILE_FALLBACK_CACHE);
+      const fallbackExperiences = this.instance.storage.getItem(EXPERIENCES_FALLBACK_CACHE) || [];
       if (fallbackProfile) {
         logger.debug('Found a fallback profile - will use this.');
-        _instance.dispatch({
+        this.instance.dispatch({
           type: PROFILE_CHANGE,
           profile: fallbackProfile,
           experiences: fallbackExperiences
         });
       } else {
         logger.debug('No fallback profile found - setting profile to null.');
-        _instance.dispatch({
+        this.instance.dispatch({
           type: PROFILE_CHANGE,
           profile: null,
           experiences: fallbackExperiences,
@@ -171,166 +326,27 @@ const ninetailedCorePlugin = ({
         success: false
       };
     }
-  });
-  const enqueueEvent = event => __awaiter(void 0, void 0, void 0, function* () {
-    queue = unionBy([event], queue, 'messageId');
-  });
-  const abortNonClientEvents = ({
-    abort,
-    payload
-  }) => {
-    if (typeof window !== 'object') {
-      return abort();
-    }
-    return payload;
-  };
-  return {
-    name: 'ninetailed',
-    config: {},
-    initialize: ({
-      instance
-    }) => __awaiter(void 0, void 0, void 0, function* () {
-      _instance = instance;
-      if (instance.storage.getItem(DEBUG_FLAG)) {
-        logger.addSink(new ConsoleLogSink());
-        logger.info('Ninetailed Debug Mode is enabled.');
-      }
-      // legacy support for the old anonymousId
-      const legacyAnonymousId = instance.storage.getItem(LEGACY_ANONYMOUS_ID);
-      if (legacyAnonymousId) {
-        logger.debug('Found legacy anonymousId, migrating to new one.', legacyAnonymousId);
-        instance.storage.setItem(ANONYMOUS_ID, legacyAnonymousId);
-        instance.storage.removeItem(LEGACY_ANONYMOUS_ID);
-      }
-      if (typeof onInitProfileId === 'function') {
-        const profileId = yield onInitProfileId(instance.storage.getItem(ANONYMOUS_ID));
-        if (typeof profileId === 'string') {
-          instance.storage.setItem(ANONYMOUS_ID, profileId);
-        }
-      }
-      instance.on(SET_ENABLED_FEATURES, ({
-        payload
-      }) => {
-        enabledFeatures = payload.features || [];
-      });
-      logger.debug('Ninetailed Core plugin initialized.');
-    }),
-    flush: asyncThrottle(flush),
-    pageStart: params => {
-      return abortNonClientEvents(params);
-    },
-    page: ({
-      payload
-    }) => __awaiter(void 0, void 0, void 0, function* () {
-      logger.info('Sending Page event.');
-      const ctx = buildContext();
-      return enqueueEvent(buildPageEvent({
-        messageId: payload.meta.rid,
-        timestamp: payload.meta.ts,
-        properties: payload.properties,
-        ctx
-      }));
-    }),
-    trackStart: params => {
-      return abortNonClientEvents(params);
-    },
-    track: ({
-      payload
-    }) => __awaiter(void 0, void 0, void 0, function* () {
-      logger.info('Sending Track event.');
-      const ctx = buildContext();
-      return enqueueEvent(buildTrackEvent({
-        messageId: payload.meta.rid,
-        timestamp: payload.meta.ts,
-        event: payload.event,
-        properties: payload.properties,
-        ctx
-      }));
-    }),
-    identifyStart: params => {
-      return abortNonClientEvents(params);
-    },
-    identify: ({
-      payload
-    }) => __awaiter(void 0, void 0, void 0, function* () {
-      logger.info('Sending Identify event.');
-      const ctx = buildContext();
-      if (payload.userId === EMPTY_MERGE_ID && (!payload.traits || typeof payload.traits === 'object' && Object.keys(payload.traits).length === 0)) {
-        logger.info('Skipping Identify event as no userId and no traits are set.');
-        return;
-      }
-      return enqueueEvent(buildIdentifyEvent({
-        messageId: payload.meta.rid,
-        timestamp: payload.meta.ts,
-        traits: payload.traits,
-        userId: payload.userId === EMPTY_MERGE_ID ? '' : payload.userId,
-        ctx
-      }));
-    }),
-    [HAS_SEEN_STICKY_COMPONENT]: ({
-      payload
-    }) => __awaiter(void 0, void 0, void 0, function* () {
-      logger.info('Sending Sticky Components event.');
-      const ctx = buildContext();
-      return enqueueEvent(buildComponentViewEvent({
-        messageId: payload.meta.rid,
-        timestamp: payload.meta.ts,
-        componentId: payload.componentId,
-        experienceId: payload.experienceId,
-        variantIndex: payload.variantIndex,
-        ctx
-      }));
-    }),
-    setItemStart: ({
-      abort,
-      payload
-    }) => {
-      if (![ANONYMOUS_ID, DEBUG_FLAG, PROFILE_FALLBACK_CACHE, EXPERIENCES_FALLBACK_CACHE, CONSENT].includes(payload.key)) {
-        return abort();
-      }
-      return payload;
-    },
-    methods: {
-      reset: (...args) => __awaiter(void 0, void 0, void 0, function* () {
-        logger.debug('Resetting profile.');
-        const instance = args[args.length - 1];
-        instance.dispatch({
-          type: PROFILE_RESET
-        });
-        instance.storage.removeItem(ANONYMOUS_ID);
-        instance.storage.removeItem(PROFILE_FALLBACK_CACHE);
-        instance.storage.removeItem(EXPERIENCES_FALLBACK_CACHE);
-        logger.debug('Removed old profile data from localstorage.');
-        if (typeof onInitProfileId === 'function') {
-          const profileId = yield onInitProfileId(undefined);
-          if (typeof profileId === 'string') {
-            instance.storage.setItem(ANONYMOUS_ID, profileId);
-          }
-        }
-        yield ninetailed.track('nt_reset');
-        logger.info('Profile reset successful.');
-        yield delay(10);
-      }),
-      debug: (...args) => __awaiter(void 0, void 0, void 0, function* () {
-        const enabled = args[0];
-        const instance = args[args.length - 1];
-        const consoleLogSink = new ConsoleLogSink();
-        if (enabled) {
-          instance.storage.setItem(DEBUG_FLAG, true);
-          logger.addSink(consoleLogSink);
-          logger.info('Debug mode enabled.');
-        } else {
-          instance.storage.removeItem(DEBUG_FLAG);
-          logger.info('Debug mode disabled.');
-          logger.removeSink(consoleLogSink.name);
-        }
-      })
-    }
-  };
-};
+  }
+}
+
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
 
 class ElementSeenObserver {
   constructor(_options) {
+    this._intersectionObserver = void 0;
+    this._elementDelays = void 0;
+    this._intersectionTimers = void 0;
     this._options = _options;
     this._elementDelays = new WeakMap();
     this._intersectionTimers = new WeakMap();
@@ -345,27 +361,33 @@ class ElementSeenObserver {
         target
       } = entry;
       if (isIntersecting) {
-        const delay = this._elementDelays.get(target);
-        const timeOut = window.setTimeout(() => {
-          this._options.onElementSeen(target);
-        }, delay);
-        this._intersectionTimers.set(target, timeOut);
+        const delays = this._elementDelays.get(target);
+        delays == null || delays.forEach(delay => {
+          const timeOut = window.setTimeout(() => {
+            this._options.onElementSeen(target, delay);
+          }, delay);
+          const currentTimers = this._intersectionTimers.get(target) || [];
+          this._intersectionTimers.set(target, [...currentTimers, timeOut]);
+        });
       } else {
-        const timeOut = this._intersectionTimers.get(target);
-        if (typeof timeOut !== 'undefined') {
-          window.clearTimeout(timeOut);
-        }
+        const timeOuts = this._intersectionTimers.get(target);
+        timeOuts == null || timeOuts.forEach(timeOut => {
+          if (typeof timeOut !== 'undefined') {
+            window.clearTimeout(timeOut);
+          }
+        });
       }
     });
   }
   observe(element, options) {
-    var _a, _b;
-    this._elementDelays.set(element, (_a = options === null || options === void 0 ? void 0 : options.delay) !== null && _a !== void 0 ? _a : 2000);
-    (_b = this._intersectionObserver) === null || _b === void 0 ? void 0 : _b.observe(element);
+    var _this$_intersectionOb;
+    const delays = this._elementDelays.get(element) || [];
+    this._elementDelays.set(element, Array.from(new Set([...delays, (options == null ? void 0 : options.delay) || 0])));
+    (_this$_intersectionOb = this._intersectionObserver) == null || _this$_intersectionOb.observe(element);
   }
   unobserve(element) {
-    var _a;
-    (_a = this._intersectionObserver) === null || _a === void 0 ? void 0 : _a.unobserve(element);
+    var _this$_intersectionOb2;
+    (_this$_intersectionOb2 = this._intersectionObserver) == null || _this$_intersectionOb2.unobserve(element);
   }
 }
 
@@ -388,7 +410,7 @@ const decodeExperienceVariantsMap = encodedExperienceVariantsMap => {
       experienceId,
       variantIndex
     };
-  }).filter(x => !!x).reduce((acc, curr) => Object.assign(Object.assign({}, acc), {
+  }).filter(x => !!x).reduce((acc, curr) => Object.assign({}, acc, {
     [curr.experienceId]: curr.variantIndex
   }), {});
 };
@@ -493,42 +515,43 @@ const makeExperienceSelectMiddleware = ({
 
 class EventBuilder {
   constructor(buildRequestContext) {
+    this.buildRequestContext = void 0;
     this.buildRequestContext = buildRequestContext || buildClientNinetailedRequestContext;
   }
   page(properties, data) {
-    return buildPageEvent(Object.assign(Object.assign({
-      messageId: (data === null || data === void 0 ? void 0 : data.messageId) || v4()
-    }, data), {
+    return buildPageEvent(Object.assign({
+      messageId: (data == null ? void 0 : data.messageId) || v4()
+    }, data, {
       timestamp: Date.now(),
       properties: properties || {},
       ctx: this.buildRequestContext()
     }));
   }
   track(event, properties, data) {
-    return buildTrackEvent(Object.assign(Object.assign({
-      messageId: (data === null || data === void 0 ? void 0 : data.messageId) || v4(),
+    return buildTrackEvent(Object.assign({
+      messageId: (data == null ? void 0 : data.messageId) || v4(),
       timestamp: Date.now()
-    }, data), {
+    }, data, {
       event,
       properties: properties || {},
       ctx: this.buildRequestContext()
     }));
   }
   identify(userId, traits, data) {
-    return buildIdentifyEvent(Object.assign(Object.assign({
-      messageId: (data === null || data === void 0 ? void 0 : data.messageId) || v4(),
+    return buildIdentifyEvent(Object.assign({
+      messageId: (data == null ? void 0 : data.messageId) || v4(),
       timestamp: Date.now()
-    }, data), {
+    }, data, {
       traits: traits || {},
       userId: userId || '',
       ctx: this.buildRequestContext()
     }));
   }
   component(componentId, experienceId, variantIndex, data) {
-    return buildComponentViewEvent(Object.assign(Object.assign({
-      messageId: (data === null || data === void 0 ? void 0 : data.messageId) || v4(),
+    return buildComponentViewEvent(Object.assign({
+      messageId: (data == null ? void 0 : data.messageId) || v4(),
       timestamp: Date.now()
-    }, data), {
+    }, data, {
       componentId,
       experienceId: experienceId || '',
       variantIndex: variantIndex || 0,
@@ -537,13 +560,19 @@ class EventBuilder {
   }
 }
 
-const buildOverrideMiddleware = experienceSelectionMiddleware => _a => {
-  var {
+const hasComponentViewTrackingThreshold = arg => {
+  return typeof arg === 'object' && arg !== null && 'getComponentViewTrackingThreshold' in arg && typeof arg['getComponentViewTrackingThreshold'] === 'function';
+};
+
+const _excluded = ["experience", "variant", "variantIndex"],
+  _excluded2 = ["element"];
+const buildOverrideMiddleware = experienceSelectionMiddleware => _ref => {
+  let {
       experience: originalExperience,
       variant: originalVariant,
       variantIndex: originalVariantIndex
-    } = _a,
-    other = __rest(_a, ["experience", "variant", "variantIndex"]);
+    } = _ref,
+    other = _objectWithoutPropertiesLoose(_ref, _excluded);
   const {
     experience,
     variant,
@@ -553,8 +582,8 @@ const buildOverrideMiddleware = experienceSelectionMiddleware => _a => {
     variant: originalVariant,
     variantIndex: originalVariantIndex
   });
-  return Object.assign(Object.assign({}, other), {
-    audience: (experience === null || experience === void 0 ? void 0 : experience.audience) ? experience.audience : null,
+  return Object.assign({}, other, {
+    audience: experience != null && experience.audience ? experience.audience : null,
     experience,
     variant,
     variantIndex
@@ -574,16 +603,30 @@ class Ninetailed {
     storageImpl,
     useClientSideEvaluation = false
   } = {}) {
+    var _this = this;
+    this.instance = void 0;
+    this._profileState = void 0;
     this.isInitialized = false;
-    this.page = (data, options) => __awaiter(this, void 0, void 0, function* () {
+    this.apiClient = void 0;
+    this.ninetailedCorePlugin = void 0;
+    this.elementSeenObserver = void 0;
+    this.observedElements = void 0;
+    this.clientId = void 0;
+    this.environment = void 0;
+    this.plugins = void 0;
+    this.logger = void 0;
+    this.componentViewTrackingThreshold = void 0;
+    this.useClientSideEvaluation = void 0;
+    this.eventBuilder = void 0;
+    this.page = async function (data, options) {
       try {
         const result = PageviewProperties.partial().default({}).safeParse(data);
         if (!result.success) {
           throw new Error(`[Validation Error] "page" was called with invalid params. Page data is not valid: ${result.error.format()}`);
         }
-        yield this.waitUntilInitialized();
-        yield this.instance.page(data, this.buildOptions(options));
-        return this.ninetailedCorePlugin.flush();
+        await _this.waitUntilInitialized();
+        await _this.instance.page(data, _this.buildOptions(options));
+        return _this.ninetailedCorePlugin.flush();
       } catch (error) {
         logger.error(error);
         if (error instanceof RangeError) {
@@ -591,16 +634,16 @@ class Ninetailed {
         }
         throw error;
       }
-    });
-    this.track = (event, properties, options) => __awaiter(this, void 0, void 0, function* () {
+    };
+    this.track = async function (event, properties, options) {
       try {
         const result = Properties.default({}).safeParse(properties);
         if (!result.success) {
           throw new Error(`[Validation Error] "track" was called with invalid params. Properties are no valid json object: ${result.error.format()}`);
         }
-        yield this.waitUntilInitialized();
-        yield this.instance.track(event.toString(), result.data, this.buildOptions(options));
-        return this.ninetailedCorePlugin.flush();
+        await _this.waitUntilInitialized();
+        await _this.instance.track(event.toString(), result.data, _this.buildOptions(options));
+        return _this.ninetailedCorePlugin.flush();
       } catch (error) {
         logger.error(error);
         if (error instanceof RangeError) {
@@ -608,16 +651,16 @@ class Ninetailed {
         }
         throw error;
       }
-    });
-    this.identify = (uid, traits, options) => __awaiter(this, void 0, void 0, function* () {
+    };
+    this.identify = async function (uid, traits, options) {
       try {
         const result = Traits.default({}).safeParse(traits);
         if (!result.success) {
           throw new Error(`[Validation Error] "identify" was called with invalid params. Traits are no valid json: ${result.error.format()}`);
         }
-        yield this.waitUntilInitialized();
-        yield this.instance.identify(uid && uid.toString() !== '' ? uid.toString() : EMPTY_MERGE_ID, result.data, this.buildOptions(options));
-        return this.ninetailedCorePlugin.flush();
+        await _this.waitUntilInitialized();
+        await _this.instance.identify(uid && uid.toString() !== '' ? uid.toString() : EMPTY_MERGE_ID, result.data, _this.buildOptions(options));
+        return _this.ninetailedCorePlugin.flush();
       } catch (error) {
         logger.error(error);
         if (error instanceof RangeError) {
@@ -625,22 +668,22 @@ class Ninetailed {
         }
         throw error;
       }
-    });
-    this.batch = events => __awaiter(this, void 0, void 0, function* () {
+    };
+    this.batch = async function (events) {
       try {
-        yield this.waitUntilInitialized();
+        await _this.waitUntilInitialized();
         const promises = events.map(event => {
           if (isPageViewEvent(event)) {
-            return this.instance.page(event.properties);
+            return _this.instance.page(event.properties);
           }
           if (isTrackEvent(event)) {
-            return this.instance.track(event.event, event.properties);
+            return _this.instance.track(event.event, event.properties);
           }
           if (isIdentifyEvent(event)) {
-            return this.instance.identify(event.userId || EMPTY_MERGE_ID, event.traits);
+            return _this.instance.identify(event.userId || EMPTY_MERGE_ID, event.traits);
           }
           if (isComponentViewEvent(event)) {
-            return this.instance.dispatch({
+            return _this.instance.dispatch({
               experienceId: event.experienceId,
               componentId: event.componentId,
               variantIndex: event.variantIndex,
@@ -649,8 +692,8 @@ class Ninetailed {
           }
           return Promise.resolve();
         });
-        yield Promise.all(promises);
-        return this.ninetailedCorePlugin.flush();
+        await Promise.all(promises);
+        return _this.ninetailedCorePlugin.flush();
       } catch (error) {
         logger.error(error);
         if (error instanceof RangeError) {
@@ -658,21 +701,21 @@ class Ninetailed {
         }
         throw error;
       }
-    });
-    this.trackStickyComponentView = ({
+    };
+    this.trackStickyComponentView = async function ({
       experienceId,
       componentId,
       variantIndex
-    }) => __awaiter(this, void 0, void 0, function* () {
+    }) {
       try {
-        yield this.waitUntilInitialized();
-        yield this.instance.dispatch({
+        await _this.waitUntilInitialized();
+        await _this.instance.dispatch({
           experienceId,
           componentId,
           variantIndex,
           type: HAS_SEEN_STICKY_COMPONENT
         });
-        return this.ninetailedCorePlugin.flush();
+        return _this.ninetailedCorePlugin.flush();
       } catch (error) {
         logger.error(error);
         if (error instanceof RangeError) {
@@ -680,18 +723,18 @@ class Ninetailed {
         }
         throw error;
       }
-    });
-    /**
-     * @deprecated The legacy datamodel is not recommended anymore
-     * Will be removed in the next version of the SDK
+    };
+    /**
+     * @deprecated The legacy datamodel is not recommended anymore
+     * Will be removed in the next version of the SDK
      */
-    this.trackHasSeenComponent = properties => __awaiter(this, void 0, void 0, function* () {
-      return this.instance.dispatch(Object.assign(Object.assign({}, properties), {
+    this.trackHasSeenComponent = async function (properties) {
+      return _this.instance.dispatch(Object.assign({}, properties, {
         type: HAS_SEEN_COMPONENT
       }));
-    });
+    };
     this.trackComponentView = properties => {
-      return this.instance.dispatch(Object.assign(Object.assign({}, properties), {
+      return this.instance.dispatch(Object.assign({}, properties, {
         type: HAS_SEEN_ELEMENT
       }));
     };
@@ -699,7 +742,7 @@ class Ninetailed {
       const {
           element
         } = payload,
-        remaingPayload = __rest(payload, ["element"]);
+        remaingPayload = _objectWithoutPropertiesLoose(payload, _excluded2);
       if (!(element instanceof Element)) {
         const isObject = typeof element === 'object' && element !== null;
         const constructorName = isObject ? element.constructor.name : '';
@@ -707,49 +750,64 @@ class Ninetailed {
         logger.warn(`ElementSeenObserver.observeElement was called with an invalid element. Expected an Element but got ${typeof element}${isConstructorNameNotObject ? ` of type ${constructorName}` : ''}. This call will be ignored.`);
       } else {
         this.observedElements.set(element, remaingPayload);
-        this.elementSeenObserver.observe(element, Object.assign({
-          delay: this.componentViewTrackingThreshold
-        }, options));
+        const delays = this.pluginsWithCustomComponentViewThreshold.map(plugin => plugin.getComponentViewTrackingThreshold());
+        const uniqueDelays = Array.from(new Set([...delays, (options == null ? void 0 : options.delay) || this.componentViewTrackingThreshold]));
+        uniqueDelays.forEach(delay => {
+          this.elementSeenObserver.observe(element, {
+            delay
+          });
+        });
       }
     };
     this.unobserveElement = element => {
       this.observedElements.delete(element);
       this.elementSeenObserver.unobserve(element);
     };
-    this.onElementSeen = element => {
+    this.onElementSeen = (element, delay) => {
       const payload = this.observedElements.get(element);
       if (typeof payload !== 'undefined') {
-        this.trackComponentView(Object.assign({
-          element
-        }, payload));
+        const pluginNamesInterestedInSeenElementMessage = [...this.pluginsWithCustomComponentViewThreshold.filter(plugin => plugin.getComponentViewTrackingThreshold() === delay), ...this.plugins.filter(plugin => !hasComponentViewTrackingThreshold(plugin))].map(plugin => plugin.name);
+        if (pluginNamesInterestedInSeenElementMessage.length === 0) {
+          return;
+        }
+        this.instance.dispatch(Object.assign({}, payload, {
+          element,
+          type: HAS_SEEN_ELEMENT,
+          plugins: Object.assign({
+            all: false
+          }, pluginNamesInterestedInSeenElementMessage.reduce((acc, curr) => Object.assign({}, acc, {
+            [curr]: true
+          }), {}))
+        }));
       }
     };
-    this.reset = () => __awaiter(this, void 0, void 0, function* () {
-      yield this.waitUntilInitialized();
+    this.reset = async function () {
+      await _this.waitUntilInitialized();
+
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-ignore
-      this.instance.plugins[PLUGIN_NAME].reset();
-    });
-    this.debug = enabled => __awaiter(this, void 0, void 0, function* () {
-      yield this.waitUntilInitialized();
+      _this.instance.plugins[PLUGIN_NAME].reset();
+    };
+    this.debug = async function (enabled) {
+      await _this.waitUntilInitialized();
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-ignore
-      this.instance.plugins[PLUGIN_NAME].debug(enabled);
-    });
+      _this.instance.plugins[PLUGIN_NAME].debug(enabled);
+    };
     this.onProfileChange = cb => {
       cb(this.profileState);
       return this.instance.on(PROFILE_CHANGE, ({
         payload
       }) => {
         if (payload.error) {
-          cb(Object.assign(Object.assign({}, this._profileState), {
+          cb(Object.assign({}, this._profileState, {
             status: 'error',
             profile: payload.profile,
             experiences: payload.experiences,
             error: payload.error
           }));
         } else {
-          cb(Object.assign(Object.assign({}, this._profileState), {
+          cb(Object.assign({}, this._profileState, {
             status: 'success',
             profile: payload.profile,
             experiences: payload.experiences,
@@ -793,11 +851,11 @@ class Ninetailed {
         middlewareChangeListeners.push(removeListeners);
         const overrideResult = buildOverrideMiddleware(experienceSelectionMiddleware);
         const hasVariants = experiences.map(experience => selectHasVariants(experience, baseline)).reduce((acc, curr) => acc || curr, false);
-        const baseReturn = Object.assign(Object.assign({}, profileState), {
+        const baseReturn = Object.assign({}, profileState, {
           hasVariants,
           baseline
         });
-        const emptyReturn = Object.assign(Object.assign({}, baseReturn), {
+        const emptyReturn = Object.assign({}, baseReturn, {
           experience: null,
           variant: baseline,
           variantIndex: 0,
@@ -807,14 +865,14 @@ class Ninetailed {
           error: null
         });
         if (profileState.status === 'loading') {
-          setSelectedVariant(overrideResult(Object.assign(Object.assign({}, emptyReturn), {
+          setSelectedVariant(overrideResult(Object.assign({}, emptyReturn, {
             loading: true,
             status: 'loading'
           })));
           return;
         }
         if (profileState.status === 'error') {
-          setSelectedVariant(overrideResult(Object.assign(Object.assign({}, emptyReturn), {
+          setSelectedVariant(overrideResult(Object.assign({}, emptyReturn, {
             loading: false,
             status: 'error',
             error: profileState.error
@@ -826,7 +884,7 @@ class Ninetailed {
           experiences: selectedExperiences
         } = profileState;
         if (!profile || !selectedExperiences) {
-          setSelectedVariant(overrideResult(Object.assign(Object.assign({}, emptyReturn), {
+          setSelectedVariant(overrideResult(Object.assign({}, emptyReturn, {
             loading: false,
             status: 'error',
             error: new Error('No Profile or Selected Experiences were returned by the API')
@@ -839,7 +897,7 @@ class Ninetailed {
             profile
           });
           if (!_experience) {
-            setSelectedVariant(overrideResult(Object.assign(Object.assign({}, emptyReturn), {
+            setSelectedVariant(overrideResult(Object.assign({}, emptyReturn, {
               loading: false,
               status: 'success',
               profile
@@ -854,7 +912,7 @@ class Ninetailed {
             experience: _experience,
             profile
           });
-          setSelectedVariant(overrideResult(Object.assign(Object.assign({}, baseReturn), {
+          setSelectedVariant(overrideResult(Object.assign({}, baseReturn, {
             status: 'success',
             loading: false,
             error: null,
@@ -870,9 +928,9 @@ class Ninetailed {
         const experience = experiences.find(experience => selectedExperiences.some(selectedExperience => selectedExperience.experienceId === experience.id));
         const selectedExperience = selectedExperiences.find(({
           experienceId
-        }) => experienceId === (experience === null || experience === void 0 ? void 0 : experience.id));
+        }) => experienceId === (experience == null ? void 0 : experience.id));
         if (!experience || !selectedExperience) {
-          setSelectedVariant(overrideResult(Object.assign(Object.assign({}, emptyReturn), {
+          setSelectedVariant(overrideResult(Object.assign({}, emptyReturn, {
             loading: false,
             status: 'success',
             profile
@@ -881,7 +939,7 @@ class Ninetailed {
         }
         const baselineVariants = selectBaselineWithVariants(experience, baseline);
         if (!baselineVariants) {
-          setSelectedVariant(overrideResult(Object.assign(Object.assign({}, emptyReturn), {
+          setSelectedVariant(overrideResult(Object.assign({}, emptyReturn, {
             loading: false,
             status: 'success',
             profile
@@ -891,16 +949,16 @@ class Ninetailed {
         const {
           variants
         } = baselineVariants;
-        const variant = variants[selectedExperience.variantIndex - 1];
+        const variant = [baseline, ...variants][selectedExperience.variantIndex];
         if (!variant) {
-          setSelectedVariant(overrideResult(Object.assign(Object.assign({}, emptyReturn), {
+          setSelectedVariant(overrideResult(Object.assign({}, emptyReturn, {
             loading: false,
             status: 'success',
             profile
           })));
           return;
         }
-        setSelectedVariant(overrideResult(Object.assign(Object.assign({}, baseReturn), {
+        setSelectedVariant(overrideResult(Object.assign({}, baseReturn, {
           status: 'success',
           loading: false,
           error: null,
@@ -965,7 +1023,7 @@ class Ninetailed {
         preview
       });
     }
-    this.plugins = (plugins !== null && plugins !== void 0 ? plugins : []).flat();
+    this.plugins = (plugins != null ? plugins : []).flat();
     this.plugins.forEach(plugin => {
       if (acceptsCredentials(plugin) && this.clientId && this.environment) {
         plugin.setCredentials({
@@ -989,7 +1047,7 @@ class Ninetailed {
     }
     this.eventBuilder = new EventBuilder(buildClientContext);
     this.logger = logger;
-    this.ninetailedCorePlugin = ninetailedCorePlugin({
+    this.ninetailedCorePlugin = new NinetailedCorePlugin({
       apiClient: this.apiClient,
       locale,
       requestTimeout,
@@ -1003,11 +1061,12 @@ class Ninetailed {
     }, storageImpl ? {
       storage: storageImpl
     } : {}));
-    const detachOnReadyListener = this.instance.on('ready', () => {
+    const _detachOnReadyListener = this.instance.on('ready', () => {
       this.isInitialized = true;
       logger.info('Ninetailed Experience.js SDK is completely initialized.');
-      detachOnReadyListener();
+      _detachOnReadyListener();
     });
+
     // put in private method
     this.onProfileChange(profileState => {
       this._profileState = profileState;
@@ -1029,6 +1088,9 @@ class Ninetailed {
     }
     this.registerWindowHandlers();
   }
+  get pluginsWithCustomComponentViewThreshold() {
+    return [this.ninetailedCorePlugin, ...this.plugins].filter(plugin => hasComponentViewTrackingThreshold(plugin));
+  }
   get profileState() {
     return this._profileState;
   }
@@ -1059,7 +1121,7 @@ const selectVariant = (baseline, variants, {
   if (status === 'loading') {
     return {
       loading: true,
-      variant: Object.assign(Object.assign({}, baseline), {
+      variant: Object.assign({}, baseline, {
         id: 'baseline',
         audience: {
           id: 'baseline'
@@ -1075,7 +1137,7 @@ const selectVariant = (baseline, variants, {
   if (status === 'error') {
     return {
       loading: false,
-      variant: Object.assign(Object.assign({}, baseline), {
+      variant: Object.assign({}, baseline, {
         id: 'baseline',
         audience: {
           id: 'baseline'
@@ -1089,19 +1151,19 @@ const selectVariant = (baseline, variants, {
     };
   }
   const variant = variants.find(variant => {
-    var _a, _b;
-    return (_a = profile === null || profile === void 0 ? void 0 : profile.audiences) === null || _a === void 0 ? void 0 : _a.includes((_b = variant.audience) === null || _b === void 0 ? void 0 : _b.id);
+    var _profile$audiences, _variant$audience;
+    return profile == null || (_profile$audiences = profile.audiences) == null ? void 0 : _profile$audiences.includes((_variant$audience = variant.audience) == null ? void 0 : _variant$audience.id);
   });
   if (variant) {
-    if ((options === null || options === void 0 ? void 0 : options.holdout) || -1 > ((profile === null || profile === void 0 ? void 0 : profile.random) || 0)) {
+    if (options != null && options.holdout || -1 > ((profile == null ? void 0 : profile.random) || 0)) {
       return {
         loading: false,
-        variant: Object.assign(Object.assign({}, baseline), {
+        variant: Object.assign({}, baseline, {
           audience: {
             id: 'baseline'
           }
         }),
-        audience: Object.assign(Object.assign({}, variant.audience), {
+        audience: Object.assign({}, variant.audience, {
           id: variant.audience.id
         }),
         isPersonalized: false,
@@ -1111,19 +1173,20 @@ const selectVariant = (baseline, variants, {
     return {
       loading: false,
       variant,
-      audience: Object.assign(Object.assign({}, variant.audience), {
+      audience: Object.assign({}, variant.audience, {
         id: variant.audience.id
       }),
       isPersonalized: true,
       error: null
     };
   }
-  /**
-   * There was no matching audience found.
+
+  /**
+   * There was no matching audience found.
    */
   return {
     loading: false,
-    variant: Object.assign(Object.assign({}, baseline), {
+    variant: Object.assign({}, baseline, {
       id: 'baseline',
       audience: {
         id: 'baseline'
@@ -1137,39 +1200,4 @@ const selectVariant = (baseline, variants, {
   };
 };
 
-const TrackComponentProperties = z.object({
-  variant: z.object({
-    id: z.string()
-  }),
-  audience: z.object({
-    id: z.string()
-  }),
-  isPersonalized: z.boolean()
-});
-
-class NinetailedPlugin {}
-
-const ElementSeenPayloadSchema = z.object({
-  element: z.any(),
-  experience: z.object({
-    id: z.string(),
-    type: z.union([z.literal('nt_experiment'), z.literal('nt_personalization')]),
-    name: z.string().optional(),
-    description: z.string().optional()
-  }).optional().nullable(),
-  audience: z.object({
-    id: z.string(),
-    name: z.string().optional(),
-    description: z.string().optional()
-  }).optional().nullable().default({
-    id: 'ALL_VISITORS',
-    name: 'All Visitors',
-    description: 'This is the default all visitors audience as no audience was set.'
-  }),
-  variant: z.object({
-    id: z.string()
-  }).catchall(z.unknown()),
-  variantIndex: z.number()
-});
-
-export { ANONYMOUS_ID, COMPONENT, COMPONENT_START, CONSENT, DEBUG_FLAG, EMPTY_MERGE_ID, EXPERIENCES_FALLBACK_CACHE, ElementSeenPayloadSchema, HAS_SEEN_COMPONENT, HAS_SEEN_ELEMENT, HAS_SEEN_STICKY_COMPONENT, LEGACY_ANONYMOUS_ID, Ninetailed, NinetailedPlugin, OnChangeEmitter, PAGE_HIDDEN, PLUGIN_NAME, PROFILE_CHANGE, PROFILE_FALLBACK_CACHE, PROFILE_RESET, SET_ENABLED_FEATURES, TrackComponentProperties, buildClientNinetailedRequestContext, decodeExperienceVariantsMap, makeExperienceSelectMiddleware, ninetailedCorePlugin, selectPluginsHavingExperienceSelectionMiddleware, selectPluginsHavingOnChangeEmitter, selectVariant };
+export { ANONYMOUS_ID, COMPONENT, COMPONENT_START, CONSENT, DEBUG_FLAG, EMPTY_MERGE_ID, EXPERIENCES_FALLBACK_CACHE, 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 };