issue-sticker 0.8.1 → 0.9.1

package/dist/{externalUserPayload-D-P1-QaW.js → externalUserPayload-CVYSPfcx.js}

@@ -1,4 +1,4 @@
-import { q as gzip_1, r as record, a as cn, o as useCallbackRef$1, h as useComposedRefs, e as Primitive, P as Presence, i as Portal$1, f as composeEventHandlers, j as createContextScope, k as createSlot, D as DismissableLayer, C as Content, t as createPopperScope, l as useControllableState, v as Root2$1, m as useId, A as Anchor, w as Arrow, b as usePortalContainer, d as OVERLAY_LAYER, s as stopEscapePropagation, n as useLayoutEffect2, V as VISUALLY_HIDDEN_STYLES, c as createLucideIcon, x as clsx, S as Slot$2, O as OVERLAY_LAYER_INDEX, M as MousePointer2 } from "./mouse-pointer-2-BR00y3ir.js";
+import { t as getCanvasSource, v as onCanvasSourceRegistered, C as CANVAS_INTERACTION_TAG, w as gzip_1, R as REPLAY_EVENT_TYPE, x as record, a as cn, p as useCallbackRef$1, i as useComposedRefs, f as Primitive, P as Presence, j as Portal$1, g as composeEventHandlers, k as createContextScope, l as createSlot, D as DismissableLayer, y as Content, z as createPopperScope, m as useControllableState, A as Root2$1, n as useId, B as Anchor, E as Arrow, d as usePortalContainer, e as OVERLAY_LAYER, s as stopEscapePropagation, o as useLayoutEffect2, V as VISUALLY_HIDDEN_STYLES, c as createLucideIcon, F as clsx, S as Slot$2, O as OVERLAY_LAYER_INDEX, M as MousePointer2 } from "./three-_bdgDAmI.js";
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import * as React from "react";
 import React__default, { useState, createContext, useContext, useCallback, useRef, useLayoutEffect, useEffect, useMemo } from "react";
@@ -207,6 +207,17 @@ class ScreenRecordingController {
     this.listeners.forEach((listener) => listener(this.snapshot));
   }
 }
+function forEachElementDeep(root, callback) {
+  if (root instanceof Element) {
+    callback(root);
+    if (root.shadowRoot) {
+      forEachElementDeep(root.shadowRoot, callback);
+    }
+  }
+  Array.from(root.children).forEach((child) => {
+    forEachElementDeep(child, callback);
+  });
+}
 const SESSION_REPLAY_BLOCK_CLASS = "rr-block";
 const SESSION_REPLAY_MASK_CLASS = "rr-mask";
 const SESSION_REPLAY_UNMASK_CLASS = "rr-unmask";
@@ -300,62 +311,6 @@ function resolvePrivacyConfig(override) {
   if (!override) return DEFAULT_PRIVACY_CONFIG_V2;
   return { ...DEFAULT_PRIVACY_CONFIG_V2, ...override };
 }
