@amplifyup/sdk 0.1.33 → 0.1.35

package/dist/react.mjs

@@ -206,6 +206,7 @@ var AWSAdapter = class {
 // src/storage.ts
 var INSTANCE_ID_KEY = "amplifyup_instance_id";
 var USER_ID_KEY = "amplifyup_user_id";
+var ANON_COOKIE_NAME = "amplifyup_anon_id";
 function generateGuid() {
   if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
     return crypto.randomUUID();
@@ -216,16 +217,39 @@ function generateGuid() {
     return v.toString(16);
   });
 }
+function readCookie(name) {
+  if (typeof document === "undefined") return null;
+  const parts = document.cookie.split(";");
+  for (const part of parts) {
+    const idx = part.indexOf("=");
+    if (idx === -1) continue;
+    if (part.slice(0, idx).trim() !== name) continue;
+    const value = part.slice(idx + 1).trim();
+    try {
+      return value ? decodeURIComponent(value) : null;
+    } catch {
+      return value || null;
+    }
+  }
+  return null;
+}
+function writeCookie(name, value) {
+  if (typeof document === "undefined") return;
+  document.cookie = `${name}=${encodeURIComponent(value)}; Path=/; Max-Age=31536000; SameSite=Lax`;
+}
 function getInstanceId() {
   if (typeof window === "undefined") {
     return "";
   }
-  const stored = localStorage.getItem(INSTANCE_ID_KEY);
-  if (stored) {
-    return stored;
+  const fromCookie = readCookie(ANON_COOKIE_NAME);
+  const fromLs = localStorage.getItem(INSTANCE_ID_KEY);
+  const instanceId = fromLs || fromCookie || `browser_${generateGuid()}`;
+  if (fromLs !== instanceId) {
+    localStorage.setItem(INSTANCE_ID_KEY, instanceId);
+  }
+  if (fromCookie !== instanceId) {
+    writeCookie(ANON_COOKIE_NAME, instanceId);
   }
-  const instanceId = `browser_${generateGuid()}`;
-  localStorage.setItem(INSTANCE_ID_KEY, instanceId);
   return instanceId;
 }
 function getUserId() {
@@ -246,6 +270,7 @@ function clearIds() {
   }
   localStorage.removeItem(INSTANCE_ID_KEY);
   localStorage.removeItem(USER_ID_KEY);
+  document.cookie = `${ANON_COOKIE_NAME}=; Path=/; Max-Age=0; SameSite=Lax`;
 }
 
 // src/targets.ts
@@ -373,6 +398,19 @@ function normalizeRoute(route) {
   return path || "/";
 }
 
+// src/edge/variantKeys.ts
+function serializeVariantKeys(keys) {
+  if (!keys) return "";
+  const parts = [];
+  const zoneIds = Object.keys(keys).sort();
+  for (const zoneId of zoneIds) {
+    const variant = keys[zoneId];
+    if (!variant || variant === "default") continue;
+    parts.push(`${zoneId}:${variant}`);
+  }
+  return parts.join(",");
+}
+
 // src/edge/resolve.ts
 var EdgeResolveError = class extends Error {
   constructor(message, status, body) {
@@ -390,12 +428,23 @@ async function fetchEdgeResolve(options) {
     trackingId: options.trackingId
   });
   if (options.siteId) params.set("site", options.siteId);
-  if (options.anonId) params.set("anonId", options.anonId);
+  const variantParam = serializeVariantKeys(options.variantKeys);
+  if (variantParam) {
+    params.set("variants", variantParam);
+  } else if (options.anonId) {
+    params.set("anonId", options.anonId);
+  }
   const fetchFn = options.fetch ?? globalThis.fetch.bind(globalThis);
-  const res = await fetchFn(`${base}/v1/resolve?${params.toString()}`, {
+  const init = {
     method: "GET",
     headers: { Accept: "application/json" }
-  });
+  };
+  if (options.revalidate !== void 0) {
+    init.next = { revalidate: options.revalidate };
+  } else {
+    init.cache = "no-store";
+  }
+  const res = await fetchFn(`${base}/v1/resolve?${params.toString()}`, init);
   const body = await res.json().catch(() => ({}));
   if (!res.ok) {
     throw new EdgeResolveError(
@@ -484,9 +533,11 @@ async function fetchContent(options) {
       edgeUrl: options.edgeUrl,
       trackingId: options.trackingId,
       route: options.route,
-      anonId: options.anonId,
+      anonId: options.variantKeys ? void 0 : options.anonId,
       siteId: options.siteId,
-      fetch: options.fetchFn
+      fetch: options.fetchFn,
+      revalidate: options.revalidate,
+      variantKeys: options.variantKeys
     });
     const pageConfig = mapResolvedToPageConfig(payload);
     const degraded = collectDegraded(payload);
@@ -524,6 +575,145 @@ async function fetchContent(options) {
   }
 }
 
+// src/edge/select.ts
+var SelectVariantsError = class extends Error {
+  constructor(message, status, body) {
+    super(message);
+    this.name = "SelectVariantsError";
+    this.status = status;
+    this.body = body;
+  }
+};
+async function fetchEdgeSelect(options) {
+  const base = options.edgeUrl.replace(/\/+$/, "");
+  const fetchFn = options.fetch ?? globalThis.fetch.bind(globalThis);
+  if (!options.trackingId && !options.site) {
+    throw new SelectVariantsError("trackingId or site is required", 400);
+  }
+  const res = await fetchFn(`${base}/v1/select`, {
+    method: "POST",
+    headers: {
+      Accept: "application/json",
+      "Content-Type": "application/json"
+    },
+    cache: "no-store",
+    signal: options.signal,
+    body: JSON.stringify({
+      view: normalizeRoute(options.view),
+      ...options.trackingId ? { trackingId: options.trackingId } : {},
+      ...options.site ? { site: options.site } : {},
+      anonId: options.anonId,
+      ...options.zones?.length ? { zones: options.zones } : {},
+      ...options.context ? { context: options.context } : {}
+    })
+  });
+  const body = await res.json().catch(() => ({}));
+  if (!res.ok) {
+    throw new SelectVariantsError(
+      body.error || `Select failed (${res.status})`,
+      res.status,
+      body
+    );
+  }
+  return {
+    siteId: String(body.siteId || ""),
+    view: String(body.view || normalizeRoute(options.view)),
+    variantKeys: body.variantKeys && typeof body.variantKeys === "object" ? body.variantKeys : {},
+    meta: body.meta
+  };
+}
+async function selectVariants(options) {
+  const target = resolveAmplifyUpTarget({ configTarget: options.target });
+  const { edgeUrl } = resolveAmplifyUpUrls(target);
+  return fetchEdgeSelect({
+    edgeUrl: options.edgeUrl || edgeUrl,
+    trackingId: options.trackingId,
+    site: options.site,
+    view: options.view,
+    anonId: options.anonId,
+    zones: options.zones,
+    context: options.context,
+    fetch: options.fetch,
+    signal: options.signal
+  });
+}
+
+// src/edge/query.ts
+var QueryContentError = class extends Error {
+  constructor(message, status, body) {
+    super(message);
+    this.name = "QueryContentError";
+    this.status = status;
+    this.body = body;
+  }
+};
+async function fetchEdgeQuery(options) {
+  const base = options.edgeUrl.replace(/\/+$/, "");
+  const fetchFn = options.fetch ?? globalThis.fetch.bind(globalThis);
+  const limit = Math.max(1, Number(options.spec.limit) || 10);
+  const offset = Math.max(0, Number(options.spec.offset) || 0);
+  const res = await fetchFn(`${base}/v1/query`, {
+    method: "POST",
+    headers: {
+      Accept: "application/json",
+      "Content-Type": "application/json"
+    },
+    cache: "no-store",
+    signal: options.signal,
+    body: JSON.stringify({
+      route: normalizeRoute(options.route),
+      trackingId: options.trackingId,
+      ...options.siteId ? { site: options.siteId } : {},
+      spec: { ...options.spec, limit, offset }
+    })
+  });
+  const body = await res.json().catch(() => ({}));
+  if (!res.ok) {
+    throw new QueryContentError(
+      body.error || `Content query failed (${res.status})`,
+      res.status,
+      body
+    );
+  }
+  const results = Array.isArray(body.results) ? body.results : [];
+  const resolvedLimit = Number(body.limit) || limit;
+  const resolvedOffset = Number.isFinite(Number(body.offset)) ? Number(body.offset) : offset;
+  return {
+    results,
+    count: Number(body.count) || results.length,
+    hasMore: !!body.hasMore,
+    limit: resolvedLimit,
+    offset: resolvedOffset,
+    nextOffset: Number(body.nextOffset) || resolvedOffset + resolvedLimit,
+    degraded: body.degraded
+  };
+}
+async function queryContent(options) {
+  const target = resolveAmplifyUpTarget({ configTarget: options.target });
+  const { edgeUrl } = resolveAmplifyUpUrls(target);
+  return fetchEdgeQuery({
+    edgeUrl,
+    trackingId: options.trackingId,
+    route: options.route,
+    spec: options.spec,
+    siteId: options.siteId,
+    fetch: options.fetch,
+    signal: options.signal
+  });
+}
+function nextPageSpec(pagination) {
+  return { ...pagination.spec, offset: pagination.nextOffset };
+}
+function searchSpec(pagination, field, term) {
+  const value = String(term || "").trim();
+  const base = { ...pagination.spec, offset: 0 };
+  if (!value) return base;
+  return {
+    ...base,
+    filter: [...base.filter || [], { field, op: "contains", value }]
+  };
+}
+
 // src/index.ts
 var SESSION_IDLE_GAP_MS = 30 * 60 * 1e3;
 var DWELL_ACTIVITY_IDLE_MS = 2 * 60 * 1e3;
@@ -3774,6 +3964,21 @@ function defaultPreviewCanvas() {
 function hasAmplifyLayout(pageConfig) {
   return !!(pageConfig && pageConfig.id !== "default" && Array.isArray(pageConfig.layoutTree) && pageConfig.layoutTree.length > 0);
 }
+function normalizeRoutePath(route) {
+  if (!route) return "";
+  const path = route.split("?")[0] || "/";
+  if (path.length > 1 && path.endsWith("/")) return path.replace(/\/+$/, "");
+  return path || "/";
+}
+function samePageRoute(a, b) {
+  const ar = normalizeRoutePath(a?.route);
+  const br = normalizeRoutePath(b?.route);
+  return !!ar && !!br && ar === br;
+}
+function layoutTreesEqual(a, b) {
+  if (!a || !b) return a === b;
+  return JSON.stringify(a.layoutTree) === JSON.stringify(b.layoutTree);
+}
 function AmplifyPageContent({
   fallback,
   renderComponent,
@@ -3787,9 +3992,18 @@ function AmplifyPageContent({
 }) {
   const client = useAmplifyUp();
   const preview = forceComposerPreview || isComposerPreview();
-  const pageConfig = pageConfigProp ?? client.pageConfig;
-  const loading = pageConfigProp ? false : client.loading;
-  const error = pageConfigProp ? null : client.error;
+  const clientLayout = hasAmplifyLayout(client.pageConfig) ? client.pageConfig : null;
+  const serverLayout = hasAmplifyLayout(pageConfigProp) ? pageConfigProp : null;
+  let pageConfig = serverLayout ?? clientLayout;
+  if (preview && clientLayout) {
+    pageConfig = clientLayout;
+  } else if (clientLayout && serverLayout && samePageRoute(clientLayout, serverLayout) && !layoutTreesEqual(clientLayout, serverLayout)) {
+    pageConfig = clientLayout;
+  } else if (clientLayout && !serverLayout) {
+    pageConfig = clientLayout;
+  }
+  const loading = !hasAmplifyLayout(pageConfig) && client.loading;
+  const error = hasAmplifyLayout(pageConfig) ? null : pageConfigProp ? null : client.error;
   const previewCanvas = previewEmptyComponent ?? defaultPreviewCanvas();
   const previewLoading = previewLoadingComponent ?? previewCanvas;
   if (preview) {
@@ -3828,6 +4042,7 @@ function AmplifyPageContent({
 }
 
 // src/server.tsx
+var AMPLIFY_DEFAULT_REVALIDATE = 60;
 async function fetchPageConfigServer(route, trackingId, preview = false, options) {
   const target = resolveAmplifyUpTarget({
     configTarget: options?.target
@@ -3863,7 +4078,9 @@ async function fetchPageConfigServer(route, trackingId, preview = false, options
     preview: previewFlag,
     orchestratorUrl,
     edgeUrl,
-    fetchOrchestratorPage
+    fetchOrchestratorPage,
+    revalidate: previewFlag ? void 0 : options?.revalidate ?? AMPLIFY_DEFAULT_REVALIDATE,
+    variantKeys: previewFlag ? void 0 : options?.variantKeys
   });
   return result.pageConfig;
 }
@@ -3953,10 +4170,9 @@ function AmplifyUpProvider({ children, config }) {
   }, [config.trackingId, config.target, config.debug, config.dev, config.siteId]);
   useEffect(() => {
     if (!initialized) return;
+    let cancelled = false;
     const load = async () => {
       try {
-        setLoading(true);
-        setError(null);
         const actualRoute = getActualRoute();
         if (!actualRoute) {
           setLoading(false);
@@ -3965,6 +4181,15 @@ function AmplifyUpProvider({ children, config }) {
         const sdk = getSDK();
         sdk.routeChange(actualRoute);
         const preview = isComposerPreview();
+        const overlay = preview || config.clientPersonalization !== false;
+        if (!overlay) {
+          setPageConfig(null);
+          setLoading(false);
+          return;
+        }
+        setPageConfig(null);
+        setError(null);
+        setLoading(false);
         const edgeUrl = sdk.getEdgeUrl();
         const orchestratorUrl = sdk.getOrchestratorUrl();
         const trackingId = sdk.getTrackingId();
@@ -3973,16 +4198,34 @@ function AmplifyUpProvider({ children, config }) {
           setLoading(false);
           return;
         }
+        let variantKeys;
+        const anonId = sdk.getInstanceId();
+        if (!preview && anonId) {
+          try {
+            const selected = await selectVariants({
+              trackingId,
+              view: actualRoute,
+              anonId,
+              site: sdk.getSiteId() || void 0,
+              edgeUrl
+            });
+            variantKeys = selected.variantKeys;
+          } catch (err) {
+            console.error("AmplifyUp selectVariants failed; overlay will use visitor id", err);
+          }
+        }
         const result = await fetchContent({
           route: actualRoute,
           trackingId,
-          anonId: sdk.getInstanceId(),
+          anonId: variantKeys ? void 0 : anonId,
           siteId: sdk.getSiteId() || null,
           preview,
           orchestratorUrl,
           edgeUrl,
+          variantKeys,
           fetchOrchestratorPage: (route, isPreview) => sdk.fetchPageConfig(route, isPreview)
         });
+        if (cancelled) return;
         setSource(result.source);
         setMeta(result.meta);
         setError(result.error);
@@ -3998,16 +4241,20 @@ function AmplifyUpProvider({ children, config }) {
           setPageConfig(result.pageConfig);
         }
       } catch (err) {
+        if (cancelled) return;
         console.error("Error fetching page config:", err);
         setError(err instanceof Error ? err.message : "Unknown error");
         setSource(null);
         setMeta(null);
       } finally {
-        setLoading(false);
+        if (!cancelled) setLoading(false);
       }
     };
     void load();
-  }, [pathname, initialized]);
+    return () => {
+      cancelled = true;
+    };
+  }, [pathname, initialized, config.clientPersonalization]);
   return /* @__PURE__ */ jsx(
     AmplifyUpContext.Provider,
     {
@@ -4024,6 +4271,6 @@ function useAmplifyUp() {
   return context;
 }
 
-export { AmplifyPageContent, AmplifyRenderer, AmplifyUpProvider, ComponentContextProvider, Field, Image, RichText, Slot, fetchPageConfigServer, isComposerPreview, isPreviewRequest, isWorkingContentRequest, useAmplifyUp, useComponentProps, useLiveComposerProps };
+export { AmplifyPageContent, AmplifyRenderer, AmplifyUpProvider, ComponentContextProvider, Field, Image, QueryContentError, RichText, SelectVariantsError, Slot, fetchPageConfigServer, isComposerPreview, isPreviewRequest, isWorkingContentRequest, nextPageSpec, queryContent, searchSpec, selectVariants, useAmplifyUp, useComponentProps, useLiveComposerProps };
 //# sourceMappingURL=react.mjs.map
 //# sourceMappingURL=react.mjs.map