@ninetailed/experience.js-react 3.0.0-beta.33 → 3.0.0-beta.37

package/index.cjs

@@ -2472,10 +2472,16 @@ const TrackExperience = ({
         experience,
         profile
       });
-      ninetailed.trackExperience({
-        experience,
-        component: variant,
-        variant: distribution.index
+      ninetailed.trackHasSeenExperience({
+        experience: {
+          id: experience.id,
+          type: experience.type,
+          name: '',
+          description: ''
+        },
+        audience: experience.audience,
+        selectedVariant: variant,
+        selectedVariantIndex: distribution.index
       });
     }
   }, [inView]);
@@ -2798,7 +2804,7 @@ const Experience = _a => {
     // the profile is definitely defined, otherwise there wouldn't be an experience selected
     profile: profile
   }, {
-    children: (variant === null || variant === void 0 ? void 0 : variant.hidden) ? null : /*#__PURE__*/React.createElement(Component, Object.assign({}, passthroughProps, variant, {
+    children: 'hidden' in variant && variant.hidden ? null : /*#__PURE__*/React.createElement(Component, Object.assign({}, Object.assign(Object.assign({}, passthroughProps), variant), {
       key: `${experience.id}-${variant.id}`,
       ninetailed: {
         isPersonalized,
@@ -2899,10 +2905,15 @@ exports.DefaultExperienceLoadingComponent = DefaultExperienceLoadingComponent;
 exports.ESRLoadingComponent = ESRLoadingComponent;
 exports.ESRProvider = ESRProvider;
 exports.Experience = Experience;
+exports.ExperimentsProvider = ExperimentsProvider;
 exports.MergeTag = MergeTag;
 exports.NinetailedProvider = NinetailedProvider;
 exports.Personalize = Personalize;
+exports.TrackExperience = TrackExperience;
 exports.TrackHasSeenComponent = TrackHasSeenComponent;
+exports.useExperience = useExperience;
+exports.useExperiments = useExperiments;
+exports.useJoinExperiment = useJoinExperiment;
 exports.useNinetailed = useNinetailed;
 exports.usePersonalize = usePersonalize;
 exports.useProfile = useProfile;

package/index.js

@@ -2461,10 +2461,16 @@ const TrackExperience = ({
         experience,
         profile
       });
-      ninetailed.trackExperience({
-        experience,
-        component: variant,
-        variant: distribution.index
+      ninetailed.trackHasSeenExperience({
+        experience: {
+          id: experience.id,
+          type: experience.type,
+          name: '',
+          description: ''
+        },
+        audience: experience.audience,
+        selectedVariant: variant,
+        selectedVariantIndex: distribution.index
       });
     }
   }, [inView]);
@@ -2787,7 +2793,7 @@ const Experience = _a => {
     // the profile is definitely defined, otherwise there wouldn't be an experience selected
     profile: profile
   }, {
-    children: (variant === null || variant === void 0 ? void 0 : variant.hidden) ? null : /*#__PURE__*/createElement$1(Component, Object.assign({}, passthroughProps, variant, {
+    children: 'hidden' in variant && variant.hidden ? null : /*#__PURE__*/createElement$1(Component, Object.assign({}, Object.assign(Object.assign({}, passthroughProps), variant), {
       key: `${experience.id}-${variant.id}`,
       ninetailed: {
         isPersonalized,
@@ -2884,4 +2890,4 @@ const ESRLoadingComponent = _a => {
   }));
 };
 
-export { DefaultExperienceLoadingComponent, ESRLoadingComponent, ESRProvider, Experience, MergeTag, NinetailedProvider, Personalize, TrackHasSeenComponent, useNinetailed, usePersonalize, useProfile };
+export { DefaultExperienceLoadingComponent, ESRLoadingComponent, ESRProvider, Experience, ExperimentsProvider, MergeTag, NinetailedProvider, Personalize, TrackExperience, TrackHasSeenComponent, useExperience, useExperiments, useJoinExperiment, useNinetailed, usePersonalize, useProfile };

package/lib/Experience/ESRLoadingComponent.d.ts

@@ -1,5 +1,6 @@
 import React, { PropsWithChildren } from 'react';
 import { ExperienceBaseProps } from './Experience';
+import { Reference } from '@ninetailed/experience.js';
 declare type ESRContextValue = {
     experienceVariantsMap: Record<string, number>;
 };
@@ -11,5 +12,5 @@ export declare const ESRProvider: React.FC<PropsWithChildren<ESRProviderProps>>;
 export declare const useESR: () => {
     experienceVariantsMap: Record<string, number>;
 };
-export declare const ESRLoadingComponent: <P extends Record<string, unknown>>({ experiences, component: Component, passthroughProps, ...baseline }: ExperienceBaseProps<P, Partial<P>>) => JSX.Element;
+export declare const ESRLoadingComponent: <P extends Record<string, unknown> & Reference>({ experiences, component: Component, passthroughProps, ...baseline }: ExperienceBaseProps<P, Partial<P>, Pick<P, Exclude<keyof P, keyof P>> & Reference>) => JSX.Element;
 export {};

package/lib/Experience/Experience.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Baseline, ExperienceConfiguration } from '@ninetailed/experience.js';
+import { Baseline, ExperienceConfiguration, Reference } from '@ninetailed/experience.js';
 export declare type ExperienceComponent<P> = React.ComponentType<Omit<P, 'id'> & {
     ninetailed?: {
         isPersonalized: boolean;
@@ -8,20 +8,20 @@ export declare type ExperienceComponent<P> = React.ComponentType<Omit<P, 'id'> &
         };
     };
 }>;
-export declare type ExperienceBaseProps<P, PassThroughProps extends Partial<P>> = Baseline<Pick<P, Exclude<keyof P, keyof PassThroughProps>>> & {
-    experiences: ExperienceConfiguration[];
-    component: ExperienceComponent<P> | React.ComponentType<P>;
+export declare type ExperienceBaseProps<P, PassThroughProps extends Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference> = Baseline<Pick<P, Exclude<keyof P, keyof PassThroughProps>>> & {
+    experiences: ExperienceConfiguration<Variant>[];
+    component: React.ComponentType<P>;
     passthroughProps?: PassThroughProps;
 };
-export declare type ExperienceLoadingComponent<P, PassThroughProps extends Partial<P>> = React.ComponentType<ExperienceBaseProps<P, PassThroughProps>>;
-export declare type ExperienceProps<P, PassThroughProps extends Partial<P>> = ExperienceBaseProps<P, PassThroughProps> & {
-    experiences: ExperienceConfiguration[];
-    component: ExperienceComponent<P> | React.ComponentType<P>;
-    loadingComponent?: ExperienceLoadingComponent<P, PassThroughProps>;
+export declare type ExperienceLoadingComponent<P, PassThroughProps extends Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference> = React.ComponentType<ExperienceBaseProps<P, PassThroughProps, Variant>>;
+export declare type ExperienceProps<P, PassThroughProps extends Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference> = ExperienceBaseProps<P, PassThroughProps, Variant> & {
+    experiences: ExperienceConfiguration<Variant>[];
+    component: React.ComponentType<P>;
+    loadingComponent?: ExperienceLoadingComponent<P, PassThroughProps, Variant>;
 };
-declare type DefaultExperienceLoadingComponentProps = ExperienceBaseProps<Record<string, unknown>, Record<string, unknown>> & {
+declare type DefaultExperienceLoadingComponentProps = ExperienceBaseProps<Record<string, unknown>, Record<string, unknown>, Record<string, unknown> & Reference> & {
     unhideAfterMs?: number;
 };
 export declare const DefaultExperienceLoadingComponent: React.FC<DefaultExperienceLoadingComponentProps>;
-export declare const Experience: <P extends Record<string, unknown>, PassThroughProps extends Partial<P> = Partial<P>>({ experiences, component: Component, loadingComponent: LoadingComponent, passthroughProps, ...baseline }: ExperienceProps<P, PassThroughProps>) => JSX.Element;
+export declare const Experience: <P, PassThroughProps extends Partial<P> = Partial<P>, Variant extends Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference = Pick<P, Exclude<keyof P, keyof PassThroughProps>> & Reference>({ experiences, component: Component, loadingComponent: LoadingComponent, passthroughProps, ...baseline }: ExperienceProps<P, PassThroughProps, Variant>) => JSX.Element;
 export {};

package/lib/Experience/ExperimentsContext.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { ExperienceConfiguration } from '@ninetailed/experience.js';
-declare type ExperimentsContextValue = {
-    experiments: ExperienceConfiguration[];
+import { ExperienceConfiguration, Reference } from '@ninetailed/experience.js';
+declare type ExperimentsContextValue<Variant extends Reference> = {
+    experiments: ExperienceConfiguration<Variant>[];
 };
-export declare const ExperimentsContext: import("react").Context<ExperimentsContextValue | undefined>;
+export declare const ExperimentsContext: import("react").Context<ExperimentsContextValue<any> | undefined>;
 export {};

package/lib/Experience/ExperimentsProvider.d.ts

@@ -1,7 +1,7 @@
 import React, { PropsWithChildren } from 'react';
-import { ExperienceConfiguration } from '@ninetailed/experience.js';
-declare type ExperimentsProviderProps = {
-    experiments: ExperienceConfiguration[];
-};
-export declare const ExperimentsProvider: React.FC<PropsWithChildren<ExperimentsProviderProps>>;
+import { ExperienceConfiguration, Reference } from '@ninetailed/experience.js';
+declare type ExperimentsProviderProps<Variant extends Reference> = React.PropsWithChildren<{
+    experiments: ExperienceConfiguration<Variant>[];
+}>;
+export declare const ExperimentsProvider: <Variant extends Reference>({ experiments, children, }: React.PropsWithChildren<ExperimentsProviderProps<Variant>>) => JSX.Element;
 export {};

package/lib/Experience/TrackExperience.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { Profile } from '@ninetailed/experience.js-shared';
 import { ExperienceConfiguration } from '@ninetailed/experience.js';
 declare type TrackExperienceProps = {
-    experience: ExperienceConfiguration;
+    experience: ExperienceConfiguration<any>;
     variant: {
         id: string;
     };

package/lib/Experience/index.d.ts

@@ -1,3 +1,8 @@
 export { Experience, DefaultExperienceLoadingComponent } from './Experience';
 export type { ExperienceProps, ExperienceBaseProps, ExperienceComponent, ExperienceLoadingComponent, } from './Experience';
 export { ESRProvider, ESRLoadingComponent } from './ESRLoadingComponent';
+export { useExperience } from './useExperience';
+export { ExperimentsProvider } from './ExperimentsProvider';
+export { useExperiments } from './useExperiments';
+export { useJoinExperiment } from './useJoinExperiment';
+export { TrackExperience } from './TrackExperience';

package/lib/Experience/types/Variant.d.ts

@@ -1,4 +1,3 @@
 export declare type Variant<P> = P & {
     id: string;
-    hidden: boolean;
 };

package/lib/Experience/useExperience.d.ts

@@ -1,4 +1,4 @@
-import { Baseline, Variant, ExperienceConfiguration, Profile } from '@ninetailed/experience.js';
+import { Baseline, ExperienceConfiguration, Profile, Reference, VariantRef } from '@ninetailed/experience.js';
 declare type Load = {
     status: 'loading';
     loading: boolean;
@@ -11,12 +11,12 @@ declare type Load = {
     profile: null;
     error: null;
 };
-declare type Success = {
+declare type Success<Variant extends Reference> = {
     status: 'success';
     loading: boolean;
     hasVariants: boolean;
     baseline: Baseline;
-    experience: ExperienceConfiguration | null;
+    experience: ExperienceConfiguration<Variant> | null;
     variant: Variant | null;
     audience: {
         id: string;
@@ -37,10 +37,10 @@ declare type Fail = {
     profile: null;
     error: Error;
 };
-declare type UseExperienceArgs = {
+declare type UseExperienceArgs<Variant extends Reference> = {
     baseline: Baseline;
-    experiences: ExperienceConfiguration[];
+    experiences: ExperienceConfiguration<Variant>[];
 };
-declare type UseExperienceResponse = Load | Success | Fail;
-export declare const useExperience: ({ baseline, experiences, }: UseExperienceArgs) => UseExperienceResponse;
+declare type UseExperienceResponse<Variant extends Reference> = Load | Success<Variant | VariantRef> | Fail;
+export declare const useExperience: <Variant extends Reference>({ baseline, experiences, }: UseExperienceArgs<Variant>) => UseExperienceResponse<Variant>;
 export {};

package/lib/Experience/useJoinExperiment.d.ts

@@ -1,10 +1,10 @@
-import { Profile, ExperienceConfiguration } from '@ninetailed/experience.js';
-declare type UseJoinExperimentArgs = {
-    experiences: ExperienceConfiguration[];
+import { Profile, ExperienceConfiguration, Reference, VariantRef } from '@ninetailed/experience.js';
+declare type UseJoinExperimentArgs<Variant extends Reference> = {
+    experiences: ExperienceConfiguration<Variant>[];
 };
-declare type JoinExperimentArgs = {
-    experiment: ExperienceConfiguration;
+declare type JoinExperimentArgs<Variant extends Reference> = {
+    experiment: ExperienceConfiguration<Variant | VariantRef>;
     profile: Profile;
 };
-export declare const useJoinExperiment: ({ experiences }: UseJoinExperimentArgs) => ({ experiment, profile }: JoinExperimentArgs) => void;
+export declare const useJoinExperiment: <Variant extends Reference>({ experiences, }: UseJoinExperimentArgs<Variant>) => ({ experiment, profile }: JoinExperimentArgs<Variant>) => void;
 export {};

package/lib/NinetailedProvider.d.ts

@@ -5,7 +5,7 @@ import { Profile, Locale, OnErrorHandler, OnLogHandler } from '@ninetailed/exper
 export declare type NinetailedProviderProps = {
     clientId: string;
     environment?: string;
-    experiments?: ExperienceConfiguration[];
+    experiments?: ExperienceConfiguration<any>[];
     preview?: boolean;
     url?: string;
     plugins?: (AnalyticsPlugin | AnalyticsPlugin[])[];
@@ -15,4 +15,4 @@ export declare type NinetailedProviderProps = {
     onLog?: OnLogHandler;
     onError?: OnErrorHandler;
 };
-export declare const NinetailedProvider: React.FC<React.PropsWithChildren<NinetailedProviderProps>>;
+export declare const NinetailedProvider: ({ children, clientId, experiments, environment, preview, url, profile, locale, requestTimeout, plugins, onLog, onError, }: React.PropsWithChildren<NinetailedProviderProps>) => JSX.Element;

package/lib/index.d.ts

@@ -9,5 +9,5 @@ export { Personalize } from './Personalize';
 export type { PersonalizedComponent } from './Personalize';
 export { MergeTag } from './MergeTag';
 export { TrackHasSeenComponent } from './TrackHasSeenComponent';
-export { Experience, ESRProvider, ESRLoadingComponent, DefaultExperienceLoadingComponent, } from './Experience';
+export { ExperimentsProvider, Experience, ESRProvider, ESRLoadingComponent, DefaultExperienceLoadingComponent, TrackExperience, useExperience, useExperiments, useJoinExperiment, } from './Experience';
 export type { ExperienceProps, ExperienceBaseProps, ExperienceComponent, ExperienceLoadingComponent, } from './Experience';

package/lib/useProfile.d.ts

@@ -12,7 +12,7 @@ export declare const useProfile: () => {
         id: string;
         random: number;
         audiences: string[];
-        traits: import("@ninetailed/experience.js-shared").Traits;
+        traits: import("@ninetailed/experience.js-shared").Properties;
         location: {
             coordinates?: {
                 latitude: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ninetailed/experience.js-react",
-  "version": "3.0.0-beta.33",
+  "version": "3.0.0-beta.37",
   "peerDependencies": {
     "react": ">=16.8.0"
   },
@@ -8,9 +8,9 @@
     "@analytics/google-analytics": "0.5.3",
     "react-visibility-sensor": "5.1.1",
     "lodash": "4.17.21",
-    "@ninetailed/experience.js": "3.0.0-beta.33",
+    "@ninetailed/experience.js": "3.0.0-beta.37",
     "react-intersection-observer": "8.34.0",
-    "@ninetailed/experience.js-shared": "3.0.0-beta.33",
+    "@ninetailed/experience.js-shared": "3.0.0-beta.37",
     "analytics": "0.8.1"
   },
   "module": "./index.js",