@preprio/toolkit 0.1.0-beta.3 → 0.1.0-beta.5

package/dist/nextjs/components.cjs

@@ -48,16 +48,34 @@ function getCookie(name) {
 }
 function setCookie(name, value, options = {}) {
   if (typeof document === "undefined") return;
-  const { maxAge, path = "/" } = options;
+  const { maxAge, path = "/", sameSite, secure } = options;
   let cookie = `${name}=${encodeURIComponent(value)};path=${path}`;
   if (typeof maxAge === "number") {
     cookie += `;max-age=${maxAge}`;
   }
+  if (sameSite) {
+    cookie += `;samesite=${sameSite}`;
+  }
+  if (secure) {
+    cookie += ";secure";
+  }
   document.cookie = cookie;
 }
-function removeCookie(name, path = "/") {
+function removeCookie(name, path = "/", options = {}) {
   if (typeof document === "undefined") return;
-  document.cookie = `${name}=;path=${path};expires=Thu, 01 Jan 1970 00:00:00 GMT`;
+  const { sameSite, secure } = options;
+  let cookie = `${name}=;path=${path};expires=Thu, 01 Jan 1970 00:00:00 GMT`;
+  if (sameSite) {
+    cookie += `;samesite=${sameSite}`;
+  }
+  if (secure) {
+    cookie += ";secure";
+  }
+  document.cookie = cookie;
+}
+function crossSiteCookieOptions() {
+  if (typeof window === "undefined" || !window.isSecureContext) return {};
+  return { sameSite: "None", secure: true };
 }
 
 // src/core/locales/en.json
@@ -151,7 +169,11 @@ function t(key, locale, vars) {
 }
 
 // src/core/utils.ts
-function sendPreprEvent(event, data) {
+var trustedParentOrigin = null;
+function setTrustedParentOrigin(origin) {
+  trustedParentOrigin = origin;
+}
+function sendPreprEvent(event, data, options) {
   if (typeof window !== "undefined") {
     const message = {
       name: "prepr_preview_bar",
@@ -162,7 +184,11 @@ function sendPreprEvent(event, data) {
       new CustomEvent("prepr_preview_bar", { detail: message })
     );
     if (window.parent && window.parent !== window) {
-      window.parent.postMessage(message, "*");
+      if (trustedParentOrigin) {
+        window.parent.postMessage(message, trustedParentOrigin);
+      } else if (options?.allowUntrustedTarget) {
+        window.parent.postMessage(message, "*");
+      }
     }
   }
 }
@@ -248,7 +274,23 @@ function createElementCache(query, ttl = 1e3) {
 }
 
 // src/core/iframe-bridge.ts
-function createIframeBridge(store) {
+var EDITOR_BASE_DOMAIN = "prepr.io";
+function isAllowedEditorOrigin(origin, allowed) {
+  if (allowed) return allowed.includes(origin);
+  let url;
+  try {
+    url = new URL(origin);
+  } catch {
+    return false;
+  }
+  if (url.protocol !== "https:" || url.port !== "") return false;
+  const suffix = `.${EDITOR_BASE_DOMAIN}`;
+  if (!url.hostname.endsWith(suffix)) return false;
+  const label = url.hostname.slice(0, -suffix.length);
+  return label.length > 0 && !label.includes(".");
+}
+function createIframeBridge(store, options = {}) {
+  const allowedOrigins = options.allowedEditorOrigins;
   let parentOrigin = null;
   const onKeyDown = (event) => {
     const key = event.key.toLowerCase();
@@ -258,14 +300,16 @@ function createIframeBridge(store) {
   const onMessage = (evt) => {
     const data = evt?.data;
     if (data?.event === "prepr:initVE" && !parentOrigin) {
+      if (!isAllowedEditorOrigin(evt.origin, allowedOrigins)) return;
       parentOrigin = evt.origin;
+      setTrustedParentOrigin(parentOrigin);
       if (data.scrollPosition != null) {
         const top = data.scrollPosition;
         setTimeout(() => window.scrollTo(0, top), 1);
       }
       store.set({ previewMode: true, editMode: data.editMode ?? true });
     }
-    if (evt.origin !== parentOrigin) return;
+    if (!parentOrigin || evt.origin !== parentOrigin) return;
     if (data?.event === "prepr:getScrollPosition") {
       const currentScrollY = window.scrollY || document.documentElement.scrollTop;
       sendPreprEvent("getScrollPosition", { value: currentScrollY });
@@ -273,13 +317,15 @@ function createIframeBridge(store) {
   };
   return {
     start() {
-      sendPreprEvent("loaded");
+      sendPreprEvent("loaded", void 0, { allowUntrustedTarget: true });
       window.addEventListener("keydown", onKeyDown);
       window.addEventListener("message", onMessage);
     },
     stop() {
       window.removeEventListener("keydown", onKeyDown);
       window.removeEventListener("message", onMessage);
+      parentOrigin = null;
+      setTrustedParentOrigin(null);
     }
   };
 }
@@ -910,43 +956,55 @@ function createToolbarStore(initial = {}) {
 }
 
 // src/core/toolbar-change-handler.ts
-var COOKIE_OPTS = { maxAge: ONE_YEAR_SECONDS, path: "/" };
+function cookieOpts() {
+  return {
+    maxAge: ONE_YEAR_SECONDS,
+    path: "/",
+    ...crossSiteCookieOptions()
+  };
+}
 function createChangeHandler(deps) {
   const { store, stega, syncAutoClean } = deps;
-  function updateParam(name, value) {
+  function updateParams(patch) {
     const [path, existing] = splitPath(deps.currentPath());
     const params = new URLSearchParams(existing);
-    if (value === null) {
-      params.delete(name);
-    } else {
-      params.set(name, value);
+    for (const [name, value] of Object.entries(patch)) {
+      if (value === null) {
+        params.delete(name);
+      } else {
+        params.set(name, value);
+      }
     }
     const query = params.toString();
     deps.navigate(query ? `${path}?${query}` : path);
   }
   return function handleChange(before, after) {
+    const paramPatch = {};
     if (before.selectedSegment !== after.selectedSegment) {
       if (after.selectedSegment === null) {
-        removeCookie(COOKIE_SEGMENT);
+        removeCookie(COOKIE_SEGMENT, "/", crossSiteCookieOptions());
       } else {
-        setCookie(COOKIE_SEGMENT, after.selectedSegment, COOKIE_OPTS);
+        setCookie(COOKIE_SEGMENT, after.selectedSegment, cookieOpts());
       }
-      updateParam(PARAM_SEGMENT, after.selectedSegment);
+      paramPatch[PARAM_SEGMENT] = after.selectedSegment;
       sendPreprEvent("segment_changed", {
         segment: after.selectedSegment ?? void 0
       });
     }
     if (before.selectedVariant !== after.selectedVariant) {
       if (after.selectedVariant === null) {
-        removeCookie(COOKIE_VARIANT);
+        removeCookie(COOKIE_VARIANT, "/", crossSiteCookieOptions());
       } else {
-        setCookie(COOKIE_VARIANT, after.selectedVariant, COOKIE_OPTS);
+        setCookie(COOKIE_VARIANT, after.selectedVariant, cookieOpts());
       }
-      updateParam(PARAM_VARIANT, after.selectedVariant);
+      paramPatch[PARAM_VARIANT] = after.selectedVariant;
       sendPreprEvent("variant_changed", {
         variant: after.selectedVariant ?? void 0
       });
     }
+    if (Object.keys(paramPatch).length > 0) {
+      updateParams(paramPatch);
+    }
     if (before.editMode !== after.editMode) {
       if (after.editMode) {
         stega.start();
@@ -966,8 +1024,8 @@ function createChangeHandler(deps) {
       if (Object.keys(coupled).length > 0) {
         store.set(coupled);
       }
-      setCookie(COOKIE_PREVIEW_MODE, String(after.previewMode), COOKIE_OPTS);
-      setCookie(COOKIE_TOOLBAR_OPEN, "false", COOKIE_OPTS);
+      setCookie(COOKIE_PREVIEW_MODE, String(after.previewMode), cookieOpts());
+      setCookie(COOKIE_TOOLBAR_OPEN, "false", cookieOpts());
       sendPreprEvent("preview_mode_toggled", { previewMode: after.previewMode });
       syncAutoClean(after.previewMode);
       const [path, existing] = splitPath(deps.currentPath());
@@ -982,7 +1040,7 @@ function createChangeHandler(deps) {
       }
     }
     if (before.toolbarOpen !== after.toolbarOpen) {
-      setCookie(COOKIE_TOOLBAR_OPEN, String(after.toolbarOpen), COOKIE_OPTS);
+      setCookie(COOKIE_TOOLBAR_OPEN, String(after.toolbarOpen), cookieOpts());
     }
   };
 }
@@ -2052,7 +2110,9 @@ function createPreprToolbar(opts) {
   });
   syncAutoClean(store.get().previewMode);
   const bridge = createIframeBridge(store);
-  sendPreprEvent("getScrollPosition", { value: 0 });
+  sendPreprEvent("getScrollPosition", { value: 0 }, {
+    allowUntrustedTarget: true
+  });
   if (isIframe) {
     bridge.start();
   }

package/dist/nextjs/components.js

@@ -2,7 +2,7 @@
 import {
   createPreprToolbar,
   loadTrackingPixel
-} from "../chunk-5JGPWQVA.js";
+} from "../chunk-NLQIRN5O.js";
 
 // src/nextjs/components.ts
 import { usePathname, useRouter } from "next/navigation";

package/dist/nextjs/index.cjs

@@ -38,7 +38,7 @@ module.exports = __toCommonJS(nextjs_exports);
 var import_server = require("next/server");
 
 // src/version.ts
-var VERSION = "0.1.0-beta.3";
+var VERSION = "0.1.0-beta.5";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -77,7 +77,11 @@ function processPreprRequest(request, opts) {
   const requestHeaders = new Headers(request.headers);
   const responseCookies = [];
   const requestCookies = parseCookies(request);
-  const searchParams = new URL(request.url).searchParams;
+  const url = new URL(request.url);
+  const searchParams = url.searchParams;
+  const forwardedProto = request.headers.get("x-forwarded-proto")?.split(",")[0]?.trim();
+  const isSecure = forwardedProto ? forwardedProto === "https" : url.protocol === "https:";
+  const crossSite = isSecure ? { sameSite: "None", secure: true } : {};
   for (const key of UTM_PARAMS) {
     const value = searchParams.get(key);
     if (value !== null) {
@@ -126,6 +130,15 @@ function processPreprRequest(request, opts) {
   }
   requestHeaders.set("Prepr-Preview-Bar", "true");
   const isLivePreview = searchParams.get(PARAM_HIDE_BAR) === "true";
+  if (!isLivePreview && !requestCookies.has(COOKIE_PREVIEW_MODE)) {
+    responseCookies.push({
+      name: COOKIE_PREVIEW_MODE,
+      value: "true",
+      maxAge: ONE_YEAR_SECONDS,
+      path: "/",
+      ...crossSite
+    });
+  }
   if (!isLivePreview) {
     const segmentCookie = requestCookies.get(COOKIE_SEGMENT);
     if (segmentCookie) {
@@ -144,7 +157,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_VARIANT,
         value: previewAb,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -156,7 +170,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_SEGMENT,
         value: previewSegment,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -183,7 +198,10 @@ function createPreprMiddleware(request, responseOrOptions, maybeOptions) {
   for (const cookie of responseCookies) {
     response.cookies.set(cookie.name, cookie.value, {
       maxAge: cookie.maxAge,
-      path: cookie.path
+      path: cookie.path,
+      // Lower-cased: Next's cookie API expects 'none' | 'lax' | 'strict'.
+      ...cookie.sameSite ? { sameSite: cookie.sameSite.toLowerCase() } : {},
+      ...cookie.secure ? { secure: true } : {}
     });
   }
   return response;

package/dist/nextjs/index.js

@@ -2,7 +2,7 @@
 import { NextResponse } from "next/server";
 
 // src/version.ts
-var VERSION = "0.1.0-beta.3";
+var VERSION = "0.1.0-beta.5";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -41,7 +41,11 @@ function processPreprRequest(request, opts) {
   const requestHeaders = new Headers(request.headers);
   const responseCookies = [];
   const requestCookies = parseCookies(request);
-  const searchParams = new URL(request.url).searchParams;
+  const url = new URL(request.url);
+  const searchParams = url.searchParams;
+  const forwardedProto = request.headers.get("x-forwarded-proto")?.split(",")[0]?.trim();
+  const isSecure = forwardedProto ? forwardedProto === "https" : url.protocol === "https:";
+  const crossSite = isSecure ? { sameSite: "None", secure: true } : {};
   for (const key of UTM_PARAMS) {
     const value = searchParams.get(key);
     if (value !== null) {
@@ -90,6 +94,15 @@ function processPreprRequest(request, opts) {
   }
   requestHeaders.set("Prepr-Preview-Bar", "true");
   const isLivePreview = searchParams.get(PARAM_HIDE_BAR) === "true";
+  if (!isLivePreview && !requestCookies.has(COOKIE_PREVIEW_MODE)) {
+    responseCookies.push({
+      name: COOKIE_PREVIEW_MODE,
+      value: "true",
+      maxAge: ONE_YEAR_SECONDS,
+      path: "/",
+      ...crossSite
+    });
+  }
   if (!isLivePreview) {
     const segmentCookie = requestCookies.get(COOKIE_SEGMENT);
     if (segmentCookie) {
@@ -108,7 +121,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_VARIANT,
         value: previewAb,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -120,7 +134,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_SEGMENT,
         value: previewSegment,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -147,7 +162,10 @@ function createPreprMiddleware(request, responseOrOptions, maybeOptions) {
   for (const cookie of responseCookies) {
     response.cookies.set(cookie.name, cookie.value, {
       maxAge: cookie.maxAge,
-      path: cookie.path
+      path: cookie.path,
+      // Lower-cased: Next's cookie API expects 'none' | 'lax' | 'strict'.
+      ...cookie.sameSite ? { sameSite: cookie.sameSite.toLowerCase() } : {},
+      ...cookie.secure ? { secure: true } : {}
     });
   }
   return response;

package/dist/nuxt/index.cjs

@@ -35,7 +35,7 @@ __export(nuxt_exports, {
 module.exports = __toCommonJS(nuxt_exports);
 
 // src/version.ts
-var VERSION = "0.1.0-beta.3";
+var VERSION = "0.1.0-beta.5";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -56,6 +56,20 @@ var UTM_PARAMS = [
   "utm_content",
   "utm_campaign"
 ];
+function serializeCookie(cookie) {
+  const parts = [
+    `${cookie.name}=${encodeURIComponent(cookie.value)}`,
+    `Max-Age=${cookie.maxAge}`,
+    `Path=${cookie.path}`
+  ];
+  if (cookie.sameSite) {
+    parts.push(`SameSite=${cookie.sameSite}`);
+  }
+  if (cookie.secure) {
+    parts.push("Secure");
+  }
+  return parts.join("; ");
+}
 function parseCookies(request) {
   const cookies = /* @__PURE__ */ new Map();
   const header = request.headers.get("cookie");
@@ -74,7 +88,11 @@ function processPreprRequest(request, opts) {
   const requestHeaders = new Headers(request.headers);
   const responseCookies = [];
   const requestCookies = parseCookies(request);
-  const searchParams = new URL(request.url).searchParams;
+  const url = new URL(request.url);
+  const searchParams = url.searchParams;
+  const forwardedProto = request.headers.get("x-forwarded-proto")?.split(",")[0]?.trim();
+  const isSecure = forwardedProto ? forwardedProto === "https" : url.protocol === "https:";
+  const crossSite = isSecure ? { sameSite: "None", secure: true } : {};
   for (const key of UTM_PARAMS) {
     const value = searchParams.get(key);
     if (value !== null) {
@@ -123,6 +141,15 @@ function processPreprRequest(request, opts) {
   }
   requestHeaders.set("Prepr-Preview-Bar", "true");
   const isLivePreview = searchParams.get(PARAM_HIDE_BAR) === "true";
+  if (!isLivePreview && !requestCookies.has(COOKIE_PREVIEW_MODE)) {
+    responseCookies.push({
+      name: COOKIE_PREVIEW_MODE,
+      value: "true",
+      maxAge: ONE_YEAR_SECONDS,
+      path: "/",
+      ...crossSite
+    });
+  }
   if (!isLivePreview) {
     const segmentCookie = requestCookies.get(COOKIE_SEGMENT);
     if (segmentCookie) {
@@ -141,7 +168,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_VARIANT,
         value: previewAb,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -153,7 +181,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_SEGMENT,
         value: previewSegment,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -179,12 +208,7 @@ function handlePreprRequest(event, options) {
   });
   event.context[PREPR_CONTEXT_KEY] = requestHeaders;
   for (const cookie of responseCookies) {
-    const parts = [
-      `${cookie.name}=${encodeURIComponent(cookie.value)}`,
-      `Max-Age=${cookie.maxAge}`,
-      `Path=${cookie.path}`
-    ];
-    event.node.res.appendHeader("Set-Cookie", parts.join("; "));
+    event.node.res.appendHeader("Set-Cookie", serializeCookie(cookie));
   }
 }
 function getPreprHeadersFromEvent(event) {

package/dist/nuxt/index.js

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "0.1.0-beta.3";
+var VERSION = "0.1.0-beta.5";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -20,6 +20,20 @@ var UTM_PARAMS = [
   "utm_content",
   "utm_campaign"
 ];
+function serializeCookie(cookie) {
+  const parts = [
+    `${cookie.name}=${encodeURIComponent(cookie.value)}`,
+    `Max-Age=${cookie.maxAge}`,
+    `Path=${cookie.path}`
+  ];
+  if (cookie.sameSite) {
+    parts.push(`SameSite=${cookie.sameSite}`);
+  }
+  if (cookie.secure) {
+    parts.push("Secure");
+  }
+  return parts.join("; ");
+}
 function parseCookies(request) {
   const cookies = /* @__PURE__ */ new Map();
   const header = request.headers.get("cookie");
@@ -38,7 +52,11 @@ function processPreprRequest(request, opts) {
   const requestHeaders = new Headers(request.headers);
   const responseCookies = [];
   const requestCookies = parseCookies(request);
-  const searchParams = new URL(request.url).searchParams;
+  const url = new URL(request.url);
+  const searchParams = url.searchParams;
+  const forwardedProto = request.headers.get("x-forwarded-proto")?.split(",")[0]?.trim();
+  const isSecure = forwardedProto ? forwardedProto === "https" : url.protocol === "https:";
+  const crossSite = isSecure ? { sameSite: "None", secure: true } : {};
   for (const key of UTM_PARAMS) {
     const value = searchParams.get(key);
     if (value !== null) {
@@ -87,6 +105,15 @@ function processPreprRequest(request, opts) {
   }
   requestHeaders.set("Prepr-Preview-Bar", "true");
   const isLivePreview = searchParams.get(PARAM_HIDE_BAR) === "true";
+  if (!isLivePreview && !requestCookies.has(COOKIE_PREVIEW_MODE)) {
+    responseCookies.push({
+      name: COOKIE_PREVIEW_MODE,
+      value: "true",
+      maxAge: ONE_YEAR_SECONDS,
+      path: "/",
+      ...crossSite
+    });
+  }
   if (!isLivePreview) {
     const segmentCookie = requestCookies.get(COOKIE_SEGMENT);
     if (segmentCookie) {
@@ -105,7 +132,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_VARIANT,
         value: previewAb,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -117,7 +145,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_SEGMENT,
         value: previewSegment,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -143,12 +172,7 @@ function handlePreprRequest(event, options) {
   });
   event.context[PREPR_CONTEXT_KEY] = requestHeaders;
   for (const cookie of responseCookies) {
-    const parts = [
-      `${cookie.name}=${encodeURIComponent(cookie.value)}`,
-      `Max-Age=${cookie.maxAge}`,
-      `Path=${cookie.path}`
-    ];
-    event.node.res.appendHeader("Set-Cookie", parts.join("; "));
+    event.node.res.appendHeader("Set-Cookie", serializeCookie(cookie));
   }
 }
 function getPreprHeadersFromEvent(event) {

package/dist/sveltekit/index.cjs

@@ -35,7 +35,7 @@ __export(sveltekit_exports, {
 module.exports = __toCommonJS(sveltekit_exports);
 
 // src/version.ts
-var VERSION = "0.1.0-beta.3";
+var VERSION = "0.1.0-beta.5";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -56,6 +56,20 @@ var UTM_PARAMS = [
   "utm_content",
   "utm_campaign"
 ];
+function serializeCookie(cookie) {
+  const parts = [
+    `${cookie.name}=${encodeURIComponent(cookie.value)}`,
+    `Max-Age=${cookie.maxAge}`,
+    `Path=${cookie.path}`
+  ];
+  if (cookie.sameSite) {
+    parts.push(`SameSite=${cookie.sameSite}`);
+  }
+  if (cookie.secure) {
+    parts.push("Secure");
+  }
+  return parts.join("; ");
+}
 function parseCookies(request) {
   const cookies = /* @__PURE__ */ new Map();
   const header = request.headers.get("cookie");
@@ -74,7 +88,11 @@ function processPreprRequest(request, opts) {
   const requestHeaders = new Headers(request.headers);
   const responseCookies = [];
   const requestCookies = parseCookies(request);
-  const searchParams = new URL(request.url).searchParams;
+  const url = new URL(request.url);
+  const searchParams = url.searchParams;
+  const forwardedProto = request.headers.get("x-forwarded-proto")?.split(",")[0]?.trim();
+  const isSecure = forwardedProto ? forwardedProto === "https" : url.protocol === "https:";
+  const crossSite = isSecure ? { sameSite: "None", secure: true } : {};
   for (const key of UTM_PARAMS) {
     const value = searchParams.get(key);
     if (value !== null) {
@@ -123,6 +141,15 @@ function processPreprRequest(request, opts) {
   }
   requestHeaders.set("Prepr-Preview-Bar", "true");
   const isLivePreview = searchParams.get(PARAM_HIDE_BAR) === "true";
+  if (!isLivePreview && !requestCookies.has(COOKIE_PREVIEW_MODE)) {
+    responseCookies.push({
+      name: COOKIE_PREVIEW_MODE,
+      value: "true",
+      maxAge: ONE_YEAR_SECONDS,
+      path: "/",
+      ...crossSite
+    });
+  }
   if (!isLivePreview) {
     const segmentCookie = requestCookies.get(COOKIE_SEGMENT);
     if (segmentCookie) {
@@ -141,7 +168,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_VARIANT,
         value: previewAb,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -153,7 +181,8 @@ function processPreprRequest(request, opts) {
         name: COOKIE_SEGMENT,
         value: previewSegment,
         maxAge: ONE_YEAR_SECONDS,
-        path: "/"
+        path: "/",
+        ...crossSite
       });
     }
   }
@@ -173,12 +202,7 @@ function preprHandle(options) {
     }
     const response = await resolve(event);
     for (const cookie of responseCookies) {
-      const parts = [
-        `${cookie.name}=${encodeURIComponent(cookie.value)}`,
-        `Max-Age=${cookie.maxAge}`,
-        `Path=${cookie.path}`
-      ];
-      response.headers.append("Set-Cookie", parts.join("; "));
+      response.headers.append("Set-Cookie", serializeCookie(cookie));
     }
     return response;
   };