@rozenite/network-activity-plugin 1.9.0 → 1.11.0

package/dist/devtools/assets/{App-m6xge0az.css → App-xppYUJvX.css}

@@ -541,6 +541,48 @@ video {
   background-color: hsl(var(--background));
   color: hsl(var(--foreground));
 }
+.container {
+  width: 100%;
+}
+@media (min-width: 640px) {
+
+  .container {
+    max-width: 640px;
+  }
+}
+@media (min-width: 768px) {
+
+  .container {
+    max-width: 768px;
+  }
+}
+@media (min-width: 1024px) {
+
+  .container {
+    max-width: 1024px;
+  }
+}
+@media (min-width: 1280px) {
+
+  .container {
+    max-width: 1280px;
+  }
+}
+@media (min-width: 1536px) {
+
+  .container {
+    max-width: 1536px;
+  }
+}
+.pointer-events-none {
+  pointer-events: none;
+}
+.visible {
+  visibility: visible;
+}
+.collapse {
+  visibility: collapse;
+}
 .absolute {
   position: absolute;
 }
@@ -550,12 +592,38 @@ video {
 .sticky {
   position: sticky;
 }
+.inset-0 {
+  inset: 0px;
+}
+.inset-x-0 {
+  left: 0px;
+  right: 0px;
+}
+.inset-y-0 {
+  top: 0px;
+  bottom: 0px;
+}
+.bottom-0 {
+  bottom: 0px;
+}
+.bottom-1 {
+  bottom: 0.25rem;
+}
+.left-1 {
+  left: 0.25rem;
+}
 .left-2 {
   left: 0.5rem;
 }
+.right-1 {
+  right: 0.25rem;
+}
 .top-0 {
   top: 0px;
 }
+.top-1 {
+  top: 0.25rem;
+}
 .z-10 {
   z-index: 10;
 }
@@ -579,6 +647,9 @@ video {
   margin-top: 0.25rem;
   margin-bottom: 0.25rem;
 }
+.-ml-5 {
+  margin-left: -1.25rem;
+}
 .mb-2 {
   margin-bottom: 0.5rem;
 }
@@ -609,15 +680,24 @@ video {
 .ms-2 {
   margin-inline-start: 0.5rem;
 }
+.mt-0\.5 {
+  margin-top: 0.125rem;
+}
 .mt-1 {
   margin-top: 0.25rem;
 }
 .mt-2 {
   margin-top: 0.5rem;
 }
+.block {
+  display: block;
+}
 .inline-block {
   display: inline-block;
 }
+.inline {
+  display: inline;
+}
 .flex {
   display: flex;
 }
@@ -630,6 +710,9 @@ video {
 .grid {
   display: grid;
 }
+.hidden {
+  display: none;
+}
 .h-10 {
   height: 2.5rem;
 }
@@ -669,6 +752,9 @@ video {
 .h-\[1px\] {
   height: 1px;
 }
+.h-\[500px\] {
+  height: 500px;
+}
 .h-full {
   height: 100%;
 }
@@ -681,6 +767,9 @@ video {
 .max-h-96 {
   max-height: 24rem;
 }
+.max-h-\[400px\] {
+  max-height: 400px;
+}
 .min-h-0 {
   min-height: 0px;
 }
@@ -714,6 +803,9 @@ video {
 .w-8 {
   width: 2rem;
 }
+.w-80 {
+  width: 20rem;
+}
 .w-\[1px\] {
   width: 1px;
 }
@@ -729,6 +821,9 @@ video {
 .max-w-24 {
   max-width: 6rem;
 }
+.max-w-full {
+  max-width: 100%;
+}
 .max-w-xs {
   max-width: 20rem;
 }
@@ -772,11 +867,17 @@ video {
      -moz-user-select: none;
           user-select: none;
 }
+.grid-cols-1 {
+  grid-template-columns: repeat(1, minmax(0, 1fr));
+}
 .grid-cols-2 {
   grid-template-columns: repeat(2, minmax(0, 1fr));
 }
-.grid-cols-5 {
-  grid-template-columns: repeat(5, minmax(0, 1fr));
+.grid-cols-4 {
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+}
+.grid-cols-6 {
+  grid-template-columns: repeat(6, minmax(0, 1fr));
 }
 .grid-cols-\[minmax\(7rem\2c 25\%\)_minmax\(3rem\2c 1fr\)\] {
   grid-template-columns: minmax(7rem,25%) minmax(3rem,1fr);
@@ -784,6 +885,9 @@ video {
 .flex-col {
   flex-direction: column;
 }
+.items-start {
+  align-items: flex-start;
+}
 .items-center {
   align-items: center;
 }
@@ -799,6 +903,9 @@ video {
 .gap-2 {
   gap: 0.5rem;
 }
+.gap-3 {
+  gap: 0.75rem;
+}
 .gap-4 {
   gap: 1rem;
 }
@@ -846,6 +953,9 @@ video {
 .overflow-y-auto {
   overflow-y: auto;
 }
+.overscroll-contain {
+  overscroll-behavior: contain;
+}
 .truncate {
   overflow: hidden;
   text-overflow: ellipsis;
@@ -884,6 +994,10 @@ video {
 .border {
   border-width: 1px;
 }
+.border-x {
+  border-left-width: 1px;
+  border-right-width: 1px;
+}
 .border-b {
   border-bottom-width: 1px;
 }
@@ -896,6 +1010,9 @@ video {
 .border-t {
   border-top-width: 1px;
 }
+.border-blue-300\/70 {
+  border-color: rgb(147 197 253 / 0.7);
+}
 .border-blue-500\/50 {
   border-color: rgb(59 130 246 / 0.5);
 }
@@ -921,9 +1038,16 @@ video {
   --tw-border-opacity: 1;
   border-color: rgb(192 132 252 / var(--tw-border-opacity, 1));
 }
+.border-red-900\/70 {
+  border-color: rgb(127 29 29 / 0.7);
+}
 .border-transparent {
   border-color: transparent;
 }
+.border-violet-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(139 92 246 / var(--tw-border-opacity, 1));
+}
 .border-yellow-400 {
   --tw-border-opacity: 1;
   border-color: rgb(250 204 21 / var(--tw-border-opacity, 1));
@@ -937,6 +1061,15 @@ video {
 .bg-background {
   background-color: hsl(var(--background));
 }
+.bg-blue-400\/10 {
+  background-color: rgb(96 165 250 / 0.1);
+}
+.bg-blue-400\/15 {
+  background-color: rgb(96 165 250 / 0.15);
+}
+.bg-blue-500\/30 {
+  background-color: rgb(59 130 246 / 0.3);
+}
 .bg-blue-600 {
   --tw-bg-opacity: 1;
   background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
@@ -953,6 +1086,18 @@ video {
 .bg-destructive {
   background-color: hsl(var(--destructive));
 }
+.bg-gray-200 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
+}
+.bg-gray-400 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1));
+}
+.bg-gray-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1));
+}
 .bg-gray-600 {
   --tw-bg-opacity: 1;
   background-color: rgb(75 85 99 / var(--tw-bg-opacity, 1));
@@ -965,10 +1110,20 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(31 41 55 / var(--tw-bg-opacity, 1));
 }
+.bg-gray-800\/60 {
+  background-color: rgb(31 41 55 / 0.6);
+}
 .bg-gray-900 {
   --tw-bg-opacity: 1;
   background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
 }
+.bg-gray-900\/95 {
+  background-color: rgb(17 24 39 / 0.95);
+}
+.bg-gray-950 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(3 7 18 / var(--tw-bg-opacity, 1));
+}
 .bg-green-600 {
   --tw-bg-opacity: 1;
   background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));
@@ -991,6 +1146,13 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
 }
+.bg-red-400 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(248 113 113 / var(--tw-bg-opacity, 1));
+}
+.bg-red-950\/30 {
+  background-color: rgb(69 10 10 / 0.3);
+}
 .bg-secondary {
   background-color: hsl(var(--secondary));
 }
@@ -998,6 +1160,10 @@ video {
   --tw-bg-opacity: 1;
   background-color: rgb(196 181 253 / var(--tw-bg-opacity, 1));
 }
+.bg-white {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
+}
 .bg-yellow-600 {
   --tw-bg-opacity: 1;
   background-color: rgb(202 138 4 / var(--tw-bg-opacity, 1));
@@ -1005,12 +1171,22 @@ video {
 .fill-current {
   fill: currentColor;
 }
+.object-contain {
+  -o-object-fit: contain;
+     object-fit: contain;
+}
 .p-0 {
   padding: 0px;
 }
+.p-0\.5 {
+  padding: 0.125rem;
+}
 .p-1 {
   padding: 0.25rem;
 }
+.p-1\.5 {
+  padding: 0.375rem;
+}
 .p-2 {
   padding: 0.5rem;
 }
@@ -1023,6 +1199,10 @@ video {
 .p-\[1px\] {
   padding: 1px;
 }
+.px-1 {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
 .px-1\.5 {
   padding-left: 0.375rem;
   padding-right: 0.375rem;
@@ -1115,12 +1295,27 @@ video {
 .italic {
   font-style: italic;
 }
+.tabular-nums {
+  --tw-numeric-spacing: tabular-nums;
+  font-variant-numeric: var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);
+}
+.leading-snug {
+  line-height: 1.375;
+}
 .tracking-wide {
   letter-spacing: 0.025em;
 }
 .tracking-widest {
   letter-spacing: 0.1em;
 }
+.text-amber-400 {
+  --tw-text-opacity: 1;
+  color: rgb(251 191 36 / var(--tw-text-opacity, 1));
+}
+.text-blue-100 {
+  --tw-text-opacity: 1;
+  color: rgb(219 234 254 / var(--tw-text-opacity, 1));
+}
 .text-blue-300 {
   --tw-text-opacity: 1;
   color: rgb(147 197 253 / var(--tw-text-opacity, 1));
@@ -1196,6 +1391,14 @@ video {
   --tw-text-opacity: 1;
   color: rgb(168 85 247 / var(--tw-text-opacity, 1));
 }
+.text-red-200 {
+  --tw-text-opacity: 1;
+  color: rgb(254 202 202 / var(--tw-text-opacity, 1));
+}
+.text-red-300 {
+  --tw-text-opacity: 1;
+  color: rgb(252 165 165 / var(--tw-text-opacity, 1));
+}
 .text-red-400 {
   --tw-text-opacity: 1;
   color: rgb(248 113 113 / var(--tw-text-opacity, 1));
@@ -1207,6 +1410,10 @@ video {
 .text-secondary-foreground {
   color: hsl(var(--secondary-foreground));
 }
+.text-violet-200 {
+  --tw-text-opacity: 1;
+  color: rgb(221 214 254 / var(--tw-text-opacity, 1));
+}
 .text-violet-300 {
   --tw-text-opacity: 1;
   color: rgb(196 181 253 / var(--tw-text-opacity, 1));
@@ -1241,12 +1448,27 @@ video {
 .outline {
   outline-style: solid;
 }
+.ring-1 {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.ring-blue-300 {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(147 197 253 / var(--tw-ring-opacity, 1));
+}
+.ring-offset-1 {
+  --tw-ring-offset-width: 1px;
+}
 .ring-offset-background {
   --tw-ring-offset-color: hsl(var(--background));
 }
 .ring-offset-blue-500 {
   --tw-ring-offset-color: #3b82f6;
 }
+.ring-offset-gray-950 {
+  --tw-ring-offset-color: #030712;
+}
 .\!filter {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
 }
@@ -1263,6 +1485,11 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
   transition-duration: 150ms;
 }
+.transition-opacity {
+  transition-property: opacity;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
 @keyframes enter {
 
   from {
@@ -1304,6 +1531,14 @@ video {
   --tw-text-opacity: 1;
   color: rgb(156 163 175 / var(--tw-text-opacity, 1));
 }
+.placeholder\:text-gray-500::-moz-placeholder {
+  --tw-text-opacity: 1;
+  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
+}
+.placeholder\:text-gray-500::placeholder {
+  --tw-text-opacity: 1;
+  color: rgb(107 114 128 / var(--tw-text-opacity, 1));
+}
 .placeholder\:text-muted-foreground::-moz-placeholder {
   color: hsl(var(--muted-foreground));
 }
@@ -1339,6 +1574,9 @@ video {
 .hover\:bg-secondary\/80:hover {
   background-color: hsl(var(--secondary) / 0.8);
 }
+.hover\:bg-violet-900\/40:hover {
+  background-color: rgb(76 29 149 / 0.4);
+}
 .hover\:text-accent-foreground:hover {
   color: hsl(var(--accent-foreground));
 }
@@ -1369,6 +1607,9 @@ video {
 .hover\:underline:hover {
   text-decoration-line: underline;
 }
+.hover\:opacity-80:hover {
+  opacity: 0.8;
+}
 .focus\:bg-gray-700:focus {
   --tw-bg-opacity: 1;
   background-color: rgb(55 65 81 / var(--tw-bg-opacity, 1));
@@ -1416,6 +1657,9 @@ video {
 .disabled\:opacity-50:disabled {
   opacity: 0.5;
 }
+.disabled\:hover\:bg-transparent:hover:disabled {
+  background-color: transparent;
+}
 .group:hover .group-hover\:opacity-100 {
   opacity: 1;
 }

package/dist/react-native/chunks/boot-recording.cjs

@@ -213,6 +213,13 @@ function isJsonContentType(contentType) {
   const mimeType = normalizeContentType(contentType);
   return mimeType === "application/json" || mimeType.endsWith("+json");
 }
+function isXmlContentType(contentType) {
+  if (!contentType) {
+    return false;
+  }
+  const mimeType = normalizeContentType(contentType);
+  return mimeType === "application/xml" || mimeType === "text/xml" || mimeType.endsWith("+xml");
+}
 const isBlob = (value) => value instanceof Blob;
 const isArrayBuffer = (value) => value instanceof ArrayBuffer || ArrayBuffer.isView(value);
 const isFormData = (value) => value instanceof FormData;
@@ -327,6 +334,30 @@ const getResponseSize = (request) => {
     return null;
   }
 };
+const BINARY_CAPTURE_SIZE_CAP = 5 * 1024 * 1024;
+const readBlobAsText = (blob) => new Promise((resolve) => {
+  const reader = new FileReader();
+  reader.onload = () => resolve(reader.result);
+  reader.readAsText(blob);
+});
+const readBlobAsBase64 = (blob) => new Promise((resolve) => {
+  const reader = new FileReader();
+  reader.onload = () => {
+    const dataUrl = reader.result;
+    resolve(dataUrl.substring(dataUrl.indexOf(",") + 1));
+  };
+  reader.readAsDataURL(blob);
+});
+const ARRAY_BUFFER_BASE64_CHUNK = 32768;
+const arrayBufferToBase64 = (buffer) => {
+  const bytes = new Uint8Array(buffer);
+  let binary = "";
+  for (let i = 0; i < bytes.length; i += ARRAY_BUFFER_BASE64_CHUNK) {
+    const chunk = bytes.subarray(i, i + ARRAY_BUFFER_BASE64_CHUNK);
+    binary += String.fromCharCode.apply(null, chunk);
+  }
+  return btoa(binary);
+};
 const getResponseBody = async (request) => {
   const responseType = request.responseType;
   if (responseType === "" || responseType === "text") {
@@ -334,35 +365,128 @@ const getResponseBody = async (request) => {
   }
   if (responseType === "blob") {
     const contentType = request.getResponseHeader("Content-Type") || "";
-    if (contentType.startsWith("text/") || isJsonContentType(contentType)) {
-      return new Promise((resolve) => {
-        const reader = new FileReader();
-        reader.onload = () => {
-          resolve(reader.result);
-        };
-        reader.readAsText(request.response);
-      });
+    if (contentType.startsWith("text/") || isJsonContentType(contentType) || isXmlContentType(contentType)) {
+      return readBlobAsText(request.response);
+    }
+    const blob = request.response;
+    if (blob.size > BINARY_CAPTURE_SIZE_CAP) {
+      return { kind: "binary-too-large", size: blob.size };
+    }
+    return { kind: "binary", base64: await readBlobAsBase64(blob) };
+  }
+  if (responseType === "arraybuffer") {
+    const buffer = request.response;
+    if (!buffer || buffer.byteLength === 0) {
+      return null;
     }
+    if (buffer.byteLength > BINARY_CAPTURE_SIZE_CAP) {
+      return { kind: "binary-too-large", size: buffer.byteLength };
+    }
+    return { kind: "binary", base64: arrayBufferToBase64(buffer) };
   }
   if (responseType === "json") {
     return safeStringify(request.response);
   }
   return null;
 };
+const STACK_PREVIEW_FRAME_LIMIT = 8;
+const INITIATOR_STACK_FRAME_OFFSET = 3;
+const parseStackLocation = (location) => {
+  const match = location.match(/^(.*):(\d+):(\d+)$/);
+  if (!match) {
+    return null;
+  }
+  return {
+    url: match[1],
+    lineNumber: Number.parseInt(match[2], 10),
+    columnNumber: Number.parseInt(match[3], 10)
+  };
+};
+const normalizeFunctionName = (functionName) => {
+  const trimmedFunctionName = functionName?.trim();
+  return trimmedFunctionName && trimmedFunctionName !== "<anonymous>" && trimmedFunctionName !== "anonymous" && trimmedFunctionName !== "<unknown>" ? trimmedFunctionName : void 0;
+};
+const parseStackFrame = (line) => {
+  const trimmedLine = line.trim();
+  if (!trimmedLine) {
+    return null;
+  }
+  let functionName;
+  let location;
+  const v8FunctionFrame = trimmedLine.match(/^at\s+(.*?)\s+\((.*)\)$/);
+  if (v8FunctionFrame) {
+    functionName = v8FunctionFrame[1];
+    location = v8FunctionFrame[2];
+  } else {
+    const v8LocationFrame = trimmedLine.match(/^at\s+(.*)$/);
+    const jscFrame = trimmedLine.match(/^(.*?)@(.*)$/);
+    if (v8LocationFrame) {
+      location = v8LocationFrame[1];
+    } else if (jscFrame) {
+      functionName = jscFrame[1];
+      location = jscFrame[2];
+    }
+  }
+  if (!location) {
+    return null;
+  }
+  const parsedLocation = parseStackLocation(location);
+  if (!parsedLocation) {
+    return null;
+  }
+  return {
+    functionName: normalizeFunctionName(functionName),
+    ...parsedLocation
+  };
+};
+const toGeneratedStackFrame = (frame) => ({
+  functionName: frame.functionName,
+  generatedUrl: frame.url,
+  generatedLineNumber: frame.lineNumber,
+  generatedColumnNumber: frame.columnNumber
+});
+const getGeneratedFrameLocation = (frame) => ({
+  url: frame.generatedUrl ?? frame.url,
+  lineNumber: frame.generatedLineNumber ?? frame.lineNumber,
+  columnNumber: frame.generatedColumnNumber ?? frame.columnNumber
+});
+const canSymbolicateStack = (stack) => stack?.some(
+  (frame) => getGeneratedFrameLocation(frame).url?.startsWith("http")
+) ?? false;
+const getStackPreview = (frames) => {
+  const callerFrames = frames.slice(INITIATOR_STACK_FRAME_OFFSET);
+  return (callerFrames.length > 0 ? callerFrames : frames).slice(
+    0,
+    STACK_PREVIEW_FRAME_LIMIT
+  );
+};
 const getInitiatorFromStack = () => {
   try {
     const stack = new Error().stack;
     if (!stack) {
       return { type: "other" };
     }
-    const line = stack.split("\n")[9];
-    const match = line.match(/at\s+(.+?)\s+\((.+?):(\d+):(\d+)\)/);
-    if (match) {
+    const parsedFrames = stack.split("\n").map(parseStackFrame).filter((frame) => frame !== null);
+    const stackPreview = getStackPreview(parsedFrames);
+    const initiatorFrame = stackPreview[0];
+    const generatedStackPreview = stackPreview.map(toGeneratedStackFrame);
+    if (initiatorFrame?.url) {
       return {
         type: "script",
-        url: match[2],
-        lineNumber: parseInt(match[3]),
-        columnNumber: parseInt(match[4])
+        functionName: initiatorFrame.functionName,
+        generatedUrl: initiatorFrame.url,
+        generatedLineNumber: initiatorFrame.lineNumber,
+        generatedColumnNumber: initiatorFrame.columnNumber,
+        stack: generatedStackPreview,
+        symbolicationStatus: canSymbolicateStack(generatedStackPreview) ? "pending" : "unavailable"
+      };
+    }
+    if (parsedFrames.length > 0) {
+      const fallbackStack = stackPreview.map(toGeneratedStackFrame);
+      return {
+        type: "other",
+        stack: fallbackStack,
+        symbolicationStatus: canSymbolicateStack(fallbackStack) ? "pending" : "unavailable"
       };
     }
   } catch {