reflet-sdk 0.5.0 → 0.5.2

package/dist/devtools-next.d.ts

@@ -1,4 +1,4 @@
-import { t as DevtoolsServerOptions } from "./options-7KtQZJj8.js";
+import { t as DevtoolsServerOptions } from "./options-CIBazDPp.js";
 //#region src/devtools/server/handler.d.ts
 type DevtoolsHandler = (request: Request) => Promise<Response>;
 //#endregion

package/dist/devtools-next.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"devtools-next.d.ts","names":[],"sources":["../src/devtools/server/handler.ts","../src/devtools/server/next.ts"],"mappings":";;KAuBY,mBAAmB,SAAS,YAAY,QAAQ;;;iBClB3C;EACf,KAAK;EACL,MAAM;;;;;;wBAOQ,oBACd,UAAS,wBACR;qBAcU,KAAG;qBACH,MAAI"}
+{"version":3,"file":"devtools-next.d.ts","names":[],"sources":["../src/devtools/server/handler.ts","../src/devtools/server/next.ts"],"mappings":";;KA8BY,mBAAmB,SAAS,YAAY,QAAQ;;;iBCzB3C;EACf,KAAK;EACL,MAAM;;;;;;wBAOQ,oBACd,UAAS,wBACR;qBAcU,KAAG;qBACH,MAAI"}

package/dist/devtools-next.js

@@ -1,4 +1,4 @@
-import { t as createDevtoolsHandler } from "./handler-CHP0m7KF.js";
+import { t as createDevtoolsHandler } from "./handler-CyR6Ht99.js";
 //#region src/devtools/server/next.ts
 /**
 * Route handlers for `app/api/reflet-devtools/[...path]/route.ts`. They answer

package/dist/devtools-vite.d.ts

@@ -1,4 +1,4 @@
-import { t as DevtoolsServerOptions } from "./options-7KtQZJj8.js";
+import { t as DevtoolsServerOptions } from "./options-CIBazDPp.js";
 import { Plugin } from "vite";
 //#region src/devtools/server/vite.d.ts
 /** Serves the Reflet devtools route from the Vite dev server; never part of a build. */

package/dist/devtools-vite.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"devtools-vite.d.ts","names":[],"sources":["../src/devtools/server/vite.ts"],"mappings":";;;;wBA8EgB,eAAe,UAAS,wBAA6B"}
+{"version":3,"file":"devtools-vite.d.ts","names":[],"sources":["../src/devtools/server/vite.ts"],"mappings":";;;;wBAiFgB,eAAe,UAAS,wBAA6B"}

package/dist/devtools-vite.js

@@ -1,5 +1,5 @@
-import { r as DEVTOOLS_ROUTE_BASE } from "./protocol-Bn6Bg_0r.js";
-import { n as errorResponse, t as createDevtoolsHandler } from "./handler-CHP0m7KF.js";
+import { r as DEVTOOLS_ROUTE_BASE } from "./protocol-ClqTFzwR.js";
+import { n as errorResponse, t as createDevtoolsHandler } from "./handler-CyR6Ht99.js";
 import { loadEnv } from "vite";
 //#region src/devtools/server/vite.ts
 const MAX_BODY_BYTES = 1048576;
