@preprio/toolkit 0.2.0-beta.7 → 0.2.0-beta.9

package/dist/astro/index.cjs

@@ -30,7 +30,7 @@ __export(astro_exports, {
 module.exports = __toCommonJS(astro_exports);
 
 // src/version.ts
-var VERSION = "0.2.0-beta.7";
+var VERSION = "0.2.0-beta.9";
 
 // src/core/features.ts
 function isEnabled(config) {
@@ -100,7 +100,11 @@ function getPreprHeadersFromHeaders(headers) {
 }
 function validatePreprToken(token) {
   if (!token) {
-    throw new PreprError("Token is required", "MISSING_TOKEN", "validatePreprToken");
+    throw new PreprError(
+      "Token is required",
+      "MISSING_TOKEN",
+      "validatePreprToken"
+    );
   }
   if (!token.startsWith("https://")) {
     throw new PreprError(
@@ -222,7 +226,11 @@ function parseCookies(request) {
     const name = part.slice(0, eq).trim();
     const value = part.slice(eq + 1).trim();
     if (!name) continue;
-    cookies.set(name, decodeURIComponent(value));
+    try {
+      cookies.set(name, decodeURIComponent(value));
+    } catch {
+      cookies.set(name, value);
+    }
   }
   return cookies;
 }
@@ -261,7 +269,10 @@ function processPreprRequest(request, opts) {
   if (userAgent) {
     requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
   }
-  requestHeaders.set("Prepr-Package", `@preprio/toolkit@${opts?.version ?? VERSION}`);
+  requestHeaders.set(
+    "Prepr-Package",
+    `@preprio/toolkit@${opts?.version ?? VERSION}`
+  );
   const ip = request.headers.get("Cf-Connecting-Ip") ?? request.headers.get("x-real-ip");
   if (ip) {
     requestHeaders.set("Prepr-Visitor-IP", sanitizeHeaderValue(ip));
@@ -270,7 +281,7 @@ function processPreprRequest(request, opts) {
   if (hutkCookie) {
     requestHeaders.set("Prepr-Hubspot-Id", sanitizeHeaderValue(hutkCookie));
   }
-  let uid = requestCookies.get(COOKIE_UID);
+  let uid = sanitizeHeaderValue(requestCookies.get(COOKIE_UID) ?? "");
   if (!uid) {
     uid = crypto.randomUUID();
     responseCookies.push({
@@ -346,7 +357,10 @@ function processPreprRequest(request, opts) {
 
 // src/astro/index.ts
 async function onPreprRequest(context, next, options) {
-  const { requestHeaders, responseCookies } = processPreprRequest(context.request, options);
+  const { requestHeaders, responseCookies } = processPreprRequest(
+    context.request,
+    options
+  );
   requestHeaders.forEach((value, key) => {
     context.request.headers.set(key, value);
   });

package/dist/astro/index.d.cts

@@ -90,7 +90,7 @@ type AstroNext = () => Promise<Response>;
  * Astro middleware entry point: computes the Prepr headers/cookies for this
  * request, forwards the headers downstream and sets the cookies on the response.
  *
- * Astro hands downstream code the same `Request` instance we get here, so the
+ * Astro hands downstream code the same `Request` instance this middleware receives, so the
  * headers are mutated in place — building a new `Request` would go nowhere,
  * there's no way to hand a replacement back out of middleware.
  */

package/dist/astro/index.d.ts

@@ -90,7 +90,7 @@ type AstroNext = () => Promise<Response>;
  * Astro middleware entry point: computes the Prepr headers/cookies for this
  * request, forwards the headers downstream and sets the cookies on the response.
  *
- * Astro hands downstream code the same `Request` instance we get here, so the
+ * Astro hands downstream code the same `Request` instance this middleware receives, so the
  * headers are mutated in place — building a new `Request` would go nowhere,
  * there's no way to hand a replacement back out of middleware.
  */

package/dist/astro/index.js

@@ -1,5 +1,5 @@
 // src/version.ts
-var VERSION = "0.2.0-beta.7";
+var VERSION = "0.2.0-beta.9";
 
 // src/core/features.ts
 function isEnabled(config) {
@@ -69,7 +69,11 @@ function getPreprHeadersFromHeaders(headers) {
 }
 function validatePreprToken(token) {
   if (!token) {
-    throw new PreprError("Token is required", "MISSING_TOKEN", "validatePreprToken");
+    throw new PreprError(
+      "Token is required",
+      "MISSING_TOKEN",
+      "validatePreprToken"
+    );
   }
   if (!token.startsWith("https://")) {
     throw new PreprError(
@@ -191,7 +195,11 @@ function parseCookies(request) {
     const name = part.slice(0, eq).trim();
     const value = part.slice(eq + 1).trim();
     if (!name) continue;
-    cookies.set(name, decodeURIComponent(value));
+    try {
+      cookies.set(name, decodeURIComponent(value));
+    } catch {
+      cookies.set(name, value);
+    }
   }
   return cookies;
 }
@@ -230,7 +238,10 @@ function processPreprRequest(request, opts) {
   if (userAgent) {
     requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
   }
-  requestHeaders.set("Prepr-Package", `@preprio/toolkit@${opts?.version ?? VERSION}`);
+  requestHeaders.set(
+    "Prepr-Package",
+    `@preprio/toolkit@${opts?.version ?? VERSION}`
+  );
   const ip = request.headers.get("Cf-Connecting-Ip") ?? request.headers.get("x-real-ip");
   if (ip) {
     requestHeaders.set("Prepr-Visitor-IP", sanitizeHeaderValue(ip));
@@ -239,7 +250,7 @@ function processPreprRequest(request, opts) {
   if (hutkCookie) {
     requestHeaders.set("Prepr-Hubspot-Id", sanitizeHeaderValue(hutkCookie));
   }
-  let uid = requestCookies.get(COOKIE_UID);
+  let uid = sanitizeHeaderValue(requestCookies.get(COOKIE_UID) ?? "");
   if (!uid) {
     uid = crypto.randomUUID();
     responseCookies.push({
@@ -315,7 +326,10 @@ function processPreprRequest(request, opts) {
 
 // src/astro/index.ts
 async function onPreprRequest(context, next, options) {
-  const { requestHeaders, responseCookies } = processPreprRequest(context.request, options);
+  const { requestHeaders, responseCookies } = processPreprRequest(
+    context.request,
+    options
+  );
   requestHeaders.forEach((value, key) => {
     context.request.headers.set(key, value);
   });

package/dist/{chunk-P6VTLWM4.js → chunk-JVUG6S4O.js}

@@ -142,9 +142,7 @@ function decodeStega(str) {
     const match = str.match(/{"origin.*?}/);
     if (match) {
       try {
-        const decodedMatch = vercelStegaDecode(
-          match[0]
-        );
+        const decodedMatch = vercelStegaDecode(match[0]);
         if (decodedMatch?.href) {
           return decodedMatch;
         }
@@ -570,8 +568,13 @@ function createStegaController(opts) {
         overlay.hide();
       }
     }, 16);
-    document.addEventListener("mousemove", throttledMouseMove);
-    window.addEventListener("scroll", handleScroll, { capture: true });
+    document.addEventListener("mousemove", throttledMouseMove, {
+      passive: true
+    });
+    window.addEventListener("scroll", handleScroll, {
+      capture: true,
+      passive: true
+    });
     initialized = true;
     debug5.log("stega controller started");
   };
@@ -1042,7 +1045,10 @@ function u2(e2, t3, n2, o2, i2, u3) {
 }
 
 // src/core/ui/panel.tsx
-function RawSvg({ svg, className }) {
+function RawSvg({
+  svg,
+  className
+}) {
   return /* @__PURE__ */ u2(
     "span",
     {
@@ -1613,9 +1619,7 @@ var PreprToolbarElement = class extends HTMLElementBase {
     ) ?? null;
   }
   optionsList() {
-    return this.shadowRoot?.querySelector(
-      '[data-prepr="options"]'
-    ) ?? null;
+    return this.shadowRoot?.querySelector('[data-prepr="options"]') ?? null;
   }
   onListboxKeydown(event) {
     const e2 = event;
@@ -1991,7 +1995,9 @@ function createChangeHandler(deps) {
       }
       setCookie(COOKIE_PREVIEW_MODE, String(after.previewMode), cookieOpts());
       setCookie(COOKIE_TOOLBAR_OPEN, "false", cookieOpts());
-      sendPreprEvent("preview_mode_toggled", { previewMode: after.previewMode });
+      sendPreprEvent("preview_mode_toggled", {
+        previewMode: after.previewMode
+      });
       if (!after.isIframe) {
         const [path, existing] = splitPath(deps.currentPath());
         const params = new URLSearchParams(existing);
@@ -2133,9 +2139,13 @@ function createPreprPreview(opts = {}) {
   const bridge = createIframeBridge(store, {
     allowedEditorOrigins: options?.allowedEditorOrigins
   });
-  sendPreprEvent("getScrollPosition", { value: 0 }, {
-    allowUntrustedTarget: true
-  });
+  sendPreprEvent(
+    "getScrollPosition",
+    { value: 0 },
+    {
+      allowUntrustedTarget: true
+    }
+  );
   if (isIframe) {
     bridge.start();
   }

package/dist/index.cjs

@@ -44,7 +44,7 @@ __export(src_exports, {
 module.exports = __toCommonJS(src_exports);
 
 // src/version.ts
-var VERSION = "0.2.0-beta.7";
+var VERSION = "0.2.0-beta.9";
 
 // src/core/features.ts
 function isEnabled(config) {
@@ -393,9 +393,7 @@ function decodeStega(str) {
     const match = str.match(/{"origin.*?}/);
     if (match) {
       try {
-        const decodedMatch = (0, import_stega.vercelStegaDecode)(
-          match[0]
-        );
+        const decodedMatch = (0, import_stega.vercelStegaDecode)(match[0]);
         if (decodedMatch?.href) {
           return decodedMatch;
         }
@@ -923,8 +921,13 @@ function createStegaController(opts) {
         overlay.hide();
       }
     }, 16);
-    document.addEventListener("mousemove", throttledMouseMove);
-    window.addEventListener("scroll", handleScroll, { capture: true });
+    document.addEventListener("mousemove", throttledMouseMove, {
+      passive: true
+    });
+    window.addEventListener("scroll", handleScroll, {
+      capture: true,
+      passive: true
+    });
     initialized = true;
     debug6.log("stega controller started");
   };
@@ -1067,7 +1070,9 @@ function createChangeHandler(deps) {
       }
       setCookie(COOKIE_PREVIEW_MODE, String(after.previewMode), cookieOpts());
       setCookie(COOKIE_TOOLBAR_OPEN, "false", cookieOpts());
-      sendPreprEvent("preview_mode_toggled", { previewMode: after.previewMode });
+      sendPreprEvent("preview_mode_toggled", {
+        previewMode: after.previewMode
+      });
       if (!after.isIframe) {
         const [path, existing] = splitPath(deps.currentPath());
         const params = new URLSearchParams(existing);
@@ -1388,7 +1393,10 @@ function u2(e2, t3, n2, o2, i2, u3) {
 }
 
 // src/core/ui/panel.tsx
-function RawSvg({ svg, className }) {
+function RawSvg({
+  svg,
+  className
+}) {
   return /* @__PURE__ */ u2(
     "span",
     {
@@ -1959,9 +1967,7 @@ var PreprToolbarElement = class extends HTMLElementBase {
     ) ?? null;
   }
   optionsList() {
-    return this.shadowRoot?.querySelector(
-      '[data-prepr="options"]'
-    ) ?? null;
+    return this.shadowRoot?.querySelector('[data-prepr="options"]') ?? null;
   }
   onListboxKeydown(event) {
     const e2 = event;
@@ -2181,9 +2187,13 @@ function createPreprPreview(opts = {}) {
   const bridge = createIframeBridge(store, {
     allowedEditorOrigins: options?.allowedEditorOrigins
   });
-  sendPreprEvent("getScrollPosition", { value: 0 }, {
-    allowUntrustedTarget: true
-  });
+  sendPreprEvent(
+    "getScrollPosition",
+    { value: 0 },
+    {
+      allowUntrustedTarget: true
+    }
+  );
   if (isIframe) {
     bridge.start();
   }
@@ -2252,7 +2262,11 @@ function getPreprHeadersFromHeaders(headers) {
 }
 function validatePreprToken(token) {
   if (!token) {
-    throw new PreprError("Token is required", "MISSING_TOKEN", "validatePreprToken");
+    throw new PreprError(
+      "Token is required",
+      "MISSING_TOKEN",
+      "validatePreprToken"
+    );
   }
   if (!token.startsWith("https://")) {
     throw new PreprError(
@@ -2379,7 +2393,11 @@ function parseCookies(request) {
     const name = part.slice(0, eq).trim();
     const value = part.slice(eq + 1).trim();
     if (!name) continue;
-    cookies.set(name, decodeURIComponent(value));
+    try {
+      cookies.set(name, decodeURIComponent(value));
+    } catch {
+      cookies.set(name, value);
+    }
   }
   return cookies;
 }
@@ -2418,7 +2436,10 @@ function processPreprRequest(request, opts) {
   if (userAgent) {
     requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
   }
-  requestHeaders.set("Prepr-Package", `@preprio/toolkit@${opts?.version ?? VERSION}`);
+  requestHeaders.set(
+    "Prepr-Package",
+    `@preprio/toolkit@${opts?.version ?? VERSION}`
+  );
   const ip = request.headers.get("Cf-Connecting-Ip") ?? request.headers.get("x-real-ip");
   if (ip) {
     requestHeaders.set("Prepr-Visitor-IP", sanitizeHeaderValue(ip));
@@ -2427,7 +2448,7 @@ function processPreprRequest(request, opts) {
   if (hutkCookie) {
     requestHeaders.set("Prepr-Hubspot-Id", sanitizeHeaderValue(hutkCookie));
   }
-  let uid = requestCookies.get(COOKIE_UID);
+  let uid = sanitizeHeaderValue(requestCookies.get(COOKIE_UID) ?? "");
   if (!uid) {
     uid = crypto.randomUUID();
     responseCookies.push({

package/dist/index.d.cts

@@ -5,7 +5,7 @@ export { g as PreprEnvironment, h as PreprEventType, i as PreprFeatureConfig, j
  * 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.2.0-beta.7";
+declare const VERSION = "0.2.0-beta.9";
 
 /**
  * Resolve a `PreprFeatures` bag to plain booleans, defaulting every omitted key

package/dist/index.d.ts

@@ -5,7 +5,7 @@ export { g as PreprEnvironment, h as PreprEventType, i as PreprFeatureConfig, j
  * 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.2.0-beta.7";
+declare const VERSION = "0.2.0-beta.9";
 
 /**
  * Resolve a `PreprFeatures` bag to plain booleans, defaulting every omitted key

package/dist/index.js

@@ -17,10 +17,10 @@ import {
   setTrackingParam,
   stegaClean,
   trackEvent
-} from "./chunk-P6VTLWM4.js";
+} from "./chunk-JVUG6S4O.js";
 
 // src/version.ts
-var VERSION = "0.2.0-beta.7";
+var VERSION = "0.2.0-beta.9";
 
 // src/core/server.ts
 var PreprError = class extends Error {
@@ -72,7 +72,11 @@ function getPreprHeadersFromHeaders(headers) {
 }
 function validatePreprToken(token) {
   if (!token) {
-    throw new PreprError("Token is required", "MISSING_TOKEN", "validatePreprToken");
+    throw new PreprError(
+      "Token is required",
+      "MISSING_TOKEN",
+      "validatePreprToken"
+    );
   }
   if (!token.startsWith("https://")) {
     throw new PreprError(
@@ -199,7 +203,11 @@ function parseCookies(request) {
     const name = part.slice(0, eq).trim();
     const value = part.slice(eq + 1).trim();
     if (!name) continue;
-    cookies.set(name, decodeURIComponent(value));
+    try {
+      cookies.set(name, decodeURIComponent(value));
+    } catch {
+      cookies.set(name, value);
+    }
   }
   return cookies;
 }
@@ -238,7 +246,10 @@ function processPreprRequest(request, opts) {
   if (userAgent) {
     requestHeaders.set("Prepr-User-Agent", sanitizeHeaderValue(userAgent));
   }
-  requestHeaders.set("Prepr-Package", `@preprio/toolkit@${opts?.version ?? VERSION}`);
+  requestHeaders.set(
+    "Prepr-Package",
+    `@preprio/toolkit@${opts?.version ?? VERSION}`
+  );
   const ip = request.headers.get("Cf-Connecting-Ip") ?? request.headers.get("x-real-ip");
   if (ip) {
     requestHeaders.set("Prepr-Visitor-IP", sanitizeHeaderValue(ip));
@@ -247,7 +258,7 @@ function processPreprRequest(request, opts) {
   if (hutkCookie) {
     requestHeaders.set("Prepr-Hubspot-Id", sanitizeHeaderValue(hutkCookie));
   }
-  let uid = requestCookies.get(COOKIE_UID);
+  let uid = sanitizeHeaderValue(requestCookies.get(COOKIE_UID) ?? "");
   if (!uid) {
     uid = crypto.randomUUID();
     responseCookies.push({

package/dist/nextjs/components.cjs

@@ -369,9 +369,7 @@ function decodeStega(str) {
     const match = str.match(/{"origin.*?}/);
     if (match) {
       try {
-        const decodedMatch = (0, import_stega.vercelStegaDecode)(
-          match[0]
-        );
+        const decodedMatch = (0, import_stega.vercelStegaDecode)(match[0]);
         if (decodedMatch?.href) {
           return decodedMatch;
         }
@@ -899,8 +897,13 @@ function createStegaController(opts) {
         overlay.hide();
       }
     }, 16);
-    document.addEventListener("mousemove", throttledMouseMove);
-    window.addEventListener("scroll", handleScroll, { capture: true });
+    document.addEventListener("mousemove", throttledMouseMove, {
+      passive: true
+    });
+    window.addEventListener("scroll", handleScroll, {
+      capture: true,
+      passive: true
+    });
     initialized = true;
     debug6.log("stega controller started");
   };
@@ -1043,7 +1046,9 @@ function createChangeHandler(deps) {
       }
       setCookie(COOKIE_PREVIEW_MODE, String(after.previewMode), cookieOpts());
       setCookie(COOKIE_TOOLBAR_OPEN, "false", cookieOpts());
-      sendPreprEvent("preview_mode_toggled", { previewMode: after.previewMode });
+      sendPreprEvent("preview_mode_toggled", {
+        previewMode: after.previewMode
+      });
       if (!after.isIframe) {
         const [path, existing] = splitPath(deps.currentPath());
         const params = new URLSearchParams(existing);
@@ -1364,7 +1369,10 @@ function u2(e2, t3, n2, o2, i2, u3) {
 }
 
 // src/core/ui/panel.tsx
-function RawSvg({ svg, className }) {
+function RawSvg({
+  svg,
+  className
+}) {
   return /* @__PURE__ */ u2(
     "span",
     {
@@ -1935,9 +1943,7 @@ var PreprToolbarElement = class extends HTMLElementBase {
     ) ?? null;
   }
   optionsList() {
-    return this.shadowRoot?.querySelector(
-      '[data-prepr="options"]'
-    ) ?? null;
+    return this.shadowRoot?.querySelector('[data-prepr="options"]') ?? null;
   }
   onListboxKeydown(event) {
     const e2 = event;
@@ -2157,9 +2163,13 @@ function createPreprPreview(opts = {}) {
   const bridge = createIframeBridge(store, {
     allowedEditorOrigins: options?.allowedEditorOrigins
   });
-  sendPreprEvent("getScrollPosition", { value: 0 }, {
-    allowUntrustedTarget: true
-  });
+  sendPreprEvent(
+    "getScrollPosition",
+    { value: 0 },
+    {
+      allowUntrustedTarget: true
+    }
+  );
   if (isIframe) {
     bridge.start();
   }
@@ -2237,13 +2247,15 @@ function PreprToolbar({
 }) {
   const router = (0, import_navigation.useRouter)();
   const pathname = (0, import_navigation.usePathname)();
+  const pathnameRef = (0, import_react2.useRef)(pathname);
+  pathnameRef.current = pathname;
   (0, import_react2.useEffect)(() => {
     const toolbar = createPreprPreview({
       props,
       options,
       navigation: {
         navigate: (url) => router.push(url),
-        currentPath: () => pathname + window.location.search
+        currentPath: () => pathnameRef.current + window.location.search
       }
     });
     return () => toolbar.destroy();

package/dist/nextjs/components.js

@@ -2,11 +2,11 @@
 import {
   createPreprPreview,
   loadTrackingPixel
-} from "../chunk-P6VTLWM4.js";
+} from "../chunk-JVUG6S4O.js";
 
 // src/nextjs/components.ts
 import { usePathname, useRouter } from "next/navigation";
-import { useEffect as useEffect2 } from "react";
+import { useEffect as useEffect2, useRef } from "react";
 
 // src/react/components.ts
 import { useEffect } from "react";
@@ -27,13 +27,15 @@ function PreprToolbar({
 }) {
   const router = useRouter();
   const pathname = usePathname();
+  const pathnameRef = useRef(pathname);
+  pathnameRef.current = pathname;
   useEffect2(() => {
     const toolbar = createPreprPreview({
       props,
       options,
       navigation: {
         navigate: (url) => router.push(url),
-        currentPath: () => pathname + window.location.search
+        currentPath: () => pathnameRef.current + window.location.search
       }
     });
     return () => toolbar.destroy();

package/dist/nextjs/image-loader.cjs

@@ -25,7 +25,10 @@ __export(image_loader_exports, {
 module.exports = __toCommonJS(image_loader_exports);
 var TRANSFORM_SEGMENT = /\/([^/]*\bw_\d+[^/]*)\//;
 var isPositiveInteger = (value) => /^\d+$/.test(value);
-function preprImageLoader({ src, width }) {
+function preprImageLoader({
+  src,
+  width
+}) {
   return src.replace(TRANSFORM_SEGMENT, (match, segment) => {
     const options = segment.split(",").map((pair) => {
       const underscore = pair.indexOf("_");
@@ -36,7 +39,9 @@ function preprImageLoader({ src, width }) {
     const emittedHeight = options.find(([key]) => key === "h");
     if (emittedHeight && isPositiveInteger(emittedHeight[1])) {
       emittedHeight[1] = String(
-        Math.round(width * Number(emittedHeight[1]) / Number(emittedWidth[1]))
+        Math.round(
+          width * Number(emittedHeight[1]) / Number(emittedWidth[1])
+        )
       );
     }
     emittedWidth[1] = String(width);

package/dist/nextjs/image-loader.d.cts

@@ -9,6 +9,6 @@ import { ImageLoaderProps } from 'next/image';
  * neither of which is a ceiling on what the CDN can serve, so capping there
  * would rule out retina.
  */
-declare function preprImageLoader({ src, width }: ImageLoaderProps): string;
+declare function preprImageLoader({ src, width, }: ImageLoaderProps): string;
 
 export { preprImageLoader as default };

package/dist/nextjs/image-loader.d.ts

@@ -9,6 +9,6 @@ import { ImageLoaderProps } from 'next/image';
  * neither of which is a ceiling on what the CDN can serve, so capping there
  * would rule out retina.
  */
-declare function preprImageLoader({ src, width }: ImageLoaderProps): string;
+declare function preprImageLoader({ src, width, }: ImageLoaderProps): string;
 
 export { preprImageLoader as default };

package/dist/nextjs/image-loader.js

@@ -1,7 +1,10 @@
 // src/nextjs/image-loader.ts
 var TRANSFORM_SEGMENT = /\/([^/]*\bw_\d+[^/]*)\//;
 var isPositiveInteger = (value) => /^\d+$/.test(value);
-function preprImageLoader({ src, width }) {
+function preprImageLoader({
+  src,
+  width
+}) {
   return src.replace(TRANSFORM_SEGMENT, (match, segment) => {
     const options = segment.split(",").map((pair) => {
       const underscore = pair.indexOf("_");
@@ -12,7 +15,9 @@ function preprImageLoader({ src, width }) {
     const emittedHeight = options.find(([key]) => key === "h");
     if (emittedHeight && isPositiveInteger(emittedHeight[1])) {
       emittedHeight[1] = String(
-        Math.round(width * Number(emittedHeight[1]) / Number(emittedWidth[1]))
+        Math.round(
+          width * Number(emittedHeight[1]) / Number(emittedWidth[1])
+        )
       );
     }
     emittedWidth[1] = String(width);