@preprio/toolkit 0.4.2 → 0.5.0-rc.1

package/dist/index.d.cts

@@ -1,11 +1,11 @@
-import { P as PreprFeatures, R as ResolvedPreprFeatures, L as Locale, a as PreprSegment, b as PreprVariant, c as PreprToolbarProps, d as PreprPreviewOptions, e as PreprErrorCode, f as PreprHeaders } from './pixel-Wsfvw9G2.cjs';
-export { g as PreprEnvironment, h as PreprEventType, i as PreprFeatureConfig, j as PreprHeaderName, k as PreprPixelConfig, l as PreprToolbarComponentProps, m as PreprToolbarOptions, n as loadTrackingPixel, s as setTrackingParam, t as trackEvent } from './pixel-Wsfvw9G2.cjs';
+import { P as PreprFeatures, R as ResolvedPreprFeatures, L as Locale, a as PreprSegment, b as PreprVariant, c as PreprToolbarProps, d as PreprPreviewOptions, e as PreprErrorCode, f as PreprHeaders } from './pixel-e1fUWl2Y.cjs';
+export { g as PreprEnvironment, h as PreprEventType, i as PreprFeatureConfig, j as PreprHeaderName, k as PreprPixelConfig, l as PreprToolbarComponentProps, m as PreprToolbarOptions, n as loadTrackingPixel, s as setTrackingParam, t as trackEvent } from './pixel-e1fUWl2Y.cjs';
 
 /**
  * Package version; must match package.json. Lives in its own leaf module so
  * core can import it without cycling through the barrel.
  */
-declare const VERSION = "0.4.2";
+declare const VERSION = "0.5.0-rc.1";
 
 /**
  * Resolve a `PreprFeatures` bag to plain booleans, defaulting every omitted key
@@ -137,12 +137,23 @@ declare class PreprToolbarElement extends HTMLElementBase {
 /** Idempotent, including across bundles that each try to define the element. */
 declare function definePreprToolbar(): void;
 
+/** Which field the editor asked the preview to bring on screen. */
+interface ScrollToFieldMessage {
+    field: string;
+    id?: string;
+}
 interface IframeBridgeOptions {
     /**
      * Replace the `*.prepr.io` wildcard with an exact origin list. Intended for
      * self-hosted editors; when set, the wildcard no longer applies.
      */
     allowedEditorOrigins?: string[];
+    /**
+     * Called when the editor selects a field and wants the preview to scroll to
+     * it. Only fires for messages from the handshaked editor origin. The bridge
+     * stays free of DOM lookups: the preview runtime supplies `scrollToField`.
+     */
+    onScrollToField?: (message: ScrollToFieldMessage) => void;
 }
 
 /** Error thrown by the token helpers and the segments fetch. */

package/dist/index.d.ts

@@ -1,11 +1,11 @@
-import { P as PreprFeatures, R as ResolvedPreprFeatures, L as Locale, a as PreprSegment, b as PreprVariant, c as PreprToolbarProps, d as PreprPreviewOptions, e as PreprErrorCode, f as PreprHeaders } from './pixel-Wsfvw9G2.js';
-export { g as PreprEnvironment, h as PreprEventType, i as PreprFeatureConfig, j as PreprHeaderName, k as PreprPixelConfig, l as PreprToolbarComponentProps, m as PreprToolbarOptions, n as loadTrackingPixel, s as setTrackingParam, t as trackEvent } from './pixel-Wsfvw9G2.js';
+import { P as PreprFeatures, R as ResolvedPreprFeatures, L as Locale, a as PreprSegment, b as PreprVariant, c as PreprToolbarProps, d as PreprPreviewOptions, e as PreprErrorCode, f as PreprHeaders } from './pixel-e1fUWl2Y.js';
+export { g as PreprEnvironment, h as PreprEventType, i as PreprFeatureConfig, j as PreprHeaderName, k as PreprPixelConfig, l as PreprToolbarComponentProps, m as PreprToolbarOptions, n as loadTrackingPixel, s as setTrackingParam, t as trackEvent } from './pixel-e1fUWl2Y.js';
 
 /**
  * Package version; must match package.json. Lives in its own leaf module so
  * core can import it without cycling through the barrel.
  */