-function createSegments() {
-  return [{ events: [] }];
-}
-function appendEvent(segments, event, isCheckout) {
-  if (isCheckout) {
-    return [...segments.map((s2) => ({ events: [...s2.events] })), { events: [event] }];
-  }
-  const copy = segments.map((s2) => ({ events: [...s2.events] }));
-  const last = copy[copy.length - 1];
-  if (last) {
-    last.events.push(event);
-  }
-  return copy;
-}
-function trimSegments(segments, windowMs, now, checkoutMs) {
-  var _a, _b;
-  const cutoff = now - windowMs;
-  let startIdx = 0;
-  for (let i2 = 0; i2 < segments.length; i2 += 1) {
-    const seg = segments[i2];
-    const first = seg == null ? void 0 : seg.events[0];
-    if (first && first.timestamp <= cutoff) {
-      startIdx = i2;
-    }
-  }
-  const headStart = (_b = (_a = segments[startIdx]) == null ? void 0 : _a.events[0]) == null ? void 0 : _b.timestamp;
-  if (checkoutMs !== void 0 && headStart !== void 0 && headStart < cutoff - checkoutMs && startIdx < segments.length - 1) {
-    startIdx += 1;
-  }
-  return segments.slice(startIdx);
-}
-function flattenEvents(segments) {
-  return segments.flatMap((s2) => s2.events);
-}
-function dropEventsAfter(segments, cutoff) {
-  return segments.map((s2) => ({ events: s2.events.filter((e2) => e2.timestamp <= cutoff) })).filter((s2) => s2.events.length > 0);
-}
-async function sha256Hex(bytes) {
-  const digest = await crypto.subtle.digest("SHA-256", bytes.buffer);
-  return Array.from(new Uint8Array(digest)).map((b) => b.toString(16).padStart(2, "0")).join("");
-}
-async function serializeSnapshot(input) {
-  const events = (input.redactEvents ?? ((e2) => e2))(flattenEvents(input.segments));
-  const json = JSON.stringify(events);
-  const payload = gzip_1(json);
-  const checksumSha256 = await sha256Hex(payload);
-  return {
-    payload,
-    checksumSha256,
-    windowSeconds: input.windowSeconds,
-    eventCount: events.length,
-    sizeBytes: payload.byteLength,
-    rrwebVersion: input.rrwebVersion,
-    privacyConfigVersion: input.privacyConfigVersion
-  };
-}
 const REDACTED_HEADER_VALUE = "[redacted]";
 const SENSITIVE_HEADER_NAMES = /* @__PURE__ */ new Set([
   "authorization",
@@ -589,260 +544,1523 @@ function redactSensitiveText(text) {
   if (!text) return text;
   return redactSensitiveValues(redactUrlSecrets(redactSensitiveBody(text)));
 }
-const META_EVENT_TYPE = 4;
-const FULL_SNAPSHOT_EVENT_TYPE = 2;
-const INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3;
-const MUTATION_SOURCE = 0;
-const URL_ATTRIBUTES = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "poster", "data", "cite"]);
-function isRecord(value) {
-  return typeof value === "object" && value !== null && !Array.isArray(value);
-}
-function redactAttributeValue(name, value) {
-  if (typeof value !== "string" || !value) return value;
-  return URL_ATTRIBUTES.has(name.toLowerCase()) ? redactUrlSecrets(value) : redactSensitiveValues(value);
+const SCREENSHOT_FULL_MASK_SELECTOR = SESSION_REPLAY_FULL_MASK_SELECTOR;
+const SCREENSHOT_BLOCK_SELECTOR = SESSION_REPLAY_BLOCK_SELECTOR;
+const SCREENSHOT_MASK_BACKGROUND = "rgba(148, 148, 148, 0.28)";
+const SCREENSHOT_BLOCK_BACKGROUND = "rgba(148, 148, 148, 0.85)";
+const MASK_LABEL_WIDTH = 44;
+const MASK_LABEL_HEIGHT = 16;
+const MASK_LABEL_IMAGE = `url("data:image/svg+xml;charset=utf-8,${encodeURIComponent(
+  `<svg xmlns="http://www.w3.org/2000/svg" width="${MASK_LABEL_WIDTH}" height="${MASK_LABEL_HEIGHT}" viewBox="0 0 ${MASK_LABEL_WIDTH} ${MASK_LABEL_HEIGHT}"><text x="${MASK_LABEL_WIDTH / 2}" y="12" text-anchor="middle" font-family="sans-serif" font-size="11" font-weight="600" fill="#262626">가려짐</text></svg>`
+)}")`;
+const MASK_LABEL_MIN_WIDTH = MASK_LABEL_WIDTH + 8;
+const MASK_LABEL_MIN_HEIGHT = MASK_LABEL_HEIGHT + 8;
+const TEXT_HIDING_PROPERTIES = [
+  ["color", "transparent"],
+  ["-webkit-text-fill-color", "transparent"],
+  ["text-shadow", "none"],
+  ["fill", "transparent"]
+];
+const REPLACED_MEDIA_SELECTOR = "img, svg, video, canvas, picture, iframe, object, embed";
+const VALUE_ELEMENT_SELECTOR = "input, textarea, select";
+const SENSITIVE_AUTOCOMPLETE_TOKENS = /* @__PURE__ */ new Set([
+  // 자격증명
+  "current-password",
+  "new-password",
+  "one-time-code",
+  // 결제
+  "cc-number",
+  "cc-exp",
+  "cc-exp-month",
+  "cc-exp-year",
+  "cc-csc",
+  "cc-name",
+  "cc-type",
+  "cc-given-name",
+  "cc-additional-name",
+  "cc-family-name",
+  // 신원
+  "name",
+  "given-name",
+  "additional-name",
+  "family-name",
+  "honorific-prefix",
+  "honorific-suffix",
+  "nickname",
+  "bday",
+  "bday-day",
+  "bday-month",
+  "bday-year",
+  "sex",
+  // 주소
+  "street-address",
+  "address-line1",
+  "address-line2",
+  "address-line3",
+  "postal-code",
+  // 연락처
+  "tel",
+  "tel-national",
+  "tel-local",
+  "tel-area-code",
+  "email",
+  "impp"
+]);
+function redactScreenshotText(text) {
+  return redactEmails(redactSensitiveValues(text));
 }
-function redactAttributes(attributes) {
-  if (!isRecord(attributes)) return;
-  for (const [name, value] of Object.entries(attributes)) {
-    const redacted = redactAttributeValue(name, value);
-    if (redacted !== value) {
-      attributes[name] = redacted;
-    }
+function matchesSafely(element, selector) {
+  try {
+    return element.matches(selector);
+  } catch {
+    return false;
   }
 }
-function redactSerializedNode(node) {
-  if (!isRecord(node)) return;
-  redactAttributes(node.attributes);
-  if (typeof node.textContent === "string" && node.textContent) {
-    const redacted = redactSensitiveValues(node.textContent);
-    if (redacted !== node.textContent) {
-      node.textContent = redacted;
-    }
-  }
-  if (Array.isArray(node.childNodes)) {
-    for (const child of node.childNodes) {
-      redactSerializedNode(child);
-    }
+function closestSafely(element, selector) {
+  if (!element) return null;
+  try {
+    return element.closest(selector);
+  } catch {
+    return null;
   }
 }
-function redactMutationData(data) {
-  if (Array.isArray(data.adds)) {
-    for (const add of data.adds) {
-      if (isRecord(add)) redactSerializedNode(add.node);
-    }
+function hasSensitiveValueHint(element) {
+  var _a;
+  if (((_a = element.getAttribute("type")) == null ? void 0 : _a.toLowerCase()) === "password") {
+    return true;
   }
-  if (Array.isArray(data.attributes)) {
-    for (const mutation of data.attributes) {
-      if (isRecord(mutation)) redactAttributes(mutation.attributes);
+  const autocomplete = element.getAttribute("autocomplete");
+  if (!autocomplete) return false;
+  return autocomplete.toLowerCase().split(/\s+/).some((token) => SENSITIVE_AUTOCOMPLETE_TOKENS.has(token));
+}
+const overwriteProperty = (element, name, value) => {
+  const style = element.style;
+  style == null ? void 0 : style.setProperty(name, value, "important");
+};
+function coverMaskedRegion(region, setProperty) {
+  setProperty(region, "background-color", SCREENSHOT_MASK_BACKGROUND);
+  forEachElementDeep(region, (node) => {
+    if (!isElementFullyMasked(node)) return;
+    TEXT_HIDING_PROPERTIES.forEach(([name, value]) => setProperty(node, name, value));
+    if (matchesSafely(node, REPLACED_MEDIA_SELECTOR)) {
+      setProperty(node, "visibility", "hidden");
     }
+  });
+}
+function parsePixels(value) {
+  const parsed = Number.parseFloat(value ?? "");
+  return Number.isFinite(parsed) ? parsed : 0;
+}
+function fitsMaskLabel(region) {
+  const rect = region.getBoundingClientRect();
+  const style = region.style;
+  const width = rect.width || parsePixels(style == null ? void 0 : style.width);
+  const height = rect.height || parsePixels(style == null ? void 0 : style.height);
+  return width >= MASK_LABEL_MIN_WIDTH && height >= MASK_LABEL_MIN_HEIGHT;
+}
+function coverBlockedRegion(region, setProperty) {
+  const labeled = fitsMaskLabel(region);
+  setProperty(region, "visibility", "visible");
+  setProperty(region, "background-color", SCREENSHOT_BLOCK_BACKGROUND);
+  setProperty(region, "background-image", labeled ? MASK_LABEL_IMAGE : "none");
+  if (labeled) {
+    setProperty(region, "background-repeat", "no-repeat");
+    setProperty(region, "background-position", "center");
+    setProperty(region, "background-size", "auto");
   }
-  if (Array.isArray(data.texts)) {
-    for (const mutation of data.texts) {
-      if (isRecord(mutation) && typeof mutation.value === "string" && mutation.value) {
-        const redacted = redactSensitiveValues(mutation.value);
-        if (redacted !== mutation.value) {
-          mutation.value = redacted;
-        }
-      }
+  TEXT_HIDING_PROPERTIES.forEach(([name, value]) => setProperty(region, name, value));
+  setProperty(region, "pointer-events", "none");
+  forEachElementDeep(region, (descendant) => {
+    if (descendant !== region) {
+      setProperty(descendant, "visibility", "hidden");
     }
-  }
+  });
 }
-function redactReplayEvents(events) {
-  for (const event of events) {
-    const data = event.data;
-    if (!isRecord(data)) continue;
-    if (event.type === META_EVENT_TYPE && typeof data.href === "string") {
-      data.href = redactUrlSecrets(data.href);
-      continue;
-    }
-    if (event.type === FULL_SNAPSHOT_EVENT_TYPE) {
-      redactSerializedNode(data.node);
-      continue;
+function coverPrivateRegions(root, setProperty) {
+  const blocked = [];
+  const masked = [];
+  forEachElementDeep(root, (element) => {
+    if (matchesSafely(element, SCREENSHOT_BLOCK_SELECTOR)) {
+      blocked.push(element);
+      return;
     }
-    if (event.type === INCREMENTAL_SNAPSHOT_EVENT_TYPE && data.source === MUTATION_SOURCE) {
-      redactMutationData(data);
+    if (matchesSafely(element, SCREENSHOT_FULL_MASK_SELECTOR) && isElementFullyMasked(element)) {
+      masked.push(element);
     }
-  }
-  return events;
+  });
+  masked.forEach((region) => coverMaskedRegion(region, setProperty));
+  blocked.forEach((region) => coverBlockedRegion(region, setProperty));
 }
-const RRWEB_VERSION = "2.1.0";
-const SESSION_REPLAY_WINDOW_MS = 12e4;
-const SESSION_REPLAY_CHECKOUT_MS = 6e4;
+function applyScreenshotPrivacyMask(clonedRoot) {
+  coverPrivateRegions(clonedRoot, overwriteProperty);
+  const walker = clonedRoot.ownerDocument.createTreeWalker(clonedRoot, NodeFilter.SHOW_TEXT);
+  for (let node = walker.nextNode(); node; node = walker.nextNode()) {
+    const text = node.nodeValue;
+    if (!text) continue;
+    node.nodeValue = redactScreenshotText(text);
+  }
+  clonedRoot.querySelectorAll(VALUE_ELEMENT_SELECTOR).forEach((element) => {
+    const value = element.getAttribute("value");
+    if (!value) return;
+    const hidden = closestSafely(element, SCREENSHOT_BLOCK_SELECTOR) !== null || isElementFullyMasked(element) || hasSensitiveValueHint(element);
+    element.setAttribute("value", hidden ? "" : redactScreenshotText(value));
+  });
+}
+const FRAME_GRAB_TIMEOUT_MS = 300;
+const PROBE_SIZE = 8;
+function matchesSelfOrAncestor(element, selector) {
+  try {
+    return element.closest(selector) !== null;
+  } catch {
+    return false;
+  }
+}
+function shouldOverlayCanvas(canvas, excludeSelectors) {
+  const rect = canvas.getBoundingClientRect();
+  if (rect.width < 1 || rect.height < 1) {
+    return false;
+  }
+  if (matchesSelfOrAncestor(canvas, SCREENSHOT_BLOCK_SELECTOR) || matchesSelfOrAncestor(canvas, SCREENSHOT_FULL_MASK_SELECTOR)) {
+    return false;
+  }
+  return !excludeSelectors.some((selector) => matchesSelfOrAncestor(canvas, selector));
+}
+function rendersBlank(canvas) {
+  const probe = document.createElement("canvas");
+  probe.width = PROBE_SIZE;
+  probe.height = PROBE_SIZE;
+  const context = probe.getContext("2d", { willReadFrequently: true });
+  if (!context) {
+    return false;
+  }
+  try {
+    context.drawImage(canvas, 0, 0, PROBE_SIZE, PROBE_SIZE);
+    const { data } = context.getImageData(0, 0, PROBE_SIZE, PROBE_SIZE);
+    for (let offset = 4; offset < data.length; offset += 4) {
+      if (data[offset] !== data[0] || data[offset + 1] !== data[1] || data[offset + 2] !== data[2] || data[offset + 3] !== data[3]) {
+        return false;
+      }
+    }
+    return true;
+  } catch {
+    return false;
+  }
+}
+async function grabFrame(canvas) {
+  const FrameGrabber = globalThis.ImageCapture;
+  if (!FrameGrabber || typeof canvas.captureStream !== "function") {
+    return null;
+  }
+  let track;
+  try {
+    track = canvas.captureStream().getVideoTracks()[0];
+    if (!track) {
+      return null;
+    }
+    return await Promise.race([
+      new FrameGrabber(track).grabFrame(),
+      new Promise((resolve) => {
+        setTimeout(() => resolve(null), FRAME_GRAB_TIMEOUT_MS);
+      })
+    ]);
+  } catch {
+    return null;
+  } finally {
+    track == null ? void 0 : track.stop();
+  }
+}
+async function redrawAndGrab(canvas, source) {
+  try {
+    source.redraw();
+    return await createImageBitmap(canvas);
+  } catch {
+    return null;
+  }
+}
+async function grabCanvasFrames(root, excludeSelectors) {
+  const targets = [];
+  forEachElementDeep(root, (element) => {
+    if (!(element instanceof HTMLCanvasElement) || !shouldOverlayCanvas(element, excludeSelectors)) {
+      return;
+    }
+    if (getCanvasSource(element) || rendersBlank(element)) {
+      targets.push(element);
+    }
+  });
+  if (targets.length === 0) {
+    return [];
+  }
+  const frames = await Promise.all(
+    targets.map(async (canvas) => {
+      const source = getCanvasSource(canvas);
+      const bitmap = (source ? await redrawAndGrab(canvas, source) : null) ?? await grabFrame(canvas);
+      return bitmap ? { bitmap, rect: canvas.getBoundingClientRect() } : null;
+    })
+  );
+  return frames.filter((frame) => frame !== null);
+}
+function frameDestRect(rect, origin, scale) {
+  return [
+    (rect.left - origin.x) * scale,
+    (rect.top - origin.y) * scale,
+    rect.width * scale,
+    rect.height * scale
+  ];
+}
+async function overlayCanvasFrames(capture, frames, origin, cssWidth, quality) {
+  let captured = null;
+  try {
+    captured = await createImageBitmap(capture);
+    const output = document.createElement("canvas");
+    output.width = captured.width;
+    output.height = captured.height;
+    const context = output.getContext("2d");
+    if (!context) {
+      return capture;
+    }
+    context.drawImage(captured, 0, 0);
+    const scale = cssWidth > 0 ? captured.width / cssWidth : 1;
+    frames.forEach(({ bitmap, rect }) => {
+      context.drawImage(bitmap, ...frameDestRect(rect, origin, scale));
+    });
+    const blob = await new Promise((resolve) => {
+      output.toBlob(resolve, capture.type || "image/webp", quality);
+    });
+    return blob ?? capture;
+  } catch {
+    return capture;
+  } finally {
+    captured == null ? void 0 : captured.close();
+  }
+}
+const SNAPSHOT_MAX_WIDTH = 640;
+const SNAPSHOT_QUALITY = 0.8;
+const SAMPLE_INTERVAL_MS = 250;
+const SAMPLED_MAX_WIDTH = 480;
+const SAMPLED_QUALITY = 0.6;
+const DRAG_THRESHOLD_PX = 6;
+const DISCRETE_MIN_GAP_MS = 60;
+const SETTLE_TAIL_MS = 300;
+const FINGERPRINT_WIDTH = 32;
+const FINGERPRINT_HEIGHT = 18;
+async function captureSnapshot(canvas, source, maxWidth, quality) {
+  try {
+    if (source) {
+      source.redraw();
+    } else if (rendersBlank(canvas)) {
+      return null;
+    }
+    const bitmap = await createImageBitmap(canvas);
+    try {
+      const scale = Math.min(1, maxWidth / bitmap.width);
+      const output = document.createElement("canvas");
+      output.width = Math.max(1, Math.round(bitmap.width * scale));
+      output.height = Math.max(1, Math.round(bitmap.height * scale));
+      const context = output.getContext("2d");
+      if (!context) {
+        return null;
+      }
+      context.drawImage(bitmap, 0, 0, output.width, output.height);
+      const thumb = document.createElement("canvas");
+      thumb.width = FINGERPRINT_WIDTH;
+      thumb.height = FINGERPRINT_HEIGHT;
+      const thumbContext = thumb.getContext("2d");
+      thumbContext == null ? void 0 : thumbContext.drawImage(bitmap, 0, 0, FINGERPRINT_WIDTH, FINGERPRINT_HEIGHT);
+      const fingerprint = thumbContext ? Array.from(
+        thumbContext.getImageData(0, 0, FINGERPRINT_WIDTH, FINGERPRINT_HEIGHT).data
+      ).join(",") : "";
+      return { dataUrl: output.toDataURL("image/webp", quality), fingerprint };
+    } finally {
+      bitmap.close();
+    }
+  } catch {
+    return null;
+  }
+}
+const FRAME_WAIT_MS = 120;
+function settleFrame() {
+  return new Promise((resolve) => {
+    let done = false;
+    const finish = () => {
+      if (!done) {
+        done = true;
+        resolve();
+      }
+    };
+    requestAnimationFrame(finish);
+    setTimeout(finish, FRAME_WAIT_MS);
+  });
+}
+async function resolveNodeId(canvas) {
+  var _a;
+  try {
+    const { record: record2 } = await import("./three-_bdgDAmI.js").then((n) => n.I);
+    const id = (_a = record2.mirror) == null ? void 0 : _a.getId(canvas);
+    return typeof id === "number" && id > 0 ? id : null;
+  } catch {
+    return null;
+  }
+}
+function canvasIndexOf(canvas) {
+  return Array.prototype.indexOf.call(document.querySelectorAll("canvas"), canvas);
+}
+function startCanvasInteractionTracking(options = {}) {
+  if (typeof document === "undefined") {
+    return Object.assign(() => void 0, { captureBaseline: () => void 0 });
+  }
+  const snapshotMaxWidth = options.snapshotMaxWidth ?? SNAPSHOT_MAX_WIDTH;
+  const sampleIntervalMs = options.sampleIntervalMs ?? SAMPLE_INTERVAL_MS;
+  const lastSnapshot = /* @__PURE__ */ new WeakMap();
+  let pending = null;
+  const emit2 = options.emit ?? ((tag, payload) => {
+    void import("./three-_bdgDAmI.js").then((n) => n.I).then(({ addCustomEvent }) => addCustomEvent(tag, payload));
+  });
+  const pointerOf = (started, rect) => [
+    (started.x - rect.left) / rect.width * 2 - 1,
+    -((started.y - rect.top) / rect.height) * 2 + 1
+  ];
+  const trackedCanvases = () => Array.from(document.querySelectorAll("canvas")).filter((canvas) => {
+    const rect = canvas.getBoundingClientRect();
+    return rect.width >= 1 && rect.height >= 1 && shouldOverlayCanvas(canvas, []);
+  });
+  const emitShot = async (canvas, shot) => {
+    var _a;
+    const source = getCanvasSource(canvas);
+    const snapshot = await captureSnapshot(
+      canvas,
+      source,
+      shot.detail ? snapshotMaxWidth : SAMPLED_MAX_WIDTH,
+      shot.detail ? SNAPSHOT_QUALITY : SAMPLED_QUALITY
+    );
+    if (snapshot && shot.sampled && !shot.baseline && lastSnapshot.get(canvas) === snapshot.fingerprint) {
+      return;
+    }
+    if (snapshot) {
+      lastSnapshot.set(canvas, snapshot.fingerprint);
+    }
+    const cameraMatrix = ((_a = source == null ? void 0 : source.cameraMatrix) == null ? void 0 : _a.call(source)) ?? null;
+    if (!snapshot && !shot.target && !cameraMatrix) {
+      return;
+    }
+    const payload = {
+      kind: shot.kind,
+      target: shot.target,
+      nodeId: await resolveNodeId(canvas),
+      canvasIndex: canvasIndexOf(canvas),
+      pointer: shot.pointer,
+      cameraStartMatrix: shot.cameraStartMatrix,
+      cameraMatrix,
+      snapshot: (snapshot == null ? void 0 : snapshot.dataUrl) ?? null,
+      ...shot.sampled ? { sampled: true } : {},
+      ...shot.baseline ? { baseline: true } : {}
+    };
+    try {
+      emit2(CANVAS_INTERACTION_TAG, payload);
+    } catch {
+    }
+  };
+  const sweep = async (shot) => {
+    for (const canvas of trackedCanvases()) {
+      await emitShot(canvas, {
+        kind: "external",
+        target: null,
+        pointer: null,
+        cameraStartMatrix: null,
+        ...shot
+      });
+    }
+  };
+  let sweeping = false;
+  let pendingSweep = null;
+  const runSweep = async (shot) => {
+    if (sweeping) {
+      pendingSweep = shot;
+      return;
+    }
+    sweeping = true;
+    try {
+      await sweep(shot);
+      while (pendingSweep) {
+        const next = pendingSweep;
+        pendingSweep = null;
+        await sweep(next);
+      }
+    } finally {
+      sweeping = false;
+    }
+  };
+  let sampleTimer = null;
+  let tailTimer = null;
+  let lastDiscreteAt = 0;
+  const clearTimers = () => {
+    if (sampleTimer !== null) {
+      window.clearInterval(sampleTimer);
+      sampleTimer = null;
+    }
+    if (tailTimer !== null) {
+      window.clearTimeout(tailTimer);
+      tailTimer = null;
+    }
+  };
+  const markChanged = () => {
+    if (sampleTimer === null && sampleIntervalMs > 0) {
+      sampleTimer = window.setInterval(() => {
+        void runSweep({ sampled: true, detail: false });
+      }, sampleIntervalMs);
+    }
+    if (tailTimer !== null) {
+      window.clearTimeout(tailTimer);
+    }
+    tailTimer = window.setTimeout(() => {
+      tailTimer = null;
+      if (sampleTimer !== null) {
+        window.clearInterval(sampleTimer);
+        sampleTimer = null;
+      }
+      void (async () => {
+        await settleFrame();
+        await runSweep({ sampled: true, detail: true });
+      })();
+    }, SETTLE_TAIL_MS);
+  };
+  const onPointerDown = (event) => {
+    var _a;
+    const target = event.target;
+    if (!(target instanceof HTMLCanvasElement) || !shouldOverlayCanvas(target, [])) {
+      return;
+    }
+    const source = getCanvasSource(target);
+    pending = {
+      canvas: target,
+      x: event.clientX,
+      y: event.clientY,
+      cameraStartMatrix: ((_a = source == null ? void 0 : source.cameraMatrix) == null ? void 0 : _a.call(source)) ?? null
+    };
+  };
+  const onPointerMove = (event) => {
+    const started = pending;
+    if (!started) {
+      return;
+    }
+    if (Math.hypot(event.clientX - started.x, event.clientY - started.y) <= DRAG_THRESHOLD_PX) {
+      return;
+    }
+    markChanged();
+  };
+  const captureDiscrete = () => {
+    const now = Date.now();
+    if (now - lastDiscreteAt >= DISCRETE_MIN_GAP_MS) {
+      lastDiscreteAt = now;
+      void (async () => {
+        await settleFrame();
+        await runSweep({ sampled: true, detail: false });
+      })();
+    }
+    markChanged();
+  };
+  const onContinuousInput = () => {
+    markChanged();
+  };
+  const onPointerUp = (event) => {
+    var _a;
+    const started = pending;
+    pending = null;
+    if (!started) {
+      captureDiscrete();
+      return;
+    }
+    clearTimers();
+    const source = getCanvasSource(started.canvas);
+    const rect = started.canvas.getBoundingClientRect();
+    if (rect.width < 1 || rect.height < 1) {
+      return;
+    }
+    const moved = Math.hypot(event.clientX - started.x, event.clientY - started.y);
+    const kind = moved > DRAG_THRESHOLD_PX ? "drag" : "click";
+    const target = ((_a = source == null ? void 0 : source.pickTarget) == null ? void 0 : _a.call(source, pointerOf(started, rect))) ?? null;
+    void (async () => {
+      await settleFrame();
+      await emitShot(started.canvas, {
+        kind,
+        target,
+        pointer: pointerOf(started, rect),
+        cameraStartMatrix: started.cameraStartMatrix,
+        sampled: false,
+        detail: true
+      });
+    })();
+    markChanged();
+  };
+  const captureBaseline = () => {
+    void (async () => {
+      await settleFrame();
+      await runSweep({ sampled: true, detail: true, baseline: true });
+    })();
+  };
+  document.addEventListener("pointerdown", onPointerDown, true);
+  document.addEventListener("pointermove", onPointerMove, true);
+  document.addEventListener("pointerup", onPointerUp, true);
+  document.addEventListener("pointercancel", onPointerUp, true);
+  document.addEventListener("input", onContinuousInput, true);
+  document.addEventListener("keydown", onContinuousInput, true);
+  document.addEventListener("change", captureDiscrete, true);
+  const unsubscribeRegistration = onCanvasSourceRegistered((canvas) => {
+    void (async () => {
+      await settleFrame();
+      await emitShot(canvas, {
+        kind: "external",
+        target: null,
+        pointer: null,
+        cameraStartMatrix: null,
+        sampled: true,
+        detail: true,
+        baseline: true
+      });
+    })();
+  });
+  const stop = () => {
+    clearTimers();
+    unsubscribeRegistration();
+    document.removeEventListener("pointerdown", onPointerDown, true);
+    document.removeEventListener("pointermove", onPointerMove, true);
+    document.removeEventListener("pointerup", onPointerUp, true);
+    document.removeEventListener("pointercancel", onPointerUp, true);
+    document.removeEventListener("input", onContinuousInput, true);
+    document.removeEventListener("keydown", onContinuousInput, true);
+    document.removeEventListener("change", captureDiscrete, true);
+    pending = null;
+  };
+  return Object.assign(stop, { captureBaseline });
+}
+function createSegments() {
+  return [{ events: [] }];
+}
+const META_EVENT_TYPE = 4;
+function endsWithBareMeta(segments) {
+  var _a, _b;
+  const events = (_a = segments[segments.length - 1]) == null ? void 0 : _a.events;
+  return (events == null ? void 0 : events.length) === 1 && ((_b = events[0]) == null ? void 0 : _b.type) === META_EVENT_TYPE;
+}
+function appendEvent(segments, event, isCheckout) {
+  if (isCheckout && !endsWithBareMeta(segments)) {
+    return [...segments.map((s2) => ({ events: [...s2.events] })), { events: [event] }];
+  }
+  const copy = segments.map((s2) => ({ events: [...s2.events] }));
+  const last = copy[copy.length - 1];
+  if (last) {
+    last.events.push(event);
+  }
+  return copy;
+}
+function trimSegments(segments, windowMs, now, checkoutMs) {
+  var _a, _b;
+  const cutoff = now - windowMs;
+  let startIdx = 0;
+  for (let i2 = 0; i2 < segments.length; i2 += 1) {
+    const seg = segments[i2];
+    const first = seg == null ? void 0 : seg.events[0];
+    if (first && first.timestamp <= cutoff) {
+      startIdx = i2;
+    }
+  }
+  const headStart = (_b = (_a = segments[startIdx]) == null ? void 0 : _a.events[0]) == null ? void 0 : _b.timestamp;
+  if (checkoutMs !== void 0 && headStart !== void 0 && headStart < cutoff - checkoutMs && startIdx < segments.length - 1) {
+    startIdx += 1;
+  }
+  return segments.slice(startIdx);
+}
+function spanSeconds(segments) {
+  var _a, _b;
+  const events = flattenEvents(segments);
+  const first = (_a = events[0]) == null ? void 0 : _a.timestamp;
+  const last = (_b = events[events.length - 1]) == null ? void 0 : _b.timestamp;
+  if (first === void 0 || last === void 0) return 0;
+  return Math.round((last - first) / 1e3);
+}
+function flattenEvents(segments) {
+  return segments.flatMap((s2) => s2.events);
+}
+function dropEventsAfter(segments, cutoff) {
+  return segments.map((s2) => ({ events: s2.events.filter((e2) => e2.timestamp <= cutoff) })).filter((s2) => s2.events.length > 0);
+}
+const REPLAY_SNAPSHOT_MAX_BYTES = 16 * 1024 * 1024;
+async function sha256Hex$1(bytes) {
+  const digest = await crypto.subtle.digest("SHA-256", bytes.buffer);
+  return Array.from(new Uint8Array(digest)).map((b) => b.toString(16).padStart(2, "0")).join("");
+}
+async function serializeSnapshot(input) {
+  const redact = input.redactEvents ?? ((e2) => e2);
+  const maxBytes = input.maxBytes ?? REPLAY_SNAPSHOT_MAX_BYTES;
+  const compress2 = (segments2) => {
+    const events2 = redact(flattenEvents(segments2));
+    return { events: events2, payload: gzip_1(JSON.stringify(events2)) };
+  };
+  let segments = input.segments;
+  let { events, payload } = compress2(segments);
+  while (payload.byteLength > maxBytes && segments.length > 1) {
+    segments = segments.slice(1);
+    ({ events, payload } = compress2(segments));
+  }
+  const checksumSha256 = await sha256Hex$1(payload);
+  return {
+    payload,
+    checksumSha256,
+    windowSeconds: spanSeconds(segments),
+    eventCount: events.length,
+    sizeBytes: payload.byteLength,
+    rrwebVersion: input.rrwebVersion,
+    privacyConfigVersion: input.privacyConfigVersion
+  };
+}
+const MUTATION_SOURCE = 0;
+const URL_ATTRIBUTES = /* @__PURE__ */ new Set(["href", "src", "action", "formaction", "poster", "data", "cite"]);
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function redactAttributeValue(name, value) {
+  if (typeof value !== "string" || !value) return value;
+  return URL_ATTRIBUTES.has(name.toLowerCase()) ? redactUrlSecrets(value) : redactSensitiveValues(value);
+}
+function redactAttributes(attributes) {
+  if (!isRecord(attributes)) return;
+  for (const [name, value] of Object.entries(attributes)) {
+    const redacted = redactAttributeValue(name, value);
+    if (redacted !== value) {
+      attributes[name] = redacted;
+    }
+  }
+}
+function redactSerializedNode(node) {
+  if (!isRecord(node)) return;
+  redactAttributes(node.attributes);
+  if (typeof node.textContent === "string" && node.textContent) {
+    const redacted = redactSensitiveValues(node.textContent);
+    if (redacted !== node.textContent) {
+      node.textContent = redacted;
+    }
+  }
+  if (Array.isArray(node.childNodes)) {
+    for (const child of node.childNodes) {
+      redactSerializedNode(child);
+    }
+  }
+}
+function redactMutationData(data) {
+  if (Array.isArray(data.adds)) {
+    for (const add of data.adds) {
+      if (isRecord(add)) redactSerializedNode(add.node);
+    }
+  }
+  if (Array.isArray(data.attributes)) {
+    for (const mutation of data.attributes) {
+      if (isRecord(mutation)) redactAttributes(mutation.attributes);
+    }
+  }
+  if (Array.isArray(data.texts)) {
+    for (const mutation of data.texts) {
+      if (isRecord(mutation) && typeof mutation.value === "string" && mutation.value) {
+        const redacted = redactSensitiveValues(mutation.value);
+        if (redacted !== mutation.value) {
+          mutation.value = redacted;
+        }
+      }
+    }
+  }
+}
+function redactReplayEvents(events) {
+  for (const event of events) {
+    const data = event.data;
+    if (!isRecord(data)) continue;
+    if (event.type === REPLAY_EVENT_TYPE.Meta && typeof data.href === "string") {
+      data.href = redactUrlSecrets(data.href);
+      continue;
+    }
+    if (event.type === REPLAY_EVENT_TYPE.FullSnapshot) {
+      redactSerializedNode(data.node);
+      continue;
+    }
+    if (event.type === REPLAY_EVENT_TYPE.IncrementalSnapshot && data.source === MUTATION_SOURCE) {
+      redactMutationData(data);
+    }
+  }
+  return events;
+}
+const RRWEB_VERSION = "2.1.0";
+const SESSION_REPLAY_WINDOW_MS = 12e4;
+const SESSION_REPLAY_CHECKOUT_MS = 6e4;
 const REPLAY_MASK_VALUE = "[redacted]";
-function maskReplayInput(text) {
+const UNMASKED_INPUT_TYPES = /* @__PURE__ */ new Set(["range", "color", "checkbox", "radio"]);
+function maskReplayInput(text, element) {
+  var _a;
+  const type = (_a = element == null ? void 0 : element.type) == null ? void 0 : _a.toLowerCase();
+  if (type && UNMASKED_INPUT_TYPES.has(type)) {
+    return text;
+  }
   return text ? REPLAY_MASK_VALUE : text;
 }
-function createMaskTextFn(fullMaskSelector, unmaskSelector) {
-  return (text, element) => {
+function createMaskTextFn(fullMaskSelector, unmaskSelector) {
+  return (text, element) => {
+    try {
+      if (fullMaskSelector && isElementFullyMasked(element, fullMaskSelector, unmaskSelector)) {
+        return REPLAY_MASK_VALUE;
+      }
+      return redactSensitiveValues(text);
+    } catch {
+      return REPLAY_MASK_VALUE;
+    }
+  };
+}
+const IDLE_CHECKOUT_POLL_MS = 5e3;
+class RingBufferRecorder {
+  constructor(options = {}) {
+    this.options = options;
+    this.segments = createSegments();
+    this.stopFn = null;
+    this.stopCanvasTracking = null;
+    this.idleCheckoutTimer = null;
+    this.visibilityListener = null;
+    this.tailCutoff = null;
+    this.windowMs = options.windowMs ?? SESSION_REPLAY_WINDOW_MS;
+  }
+  /**
+   * 기록 구간 길이를 바꾼다. 다음 이벤트가 들어올 때와 `snapshot()` 에서 새 길이로 자른다.
+   *
+   * 줄이는 쪽은 그대로 반영되고, 늘리는 쪽은 이미 잘려 나간 앞부분까지 되살리지는 못한다.
+   */
+  setWindowMs(windowMs) {
+    if (Number.isFinite(windowMs) && windowMs > 0) {
+      this.windowMs = windowMs;
+    }
+  }
+  get nowFn() {
+    return this.options.now ?? (() => Date.now());
+  }
+  get checkoutEveryMs() {
+    return this.options.checkoutEveryNms ?? SESSION_REPLAY_CHECKOUT_MS;
+  }
+  /** 마지막 segment 가 시작한 시각. 비어 있으면 null. */
+  get lastSegmentStart() {
+    var _a;
+    const last = this.segments[this.segments.length - 1];
+    return ((_a = last == null ? void 0 : last.events[0]) == null ? void 0 : _a.timestamp) ?? null;
+  }
+  /**
+   * 유휴가 길어 경계가 없으면 FullSnapshot 을 강제로 찍는다.
+   *
+   * 숨은 탭에서는 주기 검사를 건너뛴다 — 보이지도 않는 페이지의 DOM 을 주기적으로 직렬화할
+   * 이유가 없다. 대신 다시 보이는 순간 `visibilitychange` 로 여기를 한 번 더 부른다.
+   * 다음 폴링을 기다리면 그 사이에 스냅샷을 뜰 때 과길이 버퍼가 그대로 올라간다.
+   *
+   * rrweb 은 `recording` 이 false 면 던진다. 그 값은 모듈 전역이라 옛 recorder 의 stop 이
+   * 늦게 돌면 살아 있는 recorder 의 인터벌이 5초마다 던지게 된다. 고객 페이지에서 도는
+   * 코드라 밖으로 새면 안 된다.
+   */
+  forceCheckoutIfIdle() {
+    var _a;
+    if (typeof document !== "undefined" && document.hidden) return;
+    const start = this.lastSegmentStart;
+    if (start === null) return;
+    if (this.nowFn() - start < this.checkoutEveryMs) return;
+    const recordFn = this.options.recordFn ?? record;
+    try {
+      (_a = recordFn.takeFullSnapshot) == null ? void 0 : _a.call(recordFn, true);
+    } catch {
+    }
+  }
+  start() {
+    if (this.stopFn) return;
+    const cfg = resolvePrivacyConfig(this.options.privacyConfig);
+    const recordFn = this.options.recordFn ?? record;
+    const now = this.nowFn;
+    this.segments = createSegments();
+    if (this.options.trackCanvasInteractions !== false) {
+      this.stopCanvasTracking = startCanvasInteractionTracking();
+    }
+    const stop = recordFn({
+      emit: (event, isCheckout) => {
+        var _a, _b, _c, _d, _e;
+        this.segments = appendEvent(this.segments, event, Boolean(isCheckout));
+        this.segments = trimSegments(this.segments, this.windowMs, now(), this.checkoutEveryMs);
+        if (event.type === REPLAY_EVENT_TYPE.FullSnapshot) {
+          (_a = this.stopCanvasTracking) == null ? void 0 : _a.captureBaseline();
+          (_c = (_b = this.options).onFullSnapshot) == null ? void 0 : _c.call(_b);
+        }
+        (_e = (_d = this.options).onChange) == null ? void 0 : _e.call(_d);
+      },
+      checkoutEveryNms: this.options.checkoutEveryNms ?? SESSION_REPLAY_CHECKOUT_MS,
+      maskAllInputs: cfg.maskAllInputs,
+      blockSelector: cfg.blockSelector,
+      maskTextSelector: cfg.maskTextSelector,
+      maskTextFn: createMaskTextFn(cfg.fullMaskSelector, cfg.unmaskSelector),
+      maskInputFn: maskReplayInput,
+      recordCanvas: cfg.allowCanvasRecording
+      // rrweb 옵션 타입이 버전별로 달라 캐스팅한다.
+    });
+    this.stopFn = typeof stop === "function" ? stop : null;
+    this.idleCheckoutTimer = setInterval(() => this.forceCheckoutIfIdle(), IDLE_CHECKOUT_POLL_MS);
+    if (typeof document !== "undefined") {
+      this.visibilityListener = () => this.forceCheckoutIfIdle();
+      document.addEventListener("visibilitychange", this.visibilityListener);
+    }
+  }
+  stop() {
+    var _a, _b;
+    (_a = this.stopFn) == null ? void 0 : _a.call(this);
+    this.stopFn = null;
+    (_b = this.stopCanvasTracking) == null ? void 0 : _b.call(this);
+    this.stopCanvasTracking = null;
+    if (this.idleCheckoutTimer !== null) {
+      clearInterval(this.idleCheckoutTimer);
+      this.idleCheckoutTimer = null;
+    }
+    if (this.visibilityListener !== null) {
+      document.removeEventListener("visibilitychange", this.visibilityListener);
+      this.visibilityListener = null;
+    }
+  }
+  /**
+   * 이슈 생성 단계의 시작을 표시한다. 이 시각 이후는 스냅샷에서 빠진다.
+   *
+   * 녹화를 멈추지 않고 스냅샷에서 잘라내는 이유는, 멈췄다 다시 켜면 그 사이 mutation 이
+   * 빠져 이후 이벤트가 어긋난 DOM 에 적용되기 때문이다. 폼을 닫고 계속 쓰는 경우가 있으므로
+   * 되돌릴 수 있어야 한다.
+   */
+  markTailCutoff(timestamp = this.nowFn()) {
+    this.tailCutoff = timestamp;
+  }
+  /** 이슈 폼이 제출 없이 닫혔을 때. 다시 전체 구간을 담는다. */
+  clearTailCutoff() {
+    this.tailCutoff = null;
+  }
+  isRecording() {
+    return this.stopFn !== null;
+  }
+  /** 백업이 읽어갈 현재 버퍼. */
+  getSegments() {
+    return this.segments;
+  }
+  /**
+   * 이전 문서의 segment 를 버퍼 앞에 되돌린다.
+   *
+   * **`start()` 뒤에 불러야 한다** — `start()` 는 버퍼를 새로 만들기 때문에 순서가 바뀌면
+   * 되돌린 것이 그대로 지워진다.
+   *
+   * 되돌린 뒤에도 윈도 규칙은 그대로 적용된다. "최근 120초" 라는 정의는 바뀌지 않고,
+   * 문서 경계에서 시계가 0 으로 되돌아가지 않게 되는 것뿐이다. 이전 문서에 오래 머물렀다면
+   * 그 앞부분은 여기서 잘려 나가는 게 맞다.
+   */
+  restore(segments) {
+    var _a, _b;
+    if (segments.length === 0) return;
+    this.segments = trimSegments(
+      [...segments, ...this.segments],
+      this.windowMs,
+      this.nowFn(),
+      this.checkoutEveryMs
+    );
+    (_b = (_a = this.options).onChange) == null ? void 0 : _b.call(_a);
+  }
+  /**
+   * 현재 버퍼를 업로드 가능한 스냅샷으로 직렬화한다.
+   *
+   * 여기서도 한 번 더 트림한다. emit 시점의 트림만으로는 마지막 이벤트 이후 흐른 시간이
+   * 무제한으로 실린다. 기준 시각은 꼬리 컷오프가 있으면 그 시점이다 — 폼을 채우는 동안
+   * 흐른 시간 때문에 버그 직전 구간이 밀려나면 안 된다.
+   */
+  async snapshot() {
+    const cfg = resolvePrivacyConfig(this.options.privacyConfig);
+    const until = this.tailCutoff ?? this.nowFn();
+    const trimmed = trimSegments(this.segments, this.windowMs, until, this.checkoutEveryMs);
+    const segments = this.tailCutoff === null ? trimmed : dropEventsAfter(trimmed, this.tailCutoff);
+    return serializeSnapshot({
+      segments,
+      redactEvents: redactReplayEvents,
+      rrwebVersion: RRWEB_VERSION,
+      privacyConfigVersion: cfg.version
+    });
+  }
+}
+const SOCKET_FRAME_BUDGET_BYTES = 6 * 1024 * 1024;
+const SOCKET_FRAME_OVERHEAD_BYTES = 100;
+const SOCKET_FRAME_MAX_BYTES = 256 * 1024;
+const SOCKET_FRAME_BACKUP_MAX_BYTES = 8 * 1024;
+const SOCKET_FRAME_BACKUP_MAX_FRAMES = 200;
+const SOCKET_CONNECTION_LIMIT = 32;
+const SOCKET_TRANSCRIPT_MAX_BYTES = 5 * 1024 * 1024;
+const NETWORK_LOG_IMAGE_BODY_LIMIT_BYTES = 64 * 1024;
+const BODY_DENIED_MIME_PREFIXES = ["font/", "video/", "audio/", "model/", "multipart/"];
+const STREAMING_MIME_TYPES = /* @__PURE__ */ new Set(["text/event-stream", "application/x-ndjson"]);
+const BODY_DENIED_MIME_TYPES = /* @__PURE__ */ new Set([
+  "application/wasm",
+  "application/font-woff",
+  "application/font-woff2",
+  "application/x-font-ttf",
+  "application/x-font-otf",
+  "application/vnd.ms-fontobject",
+  "application/pdf",
+  "application/zip",
+  "application/gzip",
+  "application/x-gzip",
+  "application/x-tar"
+]);
+const OCTET_STREAM_MIME = "application/octet-stream";
+const OCTET_STREAM_BODY_LIMIT_BYTES = 32 * 1024;
+function isImageMimeType(mimeType) {
+  return Boolean(mimeType == null ? void 0 : mimeType.startsWith("image/"));
+}
+function isBodyDeniedMimeType(mimeType) {
+  if (!mimeType) return false;
+  return BODY_DENIED_MIME_PREFIXES.some((prefix) => mimeType.startsWith(prefix)) || BODY_DENIED_MIME_TYPES.has(mimeType) || STREAMING_MIME_TYPES.has(mimeType);
+}
+function getResponseBodyLimitBytes(mimeType) {
+  if (isBodyDeniedMimeType(mimeType)) return 0;
+  if (isImageMimeType(mimeType)) return NETWORK_LOG_IMAGE_BODY_LIMIT_BYTES;
+  if (mimeType === OCTET_STREAM_MIME) return OCTET_STREAM_BODY_LIMIT_BYTES;
+  return NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES;
+}
+const NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES = 256 * 1024;
+const NETWORK_LOG_TRANSPORT_BODY_BUDGET_BYTES = 2 * 1024 * 1024;
+const NON_ASCII_RUN = /[\u0080-\uffff]+/g;
+function getUtf8ByteLength(value) {
+  let bytes = value.length;
+  NON_ASCII_RUN.lastIndex = 0;
+  let match2;
+  while ((match2 = NON_ASCII_RUN.exec(value)) !== null) {
+    const end = match2.index + match2[0].length;
+    for (let i2 = match2.index; i2 < end; i2 += 1) {
+      const code = value.charCodeAt(i2);
+      if (code < 2048) {
+        bytes += 1;
+        continue;
+      }
+      bytes += 2;
+      if (code >= 55296 && code <= 56319 && i2 + 1 < end) {
+        const next = value.charCodeAt(i2 + 1);
+        if (next >= 56320 && next <= 57343) i2 += 1;
+      }
+    }
+  }
+  return bytes;
+}
+function estimateBase64DecodedBytes(value) {
+  const compact = value.replace(/^data:[^,]*,/i, "").replace(/\s/g, "");
+  if (!compact) return 0;
+  const padding = compact.endsWith("==") ? 2 : compact.endsWith("=") ? 1 : 0;
+  return Math.max(0, Math.floor(compact.length * 3 / 4) - padding);
+}
+function getCapturedBodySizeBytes(body, encoding) {
+  return encoding === "base64" ? estimateBase64DecodedBytes(body) : getUtf8ByteLength(body);
+}
+function isBodyWithinCaptureLimit(sizeBytes) {
+  return sizeBytes <= NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES;
+}
+function setOmittedBodyMetadata(log, field, reason, sizeBytes) {
+  if (field === "requestBody") {
+    delete log.requestBody;
+    log.requestBodyOmittedReason = reason;
+    log.requestBodySizeBytes = sizeBytes;
+    return;
+  }
+  delete log.responseBody;
+  delete log.responseBodyEncoding;
+  log.responseBodyOmittedReason = reason;
+  log.responseBodySizeBytes = sizeBytes;
+}
+function omitOversizedIndividualBodies(logs) {
+  return logs.map((log) => {
+    const nextLog = { ...log };
+    if (nextLog.requestBody != null) {
+      const sizeBytes = getUtf8ByteLength(nextLog.requestBody);
+      if (sizeBytes > NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES) {
+        setOmittedBodyMetadata(nextLog, "requestBody", "too-large", sizeBytes);
+      }
+    }
+    if (nextLog.responseBody != null) {
+      const sizeBytes = getCapturedBodySizeBytes(
+        nextLog.responseBody,
+        nextLog.responseBodyEncoding
+      );
+      const limitBytes = getResponseBodyLimitBytes(nextLog.responseMimeType);
+      if (limitBytes === 0) {
+        setOmittedBodyMetadata(nextLog, "responseBody", "mime-type", sizeBytes);
+      } else if (sizeBytes > limitBytes) {
+        setOmittedBodyMetadata(nextLog, "responseBody", "too-large", sizeBytes);
+      }
+    }
+    return nextLog;
+  });
+}
+function omitNetworkLogBody(log, field, reason, sizeBytes) {
+  const nextLog = { ...log };
+  setOmittedBodyMetadata(nextLog, field, reason, sizeBytes);
+  return nextLog;
+}
+function compactNetworkLogsForTransport(logs, budgetBytes = NETWORK_LOG_TRANSPORT_BODY_BUDGET_BYTES) {
+  if (!logs) return void 0;
+  const compacted = omitOversizedIndividualBodies(logs);
+  const candidates = [];
+  compacted.forEach((log, index) => {
+    if (log.requestBody != null) {
+      candidates.push({
+        index,
+        field: "requestBody",
+        timestamp: log.timestamp,
+        sizeBytes: getUtf8ByteLength(log.requestBody)
+      });
+    }
+    if (log.responseBody != null) {
+      candidates.push({
+        index,
+        field: "responseBody",
+        timestamp: log.timestamp,
+        sizeBytes: getUtf8ByteLength(log.responseBody)
+      });
+    }
+  });
+  candidates.sort((a2, b) => {
+    const timestampDiff = b.timestamp - a2.timestamp;
+    if (timestampDiff !== 0) return timestampDiff;
+    const indexDiff = b.index - a2.index;
+    if (indexDiff !== 0) return indexDiff;
+    return a2.field === "responseBody" ? -1 : 1;
+  });
+  let usedBytes = 0;
+  for (const candidate of candidates) {
+    if (usedBytes + candidate.sizeBytes > budgetBytes) {
+      const log = compacted[candidate.index];
+      if (!log) continue;
+      setOmittedBodyMetadata(log, candidate.field, "transport-budget", candidate.sizeBytes);
+      continue;
+    }
+    usedBytes += candidate.sizeBytes;
+  }
+  return compacted;
+}
+const SELF_TRAFFIC_CLIENT_HEADER = "x-client-info";
+const SELF_TRAFFIC_CLIENT_VALUES = ["issue-sticker-sdk", "issue-sticker-extension"];
+const SELF_TRAFFIC_CLIENT_VALUE_SET = new Set(SELF_TRAFFIC_CLIENT_VALUES);
+function isSharedLocalHost(hostname) {
+  return hostname === "localhost" || hostname === "127.0.0.1" || hostname === "::1" || hostname === "0.0.0.0" || hostname.endsWith(".local") || hostname.endsWith(".localhost");
+}
+function readHeader(headers, headerName) {
+  if (!headers) return void 0;
+  const target = headerName.toLowerCase();
+  for (const [key, value] of Object.entries(headers)) {
+    if (key.toLowerCase() === target) return value;
+  }
+  return void 0;
+}
+function hasSelfTrafficHeader(headers) {
+  const clientInfo = readHeader(headers, SELF_TRAFFIC_CLIENT_HEADER);
+  return Boolean(clientInfo && SELF_TRAFFIC_CLIENT_VALUE_SET.has(clientInfo));
+}
+function isSelfTrafficOrigin(url, apiOrigins) {
+  if (apiOrigins.length === 0) return false;
+  let origin;
+  let hostname;
+  try {
+    const parsed = new URL(url);
+    origin = parsed.origin;
+    hostname = parsed.hostname;
+  } catch {
+    return false;
+  }
+  if (isSharedLocalHost(hostname)) return false;
+  return apiOrigins.some((candidate) => {
     try {
-      if (fullMaskSelector && isElementFullyMasked(element, fullMaskSelector, unmaskSelector)) {
-        return REPLAY_MASK_VALUE;
-      }
-      return redactSensitiveValues(text);
+      return new URL(candidate).origin === origin;
     } catch {
-      return REPLAY_MASK_VALUE;
+      return false;
     }
-  };
+  });
 }
-const IDLE_CHECKOUT_POLL_MS = 5e3;
-function spanSeconds(segments) {
-  var _a, _b;
-  const events = flattenEvents(segments);
-  const first = (_a = events[0]) == null ? void 0 : _a.timestamp;
-  const last = (_b = events[events.length - 1]) == null ? void 0 : _b.timestamp;
-  if (first === void 0 || last === void 0) return 0;
-  return Math.round((last - first) / 1e3);
+const INSTRUMENTATION_FAILURE_LIMIT$1 = 5;
+const REPATCH_LIMIT$1 = 2;
+function storedFrameBytes(frames) {
+  var _a;
+  let sum = 0;
+  for (const frame of frames) sum += ((_a = frame.data) == null ? void 0 : _a.length) ?? 0;
+  return sum;
 }
-class RingBufferRecorder {
-  constructor(options = {}) {
-    this.options = options;
-    this.segments = createSegments();
-    this.stopFn = null;
-    this.idleCheckoutTimer = null;
-    this.visibilityListener = null;
-    this.tailCutoff = null;
+const PRUNE_TARGET_RATIO = 0.9;
+function frameBudgetCost(frames) {
+  return storedFrameBytes(frames) + frames.length * SOCKET_FRAME_OVERHEAD_BYTES;
+}
+function toComparableOrigin(url) {
+  return url.replace(/^wss:\/\//i, "https://").replace(/^ws:\/\//i, "http://");
+}
+function bytesToBase64$1(bytes) {
+  let binary = "";
+  for (const byte of bytes) binary += String.fromCharCode(byte);
+  return btoa(binary);
+}
+function toFrameData(data, dir) {
+  if (typeof data === "string") {
+    return { opcode: "text", size: getUtf8ByteLength(data), text: data };
   }
-  get windowMs() {
-    return this.options.windowMs ?? SESSION_REPLAY_WINDOW_MS;
+  if (typeof Blob !== "undefined" && data instanceof Blob) {
+    return { opcode: "binary", size: data.size, bytes: new Uint8Array(0) };
   }
-  get nowFn() {
-    return this.options.now ?? (() => Date.now());
+  if (data instanceof ArrayBuffer) {
+    const bytes = new Uint8Array(data);
+    return { opcode: "binary", size: bytes.length, bytes };
   }
-  get checkoutEveryMs() {
-    return this.options.checkoutEveryNms ?? SESSION_REPLAY_CHECKOUT_MS;
+  if (ArrayBuffer.isView(data)) {
+    const bytes = new Uint8Array(data.buffer, data.byteOffset, data.byteLength);
+    return { opcode: "binary", size: bytes.length, bytes };
   }
-  /** 마지막 segment 가 시작한 시각. 비어 있으면 null. */
-  get lastSegmentStart() {
-    var _a;
-    const last = this.segments[this.segments.length - 1];
-    return ((_a = last == null ? void 0 : last.events[0]) == null ? void 0 : _a.timestamp) ?? null;
+  if (dir === "send") {
+    const text = String(data);
+    return { opcode: "text", size: getUtf8ByteLength(text), text };
+  }
+  throw new TypeError("WebSocketCollector: 지원하지 않는 프레임 데이터 형식");
+}
+const MASK_PRESLICE_MARGIN_BYTES = SOCKET_FRAME_MAX_BYTES + 16 * 1024;
+function bytesNeededForBase64Length(charLength) {
+  return Math.ceil(charLength * 3 / 4) + 3;
+}
+function maskFrameText(text) {
+  return redactSensitiveValues(redactSensitiveBody(text));
+}
+class WebSocketCollector {
+  constructor(apiBaseUrl, options) {
+    this.connections = [];
+    this.originalWebSocket = null;
+    this.patchedWebSocket = null;
+    this.originalSend = null;
+    this.patchedSend = null;
+    this.running = false;
+    this.nextId = 1;
+    this.budgetUsed = 0;
+    this.instrumentationFailures = 0;
+    this.repatchCount = 0;
+    this.apiBaseUrl = typeof apiBaseUrl === "string" && apiBaseUrl.trim().length > 0 ? apiBaseUrl.trim() : null;
+    this.onChange = (options == null ? void 0 : options.onChange) ?? null;
+  }
+  start() {
+    if (this.running) return;
+    if (typeof globalThis.WebSocket !== "function") return;
+    this.running = true;
+    this.instrumentationFailures = 0;
+    this.patch();
+  }
+  stop() {
+    if (!this.running) return;
+    this.running = false;
+    this.unpatch();
   }
   /**
-   * 유휴가 길어 경계가 없으면 FullSnapshot 을 강제로 찍는다.
+   * 우리 래퍼가 아직 걸려 있는지 확인하고, 아니면 다시 붙인다.
    *
-   * 숨은 탭에서는 주기 검사를 건너뛴다 — 보이지도 않는 페이지의 DOM 을 주기적으로 직렬화할
-   * 이유가 없다. 대신 다시 보이는 순간 `visibilitychange` 로 여기를 한 번 더 부른다.
-   * 다음 폴링을 기다리면 그 사이에 스냅샷을 뜰 때 과길이 버퍼가 그대로 올라간다.
+   * NetworkCollector.ensurePatched 와 같은 이유다 — 다른 계측이 `window.WebSocket` 을
+   * 통째로 갈아치우면 수집이 조용히 멈춘다.
+   */
+  ensurePatched() {
+    if (!this.running) return;
+    if (globalThis.WebSocket === this.patchedWebSocket) return;
+    if (this.repatchCount >= REPATCH_LIMIT$1) return;
+    this.repatchCount += 1;
+    this.patch();
+  }
+  /**
+   * 연결마다 네트워크 로그 한 줄. 네트워크 수집기가 읽을 때마다 여기서 만든다.
    *
-   * rrweb 은 `recording` 이 false 면 던진다. 그 값은 모듈 전역이라 옛 recorder 의 stop 이
-   * 늦게 돌면 살아 있는 recorder 의 인터벌이 5초마다 던지게 된다. 고객 페이지에서 도는
-   * 코드라 밖으로 새면 안 된다.
+   * 네트워크 버퍼에 한 번 넣어 두고 고치는 방식은 쓰지 않는다. 줄의 시각이 연결이 열린 시각이라
+   * 오래 열어 둔 연결일수록 버퍼 상한(최근 200건)에 먼저 밀려나, 연결은 살아 있는데 줄만 사라진다.
+   *
+   * `frameCount` 는 버린 프레임까지 센다("실제로 몇 건 오갔나"). `frameBytes` 는 지금 보관 중인
+   * 프레임의 크기 합이다. 버린 프레임의 바이트는 이미 사라졌으니 더할 수 없다.
    */
-  forceCheckoutIfIdle() {
+  getNetworkLogs() {
+    return this.connections.map((connection) => ({
+      url: connection.url,
+      // 핸드셰이크는 GET 으로 나가고 성공이면 101 이다.
+      method: "GET",
+      statusCode: 101,
+      timestamp: connection.openedAt,
+      type: "websocket",
+      socketConnectionId: connection.id,
+      frameCount: connection.frames.length + connection.droppedFrames,
+      frameBytes: connection.frames.reduce((sum, frame) => sum + frame.size, 0),
+      droppedFrames: connection.droppedFrames,
+      ...connection.closeCode != null ? { socketCloseCode: connection.closeCode } : {}
+    }));
+  }
+  getConnections() {
+    return this.connections.map((connection) => ({
+      ...connection,
+      frames: [...connection.frames]
+    }));
+  }
+  clear() {
+    this.connections = [];
+    this.budgetUsed = 0;
+  }
+  /**
+   * 백업에서 되돌린 연결을 지금 목록 앞에 합친다. 상한을 넘으면 오래된 쪽부터 잘린다.
+   *
+   * 예산도 복원 직후 바로 적용한다. 안 하면 다음 프레임이 올 때까지 상한 없이 방치된다.
+   *
+   * **연결 번호가 겹치지 않게 한다.** `nextId` 는 문서마다 1 에서 시작해서, MPA 리로드 뒤
+   * 되돌린 `ws-1` 과 새 문서의 첫 소켓 `ws-1` 이 겹친다. 전사 파일에 같은 id 가 둘 생기면
+   * 뷰어가 옛 연결의 프레임을 보여준다. 복원은 비동기라 그 사이 새 연결이 이미 번호를 받았을 수
+   * 있으므로, `nextId` 를 올리는 것과 별개로 겹친 되돌린 연결은 새 번호로 바꾼다. 형식은 MCP
+   * 조회가 비교하는 `ws-<n>` 그대로 둔다.
+   */
+  restore(connections) {
+    if (connections.length === 0) return;
+    const liveIds = new Set(this.connections.map((connection) => connection.id));
+    this.bumpNextIdPast([...connections, ...this.connections]);
+    const restored = connections.map(
+      (connection) => liveIds.has(connection.id) ? { ...connection, id: `ws-${this.nextId++}` } : connection
+    );
+    this.connections = [...restored, ...this.connections].slice(-SOCKET_CONNECTION_LIMIT);
+    this.budgetUsed = this.sumBudgetCost(this.connections);
+    this.prune();
+  }
+  /** `ws-<n>` 형식 id 중 가장 큰 번호 다음부터 잇도록 `nextId` 를 올린다. 낮추지는 않는다. */
+  bumpNextIdPast(connections) {
+    for (const connection of connections) {
+      const match2 = /^ws-(\d+)$/.exec(connection.id);
+      if (!match2) continue;
+      const numeric = Number(match2[1]);
+      if (numeric >= this.nextId) this.nextId = numeric + 1;
+    }
+  }
+  sumBudgetCost(connections) {
+    return connections.reduce((sum, connection) => sum + frameBudgetCost(connection.frames), 0);
+  }
+  /**
+   * 우리 백엔드로 가는 연결은 레코드를 아예 만들지 않는다.
+   *
+   * 그런 소켓은 `byInstance` 에 null 로 남아, 이후 `send` 프레임도 기록되지 않고 첫 송신 때
+   * 다시 붙잡지도 않는다.
+   */
+  track(socket, url, protocols) {
     var _a;
-    if (typeof document !== "undefined" && document.hidden) return;
-    const start = this.lastSegmentStart;
-    if (start === null) return;
-    if (this.nowFn() - start < this.checkoutEveryMs) return;
-    const recordFn = this.options.recordFn ?? record;
     try {
-      (_a = recordFn.takeFullSnapshot) == null ? void 0 : _a.call(recordFn, true);
+      if (isSelfTrafficOrigin(toComparableOrigin(url), this.apiBaseUrl ? [this.apiBaseUrl] : []))
+        return null;
+      const connection = {
+        id: `ws-${this.nextId++}`,
+        url: redactUrlSecrets(url),
+        // 서브프로토콜에 토큰을 싣는 패턴(`new WebSocket(url, [token])`)이 실제로 쓰인다.
+        // 값 형태 스크럽까지 거는 이유는 프레임 본문과 같다.
+        protocol: maskFrameText(Array.isArray(protocols) ? protocols[0] : protocols),
+        openedAt: Date.now(),
+        frames: [],
+        droppedFrames: 0,
+        droppedBytes: 0
+      };
+      this.connections.push(connection);
+      if (this.connections.length > SOCKET_CONNECTION_LIMIT) {
+        const closedIndex = this.connections.findIndex((c2) => c2.closedAt != null);
+        const [evicted] = this.connections.splice(closedIndex >= 0 ? closedIndex : 0, 1);
+        this.budgetUsed -= this.sumBudgetCost([evicted]);
+      }
+      socket.addEventListener("message", (event) => {
+        this.addFrame(connection, "recv", event.data);
+      });
+      socket.addEventListener("close", (event) => {
+        var _a2;
+        if (!this.running) return;
+        try {
+          const closeEvent = event;
+          connection.closedAt = Date.now();
+          connection.closeCode = closeEvent.code;
+          connection.closeReason = closeEvent.reason;
+          (_a2 = this.onChange) == null ? void 0 : _a2.call(this);
+        } catch {
+          this.recordInstrumentationFailure();
+        }
+      });
+      socket.addEventListener("error", () => {
+        var _a2;
+        if (!this.running) return;
+        try {
+          connection.errored = true;
+          (_a2 = this.onChange) == null ? void 0 : _a2.call(this);
+        } catch {
+          this.recordInstrumentationFailure();
+        }
+      });
+      (_a = this.onChange) == null ? void 0 : _a.call(this);
+      return connection;
     } catch {
+      this.recordInstrumentationFailure();
+      return null;
     }
   }
-  start() {
-    if (this.stopFn) return;
-    const cfg = resolvePrivacyConfig(this.options.privacyConfig);
-    const recordFn = this.options.recordFn ?? record;
-    const now = this.nowFn;
-    this.segments = createSegments();
-    const stop = recordFn({
-      emit: (event, isCheckout) => {
-        var _a, _b;
-        this.segments = appendEvent(this.segments, event, Boolean(isCheckout));
-        this.segments = trimSegments(this.segments, this.windowMs, now(), this.checkoutEveryMs);
-        (_b = (_a = this.options).onChange) == null ? void 0 : _b.call(_a);
-      },
-      checkoutEveryNms: this.options.checkoutEveryNms ?? SESSION_REPLAY_CHECKOUT_MS,
-      maskAllInputs: cfg.maskAllInputs,
-      blockSelector: cfg.blockSelector,
-      maskTextSelector: cfg.maskTextSelector,
-      maskTextFn: createMaskTextFn(cfg.fullMaskSelector, cfg.unmaskSelector),
-      maskInputFn: maskReplayInput,
-      recordCanvas: cfg.allowCanvasRecording
-      // rrweb 옵션 타입이 버전별로 달라 캐스팅한다.
-    });
-    this.stopFn = typeof stop === "function" ? stop : null;
-    this.idleCheckoutTimer = setInterval(() => this.forceCheckoutIfIdle(), IDLE_CHECKOUT_POLL_MS);
-    if (typeof document !== "undefined") {
-      this.visibilityListener = () => this.forceCheckoutIfIdle();
-      document.addEventListener("visibilitychange", this.visibilityListener);
+  /**
+   * 수집기보다 먼저 만들어진 소켓을 첫 송신 때 붙잡는다.
+   *
+   * 생성자는 이미 지나갔지만 `send` 는 프로토타입을 거치므로 옛 인스턴스도 여기로 온다.
+   * 이때 리스너를 붙이면 그 뒤로는 새로 연 연결과 똑같이 송신·수신을 모두 기록한다. 수집기가
+   * 늦게 붙는 경우(설치·업데이트 전부터 열린 탭)에 연결이 통째로 빠지던 것을 막는다.
+   * socket.io 처럼 주기적으로 핑을 보내는 연결은 한 주기 안에 붙잡힌다. 한 번도 보내지 않는
+   * 수신 전용 연결은 여기서도 못 잡는다.
+   */
+  adopt(socket) {
+    if (!this.running) return null;
+    try {
+      const connection = this.track(socket, socket.url, socket.protocol || void 0);
+      if (connection) connection.adopted = true;
+      return connection;
+    } catch {
+      return null;
     }
   }
-  stop() {
-    var _a;
-    (_a = this.stopFn) == null ? void 0 : _a.call(this);
-    this.stopFn = null;
-    if (this.idleCheckoutTimer !== null) {
-      clearInterval(this.idleCheckoutTimer);
-      this.idleCheckoutTimer = null;
-    }
-    if (this.visibilityListener !== null) {
-      document.removeEventListener("visibilitychange", this.visibilityListener);
-      this.visibilityListener = null;
+  /**
+   * 계측이 스스로 꺼지는 차단기. NetworkCollector.recordInstrumentationFailure 와 같은 규칙이다.
+   *
+   * 계측에서 난 예외가 반복된다는 건 우리가 이해하지 못하는 환경에 들어와 있다는 뜻이다.
+   * 고객 페이지에 계속 손대는 것보다 패치를 걷어내고 로그를 포기하는 쪽이 안전하다.
+   */
+  recordInstrumentationFailure() {
+    this.instrumentationFailures += 1;
+    if (this.instrumentationFailures >= INSTRUMENTATION_FAILURE_LIMIT$1) {
+      this.stop();
+    }
+  }
+  addFrame(connection, dir, data) {
+    var _a;
+    if (!this.running) return;
+    try {
+      const captured = toFrameData(data, dir);
+      const truncated = captured.size > SOCKET_FRAME_MAX_BYTES;
+      const frameData = this.buildFrameData(captured, truncated);
+      connection.frames.push({
+        t: Date.now(),
+        dir,
+        opcode: captured.opcode,
+        size: captured.size,
+        data: frameData,
+        ...truncated ? { truncated: true } : {}
+      });
+      this.budgetUsed += frameData.length + SOCKET_FRAME_OVERHEAD_BYTES;
+      this.prune();
+      (_a = this.onChange) == null ? void 0 : _a.call(this);
+    } catch {
+      this.recordInstrumentationFailure();
     }
   }
   /**
-   * 이슈 생성 단계의 시작을 표시한다. 이 시각 이후는 스냅샷에서 빠진다.
+   * 프레임 본문을 마스킹·절단해 저장용 문자열로 만든다.
    *
-   * 녹화를 멈추지 않고 스냅샷에서 잘라내는 이유는, 멈췄다 다시 켜면 그 사이 mutation 이
-   * 빠져 이후 이벤트가 어긋난 DOM 에 적용되기 때문이다. 폼을 닫고 계속 쓰는 경우가 있으므로
-   * 되돌릴 수 있어야 한다.
+   * **상한 아래면 지금까지와 완전히 같다** — 아래 두 분기 모두 `truncated` 가 false 면
+   * 원본 그대로 마스킹만 거치고 절단 코드를 타지 않는다.
+   *
+   * 상한을 넘을 때만 순서가 바뀐다: 절단은 항상 크기(`byteLength`/`Blob.size`/문자열
+   * 길이)를 이미 아는 값으로 먼저 가늠하고, **변환(base64)·마스킹은 그 뒤 필요한 만큼만**
+   * 돌린다. 텍스트는 마스킹이 끝난 뒤 최종 상한으로 한 번 더 자른다 — 마스킹이 앞부분을
+   * 줄이거나 늘릴 수 있어서다(`MASK_PRESLICE_MARGIN_BYTES` 주석 참조).
    */
-  markTailCutoff(timestamp = this.nowFn()) {
-    this.tailCutoff = timestamp;
-  }
-  /** 이슈 폼이 제출 없이 닫혔을 때. 다시 전체 구간을 담는다. */
-  clearTailCutoff() {
-    this.tailCutoff = null;
-  }
-  isRecording() {
-    return this.stopFn !== null;
-  }
-  /** 백업이 읽어갈 현재 버퍼. */
-  getSegments() {
-    return this.segments;
+  buildFrameData(captured, truncated) {
+    if (captured.opcode === "binary") {
+      if (!truncated) return bytesToBase64$1(captured.bytes);
+      const bytesNeeded = Math.min(
+        captured.bytes.length,
+        bytesNeededForBase64Length(SOCKET_FRAME_MAX_BYTES)
+      );
+      return bytesToBase64$1(captured.bytes.subarray(0, bytesNeeded)).slice(
+        0,
+        SOCKET_FRAME_MAX_BYTES
+      );
+    }
+    if (!truncated) return maskFrameText(captured.text);
+    const preSliced = captured.text.slice(0, MASK_PRESLICE_MARGIN_BYTES);
+    return maskFrameText(preSliced).slice(0, SOCKET_FRAME_MAX_BYTES);
   }
   /**
-   * 이전 문서의 segment 를 버퍼 앞에 되돌린다.
-   *
-   * **`start()` 뒤에 불러야 한다** — `start()` 는 버퍼를 새로 만들기 때문에 순서가 바뀌면
-   * 되돌린 것이 그대로 지워진다.
+   * 예산을 넘으면 오래된 프레임부터 버려 예산의 90% 까지 낮춘다. 예산은 전역이라 연결이 여럿이면
+   * 가장 오래된 프레임을 가진 연결부터 줄인다.
    *
-   * 되돌린 뒤에도 윈도 규칙은 그대로 적용된다. "최근 120초" 라는 정의는 바뀌지 않고,
-   * 문서 경계에서 시계가 0 으로 되돌아가지 않게 되는 것뿐이다. 이전 문서에 오래 머물렀다면
-   * 그 앞부분은 여기서 잘려 나가는 게 맞다.
+   * 넘을 때마다 한 건씩 버리지 않는다. 작은 프레임이 수만 건 쌓인 연결에서는 한 건을 버릴 때마다
+   * 배열 전체가 당겨져, 새 프레임 하나에 그만큼의 일이 고객 페이지의 전송 경로에서 돈다. 여유를
+   * 두고 한 번에 버리면 그 일이 수천 건에 한 번으로 준다.
    */
-  restore(segments) {
-    var _a, _b;
-    if (segments.length === 0) return;
-    this.segments = trimSegments(
-      [...segments, ...this.segments],
-      this.windowMs,
-      this.nowFn(),
-      this.checkoutEveryMs
-    );
-    (_b = (_a = this.options).onChange) == null ? void 0 : _b.call(_a);
+  prune() {
+    var _a;
+    if (this.budgetUsed <= SOCKET_FRAME_BUDGET_BYTES) return;
+    const target = SOCKET_FRAME_BUDGET_BYTES * PRUNE_TARGET_RATIO;
+    while (this.budgetUsed > target) {
+      let oldest = null;
+      let nextOldestT = Number.POSITIVE_INFINITY;
+      for (const connection of this.connections) {
+        const first = connection.frames[0];
+        if (!first) continue;
+        if (!oldest || first.t < oldest.frames[0].t) {
+          if (oldest) nextOldestT = Math.min(nextOldestT, oldest.frames[0].t);
+          oldest = connection;
+        } else {
+          nextOldestT = Math.min(nextOldestT, first.t);
+        }
+      }
+      if (!oldest) break;
+      let count2 = 0;
+      let freed = 0;
+      for (const frame of oldest.frames) {
+        if (this.budgetUsed - freed <= target) break;
+        if (count2 > 0 && frame.t > nextOldestT) break;
+        freed += (((_a = frame.data) == null ? void 0 : _a.length) ?? 0) + SOCKET_FRAME_OVERHEAD_BYTES;
+        count2 += 1;
+      }
+      this.dropOldest(oldest, count2);
+    }
+  }
+  /** 연결의 앞쪽 프레임 `count` 건을 버리고 버린 수·바이트를 센다. */
+  dropOldest(connection, count2) {
+    const removed = connection.frames.splice(0, count2);
+    connection.droppedFrames += removed.length;
+    connection.droppedBytes += storedFrameBytes(removed);
+    this.budgetUsed -= frameBudgetCost(removed);
+  }
+  patch() {
+    this.originalWebSocket = globalThis.WebSocket;
+    const OriginalWebSocket = this.originalWebSocket;
+    const track = this.track.bind(this);
+    const addFrame = this.addFrame.bind(this);
+    const adopt = this.adopt.bind(this);
+    const byInstance = /* @__PURE__ */ new WeakMap();
+    class PatchedWebSocket extends OriginalWebSocket {
+      constructor(url, protocols) {
+        super(url, protocols);
+        byInstance.set(this, track(this, typeof url === "string" ? url : url.href, protocols));
+      }
+    }
+    this.originalSend = OriginalWebSocket.prototype.send;
+    const originalSend = this.originalSend;
+    const patchedSend = function(data) {
+      if (typeof this === "object" && this !== null && !byInstance.has(this)) {
+        byInstance.set(this, adopt(this));
+      }
+      const connection = byInstance.get(this);
+      if (connection) addFrame(connection, "send", data);
+      return originalSend.call(this, data);
+    };
+    OriginalWebSocket.prototype.send = patchedSend;
+    this.patchedSend = patchedSend;
+    globalThis.WebSocket = PatchedWebSocket;
+    this.patchedWebSocket = PatchedWebSocket;
   }
   /**
-   * 현재 버퍼를 업로드 가능한 스냅샷으로 직렬화한다.
+   * 우리 래퍼가 아직 현재 값일 때만 되돌린다.
    *
-   * 여기서도 한 번 더 트림한다. emit 시점의 트림만으로는 마지막 이벤트 이후 흐른 시간이
-   * 무제한으로 실린다. 기준 시각은 꼬리 컷오프가 있으면 그 시점이다 — 폼을 채우는 동안
-   * 흐른 시간 때문에 버그 직전 구간이 밀려나면 안 된다.
+   * `NetworkCollector.restoreFetch`/`restoreXHR` 과 같은 규칙 — 무조건 되돌리면 우리
+   * 뒤에 붙은 남의 계측(다른 APM 등)의 래퍼가 통째로 사라진다. 남의 것이 위에 있으면
+   * 우리 래퍼는 체인에 남겨 두고 수집만 멈춘다.
    */
-  async snapshot() {
-    const cfg = resolvePrivacyConfig(this.options.privacyConfig);
-    const until = this.tailCutoff ?? this.nowFn();
-    const trimmed = trimSegments(this.segments, this.windowMs, until, this.checkoutEveryMs);
-    const segments = this.tailCutoff === null ? trimmed : dropEventsAfter(trimmed, this.tailCutoff);
-    return serializeSnapshot({
-      segments,
-      redactEvents: redactReplayEvents,
-      windowSeconds: spanSeconds(segments),
-      rrwebVersion: RRWEB_VERSION,
-      privacyConfigVersion: cfg.version
-    });
+  unpatch() {
+    if (this.originalWebSocket && globalThis.WebSocket === this.patchedWebSocket) {
+      globalThis.WebSocket = this.originalWebSocket;
+    }
+    if (this.originalWebSocket && this.originalSend && this.originalWebSocket.prototype.send === this.patchedSend) {
+      this.originalWebSocket.prototype.send = this.originalSend;
+    }
+    this.originalWebSocket = null;
+    this.patchedWebSocket = null;
+    this.originalSend = null;
+    this.patchedSend = null;
   }
 }
 const LOG_BACKUP_SESSION_KEY = "__issueStickerLogSession";
@@ -851,13 +2069,22 @@ const DB_VERSION$1 = 1;
 const STORE_NAME$1 = "sessions";
 const LOG_BACKUP_TTL_MS = 24 * 60 * 60 * 1e3;
 const LOG_BACKUP_BUDGET_BYTES = 8 * 1024 * 1024;
-function payloadSizeBytes(payload) {
+function jsonLength(value) {
   try {
-    return JSON.stringify(payload).length;
+    return JSON.stringify(value).length;
   } catch {
     return Number.POSITIVE_INFINITY;
   }
 }
+function dropOldestToFit(items, overBytes) {
+  let dropped = 0;
+  let freed = 0;
+  while (freed < overBytes && dropped < items.length) {
+    freed += jsonLength(items[dropped]) + 1;
+    dropped += 1;
+  }
+  return { kept: items.slice(dropped), freed };
+}
 function withoutBody(log) {
   if (log.responseBody === void 0 && log.requestBody === void 0) return log;
   const stripped = { ...log };
@@ -872,19 +2099,47 @@ function withoutBody(log) {
   }
   return stripped;
 }
+function withoutFrameData(connection) {
+  if (connection.frames.length === 0) return connection;
+  return {
+    ...connection,
+    frames: connection.frames.map((frame) => {
+      if (frame.data === void 0) return frame;
+      const stripped = { ...frame };
+      delete stripped.data;
+      return stripped;
+    })
+  };
+}
+function withClippedFrames(connection) {
+  const excess = connection.frames.length - SOCKET_FRAME_BACKUP_MAX_FRAMES;
+  const dropped = excess > 0 ? connection.frames.slice(0, excess) : [];
+  const kept = excess > 0 ? connection.frames.slice(excess) : connection.frames;
+  return {
+    ...connection,
+    droppedFrames: connection.droppedFrames + dropped.length,
+    droppedBytes: connection.droppedBytes + storedFrameBytes(dropped),
+    frames: kept.map(
+      (frame) => {
+        var _a;
+        return (((_a = frame.data) == null ? void 0 : _a.length) ?? 0) > SOCKET_FRAME_BACKUP_MAX_BYTES ? { ...frame, data: frame.data.slice(0, SOCKET_FRAME_BACKUP_MAX_BYTES), truncated: true } : frame;
+      }
+    )
+  };
+}
 function trimLogBackupPayload(payload, budgetBytes = LOG_BACKUP_BUDGET_BYTES) {
-  if (payloadSizeBytes(payload) <= budgetBytes) return payload;
-  let trimmed = {
-    network: payload.network.map(withoutBody),
-    console: payload.console
+  var _a;
+  const clipped = payload.socket ? { ...payload, socket: payload.socket.map(withClippedFrames) } : payload;
+  if (jsonLength(clipped) <= budgetBytes) return clipped;
+  const stripped = {
+    network: clipped.network.map(withoutBody),
+    console: clipped.console,
+    socket: (_a = clipped.socket) == null ? void 0 : _a.map(withoutFrameData)
   };
-  while (payloadSizeBytes(trimmed) > budgetBytes && trimmed.network.length > 0) {
-    trimmed = { network: trimmed.network.slice(1), console: trimmed.console };
-  }
-  while (payloadSizeBytes(trimmed) > budgetBytes && trimmed.console.length > 0) {
-    trimmed = { network: trimmed.network, console: trimmed.console.slice(1) };
-  }
-  return trimmed;
+  const over = jsonLength(stripped) - budgetBytes;
+  const network = dropOldestToFit(stripped.network, over);
+  const consoleLogs = dropOldestToFit(stripped.console, over - network.freed);
+  return { ...stripped, network: network.kept, console: consoleLogs.kept };
 }
 function requestToPromise$1(request) {
   return new Promise((resolve, reject) => {
@@ -1031,13 +2286,29 @@ const DB_NAME = "issue-sticker-replay";
 const DB_VERSION = 1;
 const STORE_NAME = "segments";
 const REPLAY_BACKUP_TTL_MS = 24 * 60 * 60 * 1e3;
-const REPLAY_BACKUP_EVENT_BUDGET = 12e3;
-function countEvents(segments) {
-  return segments.reduce((total, segment) => total + segment.events.length, 0);
+const REPLAY_BACKUP_SIZE_BUDGET = 32 * 1024 * 1024;
+const eventSizes = /* @__PURE__ */ new WeakMap();
+function sizeOfEvent(event) {
+  const cached = eventSizes.get(event);
+  if (cached !== void 0) return cached;
+  let size;
+  try {
+    size = JSON.stringify(event).length;
+  } catch {
+    size = Number.MAX_SAFE_INTEGER;
+  }
+  eventSizes.set(event, size);
+  return size;
+}
+function sizeOfSegments(segments) {
+  return segments.reduce(
+    (total, segment) => total + segment.events.reduce((sum, event) => sum + sizeOfEvent(event), 0),
+    0
+  );
 }
-function trimReplayBackup(segments, eventBudget = REPLAY_BACKUP_EVENT_BUDGET) {
+function trimReplayBackup(segments, sizeBudget = REPLAY_BACKUP_SIZE_BUDGET) {
   let trimmed = segments;
-  while (trimmed.length > 1 && countEvents(trimmed) > eventBudget) {
+  while (trimmed.length > 1 && sizeOfSegments(trimmed) > sizeBudget) {
     trimmed = trimmed.slice(1);
   }
   return trimmed;
@@ -1051,14 +2322,13 @@ function keepPlayableSegments(segments) {
     return events.every(isReplayEvent) && hasFullSnapshot(events);
   });
 }
-const FULL_SNAPSHOT_TYPE = 2;
 function isReplayEvent(value) {
   if (!value || typeof value !== "object") return false;
   const event = value;
   return typeof event.type === "number" && typeof event.timestamp === "number";
 }
 function hasFullSnapshot(events) {
-  return events.some((event) => event.type === FULL_SNAPSHOT_TYPE);
+  return events.some((event) => event.type === REPLAY_EVENT_TYPE.FullSnapshot);
 }
 function requestToPromise(request) {
   return new Promise((resolve, reject) => {
@@ -1238,6 +2508,9 @@ function createReplaySession(options = {}) {
     backup.schedule();
   };
   const recorder = options.recorder ?? new RingBufferRecorder({
+    ...options.trackCanvasInteractions === false ? { trackCanvasInteractions: false } : {},
+    ...options.windowMs === void 0 ? {} : { windowMs: options.windowMs },
+    onFullSnapshot: options.onFullSnapshot,
     privacyConfig: options.privacyConfig,
     onChange: scheduleBackup
   });
@@ -1267,6 +2540,9 @@ function createReplaySession(options = {}) {
     },
     clearReportStart() {
       recorder.clearTailCutoff();
+    },
+    setWindowMs(windowMs) {
+      recorder.setWindowMs(windowMs);
     }
   };
 }
@@ -1298,7 +2574,22 @@ class SessionReplayCaptureController {
     listener(this.snapshot);
     return () => this.listeners.delete(listener);
   }
+  /**
+   * 녹화를 시작하고 첨부 가능 여부를 묻는다.
+   *
+   * 녹화는 응답을 기다리지 않는다. 한도는 첨부할 수 있는지만 정하고, 실제 판정은 이슈를 저장할
+   * 때 서버가 한다. 응답을 기다렸다 시작하면 그 사이 화면이 리플레이에서 빠진다.
+   *
+   * 마스킹 설정은 기본값을 사용한다. rrweb 은 기록하는 순간 가리므로, 테넌트별 마스킹을
+   * 서버에서 받게 되면 녹화 시작을 그 응답 뒤로 옮기거나 받은 뒤 다시 시작해야 한다.
+   */
   initialize() {
+    if (!this.recorder && !this.destroyed) {
+      const recorder = this.options.createRecorder ? this.options.createRecorder() : createReplaySession();
+      recorder.start();
+      this.recorder = recorder;
+      this.setSnapshot({ available: true });
+    }
     if (this.initializePromise) {
       return this.initializePromise;
     }
@@ -1307,31 +2598,25 @@ class SessionReplayCaptureController {
     });
     return this.initializePromise;
   }
+  /**
+   * 첨부 가능 여부와 기록 구간 길이를 다시 묻는다. 로그인·로그아웃처럼 인증이 바뀔 때 부른다.
+   * 녹화는 건드리지 않는다 — 다시 시작하면 그때까지 모은 구간이 사라진다.
+   */
   async refresh() {
     var _a, _b;
     try {
       const data = await this.options.loadCapabilities();
       if (this.destroyed) return;
       const sessionReplay = data == null ? void 0 : data.sessionReplay;
-      const canPrepare = Boolean((_a = sessionReplay == null ? void 0 : sessionReplay.canPrepareSessionReplay) == null ? void 0 : _a.enabled);
-      const canAttach = Boolean((_b = sessionReplay == null ? void 0 : sessionReplay.canAttachSessionReplay) == null ? void 0 : _b.enabled);
-      this.stopRecorder();
-      if (!canPrepare) {
-        this.setSnapshot({ available: false, canAttach: false, error: null });
-        return;
-      }
-      const recorder = this.createRecorder((sessionReplay == null ? void 0 : sessionReplay.privacyConfig) ?? void 0);
-      recorder.start();
-      this.recorder = recorder;
-      this.setSnapshot({ available: true, canAttach, error: null });
-    } catch (error) {
-      if (this.destroyed) return;
-      this.stopRecorder();
+      const windowSeconds = sessionReplay == null ? void 0 : sessionReplay.windowSeconds;
+      if (typeof windowSeconds === "number") (_a = this.recorder) == null ? void 0 : _a.setWindowMs(windowSeconds * 1e3);
       this.setSnapshot({
-        available: false,
-        canAttach: false,
-        error: readErrorMessage(error)
+        canAttach: Boolean((_b = sessionReplay == null ? void 0 : sessionReplay.canAttachSessionReplay) == null ? void 0 : _b.enabled),
+        error: null
       });
+    } catch (error) {
+      if (this.destroyed) return;
+      this.setSnapshot({ canAttach: false, error: readErrorMessage(error) });
     }
   }
   setEnabled(enabled) {
@@ -1352,198 +2637,19 @@ class SessionReplayCaptureController {
     return this.recorder.snapshot();
   }
   destroy() {
-    this.destroyed = true;
-    this.stopRecorder();
-    this.listeners.clear();
-  }
-  createRecorder(privacyConfig) {
-    return this.options.createRecorder ? this.options.createRecorder(privacyConfig) : createReplaySession({ privacyConfig });
-  }
-  stopRecorder() {
     var _a;
-    (_a = this.recorder) == null ? void 0 : _a.stop();
-    this.recorder = null;
-  }
-  setSnapshot(next) {
-    this.snapshot = {
-      ...this.snapshot,
-      ...next
-    };
-    this.listeners.forEach((listener) => listener(this.snapshot));
-  }
-}
-function forEachElementDeep(root, callback) {
-  if (root instanceof Element) {
-    callback(root);
-    if (root.shadowRoot) {
-      forEachElementDeep(root.shadowRoot, callback);
-    }
-  }
-  Array.from(root.children).forEach((child) => {
-    forEachElementDeep(child, callback);
-  });
-}
-const SCREENSHOT_FULL_MASK_SELECTOR = SESSION_REPLAY_FULL_MASK_SELECTOR;
-const SCREENSHOT_BLOCK_SELECTOR = SESSION_REPLAY_BLOCK_SELECTOR;
-const SCREENSHOT_MASK_BACKGROUND = "rgba(148, 148, 148, 0.28)";
-const SCREENSHOT_BLOCK_BACKGROUND = "rgba(148, 148, 148, 0.85)";
-const MASK_LABEL_WIDTH = 44;
-const MASK_LABEL_HEIGHT = 16;
-const MASK_LABEL_IMAGE = `url("data:image/svg+xml;charset=utf-8,${encodeURIComponent(
-  `<svg xmlns="http://www.w3.org/2000/svg" width="${MASK_LABEL_WIDTH}" height="${MASK_LABEL_HEIGHT}" viewBox="0 0 ${MASK_LABEL_WIDTH} ${MASK_LABEL_HEIGHT}"><text x="${MASK_LABEL_WIDTH / 2}" y="12" text-anchor="middle" font-family="sans-serif" font-size="11" font-weight="600" fill="#262626">가려짐</text></svg>`
-)}")`;
-const MASK_LABEL_MIN_WIDTH = MASK_LABEL_WIDTH + 8;
-const MASK_LABEL_MIN_HEIGHT = MASK_LABEL_HEIGHT + 8;
-const TEXT_HIDING_PROPERTIES = [
-  ["color", "transparent"],
-  ["-webkit-text-fill-color", "transparent"],
-  ["text-shadow", "none"],
-  ["fill", "transparent"]
-];
-const REPLACED_MEDIA_SELECTOR = "img, svg, video, canvas, picture, iframe, object, embed";
-const VALUE_ELEMENT_SELECTOR = "input, textarea, select";
-const SENSITIVE_AUTOCOMPLETE_TOKENS = /* @__PURE__ */ new Set([
-  // 자격증명
-  "current-password",
-  "new-password",
-  "one-time-code",
-  // 결제
-  "cc-number",
-  "cc-exp",
-  "cc-exp-month",
-  "cc-exp-year",
-  "cc-csc",
-  "cc-name",
-  "cc-type",
-  "cc-given-name",
-  "cc-additional-name",
-  "cc-family-name",
-  // 신원
-  "name",
-  "given-name",
-  "additional-name",
-  "family-name",
-  "honorific-prefix",
-  "honorific-suffix",
-  "nickname",
-  "bday",
-  "bday-day",
-  "bday-month",
-  "bday-year",
-  "sex",
-  // 주소
-  "street-address",
-  "address-line1",
-  "address-line2",
-  "address-line3",
-  "postal-code",
-  // 연락처
-  "tel",
-  "tel-national",
-  "tel-local",
-  "tel-area-code",
-  "email",
-  "impp"
-]);
-function redactScreenshotText(text) {
-  return redactEmails(redactSensitiveValues(text));
-}
-function matchesSafely(element, selector) {
-  try {
-    return element.matches(selector);
-  } catch {
-    return false;
-  }
-}
-function closestSafely(element, selector) {
-  if (!element) return null;
-  try {
-    return element.closest(selector);
-  } catch {
-    return null;
-  }
-}
-function hasSensitiveValueHint(element) {
-  var _a;
-  if (((_a = element.getAttribute("type")) == null ? void 0 : _a.toLowerCase()) === "password") {
-    return true;
-  }
-  const autocomplete = element.getAttribute("autocomplete");
-  if (!autocomplete) return false;
-  return autocomplete.toLowerCase().split(/\s+/).some((token) => SENSITIVE_AUTOCOMPLETE_TOKENS.has(token));
-}
-const overwriteProperty = (element, name, value) => {
-  const style = element.style;
-  style == null ? void 0 : style.setProperty(name, value, "important");
-};
-function coverMaskedRegion(region, setProperty) {
-  setProperty(region, "background-color", SCREENSHOT_MASK_BACKGROUND);
-  forEachElementDeep(region, (node) => {
-    if (!isElementFullyMasked(node)) return;
-    TEXT_HIDING_PROPERTIES.forEach(([name, value]) => setProperty(node, name, value));
-    if (matchesSafely(node, REPLACED_MEDIA_SELECTOR)) {
-      setProperty(node, "visibility", "hidden");
-    }
-  });
-}
-function parsePixels(value) {
-  const parsed = Number.parseFloat(value ?? "");
-  return Number.isFinite(parsed) ? parsed : 0;
-}
-function fitsMaskLabel(region) {
-  const rect = region.getBoundingClientRect();
-  const style = region.style;
-  const width = rect.width || parsePixels(style == null ? void 0 : style.width);
-  const height = rect.height || parsePixels(style == null ? void 0 : style.height);
-  return width >= MASK_LABEL_MIN_WIDTH && height >= MASK_LABEL_MIN_HEIGHT;
-}
-function coverBlockedRegion(region, setProperty) {
-  const labeled = fitsMaskLabel(region);
-  setProperty(region, "visibility", "visible");
-  setProperty(region, "background-color", SCREENSHOT_BLOCK_BACKGROUND);
-  setProperty(region, "background-image", labeled ? MASK_LABEL_IMAGE : "none");
-  if (labeled) {
-    setProperty(region, "background-repeat", "no-repeat");
-    setProperty(region, "background-position", "center");
-    setProperty(region, "background-size", "auto");
+    this.destroyed = true;
+    (_a = this.recorder) == null ? void 0 : _a.stop();
+    this.recorder = null;
+    this.listeners.clear();
   }
-  TEXT_HIDING_PROPERTIES.forEach(([name, value]) => setProperty(region, name, value));
-  setProperty(region, "pointer-events", "none");
-  forEachElementDeep(region, (descendant) => {
-    if (descendant !== region) {
-      setProperty(descendant, "visibility", "hidden");
-    }
-  });
-}
-function coverPrivateRegions(root, setProperty) {
-  const blocked = [];
-  const masked = [];
-  forEachElementDeep(root, (element) => {
-    if (matchesSafely(element, SCREENSHOT_BLOCK_SELECTOR)) {
-      blocked.push(element);
-      return;
-    }
-    if (matchesSafely(element, SCREENSHOT_FULL_MASK_SELECTOR) && isElementFullyMasked(element)) {
-      masked.push(element);
-    }
-  });
-  masked.forEach((region) => coverMaskedRegion(region, setProperty));
-  blocked.forEach((region) => coverBlockedRegion(region, setProperty));
-}
-function applyScreenshotPrivacyMask(clonedRoot) {
-  coverPrivateRegions(clonedRoot, overwriteProperty);
-  const walker = clonedRoot.ownerDocument.createTreeWalker(clonedRoot, NodeFilter.SHOW_TEXT);
-  for (let node = walker.nextNode(); node; node = walker.nextNode()) {
-    const text = node.nodeValue;
-    if (!text) continue;
-    node.nodeValue = redactScreenshotText(text);
+  setSnapshot(next) {
+    this.snapshot = {
+      ...this.snapshot,
+      ...next
+    };
+    this.listeners.forEach((listener) => listener(this.snapshot));
   }
-  clonedRoot.querySelectorAll(VALUE_ELEMENT_SELECTOR).forEach((element) => {
-    const value = element.getAttribute("value");
-    if (!value) return;
-    const hidden = closestSafely(element, SCREENSHOT_BLOCK_SELECTOR) !== null || isElementFullyMasked(element) || hasSensitiveValueHint(element);
-    element.setAttribute("value", hidden ? "" : redactScreenshotText(value));
-  });
 }
 const SCREENSHOT_DATA_URL_QUALITY = 0.95;
 let nextCaptureRunId = 0;
@@ -1763,10 +2869,18 @@ function blobToDataUrl(blob) {
     reader.readAsDataURL(blob);
   });
 }
+function captureOrigin(element) {
+  if (element === document.documentElement || element === document.body) {
+    return { x: 0, y: 0 };
+  }
+  const rect = element.getBoundingClientRect();
+  return { x: rect.left, y: rect.top };
+}
 async function captureWithModernScreenshot(options) {
   const { domToBlob } = await loadModernScreenshot();
   const { element, excludeSelectors = [], width, height, scale = getCaptureScale() } = options;
   await waitForDocumentFonts();
+  const canvasFrames = await grabCanvasFrames(element, excludeSelectors);
   const attributeNames = createCaptureAttributeNames();
   const stickySnapshot = createModernStickySnapshot(element, attributeNames);
   const excludeSnapshot = createExcludeElementSnapshot(element, excludeSelectors, attributeNames);
@@ -1793,8 +2907,21 @@ async function captureWithModernScreenshot(options) {
     if (height) {
       captureOptions.height = height;
     }
-    return await blobToDataUrl(await domToBlob(element, captureOptions));
+    const captured = await domToBlob(element, captureOptions);
+    if (canvasFrames.length === 0) {
+      return await blobToDataUrl(captured);
+    }
+    return await blobToDataUrl(
+      await overlayCanvasFrames(
+        captured,
+        canvasFrames,
+        captureOrigin(element),
+        width ?? element.getBoundingClientRect().width,
+        SCREENSHOT_DATA_URL_QUALITY
+      )
+    );
   } finally {
+    canvasFrames.forEach((frame) => frame.bitmap.close());
     excludeSnapshot.cleanup();
     stickySnapshot.cleanup();
   }
@@ -1879,7 +3006,7 @@ async function calculateSha256Hex(file) {
 }
 function normalizeUploadMimeType(mimeType, mediaType) {
   var _a;
-  const fallback = mediaType === "screenshot" ? "image/webp" : mediaType === "replay" ? "application/gzip" : "video/webm";
+  const fallback = mediaType === "screenshot" ? "image/webp" : mediaType === "replay" || mediaType === "socket" ? "application/gzip" : "video/webm";
   const normalized = (_a = (mimeType || fallback).split(";", 1)[0]) == null ? void 0 : _a.trim().toLowerCase();
   return normalized && normalized.length > 0 ? normalized : fallback;
 }
@@ -3772,22 +4899,28 @@ function isAppRequest(log) {
   if (log.detailLevel === "timing-only") return false;
   return !RESOURCE_REQUEST_TYPES.has((log.type ?? "").toLowerCase());
 }
+function takeLast(items, count2) {
+  return count2 > 0 ? items.slice(-count2) : [];
+}
 function selectNetworkLogsForSubmit(logs) {
   const candidates = logs.filter((log) => !isExcludedRequestType(log.type));
-  const detailed = candidates.filter(isAppRequest);
+  const sockets = candidates.filter(isSocketLog);
+  const detailed = candidates.filter((log) => isAppRequest(log) && !isSocketLog(log));
   const timing = candidates.filter((log) => !isAppRequest(log));
-  const keptDetailed = detailed.slice(-NETWORK_LOG_SUBMIT_LIMIT);
+  const keptSockets = takeLast(sockets, NETWORK_LOG_SUBMIT_LIMIT);
+  const keptDetailed = takeLast(detailed, NETWORK_LOG_SUBMIT_LIMIT - keptSockets.length);
   const timingQuota = Math.min(
     NETWORK_LOG_TIMING_SUBMIT_CAP,
-    NETWORK_LOG_SUBMIT_LIMIT - keptDetailed.length
+    NETWORK_LOG_SUBMIT_LIMIT - keptSockets.length - keptDetailed.length
   );
   const failedTiming = timing.filter((log) => log.statusCode >= 400);
   const restTiming = timing.filter((log) => log.statusCode < 400);
-  const keptTiming = [
-    ...failedTiming.slice(-timingQuota),
-    ...restTiming.slice(-Math.max(0, timingQuota - failedTiming.length))
-  ];
-  return [...keptDetailed, ...keptTiming].sort((a2, b) => a2.timestamp - b.timestamp);
+  const keptFailed = takeLast(failedTiming, timingQuota);
+  const keptTiming = [...keptFailed, ...takeLast(restTiming, timingQuota - keptFailed.length)];
+  return [...keptSockets, ...keptDetailed, ...keptTiming].sort((a2, b) => a2.timestamp - b.timestamp);
+}
+function isSocketLog(log) {
+  return log.type === "websocket";
 }
 const CONSOLE_METHODS = ["log", "warn", "error", "info", "debug"];
 function methodToLogType(method) {
@@ -3991,190 +5124,6 @@ class ConsoleCollector {
     (_a = this.onChange) == null ? void 0 : _a.call(this);
   }
 }
-const NETWORK_LOG_IMAGE_BODY_LIMIT_BYTES = 64 * 1024;
-const BODY_DENIED_MIME_PREFIXES = ["font/", "video/", "audio/", "model/", "multipart/"];
-const STREAMING_MIME_TYPES = /* @__PURE__ */ new Set(["text/event-stream", "application/x-ndjson"]);
-const BODY_DENIED_MIME_TYPES = /* @__PURE__ */ new Set([
-  "application/wasm",
-  "application/font-woff",
-  "application/font-woff2",
-  "application/x-font-ttf",
-  "application/x-font-otf",
-  "application/vnd.ms-fontobject",
-  "application/pdf",
-  "application/zip",
-  "application/gzip",
-  "application/x-gzip",
-  "application/x-tar"
-]);
-const OCTET_STREAM_MIME = "application/octet-stream";
-const OCTET_STREAM_BODY_LIMIT_BYTES = 32 * 1024;
-function isImageMimeType(mimeType) {
-  return Boolean(mimeType == null ? void 0 : mimeType.startsWith("image/"));
-}
-function isBodyDeniedMimeType(mimeType) {
-  if (!mimeType) return false;
-  return BODY_DENIED_MIME_PREFIXES.some((prefix) => mimeType.startsWith(prefix)) || BODY_DENIED_MIME_TYPES.has(mimeType) || STREAMING_MIME_TYPES.has(mimeType);
-}
-function getResponseBodyLimitBytes(mimeType) {
-  if (isBodyDeniedMimeType(mimeType)) return 0;
-  if (isImageMimeType(mimeType)) return NETWORK_LOG_IMAGE_BODY_LIMIT_BYTES;
-  if (mimeType === OCTET_STREAM_MIME) return OCTET_STREAM_BODY_LIMIT_BYTES;
-  return NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES;
-}
-const NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES = 256 * 1024;
-const NETWORK_LOG_TRANSPORT_BODY_BUDGET_BYTES = 2 * 1024 * 1024;
-function getUtf8ByteLength(value) {
-  let bytes = 0;
-  for (let index = 0; index < value.length; index += 1) {
-    const codePoint = value.codePointAt(index) ?? 0;
-    if (codePoint > 65535) {
-      index += 1;
-    }
-    if (codePoint <= 127) {
-      bytes += 1;
-    } else if (codePoint <= 2047) {
-      bytes += 2;
-    } else if (codePoint <= 65535) {
-      bytes += 3;
-    } else {
-      bytes += 4;
-    }
-  }
-  return bytes;
-}
-function estimateBase64DecodedBytes(value) {
-  const compact = value.replace(/^data:[^,]*,/i, "").replace(/\s/g, "");
-  if (!compact) return 0;
-  const padding = compact.endsWith("==") ? 2 : compact.endsWith("=") ? 1 : 0;
-  return Math.max(0, Math.floor(compact.length * 3 / 4) - padding);
-}
-function getCapturedBodySizeBytes(body, encoding) {
-  return encoding === "base64" ? estimateBase64DecodedBytes(body) : getUtf8ByteLength(body);
-}
-function isBodyWithinCaptureLimit(sizeBytes) {
-  return sizeBytes <= NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES;
-}
-function setOmittedBodyMetadata(log, field, reason, sizeBytes) {
-  if (field === "requestBody") {
-    delete log.requestBody;
-    log.requestBodyOmittedReason = reason;
-    log.requestBodySizeBytes = sizeBytes;
-    return;
-  }
-  delete log.responseBody;
-  delete log.responseBodyEncoding;
-  log.responseBodyOmittedReason = reason;
-  log.responseBodySizeBytes = sizeBytes;
-}
-function omitOversizedIndividualBodies(logs) {
-  return logs.map((log) => {
-    const nextLog = { ...log };
-    if (nextLog.requestBody != null) {
-      const sizeBytes = getUtf8ByteLength(nextLog.requestBody);
-      if (sizeBytes > NETWORK_LOG_BODY_CAPTURE_LIMIT_BYTES) {
-        setOmittedBodyMetadata(nextLog, "requestBody", "too-large", sizeBytes);
-      }
-    }
-    if (nextLog.responseBody != null) {
-      const sizeBytes = getCapturedBodySizeBytes(
-        nextLog.responseBody,
-        nextLog.responseBodyEncoding
-      );
-      const limitBytes = getResponseBodyLimitBytes(nextLog.responseMimeType);
-      if (limitBytes === 0) {
-        setOmittedBodyMetadata(nextLog, "responseBody", "mime-type", sizeBytes);
-      } else if (sizeBytes > limitBytes) {
-        setOmittedBodyMetadata(nextLog, "responseBody", "too-large", sizeBytes);
-      }
-    }
-    return nextLog;
-  });
-}
-function omitNetworkLogBody(log, field, reason, sizeBytes) {
-  const nextLog = { ...log };
-  setOmittedBodyMetadata(nextLog, field, reason, sizeBytes);
-  return nextLog;
-}
-function compactNetworkLogsForTransport(logs, budgetBytes = NETWORK_LOG_TRANSPORT_BODY_BUDGET_BYTES) {
-  if (!logs) return void 0;
-  const compacted = omitOversizedIndividualBodies(logs);
-  const candidates = [];
-  compacted.forEach((log, index) => {
-    if (log.requestBody != null) {
-      candidates.push({
-        index,
-        field: "requestBody",
-        timestamp: log.timestamp,
-        sizeBytes: getUtf8ByteLength(log.requestBody)
-      });
-    }
-    if (log.responseBody != null) {
-      candidates.push({
-        index,
-        field: "responseBody",
-        timestamp: log.timestamp,
-        sizeBytes: getUtf8ByteLength(log.responseBody)
-      });
-    }
-  });
-  candidates.sort((a2, b) => {
-    const timestampDiff = b.timestamp - a2.timestamp;
-    if (timestampDiff !== 0) return timestampDiff;
-    const indexDiff = b.index - a2.index;
-    if (indexDiff !== 0) return indexDiff;
-    return a2.field === "responseBody" ? -1 : 1;
-  });
-  let usedBytes = 0;
-  for (const candidate of candidates) {
-    if (usedBytes + candidate.sizeBytes > budgetBytes) {
-      const log = compacted[candidate.index];
-      if (!log) continue;
-      setOmittedBodyMetadata(log, candidate.field, "transport-budget", candidate.sizeBytes);
-      continue;
-    }
-    usedBytes += candidate.sizeBytes;
-  }
-  return compacted;
-}
-const SELF_TRAFFIC_CLIENT_HEADER = "x-client-info";
-const SELF_TRAFFIC_CLIENT_VALUES = ["issue-sticker-sdk", "issue-sticker-extension"];
-const SELF_TRAFFIC_CLIENT_VALUE_SET = new Set(SELF_TRAFFIC_CLIENT_VALUES);
-function isSharedLocalHost(hostname) {
-  return hostname === "localhost" || hostname === "127.0.0.1" || hostname === "::1" || hostname === "0.0.0.0" || hostname.endsWith(".local") || hostname.endsWith(".localhost");
-}
-function readHeader(headers, headerName) {
-  if (!headers) return void 0;
-  const target = headerName.toLowerCase();
-  for (const [key, value] of Object.entries(headers)) {
-    if (key.toLowerCase() === target) return value;
-  }
-  return void 0;
-}
-function hasSelfTrafficHeader(headers) {
-  const clientInfo = readHeader(headers, SELF_TRAFFIC_CLIENT_HEADER);
-  return Boolean(clientInfo && SELF_TRAFFIC_CLIENT_VALUE_SET.has(clientInfo));
-}
-function isSelfTrafficOrigin(url, apiOrigins) {
-  if (apiOrigins.length === 0) return false;
-  let origin;
-  let hostname;
-  try {
-    const parsed = new URL(url);
-    origin = parsed.origin;
-    hostname = parsed.hostname;
-  } catch {
-    return false;
-  }
-  if (isSharedLocalHost(hostname)) return false;
-  return apiOrigins.some((candidate) => {
-    try {
-      return new URL(candidate).origin === origin;
-    } catch {
-      return false;
-    }
-  });
-}
 let registeredPristineFetch = null;
 function registerPristineFetch(fn) {
   if (!registeredPristineFetch) {
@@ -4380,6 +5329,7 @@ async function readXHRResponseBody(xhr, responseMimeType, contentLength) {
 class NetworkCollector {
   constructor(apiBaseUrl, options) {
     this.logs = [];
+    this.socketLogs = null;
     this.originalFetch = null;
     this.patchedFetch = null;
     this.originalXHROpen = null;
@@ -4419,9 +5369,24 @@ class NetworkCollector {
     this.repatchCount += 1;
     this.interceptFetch();
   }
+  /** 보관 로그 전체. 웹소켓 줄이 뒤에 붙는다. 로그를 읽는 쪽은 모두 이것이나 `getFilteredLogs` 를 부른다. */
   getLogs() {
+    var _a;
+    return [...this.logs, ...((_a = this.socketLogs) == null ? void 0 : _a.call(this)) ?? []];
+  }
+  /** 버퍼에 담은 로그만. 백업이 저장하는 것이다. 웹소켓 줄은 소켓 연결과 함께 따로 백업된다. */
+  getBufferedLogs() {
     return [...this.logs];
   }
+  /**
+   * 웹소켓 줄을 내줄 곳을 건다. 줄은 버퍼에 넣지 않고 읽을 때마다 받아 붙인다.
+   *
+   * 버퍼에 넣으면 연결이 열린 뒤 요청이 상한만큼 쌓였을 때 줄이 밀려난다. 오래 열어 두는
+   * 연결일수록 먼저 사라진다.
+   */
+  bindSocketLogs(source) {
+    this.socketLogs = source;
+  }
   /**
    * 패치가 볼 수 없는 요청(문서·리소스 로딩)을 밖에서 넣는다.
    *
@@ -4437,17 +5402,18 @@ class NetworkCollector {
    * 가 통째로 없어진다.
    */
   restore(logs) {
-    if (logs.length === 0) return;
-    this.logs = [...logs, ...this.logs].slice(-NETWORK_LOG_CLIENT_BUFFER_SIZE);
+    const buffered = logs.filter((log) => log.type !== "websocket");
+    if (buffered.length === 0) return;
+    this.logs = [...buffered, ...this.logs].slice(-NETWORK_LOG_CLIENT_BUFFER_SIZE);
   }
   /**
-   * 자기 트래픽을 걷어낸 보관 로그 전체.
+   * 자기 트래픽을 걷어낸 보관 로그 전체. 웹소켓 줄이 뒤에 붙는다.
    *
    * 여기서 제출 상한(50)까지 잘라내면 안 된다. 소비자가 헤더 기반 판정을 한 번 더 돌린 뒤
    * 마지막에 잘라야, 노이즈가 채운 자리 때문에 진짜 로그가 사라지지 않는다.
    */
   getFilteredLogs() {
-    return this.logs.filter((log) => !this.isServiceRequest(log.url));
+    return this.getLogs().filter((log) => !this.isServiceRequest(log.url));
   }
   clear() {
     this.logs = [];
@@ -4683,6 +5649,64 @@ class NetworkCollector {
     this.patchedXHR = null;
   }
 }
+async function sha256Hex(bytes) {
+  const digest = await crypto.subtle.digest("SHA-256", bytes.buffer);
+  return Array.from(new Uint8Array(digest)).map((byte) => byte.toString(16).padStart(2, "0")).join("");
+}
+function dropOldestFrames(connections, bytesToDrop) {
+  const order = connections.flatMap(
+    (connection, index) => connection.frames.map((frame) => {
+      var _a;
+      return { index, t: frame.t, bytes: ((_a = frame.data) == null ? void 0 : _a.length) ?? 0 };
+    })
+  ).sort((a2, b) => a2.t - b.t);
+  const dropCount = connections.map(() => 0);
+  const dropBytes = connections.map(() => 0);
+  let removed = 0;
+  for (const entry of order) {
+    if (removed >= bytesToDrop) break;
+    dropCount[entry.index] += 1;
+    dropBytes[entry.index] += entry.bytes;
+    removed += entry.bytes;
+  }
+  return connections.map((connection, index) => {
+    const count2 = dropCount[index];
+    if (count2 === 0) return connection;
+    return {
+      ...connection,
+      frames: connection.frames.slice(count2),
+      droppedFrames: connection.droppedFrames + count2,
+      droppedBytes: connection.droppedBytes + dropBytes[index]
+    };
+  });
+}
+const FIT_ATTEMPTS = 6;
+async function serializeSocketTranscript(connections, maxBytes = SOCKET_TRANSCRIPT_MAX_BYTES) {
+  const frameCount = connections.reduce(
+    (sum, connection) => sum + connection.frames.length + connection.droppedFrames,
+    0
+  );
+  if (connections.length === 0 || frameCount === 0) return null;
+  let current = connections;
+  let payload = gzip_1(JSON.stringify({ connections: current }));
+  for (let attempt = 0; attempt < FIT_ATTEMPTS && payload.byteLength > maxBytes; attempt += 1) {
+    const storedBytes = current.reduce(
+      (sum, connection) => sum + storedFrameBytes(connection.frames),
+      0
+    );
+    if (storedBytes === 0) break;
+    const overRatio = 1 - maxBytes / payload.byteLength;
+    current = dropOldestFrames(current, storedBytes * Math.min(1, overRatio + 0.1));
+    payload = gzip_1(JSON.stringify({ connections: current }));
+  }
+  return {
+    payload,
+    checksumSha256: await sha256Hex(payload),
+    sizeBytes: payload.byteLength,
+    connectionCount: connections.length,
+    frameCount
+  };
+}
 var NetworkLogType = /* @__PURE__ */ ((NetworkLogType2) => {
   NetworkLogType2["MAIN_FRAME"] = "main_frame";
   NetworkLogType2["SUB_FRAME"] = "sub_frame";
@@ -14230,6 +15254,20 @@ function filterExcludeServiceRelatedConsoleLogs(consoleLogs) {
     return !isIssueStickerInternalConsoleLog(log) && !isIssueStickerServiceConsoleLog(log);
   });
 }
+const TRANSCRIPT_CONTENT_TYPE = "application/gzip";
+async function uploadSocketTranscript(api, snapshot, options = {}) {
+  if (snapshot.sizeBytes > SOCKET_TRANSCRIPT_MAX_BYTES) return null;
+  try {
+    const file = new File([snapshot.payload], "socket-transcript.json.gz", {
+      type: TRANSCRIPT_CONTENT_TYPE
+    });
+    const uploaded = await uploadSignedMediaWithApi(api, file, "socket", options);
+    return { uploadId: uploaded.id };
+  } catch (error) {
+    devLogger.error("socketTranscriptUpload", "소켓 전사 업로드 실패:", error);
+    return null;
+  }
+}
 function buildExternalUserPayload(user) {
   if (!user) return {};
   return {
@@ -14238,60 +15276,63 @@ function buildExternalUserPayload(user) {
   };
 }
 export {
-  getNotionPageMetadata as $,
-  getLogBackupSessionId as A,
-  createIndexedDbLogBackup as B,
+  Check as $,
+  trimLogBackupPayload as A,
+  createSafeLogBackup as B,
   ConsoleCollector as C,
-  PopoverTrigger as D,
-  Input as E,
-  PopoverContent as F,
-  Select$1 as G,
-  SelectTrigger as H,
+  getLogBackupSessionId as D,
+  createIndexedDbLogBackup as E,
+  PopoverTrigger as F,
+  Input as G,
+  PopoverContent as H,
   ISSUE_STICKER_INTERNAL_LOG_PREFIX as I,
-  SelectValue as J,
-  SelectContent as K,
+  Select$1 as J,
+  SelectTrigger as K,
   Label as L,
-  SelectItem as M,
+  SelectValue as M,
   NetworkCollector as N,
-  getJiraMetadata as O,
+  SelectContent as O,
   Popover as P,
-  buildJiraIssueFields as Q,
-  Button$1 as R,
+  SelectItem as Q,
+  getJiraMetadata as R,
   ScreenRecordingController as S,
-  Root2 as T,
-  Trigger as U,
-  ChevronDown as V,
-  Portal as W,
-  Content2 as X,
-  Check as Y,
-  X as Z,
-  DatePicker as _,
+  buildJiraIssueFields as T,
+  Button$1 as U,
+  Root2 as V,
+  WebSocketCollector as W,
+  Trigger as X,
+  ChevronDown as Y,
+  Portal as Z,
+  Content2 as _,
   uploadSignedMediaWithApi as a,
-  buildNotionFieldViews as a0,
-  DirectUploadError as a1,
-  toast as a2,
-  getSnapshot as a3,
-  subscribe as a4,
-  getRegisteredUploadId as a5,
-  ChevronRight as a6,
-  ReactRemoveScroll as a7,
-  hideOthers as a8,
-  useFocusGuards as a9,
-  FocusScope as aa,
-  getExposedJiraFields as ab,
-  isJiraFieldExposed as ac,
-  normalizeExposedJiraFields as ad,
-  getPrimaryJiraMapping as ae,
-  createCollection as af,
-  useDirection as ag,
-  getPrimaryNotionMapping as ah,
-  buttonVariants as ai,
-  findElementBySelector as aj,
-  findElementByXPath as ak,
-  OnboardingProvider as al,
-  useOnboardingTarget as am,
-  useOnboardingFlow as an,
-  PopoverAnchor as ao,
+  X as a0,
+  DatePicker as a1,
+  getNotionPageMetadata as a2,
+  buildNotionFieldViews as a3,
+  DirectUploadError as a4,
+  toast as a5,
+  getSnapshot as a6,
+  subscribe as a7,
+  getRegisteredUploadId as a8,
+  ChevronRight as a9,
+  ReactRemoveScroll as aa,
+  hideOthers as ab,
+  useFocusGuards as ac,
+  FocusScope as ad,
+  getExposedJiraFields as ae,
+  isJiraFieldExposed as af,
+  normalizeExposedJiraFields as ag,
+  getPrimaryJiraMapping as ah,
+  createCollection as ai,
+  useDirection as aj,
+  getPrimaryNotionMapping as ak,
+  buttonVariants as al,
+  findElementBySelector as am,
+  findElementByXPath as an,
+  OnboardingProvider as ao,
+  useOnboardingTarget as ap,
+  useOnboardingFlow as aq,
+  PopoverAnchor as ar,
   buildJiraCreateFields as b,
   captureWithModernScreenshot as c,
   directUploadToSignedUrl as d,
@@ -14312,9 +15353,9 @@ export {
   selectNetworkLogsForSubmit as s,
   sanitizeString as t,
   uploadScreenshotDataUrls as u,
-  getCurrentPageUrl as v,
-  SessionReplayCaptureController as w,
-  preloadModernScreenshot as x,
-  trimLogBackupPayload as y,
-  createSafeLogBackup as z
+  serializeSocketTranscript as v,
+  uploadSocketTranscript as w,
+  getCurrentPageUrl as x,
+  SessionReplayCaptureController as y,
+  preloadModernScreenshot as z
 };