clarity-visualize 0.8.46 → 0.8.47

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/build/clarity.visualize.js +871 -728
  2. package/build/clarity.visualize.min.js +1 -1
  3. package/build/clarity.visualize.module.js +871 -728
  4. package/package.json +2 -3
  5. package/src/layout.ts +18 -1
  6. package/tsconfig.json +1 -10
  7. package/types/visualize.d.ts +1 -1
package/build/clarity.visualize.js CHANGED
@@ -16,6 +16,20 @@ PERFORMANCE OF THIS SOFTWARE.
16
16
  ***************************************************************************** */
17
17
  /* global Reflect, Promise */
18
18
 
19
+ var extendStatics = function(d, b) {
20
+ extendStatics = Object.setPrototypeOf ||
21
+ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
22
+ function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
23
+ return extendStatics(d, b);
24
+ };
25
+
26
+ function __extends(d, b) {
27
+ if (typeof b !== "function" && b !== null)
28
+ throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
29
+ extendStatics(d, b);
30
+ function __() { this.constructor = d; }
31
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
32
+ }
19
33
 
20
34
  function __awaiter(thisArg, _arguments, P, generator) {
21
35
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
@@ -25,61 +39,91 @@ function __awaiter(thisArg, _arguments, P, generator) {
25
39
  function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
26
40
  step((generator = generator.apply(thisArg, _arguments || [])).next());
27
41
  });
42
+ }
43
+
44
+ function __generator(thisArg, body) {
45
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
46
+ return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
47
+ function verb(n) { return function (v) { return step([n, v]); }; }
48
+ function step(op) {
49
+ if (f) throw new TypeError("Generator is already executing.");
50
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
51
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
52
+ if (y = 0, t) op = [op[0] & 2, t.value];
53
+ switch (op[0]) {
54
+ case 0: case 1: t = op; break;
55
+ case 4: _.label++; return { value: op[1], done: false };
56
+ case 5: _.label++; y = op[1]; op = [0]; continue;
57
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
58
+ default:
59
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
60
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
61
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
62
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
63
+ if (t[2]) _.ops.pop();
64
+ _.trys.pop(); continue;
65
+ }
66
+ op = body.call(thisArg, _);
67
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
68
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
69
+ }
28
70
  }
29
71
 
