@dotcms/experiments 1.4.0 → 1.5.0-next.1

package/index.esm.js

@@ -1,7 +1,7 @@
-import { jsx } from 'react/jsx-runtime';
 import { createContext, useContext, useState, useEffect, useRef, useCallback } from 'react';
 import { UVE_MODE } from '@dotcms/types';
 import { getUVEState } from '@dotcms/uve';
+import { jsx } from 'react/jsx-runtime';
 import { jitsuClient } from '@jitsu/sdk-js';
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -1664,6 +1664,7 @@ const useExperimentVariant = data => {
     viewAs
   } = data;
   const variantId = viewAs == null ? void 0 : viewAs.variantId;
+
   // By default, wait for the variant
   const [shouldWaitForVariant, setShouldWaitForVariant] = useState(true);
   useEffect(() => {
@@ -1673,6 +1674,7 @@ const useExperimentVariant = data => {
       setShouldWaitForVariant(false);
       return;
     }
+
     // If variantId is not provided, show content and warn
     if (!variantId) {
       // eslint-disable-next-line no-console
@@ -1719,14 +1721,14 @@ const DotExperimentHandlingComponent = _ref => {
     shouldWaitForVariant
   } = useExperimentVariant(props.page);
   if (shouldWaitForVariant) {
-    return jsx("div", {
+    return /*#__PURE__*/jsx("div", {
       style: {
         visibility: 'hidden'
       },
-      children: jsx(WrappedComponent, Object.assign({}, props))
+      children: /*#__PURE__*/jsx(WrappedComponent, Object.assign({}, props))
     });
   }
-  return jsx(WrappedComponent, Object.assign({}, props));
+  return /*#__PURE__*/jsx(WrappedComponent, Object.assign({}, props));
 };
 
 var NATIVE_BIND$1 = functionBindNative;
@@ -4279,6 +4281,7 @@ if (DESCRIPTORS$3 && !('size' in URLSearchParamsPrototype)) {
  *
  * @constant {string}
  */
+
 /**
  * The default variant name for an experiment.
  *
@@ -4286,12 +4289,14 @@ if (DESCRIPTORS$3 && !('size' in URLSearchParamsPrototype)) {
  * @constant
  */
 const EXPERIMENT_DEFAULT_VARIANT_NAME = 'DEFAULT';
+
 /**
  * The key used to store or retrieve the information in the SessionStore
  *
  * @constant {string}
  */
 const EXPERIMENT_QUERY_PARAM_KEY = 'variantName';
+
 /**
  * The key used to store or retrieve the information in the SessionStore
  * indicating whether an experiment has already been checked.
@@ -4299,6 +4304,7 @@ const EXPERIMENT_QUERY_PARAM_KEY = 'variantName';
  * @constant {string}
  */
 const EXPERIMENT_ALREADY_CHECKED_KEY = 'experimentAlreadyCheck';
+
 /**
  * EXPERIMENT_FETCH_EXPIRE_TIME is a constant that represents the name of the variable used to store
  * the expire time for experiment fetching. It is a string value 'experimentFetchExpireTime'.
@@ -4306,6 +4312,7 @@ const EXPERIMENT_ALREADY_CHECKED_KEY = 'experimentAlreadyCheck';
  * @constant {string}
  */
 const EXPERIMENT_FETCH_EXPIRE_TIME_KEY = 'experimentFetchExpireTime';
+
 /**
  * The duration in milliseconds for which data should be stored in the local storage.
  *
@@ -4315,6 +4322,7 @@ const EXPERIMENT_FETCH_EXPIRE_TIME_KEY = 'experimentFetchExpireTime';
  *
  */
 const LOCAL_STORAGE_TIME_DURATION_MILLISECONDS = 86400 * 1000;
+
 /**
  * API_EXPERIMENTS_URL
  *
@@ -4324,6 +4332,7 @@ const LOCAL_STORAGE_TIME_DURATION_MILLISECONDS = 86400 * 1000;
  * @constant
  */
 const API_EXPERIMENTS_URL = 'api/v1/experiments/isUserIncluded';
+
 /**
  * The name of the experiment database store in indexDB.
  *
@@ -4331,24 +4340,26 @@ const API_EXPERIMENTS_URL = 'api/v1/experiments/isUserIncluded';
  * @constant
  */
 const EXPERIMENT_DB_STORE_NAME = 'dotExperimentStore';
+
 /**
  * The path to the key in the database IndexDB representing the running experiment data.
  * @type {string}
  */
 const EXPERIMENT_DB_KEY_PATH = 'running_experiment';
+
 /**
  * Enumeration of debug levels.
  *
  * @enum {string}
  * @readonly
  */
-var DEBUG_LEVELS;
-(function (DEBUG_LEVELS) {
+let DEBUG_LEVELS = /*#__PURE__*/function (DEBUG_LEVELS) {
   DEBUG_LEVELS["NONE"] = "NONE";
   DEBUG_LEVELS["DEBUG"] = "DEBUG";
   DEBUG_LEVELS["WARN"] = "WARN";
   DEBUG_LEVELS["ERROR"] = "ERROR";
-})(DEBUG_LEVELS || (DEBUG_LEVELS = {}));
+  return DEBUG_LEVELS;
+}({});
 const PAGE_VIEW_EVENT_NAME = 'pageview';
 
 var $$6 = _export;
@@ -6269,6 +6280,7 @@ const parseDataForAnalytics = (experiments, location) => {
     }))
   };
 };
+
 /**
  * This utility function performs regular expression (regex) matching on a supplied URL.
  *
@@ -6290,6 +6302,7 @@ const verifyRegex = (regexToCheck, href) => {
     return false;
   }
 };
+
 /**
  * This function merges newly fetched data with the data stored from IndexedDB, preparing it for re-storage in IndexedDB.
  *
@@ -6329,6 +6342,7 @@ const parseData = (fetchExperiments, storedExperiments) => {
   }
   return dataToStorage;
 };
+
 /**
  * Retrieves the array of experiment IDs from the given AssignedExperiments..
  *
@@ -6336,6 +6350,7 @@ const parseData = (fetchExperiments, storedExperiments) => {
  * @param experiments
  */
 const getExperimentsIds = experiments => experiments.map(experiment => experiment.id) || [];
+
 /**
  * Sets the expire time for new experiments based on the current time.
  * The expire time is calculated by adding the expireMillis value of each experiment's lookBackWindow to the current time (Date.now()).
@@ -6351,6 +6366,7 @@ const addExpireTimeToExperiments = experiments => {
     })
   }));
 };
+
 /**
  * Returns an array of experiments that have not expired yet.
  *
@@ -6367,6 +6383,11 @@ const getUnexpiredExperiments = (experiments, excludedExperimentIdsEnded) => {
   });
 };
 
+/**
+ * Represents the configuration for a database connection.
+ * @interface
+ */
+
 /**
  * The default version of the database.
  *
@@ -6374,6 +6395,7 @@ const getUnexpiredExperiments = (experiments, excludedExperimentIdsEnded) => {
  * @constant
  */
 const DB_DEFAULT_VERSION = 1;
+
 /**
  * The `DatabaseHandler` class offers specific methods to store and get data
  * from IndexedDB.
@@ -6391,6 +6413,7 @@ const DB_DEFAULT_VERSION = 1;
  * await DatabaseHandler.persistData(anAssignedExperiment);
  *
  */
+
 class IndexDBDatabaseHandler {
   constructor(config) {
     this.config = config;
@@ -6412,6 +6435,7 @@ class IndexDBDatabaseHandler {
       throw new Error("'db_key_path' is required in config");
     }
   }
+
   /**
    * Saves the provided data to indexDB.
    *
@@ -6433,6 +6457,7 @@ class IndexDBDatabaseHandler {
       };
     });
   }
+
   /**
    * Retrieves data from the database using a specific key.
    *
@@ -6449,6 +6474,7 @@ class IndexDBDatabaseHandler {
       request.onerror = () => reject(request.error);
     });
   }
+
   /**
    * Deletes all the data from the IndexedDB store.
    *
@@ -6465,6 +6491,7 @@ class IndexDBDatabaseHandler {
       request.onerror = () => reject(request.error);
     });
   }
+
   /**
    * Sets the flag indicating that the experiment has already been checked.
    *
@@ -6474,6 +6501,7 @@ class IndexDBDatabaseHandler {
   setFlagExperimentAlreadyChecked() {
     sessionStorage.setItem(EXPERIMENT_ALREADY_CHECKED_KEY, 'true');
   }
+
   /**
    * Sets the fetch expired time in the local storage.
    *
@@ -6483,6 +6511,7 @@ class IndexDBDatabaseHandler {
     const expireTime = Date.now() + LOCAL_STORAGE_TIME_DURATION_MILLISECONDS;
     localStorage.setItem(EXPERIMENT_FETCH_EXPIRE_TIME_KEY, expireTime.toString());
   }
+
   /**
    * Builds an error message based on the provided error object.
    * @param {DOMException | null} error - The error object to build the message from.
@@ -6497,6 +6526,7 @@ class IndexDBDatabaseHandler {
     }
     return errorMessage;
   }
+
   /**
    * Creates or opens a IndexedDB database with the specified version.
    *
@@ -6523,6 +6553,7 @@ class IndexDBDatabaseHandler {
       };
     });
   }
+
   /**
    * Retrieves the result of a database request from an Event object.
    *
@@ -6539,6 +6570,8 @@ class IndexDBDatabaseHandler {
  */
 class DotLogger {
   constructor(isDebug, packageName) {
+    this.isDebug = void 0;
+    this.packageName = void 0;
     this.isDebug = isDebug;
     this.packageName = packageName;
   }
@@ -6592,6 +6625,7 @@ const checkFlagExperimentAlreadyChecked = () => {
   const flag = sessionStorage.getItem(EXPERIMENT_ALREADY_CHECKED_KEY);
   return flag === 'true';
 };
+
 /**
  * Checks if the data needs to be invalidated based on the creation date.
  *
@@ -6609,6 +6643,7 @@ const isDataCreateValid = () => {
     return false;
   }
 };
+
 /**
  * Ad to an absolute path the baseUrl depending on the location.
  *
@@ -6630,6 +6665,7 @@ const isFullUrl = url => {
   const pattern = /^https?:\/\//i;
   return pattern.test(url);
 };
+
 /**
  * Updates the URL with the queryParam with the experiment variant name.
  *
@@ -6647,6 +6683,7 @@ const updateUrlWithExperimentVariant = (location, variant) => {
   }
   return url.toString();
 };
+
 /**
  * Check if two arrays of Experiment objects are equal.
  *
@@ -6660,6 +6697,7 @@ const objectsAreEqual = (obj1, obj2) => {
   }
   return JSON.stringify(obj1) === JSON.stringify(obj2);
 };
+
 /**
  * A function to redirect the user to a new URL.
  *
@@ -6696,11 +6734,27 @@ class DotExperiments {
      * @private
      */
     this.initializationPromise = null;
+    /**
+     * Represents the analytics client for Analytics.
+     * @private
+     */
+    this.analytics = void 0;
+    /**
+     * Class representing a database handler for IndexDB.
+     * @class
+     */
+    this.persistenceHandler = void 0;
     /**
      * Represents the stored data in the IndexedDB.
      * @private
      */
     this.experimentsAssigned = [];
+    /**
+     * A logger utility for logging messages.
+     *
+     * @class
+     */
+    this.logger = void 0;
     /**
      * Represents the current location.
      * @private
@@ -6723,6 +6777,7 @@ class DotExperiments {
     }
     this.logger = new DotLogger(this.config.debug, 'DotExperiment');
   }
+
   /**
    * Retrieves the array of experiments assigned to an instance of the class.
    *
@@ -6731,6 +6786,7 @@ class DotExperiments {
   get experiments() {
     return this.experimentsAssigned;
   }
+
   /**
    * Returns a custom redirect function. If a custom redirect function is not configured,
    * the default redirect function will be used.
@@ -6742,6 +6798,7 @@ class DotExperiments {
     var _this$config$redirect;
     return (_this$config$redirect = this.config.redirectFn) != null ? _this$config$redirect : defaultRedirectFn;
   }
+
   /**
    * Retrieves the current location.
    *
@@ -6750,6 +6807,7 @@ class DotExperiments {
   get location() {
     return this.currentLocation;
   }
+
   /**
    * Retrieves instance of DotExperiments class if it doesn't exist create a new one.
    * If the instance does not exist, it creates a new instance with the provided configuration and calls the `getExperimentData` method.
@@ -6770,6 +6828,7 @@ class DotExperiments {
     }
     return DotExperiments.instance;
   }
+
   /**
    * Waits for the initialization process to be completed.
    *
@@ -6779,6 +6838,7 @@ class DotExperiments {
     var _this$initializationP;
     return (_this$initializationP = this.initializationPromise) != null ? _this$initializationP : Promise.resolve();
   }
+
   /**
    * This method appends variant parameters to navigation links based on the provided navClass.
    *
@@ -6822,6 +6882,7 @@ class DotExperiments {
       });
     }
   }
+
   /**
    * Retrieves the current debug status.
    *
@@ -6831,6 +6892,7 @@ class DotExperiments {
   getIsDebugActive() {
     return this.config.debug;
   }
+
   /**
    * Updates the current location and checks if a variant should be applied.
    * Redirects to the variant URL if necessary.
@@ -6867,6 +6929,7 @@ class DotExperiments {
     this.logger.timeEnd('Total location changed');
     this.logger.groupEnd();
   }
+
   /**
    * Tracks a page view event in the analytics system.
    *
@@ -6876,6 +6939,7 @@ class DotExperiments {
     this.track(PAGE_VIEW_EVENT_NAME);
     this.prevLocation = this.currentLocation.href;
   }
+
   /**
    * This method is used to retrieve the variant associated with a given URL.
    *
@@ -6894,6 +6958,7 @@ class DotExperiments {
     });
     return (experiment == null ? void 0 : experiment.variant) || null;
   }
+
   /**
    * Returns the experiment variant name as a URL search parameter.
    *
@@ -6916,6 +6981,7 @@ class DotExperiments {
     }
     return new URLSearchParams(params);
   }
+
   /**
    * Determines whether a page view should be tracked.
    *
@@ -6931,6 +6997,7 @@ class DotExperiments {
       this.logger.log(`No send pageView. No experiments to track.`);
       return false;
     }
+
     // If the previous location is the same as the current location, we don't need to track the page view
     if (this.prevLocation === this.currentLocation.href) {
       this.logger.log(`No send pageView. Same location.`);
@@ -6938,6 +7005,7 @@ class DotExperiments {
     }
     return true;
   }
+
   /**
    * Tracks an event using the analytics service.
    *
@@ -6950,6 +7018,7 @@ class DotExperiments {
       this.logger.log(`${typeName} event sent`);
     });
   }
+
   /**
    * Initializes the application using lazy initialization. This method performs
    * necessary setup steps and should be invoked to ensure proper execution of the application.
@@ -6982,6 +7051,7 @@ class DotExperiments {
       }();
     }
   }
+
   /**
    * Fetches experiments from the server.
    *
@@ -7027,6 +7097,7 @@ class DotExperiments {
       this.logger.groupEnd();
     }
   }
+
   /**
    * This method is responsible for retrieving and persisting experiment data from the server to the local indexDB database.
    *
@@ -7049,11 +7120,13 @@ class DotExperiments {
         experiments: []
       };
       const storedExperiments = this.experimentsAssigned ? this.experimentsAssigned : [];
+
       // Checks whether fetching experiment data from the server is necessary.
       if (this.shouldFetchNewData()) {
         fetchedExperiments = await this.getExperimentsFromServer();
       }
       const dataToPersist = parseData(fetchedExperiments, storedExperiments);
+
       // If my stored data is equal to my parsed data, I don't need to persist again
       if (!objectsAreEqual(dataToPersist, storedExperiments)) {
         this.experimentsAssigned = await this.persistExperiments(dataToPersist);
@@ -7063,6 +7136,7 @@ class DotExperiments {
       throw Error(`Error persisting experiments to indexDB, ${e}`);
     }
   }
+
   /**
    * Persists the parsed experiment data into the indexDB database.
    *
@@ -7101,6 +7175,7 @@ class DotExperiments {
       this.logger.groupEnd();
     }
   }
+
   /**
    * Initializes the database handler.
    *
@@ -7116,6 +7191,7 @@ class DotExperiments {
       db_key_path: EXPERIMENT_DB_KEY_PATH
     });
   }
+
   /**
    * Initializes the Jitsu analytics client.
    *
@@ -7139,6 +7215,7 @@ class DotExperiments {
       this.logger.log(`Error creating/updating analytics client: ${error}`);
     }
   }
+
   /**
    * Updates the analytics client's data using the experiments data
    * currently available in the IndexDB database, based on the current location.
@@ -7167,12 +7244,14 @@ class DotExperiments {
       });
       this.logger.log('No experiments data available to update analytics client.');
     }
+
     // trigger the page view event
     if (this.shouldTrackPageView()) {
       this.trackPageView();
       return;
     }
   }
+
   /**
    * Determines whether analytics should be checked.
    *
@@ -7196,6 +7275,7 @@ class DotExperiments {
     this.logger.log(`Not should Check Analytics by now...`);
     return false;
   }
+
   /**
    * Retrieves persisted data from the database.
    *
@@ -7222,6 +7302,11 @@ class DotExperiments {
     return storedData;
   }
 }
+/**
+ * The instance of the DotExperiments class.
+ * @private
+ */
+DotExperiments.instance = void 0;
 /**
  * Represents the default configuration for the DotExperiment library.
  * @property {boolean} trackPageView - Specifies whether to track page view or not. Default value is true.
@@ -7264,6 +7349,7 @@ const useExperiments = instance => {
       }
     }
   }, [instance]);
+
   /**
    * This effect sets a click handler on the document.
    * It captures click events and redirects to a new URL if the clicked anchor has a variant assigned,
@@ -7281,19 +7367,23 @@ const useExperiments = instance => {
       const clickedHref = target.getAttribute('href');
       if (clickedHref) {
         const modifiedUrl = new URL(clickedHref, instance.location.href);
+
         // Remove the experiment query param from the URL
         modifiedUrl.searchParams.delete(EXPERIMENT_QUERY_PARAM_KEY);
         event.preventDefault();
+
         // Get the variant from the href of the clicked anchor
         const variant = instance.getVariantFromHref(clickedHref);
         if (variant && variant.name !== EXPERIMENT_DEFAULT_VARIANT_NAME) {
           // Set the experiment query param in the URL if the variant is not the default one
           modifiedUrl.searchParams.set(EXPERIMENT_QUERY_PARAM_KEY, variant.name);
         }
+
         // Redirect to the new URL using the custom redirect function
         instance.customRedirectFn(modifiedUrl.toString());
       }
     };
+
     // Register the click handler to all elements in the document
     document.addEventListener('click', customClickHandler);
     return () => {
@@ -7347,8 +7437,10 @@ const DotExperimentsProvider = ({
   config
 }) => {
   const [instance, setInstance] = useState(null);
+
   // Run Experiments detection
   useExperiments(instance);
+
   // Initialize the DotExperiments instance
   useEffect(() => {
     var _getUVEState;
@@ -7364,7 +7456,7 @@ const DotExperimentsProvider = ({
       }
     }
   }, [config]);
-  return jsx(DotExperimentsContext.Provider, {
+  return /*#__PURE__*/jsx(DotExperimentsContext.Provider, {
     value: instance,
     children: children
   });
@@ -7395,6 +7487,7 @@ function shallowEqual(objA, objB) {
   }
   return true;
 }
+
 /**
  * Memoizes an object and returns the memoized object.
  * Mantaing the same reference if the object is the same independently if is called inside any component.
@@ -7427,9 +7520,9 @@ const withExperiments = (WrappedComponent, config) => {
   // in each render, causing the experiment handling to be reinitialized.
   const memoizedConfig = useMemoizedObject(config);
   return useCallback(props => {
-    return jsx(DotExperimentsProvider, {
+    return /*#__PURE__*/jsx(DotExperimentsProvider, {
       config: memoizedConfig,
-      children: jsx(DotExperimentHandlingComponent, Object.assign({}, props, {
+      children: /*#__PURE__*/jsx(DotExperimentHandlingComponent, Object.assign({}, props, {
         WrappedComponent: WrappedComponent
       }))
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dotcms/experiments",
-  "version": "1.4.0",
+  "version": "1.5.0-next.1",
   "description": "Official JavaScript library to use Experiments with DotCMS.",
   "repository": {
     "type": "git",
@@ -25,13 +25,13 @@
   "peerDependencies": {
     "react": ">=18",
     "react-dom": ">=18",
-    "@dotcms/client": "^1.4.0",
-    "@dotcms/react": "^1.4.0",
-    "@dotcms/uve": "^1.4.0",
-    "@dotcms/types": "^1.4.0"
+    "@dotcms/client": "^1.5.0",
+    "@dotcms/react": "^1.5.0",
+    "@dotcms/uve": "^1.5.0",
+    "@dotcms/types": "^1.5.0"
   },
   "module": "./index.esm.js",
   "type": "module",
   "main": "./index.esm.js",
   "types": "./index.d.ts"
-}
+}

package/src/index.d.ts

@@ -1 +0,0 @@
-export * from './lib/components/withExperiments';

package/src/lib/components/DotExperimentHandlingComponent.d.ts

@@ -1,20 +0,0 @@
-import { DotCMSLayoutBodyProps } from '@dotcms/react';
-interface ExperimentHandlingProps extends DotCMSLayoutBodyProps {
-    WrappedComponent: React.ComponentType<DotCMSLayoutBodyProps>;
-}
-/**
- * A React functional component that conditionally renders a WrappedComponent based on the
- * experiment variant state. It uses the `useExperimentVariant` hook to determine if there's a
- * variant mismatch. If the current variant does not match the assigned variant, it temporarily
- * hides the WrappedComponent by rendering it with `visibility: hidden`. Once the correct variant
- * is confirmed, it renders the WrappedComponent normally.
- *
- * @param {React.ComponentType<DotcmsPageProps>} WrappedComponent - The React component that will be
- *        conditionally rendered based on the experiment variant.
- * @param {DotcmsPageProps} props - Props expected by the WrappedComponent, along with any additional
- *        props that extend from DotcmsPageProps.
- * @returns {React.ReactElement} A React element that either renders the WrappedComponent hidden or visible
- *          based on the experiment variant.
- */
-export declare const DotExperimentHandlingComponent: React.FC<ExperimentHandlingProps>;
-export {};

package/src/lib/components/DotExperimentsProvider.d.ts

@@ -1,47 +0,0 @@
-import { ReactElement, ReactNode } from 'react';
-import { DotExperimentConfig } from '../shared/models';
-interface DotExperimentsProviderProps {
-    children?: ReactNode;
-    config: DotExperimentConfig;
-}
-/**
- * `DotExperimentsProvider` is a component that uses React's Context API to provide
- * an instance of `DotExperiments` to all of its descendants.
- *
- *
- * @component
- * @example
- * ```jsx
- *
- * // Your application component
- * function App() {
- *
- * // Configuration options could be taken from environment variables or can send you own.
- *  const experimentConfig = {
- *     apiKey: process.env.NEXT_PUBLIC_EXPERIMENTS_API_KEY ,
- *     server: process.env.NEXT_PUBLIC_DOTCMS_HOST ,
- *     debug: process.env.NEXT_PUBLIC_EXPERIMENTS_DEBUG,
- *     redirectFn: YourRedirectFunction
- *   };
- *
- *   return (
- *     <DotExperimentsProvider config={experimentConfig}>
- *       <Header>
- *           <Navigation items={nav} />
- *         </Header>
- *       <DotcmsLayout  entity={{...}} config={{...}} />
- *     </DotExperimentsProvider>
- *   );
- * }
- * ```
- *
- * @param {object} props - The properties that define the `DotExperimentsProvider`.
- * @param {ReactNode} props.children - The descendants of this provider, which will
- *   have access to the provided `DotExperiments` instance.
- * @param {DotExperimentConfig} props.config - The configuration object for `DotExperiments`.
- *
- * @returns {ReactElement} The provider component, which should wrap the components
- * that need access to the `DotExperiments` instance.
- */
-export declare const DotExperimentsProvider: ({ children, config }: DotExperimentsProviderProps) => ReactElement;
-export {};