reflet-sdk 0.5.1 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/CHANGELOG.md +22 -0
  2. package/README.md +24 -4
  3. package/dist/{client-BWEBWk1k.js → client-DAdWdIFY.js} +17 -13
  4. package/dist/client-DAdWdIFY.js.map +1 -0
  5. package/dist/{client-w4Rkl10y.d.ts → client-DF1fdsSC.d.ts} +3 -1
  6. package/dist/{client-w4Rkl10y.d.ts.map → client-DF1fdsSC.d.ts.map} +1 -1
  7. package/dist/{devtools-layer-EyK7n9w3.js → devtools-layer-D_0UL_Wd.js} +2879 -2717
  8. package/dist/devtools-layer-D_0UL_Wd.js.map +1 -0
  9. package/dist/devtools-next.d.ts +1 -1
  10. package/dist/devtools-next.d.ts.map +1 -1
  11. package/dist/devtools-next.js +1 -1
  12. package/dist/devtools-vite.d.ts +1 -1
  13. package/dist/devtools-vite.d.ts.map +1 -1
  14. package/dist/devtools-vite.js +7 -3
  15. package/dist/devtools-vite.js.map +1 -1
  16. package/dist/feedback.d.ts.map +1 -1
  17. package/dist/feedback.js +51 -34
  18. package/dist/feedback.js.map +1 -1
  19. package/dist/{handler-CHP0m7KF.js → handler-C9tdKcl0.js} +335 -46
  20. package/dist/handler-C9tdKcl0.js.map +1 -0
  21. package/dist/index.d.ts +1 -1
  22. package/dist/index.js +1 -1
  23. package/dist/{options-7KtQZJj8.d.ts → options-CIBazDPp.d.ts} +3 -1
  24. package/dist/options-CIBazDPp.d.ts.map +1 -0
  25. package/dist/{picker-DFfC1uIY.js → picker-C7TkZcBE.js} +60 -44
  26. package/dist/picker-C7TkZcBE.js.map +1 -0
  27. package/dist/{protocol-Bn6Bg_0r.js → protocol-ClqTFzwR.js} +4 -1
  28. package/dist/protocol-ClqTFzwR.js.map +1 -0
  29. package/dist/react.d.ts +1 -1
  30. package/dist/react.d.ts.map +1 -1
  31. package/dist/react.js +43 -49
  32. package/dist/react.js.map +1 -1
  33. package/dist/{z-index-CKxBgZTG.js → z-index-BL0SGZEP.js} +7 -7
  34. package/dist/z-index-BL0SGZEP.js.map +1 -0
  35. package/package.json +3 -2
  36. package/dist/client-BWEBWk1k.js.map +0 -1
  37. package/dist/devtools-layer-EyK7n9w3.js.map +0 -1
  38. package/dist/handler-CHP0m7KF.js.map +0 -1
  39. package/dist/options-7KtQZJj8.d.ts.map +0 -1
  40. package/dist/picker-DFfC1uIY.js.map +0 -1
  41. package/dist/protocol-Bn6Bg_0r.js.map +0 -1
  42. package/dist/z-index-CKxBgZTG.js.map +0 -1
@@ -1,4 +1,4 @@
1
- import { t as DevtoolsServerOptions } from "./options-7KtQZJj8.js";
1
+ import { t as DevtoolsServerOptions } from "./options-CIBazDPp.js";
2
2
  //#region src/devtools/server/handler.d.ts
3
3
  type DevtoolsHandler = (request: Request) => Promise<Response>;
4
4
  //#endregion
@@ -1 +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"}
1
+ {"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"}
@@ -1,4 +1,4 @@
1
- import { t as createDevtoolsHandler } from "./handler-CHP0m7KF.js";
1
+ import { t as createDevtoolsHandler } from "./handler-C9tdKcl0.js";
2
2
  //#region src/devtools/server/next.ts
3
3
  /**
4
4
  * Route handlers for `app/api/reflet-devtools/[...path]/route.ts`. They answer
@@ -1,4 +1,4 @@
1
- import { t as DevtoolsServerOptions } from "./options-7KtQZJj8.js";
1
+ import { t as DevtoolsServerOptions } from "./options-CIBazDPp.js";
2
2
  import { Plugin } from "vite";
3
3
  //#region src/devtools/server/vite.d.ts
4
4
  /** Serves the Reflet devtools route from the Vite dev server; never part of a build. */
