@xylabs/sdk-react 2.12.7 → 2.12.10

package/dist/esm/common/ExperimentsHelper.d.ts

@@ -0,0 +1,20 @@
+import { ReactElement } from 'react';
+import { Log } from '@xylabs/sdk-js';
+import { ExperimentProps, ExperimentsData, OutcomesData, VariantData } from '../components';
+import { UserEventHandler } from '@xylabs/pixel';
+import { UserEventsProps } from '../contexts';
+declare const ExperimentsHelper: {
+    buildLocalStorageKey: (localStorageProp: boolean | string) => string;
+    calcTotalWeight: (variants: VariantData[]) => number;
+    calculateExperiment: (name: string, localStorageProp: string | boolean, variants: VariantData[], userEvents: UserEventHandler<UserEventsProps>) => VariantData | undefined;
+    getExperiment: (name: string) => import("../components").ExperimentData;
+    getSelectedVariant: (name: string) => VariantData | undefined;
+    loadOutcomes: () => OutcomesData;
+    makeChildrenArray: (children: ReactElement<ExperimentProps>[] | ReactElement<ExperimentProps>) => ReactElement<ExperimentProps, string | import("react").JSXElementConstructor<any>>[];
+    mergeData: (data: {
+        [index: string]: string;
+    }, log?: Log | undefined) => string;
+    saveExperimentRanges: (name: string, totalWeight: number, variants: VariantData[]) => ExperimentsData;
+    saveOutcomes: () => void;
+};
+export { ExperimentsHelper };

package/dist/esm/common/ExperimentsHelper.js

@@ -0,0 +1,98 @@
+import { forget } from '@xylabs/sdk-js';
+import { ExperimentsLocalStorageKey, OutcomesLocalStorageKey } from '../components';
+import { getLocalStorageObject, setLocalStorageObject } from '../lib';
+const defaultLocalStorageKey = 'testData';
+const experimentsTestData = {};
+let outcomes = {}; //prevent multi-outcome
+// TODO - some expire logic around experiments
+const ExperimentsHelper = {
+    buildLocalStorageKey: (localStorageProp) => {
+        return localStorageProp === true ? defaultLocalStorageKey : typeof localStorageProp === 'string' ? localStorageProp ?? defaultLocalStorageKey : '';
+    },
+    calcTotalWeight: (variants) => {
+        return variants.reduce((sum, variant) => {
+            return sum + variant.weight;
+        }, 0);
+    },
+    calculateExperiment: (name, localStorageProp, variants, userEvents) => {
+        //TODO - user events, it needs to be in the hook, all other compatibility should
+        ExperimentsHelper.loadOutcomes();
+        const localStorageKey = ExperimentsHelper.buildLocalStorageKey(localStorageProp);
+        const totalWeight = ExperimentsHelper.calcTotalWeight(variants);
+        ExperimentsHelper.saveExperimentRanges(name, totalWeight, variants);
+        const firstTime = name in outcomes;
+        let targetWeight = outcomes[name] ?? Math.random() * totalWeight;
+        outcomes[name] = targetWeight;
+        ExperimentsHelper.saveOutcomes();
+        for (const variant of variants) {
+            targetWeight -= variant.weight;
+            if (targetWeight > 0)
+                continue;
+            if (!variant.name) {
+                throw new Error('Experiment Elements must have Keys');
+            }
+            experimentsTestData[name] = variant.name;
+            if (firstTime) {
+                localStorage.setItem(localStorageKey, ExperimentsHelper.mergeData(experimentsTestData));
+            }
+            if (userEvents) {
+                forget(userEvents.testStarted({ name, variation: variant.name }));
+            }
+            return variant;
+        }
+    },
+    getExperiment: (name) => {
+        ExperimentsHelper.loadOutcomes();
+        const experiments = getLocalStorageObject(ExperimentsLocalStorageKey) || {};
+        return experiments[name];
+    },
+    getSelectedVariant: (name) => {
+        const outcomes = ExperimentsHelper.loadOutcomes();
+        const experiment = ExperimentsHelper.getExperiment(name);
+        let total = 0;
+        if (experiment && outcomes) {
+            const targetWeight = outcomes[name];
+            for (let i = 0; i < experiment.variants.length; i++) {
+                const variant = experiment.variants[i];
+                total += variant.weight;
+                if (total >= targetWeight) {
+                    return variant;
+                }
+            }
+        }
+    },
+    loadOutcomes: () => {
+        outcomes = getLocalStorageObject(OutcomesLocalStorageKey);
+        return outcomes;
+    },
+    makeChildrenArray: (children) => {
+        if (Array.isArray(children)) {
+            return children;
+        }
+        else {
+            return [children];
+        }
+    },
+    mergeData: (data, log) => {
+        const dataArray = [];
+        for (const key in data) {
+            dataArray.push(`${key}-${data[key]}`);
+        }
+        log?.info('MergeData', dataArray.join('|'));
+        return dataArray.join('|');
+    },
+    saveExperimentRanges: (name, totalWeight, variants) => {
+        const experiments = getLocalStorageObject(ExperimentsLocalStorageKey) || {};
+        experiments[name] = {
+            totalWeight,
+            variants,
+        };
+        setLocalStorageObject(ExperimentsLocalStorageKey, experiments);
+        return experiments;
+    },
+    saveOutcomes: () => {
+        setLocalStorageObject(OutcomesLocalStorageKey, outcomes);
+    },
+};
+export { ExperimentsHelper };
+//# sourceMappingURL=ExperimentsHelper.js.map