@@ -15,7 +15,7 @@ async function readBody(request) {
 	return size > MAX_BODY_BYTES ? null : Buffer.concat(chunks).toString("utf8");
 }
 function toWebRequest(request, method, body) {
-	const origin = `http://${request.headers.host ?? "localhost"}`;
+	const origin = `${"encrypted" in request.socket && request.socket.encrypted === true ? "https" : "http"}://${request.headers.host ?? "localhost"}`;
 	const url = new URL(request.originalUrl ?? request.url ?? "/", origin);
 	const headers = new Headers();
 	for (const [name, value] of Object.entries(request.headers)) {

package/dist/devtools-vite.js.map

@@ -1 +1 @@
-{"version":3,"file":"devtools-vite.js","names":[],"sources":["../src/devtools/server/vite.ts"],"sourcesContent":["import type { ServerResponse } from \"node:http\";\nimport { type Connect, loadEnv, type Plugin } from \"vite\";\nimport { DEVTOOLS_ROUTE_BASE } from \"../protocol\";\nimport { createDevtoolsHandler, type DevtoolsHandler } from \"./handler\";\nimport { errorResponse } from \"./json-response\";\nimport type { DevtoolsServerOptions } from \"./options\";\n\nexport type { DevtoolsServerOptions } from \"./options\";\n\nconst MAX_BODY_BYTES = 1_048_576;\nconst ENV_PREFIX = \"REFLET_\";\n\nasync function readBody(\n  request: Connect.IncomingMessage\n): Promise<string | null> {\n  const chunks: Buffer[] = [];\n  let size = 0;\n  for await (const chunk of request) {\n    const buffer = Buffer.isBuffer(chunk) ? chunk : Buffer.from(String(chunk));\n    size += buffer.length;\n    // Keep draining: leaving the loop early destroys the socket before the 413 is sent.\n    if (size <= MAX_BODY_BYTES) {\n      chunks.push(buffer);\n    }\n  }\n  return size > MAX_BODY_BYTES ? null : Buffer.concat(chunks).toString(\"utf8\");\n}\n\nfunction toWebRequest(\n  request: Connect.IncomingMessage,\n  method: string,\n  body: string | undefined\n): Request {\n  const origin = `http://${request.headers.host ?? \"localhost\"}`;\n  const url = new URL(request.originalUrl ?? request.url ?? \"/\", origin);\n  const headers = new Headers();\n  for (const [name, value] of Object.entries(request.headers)) {\n    if (name.startsWith(\":\") || value === undefined) {\n      continue;\n    }\n    for (const item of Array.isArray(value) ? value : [value]) {\n      headers.append(name, item);\n    }\n  }\n  return new Request(url, { body, headers, method });\n}\n\nasync function sendWebResponse(\n  response: Response,\n  serverResponse: ServerResponse\n): Promise<void> {\n  serverResponse.statusCode = response.status;\n  for (const [name, value] of response.headers) {\n    serverResponse.setHeader(name, value);\n  }\n  serverResponse.end(Buffer.from(await response.arrayBuffer()));\n}\n\nasync function serveDevtoolsRequest(\n  handler: DevtoolsHandler,\n  request: Connect.IncomingMessage,\n  serverResponse: ServerResponse\n): Promise<void> {\n  const method = request.method ?? \"GET\";\n  const hasBody = method !== \"GET\" && method !== \"HEAD\";\n  const body = hasBody ? await readBody(request) : undefined;\n  if (body === null) {\n    await sendWebResponse(\n      errorResponse(\"Reflet devtools requests are limited to 1 MB.\", 413),\n      serverResponse\n    );\n    return;\n  }\n  const response = await handler(toWebRequest(request, method, body));\n  await sendWebResponse(response, serverResponse);\n}\n\n/** Serves the Reflet devtools route from the Vite dev server; never part of a build. */\nexport function refletDevtools(options: DevtoolsServerOptions = {}): Plugin {\n  let handler: DevtoolsHandler | null = null;\n\n  return {\n    apply: \"serve\",\n    configResolved(config) {\n      const env = loadEnv(config.mode, config.envDir, ENV_PREFIX);\n      handler = createDevtoolsHandler(\n        { ...options, root: options.root ?? config.root },\n        { ...process.env, ...env }\n      );\n    },\n    configureServer(server) {\n      server.middlewares.use(DEVTOOLS_ROUTE_BASE, (request, response, next) => {\n        if (!handler) {\n          next();\n          return;\n        }\n        serveDevtoolsRequest(handler, request, response).catch(next);\n      });\n    },\n    name: \"reflet-devtools\",\n  };\n}\n"],"mappings":";;;;AASA,MAAM,iBAAiB;AACvB,MAAM,aAAa;AAEnB,eAAe,SACb,SACwB;CACxB,MAAM,SAAmB,CAAC;CAC1B,IAAI,OAAO;CACX,WAAW,MAAM,SAAS,SAAS;EACjC,MAAM,SAAS,OAAO,SAAS,KAAK,IAAI,QAAQ,OAAO,KAAK,OAAO,KAAK,CAAC;EACzE,QAAQ,OAAO;EAEf,IAAI,QAAQ,gBACV,OAAO,KAAK,MAAM;CAEtB;CACA,OAAO,OAAO,iBAAiB,OAAO,OAAO,OAAO,MAAM,CAAC,CAAC,SAAS,MAAM;AAC7E;AAEA,SAAS,aACP,SACA,QACA,MACS;CACT,MAAM,SAAS,UAAU,QAAQ,QAAQ,QAAQ;CACjD,MAAM,MAAM,IAAI,IAAI,QAAQ,eAAe,QAAQ,OAAO,KAAK,MAAM;CACrE,MAAM,UAAU,IAAI,QAAQ;CAC5B,KAAK,MAAM,CAAC,MAAM,UAAU,OAAO,QAAQ,QAAQ,OAAO,GAAG;EAC3D,IAAI,KAAK,WAAW,GAAG,KAAK,UAAU,KAAA,GACpC;EAEF,KAAK,MAAM,QAAQ,MAAM,QAAQ,KAAK,IAAI,QAAQ,CAAC,KAAK,GACtD,QAAQ,OAAO,MAAM,IAAI;CAE7B;CACA,OAAO,IAAI,QAAQ,KAAK;EAAE;EAAM;EAAS;CAAO,CAAC;AACnD;AAEA,eAAe,gBACb,UACA,gBACe;CACf,eAAe,aAAa,SAAS;CACrC,KAAK,MAAM,CAAC,MAAM,UAAU,SAAS,SACnC,eAAe,UAAU,MAAM,KAAK;CAEtC,eAAe,IAAI,OAAO,KAAK,MAAM,SAAS,YAAY,CAAC,CAAC;AAC9D;AAEA,eAAe,qBACb,SACA,SACA,gBACe;CACf,MAAM,SAAS,QAAQ,UAAU;CAEjC,MAAM,OADU,WAAW,SAAS,WAAW,SACxB,MAAM,SAAS,OAAO,IAAI,KAAA;CACjD,IAAI,SAAS,MAAM;EACjB,MAAM,gBACJ,cAAc,iDAAiD,GAAG,GAClE,cACF;EACA;CACF;CAEA,MAAM,gBAAgB,MADC,QAAQ,aAAa,SAAS,QAAQ,IAAI,CAAC,GAClC,cAAc;AAChD;;AAGA,SAAgB,eAAe,UAAiC,CAAC,GAAW;CAC1E,IAAI,UAAkC;CAEtC,OAAO;EACL,OAAO;EACP,eAAe,QAAQ;GACrB,MAAM,MAAM,QAAQ,OAAO,MAAM,OAAO,QAAQ,UAAU;GAC1D,UAAU,sBACR;IAAE,GAAG;IAAS,MAAM,QAAQ,QAAQ,OAAO;GAAK,GAChD;IAAE,GAAG,QAAQ;IAAK,GAAG;GAAI,CAC3B;EACF;EACA,gBAAgB,QAAQ;GACtB,OAAO,YAAY,IAAI,sBAAsB,SAAS,UAAU,SAAS;IACvE,IAAI,CAAC,SAAS;KACZ,KAAK;KACL;IACF;IACA,qBAAqB,SAAS,SAAS,QAAQ,CAAC,CAAC,MAAM,IAAI;GAC7D,CAAC;EACH;EACA,MAAM;CACR;AACF"}
+{"version":3,"file":"devtools-vite.js","names":[],"sources":["../src/devtools/server/vite.ts"],"sourcesContent":["import type { ServerResponse } from \"node:http\";\nimport { type Connect, loadEnv, type Plugin } from \"vite\";\nimport { DEVTOOLS_ROUTE_BASE } from \"../protocol\";\nimport { createDevtoolsHandler, type DevtoolsHandler } from \"./handler\";\nimport { errorResponse } from \"./json-response\";\nimport type { DevtoolsServerOptions } from \"./options\";\n\nexport type { DevtoolsServerOptions } from \"./options\";\n\nconst MAX_BODY_BYTES = 1_048_576;\nconst ENV_PREFIX = \"REFLET_\";\n\nasync function readBody(\n  request: Connect.IncomingMessage\n): Promise<string | null> {\n  const chunks: Buffer[] = [];\n  let size = 0;\n  for await (const chunk of request) {\n    const buffer = Buffer.isBuffer(chunk) ? chunk : Buffer.from(String(chunk));\n    size += buffer.length;\n    // Keep draining: leaving the loop early destroys the socket before the 413 is sent.\n    if (size <= MAX_BODY_BYTES) {\n      chunks.push(buffer);\n    }\n  }\n  return size > MAX_BODY_BYTES ? null : Buffer.concat(chunks).toString(\"utf8\");\n}\n\nfunction toWebRequest(\n  request: Connect.IncomingMessage,\n  method: string,\n  body: string | undefined\n): Request {\n  const isTls =\n    \"encrypted\" in request.socket && request.socket.encrypted === true;\n  const protocol = isTls ? \"https\" : \"http\";\n  const origin = `${protocol}://${request.headers.host ?? \"localhost\"}`;\n  const url = new URL(request.originalUrl ?? request.url ?? \"/\", origin);\n  const headers = new Headers();\n  for (const [name, value] of Object.entries(request.headers)) {\n    if (name.startsWith(\":\") || value === undefined) {\n      continue;\n    }\n    for (const item of Array.isArray(value) ? value : [value]) {\n      headers.append(name, item);\n    }\n  }\n  return new Request(url, { body, headers, method });\n}\n\nasync function sendWebResponse(\n  response: Response,\n  serverResponse: ServerResponse\n): Promise<void> {\n  serverResponse.statusCode = response.status;\n  for (const [name, value] of response.headers) {\n    serverResponse.setHeader(name, value);\n  }\n  serverResponse.end(Buffer.from(await response.arrayBuffer()));\n}\n\nasync function serveDevtoolsRequest(\n  handler: DevtoolsHandler,\n  request: Connect.IncomingMessage,\n  serverResponse: ServerResponse\n): Promise<void> {\n  const method = request.method ?? \"GET\";\n  const hasBody = method !== \"GET\" && method !== \"HEAD\";\n  const body = hasBody ? await readBody(request) : undefined;\n  if (body === null) {\n    await sendWebResponse(\n      errorResponse(\"Reflet devtools requests are limited to 1 MB.\", 413),\n      serverResponse\n    );\n    return;\n  }\n  const response = await handler(toWebRequest(request, method, body));\n  await sendWebResponse(response, serverResponse);\n}\n\n/** Serves the Reflet devtools route from the Vite dev server; never part of a build. */\nexport function refletDevtools(options: DevtoolsServerOptions = {}): Plugin {\n  let handler: DevtoolsHandler | null = null;\n\n  return {\n    apply: \"serve\",\n    configResolved(config) {\n      const env = loadEnv(config.mode, config.envDir, ENV_PREFIX);\n      handler = createDevtoolsHandler(\n        { ...options, root: options.root ?? config.root },\n        { ...process.env, ...env }\n      );\n    },\n    configureServer(server) {\n      server.middlewares.use(DEVTOOLS_ROUTE_BASE, (request, response, next) => {\n        if (!handler) {\n          next();\n          return;\n        }\n        serveDevtoolsRequest(handler, request, response).catch(next);\n      });\n    },\n    name: \"reflet-devtools\",\n  };\n}\n"],"mappings":";;;;AASA,MAAM,iBAAiB;AACvB,MAAM,aAAa;AAEnB,eAAe,SACb,SACwB;CACxB,MAAM,SAAmB,CAAC;CAC1B,IAAI,OAAO;CACX,WAAW,MAAM,SAAS,SAAS;EACjC,MAAM,SAAS,OAAO,SAAS,KAAK,IAAI,QAAQ,OAAO,KAAK,OAAO,KAAK,CAAC;EACzE,QAAQ,OAAO;EAEf,IAAI,QAAQ,gBACV,OAAO,KAAK,MAAM;CAEtB;CACA,OAAO,OAAO,iBAAiB,OAAO,OAAO,OAAO,MAAM,CAAC,CAAC,SAAS,MAAM;AAC7E;AAEA,SAAS,aACP,SACA,QACA,MACS;CAIT,MAAM,SAAS,GAFb,eAAe,QAAQ,UAAU,QAAQ,OAAO,cAAc,OACvC,UAAU,OACR,KAAK,QAAQ,QAAQ,QAAQ;CACxD,MAAM,MAAM,IAAI,IAAI,QAAQ,eAAe,QAAQ,OAAO,KAAK,MAAM;CACrE,MAAM,UAAU,IAAI,QAAQ;CAC5B,KAAK,MAAM,CAAC,MAAM,UAAU,OAAO,QAAQ,QAAQ,OAAO,GAAG;EAC3D,IAAI,KAAK,WAAW,GAAG,KAAK,UAAU,KAAA,GACpC;EAEF,KAAK,MAAM,QAAQ,MAAM,QAAQ,KAAK,IAAI,QAAQ,CAAC,KAAK,GACtD,QAAQ,OAAO,MAAM,IAAI;CAE7B;CACA,OAAO,IAAI,QAAQ,KAAK;EAAE;EAAM;EAAS;CAAO,CAAC;AACnD;AAEA,eAAe,gBACb,UACA,gBACe;CACf,eAAe,aAAa,SAAS;CACrC,KAAK,MAAM,CAAC,MAAM,UAAU,SAAS,SACnC,eAAe,UAAU,MAAM,KAAK;CAEtC,eAAe,IAAI,OAAO,KAAK,MAAM,SAAS,YAAY,CAAC,CAAC;AAC9D;AAEA,eAAe,qBACb,SACA,SACA,gBACe;CACf,MAAM,SAAS,QAAQ,UAAU;CAEjC,MAAM,OADU,WAAW,SAAS,WAAW,SACxB,MAAM,SAAS,OAAO,IAAI,KAAA;CACjD,IAAI,SAAS,MAAM;EACjB,MAAM,gBACJ,cAAc,iDAAiD,GAAG,GAClE,cACF;EACA;CACF;CAEA,MAAM,gBAAgB,MADC,QAAQ,aAAa,SAAS,QAAQ,IAAI,CAAC,GAClC,cAAc;AAChD;;AAGA,SAAgB,eAAe,UAAiC,CAAC,GAAW;CAC1E,IAAI,UAAkC;CAEtC,OAAO;EACL,OAAO;EACP,eAAe,QAAQ;GACrB,MAAM,MAAM,QAAQ,OAAO,MAAM,OAAO,QAAQ,UAAU;GAC1D,UAAU,sBACR;IAAE,GAAG;IAAS,MAAM,QAAQ,QAAQ,OAAO;GAAK,GAChD;IAAE,GAAG,QAAQ;IAAK,GAAG;GAAI,CAC3B;EACF;EACA,gBAAgB,QAAQ;GACtB,OAAO,YAAY,IAAI,sBAAsB,SAAS,UAAU,SAAS;IACvE,IAAI,CAAC,SAAS;KACZ,KAAK;KACL;IACF;IACA,qBAAqB,SAAS,SAAS,QAAQ,CAAC,CAAC,MAAM,IAAI;GAC7D,CAAC;EACH;EACA,MAAM;CACR;AACF"}

package/dist/feedback.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"feedback.d.ts","names":[],"sources":["../src/feedback/types.ts","../src/feedback/core/capture.ts","../src/feedback/core/element-selector.ts","../src/feedback/core/page-context.ts","../src/feedback/widget.tsx"],"mappings":";;cAKM;KAUM,yBAAyB;UAEpB;EACf;EACA;;UAGe;EACf;EACA,KAAK;EACL;;EAEA,SAAS;EACT,OAAO;EACP;EACA,MAAM;;UAGS;EACf,MAAM;EACN;EACA;;EAEA;EACA;;UAce;EACf;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;UAgDe;;EAEf;;EAEA;;EAEA;;;;;EAKA;;EAEA;;EAEA;;EAEA;EACA,SAAS,QAAQ;;EAEjB,WAAW;;EAEX;EACA;EACA,aAAa;IAAU;;EACvB;EACA,YAAY;IAAU;;EACtB;EACA;EACA;EACA;EACA,OAAO;EACP;;;;UC6De;;EAEf,UAAU;EACV;EACA;;EAEA;;;;;;;;;;wBA2GoB,gBACpB,UAAS,iBACR,QAAQ;wBAiDK,eAAe,OAAO;;;;wBCjHtB,sBAAsB,SAAS,UAAU;;;;wBCjMzC,mBAAmB;EACjC;IACE;;;wBCvEY,eAAe,OAAO,sCAAmB,IAAA"}
+{"version":3,"file":"feedback.d.ts","names":[],"sources":["../src/feedback/types.ts","../src/feedback/core/capture.ts","../src/feedback/core/element-selector.ts","../src/feedback/core/page-context.ts","../src/feedback/widget.tsx"],"mappings":";;cAKM;KAUM,yBAAyB;UAEpB;EACf;EACA;;UAGe;EACf;EACA,KAAK;EACL;;EAEA,SAAS;EACT,OAAO;EACP;EACA,MAAM;;UAGS;EACf,MAAM;EACN;EACA;;EAEA;EACA;;UAae;EACf;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;UAgDe;;EAEf;;EAEA;;EAEA;;;;;EAKA;;EAEA;;EAEA;;EAEA;EACA,SAAS,QAAQ;;EAEjB,WAAW;;EAEX;EACA;EACA,aAAa;IAAU;;EACvB;EACA,YAAY;IAAU;;EACtB;EACA;EACA;EACA;EACA,OAAO;EACP;;;;UC8De;;EAEf,UAAU;EACV;EACA;;EAEA;;;;;;;;;;wBA2GoB,gBACpB,UAAS,iBACR,QAAQ;wBAiDK,eAAe,OAAO;;;;wBCjHtB,sBAAsB,SAAS,UAAU;;;;wBCjMzC,mBAAmB;EACjC;IACE;;;wBCtEY,eAAe,OAAO,sCAAmB,IAAA"}

package/dist/feedback.js

@@ -1,6 +1,6 @@
 "use client";
 import { n as Reflet } from "./client-BWEBWk1k.js";
-import { A as TrashIcon, C as MoreIcon, E as SquareIcon, F as SDK_VERSION, G as capturedFromCanvas, I as collectPageContext, K as releaseCapture, L as MAX_SELECTION_COMMENT_LENGTH, M as isDegenerate, N as normalizeRect, O as TargetIcon, P as DEFAULT_WIDGET_LABELS, R as buildElementSelection, S as HighlightIcon, T as SpotlightIcon, U as WIDGET_MARKER, W as captureViewport, _ as ChatIcon, b as CloseIcon, d as SelectionOutline, f as drawAnnotations, g as CameraIcon, h as BlurIcon, j as UndoIcon, k as TextIcon, l as submitWidgetFeedback, m as ArrowIcon, o as attachPreparedScreenshots, p as listenToKeydown, r as useFloatingPosition, s as createFeedbackTransport, t as ElementPicker, v as CheckIcon, w as PencilIcon, x as GripIcon, y as ChevronDownIcon } from "./picker-DDDpVcfr.js";
+import { A as TargetIcon, B as buildElementSelection, C as GripIcon, D as SpotlightIcon, E as PencilIcon, F as normalizeRect, G as WIDGET_MARKER, I as DEFAULT_WIDGET_LABELS, J as releaseCapture, K as captureViewport, L as SDK_VERSION, M as TrashIcon, N as UndoIcon, O as SquareIcon, P as isDegenerate, R as collectPageContext, S as CloseIcon, T as MoreIcon, _ as BlurIcon, b as CheckIcon, d as SelectionOutline, f as drawAnnotations, g as ArrowIcon, h as stopClicksAtHost, j as TextIcon, l as submitWidgetFeedback, m as listenToKeydown, o as attachPreparedScreenshots, p as listenOnPageAndWidget, r as useFloatingPosition, s as createFeedbackTransport, t as ElementPicker, v as CameraIcon, w as HighlightIcon, x as ChevronDownIcon, y as ChatIcon, z as MAX_SELECTION_COMMENT_LENGTH } from "./picker-HLPIR-l6.js";
 import { n as RefletContext, t as REFLET_Z_INDEX } from "./z-index-CKxBgZTG.js";
 import { Suspense, lazy, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -163,11 +163,11 @@ function useDetailsPopover() {
 			setOpen(false);
 			summaryRef.current?.focus();
 		};
-		document.addEventListener("pointerdown", dismissOutside);
+		const stopOutsidePress = listenOnPageAndWidget(detailsRef.current, "pointerdown", dismissOutside);
 		const stopListeningToKeys = listenToKeydown(detailsRef.current, dismissWithEscape, true);
 		window.addEventListener("resize", reposition);
 		return () => {
-			document.removeEventListener("pointerdown", dismissOutside);
+			stopOutsidePress();
 			stopListeningToKeys();
 			window.removeEventListener("resize", reposition);
 		};
@@ -743,45 +743,8 @@ function CaptureSlot({ labels, state }) {
 }
 //#endregion
 //#region src/feedback/core/element-capture.ts
-const MIN_CONTEXT_PADDING = 24;
-const MAX_CONTEXT_WIDTH = 2e3;
-const CLOSE_UP_MAX_WIDTH = 1200;
 const SELECTION_COLOR = "#4f46e5";
 const SELECTION_ANNOTATION_PREFIX = "selection-";
-const OUTLINE_COLOR = "#4f46e5";
-const OUTLINE_GLOW = "#ffffff";
-const OUTLINE_WIDTH = 3;
-const GLOW_WIDTH = 6;
-const DIM_OVERLAY = "rgba(15, 23, 42, 0.45)";
-/**
-* Tightest ancestor that keeps some breathing room around the pick — the zoom
-* stays zoomed instead of growing to a giant section. Only when nothing up
-* the tree clears the minimum does the widest candidate below the cap win.
-*/
-function contextRootFor(element) {
-	const target = element.getBoundingClientRect();
-	const coversAtLeast = (box, margin) => box.left <= target.left - margin && box.right >= target.right + margin && box.top <= target.top - margin && box.bottom >= target.bottom + margin;
-	let tightest = null;
-	let current = element.parentElement;
-	while (current && current !== document.documentElement) {
-		const box = current.getBoundingClientRect();
-		if (coversAtLeast(box, MIN_CONTEXT_PADDING)) return current;
-		tightest ??= box.width < MAX_CONTEXT_WIDTH ? current : null;
-		current = current.parentElement;
-	}
-	return tightest ?? element;
-}
-/** Where the picked element sits inside the context shot, in image pixels. */
-function closeUpGeometry(params) {
-	const scale = params.rootRect.width > 0 ? params.capture.width / params.rootRect.width : 1;
-	return {
-		height: Math.round(params.elementRect.height * scale),
-		scale,
-		width: Math.round(params.elementRect.width * scale),
-		x: Math.round((params.elementRect.left - params.rootRect.left) * scale),
-		y: Math.round((params.elementRect.top - params.rootRect.top) * scale)
-	};
-}
 function isSelectionAnnotation({ id }) {
 	return id.startsWith(SELECTION_ANNOTATION_PREFIX);
 }
@@ -802,70 +765,6 @@ function highlightFor(selection, capture) {
 		tool: "rectangle"
 	};
 }
-function drawZoneOverlay(context, zone) {
-	context.save();
-	context.fillStyle = DIM_OVERLAY;
-	context.beginPath();
-	context.rect(0, 0, context.canvas.width, context.canvas.height);
-	context.rect(zone.x, zone.y, zone.width, zone.height);
-	context.fill("evenodd");
-	for (const [color, width] of [[OUTLINE_GLOW, GLOW_WIDTH], [OUTLINE_COLOR, OUTLINE_WIDTH]]) {
-		context.strokeStyle = color;
-		context.lineWidth = width * zone.scale;
-		context.strokeRect(zone.x, zone.y, zone.width, zone.height);
-	}
-	context.restore();
-}
-function drawCloseUp(capture, zone) {
-	return new Promise((resolve) => {
-		const canvas = document.createElement("canvas");
-		canvas.width = capture.width;
-		canvas.height = capture.height;
-		const context = canvas.getContext("2d");
-		const image = new Image();
-		image.onload = () => {
-			if (!context) {
-				resolve(null);
-				return;
-			}
-			context.drawImage(image, 0, 0, capture.width, capture.height);
-			drawZoneOverlay(context, zone);
-			resolve(capturedFromCanvas(canvas, CLOSE_UP_MAX_WIDTH));
-		};
-		image.onerror = () => resolve(null);
-		image.src = capture.objectUrl;
-	});
-}
-/**
-* Zoomed view of the picked zone: the surrounding area captured for context,
-* everything outside the selection dimmed and the zone framed with a glowing
-* outline — unambiguous to eyes and vision models alike.
-* Falls back to the plain context shot when the overlay cannot be drawn.
-*/
-async function captureElementCloseUp(element) {
-	try {
-		const root = contextRootFor(element);
-		const rootRect = root.getBoundingClientRect();
-		const elementRect = element.getBoundingClientRect();
-		const capture = await captureViewport({
-			element: root,
-			maxWidth: CLOSE_UP_MAX_WIDTH
-		});
-		if (!capture || root === element) return capture;
-		const outlined = await drawCloseUp(capture, closeUpGeometry({
-			capture,
-			elementRect,
-			rootRect
-		}));
-		if (outlined) {
-			releaseCapture(capture);
-			return outlined;
-		}
-		return capture;
-	} catch {
-		return null;
-	}
-}
 //#endregion
 //#region src/feedback/ui/annotation/screenshot-preview.tsx
 function ScreenshotPreview({ annotations, capture }) {
@@ -1372,7 +1271,6 @@ function useFeedbackSubmission(options) {
 //#region src/feedback/ui/state/use-screenshot-drafts.ts
 function releaseDraft(draft) {
 	releaseCapture(draft?.image);
-	releaseCapture(draft?.closeUp);
 }
 function useScreenshotDrafts(captureFailed, onError) {
 	const [screenshots, setScreenshots] = useState([]);
@@ -1474,9 +1372,12 @@ function useScreenshotDrafts(captureFailed, onError) {
 			}
 		} : item));
 	}, []);
