@highlight-run/rrweb 2.0.0-lambda.7 → 2.0.0-lambda.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/rrweb.cjs CHANGED
@@ -1875,6 +1875,7 @@ function requireStringifier$1() {
1875
1875
  hasRequiredStringifier$1 = 1;
1876
1876
  const STYLE_TAG = /(<)(\/?style\b)/gi;
1877
1877
  const COMMENT_OPEN = /(<)(!--)/g;
1878
+ const AT_NAME_END = /[\t\n\f\r "#'()/;[\\\]{}]/;
1878
1879
  function escapeHTMLInCSS(str) {
1879
1880
  if (typeof str !== "string") return str;
1880
1881
  if (!str.includes("<")) return str;
@@ -1900,12 +1901,13 @@ function requireStringifier$1() {
1900
1901
  function atruleStart(str, node2) {
1901
1902
  let name = "@" + node2.name;
1902
1903
  let params = node2.params ? str.rawValue(node2, "params") : "";
1903
- if (typeof node2.raws.afterName !== "undefined") {
1904
- name += node2.raws.afterName;
1905
- } else if (params) {
1906
- name += " ";
1904
+ let afterName = node2.raws.afterName;
1905
+ if (typeof afterName === "undefined") {
1906
+ afterName = params ? " " : "";
1907
+ } else if (afterName === "" && params && !AT_NAME_END.test(params[0])) {
1908
+ afterName = " ";
1907
1909
  }
1908
- return name + params;
1910
+ return name + afterName + params;
1909
1911
  }
1910
1912
  function pushBody(str, stack, node2) {
1911
1913
  let nodes = node2.nodes;
@@ -1917,10 +1919,15 @@ function requireStringifier$1() {
1917
1919
  let semicolon = str.raw(node2, "semicolon");
1918
1920
  let isDocument = node2.type === "document";
1919
1921
  for (let i2 = nodes.length - 1; i2 >= 0; i2--) {
1922
+ let child = nodes[i2];
1923
+ let childSemicolon = last !== i2 || semicolon;
1924
+ if (!childSemicolon && i2 < nodes.length - 1 && (child.type === "atrule" && !child.nodes || child.type === "decl" && child.prop.startsWith("--"))) {
1925
+ childSemicolon = true;
1926
+ }
1920
1927
  stack.push({
1921
1928
  document: isDocument,
1922
- node: nodes[i2],
1923
- semicolon: last !== i2 || semicolon
1929
+ node: child,
1930
+ semicolon: childSemicolon
1924
1931
  });
1925
1932
  }
1926
1933
  }
@@ -2211,6 +2218,9 @@ function requireStringifier$1() {
2211
2218
  return value;
2212
2219
  }
2213
2220
  root(node2) {
2221
+ if (node2.source && node2.source.input.hasBOM) {
2222
+ this.builder("\uFEFF", node2, "start");
2223
+ }
2214
2224
  this.body(node2);
2215
2225
  if (node2.raws.after) {
2216
2226
  let after = node2.raws.after;
@@ -3283,15 +3293,12 @@ function requirePreviousMap$1() {
3283
3293
  }
3284
3294
  loadFile(path, cssFile, trusted) {
3285
3295
  if (!trusted && !this.unsafeMap) {
3286
- if (!/\.map$/i.test(path)) {
3296
+ if (!/\.map$/i.test(path)) return void 0;
3297
+ if (!cssFile) return void 0;
3298
+ let rel = relative(dirname(cssFile), path);
3299
+ if (rel === ".." || rel.startsWith(".." + sep) || isAbsolute(rel)) {
3287
3300
  return void 0;
3288
3301
  }
3289
- if (cssFile) {
3290
- let relativePath = relative(dirname(cssFile), path);
3291
- if (relativePath === ".." || relativePath.startsWith(".." + sep) || isAbsolute(relativePath)) {
3292
- return void 0;
3293
- }
3294
- }
3295
3302
  }
3296
3303
  this.root = dirname(path);
3297
3304
  if (existsSync(path)) {
@@ -3663,6 +3670,7 @@ function requireList$1() {
3663
3670
  return list.split(string, spaces);
3664
3671
  },
3665
3672
  split(string, separators, last) {
3673
+ if (!string) return [];
3666
3674
  let array = [];
3667
3675
  let current = "";
3668
3676
  let split = false;
@@ -4949,11 +4957,16 @@ var hasRequiredWarning$1;
4949
4957
  function requireWarning$1() {
4950
4958
  if (hasRequiredWarning$1) return warning$1;
4951
4959
  hasRequiredWarning$1 = 1;
4960
+ let Container = requireContainer$1();
4961
+ let { my } = requireSymbols$1();
4952
4962
  class Warning {
4953
4963
  constructor(text, opts = {}) {
4954
4964
  this.type = "warning";
4955
4965
  this.text = text;
4956
4966
  if (opts.node && opts.node.source) {
4967
+ if (!opts.node[my]) {
4968
+ Container.rebuild(opts.node);
4969
+ }
4957
4970
  let range = opts.node.rangeBy(opts);
4958
4971
  this.line = range.start.line;
4959
4972
  this.column = range.start.column;
@@ -5463,14 +5476,19 @@ function requireLazyResult$1() {
5463
5476
  }
5464
5477
  if (visit2.iterator !== 0) {
5465
5478
  let iterator = visit2.iterator;
5479
+ if (visit2.descending) {
5480
+ visit2.descending = false;
5481
+ node2.indexes[iterator] += 1;
5482
+ }
5466
5483
  let child;
5467
5484
  while (child = node2.nodes[node2.indexes[iterator]]) {
5468
- node2.indexes[iterator] += 1;
5469
5485
  if (!child[isClean]) {
5470
5486
  child[isClean] = true;
5487
+ visit2.descending = true;
5471
5488
  stack.push(toStack(child));
5472
5489
  return;
5473
5490
  }
5491
+ node2.indexes[iterator] += 1;
5474
5492
  }
5475
5493
  visit2.iterator = 0;
5476
5494
  delete node2.indexes[iterator];
@@ -5500,12 +5518,16 @@ function requireLazyResult$1() {
5500
5518
  let visitNode = visit2.node;
5501
5519
  if (visit2.iterator !== 0) {
5502
5520
  let iterator = visit2.iterator;
5521
+ if (visit2.descending) {
5522
+ visit2.descending = false;
5523
+ visitNode.indexes[iterator] += 1;
5524
+ }
5503
5525
  let child;
5504
5526
  let descended = false;
5505
5527
  while (child = visitNode.nodes[visitNode.indexes[iterator]]) {
5506
- visitNode.indexes[iterator] += 1;
5507
5528
  if (!child[isClean]) {
5508
5529
  child[isClean] = true;
5530
+ visit2.descending = true;
5509
5531
  stack.push({
5510
5532
  eventIndex: 0,
5511
5533
  events: getEvents(child),
@@ -5515,6 +5537,7 @@ function requireLazyResult$1() {
5515
5537
  descended = true;
5516
5538
  break;
5517
5539
  }
5540
+ visitNode.indexes[iterator] += 1;
5518
5541
  }
5519
5542
  if (descended) continue;
5520
5543
  visit2.iterator = 0;
@@ -5677,7 +5700,7 @@ function requireProcessor$1() {
5677
5700
  let Root = requireRoot$1();
5678
5701
  class Processor {
5679
5702
  constructor(plugins = []) {
5680
- this.version = "8.5.19";
5703
+ this.version = "8.5.25";
5681
5704
  this.plugins = this.normalize(plugins);
5682
5705
  }
5683
5706
  normalize(plugins) {
@@ -6544,6 +6567,7 @@ function requireStringifier() {
6544
6567
  hasRequiredStringifier = 1;
6545
6568
  const STYLE_TAG = /(<)(\/?style\b)/gi;
6546
6569
  const COMMENT_OPEN = /(<)(!--)/g;
6570
+ const AT_NAME_END = /[\t\n\f\r "#'()/;[\\\]{}]/;
6547
6571
  function escapeHTMLInCSS(str) {
6548
6572
  if (typeof str !== "string") return str;
6549
6573
  if (!str.includes("<")) return str;
@@ -6569,12 +6593,13 @@ function requireStringifier() {
6569
6593
  function atruleStart(str, node2) {
6570
6594
  let name = "@" + node2.name;
6571
6595
  let params = node2.params ? str.rawValue(node2, "params") : "";
6572
- if (typeof node2.raws.afterName !== "undefined") {
6573
- name += node2.raws.afterName;
6574
- } else if (params) {
6575
- name += " ";
6596
+ let afterName = node2.raws.afterName;
6597
+ if (typeof afterName === "undefined") {
6598
+ afterName = params ? " " : "";
6599
+ } else if (afterName === "" && params && !AT_NAME_END.test(params[0])) {
6600
+ afterName = " ";
6576
6601
  }
6577
- return name + params;
6602
+ return name + afterName + params;
6578
6603
  }
6579
6604
  function pushBody(str, stack, node2) {
6580
6605
  let nodes = node2.nodes;
@@ -6586,10 +6611,15 @@ function requireStringifier() {
6586
6611
  let semicolon = str.raw(node2, "semicolon");
6587
6612
  let isDocument = node2.type === "document";
6588
6613
  for (let i2 = nodes.length - 1; i2 >= 0; i2--) {
6614
+ let child = nodes[i2];
6615
+ let childSemicolon = last !== i2 || semicolon;
6616
+ if (!childSemicolon && i2 < nodes.length - 1 && (child.type === "atrule" && !child.nodes || child.type === "decl" && child.prop.startsWith("--"))) {
6617
+ childSemicolon = true;
6618
+ }
6589
6619
  stack.push({
6590
6620
  document: isDocument,
6591
- node: nodes[i2],
6592
- semicolon: last !== i2 || semicolon
6621
+ node: child,
6622
+ semicolon: childSemicolon
6593
6623
  });
6594
6624
  }
6595
6625
  }
@@ -6880,6 +6910,9 @@ function requireStringifier() {
6880
6910
  return value;
6881
6911
  }
6882
6912
  root(node2) {
6913
+ if (node2.source && node2.source.input.hasBOM) {
6914
+ this.builder("\uFEFF", node2, "start");
6915
+ }
6883
6916
  this.body(node2);
6884
6917
  if (node2.raws.after) {
6885
6918
  let after = node2.raws.after;
@@ -7952,15 +7985,12 @@ function requirePreviousMap() {
7952
7985
  }
7953
7986
  loadFile(path, cssFile, trusted) {
7954
7987
  if (!trusted && !this.unsafeMap) {
7955
- if (!/\.map$/i.test(path)) {
7988
+ if (!/\.map$/i.test(path)) return void 0;
7989
+ if (!cssFile) return void 0;
7990
+ let rel = relative(dirname(cssFile), path);
7991
+ if (rel === ".." || rel.startsWith(".." + sep) || isAbsolute(rel)) {
7956
7992
  return void 0;
7957
7993
  }
7958
- if (cssFile) {
7959
- let relativePath = relative(dirname(cssFile), path);
7960
- if (relativePath === ".." || relativePath.startsWith(".." + sep) || isAbsolute(relativePath)) {
7961
- return void 0;
7962
- }
7963
- }
7964
7994
  }
7965
7995
  this.root = dirname(path);
7966
7996
  if (existsSync(path)) {
@@ -8332,6 +8362,7 @@ function requireList() {
8332
8362
  return list.split(string, spaces);
8333
8363
  },
8334
8364
  split(string, separators, last) {
8365
+ if (!string) return [];
8335
8366
  let array = [];
8336
8367
  let current = "";
8337
8368
  let split = false;
@@ -9618,11 +9649,16 @@ var hasRequiredWarning;
9618
9649
  function requireWarning() {
9619
9650
  if (hasRequiredWarning) return warning;
9620
9651
  hasRequiredWarning = 1;
9652
+ let Container = requireContainer();
9653
+ let { my } = requireSymbols();
9621
9654
  class Warning {
9622
9655
  constructor(text, opts = {}) {
9623
9656
  this.type = "warning";
9624
9657
  this.text = text;
9625
9658
  if (opts.node && opts.node.source) {
9659
+ if (!opts.node[my]) {
9660
+ Container.rebuild(opts.node);
9661
+ }
9626
9662
  let range = opts.node.rangeBy(opts);
9627
9663
  this.line = range.start.line;
9628
9664
  this.column = range.start.column;
@@ -10132,14 +10168,19 @@ function requireLazyResult() {
10132
10168
  }
10133
10169
  if (visit2.iterator !== 0) {
10134
10170
  let iterator = visit2.iterator;
10171
+ if (visit2.descending) {
10172
+ visit2.descending = false;
10173
+ node2.indexes[iterator] += 1;
10174
+ }
10135
10175
  let child;
10136
10176
  while (child = node2.nodes[node2.indexes[iterator]]) {
10137
- node2.indexes[iterator] += 1;
10138
10177
  if (!child[isClean]) {
10139
10178
  child[isClean] = true;
10179
+ visit2.descending = true;
10140
10180
  stack.push(toStack(child));
10141
10181
  return;
10142
10182
  }
10183
+ node2.indexes[iterator] += 1;
10143
10184
  }
10144
10185
  visit2.iterator = 0;
10145
10186
  delete node2.indexes[iterator];
@@ -10169,12 +10210,16 @@ function requireLazyResult() {
10169
10210
  let visitNode = visit2.node;
10170
10211
  if (visit2.iterator !== 0) {
10171
10212
  let iterator = visit2.iterator;
10213
+ if (visit2.descending) {
10214
+ visit2.descending = false;
10215
+ visitNode.indexes[iterator] += 1;
10216
+ }
10172
10217
  let child;
10173
10218
  let descended = false;
10174
10219
  while (child = visitNode.nodes[visitNode.indexes[iterator]]) {
10175
- visitNode.indexes[iterator] += 1;
10176
10220
  if (!child[isClean]) {
10177
10221
  child[isClean] = true;
10222
+ visit2.descending = true;
10178
10223
  stack.push({
10179
10224
  eventIndex: 0,
10180
10225
  events: getEvents(child),
@@ -10184,6 +10229,7 @@ function requireLazyResult() {
10184
10229
  descended = true;
10185
10230
  break;
10186
10231
  }
10232
+ visitNode.indexes[iterator] += 1;
10187
10233
  }
10188
10234
  if (descended) continue;
10189
10235
  visit2.iterator = 0;
@@ -10346,7 +10392,7 @@ function requireProcessor() {
10346
10392
  let Root = requireRoot();
10347
10393
  class Processor {
10348
10394
  constructor(plugins = []) {
10349
- this.version = "8.5.19";
10395
+ this.version = "8.5.25";
10350
10396
  this.plugins = this.normalize(plugins);
10351
10397
  }
10352
10398
  normalize(plugins) {
@@ -19149,18 +19195,528 @@ class Replayer {
19149
19195
  this.config.logger.log(REPLAY_CONSOLE_PREFIX, ...args);
19150
19196
  }
19151
19197
  }
19198
+ const RRWEB_EMBEDDED_CHANNEL = "rrweb-embedded";
19199
+ const RRWEB_EMBEDDED_PROTOCOL_VERSION = 1;
19200
+ const SERIALIZABLE_CONFIG_KEYS = [
19201
+ "speed",
19202
+ "maxSpeed",
19203
+ "loadTimeout",
19204
+ "skipInactive",
19205
+ "inactivePeriodThreshold",
19206
+ "showWarning",
19207
+ "showDebug",
19208
+ "blockClass",
19209
+ "liveMode",
19210
+ "insertStyleRules",
19211
+ "triggerFocus",
19212
+ "UNSAFE_replayCanvas",
19213
+ "cspContent",
19214
+ "pauseAnimation",
19215
+ "mouseTail",
19216
+ "useVirtualDom",
19217
+ "inactiveThreshold",
19218
+ "inactiveSkipTime"
19219
+ ];
19220
+ function pickSerializableConfig(config) {
19221
+ const out = {};
19222
+ if (config && typeof config === "object") {
19223
+ for (const key of SERIALIZABLE_CONFIG_KEYS) {
19224
+ const value = config[key];
19225
+ if (value !== void 0 && typeof value !== "function") {
19226
+ out[key] = value;
19227
+ }
19228
+ }
19229
+ }
19230
+ return out;
19231
+ }
19232
+ function wrap(message) {
19233
+ return {
19234
+ channel: RRWEB_EMBEDDED_CHANNEL,
19235
+ version: RRWEB_EMBEDDED_PROTOCOL_VERSION,
19236
+ message
19237
+ };
19238
+ }
19239
+ function isEnvelope(data) {
19240
+ if (!data || typeof data !== "object") return false;
19241
+ const e2 = data;
19242
+ return e2.channel === RRWEB_EMBEDDED_CHANNEL && e2.version === RRWEB_EMBEDDED_PROTOCOL_VERSION && !!e2.message && typeof e2.message === "object" && typeof e2.message.type === "string";
19243
+ }
19244
+ const PAYLOAD_EVENTS = /* @__PURE__ */ new Set([
19245
+ ReplayerEvents.Resize,
19246
+ ReplayerEvents.EventCast,
19247
+ ReplayerEvents.CustomEvent
19248
+ ]);
19249
+ class EmbeddedReplayerHost {
19250
+ constructor(options = {}) {
19251
+ __publicField(this, "root");
19252
+ __publicField(this, "parentWindow");
19253
+ __publicField(this, "timeUpdateIntervalMs");
19254
+ __publicField(this, "expectedParentOrigin");
19255
+ __publicField(this, "replayer", null);
19256
+ __publicField(this, "playing", false);
19257
+ __publicField(this, "timer", null);
19258
+ __publicField(this, "started", false);
19259
+ /**
19260
+ * Last layout the parent asked for. Retained because each `Replayer` builds
19261
+ * its own wrapper element, so a re-init would otherwise drop the scaling and
19262
+ * render the replay at 1:1 in the corner.
19263
+ */
19264
+ __publicField(this, "layout", null);
19265
+ __publicField(this, "onMessage", (event) => {
19266
+ if (event.source !== this.parentWindow) return;
19267
+ if (this.expectedParentOrigin === null) return;
19268
+ if (event.origin !== this.expectedParentOrigin) return;
19269
+ if (!isEnvelope(event.data)) return;
19270
+ try {
19271
+ this.handle(event.data.message);
19272
+ } catch (err) {
19273
+ this.post({
19274
+ type: "error",
19275
+ message: err instanceof Error ? err.message : String(err)
19276
+ });
19277
+ }
19278
+ });
19279
+ this.root = options.root ?? document.body;
19280
+ this.parentWindow = options.parentWindow ?? window.parent;
19281
+ this.timeUpdateIntervalMs = options.timeUpdateIntervalMs ?? 50;
19282
+ this.expectedParentOrigin = options.expectedParentOrigin ?? new URLSearchParams(location.search).get("parentOrigin") ?? null;
19283
+ }
19284
+ /** Install the message listener and announce readiness to the parent. */
19285
+ start() {
19286
+ if (this.started) return;
19287
+ this.started = true;
19288
+ if (this.expectedParentOrigin === null) {
19289
+ console.warn(
19290
+ "[rrweb-embedded] no parentOrigin configured; all incoming messages will be ignored"
19291
+ );
19292
+ }
19293
+ window.addEventListener("message", this.onMessage);
19294
+ this.post({ type: "ready" });
19295
+ }
19296
+ /** Tear everything down (also invoked on a `destroy` command). */
19297
+ stop() {
19298
+ var _a2;
19299
+ window.removeEventListener("message", this.onMessage);
19300
+ this.setPlaying(false);
19301
+ (_a2 = this.replayer) == null ? void 0 : _a2.destroy();
19302
+ this.replayer = null;
19303
+ this.started = false;
19304
+ }
19305
+ handle(command) {
19306
+ var _a2, _b, _c, _d, _e, _f, _g;
19307
+ switch (command.type) {
19308
+ case "ping":
19309
+ this.post({ type: "ready" });
19310
+ return;
19311
+ case "init":
19312
+ this.init(command.events, command.config, command.autoplay);
19313
+ return;
19314
+ case "play":
19315
+ (_a2 = this.replayer) == null ? void 0 : _a2.play(command.timeOffset ?? 0);
19316
+ this.setPlaying(true);
19317
+ return;
19318
+ case "pause":
19319
+ (_b = this.replayer) == null ? void 0 : _b.pause(command.timeOffset);
19320
+ this.setPlaying(false);
19321
+ this.postTime();
19322
+ return;
19323
+ case "resume":
19324
+ (_c = this.replayer) == null ? void 0 : _c.resume(command.timeOffset ?? 0);
19325
+ this.setPlaying(true);
19326
+ return;
19327
+ case "setLayout":
19328
+ this.layout = {
19329
+ scale: command.scale,
19330
+ anchor: command.anchor ?? "center"
19331
+ };
19332
+ this.applyLayout();
19333
+ this.postDimensions();
19334
+ return;
19335
+ case "setConfig":
19336
+ (_d = this.replayer) == null ? void 0 : _d.setConfig(pickSerializableConfig(command.config));
19337
+ return;
19338
+ case "replaceEvents":
19339
+ if (this.replayer) {
19340
+ this.replayer.replaceEvents(command.events);
19341
+ this.postInitialized();
19342
+ }
19343
+ return;
19344
+ case "addEvent":
19345
+ (_e = this.replayer) == null ? void 0 : _e.addEvent(command.event);
19346
+ return;
19347
+ case "enableInteract":
19348
+ (_f = this.replayer) == null ? void 0 : _f.enableInteract();
19349
+ return;
19350
+ case "disableInteract":
19351
+ (_g = this.replayer) == null ? void 0 : _g.disableInteract();
19352
+ return;
19353
+ case "destroy":
19354
+ this.stop();
19355
+ return;
19356
+ }
19357
+ }
19358
+ init(events, config, autoplay) {
19359
+ if (this.replayer) {
19360
+ this.setPlaying(false);
19361
+ this.replayer.destroy();
19362
+ }
19363
+ const replayerConfig = {
19364
+ ...pickSerializableConfig(config),
19365
+ root: this.root
19366
+ };
19367
+ this.replayer = new Replayer(events, replayerConfig);
19368
+ this.wireEvents(this.replayer);
19369
+ this.applyLayout();
19370
+ this.postInitialized();
19371
+ this.postDimensions();
19372
+ if (autoplay) {
19373
+ this.replayer.play(0);
19374
+ this.setPlaying(true);
19375
+ }
19376
+ }
19377
+ /**
19378
+ * Translate the parent's layout intent into styles on the replay wrapper.
19379
+ *
19380
+ * Mirrors what an embedder would otherwise apply from its own stylesheet:
19381
+ * `transform-origin: top left` with `left: 50%` to center horizontally, and
19382
+ * either `top: 50%` + a -50% Y translate to center vertically, or `top: 0`
19383
+ * with no Y translate to anchor at the top edge.
19384
+ */
19385
+ applyLayout() {
19386
+ var _a2;
19387
+ const wrapper = (_a2 = this.replayer) == null ? void 0 : _a2.wrapper;
19388
+ if (!wrapper || !this.layout) return;
19389
+ const { scale, anchor } = this.layout;
19390
+ const top = anchor === "top";
19391
+ wrapper.style.position = "absolute";
19392
+ wrapper.style.transformOrigin = "top left";
19393
+ wrapper.style.left = "50%";
19394
+ wrapper.style.top = top ? "0" : "50%";
19395
+ wrapper.style.transform = top ? `scale(${scale}) translate(-50%, 0)` : `scale(${scale}) translate(-50%, -50%)`;
19396
+ }
19397
+ /** Report the wrapper's rendered geometry; the parent cannot measure it. */
19398
+ postDimensions() {
19399
+ var _a2;
19400
+ const wrapper = (_a2 = this.replayer) == null ? void 0 : _a2.wrapper;
19401
+ if (!wrapper) return;
19402
+ const rect = wrapper.getBoundingClientRect();
19403
+ this.post({
19404
+ type: "dimensions",
19405
+ width: rect.width,
19406
+ height: rect.height,
19407
+ top: rect.top,
19408
+ left: rect.left
19409
+ });
19410
+ }
19411
+ /** Push the stable getters (metadata, activity intervals) to the parent. */
19412
+ postInitialized() {
19413
+ if (!this.replayer) return;
19414
+ this.post({
19415
+ type: "initialized",
19416
+ metadata: this.replayer.getMetaData(),
19417
+ activityIntervals: this.replayer.getActivityIntervals()
19418
+ });
19419
+ }
19420
+ wireEvents(replayer) {
19421
+ for (const name of Object.values(ReplayerEvents)) {
19422
+ replayer.on(name, (payload) => {
19423
+ if (name === ReplayerEvents.Finish) {
19424
+ this.setPlaying(false);
19425
+ this.postTime();
19426
+ }
19427
+ if (name === ReplayerEvents.Resize) {
19428
+ this.postDimensions();
19429
+ }
19430
+ this.post(
19431
+ PAYLOAD_EVENTS.has(name) && payload !== void 0 ? { type: "replayer-event", event: name, payload } : { type: "replayer-event", event: name }
19432
+ );
19433
+ });
19434
+ }
19435
+ }
19436
+ /* --- current-time telemetry ------------------------------------------- */
19437
+ setPlaying(playing) {
19438
+ if (this.playing === playing) return;
19439
+ this.playing = playing;
19440
+ if (playing) this.startTimePump();
19441
+ else this.stopTimePump();
19442
+ }
19443
+ startTimePump() {
19444
+ if (this.timer !== null) return;
19445
+ this.timer = setInterval(() => this.postTime(), this.timeUpdateIntervalMs);
19446
+ }
19447
+ /**
19448
+ * Push the current playback position across the bridge.
19449
+ *
19450
+ * The parent cannot read the position synchronously — it lives in this realm
19451
+ * behind an origin boundary — so the client's `getCurrentTime()` is only ever
19452
+ * as fresh as the last push. While playing, the pump keeps it current. When
19453
+ * playback stops the pump stops too, so the last pumped value would be up to
19454
+ * one interval stale; callers that seek from it (`play(getCurrentTime())` to
19455
+ * resume) would drift backwards. Pausing and finishing therefore push one
19456
+ * final, settled value.
19457
+ */
19458
+ postTime() {
19459
+ if (!this.replayer) return;
19460
+ this.post({ type: "time", currentTime: this.replayer.getCurrentTime() });
19461
+ }
19462
+ stopTimePump() {
19463
+ if (this.timer !== null) {
19464
+ clearInterval(this.timer);
19465
+ this.timer = null;
19466
+ }
19467
+ }
19468
+ post(message) {
19469
+ this.parentWindow.postMessage(
19470
+ wrap(message),
19471
+ this.expectedParentOrigin ?? "*"
19472
+ );
19473
+ }
19474
+ }
19475
+ function startEmbeddedReplayerHost(options) {
19476
+ const host2 = new EmbeddedReplayerHost(options);
19477
+ host2.start();
19478
+ return host2;
19479
+ }
19480
+ class EmbeddedReplayerClient {
19481
+ constructor(iframe, options = {}) {
19482
+ __publicField(this, "iframe");
19483
+ __publicField(this, "hostOrigin");
19484
+ __publicField(this, "listeners", /* @__PURE__ */ new Map());
19485
+ __publicField(this, "metadata", null);
19486
+ __publicField(this, "activityIntervals", []);
19487
+ __publicField(this, "dimensions", null);
19488
+ __publicField(this, "lastCurrentTime", 0);
19489
+ __publicField(this, "ready", false);
19490
+ __publicField(this, "readyResolvers", []);
19491
+ __publicField(this, "disposed", false);
19492
+ /**
19493
+ * Commands issued before the host handshakes. A command posted while the
19494
+ * iframe is still on its initial `about:blank` (which carries the PARENT's
19495
+ * origin) is rejected by the browser as an origin mismatch and lost — the
19496
+ * viewer calls `setLayout` on mount, well before the host boots. Buffer until
19497
+ * `ready`, then flush; by then the frame is on the host origin.
19498
+ */
19499
+ __publicField(this, "pending", []);
19500
+ __publicField(this, "onMessage", (event) => {
19501
+ if (event.source !== this.iframe.contentWindow) return;
19502
+ if (!isEnvelope(event.data)) return;
19503
+ this.handle(event.data.message);
19504
+ });
19505
+ this.iframe = iframe;
19506
+ this.hostOrigin = options.hostOrigin ?? "*";
19507
+ window.addEventListener("message", this.onMessage);
19508
+ this.probe();
19509
+ }
19510
+ /** Resolves once the host iframe has loaded and announced readiness. */
19511
+ whenReady() {
19512
+ if (this.ready) return Promise.resolve();
19513
+ return new Promise((resolve) => this.readyResolvers.push(resolve));
19514
+ }
19515
+ /* --- commands --------------------------------------------------------- */
19516
+ init(events, config, autoplay = false) {
19517
+ this.send({ type: "init", events, config, autoplay });
19518
+ }
19519
+ play(timeOffset) {
19520
+ this.send({ type: "play", timeOffset });
19521
+ }
19522
+ pause(timeOffset) {
19523
+ this.send({ type: "pause", timeOffset });
19524
+ }
19525
+ resume(timeOffset) {
19526
+ this.send({ type: "resume", timeOffset });
19527
+ }
19528
+ setConfig(config) {
19529
+ this.send({ type: "setConfig", config });
19530
+ }
19531
+ /**
19532
+ * Scale and position the replay. Compute `scale` from your own container size
19533
+ * and the recorded viewport, as you would when driving a local `Replayer`;
19534
+ * the host applies it, since the wrapper element is not reachable from here.
19535
+ * The layout is retained across re-inits.
19536
+ */
19537
+ setLayout(scale, anchor) {
19538
+ this.send({ type: "setLayout", scale, anchor });
19539
+ }
19540
+ replaceEvents(events) {
19541
+ this.send({ type: "replaceEvents", events });
19542
+ }
19543
+ addEvent(event) {
19544
+ this.send({ type: "addEvent", event });
19545
+ }
19546
+ enableInteract() {
19547
+ this.send({ type: "enableInteract" });
19548
+ }
19549
+ disableInteract() {
19550
+ this.send({ type: "disableInteract" });
19551
+ }
19552
+ /** Tear down: destroys the host replayer and detaches the listener. */
19553
+ destroy() {
19554
+ if (this.disposed) return;
19555
+ this.disposed = true;
19556
+ try {
19557
+ this.send({ type: "destroy" });
19558
+ } finally {
19559
+ window.removeEventListener("message", this.onMessage);
19560
+ this.listeners.clear();
19561
+ }
19562
+ }
19563
+ /* --- event surface ---------------------------------------------------- */
19564
+ on(event, listener) {
19565
+ let set = this.listeners.get(event);
19566
+ if (!set) {
19567
+ set = /* @__PURE__ */ new Set();
19568
+ this.listeners.set(event, set);
19569
+ }
19570
+ set.add(listener);
19571
+ }
19572
+ off(event, listener) {
19573
+ var _a2;
19574
+ (_a2 = this.listeners.get(event)) == null ? void 0 : _a2.delete(listener);
19575
+ }
19576
+ /* --- getters ---------------------------------------------------------- */
19577
+ // Cached getters mirroring the local Replayer's synchronous ones. Metadata
19578
+ // and activity intervals arrive on `initialized` (re-sent on replaceEvents);
19579
+ // current time is streamed by the host while playing.
19580
+ /** Last-known current time (pushed by the host while playing). */
19581
+ getCurrentTime() {
19582
+ return this.lastCurrentTime;
19583
+ }
19584
+ getMetaData() {
19585
+ return this.metadata;
19586
+ }
19587
+ getActivityIntervals() {
19588
+ return this.activityIntervals;
19589
+ }
19590
+ /**
19591
+ * Rendered geometry of the replay, in the host document's coordinate space —
19592
+ * the cross-origin stand-in for `replayer.wrapper.getBoundingClientRect()`.
19593
+ * Null until the host has reported it (listen for `'dimensions'`).
19594
+ */
19595
+ getDimensions() {
19596
+ return this.dimensions;
19597
+ }
19598
+ /* --- internals -------------------------------------------------------- */
19599
+ send(command) {
19600
+ if (!this.ready) {
19601
+ this.pending.push(command);
19602
+ return;
19603
+ }
19604
+ this.postToHost(command);
19605
+ }
19606
+ postToHost(command) {
19607
+ const target = this.iframe.contentWindow;
19608
+ if (!target) return;
19609
+ target.postMessage(wrap(command), this.hostOrigin);
19610
+ }
19611
+ flushPending() {
19612
+ const queued = this.pending;
19613
+ this.pending = [];
19614
+ queued.forEach((command) => this.postToHost(command));
19615
+ }
19616
+ /** Data-free handshake probe; see the note in the constructor. */
19617
+ probe() {
19618
+ var _a2;
19619
+ (_a2 = this.iframe.contentWindow) == null ? void 0 : _a2.postMessage(wrap({ type: "ping" }), "*");
19620
+ }
19621
+ handle(message) {
19622
+ switch (message.type) {
19623
+ case "ready":
19624
+ this.ready = true;
19625
+ this.flushPending();
19626
+ this.readyResolvers.forEach((r2) => r2());
19627
+ this.readyResolvers = [];
19628
+ return;
19629
+ case "initialized":
19630
+ this.metadata = message.metadata;
19631
+ this.activityIntervals = message.activityIntervals;
19632
+ this.emit("initialized", message.metadata);
19633
+ return;
19634
+ case "replayer-event":
19635
+ this.emit(message.event, message.payload);
19636
+ return;
19637
+ case "time":
19638
+ this.lastCurrentTime = message.currentTime;
19639
+ this.emit("time", message.currentTime);
19640
+ return;
19641
+ case "dimensions":
19642
+ this.dimensions = {
19643
+ width: message.width,
19644
+ height: message.height,
19645
+ top: message.top,
19646
+ left: message.left
19647
+ };
19648
+ this.emit("dimensions", this.dimensions);
19649
+ return;
19650
+ case "error":
19651
+ this.emit("error", message.message);
19652
+ return;
19653
+ }
19654
+ }
19655
+ emit(event, payload) {
19656
+ var _a2;
19657
+ (_a2 = this.listeners.get(event)) == null ? void 0 : _a2.forEach((listener) => listener(payload));
19658
+ }
19659
+ }
19660
+ function originOf(url) {
19661
+ try {
19662
+ return new URL(url).origin;
19663
+ } catch {
19664
+ return "'self'";
19665
+ }
19666
+ }
19667
+ function buildHostDocument(options) {
19668
+ const scriptOrigin = originOf(options.scriptUrl);
19669
+ const styleSources = [
19670
+ "'unsafe-inline'",
19671
+ scriptOrigin,
19672
+ ...options.extraStyleSources ?? []
19673
+ ].join(" ");
19674
+ const csp = [
19675
+ `default-src 'none'`,
19676
+ `script-src ${scriptOrigin}`,
19677
+ `style-src ${styleSources}`,
19678
+ `img-src * data: blob:`,
19679
+ `font-src * data:`,
19680
+ `media-src * data: blob:`,
19681
+ `frame-src *`,
19682
+ `connect-src 'none'`,
19683
+ `worker-src 'none'`
19684
+ ].join("; ");
19685
+ const styleTag = options.styleUrl ? `<link rel="stylesheet" href="${escapeAttr(options.styleUrl)}">` : "";
19686
+ return `<!DOCTYPE html>
19687
+ <html>
19688
+ <head>
19689
+ <meta charset="utf-8">
19690
+ <meta http-equiv="Content-Security-Policy" content="${escapeAttr(csp)}">
19691
+ <style>html,body{margin:0;padding:0;height:100%;overflow:hidden;background:transparent}</style>
19692
+ ${styleTag}
19693
+ <script type="module" src="${escapeAttr(options.scriptUrl)}"><\/script>
19694
+ </head>
19695
+ <body></body>
19696
+ </html>`;
19697
+ }
19698
+ function escapeAttr(value) {
19699
+ return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
19700
+ }
19152
19701
  const { addCustomEvent } = record;
19153
19702
  const { freezePage } = record;
19154
19703
  const { takeFullSnapshot } = record;
19704
+ exports.EmbeddedReplayerClient = EmbeddedReplayerClient;
19705
+ exports.EmbeddedReplayerHost = EmbeddedReplayerHost;
19155
19706
  exports.EventType = EventType;
19156
19707
  exports.IncrementalSource = IncrementalSource;
19157
19708
  exports.MouseInteractions = MouseInteractions;
19709
+ exports.RRWEB_EMBEDDED_CHANNEL = RRWEB_EMBEDDED_CHANNEL;
19710
+ exports.RRWEB_EMBEDDED_PROTOCOL_VERSION = RRWEB_EMBEDDED_PROTOCOL_VERSION;
19158
19711
  exports.Replayer = Replayer;
19159
19712
  exports.ReplayerEvents = ReplayerEvents;
19160
19713
  exports.addCustomEvent = addCustomEvent;
19714
+ exports.buildHostDocument = buildHostDocument;
19161
19715
  exports.canvasMutation = canvasMutation;
19162
19716
  exports.freezePage = freezePage;
19717
+ exports.pickSerializableConfig = pickSerializableConfig;
19163
19718
  exports.record = record;
19719
+ exports.startEmbeddedReplayerHost = startEmbeddedReplayerHost;
19164
19720
  exports.takeFullSnapshot = takeFullSnapshot;
19165
19721
  exports.utils = utils;
19166
19722
  //# sourceMappingURL=rrweb.cjs.map