package/dist/esm/common/ExperimentsHelper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExperimentsHelper.js","sourceRoot":"","sources":["../../../src/common/ExperimentsHelper.ts"],"names":[],"mappings":"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"}

package/dist/esm/common/index.d.ts

@@ -0,0 +1 @@
+export * from './ExperimentsHelper';

package/dist/esm/common/index.js

@@ -0,0 +1,2 @@
+export * from './ExperimentsHelper';
+//# sourceMappingURL=index.js.map

package/dist/esm/common/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/common/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA"}

package/dist/esm/components/EthAccount/EthAccountBox.js

@@ -6,7 +6,7 @@ import { EthersContext } from '../../contexts';
 import { useMediaQuery } from '../../hooks';
 import { FlexRow } from '../FlexBox';
 import { Identicon } from '../Identicon';
-export const EthAccountBox = ({ address, icon = false, iconSize = 16, iconOnly = false, shortenedLength, addressLength = 'auto', fontFamily = '"Source Code Pro",monospace', ...props }) => {
+export const EthAccountBox = ({ address, icon = false, iconSize = 16, iconOnly = false, shortenedLength, height, addressLength = 'auto', fontFamily = '"Source Code Pro",monospace', ...props }) => {
     const { localAddress } = useContext(EthersContext);
     const theme = useTheme();
     const large = useMediaQuery(theme.breakpoints.up('md'));
@@ -22,6 +22,6 @@ export const EthAccountBox = ({ address, icon = false, iconSize = 16, iconOnly =
                     : addressToDisplay.toShortString()
         : '-- --';
     // Note: We use the all zero address for spacing in case it is
-    return (_jsxs(FlexRow, { justifyContent: "space-between", alignItems: "center", minHeight: theme.spacing(3), ...props, children: [icon ? _jsx(Identicon, { minHeight: theme.spacing(3), minWidth: theme.spacing(3), bgcolor: theme.palette.secondary.main, size: iconSize, value: address?.toHex() }) : null, iconOnly ? null : (_jsx(Typography, { marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily, children: textToDisplay })), isLocalAddress ? _jsx(FlexRow, { marginLeft: 0.5, children: "(You)" }) : null] }));
+    return (_jsxs(FlexRow, { height: height, justifyContent: "space-between", alignItems: "stretch", minHeight: theme.spacing(3), ...props, children: [icon ? (_jsx(Identicon, { minHeight: height ?? theme.spacing(3), minWidth: height ?? theme.spacing(3), bgcolor: theme.palette.secondary.main, size: iconSize, value: address?.toHex() })) : null, iconOnly ? null : (_jsx(Typography, { alignSelf: "center", marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily, children: textToDisplay })), isLocalAddress ? _jsx(FlexRow, { marginLeft: 0.5, children: "(You)" }) : null] }));
 };
 //# sourceMappingURL=EthAccountBox.js.map

package/dist/esm/components/EthAccount/EthAccountBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"EthAccountBox.js","sourceRoot":"","sources":["../../../../src/components/EthAccount/EthAccountBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACpD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAElC,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,OAAO,EAAgB,OAAO,EAAE,MAAM,YAAY,CAAA;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAGxC,MAAM,CAAC,MAAM,aAAa,GAA6C,CAAC,EACtE,OAAO,EACP,IAAI,GAAG,KAAK,EACZ,QAAQ,GAAG,EAAE,EACb,QAAQ,GAAG,KAAK,EAChB,eAAe,EACf,aAAa,GAAG,MAAM,EACtB,UAAU,GAAG,6BAA6B,EAC1C,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,aAAa,CAAC,CAAA;IAClD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IAEvD,MAAM,cAAc,GAAG,OAAO,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ,EAAE,KAAK,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IAExF,MAAM,gBAAgB,GAAG,QAAQ,CAAC,OAAO,IAAI,UAAU,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE,iBAAiB,CAAC,CAAA;IAE9F,MAAM,aAAa,GAAG,OAAO;QAC3B,CAAC,CAAC,aAAa,KAAK,MAAM;YACxB,CAAC,CAAC,gBAAgB,CAAC,QAAQ,EAAE;YAC7B,CAAC,CAAC,aAAa,KAAK,OAAO;gBAC3B,CAAC,CAAC,gBAAgB,CAAC,aAAa,CAAC,eAAe,CAAC;gBACjD,CAAC,CAAC,KAAK;oBACP,CAAC,CAAC,gBAAgB,CAAC,QAAQ,EAAE;oBAC7B,CAAC,CAAC,gBAAgB,CAAC,aAAa,EAAE;QACpC,CAAC,CAAC,OAAO,CAAA;IAEX,8DAA8D;IAE9D,OAAO,CACL,MAAC,OAAO,IAAC,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,QAAQ,EAAC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAM,KAAK,aAC/F,IAAI,CAAC,CAAC,CAAC,KAAC,SAAS,IAAC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,GAAI,CAAC,CAAC,CAAC,IAAI,EACpK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACjB,KAAC,UAAU,IAAC,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAC,OAAO,EAAC,UAAU,EAAE,UAAU,YACzE,aAAa,GACH,CACd,EACA,cAAc,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,UAAU,EAAE,GAAG,sBAAiB,CAAC,CAAC,CAAC,IAAI,IAC1D,CACX,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"EthAccountBox.js","sourceRoot":"","sources":["../../../../src/components/EthAccount/EthAccountBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACpD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAElC,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,OAAO,EAAgB,OAAO,EAAE,MAAM,YAAY,CAAA;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAGxC,MAAM,CAAC,MAAM,aAAa,GAA6C,CAAC,EACtE,OAAO,EACP,IAAI,GAAG,KAAK,EACZ,QAAQ,GAAG,EAAE,EACb,QAAQ,GAAG,KAAK,EAChB,eAAe,EACf,MAAM,EACN,aAAa,GAAG,MAAM,EACtB,UAAU,GAAG,6BAA6B,EAC1C,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,aAAa,CAAC,CAAA;IAClD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IAEvD,MAAM,cAAc,GAAG,OAAO,CAAC,CAAC,CAAC,YAAY,EAAE,QAAQ,EAAE,KAAK,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IAExF,MAAM,gBAAgB,GAAG,QAAQ,CAAC,OAAO,IAAI,UAAU,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE,iBAAiB,CAAC,CAAA;IAE9F,MAAM,aAAa,GAAG,OAAO;QAC3B,CAAC,CAAC,aAAa,KAAK,MAAM;YACxB,CAAC,CAAC,gBAAgB,CAAC,QAAQ,EAAE;YAC7B,CAAC,CAAC,aAAa,KAAK,OAAO;gBAC3B,CAAC,CAAC,gBAAgB,CAAC,aAAa,CAAC,eAAe,CAAC;gBACjD,CAAC,CAAC,KAAK;oBACP,CAAC,CAAC,gBAAgB,CAAC,QAAQ,EAAE;oBAC7B,CAAC,CAAC,gBAAgB,CAAC,aAAa,EAAE;QACpC,CAAC,CAAC,OAAO,CAAA;IAEX,8DAA8D;IAE9D,OAAO,CACL,MAAC,OAAO,IAAC,MAAM,EAAE,MAAM,EAAE,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,SAAS,EAAC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,KAAM,KAAK,aAChH,IAAI,CAAC,CAAC,CAAC,CACN,KAAC,SAAS,IAAC,SAAS,EAAE,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,GAAI,CAC3K,CAAC,CAAC,CAAC,IAAI,EACP,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACjB,KAAC,UAAU,IAAC,SAAS,EAAC,QAAQ,EAAC,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAC,OAAO,EAAC,UAAU,EAAE,UAAU,YAC5F,aAAa,GACH,CACd,EACA,cAAc,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,UAAU,EAAE,GAAG,sBAAiB,CAAC,CAAC,CAAC,IAAI,IAC1D,CACX,CAAA;AACH,CAAC,CAAA"}

package/dist/esm/components/Experiments/index.d.ts

@@ -2,3 +2,4 @@ export * from './Experiment';
 export * from './Experiments';
 export * from './ExperimentsDebugger';
 export * from './ExperimentsProps';
+export * from './models';

package/dist/esm/components/Experiments/index.js

@@ -2,4 +2,5 @@ export * from './Experiment';
 export * from './Experiments';
 export * from './ExperimentsDebugger';
 export * from './ExperimentsProps';
+export * from './models';
 //# sourceMappingURL=index.js.map

package/dist/esm/components/Experiments/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Experiments/index.tsx"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Experiments/index.tsx"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,UAAU,CAAA"}

package/dist/esm/hooks/useExperiment.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+import { VariantData } from '../components';
+declare const selectVariantForExperiment: (name: string, variants: Record<string, ReactNode>, defaultNode: ReactNode) => ReactNode;
+declare const useExperiments: (name: string, experiments: VariantData[]) => {
+    experimentName: string;
+    selectVariant: (variants: Record<string, ReactNode>, defaultNode: ReactNode) => ReactNode;
+};
+export { selectVariantForExperiment, useExperiments };

package/dist/esm/hooks/useExperiment.js

@@ -0,0 +1,25 @@
+import { useState } from 'react';
+import { ExperimentsHelper } from '../common';
+import { useUserEvents } from './useUserEvents';
+const selectVariant = (current) => (variants, defaultNode) => {
+    if (current && current in variants) {
+        return variants[current];
+    }
+    return defaultNode;
+};
+const selectVariantForExperiment = (name, variants, defaultNode) => {
+    const variant = ExperimentsHelper.getSelectedVariant(name);
+    if (variants[variant?.name ?? '']) {
+        return variants[variant?.name ?? ''];
+    }
+    return defaultNode;
+};
+const useExperiments = (name, experiments) => {
+    const [activeExperiment] = useState(ExperimentsHelper.calculateExperiment(name, true, experiments, useUserEvents()));
+    return {
+        experimentName: name,
+        selectVariant: selectVariant(activeExperiment?.name),
+    };
+};
+export { selectVariantForExperiment, useExperiments };
+//# sourceMappingURL=useExperiment.js.map

package/dist/esm/hooks/useExperiment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useExperiment.js","sourceRoot":"","sources":["../../../src/hooks/useExperiment.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,QAAQ,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAE7C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,MAAM,aAAa,GAAG,CAAC,OAAgB,EAAE,EAAE,CAAC,CAAC,QAAmC,EAAE,WAAsB,EAAE,EAAE;IAC1G,IAAI,OAAO,IAAI,OAAO,IAAI,QAAQ,EAAE;QAClC,OAAO,QAAQ,CAAC,OAAO,CAAC,CAAA;KACzB;IACD,OAAO,WAAW,CAAA;AACpB,CAAC,CAAA;AAED,MAAM,0BAA0B,GAAG,CAAC,IAAY,EAAE,QAAmC,EAAE,WAAsB,EAAE,EAAE;IAC/G,MAAM,OAAO,GAAG,iBAAiB,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAA;IAC1D,IAAI,QAAQ,CAAC,OAAO,EAAE,IAAI,IAAI,EAAE,CAAC,EAAE;QACjC,OAAO,QAAQ,CAAC,OAAO,EAAE,IAAI,IAAI,EAAE,CAAC,CAAA;KACrC;IACD,OAAO,WAAW,CAAA;AACpB,CAAC,CAAA;AAED,MAAM,cAAc,GAAG,CAAC,IAAY,EAAE,WAA0B,EAAE,EAAE;IAClE,MAAM,CAAC,gBAAgB,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC,mBAAmB,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,aAAa,EAAE,CAAC,CAAC,CAAA;IAEpH,OAAO;QACL,cAAc,EAAE,IAAI;QACpB,aAAa,EAAE,aAAa,CAAC,gBAAgB,EAAE,IAAI,CAAC;KACrD,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,0BAA0B,EAAE,cAAc,EAAE,CAAA"}

package/dist/esm/lib/Tracking/Drip/BaseEvent.js

@@ -12,6 +12,7 @@ export class DripBaseEvent {
             payload.push(this.param);
         }
         payload.push(data);
+        console.log('sdk-react', payload);
         this.dcq.push(payload);
         await delay(0);
     }

package/dist/esm/lib/Tracking/Drip/BaseEvent.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseEvent.js","sourceRoot":"","sources":["../../../../../src/lib/Tracking/Drip/BaseEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AAItC,MAAM,OAAO,aAAa;IAKxB,YAAY,IAAY,EAAE,KAAc;QACtC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAChB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;QAClB,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,EAAE,CAAA;QACxB,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,EAAE,CAAA;IAC1B,CAAC;IAEM,KAAK,CAAC,IAAI,CAAC,IAAO;QACvB,MAAM,OAAO,GAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAC3C,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;SACzB;QACD,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAClB,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QACtB,MAAM,KAAK,CAAC,CAAC,CAAC,CAAA;IAChB,CAAC;IAEO,MAAM;QACZ,8DAA8D;QAC9D,MAAM,MAAM,GAAG,MAAa,CAAA;QAC5B,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YAChB,MAAM,KAAK,CAAC,eAAe,CAAC,CAAA;SAC7B;QACD,OAAO,MAAM,CAAC,IAAsB,CAAA;IACtC,CAAC;IAEO,MAAM;QACZ,8DAA8D;QAC9D,MAAM,MAAM,GAAG,MAAa,CAAA;QAC5B,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YAChB,MAAM,KAAK,CAAC,eAAe,CAAC,CAAA;SAC7B;QACD,OAAO,MAAM,CAAC,IAAsB,CAAA;IACtC,CAAC;CACF"}
+{"version":3,"file":"BaseEvent.js","sourceRoot":"","sources":["../../../../../src/lib/Tracking/Drip/BaseEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AAItC,MAAM,OAAO,aAAa;IAKxB,YAAY,IAAY,EAAE,KAAc;QACtC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAChB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;QAClB,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,EAAE,CAAA;QACxB,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,EAAE,CAAA;IAC1B,CAAC;IAEM,KAAK,CAAC,IAAI,CAAC,IAAO;QACvB,MAAM,OAAO,GAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAC3C,IAAI,IAAI,CAAC,KAAK,EAAE;YACd,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;SACzB;QACD,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAClB,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC,CAAA;QACjC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QACtB,MAAM,KAAK,CAAC,CAAC,CAAC,CAAA;IAChB,CAAC;IAEO,MAAM;QACZ,8DAA8D;QAC9D,MAAM,MAAM,GAAG,MAAa,CAAA;QAC5B,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YAChB,MAAM,KAAK,CAAC,eAAe,CAAC,CAAA;SAC7B;QACD,OAAO,MAAM,CAAC,IAAsB,CAAA;IACtC,CAAC;IAEO,MAAM;QACZ,8DAA8D;QAC9D,MAAM,MAAM,GAAG,MAAa,CAAA;QAC5B,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;YAChB,MAAM,KAAK,CAAC,eAAe,CAAC,CAAA;SAC7B;QACD,OAAO,MAAM,CAAC,IAAsB,CAAA;IACtC,CAAC;CACF"}

package/dist/esm/lib/Tracking/Tapjoy/StandardEvents.d.ts

@@ -1,5 +1,5 @@
 import { TapjoyStandardEvent } from './StandardEvent';
 declare class TapjoyStandardEvents<T extends Record<string, unknown>> {
-    purchase(): TapjoyStandardEvent<T>;
+    accountCreated(): TapjoyStandardEvent<T>;
 }
 export { TapjoyStandardEvents };

package/dist/esm/lib/Tracking/Tapjoy/StandardEvents.js

@@ -1,7 +1,7 @@
 import { TapjoyStandardEvent } from './StandardEvent';
 class TapjoyStandardEvents {
-    purchase() {
-        return new TapjoyStandardEvent('Purchase');
+    accountCreated() {
+        return new TapjoyStandardEvent('Conversion');
     }
 }
 export { TapjoyStandardEvents };

package/dist/esm/lib/Tracking/Tapjoy/StandardEvents.js.map

@@ -1 +1 @@
-{"version":3,"file":"StandardEvents.js","sourceRoot":"","sources":["../../../../../src/lib/Tracking/Tapjoy/StandardEvents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAA;AAErD,MAAM,oBAAoB;IACjB,QAAQ;QACb,OAAO,IAAI,mBAAmB,CAAI,UAAU,CAAC,CAAA;IAC/C,CAAC;CACF;AAED,OAAO,EAAE,oBAAoB,EAAE,CAAA"}
+{"version":3,"file":"StandardEvents.js","sourceRoot":"","sources":["../../../../../src/lib/Tracking/Tapjoy/StandardEvents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAA;AAErD,MAAM,oBAAoB;IACjB,cAAc;QACnB,OAAO,IAAI,mBAAmB,CAAI,YAAY,CAAC,CAAA;IACjD,CAAC;CACF;AAED,OAAO,EAAE,oBAAoB,EAAE,CAAA"}

package/package.json

@@ -126,6 +126,6 @@
   },
   "sideEffects": false,
   "types": "dist/esm/index.d.ts",
-  "version": "2.12.7",
+  "version": "2.12.10",
   "packageManager": "yarn@3.1.1"
 }

package/src/common/ExperimentsHelper.ts

@@ -0,0 +1,111 @@
+import { ReactElement } from 'react'
+import { forget, Log } from '@xylabs/sdk-js'
+
+import { ExperimentProps, ExperimentsData, ExperimentsLocalStorageKey, OutcomesData, OutcomesLocalStorageKey, VariantData } from '../components'
+import { getLocalStorageObject, setLocalStorageObject } from '../lib'
+import { UserEventHandler } from '@xylabs/pixel'
+import { UserEventsProps } from '../contexts'
+
+const defaultLocalStorageKey = 'testData'
+const experimentsTestData: { [index: string]: string } = {}
+let outcomes: OutcomesData = {} //prevent multi-outcome
+
+// TODO - some expire logic around experiments
+const ExperimentsHelper = {
+  buildLocalStorageKey: (localStorageProp: boolean | string) => {
+    return localStorageProp === true ? defaultLocalStorageKey : typeof localStorageProp === 'string' ? localStorageProp ?? defaultLocalStorageKey : ''
+  },
+
+  calcTotalWeight: (variants: VariantData[]) => {
+    return variants.reduce((sum, variant) => {
+      return sum + variant.weight
+    }, 0)
+  },
+
+  calculateExperiment: (name: string, localStorageProp: string | boolean, variants: VariantData[], userEvents: UserEventHandler<UserEventsProps>) => {
+    //TODO - user events, it needs to be in the hook, all other compatibility should
+    ExperimentsHelper.loadOutcomes()
+    const localStorageKey = ExperimentsHelper.buildLocalStorageKey(localStorageProp)
+    const totalWeight = ExperimentsHelper.calcTotalWeight(variants)
+    ExperimentsHelper.saveExperimentRanges(name, totalWeight, variants)
+    const firstTime = name in outcomes
+    let targetWeight = outcomes[name] ?? Math.random() * totalWeight
+    outcomes[name] = targetWeight
+    ExperimentsHelper.saveOutcomes()
+    for (const variant of variants) {
+      targetWeight -= variant.weight
+      if (targetWeight > 0) continue
+      if (!variant.name) {
+        throw new Error('Experiment Elements must have Keys')
+      }
+      experimentsTestData[name] = variant.name
+      if (firstTime) {
+        localStorage.setItem(localStorageKey, ExperimentsHelper.mergeData(experimentsTestData))
+      }
+      if (userEvents) {
+        forget(userEvents.testStarted({ name, variation: variant.name }))
+      }
+      return variant
+    }
+  },
+
+  getExperiment: (name: string) => {
+    ExperimentsHelper.loadOutcomes()
+    const experiments = getLocalStorageObject<ExperimentsData>(ExperimentsLocalStorageKey) || {}
+    return experiments[name]
+  },
+
+  getSelectedVariant: (name: string) => {
+    const outcomes = ExperimentsHelper.loadOutcomes()
+    const experiment = ExperimentsHelper.getExperiment(name)
+    let total = 0
+    if (experiment && outcomes) {
+      const targetWeight = outcomes[name]
+      for (let i = 0; i < experiment.variants.length; i++) {
+        const variant = experiment.variants[i]
+        total += variant.weight
+        if (total >= targetWeight) {
+          return variant
+        }
+      }
+    }
+  },
+
+  loadOutcomes: () => {
+    outcomes = getLocalStorageObject(OutcomesLocalStorageKey)
+    return outcomes
+  },
+
+  makeChildrenArray: (children: ReactElement<ExperimentProps>[] | ReactElement<ExperimentProps>) => {
+    if (Array.isArray(children)) {
+      return children as ReactElement<ExperimentProps>[]
+    } else {
+      return [children] as ReactElement<ExperimentProps>[]
+    }
+  },
+
+  mergeData: (data: { [index: string]: string }, log?: Log) => {
+    const dataArray: string[] = []
+    for (const key in data) {
+      dataArray.push(`${key}-${data[key]}`)
+    }
+    log?.info('MergeData', dataArray.join('|'))
+    return dataArray.join('|')
+  },
+
+  saveExperimentRanges: (name: string, totalWeight: number, variants: VariantData[]) => {
+    const experiments = getLocalStorageObject<ExperimentsData>(ExperimentsLocalStorageKey) || {}
+    experiments[name] = {
+      totalWeight,
+      variants,
+    }
+    setLocalStorageObject(ExperimentsLocalStorageKey, experiments)
+    return experiments
+  },
+
+  saveOutcomes: () => {
+    setLocalStorageObject(OutcomesLocalStorageKey, outcomes)
+  },
+}
+
+export { ExperimentsHelper }

package/src/common/index.ts

@@ -0,0 +1 @@
+export * from './ExperimentsHelper'

package/src/components/EthAccount/EthAccountBox.stories.tsx

@@ -17,7 +17,7 @@ const StorybookEntry = {
 
 const Template: ComponentStory<typeof EthAccountBox> = (args) => (
   <FlexRow>
-    <EthAccountBox {...args}></EthAccountBox>
+    <EthAccountBox height={40} {...args}></EthAccountBox>
   </FlexRow>
 )
 

package/src/components/EthAccount/EthAccountBox.tsx

@@ -14,6 +14,7 @@ export const EthAccountBox: React.FC<EthAccountProps & FlexBoxProps> = ({
   iconSize = 16,
   iconOnly = false,
   shortenedLength,
+  height,
   addressLength = 'auto',
   fontFamily = '"Source Code Pro",monospace',
   ...props
@@ -40,10 +41,12 @@ export const EthAccountBox: React.FC<EthAccountProps & FlexBoxProps> = ({
   // Note: We use the all zero address for spacing in case it is
 
   return (
-    <FlexRow justifyContent="space-between" alignItems="center" minHeight={theme.spacing(3)} {...props}>
-      {icon ? <Identicon minHeight={theme.spacing(3)} minWidth={theme.spacing(3)} bgcolor={theme.palette.secondary.main} size={iconSize} value={address?.toHex()} /> : null}
+    <FlexRow height={height} justifyContent="space-between" alignItems="stretch" minHeight={theme.spacing(3)} {...props}>
+      {icon ? (
+        <Identicon minHeight={height ?? theme.spacing(3)} minWidth={height ?? theme.spacing(3)} bgcolor={theme.palette.secondary.main} size={iconSize} value={address?.toHex()} />
+      ) : null}
       {iconOnly ? null : (
-        <Typography marginLeft={icon ? 1 : 0} variant="body1" fontFamily={fontFamily}>
+        <Typography alignSelf="center" marginLeft={icon ? 1 : 0} variant="body1" fontFamily={fontFamily}>
           {textToDisplay}
         </Typography>
       )}

package/src/components/Experiments/index.tsx

@@ -2,3 +2,4 @@ export * from './Experiment'
 export * from './Experiments'
 export * from './ExperimentsDebugger'
 export * from './ExperimentsProps'
+export * from './models'

package/src/hooks/useExperiment.ts

@@ -0,0 +1,31 @@
+import { ReactNode, useState } from 'react'
+
+import { ExperimentsHelper } from '../common'
+import { VariantData } from '../components'
+import { useUserEvents } from './useUserEvents'
+
+const selectVariant = (current?: string) => (variants: Record<string, ReactNode>, defaultNode: ReactNode) => {
+  if (current && current in variants) {
+    return variants[current]
+  }
+  return defaultNode
+}
+
+const selectVariantForExperiment = (name: string, variants: Record<string, ReactNode>, defaultNode: ReactNode) => {
+  const variant = ExperimentsHelper.getSelectedVariant(name)
+  if (variants[variant?.name ?? '']) {
+    return variants[variant?.name ?? '']
+  }
+  return defaultNode
+}
+
+const useExperiments = (name: string, experiments: VariantData[]) => {
+  const [activeExperiment] = useState(ExperimentsHelper.calculateExperiment(name, true, experiments, useUserEvents()))
+
+  return {
+    experimentName: name,
+    selectVariant: selectVariant(activeExperiment?.name),
+  }
+}
+
+export { selectVariantForExperiment, useExperiments }

package/src/hooks/useExperiments.stories.tsx

@@ -0,0 +1,43 @@
+import { ComponentMeta, ComponentStory } from '@storybook/react'
+
+import { selectVariantForExperiment, useExperiments } from './useExperiment'
+
+const View: React.FC = () => {
+  const { experimentName, selectVariant } = useExperiments('Storybook Test', [
+    { name: 'a/legacy', weight: 33 },
+    { name: 'b/testing', weight: 33 },
+    { name: 'c/testing', weight: 33 },
+  ])
+  const texts = { 'a/legacy': <p>a</p>, 'b/testing': <p>b</p>, 'c/testing': <p>c</p> }
+  const test0 = selectVariantForExperiment('Storybook Test Does not exists', texts, <p>DefaultNode</p>)
+  const test1 = selectVariant({ 'a/legacy': <p>a</p>, 'b/testing': <p>b</p>, 'c/testing': <p>c</p> }, <p>default node</p>)
+  const test2 = selectVariantForExperiment(experimentName, texts, <p>DefaultNode</p>)
+  return (
+    <div>
+      <div>{test0}</div>
+      <div>{test1}</div>
+      <div>{test2}</div>
+    </div>
+  )
+}
+
+const StorybookEntry = {
+  argTypes: {},
+  component: View,
+  parameters: {
+    docs: {
+      page: null,
+    },
+  },
+  title: 'Hooks/useExperiments',
+} as ComponentMeta<typeof View>
+
+const Template: ComponentStory<typeof View> = (args) => <View {...args} />
+
+const Default = Template.bind({})
+Default.args = {}
+
+export { Default }
+
+// eslint-disable-next-line import/no-default-export
+export default StorybookEntry

package/src/lib/Tracking/Drip/BaseEvent.ts

@@ -20,6 +20,7 @@ export class DripBaseEvent<T extends Record<string, unknown>> {
       payload.push(this.param)
     }
     payload.push(data)
+    console.log('sdk-react', payload)
     this.dcq.push(payload)
     await delay(0)
   }

package/src/lib/Tracking/Tapjoy/StandardEvents.ts

@@ -1,8 +1,8 @@
 import { TapjoyStandardEvent } from './StandardEvent'
 
 class TapjoyStandardEvents<T extends Record<string, unknown>> {
-  public purchase() {
-    return new TapjoyStandardEvent<T>('Purchase')
+  public accountCreated() {
+    return new TapjoyStandardEvent<T>('Conversion')
   }
 }