+	const activeScreenshot = screenshots.find(({ id }) => id === activeId) ?? screenshots.at(-1) ?? null;
+	const firstCapture = pendingCapture ?? screenshots[0];
 	return {
-		activeScreenshot: screenshots.find(({ id }) => id === activeId) ?? screenshots.at(-1) ?? null,
+		activeScreenshot,
 		cancelPendingCapture,
+		canRefreshAutomatically: screenshots.length <= 1 && firstCapture?.source === "automatic" && (activeScreenshot?.annotations.length ?? 0) === 0 && !screenshots.some((draft) => draft.selection),
 		pendingCapture,
 		refreshAutomatic,
 		removeCapture,
@@ -1515,7 +1416,8 @@ function useWidgetConfig(props) {
 		]),
 		dismissalKey: `reflet-feedback-dismissed:${publicKey ?? "default"}:${user?.id ?? "anonymous"}`,
 		dismissForDays: dismissalDuration(props.dismissForDays),
-		isAnonymous: !(user || userToken)
+		isAnonymous: !(user || userToken),
+		publicKey: publicKey ?? null
 	};
 }
 //#endregion
@@ -1599,7 +1501,7 @@ function matchesHotkey(event, hotkey, platform = typeof navigator === "undefined
 	return event.altKey === expected.alt && event.ctrlKey === expected.ctrl && event.metaKey === expected.meta && event.shiftKey === expected.shift;
 }
 function useWidgetState(props) {
-	const { client, dismissalKey, dismissForDays, isAnonymous } = useWidgetConfig(props);
+	const { client, dismissalKey, dismissForDays, isAnonymous, publicKey } = useWidgetConfig(props);
 	const [isOpen, setIsOpen] = useState(false);
 	const [annotationTrigger, setAnnotationTrigger] = useState(null);
 	const [step, setStep] = useState("compose");
@@ -1645,9 +1547,7 @@ function useWidgetState(props) {
 		partialUploadMessage: props.labels?.attachmentUploadFailed ?? DEFAULT_WIDGET_LABELS.attachmentUploadFailed
 	});
 	const { resetSubmission } = submission;
