@pack/hydrogen 0.1.2 → 0.1.3-ab-beta.2.0

package/dist/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const PACK_COOKIE_ID = "__pack";
+export declare const PACK_USER_CONSENT_COOKIE_ID = "__pack_user_consent";
+export declare const PACK_COOKIE_MAX_AGE: number;
+//# sourceMappingURL=constants.d.ts.map

package/dist/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../src/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,cAAc,WAAW,CAAC;AACvC,eAAO,MAAM,2BAA2B,wBAAwB,CAAC;AACjE,eAAO,MAAM,mBAAmB,QAAqB,CAAC"}

package/dist/constants.js

@@ -0,0 +1,3 @@
+export const PACK_COOKIE_ID = "__pack";
+export const PACK_USER_CONSENT_COOKIE_ID = "__pack_user_consent";
+export const PACK_COOKIE_MAX_AGE = 60 * 60 * 24 * 360; // 1 year

package/dist/create-pack-client.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="@shopify/oxygen-workers-types" />
 import { PackClient } from "@pack/client";
 import { CacheCustom } from "@shopify/hydrogen";
-import { PreviewSession } from "./preview/preview-session";
+import { PackSession } from "./session/session";
+import { Test, TestInput } from "./tests/test";
 /** @see https://shopify.dev/docs/custom-storefronts/hydrogen/data-fetching/cache#caching-strategies */
 type CachingStrategy = ReturnType<typeof CacheCustom>;
 interface EnvironmentOptions {
@@ -19,8 +20,10 @@ interface EnvironmentOptions {
 interface CreatePackClientOptions extends EnvironmentOptions {
     apiUrl?: string;
     token?: string;
+    storeId?: string;
+    session: PackSession;
     preview?: {
-        session: PreviewSession;
+        session: PackSession;
     };
     contentEnvironment?: string;
     /** Default theme data to use when no token is provided */
@@ -30,6 +33,7 @@ type Variables = Record<string, any>;
 interface QueryOptions {
     variables?: Variables;
     cache?: CachingStrategy;
+    test?: TestInput;
 }
 interface QueryError {
     message: string;
@@ -43,11 +47,21 @@ interface QueryResponse<T> {
 }
 export interface Pack {
     isPreviewModeEnabled: () => boolean;
+    session: PackSession;
     preview?: {
-        session: PreviewSession;
+        session: PackSession;
     };
+    abTest: Test | null | undefined;
+    setRequestAbTest: (request: Request) => void;
     query: <T = any>(query: string, options?: QueryOptions) => Promise<QueryResponse<T>>;
     isValidEditToken: PackClient["isValidEditToken"];
+    getPackSessionData(): {
+        storeId: string;
+        sessionId: string;
+        abTest: Test | null | undefined;
+        isPreviewModeEnabled: boolean;
+        customizerMeta: any;
+    };
 }
 interface DefaultThemeData {
     data: Record<string, any>;

package/dist/create-pack-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create-pack-client.d.ts","sourceRoot":"","sources":["../src/create-pack-client.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAmB,MAAM,mBAAmB,CAAC;AACjE,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAE3D,uGAAuG;AACvG,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAEtD,UAAU,kBAAkB;IAC1B;;;OAGG;IACH,KAAK,EAAE,KAAK,CAAC;IACb;;;OAGG;IACH,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED,UAAU,uBAAwB,SAAQ,kBAAkB;IAC1D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,cAAc,CAAC;KACzB,CAAC;IACF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC;AAED,KAAK,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAErC,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,eAAe,CAAC;CACzB;AAED,UAAU,UAAU;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,aAAa,CAAC,CAAC;IACvB,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,IAAI;IACnB,oBAAoB,EAAE,MAAM,OAAO,CAAC;IACpC,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,cAAc,CAAC;KACzB,CAAC;IACF,KAAK,EAAE,CAAC,CAAC,GAAG,GAAG,EACb,KAAK,EAAE,MAAM,EACb,OAAO,CAAC,EAAE,YAAY,KACnB,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/B,gBAAgB,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;CAClD;AAED,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC3B;AAsFD,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,uBAAuB,GAAG,IAAI,CAwFvE"}
+{"version":3,"file":"create-pack-client.d.ts","sourceRoot":"","sources":["../src/create-pack-client.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAmB,MAAM,mBAAmB,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAKL,IAAI,EACJ,SAAS,EACV,MAAM,cAAc,CAAC;AAEtB,uGAAuG;AACvG,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAEtD,UAAU,kBAAkB;IAC1B;;;OAGG;IACH,KAAK,EAAE,KAAK,CAAC;IACb;;;OAGG;IACH,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED,UAAU,uBAAwB,SAAQ,kBAAkB;IAC1D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,WAAW,CAAC;KACtB,CAAC;IACF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,0DAA0D;IAC1D,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;CACrC;AAED,KAAK,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AAErC,UAAU,YAAY;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED,UAAU,UAAU;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd;AAED,UAAU,aAAa,CAAC,CAAC;IACvB,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC;IACf,KAAK,EAAE,UAAU,GAAG,IAAI,CAAC;CAC1B;AAED,MAAM,WAAW,IAAI;IACnB,oBAAoB,EAAE,MAAM,OAAO,CAAC;IACpC,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE;QACR,OAAO,EAAE,WAAW,CAAC;KACtB,CAAC;IACF,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;IAChC,gBAAgB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,KAAK,EAAE,CAAC,CAAC,GAAG,GAAG,EACb,KAAK,EAAE,MAAM,EACb,OAAO,CAAC,EAAE,YAAY,KACnB,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/B,gBAAgB,EAAE,UAAU,CAAC,kBAAkB,CAAC,CAAC;IACjD,kBAAkB,IAAI;QACpB,OAAO,EAAE,MAAM,CAAC;QAChB,SAAS,EAAE,MAAM,CAAC;QAClB,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,SAAS,CAAC;QAChC,oBAAoB,EAAE,OAAO,CAAC;QAC9B,cAAc,EAAE,GAAG,CAAC;KACrB,CAAC;CACH;AAED,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;CAC3B;AA2FD,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,uBAAuB,GAAG,IAAI,CAoKvE"}

package/dist/create-pack-client.js

@@ -1,5 +1,6 @@
 import { PackClient } from "@pack/client";
 import { CacheCustom, createWithCache } from "@shopify/hydrogen";
+import { getTestInfo, getTestSession, setRequestAbTest, setTestHeaders, } from "./tests/test";
 /**
  * Create an SHA-256 hash as a hex string
  * @see https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/digest#converting_a_digest_to_a_hex_string
@@ -18,10 +19,12 @@ async function sha256(message) {
  * Hash query and its parameters for use as cache key.
  * NOTE: Oxygen deployment will break if the cache key is long or contains `\n`
  */
-function hashQuery(query, variables) {
+function hashQuery(query, variables, headers) {
     let hash = query;
     if (variables !== null)
         hash += JSON.stringify(variables);
+    if (headers !== null)
+        hash += JSON.stringify(headers);
     return sha256(hash);
 }
 // Extends the CacheLong strategy with a stale-if-error policy
@@ -70,16 +73,25 @@ function extractTopLevelField(query) {
     return "";
 }
 export function createPackClient(options) {
-    const { cache, waitUntil, preview, contentEnvironment, token, apiUrl, defaultThemeData, } = options;
+    const { cache, waitUntil, session, preview, contentEnvironment, storeId, token, apiUrl, defaultThemeData, } = options;
     const previewEnabled = !!preview?.session.get("enabled");
     const previewEnvironment = preview?.session.get("environment");
     const clientContentEnvironment = previewEnvironment || contentEnvironment;
+    let requestAbTest = null;
     if (!token && !defaultThemeData) {
         throw new Error("The Pack client token is missing or empty. Please provide a valid token or default theme data.");
     }
+    if (!storeId) {
+        throw new Error("The Pack Store ID is missing or empty. Please provide a valid Store ID.");
+    }
     if (!token) {
         return {
+            session,
             preview,
+            abTest: getTestSession(session, requestAbTest, previewEnabled),
+            setRequestAbTest: (request) => {
+                requestAbTest = setRequestAbTest(request);
+            },
             isPreviewModeEnabled: () => previewEnabled,
             async query(query, { variables } = {}) {
                 if (!defaultThemeData?.data) {
@@ -90,23 +102,63 @@ export function createPackClient(options) {
                 return { data: data, error: null };
             },
             isValidEditToken: () => new Promise(() => false),
+            getPackSessionData: () => {
+                return {
+                    storeId: storeId,
+                    sessionId: session.id,
+                    abTest: getTestSession(session, requestAbTest, previewEnabled),
+                    isPreviewModeEnabled: previewEnabled,
+                    customizerMeta: preview?.session.get("customizerMeta"),
+                };
+            },
         };
     }
     const packClient = new PackClient({
-        // Use live API URL if preview mode is enabled
-        apiUrl: previewEnabled ? "https://app.packdigital.com/graphql" : apiUrl,
+        // Use apiUrl, it is configured
+        // Use active API URL if preview mode is enabled
+        // Otherwise, Live PackClient uses its internal configuration
+        apiUrl: apiUrl
+            ? apiUrl
+            : previewEnabled
+                ? "https://app.packdigital.com/graphql"
+                : undefined,
+        storeId,
         token,
         contentEnvironment: clientContentEnvironment,
+        sessionId: session.id,
+    });
+    const getTestVariantPromise = getTestInfo({
+        packClient,
+        session,
     });
     return {
+        session,
         preview,
+        abTest: getTestSession(session, requestAbTest, previewEnabled),
+        setRequestAbTest: (request) => {
+            requestAbTest = setRequestAbTest(request);
+        },
         isPreviewModeEnabled: () => previewEnabled,
-        async query(query, { variables, cache: strategy = cacheCustom } = {}) {
-            const queryHash = await hashQuery(query, variables);
+        async query(query, { variables, cache: strategy = cacheCustom, test } = {}) {
             const withCache = createWithCache({
                 cache,
                 waitUntil,
             });
+            let headers = {};
+            headers = await setTestHeaders(headers, {
+                test: requestAbTest || test,
+                previewEnabled,
+                sessionTest: await (async () => {
+                    try {
+                        return await getTestVariantPromise;
+                    }
+                    catch (e) {
+                        console.error(e);
+                    }
+                    return undefined;
+                })(),
+            });
+            const queryHash = await hashQuery(query, variables, headers);
             const queryVariables = variables ? { ...variables } : {};
             if (previewEnabled) {
                 queryVariables.version = "CURRENT";
@@ -117,7 +169,10 @@ export function createPackClient(options) {
             // Preview mode always bypasses the cache
             if (previewEnabled) {
                 try {
-                    return await packClient.fetch(query, { variables: queryVariables });
+                    return await packClient.fetch(query, {
+                        variables: queryVariables,
+                        headers: headers,
+                    });
                 }
                 catch (error) {
                     return { error, data: {} };
@@ -125,7 +180,10 @@ export function createPackClient(options) {
             }
             return withCache(queryHash, strategy, async () => {
                 try {
-                    return await packClient.fetch(query, { variables: queryVariables });
+                    return await packClient.fetch(query, {
+                        variables: queryVariables,
+                        headers: headers,
+                    });
                 }
                 catch (error) {
                     return { error, data: {} };
@@ -133,5 +191,14 @@ export function createPackClient(options) {
             });
         },
         isValidEditToken: (token) => packClient.isValidEditToken(token),
+        getPackSessionData: () => {
+            return {
+                storeId: storeId,
+                sessionId: session.id,
+                abTest: getTestSession(session, requestAbTest, previewEnabled),
+                isPreviewModeEnabled: previewEnabled,
+                customizerMeta: preview?.session.get("customizerMeta"),
+            };
+        },
     };
 }

package/dist/handle-request.d.ts

@@ -0,0 +1,3 @@
+import { Pack } from "./create-pack-client";
+export declare function handleRequest(pack: Pack, request: Request, handleRequest: (request: Request) => Promise<Response>): Promise<Response>;
+//# sourceMappingURL=handle-request.d.ts.map

package/dist/handle-request.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"handle-request.d.ts","sourceRoot":"","sources":["../src/handle-request.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAI5C,wBAAsB,aAAa,CACjC,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,aAAa,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,OAAO,CAAC,QAAQ,CAAC,GACrD,OAAO,CAAC,QAAQ,CAAC,CAenB"}

package/dist/handle-request.js

@@ -0,0 +1,15 @@
+import { packlytics } from "@pack/packlytics";
+import { setRequestAbTest } from "./tests/test";
+export async function handleRequest(pack, request, handleRequest) {
+    setRequestAbTest(request);
+    const [response, _] = await Promise.all([
+        handleRequest(request),
+        packlytics(request, pack.session, {
+            storeFrontId: pack.getPackSessionData().storeId,
+            sessionSecret: pack.session.secret,
+        }),
+    ]);
+    response.headers.append("powered-by", "Shopify, Hydrogen + Pack Digital");
+    response.headers.append("Set-Cookie", await pack.session.commit());
+    return response;
+}

package/dist/index.d.ts

@@ -1,5 +1,8 @@
-import { Pack, createPackClient } from "./create-pack-client";
-import { PreviewSession } from "./preview/preview-session";
+import { handleRequest } from "./handle-request";
+import { usePackCookies } from "./session/usePackCookies";
+import { PackSession } from "./session/session";
+import { createPackClient } from "./create-pack-client";
 import { action as previewModeAction, loader as previewModeLoader } from "./preview/preview-mode";
-export { type Pack, createPackClient, PreviewSession, previewModeAction, previewModeLoader, };
+import { useAbTest, useAbTestHandle, useAbTestId, useAbTestSessionId, useAbTestVariantHandle, useAbTestVariantId } from "./tests/testHooks";
+export { PackSession, createPackClient, handleRequest, previewModeAction, previewModeLoader, usePackCookies, useAbTest, useAbTestId, useAbTestHandle, useAbTestSessionId, useAbTestVariantId, useAbTestVariantHandle, };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EACL,MAAM,IAAI,iBAAiB,EAC3B,MAAM,IAAI,iBAAiB,EAC5B,MAAM,wBAAwB,CAAC;AAEhC,OAAO,EACL,KAAK,IAAI,EACT,gBAAgB,EAChB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,GAClB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,EACL,MAAM,IAAI,iBAAiB,EAC3B,MAAM,IAAI,iBAAiB,EAC5B,MAAM,wBAAwB,CAAC;AAChC,OAAO,EACL,SAAS,EACT,eAAe,EACf,WAAW,EACX,kBAAkB,EAClB,sBAAsB,EACtB,kBAAkB,EACnB,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EACL,WAAW,EACX,gBAAgB,EAChB,aAAa,EACb,iBAAiB,EACjB,iBAAiB,EACjB,cAAc,EACd,SAAS,EACT,WAAW,EACX,eAAe,EACf,kBAAkB,EAClB,kBAAkB,EAClB,sBAAsB,GACvB,CAAC"}

package/dist/index.js

@@ -1,4 +1,7 @@
+import { handleRequest } from "./handle-request";
+import { usePackCookies } from "./session/usePackCookies";
+import { PackSession } from "./session/session";
 import { createPackClient } from "./create-pack-client";
-import { PreviewSession } from "./preview/preview-session";
 import { action as previewModeAction, loader as previewModeLoader, } from "./preview/preview-mode";
-export { createPackClient, PreviewSession, previewModeAction, previewModeLoader, };
+import { useAbTest, useAbTestHandle, useAbTestId, useAbTestSessionId, useAbTestVariantHandle, useAbTestVariantId, } from "./tests/testHooks";
+export { PackSession, createPackClient, handleRequest, previewModeAction, previewModeLoader, usePackCookies, useAbTest, useAbTestId, useAbTestHandle, useAbTestSessionId, useAbTestVariantId, useAbTestVariantHandle, };

package/dist/session/cookies-utils.d.ts

@@ -0,0 +1,13 @@
+export declare function hasUserConsent(request: Request): boolean;
+/**
+ * This will generate a random UUID
+ * This is not based on user data,
+ * This is based on a random number generator using crypto or math.random
+ *
+ * This UUID is used to generate a session ID for the session cookie
+ *
+ * We can never use this id to trace back users for GDPR compliance.
+ *
+ */
+export declare function buildRandomUUID(): string;
+//# sourceMappingURL=cookies-utils.d.ts.map

package/dist/session/cookies-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"cookies-utils.d.ts","sourceRoot":"","sources":["../../src/session/cookies-utils.tsx"],"names":[],"mappings":"AAMA,wBAAgB,cAAc,CAAC,OAAO,EAAE,OAAO,WAM9C;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,IAAI,MAAM,CA8BxC"}

package/dist/session/cookies-utils.js

@@ -0,0 +1,66 @@
+import { PACK_USER_CONSENT_COOKIE_ID } from "../constants";
+const cookie = require("cookie");
+const tokenHash = "xxxx-4xxx-xxxx-xxxxxxxxxxxx";
+export function hasUserConsent(request) {
+    const cookies = cookie.parse(request.headers.get("Cookie"));
+    return cookies[PACK_USER_CONSENT_COOKIE_ID]
+        ? cookies[PACK_USER_CONSENT_COOKIE_ID] === "true"
+        : true;
+}
+/**
+ * This will generate a random UUID
+ * This is not based on user data,
+ * This is based on a random number generator using crypto or math.random
+ *
+ * This UUID is used to generate a session ID for the session cookie
+ *
+ * We can never use this id to trace back users for GDPR compliance.
+ *
+ */
+export function buildRandomUUID() {
+    let hash = "";
+    try {
+        const crypto = window.crypto;
+        const randomValuesArray = new Uint16Array(31);
+        crypto.getRandomValues(randomValuesArray);
+        // Generate a strong UUID
+        let i = 0;
+        hash = tokenHash
+            .replace(/[x]/g, (c) => {
+            const r = randomValuesArray[i] % 16;
+            const v = c === "x" ? r : (r & 0x3) | 0x8;
+            i++;
+            return v.toString(16);
+        })
+            .toUpperCase();
+    }
+    catch (err) {
+        // crypto not available, generate weak UUID
+        hash = tokenHash
+            .replace(/[x]/g, (c) => {
+            const r = (Math.random() * 16) | 0;
+            const v = c === "x" ? r : (r & 0x3) | 0x8;
+            return v.toString(16);
+        })
+            .toUpperCase();
+    }
+    return `${hexTime()}-${hash}`;
+}
+function hexTime() {
+    // 32 bit representations of new Date().getTime() and performance.now()
+    let dateNumber = 0;
+    let perfNumber = 0;
+    // Result of zero-fill right shift is always positive
+    dateNumber = new Date().getTime() >>> 0;
+    try {
+        perfNumber = performance.now() >>> 0;
+    }
+    catch (err) {
+        perfNumber = 0;
+    }
+    const output = Math.abs(dateNumber + perfNumber)
+        .toString(16)
+        .toLowerCase();
+    // Ensure the output is exactly 8 characters
+    return output.padStart(8, "0");
+}

package/dist/session/session.d.ts

@@ -0,0 +1,14 @@
+import { type Session, type SessionStorage } from "@shopify/remix-oxygen";
+export declare class PackSession {
+    #private;
+    readonly id: string;
+    readonly secret: string;
+    constructor(id: string, secret: string, sessionStorage: SessionStorage, session: Session);
+    static init(request: Request, secrets: string[]): Promise<PackSession>;
+    has(key: string): boolean;
+    get(key: string): any;
+    destroy(): Promise<string>;
+    set(key: string, value: any): void;
+    commit(): Promise<string>;
+}
+//# sourceMappingURL=session.d.ts.map

package/dist/session/session.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"session.d.ts","sourceRoot":"","sources":["../../src/session/session.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,OAAO,EACZ,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAC;AAI/B,qBAAa,WAAW;;IACtB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IAEpB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;gBAOtB,EAAE,EAAE,MAAM,EACV,MAAM,EAAE,MAAM,EACd,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO;WAQL,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,WAAW,CAAC;IAsB5E,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAIzB,GAAG,CAAC,GAAG,EAAE,MAAM;IAIf,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC;IAI1B,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAIlC,MAAM,IAAI,OAAO,CAAC,MAAM,CAAC;CAG1B"}

package/dist/session/session.js

@@ -0,0 +1,47 @@
+import { createCookie, createCookieSessionStorage, } from "@shopify/remix-oxygen";
+import { PACK_COOKIE_ID, PACK_COOKIE_MAX_AGE } from "../constants";
+import { buildRandomUUID, hasUserConsent } from "./cookies-utils";
+export class PackSession {
+    id;
+    secret;
+    #session;
+    #sessionStorage;
+    constructor(id, secret, sessionStorage, session) {
+        this.id = id;
+        this.secret = secret;
+        this.#session = session;
+        this.#sessionStorage = sessionStorage;
+    }
+    static async init(request, secrets) {
+        const storage = createCookieSessionStorage({
+            cookie: createCookie(PACK_COOKIE_ID, {
+                secure: true,
+                secrets,
+                sameSite: "none",
+                maxAge: PACK_COOKIE_MAX_AGE,
+            }),
+        });
+        const session = await storage.getSession(request.headers.get("Cookie"));
+        let sessionId = session.get("session_id");
+        if (!sessionId || !hasUserConsent(request)) {
+            sessionId = buildRandomUUID();
+            session.set("session_id", sessionId);
+        }
+        return new this(sessionId, secrets[0], storage, session);
+    }
+    has(key) {
+        return this.#session.has(key);
+    }
+    get(key) {
+        return this.#session.get(key);
+    }
+    destroy() {
+        return this.#sessionStorage.destroySession(this.#session);
+    }
+    set(key, value) {
+        this.#session.set(key, value);
+    }
+    commit() {
+        return this.#sessionStorage.commitSession(this.#session);
+    }
+}

package/dist/session/usePackCookies.d.ts

@@ -0,0 +1,15 @@
+type UsePackCookiesOptions = {
+    /**
+     * If set to `false`, Shopify cookies will be removed.
+     * If set to `true`, Shopify unique user token cookie will have cookie expiry of 1 year.
+     * Defaults to false.
+     **/
+    hasUserConsent?: boolean;
+    /**
+     * The domain scope of the cookie. Defaults to empty string.
+     **/
+    domain?: string;
+};
+export declare function usePackCookies(options?: UsePackCookiesOptions): void;
+export {};
+//# sourceMappingURL=usePackCookies.d.ts.map

package/dist/session/usePackCookies.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePackCookies.d.ts","sourceRoot":"","sources":["../../src/session/usePackCookies.ts"],"names":[],"mappings":"AAIA,KAAK,qBAAqB,GAAG;IAC3B;;;;QAII;IACJ,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;QAEI;IACJ,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,wBAAgB,cAAc,CAAC,OAAO,CAAC,EAAE,qBAAqB,GAAG,IAAI,CAWpE"}

package/dist/session/usePackCookies.js

@@ -0,0 +1,17 @@
+import { useEffect } from "react";
+import { stringify } from "worktop/cookie";
+import { PACK_COOKIE_MAX_AGE, PACK_USER_CONSENT_COOKIE_ID } from "../constants";
+export function usePackCookies(options) {
+    const { hasUserConsent = true, domain = "" } = options || {};
+    useEffect(() => {
+        setCookie(PACK_USER_CONSENT_COOKIE_ID, hasUserConsent ? "true" : "false", PACK_COOKIE_MAX_AGE, domain);
+    }, [hasUserConsent]);
+}
+function setCookie(name, value, maxage, domain) {
+    document.cookie = stringify(name, value, {
+        maxage,
+        domain,
+        samesite: "Lax",
+        path: "/",
+    });
+}

package/dist/tests/test.d.ts

@@ -0,0 +1,33 @@
+import { PackClient } from "@pack/client";
+import { PackSession } from "../session/session";
+export interface TestInput {
+    testId?: string;
+    testHandle?: string;
+    testVariantId?: string;
+    testVariantHandle?: string;
+}
+export interface Test {
+    id: string;
+    handle: string;
+    TestVariant: {
+        id: string;
+        handle: string;
+    };
+}
+export declare function getTestInfo({ packClient, session, }: {
+    packClient: PackClient;
+    session: PackSession | undefined;
+}): Promise<Test | undefined>;
+export declare function getTestSession(session: PackSession | undefined, requestAbTest: TestInput | null, previewEnabled: boolean): Test | null | undefined;
+export declare function setRequestAbTest(request: Request): {
+    testId: string;
+    testHandle: string;
+    testVariantId: string;
+    testVariantHandle: string;
+} | null;
+export declare function setTestHeaders(headers: any, options: {
+    test: TestInput | null | undefined;
+    previewEnabled: boolean;
+    sessionTest: Test | undefined;
+}): any;
+//# sourceMappingURL=test.d.ts.map

package/dist/tests/test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test.d.ts","sourceRoot":"","sources":["../../src/tests/test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAEjD,MAAM,WAAW,SAAS;IACxB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,IAAI;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE;QACX,EAAE,EAAE,MAAM,CAAC;QACX,MAAM,EAAE,MAAM,CAAC;KAChB,CAAC;CACH;AAeD,wBAAsB,WAAW,CAAC,EAChC,UAAU,EACV,OAAO,GACR,EAAE;IACD,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,EAAE,WAAW,GAAG,SAAS,CAAC;CAClC,GAAG,OAAO,CAAC,IAAI,GAAG,SAAS,CAAC,CA2C5B;AAED,wBAAgB,cAAc,CAC5B,OAAO,EAAE,WAAW,GAAG,SAAS,EAChC,aAAa,EAAE,SAAS,GAAG,IAAI,EAC/B,cAAc,EAAE,OAAO,GACtB,IAAI,GAAG,IAAI,GAAG,SAAS,CA8BzB;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,OAAO;;;;;SAmBhD;AAED,wBAAgB,cAAc,CAC5B,OAAO,EAAE,GAAG,EACZ,OAAO,EAAE;IACP,IAAI,EAAE,SAAS,GAAG,IAAI,GAAG,SAAS,CAAC;IACnC,cAAc,EAAE,OAAO,CAAC;IACxB,WAAW,EAAE,IAAI,GAAG,SAAS,CAAC;CAC/B,OA8BF"}

package/dist/tests/test.js

@@ -0,0 +1,112 @@
+const QUERY_TEST = `#graphql
+query TestCurrent {
+    testCurrent {
+        id
+        handle
+        TestVariant {
+            id
+            handle
+        }
+    }
+}
+`;
+export async function getTestInfo({ packClient, session, }) {
+    if (!session) {
+        return undefined;
+    }
+    const testSession = session.get("test");
+    let test = testSession?.data || undefined;
+    if (!testSession ||
+        (testSession && new Date(testSession.expire_at) < new Date())) {
+        // Request directly to API if it is using CDN to reduce latency
+        let usingCdn = false;
+        if (packClient.apiUrl == "https://apicdn.packdigital.com/graphql") {
+            packClient.apiUrl = "https://api.packdigital.com/graphql";
+            usingCdn = true;
+        }
+        const packClientFetch = packClient.fetch(QUERY_TEST, {});
+        if (usingCdn) {
+            // Return to CDN
+            packClient.apiUrl = "https://apicdn.packdigital.com/graphql";
+        }
+        const resp = await packClientFetch;
+        test = resp.data?.testCurrent;
+        // Expire on 24 hours the test cache
+        const expire_at = new Date();
+        expire_at.setHours(expire_at.getHours() + 24);
+        session.set("test", {
+            data: test || null,
+            expire_at: expire_at,
+        });
+    }
+    return test;
+}
+export function getTestSession(session, requestAbTest, previewEnabled) {
+    if (!session) {
+        return undefined;
+    }
+    if (requestAbTest) {
+        return {
+            id: requestAbTest.testId || "",
+            handle: requestAbTest.testHandle || "",
+            TestVariant: {
+                id: requestAbTest.testVariantId || "",
+                handle: requestAbTest.testVariantHandle || "",
+            },
+        };
+    }
+    if (previewEnabled) {
+        return {
+            id: "",
+            handle: "isPreview",
+            TestVariant: {
+                id: "",
+                handle: "isPreview",
+            },
+        };
+    }
+    const testSession = session.get("test");
+    return testSession?.data || null;
+}
+export function setRequestAbTest(request) {
+    const requestUrl = new URL(request.url);
+    const params = requestUrl.searchParams;
+    if (params.has("test_id") ||
+        params.has("test_handle") ||
+        params.has("test_variant_id") ||
+        params.has("test_variant_handle")) {
+        return {
+            testId: params.get("test_id") || "",
+            testHandle: params.get("test_handle") || "",
+            testVariantId: params.get("test_variant_id") || "",
+            testVariantHandle: params.get("test_variant_handle") || "",
+        };
+    }
+    return null;
+}
+export function setTestHeaders(headers, options) {
+    const { test, previewEnabled, sessionTest } = options;
+    if (test) {
+        if (test.testId) {
+            headers["X-Test-Id"] = test.testId;
+        }
+        if (test.testHandle) {
+            headers["X-Test-Handle"] = test.testHandle;
+        }
+        if (test.testVariantId) {
+            headers["X-Test-Variant-Id"] = test.testVariantId;
+        }
+        if (test.testVariantHandle) {
+            headers["X-Test-Variant-Handle"] = test.testVariantHandle;
+        }
+    }
+    else {
+        if (!previewEnabled && sessionTest) {
+            headers = {
+                "X-Test-Id": sessionTest?.id,
+                "X-Test-Variant-Id": sessionTest?.TestVariant?.id,
+            };
+        }
+    }
+    return headers;
+}

package/dist/tests/testHooks.d.ts

@@ -0,0 +1,8 @@
+import { Test } from "./test";
+export declare function useAbTest(): Test | null;
+export declare function useAbTestSessionId(): string;
+export declare function useAbTestId(): string | undefined;
+export declare function useAbTestHandle(): string | undefined;
+export declare function useAbTestVariantId(): string | undefined;
+export declare function useAbTestVariantHandle(): string | undefined;
+//# sourceMappingURL=testHooks.d.ts.map

package/dist/tests/testHooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"testHooks.d.ts","sourceRoot":"","sources":["../../src/tests/testHooks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAG9B,wBAAgB,SAAS,IAAI,IAAI,GAAG,IAAI,CAWvC;AAED,wBAAgB,kBAAkB,IAAI,MAAM,CAW3C;AAED,wBAAgB,WAAW,IAAI,MAAM,GAAG,SAAS,CAIhD;AAED,wBAAgB,eAAe,IAAI,MAAM,GAAG,SAAS,CAIpD;AAED,wBAAgB,kBAAkB,IAAI,MAAM,GAAG,SAAS,CAIvD;AAED,wBAAgB,sBAAsB,IAAI,MAAM,GAAG,SAAS,CAI3D"}

package/dist/tests/testHooks.js

@@ -0,0 +1,33 @@
+import { useRouteLoaderData } from "@remix-run/react";
+export function useAbTest() {
+    // @ts-ignore
+    const { abTest: test } = useRouteLoaderData("root");
+    if (test === undefined) {
+        throw new Error("No A/B test found, are you sure you have call ...pack.getPackSessionData() on root loader return?");
+    }
+    return test;
+}
+export function useAbTestSessionId() {
+    // @ts-ignore
+    const { sessionId } = useRouteLoaderData("root");
+    if (!sessionId) {
+        throw new Error("No Session ID found, are you sure you have call ...pack.getPackSessionData() on root loader return?");
+    }
+    return sessionId;
+}
+export function useAbTestId() {
+    const test = useAbTest();
+    return test?.id;
+}
+export function useAbTestHandle() {
+    const test = useAbTest();
+    return test?.handle;
+}
+export function useAbTestVariantId() {
+    const test = useAbTest();
+    return test?.TestVariant?.id;
+}
+export function useAbTestVariantHandle() {
+    const test = useAbTest();
+    return test?.TestVariant?.handle;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pack/hydrogen",
   "description": "Pack Hydrogen",
-  "version": "0.1.2",
+  "version": "0.1.3-ab-beta.2.0",
   "exports": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "engines": {
@@ -22,13 +22,15 @@
     "dist"
   ],
   "dependencies": {
-    "@pack/client": "^0.0.7",
+    "@pack/client": "^0.0.8-ab-beta.2.0",
+    "@pack/packlytics": "^0.0.1-ab-beta.2.0",
     "@shopify/hydrogen": "^2023.10.2"
   },
   "devDependencies": {
     "@remix-run/server-runtime": "^2.0.0",
     "@shopify/oxygen-workers-types": "^4.0.0",
-    "@shopify/remix-oxygen": "^2.0.1"
+    "@shopify/remix-oxygen": "^2.0.1",
+    "@types/node": "^20.11.17"
   },
   "peerDependencies": {
     "react": "^18.0.0"

package/dist/preview/preview-session.d.ts

@@ -1,12 +0,0 @@
-import { type Session, type SessionStorage } from '@shopify/remix-oxygen';
-export declare class PreviewSession {
-    #private;
-    constructor(sessionStorage: SessionStorage, session: Session);
-    static init(request: Request, secrets: string[]): Promise<PreviewSession>;
-    has(key: string): boolean;
-    get(key: string): any;
-    destroy(): Promise<string>;
-    set(key: string, value: any): void;
-    commit(): Promise<string>;
-}
-//# sourceMappingURL=preview-session.d.ts.map

package/dist/preview/preview-session.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"preview-session.d.ts","sourceRoot":"","sources":["../../src/preview/preview-session.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,KAAK,OAAO,EACZ,KAAK,cAAc,EACpB,MAAM,uBAAuB,CAAA;AAE9B,qBAAa,cAAc;;gBAIb,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO;WAK/C,IAAI,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,cAAc,CAAC;IAe/E,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAIzB,GAAG,CAAC,GAAG,EAAE,MAAM;IAIf,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC;IAI1B,GAAG,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAIlC,MAAM,IAAI,OAAO,CAAC,MAAM,CAAC;CAG1B"}

package/dist/preview/preview-session.js

@@ -1,36 +0,0 @@
-import { createCookieSessionStorage, } from '@shopify/remix-oxygen';
-export class PreviewSession {
-    #sessionStorage;
-    #session;
-    constructor(sessionStorage, session) {
-        this.#sessionStorage = sessionStorage;
-        this.#session = session;
-    }
-    static async init(request, secrets) {
-        const storage = createCookieSessionStorage({
-            cookie: {
-                name: '__preview',
-                sameSite: 'none',
-                secure: true,
-                secrets,
-            },
-        });
-        const session = await storage.getSession(request.headers.get('Cookie'));
-        return new this(storage, session);
-    }
-    has(key) {
-        return this.#session.has(key);
-    }
-    get(key) {
-        return this.#session.get(key);
-    }
-    destroy() {
-        return this.#sessionStorage.destroySession(this.#session);
-    }
-    set(key, value) {
-        this.#session.set(key, value);
-    }
-    commit() {
-        return this.#sessionStorage.commitSession(this.#session);
-    }
-}