@amplifyup/sdk 0.1.32 → 0.1.34

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
@@ -323,12 +348,17 @@ function resolveAmplifyUpUrls(target) {
 
 // src/preview.ts
 function isPreviewRequest(searchParams) {
+  return paramIsTrue(searchParams, "preview") || paramIsTrue(searchParams, "visualEditor");
+}
+function isWorkingContentRequest(searchParams) {
+  return paramIsTrue(searchParams, "working");
+}
+function paramIsTrue(searchParams, key) {
   if (searchParams instanceof URLSearchParams) {
-    return searchParams.get("preview") === "true" || searchParams.get("visualEditor") === "true";
+    return searchParams.get(key) === "true";
   }
-  const preview = searchParams.preview;
-  const visualEditor = searchParams.visualEditor;
-  return preview === "true" || visualEditor === "true";
+  const value = searchParams[key];
+  return value === "true" || Array.isArray(value) && value[0] === "true";
 }
 function isComposerPreview() {
   if (typeof window === "undefined") return false;
@@ -368,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) {
@@ -385,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(
@@ -479,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);
@@ -1464,6 +1520,9 @@ Available Console Commands:
     });
     if (preview) {
       params.set("preview", "true");
+      if (typeof window !== "undefined" && isWorkingContentRequest(new URLSearchParams(window.location.search))) {
+        params.set("working", "true");
+      }
     }
     if (isOnOrchestratorOrigin) {
       return `/api/layout/provider?${params.toString()}`;
@@ -3766,6 +3825,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,
@@ -3779,9 +3853,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) {
@@ -3820,18 +3903,21 @@ function AmplifyPageContent({
 }
 
 // src/server.tsx
+var AMPLIFY_DEFAULT_REVALIDATE = 60;
 async function fetchPageConfigServer(route, trackingId, preview = false, options) {
   const target = resolveAmplifyUpTarget({
     configTarget: options?.target
   });
   const { orchestratorUrl, edgeUrl } = resolveAmplifyUpUrls(target);
   const previewFlag = preview || (options?.searchParams ? isPreviewRequest(options.searchParams) : false);
+  const workingFlag = options?.searchParams ? isWorkingContentRequest(options.searchParams) : false;
   const fetchOrchestratorPage = async (pageRoute, isPreview) => {
     const params = new URLSearchParams({
       route: pageRoute,
       trackingId
     });
     if (isPreview) params.set("preview", "true");
+    if (workingFlag) params.set("working", "true");
     const url = `${orchestratorUrl}/api/layout/provider?${params.toString()}`;
     try {
       const res = await fetch(url, {
@@ -3853,7 +3939,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;
 }
@@ -3943,10 +4031,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);
@@ -3955,6 +4042,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,6 +4069,7 @@ function AmplifyUpProvider({ children, config }) {
           edgeUrl,
           fetchOrchestratorPage: (route, isPreview) => sdk.fetchPageConfig(route, isPreview)
         });
+        if (cancelled) return;
         setSource(result.source);
         setMeta(result.meta);
         setError(result.error);
@@ -3988,16 +4085,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,
     {
@@ -4014,6 +4115,6 @@ function useAmplifyUp() {
   return context;
 }
 
-export { AmplifyPageContent, AmplifyRenderer, AmplifyUpProvider, ComponentContextProvider, Field, Image, RichText, Slot, fetchPageConfigServer, isComposerPreview, isPreviewRequest, useAmplifyUp, useComponentProps, useLiveComposerProps };
+export { AmplifyPageContent, AmplifyRenderer, AmplifyUpProvider, ComponentContextProvider, Field, Image, RichText, Slot, fetchPageConfigServer, isComposerPreview, isPreviewRequest, isWorkingContentRequest, useAmplifyUp, useComponentProps, useLiveComposerProps };
 //# sourceMappingURL=react.mjs.map
 //# sourceMappingURL=react.mjs.map