@@ -1 +1 @@
1
- {"version":3,"file":"devtools-vite.d.ts","names":[],"sources":["../src/devtools/server/vite.ts"],"mappings":";;;;wBA8EgB,eAAe,UAAS,wBAA6B"}
1
+ {"version":3,"file":"devtools-vite.d.ts","names":[],"sources":["../src/devtools/server/vite.ts"],"mappings":";;;;wBAyFgB,eAAe,UAAS,wBAA6B"}
@@ -1,5 +1,5 @@
1
- import { r as DEVTOOLS_ROUTE_BASE } from "./protocol-Bn6Bg_0r.js";
2
- import { n as errorResponse, t as createDevtoolsHandler } from "./handler-CHP0m7KF.js";
1
+ import { r as DEVTOOLS_ROUTE_BASE } from "./protocol-ClqTFzwR.js";
2
+ import { n as isLoopbackAddress, r as errorResponse, t as createDevtoolsHandler } from "./handler-C9tdKcl0.js";
3
3
  import { loadEnv } from "vite";
4
4
  //#region src/devtools/server/vite.ts
5
5
  const MAX_BODY_BYTES = 1048576;
@@ -15,7 +15,7 @@ async function readBody(request) {
15
15
  return size > MAX_BODY_BYTES ? null : Buffer.concat(chunks).toString("utf8");
16
16
  }