30
- class DataHelper {
31
- constructor(state) {
72
+ var _a$1;
73
+ var DataHelper = /** @class */ (function () {
74
+ function DataHelper(state) {
75
+ var _this = this;
32
76
  this.regionMap = {};
33
77
  this.regions = {};
34
78
  this.metrics = {};
35
79
  this.lean = false;
36
- this.reset = () => {
37
- this.metrics = {};
38
- this.lean = false;
39
- this.regions = {};
40
- this.regionMap = {};
80
+ this.reset = function () {
81
+ _this.metrics = {};
82
+ _this.lean = false;
83
+ _this.regions = {};
84
+ _this.regionMap = {};
41
85
  };
42
- this.metric = (event) => {
86
+ this.metric = function (event) {
43
87
  var _a;
44
- if (this.state.options.metadata) {
45
- let metricMarkup = [];
46
- let regionMarkup = [];
88
+ if (_this.state.options.metadata) {
89
+ var metricMarkup = [];
90
+ var regionMarkup = [];
47
91
  // Copy over metrics for future reference
48
- for (let m in event.data) {
49
- const eventType = typeof event.data[m];
92
+ for (var m in event.data) {
93
+ var eventType = typeof event.data[m];
50
94
  if (eventType === "number" || (event.event === 1 /* Data.Event.Dimension */ && m === 37 /* Data.Dimension.InteractionNextPaint */.toString())) {
51
- if (!(m in this.metrics)) {
52
- this.metrics[m] = 0;
95
+ if (!(m in _this.metrics)) {
96
+ _this.metrics[m] = 0;
53
97
  }
54
- let key = parseInt(m, 10);
55
- let value = eventType === "object" ? Number((_a = event.data[m]) === null || _a === void 0 ? void 0 : _a[0]) : event.data[m];
98
+ var key = parseInt(m, 10);
99
+ var value = eventType === "object" ? Number((_a = event.data[m]) === null || _a === void 0 ? void 0 : _a[0]) : event.data[m];
56
100
  if (m in DataHelper.METRIC_MAP && (DataHelper.METRIC_MAP[m].unit === "html-price" || DataHelper.METRIC_MAP[m].unit === "ld-price")) {
57
- this.metrics[m] = value;
101
+ _this.metrics[m] = value;
58
102
  }
59
103
  else {
60
- this.metrics[m] += value;
104
+ _this.metrics[m] += value;
61
105
  }
62
- this.lean = key === 1 /* Data.Metric.Playback */ && value === 0 ? true : this.lean;
106
+ _this.lean = key === 1 /* Data.Metric.Playback */ && value === 0 ? true : _this.lean;
63
107
  }
64
108
  }
65
- for (let entry in this.metrics) {
109
+ for (var entry in _this.metrics) {
66
110
  if (entry in DataHelper.METRIC_MAP) {
67
- let m = this.metrics[entry];
68
- let map = DataHelper.METRIC_MAP[entry];
69
- let unit = "unit" in map ? map.unit : "" /* Data.Constant.Empty */;
70
- metricMarkup.push(`<li><h2>${this.value(m, unit)}<span>${this.key(unit)}</span></h2>${map.name}</li>`);
111
+ var m = _this.metrics[entry];
112
+ var map = DataHelper.METRIC_MAP[entry];
113
+ var unit = "unit" in map ? map.unit : "" /* Data.Constant.Empty */;
114
+ metricMarkup.push("<li><h2>".concat(_this.value(m, unit), "<span>").concat(_this.key(unit), "</span></h2>").concat(map.name, "</li>"));
71
115
  }
72
116
  }
73
117
  // Append region information to metadata
74
- for (let name in this.regions) {
75
- let r = this.regions[name];
76
- let className = (r.visibility === 10 /* Layout.RegionVisibility.Visible */ ? "visible" : (r.interaction === 20 /* Layout.InteractionState.Clicked */ ? "clicked" : "" /* Data.Constant.Empty */));
77
- regionMarkup.push(`<span class="${className}">${name}</span>`);
118
+ for (var name_1 in _this.regions) {
119
+ var r = _this.regions[name_1];
120
+ var className = (r.visibility === 10 /* Layout.RegionVisibility.Visible */ ? "visible" : (r.interaction === 20 /* Layout.InteractionState.Clicked */ ? "clicked" : "" /* Data.Constant.Empty */));
121
+ regionMarkup.push("<span class=\"".concat(className, "\">").concat(name_1, "</span>"));
78
122
  }
79
- this.state.options.metadata.innerHTML = `<ul>${metricMarkup.join("" /* Data.Constant.Empty */)}</ul><div>${regionMarkup.join("" /* Data.Constant.Empty */)}</div>`;
123
+ _this.state.options.metadata.innerHTML = "<ul>".concat(metricMarkup.join("" /* Data.Constant.Empty */), "</ul><div>").concat(regionMarkup.join("" /* Data.Constant.Empty */), "</div>");
80
124
  }
81
125
  };
82
- this.key = (unit) => {
126
+ this.key = function (unit) {
83
127
  switch (unit) {
84
128
  case "html-price":
85
129
  case "ld-price":
@@ -88,7 +132,7 @@ class DataHelper {
88
132
  default: return unit;
89
133
  }
90
134
  };
91
- this.value = (num, unit) => {
135
+ this.value = function (num, unit) {
92
136
  switch (unit) {
93
137
  case "KB": return Math.round(num / 1024);
94
138
  case "s": return Math.round(num / 10) / 100;
@@ -99,28 +143,30 @@ class DataHelper {
99
143
  };
100
144
  this.state = state;
101
145
  }
102
- region(event) {
103
- let data = event.data;
104
- for (let r of data) {
146
+ DataHelper.prototype.region = function (event) {
147
+ var data = event.data;
148
+ for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {
149
+ var r = data_1[_i];
105
150
  if (!(r.name in this.regions)) {
106
151
  this.regions[r.name] = { interaction: r.interaction, visibility: r.visibility };
107
152
  }
108
153
  this.regionMap[r.id] = r.name;
109
154
  }
110
- }
111
- }
112
- DataHelper.METRIC_MAP = {
113
- [2 /* Data.Metric.TotalBytes */]: { name: "Total Bytes", unit: "KB" },
114
- [4 /* Data.Metric.TotalCost */]: { name: "Total Cost", unit: "ms" },
115
- [3 /* Data.Metric.LayoutCost */]: { name: "Layout Cost", unit: "ms" },
116
- [8 /* Data.Metric.LargestPaint */]: { name: "LCP", unit: "s" },
117
- [9 /* Data.Metric.CumulativeLayoutShift */]: { name: "CLS", unit: "cls" },
118
- [7 /* Data.Metric.LongTaskCount */]: { name: "Long Tasks" },
119
- [24 /* Data.Metric.CartTotal */]: { name: "Cart Total", unit: "html-price" },
120
- [13 /* Data.Metric.ProductPrice */]: { name: "Product Price", unit: "ld-price" },
121
- [6 /* Data.Metric.ThreadBlockedTime */]: { name: "Thread Blocked", unit: "ms" },
122
- [37 /* Data.Dimension.InteractionNextPaint */]: { name: "INP", unit: "ms" }
123
- };
155
+ };
156
+ DataHelper.METRIC_MAP = (_a$1 = {},
157
+ _a$1[2 /* Data.Metric.TotalBytes */] = { name: "Total Bytes", unit: "KB" },
158
+ _a$1[4 /* Data.Metric.TotalCost */] = { name: "Total Cost", unit: "ms" },
159
+ _a$1[3 /* Data.Metric.LayoutCost */] = { name: "Layout Cost", unit: "ms" },
160
+ _a$1[8 /* Data.Metric.LargestPaint */] = { name: "LCP", unit: "s" },
161
+ _a$1[9 /* Data.Metric.CumulativeLayoutShift */] = { name: "CLS", unit: "cls" },
162
+ _a$1[7 /* Data.Metric.LongTaskCount */] = { name: "Long Tasks" },
163
+ _a$1[24 /* Data.Metric.CartTotal */] = { name: "Cart Total", unit: "html-price" },
164
+ _a$1[13 /* Data.Metric.ProductPrice */] = { name: "Product Price", unit: "ld-price" },
165
+ _a$1[6 /* Data.Metric.ThreadBlockedTime */] = { name: "Thread Blocked", unit: "ms" },
166
+ _a$1[37 /* Data.Dimension.InteractionNextPaint */] = { name: "INP", unit: "ms" },
167
+ _a$1);
168
+ return DataHelper;
169
+ }());
124
170
 
125
171
  // tslint:disable: no-bitwise
126
172
  function hash (input, precision) {
@@ -268,29 +314,30 @@ function lookup(hash) {
268
314
 
269
315
  var helper = { hash: hash, selector: selector, get: get$2, getNode: getNode, lookup: lookup };
270
316
 
271
- class EnrichHelper {
272
- constructor() {
273
- this.reset = () => {
274
- this.children = {};
275
- this.nodes = {};
317
+ var EnrichHelper = /** @class */ (function () {
318
+ function EnrichHelper() {
319
+ var _this = this;
320
+ this.reset = function () {
321
+ _this.children = {};
322
+ _this.nodes = {};
276
323
  helper.selector.reset();
277
324
  };
278
- this.selectors = (event) => {
279
- event.data.forEach && event.data.forEach(d => {
280
- let parent = this.nodes[d.parent];
281
- let children = this.children[d.parent] || [];
282
- let node = this.nodes[d.id] || { tag: d.tag, parent: d.parent, previous: d.previous };
283
- let attributes = d.attributes || {};
325
+ this.selectors = function (event) {
326
+ event.data.forEach && event.data.forEach(function (d) {
327
+ var parent = _this.nodes[d.parent];
328
+ var children = _this.children[d.parent] || [];
329
+ var node = _this.nodes[d.id] || { tag: d.tag, parent: d.parent, previous: d.previous };
330
+ var attributes = d.attributes || {};
284
331
  /* Track parent-child relationship for this element */
285
332
  if (node.parent !== d.parent) {
286
- let childIndex = d.previous === null ? 0 : children.indexOf(d.previous) + 1;
333
+ var childIndex = d.previous === null ? 0 : children.indexOf(d.previous) + 1;
287
334
  children.splice(childIndex, 0, d.id);
288
335
  // Stop tracking this node from children of previous parent
289
336
  if (node.parent !== d.parent) {
290
- let exParent = this.children[node.parent];
291
- let nodeIndex = exParent ? exParent.indexOf(d.id) : -1;
337
+ var exParent = _this.children[node.parent];
338
+ var nodeIndex = exParent ? exParent.indexOf(d.id) : -1;
292
339
  if (nodeIndex >= 0) {
293
- this.children[node.parent].splice(nodeIndex, 1);
340
+ _this.children[node.parent].splice(nodeIndex, 1);
294
341
  }
295
342
  }
296
343
  node.parent = d.parent;
@@ -299,31 +346,31 @@ class EnrichHelper {
299
346
  children.push(d.id);
300
347
  }
301
348
  /* Get current position */
302
- node.position = this.position(d.id, d.tag, node, children, children.map(c => this.nodes[c]));
349
+ node.position = _this.position(d.id, d.tag, node, children, children.map(function (c) { return _this.nodes[c]; }));
303
350
  /* For backward compatibility, continue populating current selector and hash like before in addition to beta selector and hash */
304
- let input = { id: d.id, tag: d.tag, prefix: parent ? [parent.alpha, parent.beta] : null, position: node.position, attributes };
351
+ var input = { id: d.id, tag: d.tag, prefix: parent ? [parent.alpha, parent.beta] : null, position: node.position, attributes: attributes };
305
352
  // Get stable selector
306
353
  // We intentionally use "null" value for empty selectors to keep parity with v0.6.25 and before.
307
- let selectorAlpha = helper.selector.get(input, 0 /* Layout.Selector.Alpha */);
354
+ var selectorAlpha = helper.selector.get(input, 0 /* Layout.Selector.Alpha */);
308
355
  d.selectorAlpha = selectorAlpha.length > 0 ? selectorAlpha : null;
309
356
  d.hashAlpha = selectorAlpha.length > 0 ? helper.hash(d.selectorAlpha) : null;
310
357
  // Get beta selector
311
- let selectorBeta = helper.selector.get(input, 1 /* Layout.Selector.Beta */);
358
+ var selectorBeta = helper.selector.get(input, 1 /* Layout.Selector.Beta */);
312
359
  d.selectorBeta = selectorBeta.length > 0 ? selectorBeta : null;
313
360
  d.hashBeta = selectorBeta.length > 0 ? helper.hash(d.selectorBeta) : null;
314
361
  /* Track state for future reference */
315
362
  node.alpha = selectorAlpha;
316
363
  node.beta = selectorBeta;
317
- this.nodes[d.id] = node;
364
+ _this.nodes[d.id] = node;
318
365
  if (d.parent) {
319
- this.children[d.parent] = children;
366
+ _this.children[d.parent] = children;
320
367
  }
321
368
  });
322
369
  return event;
323
370
  };
324
- this.position = (id, tag, child, children, siblings) => {
371
+ this.position = function (id, tag, child, children, siblings) {
325
372
  child.position = 1;
326
- let idx = children ? children.indexOf(id) : -1;
373
+ var idx = children ? children.indexOf(id) : -1;
327
374
  while (idx-- > 0) {
328
375
  if (tag === siblings[idx].tag) {
329
376
  child.position = siblings[idx].position + 1;
@@ -334,10 +381,12 @@ class EnrichHelper {
334
381
  };
335
382
  this.reset();
336
383
  }
337
- }
384
+ return EnrichHelper;
385
+ }());
338
386
 
339
- class HeatmapHelper {
340
- constructor(state, layout) {
387
+ var HeatmapHelper = /** @class */ (function () {
388
+ function HeatmapHelper(state, layout) {
389
+ var _this = this;
341
390
  this.data = null;
342
391
  this.scrollData = null;
343
392
  this.max = null;
@@ -349,30 +398,30 @@ class HeatmapHelper {
349
398
  this.layout = null;
350
399
  this.scrollAvgFold = null;
351
400
  this.addScrollMakers = false;
352
- this.reset = () => {
353
- this.data = null;
354
- this.scrollData = null;
355
- this.max = null;
356
- this.offscreenRing = null;
357
- this.gradientPixels = null;
358
- this.timeout = null;
401
+ this.reset = function () {
402
+ _this.data = null;
403
+ _this.scrollData = null;
404
+ _this.max = null;
405
+ _this.offscreenRing = null;
406
+ _this.gradientPixels = null;
407
+ _this.timeout = null;
359
408
  // Reset resize observer
360
- if (this.observer) {
361
- this.observer.disconnect();
362
- this.observer = null;
409
+ if (_this.observer) {
410
+ _this.observer.disconnect();
411
+ _this.observer = null;
363
412
  }
364
413
  // Remove scroll and resize event listeners
365
- if (this.state && this.state.window) {
366
- let win = this.state.window;
367
- win.removeEventListener("scroll", this.redraw, true);
368
- win.removeEventListener("resize", this.redraw, true);
414
+ if (_this.state && _this.state.window) {
415
+ var win = _this.state.window;
416
+ win.removeEventListener("scroll", _this.redraw, true);
417
+ win.removeEventListener("resize", _this.redraw, true);
369
418
  }
370
419
  };
371
- this.clear = () => {
372
- let doc = this.state.window.document;
373
- let win = this.state.window;
374
- let canvas = doc.getElementById("clarity-heatmap-canvas" /* Constant.HeatmapCanvas */);
375
- let de = doc.documentElement;
420
+ this.clear = function () {
421
+ var doc = _this.state.window.document;
422
+ var win = _this.state.window;
423
+ var canvas = doc.getElementById("clarity-heatmap-canvas" /* Constant.HeatmapCanvas */);
424
+ var de = doc.documentElement;
376
425
  if (canvas) {
377
426
  canvas.width = de.clientWidth;
378
427
  canvas.height = de.clientHeight;
@@ -380,54 +429,59 @@ class HeatmapHelper {
380
429
  canvas.style.top = win.pageYOffset + "px" /* Constant.Pixel */;
381
430
  canvas.getContext("2d" /* Constant.Context */).clearRect(0, 0, canvas.width, canvas.height);
382
431
  }
383
- this.reset();
432
+ _this.reset();
384
433
  };
385
- this.scroll = (activity, avgFold, addMarkers) => {
386
- this.scrollData = this.scrollData || activity;
387
- this.scrollAvgFold = avgFold != null ? avgFold : this.scrollAvgFold;
388
- this.addScrollMakers = addMarkers != null ? addMarkers : this.addScrollMakers;
389
- let canvas = this.overlay();
390
- let context = canvas.getContext("2d" /* Constant.Context */);
391
- let doc = this.state.window.document;
434
+ this.scroll = function (activity, avgFold, addMarkers) {
435
+ _this.scrollData = _this.scrollData || activity;
436
+ _this.scrollAvgFold = avgFold != null ? avgFold : _this.scrollAvgFold;
437
+ _this.addScrollMakers = addMarkers != null ? addMarkers : _this.addScrollMakers;
438
+ var canvas = _this.overlay();
439
+ var context = canvas.getContext("2d" /* Constant.Context */);
440
+ var doc = _this.state.window.document;
392
441
  var body = doc.body;
393
442
  var de = doc.documentElement;
394
443
  var height = Math.max(body.scrollHeight, body.offsetHeight, de.clientHeight, de.scrollHeight, de.offsetHeight);
395
444
  canvas.height = Math.min(height, 65535 /* Setting.ScrollCanvasMaxHeight */);
396
445
  canvas.style.top = 0 + "px" /* Constant.Pixel */;
397
446
  if (canvas.width > 0 && canvas.height > 0) {
398
- if (this.scrollData) {
399
- const grd = context.createLinearGradient(0, 0, 0, canvas.height);
400
- for (const currentCombination of this.scrollData) {
401
- const huePercentView = 1 - (currentCombination.cumulativeSum / this.scrollData[0].cumulativeSum);
402
- const percentView = (currentCombination.scrollReachY / 100) * (height / canvas.height);
403
- const hue = huePercentView * 240 /* Setting.MaxHue */;
447
+ if (_this.scrollData) {
448
+ var grd = context.createLinearGradient(0, 0, 0, canvas.height);
449
+ for (var _i = 0, _a = _this.scrollData; _i < _a.length; _i++) {
450
+ var currentCombination = _a[_i];
451
+ var huePercentView = 1 - (currentCombination.cumulativeSum / _this.scrollData[0].cumulativeSum);
452
+ var percentView = (currentCombination.scrollReachY / 100) * (height / canvas.height);
453
+ var hue = huePercentView * 240 /* Setting.MaxHue */;
404
454
  if (percentView <= 1) {
405
- grd.addColorStop(percentView, `hsla(${hue}, 100%, 50%, 0.6)`);
455
+ grd.addColorStop(percentView, "hsla(".concat(hue, ", 100%, 50%, 0.6)"));
406
456
  }
407
457
  }
408
458
  // Fill with gradient
409
459
  context.fillStyle = grd;
410
460
  context.fillRect(0, 0, canvas.width, canvas.height);
411
- if (this.addScrollMakers) {
412
- this.addInfoMarkers(context, this.scrollData, canvas.width, canvas.height, this.scrollAvgFold);
461
+ if (_this.addScrollMakers) {
462
+ _this.addInfoMarkers(context, _this.scrollData, canvas.width, canvas.height, _this.scrollAvgFold);
413
463
  }
414
464
  }
415
465
  }
416
466
  };
417
- this.addInfoMarkers = (context, scrollMapInfo, width, height, avgFold) => {
418
- this.addMarker(context, width, "Average Fold" /* Constant.AverageFold */, avgFold, 84 /* Setting.MarkerMediumWidth */);
419
- const markers = [75, 50, 25];
420
- for (const marker of markers) {
421
- const closest = scrollMapInfo.reduce((prev, curr) => {
467
+ this.addInfoMarkers = function (context, scrollMapInfo, width, height, avgFold) {
468
+ _this.addMarker(context, width, "Average Fold" /* Constant.AverageFold */, avgFold, 84 /* Setting.MarkerMediumWidth */);
469
+ var markers = [75, 50, 25];
470
+ var _loop_1 = function (marker) {
471
+ var closest = scrollMapInfo.reduce(function (prev, curr) {
422
472
  return ((Math.abs(curr.percUsers - marker)) < (Math.abs(prev.percUsers - marker)) ? curr : prev);
423
473
  });
424
474
  if (closest.percUsers >= marker - 2 /* Setting.MarkerRange */ && closest.percUsers <= marker + 2 /* Setting.MarkerRange */) {
425
- const markerLine = (closest.scrollReachY / 100) * height;
426
- this.addMarker(context, width, `${marker}%`, markerLine, 35 /* Setting.MarkerSmallWidth */);
475
+ var markerLine = (closest.scrollReachY / 100) * height;
476
+ _this.addMarker(context, width, "".concat(marker, "%"), markerLine, 35 /* Setting.MarkerSmallWidth */);
427
477
  }
478
+ };
479
+ for (var _i = 0, markers_1 = markers; _i < markers_1.length; _i++) {
480
+ var marker = markers_1[_i];
481
+ _loop_1(marker);
428
482
  }
429
483
  };
430
- this.addMarker = (context, heatmapWidth, label, markerY, markerWidth) => {
484
+ this.addMarker = function (context, heatmapWidth, label, markerY, markerWidth) {
431
485
  context.beginPath();
432
486
  context.moveTo(0, markerY);
433
487
  context.lineTo(heatmapWidth, markerY);
@@ -441,31 +495,32 @@ class HeatmapHelper {
441
495
  context.font = "500 12px Segoe UI" /* Setting.CanvasTextFont */;
442
496
  context.fillText(label, 5 /* Setting.MarkerPadding */, markerY + 5 /* Setting.MarkerPadding */);
443
497
  };
444
- this.click = (activity) => {
445
- this.data = this.data || activity;
446
- let heat = this.transform();
447
- let canvas = this.overlay();
448
- let ctx = canvas.getContext("2d" /* Constant.Context */);
498
+ this.click = function (activity) {
499
+ _this.data = _this.data || activity;
500
+ var heat = _this.transform();
501
+ var canvas = _this.overlay();
502
+ var ctx = canvas.getContext("2d" /* Constant.Context */);
449
503
  if (canvas.width > 0 && canvas.height > 0) {
450
504
  // To speed up canvas rendering, we draw ring & gradient on an offscreen canvas, so we can use drawImage API
451
505
  // Canvas performance tips: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Optimizing_canvas
452
506
  // Pre-render similar primitives or repeating objects on an offscreen canvas
453
- let ring = this.getRing();
454
- let gradient = this.getGradient();
507
+ var ring = _this.getRing();
508
+ var gradient = _this.getGradient();
455
509
  // Render activity for each (x,y) coordinate in our data
456
- for (let entry of heat) {
510
+ for (var _i = 0, heat_1 = heat; _i < heat_1.length; _i++) {
511
+ var entry = heat_1[_i];
457
512
  ctx.globalAlpha = entry.a;
458
513
  ctx.drawImage(ring, entry.x - 20 /* Setting.Radius */, entry.y - 20 /* Setting.Radius */);
459
514
  }
460
515
  // Add color to the canvas based on alpha value of each pixel
461
- let pixels = ctx.getImageData(0, 0, canvas.width, canvas.height);
462
- for (let i = 0; i < pixels.data.length; i += 4) {
516
+ var pixels = ctx.getImageData(0, 0, canvas.width, canvas.height);
517
+ for (var i = 0; i < pixels.data.length; i += 4) {
463
518
  // For each pixel, we have 4 entries in data array: (r,g,b,a)
464
519
  // To pick the right color from gradient pixels, we look at the alpha value of the pixel
465
520
  // Alpha value ranges from 0-255
466
- let alpha = pixels.data[i + 3];
521
+ var alpha = pixels.data[i + 3];
467
522
  if (alpha > 0) {
468
- let offset = (alpha - 1) * 4;
523
+ var offset = (alpha - 1) * 4;
469
524
  pixels.data[i] = gradient.data[offset];
470
525
  pixels.data[i + 1] = gradient.data[offset + 1];
471
526
  pixels.data[i + 2] = gradient.data[offset + 2];
@@ -474,25 +529,25 @@ class HeatmapHelper {
474
529
  ctx.putImageData(pixels, 0, 0);
475
530
  }
476
531
  };
477
- this.overlay = () => {
532
+ this.overlay = function () {
478
533
  // Create canvas for visualizing heatmap
479
- let doc = this.state.window.document;
480
- let win = this.state.window;
481
- let de = doc.documentElement;
482
- let canvas = doc.getElementById("clarity-heatmap-canvas" /* Constant.HeatmapCanvas */);
534
+ var doc = _this.state.window.document;
535
+ var win = _this.state.window;
536
+ var de = doc.documentElement;
537
+ var canvas = doc.getElementById("clarity-heatmap-canvas" /* Constant.HeatmapCanvas */);
483
538
  if (canvas === null) {
484
539
  canvas = doc.createElement("CANVAS" /* Constant.Canvas */);
485
540
  canvas.id = "clarity-heatmap-canvas" /* Constant.HeatmapCanvas */;
486
541
  canvas.width = 0;
487
542
  canvas.height = 0;
488
543
  canvas.style.position = "absolute" /* Constant.Absolute */;
489
- canvas.style.zIndex = `${2147483647 /* Setting.ZIndex */}`;
544
+ canvas.style.zIndex = "".concat(2147483647 /* Setting.ZIndex */);
490
545
  de.appendChild(canvas);
491
- win.addEventListener("scroll", this.redraw, true);
492
- win.addEventListener("resize", this.redraw, true);
493
- this.observer = this.state.window["ResizeObserver"] ? new ResizeObserver(this.redraw) : null;
494
- if (this.observer) {
495
- this.observer.observe(doc.body);
546
+ win.addEventListener("scroll", _this.redraw, true);
547
+ win.addEventListener("resize", _this.redraw, true);
548
+ _this.observer = _this.state.window["ResizeObserver"] ? new ResizeObserver(_this.redraw) : null;
549
+ if (_this.observer) {
550
+ _this.observer.observe(doc.body);
496
551
  }
497
552
  }
498
553
  // Ensure canvas is positioned correctly
@@ -503,13 +558,13 @@ class HeatmapHelper {
503
558
  canvas.getContext("2d" /* Constant.Context */).clearRect(0, 0, canvas.width, canvas.height);
504
559
  return canvas;
505
560
  };
506
- this.getRing = () => {
507
- if (this.offscreenRing === null) {
508
- let doc = this.state.window.document;
509
- this.offscreenRing = doc.createElement("CANVAS" /* Constant.Canvas */);
510
- this.offscreenRing.width = 20 /* Setting.Radius */ * 2;
511
- this.offscreenRing.height = 20 /* Setting.Radius */ * 2;
512
- let ctx = this.offscreenRing.getContext("2d" /* Constant.Context */);
561
+ this.getRing = function () {
562
+ if (_this.offscreenRing === null) {
563
+ var doc = _this.state.window.document;
564
+ _this.offscreenRing = doc.createElement("CANVAS" /* Constant.Canvas */);
565
+ _this.offscreenRing.width = 20 /* Setting.Radius */ * 2;
566
+ _this.offscreenRing.height = 20 /* Setting.Radius */ * 2;
567
+ var ctx = _this.offscreenRing.getContext("2d" /* Constant.Context */);
513
568
  ctx.shadowOffsetX = 20 /* Setting.Radius */ * 2;
514
569
  ctx.shadowBlur = 20 /* Setting.Radius */ / 2;
515
570
  ctx.shadowColor = "black" /* Constant.Black */;
@@ -518,58 +573,59 @@ class HeatmapHelper {
518
573
  ctx.closePath();
519
574
  ctx.fill();
520
575
  }
521
- return this.offscreenRing;
576
+ return _this.offscreenRing;
522
577
  };
523
- this.getGradient = () => {
524
- if (this.gradientPixels === null) {
525
- let doc = this.state.window.document;
526
- let offscreenGradient = doc.createElement("CANVAS" /* Constant.Canvas */);
578
+ this.getGradient = function () {
579
+ if (_this.gradientPixels === null) {
580
+ var doc = _this.state.window.document;
581
+ var offscreenGradient = doc.createElement("CANVAS" /* Constant.Canvas */);
527
582
  offscreenGradient.width = 1;
528
583
  offscreenGradient.height = 256 /* Setting.Colors */;
529
- let ctx = offscreenGradient.getContext("2d" /* Constant.Context */);
530
- let gradient = ctx.createLinearGradient(0, 0, 0, 256 /* Setting.Colors */);
531
- let step = 1 / HeatmapHelper.COLORS.length;
532
- for (let i = 0; i < HeatmapHelper.COLORS.length; i++) {
584
+ var ctx = offscreenGradient.getContext("2d" /* Constant.Context */);
585
+ var gradient = ctx.createLinearGradient(0, 0, 0, 256 /* Setting.Colors */);
586
+ var step = 1 / HeatmapHelper.COLORS.length;
587
+ for (var i = 0; i < HeatmapHelper.COLORS.length; i++) {
533
588
  gradient.addColorStop(step * (i + 1), HeatmapHelper.COLORS[i]);
534
589
  }
535
590
  ctx.fillStyle = gradient;
536
591
  ctx.fillRect(0, 0, 1, 256 /* Setting.Colors */);
537
- this.gradientPixels = ctx.getImageData(0, 0, 1, 256 /* Setting.Colors */);
592
+ _this.gradientPixels = ctx.getImageData(0, 0, 1, 256 /* Setting.Colors */);
538
593
  }
539
- return this.gradientPixels;
594
+ return _this.gradientPixels;
540
595
  };
541
- this.redraw = (event) => {
542
- if (this.data) {
543
- if (this.timeout) {
544
- clearTimeout(this.timeout);
596
+ this.redraw = function (event) {
597
+ if (_this.data) {
598
+ if (_this.timeout) {
599
+ clearTimeout(_this.timeout);
545
600
  }
546
- this.timeout = setTimeout(this.click, 30 /* Setting.Interval */);
601
+ _this.timeout = setTimeout(_this.click, 30 /* Setting.Interval */);
547
602
  }
548
- else if (this.scrollData) {
603
+ else if (_this.scrollData) {
549
604
  if (event.type != 'scroll') {
550
- if (this.timeout) {
551
- clearTimeout(this.timeout);
605
+ if (_this.timeout) {
606
+ clearTimeout(_this.timeout);
552
607
  }
553
- this.timeout = setTimeout(this.scroll, 30 /* Setting.Interval */);
608
+ _this.timeout = setTimeout(_this.scroll, 30 /* Setting.Interval */);
554
609
  }
555
610
  }
556
611
  };
557
- this.transform = () => {
558
- let output = [];
559
- let points = {};
560
- let localMax = 0;
561
- let height = this.state.window && this.state.window.document ? this.state.window.document.documentElement.clientHeight : 0;
562
- for (let element of this.data) {
563
- let el = this.layout.get(element.hash);
612
+ this.transform = function () {
613
+ var output = [];
614
+ var points = {};
615
+ var localMax = 0;
616
+ var height = _this.state.window && _this.state.window.document ? _this.state.window.document.documentElement.clientHeight : 0;
617
+ for (var _i = 0, _a = _this.data; _i < _a.length; _i++) {
618
+ var element = _a[_i];
619
+ var el = _this.layout.get(element.hash);
564
620
  if (el && typeof el.getBoundingClientRect === "function") {
565
- let r = el.getBoundingClientRect();
566
- let v = this.visible(el, r, height);
621
+ var r = el.getBoundingClientRect();
622
+ var v = _this.visible(el, r, height);
567
623
  // Process clicks for only visible elements
568
- if (this.max === null || v) {
569
- for (let i = 0; i < element.points; i++) {
570
- let x = Math.round(r.left + (element.x[i] / 32767 /* Data.Setting.ClickPrecision */) * r.width);
571
- let y = Math.round(r.top + (element.y[i] / 32767 /* Data.Setting.ClickPrecision */) * r.height);
572
- let k = `${x}${"X" /* Constant.Separator */}${y}${"X" /* Constant.Separator */}${v ? 1 : 0}`;
624
+ if (_this.max === null || v) {
625
+ for (var i = 0; i < element.points; i++) {
626
+ var x = Math.round(r.left + (element.x[i] / 32767 /* Data.Setting.ClickPrecision */) * r.width);
627
+ var y = Math.round(r.top + (element.y[i] / 32767 /* Data.Setting.ClickPrecision */) * r.height);
628
+ var k = "".concat(x).concat("X" /* Constant.Separator */).concat(y).concat("X" /* Constant.Separator */).concat(v ? 1 : 0);
573
629
  points[k] = k in points ? points[k] + element.clicks[i] : element.clicks[i];
574
630
  localMax = Math.max(points[k], localMax);
575
631
  }
@@ -577,25 +633,27 @@ class HeatmapHelper {
577
633
  }
578
634
  }
579
635
  // Set the max value from the firs t
580
- this.max = this.max ? this.max : localMax;
636
+ _this.max = _this.max ? _this.max : localMax;
581
637
  // Once all points are accounted for, convert everything into absolute (x, y)
582
- for (let coordinates of Object.keys(points)) {
583
- let parts = coordinates.split("X" /* Constant.Separator */);
584
- let alpha = Math.min((points[coordinates] / this.max) + 0.15 /* Setting.AlphaBoost */, 1);
638
+ for (var _b = 0, _c = Object.keys(points); _b < _c.length; _b++) {
639
+ var coordinates = _c[_b];
640
+ var parts = coordinates.split("X" /* Constant.Separator */);
641
+ var alpha = Math.min((points[coordinates] / _this.max) + 0.15 /* Setting.AlphaBoost */, 1);
585
642
  if (parts[2] === "1") {
586
643
  output.push({ x: parseInt(parts[0], 10), y: parseInt(parts[1], 10), a: alpha });
587
644
  }
588
645
  }
589
646
  return output;
590
647
  };
591
- this.visible = (el, r, height) => {
592
- let doc = this.state.window.document;
593
- let visibility = r.height > height ? true : false;
648
+ this.visible = function (el, r, height) {
649
+ var doc = _this.state.window.document;
650
+ var visibility = r.height > height ? true : false;
594
651
  if (visibility === false && r.width > 0 && r.height > 0) {
595
652
  while (!visibility && doc) {
596
- let shadowElement = null;
597
- let elements = doc.elementsFromPoint(r.left + (r.width / 2), r.top + (r.height / 2));
598
- for (let e of elements) {
653
+ var shadowElement = null;
654
+ var elements = doc.elementsFromPoint(r.left + (r.width / 2), r.top + (r.height / 2));
655
+ for (var _i = 0, elements_1 = elements; _i < elements_1.length; _i++) {
656
+ var e = elements_1[_i];
599
657
  // Ignore if top element ends up being the canvas element we added for heatmap visualization
600
658
  if (e.tagName === "CANVAS" /* Constant.Canvas */ || (e.id && e.id.indexOf("clarity-" /* Constant.ClarityPrefix */) === 0)) {
601
659
  continue;
@@ -612,8 +670,9 @@ class HeatmapHelper {
612
670
  this.state = state;
613
671
  this.layout = layout;
614
672
  }
615
- }
616
- HeatmapHelper.COLORS = ["blue", "cyan", "lime", "yellow", "red"];
673
+ HeatmapHelper.COLORS = ["blue", "cyan", "lime", "yellow", "red"];
674
+ return HeatmapHelper;
675
+ }());
617
676
 
618
677
  var pointerSvg = `background: url("data:image/svg+xml,%3Csvg width='25' height='33' viewBox='0 0 25 33' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg filter='url(%23filter0_d_1588_56448)'%3E%3Cpath d='M4.01802 5.55275C4.01946 3.50367 6.4952 2.47998 7.93878 3.93422C11.8224 7.84649 15.637 11.722 19.5308 15.6444C20.9744 17.0986 19.9461 19.6118 17.8974 19.6538C16.3364 19.6858 14.7609 19.7179 13.1178 19.7275C12.4996 19.7312 11.9077 19.9799 11.4721 20.4186C10.3166 21.582 9.15585 22.7133 7.98174 23.8569C6.50994 25.2904 4.00066 24.2454 4.00207 22.1909C4.00592 16.5949 4.01415 11.0883 4.01802 5.55275Z' fill='%23D97705'/%3E%3Cpath d='M4.74233 6.01561C4.74223 4.45449 6.63136 3.6747 7.73247 4.78135C11.4175 8.48492 15.0357 12.1199 18.7088 15.7882C19.8134 16.8914 19.0329 18.8059 17.4722 18.8401C15.8726 18.8751 14.2495 18.9145 12.5497 18.9237C12.0819 18.9263 11.6339 19.1135 11.3029 19.4441C10.1408 20.6046 8.9704 21.7251 7.78073 22.8738C6.6557 23.96 4.74395 23.1646 4.74384 21.6008C4.7435 16.3797 4.74267 11.2488 4.74233 6.01561Z' fill='white'/%3E%3Cpath d='M17.6946 16.2002C18.322 16.8308 17.8753 17.913 16.9858 17.9268C15.4482 17.9505 13.8862 17.9868 12.2788 17.9971C11.7369 18.0006 11.2189 18.2206 10.8377 18.6059C9.7303 19.7249 8.58978 20.8151 7.42447 21.9628C6.78436 22.5932 5.68359 22.1428 5.68359 21.2443C5.68359 16.2568 5.68359 11.3772 5.68359 6.55071C5.68359 5.6585 6.76347 5.21291 7.3927 5.84545C10.813 9.28377 14.2599 12.7473 17.6946 16.2002Z' fill='%23FFC35F'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_1588_56448' x='0.00390625' y='3.25171' width='24.1992' height='29.2681' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='4'/%3E%3CfeGaussianBlur stdDeviation='2'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_1588_56448'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_1588_56448' result='shape'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A") no-repeat center center;`;
619
678
 
@@ -649,28 +708,29 @@ var clickStyle = `.clarity-click,
649
708
  transition: visibility 0s 1s, opacity 1s linear;
650
709
  }`;
651
710
 
652
- class InteractionHelper {
653
- constructor(state, layout, vnext) {
711
+ var InteractionHelper = /** @class */ (function () {
712
+ function InteractionHelper(state, layout, vnext) {
713
+ var _this = this;
654
714
  this.hoverId = null;
655
715
  this.targetId = null;
656
716
  this.points = [];
657
717
  this.scrollPointIndex = 0;
658
718
  this.clickAudio = null;
659
719
  this.visualizedClicks = [];
660
- this.reset = () => {
661
- this.points = [];
662
- this.scrollPointIndex = 0;
663
- this.clickAudio = null;
664
- this.hoverId = null;
665
- this.targetId = null;
666
- this.layout.reset();
667
- };
668
- this.scroll = (event) => {
669
- let data = event.data;
670
- let doc = this.state.window.document;
671
- let de = doc.documentElement;
672
- let scrollTarget = this.layout.element(data.target) || doc.body;
673
- let scrollable = scrollTarget.scrollHeight > scrollTarget.clientHeight || scrollTarget.scrollWidth > scrollTarget.clientWidth;
720
+ this.reset = function () {
721
+ _this.points = [];
722
+ _this.scrollPointIndex = 0;
723
+ _this.clickAudio = null;
724
+ _this.hoverId = null;
725
+ _this.targetId = null;
726
+ _this.layout.reset();
727
+ };
728
+ this.scroll = function (event) {
729
+ var data = event.data;
730
+ var doc = _this.state.window.document;
731
+ var de = doc.documentElement;
732
+ var scrollTarget = _this.layout.element(data.target) || doc.body;
733
+ var scrollable = scrollTarget.scrollHeight > scrollTarget.clientHeight || scrollTarget.scrollWidth > scrollTarget.clientWidth;
674
734
  if (scrollTarget && scrollable) {
675
735
  scrollTarget.scrollTo(data.x, data.y);
676
736
  // In an edge case, scrolling API doesn't work when css on HTML element has height:100% and overflow:auto
@@ -683,36 +743,36 @@ class InteractionHelper {
683
743
  // Position canvas relative to scroll events on the parent page
684
744
  if (scrollTarget === de || scrollTarget === doc.body) {
685
745
  if (!scrollable) {
686
- this.state.window.scrollTo(data.x, data.y);
746
+ _this.state.window.scrollTo(data.x, data.y);
687
747
  }
688
- let canvas = this.overlay();
748
+ var canvas = _this.overlay();
689
749
  if (canvas) {
690
750
  canvas.style.left = data.x + "px" /* Constant.Pixel */;
691
751
  canvas.style.top = data.y + "px" /* Constant.Pixel */;
692
752
  canvas.width = de.clientWidth;
693
753
  canvas.height = de.clientHeight;
694
754
  }
695
- this.scrollPointIndex = this.points.length;
755
+ _this.scrollPointIndex = _this.points.length;
696
756
  }
697
757
  };
698
- this.resize = (event) => {
699
- let data = event.data;
700
- let width = data.width;
701
- let height = data.height;
702
- if (this.state.options.onresize) {
703
- this.state.options.onresize(width, height);
758
+ this.resize = function (event) {
759
+ var data = event.data;
760
+ var width = data.width;
761
+ var height = data.height;
762
+ if (_this.state.options.onresize) {
763
+ _this.state.options.onresize(width, height);
704
764
  }
705
765
  };
706
- this.visibility = (event) => {
707
- let doc = this.state.window.document;
766
+ this.visibility = function (event) {
767
+ var doc = _this.state.window.document;
708
768
  if (doc && doc.documentElement && event.data.visible === 0 /* BooleanFlag.False */) {
709
769
  // if the website has styles on the <html> node then we need to save the reference to them before we change them
710
770
  // to indicate the window was hidden. This is to ensure that we can restore the original styles when the window is visible again.
711
- const bg = doc.documentElement.style.backgroundColor;
771
+ var bg = doc.documentElement.style.backgroundColor;
712
772
  if (bg) {
713
773
  doc.documentElement.setAttribute("data-clarity-background-color" /* Constant.OriginalBackgroundColor */, bg);
714
774
  }
715
- const o = doc.documentElement.style.opacity;
775
+ var o = doc.documentElement.style.opacity;
716
776
  if (o) {
717
777
  doc.documentElement.setAttribute("data-clarity-opacity" /* Constant.OriginalOpacity */, o);
718
778
  }
@@ -734,9 +794,9 @@ class InteractionHelper {
734
794
  }
735
795
  }
736
796
  };
737
- this.input = (event) => {
738
- let data = event.data;
739
- let el = this.layout.element(data.target);
797
+ this.input = function (event) {
798
+ var data = event.data;
799
+ var el = _this.layout.element(data.target);
740
800
  if (el) {
741
801
  switch (el.type) {
742
802
  case "checkbox":
@@ -752,72 +812,73 @@ class InteractionHelper {
752
812
  }
753
813
  }
754
814
  };
755
- this.selection = (event) => {
756
- let data = event.data;
757
- let doc = this.state.window.document;
758
- let s = doc.getSelection();
815
+ this.selection = function (event) {
816
+ var data = event.data;
817
+ var doc = _this.state.window.document;
818
+ var s = doc.getSelection();
759
819
  // Wrapping selection code inside a try / catch to avoid throwing errors when dealing with elements inside the shadow DOM.
760
820
  try {
761
- s.setBaseAndExtent(this.layout.element(data.start), data.startOffset, this.layout.element(data.end), data.endOffset);
821
+ s.setBaseAndExtent(_this.layout.element(data.start), data.startOffset, _this.layout.element(data.end), data.endOffset);
762
822
  }
763
823
  catch (ex) {
764
824
  console.warn("Exception encountered while trying to set selection: " + ex);
765
825
  }
766
826
  };
767
- this.pointer = (event) => {
768
- if (!this.state.options.pointer) {
827
+ this.pointer = function (event) {
828
+ if (!_this.state.options.pointer) {
769
829
  return;
770
830
  }
771
- let data = event.data;
772
- let type = event.event;
773
- let doc = this.state.window.document;
774
- let de = doc.documentElement;
775
- let p = doc.getElementById("clarity-pointer" /* Constant.PointerLayer */);
776
- let pointerWidth = 29 /* Setting.PointerWidth */;
777
- let pointerHeight = 38 /* Setting.PointerHeight */;
831
+ var data = event.data;
832
+ var type = event.event;
833
+ var doc = _this.state.window.document;
834
+ var de = doc.documentElement;
835
+ var p = doc.getElementById("clarity-pointer" /* Constant.PointerLayer */);
836
+ var pointerWidth = 29 /* Setting.PointerWidth */;
837
+ var pointerHeight = 38 /* Setting.PointerHeight */;
778
838
  if (p === null) {
779
839
  p = doc.createElement("DIV");
780
840
  p.id = "clarity-pointer" /* Constant.PointerLayer */;
781
841
  de.appendChild(p);
782
842
  // Add custom styles
783
- let style = doc.createElement("STYLE");
843
+ var style = doc.createElement("STYLE");
784
844
  style.textContent =
785
845
  "@keyframes pulsate-one { 0% { transform: scale(1, 1); opacity: 1; } 100% { transform: scale(3, 3); opacity: 0; } }" +
786
846
  "@keyframes pulsate-two { 0% { transform: scale(1, 1); opacity: 1; } 100% { transform: scale(5, 5); opacity: 0; } }" +
787
847
  "@keyframes pulsate-touch { 0% { transform: scale(1, 1); opacity: 1; } 100% { transform: scale(2, 2); opacity: 0; } }" +
788
848
  "@keyframes disappear { 90% { transform: scale(1, 1); opacity: 1; } 100% { transform: scale(1.3, 1.3); opacity: 0; } }" +
789
- `#${"clarity-interaction-canvas" /* Constant.InteractionCanvas */} { position: absolute; left: 0; top: 0; z-index: ${2147483647 /* Setting.ZIndex */}; background: none; }` +
790
- `#${"clarity-pointer" /* Constant.PointerLayer */} { position: absolute; z-index: ${2147483647 /* Setting.ZIndex */}; url(${"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAmCAYAAAA4LpBhAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAASDSURBVHgB7VdPTCNlFH8z0/+FFmRatnFNiDGR4O4mBk08smZvXjjIxRueNME9eHGNxoLxSNwr4WyigYToQRJLjXDzQtDNmnhR4kWWAJm20ymddtrx94bvI9NBWAptsod9ycvM92fe73vv/b73fUP0DIlCfRQ1AMTtjwcHB1+gPgOT67oK6+TkZBjNbxRF+X1gYCCDPpX6IKdGAaTu7++HuG9tbe1ONBr9GR7r+Xy+98DsIRuemJiIjI6OJgH+3e7urruzs+OOjIw8SiaTNwRwz8OtQWPpdHoYoKt///ar2/jxaw84k8k8gt5YWVnRqEfi90BrtVph0Uetx0V67d9fqFAo3G6324XZ2VldLK4noK4AVqvVaoh8YZTAxWLxdiwW20CoM70IdceWicfjSpCxfuBEIrGxsLCQZR7QNcQDwFaRRhRmcXCSL9S3kN8CtlP2Oqz2QoWt4Q4NDanHx8cy3HQBMIe6sLS0pF811B7I5uYmhUKh1nmAQWAOteM4xcXFxczMzEzXHp+u9PDwUBHvymWBmVzr6+t6t9tJhtPzEEYuFaoguebm5nTqJOXFoMxEVCO50tMFXBaYcwwbGwAfRagv5bEKthK2igdUr9epG/EDYw//xKGmzoLz/6BQd3t7m5i9dAUJsJoLSPZp5PIGp6amXHjsVSaEirqVALk8jy/axx2hwAcMTlcRH/Ad5LfA24kEZ4JzudbySSJzyqDnomq37pH14utH/iUrCA5HCeRwHYXc8dzNNs5jfXp6uoD+e/Pz8zzfDYIqq6urihg4NyTaK2/Rw8fNo0/euWvBWI3TwGAiHW2RnjY7LRVjX+7t7d3nSWL8FFSKIj46I0r2ZXr4R/PoQT5f1TTtU3Q5OAbbbAxtV4BwXx07wUI5raJdTaVS5vLysmYYhlyMDJBHJBoeHpbFwQ0CfmuP04P8V1VVVb9AVwXGy/xE6SyHw2FuW9Aa2jYAHVx1HAZh78bGxs44wYkm0zS9PPrC1QE4+8HcPwD8HONPYNzEkAU1UX+raFcYmPswzhu9ISLmShIdHBx0lFfVH2s+SyWR/IBofgYvnmCIPTQjkYiBk8mARwYWU4aW8F5uNpslXHkstBncxjcOeyqJ6vfUO9oQd2avlyeKJj3A9z/8yAOE7uHKUgGoiRQYMFZCdEq2bZfgpYFnmd9xzprlcrnCOdV13cbWaWKezGVnAUBOmVBpkOAlPH/AxuYJu/DoPQDcxfubeB/ncZCDL+IpaDKgiVwul8AzDo1BI3RC1HPLIg+mYPQmvPke+hdY+S68ehuevIHQvYpV5/i2KIxKg5pUUew1AaL6wM4cl4oPFJjxFMJ0H6BbIIgBwAbeLSzABLBVKpVszGvSCf27r5dCNE7h1tYWX1U0ECHUaDT+REhryKENrTFbwdLj+skRxIAeM+ka4rGV2QWv2vCIjVoAryC0Jk6MCk6fGvoY0OkFoF80UDsG8AG8j/BtD78YWRSMNNoJQbSe/1Zw0tmwBB6kE0ZG+wXI4v1ECYAIdbKzf/+povypEui6t/jnwvIf5FVJ1Cj/1+UAAAAASUVORK5CYII=" /* Asset.Pointer */}) no-repeat left center; width: ${pointerWidth}px; height: ${pointerHeight}px; }` +
791
- this.getClickLayerStyle() +
792
- `.${"clarity-touch" /* Constant.TouchLayer */} { background: radial-gradient(rgba(242,97,12,1), transparent); }` +
793
- `.${"clarity-touch-ring" /* Constant.TouchRing */} { background: transparent; border: 1px solid rgba(242,97,12,0.8); }` +
794
- `.${"clarity-pointer-click" /* Constant.PointerClickLayer */} { background-image: url(${"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAmCAYAAAA4LpBhAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAVoSURBVHgB7VdNTCRFGP2qe6aBGRhA5mfJ7kZcV0XQTQx68MYabl44yMWbetAY3IMX12gWMCZeSLwSEi/GiAHF1SjqMAhoshuTJbg/GkM0xMQIBMj8D/Nfvq+6enZmEtFdhsSDRT66q6qnXr33varqJvoPFUHHWIw6IK6/2tbWdg8dMzBJKQXHwMCAG9UPhBDXW1tbA2gz6BhKZVAAGTs7Oy5um5+fP9fU1LQExv6xsbHGAzNDHrivr88KhUJegH+0ubkp19fXZVdX1w2v13tCAzdcbhPR3N7e3gnQuY0ry3L7nRcUcCAQuIE4MTs7a1IDi9CgXuQxCNBPNq6uyF+HWuTO5IvVjEP6uSMXlk1qYCOVSnFOgYvRLUtmVmbp9HfvUSQSebS5uXkRwIFGSF2zZFpaWoTtWEHCcgvDclPm+4/p3qvvK2CPx7M4MTERZB/QEYoCxVJxBhHsYvwn0+2WKiyLslc+pfuufSjD4fAjyG+Y03AUVyupsDRkR0eHcXBwYMuNKQi3BaYIt5uYce6Hz8XZ63MMzFKHp6am/HcrtQJZWVkhl8tVIju/KqkmgBxAdQXr3LUv6exPl5XUxWIxMjk5GRgZGbljxpWZ7u3tCX3PPCuALDEYk2Ytij9+RQ9ufFEx18LCgv9Ol5PjXsUQg9hSsXubLA3IwC7JoVgjSjfD9PDm1xVzjY6O+qnWlIeDshOxGzkzVRNgeW2mdl6FfXVkxiQsKv/8LfX9sUScY4yxCPAQpP5XjA0GwFJRTLPZrG5mUFcln6Ytc+Uq0CdcLgAvyf4/lxUw1vA3LDVVpexQedfW1ojdW2m1N4cKM8PllqLKUMI0SRhCsuVKtyLUv7XsuJo3kOA/mUt1Dg4OsqRqZ4JUPJZtIttAaqMAMzQarH8NCzwqSzcjghlrcynGh63jGinwA5VP9efIaBr2vqgBnGeltH+nJonCjPts4HPIb5iXE2nP1IPyXssniZNTBhVq0RhC3p6QTd/oHxLpk4/t356yelQawijrecnek6fKOI/9w8PDYQw1ND4+zs/LelAxNzcndIdRLRwzs5kIYT7wJL17q7D/2tPn0+jIcDunRDMt6/SUmbQT6Htra2vrAj+k+yugFRT9I6qVEGxCZwCY3784dillmubr6CqWSqUyD4a61CDclsVKSGM7TaGe8vl8yenpaTMajTqTqeSUjUSdnZ3O5iCrYUXwDM1ke+ni2NspwzAuoTGBweN8xdYZd7vdXE8jMqjnAFjEq06RQZhdT08P1RdONCWTSaEFdeSyqQfvFzO5XnrupdHfAfgm+rcxeBJdaUQS+28K9QQDcxv6eaHntWLSMdHu7q6zxWorVGnNZ6nQVmVJmSEDovoGWGyjixkmLcuK4mSKglEUk4kjYriPFwqFGF550qgzeA6/KTJTx6jVTNXRBt3ZvSpP1OSlmYNeev7lVxQgYqtcLicAmkQKohgsBnViuVwuBpZRXON8j3M2GY/HE5xTv9+fw9Ip4DknlzXAnFM2VDtMcBrXz7Cw+YFNMHoWAOdx/wTue7kf5uAXcR/CWxee7u5uD64tiGaERbZR/3Zb5E4fBj0FNpcRv8GVz4DVU2DyOKR7CLPu5rdFPagzoOmE3uxNDWJUgYl6UFEFCswWH2S6ANBVGCQKwDzu05hAEsDpWCyWw3MFsu0v6S6LySlcXV3lVxUTRnDl8/lfIGkGOcwhMuxWuPQgax9BDKicSUcoyq3sLrAqgxEPmgZ4AtImcWIkcPpk0MaAxUYAVhcT1m4GeCvuu/htD58YQWwY7ah7tNEa/lnBSeeBHeA2sh3ZdFyAXNRHlAawqNadx/edqrc/wwE66lv8/4XLX3gjac6XP/Y1AAAAAElFTkSuQmCC" /* Asset.Click */}); }` +
795
- `.${"clarity-pointer-none" /* Constant.PointerNone */} { background: none; }` +
796
- this.getPointerStyle();
849
+ "#".concat("clarity-interaction-canvas" /* Constant.InteractionCanvas */, " { position: absolute; left: 0; top: 0; z-index: ").concat(2147483647 /* Setting.ZIndex */, "; background: none; }") +
850
+ "#".concat("clarity-pointer" /* Constant.PointerLayer */, " { position: absolute; z-index: ").concat(2147483647 /* Setting.ZIndex */, "; url(").concat("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAmCAYAAAA4LpBhAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAASDSURBVHgB7VdPTCNlFH8z0/+FFmRatnFNiDGR4O4mBk08smZvXjjIxRueNME9eHGNxoLxSNwr4WyigYToQRJLjXDzQtDNmnhR4kWWAJm20ymddtrx94bvI9NBWAptsod9ycvM92fe73vv/b73fUP0DIlCfRQ1AMTtjwcHB1+gPgOT67oK6+TkZBjNbxRF+X1gYCCDPpX6IKdGAaTu7++HuG9tbe1ONBr9GR7r+Xy+98DsIRuemJiIjI6OJgH+3e7urruzs+OOjIw8SiaTNwRwz8OtQWPpdHoYoKt///ar2/jxaw84k8k8gt5YWVnRqEfi90BrtVph0Uetx0V67d9fqFAo3G6324XZ2VldLK4noK4AVqvVaoh8YZTAxWLxdiwW20CoM70IdceWicfjSpCxfuBEIrGxsLCQZR7QNcQDwFaRRhRmcXCSL9S3kN8CtlP2Oqz2QoWt4Q4NDanHx8cy3HQBMIe6sLS0pF811B7I5uYmhUKh1nmAQWAOteM4xcXFxczMzEzXHp+u9PDwUBHvymWBmVzr6+t6t9tJhtPzEEYuFaoguebm5nTqJOXFoMxEVCO50tMFXBaYcwwbGwAfRagv5bEKthK2igdUr9epG/EDYw//xKGmzoLz/6BQd3t7m5i9dAUJsJoLSPZp5PIGp6amXHjsVSaEirqVALk8jy/axx2hwAcMTlcRH/Ad5LfA24kEZ4JzudbySSJzyqDnomq37pH14utH/iUrCA5HCeRwHYXc8dzNNs5jfXp6uoD+e/Pz8zzfDYIqq6urihg4NyTaK2/Rw8fNo0/euWvBWI3TwGAiHW2RnjY7LRVjX+7t7d3nSWL8FFSKIj46I0r2ZXr4R/PoQT5f1TTtU3Q5OAbbbAxtV4BwXx07wUI5raJdTaVS5vLysmYYhlyMDJBHJBoeHpbFwQ0CfmuP04P8V1VVVb9AVwXGy/xE6SyHw2FuW9Aa2jYAHVx1HAZh78bGxs44wYkm0zS9PPrC1QE4+8HcPwD8HONPYNzEkAU1UX+raFcYmPswzhu9ISLmShIdHBx0lFfVH2s+SyWR/IBofgYvnmCIPTQjkYiBk8mARwYWU4aW8F5uNpslXHkstBncxjcOeyqJ6vfUO9oQd2avlyeKJj3A9z/8yAOE7uHKUgGoiRQYMFZCdEq2bZfgpYFnmd9xzprlcrnCOdV13cbWaWKezGVnAUBOmVBpkOAlPH/AxuYJu/DoPQDcxfubeB/ncZCDL+IpaDKgiVwul8AzDo1BI3RC1HPLIg+mYPQmvPke+hdY+S68ehuevIHQvYpV5/i2KIxKg5pUUew1AaL6wM4cl4oPFJjxFMJ0H6BbIIgBwAbeLSzABLBVKpVszGvSCf27r5dCNE7h1tYWX1U0ECHUaDT+REhryKENrTFbwdLj+skRxIAeM+ka4rGV2QWv2vCIjVoAryC0Jk6MCk6fGvoY0OkFoF80UDsG8AG8j/BtD78YWRSMNNoJQbSe/1Zw0tmwBB6kE0ZG+wXI4v1ECYAIdbKzf/+povypEui6t/jnwvIf5FVJ1Cj/1+UAAAAASUVORK5CYII=" /* Asset.Pointer */, ") no-repeat left center; width: ").concat(pointerWidth, "px; height: ").concat(pointerHeight, "px; }") +
851
+ _this.getClickLayerStyle() +
852
+ ".".concat("clarity-touch" /* Constant.TouchLayer */, " { background: radial-gradient(rgba(242,97,12,1), transparent); }") +
853
+ ".".concat("clarity-touch-ring" /* Constant.TouchRing */, " { background: transparent; border: 1px solid rgba(242,97,12,0.8); }") +
854
+ ".".concat("clarity-pointer-click" /* Constant.PointerClickLayer */, " { background-image: url(").concat("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAmCAYAAAA4LpBhAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAVoSURBVHgB7VdNTCRFGP2qe6aBGRhA5mfJ7kZcV0XQTQx68MYabl44yMWbetAY3IMX12gWMCZeSLwSEi/GiAHF1SjqMAhoshuTJbg/GkM0xMQIBMj8D/Nfvq+6enZmEtFdhsSDRT66q6qnXr33varqJvoPFUHHWIw6IK6/2tbWdg8dMzBJKQXHwMCAG9UPhBDXW1tbA2gz6BhKZVAAGTs7Oy5um5+fP9fU1LQExv6xsbHGAzNDHrivr88KhUJegH+0ubkp19fXZVdX1w2v13tCAzdcbhPR3N7e3gnQuY0ry3L7nRcUcCAQuIE4MTs7a1IDi9CgXuQxCNBPNq6uyF+HWuTO5IvVjEP6uSMXlk1qYCOVSnFOgYvRLUtmVmbp9HfvUSQSebS5uXkRwIFGSF2zZFpaWoTtWEHCcgvDclPm+4/p3qvvK2CPx7M4MTERZB/QEYoCxVJxBhHsYvwn0+2WKiyLslc+pfuufSjD4fAjyG+Y03AUVyupsDRkR0eHcXBwYMuNKQi3BaYIt5uYce6Hz8XZ63MMzFKHp6am/HcrtQJZWVkhl8tVIju/KqkmgBxAdQXr3LUv6exPl5XUxWIxMjk5GRgZGbljxpWZ7u3tCX3PPCuALDEYk2Ytij9+RQ9ufFEx18LCgv9Ol5PjXsUQg9hSsXubLA3IwC7JoVgjSjfD9PDm1xVzjY6O+qnWlIeDshOxGzkzVRNgeW2mdl6FfXVkxiQsKv/8LfX9sUScY4yxCPAQpP5XjA0GwFJRTLPZrG5mUFcln6Ytc+Uq0CdcLgAvyf4/lxUw1vA3LDVVpexQedfW1ojdW2m1N4cKM8PllqLKUMI0SRhCsuVKtyLUv7XsuJo3kOA/mUt1Dg4OsqRqZ4JUPJZtIttAaqMAMzQarH8NCzwqSzcjghlrcynGh63jGinwA5VP9efIaBr2vqgBnGeltH+nJonCjPts4HPIb5iXE2nP1IPyXssniZNTBhVq0RhC3p6QTd/oHxLpk4/t356yelQawijrecnek6fKOI/9w8PDYQw1ND4+zs/LelAxNzcndIdRLRwzs5kIYT7wJL17q7D/2tPn0+jIcDunRDMt6/SUmbQT6Htra2vrAj+k+yugFRT9I6qVEGxCZwCY3784dillmubr6CqWSqUyD4a61CDclsVKSGM7TaGe8vl8yenpaTMajTqTqeSUjUSdnZ3O5iCrYUXwDM1ke+ni2NspwzAuoTGBweN8xdYZd7vdXE8jMqjnAFjEq06RQZhdT08P1RdONCWTSaEFdeSyqQfvFzO5XnrupdHfAfgm+rcxeBJdaUQS+28K9QQDcxv6eaHntWLSMdHu7q6zxWorVGnNZ6nQVmVJmSEDovoGWGyjixkmLcuK4mSKglEUk4kjYriPFwqFGF550qgzeA6/KTJTx6jVTNXRBt3ZvSpP1OSlmYNeev7lVxQgYqtcLicAmkQKohgsBnViuVwuBpZRXON8j3M2GY/HE5xTv9+fw9Ip4DknlzXAnFM2VDtMcBrXz7Cw+YFNMHoWAOdx/wTue7kf5uAXcR/CWxee7u5uD64tiGaERbZR/3Zb5E4fBj0FNpcRv8GVz4DVU2DyOKR7CLPu5rdFPagzoOmE3uxNDWJUgYl6UFEFCswWH2S6ANBVGCQKwDzu05hAEsDpWCyWw3MFsu0v6S6LySlcXV3lVxUTRnDl8/lfIGkGOcwhMuxWuPQgax9BDKicSUcoyq3sLrAqgxEPmgZ4AtImcWIkcPpk0MaAxUYAVhcT1m4GeCvuu/htD58YQWwY7ah7tNEa/lnBSeeBHeA2sh3ZdFyAXNRHlAawqNadx/edqrc/wwE66lv8/4XLX3gjac6XP/Y1AAAAAElFTkSuQmCC" /* Asset.Click */, "); }") +
855
+ ".".concat("clarity-pointer-none" /* Constant.PointerNone */, " { background: none; }") +
856
+ _this.getPointerStyle();
797
857
  p.appendChild(style);
798
858
  }
799
859
  p.style.left = (data.x - 4 /* Setting.PointerOffset */) + "px" /* Constant.Pixel */;
800
860
  p.style.top = (data.y - 4 /* Setting.PointerOffset */) + "px" /* Constant.Pixel */;
801
- let title = "Pointer";
861
+ var title = "Pointer";
802
862
  switch (type) {
803
863
  case 9 /* Data.Event.Click */:
804
864
  title = "Click";
805
- this.visualizedClicks.push({
865
+ _this.visualizedClicks.push({
806
866
  doc: de,
807
- click: this.drawClick(doc, data.x, data.y, title),
867
+ click: _this.drawClick(doc, data.x, data.y, title),
808
868
  time: event.time
809
869
  });
810
- if (this.state.options.onclickMismatch) {
811
- const originalTarget = this.layout.element(data.target);
812
- let correctTargetHit = false;
813
- const elementsUnderClick = doc.elementsFromPoint(data.x, data.y);
814
- for (const elementUnderClick of elementsUnderClick) {
870
+ if (_this.state.options.onclickMismatch) {
871
+ var originalTarget = _this.layout.element(data.target);
872
+ var correctTargetHit = false;
873
+ var elementsUnderClick = doc.elementsFromPoint(data.x, data.y);
874
+ for (var _i = 0, elementsUnderClick_1 = elementsUnderClick; _i < elementsUnderClick_1.length; _i++) {
875
+ var elementUnderClick = elementsUnderClick_1[_i];
815
876
  if (originalTarget === elementUnderClick) {
816
877
  correctTargetHit = true;
817
878
  }
818
879
  }
819
880
  if (!correctTargetHit) {
820
- this.state.options.onclickMismatch({
881
+ _this.state.options.onclickMismatch({
821
882
  time: event.time,
822
883
  x: data.x,
823
884
  y: data.y,
@@ -829,9 +890,9 @@ class InteractionHelper {
829
890
  break;
830
891
  case 16 /* Data.Event.DoubleClick */:
831
892
  title = "Click";
832
- this.visualizedClicks.push({
893
+ _this.visualizedClicks.push({
833
894
  doc: de,
834
- click: this.drawClick(doc, data.x, data.y, title),
895
+ click: _this.drawClick(doc, data.x, data.y, title),
835
896
  time: event.time
836
897
  });
837
898
  p.className = "clarity-pointer-none" /* Constant.PointerNone */;
@@ -840,9 +901,9 @@ class InteractionHelper {
840
901
  case 18 /* Data.Event.TouchEnd */:
841
902
  case 20 /* Data.Event.TouchCancel */:
842
903
  title = "Touch";
843
- this.visualizedClicks.push({
904
+ _this.visualizedClicks.push({
844
905
  doc: de,
845
- click: this.drawTouch(doc, data.x, data.y, title),
906
+ click: _this.drawTouch(doc, data.x, data.y, title),
846
907
  time: event.time
847
908
  });
848
909
  p.className = "clarity-pointer-none" /* Constant.PointerNone */;
@@ -854,37 +915,37 @@ class InteractionHelper {
854
915
  case 12 /* Data.Event.MouseMove */:
855
916
  title = "Mouse Move";
856
917
  p.className = "clarity-pointer-move" /* Constant.PointerMove */;
857
- this.addPoint({ time: event.time, x: data.x, y: data.y });
858
- this.targetId = data.target;
918
+ _this.addPoint({ time: event.time, x: data.x, y: data.y });
919
+ _this.targetId = data.target;
859
920
  break;
860
921
  default:
861
922
  p.className = "clarity-pointer-move" /* Constant.PointerMove */;
862
923
  break;
863
924
  }
864
- p.setAttribute("title" /* Constant.Title */, `${title} (${data.x}${"px" /* Constant.Pixel */}, ${data.y}${"px" /* Constant.Pixel */})`);
925
+ p.setAttribute("title" /* Constant.Title */, "".concat(title, " (").concat(data.x).concat("px" /* Constant.Pixel */, ", ").concat(data.y).concat("px" /* Constant.Pixel */, ")"));
865
926
  };
866
- this.clearOldClickVisualizations = (currentTimestamp) => {
867
- if (this.vnext) {
868
- while (this.visualizedClicks.length > 10 /* Setting.MaxClicksDisplayed */) {
869
- const visualizedClick = this.visualizedClicks.shift();
870
- this.fadeOutElement(visualizedClick.click, visualizedClick.doc);
927
+ this.clearOldClickVisualizations = function (currentTimestamp) {
928
+ if (_this.vnext) {
929
+ while (_this.visualizedClicks.length > 10 /* Setting.MaxClicksDisplayed */) {
930
+ var visualizedClick = _this.visualizedClicks.shift();
931
+ _this.fadeOutElement(visualizedClick.click, visualizedClick.doc);
871
932
  }
872
- var tooOldClicks = this.visualizedClicks.filter(click => currentTimestamp - click.time > 5000 /* Setting.MaxClickDisplayDuration */);
873
- tooOldClicks.forEach(click => {
874
- this.fadeOutElement(click.click, click.doc);
875
- this.visualizedClicks.splice(this.visualizedClicks.indexOf(click), 1);
933
+ var tooOldClicks = _this.visualizedClicks.filter(function (click) { return currentTimestamp - click.time > 5000 /* Setting.MaxClickDisplayDuration */; });
934
+ tooOldClicks.forEach(function (click) {
935
+ _this.fadeOutElement(click.click, click.doc);
936
+ _this.visualizedClicks.splice(_this.visualizedClicks.indexOf(click), 1);
876
937
  });
877
938
  }
878
939
  };
879
- this.fadeOutElement = (element, document) => {
940
+ this.fadeOutElement = function (element, document) {
880
941
  element.classList.add("clarity-click-hidden");
881
- setTimeout(() => { document.removeChild(element); }, 10000);
942
+ setTimeout(function () { document.removeChild(element); }, 10000);
882
943
  };
883
- this.hover = () => {
884
- if (this.targetId && this.targetId !== this.hoverId) {
885
- let depth = 0;
944
+ this.hover = function () {
945
+ if (_this.targetId && _this.targetId !== _this.hoverId) {
946
+ var depth = 0;
886
947
  // First, remove any previous hover class assignments
887
- let hoverNode = this.hoverId ? this.layout.element(this.hoverId) : null;
948
+ var hoverNode = _this.hoverId ? _this.layout.element(_this.hoverId) : null;
888
949
  while (hoverNode && depth < 7 /* Setting.HoverDepth */) {
889
950
  if ("removeAttribute" in hoverNode) {
890
951
  hoverNode.removeAttribute("clarity-hover" /* Constant.HoverAttribute */);
@@ -894,7 +955,7 @@ class InteractionHelper {
894
955
  }
895
956
  // Then, add hover class on elements that are below the pointer
896
957
  depth = 0;
897
- let targetNode = this.targetId ? this.layout.element(this.targetId) : null;
958
+ var targetNode = _this.targetId ? _this.layout.element(_this.targetId) : null;
898
959
  while (targetNode && depth < 7 /* Setting.HoverDepth */) {
899
960
  if ("setAttribute" in targetNode) {
900
961
  targetNode.setAttribute("clarity-hover" /* Constant.HoverAttribute */, "" /* Layout.Constant.Empty */);
@@ -903,30 +964,30 @@ class InteractionHelper {
903
964
  depth++;
904
965
  }
905
966
  // Finally, update hoverId to reflect the new node
906
- this.hoverId = this.targetId;
967
+ _this.hoverId = _this.targetId;
907
968
  }
908
969
  };
909
- this.addPoint = (point) => {
910
- let last = this.points.length > 0 ? this.points[this.points.length - 1] : null;
970
+ this.addPoint = function (point) {
971
+ var last = _this.points.length > 0 ? _this.points[_this.points.length - 1] : null;
911
972
  if (last && point.x === last.x && point.y === last.y) {
912
973
  last.time = point.time;
913
974
  }
914
975
  else {
915
- this.points.push(point);
976
+ _this.points.push(point);
916
977
  }
917
978
  };
918
- this.drawTouch = (doc, x, y, title) => {
919
- let de = doc.documentElement;
920
- let touch = doc.createElement("DIV");
979
+ this.drawTouch = function (doc, x, y, title) {
980
+ var de = doc.documentElement;
981
+ var touch = doc.createElement("DIV");
921
982
  touch.className = "clarity-touch" /* Constant.TouchLayer */;
922
- touch.setAttribute("title" /* Constant.Title */, `${title} (${x}${"px" /* Constant.Pixel */}, ${y}${"px" /* Constant.Pixel */})`);
983
+ touch.setAttribute("title" /* Constant.Title */, "".concat(title, " (").concat(x).concat("px" /* Constant.Pixel */, ", ").concat(y).concat("px" /* Constant.Pixel */, ")"));
923
984
  touch.style.left = (x - 22 /* Setting.ClickRadius */ / 2) + "px" /* Constant.Pixel */;
924
985
  touch.style.top = (y - 22 /* Setting.ClickRadius */ / 2) + "px" /* Constant.Pixel */;
925
986
  touch.style.animation = "disappear 1 1s";
926
987
  touch.style.animationFillMode = "forwards";
927
988
  de.appendChild(touch);
928
989
  // First pulsating ring
929
- let ringOne = touch.cloneNode();
990
+ var ringOne = touch.cloneNode();
930
991
  ringOne.className = "clarity-touch-ring" /* Constant.TouchRing */;
931
992
  ringOne.style.left = "-0.5" + "px" /* Constant.Pixel */;
932
993
  ringOne.style.top = "-0.5" + "px" /* Constant.Pixel */;
@@ -935,48 +996,48 @@ class InteractionHelper {
935
996
  touch.appendChild(ringOne);
936
997
  return touch;
937
998
  };
938
- this.drawClick = (doc, x, y, title) => {
939
- let de = doc.documentElement;
940
- let click = doc.createElement("DIV");
999
+ this.drawClick = function (doc, x, y, title) {
1000
+ var de = doc.documentElement;
1001
+ var click = doc.createElement("DIV");
941
1002
  click.className = "clarity-click" /* Constant.ClickLayer */;
942
- click.setAttribute("title" /* Constant.Title */, `${title} (${x}${"px" /* Constant.Pixel */}, ${y}${"px" /* Constant.Pixel */})`);
1003
+ click.setAttribute("title" /* Constant.Title */, "".concat(title, " (").concat(x).concat("px" /* Constant.Pixel */, ", ").concat(y).concat("px" /* Constant.Pixel */, ")"));
943
1004
  click.style.left = (x - 22 /* Setting.ClickRadius */ / 2) + "px" /* Constant.Pixel */;
944
1005
  click.style.top = (y - 22 /* Setting.ClickRadius */ / 2) + "px" /* Constant.Pixel */;
945
1006
  // First pulsating ring
946
- let ringOne = click.cloneNode();
1007
+ var ringOne = click.cloneNode();
947
1008
  ringOne.className = "clarity-click-ring" /* Constant.ClickRing */;
948
1009
  ringOne.style.left = "-0.5" + "px" /* Constant.Pixel */;
949
1010
  ringOne.style.top = "-0.5" + "px" /* Constant.Pixel */;
950
1011
  ringOne.style.animation = "pulsate-one 1 1s";
951
1012
  ringOne.style.animationFillMode = "forwards";
952
1013
  click.appendChild(ringOne);
953
- if (this.vnext) {
954
- let center = doc.createElement("DIV");
955
- center.className = `${"clarity-click" /* Constant.ClickLayer */}-center`;
1014
+ if (_this.vnext) {
1015
+ var center = doc.createElement("DIV");
1016
+ center.className = "".concat("clarity-click" /* Constant.ClickLayer */, "-center");
956
1017
  click.appendChild(center);
957
1018
  }
958
1019
  else {
959
1020
  // Second pulsating ring
960
- let ringTwo = ringOne.cloneNode();
1021
+ var ringTwo = ringOne.cloneNode();
961
1022
  ringTwo.style.animation = "pulsate-two 1 1s";
962
1023
  click.appendChild(ringTwo);
963
1024
  }
964
1025
  de.appendChild(click);
965
1026
  // Play sound
966
1027
  if (typeof Audio !== "undefined" /* Constant.Undefined */) {
967
- if (this.clickAudio === null) {
968
- this.clickAudio = new Audio("data:video/webm;base64,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" /* Asset.Sound */);
969
- click.appendChild(this.clickAudio);
1028
+ if (_this.clickAudio === null) {
1029
+ _this.clickAudio = new Audio("data:video/webm;base64,GkXfo59ChoEBQveBAULygQRC84EIQoKEd2VibUKHgQRChYECGFOAZwEAAAAAAA2GEU2bdKxNu4tTq4QVSalmU6yB5U27jFOrhBZUrmtTrIIBHE27jFOrhBJUw2dTrIIBg+wBAAAAAAAAqwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABVJqWayKtexgw9CQE2AjUxhdmY1OC4zMy4xMDBXQY1MYXZmNTguMzMuMTAwRImIQHWwAAAAAAAWVK5r4q4BAAAAAAAAWdeBAXPFgQGcgQAitZyDdW5khoZBX09QVVNWqoNjLqBWu4QExLQAg4EC4QEAAAAAAAARn4EBtYhA53AAAAAAAGJkgRBjopNPcHVzSGVhZAEBOAGAuwAAAAAAElTDZ0E3c3MBAAAAAAAApWPAAQAAAAAAAABnyAEAAAAAAAAwRaOKRU5DT0RFRF9CWUSHoEFkb2JlIFByZW1pZXJlIFBybyAyMDIwLjAgKE1hY2luZ8gBAAAAAAAAFUWjjlRJTUVfUkVGRVJFTkNFRIeBMGfIAQAAAAAAABRFo4REQVRFRIeKMjAyMC0wNS0xMWfIAQAAAAAAABpFo4dFTkNPREVSRIeNTGF2ZjU4LjMzLjEwMHNzAQAAAAAAADpjwAEAAAAAAAAEY8WBAWfIAQAAAAAAACJFo4dFTkNPREVSRIeVTGF2YzU4LjU5LjEwMiBsaWJvcHVzc3MBAAAAAAAAOmPAAQAAAAAAAARjxYEBZ8gBAAAAAAAAIkWjiERVUkFUSU9ORIeUMDA6MDA6MDAuMzQ3MDAwMDAwAAAfQ7Z1SsDngQCjh4EAAID4//6jh4EAFYD4//6jh4EAKYD4//6jh4EAPYD4//6jQTOBAFGA+Hf8sxqASCSh2FJGBfsZEwDIBdS8inu5b213iY0Dnu9jbest8S64kJlnCuNakokZYO8i1Wus5IXXTjHRTe0n/H904+RQTH0PGdXj50tRWTzoHv5wwgjWEduG7UuDBZeB3bb6VuqWZ1rcPJlfa5Kmrg0trnCEMbbrqATFPr3h9IjSfa8Pu2OtrPUA+sXcPf0eC79cRi9UGNxkIKf8NaiHGOxrbPyvsewpDmWLKFAwmqC/tYu7kznCSvyONWH1jFENoGGEFPrDYmM6V99Yk/71TEDwhtFjj4g+aGac1DwRBa7uDakJl6HGXL/vIR8z4qanutC0xZ8XY+PUFuBFAKy0YKZWhUOIRLy2A/2E40Q3LDRlcrVanhIf3e4v84VjIRAKAhfbLYMCTQ8G3Mu+ErEHo0E5gQBlgPh+GaacPkSEqd6zm8k76Jk8Aw8Pf7sK8lqg1Blt7hwsIfI0kefrJGluVOvxYxMZNZSiQSIOJptbwNjufeojLnvzUzNrqIBrghz4nHEFT0cYc/ZA0vWSHRgQSQD8WkqvD/vRHFCCmRh+SI6bVempNdNFloc6Uni4M58ZoiuYnmRdkSYtxJDdNOc0RhdFehBG7dNqXiTkSo0zIvdCK7XAsuJHLVMQOke7SWyPo1kFyBKoQyuK06K4VG2IqwlH138PKee8g6Wxtu+DENjWxG7HtMJf3iIo1aXOWaNdIyJMKqSAv2rUwYdPpaPtYyFMTAqH372Ocq7A4ixxMAwAksL+QaYeyss6V37dQaqtF6Skb4SggL9v4uOj0IVE+r1e/7Ooj2KAL3RG4B5WzE6TNoMNwrg+HQR8rqNBK4EAeYD4fMsrpfE2dU5rAKM3te90/U91Gt8Bn80e5ri5WSnxJ+Y8HffdtHkOib+JNvmr2AXc3De0EiMC/ecOgekxFMOiPYSEJxQLUMcMl23RySvdXXs+XM5U5+dmsrCvoNppK4JkZYiIOPI975i0OdA8q+XZlbQ+1Mz/q9GxUsjVo4t1W/bYOfr0+7kFIG8Wad0KcLAOaQN5UZq5uz4XCOoBiqkhg60DQ7c7x0eApCrx4n+aoc/1nZvWHsmumI4GAhVcyBNYOisYkyogtfPYFgoKrqvZMFB54/Xtw5AVBfUduVktZqY0HuSaFLhclAYYpEx/gPl8NGZ2YacOgAK35EJ7HMSIMZtcjbhn05lJHifyTuO7WIApoP50VdFPLw1oiofLS+j/iG6UDRvuo0DDgQCNgPhhOmsgpW2AnFd6vOCxqTjHmKAhblr1wX1IIPu5/1ftPUmPXFP+NcdIVclcWKJCMlxOyd0+2kc/EtIy6X43uooxYrcCUwj8TZgX1ooV1ZIV03qDRQmXELmp6vDXPOg+MWF4mXhMnCUAsRBoQlb/giRAIZl6+GRetMoAAvEnAFTrl2kALzo2aNfN35ESALpqn87BaA+XZdl2Da/0BXNzE5YXwfcorOXeOHLK6QBlj+7w2Q/fKiuZbwWZ+sE67NeUo0E1gQChgPh/KZRcKyQ9fyIqiewLQu0jhqZkXwEEyS1JfYtVxvZ6rhEqjbzwRqfczQjpHLJR7WVtEKi/NHwXZOYYCzbXHXszeAc7yI+i0hfTKOtqNz69nwX5PZ0weNjP4w6QbWoW8OzWPA2f8ZXfptK1Z6PUW/bNj+hdnd46OZzGK6qLr0EZQeSDluLYFSAoeywY65FGKsH51y0g3cQAeCm0Hznu62i4scicJcYqtavuPi6CJTSy+32DeRbWPB+YZqKpFfoTj87ga5TPE0w5lSOF/slzVzQuchTYUMSWIaBUewA6TipFaEOzi43vUclCGINiKi9lGX15S2bFeBb7rldhrBkNUw6/r4weukw7Fle08ZaAFG1BFocao5MxZ3NhYFU7rvjrgh8hL790E2gMLfCwFNTaJ5kfo0E9gQC1gPh7RQVaT+xi+Tfqby3j6v+Ws0ncRr8n07Sye0xZsosiFldqDH0aJIuw8DjUxc7oxvCAGAKQXyc+ukXJ4dFdBG/uiYYUGLTXR9UfvK0Aa/aPSaA0xm15ulCJG+OgPSgi73bhK/DEoLSKw6wMX/daeL7AuuvZAC4Lm+82QqkWaKXi+UKET1uykU8LjPeCFcJOr8tmsu8Na9zgyhX7sk+O72ILT3Tq6wtu0P/kBrkuSRVLDljecUtPGPd81nDxthyri0GHn1dGCQO/ryf9UO/d20YclmvvGBMzrm+q7e9OTsHVS/EQiYVfdUR3tB2585J3FkDJQGnksPMytaB5oLJYgsJgTwGMztB4U7Px4tsx+nO3yTjNTr9po0qxhXggVDFmcrkE9VUMcDYcaqi/ygCf2RTVud/egmVznRWjQTCBAMmA+Hzk3SIwInlcM2PFuCLBsYPmx3rbcIXqk7OkMk+s8oaWDdn62v0ln085oXKkuFLC/HALb7ByiqCblKgO86J2B/n+xC4RTNIO+5QV8nXidUXkdFiltBuoUUAa2zLh90VncpZQC0tLDxfV32+Igrrj7FZOu3RvtRy8Yw9TvSjOwlYkAMqydxC9O9qbyOecB4onpr62eH7mXD4AicyRmXzRG88GvsB09N7QEEBWNNBGHyC7i0Gkmn9h/b7ypju8iBp7ZSghXzmNyBsp9cmOTxiCgiO94OPMLe35NzmIoM/Rbzdgi7DT1q4n4/06JtDxcwbibc5PWaaoehRpZ41p6bcpJ15QrlKTfklR0P+FDioJIQ4NvzZlUKrJtJ3FjfEmcAoWz18pFvCPLaK0TK/Mo0EygQDdgPh9vdOMNo75kIEdfCwlJUwcZsrSyfZcQTEMDsHY9ozsBLRDSLmLSYpqA3Mt0LPpmMYOckcGC/acmIP52RObp1DjpAfXGotFeXzyTIVFcD/mF8f2gteywXt++dRJm04SU7wF5fr+qsirERDjxStbtnuICHN4+jXw2zy6KQAADCrLZHgcqOYBrgcferGAAAAAAAAAAAAAAAAAAAAAIHTo9YXVkUJ3lE/QiyCmhh4KpBCGpc3sSM0hW/uUNFxO744xxgjWWy+LksHodcnYT1+1M13MXq0oMnNJWSgWqbjbOWzfYGDFITcGvrPupQH266TUDffTYAFX/qLkruQ7UwGx66GwkbjBGwdc8y5PqdohY0JXzta+r8KGdVitaFYALTmJUqFc9URJ1WLGn2/0TX5Xo0ETgQDxgPh/3ztwqxbXHlZsp/yXeBDstIY8ov3IYo9ekn89p0yxz4ziLbp2PgwxkiZTBrJbXu1j7rNqjdVJ29SbxVQ96tdWZbh9xBr+bpL9fM8UBP5oljtFFlCrDNz5X/X2kcHm2EswzFpHwF4RqqFJEtiMJ10iTbW4nUbtKN8o4GBuFHBQb2aAXEQE8Slkx+z2KedA1NoEkeHLyC3RVTr4NhqC8xhZnPFSwTZy3Woo+gQCOac0AIAJ7me5hJ6P+5HimuFWwE8719kEheeataVAEAE28VJhAEAHvqn9MYAQAe+mOv9MAHgAHlJhu9NgA8ADar/Tw1UQAG0ACqMNVEKXOQAKoAEzjdI4ACqAAAAB+Y2WeOijh4EBBYD4//6jh4EBGYD4//6jh4EBLYD4//6jh4EBQYD4//6gAQAAAAAAABChh4EBVQD4//51ooQA14fI" /* Asset.Sound */);
1030
+ click.appendChild(_this.clickAudio);
970
1031
  }
971
- this.clickAudio.play();
1032
+ _this.clickAudio.play();
972
1033
  }
973
1034
  return click;
974
1035
  };
975
- this.overlay = () => {
1036
+ this.overlay = function () {
976
1037
  // Create canvas for visualizing interactions
977
- let doc = this.state.window.document;
978
- let de = doc.documentElement;
979
- let canvas = doc.getElementById("clarity-interaction-canvas" /* Constant.InteractionCanvas */);
1038
+ var doc = _this.state.window.document;
1039
+ var de = doc.documentElement;
1040
+ var canvas = doc.getElementById("clarity-interaction-canvas" /* Constant.InteractionCanvas */);
980
1041
  if (canvas === null) {
981
1042
  canvas = doc.createElement("canvas");
982
1043
  canvas.id = "clarity-interaction-canvas" /* Constant.InteractionCanvas */;
@@ -990,13 +1051,13 @@ class InteractionHelper {
990
1051
  }
991
1052
  return canvas;
992
1053
  };
993
- this.match = (time) => {
994
- let p = [];
995
- for (let i = this.points.length - 1; i > 0; i--) {
1054
+ this.match = function (time) {
1055
+ var p = [];
1056
+ for (var i = _this.points.length - 1; i > 0; i--) {
996
1057
  // Each pixel in the trail has a pixel life of 3s. The only exception to this is if the user scrolled.
997
1058
  // We reset the trail after every scroll event to avoid drawing weird looking trail.
998
- if (i >= this.scrollPointIndex && time - this.points[i].time < 3000 /* Setting.PixelLife */) {
999
- p.push(this.points[i]);
1059
+ if (i >= _this.scrollPointIndex && time - _this.points[i].time < 3000 /* Setting.PixelLife */) {
1060
+ p.push(_this.points[i]);
1000
1061
  }
1001
1062
  else {
1002
1063
  break;
@@ -1004,32 +1065,32 @@ class InteractionHelper {
1004
1065
  }
1005
1066
  return p.slice(0, 75 /* Setting.MaxTrailPoints */);
1006
1067
  };
1007
- this.trail = (now) => {
1008
- const canvas = this.overlay();
1009
- if (this.state.options.canvas && canvas) {
1010
- const ctx = canvas.getContext('2d');
1011
- const path = this.state.options.keyframes ? this.curve(this.points.reverse()) : this.curve(this.match(now));
1068
+ this.trail = function (now) {
1069
+ var canvas = _this.overlay();
1070
+ if (_this.state.options.canvas && canvas) {
1071
+ var ctx = canvas.getContext('2d');
1072
+ var path = _this.state.options.keyframes ? _this.curve(_this.points.reverse()) : _this.curve(_this.match(now));
1012
1073
  // Update hovered elements
1013
- this.hover();
1074
+ _this.hover();
1014
1075
  // We need at least two points to create a line
1015
1076
  if (path.length > 1) {
1016
- let last = path[0];
1077
+ var last = path[0];
1017
1078
  // Start off by clearing whatever was on the canvas before
1018
1079
  // The current implementation is inefficient. We have to redraw canvas all over again for every point.
1019
1080
  // In future we should batch pointer events and minimize the number of times we have to redraw canvas.
1020
1081
  ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
1021
- let count = path.length;
1022
- let offsetX = canvas.offsetLeft;
1023
- let offsetY = canvas.offsetTop;
1024
- for (let i = 1; i < count; i++) {
1025
- let current = path[i];
1082
+ var count = path.length;
1083
+ var offsetX = canvas.offsetLeft;
1084
+ var offsetY = canvas.offsetTop;
1085
+ for (var i = 1; i < count; i++) {
1086
+ var current = path[i];
1026
1087
  // Compute percentage position of these points compared to all points in the path
1027
- let lastFactor = 1 - ((i - 1) / count);
1028
- let currentFactor = 1 - (i / count);
1088
+ var lastFactor = 1 - ((i - 1) / count);
1089
+ var currentFactor = 1 - (i / count);
1029
1090
  // Generate a color gradient that goes from red -> yellow -> green -> light blue -> blue
1030
- let gradient = ctx.createLinearGradient(last.x, last.y, current.x, current.y);
1031
- gradient.addColorStop(1, this.color(currentFactor));
1032
- gradient.addColorStop(0, this.color(lastFactor));
1091
+ var gradient = ctx.createLinearGradient(last.x, last.y, current.x, current.y);
1092
+ gradient.addColorStop(1, _this.color(currentFactor));
1093
+ gradient.addColorStop(0, _this.color(lastFactor));
1033
1094
  // Line width of the trail shrinks as the position of the point goes farther away.
1034
1095
  ctx.lineWidth = 6 /* Setting.TrailWidth */ * currentFactor;
1035
1096
  ctx.lineCap = "round" /* Constant.Round */;
@@ -1047,25 +1108,25 @@ class InteractionHelper {
1047
1108
  }
1048
1109
  }
1049
1110
  // If we are only rendering key frames, clear points array after each key frame
1050
- if (this.state.options.keyframes) {
1051
- this.points = [];
1111
+ if (_this.state.options.keyframes) {
1112
+ _this.points = [];
1052
1113
  }
1053
1114
  }
1054
1115
  };
1055
- this.color = (factor) => {
1056
- let s = InteractionHelper.TRAIL_START_COLOR;
1057
- let e = InteractionHelper.TRAIL_END_COLOR;
1058
- let c = [];
1059
- for (let i = 0; i < 3; i++) {
1116
+ this.color = function (factor) {
1117
+ var s = InteractionHelper.TRAIL_START_COLOR;
1118
+ var e = InteractionHelper.TRAIL_END_COLOR;
1119
+ var c = [];
1120
+ for (var i = 0; i < 3; i++) {
1060
1121
  c[i] = Math.round(e[i] + factor * (s[i] - e[i]));
1061
1122
  }
1062
- return `rgba(${c[0]}, ${c[1]}, ${c[2]}, ${factor})`;
1123
+ return "rgba(".concat(c[0], ", ").concat(c[1], ", ").concat(c[2], ", ").concat(factor, ")");
1063
1124
  };
1064
1125
  // Reference: https://en.wikipedia.org/wiki/Cubic_Hermite_spline#Cardinal_spline
1065
- this.curve = (path) => {
1066
- const tension = 0.5;
1067
- let p = [];
1068
- let output = [];
1126
+ this.curve = function (path) {
1127
+ var tension = 0.5;
1128
+ var p = [];
1129
+ var output = [];
1069
1130
  // Make a copy of the input points so we don't make any side effects
1070
1131
  p = path.slice(0);
1071
1132
  // The algorithm require a valid previous and next point for each point in the original input
@@ -1074,56 +1135,57 @@ class InteractionHelper {
1074
1135
  p.unshift(path[0]);
1075
1136
  p.push(path[path.length - 1]);
1076
1137
  // Loop through the points, and generate intermediate points to make a smooth trail
1077
- for (let i = 1; i < p.length - 2; i++) {
1078
- const time = p[i].time;
1079
- const segments = Math.max(Math.min(Math.round(this.distance(p[i], p[i - 1])), 10), 1);
1080
- for (let t = 0; t <= segments; t++) {
1138
+ for (var i = 1; i < p.length - 2; i++) {
1139
+ var time = p[i].time;
1140
+ var segments = Math.max(Math.min(Math.round(_this.distance(p[i], p[i - 1])), 10), 1);
1141
+ for (var t = 0; t <= segments; t++) {
1081
1142
  // Compute tension vectors
1082
- let t1 = { time, x: (p[i + 1].x - p[i - 1].x) * tension, y: (p[i + 1].y - p[i - 1].y) * tension };
1083
- let t2 = { time, x: (p[i + 2].x - p[i].x) * tension, y: (p[i + 2].y - p[i].y) * tension };
1084
- let step = t / segments;
1143
+ var t1 = { time: time, x: (p[i + 1].x - p[i - 1].x) * tension, y: (p[i + 1].y - p[i - 1].y) * tension };
1144
+ var t2 = { time: time, x: (p[i + 2].x - p[i].x) * tension, y: (p[i + 2].y - p[i].y) * tension };
1145
+ var step = t / segments;
1085
1146
  // Compute cardinals
1086
- let c1 = 2 * Math.pow(step, 3) - 3 * Math.pow(step, 2) + 1;
1087
- let c2 = -(2 * Math.pow(step, 3)) + 3 * Math.pow(step, 2);
1088
- let c3 = Math.pow(step, 3) - 2 * Math.pow(step, 2) + step;
1089
- let c4 = Math.pow(step, 3) - Math.pow(step, 2);
1147
+ var c1 = 2 * Math.pow(step, 3) - 3 * Math.pow(step, 2) + 1;
1148
+ var c2 = -(2 * Math.pow(step, 3)) + 3 * Math.pow(step, 2);
1149
+ var c3 = Math.pow(step, 3) - 2 * Math.pow(step, 2) + step;
1150
+ var c4 = Math.pow(step, 3) - Math.pow(step, 2);
1090
1151
  // Compute new point with common control vectors
1091
- let x = c1 * p[i].x + c2 * p[i + 1].x + c3 * t1.x + c4 * t2.x;
1092
- let y = c1 * p[i].y + c2 * p[i + 1].y + c3 * t1.y + c4 * t2.y;
1093
- output.push({ time, x, y });
1152
+ var x = c1 * p[i].x + c2 * p[i + 1].x + c3 * t1.x + c4 * t2.x;
1153
+ var y = c1 * p[i].y + c2 * p[i + 1].y + c3 * t1.y + c4 * t2.y;
1154
+ output.push({ time: time, x: x, y: y });
1094
1155
  }
1095
1156
  }
1096
1157
  return output;
1097
1158
  };
1098
- this.distance = (a, b) => {
1099
- const dx = a.x - b.x;
1100
- const dy = a.y - b.y;
1159
+ this.distance = function (a, b) {
1160
+ var dx = a.x - b.x;
1161
+ var dy = a.y - b.y;
1101
1162
  return Math.sqrt(dx * dx + dy * dy);
1102
1163
  };
1103
- this.getPointerStyle = () => {
1104
- if (this.vnext) {
1105
- return `.${"clarity-pointer-move" /* Constant.PointerMove */} { ${pointerSvg} }`;
1164
+ this.getPointerStyle = function () {
1165
+ if (_this.vnext) {
1166
+ return ".".concat("clarity-pointer-move" /* Constant.PointerMove */, " { ").concat(pointerSvg, " }");
1106
1167
  }
1107
1168
  else {
1108
- return `.${"clarity-pointer-move" /* Constant.PointerMove */} { background-image: url(${"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAmCAYAAAA4LpBhAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAASDSURBVHgB7VdPTCNlFH8z0/+FFmRatnFNiDGR4O4mBk08smZvXjjIxRueNME9eHGNxoLxSNwr4WyigYToQRJLjXDzQtDNmnhR4kWWAJm20ymddtrx94bvI9NBWAptsod9ycvM92fe73vv/b73fUP0DIlCfRQ1AMTtjwcHB1+gPgOT67oK6+TkZBjNbxRF+X1gYCCDPpX6IKdGAaTu7++HuG9tbe1ONBr9GR7r+Xy+98DsIRuemJiIjI6OJgH+3e7urruzs+OOjIw8SiaTNwRwz8OtQWPpdHoYoKt///ar2/jxaw84k8k8gt5YWVnRqEfi90BrtVph0Uetx0V67d9fqFAo3G6324XZ2VldLK4noK4AVqvVaoh8YZTAxWLxdiwW20CoM70IdceWicfjSpCxfuBEIrGxsLCQZR7QNcQDwFaRRhRmcXCSL9S3kN8CtlP2Oqz2QoWt4Q4NDanHx8cy3HQBMIe6sLS0pF811B7I5uYmhUKh1nmAQWAOteM4xcXFxczMzEzXHp+u9PDwUBHvymWBmVzr6+t6t9tJhtPzEEYuFaoguebm5nTqJOXFoMxEVCO50tMFXBaYcwwbGwAfRagv5bEKthK2igdUr9epG/EDYw//xKGmzoLz/6BQd3t7m5i9dAUJsJoLSPZp5PIGp6amXHjsVSaEirqVALk8jy/axx2hwAcMTlcRH/Ad5LfA24kEZ4JzudbySSJzyqDnomq37pH14utH/iUrCA5HCeRwHYXc8dzNNs5jfXp6uoD+e/Pz8zzfDYIqq6urihg4NyTaK2/Rw8fNo0/euWvBWI3TwGAiHW2RnjY7LRVjX+7t7d3nSWL8FFSKIj46I0r2ZXr4R/PoQT5f1TTtU3Q5OAbbbAxtV4BwXx07wUI5raJdTaVS5vLysmYYhlyMDJBHJBoeHpbFwQ0CfmuP04P8V1VVVb9AVwXGy/xE6SyHw2FuW9Aa2jYAHVx1HAZh78bGxs44wYkm0zS9PPrC1QE4+8HcPwD8HONPYNzEkAU1UX+raFcYmPswzhu9ISLmShIdHBx0lFfVH2s+SyWR/IBofgYvnmCIPTQjkYiBk8mARwYWU4aW8F5uNpslXHkstBncxjcOeyqJ6vfUO9oQd2avlyeKJj3A9z/8yAOE7uHKUgGoiRQYMFZCdEq2bZfgpYFnmd9xzprlcrnCOdV13cbWaWKezGVnAUBOmVBpkOAlPH/AxuYJu/DoPQDcxfubeB/ncZCDL+IpaDKgiVwul8AzDo1BI3RC1HPLIg+mYPQmvPke+hdY+S68ehuevIHQvYpV5/i2KIxKg5pUUew1AaL6wM4cl4oPFJjxFMJ0H6BbIIgBwAbeLSzABLBVKpVszGvSCf27r5dCNE7h1tYWX1U0ECHUaDT+REhryKENrTFbwdLj+skRxIAeM+ka4rGV2QWv2vCIjVoAryC0Jk6MCk6fGvoY0OkFoF80UDsG8AG8j/BtD78YWRSMNNoJQbSe/1Zw0tmwBB6kE0ZG+wXI4v1ECYAIdbKzf/+povypEui6t/jnwvIf5FVJ1Cj/1+UAAAAASUVORK5CYII=" /* Asset.Pointer */}); }`;
1169
+ return ".".concat("clarity-pointer-move" /* Constant.PointerMove */, " { background-image: url(").concat("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAmCAYAAAA4LpBhAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAASDSURBVHgB7VdPTCNlFH8z0/+FFmRatnFNiDGR4O4mBk08smZvXjjIxRueNME9eHGNxoLxSNwr4WyigYToQRJLjXDzQtDNmnhR4kWWAJm20ymddtrx94bvI9NBWAptsod9ycvM92fe73vv/b73fUP0DIlCfRQ1AMTtjwcHB1+gPgOT67oK6+TkZBjNbxRF+X1gYCCDPpX6IKdGAaTu7++HuG9tbe1ONBr9GR7r+Xy+98DsIRuemJiIjI6OJgH+3e7urruzs+OOjIw8SiaTNwRwz8OtQWPpdHoYoKt///ar2/jxaw84k8k8gt5YWVnRqEfi90BrtVph0Uetx0V67d9fqFAo3G6324XZ2VldLK4noK4AVqvVaoh8YZTAxWLxdiwW20CoM70IdceWicfjSpCxfuBEIrGxsLCQZR7QNcQDwFaRRhRmcXCSL9S3kN8CtlP2Oqz2QoWt4Q4NDanHx8cy3HQBMIe6sLS0pF811B7I5uYmhUKh1nmAQWAOteM4xcXFxczMzEzXHp+u9PDwUBHvymWBmVzr6+t6t9tJhtPzEEYuFaoguebm5nTqJOXFoMxEVCO50tMFXBaYcwwbGwAfRagv5bEKthK2igdUr9epG/EDYw//xKGmzoLz/6BQd3t7m5i9dAUJsJoLSPZp5PIGp6amXHjsVSaEirqVALk8jy/axx2hwAcMTlcRH/Ad5LfA24kEZ4JzudbySSJzyqDnomq37pH14utH/iUrCA5HCeRwHYXc8dzNNs5jfXp6uoD+e/Pz8zzfDYIqq6urihg4NyTaK2/Rw8fNo0/euWvBWI3TwGAiHW2RnjY7LRVjX+7t7d3nSWL8FFSKIj46I0r2ZXr4R/PoQT5f1TTtU3Q5OAbbbAxtV4BwXx07wUI5raJdTaVS5vLysmYYhlyMDJBHJBoeHpbFwQ0CfmuP04P8V1VVVb9AVwXGy/xE6SyHw2FuW9Aa2jYAHVx1HAZh78bGxs44wYkm0zS9PPrC1QE4+8HcPwD8HONPYNzEkAU1UX+raFcYmPswzhu9ISLmShIdHBx0lFfVH2s+SyWR/IBofgYvnmCIPTQjkYiBk8mARwYWU4aW8F5uNpslXHkstBncxjcOeyqJ6vfUO9oQd2avlyeKJj3A9z/8yAOE7uHKUgGoiRQYMFZCdEq2bZfgpYFnmd9xzprlcrnCOdV13cbWaWKezGVnAUBOmVBpkOAlPH/AxuYJu/DoPQDcxfubeB/ncZCDL+IpaDKgiVwul8AzDo1BI3RC1HPLIg+mYPQmvPke+hdY+S68ehuevIHQvYpV5/i2KIxKg5pUUew1AaL6wM4cl4oPFJjxFMJ0H6BbIIgBwAbeLSzABLBVKpVszGvSCf27r5dCNE7h1tYWX1U0ECHUaDT+REhryKENrTFbwdLj+skRxIAeM+ka4rGV2QWv2vCIjVoAryC0Jk6MCk6fGvoY0OkFoF80UDsG8AG8j/BtD78YWRSMNNoJQbSe/1Zw0tmwBB6kE0ZG+wXI4v1ECYAIdbKzf/+povypEui6t/jnwvIf5FVJ1Cj/1+UAAAAASUVORK5CYII=" /* Asset.Pointer */, "); }");
1109
1170
  }
1110
1171
  };
1111
- this.getClickLayerStyle = () => {
1112
- if (this.vnext) {
1172
+ this.getClickLayerStyle = function () {
1173
+ if (_this.vnext) {
1113
1174
  return clickStyle;
1114
1175
  }
1115
1176
  else {
1116
- return `.${"clarity-click" /* Constant.ClickLayer */}, .${"clarity-click-ring" /* Constant.ClickRing */}, .${"clarity-touch" /* Constant.TouchLayer */}, .${"clarity-touch-ring" /* Constant.TouchRing */} { position: absolute; z-index: ${2147483647 /* Setting.ZIndex */}; border-radius: 50%; background: radial-gradient(rgba(0,90,158,0.8), transparent); width: ${22 /* Setting.ClickRadius */}px; height: ${22 /* Setting.ClickRadius */}px;}` +
1117
- `.${"clarity-click-ring" /* Constant.ClickRing */} { background: transparent; border: 1px solid rgba(0,90,158,0.8); }`;
1177
+ return ".".concat("clarity-click" /* Constant.ClickLayer */, ", .").concat("clarity-click-ring" /* Constant.ClickRing */, ", .").concat("clarity-touch" /* Constant.TouchLayer */, ", .").concat("clarity-touch-ring" /* Constant.TouchRing */, " { position: absolute; z-index: ").concat(2147483647 /* Setting.ZIndex */, "; border-radius: 50%; background: radial-gradient(rgba(0,90,158,0.8), transparent); width: ").concat(22 /* Setting.ClickRadius */, "px; height: ").concat(22 /* Setting.ClickRadius */, "px;}") +
1178
+ ".".concat("clarity-click-ring" /* Constant.ClickRing */, " { background: transparent; border: 1px solid rgba(0,90,158,0.8); }");
1118
1179
  }
1119
1180
  };
1120
1181
  this.state = state;
1121
1182
  this.layout = layout;
1122
1183
  this.vnext = vnext;
1123
1184
  }
1124
- }
1125
- InteractionHelper.TRAIL_START_COLOR = [242, 97, 12]; // rgb(242,97,12)
1126
- InteractionHelper.TRAIL_END_COLOR = [249, 220, 209]; // rgb(249,220,209)
1185
+ InteractionHelper.TRAIL_START_COLOR = [242, 97, 12]; // rgb(242,97,12)
1186
+ InteractionHelper.TRAIL_END_COLOR = [249, 220, 209]; // rgb(249,220,209)
1187
+ return InteractionHelper;
1188
+ }());
1127
1189
 
1128
1190
  var sharedStyle = `iframe[data-clarity-unavailable-small], iframe[data-clarity-unavailable], img[data-clarity-blob-hide=sb], img[data-clarity-blob-hide=lb], img[data-clarity-hide=sb], img[data-clarity-hide=lb] {
1129
1191
  background-color: #FBFBFE;
@@ -1216,7 +1278,7 @@ var imageMaskedSvgItalian = `background: url("data:image/svg+xml,%3Csvg width='1
1216
1278
 
1217
1279
  var imageMaskedSvgPortuguese = `background: url("data:image/svg+xml,%3Csvg width='100%25' viewBox='0 0 100 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100' height='80' fill='%23FBFBFE'/%3E%3Cpath d='M40.2197 10.2197C39.9534 10.4859 39.9292 10.9026 40.1471 11.1962L40.2197 11.2803L44.2542 15.3149C42.3322 16.6644 40.8958 18.6799 40.2989 21.0644C40.1983 21.4662 40.4425 21.8735 40.8443 21.9741C41.2461 22.0746 41.6534 21.8305 41.754 21.4286C42.2835 19.3135 43.5911 17.5395 45.3342 16.3945L47.1438 18.2043C46.4363 18.9258 46 19.9143 46 21.0046C46 23.2138 47.7909 25.0046 50 25.0046C51.0904 25.0046 52.0788 24.5683 52.8004 23.8608L58.7197 29.7803C59.0126 30.0732 59.4874 30.0732 59.7803 29.7803C60.0466 29.5141 60.0708 29.0974 59.8529 28.8038L59.7803 28.7197L53.6668 22.6055L53.668 22.604L52.4679 21.4061L49.598 18.5368L49.6 18.536L46.7188 15.6578L46.72 15.656L45.5867 14.5255L41.2803 10.2197C40.9874 9.92678 40.5126 9.92678 40.2197 10.2197ZM48.2041 19.2655L51.7392 22.8006C51.2892 23.2364 50.6759 23.5046 50 23.5046C48.6193 23.5046 47.5 22.3853 47.5 21.0046C47.5 20.3287 47.7682 19.7154 48.2041 19.2655ZM50 13.5C48.9997 13.5 48.0291 13.6481 47.1111 13.925L48.3481 15.1612C48.8839 15.0553 49.4364 15 50 15C53.9231 15 57.3099 17.6803 58.2471 21.4332C58.3475 21.835 58.7546 22.0794 59.1565 21.9791C59.5584 21.8787 59.8028 21.4716 59.7024 21.0697C58.5994 16.6527 54.6155 13.5 50 13.5ZM50.1947 17.0093L53.996 20.81C53.8942 18.7531 52.2472 17.1076 50.1947 17.0093Z' fill='%23020057'/%3E%3Cpath d='M23.3281 53.1406C22.1367 53.1406 21.1816 52.748 20.4629 51.9629C19.748 51.1777 19.3906 50.1562 19.3906 48.8984C19.3906 47.5469 19.7559 46.4688 20.4863 45.6641C21.2168 44.8594 22.2109 44.457 23.4688 44.457C24.6289 44.457 25.5625 44.8477 26.2695 45.6289C26.9805 46.4102 27.3359 47.4316 27.3359 48.6934C27.3359 50.0645 26.9727 51.1484 26.2461 51.9453C25.5195 52.7422 24.5469 53.1406 23.3281 53.1406ZM23.3984 45.3477C22.5156 45.3477 21.7988 45.666 21.248 46.3027C20.6973 46.9395 20.4219 47.7754 20.4219 48.8105C20.4219 49.8457 20.6895 50.6797 21.2246 51.3125C21.7637 51.9414 22.4648 52.2559 23.3281 52.2559C24.25 52.2559 24.9766 51.9551 25.5078 51.3535C26.0391 50.752 26.3047 49.9102 26.3047 48.8281C26.3047 47.7188 26.0469 46.8613 25.5312 46.2559C25.0156 45.6504 24.3047 45.3477 23.3984 45.3477ZM36.9746 50.2402H32.7383C32.7539 50.9082 32.9336 51.4238 33.2773 51.7871C33.6211 52.1504 34.0938 52.332 34.6953 52.332C35.3711 52.332 35.9922 52.1094 36.5586 51.6641V52.5664C36.0312 52.9492 35.334 53.1406 34.4668 53.1406C33.6191 53.1406 32.9531 52.8691 32.4688 52.3262C31.9844 51.7793 31.7422 51.0117 31.7422 50.0234C31.7422 49.0898 32.0059 48.3301 32.5332 47.7441C33.0645 47.1543 33.7227 46.8594 34.5078 46.8594C35.293 46.8594 35.9004 47.1133 36.3301 47.6211C36.7598 48.1289 36.9746 48.834 36.9746 49.7363V50.2402ZM35.9902 49.4258C35.9863 48.8711 35.8516 48.4395 35.5859 48.1309C35.3242 47.8223 34.959 47.668 34.4902 47.668C34.0371 47.668 33.6523 47.8301 33.3359 48.1543C33.0195 48.4785 32.8242 48.9023 32.75 49.4258H35.9902ZM39.3945 53H38.4336V44.1172H39.3945V53ZM46.1621 50.2402H41.9258C41.9414 50.9082 42.1211 51.4238 42.4648 51.7871C42.8086 52.1504 43.2812 52.332 43.8828 52.332C44.5586 52.332 45.1797 52.1094 45.7461 51.6641V52.5664C45.2188 52.9492 44.5215 53.1406 43.6543 53.1406C42.8066 53.1406 42.1406 52.8691 41.6562 52.3262C41.1719 51.7793 40.9297 51.0117 40.9297 50.0234C40.9297 49.0898 41.1934 48.3301 41.7207 47.7441C42.252 47.1543 42.9102 46.8594 43.6953 46.8594C44.4805 46.8594 45.0879 47.1133 45.5176 47.6211C45.9473 48.1289 46.1621 48.834 46.1621 49.7363V50.2402ZM45.1777 49.4258C45.1738 48.8711 45.0391 48.4395 44.7734 48.1309C44.5117 47.8223 44.1465 47.668 43.6777 47.668C43.2246 47.668 42.8398 47.8301 42.5234 48.1543C42.207 48.4785 42.0117 48.9023 41.9375 49.4258H45.1777ZM56.1406 53H55.1797V49.5547C55.1797 48.8906 55.0762 48.4102 54.8691 48.1133C54.666 47.8164 54.3223 47.668 53.8379 47.668C53.4277 47.668 53.0781 47.8555 52.7891 48.2305C52.5039 48.6055 52.3613 49.0547 52.3613 49.5781V53H51.4004V49.4375C51.4004 48.2578 50.9453 47.668 50.0352 47.668C49.6133 47.668 49.2656 47.8457 48.9922 48.2012C48.7188 48.5527 48.582 49.0117 48.582 49.5781V53H47.6211V47H48.582V47.9492H48.6055C49.0312 47.2227 49.6523 46.8594 50.4688 46.8594C50.8789 46.8594 51.2363 46.9746 51.541 47.2051C51.8457 47.4316 52.0547 47.7305 52.168 48.1016C52.6133 47.2734 53.2773 46.8594 54.1602 46.8594C55.4805 46.8594 56.1406 47.6738 56.1406 49.3027V53ZM62.7793 50.2402H58.543C58.5586 50.9082 58.7383 51.4238 59.082 51.7871C59.4258 52.1504 59.8984 52.332 60.5 52.332C61.1758 52.332 61.7969 52.1094 62.3633 51.6641V52.5664C61.8359 52.9492 61.1387 53.1406 60.2715 53.1406C59.4238 53.1406 58.7578 52.8691 58.2734 52.3262C57.7891 51.7793 57.5469 51.0117 57.5469 50.0234C57.5469 49.0898 57.8105 48.3301 58.3379 47.7441C58.8691 47.1543 59.5273 46.8594 60.3125 46.8594C61.0977 46.8594 61.7051 47.1133 62.1348 47.6211C62.5645 48.1289 62.7793 48.834 62.7793 49.7363V50.2402ZM61.7949 49.4258C61.791 48.8711 61.6562 48.4395 61.3906 48.1309C61.1289 47.8223 60.7637 47.668 60.2949 47.668C59.8418 47.668 59.457 47.8301 59.1406 48.1543C58.8242 48.4785 58.6289 48.9023 58.5547 49.4258H61.7949ZM69.2188 53H68.2578V49.5781C68.2578 48.3047 67.793 47.668 66.8633 47.668C66.3828 47.668 65.9844 47.8496 65.668 48.2129C65.3555 48.5723 65.1992 49.0273 65.1992 49.5781V53H64.2383V47H65.1992V47.9961H65.2227C65.6758 47.2383 66.332 46.8594 67.1914 46.8594C67.8477 46.8594 68.3496 47.0723 68.6973 47.498C69.0449 47.9199 69.2188 48.5312 69.2188 49.332V53ZM73.8184 52.9414C73.5918 53.0664 73.293 53.1289 72.9219 53.1289C71.8711 53.1289 71.3457 52.543 71.3457 51.3711V47.8203H70.3145V47H71.3457V45.5352L72.3066 45.2246V47H73.8184V47.8203H72.3066V51.2012C72.3066 51.6035 72.375 51.8906 72.5117 52.0625C72.6484 52.2344 72.875 52.3203 73.1914 52.3203C73.4336 52.3203 73.6426 52.2539 73.8184 52.1211V52.9414ZM77.6094 53.1406C76.7227 53.1406 76.0137 52.8613 75.4824 52.3027C74.9551 51.7402 74.6914 50.9961 74.6914 50.0703C74.6914 49.0625 74.9668 48.2754 75.5176 47.709C76.0684 47.1426 76.8125 46.8594 77.75 46.8594C78.6445 46.8594 79.3418 47.1348 79.8418 47.6855C80.3457 48.2363 80.5977 49 80.5977 49.9766C80.5977 50.9336 80.3262 51.7012 79.7832 52.2793C79.2441 52.8535 78.5195 53.1406 77.6094 53.1406ZM77.6797 47.668C77.0625 47.668 76.5742 47.8789 76.2148 48.3008C75.8555 48.7188 75.6758 49.2969 75.6758 50.0352C75.6758 50.7461 75.8574 51.3066 76.2207 51.7168C76.584 52.127 77.0703 52.332 77.6797 52.332C78.3008 52.332 78.7773 52.1309 79.1094 51.7285C79.4453 51.3262 79.6133 50.7539 79.6133 50.0117C79.6133 49.2617 79.4453 48.6836 79.1094 48.2773C78.7773 47.8711 78.3008 47.668 77.6797 47.668ZM14.5918 66.2402H10.3555C10.3711 66.9082 10.5508 67.4238 10.8945 67.7871C11.2383 68.1504 11.7109 68.332 12.3125 68.332C12.9883 68.332 13.6094 68.1094 14.1758 67.6641V68.5664C13.6484 68.9492 12.9512 69.1406 12.084 69.1406C11.2363 69.1406 10.5703 68.8691 10.0859 68.3262C9.60156 67.7793 9.35938 67.0117 9.35938 66.0234C9.35938 65.0898 9.62305 64.3301 10.1504 63.7441C10.6816 63.1543 11.3398 62.8594 12.125 62.8594C12.9102 62.8594 13.5176 63.1133 13.9473 63.6211C14.377 64.1289 14.5918 64.834 14.5918 65.7363V66.2402ZM13.6074 65.4258C13.6035 64.8711 13.4688 64.4395 13.2031 64.1309C12.9414 63.8223 12.5762 63.668 12.1074 63.668C11.6543 63.668 11.2695 63.8301 10.9531 64.1543C10.6367 64.4785 10.4414 64.9023 10.3672 65.4258H13.6074ZM15.6875 68.7832V67.752C16.2109 68.1387 16.7871 68.332 17.416 68.332C18.2598 68.332 18.6816 68.0508 18.6816 67.4883C18.6816 67.3281 18.6445 67.1934 18.5703 67.084C18.5 66.9707 18.4023 66.8711 18.2773 66.7852C18.1562 66.6992 18.0117 66.623 17.8438 66.5566C17.6797 66.4863 17.502 66.4141 17.3105 66.3398C17.0449 66.2344 16.8105 66.1289 16.6074 66.0234C16.4082 65.9141 16.2402 65.793 16.1035 65.6602C15.9707 65.5234 15.8691 65.3691 15.7988 65.1973C15.7324 65.0254 15.6992 64.8242 15.6992 64.5938C15.6992 64.3125 15.7637 64.0645 15.8926 63.8496C16.0215 63.6309 16.1934 63.4492 16.4082 63.3047C16.623 63.1562 16.8672 63.0449 17.1406 62.9707C17.418 62.8965 17.7031 62.8594 17.9961 62.8594C18.5156 62.8594 18.9805 62.9492 19.3906 63.1289V64.1016C18.9492 63.8125 18.4414 63.668 17.8672 63.668C17.6875 63.668 17.5254 63.6895 17.3809 63.7324C17.2363 63.7715 17.1113 63.8281 17.0059 63.9023C16.9043 63.9766 16.8242 64.0664 16.7656 64.1719C16.7109 64.2734 16.6836 64.3867 16.6836 64.5117C16.6836 64.668 16.7109 64.7988 16.7656 64.9043C16.8242 65.0098 16.9082 65.1035 17.0176 65.1855C17.127 65.2676 17.2598 65.3418 17.416 65.4082C17.5723 65.4746 17.75 65.5469 17.9492 65.625C18.2148 65.7266 18.4531 65.832 18.6641 65.9414C18.875 66.0469 19.0547 66.168 19.2031 66.3047C19.3516 66.4375 19.4648 66.5918 19.543 66.7676C19.625 66.9434 19.666 67.1523 19.666 67.3945C19.666 67.6914 19.5996 67.9492 19.4668 68.168C19.3379 68.3867 19.1641 68.5684 18.9453 68.7129C18.7266 68.8574 18.4746 68.9648 18.1895 69.0352C17.9043 69.1055 17.6055 69.1406 17.293 69.1406C16.6758 69.1406 16.1406 69.0215 15.6875 68.7832ZM23.9316 68.9414C23.7051 69.0664 23.4062 69.1289 23.0352 69.1289C21.9844 69.1289 21.459 68.543 21.459 67.3711V63.8203H20.4277V63H21.459V61.5352L22.4199 61.2246V63H23.9316V63.8203H22.4199V67.2012C22.4199 67.6035 22.4883 67.8906 22.625 68.0625C22.7617 68.2344 22.9883 68.3203 23.3047 68.3203C23.5469 68.3203 23.7559 68.2539 23.9316 68.1211V68.9414ZM29.5098 69H28.5488V68.0625H28.5254C28.1074 68.7812 27.4922 69.1406 26.6797 69.1406C26.082 69.1406 25.6133 68.9824 25.2734 68.666C24.9375 68.3496 24.7695 67.9297 24.7695 67.4062C24.7695 66.2852 25.4297 65.6328 26.75 65.4492L28.5488 65.1973C28.5488 64.1777 28.1367 63.668 27.3125 63.668C26.5898 63.668 25.9375 63.9141 25.3555 64.4062V63.4219C25.9453 63.0469 26.625 62.8594 27.3945 62.8594C28.8047 62.8594 29.5098 63.6055 29.5098 65.0977V69ZM28.5488 65.9648L27.1016 66.1641C26.6562 66.2266 26.3203 66.3379 26.0938 66.498C25.8672 66.6543 25.7539 66.9336 25.7539 67.3359C25.7539 67.6289 25.8574 67.8691 26.0645 68.0566C26.2754 68.2402 26.5547 68.332 26.9023 68.332C27.3789 68.332 27.7715 68.166 28.0801 67.834C28.3926 67.498 28.5488 67.0742 28.5488 66.5625V65.9648ZM28.6777 59.9414L27.1426 61.8633H26.3984L27.7051 59.9414H28.6777ZM43.1328 69H42.1719V65.5547C42.1719 64.8906 42.0684 64.4102 41.8613 64.1133C41.6582 63.8164 41.3145 63.668 40.8301 63.668C40.4199 63.668 40.0703 63.8555 39.7812 64.2305C39.4961 64.6055 39.3535 65.0547 39.3535 65.5781V69H38.3926V65.4375C38.3926 64.2578 37.9375 63.668 37.0273 63.668C36.6055 63.668 36.2578 63.8457 35.9844 64.2012C35.7109 64.5527 35.5742 65.0117 35.5742 65.5781V69H34.6133V63H35.5742V63.9492H35.5977C36.0234 63.2227 36.6445 62.8594 37.4609 62.8594C37.8711 62.8594 38.2285 62.9746 38.5332 63.2051C38.8379 63.4316 39.0469 63.7305 39.1602 64.1016C39.6055 63.2734 40.2695 62.8594 41.1523 62.8594C42.4727 62.8594 43.1328 63.6738 43.1328 65.3027V69ZM49.2441 69H48.2832V68.0625H48.2598C47.8418 68.7812 47.2266 69.1406 46.4141 69.1406C45.8164 69.1406 45.3477 68.9824 45.0078 68.666C44.6719 68.3496 44.5039 67.9297 44.5039 67.4062C44.5039 66.2852 45.1641 65.6328 46.4844 65.4492L48.2832 65.1973C48.2832 64.1777 47.8711 63.668 47.0469 63.668C46.3242 63.668 45.6719 63.9141 45.0898 64.4062V63.4219C45.6797 63.0469 46.3594 62.8594 47.1289 62.8594C48.5391 62.8594 49.2441 63.6055 49.2441 65.0977V69ZM48.2832 65.9648L46.8359 66.1641C46.3906 66.2266 46.0547 66.3379 45.8281 66.498C45.6016 66.6543 45.4883 66.9336 45.4883 67.3359C45.4883 67.6289 45.5918 67.8691 45.7988 68.0566C46.0098 68.2402 46.2891 68.332 46.6367 68.332C47.1133 68.332 47.5059 68.166 47.8145 67.834C48.127 67.498 48.2832 67.0742 48.2832 66.5625V65.9648ZM50.6914 68.7832V67.752C51.2148 68.1387 51.791 68.332 52.4199 68.332C53.2637 68.332 53.6855 68.0508 53.6855 67.4883C53.6855 67.3281 53.6484 67.1934 53.5742 67.084C53.5039 66.9707 53.4062 66.8711 53.2812 66.7852C53.1602 66.6992 53.0156 66.623 52.8477 66.5566C52.6836 66.4863 52.5059 66.4141 52.3145 66.3398C52.0488 66.2344 51.8145 66.1289 51.6113 66.0234C51.4121 65.9141 51.2441 65.793 51.1074 65.6602C50.9746 65.5234 50.873 65.3691 50.8027 65.1973C50.7363 65.0254 50.7031 64.8242 50.7031 64.5938C50.7031 64.3125 50.7676 64.0645 50.8965 63.8496C51.0254 63.6309 51.1973 63.4492 51.4121 63.3047C51.627 63.1562 51.8711 63.0449 52.1445 62.9707C52.4219 62.8965 52.707 62.8594 53 62.8594C53.5195 62.8594 53.9844 62.9492 54.3945 63.1289V64.1016C53.9531 63.8125 53.4453 63.668 52.8711 63.668C52.6914 63.668 52.5293 63.6895 52.3848 63.7324C52.2402 63.7715 52.1152 63.8281 52.0098 63.9023C51.9082 63.9766 51.8281 64.0664 51.7695 64.1719C51.7148 64.2734 51.6875 64.3867 51.6875 64.5117C51.6875 64.668 51.7148 64.7988 51.7695 64.9043C51.8281 65.0098 51.9121 65.1035 52.0215 65.1855C52.1309 65.2676 52.2637 65.3418 52.4199 65.4082C52.5762 65.4746 52.7539 65.5469 52.9531 65.625C53.2188 65.7266 53.457 65.832 53.668 65.9414C53.8789 66.0469 54.0586 66.168 54.207 66.3047C54.3555 66.4375 54.4688 66.5918 54.5469 66.7676C54.6289 66.9434 54.6699 67.1523 54.6699 67.3945C54.6699 67.6914 54.6035 67.9492 54.4707 68.168C54.3418 68.3867 54.168 68.5684 53.9492 68.7129C53.7305 68.8574 53.4785 68.9648 53.1934 69.0352C52.9082 69.1055 52.6094 69.1406 52.2969 69.1406C51.6797 69.1406 51.1445 69.0215 50.6914 68.7832ZM60.2422 68.7246C59.7812 69.002 59.2344 69.1406 58.6016 69.1406C57.7461 69.1406 57.0547 68.8633 56.5273 68.3086C56.0039 67.75 55.7422 67.0273 55.7422 66.1406C55.7422 65.1523 56.0254 64.3594 56.5918 63.7617C57.1582 63.1602 57.9141 62.8594 58.8594 62.8594C59.3867 62.8594 59.8516 62.957 60.2539 63.1523V64.1367C59.8086 63.8242 59.332 63.668 58.8242 63.668C58.2109 63.668 57.707 63.8887 57.3125 64.3301C56.9219 64.7676 56.7266 65.3438 56.7266 66.0586C56.7266 66.7617 56.9102 67.3164 57.2773 67.7227C57.6484 68.1289 58.1445 68.332 58.7656 68.332C59.2891 68.332 59.7812 68.1582 60.2422 67.8105V68.7246ZM65.9902 69H65.0293V68.0625H65.0059C64.5879 68.7812 63.9727 69.1406 63.1602 69.1406C62.5625 69.1406 62.0938 68.9824 61.7539 68.666C61.418 68.3496 61.25 67.9297 61.25 67.4062C61.25 66.2852 61.9102 65.6328 63.2305 65.4492L65.0293 65.1973C65.0293 64.1777 64.6172 63.668 63.793 63.668C63.0703 63.668 62.418 63.9141 61.8359 64.4062V63.4219C62.4258 63.0469 63.1055 62.8594 63.875 62.8594C65.2852 62.8594 65.9902 63.6055 65.9902 65.0977V69ZM65.0293 65.9648L63.582 66.1641C63.1367 66.2266 62.8008 66.3379 62.5742 66.498C62.3477 66.6543 62.2344 66.9336 62.2344 67.3359C62.2344 67.6289 62.3379 67.8691 62.5449 68.0566C62.7559 68.2402 63.0352 68.332 63.3828 68.332C63.8594 68.332 64.252 68.166 64.5605 67.834C64.873 67.498 65.0293 67.0742 65.0293 66.5625V65.9648ZM70.9297 63.9727C70.7617 63.8438 70.5195 63.7793 70.2031 63.7793C69.793 63.7793 69.4492 63.9727 69.1719 64.3594C68.8984 64.7461 68.7617 65.2734 68.7617 65.9414V69H67.8008V63H68.7617V64.2363H68.7852C68.9219 63.8145 69.1309 63.4863 69.4121 63.252C69.6934 63.0137 70.0078 62.8945 70.3555 62.8945C70.6055 62.8945 70.7969 62.9219 70.9297 62.9766V63.9727ZM76.2676 69H75.3066V68.0625H75.2832C74.8652 68.7812 74.25 69.1406 73.4375 69.1406C72.8398 69.1406 72.3711 68.9824 72.0312 68.666C71.6953 68.3496 71.5273 67.9297 71.5273 67.4062C71.5273 66.2852 72.1875 65.6328 73.5078 65.4492L75.3066 65.1973C75.3066 64.1777 74.8945 63.668 74.0703 63.668C73.3477 63.668 72.6953 63.9141 72.1133 64.4062V63.4219C72.7031 63.0469 73.3828 62.8594 74.1523 62.8594C75.5625 62.8594 76.2676 63.6055 76.2676 65.0977V69ZM75.3066 65.9648L73.8594 66.1641C73.4141 66.2266 73.0781 66.3379 72.8516 66.498C72.625 66.6543 72.5117 66.9336 72.5117 67.3359C72.5117 67.6289 72.6152 67.8691 72.8223 68.0566C73.0332 68.2402 73.3125 68.332 73.6602 68.332C74.1367 68.332 74.5293 68.166 74.8379 67.834C75.1504 67.498 75.3066 67.0742 75.3066 66.5625V65.9648ZM83.1992 69H82.2383V67.9805H82.2148C81.7695 68.7539 81.082 69.1406 80.1523 69.1406C79.3984 69.1406 78.7949 68.873 78.3418 68.3379C77.8926 67.7988 77.668 67.0664 77.668 66.1406C77.668 65.1484 77.918 64.3535 78.418 63.7559C78.918 63.1582 79.584 62.8594 80.416 62.8594C81.2402 62.8594 81.8398 63.1836 82.2148 63.832H82.2383V60.1172H83.1992V69ZM82.2383 66.2871V65.4023C82.2383 64.918 82.0781 64.5078 81.7578 64.1719C81.4375 63.8359 81.0312 63.668 80.5391 63.668C79.9531 63.668 79.4922 63.8828 79.1562 64.3125C78.8203 64.7422 78.6523 65.3359 78.6523 66.0938C78.6523 66.7852 78.8125 67.332 79.1328 67.7344C79.457 68.1328 79.8906 68.332 80.4336 68.332C80.9688 68.332 81.4023 68.1387 81.7344 67.752C82.0703 67.3652 82.2383 66.877 82.2383 66.2871ZM87.6523 69.1406C86.7656 69.1406 86.0566 68.8613 85.5254 68.3027C84.998 67.7402 84.7344 66.9961 84.7344 66.0703C84.7344 65.0625 85.0098 64.2754 85.5605 63.709C86.1113 63.1426 86.8555 62.8594 87.793 62.8594C88.6875 62.8594 89.3848 63.1348 89.8848 63.6855C90.3887 64.2363 90.6406 65 90.6406 65.9766C90.6406 66.9336 90.3691 67.7012 89.8262 68.2793C89.2871 68.8535 88.5625 69.1406 87.6523 69.1406ZM87.7227 63.668C87.1055 63.668 86.6172 63.8789 86.2578 64.3008C85.8984 64.7188 85.7188 65.2969 85.7188 66.0352C85.7188 66.7461 85.9004 67.3066 86.2637 67.7168C86.627 68.127 87.1133 68.332 87.7227 68.332C88.3438 68.332 88.8203 68.1309 89.1523 67.7285C89.4883 67.3262 89.6562 66.7539 89.6562 66.0117C89.6562 65.2617 89.4883 64.6836 89.1523 64.2773C88.8203 63.8711 88.3438 63.668 87.7227 63.668Z' fill='%23020057'/%3E%3C/svg%3E%0A") no-repeat center center;`;
1218
1280
 
1219
- const blobUnavailableSvg = {
1281
+ var blobUnavailableSvg = {
1220
1282
  "de-de": blobUnavailableSvgGerman,
1221
1283
  "en-gb": blobUnavailableSvgEnglish,
1222
1284
  "en-us": blobUnavailableSvgEnglish,
@@ -1232,7 +1294,7 @@ const blobUnavailableSvg = {
1232
1294
  "zh-hans": blobUnavailableSvgChineseSimplified,
1233
1295
  "zh-hant": blobUnavailableSvgChineseTraditional,
1234
1296
  };
1235
- const iframeUnavailableSvg = {
1297
+ var iframeUnavailableSvg = {
1236
1298
  "de-de": iframeUnavailableSvgGerman,
1237
1299
  "en-gb": iframeUnavailableSvgEnglish,
1238
1300
  "en-us": iframeUnavailableSvgEnglish,
@@ -1248,7 +1310,7 @@ const iframeUnavailableSvg = {
1248
1310
  "zh-hans": iframeUnavailableSvgChineseSimplified,
1249
1311
  "zh-hant": iframeUnavailableSvgChineseTraditional,
1250
1312
  };
1251
- const imageMaskedSvg = {
1313
+ var imageMaskedSvg = {
1252
1314
  "de-de": imageMaskedSvgGerman,
1253
1315
  "en-gb": imageMaskedSvgEnglish,
1254
1316
  "en-us": imageMaskedSvgEnglish,
@@ -1265,8 +1327,12 @@ const imageMaskedSvg = {
1265
1327
  "zh-hant": imageMaskedSvgChineseTraditional,
1266
1328
  };
1267
1329
  /* END imageMaskedSvgs */
1268
- class LayoutHelper {
1269
- constructor(state, isMobile = false, vNext = false, locale = 'en-us') {
1330
+ var LayoutHelper = /** @class */ (function () {
1331
+ function LayoutHelper(state, isMobile, vNext, locale) {
1332
+ if (isMobile === void 0) { isMobile = false; }
1333
+ if (vNext === void 0) { vNext = false; }
1334
+ if (locale === void 0) { locale = 'en-us'; }
1335
+ var _this = this;
1270
1336
  this.primaryHtmlNodeId = null;
1271
1337
  this.stylesheets = [];
1272
1338
  this.fonts = [];
@@ -1279,42 +1345,42 @@ class LayoutHelper {
1279
1345
  this.state = null;
1280
1346
  this.stylesToApply = {};
1281
1347
  this.BackgroundImageEligibleElements = ['DIV', 'SECTION', 'ARTICLE', 'HEADER', 'FOOTER', 'ASIDE', 'NAV', 'SPAN', 'P', 'MAIN'];
1282
- this.MaskedBackgroundImageStyle = `#CCC no-repeat center url("${"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANvSURBVHgB7Ve9VhpREJ5dU6BNVqt0wS6dpEuX9QmiTyA+gfgE4BOgZSrJE4hlKvEJxDKVa2caoaSSfB87F4Z7dtmFhFTMOfcMe52Z+935u6PIhjb0dxTIihRFUQ2M6z0/dXuI9ay8PwTJklQaEADw0JMgCI4USFSkMx6Pe2BdrFtgS6QEFQICjirYGYDUc0AMcXCCvw8XAVVwHQD7IasAokfCMGzB0NmCA1o44N7T+wpwlwouT+80z2NbOWAaMHqDn7FuJcorapRATkej0bOvyz2s7zs7O2L0GbYXrCrscjUqlUoAuZ6vH3hAIr3diW4xHC3wW+w/KZhLgDmXEgRzbR6udvbBD/DdITB3UewfWm+FRpnIHwyYLo1A+Aq/vzkDWFdSni4krTjm1RnDOxgM9nFOS//OM++0YmeAFMydQw4gDSgeu7LVyprE3489je3u7t5waQFMifrQ6ehn7PZfX18v6BkFOwcq9MDQQKxeseRu0PXARJprBHxED2t7sPSol6p5YHs467OkXo8cqBA/rmXmmVO/atzZzk4G0Kond+DJJJLmStc3Sm+rpxLVbYcEoRu8xbWNp9U1B1rqyzzIRNQj5tAe84ZVKVmGZ6BoK5Vh2JADT1hjLny3rBL27nS/7RtUXZdDmb1H5Ug1rDgjrFMKrGGb2CzPt7e3C95gb2+vqeU/1Mor/UZpg21og50CsfYzATllsLY+E6TE60OTPoUqOV8EQNKKmuTTgifHAmO4GOokyDFah2BTTAOTNFcmIQFI3qyVoxurp+dIL3ZF72bYdzL1zKcDLb2P1n4rqUfcg/nB3Cre3t6uQeY3ZBOri72q87B7ULHY035CdmTs85H9BVlR23yWumVf+6YJo0/MK7qcI8al9RCqq9R4w4ICq9JDYZEwk44ly2TWFtGT+VKnF2PwB6cis8sUzkw+vSsrqNXQ0eUmxo+S5gEPfvQBSTpNLjU1rjzCLiKEYAAWMQRFA5m2GzdJxIUhW5H6yutFguhRToapcb8WQGwL5MwtDnt5cvQOZJuq0yHfkjUQWwHbAn5+AqgvKHGW/IsPRquR+ZdgcQIdrStkYh5tN1ocZYCpSto2Dqezl6yRMga/yQSpXToyYFzOrReQAcUhzp8E+E4eWzD/lTgxuPFGR5Wlm+Y/J3qL/7fJhja0RvoDR4Tn4Lo/zi8AAAAASUVORK5CYII=" /* Asset.Hide */}")`;
1283
- this.reset = () => {
1284
- this.nodes = {};
1285
- this.stylesheets = [];
1286
- this.fonts = [];
1287
- this.events = {};
1288
- this.hashMapAlpha = {};
1289
- this.hashMapBeta = {};
1290
- this.primaryHtmlNodeId = null;
1291
- };
1292
- this.get = (hash) => {
1293
- if (hash in this.hashMapBeta && this.hashMapBeta[hash].isConnected) {
1294
- return this.hashMapBeta[hash];
1295
- }
1296
- else if (hash in this.hashMapAlpha && this.hashMapAlpha[hash].isConnected) {
1297
- return this.hashMapAlpha[hash];
1348
+ this.MaskedBackgroundImageStyle = "#CCC no-repeat center url(\"".concat("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANvSURBVHgB7Ve9VhpREJ5dU6BNVqt0wS6dpEuX9QmiTyA+gfgE4BOgZSrJE4hlKvEJxDKVa2caoaSSfB87F4Z7dtmFhFTMOfcMe52Z+935u6PIhjb0dxTIihRFUQ2M6z0/dXuI9ay8PwTJklQaEADw0JMgCI4USFSkMx6Pe2BdrFtgS6QEFQICjirYGYDUc0AMcXCCvw8XAVVwHQD7IasAokfCMGzB0NmCA1o44N7T+wpwlwouT+80z2NbOWAaMHqDn7FuJcorapRATkej0bOvyz2s7zs7O2L0GbYXrCrscjUqlUoAuZ6vH3hAIr3diW4xHC3wW+w/KZhLgDmXEgRzbR6udvbBD/DdITB3UewfWm+FRpnIHwyYLo1A+Aq/vzkDWFdSni4krTjm1RnDOxgM9nFOS//OM++0YmeAFMydQw4gDSgeu7LVyprE3489je3u7t5waQFMifrQ6ehn7PZfX18v6BkFOwcq9MDQQKxeseRu0PXARJprBHxED2t7sPSol6p5YHs467OkXo8cqBA/rmXmmVO/atzZzk4G0Kond+DJJJLmStc3Sm+rpxLVbYcEoRu8xbWNp9U1B1rqyzzIRNQj5tAe84ZVKVmGZ6BoK5Vh2JADT1hjLny3rBL27nS/7RtUXZdDmb1H5Ug1rDgjrFMKrGGb2CzPt7e3C95gb2+vqeU/1Mor/UZpg21og50CsfYzATllsLY+E6TE60OTPoUqOV8EQNKKmuTTgifHAmO4GOokyDFah2BTTAOTNFcmIQFI3qyVoxurp+dIL3ZF72bYdzL1zKcDLb2P1n4rqUfcg/nB3Cre3t6uQeY3ZBOri72q87B7ULHY035CdmTs85H9BVlR23yWumVf+6YJo0/MK7qcI8al9RCqq9R4w4ICq9JDYZEwk44ly2TWFtGT+VKnF2PwB6cis8sUzkw+vSsrqNXQ0eUmxo+S5gEPfvQBSTpNLjU1rjzCLiKEYAAWMQRFA5m2GzdJxIUhW5H6yutFguhRToapcb8WQGwL5MwtDnt5cvQOZJuq0yHfkjUQWwHbAn5+AqgvKHGW/IsPRquR+ZdgcQIdrStkYh5tN1ocZYCpSto2Dqezl6yRMga/yQSpXToyYFzOrReQAcUhzp8E+E4eWzD/lTgxuPFGR5Wlm+Y/J3qL/7fJhja0RvoDR4Tn4Lo/zi8AAAAASUVORK5CYII=" /* Asset.Hide */, "\")");
1349
+ this.reset = function () {
1350
+ _this.nodes = {};
1351
+ _this.stylesheets = [];
1352
+ _this.fonts = [];
1353
+ _this.events = {};
1354
+ _this.hashMapAlpha = {};
1355
+ _this.hashMapBeta = {};
1356
+ _this.primaryHtmlNodeId = null;
1357
+ };
1358
+ this.get = function (hash) {
1359
+ if (hash in _this.hashMapBeta && _this.hashMapBeta[hash].isConnected) {
1360
+ return _this.hashMapBeta[hash];
1361
+ }
1362
+ else if (hash in _this.hashMapAlpha && _this.hashMapAlpha[hash].isConnected) {
1363
+ return _this.hashMapAlpha[hash];
1298
1364
  }
1299
1365
  return null;
1300
1366
  };
1301
- this.addToHashMap = (data, parent) => {
1367
+ this.addToHashMap = function (data, parent) {
1302
1368
  // In case of selector collision, prefer the first inserted node
1303
- this.hashMapAlpha[data.hashAlpha] = this.get(data.hashAlpha) || parent;
1304
- this.hashMapBeta[data.hashBeta] = this.get(data.hashBeta) || parent;
1369
+ _this.hashMapAlpha[data.hashAlpha] = _this.get(data.hashAlpha) || parent;
1370
+ _this.hashMapBeta[data.hashBeta] = _this.get(data.hashBeta) || parent;
1305
1371
  };
1306
- this.resize = (el, width, height) => {
1372
+ this.resize = function (el, width, height) {
1307
1373
  if (el && el.nodeType === 1 /* NodeType.ELEMENT_NODE */ && width && height) {
1308
1374
  el.style.width = width + "px" /* Layout.Constant.Pixel */;
1309
1375
  el.style.height = height + "px" /* Layout.Constant.Pixel */;
1310
1376
  el.style.boxSizing = "border-box" /* Layout.Constant.BorderBox */; // Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing
1311
1377
  }
1312
1378
  };
1313
- this.element = (nodeId) => {
1314
- return nodeId !== null && nodeId > 0 && nodeId in this.nodes ? this.nodes[nodeId] : null;
1379
+ this.element = function (nodeId) {
1380
+ return nodeId !== null && nodeId > 0 && nodeId in _this.nodes ? _this.nodes[nodeId] : null;
1315
1381
  };
1316
- this.animateChange = (event) => {
1317
- let animation = this.animations[event.data.id];
1382
+ this.animateChange = function (event) {
1383
+ var animation = _this.animations[event.data.id];
1318
1384
  if (!animation && event.data.operation !== 0 /* AnimationOperation.Create */) {
1319
1385
  // We didn't have a reference to this animation. This shouldn't happen, but returning here
1320
1386
  // to ensure we don't throw any errors.
@@ -1322,10 +1388,10 @@ class LayoutHelper {
1322
1388
  }
1323
1389
  switch (event.data.operation) {
1324
1390
  case 0 /* AnimationOperation.Create */:
1325
- let target = this.element(event.data.targetId);
1391
+ var target = _this.element(event.data.targetId);
1326
1392
  // only create the animation if we successfully found the target, an animation without a target will throw an error
1327
1393
  if (target) {
1328
- this.animations[event.data.id] = target.animate(JSON.parse(event.data.keyFrames), JSON.parse(event.data.timing));
1394
+ _this.animations[event.data.id] = target.animate(JSON.parse(event.data.keyFrames), JSON.parse(event.data.timing));
1329
1395
  }
1330
1396
  break;
1331
1397
  case 3 /* AnimationOperation.Cancel */:
@@ -1345,32 +1411,39 @@ class LayoutHelper {
1345
1411
  break;
1346
1412
  }
1347
1413
  };
1348
- this.dom = (event, useproxy) => __awaiter(this, void 0, void 0, function* () {
1349
- if (event) {
1350
- // When setting up rendering for the first time, start off with hidden target window
1351
- // This ensures we do not show flickers to the end user
1352
- let doc = this.state.window.document;
1353
- if (doc && doc.documentElement) {
1354
- doc.documentElement.style.visibility = "hidden" /* Constant.Hidden */;
1355
- // Render all DOM events to reconstruct the page
1356
- this.markup(event, useproxy);
1357
- // Wait on all stylesheets and fonts to finish loading
1358
- yield Promise.all(this.stylesheets.concat(this.fonts));
1359
- // Toggle back the visibility of target window
1360
- doc.documentElement.style.visibility = "visible" /* Constant.Visible */;
1414
+ this.dom = function (event, useproxy) { return __awaiter(_this, void 0, void 0, function () {
1415
+ var doc;
1416
+ return __generator(this, function (_a) {
1417
+ switch (_a.label) {
1418
+ case 0:
1419
+ if (!event) return [3 /*break*/, 2];
1420
+ doc = this.state.window.document;
1421
+ if (!(doc && doc.documentElement)) return [3 /*break*/, 2];
1422
+ doc.documentElement.style.visibility = "hidden" /* Constant.Hidden */;
1423
+ // Render all DOM events to reconstruct the page
1424
+ this.markup(event, useproxy);
1425
+ // Wait on all stylesheets and fonts to finish loading
1426
+ return [4 /*yield*/, Promise.all(this.stylesheets.concat(this.fonts))];
1427
+ case 1:
1428
+ // Wait on all stylesheets and fonts to finish loading
1429
+ _a.sent();
1430
+ // Toggle back the visibility of target window
1431
+ doc.documentElement.style.visibility = "visible" /* Constant.Visible */;
1432
+ _a.label = 2;
1433
+ case 2: return [2 /*return*/];
1361
1434
  }
1362
- }
1363
- });
1364
- this.styleChange = (event) => {
1435
+ });
1436
+ }); };
1437
+ this.styleChange = function (event) {
1365
1438
  switch (event.event) {
1366
1439
  case 46 /* Data.Event.StyleSheetUpdate */:
1367
- let styleSheet = this.adoptedStyleSheets[event.data.id];
1440
+ var styleSheet = _this.adoptedStyleSheets[event.data.id];
1368
1441
  if (!styleSheet && event.data.operation !== 0 /* StyleSheetOperation.Create */) {
1369
1442
  return;
1370
1443
  }
1371
1444
  switch (event.data.operation) {
1372
1445
  case 0 /* StyleSheetOperation.Create */:
1373
- this.adoptedStyleSheets[event.data.id] = new this.state.window.CSSStyleSheet();
1446
+ _this.adoptedStyleSheets[event.data.id] = new _this.state.window.CSSStyleSheet();
1374
1447
  break;
1375
1448
  case 1 /* StyleSheetOperation.Replace */:
1376
1449
  styleSheet.replace(event.data.cssRules);
@@ -1381,56 +1454,61 @@ class LayoutHelper {
1381
1454
  }
1382
1455
  break;
1383
1456
  case 45 /* Data.Event.StyleSheetAdoption */:
1384
- this.setDocumentStyles(event.data.id, event.data.newIds);
1457
+ _this.setDocumentStyles(event.data.id, event.data.newIds);
1385
1458
  break;
1386
1459
  }
1387
1460
  };
1388
- this.customElement = (event) => {
1389
- if (!this.state.window.customElements.get(event.data.name)) {
1390
- this.state.window.customElements.define(event.data.name, class extends this.state.window.HTMLElement {
1391
- });
1461
+ this.customElement = function (event) {
1462
+ if (!_this.state.window.customElements.get(event.data.name)) {
1463
+ _this.state.window.customElements.define(event.data.name, /** @class */ (function (_super) {
1464
+ __extends(class_1, _super);
1465
+ function class_1() {
1466
+ return _super !== null && _super.apply(this, arguments) || this;
1467
+ }
1468
+ return class_1;
1469
+ }(_this.state.window.HTMLElement)));
1392
1470
  }
1393
1471
  };
1394
- this.exists = (hash) => {
1472
+ this.exists = function (hash) {
1395
1473
  if (hash) {
1396
- let match = this.get(hash);
1474
+ var match = _this.get(hash);
1397
1475
  if (match) {
1398
- let rectangle = match.getBoundingClientRect();
1476
+ var rectangle = match.getBoundingClientRect();
1399
1477
  return rectangle && rectangle.width > 0 && rectangle.height > 0;
1400
1478
  }
1401
1479
  }
1402
1480
  return false;
1403
1481
  };
1404
- this.markup = (event, useproxy) => {
1482
+ this.markup = function (event, useproxy) {
1405
1483
  var _a, _b, _c, _d, _e;
1406
- let data = event.data;
1407
- let type = event.event;
1408
- let doc = this.state.window.document;
1409
- let retryEvent = {
1484
+ var data = event.data;
1485
+ var type = event.event;
1486
+ var doc = _this.state.window.document;
1487
+ var retryEvent = {
1410
1488
  data: [],
1411
1489
  time: event.time,
1412
1490
  event: event.event
1413
1491
  };
1414
- for (let node of data) {
1415
- let parent = this.element(node.parent);
1416
- let pivot = this.element(node.previous);
1417
- let insert = this.insertAfter;
1418
- let tag = node.tag;
1492
+ var _loop_1 = function (node) {
1493
+ var parent_1 = _this.element(node.parent);
1494
+ var pivot = _this.element(node.previous);
1495
+ var insert = _this.insertAfter;
1496
+ var tag = node.tag;
1419
1497
  if (tag && tag.indexOf("iframe:" /* Layout.Constant.IFramePrefix */) === 0) {
1420
1498
  tag = node.tag.substr("iframe:" /* Layout.Constant.IFramePrefix */.length);
1421
1499
  }
1422
- if (parent === null && node.parent !== null && node.parent > -1 && tag !== "HTML") {
1500
+ if (parent_1 === null && node.parent !== null && node.parent > -1 && tag !== "HTML") {
1423
1501
  // We are referencing a parent for this node that hasn't been created yet. Push it to a list of nodes to
1424
1502
  // try once we are finished with other nodes within this event. Though we don't require HTML tags to
1425
1503
  // have a parent as they are typically the root.
1426
1504
  retryEvent.data.push(node);
1427
- continue;
1505
+ return "continue";
1428
1506
  }
1429
1507
  switch (tag) {
1430
1508
  case "*D" /* Layout.Constant.DocumentTag */:
1431
- let tagDoc = tag !== node.tag ? (parent ? parent.contentDocument : null) : doc;
1509
+ var tagDoc = tag !== node.tag ? (parent_1 ? parent_1.contentDocument : null) : doc;
1432
1510
  if (tagDoc && tagDoc === doc && type === 5 /* Data.Event.Discover */) {
1433
- this.reset();
1511
+ _this.reset();
1434
1512
  }
1435
1513
  if (typeof XMLSerializer !== "undefined" && tagDoc) {
1436
1514
  tagDoc.open();
@@ -1441,49 +1519,49 @@ class LayoutHelper {
1441
1519
  case "*P" /* Layout.Constant.PolyfillShadowDomTag */:
1442
1520
  // In case of polyfill, map shadow dom to it's parent for rendering purposes
1443
1521
  // All its children should be inserted as regular children to the parent node.
1444
- this.nodes[node.id] = parent;
1445
- this.addToHashMap(node, parent);
1522
+ _this.nodes[node.id] = parent_1;
1523
+ _this.addToHashMap(node, parent_1);
1446
1524
  break;
1447
1525
  case "*S" /* Layout.Constant.ShadowDomTag */:
1448
- if (parent) {
1449
- let shadowRoot = this.element(node.id);
1450
- shadowRoot = shadowRoot ? shadowRoot : parent.attachShadow({ mode: "open" });
1451
- this.nodes[node.id] = shadowRoot;
1452
- this.addToHashMap(node, shadowRoot);
1453
- this.addStyles(node.id);
1526
+ if (parent_1) {
1527
+ var shadowRoot = _this.element(node.id);
1528
+ shadowRoot = shadowRoot ? shadowRoot : parent_1.attachShadow({ mode: "open" });
1529
+ _this.nodes[node.id] = shadowRoot;
1530
+ _this.addToHashMap(node, shadowRoot);
1531
+ _this.addStyles(node.id);
1454
1532
  }
1455
1533
  break;
1456
1534
  case "*T" /* Layout.Constant.TextTag */:
1457
- let textElement = this.element(node.id);
1535
+ var textElement = _this.element(node.id);
1458
1536
  textElement = textElement ? textElement : doc.createTextNode(null);
1459
1537
  textElement.nodeValue = node.value;
1460
- insert(node, parent, textElement, pivot);
1538
+ insert(node, parent_1, textElement, pivot);
1461
1539
  break;
1462
1540
  case "*M" /* Layout.Constant.SuspendMutationTag */:
1463
- let suspendedElement = this.element(node.id);
1541
+ var suspendedElement = _this.element(node.id);
1464
1542
  if (suspendedElement && suspendedElement.nodeType === Node.ELEMENT_NODE) {
1465
1543
  suspendedElement.setAttribute("data-clarity-suspend" /* Constant.Suspend */, "" /* Layout.Constant.Empty */);
1466
1544
  }
1467
1545
  break;
1468
1546
  case "HTML":
1469
- if (this.primaryHtmlNodeId === null) {
1470
- this.primaryHtmlNodeId = node.id;
1547
+ if (_this.primaryHtmlNodeId === null) {
1548
+ _this.primaryHtmlNodeId = node.id;
1471
1549
  }
1472
- let isIframe = tag !== node.tag;
1550
+ var isIframe = tag !== node.tag;
1473
1551
  // when we see multiple HTML nodes in the same document we should treat subsequent ones as child elements
1474
1552
  // rather than redefining our visualization base on them. It's technically illegal HTML but enough sites have
1475
1553
  // this structure that we are robust against it.
1476
- if (this.primaryHtmlNodeId !== node.id && !isIframe) {
1477
- this.insertDefaultElement(node, parent, pivot, doc, insert);
1554
+ if (_this.primaryHtmlNodeId !== node.id && !isIframe) {
1555
+ _this.insertDefaultElement(node, parent_1, pivot, doc, insert);
1478
1556
  break;
1479
1557
  }
1480
- let htmlDoc = isIframe ? (parent ? parent.contentDocument : null) : doc;
1558
+ var htmlDoc = isIframe ? (parent_1 ? parent_1.contentDocument : null) : doc;
1481
1559
  if (htmlDoc !== null) {
1482
- let docElement = this.element(node.id);
1560
+ var docElement = _this.element(node.id);
1483
1561
  if (docElement === null) {
1484
- let newDoc = htmlDoc.implementation.createHTMLDocument("" /* Layout.Constant.Empty */);
1562
+ var newDoc = htmlDoc.implementation.createHTMLDocument("" /* Layout.Constant.Empty */);
1485
1563
  docElement = newDoc.documentElement;
1486
- let p = htmlDoc.importNode(docElement, true);
1564
+ var p = htmlDoc.importNode(docElement, true);
1487
1565
  htmlDoc.replaceChild(p, htmlDoc.documentElement);
1488
1566
  if (htmlDoc.head) {
1489
1567
  htmlDoc.head.parentNode.removeChild(htmlDoc.head);
@@ -1492,151 +1570,156 @@ class LayoutHelper {
1492
1570
  htmlDoc.body.parentNode.removeChild(htmlDoc.body);
1493
1571
  }
1494
1572
  }
1495
- this.setAttributes(htmlDoc.documentElement, node);
1573
+ _this.setAttributes(htmlDoc.documentElement, node);
1496
1574
  // If we are still processing discover events, keep the markup hidden until we are done
1497
- if (type === 5 /* Data.Event.Discover */ && !parent) {
1575
+ if (type === 5 /* Data.Event.Discover */ && !parent_1) {
1498
1576
  htmlDoc.documentElement.style.visibility = "hidden" /* Constant.Hidden */;
1499
1577
  }
1500
- this.nodes[node.id] = htmlDoc.documentElement;
1501
- this.addToHashMap(node, htmlDoc.documentElement);
1578
+ _this.nodes[node.id] = htmlDoc.documentElement;
1579
+ _this.addToHashMap(node, htmlDoc.documentElement);
1502
1580
  }
1503
1581
  break;
1504
1582
  case "HEAD":
1505
- let headElement = this.element(node.id);
1583
+ var headElement = _this.element(node.id);
1506
1584
  if (headElement === null) {
1507
1585
  headElement = doc.createElement(node.tag);
1508
1586
  if (node.attributes && "*B" /* Layout.Constant.Base */ in node.attributes) {
1509
- let base = doc.createElement("base");
1587
+ var base = doc.createElement("base");
1510
1588
  base.href = node.attributes["*B" /* Layout.Constant.Base */];
1511
1589
  headElement.appendChild(base);
1512
1590
  }
1513
1591
  // Add custom styles to assist with visualization
1514
- let custom = doc.createElement("style");
1592
+ var custom = doc.createElement("style");
1515
1593
  custom.setAttribute("clarity-custom-styles" /* Constant.CustomStyleTag */, "true");
1516
- custom.innerText = this.getCustomStyle();
1594
+ custom.innerText = _this.getCustomStyle();
1517
1595
  headElement.appendChild(custom);
1518
1596
  }
1519
- this.setAttributes(headElement, node);
1520
- insert(node, parent, headElement, pivot);
1597
+ _this.setAttributes(headElement, node);
1598
+ insert(node, parent_1, headElement, pivot);
1521
1599
  break;
1522
1600
  case "LINK":
1523
- let linkElement = this.element(node.id);
1524
- linkElement = linkElement ? linkElement : this.createElement(doc, node.tag);
1601
+ var linkElement_1 = _this.element(node.id);
1602
+ linkElement_1 = linkElement_1 ? linkElement_1 : _this.createElement(doc, node.tag);
1525
1603
  if (!node.attributes) {
1526
1604
  node.attributes = {};
1527
1605
  }
1528
- this.setAttributes(linkElement, node);
1606
+ _this.setAttributes(linkElement_1, node);
1529
1607
  if ("rel" in node.attributes) {
1530
1608
  if (node.attributes["rel"] === "stylesheet" /* Constant.StyleSheet */) {
1531
- this.stylesheets.push(new Promise((resolve) => {
1532
- const proxy = useproxy !== null && useproxy !== void 0 ? useproxy : this.state.options.useproxy;
1609
+ _this.stylesheets.push(new Promise(function (resolve) {
1610
+ var proxy = useproxy !== null && useproxy !== void 0 ? useproxy : _this.state.options.useproxy;
1533
1611
  if (proxy) {
1534
- if (linkElement.integrity) {
1535
- linkElement.removeAttribute('integrity');
1612
+ if (linkElement_1.integrity) {
1613
+ linkElement_1.removeAttribute('integrity');
1536
1614
  }
1537
- linkElement.href = proxy(linkElement.href, linkElement.id, "stylesheet" /* Constant.StyleSheet */);
1615
+ linkElement_1.href = proxy(linkElement_1.href, linkElement_1.id, "stylesheet" /* Constant.StyleSheet */);
1538
1616
  }
1539
- linkElement.onload = linkElement.onerror = this.style.bind(this, linkElement, resolve);
1617
+ linkElement_1.onload = linkElement_1.onerror = _this.style.bind(_this, linkElement_1, resolve);
1540
1618
  setTimeout(resolve, LayoutHelper.TIMEOUT);
1541
1619
  }));
1542
1620
  }
1543
1621
  else if ((node.attributes["rel"].includes("preload") || node.attributes["rel"].includes("preconnect"))
1544
1622
  && (((_a = node.attributes) === null || _a === void 0 ? void 0 : _a.as) === "style" || ((_b = node.attributes) === null || _b === void 0 ? void 0 : _b.as) === "font")) {
1545
- this.fonts.push(new Promise((resolve) => {
1546
- const proxy = useproxy !== null && useproxy !== void 0 ? useproxy : this.state.options.useproxy;
1547
- linkElement.href = proxy ? proxy(linkElement.href, linkElement.id, node.attributes.as) : linkElement.href;
1548
- linkElement.onload = linkElement.onerror = this.style.bind(this, linkElement, resolve);
1623
+ _this.fonts.push(new Promise(function (resolve) {
1624
+ var proxy = useproxy !== null && useproxy !== void 0 ? useproxy : _this.state.options.useproxy;
1625
+ linkElement_1.href = proxy ? proxy(linkElement_1.href, linkElement_1.id, node.attributes.as) : linkElement_1.href;
1626
+ linkElement_1.onload = linkElement_1.onerror = _this.style.bind(_this, linkElement_1, resolve);
1549
1627
  setTimeout(resolve, LayoutHelper.TIMEOUT);
1550
1628
  }));
1551
1629
  }
1552
1630
  }
1553
- insert(node, parent, linkElement, pivot);
1631
+ insert(node, parent_1, linkElement_1, pivot);
1554
1632
  break;
1555
1633
  case "IMG" /* Layout.Constant.ImageTag */:
1556
- let imgElement = (_c = this.element(node.id)) !== null && _c !== void 0 ? _c : this.createElement(doc, node.tag);
1557
- const proxy = useproxy !== null && useproxy !== void 0 ? useproxy : this.state.options.useproxy;
1634
+ var imgElement = (_c = _this.element(node.id)) !== null && _c !== void 0 ? _c : _this.createElement(doc, node.tag);
1635
+ var proxy = useproxy !== null && useproxy !== void 0 ? useproxy : _this.state.options.useproxy;
1558
1636
  if (proxy && !!((_d = node.attributes) === null || _d === void 0 ? void 0 : _d.src)) {
1559
1637
  node.attributes.src = proxy(node.attributes.src, node.attributes.id, "IMG" /* Layout.Constant.ImageTag */);
1560
1638
  }
1561
- this.setAttributes(imgElement, node);
1562
- this.resize(imgElement, node.width, node.height);
1563
- insert(node, parent, imgElement, pivot);
1639
+ _this.setAttributes(imgElement, node);
1640
+ _this.resize(imgElement, node.width, node.height);
1641
+ insert(node, parent_1, imgElement, pivot);
1564
1642
  break;
1565
1643
  case "STYLE":
1566
- let styleElement = (_e = this.element(node.id)) !== null && _e !== void 0 ? _e : doc.createElement(node.tag);
1567
- this.setAttributes(styleElement, node);
1644
+ var styleElement = (_e = _this.element(node.id)) !== null && _e !== void 0 ? _e : doc.createElement(node.tag);
1645
+ _this.setAttributes(styleElement, node);
1568
1646
  styleElement.textContent = node.value;
1569
- insert(node, parent, styleElement, pivot);
1570
- this.style(styleElement);
1647
+ insert(node, parent_1, styleElement, pivot);
1648
+ _this.style(styleElement);
1571
1649
  break;
1572
1650
  case "IFRAME":
1573
- let iframeElement = this.element(node.id);
1574
- iframeElement = iframeElement ? iframeElement : this.createElement(doc, node.tag);
1651
+ var iframeElement = _this.element(node.id);
1652
+ iframeElement = iframeElement ? iframeElement : _this.createElement(doc, node.tag);
1575
1653
  if (!node.attributes) {
1576
1654
  node.attributes = {};
1577
1655
  }
1578
- this.setAttributes(iframeElement, node);
1579
- insert(node, parent, iframeElement, pivot);
1656
+ _this.setAttributes(iframeElement, node);
1657
+ insert(node, parent_1, iframeElement, pivot);
1580
1658
  break;
1581
1659
  case "SCRIPT":
1582
1660
  {
1583
1661
  node.id = -1; // We want to ensure children of script tags are not processed
1584
1662
  node.value = null; // We don't want to set any potential script content
1585
- this.insertDefaultElement(node, parent, pivot, doc, insert);
1663
+ _this.insertDefaultElement(node, parent_1, pivot, doc, insert);
1586
1664
  break;
1587
1665
  }
1588
1666
  default:
1589
- this.insertDefaultElement(node, parent, pivot, doc, insert);
1667
+ _this.insertDefaultElement(node, parent_1, pivot, doc, insert);
1590
1668
  break;
1591
1669
  }
1592
1670
  // Track state for this node
1593
1671
  if (node.id) {
1594
- this.events[node.id] = node;
1672
+ _this.events[node.id] = node;
1595
1673
  }
1674
+ };
1675
+ for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {
1676
+ var node = data_1[_i];
1677
+ _loop_1(node);
1596
1678
  }
1597
1679
  // only retry failed nodes if we are still making positive progress. If we have the same number of
1598
1680
  // nodes we started with, then we would just be spinning on an orphaned subtree.
1599
1681
  if (retryEvent.data.length > 0 && retryEvent.data.length !== event.data.length) {
1600
- this.markup(retryEvent, useproxy);
1682
+ _this.markup(retryEvent, useproxy);
1601
1683
  }
1602
1684
  };
1603
- this.insertDefaultElement = (node, parent, pivot, doc, insert) => {
1604
- let domElement = this.element(node.id);
1605
- domElement = domElement ? domElement : this.createElement(doc, node.tag);
1606
- this.setAttributes(domElement, node);
1607
- this.resize(domElement, node.width, node.height);
1685
+ this.insertDefaultElement = function (node, parent, pivot, doc, insert) {
1686
+ var domElement = _this.element(node.id);
1687
+ domElement = domElement ? domElement : _this.createElement(doc, node.tag);
1688
+ _this.setAttributes(domElement, node);
1689
+ _this.resize(domElement, node.width, node.height);
1608
1690
  insert(node, parent, domElement, pivot);
1609
1691
  };
1610
- this.style = (node, resolve = null) => {
1692
+ this.style = function (node, resolve) {
1693
+ if (resolve === void 0) { resolve = null; }
1611
1694
  // Firefox throws a SecurityError when trying to access cssRules of a stylesheet from a different domain
1612
1695
  try {
1613
- const sheet = node.sheet;
1614
- let cssRules = sheet ? sheet.cssRules : [];
1615
- for (let i = 0; i < cssRules.length; i++) {
1696
+ var sheet = node.sheet;
1697
+ var cssRules = sheet ? sheet.cssRules : [];
1698
+ for (var i = 0; i < cssRules.length; i++) {
1616
1699
  if (cssRules[i].cssText.indexOf(":hover" /* Constant.Hover */) >= 0) {
1617
- let css = cssRules[i].cssText.replace(/:hover/g, `[${"clarity-hover" /* Constant.CustomHover */}]`);
1700
+ var css = cssRules[i].cssText.replace(/:hover/g, "[".concat("clarity-hover" /* Constant.CustomHover */, "]"));
1618
1701
  sheet.removeRule(i);
1619
1702
  sheet.insertRule(css, i);
1620
1703
  }
1621
1704
  }
1622
1705
  }
1623
1706
  catch (e) {
1624
- if (this.state.options.logerror) {
1625
- this.state.options.logerror(e);
1707
+ if (_this.state.options.logerror) {
1708
+ _this.state.options.logerror(e);
1626
1709
  }
1627
1710
  }
1628
1711
  if (resolve) {
1629
1712
  resolve();
1630
1713
  }
1631
1714
  };
1632
- this.addStyles = (id) => {
1633
- let adoptedStylesToAdd = this.stylesToApply[id];
1715
+ this.addStyles = function (id) {
1716
+ var adoptedStylesToAdd = _this.stylesToApply[id];
1634
1717
  if (adoptedStylesToAdd && adoptedStylesToAdd.length > 0) {
1635
- this.setDocumentStyles(id, this.stylesToApply[id]);
1636
- delete this.stylesToApply[id];
1718
+ _this.setDocumentStyles(id, _this.stylesToApply[id]);
1719
+ delete _this.stylesToApply[id];
1637
1720
  }
1638
1721
  };
1639
- this.createElement = (doc, tag) => {
1722
+ this.createElement = function (doc, tag) {
1640
1723
  if (tag && tag.indexOf("svg:" /* Layout.Constant.SvgPrefix */) === 0) {
1641
1724
  return doc.createElementNS("http://www.w3.org/2000/svg" /* Layout.Constant.SvgNamespace */, tag.substr("svg:" /* Layout.Constant.SvgPrefix */.length));
1642
1725
  }
@@ -1645,24 +1728,24 @@ class LayoutHelper {
1645
1728
  }
1646
1729
  catch (ex) {
1647
1730
  // We log the warning on non-standard markup but continue with the visualization
1648
- console.warn(`Exception encountered while creating element ${tag}: ${ex}`);
1731
+ console.warn("Exception encountered while creating element ".concat(tag, ": ").concat(ex));
1649
1732
  return doc.createElement("clarity-unknown" /* Constant.UnknownTag */);
1650
1733
  }
1651
1734
  };
1652
- this.insertAfter = (data, parent, node, previous) => {
1735
+ this.insertAfter = function (data, parent, node, previous) {
1653
1736
  // Skip over no-op changes where parent and previous element is still the same
1654
1737
  // In case of IFRAME, re-adding DOM at the exact same place will lead to loss of state and the markup inside will be destroyed
1655
- if (this.events[data.id] && this.events[data.id].parent === data.parent && this.events[data.id].previous === data.previous) {
1738
+ if (_this.events[data.id] && _this.events[data.id].parent === data.parent && _this.events[data.id].previous === data.previous) {
1656
1739
  return;
1657
1740
  }
1658
1741
  // In case parent is a Shadow DOM, previous.parentElement will return null but previous.parentNode will return a valid node
1659
- let next = previous && (previous.parentElement === parent || previous.parentNode === parent) ? previous.nextSibling : null;
1660
- next = previous === null && parent ? this.firstChild(parent) : next;
1661
- this.insertBefore(data, parent, node, next);
1742
+ var next = previous && (previous.parentElement === parent || previous.parentNode === parent) ? previous.nextSibling : null;
1743
+ next = previous === null && parent ? _this.firstChild(parent) : next;
1744
+ _this.insertBefore(data, parent, node, next);
1662
1745
  };
1663
- this.firstChild = (node) => {
1746
+ this.firstChild = function (node) {
1664
1747
  var _a;
1665
- let child = node.firstChild;
1748
+ var child = node.firstChild;
1666
1749
  // BASE tag should always be the first child to ensure resources with relative URLs are loaded correctly
1667
1750
  if (child && child.nodeType === 1 /* NodeType.ELEMENT_NODE */ && child.tagName === "BASE" /* Layout.Constant.BaseTag */) {
1668
1751
  if ((_a = child.nextSibling) === null || _a === void 0 ? void 0 : _a.hasAttribute('clarity-custom-styles')) {
@@ -1674,25 +1757,25 @@ class LayoutHelper {
1674
1757
  return child;
1675
1758
  };
1676
1759
  // Mask images within a masked ancestor element in the node has a background image.
1677
- this.mask = (node) => {
1760
+ this.mask = function (node) {
1678
1761
  var _a, _b, _c;
1679
- if (node && this.BackgroundImageEligibleElements.includes(node.nodeName) && 'getComputedStyle' in window && 'closest' in node) {
1680
- const urlPattern = /url\(['"]?([^'")]+)['"]?\)/;
1681
- const computedStyles = window.getComputedStyle(node);
1682
- const hasBackgroundImage = ((_a = computedStyles.backgroundImage) === null || _a === void 0 ? void 0 : _a.match(urlPattern)) || ((_b = computedStyles.background) === null || _b === void 0 ? void 0 : _b.match(urlPattern));
1683
- const masked = (_c = node.closest) === null || _c === void 0 ? void 0 : _c.call(node, `[${"data-clarity-mask" /* LayoutConstants.MaskData */}]`);
1762
+ if (node && _this.BackgroundImageEligibleElements.includes(node.nodeName) && 'getComputedStyle' in window && 'closest' in node) {
1763
+ var urlPattern = /url\(['"]?([^'")]+)['"]?\)/;
1764
+ var computedStyles = window.getComputedStyle(node);
1765
+ var hasBackgroundImage = ((_a = computedStyles.backgroundImage) === null || _a === void 0 ? void 0 : _a.match(urlPattern)) || ((_b = computedStyles.background) === null || _b === void 0 ? void 0 : _b.match(urlPattern));
1766
+ var masked = (_c = node.closest) === null || _c === void 0 ? void 0 : _c.call(node, "[".concat("data-clarity-mask" /* LayoutConstants.MaskData */, "]"));
1684
1767
  if (hasBackgroundImage && masked) {
1685
- node.style.background = this.MaskedBackgroundImageStyle;
1768
+ node.style.background = _this.MaskedBackgroundImageStyle;
1686
1769
  }
1687
1770
  }
1688
1771
  };
1689
- this.insertBefore = (data, parent, node, next) => {
1772
+ this.insertBefore = function (data, parent, node, next) {
1690
1773
  if (parent !== null) {
1691
1774
  // Compare against both parentNode and parentElement to ensure visualization works correctly for shadow DOMs
1692
1775
  next = next && (next.parentElement !== parent && next.parentNode !== parent) ? null : next;
1693
1776
  try {
1694
1777
  parent.insertBefore(node, next);
1695
- this.mask(node);
1778
+ _this.mask(node);
1696
1779
  }
1697
1780
  catch (ex) {
1698
1781
  console.warn("Node: " + node + " | Parent: " + parent + " | Data: " + JSON.stringify(data));
@@ -1705,34 +1788,34 @@ class LayoutHelper {
1705
1788
  else if (parent === null && node.parentNode !== null) {
1706
1789
  node.parentNode.removeChild(node);
1707
1790
  }
1708
- this.nodes[data.id] = node;
1709
- this.addToHashMap(data, node);
1791
+ _this.nodes[data.id] = node;
1792
+ _this.addToHashMap(data, node);
1710
1793
  };
1711
- this.setAttributes = (node, data) => {
1712
- let attributes = data.attributes || {};
1713
- let sameorigin = false;
1794
+ this.setAttributes = function (node, data) {
1795
+ var attributes = data.attributes || {};
1796
+ var sameorigin = false;
1714
1797
  // Clarity attributes
1715
- attributes["data-clarity-id" /* Constant.Id */] = `${data.id}`;
1716
- attributes["data-clarity-hashalpha" /* Constant.HashAlpha */] = `${data.hashAlpha}`;
1717
- attributes["data-clarity-hashbeta" /* Constant.HashBeta */] = `${data.hashBeta}`;
1718
- let tag = node.nodeType === 1 /* NodeType.ELEMENT_NODE */ ? node.tagName.toLowerCase() : null;
1798
+ attributes["data-clarity-id" /* Constant.Id */] = "".concat(data.id);
1799
+ attributes["data-clarity-hashalpha" /* Constant.HashAlpha */] = "".concat(data.hashAlpha);
1800
+ attributes["data-clarity-hashbeta" /* Constant.HashBeta */] = "".concat(data.hashBeta);
1801
+ var tag = node.nodeType === 1 /* NodeType.ELEMENT_NODE */ ? node.tagName.toLowerCase() : null;
1719
1802
  // First remove all its existing attributes
1720
1803
  if (node.attributes) {
1721
- let length = node.attributes.length;
1722
- while (node.attributes && length > 0) {
1804
+ var length_1 = node.attributes.length;
1805
+ while (node.attributes && length_1 > 0) {
1723
1806
  // Do not remove "clarity-hover" attribute and let it be managed by interaction module
1724
1807
  // This helps avoid flickers during visualization
1725
1808
  if (node.attributes[0].name !== "clarity-hover" /* Constant.HoverAttribute */) {
1726
1809
  node.removeAttribute(node.attributes[0].name);
1727
1810
  }
1728
- length--;
1811
+ length_1--;
1729
1812
  }
1730
1813
  }
1731
1814
  // Add new attributes
1732
- for (let attribute in attributes) {
1815
+ for (var attribute in attributes) {
1733
1816
  if (attributes[attribute] !== undefined) {
1734
1817
  try {
1735
- let v = attributes[attribute];
1818
+ var v = attributes[attribute];
1736
1819
  if (attribute.indexOf("xlink:") === 0) {
1737
1820
  node.setAttributeNS("http://www.w3.org/1999/xlink", attribute, v);
1738
1821
  }
@@ -1743,30 +1826,30 @@ class LayoutHelper {
1743
1826
  // Do nothing if we encounter internal Clarity attributes
1744
1827
  }
1745
1828
  else if (tag === "iframe" /* Constant.IFrameTag */ && (attribute.indexOf("src") === 0 || attribute.indexOf("allow") === 0) || attribute === "sandbox") {
1746
- node.setAttribute(`data-clarity-${attribute}`, v);
1829
+ node.setAttribute("data-clarity-".concat(attribute), v);
1747
1830
  }
1748
1831
  else if (tag === "img" /* Constant.ImageTag */ && attribute.indexOf("src") === 0 && ((v === null || v.length === 0 || (v === null || v === void 0 ? void 0 : v.startsWith('blob:'))))) {
1749
- if (this.vNext) {
1832
+ if (_this.vNext) {
1750
1833
  if (v.startsWith('blob:')) {
1751
1834
  if (data.width >= 132 /* Setting.LargeSvg */ && data.height >= 132 /* Setting.LargeSvg */) {
1752
- node.setAttribute("data-clarity-blob-hide" /* Constant.BlobUnavailable */, `${"l" /* Constant.Large */}${"b" /* Constant.Beta */}`);
1835
+ node.setAttribute("data-clarity-blob-hide" /* Constant.BlobUnavailable */, "".concat("l" /* Constant.Large */).concat("b" /* Constant.Beta */));
1753
1836
  }
1754
1837
  else {
1755
- node.setAttribute("data-clarity-blob-hide" /* Constant.BlobUnavailable */, `${"s" /* Constant.Small */}${"b" /* Constant.Beta */}`);
1838
+ node.setAttribute("data-clarity-blob-hide" /* Constant.BlobUnavailable */, "".concat("s" /* Constant.Small */).concat("b" /* Constant.Beta */));
1756
1839
  }
1757
1840
  }
1758
1841
  else {
1759
1842
  if (data.width >= 132 /* Setting.LargeSvg */ && data.height >= 132 /* Setting.LargeSvg */) {
1760
- node.setAttribute("data-clarity-hide" /* Constant.Hide */, `${"l" /* Constant.Large */}${"b" /* Constant.Beta */}`);
1843
+ node.setAttribute("data-clarity-hide" /* Constant.Hide */, "".concat("l" /* Constant.Large */).concat("b" /* Constant.Beta */));
1761
1844
  }
1762
1845
  else {
1763
- node.setAttribute("data-clarity-hide" /* Constant.Hide */, `${"s" /* Constant.Small */}${"b" /* Constant.Beta */}`);
1846
+ node.setAttribute("data-clarity-hide" /* Constant.Hide */, "".concat("s" /* Constant.Small */).concat("b" /* Constant.Beta */));
1764
1847
  }
1765
1848
  }
1766
1849
  }
1767
1850
  else {
1768
1851
  node.setAttribute(attribute, "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=" /* Asset.Transparent */);
1769
- let size = "l" /* Constant.Large */;
1852
+ var size = "l" /* Constant.Large */;
1770
1853
  if (data.width) {
1771
1854
  size = data.width <= 200 /* Setting.Medium */ ? "m" /* Constant.Medium */ : (data.width <= 75 /* Setting.Small */ ? "s" /* Constant.Small */ : size);
1772
1855
  }
@@ -1774,7 +1857,7 @@ class LayoutHelper {
1774
1857
  }
1775
1858
  }
1776
1859
  else {
1777
- node.setAttribute(attribute, v);
1860
+ node.setAttribute(attribute, _this.isSuspiciousAttribute(attribute, v) ? "" /* Constant.Empty */ : v);
1778
1861
  }
1779
1862
  }
1780
1863
  catch (ex) {
@@ -1784,7 +1867,7 @@ class LayoutHelper {
1784
1867
  }
1785
1868
  }
1786
1869
  if (sameorigin === false && tag === "iframe" /* Constant.IFrameTag */ && typeof node.setAttribute === "function" /* Constant.Function */) {
1787
- if (this.svgFitsText(node)) {
1870
+ if (_this.svgFitsText(node)) {
1788
1871
  node.setAttribute("data-clarity-unavailable" /* Constant.Unavailable */, "" /* Layout.Constant.Empty */);
1789
1872
  }
1790
1873
  else {
@@ -1803,58 +1886,57 @@ class LayoutHelper {
1803
1886
  node.setAttribute("autocomplete" /* Constant.AutoComplete */, "new-password" /* Constant.NewPassword */);
1804
1887
  }
1805
1888
  };
1806
- this.getMobileCustomStyle = () => {
1807
- if (this.isMobile) {
1808
- return `*{scrollbar-width: none; scrollbar-gutter: unset;};`;
1889
+ this.getMobileCustomStyle = function () {
1890
+ if (_this.isMobile) {
1891
+ return "*{scrollbar-width: none; scrollbar-gutter: unset;};";
1809
1892
  }
1810
1893
  return '';
1811
1894
  };
1812
- this.getCustomStyle = () => {
1813
- return this.getImageHiddenCss() +
1814
- this.getIframeUnavailableCss() +
1815
- this.getBlobUnavailableCss() +
1816
- this.getBackgroundCss() +
1817
- `*[${"data-clarity-suspend" /* Constant.Suspend */}] { filter: grayscale(100%); }` +
1818
- `body { font-size: initial; }
1819
- ${this.getMobileCustomStyle()}`;
1895
+ this.getCustomStyle = function () {
1896
+ return _this.getImageHiddenCss() +
1897
+ _this.getIframeUnavailableCss() +
1898
+ _this.getBlobUnavailableCss() +
1899
+ _this.getBackgroundCss() +
1900
+ "*[".concat("data-clarity-suspend" /* Constant.Suspend */, "] { filter: grayscale(100%); }") +
1901
+ "body { font-size: initial; }\n ".concat(_this.getMobileCustomStyle());
1820
1902
  };
1821
- this.svgFitsText = (inputElement) => {
1903
+ this.svgFitsText = function (inputElement) {
1822
1904
  var dimensions = inputElement.getBoundingClientRect();
1823
1905
  if (dimensions.width >= 132 /* Setting.LargeSvg */ && dimensions.height >= 132 /* Setting.LargeSvg */) {
1824
1906
  return true;
1825
1907
  }
1826
1908
  return false;
1827
1909
  };
1828
- this.getIframeUnavailableCss = () => {
1829
- if (this.vNext) {
1830
- return `${"iframe" /* Constant.IFrameTag */}[${"data-clarity-unavailable-small" /* Constant.UnavailableSmall */}] { ${iframeUnavailableSvgSmall} }` +
1831
- `${"iframe" /* Constant.IFrameTag */}[${"data-clarity-unavailable" /* Constant.Unavailable */}] { ${iframeUnavailableSvg[this.locale]} }`;
1910
+ this.getIframeUnavailableCss = function () {
1911
+ if (_this.vNext) {
1912
+ return "".concat("iframe" /* Constant.IFrameTag */, "[").concat("data-clarity-unavailable-small" /* Constant.UnavailableSmall */, "] { ").concat(iframeUnavailableSvgSmall, " }") +
1913
+ "".concat("iframe" /* Constant.IFrameTag */, "[").concat("data-clarity-unavailable" /* Constant.Unavailable */, "] { ").concat(iframeUnavailableSvg[_this.locale], " }");
1832
1914
  }
1833
1915
  else {
1834
- return `${"iframe" /* Constant.IFrameTag */}[${"data-clarity-unavailable" /* Constant.Unavailable */}] { background: url(${"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAiCAYAAAAge+tMAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAU6SURBVHgBzVg7TyNJEG6bh5AIjpOQeCXj7LL18pDIdpztRYuzy7CjCzG/ADu8CO8vwEQXrgkvws6QeNiEFzEk4GznIFnxvO/zVntrhx6/kLxb0mh6uqurvq6urqqehHklra+ve3d3dx8SiUT6+fk5ja4ZtGf4tjzoD9AXoBmiXUsmk+cnJyc18wpKmCFodXXVx8t/enraBCDPDEchniqeg9PT06oZkAYCTsCw2A6afjc+8IQCjGR3oBtxR/bHx8crR0dHgemD+gIugPfQ9OJ4BGwF72qj0ajrsTQI7rEFcDnTndoLeHh4KDebzdAMC5z+e39/T8B+Nz6AbcJtslAWdOMDfg8LONTuJf7vRVgDPEW40H6crLG4AVi58Pj4+Deav0WUFIjBfDt8NYD+HaBbpge1Wq1wbm5uH+DXjewe5IXQ85buxAMurJS9sbi46IG/jnlforKS0Q7f92dWVlYOAXLXgqMb4CmcnZ2l8E5YpVwIlGZ7basm8nIO50qXNzY29g6y8+hP0RCKPYexBne+K3Ay3N7eNoxyDViziicFwR+la8uOwULFQUBr8LB6XgOU/gDukcGittUY3bUBY25oGR0fX1tbSwPgoVFWxquoAFufv5DxgDvgAsZdu7m52WR7cnLyIC5SAMxnqw+6PRzqSzvmOg9coPX7ZAzoAN9vNWgSQKfVpzP2yq5dQGGZD61F+S5e6KnYNkD6eozWBwZav6m6K1hs2yBJB2hGiIwrQmDsjfp8MS6L2zMqa7INebvGTedKthcdtODN90Yi+I2kCO0owsq3e4U1EqOBq98FwNWnxgKCgd66a5znAe6RjYDfGsdJzmtfgqBPWFE+Jg2HSmFcNuS8QqSv5mLkwQewiumDBKcn87JJ5UuB8BDQJ8TxYnQyFnep2ukYMCXzvXUY57ddvIOGUeIUNw47UQWneEYsrwFVJiYmSjYqkAdx9bOMMR6n4pSTF7J+0ZHCRVKwfaA7SXUZ0g3xNJn+j4+Pm655L1L+8vLyrmRHS4FR6ZfJyUichyKGy5IZgvot2EA1GC8fDanOWgXgCwBPodqPqxCwjQKIljmUPiaSTJxVuoAuCui+CXhKqOGLne84xpgEQKqoSwMpwIIy/ZajUdBytspSVV6KblaT79AsaP0afM+yFtbP4bXT48LAWqYEtymbHrIgZy/SnYurAsV4O7ocRjvD21Nf9bgIYMbK9VgAq8f2rYYHbHp6OqjVau3DK+UCXcw1P9ethI2cO9YzqYFuQLIA3/TegTYxpbPqE+UdazM7o82suWn6AC8Rr2F10upjZgBiPX19fd3E83F+fr5mviakKQiad/FDWfHq6upftlFbM0N7AvwP1kHoY5Fmzwrr7wCyzx16vywsLBDwe9s31GU5ShKz30gOmLGWQZwv2fIBYfRZ2JnCf7Vz0V8xyvIsaV1nReeQ9oXGjIDoYlB6IZ811tx6PAo+Gvoswd0urFGS5icgLCSHV8e/GS5dJYemUQHXxZnnYugFXtzRzg1HApz1jC3iqFzqkxfUDTxcTc9pDhRVXkOICrSYb78RPQ5cfOivRqKNv7S0lMAi/lTRqziSw0mSqMADauufbLdfb45ir032rjsyi0ssnlJWfw/Ltlxxm4T+fyR2+7qfi+GckQEXMHWA9c3XRDRl5KcPXOE/JKrA8vEvwezsLH8a5YwqEWDtMqz9F9sjcxVL4jJM/RuRoVB+iZjob2qSgO7cpEYO3BJrfry2etU8XAx4XtyBfxhwki3aAGyT9b39HS3/KJsoGSr4rLuuh/8DlPszm7LNbUUAAAAASUVORK5CYII=" /* Asset.Unavailable */}) no-repeat center center, url('${"data:image/svg+xml,<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"100%\" height=\"100%\"><rect width=\"100%\" height=\"100%\" style=\"fill:rgb(204,204,204)\"/><line stroke-dasharray=\"5, 5\" x1=\"0\" y1=\"100%\" x2=\"100%\" y2=\"0\" style=\"stroke:rgb(119,119,119);stroke-width:1\"/><line stroke-dasharray=\"5, 5\" x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"100%\" style=\"stroke:rgb(119,119,119);stroke-width:1\"/><circle cx=\"50%\" cy=\"50%\" r=\"40\" fill=\"rgb(204,204,204)\"/></svg>" /* Asset.Cross */}'); }`;
1916
+ return "".concat("iframe" /* Constant.IFrameTag */, "[").concat("data-clarity-unavailable" /* Constant.Unavailable */, "] { background: url(").concat("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAiCAYAAAAge+tMAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAU6SURBVHgBzVg7TyNJEG6bh5AIjpOQeCXj7LL18pDIdpztRYuzy7CjCzG/ADu8CO8vwEQXrgkvws6QeNiEFzEk4GznIFnxvO/zVntrhx6/kLxb0mh6uqurvq6urqqehHklra+ve3d3dx8SiUT6+fk5ja4ZtGf4tjzoD9AXoBmiXUsmk+cnJyc18wpKmCFodXXVx8t/enraBCDPDEchniqeg9PT06oZkAYCTsCw2A6afjc+8IQCjGR3oBtxR/bHx8crR0dHgemD+gIugPfQ9OJ4BGwF72qj0ajrsTQI7rEFcDnTndoLeHh4KDebzdAMC5z+e39/T8B+Nz6AbcJtslAWdOMDfg8LONTuJf7vRVgDPEW40H6crLG4AVi58Pj4+Deav0WUFIjBfDt8NYD+HaBbpge1Wq1wbm5uH+DXjewe5IXQ85buxAMurJS9sbi46IG/jnlforKS0Q7f92dWVlYOAXLXgqMb4CmcnZ2l8E5YpVwIlGZ7basm8nIO50qXNzY29g6y8+hP0RCKPYexBne+K3Ay3N7eNoxyDViziicFwR+la8uOwULFQUBr8LB6XgOU/gDukcGittUY3bUBY25oGR0fX1tbSwPgoVFWxquoAFufv5DxgDvgAsZdu7m52WR7cnLyIC5SAMxnqw+6PRzqSzvmOg9coPX7ZAzoAN9vNWgSQKfVpzP2yq5dQGGZD61F+S5e6KnYNkD6eozWBwZav6m6K1hs2yBJB2hGiIwrQmDsjfp8MS6L2zMqa7INebvGTedKthcdtODN90Yi+I2kCO0owsq3e4U1EqOBq98FwNWnxgKCgd66a5znAe6RjYDfGsdJzmtfgqBPWFE+Jg2HSmFcNuS8QqSv5mLkwQewiumDBKcn87JJ5UuB8BDQJ8TxYnQyFnep2ukYMCXzvXUY57ddvIOGUeIUNw47UQWneEYsrwFVJiYmSjYqkAdx9bOMMR6n4pSTF7J+0ZHCRVKwfaA7SXUZ0g3xNJn+j4+Pm655L1L+8vLyrmRHS4FR6ZfJyUichyKGy5IZgvot2EA1GC8fDanOWgXgCwBPodqPqxCwjQKIljmUPiaSTJxVuoAuCui+CXhKqOGLne84xpgEQKqoSwMpwIIy/ZajUdBytspSVV6KblaT79AsaP0afM+yFtbP4bXT48LAWqYEtymbHrIgZy/SnYurAsV4O7ocRjvD21Nf9bgIYMbK9VgAq8f2rYYHbHp6OqjVau3DK+UCXcw1P9ethI2cO9YzqYFuQLIA3/TegTYxpbPqE+UdazM7o82suWn6AC8Rr2F10upjZgBiPX19fd3E83F+fr5mviakKQiad/FDWfHq6upftlFbM0N7AvwP1kHoY5Fmzwrr7wCyzx16vywsLBDwe9s31GU5ShKz30gOmLGWQZwv2fIBYfRZ2JnCf7Vz0V8xyvIsaV1nReeQ9oXGjIDoYlB6IZ811tx6PAo+Gvoswd0urFGS5icgLCSHV8e/GS5dJYemUQHXxZnnYugFXtzRzg1HApz1jC3iqFzqkxfUDTxcTc9pDhRVXkOICrSYb78RPQ5cfOivRqKNv7S0lMAi/lTRqziSw0mSqMADauufbLdfb45ir032rjsyi0ssnlJWfw/Ltlxxm4T+fyR2+7qfi+GckQEXMHWA9c3XRDRl5KcPXOE/JKrA8vEvwezsLH8a5YwqEWDtMqz9F9sjcxVL4jJM/RuRoVB+iZjob2qSgO7cpEYO3BJrfry2etU8XAx4XtyBfxhwki3aAGyT9b39HS3/KJsoGSr4rLuuh/8DlPszm7LNbUUAAAAASUVORK5CYII=" /* Asset.Unavailable */, ") no-repeat center center, url('").concat("data:image/svg+xml,<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"100%\" height=\"100%\"><rect width=\"100%\" height=\"100%\" style=\"fill:rgb(204,204,204)\"/><line stroke-dasharray=\"5, 5\" x1=\"0\" y1=\"100%\" x2=\"100%\" y2=\"0\" style=\"stroke:rgb(119,119,119);stroke-width:1\"/><line stroke-dasharray=\"5, 5\" x1=\"0\" y1=\"0\" x2=\"100%\" y2=\"100%\" style=\"stroke:rgb(119,119,119);stroke-width:1\"/><circle cx=\"50%\" cy=\"50%\" r=\"40\" fill=\"rgb(204,204,204)\"/></svg>" /* Asset.Cross */, "'); }");
1835
1917
  }
1836
1918
  };
1837
- this.getBlobUnavailableCss = () => {
1838
- if (this.vNext) {
1839
- return `${"img" /* Constant.ImageTag */}[${"data-clarity-blob-hide" /* Constant.BlobUnavailable */}=${"s" /* Constant.Small */}${"b" /* Constant.Beta */}] { ${blobUnavailableSvgSmall} }` +
1840
- `${"img" /* Constant.ImageTag */}[${"data-clarity-blob-hide" /* Constant.BlobUnavailable */}=${"l" /* Constant.Large */}${"b" /* Constant.Beta */}] { ${blobUnavailableSvg[this.locale]} }`;
1919
+ this.getBlobUnavailableCss = function () {
1920
+ if (_this.vNext) {
1921
+ return "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-blob-hide" /* Constant.BlobUnavailable */, "=").concat("s" /* Constant.Small */).concat("b" /* Constant.Beta */, "] { ").concat(blobUnavailableSvgSmall, " }") +
1922
+ "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-blob-hide" /* Constant.BlobUnavailable */, "=").concat("l" /* Constant.Large */).concat("b" /* Constant.Beta */, "] { ").concat(blobUnavailableSvg[_this.locale], " }");
1841
1923
  }
1842
1924
  return '';
1843
1925
  };
1844
- this.getImageHiddenCss = () => {
1845
- if (this.vNext) {
1846
- return `${"img" /* Constant.ImageTag */}[${"data-clarity-hide" /* Constant.Hide */}=${"s" /* Constant.Small */}${"b" /* Constant.Beta */}] { ${imageMaskedSvgSmall} }` +
1847
- `${"img" /* Constant.ImageTag */}[${"data-clarity-hide" /* Constant.Hide */}=${"l" /* Constant.Large */}${"b" /* Constant.Beta */}] { ${imageMaskedSvg[this.locale]} }`;
1926
+ this.getImageHiddenCss = function () {
1927
+ if (_this.vNext) {
1928
+ return "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-hide" /* Constant.Hide */, "=").concat("s" /* Constant.Small */).concat("b" /* Constant.Beta */, "] { ").concat(imageMaskedSvgSmall, " }") +
1929
+ "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-hide" /* Constant.Hide */, "=").concat("l" /* Constant.Large */).concat("b" /* Constant.Beta */, "] { ").concat(imageMaskedSvg[_this.locale], " }");
1848
1930
  }
1849
1931
  else {
1850
- return `${"img" /* Constant.ImageTag */}[${"data-clarity-hide" /* Constant.Hide */}] { background-color: #CCC; background-image: url(${"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANvSURBVHgB7Ve9VhpREJ5dU6BNVqt0wS6dpEuX9QmiTyA+gfgE4BOgZSrJE4hlKvEJxDKVa2caoaSSfB87F4Z7dtmFhFTMOfcMe52Z+935u6PIhjb0dxTIihRFUQ2M6z0/dXuI9ay8PwTJklQaEADw0JMgCI4USFSkMx6Pe2BdrFtgS6QEFQICjirYGYDUc0AMcXCCvw8XAVVwHQD7IasAokfCMGzB0NmCA1o44N7T+wpwlwouT+80z2NbOWAaMHqDn7FuJcorapRATkej0bOvyz2s7zs7O2L0GbYXrCrscjUqlUoAuZ6vH3hAIr3diW4xHC3wW+w/KZhLgDmXEgRzbR6udvbBD/DdITB3UewfWm+FRpnIHwyYLo1A+Aq/vzkDWFdSni4krTjm1RnDOxgM9nFOS//OM++0YmeAFMydQw4gDSgeu7LVyprE3489je3u7t5waQFMifrQ6ehn7PZfX18v6BkFOwcq9MDQQKxeseRu0PXARJprBHxED2t7sPSol6p5YHs467OkXo8cqBA/rmXmmVO/atzZzk4G0Kond+DJJJLmStc3Sm+rpxLVbYcEoRu8xbWNp9U1B1rqyzzIRNQj5tAe84ZVKVmGZ6BoK5Vh2JADT1hjLny3rBL27nS/7RtUXZdDmb1H5Ug1rDgjrFMKrGGb2CzPt7e3C95gb2+vqeU/1Mor/UZpg21og50CsfYzATllsLY+E6TE60OTPoUqOV8EQNKKmuTTgifHAmO4GOokyDFah2BTTAOTNFcmIQFI3qyVoxurp+dIL3ZF72bYdzL1zKcDLb2P1n4rqUfcg/nB3Cre3t6uQeY3ZBOri72q87B7ULHY035CdmTs85H9BVlR23yWumVf+6YJo0/MK7qcI8al9RCqq9R4w4ICq9JDYZEwk44ly2TWFtGT+VKnF2PwB6cis8sUzkw+vSsrqNXQ0eUmxo+S5gEPfvQBSTpNLjU1rjzCLiKEYAAWMQRFA5m2GzdJxIUhW5H6yutFguhRToapcb8WQGwL5MwtDnt5cvQOZJuq0yHfkjUQWwHbAn5+AqgvKHGW/IsPRquR+ZdgcQIdrStkYh5tN1ocZYCpSto2Dqezl6yRMga/yQSpXToyYFzOrReQAcUhzp8E+E4eWzD/lTgxuPFGR5Wlm+Y/J3qL/7fJhja0RvoDR4Tn4Lo/zi8AAAAASUVORK5CYII=" /* Asset.Hide */}); background-repeat:no-repeat; background-position: center; }` +
1851
- `${"img" /* Constant.ImageTag */}[${"data-clarity-hide" /* Constant.Hide */}=${"s" /* Constant.Small */}] { background-size: 18px 18px; }` +
1852
- `${"img" /* Constant.ImageTag */}[${"data-clarity-hide" /* Constant.Hide */}=${"m" /* Constant.Medium */}] { background-size: 24px 24px; }` +
1853
- `${"img" /* Constant.ImageTag */}[${"data-clarity-hide" /* Constant.Hide */}=${"l" /* Constant.Large */}] { background-size: 36px 36px; }`;
1932
+ return "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-hide" /* Constant.Hide */, "] { background-color: #CCC; background-image: url(").concat("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAANvSURBVHgB7Ve9VhpREJ5dU6BNVqt0wS6dpEuX9QmiTyA+gfgE4BOgZSrJE4hlKvEJxDKVa2caoaSSfB87F4Z7dtmFhFTMOfcMe52Z+935u6PIhjb0dxTIihRFUQ2M6z0/dXuI9ay8PwTJklQaEADw0JMgCI4USFSkMx6Pe2BdrFtgS6QEFQICjirYGYDUc0AMcXCCvw8XAVVwHQD7IasAokfCMGzB0NmCA1o44N7T+wpwlwouT+80z2NbOWAaMHqDn7FuJcorapRATkej0bOvyz2s7zs7O2L0GbYXrCrscjUqlUoAuZ6vH3hAIr3diW4xHC3wW+w/KZhLgDmXEgRzbR6udvbBD/DdITB3UewfWm+FRpnIHwyYLo1A+Aq/vzkDWFdSni4krTjm1RnDOxgM9nFOS//OM++0YmeAFMydQw4gDSgeu7LVyprE3489je3u7t5waQFMifrQ6ehn7PZfX18v6BkFOwcq9MDQQKxeseRu0PXARJprBHxED2t7sPSol6p5YHs467OkXo8cqBA/rmXmmVO/atzZzk4G0Kond+DJJJLmStc3Sm+rpxLVbYcEoRu8xbWNp9U1B1rqyzzIRNQj5tAe84ZVKVmGZ6BoK5Vh2JADT1hjLny3rBL27nS/7RtUXZdDmb1H5Ug1rDgjrFMKrGGb2CzPt7e3C95gb2+vqeU/1Mor/UZpg21og50CsfYzATllsLY+E6TE60OTPoUqOV8EQNKKmuTTgifHAmO4GOokyDFah2BTTAOTNFcmIQFI3qyVoxurp+dIL3ZF72bYdzL1zKcDLb2P1n4rqUfcg/nB3Cre3t6uQeY3ZBOri72q87B7ULHY035CdmTs85H9BVlR23yWumVf+6YJo0/MK7qcI8al9RCqq9R4w4ICq9JDYZEwk44ly2TWFtGT+VKnF2PwB6cis8sUzkw+vSsrqNXQ0eUmxo+S5gEPfvQBSTpNLjU1rjzCLiKEYAAWMQRFA5m2GzdJxIUhW5H6yutFguhRToapcb8WQGwL5MwtDnt5cvQOZJuq0yHfkjUQWwHbAn5+AqgvKHGW/IsPRquR+ZdgcQIdrStkYh5tN1ocZYCpSto2Dqezl6yRMga/yQSpXToyYFzOrReQAcUhzp8E+E4eWzD/lTgxuPFGR5Wlm+Y/J3qL/7fJhja0RvoDR4Tn4Lo/zi8AAAAASUVORK5CYII=" /* Asset.Hide */, "); background-repeat:no-repeat; background-position: center; }") +
1933
+ "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-hide" /* Constant.Hide */, "=").concat("s" /* Constant.Small */, "] { background-size: 18px 18px; }") +
1934
+ "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-hide" /* Constant.Hide */, "=").concat("m" /* Constant.Medium */, "] { background-size: 24px 24px; }") +
1935
+ "".concat("img" /* Constant.ImageTag */, "[").concat("data-clarity-hide" /* Constant.Hide */, "=").concat("l" /* Constant.Large */, "] { background-size: 36px 36px; }");
1854
1936
  }
1855
1937
  };
1856
- this.getBackgroundCss = () => {
1857
- if (this.vNext) {
1938
+ this.getBackgroundCss = function () {
1939
+ if (_this.vNext) {
1858
1940
  return sharedStyle;
1859
1941
  }
1860
1942
  return '';
@@ -1864,8 +1946,8 @@ class LayoutHelper {
1864
1946
  this.vNext = vNext;
1865
1947
  this.locale = locale;
1866
1948
  }
1867
- setDocumentStyles(documentId, styleIds) {
1868
- let targetDocument = documentId === -1 ? this.state.window.document : this.element(documentId);
1949
+ LayoutHelper.prototype.setDocumentStyles = function (documentId, styleIds) {
1950
+ var targetDocument = documentId === -1 ? this.state.window.document : this.element(documentId);
1869
1951
  if (!targetDocument) {
1870
1952
  if (!this.stylesToApply[documentId]) {
1871
1953
  this.stylesToApply[documentId] = [];
@@ -1873,41 +1955,65 @@ class LayoutHelper {
1873
1955
  this.stylesToApply[documentId] = styleIds;
1874
1956
  return;
1875
1957
  }
1876
- let newSheets = [];
1877
- for (var styleId of styleIds) {
1878
- let styleSheet = this.adoptedStyleSheets[styleId];
1958
+ var newSheets = [];
1959
+ for (var _i = 0, styleIds_1 = styleIds; _i < styleIds_1.length; _i++) {
1960
+ var styleId = styleIds_1[_i];
1961
+ var styleSheet = this.adoptedStyleSheets[styleId];
1879
1962
  if (styleSheet) {
1880
1963
  newSheets.push(styleSheet);
1881
1964
  }
1882
1965
  }
1883
1966
  targetDocument.adoptedStyleSheets = newSheets;
1884
- }
1885
- }
1886
- LayoutHelper.TIMEOUT = 3000;
1967
+ };
1968
+ LayoutHelper.prototype.isSuspiciousAttribute = function (name, value) {
1969
+ // Block event handlers entirely
1970
+ if (name.startsWith('on')) {
1971
+ return true;
1972
+ }
1973
+ // Check for JavaScript protocols and dangerous patterns
1974
+ var dangerous = [
1975
+ /^\s*javascript:/i,
1976
+ /^\s*data:text\/html/i,
1977
+ /^\s*vbscript:/i
1978
+ ];
1979
+ return dangerous.some(function (pattern) { return pattern.test(value); });
1980
+ };
1981
+ LayoutHelper.TIMEOUT = 3000;
1982
+ return LayoutHelper;
1983
+ }());
1887
1984
 
1888
- class Visualizer {
1889
- constructor() {
1985
+ var Visualizer = /** @class */ (function () {
1986
+ function Visualizer() {
1987
+ var _this = this;
1890
1988
  this._state = null;
1891
1989
  this.renderTime = 0;
1892
1990
  this.hashFoundTime = -1;
1893
- this.dom = (event) => __awaiter(this, void 0, void 0, function* () {
1894
- yield this.layout.dom(event);
1895
- });
1896
- this.get = (hash) => {
1991
+ this.dom = function (event) { return __awaiter(_this, void 0, void 0, function () {
1992
+ return __generator(this, function (_a) {
1993
+ switch (_a.label) {
1994
+ case 0: return [4 /*yield*/, this.layout.dom(event)];
1995
+ case 1:
1996
+ _a.sent();
1997
+ return [2 /*return*/];
1998
+ }
1999
+ });
2000
+ }); };
2001
+ this.get = function (hash) {
1897
2002
  var _a;
1898
- return (_a = this.layout) === null || _a === void 0 ? void 0 : _a.get(hash);
2003
+ return (_a = _this.layout) === null || _a === void 0 ? void 0 : _a.get(hash);
1899
2004
  };
1900
- this.shortCircuitRendering = (strategy, domEvent, hash) => {
2005
+ this.shortCircuitRendering = function (strategy, domEvent, hash) {
1901
2006
  switch (strategy) {
1902
2007
  case 1 /* ShortCircuitStrategy.HashFirstTimestamp */:
1903
- return this.layout.exists(hash);
2008
+ return _this.layout.exists(hash);
1904
2009
  case 2 /* ShortCircuitStrategy.HashFirstTimestampPlusBuffer */:
1905
- if (this.hashFoundTime === -1 && this.layout.exists(hash)) {
1906
- this.hashFoundTime = domEvent.time;
2010
+ if (_this.hashFoundTime === -1 && _this.layout.exists(hash)) {
2011
+ _this.hashFoundTime = domEvent.time;
1907
2012
  }
1908
- return (this.hashFoundTime > -1) && (domEvent.time > this.hashFoundTime + 100 /* Setting.VisualizationSettleBuffer */);
2013
+ return (_this.hashFoundTime > -1) && (domEvent.time > _this.hashFoundTime + 100 /* Setting.VisualizationSettleBuffer */);
1909
2014
  case 3 /* ShortCircuitStrategy.HashBeforeDeleted */:
1910
- for (let node of domEvent.data) {
2015
+ for (var _i = 0, _a = domEvent.data; _i < _a.length; _i++) {
2016
+ var node = _a[_i];
1911
2017
  if ((node.hashAlpha === hash || node.hashBeta === hash) && node.parent === null) {
1912
2018
  return true;
1913
2019
  }
@@ -1918,81 +2024,105 @@ class Visualizer {
1918
2024
  return false;
1919
2025
  }
1920
2026
  };
1921
- this.html = (decoded, target, hash = null, useproxy, logerror, shortCircuitStrategy = 0 /* ShortCircuitStrategy.None */) => __awaiter(this, void 0, void 0, function* () {
1922
- if (decoded && decoded.length > 0 && target) {
1923
- try {
1924
- // Flatten the payload and parse all events out of them, sorted by time
1925
- let merged = this.merge(decoded);
1926
- yield this.setup(target, { version: decoded[0].envelope.version, dom: merged.dom, useproxy });
1927
- // Render all mutations on top of the initial markup
1928
- while (merged.events.length > 0) {
1929
- let entry = merged.events.shift();
1930
- switch (entry.event) {
1931
- case 45 /* Data.Event.StyleSheetAdoption */:
1932
- case 46 /* Data.Event.StyleSheetUpdate */:
1933
- this.layout.styleChange(entry);
1934
- break;
1935
- case 51 /* Data.Event.CustomElement */:
1936
- this.layout.customElement(entry);
1937
- break;
1938
- case 6 /* Data.Event.Mutation */:
1939
- let domEvent = entry;
1940
- this.renderTime = domEvent.time;
1941
- if (this.shortCircuitRendering(shortCircuitStrategy, domEvent, hash)) {
1942
- break;
1943
- }
1944
- yield this.layout.markup(domEvent, useproxy);
1945
- break;
1946
- }
1947
- }
1948
- }
1949
- catch (e) {
1950
- if (logerror) {
1951
- logerror(e);
2027
+ this.html = function (decoded, target, hash, useproxy, logerror, shortCircuitStrategy) {
2028
+ if (hash === void 0) { hash = null; }
2029
+ if (shortCircuitStrategy === void 0) { shortCircuitStrategy = 0 /* ShortCircuitStrategy.None */; }
2030
+ return __awaiter(_this, void 0, void 0, function () {
2031
+ var merged, entry, _a, domEvent, e_1;
2032
+ return __generator(this, function (_b) {
2033
+ switch (_b.label) {
2034
+ case 0:
2035
+ if (!(decoded && decoded.length > 0 && target)) return [3 /*break*/, 11];
2036
+ _b.label = 1;
2037
+ case 1:
2038
+ _b.trys.push([1, 10, , 11]);
2039
+ merged = this.merge(decoded);
2040
+ return [4 /*yield*/, this.setup(target, { version: decoded[0].envelope.version, dom: merged.dom, useproxy: useproxy })];
2041
+ case 2:
2042
+ _b.sent();
2043
+ _b.label = 3;
2044
+ case 3:
2045
+ if (!(merged.events.length > 0)) return [3 /*break*/, 9];
2046
+ entry = merged.events.shift();
2047
+ _a = entry.event;
2048
+ switch (_a) {
2049
+ case 45 /* Data.Event.StyleSheetAdoption */: return [3 /*break*/, 4];
2050
+ case 46 /* Data.Event.StyleSheetUpdate */: return [3 /*break*/, 4];
2051
+ case 51 /* Data.Event.CustomElement */: return [3 /*break*/, 5];
2052
+ case 6 /* Data.Event.Mutation */: return [3 /*break*/, 6];
2053
+ }
2054
+ return [3 /*break*/, 8];
2055
+ case 4:
2056
+ this.layout.styleChange(entry);
2057
+ return [3 /*break*/, 8];
2058
+ case 5:
2059
+ this.layout.customElement(entry);
2060
+ return [3 /*break*/, 8];
2061
+ case 6:
2062
+ domEvent = entry;
2063
+ this.renderTime = domEvent.time;
2064
+ if (this.shortCircuitRendering(shortCircuitStrategy, domEvent, hash)) {
2065
+ return [3 /*break*/, 8];
2066
+ }
2067
+ return [4 /*yield*/, this.layout.markup(domEvent, useproxy)];
2068
+ case 7:
2069
+ _b.sent();
2070
+ return [3 /*break*/, 8];
2071
+ case 8: return [3 /*break*/, 3];
2072
+ case 9: return [3 /*break*/, 11];
2073
+ case 10:
2074
+ e_1 = _b.sent();
2075
+ if (logerror) {
2076
+ logerror(e_1);
2077
+ }
2078
+ return [3 /*break*/, 11];
2079
+ case 11: return [2 /*return*/, this];
1952
2080
  }
1953
- }
1954
- }
1955
- return this;
1956
- });
1957
- this.time = () => {
1958
- return this.renderTime;
2081
+ });
2082
+ });
2083
+ };
2084
+ this.time = function () {
2085
+ return _this.renderTime;
1959
2086
  };
1960
- this.clickmap = (activity) => {
1961
- if (this.state === null) {
1962
- throw new Error(`Initialize heatmap by calling "html" or "setup" prior to making this call.`);
2087
+ this.clickmap = function (activity) {
2088
+ if (_this.state === null) {
2089
+ throw new Error("Initialize heatmap by calling \"html\" or \"setup\" prior to making this call.");
1963
2090
  }
1964
- this.heatmap.click(activity);
2091
+ _this.heatmap.click(activity);
1965
2092
  };
1966
- this.clearmap = () => {
1967
- if (this.state === null) {
1968
- throw new Error(`Initialize heatmap by calling "html" or "setup" prior to making this call.`);
2093
+ this.clearmap = function () {
2094
+ if (_this.state === null) {
2095
+ throw new Error("Initialize heatmap by calling \"html\" or \"setup\" prior to making this call.");
1969
2096
  }
1970
- this.heatmap.clear();
2097
+ _this.heatmap.clear();
1971
2098
  };
1972
- this.scrollmap = (scrollData, avgFold, addMarkers) => {
1973
- if (this.state === null) {
1974
- throw new Error(`Initialize heatmap by calling "html" or "setup" prior to making this call.`);
2099
+ this.scrollmap = function (scrollData, avgFold, addMarkers) {
2100
+ if (_this.state === null) {
2101
+ throw new Error("Initialize heatmap by calling \"html\" or \"setup\" prior to making this call.");
1975
2102
  }
1976
- this.heatmap.scroll(scrollData, avgFold, addMarkers);
2103
+ _this.heatmap.scroll(scrollData, avgFold, addMarkers);
1977
2104
  };
1978
- this.merge = (decoded) => {
1979
- let merged = { timestamp: null, envelope: null, dom: null, events: [] };
2105
+ this.merge = function (decoded) {
2106
+ var merged = { timestamp: null, envelope: null, dom: null, events: [] };
1980
2107
  // Re-arrange decoded payloads in the order of their start time
1981
- decoded = decoded.sort(this.sortPayloads);
2108
+ decoded = decoded.sort(_this.sortPayloads);
1982
2109
  // Re-initialize enrich class if someone ends up calling merge function directly
1983
- this.enrich = this.enrich || new EnrichHelper();
1984
- this.enrich.reset();
2110
+ _this.enrich = _this.enrich || new EnrichHelper();
2111
+ _this.enrich.reset();
1985
2112
  // Walk through payloads and generate merged payload from an array of decoded payloads
1986
- for (let payload of decoded) {
2113
+ for (var _i = 0, decoded_1 = decoded; _i < decoded_1.length; _i++) {
2114
+ var payload = decoded_1[_i];
1987
2115
  merged.timestamp = merged.timestamp ? merged.timestamp : payload.timestamp;
1988
2116
  merged.envelope = payload.envelope;
1989
- for (let key of Object.keys(payload)) {
1990
- let p = payload[key];
2117
+ for (var _a = 0, _b = Object.keys(payload); _a < _b.length; _a++) {
2118
+ var key = _b[_a];
2119
+ var p = payload[key];
1991
2120
  if (Array.isArray(p)) {
1992
- for (let entry of p) {
2121
+ for (var _c = 0, p_1 = p; _c < p_1.length; _c++) {
2122
+ var entry = p_1[_c];
1993
2123
  switch (key) {
1994
2124
  case "dom" /* Constant.Dom */:
1995
- let dom = this.enrich.selectors(entry);
2125
+ var dom = _this.enrich.selectors(entry);
1996
2126
  if (entry.event === 5 /* Data.Event.Discover */) {
1997
2127
  merged.dom = dom;
1998
2128
  }
@@ -2008,54 +2138,61 @@ class Visualizer {
2008
2138
  }
2009
2139
  }
2010
2140
  }
2011
- merged.events = merged.events.sort(this.sortEvents);
2141
+ merged.events = merged.events.sort(_this.sortEvents);
2012
2142
  return merged;
2013
2143
  };
2014
- this.setup = (target, options) => __awaiter(this, void 0, void 0, function* () {
2015
- this.reset();
2016
- // Infer options
2017
- options.pointer = "pointer" in options ? options.pointer : true;
2018
- options.canvas = "canvas" in options ? options.canvas : true;
2019
- options.keyframes = "keyframes" in options ? options.keyframes : false;
2020
- // Set visualization state
2021
- this._state = { window: target, options };
2022
- // Initialize helpers
2023
- this.enrich = new EnrichHelper();
2024
- this.data = new DataHelper(this.state);
2025
- this.layout = new LayoutHelper(this.state, options.mobile, options.vNext, options.locale);
2026
- this.heatmap = new HeatmapHelper(this.state, this.layout);
2027
- this.interaction = new InteractionHelper(this.state, this.layout, options.vNext);
2028
- // If discover event was passed, render it now
2029
- if (options.dom) {
2030
- yield this.layout.dom(options.dom, options.useproxy);
2031
- }
2032
- return this;
2033
- });
2034
- this.render = (events) => {
2144
+ this.setup = function (target, options) { return __awaiter(_this, void 0, void 0, function () {
2145
+ return __generator(this, function (_a) {
2146
+ switch (_a.label) {
2147
+ case 0:
2148
+ this.reset();
2149
+ // Infer options
2150
+ options.pointer = "pointer" in options ? options.pointer : true;
2151
+ options.canvas = "canvas" in options ? options.canvas : true;
2152
+ options.keyframes = "keyframes" in options ? options.keyframes : false;
2153
+ // Set visualization state
2154
+ this._state = { window: target, options: options };
2155
+ // Initialize helpers
2156
+ this.enrich = new EnrichHelper();
2157
+ this.data = new DataHelper(this.state);
2158
+ this.layout = new LayoutHelper(this.state, options.mobile, options.vNext, options.locale);
2159
+ this.heatmap = new HeatmapHelper(this.state, this.layout);
2160
+ this.interaction = new InteractionHelper(this.state, this.layout, options.vNext);
2161
+ if (!options.dom) return [3 /*break*/, 2];
2162
+ return [4 /*yield*/, this.layout.dom(options.dom, options.useproxy)];
2163
+ case 1:
2164
+ _a.sent();
2165
+ _a.label = 2;
2166
+ case 2: return [2 /*return*/, this];
2167
+ }
2168
+ });
2169
+ }); };
2170
+ this.render = function (events) {
2035
2171
  var _a, _b;
2036
- if (this.state === null) {
2037
- throw new Error(`Initialize visualization by calling "setup" prior to making this call.`);
2172
+ if (_this.state === null) {
2173
+ throw new Error("Initialize visualization by calling \"setup\" prior to making this call.");
2038
2174
  }
2039
- let time = 0;
2040
- for (const entry of events) {
2175
+ var time = 0;
2176
+ for (var _i = 0, events_1 = events; _i < events_1.length; _i++) {
2177
+ var entry = events_1[_i];
2041
2178
  try {
2042
2179
  time = entry.time;
2043
- this.interaction.clearOldClickVisualizations(time);
2180
+ _this.interaction.clearOldClickVisualizations(time);
2044
2181
  switch (entry.event) {
2045
2182
  case 0 /* Data.Event.Metric */:
2046
- this.data.metric(entry);
2183
+ _this.data.metric(entry);
2047
2184
  break;
2048
2185
  case 1 /* Data.Event.Dimension */:
2049
2186
  if (entry.data[37 /* Dimension.InteractionNextPaint */]) {
2050
- this.data.metric(entry);
2187
+ _this.data.metric(entry);
2051
2188
  }
2052
2189
  break;
2053
2190
  case 7 /* Data.Event.Region */:
2054
- this.data.region(entry);
2191
+ _this.data.region(entry);
2055
2192
  break;
2056
2193
  case 6 /* Data.Event.Mutation */:
2057
2194
  case 43 /* Data.Event.Snapshot */:
2058
- this.layout.markup(entry);
2195
+ _this.layout.markup(entry);
2059
2196
  break;
2060
2197
  case 13 /* Data.Event.MouseDown */:
2061
2198
  case 14 /* Data.Event.MouseUp */:
@@ -2067,67 +2204,73 @@ class Visualizer {
2067
2204
  case 20 /* Data.Event.TouchCancel */:
2068
2205
  case 18 /* Data.Event.TouchEnd */:
2069
2206
  case 19 /* Data.Event.TouchMove */:
2070
- this.interaction.pointer(entry);
2207
+ _this.interaction.pointer(entry);
2071
2208
  break;
2072
2209
  case 28 /* Data.Event.Visibility */:
2073
- this.interaction.visibility(entry);
2210
+ _this.interaction.visibility(entry);
2074
2211
  break;
2075
2212
  case 27 /* Data.Event.Input */:
2076
- this.interaction.input(entry);
2213
+ _this.interaction.input(entry);
2077
2214
  break;
2078
2215
  case 21 /* Data.Event.Selection */:
2079
- this.interaction.selection(entry);
2216
+ _this.interaction.selection(entry);
2080
2217
  break;
2081
2218
  case 11 /* Data.Event.Resize */:
2082
- this.interaction.resize(entry);
2219
+ _this.interaction.resize(entry);
2083
2220
  break;
2084
2221
  case 10 /* Data.Event.Scroll */:
2085
- this.interaction.scroll(entry);
2222
+ _this.interaction.scroll(entry);
2086
2223
  break;
2087
2224
  case 45 /* Data.Event.StyleSheetAdoption */:
2088
2225
  case 46 /* Data.Event.StyleSheetUpdate */:
2089
- this.layout.styleChange(entry);
2226
+ _this.layout.styleChange(entry);
2090
2227
  break;
2091
2228
  case 44 /* Data.Event.Animation */:
2092
- this.layout.animateChange(entry);
2229
+ _this.layout.animateChange(entry);
2093
2230
  break;
2094
2231
  case 51 /* Data.Event.CustomElement */:
2095
- this.layout.customElement(entry);
2232
+ _this.layout.customElement(entry);
2096
2233
  break;
2097
2234
  }
2098
2235
  }
2099
2236
  catch (e) {
2100
- (_b = (_a = this._state.options).logerror) === null || _b === void 0 ? void 0 : _b.call(_a, e);
2237
+ (_b = (_a = _this._state.options).logerror) === null || _b === void 0 ? void 0 : _b.call(_a, e);
2101
2238
  }
2102
2239
  }
2103
2240
  if (events.length > 0) {
2104
2241
  // Update pointer trail at the end of every frame
2105
- this.interaction.trail(time);
2242
+ _this.interaction.trail(time);
2106
2243
  }
2107
2244
  };
2108
- this.reset = () => {
2245
+ this.reset = function () {
2109
2246
  var _a, _b, _c, _d, _e;
2110
- (_a = this.data) === null || _a === void 0 ? void 0 : _a.reset();
2111
- (_b = this.interaction) === null || _b === void 0 ? void 0 : _b.reset();
2112
- (_c = this.layout) === null || _c === void 0 ? void 0 : _c.reset();
2113
- (_d = this.heatmap) === null || _d === void 0 ? void 0 : _d.reset();
2114
- (_e = this.enrich) === null || _e === void 0 ? void 0 : _e.reset();
2115
- this._state = null;
2116
- this.renderTime = 0;
2117
- };
2118
- this.sortEvents = (a, b) => {
2247
+ (_a = _this.data) === null || _a === void 0 ? void 0 : _a.reset();
2248
+ (_b = _this.interaction) === null || _b === void 0 ? void 0 : _b.reset();
2249
+ (_c = _this.layout) === null || _c === void 0 ? void 0 : _c.reset();
2250
+ (_d = _this.heatmap) === null || _d === void 0 ? void 0 : _d.reset();
2251
+ (_e = _this.enrich) === null || _e === void 0 ? void 0 : _e.reset();
2252
+ _this._state = null;
2253
+ _this.renderTime = 0;
2254
+ };
2255
+ this.sortEvents = function (a, b) {
2119
2256
  return a.time - b.time;
2120
2257
  };
2121
- this.sortPayloads = (a, b) => {
2258
+ this.sortPayloads = function (a, b) {
2122
2259
  return a.envelope.sequence - b.envelope.sequence;
2123
2260
  };
2124
2261
  }
2125
- get state() {
2126
- return this._state;
2127
- }
2128
- }
2262
+ Object.defineProperty(Visualizer.prototype, "state", {
2263
+ get: function () {
2264
+ return this._state;
2265
+ },
2266
+ enumerable: false,
2267
+ configurable: true
2268
+ });
2269
+ return Visualizer;
2270
+ }());
2129
2271
 
2130
- const { state, dom, get, html, time, clickmap, clearmap, scrollmap, merge, setup, render } = new Visualizer();
2272
+ var _a;
2273
+ var state = (_a = new Visualizer(), _a.state), dom = _a.dom, get = _a.get, html = _a.html, time = _a.time, clickmap = _a.clickmap, clearmap = _a.clearmap, scrollmap = _a.scrollmap, merge = _a.merge, setup = _a.setup, render = _a.render;
2131
2274
 
2132
2275
  var clarity = /*#__PURE__*/Object.freeze({
2133
2276
  __proto__: null,