-declare const VERSION = "0.4.2";
+declare const VERSION = "0.5.0-rc.1";
 
 /**
  * Resolve a `PreprFeatures` bag to plain booleans, defaulting every omitted key
@@ -137,12 +137,23 @@ declare class PreprToolbarElement extends HTMLElementBase {
 /** Idempotent, including across bundles that each try to define the element. */
 declare function definePreprToolbar(): void;
 
+/** Which field the editor asked the preview to bring on screen. */
+interface ScrollToFieldMessage {
+    field: string;
+    id?: string;
+}
 interface IframeBridgeOptions {
     /**
      * Replace the `*.prepr.io` wildcard with an exact origin list. Intended for
      * self-hosted editors; when set, the wildcard no longer applies.
      */
     allowedEditorOrigins?: string[];
+    /**
+     * Called when the editor selects a field and wants the preview to scroll to
+     * it. Only fires for messages from the handshaked editor origin. The bridge
+     * stays free of DOM lookups: the preview runtime supplies `scrollToField`.
+     */
+    onScrollToField?: (message: ScrollToFieldMessage) => void;
 }
 
 /** Error thrown by the token helpers and the segments fetch. */

package/dist/index.js

@@ -18,7 +18,7 @@ import {
   setTrackingParam,
   stegaClean,
   trackEvent
-} from "./chunk-72BQJDDK.js";
+} from "./chunk-4JNKYIEV.js";
 
 // src/core/server.ts
 var PreprError = class extends Error {
@@ -53,7 +53,7 @@ var PREPR_HEADER_KEYS = [
   "Prepr-Visitor-IP",
   "Prepr-Hubspot-Id",
   "Prepr-Customer-Id-Created",
-  "Prepr-User-Agent",
+  "User-Agent",
   "Prepr-Package"
 ];
 function getPreprHeadersFromHeaders(headers) {
@@ -250,7 +250,7 @@ function processFrameworkRequest(request, opts, framework) {
   }
   const userAgent = request.headers.get("user-agent");
   if (userAgent) {
-    requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
+    requestHeaders.set("User-Agent", sanitizeHeaderValue(userAgent));
   }
   const packageParts = [`@preprio/toolkit@${opts?.version ?? VERSION}`];
   if (framework) packageParts.push(`framework=${framework}`);

package/dist/nextjs/components.cjs

@@ -292,6 +292,7 @@ function createElementCache(query, ttl = 1e3) {
 }
 
 // src/core/iframe-bridge.ts
+var debug = createScopedLogger("iframe-bridge");
 var EDITOR_BASE_DOMAIN = "prepr.io";
 function isAllowedEditorOrigin(origin, allowed) {
   if (allowed) return allowed.includes(origin);
@@ -309,6 +310,7 @@ function isAllowedEditorOrigin(origin, allowed) {
 }
 function createIframeBridge(store, options = {}) {
   const allowedOrigins = options.allowedEditorOrigins;
+  const onScrollToField = options.onScrollToField;
   let parentOrigin = null;
   const onKeyDown = (event) => {
     const key = event.key.toLowerCase();
@@ -332,6 +334,15 @@ function createIframeBridge(store, options = {}) {
       const currentScrollY = window.scrollY || document.documentElement.scrollTop;
       sendPreprEvent("getScrollPosition", { value: currentScrollY });
     }
+    if (data?.event === "prepr:scrollToField") {
+      if (typeof data.field !== "string" || !data.field) return;
+      if (data.id !== void 0 && typeof data.id !== "string") return;
+      try {
+        onScrollToField?.({ field: data.field, id: data.id });
+      } catch (error) {
+        debug.warn("scrollToField handler failed", error);
+      }
+    }
   };
   return {
     start() {
@@ -356,7 +367,7 @@ var import_stega2 = require("@vercel/stega");
 
 // src/core/stega/clean.ts
 var import_stega = require("@vercel/stega");
-var debug = createScopedLogger("stega:clean");
+var debug2 = createScopedLogger("stega:clean");
 function decodeStega(str) {
   if (!str) return null;
   try {
@@ -365,7 +376,7 @@ function decodeStega(str) {
       return decoded;
     }
   } catch (error) {
-    debug.log("error decoding stega data", error);
+    debug2.log("error decoding stega data", error);
     const match = str.match(/{"origin.*?}/);
     if (match) {
       try {
@@ -374,7 +385,7 @@ function decodeStega(str) {
           return decodedMatch;
         }
       } catch (innerError) {
-        debug.log("error decoding stega regex match", innerError);
+        debug2.log("error decoding stega regex match", innerError);
       }
     }
   }
@@ -410,14 +421,37 @@ function isRenderedElement(element) {
   if (!style) return true;
   return style.visibility !== "hidden" && style.display !== "none";
 }
+function parseEditHref(href) {
+  try {
+    const url = new URL(href, window.location.origin);
+    return {
+      id: url.pathname.split("/").pop() || void 0,
+      field: url.searchParams.get("field") || void 0,
+      locale: url.searchParams.get("locale") || void 0
+    };
+  } catch {
+    return {};
+  }
+}
+function setOrRemove(element, name, value) {
+  if (value) {
+    element.setAttribute(name, value);
+  } else {
+    element.removeAttribute(name);
+  }
+}
 function tagEncodedElement(element, decoded) {
   element.setAttribute("data-prepr-encoded", "");
   element.setAttribute("data-prepr-href", decoded.href);
   element.setAttribute("data-prepr-origin", decoded.origin);
+  const { id, field, locale } = parseEditHref(decoded.href);
+  setOrRemove(element, "data-prepr-id", id);
+  setOrRemove(element, "data-prepr-field", field);
+  setOrRemove(element, "data-prepr-locale", locale);
 }
 
 // src/core/stega/auto-clean.ts
-var debug2 = createScopedLogger("stega:auto-clean");
+var debug3 = createScopedLogger("stega:auto-clean");
 function createStegaAutoClean(options) {
   const stripText = options?.enabled ?? true;
   let observer = null;
@@ -460,7 +494,7 @@ function createStegaAutoClean(options) {
       }
       pendingHidden.add(textNode);
     } catch (error) {
-      debug2.log("error cleaning text node", error);
+      debug3.log("error cleaning text node", error);
     }
     return false;
   }
@@ -546,7 +580,7 @@ function createStegaAutoClean(options) {
     if (observer || typeof window === "undefined") return;
     scanAndClean();
     setupObserver();
-    debug2.log("stega auto-clean started");
+    debug3.log("stega auto-clean started");
   }
   function stop() {
     if (debounceTimeout) {
@@ -560,13 +594,13 @@ function createStegaAutoClean(options) {
     cleaned = /* @__PURE__ */ new WeakMap();
     pendingHidden = /* @__PURE__ */ new Set();
     pendingDirty = /* @__PURE__ */ new Set();
-    debug2.log("stega auto-clean stopped");
+    debug3.log("stega auto-clean stopped");
   }
   return { start, stop };
 }
 
 // src/core/stega/elements.ts
-var debug3 = createScopedLogger("stega:elements");
+var debug4 = createScopedLogger("stega:elements");
 var StegaElements = class {
   constructor(decode = decodeStega) {
     this.observer = null;
@@ -611,7 +645,7 @@ var StegaElements = class {
     walkTextNodes(document.body, (textNode) => {
       if (this.tagFromTextNode(textNode)) encodedCount++;
     });
-    debug3.log("document scan complete, encoded", encodedCount, "elements");
+    debug4.log("document scan complete, encoded", encodedCount, "elements");
     this.elements = document.querySelectorAll("[data-prepr-encoded]");
   }
   /** `onUpdate` fires after each debounced batch, for refreshing derived state. */
@@ -667,6 +701,9 @@ var StegaElements = class {
       element.removeAttribute("data-prepr-encoded");
       element.removeAttribute("data-prepr-href");
       element.removeAttribute("data-prepr-origin");
+      element.removeAttribute("data-prepr-id");
+      element.removeAttribute("data-prepr-field");
+      element.removeAttribute("data-prepr-locale");
       element.classList.remove("prepr-overlay-active");
     });
     this.elements = void 0;
@@ -674,7 +711,7 @@ var StegaElements = class {
 };
 
 // src/core/stega/overlay.ts
-var debug4 = createScopedLogger("stega:overlay");
+var debug5 = createScopedLogger("stega:overlay");
 var StegaOverlay = class {
   constructor(onEdit) {
     this.overlay = null;
@@ -719,7 +756,8 @@ var StegaOverlay = class {
     const origin = element.getAttribute("data-prepr-origin");
     const id = element.getAttribute("data-prepr-id") ?? void 0;
     const field = element.getAttribute("data-prepr-field") ?? void 0;
-    debug4.log("showing overlay", { href, origin });
+    const locale = element.getAttribute("data-prepr-locale") ?? void 0;
+    debug5.log("showing overlay", { href, origin });
     const overlay = this.overlay;
     overlay.style.display = "block";
     overlay.style.top = `${rect.top + window.scrollY - 2}px`;
@@ -751,7 +789,7 @@ var StegaOverlay = class {
         tooltip.style.left = `${left}px`;
       });
       tooltip.onclick = () => {
-        this.onEdit({ href, origin, id, field });
+        this.onEdit({ href, origin, id, field, locale });
       };
     }
     this.currentElement = element;
@@ -791,7 +829,7 @@ var StegaOverlay = class {
 };
 
 // src/core/stega/proximity.ts
-var debug5 = createScopedLogger("stega:proximity");
+var debug6 = createScopedLogger("stega:proximity");
 var StegaProximity = class {
   constructor() {
     this.highlighted = /* @__PURE__ */ new Set();
@@ -826,9 +864,9 @@ var StegaProximity = class {
       );
       const nodes = this.getEncodedElements();
       nodes.forEach((el) => this.observer.observe(el));
-      debug5.log("observing", nodes.length, "encoded elements");
+      debug6.log("observing", nodes.length, "encoded elements");
     } catch (error) {
-      debug5.log("error setting up IntersectionObserver", error);
+      debug6.log("error setting up IntersectionObserver", error);
     }
   }
   stopObserving() {
@@ -898,7 +936,7 @@ function removeStegaStyles() {
 }
 
 // src/core/stega/scan.ts
-var debug6 = createScopedLogger("stega:scan");
+var debug7 = createScopedLogger("stega:scan");
 var EDITOR_MODE_STYLES = "[data-prepr-encoded]{cursor:pointer}";
 function createStegaController(opts) {
   const tooltipEnabled = opts.tooltip ?? true;
@@ -931,12 +969,13 @@ function createStegaController(opts) {
       href: encoded.getAttribute("data-prepr-href") ?? "",
       origin: encoded.getAttribute("data-prepr-origin") ?? "",
       id: encoded.getAttribute("data-prepr-id") ?? void 0,
-      field: encoded.getAttribute("data-prepr-field") ?? void 0
+      field: encoded.getAttribute("data-prepr-field") ?? void 0,
+      locale: encoded.getAttribute("data-prepr-locale") ?? void 0
     });
   };
   const start = () => {
     if (initialized) {
-      debug6.log("already initialized, skipping setup");
+      debug7.log("already initialized, skipping setup");
       return;
     }
     if (!tooltipEnabled) {
@@ -946,7 +985,7 @@ function createStegaController(opts) {
       });
       document.addEventListener("click", handleClick, { capture: true });
       initialized = true;
-      debug6.log("stega controller started (editor mode)");
+      debug7.log("stega controller started (editor mode)");
       return;
     }
     injectStegaStyles();
@@ -977,7 +1016,7 @@ function createStegaController(opts) {
       passive: true
     });
     initialized = true;
-    debug6.log("stega controller started");
+    debug7.log("stega controller started");
   };
   const stop = () => {
     if (!initialized) return;
@@ -986,7 +1025,7 @@ function createStegaController(opts) {
       elements.cleanup();
       removeStegaStyles();
       initialized = false;
-      debug6.log("stega controller stopped (editor mode)");
+      debug7.log("stega controller stopped (editor mode)");
       return;
     }
     if (throttledMouseMove) {
@@ -1006,11 +1045,43 @@ function createStegaController(opts) {
     elements.cleanup();
     removeStegaStyles();
     initialized = false;
-    debug6.log("stega controller stopped");
+    debug7.log("stega controller stopped");
   };
   return { start, stop };
 }
 
+// src/core/stega/scroll-to-field.ts
+var debug8 = createScopedLogger("stega:scroll");
+var FLASH_DURATION_MS = 1200;
+var flashTimeout = null;
+function scrollToField(request) {
+  const { field, id } = request;
+  if (!field) return false;
+  const candidates = document.querySelectorAll(
+    "[data-prepr-encoded]"
+  );
+  let target = null;
+  for (const candidate of candidates) {
+    if (candidate.getAttribute("data-prepr-field") !== field) continue;
+    if (id && candidate.getAttribute("data-prepr-id") !== id) continue;
+    target = candidate;
+    break;
+  }
+  if (!target) {
+    debug8.log("no element found for field", field);
+    return false;
+  }
+  target.scrollIntoView({ behavior: "smooth", block: "center" });
+  if (flashTimeout) clearTimeout(flashTimeout);
+  document.querySelectorAll(".prepr-overlay-active").forEach((el) => el.classList.remove("prepr-overlay-active"));
+  target.classList.add("prepr-overlay-active");
+  flashTimeout = setTimeout(() => {
+    target.classList.remove("prepr-overlay-active");
+    flashTimeout = null;
+  }, FLASH_DURATION_MS);
+  return true;
+}
+
 // src/core/store.ts
 var DEFAULT_STATE = {
   locale: "en",
@@ -2123,7 +2194,7 @@ function definePreprToolbar() {
 }
 
 // src/core/create-preview.ts
-var debug7 = createScopedLogger("create-preview");
+var debug9 = createScopedLogger("create-preview");
 var controllerStores = /* @__PURE__ */ new WeakMap();
 function defaultNavigation() {
   return {
@@ -2165,7 +2236,7 @@ function createPreprPreview(opts = {}) {
   const search = new URLSearchParams(window.location.search);
   const hideBar = search.get(PARAM_HIDE_BAR) === "true";
   if (hideBar) {
-    debug7.log(`${PARAM_HIDE_BAR}=true \u2014 no visible toolbar`);
+    debug9.log(`${PARAM_HIDE_BAR}=true \u2014 no visible toolbar`);
   }
   const mountUi = (options?.ui ?? true) && !isIframe && !hideBar;
   const locale = resolveLocale(options);
@@ -2201,18 +2272,17 @@ function createPreprPreview(opts = {}) {
     tooltip: mountUi,
     // In the editor, ask the parent to focus the field instead of opening a new
     // tab. Standalone previews keep the window.open behaviour.
-    onEdit: ({ href, origin, id, field }) => {
+    onEdit: ({ href, id, field, locale: contentLocale }) => {
       const safeHref = href ? safeEditUrl(href) : null;
       if (href && !safeHref) {
-        debug7.warn("ignored edit request with unsupported href scheme");
+        debug9.warn("ignored edit request with unsupported href scheme");
         return;
       }
       if (isIframe) {
         sendPreprEvent("field_edit_requested", {
-          href: safeHref ?? void 0,
-          origin,
           id,
-          field
+          field,
+          locale: contentLocale
         });
       } else if (safeHref) {
         window.open(safeHref, "_blank", "noopener,noreferrer");
@@ -2239,7 +2309,15 @@ function createPreprPreview(opts = {}) {
     handleChange(before, state);
   });
   const bridge = createIframeBridge(store, {
-    allowedEditorOrigins: options?.allowedEditorOrigins
+    allowedEditorOrigins: options?.allowedEditorOrigins,
+    // The editor selecting a field scrolls the matching element into view. The
+    // lookup relies on the attributes the stega scan writes, so it finds
+    // nothing until encoded content has been tagged.
+    onScrollToField: ({ field, id }) => {
+      if (!scrollToField({ field, id })) {
+        debug9.log("no element on this page renders field", field);
+      }
+    }
   });
   sendPreprEvent(
     "getScrollPosition",
@@ -2259,7 +2337,7 @@ function createPreprPreview(opts = {}) {
       bridge.stop();
     }
     el?.remove();
-    debug7.log("preview destroyed");
+    debug9.log("preview destroyed");
   }
   const controller = { destroy };
   controllerStores.set(controller, store);
@@ -2270,7 +2348,7 @@ function createPreprPreview(opts = {}) {
 var import_react = require("react");
 
 // src/version.ts
-var VERSION = "0.4.2";
+var VERSION = "0.5.0-rc.1";
 
 // src/core/pixel.ts
 var PIXEL_SCRIPT_URL = "https://cdn.tracking.prepr.io/js/prepr.min.js";

package/dist/nextjs/components.d.cts

@@ -1,4 +1,4 @@
-import { k as PreprPixelConfig, l as PreprToolbarComponentProps } from '../pixel-Wsfvw9G2.cjs';
+import { k as PreprPixelConfig, l as PreprToolbarComponentProps } from '../pixel-e1fUWl2Y.cjs';
 
 interface PreprTrackingPixelProps {
     /** Prepr tracking/access token. */

package/dist/nextjs/components.d.ts

@@ -1,4 +1,4 @@
-import { k as PreprPixelConfig, l as PreprToolbarComponentProps } from '../pixel-Wsfvw9G2.js';
+import { k as PreprPixelConfig, l as PreprToolbarComponentProps } from '../pixel-e1fUWl2Y.js';
 
 interface PreprTrackingPixelProps {
     /** Prepr tracking/access token. */

package/dist/nextjs/components.js

@@ -2,7 +2,7 @@
 import {
   createPreprPreview,
   loadTrackingPixel
-} from "../chunk-72BQJDDK.js";
+} from "../chunk-4JNKYIEV.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.4.2";
+var VERSION = "0.5.0-rc.1";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -133,7 +133,7 @@ function processFrameworkRequest(request, opts, framework) {
   }
   const userAgent = request.headers.get("user-agent");
   if (userAgent) {
-    requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
+    requestHeaders.set("User-Agent", sanitizeHeaderValue(userAgent));
   }
   const packageParts = [`@preprio/toolkit@${opts?.version ?? VERSION}`];
   if (framework) packageParts.push(`framework=${framework}`);
@@ -298,7 +298,7 @@ var PREPR_HEADER_KEYS = [
   "Prepr-Visitor-IP",
   "Prepr-Hubspot-Id",
   "Prepr-Customer-Id-Created",
-  "Prepr-User-Agent",
+  "User-Agent",
   "Prepr-Package"
 ];
 function getPreprHeadersFromHeaders(headers2) {

package/dist/nextjs/index.d.cts

@@ -119,6 +119,9 @@ interface PreprHeaders {
     readonly 'Prepr-Visitor-IP'?: string;
     readonly 'Prepr-Hubspot-Id'?: string;
     readonly 'Prepr-Customer-Id-Created'?: 'true';
+    /** The visitor's browser User-Agent, used by the API for device detection. */
+    readonly 'User-Agent'?: string;
+    /** @deprecated Never populated; the visitor's value is under `User-Agent`. */
     readonly 'Prepr-User-Agent'?: string;
     readonly 'Prepr-Package'?: string;
 }

package/dist/nextjs/index.d.ts

@@ -119,6 +119,9 @@ interface PreprHeaders {
     readonly 'Prepr-Visitor-IP'?: string;
     readonly 'Prepr-Hubspot-Id'?: string;
     readonly 'Prepr-Customer-Id-Created'?: 'true';
+    /** The visitor's browser User-Agent, used by the API for device detection. */
+    readonly 'User-Agent'?: string;
+    /** @deprecated Never populated; the visitor's value is under `User-Agent`. */
     readonly 'Prepr-User-Agent'?: string;
     readonly 'Prepr-Package'?: string;
 }

package/dist/nextjs/index.js

@@ -2,7 +2,7 @@
 import { NextResponse } from "next/server";
 
 // src/version.ts
-var VERSION = "0.4.2";
+var VERSION = "0.5.0-rc.1";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -97,7 +97,7 @@ function processFrameworkRequest(request, opts, framework) {
   }
   const userAgent = request.headers.get("user-agent");
   if (userAgent) {
-    requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
+    requestHeaders.set("User-Agent", sanitizeHeaderValue(userAgent));
   }
   const packageParts = [`@preprio/toolkit@${opts?.version ?? VERSION}`];
   if (framework) packageParts.push(`framework=${framework}`);
@@ -262,7 +262,7 @@ var PREPR_HEADER_KEYS = [
   "Prepr-Visitor-IP",
   "Prepr-Hubspot-Id",
   "Prepr-Customer-Id-Created",
-  "Prepr-User-Agent",
+  "User-Agent",
   "Prepr-Package"
 ];
 function getPreprHeadersFromHeaders(headers2) {

package/dist/nuxt/index.cjs

@@ -35,7 +35,7 @@ __export(nuxt_exports, {
 module.exports = __toCommonJS(nuxt_exports);
 
 // src/version.ts
-var VERSION = "0.4.2";
+var VERSION = "0.5.0-rc.1";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -144,7 +144,7 @@ function processFrameworkRequest(request, opts, framework) {
   }
   const userAgent = request.headers.get("user-agent");
   if (userAgent) {
-    requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
+    requestHeaders.set("User-Agent", sanitizeHeaderValue(userAgent));
   }
   const packageParts = [`@preprio/toolkit@${opts?.version ?? VERSION}`];
   if (framework) packageParts.push(`framework=${framework}`);
@@ -296,7 +296,7 @@ var PREPR_HEADER_KEYS = [
   "Prepr-Visitor-IP",
   "Prepr-Hubspot-Id",
   "Prepr-Customer-Id-Created",
-  "Prepr-User-Agent",
+  "User-Agent",
   "Prepr-Package"
 ];
 function getPreprHeadersFromHeaders(headers) {

package/dist/nuxt/index.d.cts

@@ -59,6 +59,9 @@ interface PreprHeaders {
     readonly 'Prepr-Visitor-IP'?: string;
     readonly 'Prepr-Hubspot-Id'?: string;
     readonly 'Prepr-Customer-Id-Created'?: 'true';
+    /** The visitor's browser User-Agent, used by the API for device detection. */
+    readonly 'User-Agent'?: string;
+    /** @deprecated Never populated; the visitor's value is under `User-Agent`. */
     readonly 'Prepr-User-Agent'?: string;
     readonly 'Prepr-Package'?: string;
 }

package/dist/nuxt/index.d.ts

@@ -59,6 +59,9 @@ interface PreprHeaders {
     readonly 'Prepr-Visitor-IP'?: string;
     readonly 'Prepr-Hubspot-Id'?: string;
     readonly 'Prepr-Customer-Id-Created'?: 'true';
+    /** The visitor's browser User-Agent, used by the API for device detection. */
+    readonly 'User-Agent'?: string;
+    /** @deprecated Never populated; the visitor's value is under `User-Agent`. */
     readonly 'Prepr-User-Agent'?: string;
     readonly 'Prepr-Package'?: string;
 }

package/dist/nuxt/index.js

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "0.4.2";
+var VERSION = "0.5.0-rc.1";
 
 // src/core/constants.ts
 var COOKIE_PREVIEW_MODE = "Prepr-Preview-Mode";
@@ -108,7 +108,7 @@ function processFrameworkRequest(request, opts, framework) {
   }
   const userAgent = request.headers.get("user-agent");
   if (userAgent) {
-    requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
+    requestHeaders.set("User-Agent", sanitizeHeaderValue(userAgent));
   }
   const packageParts = [`@preprio/toolkit@${opts?.version ?? VERSION}`];
   if (framework) packageParts.push(`framework=${framework}`);
@@ -260,7 +260,7 @@ var PREPR_HEADER_KEYS = [
   "Prepr-Visitor-IP",
   "Prepr-Hubspot-Id",
   "Prepr-Customer-Id-Created",
-  "Prepr-User-Agent",
+  "User-Agent",
   "Prepr-Package"
 ];
 function getPreprHeadersFromHeaders(headers) {

package/dist/{pixel-Wsfvw9G2.d.cts → pixel-e1fUWl2Y.d.cts}

@@ -108,7 +108,7 @@ interface PreprToolbarProps {
 interface PreprToolbarComponentProps extends PreprToolbarProps {
     options?: PreprPreviewOptions;
 }
-type PreprHeaderName = 'prepr-customer-id' | 'Prepr-Segments' | 'Prepr-ABtesting' | 'Prepr-User-Agent';
+type PreprHeaderName = 'prepr-customer-id' | 'Prepr-Segments' | 'Prepr-ABtesting' | 'User-Agent' | 'Prepr-User-Agent';
 type PreprVariant = 'A' | 'B';
 type PreprEnvironment = 'preview' | 'production';
 type PreprEventType = 'segment_changed' | 'variant_changed' | 'edit_mode_toggled' | 'preview_mode_toggled' | 'getScrollPosition' | 'loaded' | 'field_edit_requested';
@@ -126,6 +126,9 @@ interface PreprHeaders {
     readonly 'Prepr-Visitor-IP'?: string;
     readonly 'Prepr-Hubspot-Id'?: string;
     readonly 'Prepr-Customer-Id-Created'?: 'true';
+    /** The visitor's browser User-Agent, used by the API for device detection. */
+    readonly 'User-Agent'?: string;
+    /** @deprecated Never populated; the visitor's value is under `User-Agent`. */
     readonly 'Prepr-User-Agent'?: string;
     readonly 'Prepr-Package'?: string;
 }