-	const firstCapture = gallery.pendingCapture ?? gallery.screenshots[0];
-	const canRefreshAutomatically = gallery.screenshots.length <= 1 && firstCapture?.source === "automatic";
-	useCaptureSync(isOpen && !submission.isEditingDisabled && step === "compose" && canRefreshAutomatically && annotations.length === 0 && !gallery.screenshots.some((draft) => draft.selection) && props.captureOnOpen !== false, refreshAutomatic);
+	useCaptureSync(isOpen && !submission.isEditingDisabled && step === "compose" && gallery.canRefreshAutomatically && props.captureOnOpen !== false, refreshAutomatic);
 	const reset = useCallback(() => {
 		if (successTimer.current) clearTimeout(successTimer.current);
 		setAnnotationTrigger(null);
@@ -1700,21 +1600,18 @@ function useWidgetState(props) {
 		setStep("compose");
 		const pick = ++pickRef.current;
 		const context = collectPageContext({ sdkVersion: SDK_VERSION });
-		const [fresh, closeUp] = await Promise.all([captureViewport().catch(() => null), captureElementCloseUp(element).catch(() => null)]);
+		const fresh = await captureViewport().catch(() => null);
 		if (pickRef.current !== pick) {
 			releaseCapture(fresh);
-			releaseCapture(closeUp);
 			return;
 		}
 		setIsElementCapturing(false);
 		if (!fresh) {
-			releaseCapture(closeUp);
 			setError(captureFailed);
 			return;
 		}
 		storeScreenshot({
 			annotations: [highlightFor(picked, fresh)],
-			closeUp,
 			context,
 			id: crypto.randomUUID(),
 			image: fresh,
@@ -1738,7 +1635,7 @@ function useWidgetState(props) {
 		setStep("compose");
 		return submission.submit({
 			context: {
-				...activeScreenshot?.context ?? collectPageContext({ sdkVersion: "0.5.0" }),
+				...activeScreenshot?.context ?? collectPageContext({ sdkVersion: "0.5.2" }),
 				consoleEvents: consoleRef.current?.events(),
 				metadata: props.metadata,
 				selections
@@ -1784,6 +1681,7 @@ function useWidgetState(props) {
 		message,
 		open,
 		pendingCapture: gallery.pendingCapture,
+		publicKey,
 		removeCapture: gallery.removeCapture,
 		requestSubmit,
 		retakeCapture: gallery.retakeCapture,
@@ -2197,6 +2095,7 @@ const PICKER_STYLES = `
 //#region src/feedback/ui/styles.ts
 const WIDGET_STYLES = `
 :host {
+  pointer-events: auto;
   --rf-offset: 20px;
   --rf-bg: #ffffff;
   --rf-bg-subtle: rgb(55 53 47 / 4%);
@@ -2385,6 +2284,7 @@ function ShadowPortal({ children, offset, primaryColor, theme }) {
 	useEffect(() => {
 		const host = document.createElement("div");
 		host.setAttribute(WIDGET_MARKER, "");
+		stopClicksAtHost(host);
 		const root = host.attachShadow({ mode: "open" });
 		const style = document.createElement("style");
 		style.textContent = WIDGET_STYLES;
@@ -2410,7 +2310,7 @@ function ShadowPortal({ children, offset, primaryColor, theme }) {
 }
 //#endregion
 //#region src/feedback/widget.tsx
-const DevtoolsLayer = process.env.NODE_ENV === "development" ? lazy(() => import("./devtools-layer-BYGuFmhg.js").then((module) => ({ default: module.DevtoolsLayer }))) : null;
+const DevtoolsLayer = process.env.NODE_ENV === "development" ? lazy(() => import("./devtools-layer-N5ptXXK4.js").then((module) => ({ default: module.DevtoolsLayer }))) : null;
 function RefletFeedback(props) {
 	const { devtools = true, enabled = true, hotkey = null, offset = 20, position = "bottom-right", theme = "auto" } = props;
 	const labels = {
@@ -2438,25 +2338,9 @@ function RefletFeedback(props) {
 				position,
 				state
 			}),
-			isOpen && state.step === "annotate" && state.activeScreenshot && /* @__PURE__ */ jsx(Annotator, {
-				capture: state.activeScreenshot.image,
-				editor: {
-					annotations: state.annotations,
-					onChange: state.setAnnotations,
-					onDone: () => state.setStep("compose"),
-					onRetake: state.activeScreenshot.selection ? void 0 : () => {
-						state.setStep("compose");
-						if (state.activeScreenshot) state.retakeCapture(state.activeScreenshot.id);
-					},
-					trigger: state.annotationTrigger?.thumbnail
-				},
+			/* @__PURE__ */ jsx(WidgetAnnotation, {
 				labels,
-				note: state.activeScreenshot.selection && {
-					comment: state.activeScreenshot.selection.comment ?? "",
-					onChange: (comment) => {
-						if (state.activeScreenshot) state.setSelectionComment(state.activeScreenshot.id, comment);
-					}
-				}
+				state
 			}),
 			isOpen && state.step === "picking" && /* @__PURE__ */ jsx(ElementPicker, {
 				labels,
@@ -2467,11 +2351,35 @@ function RefletFeedback(props) {
 			fallback: null,
 			children: /* @__PURE__ */ jsx(DevtoolsLayer, {
 				isWidgetOpen: showsWidget && isOpen,
-				position
+				position,
+				publicKey: state.publicKey
 			})
 		})]
 	});
 }
+function WidgetAnnotation({ labels, state }) {
+	const screenshot = state.activeScreenshot;
+	if (!(state.isOpen && state.step === "annotate" && screenshot !== null && screenshot)) return null;
+	const retake = () => {
+		state.setStep("compose");
+		state.retakeCapture(screenshot.id);
+	};
+	return /* @__PURE__ */ jsx(Annotator, {
+		capture: screenshot.image,
+		editor: {
+			annotations: state.annotations,
+			onChange: state.setAnnotations,
+			onDone: () => state.setStep("compose"),
+			onRetake: screenshot.selection ? void 0 : retake,
+			trigger: state.annotationTrigger?.thumbnail
+		},
+		labels,
+		note: screenshot.selection && {
+			comment: screenshot.selection.comment ?? "",
+			onChange: (comment) => state.setSelectionComment(screenshot.id, comment)
+		}
+	});
+}
 //#endregion
 export { RefletFeedback, buildElementSelection, captureViewport, collectPageContext, releaseCapture };