17
17
  function toWebRequest(request, method, body) {
18
- const origin = `http://${request.headers.host ?? "localhost"}`;
18
+ const origin = `${"encrypted" in request.socket && request.socket.encrypted === true ? "https" : "http"}://${request.headers.host ?? "localhost"}`;
19
19
  const url = new URL(request.originalUrl ?? request.url ?? "/", origin);
20
20
  const headers = new Headers();
21
21
  for (const [name, value] of Object.entries(request.headers)) {
@@ -34,6 +34,10 @@ async function sendWebResponse(response, serverResponse) {
34
34
  serverResponse.end(Buffer.from(await response.arrayBuffer()));
35
35
  }
36
36
  async function serveDevtoolsRequest(handler, request, serverResponse) {
37
+ if (!isLoopbackAddress(request.socket.remoteAddress)) {
38
+ await sendWebResponse(errorResponse("Reflet devtools only answers this machine.", 403), serverResponse);
39
+ return;
40
+ }
37
41
  const method = request.method ?? "GET";
38
42
  const body = method !== "GET" && method !== "HEAD" ? await readBody(request) : void 0;
39
43
  if (body === null) {
@@ -1 +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"}
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\";\nimport { isLoopbackAddress } from \"./request-guard\";\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 if (!isLoopbackAddress(request.socket.remoteAddress)) {\n await sendWebResponse(\n errorResponse(\"Reflet devtools only answers this machine.\", 403),\n serverResponse\n );\n return;\n }\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":";;;;AAUA,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,IAAI,CAAC,kBAAkB,QAAQ,OAAO,aAAa,GAAG;EACpD,MAAM,gBACJ,cAAc,8CAA8C,GAAG,GAC/D,cACF;EACA;CACF;CACA,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"}
@@ -1 +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;;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;;;wBCvEY,eAAe,OAAO,sCAAmB,IAAA"}
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;;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 CHANGED
@@ -1,7 +1,7 @@
1
1
  "use client";
2
- import { n as Reflet } from "./client-BWEBWk1k.js";
3
- import { A as TrashIcon, C as MoreIcon, E as SquareIcon, F as SDK_VERSION, 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-DFfC1uIY.js";
4
- import { n as RefletContext, t as REFLET_Z_INDEX } from "./z-index-CKxBgZTG.js";
2
+ import { n as Reflet } from "./client-DAdWdIFY.js";
3
+ 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-C7TkZcBE.js";
4
+ import { n as RefletContext, t as REFLET_Z_INDEX } from "./z-index-BL0SGZEP.js";
5
5
  import { Suspense, lazy, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
6
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
7
7
  import { Slider } from "@base-ui/react/slider";
@@ -163,11 +163,11 @@ function useDetailsPopover() {
163
163
  setOpen(false);
164
164
  summaryRef.current?.focus();
165
165
  };
166
- document.addEventListener("pointerdown", dismissOutside);
166
+ const stopOutsidePress = listenOnPageAndWidget(detailsRef.current, "pointerdown", dismissOutside);
167
167
  const stopListeningToKeys = listenToKeydown(detailsRef.current, dismissWithEscape, true);
168
168
  window.addEventListener("resize", reposition);
169
169
  return () => {
170
- document.removeEventListener("pointerdown", dismissOutside);
170
+ stopOutsidePress();
171
171
  stopListeningToKeys();
172
172
  window.removeEventListener("resize", reposition);
173
173
  };
@@ -1416,7 +1416,8 @@ function useWidgetConfig(props) {
1416
1416
  ]),
1417
1417
  dismissalKey: `reflet-feedback-dismissed:${publicKey ?? "default"}:${user?.id ?? "anonymous"}`,
1418
1418
  dismissForDays: dismissalDuration(props.dismissForDays),
1419
- isAnonymous: !(user || userToken)
1419
+ isAnonymous: !(user || userToken),
1420
+ publicKey: publicKey ?? null
1420
1421
  };
1421
1422
  }
1422
1423
  //#endregion
@@ -1429,8 +1430,13 @@ const RESIZE_DEBOUNCE = 400;
1429
1430
  * page context describing what the reporter currently sees.
1430
1431
  */
1431
1432
  function useCaptureSync(enabled, refresh) {
1433
+ const refreshRef = useRef(refresh);
1434
+ useEffect(() => {
1435
+ refreshRef.current = refresh;
1436
+ });
1432
1437
  useEffect(() => {
1433
1438
  if (!enabled) return;
1439
+ const runRefresh = () => refreshRef.current();
1434
1440
  const history = window.history;
1435
1441
  const originalPush = history.pushState;
1436
1442
  const originalReplace = history.replaceState;
@@ -1438,19 +1444,19 @@ function useCaptureSync(enabled, refresh) {
1438
1444
  const hadOwnReplace = Object.hasOwn(history, "replaceState");
1439
1445
  history.pushState = function pushState(data, unused, url) {
1440
1446
  const result = originalPush.call(history, data, unused, url);
1441
- refresh();
1447
+ runRefresh();
1442
1448
  return result;
1443
1449
  };
1444
1450
  history.replaceState = function replaceState(data, unused, url) {
1445
1451
  const result = originalReplace.call(history, data, unused, url);
1446
- refresh();
1452
+ runRefresh();
1447
1453
  return result;
1448
1454
  };
1449
- window.addEventListener("popstate", refresh);
1455
+ window.addEventListener("popstate", runRefresh);
1450
1456
  let resizeTimer;
1451
1457
  const onResize = () => {
1452
1458
  window.clearTimeout(resizeTimer);
1453
- resizeTimer = window.setTimeout(refresh, RESIZE_DEBOUNCE);
1459
+ resizeTimer = window.setTimeout(runRefresh, RESIZE_DEBOUNCE);
1454
1460
  };
1455
1461
  window.addEventListener("resize", onResize);
1456
1462
  return () => {
@@ -1458,11 +1464,11 @@ function useCaptureSync(enabled, refresh) {
1458
1464
  else Reflect.deleteProperty(history, "pushState");
1459
1465
  if (hadOwnReplace) history.replaceState = originalReplace;
1460
1466
  else Reflect.deleteProperty(history, "replaceState");
1461
- window.removeEventListener("popstate", refresh);
1467
+ window.removeEventListener("popstate", runRefresh);
1462
1468
  window.clearTimeout(resizeTimer);
1463
1469
  window.removeEventListener("resize", onResize);
1464
1470
  };
1465
- }, [enabled, refresh]);
1471
+ }, [enabled]);
1466
1472
  }
1467
1473
  //#endregion
1468
1474
  //#region src/feedback/ui/use-widget-state.ts
@@ -1500,7 +1506,7 @@ function matchesHotkey(event, hotkey, platform = typeof navigator === "undefined
1500
1506
  return event.altKey === expected.alt && event.ctrlKey === expected.ctrl && event.metaKey === expected.meta && event.shiftKey === expected.shift;
1501
1507
  }
1502
1508
  function useWidgetState(props) {
1503
- const { client, dismissalKey, dismissForDays, isAnonymous } = useWidgetConfig(props);
1509
+ const { client, dismissalKey, dismissForDays, isAnonymous, publicKey } = useWidgetConfig(props);
1504
1510
  const [isOpen, setIsOpen] = useState(false);
1505
1511
  const [annotationTrigger, setAnnotationTrigger] = useState(null);
1506
1512
  const [step, setStep] = useState("compose");
@@ -1634,7 +1640,7 @@ function useWidgetState(props) {
1634
1640
  setStep("compose");
1635
1641
  return submission.submit({
1636
1642
  context: {
1637
- ...activeScreenshot?.context ?? collectPageContext({ sdkVersion: "0.5.1" }),
1643
+ ...activeScreenshot?.context ?? collectPageContext({ sdkVersion: "0.6.0" }),
1638
1644
  consoleEvents: consoleRef.current?.events(),
1639
1645
  metadata: props.metadata,
1640
1646
  selections
@@ -1680,6 +1686,7 @@ function useWidgetState(props) {
1680
1686
  message,
1681
1687
  open,
1682
1688
  pendingCapture: gallery.pendingCapture,
1689
+ publicKey,
1683
1690
  removeCapture: gallery.removeCapture,
1684
1691
  requestSubmit,
1685
1692
  retakeCapture: gallery.retakeCapture,
@@ -2093,6 +2100,7 @@ const PICKER_STYLES = `
2093
2100
  //#region src/feedback/ui/styles.ts
2094
2101
  const WIDGET_STYLES = `
2095
2102
  :host {
2103
+ pointer-events: auto;
2096
2104
  --rf-offset: 20px;
2097
2105
  --rf-bg: #ffffff;
2098
2106
  --rf-bg-subtle: rgb(55 53 47 / 4%);
@@ -2281,6 +2289,7 @@ function ShadowPortal({ children, offset, primaryColor, theme }) {
2281
2289
  useEffect(() => {
2282
2290
  const host = document.createElement("div");
2283
2291
  host.setAttribute(WIDGET_MARKER, "");
2292
+ stopClicksAtHost(host);
2284
2293
  const root = host.attachShadow({ mode: "open" });
2285
2294
  const style = document.createElement("style");
2286
2295
  style.textContent = WIDGET_STYLES;
@@ -2306,7 +2315,7 @@ function ShadowPortal({ children, offset, primaryColor, theme }) {
2306
2315
  }
2307
2316
  //#endregion
2308
2317
  //#region src/feedback/widget.tsx
2309
- const DevtoolsLayer = process.env.NODE_ENV === "development" ? lazy(() => import("./devtools-layer-EyK7n9w3.js").then((module) => ({ default: module.DevtoolsLayer }))) : null;
2318
+ const DevtoolsLayer = process.env.NODE_ENV === "development" ? lazy(() => import("./devtools-layer-D_0UL_Wd.js").then((module) => ({ default: module.DevtoolsLayer }))) : null;
2310
2319
  function RefletFeedback(props) {
2311
2320
  const { devtools = true, enabled = true, hotkey = null, offset = 20, position = "bottom-right", theme = "auto" } = props;
2312
2321
  const labels = {
@@ -2334,25 +2343,9 @@ function RefletFeedback(props) {
2334
2343
  position,
2335
2344
  state
2336
2345
  }),
2337
- isOpen && state.step === "annotate" && state.activeScreenshot && /* @__PURE__ */ jsx(Annotator, {
2338
- capture: state.activeScreenshot.image,
2339
- editor: {
2340
- annotations: state.annotations,
2341
- onChange: state.setAnnotations,
2342
- onDone: () => state.setStep("compose"),
2343
- onRetake: state.activeScreenshot.selection ? void 0 : () => {
2344
- state.setStep("compose");
2345
- if (state.activeScreenshot) state.retakeCapture(state.activeScreenshot.id);
2346
- },
2347
- trigger: state.annotationTrigger?.thumbnail
2348
- },
2346
+ /* @__PURE__ */ jsx(WidgetAnnotation, {
2349
2347
  labels,
2350
- note: state.activeScreenshot.selection && {
2351
- comment: state.activeScreenshot.selection.comment ?? "",
2352
- onChange: (comment) => {
2353
- if (state.activeScreenshot) state.setSelectionComment(state.activeScreenshot.id, comment);
2354
- }
2355
- }
2348
+ state
2356
2349
  }),
2357
2350
  isOpen && state.step === "picking" && /* @__PURE__ */ jsx(ElementPicker, {
2358
2351
  labels,
@@ -2363,11 +2356,35 @@ function RefletFeedback(props) {
2363
2356
  fallback: null,
2364
2357
  children: /* @__PURE__ */ jsx(DevtoolsLayer, {
2365
2358
  isWidgetOpen: showsWidget && isOpen,
2366
- position
2359
+ position,
2360
+ publicKey: state.publicKey
2367
2361
  })
2368
2362
  })]
2369
2363
  });
2370
2364
  }
2365
+ function WidgetAnnotation({ labels, state }) {
2366
+ const screenshot = state.activeScreenshot;
2367
+ if (!(state.isOpen && state.step === "annotate" && screenshot !== null && screenshot)) return null;
2368
+ const retake = () => {
2369
+ state.setStep("compose");
2370
+ state.retakeCapture(screenshot.id);
2371
+ };
2372
+ return /* @__PURE__ */ jsx(Annotator, {
2373
+ capture: screenshot.image,
2374
+ editor: {
2375
+ annotations: state.annotations,
2376
+ onChange: state.setAnnotations,
2377
+ onDone: () => state.setStep("compose"),
2378
+ onRetake: screenshot.selection ? void 0 : retake,
2379
+ trigger: state.annotationTrigger?.thumbnail
2380
+ },
2381
+ labels,
2382
+ note: screenshot.selection && {
2383
+ comment: screenshot.selection.comment ?? "",
2384
+ onChange: (comment) => state.setSelectionComment(screenshot.id, comment)
2385
+ }
2386
+ });
2387
+ }
2371
2388
  //#endregion
2372
2389
  export { RefletFeedback, buildElementSelection, captureViewport, collectPageContext, releaseCapture };
2373
2390